@charset "utf-8";

/* ===================================================== */
/* 콘텐츠 공통 */
.sub-sec-tit { margin-bottom: calc(7rem - 15px); font-weight: 800;font-size: calc(10px + 2rem); color: #222;}
.down-btn {display: flex; height: 3.2em; font-weight: 800; font-size: calc(8px + 1rem);}
.down-btn span { display: flex; align-items: center; padding: 0 2.5em; border: 2px solid #222; border-right-style: hidden; background: linear-gradient(to left, #222 0%, #222 100%) no-repeat calc(100% + 2px)/0 calc(100% + 4px); line-height: 1.1; letter-spacing: normal; color: #222; transition: all .3s;}
.down-btn::after { width: 3.2em; height: 100%; border-bottom-right-radius: 1em; background: #222 url(../images/sub/ico_down_white.svg) no-repeat center;content: '';}
.down-btn:hover span {background-size: calc(100% + 4px) calc(100% + 4px); color: #fff;}

@media (max-width: 1024px) {
  .down-btn span {padding: 0 2em;}
  .down-btn::after {background-size: 50%;}
}
/* 콘텐츠 공통 */
/* ===================================================== */

/* ===================================================== */
/* COMPANY _ 인사말 */
.greet { padding-bottom: 20rem;}
.greet-wrap {display: grid; grid-template-columns: max(33%, 48rem) 1fr; grid-template-rows: repeat(7, auto); column-gap: 8%; position: relative;}
.greet-wrap::before { grid-column: 1 / -1; grid-row: 3 / 4; position: absolute; width: var(--inner-width); height: 100%; background-color: var(--color-bg-main);content: '';  pointer-events: none; justify-self: center;}
.greet-wrap::after { grid-column: 2 / 3; grid-row: 1 / 5; position: absolute; width: calc(100% + var(--inner-padding)); height: 100%; border: solid var(--color-main); border-width: 2px 0;content: ''; pointer-events: none;}
.greet-wrap .subtit { position: relative; padding: 6rem 0 1.5rem; font-size: 18px; font-family: var(--font-kohi);color: #c5cccc;}
.greet-wrap .tit { position: relative; padding-bottom: 2rem; font-weight: 300;font-size: 65px; color: #222;}
.greet-wrap .tit span {font-weight: 800;}
.greet-wrap .tit span:first-child {color: var(--color-main);}
.greet-wrap .desc {  position: relative; z-index: 5; padding: 5rem 0; font-weight: 800;font-size: 2.5rem; color: var(--color-main);}
.greet-wrap .desc::before { position: absolute; top: -5.1rem; right: 0; width: 16rem; height: 12rem; background: url(../images/sub/company_greet_img02.png) no-repeat right top/contain;content: '';}
.greet-wrap .desc p { position: relative; max-width: 65rem;}
.greet-wrap .detail { max-width: 65rem; padding: 5rem 0; font-weight: 600;font-size: 18px; line-height: 1.8;}
/* CEO */
.greet-wrap .ceo { padding-top: 6rem;font-weight: 800; font-size: 22px; color: #222;}
.greet-wrap .ceo-desc { margin-bottom: 1rem;color: var(--color-main);}
.greet-wrap .ceo-name {font-size: 2em; letter-spacing: 0.5em;}
/* 왼쪽 이미지 */
.greet-wrap .left {grid-column: 1 / 2; grid-row: 1 / -1; align-self: start; position: relative; z-index: 5;}
.greet-wrap .imgwrap {position: relative; width: 100%; padding-top: 74%; filter: drop-shadow(0.4rem 0.7rem 6rem rgba(22, 5, 9, 0.2));}
.greet-wrap .imgwrap::before { position: absolute; right: -1.1rem; bottom: -1.1rem; z-index: 10; width: 17rem; padding-top: 28%; background: url(../images/common/img_deco.svg) no-repeat left top/contain;content: ''; transform: rotate(180deg);}
.greet-wrap .imgwrap img { position: absolute; top: 0; left: 0; width: 100%; height: 100%;border-radius: 4rem 0; object-fit: cover;}

@media (max-width: 1440px) {
  .greet-wrap .desc::before {top: auto; bottom: -2.65rem; width: 12rem; height: 9rem;}
}
@media (max-width: 1280px) {
  .greet-wrap {column-gap: 6%;}
  .greet-wrap .subtit, 
  .greet-wrap .detail {font-size: 17px; }
  .greet-wrap .tit {font-size: calc(20px + 3.5vw); }
  .greet-wrap .ceo { font-size: 20px;}
  .greet-wrap .imgwrap {filter: drop-shadow(0.4rem 0.7rem 6rem rgba(22, 5, 9, 0.1));}
}
@media (max-width: 1024px) {
  .greet-wrap {grid-template-columns: 4fr 5fr;}
  .greet-wrap .tit {font-size: calc(15px + 4vw); }
  .greet-wrap .desc {font-size: 20px;}
  .greet-wrap .desc::before { bottom: -2.35rem; width: 10rem; height: 7.5rem;}
  .greet-wrap .subtit, 
  .greet-wrap .detail {font-size: 16px; }
  .greet-wrap .imgwrap { padding-top: 80%;}
}
@media (max-width: 768px) {
  .greet-wrap {grid-template-columns: 1fr; padding: 0 8%;}
  .greet-wrap::before {grid-row: 2 / 6; align-self: end; height: calc(100% - 3.5rem);}
  .greet-wrap::after {grid-column: 1 / -1; width: var(--inner-width); border-width: 1px 0; justify-self: center; grid-row-end: 7;}
  .greet-wrap .subtit {padding-bottom: 0.5rem;}
  .greet-wrap .tit {font-size: calc(15px + 6vw); }
  .greet-wrap .desc {padding: 1.5rem 0 7rem;}
  .greet-wrap .desc::before { right: -5rem; bottom: -3.6rem; width: 16rem; height: 12rem;}
  .greet-wrap .desc p {max-width: none;}
  .greet-wrap .detail {padding: 7rem 0;}
  .greet-wrap .ceo { font-size: 19px;}
  .greet-wrap .left {grid-row: 1 / 3; order: -5; width: 95%;}
  .greet-wrap .imgwrap { padding-top: 7rem; filter: drop-shadow(0.4rem 0.7rem 6rem rgba(22, 5, 9, 0.2));}
  .greet-wrap .imgwrap::before {width: 36%;}
  .greet-wrap .imgwrap img {position: relative; object-fit: fill;}
}
@media (max-width: 576px) {
  .greet-wrap .desc {font-size: 18px;}
  .greet-wrap .subtit, 
  .greet-wrap .detail {font-size: 15px; }
  .greet-wrap .ceo { font-size: 18px;}
}
@media (max-width: 480px) {
  .greet {overflow: hidden;}
  .greet-wrap {padding: 0;}
  .greet-wrap .left { width: 97%;}
}
/* COMPANY _ 인사말 */
/* ===================================================== */
/* COMPANY _ 인사말 _ en */
:lang(en) .greet-wrap .tit { font-size: 55px;font-family: var(--font-kohi);}
:lang(en) .greet-wrap .tit span { font-weight: normal; color: var(--color-main); white-space: nowrap;}
:lang(en) .greet-wrap .tit span:last-child {font-size: 0.8em; }
:lang(en) .greet-wrap .ceo-name { margin-bottom: 0.2em; font-weight: normal; font-family: var(--font-kohi);letter-spacing: 0.025em;}
:lang(en) .greet-wrap .ceo-desc span {display: block; font-size: 1.5em; line-height: 1;}
@media (max-width: 1280px) {
  :lang(en) .greet-wrap .tit {font-size: 4vw; }
}
@media (max-width: 1024px) {
  :lang(en) .greet-wrap .tit { padding: 1rem 0 3rem;font-size: 6vw; line-height: 1;}
  :lang(en) .greet-wrap .imgwrap { padding-top: 90%;}
}
@media (max-width: 768px) {
  :lang(en) .greet-wrap .tit {font-size: 6.5vw;}
  :lang(en) .greet-wrap .imgwrap { padding-top: 7rem; }
}
@media (max-width: 576px) {
  :lang(en) .greet-wrap .tit {font-size: 10.5vw;}
}
@media (max-width: 480px) {
  :lang(en) .greet-wrap .tit {font-size: 12.2vw;}
}
/* COMPANY _ 인사말 _ en */
/* ===================================================== */


/* ===================================================== */
/* COMPANY _ 일반현황 */

/* 경영이념 */
.state-vision { overflow: hidden;margin-bottom: 11rem;}
.state-vision .sec-header {margin-bottom: 8rem;}
.state-vision .tit { margin-bottom: 2rem; filter: blur(0.3em);  font-size: 4.5rem; font-family: var(--font-kohi); line-height: 1.15;text-align: center; color: var(--color-main);animation: fade-in-blur 1s ease-out both paused;}
.aos-animate.state-vision .tit {animation-play-state: running;}
.state-vision .desc { font-weight: 600; font-size: 2.5rem; line-height: 1.4;text-align: center;}

/* 경영이념 다이어그램 */
.state-vision .area { position: relative; padding: 10rem 0 12rem; background: url(../images/sub/company_state_vision_bg.jpg) no-repeat center/cover; }
.state-vision .area::before { opacity: 0; position: absolute; top: -4.5rem; left: calc(50% - 1px); width: 2px; height: 9rem;background-color: #222;content: ''; transform: scaleY(0); transform-origin: center top; transition: .6s;}
.state-vision .area.aos-animate::before { opacity: 1; transform: scaleY(1) ;}

/* 콘텐츠, 변수 */
.state-vision .area .inner {display: grid; grid-template-columns: 1fr min(50em, 50%) 1fr; grid-auto-flow: column; font-size: 10px;}
.state-vision .area :where(.ico-item, .txt-item):nth-child(1) {--item-ico: url(../images/sub/company_state_vision_ico01.png); --item-color: var(--color-main);}
.state-vision .area :where(.ico-item, .txt-item):nth-child(2) {--item-ico: url(../images/sub/company_state_vision_ico02.png); --item-color: #404244; --item-deg: -120deg;}
.state-vision .area :where(.ico-item, .txt-item):nth-child(3) {--item-ico: url(../images/sub/company_state_vision_ico03.png); --item-color: #678089; --item-deg: 120deg; }
/* 텍스트 */
.state-vision .area .txt-item { display: flex; align-items: center; padding: 5em; font-weight: 800; line-height: 1.3; color: var(--item-color); animation: var(--item-ani) .8s ease-out calc(0.9s + var(--item-index) * 0.25s) paused backwards;}
.state-vision .area .txt-item:nth-child(1) {--item-ani: fade-up; grid-column: 1 / -1; padding-top: 0; text-align: center;}
.state-vision .area .txt-item:nth-child(2) {--item-ani: fade-right; padding-left: 0; text-align: right; }
.state-vision .area .txt-item:nth-child(3) {--item-ani: fade-left; padding-right: 0;}
.state-vision .area .txt-item span { width: 100%;font-size: 3em;}
.state-vision .area.aos-animate .txt-item {animation-play-state: running;}
/* 이미지 */
.state-vision .area .ico-wrap {grid-column: 2 / 3;}
.state-vision .area .ico-list {position: relative; padding-top: 115.47%;}
.state-vision .area .ico-item { opacity: 0;position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: rotate(var(--item-deg, 0deg)) translateY(4em); animation: vision-diagram 0.6s ease-out calc(0.5s + var(--item-index) * 0.25s) paused forwards;}
.state-vision .area .ico-inner {height: 100%; transform: translateY(-1.5em);}
.state-vision .area .ico-inner i { display: flex; position: relative; width: 100%; height: 50%; background-color: var(--item-color); clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);}
.state-vision .area .ico-inner i::before { display: block; width: 60%; height: 60%; margin: auto; background-color: #fff; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);content: '';}
.state-vision .area .ico-inner i::after { position: absolute; top: 50%; left: 50%; width: 7.2em; height: 7.2em; background: var(--item-ico) no-repeat center/contain;content: ''; transform: translate(-50%, -50%) rotate(calc(var(--item-deg, 0deg) * -1)); }
.state-vision .area.aos-animate .ico-item {animation-play-state: running;}
@keyframes vision-diagram { to { opacity: 1;transform: rotate(var(--item-deg, 0deg)) translateY(0);} }


/* ===== 연혁 ===== */
.state-history { display: grid;position: relative; padding-bottom: 20rem;}
.state-history::before { grid-row: 2 / 4; position: absolute; position: absolute; top: 14.5rem; left: 0; width: 100%; height: 100%; background-color: var(--color-bg-gray);content: '';}
.state-history .area {overflow-x: auto; position: relative; padding-bottom: 3rem;}
.state-history .area::-webkit-scrollbar {height: 6px; border-radius: 30px; background-color: #fff;}
.state-history .area::-webkit-scrollbar-thumb { border: solid transparent; border-width: 1px;background-color: var(--color-main); background-clip: content-box;}
.state-history .area::-webkit-scrollbar-button { width: 15px;background-color: var(--color-bg-gray);}
/* 연혁 콘텐츠 */
.state-history .list {display: flex; justify-content: space-between; min-width: 140rem; text-align: center;}
.state-history .item {width: 32%; animation: fade-left 0.6s ease-in-out calc(0.2s * (var(--item-index) + 1) + 0.3s) both paused;}
.state-history .aos-animate .item {animation-play-state: running;} 
.state-history .item:not(:last-child) {margin-right: -15%;}
.state-history .tit {position: relative;}
.state-history .date {position: absolute; top: 50%; left: 50%; font-size: calc(10px + 1rem);font-family: var(--font-kohi); color: var(--item-color); transform: translate(-50%, -50%);}
.state-history .deco svg {width: 100%;}
.state-history .cont {display: flex; flex-direction: column; justify-content: center; align-items: center; row-gap: 1.5rem; width: 60%; margin: 10px auto 0; font-size: calc(7px + 1.1rem); line-height: 1.3;}
.state-history .cont::before { width: 10px; height: 8rem; border: dotted #a09d9b; border-width: 10px 0; background: linear-gradient(to top, #a09d9b 0%, #a09d9b 100%) no-repeat center/2px 200%;content: ''; }
.state-history .cont p { font-weight: 700;color: #444;}
.state-history .cont em { font-weight: 800;color: var(--item-color);}
/* 색상 변수 */
.state-history .item:nth-child(1) {--item-color: #3d4042; z-index: 5;}
.state-history .item:nth-child(2) {--item-color: #5b5b5b; z-index: 4;}
.state-history .item:nth-child(3) {--item-color: #7f7f7f; z-index: 3;}
.state-history .item:nth-child(4) {--item-color: #59828c; z-index: 2;}
.state-history .item:nth-child(5) {--item-color: var(--color-main);}
.state-history .svg-symbol {display: none;}

@media (max-width: 1280px) {
  .state-vision .area .inner { font-size: 9px;}
}
@media (max-width: 1024px) {
  .state-vision .area .inner { font-size: 8px;}
  .state-vision .tit { font-size: 3.8rem;}
}
@media (max-width: 768px) {
  .state-vision .area .inner { font-size: 1vw;}
  .state-history .cont::before { width: 8px; border-width: 8px 0; }
}
@media (max-width: 640px) {
  .state-vision .desc {font-size: 2.2rem;}
  .state-vision .area { padding-bottom: 8rem;background-image: linear-gradient(to top, var(--color-white-a9) 0%, transparent 100%), url(../images/sub/company_state_vision_bg.jpg); background-size: 102% 102%, cover;}
  .state-vision .area .inner {grid-template-columns: repeat(2, 1fr); grid-auto-flow: dense; font-size: 8px;}
  .state-vision .area .ico-wrap {grid-column: 1 / -1; width: 70%; grid-row-start: 2; justify-self: center;}
  .state-vision .area .txt-item:nth-child(1) {padding: 0 0 3.5em;}
  .state-vision .area .txt-item:nth-child(2) {--item-ani: fade-down; padding-top: 3.5em; padding-right: 1.155em;}
  .state-vision .area .txt-item:nth-child(3) {--item-ani: fade-down; padding-top: 3.5em; padding-left: 1.155em;}
}
@media (max-width: 480px) {
  .state-vision .area .inner {font-size: 1.46vw;}
  .state-vision .area .ico-wrap { width: min(50em, 90%);}
  .state-vision .area .txt-item span {font-size: 3.4em;}
  .state-history .cont::before { width: 6px; border-width: 6px 0; }
}
@media (max-width: 375px) {
  .state-vision .area .inner {font-size: 1.73vw;}
}
/* COMPANY _ 일반현황 */
/* ===================================================== */
/* COMPANY _ 일반현황 _ en */
:lang(en) .state-vision .area .txt-item { padding: 5em 0;}
:lang(en) .state-vision .area .txt-item:nth-child(2) {padding-right: 5em;}
:lang(en) .state-vision .area .txt-item:nth-child(3) {padding-left: 5em;}
:lang(en) .state-vision .area .txt-item span { font-size: 2.7em;}
:lang(en) .state-history .cont { width: 51%; font-size: calc(7px + 1rem); letter-spacing: normal; }
@media (max-width: 1280px) {
  :lang(en) .state-vision .area .txt-item:not(:first-child) br {display: none;}
}
@media (max-width: 1024px) {
  :lang(en) .state-vision .area .inner { font-size: 0.86vw;}
}
@media (max-width: 768px) {
  :lang(en) .state-vision .area { padding-bottom: 8rem;background-image: linear-gradient(to top, var(--color-white-a9) 0%, transparent 100%), url(../images/sub/company_state_vision_bg.jpg); background-size: 102% 102%, cover;}
  :lang(en) .state-vision .area .inner {grid-template-columns: repeat(2, 1fr); grid-auto-flow: dense; font-size: 1.1vw;}
  :lang(en) .state-vision .area .ico-wrap {grid-column: 1 / -1; width: 70%; grid-row-start: 2; justify-self: center;}
  :lang(en) .state-vision .area .txt-item:nth-child(1) {padding: 0 0 3.5em;}
  :lang(en) .state-vision .area .txt-item:nth-child(2) {--item-ani: fade-down; padding-top: 3.5em; padding-right: 1.155em;}
  :lang(en) .state-vision .area .txt-item:nth-child(3) {--item-ani: fade-down; padding-top: 3.5em; padding-left: 1.155em; align-items: start;}
}
@media (max-width: 576px) {
  :lang(en) .state-vision .area .inner {font-size: 1.433vw;}
  :lang(en) .state-vision .area .ico-wrap { width: min(50em, 90%);}
  :lang(en) .state-vision .area .txt-item span { word-break: break-word;}
}
@media (max-width: 375px) {
  :lang(en) .state-vision .area .inner {font-size: 1.73vw;}
}
/* COMPANY _ 일반현황 _ en */
/* ===================================================== */

/* ===================================================== */
/* COMPANY _ CI소개 */
.ci {margin-bottom: 25rem;}
.ci .logo-item { display: flex; padding: calc(4% + 40px) 7%;border: 1px solid var(--color-bg-gray); background: linear-gradient(to right, var(--color-bg-gray) 1px, transparent 1px) repeat-x -1px top/calc(1px + 1rem) auto, #fff linear-gradient(to bottom, var(--color-bg-gray) 1px, transparent 1px) repeat-y left center/auto calc(1px + 1rem);}
.ci .logo-item img { display: block;width: 100%; margin: auto;}
/* CI 개요 */
.ci-about {display: grid; margin-bottom: 12rem; text-align: center;}
.ci-about::before { grid-row: 1 / 4; position: absolute; width: var(--inner-width); height: 100%; background-color: var(--color-bg-main);content: ''; justify-self: center;}
.ci-about .tit { position: relative; padding: 8rem 0 2rem;font-size: 2rem; font-family: var(--font-kohi); letter-spacing: min(0.6em, 2vw); text-indent: min(0.6em, 2vw); color: #222;}
.ci-about .desc { position: relative; margin: 0 auto 7rem; font-weight: 500;font-size: 2rem; color: #444;}
.ci-about .logo-item { grid-row: 3 / 2 span; position: relative; margin-bottom: 3.5rem;}
.ci-about .logo-item img {max-width: 980px;}
.ci-about .down-btn {margin-left: auto;}
/* CI 핵심 */
.ci-core { padding-bottom: 10em; margin-bottom: 10em; background: linear-gradient(to bottom,transparent 24.3em, var(--color-bg-gray) 24.3em) no-repeat center top;font-size: 10px;text-align: center; }
.ci-core .list {display: flex; justify-content: space-evenly; column-gap: 4%; padding: 0 5%; }
.ci-core .item {flex: 1; max-width: 28em;}
.ci-core .tit { position: relative; padding-top: 115.5%; margin-bottom: 15%; filter: var(--drop-shadow-2); font-weight: 700; font-size: 4em;color: #fff;}
.ci-core .tit::before { position: absolute; top: 33%; left: 10%; width: 80%; height: 80%; background-image: linear-gradient(to top, var(--color-main) 25%, transparent 25% ); clip-path: polygon(50% calc(100% - 3px), 100% calc(75% - 3px), 100% 75%, 50% 100%, 0 75%, 0 calc(75% - 3px)) ;content: ''; }
.ci-core .tit::after { position: absolute; top: 105.5%; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: var(--color-main);content: ''; transform: translate(-50%, -50%);}
.ci-core .tit-inner { display: flex; flex-direction: column; justify-content: center; align-items: center;position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--color-main); clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); }
.ci-core .item:nth-child(2) .tit::before {top: auto; bottom: 33%; transform: rotate(180deg);}  
.ci-core .tit h4 { margin-bottom: 0.65em; line-height: 1.1;}
.ci-core .tit h5 { padding: 0.6em 0 0.4em; border: solid rgba(0, 0, 0, 0.5); border-width: 1px 0; font-size: 0.5em; font-family: var(--font-kohi); color: #222;}
.ci-core .desc {font-weight: 500; font-size: 2rem; color: #222; }
.ci-core .desc::before { display: block; width: 1px; height: 3em; margin: 0 auto 2em; background-color: #222;content: '';}
/* CI color */
.ci-color .list {display: grid; grid-template-columns: 1fr 1fr; gap: 3rem;}
.ci-color .logo-item {padding: 9% 7%;}
.ci-color .logo-item img {max-width: 480px;}
.ci-color .logo-item:first-child {grid-row-start: span 2;}
.ci-color .color-item {display: flex; padding-top: 8%;}
.ci-color .color-item li { flex: 1;padding-top: 29%;}
.ci-color .color-main li:nth-child(1) {background-color: var(--color-main);}
.ci-color .color-main li:nth-child(2) {background-color: #009bd5;}
.ci-color .color-main li:nth-child(3) {background-color: var(--color-sub);}
.ci-color .color-sub {column-gap: 2%;}
.ci-color .color-sub li:nth-child(1) {background-color: #707173;}
.ci-color .color-sub li:nth-child(2) {background-image: linear-gradient(109.63deg, #D9B449 0.01%, #EBD78B 13%, #FFFCD1 25%, #EFDF99 37%, #E3C76D 47%, #DBB952 55%, #D9B448 60%, #DBB84F 66%, #E3C662 75%, #EFDB83 85%, #F3E18B 87%, #FFFCD1 100%);}
.ci-color .color-sub li:nth-child(3) {background-image: linear-gradient(109.62deg, #DAD5CF 0%, #CBC6C1 7%, #B6B2AD 15%, #E9EAEA 52%, #DCDCDB 63%, #BCB8B4 84%, #B6B2AD 88%, #B5B6B6 100%);}

@media (max-width: 1280px) {
  .ci-core {font-size: 9px; }
  .ci-core .tit::after {width: 7px; height: 7px;}
}
@media (max-width: 1024px) {
  .ci-about .tit {letter-spacing: 0.8vw; text-indent: 0.8vw;}
  .ci-core { font-size: 0.875vw; }
  .ci-core .list { column-gap: 2%; padding: 0; }
  .ci-core .tit::before { clip-path: polygon(50% calc(100% - 2px), 100% calc(75% - 2px), 100% 75%, 50% 100%, 0 75%, 0 calc(75% - 2px)); }
  .ci-core .tit::after {width: 6px; height: 6px;}
  .ci-core .tit h4 { margin-bottom: 0.5em;}
  .ci-core .tit h5 { font-size: 0.6em; }
  .ci-core .desc br {display: none;}
}
@media (max-width: 768px) {
  .ci-about .tit { padding-bottom: 3.5rem;font-size: calc(10px + 1.5vw); line-height: 1.4; letter-spacing: 0.4em; text-indent: 0.4em;}
  .ci-about .tit span {display: block;}
  .ci-about .desc {margin-bottom: 5.5rem; font-size: 17px;}
  .ci-about .desc br {display: none;}
}
@media (max-width: 640px) {
  .ci-core { padding-top: 9rem; background: var(--color-bg-gray);font-size: 1rem;}
  .ci-core .list {flex-direction: column; align-items: center; row-gap: 6.5rem;}
  .ci-core .item { width: 100%;max-width: 400px;}
  .ci-core .tit {padding-top: 0; margin-bottom: 0;}
  .ci-core .tit::before,
  .ci-core .tit::after {display: none;}
  .ci-core .tit-inner {position: relative; padding: 4rem 0 6rem; border-radius: 3rem 0; clip-path: none;}
  .ci-core .tit h4 br {display: none;}
  .ci-core .tit h5 {font-size: 0.6em;}
  .ci-core .desc { position: relative; font-size: 16px;}
  .ci-core .desc::before { margin: -1.5em auto 1.3em;}
  .ci-core .desc br {display: block;}
  .ci-color .list {grid-template-columns: 1fr;}
  .ci-color .logo-item {padding: 7%;}
  .ci-color .logo-item img {max-width: 480px;}
  .ci-color .color-sub {padding-top: 0;}
}
@media (max-width: 480px) {
  .ci-about .desc {margin-bottom: 5.5rem; font-size: 15px;}
}
@media (max-width: 414px) {
  .ci-about .tit {letter-spacing: 0.3em; text-indent: 0.3em;}
}
/* COMPANY _ CI소개 */
/* ===================================================== */
/* COMPANY _ CI소개 _ en */
:lang(en) .ci-core .tit { font-weight: normal;font-size: 3.2em; font-family: var(--font-kohi);}
:lang(en) .ci-core .tit h4 { padding: 0.5em 0 0.3em;margin-bottom: 0; border: solid var(--color-white-a6); border-width: 1px 0; line-height: 1.2;}
:lang(en) .ci-core .desc { position: relative; left: -7.5%; width: 115%; font-size: calc(2rem - 1px);letter-spacing: normal;}

@media (max-width: 1024px) {
  :lang(en) .ci-about .desc {max-width: 720px;}
  :lang(en) .ci-about .desc br {display: none;}
}
@media (max-width: 768px) {
  :lang(en) .ci-core .desc { left: 5%; width: 90%; font-size: 16px;}
}
/* COMPANY _ CI소개 _ en */
/* ===================================================== */


/* ===================================================== */
/* COMPANY _ Contact us */
.map { padding-left: var(--inner-padding);margin-bottom: 30rem; }
.map-sec {position: relative;}
/* 텍스트 */
.map .info {position: absolute; right: max(60px, var(--inner-padding)); bottom: 0; z-index: 5; max-width: 24em; margin-bottom: -5.2em; font-weight: 800; line-height: 1.3; color: #fff; word-break: break-word;}
.map .info .list { padding: 0.7em 2.8em; border-radius: 1.8em 1.8em 0 0;background-color: #000;}
.map .info .item {padding: 1.4em 0;}
.map .info .item:not(:first-child) {border: solid var(--color-main-a3); border-width: 1px 0 0;}
.map .info dt { margin-bottom: 0.3em;color: var(--color-main);}
.map .info dd { padding-top: 0.25em;font-weight: 700;}
.map .info .inquiry-link { display: flex; justify-content: space-between; align-items: center; column-gap: 1.5em; position: relative;height: 5.2em; padding: 0 2.8em 0.2em; border-bottom-left-radius: 1.8em; background-color: var(--color-main);}
.map .info .inquiry-link span { flex-shrink: 0;font-size: 1.5em;}
.map .info .inquiry-link::after { flex-grow: 1; max-width: 170px; height: 30px; margin-right: -8px; background: url(../images/sub/company_map_arrow.svg) no-repeat calc(100% - 10px) center;content: ''; transition: all .3s;}
.map .info .inquiry-link:hover::after {background-position: 100% center;}
/* 구글맵api iframe */
.map .api { position: relative;height: calc(50px + 60rem);}
.map .api::before { position: absolute; top: -1rem; left: -1rem; width: 17rem; height: 13.1rem; background: url(../images/common/img_deco.svg) no-repeat left top/contain; filter: var(--drop-shadow-6);content: ''; transition: .3s; pointer-events: none;}
.map .api iframe {border-top-left-radius: 3rem;}
.map .api:hover::before {opacity: 0.1;}

@media (max-width: 1280px) {
  .map .info { font-size: 15px;}
}
@media (max-width: 1024px) {
  .map {margin-bottom: 22.5rem;}
  .map-sec {display: grid;}
  .map .info {position: relative; right: 0; order: 5; max-width: none; margin-bottom: 0; font-size: 17px;}
  .map .info .list { display: flex; padding: 2em 0; border-radius: 0;}
  .map .info .item {flex: 1; padding: 0 4.5%;}
  .map .info .item:not(:first-child) {border-width: 0 0 0 1px;}
  .map .info .inquiry-link { justify-content: end; column-gap: 2.5em;height: 4.8em; padding: 0 5% 0.2em;}
  .map .info {transform: translate3d(0, -40px, 0);}
  .map .api {z-index: 10;}
}
@media (max-width: 768px) {
  .map .info {font-size: 16px;}
}
@media (max-width: 640px) {
  .map .info .list {flex-direction: column; padding: 0.6em 6.5%;}
  .map .info .item {padding: 1.5em 0;}
  .map .info .item:not(:first-child) {border-width: 1px 0 0;}
  .map .info .inquiry-link { column-gap: 1.8em;padding: 0 6.5% 0.2em;}
}
@media (max-width: 480px) {
  .map .info {font-size: 15px;}
  .map .info .list {flex-direction: column; padding: 0.6em 8%;}
  .map .info .inquiry-link { justify-content: space-between; padding: 0 8% 0.2em;}
}
/* COMPANY _ Contact us */
/* ===================================================== */
/* COMPANY _ _ en */
  :lang(en) .map .info {max-width: 28em;}
@media (max-width: 1024px) {
  :lang(en) .map .info {max-width: none;}
  :lang(en) .map .info .list {flex-direction: column; padding: 0.6em 6.5%;}
  :lang(en) .map .info .item {padding: 1.5em 0;}
  :lang(en) .map .info .item:not(:first-child) {border-width: 1px 0 0;}
  :lang(en) .map .info .inquiry-link { column-gap: 1.8em;padding: 0 6.5% 0.2em;}
}
@media (max-width: 480px) {
  :lang(en) .map .info .list {padding: 0.6em 8%;}
  :lang(en) .map .info .inquiry-link { padding: 0 8% 0.2em;}
}
/* COMPANY _ _ en */
/* ===================================================== */


/* ===================================================== */
/* PRODUCT _ 공통-상단 소개 */
.prod {word-break: break-word;}
.prod-intro { overflow: hidden; position: relative; padding: 15rem 0 23rem;background: url(../images/sub/product_intro_bg.jpg) no-repeat center/cover;}
.prod-intro .inner {display: flex; justify-content: space-between; align-items: start; column-gap: 8%;}

/* 오른쪽 텍스트 */
.prod-intro .right {flex-grow: 1; order: 5; z-index: 50;}
.prod-intro .sec-tit { font-family: var(--font-kohi);}
.prod-intro .sec-tit h4 { margin-bottom: 1.2rem;font-size: 50px; letter-spacing: normal; color: #222;}
.prod-intro .sec-tit h5 { position: relative; width: fit-content; padding: 0.675em 1em 0.325em; margin-bottom: 3.5rem; border-radius: 0.3em; background-color: var(--color-main);font-size: 22px; color: #fff;}
.prod-intro .list { overflow: hidden;  margin-bottom: 5rem; font-weight: 700;letter-spacing: normal;}
.prod-intro .item-tit { padding: 0.2em 0; font-size: calc(2rem + 2px); color: var(--color-main); }
.prod-intro .list:not(:has(.detail)) .item.item:not(:first-child) {padding-top: 1em;}
.prod-intro .detail {padding: 1rem 0 2.5rem 1.2rem;}
.prod-intro .sales { padding: 1.5em 0;border-top: 1px solid var(--color-black-a2); font-size: max(15px, calc(7px + 1rem));}
.prod-intro .sales dt { margin-bottom: 0.1em; font-family: var(--font-kohi);color: var(--color-black-a8);}
.prod-intro .sales dd { font-weight: 600;font-size: max(14px, calc(6px + 1rem)); color: var(--color-main); word-break: break-all;}

/* 왼쪽 이미지 */
.prod-intro .left { flex-shrink: 0; position: relative;width: 50%; padding: 0 2%; font-size: 10px;}
.prod-intro .left .imgwrap {position: relative;  z-index: 5;}
.prod-intro .left .imgwrap::before { opacity: 0;position: absolute; top: -1em; left: -1em;width: 28.5em; height: 22em; background: url(../images/common/img_deco.svg) no-repeat left top/contain; filter: var(--drop-shadow-4); content: ''; transform: translate(-8%, -8%); transition: opacity .5s, transform .5s;}
.prod-intro .left .imgwrap::after { opacity: 0; position: absolute; top: 1.4em; left: 7.8em;width: 15em; height: 1.2em; background: url(../images/common/logo_white.svg) no-repeat center/contain; content: ''; transition: opacity .7s .5s;}
.prod-intro .left .imgwrap img {border-radius: 6em 0 6em 6em;}
.prod-intro .left.aos-animate .imgwrap::before {opacity: 1; transform: translate(0, 0);}
.prod-intro .left.aos-animate .imgwrap::after {opacity: 0.25;}

/* type1 */
.prod-intro .right.type1 .sec-tit h5::before { opacity: 0; position: absolute; top: -15%; left: calc(100% + 3.7rem); width: 23.8rem; height: 7.4rem; background: url(../images/sub/product_type1_intro_bg02.png) no-repeat center/contain; clip-path: polygon(100% 0, 100% 0%, 100% 100%, 100% 100%);content: ''; transition: opacity .7s 1.2s, clip-path .7s ease-out 1s;}
.prod-intro .left.type1::before {position: absolute; top: -7.2em; right: 13.3em; width: 80.7em; height: 82em; background: url(../images/sub/product_type1_intro_bg01.png) no-repeat center/contain; clip-path: polygon(100% 0, 100% 50%, 50% 50%, 35% 50%, 100% 50%, 100% 0); content: ''; transition: clip-path ease-out 1.7s 1.1s;}
.prod-intro .right.type1 .sec-tit.aos-animate h5::before { opacity: 1; clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);}
.prod-intro .left.type1.aos-animate::before {clip-path: polygon(100% 0, 100% 100%, 50% 100%, 50% 50%, 0 50%, 0 0);}
/* type2 */
.prod-intro.type2::before {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/sub/product_type2_intro_bg01.png) no-repeat left top/min(40%, 757px) auto; content: ''; pointer-events: none;}
.prod-intro .right.type2 .sec-tit h5::before { position: absolute; top: -2rem; left: calc(100% + 12rem); width: 135px; height: 167px; background: url(../images/sub/product_type2_intro_bg02.png) no-repeat left center/contain;content: ''; pointer-events: none; }
.prod-intro .left.type2 .imgwrap::before { top: auto; right: -1em; bottom: -1em; left: auto; transform: rotate(180deg) translate(-10%, -10%);}
.prod-intro .left.type2 .imgwrap::after { top: auto; right: 7.8em; bottom: 1.4em; left: auto;}
.prod-intro .left.type2.aos-animate .imgwrap::before {opacity: 1; transform: rotate(180deg) translate(0, 0);} 

@media (max-width: 1280px) {
  .prod-intro .inner {column-gap: 5%;}
  .prod-intro .sec-tit h4 { font-size: 4vw;}
  .prod-intro .sec-tit h5 { font-size: calc(14px + 0.6vw);}
  .prod-intro .left { font-size: 0.75vw;}
  .prod-intro .detail {font-size: 15px;}
  .prod-intro .right.type1 .sec-tit h5::before { left: calc(100% + 2.4rem);}
  .prod-intro .right.type2 .sec-tit h5::before { top: -4rem; left: calc(100% + 6vw); width: 12rem;}
}
@media (max-width: 1024px) {
  .prod-intro .inner {column-gap: 4%;}
}
@media (max-width: 768px) {
  .prod-intro { padding-bottom: 20rem; background-color: var(--color-white-a4);background-image: url(../images/sub/product_intro_bg_mo.jpg); background-blend-mode: lighten;}
  .prod-intro .inner {flex-direction: column; align-items: center; row-gap: 9rem; padding: 0 10%;}
  .prod-intro .right {width: 95%;}
  .prod-intro .sec-tit h4 { font-size: calc(15px + 4vw);}
  .prod-intro .sec-tit h5::before {display: none;}
  .prod-intro .detail {font-size: 16px;}
  .prod-intro .left {width: 100%; padding: 0; font-size: 1.2vw;}
  .prod-intro .left.type1::before {opacity: 0.5; top: -8em; right: 3.3em;}
  .prod-intro.type2::before {background-size: 70%; mix-blend-mode: multiply;}
}
@media (max-width: 576px) {
  .prod-intro .inner {padding: 0 5%;}
  .prod-intro .left {font-size: 1.35vw;}
}
@media (max-width: 480px) {
  .prod-intro .inner {padding: 0;}
  .prod-intro .sec-tit h4 { font-size: calc(5px + 6.25vw);}
  .prod-intro .detail {font-size: 15px;}
  .prod-intro .left {width: 90%;}
  .prod-intro .left .imgwrap::after { top: 1.2em; left: 5em; width: 20em; height: 1.6em; }
  .prod-intro .left.type2 .imgwrap::after { top: auto; right: 5em; bottom: 1.2em; left: auto;} 
}
/* PRODUCT _ 공통-상단 소개 */
/* ===================================================== */
/* PRODUCT _ 공통-상단 소개 _ en */
:lang(en) .prod-oled .prod-intro .sec-tit h5::before { top: 15rem;left: calc(100% + 16rem); width: 11rem;}
@media (max-width: 1280px) {
  :lang(en) .prod-oled .prod-intro .sec-tit h5::before { top: calc(2rem + 10vw);left: calc(100% + 4rem + 10vw);}
}
/* PRODUCT _ 공통-상단 소개 _ en */
/* ===================================================== */


/* ===================================================== */
/* R&D _ 연구소 소개 상단 */
.lab-intro { --ca: 16em; overflow: hidden; position: relative; padding: 8rem var(--inner-padding) 20rem;  border-top: var(--border-gray-1); background: url(../images/sub/lab_bg.jpg) no-repeat center/cover; font-size: 10px;}
.lab-intro::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff;content: '';}
.lab-intro .sec-wrap { flex-shrink: 0; position: relative; max-width: 57em; margin: 0 auto;}
.lab-intro .sec-wrap::before { opacity: 0; position: absolute; top: 8%; left: 9%; width: 102%; height: 105%; background-color: var(--color-main); clip-path: polygon(50% 0%, 100% var(--ca), 100% calc(100% - var(--ca)), 50% 100%, 0% calc(100% - var(--ca)), 0% var(--ca));content: '';}
.lab-intro .sec-wrap::after { opacity: 0; position: absolute; top: 11.5em; right: -8em; width: 16em; height: 17.6em; background-image: linear-gradient(130deg, #017bb8 0%, var(--color-main) 100%);  background-image: linear-gradient(130deg, #006f9c 13.5%, #00ABB6 65.5%); clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);content: ''; transform: translateY(30%);}
.lab-intro .sec-inner { position: relative; filter: drop-shadow(0 0 8rem var(--color-black-a05)); }
.lab-intro .sec-inner::before { opacity: 0; position: absolute;bottom: 16em; left: -6.5em; z-index: 5;width: 13em; height: 14.3em; background: url(../images/common/img_deco_hexa01.svg) no-repeat center/contain; content: ''; transform: translateY(30%);}
.lab-intro .sec-inner::after { opacity: 0; position: absolute; bottom: 4.5em; left: -9.5em; z-index: 5;width: 19em; height: 20.9em; background: url(../images/common/img_deco_hexa02.svg) no-repeat center/contain; filter: brightness(80%); content: ''; transform: translateY(30%);}
.lab-intro .sec-cont { padding: 15em 9em 17em 13em; background-color: #fff; clip-path: polygon(50% 0%, 100% var(--ca), 100% calc(100% - var(--ca)), 50% 100%, 0% calc(100% - var(--ca)), 0% var(--ca)); }
.lab-intro .tit { padding-bottom: 4.5em; margin-bottom: 5em; border-bottom: 2px solid var(--color-bg-main); font-family: var(--font-kohi); line-height: 1; color: var(--color-main);}
.lab-intro .tit span {font-size: 6em;}
.lab-intro .tit span:nth-child(2) { display: block;color: var(--color-sub);}
.lab-intro .desc { font-weight: 600;font-size: 20px; letter-spacing: -0.025em; color: #222;}

/* aos */
.lab-intro.aos-animate::before {opacity: 0; transition: opacity ease-out 2.5s 0.5s;}
.lab-intro.aos-animate .sec-wrap::before {opacity: 0.4; transition: opacity ease-out 1.4s 0.5s;}
.lab-intro.aos-animate .sec-wrap::after { opacity: 0.9; transform: translateY(0); transition: opacity 0.9s .3s, transform 0.9s .3s;}
.lab-intro.aos-animate .sec-inner::before { opacity: 0.8; transform: translateY(0); transition: opacity 1.1s .5s, transform 1.1s .5s;}
.lab-intro.aos-animate .sec-inner::after { opacity: 0.6; transform: translateY(0); transition: opacity 1.2s .6s, transform 1.2s .6s;}
 
@media (max-width: 1280px) {
  .lab-intro { font-size: 9px;}
  .lab-intro .desc { font-size: 18px;}
}
@media (max-width: 1024px) {
  .lab-intro { font-size: 8px;}
  .lab-intro .desc { font-size: 17px;}
}
@media (max-width: 640px) {
  .lab-intro { font-size: 1.2vw;}
  .lab-intro .desc { font-size: 2.2em;}
}
@media (max-width: 576px) {
  .lab-intro {font-size: 7px;}
  .lab-intro .sec-inner::before {bottom: 12em;}
  .lab-intro .sec-inner::after { bottom: -2em;}
  .lab-intro .sec-cont {padding: 15em 13% 17em; }
  .lab-intro .tit {padding-bottom: 3.5em; margin-bottom: 4em;}
}
@media (max-width: 480px) {
  .lab-intro {--ca: 25vw; font-size: 7px;}
  .lab-intro .sec-wrap {width: 100%; max-width: none;}
  .lab-intro .sec-wrap::after { top: 7.5em; right: -6.5em; width: 13em; height: 14.3em;}
}
/* R&D _ 연구소 소개 상단 */
/* ===================================================== */
/* R&D _ 연구소 소개 상단 _ en */
:lang(en) .lab-intro .tit {padding-bottom: 3.5em; margin-bottom: 4em;}
:lang(en) .lab-intro .desc {font-size: 18px;}
@media (max-width: 1280px) {
  :lang(en) .lab-intro .desc {font-size: 16px;}
}
@media (max-width: 1024px) {
  :lang(en) .lab-intro { font-size: 9px;}
}
@media (max-width: 768px) {
  :lang(en) .lab-intro { font-size: 1.2vw;}
  :lang(en) .lab-intro .desc {font-size: 15px;}
}
@media (max-width: 576px) {
  :lang(en) .lab-intro { font-size: 7px;}
  :lang(en) .lab-intro .tit {padding-bottom: 3em; margin-bottom: 3.5em;}
}
/* R&D _ 연구소 소개 상단 _ en */
/* ===================================================== */


/* ===================================================== */
/* R&D _ 연구소 소개 Core Technologies */
.coretech-intro { overflow: hidden; padding: 12rem 0 20rem; background: var(--color-white-a6) url(../images/sub/coretech_intro_bg.jpg) no-repeat left bottom/cover;}

/* Core Technologies 목록, 제목, CSS변수 */
.coretech-intro .list {display: grid; grid-template-columns: repeat(2, 1fr); justify-content: space-between; position: relative;}
.coretech-intro .list::before { display: flex; grid-column: 1 / -1; justify-content: center; align-items: center; position: absolute; top: 2.5rem; z-index: 50; width: 26rem; height: 26rem; padding-bottom: 0.25em; margin: 0 auto; border-radius: 50%; background-color: #fff; box-shadow: 0 0 5rem var(--color-black-a1); outline: 1px solid #222; outline-offset: -2rem; content: "CORE \A Technologies"; font-weight: 800; font-size: 2.7rem; letter-spacing: -0.025em;text-align: center; color: #222; white-space: pre; grid-row-start: 2; justify-self: center;}
.coretech-intro .item {display: flex; column-gap: 4%; width: calc(100% - 4rem);}
.coretech-intro .item:where(:nth-child(odd)) { --item-ani: fade-right; flex-direction: row-reverse; text-align: right;}
.coretech-intro .item:where(:nth-child(even)) { --item-ani: fade-left; justify-self: end;}
.coretech-intro .item:where(:nth-child(1), :nth-child(2)) {align-items: end;}
.coretech-intro .item:where(:nth-child(3), :nth-child(4)) {width: calc(100% - 17rem);}
.coretech-intro .item:nth-child(1) {--item-color: #6cacc8; --item-ico: url(../images/sub/coretech_intro_ico01.png); --item-deg: -27deg; --item-num: 2;}
.coretech-intro .item:nth-child(2) {--item-color: #1e7da4; --item-ico: url(../images/sub/coretech_intro_ico02.png); --item-deg: 27deg; --item-num: 3;}
.coretech-intro .item:nth-child(3) {--item-color: #3d4042; --item-ico: url(../images/sub/coretech_intro_ico03.png); --item-deg: -72deg; --item-num: 1;}
.coretech-intro .item:nth-child(4) {--item-color: var(--color-main); --item-ico: url(../images/sub/coretech_intro_ico04.png); --item-deg: 72deg; --item-num: 4;}
/* Core Technologies 아이콘 */
.coretech-intro .item-ico { display: flex; flex-shrink: 0; position: relative;width: 16rem; height: 16rem; border-radius: 50%; background-color: var(--item-color); clip-path: polygon(0 180%, 100% 180%, 180% 180%, 0 180%); transform: rotate(var(--item-deg)); opacity: 0; animation: coretech-ico 1.2s cubic-bezier(0, 0, 0.01, 0.98) calc(0.3s * var(--item-num)) both paused;}
@keyframes coretech-ico { to {clip-path: polygon(0 0, 100% 0%, 100% 180%, 0 180%); opacity: 1;} }

.coretech-intro .item-ico::before { --size: 36%; position: absolute; top: calc(var(--size) * -1); left: calc(var(--size) * -1); width: calc(100% + var(--size) * 2); height: calc(100% + var(--size) * 2); background-color: var(--item-color); mask: url(../images/sub/coretech_intro_shape.svg) no-repeat center bottom/13%; -webkit-mask: url(../images/sub/coretech_intro_shape.svg) no-repeat center bottom/13%;content: '';  pointer-events: none;}
.coretech-intro .item-ico::after { width: 6.6rem; height: 6.6rem; margin: auto; background: var(--item-ico) no-repeat center/contain;content: ''; transform: rotate(calc(var(--item-deg) * -1));}
/* Core Technologies 텍스트 */
.coretech-intro .item-txt { height: 100%;padding: 2rem 0; animation: var(--item-ani) .9s ease-out calc(1s + var(--item-num) * 0.3s) paused backwards;}
.coretech-intro .item-tit { margin-bottom: 0.2em; font-size: 22px; font-family: var(--font-kohi); color: var(--item-color,#222);}
.coretech-intro .item-detail { font-weight: 500;font-size: 18px; line-height: 1.4; letter-spacing: -0.025em;}
.coretech-intro .aos-animate :where(.item-ico, .item-txt) {animation-play-state: running;}

/* Customer Oriented R&D Services (슬릭 슬라이드) */
.coretech-service { overflow: hidden; padding: 12rem 0 17rem; background-color: #f5f5f5; text-align: center; }
.coretech-service .sub-sec-tit {text-align: center;}
.coretech-service .sub-sec-tit span::before, 
.coretech-service .sub-sec-tit span::after { margin: 0 0.1em;content: '-';}
/* 슬릭 내비 */
.coretech-service-wrap { --ca: 8em;font-size: 10px; }
.coretech-service-nav .slick-arrow {position: absolute; top: 43%; z-index: 5; padding: 1em; content: '';}
.coretech-service-nav .slick-arrow::before { display: block; width: 3em; height: 5.1em; background: url(../images/common/arrow_on.svg) no-repeat center/contain;content: '';}
.coretech-service-nav .slick-prev {left: 31.25em; transform: scaleX(-1);}
.coretech-service-nav .slick-next {right: 31.25em;}
/* 슬릭 */
.coretech-service-slick { width: 95%;margin: 0 auto; text-align: center; color: #fff;}
.coretech-service-slick .slick-list {overflow: visible;}
.coretech-service-slick .slick-track {display: flex !important; padding: 2.5em 0;}
.coretech-service-slick .item { display: flex; justify-content: center; filter: var(--drop-shadow-2); -webkit-user-select: text; -ms-user-select: text; user-select: text;}
.coretech-service-slick .item::before { position: absolute; top: -2em; left: 50%; width: 0.8em; height: 0.8em; border-radius: 50%; background-color: var(--color-main);content: ''; transform: translateX(-50%); }
.coretech-service-slick .item-wrap { display: flex; flex-direction: column; row-gap: 2.5em; position: relative;max-width: 28em; height: 100%; padding: 7em 3em 9em; margin: 0 max(1.5em, 3%);background-color: var(--color-main); clip-path: polygon(50% 0%, 100% var(--ca), 100% calc(100% - var(--ca)), 50% 100%, 0% calc(100% - var(--ca)), 0% var(--ca));}
.coretech-service-slick .item-tit {font-size: 2.2em; font-family: var(--font-kohi);}
.coretech-service-slick .item-ico { display: flex; padding: 3em 0; border-radius: 1em; background-color: var(--color-black-a1);}
.coretech-service-slick .item-ico img {max-width: 7.2em; margin: auto;}
.coretech-service-slick .item-desc {font-size: 1.8em; letter-spacing: -0.025em;}
.coretech-service-slick .item-desc p {line-height: 1.2;}
.coretech-service-slick .item-desc p:not(:last-child) {margin-bottom: 1em;}

@media (max-width: 1280px) {
  .coretech-intro .item-tit {font-size: 20px;}
  .coretech-intro .item-detail {font-size: 16px;}
  .coretech-service-wrap {font-size: 0.78125vw; }
  .coretech-service-slick {width: 100%;}
}
@media (max-width: 1180px) {
  .coretech-intro {padding-bottom: 13rem;}
  .coretech-intro .item {flex-direction: column; column-gap: 4%;}
  .coretech-intro .item:where(:nth-child(even)) {align-items: start;}
  .coretech-intro .item:where(:nth-child(odd)) {align-items: end;}
  .coretech-intro .item:where(:nth-child(1), :nth-child(2)) {flex-direction: column-reverse; }
  .coretech-intro .item:where(:nth-child(3), :nth-child(4)) {row-gap: 1rem;}
  .coretech-intro .item-tit {font-size: 21px;}
  .coretech-intro .item-detail {font-size: 17px;}
}
@media (max-width: 1024px) {
  .coretech-intro .item-tit {font-size: 20px;}
  .coretech-intro .item-detail {font-size: 16px;}
  .coretech-service-wrap {font-size: 0.925vw;}
}
@media (max-width: 820px) {
  .coretech-service-nav .slick-prev {left: 28em;}
  .coretech-service-nav .slick-next {right: 28em;}
  .coretech-service-slick .item-wrap {max-width: 30.8em; padding: 8.4em 3.6em 10.8em;}
  .coretech-service-slick .item-tit {font-size: 2.44em;}
  .coretech-service-slick .item-desc {font-size: 1.98em;}
}
@media (max-width: 768px) {
  .coretech-service-slick {width: 95%;}
  .coretech-service-wrap {font-size: 1.25vw;}
  .coretech-service-nav .slick-prev {left: -0.6em;}
  .coretech-service-nav .slick-next {right: -0.6em;}
  .coretech-service-slick .item-wrap { margin: 0 3em;}
}
@media (max-width: 640px) {
  .coretech-intro .list::before { top: 2.5rem; width: 18rem; height: 18rem; box-shadow: 0 0 4rem var(--color-black-a1); outline-offset: -1.2rem; font-size: 2.2rem;}
  .coretech-intro .item { width: calc(100% - 2rem);}
  .coretech-intro .item:where(:nth-child(1), :nth-child(2)) {--item-ani: fade-up;}
  .coretech-intro .item:where(:nth-child(3), :nth-child(4)) { --item-ani: fade-down; width: calc(100% - 12rem);margin-top: -1rem;}
  .coretech-intro .item:nth-child(1) { --item-deg: -21deg; --item-num: 1;}
  .coretech-intro .item:nth-child(2) { --item-deg: 21deg; --item-num: 2;}
  .coretech-intro .item:nth-child(3) { --item-deg: -70deg; --item-num: 3;}
  .coretech-intro .item:nth-child(4) {--item-deg: 70deg; --item-num: 4;}
  .coretech-intro .item-ico { width: 12rem; height: 12rem; }
  .coretech-intro .item-ico::after { width: 5.2rem; height: 5.2rem;}
  .coretech-intro .item-tit {font-size: 18px; letter-spacing: normal;}
  .coretech-intro .item-detail {font-size: 15px;}
}
@media (max-width: 576px) {
  .coretech-intro {padding-bottom: 12rem; background-blend-mode: soft-light;}
  .coretech-intro .list {grid-template-columns: 1fr; justify-content: space-between;}
  .coretech-intro .list::before { position: relative; top: 0; width: 26rem; height: 26rem; margin-bottom: 3.85rem;  outline-offset: -2rem; font-size: 2.7rem; grid-row-start: auto;}
  .coretech-intro .item { --item-ani: fade-down;flex-direction: column; align-items: center; row-gap: 1rem; width: 100%; text-align: center; justify-self: center;}
  .coretech-intro .item:where(:nth-child(3), :nth-child(4)) {margin-top: 0;}
  .coretech-intro .item-ico {width: min(100%, 28rem); height: 10rem; border-radius: 2rem; clip-path: none; transform: none; animation: fade-down .6s ease-out calc(var(--item-num) * 1s) paused forwards;}
  .coretech-intro .item-ico::before {top: -4rem; left: calc(50% - 2rem); width: 4rem; height: 4rem; mask-size: 100%; -webkit-mask-size: auto 100%; mask-position: center; -webkit-mask-position: center; }
  .coretech-intro .item-ico::after { width: 6rem; height: 6rem;transform: none;}
  .coretech-intro .item-txt { height: auto; animation-duration: .7s; animation-delay: calc(0.5s + var(--item-num) * 1s);}
  .coretech-intro .item:not(:last-child) .item-txt {padding-bottom: 7.5rem;}
  .coretech-intro .item-tit {font-size: 2.6rem; letter-spacing: 0.025em;}
  .coretech-intro .item-detail {font-size: 2.1rem;}
  .coretech-intro .item-detail .br820 {display: none;}
  .coretech-intro .aos-animate .item-ico {clip-path: none; animation-play-state: running;}
  /* 코어테크 서비스 */
  .coretech-service .sub-sec-tit span {display: flex; justify-content: center;}
  .coretech-service-wrap {font-size: 8px;}
  .coretech-service-nav .slick-prev {left: calc(50% - 22.5em);}
  .coretech-service-nav .slick-next {right: calc(50% - 22.5em);}
  .coretech-service-slick .item-wrap {max-width: 32em; padding: 8.5em 4em 11em; margin: 0 4em;}
  .coretech-service-slick .item-tit { margin-bottom: 0.3em;font-size: 2.5em; line-height: 1.15;}
  .coretech-service-slick .item-desc {font-size: 2.2em;}
}
@media (max-width: 480px) {
  .coretech-service-wrap {font-size: 1.8vw;}
  .coretech-service-nav .slick-prev {left: calc(50% - 22.25em);}
  .coretech-service-nav .slick-next {right: calc(50% - 22.25em);}
  .coretech-service-slick .item-wrap { margin: 0 3.7em;} 
}
/* R&D _ 연구소 소개 Core Technologies */
/* ===================================================== */


/* ===================================================== */
/* 이메일무단수집거부 */
.refusal-mail { padding: 10rem 0 20rem; text-align: center; } 
.refusal-mail-wrap { padding: 6rem 5% 7rem; border: var(--border-gray-1); } 
.refusal-mail-img { display: flex; justify-content: center; height: 18rem; margin-bottom: 4rem;} 
.refusal-mail-tit { margin-bottom: 1rem; font-weight: 700; font-size: 2.8rem; color: #222; } 
.refusal-mail-subtit { display: block; margin-bottom: 1.5rem; font-weight: 500; font-size: 2rem; color: #444; } 
.refusal-mail-subtit b { font-weight: 700; color: var(--color-main); } 
.refusal-mail-desc { font-size: 18px; } 
@media (max-width: 1280px){
  .refusal-mail-desc { font-size: 16px; } 
}
@media (max-width: 1024px){
  .refusal-mail-desc br { display: none; } 
}
@media (max-width: 768px){
  .refusal-mail-subtit {font-size: 17px;}
  .refusal-mail-desc { font-size: 15px; } 
}
/* 이메일무단수집거부 */
/* ===================================================== */