/* 차이나탄 B2B 페이지 CSS */

/*공통*/
#b2bWrap{position:relative;}
.sec_tit_area{padding:100px 0 120px;color:#000;text-align:center;line-height:1;letter-spacing:-0.5px}
.sec_tit_area dt{margin-bottom:40px;font-size:50px;font-weight:bold;}
.sec_tit_area dt span{color:#20b7f0}
.sec_tit_area dd{font-size:23px;}
.sec_tit_area dd span{font-weight:bold;}

.visual_area{height:780px;}
.visual_area .contentWrap{position:absolute;top:0;left:0;width:100%;min-width:1000px;height:780px;text-align:center;background:url(/images/web/b2b/bg_visual.jpg) no-repeat 50% 100%;}
.visual_area .contentWrap .txt{display:block;position:relative;top:40px;padding-top:203px;opacity:0;}
.visual_area.fixed .contentWrap{position:fixed;}

.contents_area{position:relative;background:#f7f7f7;z-index:5;}
.sub_txt_area{height:515px;color:#fff;text-align:center;letter-spacing:-0.5px;background:url(/images/web/b2b/bg_sub_txt.jpg) no-repeat 50% 0;}
.sub_txt_area dl{padding-top:93px;}
.sub_txt_area dt{margin-bottom:53px;padding-bottom:52px;font-size:50px;font-weight:bold;line-height:1;background:url(/images/web/b2b/line_sub_txt.gif) no-repeat 50% 100%;}
.sub_txt_area dd p{font-size:20px;line-height:34px;}
.sub_txt_area dd p span{color:#22b5d9;font-weight:bold;}
.sub_txt_area dd p.emphasis{margin-top:38px;font-size:30px;font-weight:bold;}

.reference_area{background:url(/images/web/b2b/bg_reference.gif) no-repeat 50% 0;}
.reference_area .reference_list li{padding:100px 0;background:url(/images/web/b2b/bg_reference_list.png) no-repeat 50% 0;}
.reference_area .reference_list li dl{width:1000px;margin:0 auto;}
.reference_area .reference_list li dl dt{margin-bottom:23px;color:#000;font-size:34px;line-height:1;letter-spacing:-0.5px;}
.reference_area .reference_list li dl dt span{display:inline-block;margin-right:30px;color:#d74b47;font-size:45px;font-weight:bold;vertical-align:text-bottom;}
.reference_area .reference_list li dl .sub_txt{margin-bottom:60px;padding-left:82px;color:#3c3c3c;font-size:20px;font-weight:bold;line-height:1;}
.reference_area .reference_list li dl .sub_txt span{color:#db0600}
.reference_area .reference_list li dl .cont:after{content:'';display:block;clear:both;}
.reference_area .reference_list li dl .cont img{float:left;}
.reference_area .reference_list li dl .cont p{float:left;margin-left:50px;color:#6f6f6f;font-size:18px;line-height:32px;letter-spacing:-0.5px}
.reference_area .reference_list li dl .cont p span{color:#000}
.reference_area .reference_list li dl .cont p .source{display:block;font-size:14px;}
.reference_area .reference_list li:nth-child(even){background-color:#efeff1;}
.reference_area .reference_list li:first-child{padding-top:0;background-image:none;}
.reference_area .reference_list li:last-child{padding-bottom:0;}

.jdb_area{padding-bottom:120px;background:#efeff1 url(/images/web/b2b/bg_jdb.jpg) no-repeat 50% 100%;}
.jdb_area .video_area{text-align:center;}

.mapping_area{width:960px;margin:0 auto;}
.mapping_area .step{background:url(/images/web/b2b/bg_step.gif) no-repeat 50% 0;}
.mapping_area .step:after{content:'';display:block;clear:both;}
.mapping_area .step li{float:left;width:195px;padding-left:60px;text-align:center;}
.mapping_area .step li dl{padding-top:210px;}
.mapping_area .step li dl dt{margin-bottom:25px;color:#323232;font-size:20px;font-weight:bold;line-height:1;}
.mapping_area .step li dl dt strong{display:block;margin-bottom:50px;color:#505050;font-size:30px;font-weight:normal;letter-spacing:-1px}
.mapping_area .step li dl dt strong span{color:#20b7f0;font-weight:bold;}
.mapping_area .step li dl dd{color:#6f6f6f;font-size:16px;line-height:28px;letter-spacing:-0.5px;text-align:justify;}
.mapping_area .step li dl dd span{color:#000}
.mapping_area .step li.step01{padding-left:0;background:none;}
.mapping_area .step li.step01 dl{background:url(/images/web/b2b/bg_step01.gif) no-repeat 50% 0;}
.mapping_area .step li.step02 dl{background:url(/images/web/b2b/bg_step02.gif) no-repeat 50% 0;}
.mapping_area .step li.step03 dl{background:url(/images/web/b2b/bg_step03.gif) no-repeat 50% 0;}
.mapping_area .step li.step04 dl{background:url(/images/web/b2b/bg_step04.gif) no-repeat 50% 0;}

.system_area{padding-bottom:120px;}
.system_area .system_list{width:972px;margin:0 auto;}
.system_area .system_list:after{content:'';display:block;clear:both;}
.system_area .system_list li{float:left;width:312px;height:400px;margin:0 6px 12px;background:#fff;}
.system_area .system_list li .txt{padding:30px;}
.system_area .system_list li .txt dt{margin-bottom:20px;color:#222;font-size:16px;font-weight:bold;line-height:20px;letter-spacing:-0.5px;}
.system_area .system_list li .txt dt span{margin-right:8px;color:#0342a9}
.system_area .system_list li .txt dd{color:#6f6f6f;font-size:16px;line-height:28px;letter-spacing:-0.5px;text-align:justify;}

.effectiveness_area{text-align:center;}
.effectiveness_area .sec_tit_area{padding-top:120px;color:#fff;background:url(/images/web/b2b/bg_effectiveness_tit.jpg) no-repeat 50% 0;}
.effectiveness_area .sec_tit_area dt span{color:#fd3348}
.effectiveness_area .sec_tit_area dd{line-height:35px;}
.effectiveness_area .effectiveness_list{width:1000px;margin:0 auto;padding:100px 0 26px;}
.effectiveness_area .effectiveness_list:after{content:'';display:block;clear:both;}
.effectiveness_area .effectiveness_list li{float:left;width:50%;}
.effectiveness_area .effectiveness_list li dl{padding:0 20px;}
.effectiveness_area .effectiveness_list li dl dt{margin-bottom:50px;color:#000;font-size:34px;line-height:1;text-align:left;letter-spacing:-0.5px}
.effectiveness_area .effectiveness_list li dl dt span{display:inline-block;color:#d74b47;margin-right:30px;font-size:45px;font-weight:bold;vertical-align:middle;}
.effectiveness_area .tip_area{display:inline-block;padding-bottom:100px;}
.effectiveness_area .tip_area li{padding-left:24px;font-size:16px;line-height:28px;letter-spacing:-0.5px;text-align:left;background:url(/images/web/b2b/bul_red.gif) no-repeat 0 50%;}
.effectiveness_area .effectiveness{position:relative;background:#c62323;}
.effectiveness_area .effectiveness:before{content:'';position:absolute;top:-58px;left:50%;width:67px;height:58px;margin-left:-33px;background:url(/images/web/b2b/bg_effectiveness.gif) no-repeat 0 0;}
.effectiveness_area .effectiveness ul{display:none;position:relative;width:1000px;height:105px;margin:0 auto;}
.effectiveness_area .effectiveness ul:before{content:'';position:absolute;top:-57px;left:20px;width:97px;height:102px;background:url(/images/web/b2b/bg_star.png) no-repeat 0 0;opacity:0;transition:opacity ease-in-out .3s}
.effectiveness_area .effectiveness ul.on:before{opacity:1;	}
.effectiveness_area .effectiveness ul:after,
.effectiveness_area .effectiveness ul li dl:after{content:'';display:block;clear:both; letter-spacing: -1px;}
.effectiveness_area .effectiveness ul li{float:left;width:50%;margin-top:22px;padding:10px 0;box-sizing:border-box;}
.effectiveness_area .effectiveness ul li:first-child{border-right:1px dashed #c97c7c;}
.effectiveness_area .effectiveness ul li:last-child dl dt{padding-left: 20px;}
.effectiveness_area .effectiveness ul li dl{color:#fff;line-height:1; font-size: 0; text-align: left;}
.effectiveness_area .effectiveness ul li dl dt{display:inline-block;margin:12px 25px 0 0;padding:3px 25px 3px 0;font-size:20px;border-right:1px solid #fff;}
.effectiveness_area .effectiveness ul li dl dd{display:inline-block;font-size:19px;font-weight:700;}
.effectiveness_area .effectiveness ul li dl dd span{display:inline-block;color:#ffe400;font-size:37px; vertical-align: text-bottom;}
.effectiveness_area .effectiveness ul li dl dd span em{font-style:normal;}

.portfolio_area{padding-bottom:60px;}
.portfolio_area .portfolio_list{width:960px;margin:0 auto;}
.portfolio_area .portfolio_list > li:first-child{margin-bottom:100px;}
.portfolio_area .portfolio_list li dl dt{margin-bottom:60px;color:#000;font-size:34px;line-height:1;letter-spacing:-0.5px;}
.portfolio_area .portfolio_list li dl dt span{display:inline-block;margin-right:35px;color:#20b7f0;font-size:45px;font-weight:bold;vertical-align:middle;}

.partnership_area{background:url(/images/web/b2b/bg_partnership.jpg) no-repeat 50% 0;}
.partnership_inquiry{padding-bottom:80px;text-align:center;}
.partnership_inquiry .sec_tit_area{width:100%;padding-top:110px;color:#fff;text-align:center;}
.partnership_inquiry .sec_tit_area dd span{color:#20b7f0}
.inquiry_form{width:735px;margin:0 auto;}
.inquiry_form form div{overflow:hidden;padding-bottom:16px;}
.inquiry_form form div input[type="text"]{float:left;width:360px;height:40px;padding-left:20px;color:#fff;font-size:16px;border:none;background:rgba(240,240,240,0.2);box-sizing:border-box;}
.inquiry_form form div input[type="text"]:first-child{margin-right:15px;}
.inquiry_form form div input[type="checkbox"]{padding:2px;}
.inquiry_form form #inquirySelect{width:100%;height:40px;padding-left:20px;color:#fff;font-size:16px;line-height:20px;border:none;background:rgba(240,240,240,0.2) url(/images/web/b2b/bg_select.png) no-repeat 100% 50%;-ms-appearance:none;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;}
.inquiry_form form #inquirySelect option{color:#666}
.inquiry_form form div textarea{width:100%;height:130px;padding:20px;color:#fff;font-size:16px;line-height:25px;border:none;background:rgba(240,240,240,0.2);resize:none;}
.inquiry_form form .agree .inner{display: inline-block; padding-top: 5px;}
.inquiry_form form .agree{color:#fff;font-size:14px;text-align:left;}
.inquiry_form form .agree a.info_view{display:inline-block;margin-left:3px;padding:5px 10px;color:#fff;font-size:14px;vertical-align:middle;background-color:#aaa;}
.inquiry_form form .btn_submit{margin-top:44px;padding-bottom:20px;text-align:right;}
.inquiry_form form .btn_submit .btn_down,
.inquiry_form form .btn_submit input[type="button"]{display:inline-block;width:180px;margin-left:10px;color:#20b7f0;font-size:18px;line-height:44px;text-align:center;vertical-align:middle;border:3px solid #20b7f0;border-radius:10px;background:none;}
.inquiry_form form ::-webkit-input-placeholder{color:#fff}
.inquiry_form form :-ms-input-placeholder{color:#fff}
.inquiry_form form ::-moz-placeholder{color:#fff}
.inquiry_form form :-moz-placeholder{color:#fff}
.cs_area{width:100%;background:rgba(0,0,0,0.7);}
.cs_area .cs_info{width:1000px;margin:0 auto;padding:60px 0;color:#fff;line-height:1;}
.cs_area .cs_info:after{content:'';display:block;clear:both;}
.cs_area .cs_info > dt{float:left;width:268px;margin-top:25px;padding-left:110px;}
.cs_area .cs_info > dd{float:left;padding:1px 0 1px 60px;border-left:1px solid #fff;}
.cs_area .cs_info dt .cs_tit{font-size:40px;}
.cs_area .cs_info dt .time{margin-top:20px;font-size:20px;font-weight:bold;}
.cs_area .cs_info ul li{float:left;width:235px;}
.cs_area .cs_info ul li dl{padding-left:88px;}
.cs_area .cs_info ul li dl dt{padding-top:2px;margin-bottom:20px;font-size:15px;}
.cs_area .cs_info ul li dl dd{font-size:13px;}
.cs_area .cs_info ul li dl dd a{color:#fff;line-height:1;}
.cs_area .cs_info ul li.cs_address{float:none;clear:both;width:100%;padding-bottom:28px;}
.cs_area .cs_info ul li.cs_address dl{background:url(/images/web/b2b/bg_cs_address.png) no-repeat 0 50%;}
.cs_area .cs_info ul li.cs_tel dl{background:url(/images/web/b2b/bg_cs_tel.png) no-repeat 0 50%;}
.cs_area .cs_info ul li.cs_email dl{background:url(/images/web/b2b/bg_cs_email.png) no-repeat 0 50%;}