@charset "utf-8";

/* 
 * content CSS Document
 * PARK-HYUN-BI
 */


/* common */
h3[data-tit]{font-size:37px;color:#222;text-align:center;letter-spacing:-0.03rem;margin-bottom: 10px;}
h3[data-tit] + p{margin-bottom:40px; text-align:center;}
div[class^="area_"] p,
div[class^="area_"] li{line-height:1.7; font-weight:300; color:#666;}

#wrap{position:relative; overflow:hidden;}
#content .mob_info{padding:5px 0; background:#f1f1f1; font-weight:600; font-size:13px; color:#444;}
#content.policy{width: 100% !important;border:none;}

.sub #content{float:right;width: 100%;border-left:1px solid #eee;}
.sub #content div[class^="area_"] > div{padding: 90px 0;} 

/* table custom */
#content table.table td{padding: 11px 20px;}

/* animation */
.ani{position:relative;opacity:0;transition:all 0.8s ease-out 0s;transform: translate(0,40px);}
.ani.is-animate{opacity:1; transform:translate(0,0);}

.is-animate.delay-100{-webkit-animation-delay:100ms; animation-delay:100ms;}
.is-animate.delay-150{-webkit-animation-delay:150ms; animation-delay:150ms;}
.is-animate.delay-200{-webkit-transition-delay:200ms; transition-delay:200ms;}
.is-animate.delay-250{-webkit-animation-delay:250ms; animation-delay:250ms;}
.is-animate.delay-300{-webkit-animation-delay:300ms; animation-delay:300ms;}
.is-animate.delay-350{-webkit-animation-delay:350ms; animation-delay:350ms;}
.is-animate.delay-400{-webkit-animation-delay:400ms; animation-delay:400ms;}
.is-animate.delay-450{-webkit-animation-delay:450ms; animation-delay:450ms;}
.is-animate.delay-500{-webkit-animation-delay:500ms; animation-delay:500ms;}

/* page navigation */
.area_navigation{margin-bottom:50px; padding-top:70px; text-align:right;}
.area_navigation ul{display:inline-block; overflow:hidden;}
.area_navigation ul li{position:relative; float:left; line-height:1; padding:0 12px; font-size:15px; color:#333;}
.area_navigation ul li img{display:inline-block; position:relative; top:1px; height:12px; vertical-align:top;}
.area_navigation ul li i{display:none;}
.area_navigation ul li:nth-child(2):after{content:""; position:absolute; top:3px; right:-3px; width:6px; height:8px; background:url(../images/content/icon_navigation02.svg) no-repeat 50% 50%;}
.area_navigation ul li:first-child{padding:0;}

/* lnb */
.lnb{background: #fff;text-align:center;width: 100%;z-index: 1;position: relative;margin-top: 0px;border-bottom: 1px solid #e8e8e8;}
.lnb ul li{display:inline-block;margin: 0 37px;padding: 20px 0;}
.lnb ul{display:block; overflow:hidden; margin:0 auto;}
.lnb ul li a{display:block;}
.lnb ul li a{position:relative;font-size: 17px;}
.lnb ul li a:after{content:"";position:absolute;opacity:0;bottom: -20px;left:0;width:100%;height:3px;background:#e7141a;}
.lnb ul li.active a:after{opacity:1;}
.lnb ul li a.on{font-weight:700; color:#cb1919;}

.btn_contact{position:fixed;bottom:0;left:0;z-index:90;width: 240px;padding-left: 40px;box-shadow: 11px 12px 49px 0px rgba(203, 25, 25, 0.50);background-position: 100% 100%;}
.btn_contact *{display:block; color:#fff;}
.btn_contact i{font-size:13px;}
.btn_contact a{display:block; padding:30px 0;}
.btn_contact em{margin-top:7px; font-weight:600; font-size:20px; letter-spacing:-0.04rem;}
.btn_contact:after{content:""; position:absolute; top:55%; right:40px; width:7px; height:10px; background-size:cover; background-image:url(DHM/images/content/arr_contact.svg); background-repeat:no-repeat;}
.btn_contact.fiexd{position:absolute; bottom:241px; z-index:9999;}
.btn_contact em i{display:inline-block; font-weight:600; font-size:22px;}


/* sub visual */
.area_subVisual{position:relative; height:480px; margin-top:91px;}
.area_subVisual > .wrap{position:relative; top:58%; transform:translateY(-50%);}
.area_subVisual h2{opacity:0; line-height:1; padding-top:185px; font-size:61px; animation:slideUp 2s ease 0s forwards; text-transform:uppercase;}
.area_subVisual h2,
.area_subVisual i{opacity:0; animation:slideUp 2s ease 0s forwards;}
.area_subVisual i{animation-delay:0.2s;}
.area_subVisual i{display:block; margin-top:7px; font-size:22px;}
.area_subVisual > span{display:block; position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; background-size:cover; background-position:50% 50%; text-align:center; transform:scale(1); animation:visualScale2 10s ease 0s forwards; background-repeat:no-repeat;}
.area_subVisual > *{text-align:center;}

/* map default */
.area_map .map_style{padding:0; border:none; border-bottom:1px solid #ccc;}
.area_map .map_style .wrap_controllers{display:none;}
.area_map .info{display:inline-block; padding:27px 0;}
.area_map{text-align:center;}
.area_map .info li *{display:inline-block;}
.area_map .info li{float:left; margin-right:50px;}
.area_map .info li em{position:relative; margin-right:26px; font-weight:800; color:#222;}
.area_map .info li em:after{content:""; position:absolute; right:-9px; bottom:8px; width:6px; height:6px; background:#cb1919;}
.area_map .info li:last-child{margin-right:0;}
.area_map .area_productList div[data-pro] .txt{padding-top: 110px;}
.area_map .area_productList div[data-pro] .txt em{line-height:1.3; margin-top:15px; font-size:41px; letter-spacing:-0.05em;}
.area_map .area_productList{margin:50px 0 50px;}

/* 이용약관 */
.area_policy{padding-top: 140px;}
.area_policy h2{padding:30px 0; font-weight:700; font-size:40px; color:#222; text-align:center;}
.area_policy h3{margin-bottom:20px; font-weight:700; font-size:17px; color:#222;}
.area_policy ul li,
.area_policy p{line-height:1.6; font-weight:300; font-size:15px; color:#666;}
.area_policy p{line-height:1.6; font-size:14px;}
.area_policy ul li{margin-bottom:8px;}
.area_policy ul li:last-child{margin:0;}
.area_policy ul li ul{margin-top:5px; margin-bottom:20px;}
.area_policy ul li ul li{margin-bottom:2px; font-size:15px;}
.area_policy .inr_policy{padding:40px 0 !important; border-bottom:1px solid #ddd;}
.area_policy .inr_policy:last-child{border:none;}

/* page ready */
.page_ready{padding:30px 0; text-align:center;}
.page_ready h6{font-size:35px; color:#222; letter-spacing:15px;}
.page_ready p{margin-top:23px; font-weight:300; color:#666;}
.page_ready div{display:inline-block; overflow:hidden; margin-top:60px;}
.page_ready a{float:left; margin-right:10px; padding:18px 65px; border:1px solid #ccc; font-weight:500; font-size:14px;}
.page_ready a:last-child{margin-right:0; color:#cb1919; border-color:#cb1919;}

/* history */
.area_history .wrap > ul > li > *{float:left; width:46%;}
.area_history .wrap > ul{position:relative; overflow:hidden; padding-top:50px;}
.area_history .wrap > ul > li > h2{position:relative; line-height:1; padding-right:4%; font-size:50px; color:#222; text-align:right; letter-spacing:-0.1rem;}
.area_history .wrap > ul > li > h2:after{content:""; position:absolute; top:20px; right:-6px; z-index:9; width:11px; height:11px; background:#cb1919;}
.area_history .wrap > ul > li > ul{margin-top:12px; padding-left:4%;}
.area_history .wrap > ul > li > ul li *{display:inline-block;}
.area_history .wrap > ul > li > ul em{margin-right:10px; font-weight:700; font-size:18px; color:#222; letter-spacing:-0.03rem;}
.area_history .wrap > ul > li{overflow:hidden; margin-bottom:110px;}
.area_history .wrap > ul > li li{margin-bottom:13px;}
.area_history .wrap > ul:before{content:""; position:absolute; top:0; left:50%; width:1px; height:100%; background:#e2e2e2;}
.area_history .wrap > ul > li:nth-child(3),
.area_history .wrap > ul > li:nth-child(3) img{position:relative; width:100%;}
.area_history .wrap > ul > li li:last-child{margin-bottom:0;}
.area_history .wrap > span{position:fixed; opacity:0.03; bottom:0; left:53%; z-index:-1; width:840px; font-weight:bold; font-size:160px; letter-spacing:-0.3rem; transform:translateX(-50%);}
.area_history .wrap > span.stopped{position:absolute; bottom:220px;}

/* 인증서 */
.area_certificate ul li{float:left; width:-webkit-calc((100%/4) - 53px); width:calc((100%/4) - 53px); margin:0 70px 50px 0;}
.area_certificate ul{overflow:hidden;}
.area_certificate ul li:nth-child(4n){margin-right:0;}
.area_certificate ul li img{display:block;position: absolute;height: 100%;left: 50%;transform: translateX(-50%);}
.area_certificate ul li i{display:block;position:relative;height: 290px;}
.area_certificate ul li i:first-child:after{content:""; position:absolute; opacity:0.05; top:0; left:0; width:100%; height:100%; background:#000;}
.area_certificate ul li i:first-child{margin-bottom:19px;}
.area_certificate ul li i:nth-child(2){display:inline-block; border-bottom:1px solid #cdc07c; font-size:14px; color:#cdc07c;}
.area_certificate ul li p{line-height:1.5;margin-top:5px;font-weight:400;font-size:18px;color:#222;letter-spacing:-0.02rem;min-height: 60px;}
.area_certificate ul li a{cursor:zoom-in;}
.area_certificate ul li b{font-size:15px; color:#cb1a1a;}
.popLayer{position:fixed; opacity:0; top:0px; left:0px; z-index:-99; width:100%; height:100%; background:rgba(0,0,0,0.5); transition:opacity 0.3s ease-out 0s;}
.popLayer > div{position:absolute; top:50%; left:50%; margin:0 auto; box-shadow:26px 18px 49px rgba(0,0,0,0.2); transform:translate(-50%, -50%);}
.popLayer.active{opacity:1; z-index:99;}
.popLayer .close{display:block;}
.hamburger{display:block; position:absolute; top:0px; right:0; z-index:9999; width:71px; height:71px; background:rgba(255,255,255,0); border:0; flex-grow:0; cursor:pointer;}
.hamburger.open{position:fixed; top:0px; right:-70px;}
.hamburger .bar{position:absolute; left:25px; width:35px; height:2px; background-color:#fff; transition:top 0.2s ease-in-out 0.2s, transform 0.2s ease-in-out 0s;}
.hamburger.open .bar{transition:top 0.2s ease-in-out 0s, transform 0.2s ease-in-out 0.2s;}
.hamburger.open .bar.top{top:50%; transform:translateY(-50%) rotate(45deg);}
.hamburger.open .bar.middle{opacity:0; transition:opacity 1ms linear 0.2s;}
.hamburger.open .bar.bottom{top:50%; transform:translateY(-50%) rotate(-45deg);}

/* company */
.area_company{text-align:center;}
.area_company .inr p{margin: 30px 0 60px;}
.area_company .inr em{position:relative; font-weight:600; font-size:26px; color:#222;}
.area_company .inr em i{font-weight:300; font-size:16px;}
.area_company .inr em img{position:absolute; top:-13px; right:-96px; z-index:-1;}
.area_company .inr > img{width:100%; max-width:1200px;}

/* 설비현황 */
.area_facility [data-fac]{margin-bottom:50px;}
.area_facility [data-fac] h4{position:relative; margin-bottom:15px; padding-left:19px; font-family:Noto Sans KR , '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; font-weight:900; font-size:23px; color:#222; letter-spacing:-0.03rem;}
.area_facility [data-fac] h4:before{content:""; position:absolute; top:13px; left:0; width:10px; height:10px; background:#cb1919;}

/* 기업부설연구소 */
.area_facility [data-fac] ul li{position:relative; padding-left:10px;}
.area_facility [data-fac] ul li *{display:inline-block;}
.area_facility [data-fac] ul li em{margin-right:5px; font-weight:700; font-size:17px; color:#222;}
.area_facility [data-fac] ul{margin-bottom:10px;}
.area_facility [data-fac] ul li:before{content:""; position:absolute; top:10px; left:0; width:3px; height:3px; background:#cb1919;}
.area_facility [data-fac] ul li:not(:last-child) em{margin-right:-20px; letter-spacing:29px;}

/* 파트너사 명칭 */
.area_partner ul li{float:left;width:-webkit-calc((100%/4) - 25px);width:calc((100%/4) - 25px);margin-right:33px;min-height: 143px;text-align:center;}
.area_partner ul{overflow:hidden;}
.area_partner ul li i{display:block; border:3px solid #ddd; transition:all 0.4s ease-out 0s;}
.area_partner ul li:nth-child(4n){margin-right:0;}
.area_partner ul li img{display:block; width:100%;}
.area_partner ul li:nth-child(4) ~ li{margin-top:40px;}
.area_partner ul li a{display:inline-block; position:relative; margin-top:17px; font-weight:500; font-size:17px; color:#444;}
.area_partner ul li a:after{}
.area_partner ul li a:after{content:""; display:inline-block; position:relative; opacity:0.5; top:-3px; width:8px; height:8px; margin-left:6px; background:url(../images/content/icon_partner.svg) no-repeat 50% 50% / cover;}

/* product */
.area_product .inr_gallery .inr{padding:20px 0 0; border:none;}
.area_product .inr_gallery .img{padding-top:64%;}
.area_product .inr_gallery:hover .img img{transform:translateY(-50%)  rotate(0.01deg);}
.area_product .be_gallery_container li:nth-child(3)~li{margin-top:20px;}
.area_product .inr_gallery .title{font-weight:800; font-size:17px;}

/* 연구실적 */
#content .area_performance table.table thead + tbody tr td{padding:18px 30px; font-weight:600; font-size:16px; color:#222; text-align:left;}
i.file_rnd{display:inline-block; position:relative; top:-2px; width:13px; height:17px; margin-left:7px; background:url(../images/board/icon_file.svg) no-repeat 50% 50% / cover; vertical-align:middle;}

/* 제품 */
.area_productList .img li i{display:block;position:relative;width:100%;height:416px;background-size: cover !important;background-position: 50% 50% !important;background-repeat: no-repeat !important;}
.area_productList .img{width:656px;}
.area_productList div[data-pro] > div{position:relative; float:left;}
.area_productList div[data-pro]{overflow:hidden;padding: 0 !important;}
.area_productList .txt{width:-webkit-calc(100% - 656px); width:calc(100% - 656px); padding-top:90px; text-align:left;}
.area_productList .txt i{display:block; margin-bottom:5px; font-weight:700; color:#cb1919; text-transform:uppercase;}
.area_productList .txt em{display:block; font-weight:600; font-size:30px; color:#222; letter-spacing:-0.045em; text-indent:-1px;}
.area_productList .txt p{padding-right:70px;}
.area_productList .bx-controls a{display:block; display:inline-block; position:relative; width:70px; height:70px; background:rgba(255,255,255,0.8); text-indent:-9999px;}

.area_productList .bx-controls{top:auto; bottom:0; width:auto;}
.area_productList .bx-controls a.bx-next{background:rgba(255,255,255,0.4);}
.area_productList .bx-controls a:after{content:""; position:absolute; top:50%; left:50%; width:8px; height:13px; background:url(../images/content/arr_product.svg) no-repeat 50% 50% / cover; transform:translateY(-50%) translateX(-50%);}
.area_productList .bx-controls a.bx-next:after{transform:translateY(-50%) translateX(-50%) rotate(180deg); -webkit-transform:translateY(-50%) translateX(-50%) rotate(180deg);}
.area_productList .txt span{display:block; position:relative; width:5px; height:5px; margin:20px 0px 35px 9px; background:#cb1919;}
.area_productList .txt span:after,
.area_productList .txt span:before{content:""; position:absolute; top:0; width:5px; height:5px; background:#cb1919;}
.area_productList .txt span:after{left:9px;}
.area_productList .txt span:before{left:-9px;}
.area_productList{overflow:hidden;}

.area_productSub{background-repeat:no-repeat;}
.area_productSub .area_productList div[data-pro]{padding: 60px 0px !important;border-bottom:3px solid #eee;}
.area_productSub .area_productList div[data-pro="00"]{padding-top:0;}
.area_productSub .area_productList div[data-pro]:last-child{padding-bottom:0; border:none;}
.area_productSub .area_productList div[data-pro="00"]{padding-top:0 !important;}
.area_productList .txt ul li{position:relative; padding-left:13px;}
.area_productList .txt ul li:before{content:""; position:absolute; top:13px; left:0; width:5px; height:1px; background:#8a8a8a;}

.content_script{margin-bottom:90px; padding-top:20px; text-align:center;}
.content_script > ul{display:inline-block; margin-bottom:58px;}
.content_script > ul li{display:inline-block; margin:0 1px; padding:5px 20px; background:#fff; border:3px solid #DDD; font-weight:900; font-size:15px; color:#8a8a8a; text-transform:uppercase; cursor:pointer;}
.content_script > ul li.on{color:#cb1919; border-color:#cb1919;}
.content_script .btn_info{display:inline-block; position:relative; width:32px; height:32px; background:#181818; transition:all 0.3s ease-out 0s; border-radius:100px;}
.content_script .btn_info:after,
.content_script .btn_info:before{content:""; position:absolute; top:50%; left:50%; background:#fff;}
.content_script .btn_info:after{width:12px; height:1px; margin-left:-6px;}
.content_script .btn_info:before{width:1px; height:12px; margin-top:-6px;}
.content_script .img_info{display:inline-block; position:absolute; opacity:0; visibility:hidden; top:-21px; left:50px; border:1px solid #000; box-shadow:13px 24px 37px 0px rgba(0,0,0,0.4); transition:all 0.4s ease-out 0s;}
.content_script .img_info span{display:block; position:absolute; top:25px; left:25px; font-weight:bold; font-size:17px; color:#fff; text-transform:uppercase;}
.content_script .btn_info.on{background:#cb1919;}
.content_script .car{position:relative;}
.content_script > div{position:relative; margin:0 auto;}
.content_script [data-info] *{transition:all 0.4s ease-out 0s;}
.content_script [data-info].on a{background:#cb1919;}
.content_script [data-info].on .img_info{opacity:1; visibility:visible;}

.area_car .content_script [data-info],
.area_train .content_script [data-info]{position:absolute;}
.area_car .content_script > div{width:811px;}
.area_car .content_script .car img{width:100%; max-width:811px;}
.area_car .content_script [data-info="01"]{top:21%; left:16%;}
.area_car .content_script [data-info="02"]{top:39%; right:16%;}
.area_car .content_script [data-info="03"]{top:64%; right:26%;}
.area_car .content_script [data-info="04"]{top:2%; right:14%;}
.area_car .content_script [data-info="05"]{top:21%; right:39%;}
.area_car .content_script [data-info="01"] .img_info{right:47px; left:auto;}

.area_train .content_script .car img{max-width:1102px;}
.area_train .content_script [data-info="01"]{bottom:7%; left:36%;}
.area_train .content_script [data-info="02"]{bottom:22%; left:56%;}
.area_train .content_script [data-info="03"]{top:47%; right:32%;}
.area_train .content_script .btn_info{background:#666;}
.area_train .content_script [data-info="01"] .img_info{top:auto; right:50px; bottom:-60px; left:auto;}
.area_train .content_script [data-info="03"] .img_info{top:auto; bottom:-30px;}

/* 기업부설연구소*/
#content .area_rnd table.table tbody tr th:first-child{background:#fff; font-weight:700; color:#222; border-right-color:#ddd;}

.area_rnd .inr > em{display:inline-block;position:relative;line-height:1.2;font-weight:900;font-size: 66px;color:#cb1919;letter-spacing: -0.07rem;}
.area_rnd .inr{overflow:hidden;margin: 60px auto 70px;text-align:center;max-width:1000px;}
.area_rnd .inr ul li{position:relative; float:left; width:25%; padding-top:55px;}
.area_rnd .inr ul{position:relative; float:left; width:100%; margin-top:65px;}
.area_rnd .inr ul li img{display:block; height:63px; margin:0 auto;}
.area_rnd .inr ul:before{content:""; position:absolute; top:-40px; left:50%; width:1px; height:40px; background:#ccc;}
.area_rnd .inr ul li:before{content:""; position:absolute; top:0; left:0; width:100%; height:1px; background:#ccc;}
.area_rnd .inr ul li:nth-child(1):before,
.area_rnd .inr ul li:nth-child(4):before{width:50%;}
.area_rnd .inr ul li:nth-child(1):before{right:0; left:auto;}
.area_rnd .inr ul li:after{content:""; position:absolute; top:0; left:50%; width:1px; height:36px; background:#ccc;}
.area_rnd .inr ul li em{display:block; margin-top:22px; font-weight:600; font-size:18px; color:#222;}

.pop_rnd{position:fixed; opacity:0; visibility:hidden; top:0; left:0; z-index:99999; width:100%; height:100%; transition:opacity 0.3s ease-out 0s;}
.pop_rnd:before{content:""; position:absolute; opacity:0.4; top:0; left:0; width:100%; height:100%; background:#000;}
.pop_rnd > div{position:absolute; top:50%; left:50%; width:70%; margin:0 auto; box-shadow:26px 18px 49px rgb(0 0 0 / 20%); transform:translate(-50%, -50%);}
.pop_rnd img{width:100%;}
.pop_rnd .hamburger.open{right:-63px;}
.pop_rnd .inr{height:70vh; overflow-y:scroll;}
.pop_rnd .hamburger.open .bar{height:4px;}
.pop_rnd.open{opacity:1; visibility:visible;}


/* .e-book-wrap{min-height: 100vh;} */
.e-book-wrap iframe{min-height: 187vh; width: 100%;}

@media screen and (max-width:1919px){

}

@media screen and (max-width:1680px){
	.sub #content div[class^="area_"] .wrap{}
}

@media screen and (max-width:1580px){
	.lnb h2{font-size:40px;}

	.btn_contact{width:270px; background-position:100% 100%;}
	.btn_contact em{font-size:17px;}
	
	.area_subVisual{height:397px;}
}
@media screen and (max-width:1380px){

}

@media screen and (max-width:1280px){
	.sub #content{width:100%;}

	.area_navigation{position:relative; float:right; top:0; right:0; margin-top:30px; margin-right:14px;}
	
	.area_subVisual{height:357px;}
	.area_subVisual h2{padding-top:145px;}

	.lnb{position:relative; width:100%; height:auto; border-bottom:1px solid #eee;}
	.lnb .wrap{margin-top:0; padding:0;}
	.lnb .wrap.fix{position:relative;}
	.lnb h2,
	.lnb h2 + i{position:absolute; top:-350px; left:0; z-index:99999; width:100%; padding:0; color:#fff; text-align:center;}
	.lnb h2{font-size:48px;}
	.lnb h2 + i{top:-270px;}
	.lnb ul{overflow:hidden; margin-top:0;}
	.lnb ul li{display:inline-block; margin-bottom:0;}
	.lnb ul li a{}
	.lnb h2{top:-240px;}
	.lnb h2 + i{top:-170px;}
	.lnb ul li.active a:after{}
	
	.btn_contact{display:none;}

	.area_train .content_script .car img{width:100%;}
	.area_train .content_script [data-info="03"]{right:30%;}

	.content_script .img_info img{height:160px;}
	.content_script .img_info span{top:13px; left:14px; font-size:15px;}

	.area_car .content_script .img_info img{height:110px;}	

	.area_certificate ul li{width:-webkit-calc(32% - 5px); width:calc(32% - 5px); margin:0 21px 21px 0;}
	.area_certificate ul li:nth-child(4n){margin-right:21px;}
	.area_certificate ul li:nth-child(3n){margin-right:0;}
}

@media screen and (max-width:1023px){

	.e-book-wrap iframe{min-height: 100vh; width: 100%;}


	.sub #content div[class^="area_"] .wrap{width:auto; margin:0 30px;}
	.sub #content div[class^="area_"]:not(.area_subVisual) > div{padding:70px 0;}

	h3[data-tit]{font-size:31px;}

	.area_subVisual{height:307px; margin-top:73px;}
	.area_subVisual h2{padding-top:135px; font-size:45px;}
	.area_subVisual i{font-size:20px;}

	.lnb ul li{margin:0 27px; padding:16px 0;}
	.lnb ul li a:after{bottom:-16px;}

	.area_partner ul li{width:-webkit-calc((100%/3) - 9px); width:calc((100%/3) - 9px); margin-right:13px;}
	.area_partner ul li:nth-child(4n){margin-right:13px;}
	.area_partner ul li:nth-child(3n){margin-right:0;}
	.area_partner ul li:nth-child(3) ~ li{margin-top:20px;}
	.area_partner ul li a{margin-top:8px; font-size:16px;}

	.content_script [data-info] .img_info{text-align:left;}
	.content_script [data-info].on .img_info{z-index:9;}
	
	.area_train .content_script [data-info="01"] .img_info{top:-170px; right:-40px; bottom:auto; left:auto;}
	.area_train .content_script [data-info="02"] .img_info{top:37px; right:auto; left:-30px;}
	.area_train .content_script [data-info="03"] .img_info{top:40px; bottom:auto; left:-40px;}

	.content_script [data-info].on .img_info{opacity:1; visibility:visible; z-index:9;}
	.content_script [data-info="04"] .img_info{top:40px; left:-40px;}

	.area_car .content_script [data-info="02"] .img_info{top:40px; left:-22px;}	
	.area_car .content_script [data-info="01"] .img_info{right:auto; left:45px;}

	.area_productList .img,
	.area_productList .txt{width:50%;}

	.bx-controls{left:0; width:auto;}

	.area_productList .txt{padding-top:20px;}
	.area_productList .img li i{height:286px;}
	.area_productList .bx-controls a{width:50px; height:50px;}
	.area_productList .txt em{line-height:1.2; font-size:26px;}
	.area_productList .txt i{margin-bottom:7px;}
	.area_productSub .area_productList div[data-pro]{padding:40px 0px !important;}
	
	.area_map .area_productList div[data-pro] .txt em{font-size:31px;}
	.area_map .area_productList div[data-pro]{padding:0 !important;}
}

@media all and (max-width:890px){
	.area_car .content_script > div{width:100%;}
}

@media all and (min-width:768px){
	.area_subVisual > *{color:#fff;}
}

@media all and (max-width:767px){
	.sub #content div[class^="area_"] .wrap{margin:0 15px;}
	.sub #content div[class^="area_"]:not(.area_subVisual) > div{padding:50px 0;}
	
	h3[data-tit]{margin-bottom:7px; font-size:21px;}
	h3[data-tit] + p{margin-bottom:20px;}

	.area_subVisual{height:267px;}
	.area_subVisual *{color:#fff;}
	.area_subVisual h2{padding-top:66px; font-size:27px;}
	.area_subVisual{height:177px;}
	.area_subVisual i{margin-top:4px; font-size:16px;}

	.lnb > div{margin:0; padding:0; overflow-x:scroll; overflow-y:hidden;}
	.lnb ul{display:table; margin:0 auto; margin-top:0;}
	.lnb ul li{display:table-cell; float:none; padding:0; white-space:nowrap;}
	.lnb ul li a{padding:13px 13px;}
	.lnb ul li a{font-size:13px;}
	.lnb ul li a:after{bottom:-1px;}
	
	.area_policy{margin-top:20px !important;}
	.area_policy h2{padding:0px 0; font-weight:600; font-size:20px;}
	.area_policy h3{margin-bottom:10px; font-weight:600; font-size:14px;}
	.area_policy ul li{margin-bottom:5px;}
	.area_policy ul li ul{padding-left:10px;}
	.area_policy ul li ul li{font-size:13px;}
	.area_policy ul li,
	.area_policy p{line-height:1.7; font-size:13px;}
	.area_policy .inr_policy{padding:25px 0;}
	
	.page_ready{padding:45px 0; text-align:center;}
	.page_ready h6{font-size:27px; letter-spacing:0;}
	.page_ready a{margin-right:5px; padding:12px 35px; font-size:13px;}
	.page_ready div{margin-top:40px;}
	.page_ready p{margin:3px 30px 0; font-weight:300; font-size:13px; color:#666;}
	.page_ready p br{display:none;}

	.area_certificate > ul li{width:-webkit-calc((100%/2) - 5px); width:calc((100%/2) - 5px); margin:0 10px 25px 0;}
	.area_certificate > ul li:nth-child(2n){margin-right:0;}
	.area_certificate ul li i:first-child{margin-bottom:9px;}
	.area_certificate ul li p{font-weight:800; font-size:14px; word-break:break-all; min-height:auto;}
	.area_certificate ul li p b{font-size:12px;}

	.popLayer > div{width:60%;}
	.popLayer > div img{width:100%;}

	.hamburger{width:48px; height:22px;}
	.hamburger .bar{width:25px;}
	.hamburger.open{right:-35px;}

	.area_certificate ul li{width:-webkit-calc((100%/2) - 5px); width:calc((100%/2) - 5px); margin:0 10px 25px 0;}
	.area_certificate ul li:nth-child(2n){margin-right:0 !important;}
	.area_certificate ul li i:first-child{margin-bottom:9px;}
	.area_certificate ul li p{margin-top:2px; font-weight:800; font-size:14px; word-break:break-all; min-height:auto;}
	.area_certificate ul li p b{font-size:12px;}
	.area_certificate ul li:nth-child(3n){margin-right:10px;}

	.popLayer > div{width:60%;}
	.popLayer > div img{width:100%;}

	.area_history .wrap > ul > li > *{width:100%;}
	.area_history .wrap > ul > li > h2{text-align:left;}
	.area_history .wrap > ul:before{left:3px;}
	.area_history .wrap > ul > li > h2{padding:0 0 0 20px; font-size:26px;}
	.area_history .wrap > ul > li > h2:after{top:8px; right:auto; left:0; width:7px; height:7px;}
	.area_history .wrap > ul > li li{margin-bottom:8px;}
	.area_history .wrap > ul > li > ul{margin-top:16px; padding-left:19px;}
	.area_history .wrap > ul > li > ul em{line-height:1.3; font-size:16px; vertical-align:top;}
	.area_history .wrap > ul > li > ul li p{width:70%;}
	.area_history .wrap > ul{padding-top:20px;}
	.area_history .wrap > ul > li{margin-bottom:50px;}
	.area_history .wrap > span{display:none;}

	.area_partner ul li{width:-webkit-calc((100%/2) - 4px); width:calc((100%/2) - 4px); margin-right:7px;}
	.area_partner ul li:nth-child(2) ~ li{margin-top:10px;}
	.area_partner ul li:nth-child(3n){margin-right:7px;}
	.area_partner ul li:nth-child(2n){margin-right:0;}
	.area_partner ul li a{margin-top:5px; font-size:13px;}
	.area_partner ul li a:after{top:-1px;}
	.area_partner ul li{min-height:auto;}

	.area_map .info li *{text-align:left;}
	.area_map .info li p{display:block;}
	.area_map .info{display:block; text-align:left;}
	.area_map .info li{float:none; margin:0 0px 8px 0;}

	.content_script{margin-bottom:90px; padding-top:0;}
	.content_script > ul li{float:left; padding:2px 9px; border:2px solid #DDD; font-size:13px;}
	.content_script .btn_info{width:22px; height:22px;}
	.content_script .btn_info:before{height:8px; margin-top:-4px;}
	.content_script .btn_info:after{width:8px; margin-left:-4px;}
	.content_script .img_info img{height:100px;}
	.content_script .img_info span{top:10px; left:11px; font-size:11px;}

	.area_train .content_script [data-info="01"]{bottom:1%; left:34%;}
	.area_train .content_script [data-info="02"]{bottom:13%; left:53%;}
	.area_train .content_script [data-info="02"] .img_info{top:27px;}
	.area_train .content_script [data-info="03"] .img_info{top:auto; right:-60px; bottom:35px; left:auto;}
	.area_train .content_script [data-info="01"] .img_info{top:34px; right:-40px; bottom:auto; left:auto;}
	.area_train .content_script [data-info="01"] .img_info{top:25px; right:-40px; bottom:auto; left:auto;}

	.area_car .content_script .img_info img{height:70px;}
	.area_car .content_script .img_info img{height:80px;}
	.area_car .content_script [data-info="04"] .img_info{top:auto; right:0; bottom:34px; left:auto;}
	.area_car .content_script [data-info="01"] .img_info{top:auto; right:auto; bottom:30px; left:22px;}
	.area_car .content_script [data-info="02"] .img_info{top:26px; right:-30px; left:auto;}
	.area_car .content_script [data-info="03"] .img_info{top:-7px; right:26px; left:auto;}
	.area_car .content_script [data-info="05"] .img_info{top:25px; right:-11px; left:auto;}

	.area_productList .img,
	.area_productList .txt{width:100%;}
	.area_productList .txt em{line-height:1.2; font-size:18px;}
	.area_productList .txt i{margin-bottom:4px;}
	.area_productList .txt span{width:4px; height:4px; margin:16px 0px 16px 11px;}
	.area_productList .txt span:after,
	.area_productList .txt span:before{width:4px; height:4px;}
	.area_productList .txt p{padding-right:0;}
	.area_productList .txt{padding-top:0;}
	.area_productList .img{margin-top:10px;}
	.area_productList .img li i{height: 231px;}
	.area_productList .bx-controls a{width:40px; height:40px;}
	.area_productList .bx-controls a:after{width:6px; height:10px;}
	.area_productSub .area_productList div[data-pro]{padding:30px 0px !important;}
	
	.area_map .area_productList div[data-pro] .txt em{margin-top:3px; font-size:18px;}
	.area_map .area_productList div[data-pro] .txt{padding-top:0;}
	.area_map .map_style{height:310px;}
	.area_map .area_productList{margin:50px 0 20px;}
	
	.area_rnd .inr ul li img{height:38px;}
	.area_rnd .inr > em{font-size:24px;}
	.area_rnd .inr{margin: 30px auto 25px;}
	.area_rnd .inr ul{margin-top:37px;}
	.area_rnd .inr ul li:after{height:24px;}
	.area_rnd .inr ul:before{top:-26px; height:27px;}
	.area_rnd .inr ul li em{margin-top:11px; font-size:14px;}
	.area_rnd .inr ul li p{margin:0 3px; font-size:12px;}
	.area_rnd .inr ul li{padding-top:38px;}
	
	#content .area_performance table.table thead + tbody tr td{position:relative; padding:7px 13px; font-size:13px;}
	#content .area_performance table.table thead + tbody tr td:last-child{padding:7px 43px 7px 13px; font-family:Sans-serif;}
	#content table.table thead th{font-size:13px;}
	#content table.table th,
	#content table.table td{padding:10px 10px;}
	
	i.file_rnd{position:absolute; top:50%; right:0; margin-top:-9px;}
	.pop_rnd .inr{height:70vh; max-height:340px;}
	.pop_rnd .hamburger.open{top:-33px; right:0;}
	.pop_rnd > div{width:90%;}

	#content table.table tbody td{font-size:13px;}

	.area_facility [data-fac] h4{margin-bottom:11px; padding-left:13px; font-size:17px;}
	.area_facility [data-fac] h4:before{top:11px; width:6px; height:6px;}

	.area_certificate.v2 ul li i{min-height:auto;}

	.area_company .inr p br{display:none;}
	.area_company .inr em{font-size:19px;}
	.area_company .inr em i{display:block; position:relative; z-index:1; font-size:14px;}
	.area_company .inr em img{right:-116px;}


	
}
@media all and (max-width:640px){
	.area_certificate ul li img{width: 100%;}
}

@keyframes slideLeft{
	0%{opacity:0; transform:translateX(-80px); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
	100%{opacity:1; transform:translateX(0); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
}
@keyframes slideRight{
	0%{opacity:0; transform:translateX(80px); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
	100%{opacity:1; transform:translateX(0); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
}
@keyframes slideUp{
	0%{opacity:0; transform:translateY(80px); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
	100%{opacity:1; transform:translateY(0); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
}

@keyframes visualScale2{
	0%{transform:scale(1.1) rotate(.001deg);}
	100%{transform:scale(1) rotate(.001deg);}
}

@keyframes slideUp{
	0%{opacity:0; transform:translateY(50px); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
	100%{opacity:1; transform:translateY(0); transition:cubic-bezier(0.165, 0.84, 0.44, 1);}
}