@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css);

/* CSS Document */
body {margin:0; padding:0; }
body,th,td,input,select,textarea { font-size:14px; font-family: 'Nanum Gothic', serif; /*font-family: 'Nanum Brush Script', serif;*/ color:#666666; }
img,fieldset {border:0;}      
dl,ul,ol,li {list-style:none; margin:0; padding:0;}
h1,h2,h3,h4,h5,h6 {font-weight:normal;}
h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,li,ol,th,td,p,form,fieldset,legend {margin:0; padding:0;}
table {border-collapse:collapse;}
label {cursor:pointer;}
address, caption, em {font-weight:normal; font-style:normal; }

a { text-decoration:none; }
a:hover { text-decoration:none; }

#wrap { width: 100%; min-width: 1280px; }
#wrap .topMenuArea { position: absolute; top: 0; left: 0; width:100%; min-width: 1280px; height:175px; z-index: 1000; }
#wrap .topMenuArea .topmn { width:1100px; height:130px; margin: 0 auto; }
#wrap .topMenuArea .topmn .logo { float:left; width: 212px; height: 68px; margin-top: 32px; }
#wrap .topMenuArea .topmn .menuArea { float: right; margin-top: 50px; }
#wrap .topMenuArea .topmn .menuArea ul { text-align: right; font-size: 0; }
#wrap .topMenuArea .topmn .menuArea ul > li { display: inline-block; float: left; margin-left: 120px; }
#wrap .topMenuArea .topmn .menuArea ul > li > a { display:block; font-size: 20px; height: 80px; line-height: 50px; color: #ffffff; font-weight: bold; letter-spacing: -1px; }
#wrap .topMenuArea .submnBg { position: absolute; top:130px; left: 0; width: 100%; height: 45px; background-color:rgba(0,0,0, 0.4); display: none; }
#wrap .topMenuArea .submnBg .submnArea { position: relative; width: 1100px; margin: 0 auto; }
#wrap .topMenuArea .submnBg .submnArea ul { height: 30px; margin-top: 7px; font-size: 0; margin-left:610px; }
#wrap .topMenuArea .submnBg .submnArea ul.sm { height: 30px; margin-top: 7px; font-size: 0; margin-left:815px; }
#wrap .topMenuArea .submnBg .submnArea ul > li { display: inline-block; float: left; margin:0 10px; }
#wrap .topMenuArea .submnBg .submnArea ul > li > a { display:block; height: 30px; line-height: 30px; padding:0 10px; font-size: 16px; font-weight: bold; color: #989898;  }
#wrap .topMenuArea .submnBg .submnArea ul > li > a:hover { color: #ffffff;  }

#wrap .btnControlArea { position:fixed; top:300px; left:50%; margin-left: 595px; z-index: 1000; }
#wrap .btnControlArea ul { width: 40px; font-size: 0; }
#wrap .btnControlArea ul li { position: relative; display:block; width: 40px; height: 40px; margin: 5px 0px;  background: url(/resources/img/front/main//btnControl_off.png) no-repeat center; }
#wrap .btnControlArea ul li.on {  background: url(/resources/img/front/main//btnControl_on.png) no-repeat center; }
#wrap .btnControlArea ul li a { display:block; width: 40px; height: 40px; text-indent:-2000em; overflow: hidden; font-size: 0; }
#wrap .btnControlArea ul li a.on { background: url(/resources/img/front/main//btnControl_on.png) no-repeat center; }
#wrap .btnControlArea ul li .overtxt { position: absolute; left: -110px; top: 0px; width: 133px; height: 38px; border: solid 1px #9A9A9A; border-radius: 40px; text-align: left; padding-left: 15px; font-size: 14px; line-height: 38px; background-color:rgba(0,0,0, 0.6); color:#ffffff; display: none; z-index: -1; }

#wrap .contentArea { position: relative; float: left; width: 100%; min-width: 1280px; height: 1080px; z-index: 1; }
#wrap .contentArea.bizMemberTalk { background: url(/resources/img/front/main//bizMemberTalk.jpg) no-repeat center; }
#wrap .contentArea.outline { background:url(/resources/img/front/main//outlinebg.jpg) no-repeat center; height: 2030px; }
#wrap .contentArea.mainfunction { background: url(/resources/img/front/main//mainFunction.jpg) no-repeat center; }
#wrap .contentArea.download { background: url(/resources/img/front/main//download.jpg) no-repeat center; height: 790px; }
#wrap .contentArea.customer { background: url(/resources/img/front/main//customer.jpg) no-repeat center; }
#wrap .contentArea.faq { background:#ffffff; }
#wrap .contentArea.inquiry { background: url(/resources/img/front/main//inquiry.jpg) no-repeat center; }

#wrap .contentArea .inContent { position: relative; width: 1100px; margin: 0 auto; }
#wrap .contentArea .inContent .contBizmember { position: absolute; top:320px; left: 570px;  }
#wrap .contentArea .inContent .contBizmember .biztext { font-size: 52px; font-weight: bold; color:#ff7417; line-height: 80px; letter-spacing: -1px; }
#wrap .contentArea .inContent .contBizmember .biztext .fw { color: #ffffff; }
#wrap .contentArea .inContent .contBizmemberBtn { position: absolute; left: 578px; top: 620px; }
#wrap .contentArea .inContent .contBizmemberBtn .googlePlay { float: left; margin-right: 24px; }
#wrap .contentArea .inContent .contBizmemberBtn .appStore { float: left; }

#wrap .contentArea .inContent .outlineTitle { float: left; width: 1100px; text-align: center; font-size: 38px; font-weight: bold; color: #333333; margin-top: 105px; }
#wrap .contentArea .inContent .outlineTitle > span { border-bottom: solid 3px #3b3b3b; padding-bottom: 17px; }
#wrap .contentArea .inContent .outlineArea { float: left; width: 1100px; padding-top: 50px; text-align: center; }
#wrap .contentArea .inContent .outlineArea .otxt1 { float: left; width: 1100px; font-size: 30px; font-weight: bold; color: #ec6615; letter-spacing: -3px; line-height: 50px; }
#wrap .contentArea .inContent .outlineArea .otxt1 > span { color:#9fa0a0; }
#wrap .contentArea .inContent .outlineArea .otxt2 { float: left; width: 1100px; font-size: 45px; font-weight: bold; color: #bc0c16; padding-top: 40px; letter-spacing: -3px;}
#wrap .contentArea .inContent .outlineArea .otxt3 { float: left; width: 1100px; font-size: 30px; font-weight: bold; color: #4b4948; line-height: 50px; }
#wrap .contentArea .inContent .outlineArea .otxt4 { float: left; width: 1100px; font-size: 40px; font-weight: bold; color: #f6ae30; letter-spacing: -3px; }

#wrap .contentArea .inContent .funcTitle { float: left; width: 1100px; text-align: center; font-size: 38px; font-weight: bold; color: #FFFFFF; margin-top: 105px; }
#wrap .contentArea .inContent .funcTitle > span { border-bottom: solid 3px #ffffff; padding-bottom: 17px; }
#wrap .contentArea .inContent .functionArea { position: absolute; width: 1100px; height:550px; left: 0; top: 282px; }
#wrap .contentArea .inContent .functionArea .fcArea { position: absolute; width: 890px; height: 550px; left: 105px; top: 0; }
#wrap .contentArea .inContent .functionArea .fcArea ul { width: 890px; height: 550px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li { width: 890px; height: 550px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fcimg1 { position: absolute; left:123px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fcimg2 { position: absolute; left:20px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea1 { position: absolute; left:435px; top: 170px; width: 445px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea1 .fctxt1 { float: left; width: 445px; height: 105px; font-size:30px; font-weight: bold; color: #ffffff; letter-spacing: -1px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea1 .fctxt2 { float: left; width: 445px; font-size:18px; color: #ffffff; font-weight: bold; line-height: 30px; letter-spacing: -1px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea2 { position: absolute; left:510px; top: 170px; width: 380px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea2 .fctxt1 { float: left; width: 380px; height: 105px; font-size:30px; font-weight: bold; color: #ffffff; letter-spacing: -1px; }
#wrap .contentArea .inContent .functionArea .fcArea ul li .fctextArea2 .fctxt2 { float: left; width: 380px; font-size:18px; color: #ffffff; font-weight: bold; line-height: 30px; letter-spacing: -1px; }

#wrap .contentArea .inContent .downloadArea { float: left; width: 1100px;}
#wrap .contentArea .inContent .downloadArea .downtitle { float: left; width: 1100px; margin-top: 105px; text-align: center; font-size: 38px; font-weight: bold; color: #333333; letter-spacing: -1px; }
#wrap .contentArea .inContent .downloadArea .downtitle > span { display: inline-block; padding-bottom: 12px; border-bottom: solid 3px #333333; }
#wrap .contentArea .inContent .downloadArea .downtext { float: left; width: 1100px; font-size: 20px; line-height: 35px; color: #1e1e1e; text-align: center; padding-top: 32px; letter-spacing: -0.5px; }
#wrap .contentArea .inContent .downloadArea .btnArea { float: left; width: 1100px; text-align: center; font-size: 0; margin-top: 60px; }
#wrap .contentArea .inContent .downloadArea .btnArea > span { display:inline-block; margin: 0 10px; }

#wrap .contentArea .inContent .cstitle { float: left; width: 1100px; margin-top: 105px; text-align: center; font-size: 38px; font-weight: bold; color: #333333; letter-spacing: -1px; }
#wrap .contentArea .inContent .cstitle > span { display: inline-block; padding-bottom: 12px; border-bottom: solid 3px #333333; }
#wrap .contentArea .inContent .customerArea { position: absolute; width: 1100px; height:670px; left: 0; top: 245px; }
#wrap .contentArea .inContent .customerArea .csArea { position: absolute; width: 890px; height: 670px; left: 105px; top: 0; }
#wrap .contentArea .inContent .customerArea .csArea ul { width: 890px; height: 670px; }
#wrap .contentArea .inContent .customerArea .csArea ul li { float: left; width: 890px; height: 670px; }
#wrap .contentArea .inContent .customerArea .csArea ul li .csimg { position: absolute; left: 210px; }
#wrap .contentArea .inContent .customerArea .csArea ul li .cstext { padding-top: 630px; font-size:28px; font-weight:bold; color:#222222; width: 890px; text-align: center; letter-spacing: -1px; }

#wrap .contentArea .inContent .faqTitle { float: left; width: 1100px; text-align: center; font-size: 38px; font-weight: bold; color: #333333; height: 64px; margin-top: 105px; }
#wrap .contentArea .inContent .faqTitle > span { border-bottom: solid 3px #3b3b3b; padding-bottom: 17px; }

#wrap .contentArea .inContent .faqArea { float: left; width: 1100px; margin-top: 50px; }
#wrap .contentArea .inContent .faqArea .faqtab { float: left; width: 1100px; height: 60px; margin-bottom: 50px; }
#wrap .contentArea .inContent .faqArea .faqtab ul { float: left; width: 1100px; height: 60px; font-size: 0; }
#wrap .contentArea .inContent .faqArea .faqtab ul li { display: inline-block; float: left; width: 182px; border-left: solid 1px #c0c0c0; text-align: center; }
#wrap .contentArea .inContent .faqArea .faqtab ul li:first-child { width: 183px; border-left: solid 1px #e1e1e1; }
#wrap .contentArea .inContent .faqArea .faqtab ul li:last-child { width: 183px; }
#wrap .contentArea .inContent .faqArea .faqtab ul li a { display: block; width:100%; height: 60px; line-height: 60px; background: #e1e1e1; font-size: 17px; color:#3b3b3b; }
#wrap .contentArea .inContent .faqArea .faqtab ul li a.on { background: #5a78e5; color:#ffffff; font-weight: bold; }

#wrap .contentArea .inContent .faqArea .faqList { float: left; width: 1100px; height: 650px; overflow: hidden; overflow-y: auto; overflow-x: hidden; display: none; }
#wrap .contentArea .inContent .faqArea .faqList ul { float: left; width: 1100px; border-top: solid 1px #dddddd; }
#wrap .contentArea .inContent .faqArea .faqList ul li { float: left; width: 1030px; padding: 25px 40px 25px 30px; border-bottom: solid 1px #dddddd;  }
#wrap .contentArea .inContent .faqArea .faqList ul li.on { background: #f5f5f5; }
#wrap .contentArea .inContent .faqArea .faqList ul li .qtxt { width: 1030px; height: 24px; line-height: 24px; }
#wrap .contentArea .inContent .faqArea .faqList ul li .qtxt a { display: block; width: 100%; height: 100%; font-size: 16px; color: #191919; background: url(/resources/img/front/main//arrowBtm.png) no-repeat right; font-weight: bold; }
#wrap .contentArea .inContent .faqArea .faqList ul li .qtxt a.on { background: url(/resources/img/front/main//arrowTop.png) no-repeat right; }
#wrap .contentArea .inContent .faqArea .faqList ul li .atxt { width: 1000px; font-size: 15px; color: #666666; line-height: 24px; padding-top: 20px; display: none; }

#wrap .contentArea .inContent .inquiryTitle { float: left; width: 1100px; text-align: center; font-size: 38px; font-weight: bold; color: #ffffff; height: 64px; margin-top: 105px; }
#wrap .contentArea .inContent .inquiryTitle > span { border-bottom: solid 3px #ffffff; padding-bottom: 17px; }
#wrap .contentArea .inContent .addrtxt { float: left; width: 1100px; height: 180px; font-size: 18px; line-height: 35px; color: #dedede; text-align: center; padding-top: 30px; }

#wrap .contentArea .inContent .inquiryArea { float: left; width: 1100px; height: 375px; margin-top: 60px;  }
#wrap .contentArea .inContent .inquiryArea .infoBox { float: left; width: 550px; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox { float: left; width: 533px; height: 48px; border: solid 1px #dddddd; background: #f2f2f2; margin-bottom: 15px; line-height: 48px; text-align: left; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox label { float: left; display: block; width: 130px;  height: 48px; font-size: 16px; font-weight: bold; color: #4b4e58; line-height: 48px; padding-left:15px; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox input { float: left; width: 370px; height: 48px; line-height: 48px; font-size: 14px; padding: 0; margin: 0; border:none; background: #f2f2f2; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox > span { float: left; margin: 0 5px; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .tel1 { float: left; height: 48px; width: 60px; font-size: 14px; border:none; background: #f2f2f2; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .tel2 { float: left; height: 48px; width: 50px; font-size: 14px; border:none; background: #f2f2f2; text-align: center; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .tel3 { float: left; height: 48px; width: 50px; font-size: 14px; border:none; background: #f2f2f2; text-align: center; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .email1 { float: left; height: 48px; width: 120px; font-size: 14px; border:none; background: #f2f2f2; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .email2 { float: left; height: 48px; width: 120px; font-size: 14px; border:none; background: #f2f2f2; }
#wrap .contentArea .inContent .inquiryArea .infoBox .inbox .email3 { float: left; height: 48px; width: 125px; font-size: 14px; border:none; background: #f2f2f2; }

#wrap .contentArea .inContent .inquiryArea .infoText { float: left; width: 495px; height: 335px; background:#f2f2f2; border: solid 1px #dddddd; padding: 19px; margin-left: 15px; }
#wrap .contentArea .inContent .inquiryArea .infoText label { float: left; width: 495px; height: 30px; font-size: 16px; color:#4b4e5; font-weight: bold; }
#wrap .contentArea .inContent .inquiryArea .infoText textarea { float: left; width: 495px; height: 300px; font-size: 14px; line-height: 20px; border: none; padding: 0; margin: 0; overflow-y: auto; background: #f2f2f2; }

#wrap .contentArea .inContent .inquiryArea .btnArea { float: left; width: 1100px; text-align: right; margin-top: 1px; }
#wrap .contentArea .inContent .inquiryArea .btnArea a { display:inline-block; width: 220px; height: 60px; line-height: 60px; background:#ff6600; font-size: 20px; font-weight: bold; color: #ffffff; text-align: center;  }

#wrap .contentArea .inContent .okPopup { position: absolute; top:505px; left: 369px;  width: 363px; height: 213px; background: #ffffff; border: solid 1px #dddddd; display: none; }
#wrap .contentArea .inContent .okPopup .oktext { font-size: 16px; color: #4b4e58; line-height: 32px; text-align: center; padding-top:50px; letter-spacing: -1px; }
#wrap .contentArea .inContent .okPopup .okbtn { text-align: center; padding-top: 30px; }
#wrap .contentArea .inContent .okPopup .okbtn a { display: inline-block; width: 90px; height: 35px; line-height: 35px; background:#707070; font-size: 16px; color: #ffffff; text-align: center; }

#wrap .contentArea .footer { position: absolute; bottom:0; left:0; width: 100%; height: 105px; background:#3b3b3b; }
#wrap .contentArea .footer .foot { width:1100px; height: 105px; margin: 0 auto; }
#wrap .contentArea .footer .foot ul { float: left; width:1100px; height: 30px; margin-top: 25px; margin-bottom: 5px; font-size: 0; text-align: center; }
#wrap .contentArea .footer .foot ul li { display: inline-block; padding: 0; background: url(/resources/img/front/main//line.png) no-repeat left; }
#wrap .contentArea .footer .foot ul li:first-child { background:none; }
#wrap .contentArea .footer .foot ul li a { display:block; font-size:16px; color: #aeaeae; font-weight: bold; padding: 5px 20px; }
#wrap .contentArea .footer .foot .copy { color: #808080; font-size: 15px; text-align: center; font-weight: bold; }

#wrap .contentArea .accessArea { position: absolute; width: 100%; height: 1080px; background: #f5f5f5; display: none; }
#wrap .contentArea .accessArea .accessText { position: relative; width: 1100px; height: 1080px; margin: 0 auto; }
#wrap .contentArea .accessArea .accessText .closeBtn { position:absolute; width: 30px; height: 30px; top: 30px; right: 30px; }
#wrap .contentArea .accessArea .accessText .title { width: 1100px; height: 90px; padding-top: 70px; text-align: center; font-size: 30px; font-weight: bold; color: #3b3b3b; }
#wrap .contentArea .accessArea .accessText .iframeArea { float: left; width: 1100px; height: 920px; overflow-y: auto; overflow-x: hidden; }


.pdfDownload { position:fixed; right: 50px; bottom: 50px; width: 90px; height: 90px; z-index: 10000000000000; }
.pdfDownload a { display: block; width: 90px; height: 50px; padding-top: 40px; background:url(/resources/img/front/main//btn_down.png) no-repeat center 10px, #FFCC00; border-radius: 90px; font-size: 13px; line-height: 16px; font-weight: bold; text-align: center; color: #000000; border: solid 1px #DBDBDB; letter-spacing: -1px; }