@charset "utf-8";
.mainWrapper{height:auto;min-height:100%;overflow:hidden;text-align:center;padding:0;min-width:1400px}
.mainWrapper .header{position:fixed;background:transparent;border:0}
.mainWrapper .header.hover{background-color:rgba(0, 0, 0, 0.8);height:176px}
.mainWrapper .header.hover:before{content:'';display:block;position:absolute;left:0;top:96px;width:100%;height:1px;background:#fff;opacity:.1}
.mainWrapper .headArea .logo{background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/common/img_logo_w.png) no-repeat 0 0}
.mainWrapper .headArea .gnbArea{background:transparent;border-bottom:0}
.mainWrapper .headArea .gnb > li > a{color:#fff}
.mainWrapper .headArea .gnb > li > a:after{background:#fff}
.mainWrapper .headArea .gnb > li > .subDepth{background:transparent}
.mainWrapper .headArea .btnStory:before{background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/common/ico_innovation_main_w.png) no-repeat 0 0}
.mainWrapper.fixed .header{background:#fff;border-bottom:1px solid #e6e6e6;opacity:1}
.mainWrapper.fixed .headArea .logo{background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/common/img_logo.png) no-repeat 0 0}
.mainWrapper.fixed .headArea .gnbArea{border-bottom:1px solid #e6e6e6}
.mainWrapper.fixed .headArea .gnb > li > a{color:#000}
.mainWrapper.fixed .headArea .gnb > li > a:after{background:#000}
.mainWrapper.fixed .headArea .btnStory:before{background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/common/ico_innovation_main.png) no-repeat 0 0}
.mainWrapper.fixed .headArea .gnb > li > .subDepth{opacity:1}
.mainWrapper.fixed .headArea .gnb > li > .subDepth{background-color:rgba(0, 0, 0, 1)}
.mainWrapper.fixed .headArea .gnb > li > .subDepth:before{display:none}
.mainWrapper.fixed .headArea .gnbArea{background:#fff}

@media (max-width: 1024px) {
.mainVisual{width:100% !important}
}
.container{max-width:100%;width:100%} /**/
.mainVisual{display:block;position:relative;height:100%;height:100vh;width:100%;width:100vw;text-align:center}
.mainVisual .swiper-container{overflow:visible}
.mainVisual .swiper-container .swiper-wrapper{height:100%;height:100vh;min-height:100%;position:absolute;top:0;left:0; overflow:hidden}
.mainVisual .swiper-container .swiper-slide{overflow:hidden;min-height:100%;width:100%;width:100vw;min-width:1400px}
.mainVisual .swiper-container .video{height:100%;height:100vh}
.mainVisual .swiper-container .video video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;transform:translate(-50%, -50%);width:auto !important;height:auto !important}
.mainVisual .btnSlide{position:absolute;top:50%;margin-top:-35px;width:70px;height:70px;z-index:99;overflow:hidden;text-indent:-9999px;background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/main/btn_main_visual_swiper.png) no-repeat}
.mainVisual .btnSlide.prevSlide{left:17px;background-position:0 0}
.mainVisual .btnSlide.nextSlide{right:17px;background-position:-70px 0}
.mainVisual .img{height:100%;height:100vh}
.mainVisual .img img{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;transform:translate(-50%, -50%);width:auto}
.mainVisual .txt{display:table;table-layout:fixed;position:absolute;left:50%;bottom:-55%;width:1200px;height:100%;margin-left:-600px}
.mainVisual .txt strong{display:block;font-size:80px;text-align:left;line-height:1.2;color:#fff}
.mainVisual .indiWrap{position:absolute;left:0;right:0;bottom:70px;z-index:99;max-width:1920px;margin:0 auto;text-align:left}
.mainVisual .indiWrap .indiList{display:inline-block;margin-left:105px}
.mainVisual .indiWrap .indiList button{overflow:hidden;text-indent:-9999px;font:0/0 'HantKR'}
.mainVisual .indiWrap .indiList button:before{content:'';display:block;width:51px;height:6px;margin-right:5px;border:solid 1px #979797;-webkit-transform:skewX(-16deg);-ms-transform: skewX(-16deg);transform: skewX(-16deg);-webkit-transition: 1s linear;-moz-transition: 1s linear;-o-transition: 1s linear;transition: 1s linear;cursor:pointer}
.mainVisual .indiWrap .indiList button.on:before{width:81px;background-color:#fff}
.masking{position:absolute;left:-20%;top:0;width:132%;height:100%;background-color:rgba(0,0,0, 1);transform:skewX(-16deg);z-index:900;transition:0.6s ease-in-out}
.masking.show{left:-150%}
.iconScroll, .iconScroll:before{position:absolute;left:50%;z-index:100}
.iconScroll{width:22px;height:32px;margin-left:-20px;bottom:60px;margin-top:-35px;box-shadow: inset 0 0 0 1px #fff;border-radius: 20px}
.iconScroll:before{content:'';width:2px;height:6px;background:#fff;margin-left:-1px;top:4px;border-radius:2px;-webkit-animation-duration:1.5s;animation-duration:1.5s;-webkit-animation-iteration-count: infinite;animation-iteration-count:infinite;-webkit-animation-name: scroll;animation-name:scroll}

@-webkit-keyframes scroll {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
}

@keyframes scroll {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
}

.mainTxt{background:#282934;padding:50px 0}
.mainTxt .inner{text-align:center;color:#fff}
.mainTxt .inner strong{display:block;font-size:32px;margin-bottom:5px}
.mainTxt .inner p{font-size:16px}

.mainBtn{position:absolute;left:0;right:0;bottom:66px;max-width:1920px;margin:0 auto}
.mainBtn button{display:none;position:relative;z-index:100;width:25px;height:25px;text-indent:-9999px;overflow:hidden;margin-left:65px;background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/main/btn_play_stop.png) no-repeat 0 0}
.mainBtn button.btnStop{background-position:0 0}
.mainBtn button.btnPlay{background-position:0 -25px}

.mainCont01{position:relative;height:100%;padding-top:180px}
.mainCont01 .inner{position:relative;width:1380px;background:#fff;padding:0 0 200px}
.mainCont01 .inner:before{content:'';display:block;position:absolute;left:1380px;top:0;width:100%;height:100%;background:#fff;}
.mainCont01 .contInner{display:table;width:100%;table-layout:fixed}
.mainCont01 .contInner > div{display:table-cell;vertical-align:top}
.mainCont01 .contInner .img{width:800px}
.mainCont01 .contInner .contTitle{display:block;position:relative;font-size:60px;font-weight:600;line-height:1.1;letter-spacing:-0.4px} /* 20180812 수정 */
.mainCont01 .contInner .txtArea{position:relative;z-index:1;padding-left:100px}
.mainCont01 .contInner .tit{display:block;font-size:32px;line-height:1.4;margin-top:40px}
 /* 20180812 수정 */
.mainCont01 .contInner .txt{font-weight:400;line-height:1.9;margin-top:20px}
.mainCont01 .contInner .txt02{margin-top:40px}
.mainCont01 .contInner .txt02 li+li{margin-top:3px}
.mainCont01 .contInner .txt02 li span{display:block;position:relative;font-weight:400;color:#666;padding-left:13px}
.mainCont01 .contInner .txt02 li span:before{content:'';display:inline-block;position:absolute;left:2px;top:13px;width:5px;height:1px;background:#666}
 /* 20180812 수정 */
.mainCont01 .contInner.type01 .contTitle{margin-left:-200px}
.mainCont01 .contInner + .contInner{margin-top:160px}

.mainCont02{position:relative;overflow:hidden;text-align:left}
.mainCont02 .bg{display:table;position:relative;width:100%;background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/main/bg_main_vision.jpg);background-size:cover;background-position:50% 50%;height:730px;background-attachment:fixed}
.mainCont02 .txtArea{position:absolute;left:50%;top:0;z-index:10;width:1200px;margin:0 auto;padding:0 10px;color:#fff;margin-left:-600px}
.mainCont02 .txtArea .depthTitle{display:block;font-size:18px;color:#f37938;margin-bottom:35px}
.mainCont02 .txtArea .txtInner{display:table-cell;height:730px;vertical-align:middle}
.mainCont02 .txtArea .largeTxt{font-size:60px;line-height:1.2}
.mainCont02 .txtArea .smallTxt{margin-top:35px;font-weight:400;line-height:1.9}

.mainCont03{background:#f5f5f5;padding:80px 0}
.mainCont03 .inner{position:relative}
.mainCont03 .depthTitle{display:block;font-size:32px;margin-bottom:13px}
.mainCont03 .txt{line-height:1.9;font-weight:400}
.mainCont03 .mainSupport{position:absolute;left:600px;top:7px;}
.mainCont03 .mainSupport > li{font-size:18px;font-weight:400;margin-top:15px}
.mainCont03 .mainSupport > li b{display:inline-block;margin-right:15px}
.mainCont03 .mainSupport > li:first-child{margin-top:0}
.mainCont03 .mainSupport > li a{border-bottom:1px solid #000}

/* common */
/* recently_story */
.recently_story{background:#fff;padding-bottom:140px}
.recently_story .inner{position:relative;max-width:1180px;margin:0 auto;padding:80px 0 0}
.recently_story .sec_tit{display:block;text-indent:-9999px;width:330px;height:30px;background:url(https://cdn.hankook-engineeringworks.com/static/assets/img/ko/pc/main/tit_tim.png) no-repeat 0 0;background-size:100% auto}
.recently_story .list {position:relative;height:1120px;margin-top:20px}
.recently_story .list > li{position:absolute;width:380px}
.recently_story .list > li a{display:block;position:relative;overflow:hidden}
.recently_story .list > li a .thumb{position:relative;width:100%;overflow:hidden}
.recently_story .list > li a .thumb img{/*position:absolute;top:0;left:0;width:100%;*/-webkit-transition:0.3s ease-out;-moz-transition:0.3s ease-out;-o-transition:0.3s ease-out;transition:0.3s ease-out}
.recently_story .list > li a:hover img{transform:scale(1.1)}
.recently_story .list > li .tit{position:absolute;left:0;bottom:52px;padding:0 40px;width:380px}
.recently_story .list > li .tit strong{display:block;padding-top:13px;font-size:24px;line-height:34px;word-break:keep-all;color:#fff}
.recently_story .list > li.type01{left:0;top:0}
.recently_story .list > li.type02{left:400px;top:0}
.recently_story .list > li.type03{left:800px;top:0}
.recently_story .list > li.type04{left:0;top:650px}
.recently_story .list > li.type05{left:400px;top:510px}
.recently_story .list > li.type06{left:800px;top:650px}
.recently_story .list > li.type01, .recently_story .list > li.type01 > a, .recently_story .list > li.type03, .recently_story .list > li.type03 > a, .recently_story .list > li.type05, .recently_story .list > li.type05 > a{height:620px}
.recently_story .list > li.type02, .recently_story .list > li.type02 > a, .recently_story .list > li.type04, .recently_story .list > li.type04 > a, .recently_story .list > li.type06, .recently_story .list > li.type06 > a{height:480px}
.recently_story .titArea{position:relative}
.recently_story .more{position:absolute;right:0;bottom:-5px;margin:0;width:150px;height:48px;overflow:hidden;border-bottom:0;cursor:pointer}
.recently_story .more:hover a{width:100%;height:100%;font-size:18px;line-height:48px}
.recently_story .more a{display:block;width:0;height:0;font-size:0;-webkit-transition:0.3s ease-in-out;-moz-transition:0.3s ease-in-out;-o-transition:0.3s ease-in-out;transition:0.3s ease-in-out;overflow:hidden;text-align:left}
.recently_story .more:after{content:'';display:inline-block;position:absolute;right:0;top:0;width:48px;height:48px;z-index:2;vertical-align:middle;background-color:transparent;background-image:url(https://cdn.hankook-technologygroup.com/static/assets/img/ko/pc/content/btn_arrow.png);background-repeat:no-repeat;background-position:0 0;-webkit-transition:0.3s ease-in-out;-moz-transition:0.3s ease-in-out;-o-transition:0.3s ease-in-out;transition:0.3s ease-in-out}

/* hashtag popup */
.no-scroll { overflow: hidden; height: 100%; margin-left: -17px\9; }
.a11y_sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; border: 0; }
.layer_body { position: fixed; z-index: 10000; top: 0; left: 0; visibility: hidden; width: 100%; height: 100%; }
.layer_body[role="dialog"] { display: block; }
.layer_overlay { position: fixed; z-index: 9000; top: 0; left: 0; width: 100%; height: 100%; visibility: hidden; opacity: 0; transition: visibility 0s ease 0.3s, opacity 0.3s ease; }
.layer_container { width: 100%; height: 100%; }
.layer_overlay { background-color: rgba(0, 0, 0, 0.4); }
.layer_wrap { position: absolute; z-index: 10000; top: 50%; right: 50%; width: 100%; max-width: 600px; transform: translate(50%, -50%); background-color: #fff; transition: visibility 0.3s 0.12s, opacity 0.3s 0.12s; opacity: 0; }
.layer_header { position: relative; background-color: #fff; padding: 48px 40px 24px; }
.layer_header .layer_title { font-size: 32px; line-height: 48px; text-align: center; margin: 0;}
.layer_header .layer_title span { display: block; font-weight: inherit; font-size: 14px; line-height: 24px; }
.layer_header .desc { margin-top: 16px; margin-bottom: 46px; font-size: 14px; line-height: 24px; font-weight: 400; text-align: center; }
.layer_close { top: 24px; right: 24px; padding: 1.125em; color: #aaa; background: none; border: 0; text-indent: -9999px; position: absolute; display: inline-block; width: 48px; height: 48px; }
.layer_close:before, .layer_close:after { content: ''; position: absolute; top: 50%; left: 50%; width: 36px; height: 4px; background-color: #000; }
.layer_close:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }
.layer_close:after { -webkit-transform: translate(-50%, -50%) rotate(135deg); transform: translate(-50%, -50%) rotate(135deg); }
.layer_content { padding: 0 24px 24px; }
.layer_body.is-visible { visibility: visible; }
.layer_body.is-visible > .layer_overlay, .layer_body.is-visible > .layer_container { opacity: 1; visibility: visible; transition-delay: 0s; }
.layer_body.is-visible > .layer_container { overflow: auto; -webkit-overflow-scrolling: touch; }
.layer_body.is-visible > .layer_container > .layer_wrap { opacity: 1; }
.layer_body.type_full .layer_wrap { top: 0; right: 0; max-width: 100%; height: 100%; border-top-width: 0; overflow-y: scroll; transform: translate(0, 0); }
.layer_body.type_full .layer_wrap .layer_header { padding: 12px 0 8px; }
.layer_body.type_full .layer_wrap .layer_content { max-width: 1180px; margin: 0 auto; padding: 0 0 12px; }
.pop_hashtag.type_full .layer_wrap { overflow-y: hidden; }
.pop_hashtag.type_full .layer_wrap .layer_header { padding: 0; }
.pop_hashtag.type_full .layer_wrap .layer_content { padding: 104px 0 0; }
.pop_hashtag.type_full .row, .pop_hashtag.type_full .layer_content { height: 100%; }
.pop_hashtag.type_full .tag_area { width: 30.5%; float: left; height: 100%; text-align: left; }
.pop_hashtag.type_full .tag_area > div { height: calc(100% - 180px); overflow-y: scroll; }
.pop_hashtag.type_full .tag_area strong { display: block; font-size: 48px; line-height: 64px; margin-bottom: 34px; }
.pop_hashtag.type_full .thumb_area { width: 66%; float: right; height: 100%; overflow-y: scroll; padding-bottom: 50px; }
.pop_hashtag.type_full .thumb_area .hash_story { position: relative; width: calc(100% + 20px); margin-left: -20px; }
.pop_hashtag.type_full .thumb_area .hash_story li { position: relative; width: calc(50% - 20px); margin-bottom: 32px; margin-left: 20px; float: left; }
.pop_hashtag.type_full .thumb_area .hash_story li .title { margin-top: 16px; font-size: 18px; line-height: 28px; text-align:left; }
.pop_hashtag.type_full .thumb_area .hash_story li .pic img { width:100%; }
.pop_hashtag.type_full .thumb_area .hash_story li:nth-child(3n) { width: calc(100% - 20px); }
.pop_hashtag.type_full .thumb_area .hash_story li:nth-child(3n) .title { position: absolute; top: 50%; left: 50%; width: 70%; text-align: center; transform: translate(-50%, -50%); color: #fff; font-size: 32px; line-height: 48px; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.pop_hashtag.type_full .thumb_area .hash_story li:nth-child(3n) .pic:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; background: rgba(0, 0, 0, 0.6); top: 0; left: 0; }
.tags > li { display: inline-block; margin-bottom: 8px; }
.tags > li a { display: block; position: relative; margin: 0 2px; padding: 0 20px; border: 1px solid #ccc; height:36px; line-height:36px; font-size: 12px; color: #000; background-color: #fff; transition: color 0.5s ease-in-out; overflow: hidden; z-index: 1; }
.tags > li a:before { content: ""; position: absolute; top: 0; left: -150%; background-color: #000; width: 130%; height: 100%; -webkit-transform: skewX(-16deg); -ms-transform: skewX(-16deg); transform: skewX(-16deg); transition: all 0.5s ease-in-out; z-index: -1; }
.tags > li a:hover { color: #fff; }
.tags > li a:hover:before { left: -10%; transform: skewX(-16deg); -webkit-transform: skewX(-16deg); -ms-transform: skewX(-16deg); }

.more{display:inline-block;font-size:18px;line-height:20px;margin-top:50px;border-bottom:1px solid #000}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.no-scroll { margin-left: -17px; }
}
@media (max-width: 1180px) {
.layer_body.type_full .layer_wrap .layer_content { max-width: 940px; }
}

/* 메인 팝업 계열사 공통 적용 */
.layPopup{position:absolute;top:12px;left:12px;margin:0;z-index:9999999}
.layPopup.layerL{width:720px}
.layPopup.layerL .layCont{max-height:652px;overflow-y:auto;overflow-x:hidden;padding:0}
.layPopup.layerL .layCont:after{display:none}
.layPopup .pop_footer{position:relative;width:100%;padding:14px 24px;border-top:1px solid #ededed;text-align:left}
.layPopup .pop_footer .btn_close{float:right;font-size:16px;font-weight:400;color:#666}

/* 커튼팝업 */
#bannerTop{position:relative;z-index:99999;min-width:1400px}
.banner_top{position:absolute;top:0;z-index:9999;width:100%;overflow:hidden;text-align:center;background:#212121}
.banner_top .pop_content{color:#fff}
.banner_top .pop_close:before, .banner_top .pop_close:after{background-color:#fff}
.banner_top .pop_footer{position:absolute;right:0;bottom:0;padding:16px 24px;color:#fff}
.banner_top .pop_close{padding:15px;color:#aaa;background:none;border:0;text-indent:-9999rem;position:absolute;display:inline-block;width:48px;height:48px;right:8px;top:8px}
.banner_top .pop_close:before, .banner_top .pop_close:after{content:'';position:absolute;top:50%;left:50%;width:29px;height:2px;background-color:#000}
.banner_top .pop_close:before{-webkit-transform: translate(-50%, -50%) rotate(45deg);transform: translate(-50%, -50%) rotate(45deg)}
.banner_top .pop_close:after{-webkit-transform: translate(-50%, -50%) rotate(135deg);transform: translate(-50%, -50%) rotate(135deg)}
.banner_top .pop_close:before, .banner_top .pop_close:after{background:#fff}

.footer{min-width:1400px}