/* mainCont */
.main_con { overflow:hidden; background: url(/mobile/kr/img/main/cont_bg1.gif) repeat; padding: 30px 15px 41px; }

/* mainVisual*/

.mainVisual { width: 100%; height: 396px; position: relative;}
.visual { width: 100%; height: 396px; position: relative; overflow: hidden;}
.visual li {width: 100%; height: 396px; position: relative; no-repeat center; background-size:cover;}
.visual li.vs1 { background:url(/mobile/kr/img/main/main_Visual1.jpg) no-repeat center; background-size:cover;}
.visual li.vs2 { background:url(/mobile/kr/img/main/main_Visual2.jpg) no-repeat center; background-size:cover;}
.visual li.vs3 { background:url(/mobile/kr/img/main/main_Visual3.jpg) no-repeat center; background-size:cover;}
.visual li.vs4 { background:url(/mobile/kr/img/main/main_Visual4.jpg) no-repeat center; background-size:cover;}
.visual li.vs5 { background:url(/mobile/kr/img/main/main_Visual5.jpg) no-repeat center; background-size:cover;}
.visual li > img { position:absolute; z-index: -1; right:0; top: 0; animation:vsImg 7s ease-out; width: 60%; }
li.vs1 > img { top:60px; }
li.vs2 > img { top:80px; }
li.vs3 > img { top:124px; width: 70%;}



/*
.vs1 { background: url(/mobile/kr/img/main/mainVisual.jpg) no-repeat center; background-size: cover;}
*/
.vs1T { padding: 61px 0 0 15px; box-sizing: border-box; animation:vsTxt 4s;}
.vs1T span { font-size: 20px; line-height: 100%; font-weight: 350; color: #0e84df;}
.vs1T h2 { font-size: 30px; line-height: 100%; font-family: 'Roboto', sans-serif; font-weight: 500; margin: 13px 0 12px;}
.vs1T h2 img { vertical-align: middle; margin-left: 11px;}
.vs1T p { color: #999; font-size: 13px; line-height: 23px; font-weight: 350;}
.vs1T > a { display: block; width: 114px; height: 26px; background: #252525; border-radius: 13px; text-align: center; font-size: 13px; line-height: 24px; color: #fff; font-weight: 350; margin-top: 43px;}

/* mainVisual - 버튼*/
.mainVisual .bx-pager { position:absolute; top:360px; width:auto; left:50%; margin-left: -70.5px; z-index:99; }
.mainVisual .bx-pager div { float:left; margin-right: 15px; }
.mainVisual .bx-pager a {display: block;  width:16px; height:16px; margin-top: 5px; text-indent:-9999px; border-radius: 50%; position: relative;}
.mainVisual .bx-pager a i { font-size: 0; display: block;  width:12px; height:12px; background: #d1d1d1;  border-radius: 50%; position: absolute; top: 2px; left: 2px; right: 0; bottom: 0;}
.mainVisual .bx-pager a:hover, .mainVisual .bx-pager a.active { border: 5px solid #7e91ba; box-sizing: border-box;}
.mainVisual .bx-pager a:hover i , .mainVisual .bx-pager a.active i { display: none;}

@keyframes vsImg {
	0% { right:-20%; opacity:0; transform:scale(1.2,1.2);}
	30% { opacity:1; }
	100% { right:0%; transform:scale(1,1); }
}
 
 @keyframes vsTxt {
	0% { opacity:0; }
	100% { opacity:1; }
}


/* 슬라이드 및 story 공통 */
.sd_st { width: 100%; height: 217px; border: 1px solid #f2f2f2; border-bottom: none; box-sizing: border-box;}
.sd_st > div { width: 50%; height: 217px; float:left;}

/* 제품슬라이드 */
.pd_silder { height: 217px; position: relative; background: #fff; border-bottom: 1px solid #f2f2f2;  box-sizing: border-box;}
.pd_sd { width: 100%; height: 217px; position: relative;}
.pd_sd li { width: 100%; height: 217px; position: absolute;}
.pd_sd li a { display: block; width: 100%; height: 100%;}
.pd_sd .sd_cont1 { background: #fff url(/kr/img/main/main_booth.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd .sd_cont2 { background: #fff url(/kr/img/main/main_bfu.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd .sd_cont3 { background: #fff url(/kr/img/main/main_ffu.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd .sd_cont4 { background: #fff url(/kr/img/main/main_hfu.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd .sd_cont5 { background: #fff url(/kr/img/main/main_passbox.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd .sd_cont6 { background: #fff url(/kr/img/main/img_pd.jpg) no-repeat center center; background-size: 100% 100%;}
.pd_sd li a p { width: 100%; height: 36px; background: rgba( 0, 0, 0, .8); text-align: center; font-size: 13px; line-height: 36px; color: #fff; border-top: 1px solid #f2f2f2; position: absolute; bottom: 1px; left: 0;}

/* 제품슬라이드 - 버튼*/
.pd_silder .bx-controls-direction { position:absolute; z-index:99; top:75px; left: 0; width:100%; background: red;}
.pd_silder .bx-controls-direction a { position:absolute; width:16px; height:29px; display:block; cursor:pointer; text-indent:-9999px;}
.pd_silder .bx-prev { background: #f1f1f1 url(/mobile/kr/img/main/pd_silderL.png) no-repeat center center;  left: 0; border: 1px solid #fafafa; border-left: none;}
.pd_silder .bx-next { background: #f1f1f1 url(/mobile/kr//img/main/pd_silderR.png) no-repeat center center; right: 0; border: 1px solid #fafafa; border-right: none; }



/* story 더보기 */
.v_story { background: url(/mobile/kr/img/main/img_v_story1.jpg) no-repeat center; background-size: cover; border-left: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; box-sizing: border-box; position: relative;}
.v_story h3 { width: 139px; height: 86px; background: url(/mobile/kr/img/main/bg_v_story2.jpg) no-repeat; font-size: 16px; line-height: 86px; color: #fff; text-align: center; position: relative; left: 50%; margin-left: -69.5px; font-family: 'Roboto', sans-serif; font-weight: 400;}
.v_story h3:before {content: ""; width: 21px; height: 1px; background: #fff; position: absolute; top: 30px; left: 59px;}
.v_story > a { width: 99px; height: 20px; border: 1px solid #ccc;  display:block; font-size: 8px; line-height: 20px; color: #fff; font-wieght: 200; padding-left: 11px; background: url(/mobile/kr/img/main/arrow1.png) no-repeat 49px 7px; position: absolute; bottom: 8px; left: 50%; margin-left: -49.5px; box-sizing: border-box;}

/* 고객센터 메인 */
.cuct { width: 100%; position: relative; min-height: 216px; border-left: 1px solid #f2f2f2; border-right: 1px solid #f2f2f2; box-sizing: border-box; background: #fff; padding: 25px 5px 69px; }
.cuct h3 { font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 16px; line-height: 24px; color: #000; text-align: center; padding-bottom: 9px; background: url(/mobile/kr/img/main/stick1.gif) no-repeat center bottom;}
.cuct_t { overflow: hidden; text-align: center; margin: 12px 0;}
.cuct_t > img { margin-right: 21px; margin-top: 5px;}
.cuct_t > p { font-size: 13px; line-height: 22px; color: #999; font-weight: 400; display: inline-block;}
.cuct_t > p span { display: block; }
.numb { font-size: 25px; font-weight: bold; line-height: 100%; color: #2b4a8d; text-align: center; }
.online_cu { width:100%; height: 37px; background: #3b5998; position: absolute; left: 0; bottom: 0; text-align: center;}
.online_cu span { color: #e1e3e9; font-size: 13px; font-weight: 400; line-height: 37px;}
.online_cu > a { display: inline-block; padding-left: 9px; width: 99px; height: 20px; font-size: 8px; line-height: 20px; font-weight:200; color: #bac5dc; border: 1px solid #5d74a4; box-sizing: border-box; background: url(/mobile/kr/img/main/arrow2.png) no-repeat 48px 6px; margin-left: 21px; text-align: left;}

@media screen and (max-width:445px) { 
.cuct_t > img { margin: 0 ;}
}