@import url("sub.css");


/* 공시 정보 */
.disclosure-cont .attention {display:flex; gap:6px; align-items:center; margin:0 0 10px; color:var(--basic); text-align:right;}
.disclosure-cont .attention b {font-weight:600; color:var(--black); letter-spacing:var(--letter-spacing-none);}
.disclosure-cont .attention::before{content: '\e855'; display: block; width: 20px; height: 20px; line-height: 20px; font-size: 20px; font-family: var(--icon); font-weight: 400; color: var(--black); text-align: center;}
.ir_table {width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; border-top:2px solid var(--main); text-align:center;}
.ir_table col.col_no {width:180px;}
.ir_table col.col_submitter {width:200px;}
.ir_table col.col_date {width:200px;}
.ir_table th {font-size:0.889rem; letter-spacing:var(--letter-spacing-body); line-height:175%; font-weight:600; color:var(--black); box-sizing:border-box; padding:18px 10px; border-bottom:1px solid #aaa; background:var(--white);}
.ir_table td {font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height:178%; font-weight:400; color:var(--basic); box-sizing:border-box; padding:18px 10px; border-bottom:1px solid var(--border); vertical-align:middle;}
.ir_table td.left {text-align:left; padding:18px 20px;}
.ir_table .ir_subject {color:var(--basic); font-size:1rem; line-height:178%; letter-spacing:var(--letter-spacing-body); text-decoration:none; word-break:break-word; transition:color 0.3s ease;}
.ir_table .ir_subject:hover {color:var(--main);}
.ir_table .mo_line {display:none;}


/* 지속가능경영 */
.esg-cont .title-area{padding:0 0 40px;}
.esg-list{display:flex; flex-direction:column; gap:40px;}
.esg-list article{display:flex; gap:80px;}
.esg-list .img-area{flex-shrink:0; width:510px; aspect-ratio: 510/640; border-radius:var(--borderR10); overflow:hidden; background:var(--bk000);}
.esg-list .img-area img{width:100%; height:100%; object-fit:cover;}
.esg-list .txt-area{flex:1; min-width:0; display:flex; flex-direction:column; gap:30px; justify-content:center;}
.esg-dot{display:flex; align-items:center; gap:10px; width:32px; height:4px;}
.esg-dot span{display:block; width:4px; height:4px; border-radius:50%; background:var(--main);}
.esg-list .txt-area h5{color:var(--black);}
.number-list{display:flex; flex-direction:column; gap:10px; counter-reset:esgNum;}
.number-list li{position:relative; min-height:35px; padding-left:44px; box-sizing:border-box; color:var(--basic);}
.number-list li::before{counter-increment:esgNum; content:counter(esgNum, decimal-leading-zero); display:flex; align-items:center; justify-content:center; width:35px; height:35px; border-radius:var(--borderR5); background:var(--main); color:var(--white); font-family:var(--eng); font-size:0.778rem; font-weight:700; line-height:171%; letter-spacing:0; position:absolute; left:0; top:-2px;}
.charter-list{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;}
.charter-list li{position:relative; min-height:35px; padding-left:80px; box-sizing:border-box; color:var(--basic);}
.charter-num{display:flex; align-items:center; justify-content:center; width:70px; height:35px; border-radius:var(--borderR5); background:var(--main); color:var(--white); font-weight:600; line-height:171%; position:absolute; left:0; top:-2px;}
.number-list--ethics li{display:flex; gap:10px; min-height:35px;}
.number-list--ethics .esg-item__tit{flex-shrink:0; width:180px; color:var(--black); font-weight:600; letter-spacing:var(--letter-spacing-default);}
.number-list--ethics .esg-item__desc{flex:1; min-width:0; color:var(--basic);}
.esg-icon{display:flex; flex-direction:column; width:100%;}
.esg-icon dl{position:relative; padding:35px 0 35px 115px; box-sizing:border-box;}
.esg-icon dl:nth-child(2){border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
.esg-icon dt{position:absolute; left:0; top:50%; transform:translateY(-50%); width:80px;}
.esg-icon dt img{display:block; width:100%; height:auto;}
.esg-icon dd p:first-child{font-weight:600; color:var(--black); letter-spacing:var(--letter-spacing-default);}
.esg-icon dd p:last-child{color:var(--basic);}




/* 회사개요 */
#contact,
.footer{position: relative; z-index: 2; background: var(--white);}
.company-cont section{background: var(--white); position: relative; z-index: 1;}
.company-cont section.history-cont{background:none;}
.overview-cont{margin-bottom: -1px; z-index: 2 !important;}
.overview-cont .title-area{padding:0 0 40px;}
.company-dot{display:flex; align-items:center; justify-content:center; gap:10px; width:32px; height:4px; margin:0 auto 40px;}
.company-dot span{display:block; width:4px; height:4px; border-radius:50%; background:var(--main);}
.company-overview{display:flex; flex-direction:column; gap:60px; width:100%;}
.company-overview__intro{display:flex; flex-direction:column; gap:20px; align-items:center; text-align:center; width:100%;}
.company-overview__slogan{font-weight:700; color:var(--main); font-family:var(--eng);}
.company-overview__desc{color:var(--black);}
.company-overview__sub{color:var(--basic);}
.company-overview__icon{display:flex; align-items:flex-start; justify-content:center; gap:30px; width:100%; padding-top:30px; box-sizing:border-box;}
.company-overview__icon li{flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:20px;}
.company-overview__icon-img{display:flex; align-items:center; justify-content:center; width:100px; height:100px;}
.company-overview__icon-img img{display:block; max-width:100%; max-height:100%; width:auto; height:auto;}
.company-overview__icon li p{color:var(--main); text-align:center; white-space:nowrap;}


/* 인사말 */
.company-greeting{display:flex; gap:80px; width:100%;}
.company-greeting__img{flex-shrink:0; width:645px; aspect-ratio: 645/850; border-radius:var(--borderR10); overflow:hidden; background:var(--bk000);}
.company-greeting__img img{width:100%; height:100%; object-fit:cover;}
.company-greeting__txt{flex:1; min-width:0; display:flex; flex-direction:column; gap:30px; justify-content:center;}
.company-greeting__tit{display:flex; flex-direction:column; gap:5px; width:100%;}
.company-greeting__tit .fs40{font-weight:700; color:var(--main); font-family:var(--eng);}
.company-greeting__tit .fs28{font-weight:700; color:var(--black);}
.company-greeting__txt .company-dot{margin:0;}
.company-greeting__cont{display:flex; flex-direction:column; gap:20px; width:100%;}
.company-greeting__lead{color:var(--black);}
.company-greeting__cont .fs18{color:var(--basic);}
.company-greeting__sign{display:flex; align-items:flex-end; gap:10px; padding-top:20px; box-sizing:border-box; color:var(--black);}


/* 연혁 */
.history-cont{position:relative; width: calc(100% - 100px); margin: 0 auto; border-radius:var(--borderR30); -webkit-mask-image:-webkit-radial-gradient(white, black); mask-image:radial-gradient(white, black);}
.history-cont .title-area h3{color:var(--white);}
.history-bg{position:fixed; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height:100vh; background-color:#02112D; background-image:url('/company/img/history-bg.png'); background-repeat:no-repeat; background-position:center; background-size:cover; z-index:-1; pointer-events:none; -webkit-backface-visibility:hidden; backface-visibility:hidden;}


.history-bbs{position:relative; box-sizing:border-box; display:flex; flex-direction:column;}
.history-bbs .progressbar{position:absolute; z-index:0; left:50%; top:0; bottom:0; width:1px; box-sizing:border-box; background-image:linear-gradient(180deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.2) 95.04%, rgba(255,255,255,0) 100%); background-repeat:no-repeat; background-position:center top; background-size:100% 100%;}
.history-bbs .progressbar .progress{position: absolute; left: 50%; top:0; margin-left: -1px; z-index:1; display:block; width:3px; box-sizing:border-box; height:0; background-color:var(--white); transition:height 0.3s linear;}

.history_in{display:flex; justify-content:space-between; position:relative; z-index:1; box-sizing:border-box; transition:opacity 0.55s ease, transform 0.55s ease; padding: 100px 0;}
.history_in:not(.effect){opacity:0.5; transform:translateY(60px);}
.history_in.effect{opacity:1; transform:translateY(0);}
.history_in article{width: calc(50% - 95px);}
.history_in .img_area{flex-shrink:0; box-sizing:border-box;}
.history_in .img_sticky{position:sticky; top:120px; max-width:510px; width:100%; margin-left:auto; display:flex; flex-direction:column; align-items:flex-end; gap:30px; box-sizing:border-box;}
.history_in .img{position:relative; display:block; width:100%; overflow:hidden; box-sizing:border-box; aspect-ratio:510/400; border-radius:var(--borderR10);}
.history_in .img img{display:block; width:100%; height:100%; object-fit:cover;}
.history_in .img_area h3{text-align:right; font-family:var(--eng); font-weight:900; color:var(--white); text-transform:uppercase; letter-spacing:0.7px; line-height:121%; font-family: 'Satoshi', sans-serif;}

.history_in .txt_area{flex-shrink:0; box-sizing:border-box; display:flex; flex-direction:column; gap:80px;}
.history_in .his_in{position:relative; box-sizing:border-box;}
.history_in .his_in .dot{display:block; width:9px; height:9px; border-radius: 50%; position:absolute; background:var(--white); left:-99px; top:20px; z-index:2; opacity: 0.5; transition: opacity .3s linear;}
.history_in .his_in .dot::before{content:''; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:100%; height:100%; border-radius:50%; background:var(--white); pointer-events:none; animation:historyDotPulse 2.6s cubic-bezier(0.22, 1, 0.36, 1) infinite;}
.history_in .his_in.on .dot{opacity: 1;}

.history_in .his_in h4{margin:0; padding-bottom:15px; font-family:var(--eng); font-weight:700; color:var(--white); line-height:125%; letter-spacing:var(--letter-spacing-none);}
.history_in .his_in ul{display:flex; flex-direction:column; gap:6px;}
.history_in .his_in ul li{display:flex; gap:10px; font-weight:400; font-size:1rem; line-height:177.78%; letter-spacing:var(--letter-spacing-body); color:rgba(255,255,255,0.7);}
.history_in .his_in ul li strong{flex-shrink:0; width:25px; font-size:1rem; font-weight:600; line-height:177.78%; color:var(--white); letter-spacing:var(--letter-spacing-none);}


@keyframes historyDotPulse{0%{transform:translate(-50%,-50%) scale(0.75); opacity:0.45;} 70%{opacity:0.12;} 100%{transform:translate(-50%,-50%) scale(5); opacity:0;}}
@media (prefers-reduced-motion:reduce){.history_in .his_in .dot::before{animation:none;}}



/* 찾아오시는 길 */
.company-location{display:flex; flex-direction:column; gap:50px; width:100%;}
.company-location__item{display:flex; align-items:center; justify-content:space-between; gap:50px; width:100%;}
.company-location__info{flex-shrink:0; width:380px; display:flex; flex-direction:column; gap:20px;}
.company-location__name{color:var(--black);}
.company-location__name b{font-weight:700; letter-spacing: inherit;}
.company-location__detail{display:flex; flex-direction:column; gap:15px; width:100%; padding-top:20px; box-sizing:border-box; border-top:1px solid var(--border);}
.company-location__addr{color:var(--black);}
.company-location__contact{display:flex; flex-direction:column; gap:6px; width:100%;}
.company-location__tel{display:flex; gap:10px; align-items:center;}
.company-location__tel::before{content:'\e0b0'; display:block; width:20px; height:20px; line-height:20px; font-size:20px; font-family:var(--icon); font-weight:400; color:var(--black); flex-shrink:0;}
.company-location__tel b{font-weight:600; color:var(--black);}
.company-location__tel a{color:var(--basic); transition:color 0.3s ease;}
.company-location__tel a:hover{color:var(--main);}
.company-location__fax{display:flex; gap:10px; align-items:center; color:var(--basic);}
.company-location__fax::before{content:'\ead8'; display:block; width:20px; height:20px; line-height:20px; font-size:20px; font-family:var(--icon); font-weight:400; color:var(--black); flex-shrink:0;}
.company-location__fax b{font-weight:600; color:var(--black);}
.company-location__btns{display:flex; gap:4px; align-items:center; padding-top:30px; box-sizing:border-box;}
.company-map-btn{display:flex; align-items:center; justify-content:center; width:60px; height:60px; border-radius:50%; box-sizing:border-box; transition:opacity 0.3s ease;}
.company-map-btn:hover{opacity:0.8;}
.company-map-btn img{display:block; width:100%; height:100%; object-fit:contain;}
.company-map-btn--naver{background:#10d265;}
.company-map-btn--kakao{background:#fae100;}
.company-map-btn--google{background:var(--white); border:1px solid var(--border);}
.company-location__map{flex:1; min-width:0; height:550px; overflow:hidden; border:1px solid var(--border); border-radius:var(--borderR10); position:relative;}
.company-location__map .map-area__shield{position:absolute; left:0; top:0; width:100%; height:100%; z-index:5; box-sizing:border-box; cursor:pointer;}
.company-location__map .root_daum_roughmap{height:550px !important;}
.company-location__map .wrap_map{height:100% !important;}
.company-location__map .map_border{display:none !important;}
.company-location__map .wrap_controllers{display:none !important;}
.company-location__map .cont{display:none !important;}



/*******************************************************************************
    @media 1740px
*******************************************************************************/
@media all and (max-width:1740px){


/* 연혁 */
.history-cont{width: 94%;}

}
/*******************************************************************************
	@media 1500px
*******************************************************************************/
@media all and (max-width:1500px){



/* 지속가능경영 */
.esg-list article{gap:40px;}
.esg-list .img-area{width:40%;}
.esg-list .txt-area{gap:20px;}



/* 인사말 */
.company-greeting__img{width:40%;}


}
/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){

/* 공시 정보 */
	.ir_table col.col_no {width:10%;}
	.ir_table col.col_submitter {width:15%;}
	.ir_table col.col_date {width:15%;}



/* 회사개요 */
.company-overview__icon{gap:50px 30px; flex-wrap: wrap; max-width:850px; margin: 0 auto;}
.company-overview__icon li{flex:auto; width: calc((100% - 90px)/4);}


/* 인사말 */
.company-greeting{gap:40px;}
.company-greeting__img{width:45%;}
.company-greeting__txt{gap:20px;}
.company-greeting__cont{gap:15px;}
.company-greeting__sign{padding-top:10px;}



/* 찾아오시는 길 */
.company-location__info{width:30%;}








/* 연혁 */
.history_in article{width: calc(50% - 60px);}
.history_in .img_area h3{font-size:3.056rem;}
.history_in .his_in .dot{left:-64px;}



}
/*******************************************************************************
	@media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){


/* 공시 정보 */
.ir_table col.col_no {width:8%;}
.ir_table col.col_submitter {width:18%;}
.ir_table col.col_date {width:18%;}
.ir_table th {padding:15px 10px;}
.ir_table td {padding:15px 10px;}
.ir_table td.left {padding:15px 12px;}



/* 지속가능경영 */
.esg-cont .title-area{padding:0 0 30px;}
.esg-list{gap:30px;}
.esg-list article{gap:20px; flex-wrap: wrap;}
.esg-list .img-area{width:100%; aspect-ratio: 3/2;}
.esg-list .txt-area{gap:15px;}
.charter-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.number-list--ethics .esg-item__tit{width:150px;}
.esg-icon dl{padding:25px 0 25px 90px;}
.esg-icon dt{width:60px;}


/* 회사개요 */
.overview-cont .title-area{padding:0 0 30px;}
.company-dot{margin:0 auto 30px;}
.company-overview{gap:40px;}
.company-overview__intro{gap:15px;}
.company-overview__icon{gap:50px 20px; padding-top:20px;}
.company-overview__icon li{width: calc((100% - 60px)/4); gap:15px;}
.company-overview__icon-img{width:80px; height:80px;}



/* 인사말 */
.company-greeting{flex-wrap: wrap;}
.company-greeting__img{width:100%; aspect-ratio: 4/3;}




/* 찾아오시는 길 */
.company-location__item{gap:30px; flex-wrap: wrap;}
.company-location__info{width:100%; gap:15px; position: relative;}
.company-location__detail{gap:10px; padding-top:15px;}
.company-location__btns{padding-top:0; position: absolute; left: 10px; bottom: -90px; z-index: 9;}
.company-map-btn{width:50px; height:50px;}
.company-location__map{height:400px;}
.company-location__map .root_daum_roughmap{height:400px !important;}

/* 연혁 */
.history_in{padding: 60px 0;}
.history_in article{width: calc(50% - 30px);}
.history_in .img_sticky{top:100px; gap:20px;}
.history_in .img_area h3{font-size:2.222rem;}
.history_in .txt_area{gap:40px;}
.history_in .his_in{}
.history_in .his_in .dot{left:-35px; top:10px;}
.history_in .his_in h4{padding-bottom:10px; font-size:1.556rem;}



}
/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px){


/* 공시 정보 */
.disclosure-cont .attention {margin:0 0 6px;}
.disclosure-cont .attention::before{width: 16px; height: 16px; line-height: 16px; font-size: 16px; }
.ir_table {border-top:0;}
.ir_table, .ir_table tr, .ir_table tbody, .ir_table td {display:block;}
.ir_table tr {box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR5); overflow:hidden;}
.ir_table tr ~ tr {margin-top:10px;}
.ir_table thead {display:none !important;}
.ir_table .pc_line {display:none !important;}
.ir_table td {padding:0; border:0; text-align:left !important;}
.ir_table td.left {padding:0;}
.ir_table .mo_line {display:block; position:relative; padding:15px; box-sizing:border-box;}
.ir_table .mo_line .subject, .ir_table .mo_line .subject a {display:inline-block; font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height:150%; color:var(--black); font-weight:500; text-decoration:none; word-break:break-word;}
.ir_table .mo_line .subject a:hover {color:var(--main);}
.ir_table .mo_line .writer {display:flex; flex-wrap:wrap; margin:8px 0 0; gap:0;}
.ir_table .mo_line .writer li {padding:0 20px 0 0; position:relative; font-size:0.889rem; line-height:120%; letter-spacing:var(--letter-spacing-none); color:var(--basic);}
.ir_table .mo_line .writer li:last-child {padding:0;}
.ir_table .mo_line .writer li:after {content:''; display:block; width:1px; height:8px; background:var(--border); position:absolute; right:10px; top:50%; margin-top:-4px;}
.ir_table .mo_line .writer li:last-child:after {display:none;}



/* 지속가능경영 */
.esg-cont .title-area{padding:0 0 20px;}
.esg-list .txt-area{gap:15px;}
.esg-dot{gap:5px; height:3px;}
.esg-dot span{width:3px; height:3px;}
.number-list{gap:6px;}
.number-list li{min-height:26px; padding-left:35px;}
.number-list li::before{width:26px; height:26px; top:-1px;}
.charter-list{grid-template-columns:repeat(1,minmax(0,1fr)); gap:6px;}
.charter-list li{min-height:26px; padding-left:60px;}
.charter-num{width:50px; height:26px; top:-1px;}
.number-list--ethics li{gap:0 5px; min-height:26px; flex-wrap: wrap;}
.number-list--ethics .esg-item__tit{width:100%;}
.esg-icon dl{padding:15px 0 15px 55px;}
.esg-icon dt{width:40px;}

/* 회사개요 */
.overview-cont .title-area{padding:0 0 20px;}
.company-dot{gap:5px; height:3px; margin:0 auto 20px;}
.company-dot span{width:3px; height:3px;}
.company-overview{gap:30px;}
.company-overview__intro{gap:10px;}
.company-overview__icon{gap:20px 10px; padding-top:0; max-width: 400px;}
.company-overview__icon li{width: calc((100% - 30px)/4); gap:10px;}
.company-overview__icon-img{width:60px; height:60px;}

/* 인사말 */
.company-greeting{gap:30px;}
.company-greeting__txt{gap:15px;}
.company-greeting__cont{gap:10px;}
.company-greeting__sign{gap:5px; padding-top:5px;}


/* 찾아오시는 길 */
.company-location{gap:30px;}
.company-location__item{gap:20px;}
.company-location__info{gap:8px;}
.company-location__detail{gap:6px; padding-top:10px;}
.company-location__contact{gap:6px;}
.company-location__tel{gap:5px;}
.company-location__tel::before{width:16px; height:16px; line-height:16px; font-size:16px;}
.company-location__fax{gap:5px;}
.company-location__fax::before{width:16px; height:16px; line-height:16px; font-size:16px;}
.company-location__btns{bottom: -70px;}
.company-map-btn{width:40px; height:40px;}
.company-location__map{height:300px;}
.company-location__map .root_daum_roughmap{height:300px !important;}


/* 연혁 */
.history-cont{border-radius:var(--borderR20);}

.history-bbs .progressbar{left:0;}
.history-bbs .progressbar .progress{width: 1px; margin-left: 0;}

.history_in{padding: 40px 0 40px 30px; gap:20px; box-sizing: border-box; flex-wrap: wrap;}
.history_in:first-child{padding-top: 0;}
.history_in article{width: 100%;}
.history_in .img_sticky{top:100px; gap:10px; align-items: flex-start;}
.history_in .img_area .img{aspect-ratio: 16/9;}
.history_in .txt_area{gap:30px;}
.history_in .his_in{}
.history_in .his_in .dot{width:7px; height:7px; left:-33px; top:9px;}

.history_in .his_in h4{padding-bottom:5px;}
.history_in .his_in ul{gap:4px;}
.history_in .his_in ul li{gap:5px; }
.history_in .his_in ul li strong{width:20px;}
}