@import url("libs/reset.css");
@import url("font.css");

/* common */
.main_page img { vertical-align:top; }
.main_page  { overflow-x:hidden; }
.main_page a { text-decoration:none; color:#666; }
.main_page h2 { text-align:center; font-family:"SamsungIF_Bd", arial, sans-serif; font-size:50px; line-height:110%; }
.main_page  { width:100%; height:100%; font-family:"SamsungIF_Rg", arial, sans-serif; font-size:12px; color:#666; }
.main_page .centerBox { width:1280px; margin:0 auto; }
.main_page .dpNone { display:none; }


#cloud { position:relative; width:1280px; margin:0 auto; }

/* keyVisual */
#cloud #keyVisual { position:relative; overflow:hidden; width:1280px; height:830px; }
#cloud .obfWrap { position:absolute; width:3840px; }
#cloud .visual { float:left; }
#cloud #visual_1 .bg_1 { position:absolute; width:1280px; height:830px; background:url('../img/cloud/keyVisual1_1.jpg') no-repeat; display:none; }
#cloud #visual_2 .bg_1 { position:absolute; width:1280px; height:830px; background:url('../img/cloud/keyVisual2_1.jpg') no-repeat; display:none; }
#cloud #visual_3 .bg_1 { position:absolute; width:1280px; height:830px; background:url('../img/cloud/keyVisual3_1.jpg') no-repeat; display:none; }
#cloud .title { position:relative; height:200px; background:url("../img/cloud/bg_h2.png") no-repeat center 88px; }
#cloud .titleWrap { position:relative; top:150px; height:113px; overflow:hidden; }
#cloud .titleWrap .titleWrap-body { position:relative; height:100%; }
#cloud .titleWrap .titleWrap-body h2 { width:100%; color:#333; }
#cloud .bullet { position:absolute; width:100%; left:0; bottom:30px; text-align:center; }
#cloud .bullet li { display:inline; }

/* situation */
#cloud #situation { width:100%; position:relative; background:#fff;}
#cloud #situation h3 { margin-bottom:15px; font-size:22px; font-family:"SamsungIF_Bd", arial, sans-serif;}
#cloud .situBox{width:100%; position:relative;}
#cloud .situBox:after{content:""; display:block; clear:both;}
#cloud .situBox > div{float:left; margin:0 5px 0 0;}
#cloud .situBox > div.situ3{margin-right:0;}
#cloud .situBox a{overflow:hidden; float:left;}
#cloud .situBox a:hover img{margin:-4px;}
#cloud .situBox .active a img{margin:-4px;}
#cloud #situation-movie-wrap { position:relative; left:0px; width:1280px; border-top:1px solid #fff; border-bottom:1px solid #fff; background:#0376D7; height:0px; display:none; }
#cloud #situation-movie-wrap h3 { color:#fff; }
#cloud #situation-movie-wrap .situBox a:hover{border:4px solid #fff;}
#cloud #situation-movie-wrap .situBox .active a{overflow:hidden; float:left; border:4px solid #fff;}
#cloud #situation-movie { width:980px; padding:40px 150px; margin:0 auto; overflow:hidden; background:#0376D7; }
#cloud #situation-movie .situMovie { position:relative; width:980px; height:525px; margin-bottom:20px; overflow:hidden; }
#cloud #situation-normal-wrap { position:relative; width:1280px; background:#fff; }
#cloud #situation-normal-wrap h3 { color:#333; }
#cloud #situation-normal-wrap .situBox a:hover { border:4px solid #0376D7; }
#cloud #situation-normal-wrap .situBox .active a { overflow:hidden; float:left; border:4px solid #0376D7; }
#cloud #situation-normal { width:980px; padding:40px 150px; margin:0 auto; overflow:hidden; background:#fff; }
#cloud #situation-plus { position:absolute; left:1092px; top:0px; height:58px; cursor:pointer; }
#cloud #situation-plus a { display:block; }
#cloud .situMovie{margin-bottom:20px; position:relative; width: 980px; height: 525px; top:0;}
#cloud .situMovie .situMovie1{background:url("../img/cloud/bg_situ01.jpg") no-repeat 0 0; position:absolute;}
#cloud .situMovie .situMovie2{background:url("../img/cloud/bg_situ02.jpg") no-repeat 0 0; position:absolute;}
#cloud .situMovie .situMovie3{background:url("../img/cloud/bg_situ03.jpg") no-repeat 0 0; position:absolute;}
#cloud .situMovie > div{width:980px; height:525px; position:relative; margin:0 auto; letter-spacing:0;}
#cloud .situMovie > div h4{font-size:32px; font-family:"SamsungIF_Bd", arial, sans-serif;}
#cloud .situMovie > div p{font-size:16px; line-height:20px;}
#cloud .situMovie > div p.converting{position:absolute; bottom:0;}
#cloud .situMovie > div p.play{position:absolute; left:388px; top:205px;}
#cloud .situMovie > div.right p.play{position:absolute; left:428px; top:205px;}
#cloud .situMovie > div.left h4{padding:45px 0 20px 40px; font-size:32px; line-height:35px; letter-spacing:-1px; font-family:"SamsungIF_Bd", arial, sans-serif;}
#cloud .situMovie > div.left p{padding-left:40px;}
#cloud .situMovie > div.left p.converting{left:40px; padding:0;}
#cloud .situMovie > div.right h4{text-align:right; padding:45px 40px 20px 0; font-size:32px; line-height:35px; letter-spacing:-1px; font-family:"SamsungIF_Bd", arial, sans-serif;}
#cloud .situMovie > div.right p{text-align:right; padding-right:40px;}
#cloud .situMovie > div.right p.converting{right:40px; padding:0;}
#cloud .situMovie > div.black{color:#333;}
#cloud .situMovie > div.white{color:#fff;}

/* howToUse */
#cloud #howToUse { width:100%; height:780px; position:relative; border-bottom:1px solid #0376D7; background:url("../img/cloud/bg_how.png") no-repeat center 0;}
#cloud #howToUse h2 { position:absolute; top:70px; left:0; width:180px; height:40px; float:left; margin-left:4px; background:url("../img/cloud/bg_howUl3.png") no-repeat; z-index:100; }
#cloud #howToUse h2:first-child { margin-left:0; }
#cloud #howToUse h2 a { display:block; width:180px; height:40px; }
#cloud #howToUse h2 a span{ visibility:hidden; }
#cloud #howToUse h2.h2_1 { left:150px; width:600px; background-position:0 0; }
#cloud #howToUse h2.h2_2 { left:334px; width:190px; background-position:-184px 0; }
#cloud #howToUse h2.h2_2 a { width:190px; }
#cloud #howToUse h2.active{ background:url("../img/cloud/bg_howUl3_active.png") no-repeat; }
#cloud #howToUse h2.active.h2_1 { background-position:0 0; }
#cloud #howToUse h2.active.h2_2 { background-position:-184px 0; }
#cloud .use { width:600px; height:40px; overflow:hidden; padding:70px 0 0 150px; z-index:10; visibility:hidden; }
#cloud .use li { width:180px; height:40px; float:left; margin-left:4px; }
#cloud .use li:first-child{ margin-left:0; }
#cloud .use li a { display:block; width:100%; height:40px; }
#cloud .use li a span{ visibility:hidden; }
#cloud .use .li2{width:190px;}
#cloud .use .li1.active{ background:url("../img/cloud/bg_howUl3_active.png") no-repeat 0 0; }
#cloud .use .li2.active{ background:url("../img/cloud/bg_howUl3_active.png") no-repeat -184px 0; }
#cloud .useContents { width:980px; height:780px; padding:0 150px; position:relative; margin:0 auto; display:none; }
#cloud .useContents .useStep span a { }
#cloud .useText { width:500px; padding-top:140px; }
#cloud .useText h3 { margin-bottom:80px; color:#fff; font-size:42px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .useText .useStep { margin-bottom:15px; font-size:36px; color:#fff; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .useText .useStep img { vertical-align:bottom;}
#cloud .useText p { font-size:16px; color:#fff; margin-bottom:40px;}
#cloud .useText .view { width:192px; border:3px solid #fff; background:#0376D7; padding:3px 0; text-align:center; font-size:16px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .useText .view a { display:block; width:192px; color:#fff; }
#cloud .use1-1 .useText .view, #cloud .use1-2 .useText .view, #cloud .use1-3 .useText .view{margin-bottom:35px;}
#cloud .useContents .useText .stepUl{width:338px; height:52px; overflow:hidden; margin-top:0; background:url("../img/cloud/bg_stepUl.png") no-repeat 0 0;}
#cloud .useContents .useText .stepUl li{float:left; width:56px; padding-top:34px; font-size:10px; color:#fff; text-align:center;}
#cloud .step{position:absolute; left:657px; top:214px;}
#cloud .step.padding{padding-left:83px;}
#cloud .use1-1 .step .img3{padding-left:70px;}
#cloud .use1-1 .step .img4{padding-left:101px;}
#cloud .use1-1 .step .img5{padding-left:107px;}
#cloud .use1-3 .step > div{padding-left:83px;}
#cloud .use1-3 .step > div.img6{padding:6px 0 0 0;}
#cloud .use2-3 .step > div{padding-left:83px;}
#cloud .use2-3 .step > div.img7{padding:7px 0 0 0;}
#cloud .view{width:192px; border:3px solid #fff; background:#037ADE; padding:3px 0; text-align:center; font-size:16px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .view a{display:block; width:192px; color:#fff;}
#cloud .comment{position:absolute; top:730px; right:15px; color:#000; text-align:right; text-decoration:underline; z-index:90; }

#cloud #howToUse .motionWrap { position:absolute; overflow:hidden; bottom:0; right:0; width:700px; height:560px; }
#cloud #howToUse .motion { position:absolute; width:700px; height:600px; }
#cloud #howToUse .motion > div { position:absolute; }
#cloud #howToUse .motion1 { position:relative; }
#cloud #howToUse .motion2.next { left:600px; top:0; }
#cloud #howToUse .motion1 .phone { left:200px; width:338px; height:451px; background:url("../img/common/phone.png") no-repeat 0 0; display:none; }
#cloud #howToUse .motion1 .scene { position:relative; left:13px; top:40px; width:205px; height:359px; background:#000; }
#cloud #howToUse .motion1 .scene_current { position:relative; }
#cloud #howToUse .motion1 .scene_next { position:absolute; left:0px; top:0px; display:none; }
#cloud #howToUse .motion1 .hand { top:210px; left:115px; display:none; }
#cloud #howToUse .motion2 .use1-1-1 > div { position:absolute; }
#cloud #howToUse .motion2 .use1-1-1 .hand { display:none; }
#cloud #howToUse .motion2 .use1-1-2 > div { position:absolute; }
#cloud #howToUse .motion2 .use1-1-2 .hand { display:none; }
#cloud #howToUse .motion2 .use1-3-6 { position:absolute; width:550px; height:560px; }
#cloud #howToUse .motion2 .use1-3-6 > div { position:absolute; }
#cloud #howToUse .motion2 .use1-3-6 .print { top:40px; left:220px; }
#cloud #howToUse .motion2 .use1-3-6 .report { top:40px; left:220px; }
#cloud #howToUse .motion2 .use1-3-6 .report .cover { position:absolute; }
#cloud #howToUse .motion2 .use1-3-6 .report .paper { position:absolute;  top:100px; left:50px; }
#cloud #howToUse .motion2 .use2-1-1 > div { position:absolute; }
#cloud #howToUse .motion2 .use2-1-1 .hand { display:none; }
#cloud #howToUse .motion2 .use2-1-2 > div { position:absolute; }
#cloud #howToUse .motion2 .use2-1-2 .hand { display:none; }
#cloud #howToUse .motion2 .use2-3-7 { position:absolute; width:550px; height:560px; }
#cloud #howToUse .motion2 .use2-3-7 > div { position:absolute; }
#cloud #howToUse .motion2 .use2-3-7 .print { top:40px; left:220px; }
#cloud #howToUse .motion2 .use2-3-7 .report { top:40px; left:220px; }
#cloud #howToUse .motion2 .use2-3-7 .report .cover { position:absolute; }
#cloud #howToUse .motion2 .use2-3-7 .report .paper { position:absolute;  top:100px; left:50px; }
#cloud #howToUse .usePointer { position:absolute; left:0px; top:0px; cursor:pointer; width: 70px; height: 70px; overflow:hidden;  }
#cloud #howToUse .usePointer div {position:relative;}
#cloud #howToUse .usePointer img { width:70px; height:70px; }
#cloud .popupBg1 { display:none; position:absolute; opacity:0.7; top:0px; left:0px; width:100%; height:780px; background:#000000; z-index:100; }
#cloud .popupWrap1{ position:absolute; left:0; top:0; width:100%; height:780px; z-index:105; }
#cloud #popup1 { position:relative; }
#cloud #popup1 #popupContainer1 { position:relative; width:980px; height:680px; left:150px; top:80px; }
#cloud #popup1 .close1 { position:absolute; left:1152px; top:50px; }

/* more */
#cloud #more { position:relative; width:1280px; }
#cloud .whatIsWrap { position:relative; left:0px; width:1280px; border-top:1px solid #fff; background:#037ADE; height:0px; display:none; }
#cloud .whatIs{width:980px; position:relative; margin:0 auto; padding:75px 0; color:#fff; }
#cloud .whatIs h3{font-size:42px; text-decoration:underline; padding:0 0 20px 0; letter-spacing:-2px; font-family: "SamsungIF_Bd", arial, sans-serif; }
#cloud .whatIs h4{font-size:26px; margin-bottom:15px; line-height:28px; font-family: "SamsungIF_Bd", arial, sans-serif; }
#cloud .whatIs p{font-size:16px; line-height:20px;}
#cloud .whatIs .iconWrap{overflow:hidden;}
#cloud .whatIs .iconWrap .icon{width:80px; height:83px; float:left; margin:0 18px 10px 0; background:url("../img/cloud/bg_icon.png") no-repeat 0 3px;}
#cloud .whatIs p.whatIcon{margin-bottom:15px;}
#cloud .whatIs p.blue{margin-bottom:30px;}
#cloud .whatIs p.img{position:absolute; right:0; bottom:0;}
#cloud .whatIs .go{width:257px; border:3px solid #fff; background:#037ADE; margin-bottom:45px; padding:2px 0; text-align:center; font-size:18px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .whatIs .go a{display:block; width:257px; color:#fff;}
#cloud .learnMoreWrap { position:relative; width:1280px; background:#fff; }
#cloud .learnMore { position:relative; padding:40px 0 50px 150px; }
#cloud .learnMore h3{font-size:22px; color:#333; margin-bottom:10px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .learnMore p{font-size:16px; color:#777; margin-bottom:10px;}
#cloud .learnMore p.more { width:192px; border:3px solid #0376D7; background:#fff; margin-bottom:15px; padding:2px 0; text-align:center; font-size:16px; font-family: "SamsungIF_Bd", arial, sans-serif;}
#cloud .learnMore p.more a { display:block; width:192px; color:#0376D7;}
#cloud #more-plus { position:absolute; left:1092px; top:0px; height:58px; cursor:pointer; }
#cloud #more-plus a { display:block; }
#cloud .useContents .caution{font-size:13px; margin-bottom:15px;}