@charset "utf-8";
/*    Reset CSS  */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td
{ margin:0;  padding:0;}
body { font-family: 'Arial', 'SamsungIFRg', 'PFSquareSansProRegular', 'sans-serif'; font-size:12pt; line-height:20px; background:#fff; color:#010101; }
table {border-collapse:collapse; border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,var {font-style:normal; font-weight:normal; }
ol,ul {list-style: none; }
caption,th { text-align:left;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight:normal; font-family:'Samsung InterFace', SamsungIFBd, Arial,; }
q:before,q:after {content:"";}
abbr, acronym {border:0;}
a{text-decoration:none; color:#010101; font-size:12px; font-family:Arial, 'Samsung InterFace', SamsungIFBd; }
em { font-style:normal; }
.h { display:none; }



/*body { background:url(../img/tttt.png) 50% 50%; }*/

/*-- common --*/

.mask { width:122px; height:100px; position:absolute; display:none; }
.active { color:#007CC0;}
.wrap { width:960px;  margin:0 auto; }
.showConWrap { width:960px;  height:600px; position:relative; margin-top:40px; }
.showCon { width:960px; position:relative; margin:30px auto 0 auto; }
.naviWrap { width:296px; position:absolute; top:0px; left:0px; }
.naviWrap h2 { position:absolute; top:0; left:0; font-size:24px; font-weight:bold; margin-bottom:10px;   font-family:'Samsung InterFace','SamsungIFBd', 'PFSquareSansProMedium', 'Arial', 'sans-serif'; color:#000000; line-height:25px;}
.naviWrap .navi { width:296px; position:absolute; top:51px; left:0;; }

.vidNavi { }
.vidNavi>li { margin-bottom:10px; }
.vidNavi>li>a{ font-size:16px; font-weight:bold; padding-bottom:10px; position:relative; top:-7px; font-family:Arial, 'Samsung InterFace', SamsungIFBd;}

.vidNavi ul.orin { list-style:decimal inside; font-size:12px; margin-top:3px; }
/*.vidNavi ul.orin a { display:inline-block; width:267px; vertical-align:text-top; margin:-3px 0 3px 3px;}*/
.vidNavi ul.orin a.active { color:#007CC0; }
.vidNavi ul.orin a:hover { color:#007CC0; text-decoration:underline; }

.on { display:block!important; }

.vidWrap { width:560px; height:600px; position:absolute;  top:0px; right:54px; }
.showVid { width:560px; height:600px;  position:absolute; top:0px; right:0px; }
.showVid p { width:550px; height:20px; position:absolute; bottom:5px; right:-200px; text-align:center; }
.showVid div.horizon { width:550px; height:20px; position:absolute; bottom:90px; right:-200px; text-align:center; }
.bgPhone { width:286px; height:538px; overflow:hidden; background-image:url(../img/bgPhone.gif); position:absolute; left:150px; top:0px; }
.bgPhone2 { width:538px; height:286px; overflow:hidden; background-image:url(../img/bgPhone2.gif); position:absolute; right:-12px; top:130px; }
.conVid { width:240px; height:427px; border:2px solid #aaa; position:absolute; top:5600px; left:21px; overflow:hidden; }
.conVidFV { width:240px; height:427px; border:2px solid #aaa; position:absolute; top:56px; left:21px; overflow:hidden; top:56px !important; }
.mask2 { width:427px; height:240px; position:absolute; top:23px; left:60px; oveflow:hidden; background:url(../img/bgMask2.png); background-repeat:repeated; z-index:999; display:none;}
.mask3 { width:240px; height:427px; position:absolute; top:58px; left:23px; oveflow:hidden; background:url(../img/bgMask2.png); background-repeat:repeated; z-index:999; display:none;}
.conVid h3 { width:50px; height:50px; position:absolute; top:-1000px; left:-1000px;}
.conVid2 { width:427px; height:240px; border:2px solid #aaa; position:absolute; top:2100px; left:58px; overflow:hidden; }
.conVid2 h3 { width:50px; height:50px; position:absolute; top:-1000px; left:-1000px;}
.conVid.vidOri { top:56px; }
.conVid2.vidOri { top:21px; }
/*.vidOri { display:block; }*/
.finger { position:absolute; width:125px; height:175px; background:url(../img/finger.png); bottom:-200px; right:-200px; z-index:10; }
.imgSlide { width:240px; height:427px; position:absolute; bottom:-430px; left:0px; z-index:4;}
.imgSlide2 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:5; display:none;}
.imgSlide2_1 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:6; display:none;}
.imgSlide2_2 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:7; display:none;}
.imgSlide3 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:5; display:none;}
.imgSlide4 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:13; display:none;}
.imgSlide41 { width:240px; height:427px; position:absolute; bottom:0px; left:0px; z-index:28; display:none;}
.imgSlide5 { width:427px; height:75px; position:absolute; bottom:-100px; left:0px; z-index:5; }
.imgSlide6 { width:427px; height:75px; position:absolute; bottom:0px; left:0px; z-index:6; display:none;}
.imgSlide7 { width:427px; height:240px; position:absolute; bottom:0px; left:0px; z-index:6; display:none;}
.imgSlide8 { width:427px; height:240px; position:absolute; bottom:0px; left:0px; z-index:7; display:none;}
.display1 { width:427px; height:240px; position:relative; bottom:0px; left:0px; z-index:7; overflow:hidden;}
.player { width:427px; height:63px; position:absolute; bottom:0px; left:0px; z-index:10; }
.noR { margin-right:0px!important;}
.btnIntro { display:block; width:147px; height:30px; margin-top:14px;}
.btnTrigger { width:40px; height:40px; position:absolute; top:-1000px; left:-1000px; }




/*-- index --*/

#index {}
#index .frame { width:960px; height:590px; margin:0 auto; }
#indexPicList { position:absolute; width:960px; top: 625px; height:300px; }
#indexPicList h1 { font-family:'Arial','SamsungIFBd', 'PFSquareSansProMedium', 'sans-serif'; font-size:16px; color:#000000; font-weight:normal; margin-bottom:14px; font-weight:bold; }
#indexPicList h2 { position:absolute; visibility:hidden; }
#indexPicList ul { width:996px; overflow:hidden; margin-left:-36px;}
#indexPicList ul li { float:left; margin:0 0 20px 36px; }
#indexPicList ul li>* { display:block; border:#ffffff 2px solid; }
#indexPicList ul li a.active2 { border-color: #007cc0; }
#indexPicList ul li a img { display:block; width:159px; height:88px; }
#indexPicList ul li span { font-size:12px; line-height:1.1; font-weight:bold; color:#007cc0; margin-top:8px; display:block; }


/*-- contents --*/

.movie { width:713px; height:240px; position:absolute; background:url(../img/sp2.jpg); bottom:0px; right:0px; z-index:8; }
.focused { width:50px; height:50px; position:absolute; z-index:50; display:none; cursor:pointer;}
.eqa { width:200px; height:79px; position:absolute; z-index:55; display:block; cursor:pointer; top:51px; left:110px;}
.focused2 { width:50px; height:50px; position:absolute; z-index:50;  display:none; overflow:hidden;}

.textBubble { width:186px; min-height:30px; position:absolute;  z-index:41; display:none;}
.bubbleTop { width:186px; height:6px; background:url(../img/bgBubbleTop.png); overflow:hidden; }
.bubbleBottom { width:186px; height:6px; background:url(../img/bgBubbleBottom.png); overflow:hidden; }
.bubbleBody { width:176px; background:url(../img/bgBubbleBody.png); background-repeat:repeat-y;  padding:2px 5px; text-align:center;  font-size:13px; line-height:1.2; font-weight:bold; }

.layer1 { width:134px; height:142px; position:absolute; top:28px; right:275px; display:none; background:url(../img/dc04.png); background-position:0px -142px; overflow:hidden; }
.layer01 { width:134px; height:142px; position:absolute; top:28px; right:275px; display:none; background:url(../img/dc044.png);  }
.layerOn { background-position:-1px 0px;}
.layer2 { width:134px; height:142px; position:absolute; top:28px; right:275px; display:none;}
.layer02 { width:134px; height:142px; position:absolute; top:28px; right:275px; display:none;}
.layer3 { width:150px; height:159px; position:absolute; top:4px; right:81px; display:none;}

.introBox { width:960px; position:absolute; top:0px; left:0px; z-index:14; }
.leftBox { width:296px; float:left;}
.leftBox h2 { font-size:24px; font-weight:bold; margin-bottom:10px;   font-family:'Samsung InterFace','SamsungIFBd', 'PFSquareSansProMedium', 'Arial', 'sans-serif'; color:#000000; line-height:25px;}
.in1 { margin-top:21px; margin-bottom:24px; padding-bottom:25px; border-bottom:1px solid #ccc; line-height:1.4; font-size:14px; color:#000000; }
.in2 { margin-bottom:24px; line-height:20px; font-size:12px; color:#000000;}
.in2 img { position:relative; top:2px;}
.in2 h3 {font-size:14px; font-weight:bold; margin-bottom:3px; color:#000000;}
.in2 p { height:28px;}
/*.imgBox { width:560px; height:540px;  float:right;  text-align:center; position:relative; }*/
.imgBox { width:560px; height:540px; right:41px; position:absolute; text-align:center; }
.dcIntro { margin-top:120px;}
.btnTry { margin-top:13px; height:32px; margin-bottom:-2px;}
.exac { line-height:20px!important;}
.in1.noline { border-width:0; padding-bottom:0; margin-bottom:25px; }

.unitBox { width:150px; height:100px; position:absolute; }
.dcLayer { width:427px; height:240px; position:absolute; top:0px; left:0px;z-index:4; display:none; }
.dcLayer2 { width:427px; height:240px; position:absolute; top:0px; left:0px;z-index:5; display:none; }

.imgSlidePop { width:190px; height:131px; border:2px solid #fff; overflow:hidden; position:absolute; z-index:7; top:140px; left:23px; display:none;}
.popCon { width:190px; height:131px; position:absolute; top:0px; left:0px; z-index:7;}
.popCon2 { width:190px; height:131px; position:absolute; top:0px; left:190px; z-index:8;}

.focused3_1 { z-index:60!important;}
.focused3_2 { z-index:65!important;}

.reflection { width:240px; height:427px; position:absolute; top:0px; left:0px; z-index:40;}

.barBox { width:170px; height:4px; border:1px solid #ccc; overflow:hidden; position:absolute; top:138px; left:111px;}
.barBox p { width:170px; height:3px; background-color:orange; position:absolute; top:0px; left:-170px; }
.countBox { width:13px; height:13px;  color:#fff; position:absolute; top:130px; right:124px; font-size:12px; font-weight:bold;}
/*.countBox ul { width:13px; height:117px; position:absolute; top:0px; left:0px; }
.countBox ul li {width:13px; height:13px; line-height:1; }*/
.countBox2 { font-size:12px; font-weight:bold; color:#fff; width:100px; height:14px; position:absolute; top:130px; left:300px;  }
*:first-child+html .countBox ul li { margin-bottom:-2px; } /* IE7 Hack */

.head { width:270px; height:319px; position:absolute; z-index:13; bottom:61px; left:94px; overflow:hidden; background:url(../img/head.png); background-position:0px 0px;}
.headOn { background-position:0px -319px;}
.headOn2 { background-position:0px -638px;}

.scrolling { width:240px; height:427px; position:relative; overflow:hidden;}
.scrolling img { width:240px; height:733px; position:absolute; top:0px; left:0px; }

.hand { width:130px; height:253px; position:absolute; top:140px; left:70px; overflow:hidden;}
.hand1 { width:130px; height:253px; position:absolute; top:0px; left:0px;}
.hand2 { width:130px; height:253px; position:absolute; top:0px; left:0px; display:none;}


.focused00 { width:50px; height:50px; position:absolute; z-index:50; display:block; }
.focused00>a { display:block; width:50px; height:50px; position:absolute; z-index:900; top:0px; left:0px; text-indent:-99999px;}
.naviA { display:block; width:50px; height:50px; position:absolute; z-index:900; top:0px; left:0px; }
.focusDc { top:120px; left:283px;}
.focusSt { top:120px; left:226px;}
.focusGp { top:183px; left:283px;}
.focusSp { top:312px; left:283px;}
.focusAv { top:212px; left:342px;}
.focusSa { top:182px; left:226px;}

.again1 { width:150px; height:33px; position:absolute; top:104px; left:151px;}
.again3 { width:150px; height:33px; position:absolute; top:195px; left:58px;}

.popSelect { width:144px; height:90px; position:absolute; bottom:-73px; left:148px; z-index:49; background:url(../img/slide9.png); overflow:hidden; background-position:0px 0px;}
.popSelect2 { background-position:0px -90px;}
.popSelect3 { background-position:0px -180px;}
.popSelect4 { background-position:0px -270px;}

#videoPreviewBox .box { width:80px; height:61px; position:absolute; bottom:69px; z-index:49; display:none; }
#videoPreviewBox .box .pimg { width:76px; height:36px; margin:2px 0 0 2px; overflow:hidden; }
#videoPreviewBox .box .pimg .i { width:200px; height:40px; background:url(../img/vidSmall.jpg); }
#videoPreviewBox .box1 { background:url(../img/preview_04.png); left:5px; }
#videoPreviewBox .box2 { background:url(../img/preview_24.png); left:154px; }
#videoPreviewBox .box2 .pimg .i { left:-124px; }

.vidBigBox { width:240px; height:140px; position:absolute; top:106px; left:0px; overflow:hidden;}

.vidText { width:45px; height:12px;  font-size:11px; bottom:11px; left:11px; position:absolute; color:#2d839d;}
.vidTextBox { width:20px; height:14px; font-size:11px; bottom:9px; left:55px; position:absolute; color:#2d839d; overflow:hidden;}
.vidTextBox ul { width:20px; height:280px; position:absolute; top:0px; left:0px;}
.vidTextBox ul li { width:20px; height:14px; }

.vidBig { width:700px; height:140px; position:absolute; top:0px; right:0; }
.vidSmall { width:200px; height:40px; position:absolute; top:0px; left:0px; }


.disclaimer { font-size:9px; margin-top:30px; color:#525252; margin-bottom:30px; }
.disclaimer_stranslator { font-size:11px; margin-top:30px; color:#525252; margin-bottom:30px; }
.disclaimer_stranslator span { display:block; margin-top:9px; font-size:9px; }



/* 자바스크립트 스크롤바 스타일 정의 */
.jspContainer {	overflow: hidden; position: relative; }
.jspPane { position: absolute; }
.jspVerticalBar { position: absolute; top: 0; right: 0; width: 16px; height: 100%; }
.jspVerticalBar * { margin: 0; padding: 0; }
.jspCap { display: none; }
.jspTrack { position:relative;  width:1px; background:#e5e5e5; border:10px #fff solid; border-top:0; border-bottom:0; }

.jspDrag { width:11px; height:30px; background:url(../img/scrollbar.png); position:relative; top:0; left:-15px; cursor:pointer; border:10px #fff solid; border-top:0; border-bottom:0; }
/*.jspDrag { width:6px; background:#d4d4d4; position:relative; top:0; left:0; cursor:pointer; border:9px #fff solid; border-top:0; border-bottom:0; }
.jspDragTop,
.jspDragBottom { width:6px; height:3px; left:0; position:absolute; background:url(../img/scrollbar.png); }
.jspDragTop { top:0; }
.jspDragBottom { bottom:0; background-position:0 100%; }*/