@charset "utf-8";
@import url("/Fonts/font.css");
/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, textarea, button,
article, aside, canvas, details, embed, figure, figcaption, footer, header, menu,
nav, output, ruby, section, summary, time, mark, audio, video
{ margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure, footer, header, menu, nav, section { display: block;}
html {height:auto;-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none; }
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content:none;}
table {border-collapse:collapse;border-spacing:0;}
a {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}
legend, caption, hr {display:none;}
em {font-style:normal;}
img {vertical-align:top;max-width: 100%;}
input {vertical-align:middle;} 
p,h3,h2,h1{letter-spacing: normal;}
input,textarea,button,select{ font-family: sans-serif; }
section{width:100%;text-align: center;}
body{ font-family:'Arial';width: 100%;height: 100%;min-width:1200px;min-height: 600px; color:#333333;background-color: #f0f0f0;-webkit-font-smoothing: antialiased;}
button{cursor: pointer}
button,select,input{ font-family:'Arial';-webkit-appearance: none;border: 0;background: transparent;}
video{object-fit: cover;}
ol, ul,li { list-style: none; }
.dimmed{position: fixed;top:0;right:0;bottom:0;left:0;background: #fff;z-index: 999;width: 100%;height: 100%;opacity: 1;visibility: visible;}
.eng{font-family: 'Arial';background-color: transparent; -webkit-font-smoothing: antialiased;}
.ir_text {text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}
.ir_text >*{text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}
#skipTo {width: 100%; overflow: hidden; position: relative; z-index: 1000;}
#skipTo a {margin: 0px -1px -1px 0px; width: 1px; height: 1px; text-align: center; line-height: 0; overflow: hidden; font-size: 0px; display: block;}
#skipTo a:focus {background: rgb(32, 38, 44); margin: 0px; padding: 8px 0px 0px 15px; width: auto; height: 20px; color:#ffffff; line-height: 1; font-size: 12px; font-weight: 700;}
#skipTo a:hover {background: rgb(32, 38, 44); margin: 0px; padding: 8px 0px 0px 15px; width: auto; height: 20px; color:#ffffff; line-height: 1; font-size: 12px; font-weight: 700;}
#skipTo a:active {background: rgb(32, 38, 44); margin: 0px; padding: 8px 0px 0px 15px; width: auto; height: 20px; color:#ffffff; line-height: 1; font-size: 12px; font-weight: 700;}

#wrap{  min-width: 1200px;max-width: 2000px;margin: 0 auto;}
#header{position: absolute;top:0;left:0;right:0;min-width:1083px;}
#gnb .navi:before {
    content: "";
    position: absolute;
    top: 0;bottom:0;
    left: 0;right:0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
    background: rgba(0, 0, 0, 0.75);
    visibility: hidden;
}

#misc_btns{position: relative;overflow: hidden; max-width: 1200px;margin: 0 auto;padding: 28px 0 12px;z-index: 999;opacity: 1;}
#misc_btns a{position: relative;display: inline-block;font-size: 10px;color: #fff;line-height: 12px;padding: 0 11px;letter-spacing:0.6px;font-weight: bold;}
#misc_btns a:before{content: '';position: absolute;top:0;bottom:0;left:0;width: 1px;background: #fff;opacity: 0.3}
#misc_btns a:first-child:before{content: none;}
#misc_btns .left_area{float: left;font-size: 0;letter-spacing: 0;word-spacing: 0;}
#misc_btns .left_area a{font-size: 11px;letter-spacing: 0;line-height: 12px;  font-weight: bold;}
#misc_btns .right_area{float: right;font-size: 0;letter-spacing: 0;word-spacing: 0;}
#gnb{position: relative;  top: 0;text-align: center;width:100%;margin: 0 auto;z-index: 999;min-height: 70px;}
#gnb .navi{min-width:1200px;position: absolute;left:0;right: 0;top:0;  width: 100%;height:70px; background-color: #ffffff;max-width: 1200px;margin: 0 auto;font-size: 0;letter-spacing: 0;word-spacing: 0;}
#gnb .navi:after{content:none;}
#gnb .navi .center{position:relative;max-width: 1180px;margin: 0 auto;display: inline-block;vertical-align: top;}
#gnb .navi .center> .center_inner{  position: relative; min-width: 1060px;}
#gnb .navi .center> .center_inner>*{display: inline-block; vertical-align: top;}
#gnb .navi .btn_left{left:0;top:0;bottom:0;z-index: 1000; width: 8px;height:70px;font-size: 15px;position: absolute;top: 0;left: 0; }

#gnb .navi .btn_right{right:0;top:0;bottom:0;z-index: 1000;width: 8px;height:70px;font-size: 15px;position: absolute;top: 0;right: 0;}
#gnb .navi .btn_left{display: block;  background: #f1732f;}
#gnb .navi .btn_right{display: block; background: #e91f3e;}
#gnb .navi .btn_left:hover{background-position:center center;}
#gnb .navi .btn_right:hover{background-position:center center;}


#gnb .navi ul.depth1{position: relative;font-size: 0;letter-spacing: 0;word-spacing: 0;margin: 0 auto;}
#gnb .navi ul.depth1 > li{display:inline-block; vertical-align: top;font-size:14px;margin: 0 20px;padding: 0 5px;font-weight: 700;}
#gnb .navi ul.depth1 > li > a{position: relative;display: block;color: #4a4a4a;height: 70px;line-height: 71px;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
#gnb .navi ul.depth1 > li > a:hover, #gnb .navi ul.depth1 > li > a.on{color: #ff4311;}
#gnb .navi ul.depth1 > li:first-child > a:before{content: none;}
#gnb .navi ul.depth1 > li > a:after{content: none;}
#gnb .navi ul.depth1 > li.research > a{padding: 0 10px;}
#gnb .navi .logo{width: 300px;margin: 0 25px;}
#gnb .navi .logo > a{position: relative;display: block;color: #333333;height: 70px;padding: 19px 0;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}

#gnb .navi .logo > a:before{content: '';position: absolute;left:0;top:27px;bottom:27px;width: 1px;background:#e9e9e9; }
#gnb .navi .logo > a:after{content: '';position: absolute;right:0;top:27px;bottom:27px;width: 1px;background:#e9e9e9; }
#gnb .navi .logo img{max-width: 227px;}

#gnb .navi ul.depth1 > li .depth2{visibility: hidden;position:absolute;left:0;width:180px;background-color:#fff;opacity: 0;z-index:1;padding:20px 0;box-sizing: border-box;-webkit-box-sizing: border-box;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;font-size: 12px;line-height: 14px;font-weight: 700;
}

#gnb .navi ul.depth1 > li .depth2 > li{display: block;position:relative;width: 100%;opacity:0;
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform:translateY(-10px);
}


#gnb .navi ul.depth1 > li .depth2 > li > a{display: inline-block;position:relative;vertical-align:middle;z-index: 1;padding: 5px 0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
#gnb .navi ul.depth1 > li .depth2 > li > a:before{content: '';position: absolute;left:0;right:0;bottom:4px;height: 1px; background: #ff4311;opacity: 0;}
#gnb .navi ul.depth1 > li .depth2.depth_company{left:-35px;}
#gnb .navi ul.depth1 > li .depth2.depth_business{left:90px;}
#gnb .navi ul.depth1 > li .depth2.depth_sustainability{left:-12px;}
#gnb .navi ul.depth1 > li .depth2.depth_support{left:235px;}


#gnb .navi ul.depth1 > li:hover, #gnb .navi ul.depth1 > li.on{color: #333333;}
#gnb .navi ul.depth1 > li:hover .depth2{visibility: visible;opacity: 1;z-index:3;}
#gnb .navi ul.depth1 > li.on .depth2{visibility: visible;opacity: 1;z-index:2;}
#gnb .navi ul.depth1 > li:hover .depth2, #gnb .navi ul.depth1 > li.on .depth2{border-top:1px solid #ff4311;}
#gnb .navi ul.depth1 > li:hover .depth2 > li, #gnb .navi ul.depth1 > li.on .depth2 > li{opacity:1; -webkit-transform: translateY(0px);-moz-transform: translateY(0px);-ms-transform: translateY(0px);transform:translateY(0px);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
#gnb .navi ul.depth1 > li .depth2 > li a:hover
,#gnb .navi ul.depth1 > li .depth2 > li a.on{color:#ff4311;display: inline-block}
#gnb .navi ul.depth1 > li .depth2 > li > a:hover:before
,#gnb .navi ul.depth1 > li .depth2 > li > a.on:before{opacity: 1;}


#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(1), #gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(1){transition-delay: 0.1s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(2), #gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(2){transition-delay: 0.2s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(3),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(3){transition-delay: 0.3s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(4),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(4){transition-delay: 0.4s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(5),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(5){transition-delay: 0.5s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(6),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(6){transition-delay: 0.6s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(7),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(7){transition-delay: 0.7s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(8),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(8){transition-delay: 0.8s;}
#gnb .navi ul.depth1 > li:hover .depth2 > li:nth-child(9),#gnb .navi ul.depth1 > li.on .depth2 > li:nth-child(9){transition-delay: 0.9s;}



/* 스크롤시 */
#gnb.scroll{position: fixed;max-width: none;}
#gnb.scroll .navi{max-width: 2000px;width:100%;}
#gnb.scroll .navi:after{content: '';position: absolute;bottom:0;left:0;right:0;height: 1px;background: #eaeaea;}
#gnb.scroll .navi ul.depth1 > li .depth2{border-left: 1px solid #eaeaea;border-right: 1px solid #eaeaea;border-bottom: 1px solid #eaeaea;}
#wrap.media_360 #gnb{position: fixed;max-width: none;}
#wrap.media_360 #gnb .navi{max-width: 2000px;width:100%;}
#wrap.media_360 #gnb .navi:after{content: '';position: absolute;bottom:0;left:0;right:0;height: 1px;background: #eaeaea;}
#wrap.media_360 #gnb .navi ul.depth1 > li .depth2{border-left: 1px solid #eaeaea;border-right: 1px solid #eaeaea;border-bottom: 1px solid #eaeaea;}


#contents{ -webkit-transition: all 1s;
    -moz-transition: all 1s;-o-transition: all 1s;transition: all 0.5s ease-out;}
#contents:before {
    content: "";
    position: absolute;
    top: 0;bottom:0;
    left: 0;right:0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0, 0, 0, 0.75);
    visibility: hidden;
    -webkit-transition: opacity 800ms cubic-bezier(0.645, 0.045, 0.095, 1.08);
    -moz-transition: opacity 800ms cubic-bezier(0.645, 0.045, 0.095, 1.08);
    transition: opacity 800ms cubic-bezier(0.645, 0.045, 0.095, 1.08);
}



#footer{ position: relative;width: 100%;  clear: both; max-width: 2000px;  min-width: 1083px;margin: 0 auto; background: #2d2d2d;color: #b7b7b7;}
#footer .footer_left {float: left;font-size: 0;letter-spacing: 0;word-spacing: 0;}
#footer .footer_right {float: right;}
#footer .footer_top{position:relative;height: 30px;max-width: 1080px; margin: 0 auto;padding: 30px 0}

#footer .footer_top .footer_left .footer_ci{display: inline-block;vertical-align: middle;padding-right: 30px;}
#footer .footer_top .footer_left .footer_link{display: inline-block;vertical-align: middle;font-size: 13px;line-height: 15px;padding-left: 20px;border-left: 1px solid #424242}
#footer .footer_top .footer_left .footer_link ul{overflow: hidden}
#footer .footer_top .footer_left .footer_link li{position: relative;float: left;padding:0 17px 0 16px }
#footer .footer_top .footer_left .footer_link li:after {content: '';width: 3px;height: 3px;display: block;position: absolute;background: #5e5e5e;top: 6px;right: 100%;border-radius: 100%;}
#footer .footer_top .footer_left .footer_link li:first-child:after {content:none;}
#footer .footer_top .footer_left .footer_link li.em{color: #fff;}
#footer .footer_top .footer_left .footer_link li a:hover{color: #fff}
#footer .footer_top .footer_left .footer_link li.em a:hover{color:#ff4311 }

#footer .footer_top .footer_right{font-size: 0;letter-spacing: 0;word-spacing: 0;}
#footer .footer_top .footer_right .sns_title{display: inline-block;vertical-align: middle;font-size: 13px;line-height: 14px; color: #999999;padding-right: 20px;border-right: 1px solid #424242;margin-right: 10px;}
#footer .footer_top .footer_right .sns_link{display: inline-block;vertical-align: middle;}
#footer .footer_top .footer_right .sns_link ul{overflow: hidden;}
#footer .footer_top .footer_right .sns_link ul li{float: left;padding-left: 10px;font-size: 0;}
#footer .footer_top .footer_right .sns_link ul li a{position:relative;letter-spacing: 0.8px;}
#footer .footer_top .footer_right .sns_link ul li a .on{position: absolute;left:0;top:0;opacity: 0;visibility: hidden;}
#footer .footer_top .footer_right .sns_link ul li a:hover .on{opacity: 1;visibility: visible;}
#footer .footer_bottom .footer_right .affiliate_link{position: absolute;right: 0px;bottom:15px; font-size: 12px;}
#footer .footer_bottom .footer_right .selectbox{display:block;position:relative;border:1px solid #626262;width:180px;float: right;  height: 23px;line-height: 25px;}
#footer .footer_bottom .footer_right .selectbox:after{display:inline-block;content:'';position:absolute;top:8px;right:13px;width:7px;height:7px;background: url('/Images/common/ico_plus.png') no-repeat center top;background-size: cover;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
#footer .footer_bottom .footer_right .selectbox.on:after{-ms-transform: rotate(45deg);-webkit-transform:rotate(45deg);transform: rotate(45deg);}
#footer .footer_bottom .footer_right .selectbox a{display: block;padding:0 18px;}
#footer .footer_bottom .footer_right ul.selectul{  letter-spacing: -0.5px;display:none;position: absolute;top:-176px;right:0;width:180px;background-color: #ffffff;border: 1px solid #626262;color: #626262; height: 175px;overflow-y: scroll;}
#footer .footer_bottom .footer_right ul.selectul li{line-height:25px;text-indent:5px;font-size: 12px;}
#footer .footer_bottom .footer_right ul.selectul li a{display: block;width:100%;}
#footer .footer_bottom .footer_right ul.selectul li a:hover{background-color:#f1732f;color:#ffffff;}
#footer .footer_bottom .footer_right .selectbox.on+ul.selectul{display:block}
#footer .clear_line{clear: both;background: #424242;width: 100%;height: 1px;}
#footer .footer_bottom{  position: relative;max-width: 1080px;margin: 0 auto;padding: 11px 0 11px;height: 78px;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}

#footer .footer_bottom .footer_left .logo{float:left;background: url("/_resource/global_images/logo/footer_logo.png") no-repeat left top;width: 67px;height: 18px;text-indent: -9999em;padding-right: 18px;}
#footer .footer_bottom .footer_left .copy{color: #666666;line-height: 20px;letter-spacing: 0.2px;font-size: 11px;  font-weight: 300;}
#footer .footer_bottom .footer_left .copy .copy_img {position:relative;top:5px;}

#footer .footer_bottom .footer_menu {display: block;overflow: hidden;padding: 12px 0 13px;}
#footer .footer_bottom .footer_menu li {float: left; position: relative;}
#footer .footer_bottom .footer_menu li:after {content: '';width: 1px;display: block;position: absolute;background: #434343;top: 0;bottom:0;margin-right: -1px;right: 100%;}
#footer .footer_bottom .footer_menu li:first-child:after {content:none;}
#footer .footer_bottom .footer_menu li a { padding: 0 10px;font-size: 12px;line-height: 13px;color: #858585;}
#footer .footer_bottom .footer_menu li:first-child a{padding-left: 0;}

#contents{background: #fff;}
.top_btn{position: relative;max-width: 2000px;}
.top_btn a{overflow: hidden;display:block;position:absolute;right:70px;bottom:50px;width:50px;height:50px;background: url(/Images/company/about/btn_top.png) no-repeat top left;background-position: 0 0;text-indent: 101%;white-space: nowrap;}
.top_btn a:hover{background-position: 0 -50px;}

.location{display:block;position: relative;padding-top:28px;color:#666666; overflow: hidden;background: #fff;}
.location ul{  max-width: 1200px;text-align: right;overflow: hidden; margin: 0 auto;font-size: 0;letter-spacing: 0;word-spacing: 0;}
.location ul li{display:inline-block;line-height:17px;font-size: 12px;text-transform:uppercase;}
.location ul li:after{content: '';display:inline-block;position:relative;top:-2px;left:0px;margin:0 10px;width:4px;height:5px;background: url(/Images/company/about/icon_arrow.png) center center;}
.location ul li:last-child:after{content:none;}
.location ul li img{margin-top:2px;}

.section{position: relative;width: 100%;  overflow: hidden;background: #fff;}


.section_top{display: block;position: relative;min-height:650px;overflow: hidden;height: 650px;/*z-index:2;*/}
.section_top.type_full{height: 100vh;}
.section_top .section_inner{position: relative;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;}
.section_top .back_container{ position: absolute;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;background: url(/Images/company/about/company_top_bg.jpg) no-repeat center;background-size: cover;/*transform: scale(1.2);*/
    /*    -webkit-transition: all 2.5s cubic-bezier(0, 0, 0.45, 0.99);
        -moz-transition: all 2.5s cubic-bezier(0, 0, 0.45, 0.99);
        -o-transition: all 2.5s cubic-bezier(0, 0, 0.45, 0.99);
        transition: all 2.5s cubic-bezier(0, 0, 0.45, 0.99);*/

}


.section_top .section_inner .text_container{position: absolute;top:50%;margin-top:-45px;width:100%;text-align: center;color:#ffffff}
.section_top .section_inner .text_container h2{font-size: 56px;line-height: 56px;font-weight: bold;text-transform:uppercase}
.section_top .section_inner .text_container h2:after{content:'';display:block;width:19px;height:1px;background-color: #ffffff;margin:20px auto 23px;}
.section_top .section_inner .text_container p{font-size: 18px;line-height: 28px;font-weight: 300;letter-spacing: 0.3px;}

.section_top .scroll_arrow{width:26px;height:26px;margin:0 auto;position: absolute;left:50%;bottom:50px;margin-left: -13px;}
.section_top .scroll_arrow .arrow{position:absolute;width:26px;height:12px;opacity: 0;}
.section_top .scroll_arrow .arrow_img{position:absolute;width:100%;height: 100%;background-image: url("/Images/common/scroll_arrow.png");background-size:26px 12px;}
.section_top .scroll_arrow .arrow:nth-child(1){
    -webkit-animation: arrow 1200ms 0s linear infinite ;
    -moz-animation: arrow 1200ms 0s linear infinite ;
    animation:  arrow 1200ms 0s linear infinite ;
}
.section_top .scroll_arrow .arrow:nth-child(2){
    -webkit-animation: arrow 1200ms 400ms linear infinite ;
    -moz-animation: arrow 1200ms 400ms linear infinite ;
    animation:  arrow 1200ms 400ms linear infinite ;
}
.section_top .scroll_arrow .arrow:nth-child(3){
    -webkit-animation: arrow 1200ms 800ms linear infinite ;
    -moz-animation: arrow 1200ms 800ms linear infinite ;
    animation:  arrow 1200ms 800ms linear infinite ;
}

@-webkit-keyframes arrow {
    0% {-webkit-transform: translate(0px, 0px);opacity: 0;}
    50% {-webkit-transform: translate(0px, 9px);opacity: 1;}
    100% {-webkit-transform: translate(0px, 18px);opacity: 0;}
}
@-moz-keyframes arrow{
    0% {-moz-transform: translate(0px, 0px);opacity: 0;}
    50% {-moz-transform: translate(0px, 9px);opacity: 1;}
    100% {-moz-transform: translate(0px, 18px);opacity: 0;}
}
@keyframes arrow {
    0% {transform: translate(0px, 0px);opacity: 0;}
    50% {transform: translate(0px, 9px);opacity: 1;}
    100% {transform: translate(0px, 18px);opacity: 0;}
}
.section_other ul{display:block;width: 100%;overflow: hidden}
.section_other ul li{display:block;float:left;position:relative;width:50%;height:203px;text-align: center;overflow: hidden;}
.section_other ul li:before{content:'';display:block;position: absolute;  width: 1100px;
    height: 224px;
    left: 50%;top:50%;
    margin:-112px 0 0 -550px;transform:scale(0.95);-webkit-transform:scale(0.95);-moz-transform:scale(0.95);
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}
.section_other ul li:before{background: url(/Images/common/link_highlight_bg.jpg) center top;}
.section_other ul li.link_about:before{background-image: url(/Images/common/link_about_bg.jpg);}
.section_other ul li.link_ci:before{background-image: url(/Images/common/link_ci_bg.jpg);}
.section_other ul li.link_highlight:before{background-image: url(/Images/common/link_highlight_bg.jpg);}
.section_other ul li.link_history:before{background-image: url(/Images/common/link_history_bg.jpg);}
.section_other ul li.link_network:before{background-image: url(/Images/common/link_network_bg.jpg);}
.section_other ul li.link_overview:before{background-image: url(/Images/common/link_overview_bg.jpg);}
.section_other ul li.link_chemical:before{background-image: url(/Images/common/link_chemical_bg.jpg);}
.section_other ul li.link_energy:before{background-image: url(/Images/common/link_enery_bg.jpg);}
.section_other ul li.link_polymer:before{background-image: url(/Images/common/link_polymer_bg.jpg);}
.section_other ul li.link_product:before{background-image: url(/Images/common/link_product_bg.jpg);}
.section_other ul li.link_she:before{background-image: url(/Images/common/link_she_bg.jpg);}
.section_other ul li.link_inno:before{background-image: url(/Images/common/link_inno_bg.jpg);}
.section_other ul li.link_sustainable:before{background-image: url(/Images/sustainability/sustainable-management/esg-bg.jpg);}
.section_other ul li.link_cooperation:before{background-image: url(/Images/common/link_cooperation_bg.jpg);}
.section_other ul li.link_compliance:before{background-image: url(/Images/common/link_compliance_bg.jpg);}
.section_other ul li.link_conduct:before{background-image: url(/Images/common/link_conduct_bg.jpg);}
.section_other ul li.link_social:before{background-image: url(/Images/common/link_social_bg.jpg);}
.section_other ul li.link_rd:before{background-image: url(/Images/common/link_rd_bg.jpg);}
.section_other ul li.link_career:before{background-image: url(/Images/common/link_career_bg.jpg);}
.section_other ul li.link_media:before{background-image: url(/Images/common/link_media_bg.jpg);}
.section_other ul li.link_support:before{background-image: url(/Images/common/link_support_bg.jpg);}
.section_other ul li.link_experience:before{background-image: url(/Images/common/link_experience_bg.jpg);}

.section_other ul li a{display: block;position: relative;width:100%;height:100%;}
.section_other ul li span{display:block;position: relative;}

.section_other ul li .title{font-size:24px;color:#fff;line-height: 24px;padding-top:75px;  font-weight: 300;letter-spacing: 0.7px;}
.section_other ul li .copy{font-size:14px;color:#ffffff;line-height: 24px;margin:10px 0;}
.section_other ul li .link{display:block;position: relative;width:25px;height:25px;font-size:0px;color:#ffffff;margin:20px auto 0;background: url(/Images/common/ico_link.png) center center;border-radius: 100%;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.section_other ul li .link:before{content:'';display:block;position: absolute;top:0;left:0;width:100%;height:100%;z-index: 0;background: url(/Images/common/ico_link_on.png) center center;background-size: cover;opacity: 0;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.section_other ul li:hover:before{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);}
.section_other ul li:hover .link{background: transparent;}
.section_other ul li:hover .link:before{opacity: 1;}


.mot2 {
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

.mot3 {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.mot4 {
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}
.mot5 {
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
.gnb_mot {
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
.fclear{
    *zoom:1
}
.fclear:after{
    display:block;
    content:"";
    clear:both;
}



.box {

    height: 70px;
    position: relative;
    color: #111;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;

}
/*.btn_left,.btn_right,.center{ -webkit-perspective: 300px;perspective: 300px;}*/
.box div {
    position: absolute;
    text-align: center;
    left: 0;
    top: 0;
    width: 8px;
    height: 70px;
    line-height: 70px;
    font-size: 0;
    transform-origin: 50% 50% -35px;
    -webkit-transform-origin: 50% 50% -35px;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: transform 1s cubic-bezier(.217,.60,.355,1);
    -moz-transition: transform 1s cubic-bezier(.217,.60,.355,1);
    transition: transform 1s cubic-bezier(.217,.60,.355,1);
}
.box .side1 {transform: rotateX(90deg) rotateY(90deg) rotateZ(0deg);}
.box .side2 {transform: rotateX(90deg) rotateY(270deg) rotateZ(0deg);}
.box .side3 {transform: rotateX(180deg) rotateY(0deg) rotateZ(0deg);}
.box .side4 {transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);background: none !important;}
.box .side5 {transform: rotateX(90deg) rotateY(0deg) rotateZ(0deg);}
.box .side6 {transform: rotateX(90deg) rotateY(180deg) rotateZ(0deg);}

.btn_left .box div { background: #f1732f;}
.btn_right .box div { background: #e91f3e;}


.btn_left .box .side5 {background:#e85a0e;}
.btn_right .box .side5 {background: #d50021;}
.center .box .side5 {background: #f7f7f7;}
.center .box{position: absolute;}
.center .box div { background: #fff;width: 70px;}


/* 로드시 : motion_top에 addClass('in_motion') */
.motion_top .expand_bg {
    -moz-transform: scale(1.12);
    -webkit-transform: scale(1.12);
    -o-transform: scale(1.12);
    -ms-transform: scale(1.12);
    transform: scale(1.12);
    opacity: 0;
}
.motion_top.in_motion .expand_bg {
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-transition: transform 2s , opacity 1.5s;
    -moz-transition: transform 2s , opacity 1.5s;
    -ms-transition: transform 2s , opacity 1.5s;
    -o-transition: transform 2s , opacity 1.5s;
    transition: transform 2s , opacity 1.5s;
}
.section_top .back_container{overflow: hidden;width: 100%; height:650px;max-width: 2000px; /*position: fixed;*/top:0px;z-index: 0; background: #fff;  margin: 0 auto;will-change:transform}
.section_top.type_full .back_container{height: 100vh;}
.section_top .back_container .resize_inner {position:relative;opacity: 0;visibility: hidden;}
.section_top .back_container .back_img {position:relative;width:100%;max-width: none;}
.section_top .back_container img.back_img {position: absolute;top:0px;left:0;right:0;}
.section_top .back_container{background: url('/Images/company/about/company_top_bg.jpg') no-repeat center center;background-size: cover; position: fixed;}