.wrap.nv { padding-top: 92px;}



/* sec-visual */
.sec-visual { padding-top: 300px; }
.sec-visual .heading{color: var(--accent-color); font-weight: 600; font-size: 20px; padding-bottom: 20px;}
.sec-visual .title{ line-height: 1.3; }
.sec-visual .sub-top{padding-bottom: 120px; }
.sec-visual.ani .sub-top{position: sticky; top: 300px;  }
.sec-visual.ani .sub-top .inner{position:relative; max-width:1720px;}
.sec-visual.ani .sub-top .title-inner.white{position:absolute; left:0; top:0; color: #fff; z-index:-1;}
.sec-visual.ani .sub-top .title-inner.white .heading{color: #fff; }
.sec-visual.ani .top-kv{margin: 0 auto;    position: relative;width: auto; overflow: hidden;opacity: 0;animation: fadeInKv 1.3s .3s forwards;z-index: -1; height:100vh;}
.sec-visual.ani .top-kv .kv-inner{width:100%;      overflow: hidden;}
.sec-visual.ani .top-kv .kv-inner .bg{width:100%; height:100%; object-fit:cover; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.kv01 .bg{background-image:url('/images/sub/kv01.jpg');}
.kv02 .bg{background-image:url('/images/sub/kv02.jpg');}
.kv03 .bg{background-image:url('/images/sub/kv03.jpg');}
.kv04 .bg{background-image:url('/images/sub/kv04.jpg');}
.kv05 .bg{background-image:url('/images/sub/kv05.jpg');}
.kv06 .bg{background-image:url('/images/sub/kv06.jpg');}
.kv07 .bg{background-image:url('/images/sub/kv07.jpg');}
.kv08 .bg{background-image:url('/images/sub/kv08.jpg');}
.kv09 .bg{background-image:url('/images/sub/kv09.jpg');}
.kv10 .bg{background-image:url('/images/sub/kv10.jpg');}
.kv11 .bg{background-image:url('/images/sub/kv11.jpg');}
.kv12 .bg{background-image:url('/images/sub/kv12.png');}
@keyframes fadeInKv {
    0% {
        opacity: 0;
        transform: translateY(30%)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}
@media screen and (max-width: 767px) {
  .sec-visual:not(.ani) { padding-top: 150px;}
}


/* tab 공통 */
.tab-menu {text-align:center; display:flex; gap:20px; justify-content:center;}
.tab-menu li{ width:45%; max-width:250px;}
.tab-menu li a{display:block; width:100%; height:70px; line-height: 70px; font-size: 24px;  color: #8e8e8e; font-weight: 500; border:1px solid #ddd; background: #fff; border-radius:70px; cursor:pointer;}
.tab-menu li a.active{color:#fff; background:  var(--accent-color); border-color: var(--accent-color); }
.tab{ display: none;}
.tab.active{ display: block;}



/* 수상 & 인증 */
.awards{padding-top: 140px;}
.awards .bbs-gallery{border-top:0; padding-top: 80px;}
.awards .bbs-gallery > ul > li .thumb{padding-bottom: 120%;}
.awards .bbs-gallery > ul > li .organ{color: #666; font-size: 16px; margin-bottom: 10px; display:flex; gap:20px; align-items:center;}
.awards .bbs-gallery > ul > li .organ span{position:relative;}
.awards .bbs-gallery > ul > li .organ span + span:before{content:''; width:1px; height:12px; background: #ddd; position:absolute; left:-10px; top:5px;}
@media screen and (max-width: 767px) {
  .awards { padding-top: 80px;}
  .tab-menu li a { height: 40px; line-height: 40px; font-size: 16px;}
  .awards .bbs-gallery > ul > li .thumb { padding-bottom: 80%;}
}


/* contact us */
.root_daum_roughmap { width: 100% !important; height: 100% !important; }
.root_daum_roughmap .wrap_map { height: inherit !important;}
.location .col { flex:1;}
.location .col:first-child { padding:140px 40px 80px 0; flex: 0 0 26.1%;}
.location .heading { margin-bottom: 40px;}
.location .heading + p { margin-bottom: 40px;}
.location .down-btn { margin-bottom: 130px;}
.location .list-item + .list-item { margin-top: 60px;}
.location dt { font-size: 20px; color: var(--accent-color); font-weight: bold; padding-bottom: 20px; border-bottom: 1px solid #ddd;}
.location dd { padding-top: 20px; color: #333;}
.inquiry{padding:140px 0 170px;  background: var(--bg-sub-color);}
.inquiry-form{margin-top: 40px;}
.inquiry-form .req{color: var(--accent-color); margin-left: 10px;}
.inquiry-form > ul {display:flex;  flex-wrap:wrap;justify-content:space-between; }
.inquiry-form > ul > li{width:48%;display:flex; justify-content:space-between; margin:10px 0; }
.inquiry-form > ul > li.w100{width:100%}
.inquiry-form > ul > li .th{width:120px; padding-top: 10px;}
.inquiry-form > ul > li .td{width:calc(100% - 120px);}
.inquiry-form input{ font-size: 16px; width:100%;}
.inquiry-form select{ font-size: 16px; width:100%;}
.inquiry-form textarea{ font-size: 16px; width:100%; height:500px}
.inquiry-form .btns{display:flex; justify-content:center; gap:20px; margin-top: 40px;}
.inquiry-form .btns > a{width:45%; max-width:200px; height:60px; line-height: 60px; background: #fff; text-align: center;}
.inquiry-form .btns > a:last-child{background: var(--accent-color); color: #fff;}
.privacy-box {margin-top: 20px; font-weight: 300; font-size: 16px;}
.privacy-box a{color: var(--accent-color); text-decoration:underline;}
.privacy-box .styled-checkbox { position: absolute; opacity: 0; width:auto; }
.privacy-box .styled-checkbox + label {  position: relative;  cursor: pointer;  padding: 0;}
.privacy-box .styled-checkbox + label:before {  content: "";  margin-right: 10px;  display: inline-block;  vertical-align: top;  width: 20px;  height: 20px;  background: white; border:1px solid #e5e5e5; }
.privacy-box .styled-checkbox:checked + label:before {  background: var(--accent-color);  border-color:var(--accent-color);}
.privacy-box .styled-checkbox:disabled + label {  color: #b8b8b8;  cursor: auto;}
.privacy-box .styled-checkbox:disabled + label:before {  box-shadow: none;  background: #ddd;}
.privacy-box .styled-checkbox:checked + label:after {  content: "";  position: absolute;  left: 5px;  top: 9px;  background: white;  width: 2px;  height: 2px;  box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;  transform: rotate(45deg);}
@media screen and (max-width: 767px) {
  .location { padding: 80px 0;}
  .location .flex-box { flex-direction: column; margin: 0 auto; width: 90%; padding: 0 !important;}
  .location .col:first-child { padding: 0; margin-bottom: 30px;}
  .location .col:last-child { flex: auto; height: 400px;}
  .location .heading { margin-bottom: 20px;}
  .location .heading + p {margin-bottom: 20px;}
  .location .down-btn { margin-bottom: 30px;}
  .location dt { font-size: 16px; padding-bottom: 10px;}
  .location dd { padding-top: 10px;}
  .location .list-item + .list-item { margin-top: 20px;}
  .inquiry { padding: 80px 0;}
  .inquiry-form > ul > li  {width: 100%; flex-direction: column;}
  .inquiry-form > ul > li .th { margin-bottom: 10px;}
  .inquiry-form > ul > li .td { width: 100%;}
  .inquiry-form input,
  .inquiry-form textarea { font-size: 14px;}
  .inquiry-form textarea { height: 300px;}
  .privacy-box { font-size: 14px;}
  .inquiry-form .btns > a { height: 40px; line-height: 40px;}
}


/* 개인정보처리방침 */
.privacy{padding-bottom: 140px;}
.privacy-top{  margin-bottom: 60px; display:flex; justify-content:space-between; gap:20px; align-items:flex-start;}
.privacy-top select{font-size: 16px; border-radius:60px;}
.privacy-top p{font-size: 16px;  width: 100%;}
.etc-cont{font-size: 16px;  }
.etc-cont p{font-size: 16px;  color: #333; font-weight: 400; margin:10px 0;}
.etc-cont section{padding:60px 0; border-top:1px solid #ddd;}
.etc-cont section.flex{display:flex; justify-content:space-between;}
.etc-cont section.flex .title{width:30%;}
.etc-cont section.flex .cont{width:70%; overflow-x: auto;}
.etc-cont .title{font-size: 24px; font-weight: 700; padding:0 40px;}
.etc-cont .dot > li{padding-left: 20px; position:relative; font-size: 18px; font-weight: 600; margin:5px 0;}
.etc-cont .dot > li:before{content:''; width:4px; height:4px; border-radius:50%; background: #000; position:absolute; left:0; top:10px;}
.etc-cont table{width:100%; text-align: center; border-top:1px solid #000; font-size: 16px; margin:20px 0;}
.etc-cont table th{background: #f7f7f7; padding:20px 10px; border-bottom:1px solid #ddd; white-space:nowrap;}
.etc-cont table td{background: #fff; padding:20px 10px; border-bottom:1px solid #ddd; color: #666;}
.etc-cont .dot > li > ol {counter-reset: number 0;  margin:10px 0;}
.etc-cont .dot > li > ol > li{padding-left: 30px; position:relative;  font-weight: 400; margin:5px 0; font-size: 16px; color: #333;}
.etc-cont .dot > li > ol > li:before{counter-increment: number 1;  content: counter(number) ;font-size: 12px; width: 20px; height: 20px; background: #000; color: #fff; border-radius:50%; display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:2px;}
.etc-cont .box{background: #f7f7f7; border-radius:20px; padding:20px 30px; margin:20px 0;}
.etc-cont .box > ul > li{text-indent:-15px; padding-left: 15px; margin:10px 0;}
.etc-cont .box > ul > li > p{padding-left: 10px;  text-indent: -10px; margin:5px 0;}
.etc-cont .team {display:flex; gap:10px; font-size: 16px; color: #333; font-weight: 400;  }
.etc-cont .team .box{ width:40%;}
.etc-cont .team .box > ul > li{text-indent:0; padding-left: 0; display:flex; gap:10px; align-items:center;  }
.etc-cont .team .box > ul > li strong{ width:60px; font-size: 14px; background:  var(--accent-color); color: #fff; text-align: center; padding:5px; border-radius:50px; flex-shrink: 0;}
@media screen and (max-width: 1024px) {
  .privacy-top { flex-direction: column;}
  .etc-cont section.flex { flex-direction: column;}
  .etc-cont section.flex .title { width: 100%; padding: 0; margin-bottom: 30px;}
  .etc-cont section.flex .cont { width: 100%;}
}
@media screen and (max-width: 767px) {
  .privacy { margin-top: -100px;}
  .privacy-top { margin-bottom: 30px; }
  .privacy-top p { font-size: 14px;}
  .privacy-top select { font-size: 14px;}
  .etc-cont .team { flex-direction: column;}
  .etc-cont .team .box { width: 100%;}
}

/* company-mission */
.company-mission { padding: 240px 0 0; height: 100svh;}
.company-mission .content-top { text-align: center;}
.company-mission .content-top .heading-sub { margin-bottom: 60px;}
.company-mission .content-body { display: flex; height: 100vh; position: absolute; top: 0; left: 0; width: 100%; overflow: hidden;}
.company-mission .grid-box { flex-direction: column; width: 50%; position: absolute; left: 0; grid-template-rows: repeat(3, 1fr); transform: translate(0px, -100%);}
.company-mission .grid-box:last-child { transform: translate(0px, 100%);}
.company-mission .grid-box .col { width: 100%; height: 100vh; background: #fff; overflow: hidden;}
.company-mission .grid-box .col .img-box { width: 100%; height: 100%;}
.company-mission .grid-box .col .img-box img { height: 100%; object-fit: cover;}
.company-mission .grid-box .col .text-boxs { padding: 130px; display: flex; justify-content: center; flex-direction: column; height: 100%; width: 100%;}
.company-mission .grid-box .col .text-boxs .sbj { margin-bottom: 64px; line-height: inherit;}
.company-mission .grid-box .col .text-boxs .text { font-size: 20px; color: #666;}
.company-mission .grid-box:nth-child(2) .col:last-child { display: flex; justify-content: flex-end;}
.company-mission .grid-box:nth-child(2) .col:last-child .text-boxs { padding-right: 5%;}
.company-mission .grid-box:last-child { left: auto; right: 0; bottom: 0;}
@media screen and (max-width: 1024px) {
  .company-mission .grid-box .col .text-boxs { padding: 30px;}
}
@media screen and (max-width: 767px) {
  .company-mission { height: auto; padding-top: 80px;}
  .company-mission .content-top { margin-bottom: 50px;}
  .company-mission .content-top .heading-sub { margin-bottom: 30px;}
  .company-mission .content-body { position: static; height: auto;}
  .company-mission .grid-box { position: static; transform: none; width: 100%;}
  .company-mission .grid-box .img-box { display: none;}
  .company-mission .grid-box:last-child { transform: none; display: none;}
  .company-mission .grid-box .col { position: relative; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover; color: #fff;}
  .company-mission .grid-box .col::before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3);}
  .company-mission .grid-box .col .text-boxs { padding: 100px 5% !important; position: relative; z-index: 1;}
  .company-mission .grid-box .col .text-boxs .sbj { margin-bottom: 30px;}
  .company-mission .grid-box .col .text-boxs .text { color: #fff; font-size: 14px;}
  .company-mission .grid-box .col:first-child { background-image: url(/images/sub/company-mission-bg1.png);)}
  .company-mission .grid-box .col:nth-child(2) { background-image: url(/images/sub/company-mission-bg2.png);)}
  .company-mission .grid-box .col:nth-child(3) { background-image: url(/images/sub/company-mission-bg3.png);)}
}
/* .company-ceo */
.company-ceo { position: relative; padding: 240px 0 0; margin-bottom: 240px;}
.company-ceo::after { content: ''; display: block; position: absolute; top: 0; right: 0; width: 22%; height: 28.8%; background: url(/images/sub/company-ceo-bg.png) no-repeat center/cover;;}
.company-ceo .flex-box { justify-content: space-between; overflow: hidden;}
.company-ceo .col.img-wrap { display: flex; align-items: center;}
.company-ceo .text-boxs { padding-bottom: 40px;}
.company-ceo .text-boxs .heading { margin-bottom: 120px;}
.company-ceo .text-boxs .sbj { margin-bottom: 80px; position: relative;}
.company-ceo .text-boxs .text { font-size: 20px; color: #333; font-weight: 600;}
.company-ceo .text-boxs .desc { color: #666;}
.company-ceo .text-boxs .desc + .desc { margin-top: 30px;}
@media screen and (max-width: 1024px) {
  .company-ceo { margin-bottom: 100px;}
  .company-ceo::after { width: 60vw; height: 70vw;}
}
@media screen and (max-width: 767px) {
  .company-ceo { padding-top: 80px; margin-bottom: 80px;}
  .company-ceo .flex-box { flex-direction: column; padding: 0 5% !important;}
  .company-ceo .text-boxs .heading { margin-bottom: 50px;}
  .company-ceo .text-boxs .sbj { margin-bottom: 50px;}
  .company-ceo .text-boxs .text { font-size: 16px;}
}
/* company-vision-slogan */
.company-vision-slogan { margin-bottom: 240px;}
.company-vision-slogan .flex-box { justify-content: space-between; gap: 20px;}
.company-vision-slogan .flex-box .img-box { position: relative; margin-bottom: 40px;}
.company-vision-slogan .flex-box .desc { font-size: 32px; color: #333; padding: 0 10px;}
.company-vision-slogan .flex-box.vision { margin-bottom: 240px;}
.company-vision-slogan .flex-box.vision .img-box .text { position: absolute; top: 0; left: 0; z-index: 1; font-size: 36px; font-weight: bold; color: #fff; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.company-vision-slogan .flex-box.slogan .col:first-child { flex: 0 0 82%;}
.company-vision-slogan .flex-box.slogan .desc { text-align: right;}
.company-vision-slogan .flex-box.slogan .icon-box { width: 80px; height: 80px;}
.company-vision-slogan .flex-box.slogan .img-box { padding: 90px 20px 80px;}
.company-vision-slogan .flex-box.slogan .img-box img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.company-vision-slogan .flex-box.slogan .slogan-content { display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff;}
.company-vision-slogan .flex-box.slogan .title { padding: 8px 36px; background: #000; border-radius: 35px; margin-bottom: 48px; font-size: 28px; font-weight: bold;}
.company-vision-slogan .flex-box.slogan ul { display: flex; justify-content: center; width: 100%; max-width: 944px;}
.company-vision-slogan .flex-box.slogan ul li { flex: 1; margin-left: -40px; display: flex; align-items: center; justify-content: center; aspect-ratio: 1/1; background: rgba(0,0,0,0.51); border-radius: 50%; flex-direction: column; gap: 50px;}
.company-vision-slogan .flex-box.slogan ul li:first-child { margin-left: 0;}
.company-vision-slogan .flex-box.slogan ul li .text { font-size: 28px; font-weight: bold;}
.company-vision-slogan .flex-box.slogan li:nth-child(1) .icon-box { background: url(/images/sub/company-slogan-icon1.png) no-repeat center/auto 91.25%;}
.company-vision-slogan .flex-box.slogan li:nth-child(2) .icon-box { background: url(/images/sub/company-slogan-icon2.png) no-repeat center/auto 88.75%;}
.company-vision-slogan .flex-box.slogan li:nth-child(3) .icon-box { background: url(/images/sub/company-slogan-icon3.png) no-repeat center/auto 66.25%;}
@media screen and (max-width: 1024px) {
  .company-vision-slogan { margin-bottom: 100px;}
  .company-vision-slogan .flex-box { flex-direction: column; padding: 0 5% !important; margin-bottom: 100px;}
  .company-vision-slogan .flex-box .desc { font-size: 20px;}
  .company-vision-slogan .flex-box.vision { margin-bottom: 100px;}
  .company-vision-slogan .flex-box.vision .img-box .text { font-size: 24px;}
  .company-vision-slogan .flex-box.slogan .col { order: 1;}
  .company-vision-slogan .flex-box.slogan .col:first-child { flex: 0 0 100%; order: 2;}
  .company-vision-slogan .flex-box.slogan ul li { gap: 30px;}
  .company-vision-slogan .flex-box.slogan ul li .text { font-size: 20px; padding: 0;}
}
@media screen and (max-width: 767px) {
  .company-vision-slogan .flex-box { margin-bottom: 80px;}
  .company-vision-slogan .flex-box.vision { margin-bottom: 80px;}
  .company-vision-slogan .flex-box .img-box { margin-bottom: 20px;}
  .company-vision-slogan .flex-box .desc { font-size: 14px; padding: 0;}
  .company-vision-slogan .flex-box.vision .img-box .text { font-size: 14px; text-align: center; padding: 0 30px;}
  .company-vision-slogan .flex-box.slogan .title { padding: 8px 16px; font-size: 14px;}
  .company-vision-slogan .flex-box.slogan ul { flex-direction: column;}
  .company-vision-slogan .flex-box.slogan ul li { width: 70%; margin: 30px auto 0; gap: 20px;}
  .company-vision-slogan .flex-box.slogan ul li:first-child { margin: 0 auto;}
  .company-vision-slogan .flex-box.slogan ul li .text {font-size: 14px;}
}
/* company-core */
.company-core { padding: 240px 0 228px; background: #222; color: #fff;}
.company-core .flex-box .col:first-child { padding-right: 10.6%;}
.company-core .flex-box .col:last-child { flex:1; padding-right: 6%;}
.company-core .flex-box .col article + article { margin-top: 161px;}
.company-core .flex-box .col .heading { line-height: 1.5;}
.company-core .flex-box .col figure { padding-bottom: 63%; border-radius: 20px; overflow: hidden; margin-bottom: 60px;}
.company-core .flex-box .col .title { margin-bottom: 28px; }
.company-core .flex-box .col .desc { font-size: 20px; color: #ccc;}
.company-core .sticky { padding-top: 40px; }
.company-core .sticky::before { content: ''; display: block; position: absolute; left: 0; top: -57%; background: url(/images/sub/company-core-bg.png) no-repeat center/cover; width: 58.3%; height: 45vw;}
@media screen and (max-width: 1024px) {
  .company-core { padding: 0 0 100px;}
  .company-core .flex-box { flex-direction: column; padding: 0 5%;}
  .company-core .sticky { padding: 100px 0 100px !important;}
  .company-core .sticky::before { display: none;}
  .company-core .flex-box .col:last-child { padding-right: 0;}
  .company-core .flex-box .col article + article { margin-top: 100px;}
}
@media screen and (max-width: 767px) {
  .company-core .sticky { padding: 80px 0 50px !important;}
  .company-core .flex-box .col article + article { margin-top: 50px;}
  .company-core .flex-box .col figure { margin-bottom: 30px;}
  .company-core .flex-box .col .title { margin-bottom: 15px;}
  .company-core .flex-box .col .desc { font-size: 14px;}
}
/* sec-history */
.sec-history { padding: 80px 0 67px;}
.sec-history .inner { height: 100%;}
.sec-history .content-top { position: sticky; top: 20px; margin-bottom: 140px; z-index: 9;}
.sec-history .content-top ul { padding: 18px 90px; background: #fff; display: flex; justify-content: space-around; align-items: center; box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.12); border-radius: 35px; max-width: 840px; margin: 0 auto; width: 90%;}
.sec-history .content-top ul li { font-size: 20px; color: #8E8E8E; font-weight: 500; cursor: pointer;}
.sec-history .content-top ul li[data-history="active"] { color: var(--accent2-color); font-weight: 700;}
.sec-history .content-body { display: flex; flex-direction: column; height: 100%;}
.sec-history .content-body > .col { width: 100%; position: relative;}
.sec-history .col + .col { margin-top: 137px;}
.sec-history .col .heading { margin-bottom: 60px; text-align: center;}
.sec-history .col .banner { padding-inline: calc(max((100vw - 1720px) / 2, 5vw)); margin-bottom: 80px; position: relative;}
.sec-history .col .banner figure { padding-bottom: 26%; overflow: hidden; border-radius: 20px;}
.sec-history .col .banner .title { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #fff; padding: 0 10%; text-align: center;}
.sec-history .col ul { display: flex; width: 100%; flex-direction: column;}
.sec-history .col ul li { display: grid; grid-template-columns: 20px auto; grid-auto-rows: 1fr; margin-left: auto; width: calc(50% + 10px);}
.sec-history .col ul li:nth-child(even) { grid-template-columns: auto 20px; margin-left: 0;}
.sec-history .col ul li:nth-child(even) .line-boxs { order: 2;}
.sec-history .col li:last-child .line-boxs .icon .line { display: none;}
.sec-history .col li .year + .year { margin-top: 40px;}
.sec-history .col li dt { font-size: 36px; font-weight: bold; color: #999; margin-bottom: 32px;}
.sec-history .col li dd { font-size: 20px; color: #666;}
.sec-history .col li dd + dd { margin-top: 16px;}
.sec-history .col .text-boxs { padding-bottom: 103px; margin-top: -19px;}
.sec-history .col .line-boxs { position: relative; width: 20px; height: 100%; }
.sec-history .col .line-boxs .icon-box { position: relative; width: 50%; height: 10px; position: relative; background: #ddd; border-radius: 50%; margin: 0 auto; z-index: 8;}
.sec-history .col .line-boxs .icon-box.active:before { border-color: #151515;}
.sec-history .col .line-boxs .line { width: 1px; height: 100%; position: absolute; left: 50%; transform: translateX(-50%); top: 5px; background: #ddd;}
.sec-history .col .line-boxs .line .percentage { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-origin: top; transform: scaleY(0); background: var(--accent2-color);}
.sec-history .col .line-boxs .icon-box .circle { position: absolute; border-radius: 50%; width: 100%; height: 100%; background: rgba(32, 53,48, .15); animation: pointer2 1.5s ease-in-out infinite; opacity: 0; visibility: hidden;}
.sec-history .col .text-boxs { padding-left: 120px;}
.sec-history .col ul li:nth-child(even) .text-boxs { padding-right: 120px; text-align: right;}
.sec-history .col .text-boxs.active dt { color: var(--accent2-color);}
.sec-history .col ul li[data-history="active"] .text-boxs dt{ color: var(--accent2-color);}
.sec-history .col ul li[data-history="active"] .text-boxs dd { color: #101010;}
.sec-history .col ul li[data-history="active"] .icon-box{ background: var(--accent2-color);}
.sec-history .col ul li[data-history="active"]:first-child .icon-box::before { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 32px; height: 32px; background: url(/images/sub/history-icon.png) no-repeat center/auto 100%;}
.sec-history .col ul li[data-history="active"]:first-child .icon-box::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 54px; height: 54px; background: rgba(252, 109, 37, 0.2); animation: pointer1 1.5s ease-in-out infinite; border-radius: 50%;}
@keyframes pointer1 {
    0%, 100% {
        opacity: 0.3;
        transform: translate(-50%, -50%) scale(0.5);
    }

    50% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}
@media screen and (max-width: 1024px) {
  .sec-history .content-top ul { padding: 18px 40px;}
  .sec-history .col .text-boxs { padding-left: 50px; padding-right: 10px;}
  .sec-history .col ul li:nth-child(even) .text-boxs { padding-right: 50px;}
  .sec-history .col .banner figure { padding-bottom: 45%;}
}
@media screen and (max-width: 767px) {
  .sec-history { padding: 80px 0 0;}
  .sec-history .content-top { margin-bottom: 80px;}
  .sec-history .content-top ul { flex-wrap: wrap; text-align: center; gap: 10px 0;}
  .sec-history .content-top ul li { font-size: 14px; width: 50%;}
  .sec-history .col + .col { margin-top: 0px;}
  .sec-history .col .heading { margin-bottom: 30px;}
  .sec-history .col .banner .title { line-height: 1.5;}
  .sec-history .col .banner figure { padding-bottom: 65%; margin-bottom: 50px;}
  .sec-history .col ul li { width: 90%; margin: 0 auto !important; grid-template-columns: 20px auto !important;}
  .sec-history .col ul li:nth-child(even) .line-boxs { order: 1;}
  .sec-history .col ul li:nth-child(even) .text-boxs { order: 2; text-align: left;}
  .sec-history .col li dt { font-size: 18px;}
  .sec-history .col li dd { font-size: 14px;}
  .sec-history .col .text-boxs { margin-top: -7px; padding-left: 10%;}
}
/* ci-information */
.ci-information { padding: 140px 0;}
.ci-information + .ci-information { background: #f7f7f7;}
.ci-information .content-top { margin-bottom: 80px;}
.ci-information .content-top .heading { margin-bottom: 45px; }
.ci-information .flex-box .col { flex: 1;}
.ci-information .flex-box .col:first-child { flex: 0 0 29.4%;}
.ci-information .flex-box:first-child { margin-bottom: 80px;}
.ci-information .flex-box:first-child .col .img-box { margin-bottom: 40px;}
.ci-information .flex-box:first-child .col .btns-group { justify-content: center; gap: 60px;}
.ci-information .grid-box { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; gap: 27px; margin-bottom: 20px;}
.ci-information .desc { font-size: 16px; color: #333;}
.ci-information .list li { padding: 40px; display: flex; justify-content: space-between; background: #6E3324; color: #fff; border-radius: 10px;}
.ci-information .list li + li { margin-top: 20px;}
.ci-information .list li:nth-child(2) { background: #598527;}
.ci-information .list li:nth-child(3) { background: #000;}
.ci-information .list li strong { font-size: 20px;}
.ci-information .list li .value-pair { display: flex; gap: 20px;}
.ci-information .list li .value-pair + .value-pair { margin-top: 12px;}
.ci-information .list li dt { font-weight: 700;}
.ci-information .list li dd { color: rgba(255,255,255,0.6);}
@media screen and (max-width: 767px) {
  .ci-information { padding: 80px 0 30px;}
  .content-top .text { font-size: 14px;}
  .ci-information .flex-box { flex-direction: column;}
  .ci-information .flex-box:first-child { margin-bottom: 50px;}
  .ci-information .flex-box:first-child .col .btns-group { gap: 20px;}
  .ci-information .flex-box:first-child .col .img-box { margin-bottom: 30px;}
  .ci-information .flex-box .col:first-child { margin-bottom: 30px;}
  .ci-information .grid-box { gap: 10px;}
  .ci-information .desc { font-size: 14px;}
  .ci-information .content-top { margin-bottom: 50px;}
  .ci-information .content-top .heading { margin-bottom: 30px;}
  .ci-information .list li { padding: 30px 20px; gap: 20px; flex-direction: column;}
  .ci-information .list li strong { font-size: 16px;}
  .ci-information .list li dt { flex: 0 0 27%;}
}

/* sec-ethical */
.sec-ethical { padding: 140px 0 0;}
.sec-ethical .content-top { margin-bottom: 80px;}
.sec-ethical .content-top .heading { margin-bottom: 45px;}
.sec-ethical .content-body { margin-bottom: 140px;}
.sec-ethical .flex-box { gap:40px; flex-wrap: wrap; margin-bottom: 40px;}
.sec-ethical article { padding: 65px 50px 40px; background: #f7f7f7; border-radius: 20px; width: calc((100% - 20%) / 3);}
.sec-ethical article:nth-child(3) { margin-right: auto;}
.sec-ethical article:nth-child(4) { margin-left: auto; }
.sec-ethical article .icon-box { margin-bottom: 30px; }
.sec-ethical article .sbj { font-size: 24px; font-weight: 700; color: #333;}
.sec-ethical article .desc { color: #666;}
.sec-ethical .banner { position: relative;}
.sec-ethical .banner::before { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 48%; background: #f7f7f7; z-index: -1;}
.sec-ethical .banner article { max-width: 1500px; margin: 0 auto; width: 90%; padding: 100px 80px; border-radius: 20px; overflow: hidden; background: url(/images/sub/ethical-bg.png)no-repeat center/cover; color: #fff;}
.sec-ethical .banner article .title { margin-bottom: 40px;}
.sec-ethical .banner article .text { font-size: 20px;}
@media screen and (max-width: 1024px) {
  .sec-ethical { padding: 100px 0 0;}
  .sec-ethical .flex-box { gap: 20px;}
  .sec-ethical article { width: calc((100% - 20px) / 2); padding: 50px 30px;}
  .sec-ethical .banner article { padding: 100px 50px;}
}
@media screen and (max-width: 767px) {
  .sec-ethical { padding: 80px 0 0;}
  .sec-ethical .content-top { margin-bottom: 50px;}
  .sec-ethical .content-top .heading { margin-bottom: 30px;}
  .sec-ethical article { width: 100%; padding: 30px 20px;}
  .sec-ethical article .sbj { font-size: 16px; margin-bottom: 10px;}
  .sec-ethical .content-body { margin-bottom: 50px;}
  .sec-ethical .banner article { padding: 50px 30px; background-position: center right;}
  .sec-ethical .banner article .text { font-size: 14px;}
}
/* ethical-info */
.ethical-info { padding: 140px 0 170px; background: #f7f7f7;}
.ethical-info li a { display: flex; align-items: center;}
.ethical-info .col { flex: 1;}
.ethical-info .col:first-child { flex: 0 0 29.3%;}
.ethical-info .grid-box { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); grid-auto-rows: 1fr; gap: 40px;}
.ethical-info article { padding: 40px 50px; background: #fff; border-radius: 10px;}
.ethical-info article .title { font-size: 24px; font-weight: bold; display: flex; align-items: center; margin-bottom: 28px;}
.ethical-info article .desc { font-size: 20px; font-weight: 300;}
@media screen and (max-width: 767px) {
  .ethical-info { padding: 80px 0;}
  .ethical-info .flex-box { flex-direction: column;}
  .ethical-info .flex-box .heading { margin-bottom: 30px;}
  .ethical-info .grid-box { gap: 20px;}
  .ethical-info article { padding: 30px 20px;}
  .ethical-info article .title { font-size: 16px;}
  .ethical-info article .desc { font-size: 14px;}
}

/* business-full */
.business-full { padding: 180px 0; color: #fff; position: relative; height: 100vh;}
.business-full .inner { flex-direction: column; display: flex; height: 100%;}
.business-full .bg { background: url(/images/sub/digital-bg1.png) no-repeat center/cover; border-radius: 20px; position: absolute; inset: 10vw; z-index: -1;}
/* .business-full .row:first-child { margin-bottom: 244px;} */
.business-full .row:last-child { display: flex; justify-content: flex-end; padding-right: 80px; margin-top: auto;}
.business-full .title { margin-bottom: 28px; }
.business-full .desc { font-size: 20px;}
.business-full .desc + a { 
  display: inline-block;
  margin-top: 40px;
  font-size: 16px;
  color: #fff;
  padding: 20px 40px;
  background: var(--accent-color);
}
.digital-full .business-full:last-child .bg { background-image: url(/images/sub/digital-bg2.png);}
.device-full .business-full:last-child .bg { background-image: url(/images/sub/device-bg1.png);}
.contents-full:nth-child(1) .business-full:last-child .bg { background-image: url(/images/sub/contents-bg.png);}
.contents-full:nth-child(2) .business-full:last-child .bg { background-image: url(/images/sub/contents-bg2.png);}
.joo .contents-full:nth-child(1) .business-full .bg { background-image: url(/images/sub/joo-bg1.png);}
.joo .contents-full:nth-child(2) .business-full .bg { background-image: url(/images/sub/joo-bg2.png);}
.ds .contents-full:nth-child(1) .business-full .bg { background-image: url(/images/sub/ds-bg1.png);}
.ds .contents-full:nth-child(2) .business-full .bg { background-image: url(/images/sub/ds-bg2.jpg);}
@media screen and (max-width: 767px) {
  .business-full { padding: 80px 0; height: 70vh;}
  .business-full .row:first-child { margin-bottom: 100px;}
  .business-full .desc { font-size: 14px;}
  .business-full .desc + a {font-size: 14px; padding: 10px 20px;}
}
/* business-solution */
.business-solution { padding: 140px 0; overflow: hidden; position: relative;}
.business-solution img { width: 100%;}
.business-solution .flex-box { align-items: center;}
.business-solution .text-boxs { padding-right: 10%;}
.business-solution .text-boxs .title { font-size: 16px; font-weight: bold; color: #fff; padding: 12px 22px; border-radius: 35px; background: var(--accent-color); margin-bottom: 36px;}
.business-solution .text-boxs .heading { margin-bottom: 60px;}
.business-solution .text-boxs .desc { color: #101010;}
.business-solution .col { width: 50%;}
.business-solution .col:last-child { flex: 1;}
.business-solution:nth-child(odd) .col:first-child { padding-right: 13.3%; }
.business-solution:nth-child(even) { background: #f7f7f7;}
.business-solution:nth-child(even) .col:first-child { flex: 0 0 44%;}
@media screen and (max-width: 1024px) {
  .business-solution { padding: 100px 0;}
}
@media screen and (max-width: 767px) {
  .business-solution { padding: 80px 0;}
  .business-solution .text-boxs { padding: 0;}
  .business-solution .text-boxs .title { font-size: 14px; padding: 8px 15px; margin-bottom: 20px;}
  .business-solution .text-boxs .heading { margin-bottom: 30px;}
  .business-solution .flex-box { flex-direction: column;}
  .business-solution .col { width: 100%;}
  .business-solution:nth-child(even) .col:first-child { margin-bottom: 30px;}
  .business-solution:nth-child(odd) .col:first-child { padding: 0; margin-bottom: 30px;}
}

.business-solution.last_bg::before { content: ''; display: block; width: 626px; height: 677px; background: url(/images/sub/global-icon3.png) no-repeat center/cover; position: absolute; right: 0; top: 0;}

/* global-list */
.global-list { position: relative; height: 937px;}
.global-list .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/images/sub/global-bg1.png) no-repeat center/auto 100%; padding: 140px 100px; color: #fff;}
.global-list:nth-child(2) .bg { background-image: url(/images/sub/global-bg2.png);}
.global-list .row { padding-bottom: 180px; padding-left: 130px; width: 50%; margin-left: auto; display: flex; align-items: flex-end; height: 100%;}
.global-list .text-boxs .title { margin-bottom: 40px;}
.global-list .text-boxs .desc { font-size: 20px; color: #101010;}
.global-list:nth-child(odd)::before { content: ''; display: block; width: 626px; height: 677px; background: url(/images/sub/global-icon1.png) no-repeat center/cover; position: absolute; left: 0; bottom: 0;}
.global-list:nth-child(even)::before { content: ''; display: block; width: 815px; height: 677px; background: url(/images/sub/global-icon2.png) no-repeat center/cover; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);}
.global-list:nth-child(even) .bg { left: auto; right: 0; text-align: right;}
.global-list:nth-child(even) .row { margin-left: 0; padding-left: calc(max((100vw - 1500px) / 2, 5vw)) !important;}
.global-list .hash_wrap {display: flex; align-items: center; margin-top: 20px;}
.global-list .hash_wrap span {border: 1px solid #ddd; border-radius: 999px; padding: 5px 10px; font-size: 14px; color: #666;}
@media screen and (max-width: 1024px) {
  .global-list .row { padding-bottom: 50px; padding-left: 40px;}
  .global-list .bg { padding: 100px 20px;}
}
@media screen and (max-width: 767px){
  .global-list { height: auto; overflow: hidden;}
  .global-list .row { width: 100%; padding: 30px 20px;}
  .global-list .text-boxs .desc { font-size: 14px;}
  .global-list .bg { position: static;}
}

/* careers-cultivate */
.careers-motion .content-top { padding-top: 140px; text-align: center; margin-bottom: 140px;}
.careers-motion .content-top .heading { line-height: 1.5;}
.careers-motion .content-body { position: relative; z-index: 1; width: 90%; height: 100svh; background: #222; display: flex; align-items: center; color: #fff; margin: 0 auto; padding: 50px 0;}
.careers-motion .content-body .inner { height: 100%;}
.careers-motion .content-body .col { opacity: 0; height: 100%;}
.careers-cultivate .flex-box { justify-content: space-between; height: 100%;}
.careers-cultivate .flex-box .title { padding-top: 154px; white-space: nowrap;}
.careers-cultivate .img-box { display: flex; align-items: center; justify-content: center; height: 100%;}
.careers-cultivate .img-box img:not(.cultivate-bg) { position: relative; z-index: 1; height: 100%; aspect-ratio: 1/1;}
.careers-cultivate .img-box .cultivate-bg { position: absolute; animation: rotate360 20s linear infinite; height: 75%;}
.careers-employ { margin-bottom: 140px;}
.careers-employ .inner { display: flex; align-items: center; justify-content: space-between;}
.careers-employ .flex-box .col { flex:1;}
.careers-employ .flex-box .col:first-child { flex: 0 0 22%;}
.careers-employ .grid-box { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 1fr; gap: 42px; margin-bottom: 100px; padding-top: 80px;}
.careers-employ .grid-box article { text-align: center; position: relative;}
.careers-employ .grid-box article:not(:first-child)::before { content:''; display: block; width: 40px; height: 40px; background: url(/images/sub/careers-step-icon.png) no-repeat center/auto 100%; position: absolute; bottom: -5px; left: -40px;}
.careers-employ .grid-box article .circle { display: flex; align-items: center; justify-content: center; margin-bottom: 22px;}
.careers-employ .grid-box article .circle i.icon { position: absolute;}
.careers-employ .grid-box article svg { width: 100%;  height: auto; max-width: 261px;  }
.careers-employ .grid-box article .text { font-size: 20px; color: #fff; text-align: center; font-weight: 600;}
.careers-employ .desc { font-size: 20px;}
@keyframes rotate360 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@media screen and (max-width: 1024px) {
  .careers-motion .content-top { padding-top: 100px; margin-bottom: 100px;}
  .careers-motion .flex-box { flex-direction: column;}
  .careers-motion .flex-box .title { padding-top: 0; margin-bottom: 50px;}
  .careers-employ .grid-box article .text { font-size: 16px;}
}
@media screen and (max-width: 767px) {
  .careers-motion .content-top { padding: 80px 5% 0; margin-bottom: 50px;}
  .careers-motion .content-body { height: auto; padding: 80px 0;}
  .careers-cultivate .img-box .cultivate-bg { width: 75%;}
  .careers-employ { margin-bottom: 80px;}
  .careers-employ .grid-box { grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 20px;  margin-bottom: 50px; padding-top: 0;}
  .careers-employ .grid-box article:not(:first-child)::before { display: none;}
  .careers-employ .grid-box article .circle i.icon img { width: 70%; }
  .careers-employ .desc { font-size: 14px;}
}
/* careers-performance */
.careers-performance { margin-bottom: 140px;}
.careers-performance .content-top { display: flex; justify-content: space-between; margin-bottom: 80px;}
.careers-performance .content-top .text { font-size: 20px; color: #333;}
.careers-performance .content-body figure { padding-bottom: 60%;}
/* careers-welfare */
.careers-welfare { padding-bottom: 185px;}
.careers-welfare .content-top { margin-bottom: 80px; }
.careers-welfare .heading { line-height: 1.5;}
.careers-welfare .grid-box { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px; padding-left: calc(max((100vw - 1500px) / 2, 5vw));}
.careers-welfare .grid-box article { background: #f7f7f7; border-radius: 20px; padding: 116px 50px 63px; position: relative;}
.careers-welfare .grid-box article .icon { position: absolute; right: 12.5%; top: 12.5%;}
.careers-welfare .grid-box article .title { font-size: 24px; margin-bottom: 24px;}
.careers-welfare .grid-box article li { display: flex;}
.careers-welfare .grid-box article li + li { margin-top: 16px; }
.careers-welfare .grid-box article .dot { margin-right: 12px; flex-shrink: 0; margin-top: 10px;}
@media screen and (max-width: 1024px) {
  .careers-welfare .grid-box { padding-left: 0; gap: 20px;}
}
@media screen and (max-width: 767px) {
  .careers-welfare { padding-bottom: 80px;}
  .careers-performance { margin-bottom: 50px;}
  .careers-performance .content-top { flex-direction: column; margin-bottom: 50px;}
  .careers-performance .content-top .heading { margin-bottom: 30px;}
  .careers-performance .content-top .text { font-size: 14px;}
  .careers-welfare .content-top { margin-bottom: 50px;}
  .careers-welfare .grid-box article { padding: 60px 30px 40px;}
  .careers-welfare .grid-box article li + li { margin-top: 10px;}
  .careers-welfare .grid-box article .icon { right: 5%; top: 8%;}
  .careers-welfare .grid-box article .icon img { width: 70%; display: block; margin-left: auto;}
  .careers-welfare .grid-box article .dot { margin-top: 8px;}
}
