@charset "utf-8";

/* sub-visual */
.sub-visual {margin-top:100px; background-repeat:no-repeat; background-size:cover; background-position:center center; height:520px;}
.sub-visual0 {background-image:url('../img/sub/sub-visual0.jpg');}
.sub-visual01 {background-image:url('../img/sub/sub-visual01.jpg');}
.sub-visual02 {background-image:url('../img/sub/sub-visual02.jpg');}
.sub-visual03 {background-image:url('../img/sub/sub-visual03.jpg');}
.sub-visual04 {background-image:url('../img/sub/sub-visual04.jpg');}
.sub-visual05 {background-image:url('../img/sub/sub-visual05.jpg');}
.sub-visual06 {background-image:url('../img/sub/sub-visual06.jpg');}
.sub-visual .title {height:calc(100% - 70px); display:flex; align-items:center; justify-content:center; text-align:center;}
.sub-visual05 .title {height:100%;}
.sub-visual .title h2 {font-size:66px; font-family:'ONE Mobile'; line-height:1.4em; color:#f0f5f9;}
.sub-visual010 {background:none; height:0; margin-top:200px;}
.sub_10 .sub-title {display:none;}
/* lnb */
.lnb ul {display:flex;}
.lnb ul li {flex:1; background:#fff; text-align:center; position:relative;}
.lnb ul li:after {content:''; width:1px; height:20px; background:#ddd; position:absolute; top:50%; margin-top:-10px; right:0;}
.lnb ul li:last-child:after {display:none;}
.lnb ul li.active:after {display:none;}
.lnb ul li a {display:flex; font-size:20px; line-height:1.5em; color:#333; font-weight:600; color:#333; padding:5px; transition:all 0.4s; height:70px; align-items:center; justify-content:center; flex-direction:column; text-align:center;}
.lnb ul li.active a {color:#fff; background:#0A2865;}
.lnb ul li a:hover {color:#fff; background:#0A2865;}
.lnb ul li a span {display:block;}
.lnb ul li a strong {font-weight:400;}
/* sub-title */
.sub-title {padding:140px 15px 66px; text-align:center;}
.sub-title h3 {font-size:54px; line-height:1.4em; color:#000; position:relative; padding-top:26px;}
.sub-title h3:before {content:''; width:8px; height:8px; background:#0A2865; position:absolute; top:0; left:50%; margin-left:-4px; border-radius:50%;}
.sub-title h3 span {display:block; font-size:32px; font-weight:500; line-height:1.4em; color:#333;}
/* sub */
.real-cont {padding-bottom:180px;}
/* sub 01 01 */
.greetings .img-box {margin-bottom:80px;}
.greetings .col {display:flex; position:relative; padding:0 60px;}
.greetings .tit-box {width:100%; max-width:530px; padding-right:70px; border-right:1px solid #ddd;}
.greetings .tit-box p {font-size:20px; line-height:1.4em; color:#0a2865; font-family:'Montserrat'; font-weight:700; margin-bottom:20px;}
.greetings .tit-box h4 {font-size:38px; line-height:1.4em; color:#000; font-weight:400;}
.greetings .tit-box h4 strong {font-weight:700;}
.greetings .txt-box {width:1%; flex:1 1 auto; padding-left:70px;}
.greetings .txt-box > p {font-size:20px; line-height:1.7em; color:#666; margin-bottom:34px;}
.greetings .txt-box > p:last-of-type {margin-bottom:0;}
.greetings .txt {position:absolute; left:60px; bottom:0;}
.greetings .txt p {font-size:22px; line-height:1.2em; color:#888; font-weight:600; margin-bottom:14px;}
.greetings .txt .ceo {font-size:26px; font-weight:600; color:#666; line-height:1.2em;}
.greetings .txt .ceo strong {color:#000;}
/* sub 01 02 */
.esg .tit-box {text-align:center; margin-bottom:80px;}
.esg .tit-box h4 {font-size:46px; font-family:'ONE Mobile'; line-height:1.2em; color:#333; display:inline-block; padding:0 48px; margin-bottom:36px; position:relative;}
.esg .tit-box h4:before,
.esg .tit-box h4:after {content:''; width:30px; height:24px; position:absolute; top:50%; margin-top:-12px; background-repeat:no-repeat; background-size:cover;}
.esg .tit-box h4:before {background-image:url('../img/sub/esg-tit-left.png'); left:0;}
.esg .tit-box h4:after {background-image:url('../img/sub/esg-tit-right.png'); right:0;}
.esg .tit-box p {font-size:22px ;line-height:1.6em; color:#666;}
.esg .img-box {margin-bottom:100px;}
.esg .col {display:flex; margin-bottom:80px; align-items:center;}
.esg .col:nth-child(even) {flex-direction:row-reverse;}
.esg .col .txt {width:1%; flex:1 1 auto;}
.esg .col:nth-child(odd) .txt {padding-left:60px;}
.esg .col:nth-child(even) .txt {padding-left:170px;}
.esg .col .txt .icon {margin-bottom:20px;}
.esg .col .txt h5 {font-size:44px; line-height:1.4em; color:#000; margin-bottom:20px; padding-bottom:20px; position:relative;}
.esg .col .txt h5:after {content:''; width:28px; height:1px; background:#d9d9d9; position:absolute; bottom:0; left:0;}
.esg .col .txt p {font-size:20px; line-height:1.7em; color:#666;}
.esg .col .img {width:100%; max-width:640px;}
/* sub 01 03 */
.history .real-cont {padding-bottom:0;}
.history .col {display:flex; position:relative; padding-bottom:180px;}
.history .col:before {content:''; width:1px; height:calc(100% - 20px); background:#ddd; position:absolute; top:20px; left:50%;}
.history .tit-box {width:50%; position:relative; padding-right:110px; text-align:right;}
.history .tit-box .box {position:sticky; top:120px; font-family:'Montserrat';}
.history .tit-box p {font-size:30px; line-height:1.2em; color:#0A2865; font-weight:700; margin-bottom:28px;}
.history .tit-box h4 {font-size:100px; line-height:1.1em; color:#f0f0f0; margin-bottom:58px;}
.history .row {width:50%; padding-left:120px;}
.history .txt-box {padding-bottom:100px;}
.history .txt-box:last-child {padding-bottom:0;}
.history .txt-box .year {font-size:46px; color:#0A2865; font-weight:700; line-height:1.2em; margin-bottom:32px; position:relative;}
.history .txt-box .year:before {content:''; width:18px; height:18px; background:url('../img/sub/history-icon.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-9px; left:-128px;}
.history .txt-box .year:after {content:''; width:100px; height:1px; border-top:1px dashed #ddd; position:absolute; top:50%; left:-110px;}
.history .txt-box .txt {display:flex; margin-bottom:12px;}
.history .txt-box .txt:last-child {margin-bottom:0;}
.history .txt-box .txt .month {width:100%; max-width:66px; font-size:20px; line-height:1.6em; color:#333; font-weight:600;}
.history .txt-box .txt ul {width:1%; flex:1 1 auto;}
.history .txt-box .txt ul li {font-size:20px; line-height:1.6em; color:#666; margin-bottom:12px;}
.history .txt-box .txt ul li:last-child {margin-bottom:0;}
/* sub 01 07 */
.directions .maps {margin-bottom:40px; border-radius:4px; overflow:hidden;}
.directions .maps .root_daum_roughmap {width:100% !important; height:380px !important;}
.directions .maps .root_daum_roughmap .wrap_map {height:380px !important;}
.directions .maps .root_daum_roughmap .map_border {border:0 !important; width:0 !important; height:0 !important;}
.directions .txt-box {position:relative; padding-right:510px;}
.directions .txt-box .btns {position:absolute; top:0; right:0;}
.directions .txt-box .btns ul {display:flex; margin:0 -10px;}
.directions .txt-box .btns ul li {padding:0 10px;}
.directions .txt-box .btns ul li a {display:block; width:240px; line-height:64px; padding:0 30px; font-size:18px; color:#fff; position:relative; transition:all 0.4s; border-radius:4px;}
.directions .txt-box .btns ul li a:after {content:''; width:14px; height:14px; position:absolute; top:50%; margin-top:-7px; right:30px; background:url('../img/sub/directions-more.png') no-repeat;}
.directions .txt-box .btns ul li a.more {background:#5DCFFF;}
.directions .txt-box .btns ul li a.print {background:#0A2865;}
.directions .txt-box .btns ul li a.more:hover {background:#0A2865;}
.directions .txt-box .btns ul li a.print:hover {background:#5DCFFF;}
.directions .txt-box dl {display:flex; font-size:20px; line-height:1.9em;}
.directions .txt-box dt {width:100%; max-width:60px; color:#000; font-weight:600;}
.directions .txt-box dd {width:1%; flex:1 1 auto; color:#666;}
.directions .txt-box dd a {display:inline-block;}
/* sub-common */
.doc-sub .cnt {margin-bottom:96px;}
.doc-sub .cnt:last-child {margin-bottom:0;}
.doc-tit {margin-bottom:50px;}
.doc-tit h4 {font-size:44px; line-height:1.4em; font-weight:600; color:#000; padding-left:26px; position:relative;}
.doc-tit h4:before {content:''; width:6px; height:36px; position:absolute; top:50%; margin-top:-18px; left:0; background:url('../img/sub/doc-tit.png') no-repeat; background-size:cover;}
.doc-tit p {font-size:20px; line-height:1.7em; color:#666;}
.doc-tit p:first-of-type {margin-top:20px;}
.doc-tit p strong {font-size:22px; color:#333; line-height:1.5em;}
.title-img {margin-bottom:96px;}
.table table {width:100%; border-top:2px solid #000; border-spacing:0; border-collapse:collapse; text-align:center;}
.table table thead th {font-size:18px; height:100%; line-height:1.4em; color:#000; padding:10px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; background:#f8f8f8; font-weight:500;}
.table table thead th:last-child {border-right:0;}
.table table tbody td {font-size:18px; line-height:1.4em; color:#666; padding:21px 10px; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
.table table tbody td:last-child {border-right:0;}
/* sub 02, sub 04 */
.doc-slider .origin {margin-bottom:10px; position:relative;}
.doc-slider .slick-arrow {position:absolute; top:50%; width:64px; height:64px; background-color:rgba(221,221,221,0.8); border:0; font-size:0; background-repeat:no-repeat; background-size:auto; background-position:center center; z-index:11; cursor:pointer; margin-top:-32px;}
.doc-slider .slick-prev {border-radius:0 4px 4px 0; background-image:url('../img/sub/environment-prev.png'); left:0;}
.doc-slider .slick-next {border-radius:4px 0 0 4px; background-image:url('../img/sub/environment-next.png'); right:0;}
.doc-slider .thumb .items {margin:0 -4px;}
.doc-slider .thumb .item {padding:0 4px;}
.doc-slider .thumb .item .box {border:2px solid transparent; border-radius:4px; position:relative; overflow:hidden;}
.doc-slider .thumb .item.slick-current .box {border-color:#0A2865;}
.doc-slider .thumb .item .box:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(10, 40, 101, 0.3); opacity:0;}
.doc-slider .thumb .item.slick-current .box:after {opacity:1;}
.doc-slider .thumb .item .box img {width:100%;}
/* sub 0301, sub0401 */
.doc-wrap {border-top:1px solid #0A2865;}
.doc-wrap .col {display:flex; padding:60px 40px; border-bottom:1px solid #ddd;}
.doc-wrap .col .tit {width:100%; max-width:215px; padding-right:90px;}
.doc-wrap .col .tit360 {max-width:360px;}
.doc-wrap .col .tit h5 {font-size:32px; line-height:1.2em; color:#000; font-weight:500;}
.doc-wrap .col .txt {width:1%; flex:1 1 auto;}
.doc-wrap .col .txt p {font-size:20px; line-height:1.7em; color:#666;}
.doc-wrap .col .txt ol li {margin-bottom:24px; font-size:22px; font-weight:500; line-height: 1.5em; color:#333;}
.doc-wrap .col .txt ol li:last-child {margin-bottom:0;}
.doc-wrap .col .txt ol li span {display:block; font-size:20px; font-weight:400; line-height:1.7em; color:#666; margin-top:6px;}
.doc-wrap .col .txt ul li {font-size:20px; line-height:1.7em; color:#666; position:relative; padding-left:10px;}
.doc-wrap .col .txt ul li:before {content:''; width:3px; height:3px; background:#666; position:absolute; top:14px; left:0; border-radius:50%;}
.doc-img {height:380px; background-size:cover; border-radius:4px; overflow:hidden; display:flex; padding:70px 60px 0; background-repeat:no-repeat; background-position:center center;}
.doc-img .logo {margin-bottom:22px;}
.doc-img p {font-size:28px; line-height:1.4em; color:#000; font-weight:500;}
/* sub 03 01 */
.management .doc-img {background-image:url('../img/sub/management-img.jpg');}
/* sub 04 01 */
.performance .doc-img {background-image:url('../img/sub/performance-img.jpg');}
/* sub 04 */
.construction .tab-menu {margin-bottom:96px;}
.construction .tab-menu ul {display:flex; margin:0 -5px;}
.construction .tab-menu ul li {width:100%; padding:0 5px;}
.construction .tab-menu ul li a {font-size:18px; padding:17px 10px; line-height:1.6em; color:#666; font-weight:500; text-align:center; display:flex; align-items:center; justify-content:center; border:1px solid #ddd; background:#fff; border-radius:4px; transition:all 0.4s; height:100%;}
.construction .tab-menu ul li.active a {color:#0A2865; border-color:rgba(10,40,101,0.4); background:rgba(10,40,101,0.05);}
.construction .tab-menu ul li a:hover {color:#0A2865;}
/* sub 04 01 */
.construction01 .txt {margin-top:46px;}
.construction01 .txt p {font-size:20px; line-height:1.7em; color:#666;}
.construction01 .doc-img {background-image:url('../img/sub/construction01-img.jpg');}
.construction01 .doc-wrap .col .txt {margin-top:0;}
/* sub 04 01 02 */
.construction02 .doc-img {background-image:url('../img/sub/construction02-img.jpg');}

