@charset "utf-8";

/* Sub visual — 이미지에 딤 포함 */
.about-visual .sub-visual-dim {background:transparent;}

/* About page */
#about-con .about-intro {order:2;}
#about-con .about-quote {order:3;}
#about-con .about-global {order:4;}
#about-con .about-biz {order:5;}
#about-con .about-location {order:6;}

/* Intro */
.about-intro-copy {gap:var(--gap-lg);margin-bottom:120rem;}
.about-intro .con-tit {flex:none;}
.about-intro-txt {flex:0 1 704rem;display:flex;flex-direction:column;gap:20rem;}

.about-feature-lst {display:flex;gap:20rem;align-items:stretch;}
.about-feature-item {position:relative;min-width:0;flex:1 1 0;height:550rem;border-radius:var(--radius-sm);overflow:hidden;transition:flex .65s cubic-bezier(.22,.61,.36,1);}
.about-feature-item.is-active {flex:2.25 1 0;}
.about-feature-img {position:absolute;inset:0;}
.about-feature-txt {position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;flex-direction:column;gap:20rem;padding:48rem;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.6) 100%);color:var(--wh);}
.about-feature-txt h4 {margin:0;font-size:34rem;font-weight:var(--fw-semibold);line-height:1.2;}
.about-feature-txt p {margin:0;max-width:590rem;max-height:0;overflow:hidden;color:var(--color-text-muted);font-size:var(--font20);line-height:1.2;opacity:0;visibility:hidden;transform:translateY(12rem);}
.about-feature-item.is-active .about-feature-txt p {visibility:visible;animation:featureTxtIn .5s .4s ease-in-out both;}
.about-feature-item.is-active.is-initial .about-feature-txt p {animation:none;max-height:none;opacity:1;visibility:visible;transform:translateY(0);}
@keyframes featureTxtIn {
    from {max-height:0;opacity:0;transform:translateY(12rem);}
    to {max-height:100rem;opacity:1;transform:translateY(0);}
}

/* Quote */
.about-quote {position:relative;aspect-ratio:1920 / 441;overflow:hidden;color:var(--wh);}
.about-quote > .img-area {position:absolute;inset:0;}
.about-quote-con {position:relative;z-index:2;display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:var(--gap-sm);text-align:center;}
.about-quote-txt {margin:0;font-size:var(--font30);line-height:1.2;}
.about-quote-author {display:flex;flex-direction:column;align-items:center;gap:0;}
.about-quote-author strong {font-size:var(--font20);font-weight:var(--fw-semibold);line-height:normal;}
.about-quote-author span {color:var(--color-text-quote);font-size:var(--font16);line-height:normal;}

/* Global */
.about-map-wrap {margin-bottom:var(--gap-md);}
.about-map-img {width:100%;aspect-ratio:1400 / 720;}
.about-map-img img {object-fit:contain;background:var(--color-bg-primary);}

.about-country-lst {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20rem;}
.about-country-item {display:flex;align-items:center;gap:24rem;padding:24rem;border:1rem solid var(--gray-f1);border-radius:var(--radius-md);background:var(--color-bg-primary);}
.about-country-flag {width:60rem;height:60rem;flex:none;border-radius:50%;overflow:hidden;line-height:0;}
.about-country-flag img {display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;}
.about-country-item strong {font-size:var(--font24);font-weight:var(--fw-semibold);line-height:1.5;color:var(--color-text-title);}
.about-country-swip {width:100%;}
.about-country-pag,
.about-biz-pag,
.about-loc-pag {position:relative;margin-top:20rem;display:flex;align-items:center;justify-content:center;gap:8rem;}
.about-country-pag .swiper-pagination-bullet,
.about-biz-pag .swiper-pagination-bullet,
.about-loc-pag .swiper-pagination-bullet {width:8rem;height:8rem;margin:0;opacity:1;background:var(--gray-d);border-radius:50%;}
.about-country-pag .swiper-pagination-bullet-active,
.about-biz-pag .swiper-pagination-bullet-active,
.about-loc-pag .swiper-pagination-bullet-active {background:var(--color-text-title);}

/* Business areas */
.about-biz-con {gap:var(--gap-lg);align-items:flex-start;}
.about-biz-visual {flex:0 1 680rem;min-width:0;}
.about-biz-swip {display:none;width:100%;}
.about-biz-swip.is-active {display:block;}
.about-biz-visual:has(.about-biz-swip.is-active) .about-biz-single {display:none;}
.about-biz-img {width:100%;aspect-ratio:680 / 400;background:var(--color-bg-primary);}
.about-biz-swip .about-biz-img,
.about-biz-single {border-radius:var(--radius-md);overflow:hidden;}
.about-biz-acc {min-width:0;flex:1;}
.about-biz-item {border-bottom:1rem solid var(--color-text-quote);}
.about-biz-item:first-child {border-top:0;}
.about-biz-btn {display:flex;width:100%;padding:var(--gap-sm) 0;align-items:center;justify-content:space-between;gap:30rem;text-align:left;color:var(--color-text-title);}
.about-biz-btn-l {display:flex;min-width:0;flex:1;align-items:center;gap:30rem;}
.about-biz-ico {width:40rem;height:40rem;flex:none;line-height:0;}
.about-biz-ico img {display:block;width:100%;height:100%;object-fit:contain;}
.about-biz-tit {font-size:var(--font24);font-weight:var(--fw-medium);line-height:1.5;}
.about-biz-toggle {position:relative;display:block;width:24rem;height:24rem;flex:none;}
.about-biz-toggle::before,
.about-biz-toggle::after {content:"";position:absolute;left:50%;top:50%;width:14rem;height:2rem;background:var(--color-text-title);transform:translate(-50%,-50%);}
.about-biz-toggle::after {width:2rem;height:14rem;}
.about-biz-item.is-active .about-biz-toggle::after {display:none;}
.about-biz-panel {display:none;padding:0 0 var(--gap-sm);}
.about-biz-item.is-active .about-biz-panel {display:block;}
.about-biz-panel p {margin:0;max-width:524rem;color:var(--color-text-secondary);font-size:var(--font16);line-height:1.5;}
.about-biz-panel-img {display:none !important;}
.about-biz-panel-swip {display:none;}
.about-biz-panel-pag {position:relative;display:flex;align-items:center;justify-content:center;gap:8rem;}
.about-biz-panel-pag .swiper-pagination-bullet {width:8rem;height:8rem;margin:0;opacity:1;background:var(--gray-d);border-radius:50%;}
.about-biz-panel-pag .swiper-pagination-bullet-active {background:var(--color-text-title);}

/* Location */
.about-contact-bar {display:flex;align-items:stretch;gap:var(--gap-md);padding:var(--gap-sm) 10rem;border-top:2rem solid var(--color-text-title);border-bottom:1rem solid var(--color-border);margin-bottom:var(--gap-md);}
.about-contact-bar dl {display:flex;min-width:0;flex:1;flex-direction:column;gap:6rem;justify-content:center;}
.about-contact-bar dl + dl {position:relative;padding-left:var(--gap-md);}
.about-contact-bar dl + dl::before {content:"";position:absolute;left:0;top:0;bottom:0;width:0;border-left:1rem dashed var(--color-border);}
.about-contact-bar dt {font-size:var(--font20);font-weight:var(--fw-semibold);line-height:1.3;color:var(--color-text-title);}
.about-contact-bar dd {margin:0;color:var(--color-text-secondary);font-size:var(--font20);line-height:1.3;}
.about-contact-bar a {color:inherit;}

.about-loc-lst {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-sm);}
.about-loc-item {display:flex;flex-direction:column;gap:var(--gap-sm);min-width:0;}
.about-loc-item.is-wide {grid-column:1 / -1;}
.about-loc-img {width:100%;aspect-ratio:680 / 400;border-radius:var(--radius-md);}
.about-loc-swip {width:100%;position:relative;}
.about-loc-swip .about-loc-img {border-radius:var(--radius-md);overflow:hidden;}
/* Factory image swiper pagination should not push the information block down */
.about-loc-swip .about-loc-pag {position:absolute;left:0;right:0;bottom:20rem;margin:0;}
.about-loc-info h4 {min-height:42rem;}
.about-loc-imgs {display:flex;gap:var(--gap-sm);}
.about-loc-imgs .about-loc-img {flex:1;min-width:0;}
.about-loc-info {display:flex;flex-direction:column;gap:16rem;}
.about-loc-info h4 {margin:0;padding-bottom:16rem;border-bottom:1rem solid var(--color-border);font-size:var(--font20);font-weight:var(--fw-semibold);line-height:1.3;color:var(--color-text-title);}
.about-loc-info p {margin:0;color:var(--color-text-secondary);font-size:var(--font20);line-height:1.5;}

@media screen and (max-width:1450px) {
    .about-intro-copy {margin-bottom:var(--gap-lg);}
    .about-feature-txt {padding:36rem;}
}

@media screen and (max-width:1024px) {
    .about-intro-copy {gap:var(--gap-md);margin-bottom:var(--gap-md);}
    .about-intro-txt {flex-basis:auto;}
    .about-feature-txt {gap:12rem;padding:28rem;}
    .about-feature-txt h4 {font-size:28rem;}
    .about-country-lst {grid-template-columns:repeat(3,minmax(0,1fr));}
    .about-biz-con {gap:var(--gap-md);}
    .about-biz-visual {flex-basis:480rem;}
    .about-biz-tit {font-size:20rem;}
    .about-contact-bar {gap:var(--gap-sm);}
    .about-contact-bar dl + dl {padding-left:var(--gap-sm);}
}

@media screen and (max-width:800px) {
    #about-con .about-global {order:3;}
    #about-con .about-quote {order:4;}

    .about-intro-copy {display:block;margin-bottom:var(--gap-sm);}
    .about-intro-txt {width:100%;flex:none;margin-top:24rem;gap:12rem;}

    .about-feature-lst {flex-direction:column;gap:20rem;}
    .about-feature-item,
    .about-feature-item.is-active {flex:none;width:100%;height:auto;aspect-ratio:335 / 230;}
    .about-feature-txt {gap:10rem;padding:24rem;}
    .about-feature-txt h4 {font-size:20rem;}
    .about-feature-txt p {font-size:var(--font14);max-width:none;transform:none;}
    .about-feature-item .about-feature-txt p,
    .about-feature-item.is-active .about-feature-txt p {display:none !important;animation:none;max-height:none;opacity:1;visibility:visible;}

    .about-quote {aspect-ratio:auto;padding:var(--gap-md) 0;}
    .about-quote-con {height:auto;gap:20rem;}
    .about-quote-txt {font-size:20rem;line-height:1.5;}
    .about-quote-author strong {font-size:var(--font16);}
    .about-quote-author span {font-size:13rem;}

    .about-map-wrap {margin-bottom:var(--gap-sm);}
    .about-map-img {aspect-ratio:335 / 170;}

    .about-country-lst {grid-template-columns:repeat(2,minmax(0,1fr));gap:16rem;}
    .about-country-item {flex-direction:column;justify-content:center;gap:12rem;padding:20rem;border-radius:10rem;text-align:center;}
    .about-country-flag {width:45rem;height:45rem;}
    .about-country-item strong {font-size:var(--font16);line-height:1.4;}
    .about-country-pag {margin-top:24rem;}

    .about-biz-con {display:block;}
    .about-biz-visual {display:none;}
    .about-biz-btn {padding:24rem 0;align-items:flex-start;gap:16rem;}
    .about-biz-btn-l {flex-direction:column;align-items:flex-start;gap:12rem;}
    .about-biz-ico {width:24rem;height:24rem;}
    .about-biz-tit {font-size:var(--font18);line-height:1.5;}
    .about-biz-toggle {width:20rem;height:20rem;margin-top:2rem;}
    .about-biz-panel {padding-bottom:24rem;padding-top:24rem;border-top:1px solid var(--gray-d5);}
    .about-biz-panel-swip {display:block;width:100%;margin-bottom:12rem;}
    .about-biz-panel-img {display:block !important;width:100%;aspect-ratio:335 / 212;margin-bottom:12rem;border-radius:10rem;overflow:hidden;}
    .about-biz-panel-swip .about-biz-panel-img {margin-bottom:0;}
    .about-biz-panel-pag {margin-top:24rem;}
    .about-biz-panel p {max-width:none;font-size:var(--font14);}

    .about-contact-bar {flex-direction:column;gap:0;padding:0;margin-bottom:var(--gap-sm);}
    .about-contact-bar dl {flex-direction:row;align-items:center;gap:var(--gap-sm);padding:20rem 24rem;border-bottom:1rem solid var(--color-border);}
    .about-contact-bar dl + dl {padding-left:24rem;}
    .about-contact-bar dl + dl::before {display:none;}
    .about-contact-bar dt {width:60rem;flex:none;font-size:var(--font14);}
    .about-contact-bar dd {font-size:var(--font14);}

    .about-loc-lst {display:flex;flex-direction:column;gap:var(--gap-sm);}
    .about-loc-item {gap:20rem;}
    .about-loc-img {aspect-ratio:335 / 212;border-radius:10rem;}
    .about-loc-swip .about-loc-img {border-radius:10rem;}
    .about-loc-pag {margin-top:24rem;}
    .about-loc-imgs {flex-direction:column;gap:10rem;}
    .about-loc-info {gap:12rem;}
    .about-loc-info h4 {padding-bottom:12rem;font-size:var(--font16);}
    .about-loc-info p {font-size:var(--font14);}
    .about-feature-item.is-active.is-initial .about-feature-txt p{display:none !important;}
}