/**
 * Content
 */

/* iOS Tap Highlight 제거 */
a,
button,
input,
textarea,
select,
label {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

/* 버튼 기본 스타일 제거 */
button {
    -webkit-appearance: none;
    appearance: none;
}

body {
    background-color: #fff;
    color: #fff;
}

a:active {
    opacity: 0.85;
}

.page a.active {
    opacity: .4;
}

i,
em {
    font-style: italic;
}

b,
strong {
    font-weight: bolder;
}

sub,
sup {
    position: relative;
    vertical-align: baseline;
}

sub {
    top: 0.3em;
}

sup {
    top: -0.4em;
}

s {
    text-decoration: line-through;
}

img {
    border: 0;
    padding: 0;
}

ul,
ol {
    margin: 0;
    padding: 0 0 0 1em;
}

blockquote {
    margin: 0;
    padding: 0 0 0 2em;
}

hr {
    background: rgba(0, 0, 0, 0.9);
    border: 0;
    height: 3px;
    display: block;
}

.content img {
    float: none;
    margin-bottom: 1em;
}

.gallery_image_caption {
    margin-top: 1.2rem;
    margin-bottom: 0.5rem;
    font-size: 1.3rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.35);
    font-family: "Plex Mono", Icons;
    font-style: normal;
    line-height: 1.3;
}

/**
 * Loading Animation
 */

.loading[data-loading] {
    position: fixed;
    bottom: 8px;
    left: 8px;
}

/**
 * Editor styles
 */

[data-predefined-style="true"] bodycopy {
    font-size: 1.5rem;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    font-family: "Plex Mono", Icons;
    font-style: normal;
    line-height: 0.5;
}

[data-predefined-style="true"] bodycopy a {
    color: rgba(0, 0, 0, 1);
    padding-bottom: 0.1em;
    border-bottom: 0.07em solid rgba(255, 255, 255, 0.3);
    text-decoration: none;
}

[data-predefined-style="true"] bodycopy a:hover {

}

bodycopy a.image-link,
bodycopy a.icon-link,
bodycopy a.image-link:hover,
bodycopy a.icon-link:hover {
    border-bottom: 0;
    padding-bottom: 0;
}

[data-predefined-style="true"] h1 {
    font-family: "Plex Sans", Icons;
    font-style: normal;
    font-weight: 400;
    padding: 0;
    margin: 0;
    font-size: 4.7rem;
    line-height: 0.5;
    color: rgba(0, 0, 0, 0.95);
}

[data-predefined-style="true"] h1 a {
    color: rgba(0, 0, 0, 0.95);
}

[data-predefined-style="true"] h2 {
    font-family: "Plex Sans", Icons;
    font-style: normal;
    font-weight: 400;
    padding: 0;
    margin: 0;
    color: rgba(0, 0, 0, 0.95);
    font-size: 3rem;
    line-height: 1.2;
}

[data-predefined-style="true"] h2 a {
    color: rgba(0, 0, 0, 0.95);
}

[data-predefined-style="true"] small {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.6;
    font-style: normal;
    font-weight: 400;
    color: #B5B5B5;
}

[data-predefined-style="true"] small b {
    font-weight: 600;
}

[data-predefined-style="true"] small a {
    color: rgba(0, 0, 0, 1);
    border-bottom-width: 0em;
}

/**
 * Breakpoints
 */


[data-css-preset] .page {
    background-color: initial /*!page_bgcolor*/;
}

.mobile .page,
[data-css-preset].mobile .page {
    position: relative;
    min-height: 10px;
    max-width: 100%;
    width: 100%;
    background-color: transparent /*!page_bgcolor*/;
}

[data-css-preset] .container {
    margin-left: auto /*!content_center*/;
    margin-right: auto /*!content_center*/;
    text-align: left /*!text_center*/;
}

[data-css-preset] body {
    background-color: rgba(0, 0, 0, 1)/*!body_bgcolor*/;
}

[data-css-preset] .container_width {
    width: 100% /*!content_center*/;
}

[data-css-preset] .content_padding {
    padding-top: 2rem /*!main_margin*/;
    padding-bottom: 2rem /*!main_margin*/;
    padding-left: 2rem /*!main_margin*/;
    padding-right: 2rem /*!main_margin*/;
}


[data-css-preset] text-limit {
    display: inline-block /*!text_width*/;
    max-width: 66rem/*!text_width*/;
}

/**
 * Thumbnails
 */

div[thumbnails] {
    justify-content: flex-start;
}

[data-css-preset] .thumbnails {
    background-color: #000/*!thumbnails_bgcolor*/;
}

[data-css-preset] .thumbnails_width {
    width: 100%/*!thumbnails_width*/;
}

[data-css-preset] [thumbnails-pad] {
    padding: 0.55rem/*!thumbnails_padding*/;
}

[data-css-preset] [thumbnails-gutter] {
    margin: -1.1rem/*!thumbnails_padding*/;
}

[data-css-preset] [responsive-layout] [thumbnails-pad] {
    padding: 0.5rem/*!responsive_thumbnails_padding*/;
}

[data-css-preset] [responsive-layout] [thumbnails-gutter] {
    margin: -1rem/*!responsive_thumbnails_padding*/;
}

.thumbnails .thumb_image {
    outline: 0px solid rgba(0,0,0,.12);
    outline-offset: -1px;
}

.thumbnails .title {
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
    font-size: 1.1rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
    font-family: "Plex Mono", Icons;
    font-style: normal;
    line-height: 1;
}

.thumbnails .tags {
    margin-top: 1.3rem;
    margin-bottom: 0.5rem;
    font-size: 1.3rem;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    font-family: "Plex Mono", Icons;
    font-style: normal;
    line-height: 1;
}

.thumbnails .tags a {
    border-bottom: 0;
    color: rgba(255, 255, 255, 0.4);
    text-decoration: none;
}

.thumbnails .has_title .tags {
    margin-top: 0rem;
}

/**
 * Site Menu
 */

[data-css-preset] #site_menu_button {
    color: rgba(255, 255, 255, 0.8);
    line-height: 1;
    font-size: 28px /*!site_menu_button*/;
    padding: 6px;
    line-height: 1;
    background: rgba(33, 32, 46, 0);
    position: fixed;
    top: 1.6rem /*!site_menu_button*/;
    right: 1.6rem /*!site_menu_button*/;
}

body.mobile #site_menu_button {
    margin: -6px;
    font-size: 34px;
}

#site_menu_button.custom_icon {
    width: 40px;
    height: auto;
}

#site_menu_button.active {
    display: none;
}

/**
 * Site Menu
 */

#site_menu {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
    background: rgba(20, 20, 20, 0.95);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    padding: 20px 30px 90px 30px;
    max-width: 400px;
    min-width: 300px;
    text-align: left;
    display: flex;
    justify-content: flex-start;
}

body.mobile #site_menu {
    width: 100%;
}

#site_menu .page-link a {
    color: rgba(255, 255, 255, 0.75);
}

#site_menu .set-link > a {
    color: rgba(255, 255, 255, 0.75);
    font-weight: bold;
}

#site_menu a:active {
    opacity: .7;
}

#site_menu a.active {
    opacity: .4;
}

#site_menu .close {
    display: none;
    color: rgba(255, 255, 255, 0.4);
    line-height: .85em;
    font-size: 45px;
}

body.mobile #site_menu .close {
    display: block;
    font-size: 50px;
    line-height: 1em;
}

#site_menu .break {
    height: 28px;
}

#site_menu .indent {
    margin-left: 28px;
}

/*
 * Shop Button
 */

[data-css-preset] #shop_button {
    color: rgba(255, 255, 255, 0.8);
    background: transparent;
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    position: fixed;
    padding: 6px;
    top: 2rem /*!shop_button*/;
    right: 2rem /*!shop_button*/;
}

#shop_button.text {
    font-family: "Plex Sans", Icons;
    font-size: 1.5rem;
    padding: 0;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    font-style: normal;
}

#shop_button.custom_icon {
    width: 40px;
    height: auto;
}

body.mobile #shop_button:not(.text) {
    margin: -6px;
    font-size: 36px;
}

/*
 * Shop Product Widget
 */

.shop_product {
    width: 100%;
    max-width: 22rem;
    position: relative;
    display: block;
}

.shop_product .price {
    font-family: "Plex Mono", Icons;
    font-size: 1.5rem;
    line-height: 1;
    color: rgba(255, 255, 255, 0.5);
    display: block;
    margin-bottom: 1rem;
    font-style: normal;
    font-weight: 400;
}

.shop_product .dropdown {
    font-family: "Plex Mono", Icons;
    font-size: 1.5rem;
    display: inline-block;
    width: 100%;
    border: 1px solid rgba(255,255,255,0.4);
    background:  white url(https://static.cargo.site/assets/images/select-line-arrows.svg) no-repeat right;
    margin-bottom: 1rem;
    line-height: 1.2;
    padding: .7rem 2.5rem .8rem 1rem;
    font-style: normal;
    font-weight: 400;
}

.shop_product .button {
    font-family: "Plex Mono", Icons;
    font-size: 1.5rem;
    background: rgba(255, 255, 255, 0.25);
    color: rgba(255,255,255,1);
    flex: 0 0 50%;
    text-align: left;
    display: inline-block;
    line-height: 1;
    padding: .8rem 1rem .9rem;
    font-style: normal;
    font-weight: 400;
    border-bottom: none;
}

/*
 * Image Zoom
 */

.content img.image-zoom:active {
    opacity: .7;
}

/**
 * Quick View
 */

[data-css-preset] .quick-view {
    padding-top: 2.5rem /*!quick_view_padding*/;
    padding-bottom: 2.5rem /*!quick_view_padding*/;
    padding-left: 2.5rem /*!quick_view_padding*/;
    padding-right: 2.5rem /*!quick_view_padding*/;
    height: 100% /*!quick_view_height*/;
    width: 100% /*!quick_view_width*/;
    margin: auto /*!quick_view_center_center*/;
}

body.mobile .quick-view {
    width: 100%;
    height: 100%;
    margin: 0;
}


[data-css-preset] .quick-view-background {
    background: rgba(0, 0, 0, 0.95) /*!quick_view_bgcolor*/;
}

.quick-view-caption {
    font-family: "Plex Mono", Icons;
    transition: 100ms opacity ease-in-out;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 3.5rem 0;
    text-align: center;
    font-size: 1.3rem;
    line-height: 1.5;
    font-style: normal;
    font-weight: 400;
}

.quick-view-caption span {
    padding: 0.5rem 1rem;
    display: inline-block;
    background: rgba(0,0,0,0.5);
    color: white;
}


/**
 * Quick View Navigation
 */

.quick-view-navigation .left-arrow {
    left: 10px;
}

.quick-view-navigation .right-arrow {
    right: 10px;
}

.quick-view-navigation .left-arrow,
.quick-view-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 36px;
    width: 36px;
}

.quick-view-navigation .left-arrow .inner-color,
.quick-view-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .left-arrow .outer-color,
.quick-view-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

.quick-view-navigation .close-button {
    top: 10px;
    right: 10px;
    /* Change height/width together to scale */
    width: 36px;
    height: 36px;
}

.quick-view-navigation .close-button .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .close-button .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

/**
 * Image Gallery Navigation Arrows
 */

.image-gallery-navigation .left-arrow,
.image-gallery-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 36px;
    width: 36px;
}

.image-gallery-navigation .left-arrow .inner-color,
.image-gallery-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.image-gallery-navigation .left-arrow .outer-color,
.image-gallery-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}

/**
 * Wallpaper Backdrop Navigation Arrows
 */

.wallpaper-navigation .left-arrow,
.wallpaper-navigation .right-arrow {
    /* Change height/width together to scale */
    width: 36px;
    height: 36px;
}

.wallpaper-navigation .left-arrow .inner-color,
.wallpaper-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.wallpaper-navigation .left-arrow .outer-color,
.wallpaper-navigation .right-arrow .outer-color {
    stroke: #000;
    stroke-width: 2.5px;
    opacity: 0.6;
}


/**
 * Feed
 */

.feed .content_container .page {
    border-top: 0px dashed rgba(0, 0, 0, 0.2);
}

.feed .content_container .page_container:first-child .page {
    border-top: 0;
}



/*
 * Audio Player
 */

.audio-player {
    max-width: 36rem;
    height: 3.3rem;
    outline: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.4);
    font-size: 1.2rem;
    line-height: 1.3;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
    font-style: normal;
    font-weight: 400;
    text-align: left;
    margin: 1px 1px 1em 1px;
}

body.mobile .audio-player {
    max-width: 100%;
}

.audio-player .separator {
    width: 1px;
    background-color: rgba(255, 255, 255, 0.2);
}

.audio-player .button {
    background: transparent;
    cursor: pointer;
    fill: rgba(255, 255, 255, 0.85);
}

.audio-player .icon {
    fill: rgba(255, 255, 255, 0.85);
    padding: 30%;
    width: 100%;
    margin: auto;
}

.audio-player .buffer {
    background: rgba(255, 255, 255, 0.1);
}

.audio-player .progress {
    background: rgba(255, 255, 255, 0.15);
}

.audio-player .progress-indicator {
    border: 1px solid rgba(255, 255, 255, 0.7);
    width: 1px;
    height: 100%;
    right: 0;
    position: absolute;
    cursor: ew-resize;
}

.audio-player .note-icon {
    height: 100%;
    width: 3.8rem;
    padding: 1rem;
    fill: rgba(255, 255, 255, 0.6);
}

.audio-player .current-time {
    padding-left: 1rem;
}

.audio-player .total-time {
    padding-right: 1rem;
}


/* ========================================================================== */
/* RESET */
/* ========================================================================== */

/* 기본 */
*{margin:0; padding:0; border:0; outline:0; vertical-align:top; box-sizing:border-box;scroll-behavior:smooth;letter-spacing:-0.025em;-webkit-tap-highlight-color:rgba(0,0,0,0);}

/* 고정 */
html.fixed , body.fixed{overflow:hidden; touch-action:none;-webkit-touch-action:none;}

/* 모바일 가로모드 폰트확대 방지 */
body{-webkit-text-size-adjust:none;}

/* 헤더 폰트 사이즈 초기화 */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{margin-bottom:0;}

/* 텍스트 */
a{color:inherit; text-decoration:none;}
a:hover{text-decoration:none;}
a , button{display:inline-block; background:none; vertical-align:top; cursor:pointer; box-sizing:border-box;}
button{margin:0; padding:0; border:0; background:none; vertical-align:top; cursor:pointer; box-sizing:border-box;}
p{margin-bottom:0;}

/* 이미지 */
img, fieldset{border:none;}
img, object{vertical-align:top;}
img{max-width:100%;}

/* 리스트 */
ul , ol{margin-bottom:0; padding-left:0; list-style:none;}
em , address{font-style:normal;}

/* 테이블 */
table{width:100%; border-spacing:0;}
th , td{text-align:center; vertical-align:middle;}
legend , caption{display:none;}

/* 폼 */
form{max-width:100%;}
label{cursor:pointer;}
select{border-radius:0; background:#fff;}
textarea{resize:none;}
input , textarea{-webkit-border-radius:0;}
/* 사파리 초기화 */
input:-internal-autofill-selected{background:transparent !important;}

.skip{overflow:hidden; position:absolute; width:1px; height:1px; margin:-1px; clip:rect(0 0 0 0);}
.m-only{display:none !important;}
.p-only{display:none !important;}
@media (max-width:1400px){
    .p-only{display:block !important;}
}
@media (max-width:1000px){
    .pc-only{display:none !important;}
    .m-only{display:block !important;}
}
@media (max-width:784px){
    .m-only2{display:none !important;}
}

@font-face{font-weight:100; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Thin.woff2') format('woff2');}
@font-face{font-weight:200; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraLight.woff2') format('woff2');}
@font-face{font-weight:300; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Light.woff2') format('woff2');}
@font-face{font-weight:400; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2');}
@font-face{font-weight:500; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Medium.woff2') format('woff2');}
@font-face{font-weight:600; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-SemiBold.woff2') format('woff2');}
@font-face{font-weight:700; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Bold.woff2') format('woff2');}
@font-face{font-weight:800; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraBold.woff2') format('woff2');}
@font-face{font-weight:900; font-family:'Pretendard'; font-display:swap; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Black.woff2') format('woff2');}

*{margin:0; padding:0; box-sizing:border-box;}

body{opacity:0; background-color:#fff !important; color:#201D1D; font-family:'Pretendard'; transition:1s ease-in-out;}
.about-page{transition-duration: 0.8s;}
body.loaded{opacity:1;}

.main-container{}
.main-container .content-container{}

.header{display:flex;padding: 20px 48px;/* flex-direction:column; */gap:67px;align-items:center;justify-content: space-between;}
.header .logo{
    text-align: left;
    /* margin-right: auto; */
    flex-shrink: 0;
}
.header .logo a{
    display: inline-block;
}
.header .logo a img{
    width: 77px;
}
.header .nav{display:flex;/* margin-left:28px; *//* padding: 0 67px 0 160px; */gap: 60px;/* flex: 1 0 0; *//* justify-content: space-between; */}
.header .nav a{/* color:#B5B5B5; */color: #201D1D;font-size: 20px;font-weight:700;transition:0.25s ease-in-out;white-space: nowrap;}
.header .nav a.active, .header .nav a:hover{color:#201D1D;}

.footer{display:flex;position:relative;padding: 44px 20px 44px;background-color:#201D1D;text-align:center;align-items:center;flex-direction:column;gap: 28px;}
.footer img{width: 77px;}
.footer p{color:#FEFEFE;font-size: 12px;font-weight:500;word-break:keep-all;}

.custom-section{}

.home{}
.home .home-visual{position:relative;padding: 210px 48px 77px;/* transition:background-color 0.5s ease-in-out, color 0.5s ease-in-out; */}
.home .home-visual.inverted{background-color:#201D1D; color:#fff;}
.home .home-visual.inverted .visual-text-box > div > p,
.home .home-visual.inverted .visual-text-box > div > span,
.home .home-visual.inverted .visual-copyright{color:#fff;}
.home .home-visual.inverted .visual-copyright{border-top-color:#fff; background-color:#201D1D;}
.home .home-visual.inverted .visual-logo img{filter:invert(1);}
.home .home-visual .visual-text{padding:0 78px;}
.home .home-visual .visual-text-box{display:flex; position:relative; z-index:1; flex-direction:column;}
.home .home-visual .visual-text-box > div{display:flex;align-items:end;gap:10px;transition: padding-right 1.25s ease-in-out;position: relative;}
.home .home-visual .visual-text-box > div + div{margin-top:-22px;}
.home .home-visual .visual-text-box > div > p{font-size:64px; font-weight:700; line-height:1.22; letter-spacing:-0.08em;}
.home .home-visual .visual-text-box > div > p span{position:relative; letter-spacing:inherit;}
.home .home-visual .visual-text-box > div > p span:before{position:absolute;top:9px;right:-10px;bottom:9px;z-index:-1;width:0;/* background-color:#A9C3E3;*/content:'';transition: 1.5s ease-in-out;}
.home .home-visual .visual-text-box > div:nth-child(2) > p span:before{transition-delay: 0.45s;}
.home .home-visual .visual-text-box.active > div > p span:before{width:calc(100% + 13px); background-color:#A9C3E3;}
.home .home-visual .visual-text-box > div > span{margin-bottom: 14px;font-size:14px;font-weight:500;letter-spacing:-1.12px;opacity: 0;transform: translateX(10px);}
.home .home-visual .visual-text-box.active > div > span{opacity:1; transform:none;}
.home .home-visual .visual-text-box.n1{align-items:end;}
.home .home-visual .visual-text-box.n1 > div{}
.home .home-visual .visual-text-box.n1 > div:nth-child(1) > span{
    transition: 0.5s 1.25s ease-in-out;
}
.home .home-visual .visual-text-box.n1 > div:nth-child(2){}
.home .home-visual .visual-text-box.n1 > div:nth-child(3){transition-delay: 1.25s;}
.home .home-visual .visual-text-box.n1.active > div:nth-child(3){padding-right: 134px;}
.home .home-visual .visual-text-box.n1 > div:nth-child(3) > p{}
.home .home-visual .visual-text-box.n1 > div:nth-child(3) > span{
    position: absolute;
    right: 0;
    bottom: 0;
    opacity:0;
    transition: 1s 1.65s ease-in-out;
}
.home .home-visual .visual-text-box.n1.active > div:nth-child(3) > span{opacity:1;}
.home .home-visual .visual-text-box.n1 > div:nth-child(4){transition-delay: 1s;transition-duration: 1.75s;}
.home .home-visual .visual-text-box.n1.active > div:nth-child(4){padding-right:357px;}
.home .home-visual .visual-text-box.n2{}
.home .home-visual .visual-text-box.n2 > div{}
.home .home-visual .visual-text-box.n2 > div:nth-child(1){padding-left:76px;}
.home .home-visual .visual-text-box.n2 > div:nth-child(2){}
.home .home-visual .visual-logo{display:flex; margin-top:69px; gap:9px;}
.home .home-visual .visual-logo img{opacity:0 !important; transform:translateY(100px) rotate(15deg) !important;} /* 초기 상태: 안보이게 설정 */
.home .home-visual .visual-copyright{display:flex; position:relative; margin-top:77px; padding:95px 0 30px; background-color:#fff; align-items:center;flex-direction:column;gap:40px;}
.home .home-visual .visual-copyright p{font-size:20px; font-weight:500;}
.home .home-works{display:flex;padding:314px 0 212px;text-align:center;flex-direction:column;align-items:center;background-color: #fff;z-index: 1;position: relative;}
.home .home-works:before{content:'';position:absolute;top: -2px;left:48px;right:48px;height:2px;background-color:#000;}
.home .home-works .works-title{}
.home .home-works .works-title span{color:#D9D9D9;font-size: 85px;font-weight:700;line-height:1;transition:0.25s ease-in-out;}
.home .home-works .works-title span.active{color:#201D1D;}
.home .home-works .works-btn{
    margin-top: 314px;
    padding: 0 70px;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.home .home-works .works-btn a{
    font-size: 24px;
    font-weight: 700;
    color: #201D1D;
    transition: 0.25s ease-in-out;
}
.home .home-works .works-btn a:nth-child(2){color: #B5B5B5;}
.home .home-works .works-btn a:nth-child(2):hover{color: #201D1D;}
.home .home-works .works-slide-container{display:flex;flex-direction:column;gap:10px;margin-top:10px;}
.home .home-works .swiper-wrapper{transition-timing-function: ease-in-out !important;}
.home .home-works .works-slide{width: 100%;cursor:pointer;position:relative;flex-shrink:0;margin-left: 0;/* padding-right: 90px; */padding: 0 70px;}
.home .home-works .works-slide:before,
.home .home-works .works-slide:after{content:'';position: absolute;top: 0;bottom: 0;width: 70px;background-color: #fff;z-index: 2;cursor: default;}
.home .home-works .works-slide:before{left: 0;}
.home .home-works .works-slide:after{right: 0;}
.home .home-works .works-slide-item{display:flex;justify-content:center;align-items:center;width: calc((100% - 28px) / 3);}
.home .home-works .works-slide .swiper-button-next,
.home .home-works .works-slide .swiper-button-prev{
    color: #201D1D;
    opacity: 0.3;
    transition: 0.25s ease-in-out;
    width: 70px;
    height: 100%;
    margin-top: 0;
    top: 0;
}
.home .home-works .works-slide .swiper-button-next:after,
.home .home-works .works-slide .swiper-button-prev:after{font-size: 24px;/* font-weight: 600; *//* color: #fff; */content: '';background: url(https://freight.cargo.site/t/original/i/c1d2e1fc5e84bcb1c0c068fea61761fa74074a6c4490147e0203c672e555ce63/arrow.svg) no-repeat center / cover;width: 30px;height: 30px;}
.home .home-works .works-slide .swiper-button-prev:after{transform:rotate(180deg);}
.home .home-works .works-slide .swiper-button-next:hover,
.home .home-works .works-slide .swiper-button-prev:hover{
    opacity: 1;
}
.home .home-works .works-slide .swiper-button-prev{
    left: 0;
}
.home .home-works .works-slide .swiper-button-next{right: 0px;}
.home .home-works .works-slide .swiper-button-disabled{opacity: 0 !important;visibility: hidden;}
.home .home-works .works-slide-item a{width:100%;}
.home .home-works .works-slide-item a img{display:block; width:100%;}
.home .home-client{display:flex; padding:68px 0 280px; flex-direction:column;align-items:center;}
.home .home-client .client-title{color:#B5B5B5;font-size: 38px;font-weight:700;line-height:1;transition:0.25s ease-in-out;}
.home .home-client:not(.active) .client-title span:first-child{color:#201D1D;}
.home .home-client.active .client-title span:last-child{color:#201D1D;}
.home .home-client .client-title span{/* color:#201D1D; */transition: 0.25s ease-in-out; cursor:pointer;}
.home .home-client .client-list{display:flex;width:100%;margin-top: 108px;padding-right: 130px;gap: 30px;justify-content:center;}
.home .home-client .client-item{text-align:right;}
.home .home-client .client-item ul{}
.home .home-client .client-item ul li{font-size: 22px;font-weight:500;line-height:144.444%;transition:0.25s ease-in-out;letter-spacing:-1.44px;color: #B5B5B5;}
.home .home-client .client-item:nth-child(2){text-align:left;}
.home .home-client:not(.active) .client-item:nth-child(1) ul li{color:#201D1D;}
.home .home-client.active .client-item:nth-child(2) ul li{color:#201D1D;}
.home .home-client .client-item:nth-child(2) ul li:hover{color:#201D1D;}

.works{padding:100px 126px;}
.works .works-tab{display:flex; flex-direction:column;align-items:center;}
.works .works-tab ul{display:flex;gap:4px;flex-wrap: wrap;justify-content: center;}
.works .works-tab ul:nth-child(1){/* padding-left:60px; */}
.works .works-tab ul:nth-child(2){/* padding-right:64px; */}
.works .works-tab ul li{}
.works .works-tab ul li a{color:#DBDBDB; font-size:48px; font-weight:600; line-height:1; transition:0.25s ease-in-out; letter-spacing:-2.4px;}
.works .works-tab ul li.active a{color:#201D1D;}
.works .works-tab ul:nth-child(2) li a{letter-spacing: -0.056em;}
.works .works-category{margin-top:180px;}
.works .works-category ul{display:flex;flex-wrap:wrap;justify-content:end;gap: 4px 3px;}
.works .works-category ul li{}
.works .works-category ul li button{min-width:54px;padding: 0 13px;border:1px solid #1D1D20;border-radius:20px;font-size: 16px;font-weight:500;text-align:center;line-height: 32px;transition:0.25s ease-in-out;letter-spacing:-0.264px;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    outline:none;
    color:#201D1D;}
.works .works-category ul li.active button{border-color:#201D1D; background-color:#201D1D; color:#fff;}
.works .works-list{display:flex; margin-top:22px; flex-wrap:wrap;gap:100px 54px;}
.works .works-list li{width:calc((100% - 108px)/3);}
.works .works-list li a{display:block;}
.works .works-list li .img{margin-bottom:8px; background-color:#000; aspect-ratio:520 / 293;}
.works .works-list li .img img{width:100%; height:100%; object-fit:cover;}
.works .works-list li .text{}
.works .works-list li .text span{color:#000;font-size: 16px;font-weight:700;line-height:1.5;letter-spacing:-0.132px;}
.works .works-list li .text .title{display:flex; justify-content:space-between;}
.works .works-list li .text .title span:nth-child(2){font-weight:400;}
.works .works-list li .text > span{}
.works-detail{padding:110px 184px 194px;}
.detail-head{display:flex; flex-direction:column;align-items:center;gap:6px;}
.detail-head div{font-size:48px; font-weight:700; letter-spacing:-2.4px;}
.detail-head p{font-size:40px; font-weight:600; letter-spacing:-2px;}
.detail-main{margin:120px auto 0; padding:0 80px;}
.detail-main .iframe{width:100%; margin:0 auto; aspect-ratio:16 / 9;}
.detail-main .iframe iframe{width:100%; height:100%;}
.detail-main img{}
.detail-title{margin-top:200px; font-size:64px; font-weight:700; letter-spacing:-3.2px;}
.detail-info{display:flex; margin-top:120px; flex-direction:column;gap:74px;}
.detail-info .info-box{display:flex;}
.detail-info .info-box .info-title{width:348px; color:#B5B5B5; font-size:16px; font-weight:400; flex-shrink:0;}
.detail-info .info-box p{color:#B5B5B5; font-size:16px; font-weight:600;}
.detail-info .info-box .info-list{display:flex; flex:1 0 0; gap:56px 0;flex-wrap:wrap;}
.detail-info .info-box .info-list li{display:flex; width:25%; flex-direction:column;gap:9px;justify-content:space-between;}
.detail-info .info-box .info-list li span{color:#B5B5B5; font-size:16px; font-weight:400;}
.detail-info .info-box .info-list li p{}
.detail-img{display:flex; margin:160px auto 0; padding:0 80px; flex-wrap:wrap;gap:16px;}
.detail-img div{width:calc(50% - 8px);}
.detail-img div img{width:100%;}

.lab{padding: 80px 126px;}
.lab .lab-head{display:flex; flex-direction:column;align-items:center;gap:60px;}
.lab .lab-head img{
    width: 656px;
}
.lab .lab-head p{font-size: 22px;font-weight:700;text-align:center;line-height:1.5;letter-spacing:-0.352px;}
.lab .lab-list{display:flex;margin-top: 160px;gap:24px;}
.lab .lab-list ul{display:flex; flex-direction:column;gap:24px;}
.lab .lab-list ul li{}
.lab .lab-list ul li a{display:block; overflow:hidden; position:relative;}
.lab .lab-list ul li a img{}
.lab .lab-list ul li a span{display:flex; opacity:0; visibility:hidden; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(32, 29, 29, 0.45); color:#FFF; font-size:28px; font-weight:600; text-align:center; text-shadow:0 4px 4px rgba(0, 0, 0, 0.25); transform:scale(1.05); transition:0.25s ease-in-out; letter-spacing:-0.84px;align-items:center;justify-content:center;}
.lab .lab-list ul li a:hover span{opacity:1; visibility:inherit; transform:none;}
.lab-detail{padding:220px 0;}
.lab-detail .detail-slide{overflow:hidden;}
.lab-detail .detail-slide .swiper-wrapper{}
.lab-detail .detail-slide-item{width:auto; height:654px;}
.lab-detail .detail-slide-item img{display:block; width:auto !important; height:100% !important;}
.lab-detail .lab-cont{display:flex; margin-top:96px; padding:0 126px; flex-direction:column;align-items:center;}
.lab-detail .lab-cont .cont-title{color:#000; font-size:128px; font-weight:700; text-align:center; line-height:1.5; letter-spacing:-1.408px;}
.lab-detail .lab-cont .cont-box{display:flex; margin-top:76px; text-align:center; gap:58px;align-items:start;}
.lab-detail .lab-cont .cont-box img{width:247px !important; height:auto !important; flex-shrink:0;}
.lab-detail .lab-cont .cont-box img:first-child{margin-top:158px;}
.lab-detail .lab-cont .cont-box img:last-child{width:315px !important; height:auto !important;}
.lab-detail .lab-cont .cont-box p{max-width:863px; font-size:32px; font-weight:600; line-height:1.35; word-break:keep-all;letter-spacing:-0.352px;}
.lab-detail .lab-cont .cont-box .mt{margin-top:158px;}

.about-wrap{overflow:hidden;}
.about{position:relative;height:2484px;padding:70px 142px 110px;/* background:url(../images/about.png) no-repeat center top;*/transform: scale(0.7);margin: -348px 0;}
.about .about-item{position:absolute;}
.about .about-item .alphabet{position:relative;}
.about .about-item .alphabet .title{font-size:700px; font-weight:600; line-height:1; letter-spacing:-28px;}
.about .about-item .alphabet .img{overflow:hidden;position:absolute;width:0;transition: 0.7s 0.45s ease-in-out;}
.about .about-item.aos-animate .alphabet .img{}
.about .about-item .alphabet .img img{position:absolute; top:0; left:0; max-width:inherit;}
.about .about-item .text{display:flex;opacity:0;visibility:hidden;position:absolute;transform:translateX(-50px);transition: 0.7s 0.95s ease-in-out;flex-direction:column;gap:24px;}
.about .about-item.aos-animate .text{opacity:1; visibility:inherit; transform:translateX(0) !important;}
.about .about-item .text div{color:#000;font-size:48px;font-weight: 600;line-height:1;letter-spacing:-1.92px;}
.about .about-item .text div.large{font-size:64px; letter-spacing:-2.56px;}
.about .about-item .text p{width:557px;font-size: 23px;font-weight:400;line-height: 1.35;letter-spacing:-0.96px;word-break:keep-all;}
.about .about-item.n1{top:77px; right:calc(50% + 18px);}
.about .about-item.n1 .alphabet{}
.about .about-item.n1 .alphabet .title{}
.about .about-item.n1 .alphabet .img{top:184px; left:-130px;}
.about .about-item.n1.aos-animate .alphabet .img{width:458px; height:550px;}
.about .about-item.n1 .alphabet .img img{width:458px;}
.about .about-item.n1 .text{top: 399px;right: 183px;}
.about .about-item.n1 .text div{}
.about .about-item.n1 .text div.large{}
.about .about-item.n1 .text p{}
.about .about-item.n2{top:427px; left:calc(50% + 167px);}
.about .about-item.n2 .alphabet{}
.about .about-item.n2 .alphabet .title{}
.about .about-item.n2 .alphabet .img{top:66px; right:-178px;}
.about .about-item.n2.aos-animate .alphabet .img{width:567px; height:704px;}
.about .about-item.n2 .alphabet .img img{left:auto; right:0; width:567px;}
.about .about-item.n2 .text{left:208px;bottom: -273px;transform:translateX(50px);}
.about .about-item.n2 .text div{}
.about .about-item.n2 .text p{}
.about .about-item.n3{top: 904px;right:calc(50% + 358px);}
.about .about-item.n3 .alphabet{}
.about .about-item.n3 .alphabet .title{}
.about .about-item.n3 .alphabet .img{top:229px; left:-23px;}
.about .about-item.n3.aos-animate .alphabet .img{width:593px; height:400px;}
.about .about-item.n3 .alphabet .img img{width:593px;}
.about .about-item.n3 .text{top:551px; left:62px;}
.about .about-item.n3 .text div{}
.about .about-item.n3 .text p{padding-left:5px;}
.about .about-item.n4{top: 1308px;left: calc(50% + 275px);}
.about .about-item.n4 .alphabet{}
.about .about-item.n4 .alphabet .title{}
.about .about-item.n4 .alphabet .img{top:99px; left:-32px;}
.about .about-item.n4.aos-animate .alphabet .img{width:595px; height:561px;}
.about .about-item.n4 .alphabet .img img{width:595px;}
.about .about-item.n5{top: 1564px;right: calc(50% + 483px);}
.about .about-item.n5 .alphabet{}
.about .about-item.n5 .alphabet .title{}
.about .about-item.n5 .alphabet .img{top:46px; right:-11px;}
.about .about-item.n5.aos-animate .alphabet .img{width:322px; height:751px;}
.about .about-item.n5 .alphabet .img img{left:auto; right:0; width:322px;}
.about .about-item.n5 .text{top: 530px;left: 300px;/* text-align:right; */transform: translateX(-50px);}
.about .about-item.n5 .text div{}
.about .about-item.n5 .text p{}
.about .about-item.n6{left:calc(50% - 111px); bottom:140px;}
.about .about-item.n6 .text{position:relative; transform:none !important;}
.about .about-item.n6 .text div{}
.about .about-img{position:absolute;}
.about .about-img.n1{top:84px; left:calc(50% + 175px); width:537px;}
.about .about-img.n2{top: 1535px;left: calc(50% + -185px);width: 436px;}
.about .about-link{
    font-size: 40px;
    position: absolute;
    bottom: 210px;
    left: calc(50% - 182px);
    margin: 0 auto;
    font-weight: 700;
    display: inline-flex;
    gap: 10px;
    align-items: center;
    padding-left: 16px;
    transform: translateY(20px);
}
.about .about-link:after{content:'';background: url(https://freight.cargo.site/t/original/i/baed26c57a1de1a4bd0be7e49f23e94bc92db3a7974f91bfaf17b86178bbc054/down.svg) no-repeat center / cover;width: 41px;height: 41px;/* transition: 0.25s ease-in-out; */margin-top: -1px;}
.about .about-link:hover:after{/*transform:translateX(10px);*/}

.contact{}
.contact .contact-visual{/* padding:calc(100vh - 615px) 62px 0; */padding: 180px 62px 0;}
.contact .contact-visual .visual-logo{display:flex; justify-content:end;gap:7px;}
.contact .contact-visual .visual-logo img{height:331px;}
.contact .contact-info{display:flex;position:relative;z-index:1;padding: 136px 62px 76px;border-top:2px solid #fff;background-color:#201D1D;flex-direction:column;gap:190px;}
.contact .contact-info .info-mail{color:#fff;font-size:47px;font-weight:600;line-height: 1;}
.contact .contact-info .info-mail p{margin-bottom: 24px;}
.contact .contact-info .info-mail a{border-bottom: 3px solid #fff;font-size: 31px;}
.contact .contact-info .info-address{display:flex;align-items:end;/* justify-content:space-between; */gap: 24px;}
.contact .contact-info .info-address p{color:#fff; font-size:20px; font-weight:500; line-height:1; letter-spacing:-0.8px;}
.contact .contact-info .info-address a{color:#fff;font-size:20px;font-weight:500;line-height:1;letter-spacing:-0.8px;}
.contact .contact-info .info-address p + a{margin-left:auto;}

@media (max-width:1700px){
    .header{}
    .header .logo{}
    .header .logo a{}
    .header .logo a img{}
    .header .nav{/* width: calc(100% - 20px); *//* max-width: 1388px; *//* margin-left: 10px; *//* margin-right: 10px; *//* gap:0; *//* justify-content:space-between; *//* padding: 0 0 0 120px; */}
    .header .nav a{}
    .header .nav a.active, .header .nav a:hover{}

    .footer{}
    .footer img{}
    .footer p{}

    .custom-section{}

    .home{}
    .home .home-visual{padding:50px 25px 0;}
    .home .home-visual .visual-text{padding:0;}
    .home .home-visual .visual-text-box{}
    .home .home-visual .visual-text-box > div{}
    .home .home-visual .visual-text-box > div + div{}
    .home .home-visual .visual-text-box > div > p{}
    .home .home-visual .visual-text-box > div > p span{}
    .home .home-visual .visual-text-box > div > p span:before{}
    .home .home-visual .visual-text-box > div:nth-child(2) > p span:before{}
    .home .home-visual .visual-text-box.active > div > p span:before{}
    .home .home-visual .visual-text-box > div > span{}
    .home .home-visual .visual-text-box.n1{}
    .home .home-visual .visual-text-box.n1 > div{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(2){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > p{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > span{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(4){}
    .home .home-visual .visual-text-box.n2{}
    .home .home-visual .visual-text-box.n2 > div{}
    .home .home-visual .visual-text-box.n2 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n2 > div:nth-child(2){}
    .home .home-visual .visual-logo{}
    .home .home-visual .visual-logo img{height:400px;}
    .home .home-visual .visual-copyright{}
    .home .home-visual .visual-copyright p{}
    .home .home-works{}
    .home .home-works .works-title{}
    .home .home-works .works-title span{}
    .home .home-works .works-title span.active{}
    .home .home-works .works-slide-container{margin-top: 10px;}
    .home .home-works .works-slide{width: 100%;}
    .home .home-works .works-slide-item{/* width: calc((100% - 80px) / 3); */}
    .home .home-works .works-slide-item a{}
    .home .home-works .works-slide-item a img{}
    .home .home-client{}
    .home .home-client .client-title{}
    .home .home-client.active .client-title{}
    .home .home-client .client-title span{}
    .home .home-client .client-list{}
    .home .home-client .client-item{}
    .home .home-client .client-item ul{}
    .home .home-client .client-item ul li{}
    .home .home-client .client-item:nth-child(2){}
    .home .home-client .client-item:nth-child(2) ul li{}
    .home .home-client .client-item:nth-child(2) ul li:hover{}

    .works{padding:50px 25px 90px;}
    .works .works-tab{}
    .works .works-tab ul{}
    .works .works-tab ul:nth-child(1){}
    .works .works-tab ul:nth-child(2){}
    .works .works-tab ul li{}
    .works .works-tab ul li a{}
    .works .works-tab ul li.active a{}
    .works .works-category{}
    .works .works-category ul{}
    .works .works-category ul li{}
    .works .works-category ul li button{}
    .works .works-category ul li.active button{}
    .works .works-list{}
    .works .works-list li{}
    .works .works-list li a{}
    .works .works-list li .img{}
    .works .works-list li .img img{}
    .works .works-list li .text{}
    .works .works-list li .text span{}
    .works .works-list li .text .title{}
    .works .works-list li .text .title span{}
    .works .works-list li .text > span{}
    .works-detail{padding:50px 25px 90px;}
    .detail-head{}
    .detail-head div{}
    .detail-head p{}
    .detail-main{}
    .detail-main .iframe{}
    .detail-main .iframe iframe{}
    .detail-main img{}
    .detail-title{}
    .detail-info{}
    .detail-info .info-box{}
    .detail-info .info-box .info-title{}
    .detail-info .info-box p{}
    .detail-info .info-box .info-list{}
    .detail-info .info-box .info-list li{}
    .detail-info .info-box .info-list li span{}
    .detail-info .info-box .info-list li p{}
    .detail-img{}
    .detail-img div{}
    .detail-img div img{}

    .lab{padding:50px 25px 90px;}
    .lab .lab-head{}
    .lab .lab-head img{}
    .lab .lab-head p{}
    .lab .lab-list{
        margin-top: 130px;
    }
    .lab .lab-list ul{}
    .lab .lab-list ul li{}
    .lab .lab-list ul li a{}
    .lab .lab-list ul li a img{}
    .lab .lab-list ul li a span{}
    .lab .lab-list ul li a:hover span{}
    .lab-detail{padding-top:0;}
    .lab-detail .detail-slide{}
    .lab-detail .detail-slide .swiper-wrapper{}
    .lab-detail .detail-slide-item{}
    .lab-detail .detail-slide-item img{}
    .lab-detail .lab-cont{padding:0 25px;}
    .lab-detail .lab-cont .cont-title{}
    .lab-detail .lab-cont .cont-box{}
    .lab-detail .lab-cont .cont-box img{}
    .lab-detail .lab-cont .cont-box img:last-child{}
    .lab-detail .lab-cont .cont-box p{}
    .lab-detail .lab-cont .cont-box .mt{}

    .about{}
    .about .about-item{}
    .about .about-item .alphabet{}
    .about .about-item .alphabet .title{}
    .about .about-item .alphabet .img{}
    .about .about-item.aos-animate .alphabet .img{}
    .about .about-item .alphabet .img img{}
    .about .about-item .text{}
    .about .about-item.aos-animate .text{}
    .about .about-item .text div{}
    .about .about-item .text div.large{}
    .about .about-item .text p{width:470px;font-size: 21px;}
    .about .about-item.n1{}
    .about .about-item.n1 .alphabet{}
    .about .about-item.n1 .alphabet .title{}
    .about .about-item.n1 .alphabet .img{}
    .about .about-item.n1.aos-animate .alphabet .img{}
    .about .about-item.n1 .alphabet .img img{}
    .about .about-item.n1 .text{right:180px;top: 435px;}
    .about .about-item.n1 .text div{}
    .about .about-item.n1 .text div.large{}
    .about .about-item.n1 .text p{}
    .about .about-item.n2{left:calc(50% + 85px);}
    .about .about-item.n2 .alphabet{}
    .about .about-item.n2 .alphabet .title{}
    .about .about-item.n2 .alphabet .img{}
    .about .about-item.n2.aos-animate .alphabet .img{}
    .about .about-item.n2 .alphabet .img img{}
    .about .about-item.n2 .text{
        bottom: -284px;
    }
    .about .about-item.n2 .text div{}
    .about .about-item.n2 .text p{}
    .about .about-item.n3{right:calc(50% + 266px);top: 912px;}
    .about .about-item.n3 .alphabet{}
    .about .about-item.n3 .alphabet .title{}
    .about .about-item.n3 .alphabet .img{}
    .about .about-item.n3.aos-animate .alphabet .img{}
    .about .about-item.n3 .alphabet .img img{}
    .about .about-item.n3 .text{}
    .about .about-item.n3 .text div{}
    .about .about-item.n3 .text p{}
    .about .about-item.n4{left: calc(50% + 204px);top: 1368px;}
    .about .about-item.n4 .alphabet{}
    .about .about-item.n4 .alphabet .title{}
    .about .about-item.n4 .alphabet .img{}
    .about .about-item.n4.aos-animate .alphabet .img{}
    .about .about-item.n4 .alphabet .img img{}
    .about .about-item.n5{right: calc(50% + 391px);}
    .about .about-item.n5 .alphabet{}
    .about .about-item.n5 .alphabet .title{}
    .about .about-item.n5 .alphabet .img{}
    .about .about-item.n5.aos-animate .alphabet .img{}
    .about .about-item.n5 .alphabet .img img{}
    .about .about-item.n5 .text{}
    .about .about-item.n5 .text div{}
    .about .about-item.n5 .text p{}
    .about .about-item.n6{}
    .about .about-item.n6 .text{}
    .about .about-item.n6 .text div{}
    .about .about-img{}
    .about .about-img.n1{left:auto; left:calc(50% + 131px);}
    .about .about-img.n2{top: 1595px;width:396px;}
    .about .about-link{
        left: calc(50% - 203px);
    }

    .contact{}
    .contact .contact-visual{padding-right:25px; padding-left:25px;}
    .contact .contact-visual .visual-logo{}
    .contact .contact-visual .visual-logo img{}
    .contact .contact-info{}
    .contact .contact-info .info-mail{}
    .contact .contact-info .info-mail a{}
    .contact .contact-info .info-address{}
    .contact .contact-info .info-address p{}
    .contact .contact-info .info-address a{}
}
@media (max-width:1400px){
    .header{}
    .header .logo{}
    .header .logo a{}
    .header .logo a img{}
    .header .nav{}
    .header .nav a{}
    .header .nav a.active, .header .nav a:hover{}

    .footer{}
    .footer img{}
    .footer p{}

    .custom-section{}

    .home{}
    .home .home-visual{}
    .home .home-visual .visual-text{}
    .home .home-visual .visual-text-box{}
    .home .home-visual .visual-text-box > div{}
    .home .home-visual .visual-text-box > div + div{}
    .home .home-visual .visual-text-box > div > p{}
    .home .home-visual .visual-text-box > div > p span{}
    .home .home-visual .visual-text-box > div > p span:before{}
    .home .home-visual .visual-text-box > div:nth-child(2) > p span:before{}
    .home .home-visual .visual-text-box.active > div > p span:before{}
    .home .home-visual .visual-text-box > div > span{}
    .home .home-visual .visual-text-box.n1{}
    .home .home-visual .visual-text-box.n1 > div{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(2){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > p{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > span{}
    .home .home-visual .visual-text-box.n1.active > div:nth-child(4){/* padding-right: 351px; */}
    .home .home-visual .visual-text-box.n2{}
    .home .home-visual .visual-text-box.n2 > div{}
    .home .home-visual .visual-text-box.n2 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n2 > div:nth-child(2){}
    .home .home-visual .visual-logo{}
    .home .home-visual .visual-logo img{height:280px;}
    .home .home-visual .visual-copyright{}
    .home .home-visual .visual-copyright p{}
    .home .home-works{}
    .home .home-works .works-title{}
    .home .home-works .works-title span{}
    .home .home-works .works-title span.active{}
    .home .home-works .works-slide-container{margin-top: 10px;}
    .home .home-works .works-slide{width: 100%;}
    .home .home-works .works-slide-item{width: calc((100% - 14px) / 2);}
    .home .home-works .works-slide-item a{}
    .home .home-works .works-slide-item a img{}
    .home .home-client{}
    .home .home-client .client-title{}
    .home .home-client.active .client-title{}
    .home .home-client .client-title span{}
    .home .home-client .client-list{}
    .home .home-client .client-item{}
    .home .home-client .client-item ul{}
    .home .home-client .client-item ul li{/* font-size:32px; */}
    .home .home-client .client-item:nth-child(2){}
    .home .home-client .client-item:nth-child(2) ul li{}
    .home .home-client .client-item:nth-child(2) ul li:hover{}

    .works{}
    .works .works-tab{}
    .works .works-tab ul{}
    .works .works-tab ul:nth-child(1){}
    .works .works-tab ul:nth-child(2){}
    .works .works-tab ul li{}
    .works .works-tab ul li a{}
    .works .works-tab ul li.active a{}
    .works .works-category{}
    .works .works-category ul{}
    .works .works-category ul li{}
    .works .works-category ul li button{}
    .works .works-category ul li.active button{}
    .works .works-list{gap:60px 20px;}
    .works .works-list li{width:calc((100% - 40px) / 3);}
    .works .works-list li a{}
    .works .works-list li .img{}
    .works .works-list li .img img{}
    .works .works-list li .text{}
    .works .works-list li .text span{}
    .works .works-list li .text .title{}
    .works .works-list li .text .title span{}
    .works .works-list li .text > span{}
    .works-detail{}
    .detail-head{}
    .detail-head div{}
    .detail-head p{}
    .detail-main{}
    .detail-main .iframe{}
    .detail-main .iframe iframe{}
    .detail-main img{}
    .detail-title{}
    .detail-info{}
    .detail-info .info-box{}
    .detail-info .info-box .info-title{width:160px;}
    .detail-info .info-box p{}
    .detail-info .info-box .info-list{}
    .detail-info .info-box .info-list li{}
    .detail-info .info-box .info-list li span{}
    .detail-info .info-box .info-list li p{}
    .detail-img{}
    .detail-img div{}
    .detail-img div img{}

    .lab{}
    .lab .lab-head{}
    .lab .lab-head img{}
    .lab .lab-head p{}
    .lab .lab-list{}
    .lab .lab-list ul{}
    .lab .lab-list ul li{}
    .lab .lab-list ul li a{}
    .lab .lab-list ul li a img{}
    .lab .lab-list ul li a span{}
    .lab .lab-list ul li a:hover span{}
    .lab-detail{padding-bottom:90px;}
    .lab-detail .detail-slide{}
    .lab-detail .detail-slide .swiper-wrapper{}
    .lab-detail .detail-slide-item{}
    .lab-detail .detail-slide-item img{}
    .lab-detail .lab-cont{}
    .lab-detail .lab-cont .cont-title{font-size:110px;}
    .lab-detail .lab-cont .cont-box{gap:24px;}
    .lab-detail .lab-cont .cont-box img{}
    .lab-detail .lab-cont .cont-box img:last-child{}
    .lab-detail .lab-cont .cont-box p{font-size:28px;}
    .lab-detail .lab-cont .cont-box .mt{}

    .about-wrap{overflow:hidden;}
    .about{margin:-373px 0; transform:scale(0.7); /* transform-origin:top center;*/}
    .about .about-item{}
    .about .about-item .alphabet{}
    .about .about-item .alphabet .title{}
    .about .about-item .alphabet .img{}
    .about .about-item.aos-animate .alphabet .img{}
    .about .about-item .alphabet .img img{}
    .about .about-item .text{}
    .about .about-item.aos-animate .text{}
    .about .about-item .text div{}
    .about .about-item .text div.large{}
    .about .about-item .text p{}
    .about .about-item.n1{}
    .about .about-item.n1 .alphabet{}
    .about .about-item.n1 .alphabet .title{}
    .about .about-item.n1 .alphabet .img{}
    .about .about-item.n1.aos-animate .alphabet .img{}
    .about .about-item.n1 .alphabet .img img{}
    .about .about-item.n1 .text{}
    .about .about-item.n1 .text div{}
    .about .about-item.n1 .text div.large{}
    .about .about-item.n1 .text p{}
    .about .about-item.n2{}
    .about .about-item.n2 .alphabet{}
    .about .about-item.n2 .alphabet .title{}
    .about .about-item.n2 .alphabet .img{}
    .about .about-item.n2.aos-animate .alphabet .img{}
    .about .about-item.n2 .alphabet .img img{}
    .about .about-item.n2 .text{}
    .about .about-item.n2 .text div{}
    .about .about-item.n2 .text p{}
    .about .about-item.n3{}
    .about .about-item.n3 .alphabet{}
    .about .about-item.n3 .alphabet .title{}
    .about .about-item.n3 .alphabet .img{}
    .about .about-item.n3.aos-animate .alphabet .img{}
    .about .about-item.n3 .alphabet .img img{}
    .about .about-item.n3 .text{}
    .about .about-item.n3 .text div{}
    .about .about-item.n3 .text p{}
    .about .about-item.n4{}
    .about .about-item.n4 .alphabet{}
    .about .about-item.n4 .alphabet .title{}
    .about .about-item.n4 .alphabet .img{}
    .about .about-item.n4.aos-animate .alphabet .img{}
    .about .about-item.n4 .alphabet .img img{}
    .about .about-item.n5{}
    .about .about-item.n5 .alphabet{}
    .about .about-item.n5 .alphabet .title{}
    .about .about-item.n5 .alphabet .img{}
    .about .about-item.n5.aos-animate .alphabet .img{}
    .about .about-item.n5 .alphabet .img img{}
    .about .about-item.n5 .text{}
    .about .about-item.n5 .text div{}
    .about .about-item.n5 .text p{}
    .about .about-item.n6{}
    .about .about-item.n6 .text{}
    .about .about-item.n6 .text div{}
    .about .about-img{}
    .about .about-img.n1{}
    .about .about-img.n2{}

    .contact{}
    .contact .contact-visual{/* padding-top:calc(100vh - 566px); */}
    .contact .contact-visual .visual-logo{}
    .contact .contact-visual .visual-logo img{height:282px;}
    .contact .contact-info{}
    .contact .contact-info .info-mail{}
    .contact .contact-info .info-mail a{}
    .contact .contact-info .info-address{}
    .contact .contact-info .info-address p{}
    .contact .contact-info .info-address a{}
}
@media (max-width:1000px){
    .header{
        padding-left: 25px;
        padding-right: 25px;
    }
    .header .logo{}
    .header .logo a{}
    .header .logo a img{}
    .header .nav{
        /* padding-left: 60px; */
    }
    .header .nav a{
        font-size: 18px;
    }
    .header .nav a.active, .header .nav a:hover{}

    .footer{}
    .footer img{}
    .footer p{}

    .custom-section{}

    .home{}
    .home .home-visual{}
    .home .home-visual .visual-text{}
    .home .home-visual .visual-text-box{}
    .home .home-visual .visual-text-box > div{}
    .home .home-visual .visual-text-box > div + div{margin-top:-19px;}
    .home .home-visual .visual-text-box > div > p{font-size:52px;}
    .home .home-visual .visual-text-box > div > p span{}
    .home .home-visual .visual-text-box > div > p span:before{}
    .home .home-visual .visual-text-box > div:nth-child(2) > p span:before{}
    .home .home-visual .visual-text-box.active > div > p span:before{}
    .home .home-visual .visual-text-box > div > span{}
    .home .home-visual .visual-text-box.n1{}
    .home .home-visual .visual-text-box.n1 > div{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(2){}
    .home .home-visual .visual-text-box.n1.active > div:nth-child(3){padding-right: 109px;}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > p{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > span{}
    .home .home-visual .visual-text-box.n1.active > div:nth-child(4){padding-right: 289px;}
    .home .home-visual .visual-text-box.n2{}
    .home .home-visual .visual-text-box.n2 > div{}
    .home .home-visual .visual-text-box.n2 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n2 > div:nth-child(2){}
    .home .home-visual .visual-logo{}
    .home .home-visual .visual-logo img{height:216px;}
    .home .home-visual .visual-copyright{}
    .home .home-visual .visual-copyright p{}
    .home .home-works{padding:160px 0 100px;}
    .home .home-works:before{
        left: 20px;
        right: 20px;
    }
    .home .home-works .works-title{}
    .home .home-works .works-title span{font-size:78px;}
    .home .home-works .works-title span.active{}
    .home .home-works .works-btn{margin-top: 160px;}
    .home .home-works .works-slide{/* margin-top:200px; */}
    .home .home-works .works-slide-item{}
    .home .home-works .works-slide-item a{}
    .home .home-works .works-slide-item a img{}
    .home .home-works .works-slide .swiper-button-next, .home .home-works .works-slide .swiper-button-prev{opacity:1;}
    .home .home-client{padding:40px 0 90px;}
    .home .home-client .client-title{/* font-size:60px; */}
    .home .home-client.active .client-title{}
    .home .home-client .client-title span{}
    .home .home-client .client-list{margin-top: 70px;/* padding-right:140px; */}
    .home .home-client .client-item{}
    .home .home-client .client-item ul{}
    .home .home-client .client-item ul li{/* font-size:26px; */}
    .home .home-client .client-item:nth-child(2){}
    .home .home-client .client-item:nth-child(2) ul li{}
    .home .home-client .client-item:nth-child(2) ul li:hover{}

    .works{}
    .works .works-tab{}
    .works .works-tab ul{}
    .works .works-tab ul:nth-child(1){}
    .works .works-tab ul:nth-child(2){}
    .works .works-tab ul li{}
    .works .works-tab ul li a{font-size:36px;}
    .works .works-tab ul li.active a{}
    .works .works-category{}
    .works .works-category ul{}
    .works .works-category ul li{}
    .works .works-category ul li button{font-size: 16px;line-height:31px;}
    .works .works-category ul li.active button{}
    .works .works-list{}
    .works .works-list li{}
    .works .works-list li a{}
    .works .works-list li .img{}
    .works .works-list li .img img{}
    .works .works-list li .text{}
    .works .works-list li .text span{
        font-size: 14px;
    }
    .works .works-list li .text .title{}
    .works .works-list li .text .title span{}
    .works .works-list li .text > span{}
    .works-detail{}
    .detail-head{}
    .detail-head div{}
    .detail-head p{}
    .detail-main{padding:0;}
    .detail-main .iframe{}
    .detail-main .iframe iframe{}
    .detail-main img{}
    .detail-title{}
    .detail-info{}
    .detail-info .info-box{}
    .detail-info .info-box .info-title{}
    .detail-info .info-box p{}
    .detail-info .info-box .info-list{}
    .detail-info .info-box .info-list li{width:33.33%;}
    .detail-info .info-box .info-list li span{}
    .detail-info .info-box .info-list li p{}
    .detail-img{padding:0;}
    .detail-img div{}
    .detail-img div img{}

    .lab{}
    .lab .lab-head{}
    .lab .lab-head img{
        max-width: 80%;
    }
    .lab .lab-head p{/* font-size:26px; */}
    .lab .lab-list{}
    .lab .lab-list ul{}
    .lab .lab-list ul li{}
    .lab .lab-list ul li a{}
    .lab .lab-list ul li a img{}
    .lab .lab-list ul li a span{
        font-size: 20px;
    }
    .lab .lab-list ul li a:hover span{}
    .lab-detail{}
    .lab-detail .detail-slide{}
    .lab-detail .detail-slide .swiper-wrapper{}
    .lab-detail .detail-slide-item{}
    .lab-detail .detail-slide-item img{}
    .lab-detail .lab-cont{}
    .lab-detail .lab-cont .cont-title{font-size:80px; letter-spacing:-0.8px;}
    .lab-detail .lab-cont .cont-box{}
    .lab-detail .lab-cont .cont-box img{width:130px !important;}
    .lab-detail .lab-cont .cont-box img:first-child{margin-top:80px;}
    .lab-detail .lab-cont .cont-box img:last-child{width:165px !important;}
    .lab-detail .lab-cont .cont-box p{font-size:21px;}
    .lab-detail .lab-cont .cont-box .mt{margin-top:80px;}

    .about{margin:-560px 0; transform:scale(0.55);}
    .about .about-item{}
    .about .about-item .alphabet{}
    .about .about-item .alphabet .title{}
    .about .about-item .alphabet .img{}
    .about .about-item.aos-animate .alphabet .img{}
    .about .about-item .alphabet .img img{}
    .about .about-item .text{}
    .about .about-item.aos-animate .text{}
    .about .about-item .text div{}
    .about .about-item .text div.large{}
    .about .about-item .text p{}
    .about .about-item.n1{}
    .about .about-item.n1 .alphabet{}
    .about .about-item.n1 .alphabet .title{}
    .about .about-item.n1 .alphabet .img{}
    .about .about-item.n1.aos-animate .alphabet .img{}
    .about .about-item.n1 .alphabet .img img{}
    .about .about-item.n1 .text{}
    .about .about-item.n1 .text div{}
    .about .about-item.n1 .text div.large{}
    .about .about-item.n1 .text p{}
    .about .about-item.n2{}
    .about .about-item.n2 .alphabet{}
    .about .about-item.n2 .alphabet .title{}
    .about .about-item.n2 .alphabet .img{}
    .about .about-item.n2.aos-animate .alphabet .img{}
    .about .about-item.n2 .alphabet .img img{}
    .about .about-item.n2 .text{}
    .about .about-item.n2 .text div{}
    .about .about-item.n2 .text p{}
    .about .about-item.n3{}
    .about .about-item.n3 .alphabet{}
    .about .about-item.n3 .alphabet .title{}
    .about .about-item.n3 .alphabet .img{}
    .about .about-item.n3.aos-animate .alphabet .img{}
    .about .about-item.n3 .alphabet .img img{}
    .about .about-item.n3 .text{}
    .about .about-item.n3 .text div{}
    .about .about-item.n3 .text p{}
    .about .about-item.n4{}
    .about .about-item.n4 .alphabet{}
    .about .about-item.n4 .alphabet .title{}
    .about .about-item.n4 .alphabet .img{}
    .about .about-item.n4.aos-animate .alphabet .img{}
    .about .about-item.n4 .alphabet .img img{}
    .about .about-item.n5{}
    .about .about-item.n5 .alphabet{}
    .about .about-item.n5 .alphabet .title{}
    .about .about-item.n5 .alphabet .img{}
    .about .about-item.n5.aos-animate .alphabet .img{}
    .about .about-item.n5 .alphabet .img img{}
    .about .about-item.n5 .text{}
    .about .about-item.n5 .text div{}
    .about .about-item.n5 .text p{}
    .about .about-item.n6{}
    .about .about-item.n6 .text{}
    .about .about-item.n6 .text div{}
    .about .about-img{}
    .about .about-img.n1{}
    .about .about-img.n2{}

    .contact{}
    .contact .contact-visual{/* padding-top:calc(100vh - 501px); */}
    .contact .contact-visual .visual-logo{}
    .contact .contact-visual .visual-logo img{height:217px;}
    .contact .contact-info{}
    .contact .contact-info .info-mail{}
    .contact .contact-info .info-mail a{}
    .contact .contact-info .info-address{}
    .contact .contact-info .info-address p{}
    .contact .contact-info .info-address a{}
}
@media (max-width: 784px){
    .header{padding:20px;gap: 5px;}
    .header .logo{}
    .header .logo a{}
    .header .logo a img{width: 58px;}
    .header .nav{
        /* margin-left: 0; */
        /* margin-right: 0; */
        /* width: 100%; */
        gap: 7px;
    }
    .header .nav a{font-size: 13px;}
    .header .nav a.active, .header .nav a:hover{}

    .footer{padding:44px 20px; gap:20px;}
    .footer img{width: 66px;}
    .footer p{/* font-size:14px; *//* letter-spacing:-0.4px; */}

    .custom-section{}

    .home{}
    .home .home-visual{padding:30px 20px 80px;}
    .home .home-visual .visual-text{}
    .home .home-visual .visual-text-box{}
    .home .home-visual .visual-text-box > div{gap: 15px;}
    .home .home-visual .visual-text-box > div + div{margin-top:-13px;}
    .home .home-visual .visual-text-box > div > p{font-size:36px; letter-spacing:-0.06em;}
    .home .home-visual .visual-text-box > div > p span{}
    .home .home-visual .visual-text-box > div > p span:before{top:5px; right:-6px; bottom:5px;}
    .home .home-visual .visual-text-box > div:nth-child(2) > p span:before{}
    .home .home-visual .visual-text-box.active > div > p span:before{width:calc(100% + 8px);}
    .home .home-visual .visual-text-box > div > span{margin-bottom: 9px;font-size: 11px;letter-spacing:-0.8px;}
    .home .home-visual .visual-text-box.n1{}
    .home .home-visual .visual-text-box.n1 > div{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(1){}
    .home .home-visual .visual-text-box.n1 > div:nth-child(2){}
    .home .home-visual .visual-text-box.n1.active > div:nth-child(3){padding-right: 79px;}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > p{}
    .home .home-visual .visual-text-box.n1 > div:nth-child(3) > span{
        right: -3px;
    }
    .home .home-visual .visual-text-box.n1.active > div:nth-child(4){padding-right: 205px;}
    .home .home-visual .visual-text-box.n2{margin-top:10px;}
    .home .home-visual .visual-text-box.n2 > div{}
    .home .home-visual .visual-text-box.n2 > div:nth-child(1){padding-left:21px;}
    .home .home-visual .visual-text-box.n2 > div:nth-child(2){}
    .home .home-visual .visual-logo{gap:4px;}
    .home .home-visual .visual-logo img{height:94px; opacity:0 !important; transform:translateY(100px) rotate(15deg) !important;}
    .home .home-visual .visual-copyright{padding-top:50px; gap:24px;}
    .home .home-visual .visual-copyright img{width:117px;}
    .home .home-visual .visual-copyright p{font-size:16px; text-align:center;}
    .home .home-works{padding:80px 0;}
    .home .home-works .works-title{}
    .home .home-works .works-title span{font-size:34px;}
    .home .home-works .works-title span.active{}
    .home .home-works .works-btn{margin-top: 80px;padding: 0 30px;}
    .home .home-works .works-btn a{
        font-size: 16px;
    }
    .home .home-works .works-slide-container{margin-top: 10px;}
    .home .home-works .works-slide{width: 100%;padding: 0 30px;}
    .home .home-works .works-slide:before, .home .home-works .works-slide:after{width: 30px;}
    .home .home-works .works-slide-item{width: calc((100% - 8px) / 2);}
    .home .home-works .works-slide-item a{}
    .home .home-works .works-slide-item a img{}
    .home .home-works .works-slide .swiper-button-next, .home .home-works .works-slide .swiper-button-prev{
        width: 30px;
    }
    .home .home-works .works-slide .swiper-button-next:after, .home .home-works .works-slide .swiper-button-prev:after{
        width: 20px;
        height: 20px;
    }
    .home .home-client{padding:0 20px 44px;}
    .home .home-client .client-title{font-size:26px;}
    .home .home-client.active .client-title{}
    .home .home-client .client-title span{}
    .home .home-client .client-list{margin-top:40px;padding-right: 91px;gap: 21px;}
    .home .home-client .client-item{}
    .home .home-client .client-item ul{}
    .home .home-client .client-item ul li{font-size:15px; letter-spacing:-0.7px;}
    .home .home-client .client-item:nth-child(2){}
    .home .home-client .client-item:nth-child(2) ul li{}
    .home .home-client .client-item:nth-child(2) ul li:hover{}

    .works{padding:30px 20px 44px;}
    .works .works-tab{}
    .works .works-tab ul{}
    .works .works-tab ul:nth-child(1){/* padding-left:20px; */}
    .works .works-tab ul:nth-child(2){/* padding-right:20px; */}
    .works .works-tab ul li{}
    .works .works-tab ul li a{font-size:20px; line-height:1.2; letter-spacing:-1.2px;}
    .works .works-tab ul li.active a{}
    .works .works-category{margin-top:50px;}
    .works .works-category ul{}
    .works .works-category ul li{}
    .works .works-category ul li button{min-width:38px; padding:0 6px; font-size:12px; line-height:22px;}
    .works .works-category ul li.active button{}
    .works .works-list{gap:20px 8px;}
    .works .works-list li{width:100%;}
    .works .works-list li a{}
    .works .works-list li .img{}
    .works .works-list li .img img{}
    .works .works-list li .text{}
    .works .works-list li .text span{
    }
    .works .works-list li .text .title{}
    .works .works-list li .text .title span{}
    .works .works-list li .text > span{}
    .works-detail{padding:30px 20px 44px;}
    .detail-head{}
    .detail-head div{font-size:30px; letter-spacing:-1.2px;}
    .detail-head p{font-size:20px; letter-spacing:-1px;}
    .detail-main{margin-top:50px;}
    .detail-main .iframe{}
    .detail-main .iframe iframe{}
    .detail-main img{}
    .detail-title{margin-top:50px; font-size:32px; letter-spacing:-1.6px;}
    .detail-info{margin-top:30px; gap:34px;}
    .detail-info .info-box{flex-direction:column; gap:12px;}
    .detail-info .info-box .info-title{width:100%; color:#201D1D;}
    .detail-info .info-box p{font-size:14px;}
    .detail-info .info-box .info-list{gap:24px 16px;}
    .detail-info .info-box .info-list li{width:calc(50% - 8px);}
    .detail-info .info-box .info-list li span{font-size:14px;}
    .detail-info .info-box .info-list li p{}
    .detail-img{margin-top:50px; flex-direction:column; gap:8px;}
    .detail-img div{width:100%;}
    .detail-img div img{}

    .lab{padding: 25px 20px 44px;}
    .lab .lab-head{gap:30px;}
    .lab .lab-head img{}
    .lab .lab-head p{font-size: 18px;line-height:1.25;}
    .lab .lab-list{margin-top: 60px;gap:8px;flex-direction:column;}
    .lab .lab-list ul{gap:8px;}
    .lab .lab-list ul li{}
    .lab .lab-list ul li a{}
    .lab .lab-list ul li a img{}
    .lab .lab-list ul li a span{
        font-size: 16px;
    }
    .lab .lab-list ul li a:hover span{}
    .lab-detail{padding-bottom:44px;}
    .lab-detail .detail-slide{}
    .lab-detail .detail-slide .swiper-wrapper{}
    .lab-detail .detail-slide-item{height:300px;}
    .lab-detail .detail-slide-item img{}
    .lab-detail .lab-cont{margin-top:50px; padding:0 20px;}
    .lab-detail .lab-cont .cont-title{font-size:28px; letter-spacing:-0.5px;}
    .lab-detail .lab-cont .cont-box{margin-top:30px; flex-direction:column; gap:18px;}
    .lab-detail .lab-cont .cont-box img{width:100% !important;}
    .lab-detail .lab-cont .cont-box img:first-child{margin-top:0;}
    .lab-detail .lab-cont .cont-box img:last-child{width:100% !important;}
    .lab-detail .lab-cont .cont-box p{font-size:16px;}
    .lab-detail .lab-cont .cont-box .mt{margin-top:0;}

    .about{height: 1755px;margin:0;padding:0;transform:none;}
    .about .about-item{}
    .about .about-item .alphabet{}
    .about .about-item .alphabet .title{font-size:350px; letter-spacing:-14px;}
    .about .about-item .alphabet .img{}
    .about .about-item.aos-animate .alphabet .img{}
    .about .about-item .alphabet .img img{}
    .about .about-item .text{gap:12px;}
    .about .about-item.aos-animate .text{}
    .about .about-item .text div{font-size:24px; letter-spacing:-0.96px;}
    .about .about-item .text div.large{font-size:32px; letter-spacing:-1.28px;}
    .about .about-item .text p{width: 300px;font-size:14px;letter-spacing: -0.75px;}
    .about .about-item.n1{top:-20px; right:calc(50% + -152px);}
    .about .about-item.n1 .alphabet{}
    .about .about-item.n1 .alphabet .title{}
    .about .about-item.n1 .alphabet .img{top:92px; left:-65px;}
    .about .about-item.n1.aos-animate .alphabet .img{width:229px; height:275px;}
    .about .about-item.n1 .alphabet .img img{width:229px;}
    .about .about-item.n1 .text{top: 214px;right: 12px;}
    .about .about-item.n1 .text div{}
    .about .about-item.n1 .text div.large{}
    .about .about-item.n1 .text p{}
    .about .about-item.n2{top: 452px;left:calc(50% + -183px);}
    .about .about-item.n2 .alphabet{}
    .about .about-item.n2 .alphabet .title{}
    .about .about-item.n2 .alphabet .img{top:33px; right:-89px;}
    .about .about-item.n2.aos-animate .alphabet .img{width:283px; height:352px;}
    .about .about-item.n2 .alphabet .img img{width:283px;}
    .about .about-item.n2 .text{left: 43px;bottom: -42px;text-align: right;}
    .about .about-item.n2 .text div{}
    .about .about-item.n2 .text p{}
    .about .about-item.n3{top: 779px;right:calc(50% - 164px);z-index:1;}
    .about .about-item.n3 .alphabet{}
    .about .about-item.n3 .alphabet .title{}
    .about .about-item.n3 .alphabet .img{top:114px; left:-11px;}
    .about .about-item.n3.aos-animate .alphabet .img{width:296px; height:200px;}
    .about .about-item.n3 .alphabet .img img{width:296px;}
    .about .about-item.n3 .text{top:265px; left:-134px; text-align:right;}
    .about .about-item.n3 .text div{}
    .about .about-item.n3 .text p{width:320px; padding-left:2px;}
    .about .about-item.n4{top: 991px;right:calc(50% + -9px);left: auto;}
    .about .about-item.n4 .alphabet{}
    .about .about-item.n4 .alphabet .title{}
    .about .about-item.n4 .alphabet .img{top:49px; left:-16px;}
    .about .about-item.n4.aos-animate .alphabet .img{width:297px; height:280px;}
    .about .about-item.n4 .alphabet .img img{width:297px;}
    .about .about-item.n5{top: 1297px;left:calc(50% + 44px);right: auto;}
    .about .about-item.n5 .alphabet{}
    .about .about-item.n5 .alphabet .title{}
    .about .about-item.n5 .alphabet .img{top:23px; right:-5px;}
    .about .about-item.n5.aos-animate .alphabet .img{width:161px; height:375px;}
    .about .about-item.n5 .alphabet .img img{width:161px;}
    .about .about-item.n5 .text{top:316px;right:40px;left: auto;}
    .about .about-item.n5 .text div{}
    .about .about-item.n5 .text p{width:276px;}
    .about .about-item.n6{left:0; right:0; bottom:44px; text-align:center;}
    .about .about-item.n6 .text{}
    .about .about-item.n6 .text div{}
    .about .about-img{}
    .about .about-img.n1{top: 1093px;left:50%;width:180px;}
    .about .about-img.n2{top: 1411px;left:calc(50% + -180px);width:183px;}
    .about .about-link{
        padding-left: 0;
        font-size: 24px;
        letter-spacing: -0.96px;
        gap: 6px;
        bottom: 60px;
        left: calc(50% - 119px);
    }
    .about .about-link:after{
        width: 26px;
        height: 26px;
    }
    .about .about-link:hover:after{
        transform: translateX(5px);
    }

    .contact{}
    .contact .contact-visual{/* padding:calc(100vh - 219px) 20px 0; */padding: calc(100vh - 657px) 20px 0;}
    .contact .contact-visual .visual-logo{gap:4px;}
    .contact .contact-visual .visual-logo img{height:95px;}
    .contact .contact-info{padding:44px 20px; gap:88px;}
    .contact .contact-info .info-mail{font-size:24px;}
    .contact .contact-info .info-mail p{margin-bottom:14px;}
    .contact .contact-info .info-mail a{border-bottom-width:2px;font-size: 16px;}
    .contact .contact-info .info-address{/* flex-direction:column; */gap: 10px 12px;/* align-items:start; */flex-wrap: wrap;}
    .contact .contact-info .info-address p{font-size:16px;letter-spacing:-0.6px;width: 100%;}
    .contact .contact-info .info-address a{font-size:16px;}
    .contact .contact-info .info-address p + a{margin-left:0;}
}
@media(max-width:480px){
    .header .nav{
        /* padding-left: 0; */
    }
    .home .home-works .works-slide-item{width:100%;}
    .home .home-client .client-title{
        font-size: 24px;
    }
    .home .home-client .client-list{
        padding-right: 72px;
        gap: 18px;
    }
    .home .home-client .client-item ul li{
        font-size: 14px;
    }

    .works .works-tab{
        max-width: 320px;
        margin: 0 auto;
    }

    .lab .lab-head p{font-size: 16px;}
}
.about-page .about-item .alphabet .img{transition-duration: 0.5s;transition-delay: 0.3s;}
.about-page .about-item .text{transition-duration: 0.5s;transition-delay: 0.7s;}


/* =========================================================
   AI LAB dynamic loading
========================================================= */
.lab-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 320px;
}

.lab-loading[hidden] {
    display: none !important;
}

.lab-loading-spinner {
    display: block;
    width: 42px;
    height: 42px;
    border: 3px solid rgba(32, 29, 29, 0.18);
    border-top-color: #201d1d;
    border-radius: 50%;
    animation: lab-loading-spin 0.75s linear infinite;
}

.lab-loading.is-error {
    min-height: 160px;
    font-size: 14px;
    text-align: center;
}

@keyframes lab-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

.lab-list img,
.lab-detail img {
    -webkit-user-drag: none;
    user-select: none;
}

/* ==========================================================================
   WORKS 필터/탭 재실행 모션
   - AOS의 aos-animate 자동 재부착과 분리하여 확실하게 재생
   ========================================================================== */
.renewal-layout .works-list > li.works-motion-item{
    opacity:0;
    transform:translate3d(0, 34px, 0);
    transition:
            opacity 0.8s ease var(--works-motion-delay, 0ms),
            transform 0.8s ease var(--works-motion-delay, 0ms);
    will-change:opacity, transform;
}


/* 탭/필터 전환 중에는 기존 결과를 즉시 완전히 숨김 */
.renewal-layout .works-list.is-filter-changing > li.works-motion-item{
    opacity:0 !important;
    visibility:hidden !important;
    transform:translate3d(0, 34px, 0) !important;
    transition:none !important;
}

.renewal-layout .works-list > li.works-motion-item.is-motion-active{
    opacity:1;
    transform:translate3d(0, 0, 0);
}

.renewal-layout .works-list > li.works-motion-item[hidden]{
    display:none !important;
}

@media (prefers-reduced-motion: reduce){
    .renewal-layout .works-list > li.works-motion-item{
        opacity:1;
        transform:none;
        transition:none;
    }
}