section.type1{
    padding: 85px 0;
}

/* about */

#subPageType01_visual{
    position: relative;
}

.pg_team #subPageType01_visual .grid_deco .grid_line.pos1{
    right: 0;
}

.pg_team #subPageType01_visual .grid_deco .grid_line.pos_td{
    right: min(250px, 13.0208vw);
}

.aslan .grid_deco .grid_line.pos_td{
    right: 0;
}

.aslan .grid_deco .grid_line.pos_spt_left{
    right: min(250px, 13.0208vw);
}

.pg_team #subPageType01_visual .grid_deco .grid_line.pos_v_center{
    top: 50%;
}

#subPageType01_visual > .grid_barcode{
    left: min(140px, 7.292vw);
    bottom: min(140px, 7.292vw);
    z-index: 11;
}

.subPage_234_top_deco{
    width: 100%;
}

.subPage_234_top_deco .container{
    position: relative;
    z-index: 200;
}

.subPage_234_top_deco .txt{
    padding: 30px 0;
    width: max-content;
}

.subPage_234_top_deco .txt figure{
    height: 50px;
}

.subPage_234_top_deco .blur_txtDeco{
    position: absolute;
    right: 0;
    top: calc(100% - 40px);
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.subPage_234_top_deco .blur_txtDeco.fade_in{
    opacity: 1;
    transform: translateY(0);
}

.subPage_234_top_deco .spt_td_img{
    position: absolute;
    right: 0;
    top: calc(100% - 40px);
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.subPage_234_top_deco .spt_td_img.fade_in{
    opacity: 1;
    transform: translateY(0);
}

.subPage_234_top_deco .spt_td_img figure{
    position: relative;
    max-width: min(250px, 13.0208vw);
    aspect-ratio: 1 / 1;
}

.subPage_234_top_deco .spt_td_img figure::before,
.subPage_234_top_deco .spt_td_img figure::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: #fff;
    pointer-events: none;
}

.subPage_234_top_deco .spt_td_img figure::before{
    top: -4px;
    left: -4px;
}

.subPage_234_top_deco .spt_td_img figure::after{
    top: -4px;
    right: -4px;
}

.subPage_234_top_deco .spt_td_img::before,
.subPage_234_top_deco .spt_td_img::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: #fff;
    pointer-events: none;
    z-index: 1;
}

.subPage_234_top_deco .spt_td_img::before{
    bottom: -4px;
    left: -4px;
}

.subPage_234_top_deco .spt_td_img::after{
    bottom: -4px;
    right: -4px;
}

.subPage_234_top_deco .spt_td_hrz_dash{
    position: absolute;
    top: calc(100% - 40px + min(250px, 13.0208vw));
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    z-index: -1;
    background: repeating-linear-gradient(
        to right,
        rgba(43, 43, 43, 1) 0px,
        rgba(43, 43, 43, 1) 6px,
        transparent 6px,
        transparent 12px
    );
}

.subPageType01_visual{
    position: relative;
    z-index: 10;
    padding-bottom: 85px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.subPageType01_bg{
    position: relative;
    z-index: 2;
    padding-bottom: min(60px, 3.125vw);
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.subPageType01_bg.fade_in{
    opacity: 1;
}

.subPageType01_bg.type2{
    width: 21.875vw;
    max-width: 420px;
    margin: 0 auto;
}

.subPageType01_bg.type3{
    width: min(660px, 34.375vw);
    margin: 0 auto;
}

.subPageType01_bg.type2 figure{
    position: relative;
    overflow: hidden;
}

.subPageType01_bg.type2 figure::after{
    display: block;
    content: "";
    position: absolute;
    left: 108px;
    top: 187px;
    width: 575px;
    aspect-ratio: 1 / 1;
    background: linear-gradient(40.28deg, rgba(94, 80, 255, 0.3) 24.21%, rgba(100, 31, 226, 0.3) 81.12%);
    filter: blur(200px);
}

.sub_mainTit{
    position: relative;
    text-align: center;
    color: #fff;
    margin-top: min(-140px, -7.292vw);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: min(28px, 1.458vw) 0;
    z-index: 100;
}

.sub_mainTit h2{
    font-family: 'Arial', sans-serif;
    font-size: min(88px, 4.583vw);
    font-weight: 700;
    line-height: 1.125;
}

.sub_mainTit.type02{
    gap: 0;
    margin-top: max(-120px, -6.25vw);
}

.sub_mainTit.type02 h2{
    font-size: min(100px, 5.2083vw);
    margin-bottom: min(28px, 1.4583vw);
}

.sub_mainTit.type02 strong{
    margin-bottom: min(20px, 1.0417vw);
}

.sub_mainTit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.sub_mainTit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

.sub_mainTit strong{
    font-size: 22px;
    line-height: 1.5;
    font-weight: 700;
}

.sub_mainTit p{
    font-size: min(18px, 0.938vw);
    font-weight: 700;
    line-height: 1.5;
}

/* about_us */

#about_us{
    padding: 120px 0 100px 0;
}

.aboutUs_list{
    position: relative;
    z-index: 2;
    width: 100%;
    margin-top: 60px;
    border-top: 1px solid var(--color-gray-02);
    border-bottom: 1px solid var(--color-gray-02);
}

.aboutUs_list ul{
    display: flex;
    flex-wrap: wrap;
}

.aboutUs_list ul li{
    width: 50%;
}

.aboutUs_list ul li .img{
    width: 100%;
    height: 100%;
}

.aboutUs_list ul li .img figure{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.aboutUs_list ul li .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-origin: center;
    transition: all 1s;
}

.aboutUs_list ul li:hover .img figure img,
.aboutUs_list ul li:nth-child(1):has(+ li:hover) .img figure img,
.aboutUs_list ul li:nth-child(3):hover + li .img figure img{
    transform: scale(1.1);
}

.aboutUs_list li .txt{
    position: relative;
    width: 100%;
    height: 100%;
    align-self: stretch;
    padding: 24px 36px 30px 36px;
    display: flex;
    flex-direction: column;
    gap: 120px 0;
}

.aboutUs_list li .txt.left{
    padding: 24px 36px 30px calc((100vw - 1520px) / 2 + 36px);
}

.aboutUs_list li .txt .deco_txt{
    position: absolute;
    right: calc((100vw - 1520px) / 2);
    top: 20px;
    width: 190px;
    margin-right: 20px;
}

.aboutUs_list li .txt .num{
    font-size: 16px;
    font-weight: 700;
    color: var(--color-black-02);
}

.aboutUs_list li .txt .txt_bot{
    display: flex;
    flex-direction: column;
}


.aboutUs_list li .txt .txt_bot .cate{
    font-family: var(--font-RedditSans);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-gray-01);
    display: inline-block;
    margin-bottom: 8px;
}

.aboutUs_list li .txt .txt_bot h3{
    font-size: 30px;
    line-height: 1.3;
    font-weight: 700;
}

/* history */

#history{
    padding: 100px 0;
}

#history .history_inner{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 210px 0;
}

#history .top{
    display: flex;
    justify-content: space-between;
    padding-top: 56px;
}

#history .top .tit h2{
    font-size: min(90px, 4.688vw);
    font-weight: 400;
    color: #fff;
    font-family: 'Arial', sans-serif;
    line-height: 1.2;
}

#history .top .deco{
    position: relative;
    padding-right: min(170px, 8.854vw);
}

#history .top .deco .deco_txt{
    opacity: 0.5;
}

#history .top .deco .blur_txtDeco{
    position: absolute;
    right: 0;
    top: min(50px, 2.604vw);
}

#history .bot{
    position: relative;
}

#history .bot .slide_activeNotice{
    position: absolute;
    left: -4px;
    top: -25px;
    width: 0;
    height: 0;
    border-left: 4.25px solid transparent;
    border-right: 4.25px solid transparent;
    border-top: 9px solid var(--main-brand-color);
} 

#history .history_slide{
    width: 100%;
    overflow: visible;
}

#history .history_slide .swiper-wrapper{
    position: relative;
    width: max-content;
    transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
}

#history .history_slide .swiper-wrapper .swiper-deco{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 28px;
    background: url(../img/sub/history_slide_deco.png) repeat-x left top;
    background-size: auto 100%;
    z-index: 2;
}

#history .history_slide .swiper-slide{
    position: relative;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    padding: 60px 50px; 
    width: 625px;
    height: auto;
}


#history .history_slide .swiper-slide::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: calc(100% - 60px);
    background: rgba(45, 45, 45, 1);
    transition: all .5s ease;
}

#history .history_slide .swiper-slide.swiper-slide-active::before{
    background: var(--main-brand-color);
}

#history .history_slide .swiper-slide .inner{
    display: flex;
    flex-direction: column;
    gap: 52px 0;
    opacity: 0.2;
    transition: opacity 0.5s;
}

#history .history_slide .swiper-slide-active .inner{
    opacity: 1;
}

#history .history_slide .swiper-slide .year{
    font-size: 52px;
    font-family: var(--font-RedditSans);
    font-weight: 600;
    color: #fff;
}

#history .history_slide .swiper-slide ul{
    display: flex;
    flex-direction: column;
    gap: 18px 0;
}

#history .history_slide .swiper-slide ul li{
    position: relative;
    display: flex;
    gap: 0 12px;
    font-family: var(--font-Pretendard);
    font-size: 16px;
    font-weight: 500;
    padding-left: 35px;
}

#history .history_slide .swiper-slide ul li .month{
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
}

#history .history_slide .swiper-slide ul li p{
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.3;
}

/* location */

#location{
    position: relative;
    display: flex;
    overflow: hidden;
}

.loc_grid{
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 360px;
    display: grid;
    grid-template-columns: repeat(12, 180px);
    grid-template-rows: repeat(2, 180px);
    pointer-events: none;
    z-index: 1;
}

.loc_grid span{
    position: relative;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.loc_grid span:nth-child(n+13){
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* 세로선 - 섹션 전체 높이 */
.loc_grid span:nth-child(-n+12)::before{
    content: "";
    position: absolute;
    left: 0;
    top: -100vh;
    bottom: -100vh;
    width: 1px;
    background: rgba(255, 255, 255, 0.1);
}

/* 교차점 dot */
.loc_grid span::after{
    content: "";
    position: absolute;
    left: -2px;
    bottom: -3px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
}

.loc_grid span:nth-child(-n+12)::after{
    background: transparent;
    box-shadow: 0 -180px 0 0 rgba(255, 255, 255, 0.1);
}

#location .left{
    width: 42%;
    aspect-ratio: 820 / 1080;
}

#location .left,
#location .right{
    position: relative;
    z-index: 10;
}

#location .left .loc_img_tab{
    position: relative;
    width: 100%;
    height: 100%;
}

#location .left .loc_img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    transition: all .7s;
}

#location .left .loc_img.active{
    opacity: 1;
    visibility: visible;
    z-index: 2;
}

#location .left .loc_img figure{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#location .left .loc_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#location .right{
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: min(120px, 6.25vw);
    justify-content: space-between;
}

#location .right .deco_txt{
    position: absolute;
    right: min(200px, 10.417vw);
    top: min(32px, 1.667vw);
    width: 190px;
}

#location .right .top{
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
}

#location .right .top .tit h2{
    position: relative;
    z-index: 2;
    color: #fff;
    font-size: min(48px, 2.5vw);
    font-weight: 600;
}

#location .right .top .tit h2 span{
    display: inline-block;
    line-height: 1.375;
}

#location .right .top .tit h2 span:first-child{
    position: relative;
    padding-left: min(30px, 1.563vw);
}

#location .right .top .tit h2 span:first-child::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: min(7px, 0.365vw);
    height: min(7px, 0.365vw);
    background: #fff;
}

#location .right .bot{
    width: 100%;
}

#location .loc_tabBtn ul{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: min(8px, 0.417vw) 0;
}

#location .loc_tabBtn ul li{
    width: 100%;
}

#location .loc_tabBtn ul li a{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: min(8px, 0.417vw);
    padding: min(12px, 0.625vw) min(30px, 1.563vw);
    transition: background-color 0.5s ease;
}

/* 첫번째 li는 헤더/라벨 — 클릭 비활성화 + 기본 커서 */
#location .loc_tabBtn ul li:first-child a{
    cursor: default;
    pointer-events: none;
}

#location .loc_tabBtn ul li.active a{
    background-color: rgba(255, 255, 255, 0.03);
}

#location .loc_tabBtn ul li a::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: min(7px, 0.365vw);
    height: 100%;
    background: var(--main-brand-color);
    opacity: 0;
    visibility: hidden;
    transition: all .5s ease;
}

#location .loc_tabBtn ul li.active a::before{
    opacity: 1;
    visibility: visible;
}

#location .loc_tabBtn ul li a .cate{
    font-size: min(20px, 1.042vw);
    color: rgba(255, 255, 255, 0.6);
    font-weight: 400;
    line-height: 1.5;
    transition: color .5s ease;
}

#location .loc_tabBtn ul li.active a .cate{
    color: rgba(255, 255, 255, 0.9);
}

#location .loc_tabBtn ul li a p{
    font-size: min(20px, 1.042vw);
    color: rgba(255, 255, 255, 0.85);
    font-weight: 400;
    line-height: 1.5;
    transition: color .5s ease;
}

#location .loc_tabBtn ul li.active a p{
    color: #fff;
}

/* team_info */

#team_info{
    padding: min(110px, 5.7292vw) 0;
    background: rgba(219, 219, 222, 1) url('../img/sub/team_info_bg.png') no-repeat;
    background-position: left max(-28px, -1.4583vw) bottom 0;
    background-size: 43.229vw auto;
}

#team_info .inner{
    width: 100%;
    background:
        repeating-linear-gradient(
            to right,
            rgba(255, 255, 255, 0.08) 0px,
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px,
            transparent 10px
        ),
        repeating-linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.08) 0px,
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px,
            transparent 10px
        ),
        rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(min(30px, 1.5625vw));
    -webkit-backdrop-filter: blur(min(30px, 1.5625vw));
}

#team_info .team_info_list{
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    width: 100%;
}

#team_info .team_info_list::before{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 1px;
    height: 100%;
    background: rgba(158, 158, 158, 0.4);
}

#team_info .team_info_list::after{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: 1px;
    background: rgba(158, 158, 158, 0.4);
}

#team_info .team_info_list li{
    width: 100%;
    display: flex;
}

#team_info .team_info_list li .desc{
    position: relative;
    width: 100%;
    display: flex;
    gap: 0 12px;
    padding: 20px;
}

#team_info .team_info_list .left,
#team_info .team_info_list .right{
    display: flex;
    flex-wrap: wrap;
}

#team_info .team_info_list li .desc .ed{
    align-content: flex-end;
}

#team_info .team_info_list li .desc .txt_area{
    position: relative;
    display: flex;
    flex-direction: column;
    padding: min(28px, 1.4583vw) min(24px, 1.25vw) min(16px, 0.8333vw) min(24px, 1.25vw);
    background: rgba(255, 255, 255, 0.28);
    backdrop-filter: blur(min(10px, 0.5208vw));
    -webkit-backdrop-filter: blur(min(10px, 0.5208vw));
    gap: min(46px, 2.3958vw) 0;
    max-width: min(376px, 19.5833vw);
    height: max-content;
}

#team_info .team_info_list li .desc .txt_area::before,
#team_info .team_info_list li .desc .txt_area::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(147, 147, 147, 1);
    pointer-events: none;
}

#team_info .team_info_list li .desc .txt_area::before{
    top: -4px;
    left: -4px;
}

#team_info .team_info_list li .desc .txt_area::after{
    top: -4px;
    right: -4px;
}

#team_info .team_info_list li .desc .txt_area .top::before,
#team_info .team_info_list li .desc .txt_area .top::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(147, 147, 147, 1);
    pointer-events: none;
}

#team_info .team_info_list li .desc .txt_area .top::before{
    bottom: -4px;
    left: -4px;
}

#team_info .team_info_list li .desc .txt_area .top::after{
    bottom: -4px;
    right: -4px;
}

#team_info .team_info_list li .desc .txt_area.type2{
    height: auto;
    min-width: 100%;
}

#team_info .team_info_list li .desc .txt_area .top{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#team_info .team_info_list li .desc .txt_area .top span{
    font-size: 20px;
    font-weight: 700;
}

#team_info .team_info_list li .desc .txt_area .top p{
    font-size: 16px;
    line-height: 1.5;
    font-weight: 400;
    word-break: break-word;
    letter-spacing: -0.02em;
}

#team_info .team_info_list li .desc .txt_area .bot{
    display: flex;
    justify-content: flex-end;
    align-content: flex-end;
    line-height: 1;
}

#team_info .team_info_list li .desc .txt_area .bot strong{
    display: block;
    font-family: var(--font-RedditSans);
    font-size: min(70px, 3.6458vw);
    font-weight: 700;
    line-height: 1;
}

#team_info .team_info_list li .desc .txt_area .bot strong span{
    font-size: min(32px, 1.6667vw);
    font-weight: 700;
    line-height: 1;
}

#team_info .team_info_list li .desc .right{
    margin-left: auto;
}

#team_info .team_info_list li .desc .right figure{
    overflow: hidden;
}

#team_info .team_info_list li .desc .right figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#team_info .team_info_list li .desc .right figure.type1{
    width: 100%;
    max-width: min(228px, 11.875vw);
    aspect-ratio: 228 / 240;
    margin-top: min(150px, 7.8125vw);
}

#team_info .team_info_list li .desc .right figure.type2{
    width: 100%;
    max-height: min(240px, 12.5vw);
    aspect-ratio: 332 / 240;
}

#team_info .team_info_list li .desc.type2{
    flex: 1;
}

#team_info .team_info_list li .desc.type2 .left,
#team_info .team_info_list li .desc.type2 .right{
    align-content: flex-end;
    width: 50%;
}

#team_info .team_info_list li .tit{
    width: 100%;
    display: flex;
    padding: min(44px, 2.2917vw) min(54px, 2.8125vw);
}

#team_info .team_info_list li .tit .tit_area{
    height: max-content;
    margin-top: auto;
}

#team_info .team_info_list li .tit .tit_area h2{
    font-weight: 700;
    font-size: 52px;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin-bottom: 34px;
}

#team_info .team_info_list li .tit .tit_area a{
    display: flex;
    align-items: center;
    padding: min(16px, 0.8333vw) min(20px, 1.0417vw);
    background: var(--main-brand-color);
    gap: 0 min(32px, 1.6667vw);
    color: #fff;
    font-weight: 600;
    font-size: min(15px, 0.7813vw);
    width: max-content;
}

#team_info .team_info_list li .tit .tit_area a i img{
    width: min(16px, 0.8333vw);
    filter: invert(1);
}

#team_info .team_info_list li .desc .txt_area.type3{
    min-width: min(376px, 19.5833vw);
    width: max-content;
    margin-top: auto;
}

/* team_leader */

#team_leader{
    padding: 15.104vw 0;
}

#team_leader::after{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background: var(--color-gray-02);
}

#team_leader .inner{
    position: relative;
    width: 100%;
    display: flex;
}

#team_leader .inner .left,
#team_leader .inner .right{
    position: relative;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#team_leader .inner .left{
    padding: 0 min(100px, 6.5104vw);
    align-items: flex-start;
}

#team_leader .tit{
    display: flex;
    flex-direction: column;
}

#team_leader .tit .logo{
    width: min(75px, 3.9063vw);
    margin-bottom: min(50px, 2.6042vw);
}

#team_leader .tit .txt h2{
    font-size: min(50px, 2.6042vw);
    line-height: 1.3;
    color: var(--color-black-01);
    font-weight: 700;
}

#team_leader .inner .right::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 1px;
    background: var(--color-gray-02);
}

#team_leader .ceo_area{
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#team_leader .ceo_area .img{
    position: relative;
    margin-bottom: min(40px, 2.0833vw);
    width: max-content;
}

#team_leader .ceo_area .img::before,
#team_leader .ceo_area .img::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(147, 147, 147, 1);
    pointer-events: none;
    z-index: 1;
}

#team_leader .ceo_area .img::before{
    top: -4px;
    left: -4px;
}

#team_leader .ceo_area .img::after{
    top: -4px;
    right: -4px;
}

#team_leader .ceo_area .img figure::before,
#team_leader .ceo_area .img figure::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(147, 147, 147, 1);
    pointer-events: none;
    z-index: 1;
}

#team_leader .ceo_area .img figure::before{
    bottom: -4px;
    left: -4px;
}

#team_leader .ceo_area .img figure::after{
    bottom: -4px;
    right: -4px;
}

#team_leader .ceo_area .img figure{
    width: 100%;
    max-width: min(402px, 20.9375vw);
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

#team_leader .ceo_area .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#team_leader .ceo_area .desc{
    display: flex;
    flex-direction: column;
}

#team_leader .ceo_area .desc .txt{
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: min(30px, 1.5625vw);
}

#team_leader .ceo_area .desc .txt h3{
    font-size: min(20px, 1.0417vw);
    font-weight: 700;
    margin-bottom: min(18px, 0.9375vw);
}

#team_leader .ceo_area .desc .txt ul{
    display: flex;
    flex-direction: column;
}

#team_leader .ceo_area .desc .txt ul li{
    text-align: center;
    color: rgba(0, 0, 0, 0.7);
    font-weight: 500;
    line-height: 1.5;
}

#team_leader .ceo_area .desc .info_link{
    display: flex;
    justify-content: center;
}

#team_leader .ceo_area .desc .info_link ul{
    display: flex;
    justify-content: center;
    gap: 4px;
    width: max-content;
}

#team_leader .ceo_area .desc .info_link a{
    display: flex;
    align-items: center;
    gap: 0 12px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    background: #000;
    border: 1px solid transparent;
    padding: 5.5px 7px;
    line-height: 1;
    letter-spacing: -0.02em;
    transition: color 0.3s, background 0.3s, border-color 0.3s;
}

#team_leader .ceo_area .desc .info_link a:hover{
    color: #000;
    background: #fff;
    border-color: #000;
}

#team_leader .ceo_area .desc .info_link a i{
    transition: filter 0.3s;
}

#team_leader .ceo_area .desc .info_link a:hover i{
    filter: invert(1);
}

#team_leader .ceo_area .desc .info_link a i{
    width: 14px;
}

/* team_dep */

#team_dep{
    background: rgba(26, 26, 26, 1);
    padding: min(100px, 5.2083vw) min(60px, 3.125vw) min(150px, 7.8125vw) min(60px, 3.125vw);
}

#team_dep .inner{
    display: flex;
    flex-direction: column;
    width: 100%;
}

#team_dep .tit{
    margin-bottom: min(20px, 1.0417vw);
}

#team_dep .tit h2{
    font-size: min(15px, 0.7813vw);
    color: rgba(255, 255, 255, 0.4);
    font-weight: 400;
    line-height: 1.5;
}

.dep_list{
    width: 100%;
}

.dep_list > ul{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.dep_list > ul > li{
    overflow: hidden;
    background-image: repeating-linear-gradient(to right, rgba(59, 59, 59, 1) 0, rgba(59, 59, 59, 1) 3px, transparent 3px, transparent 6px);
    background-size: 100% 1px;
    background-repeat: no-repeat;
    background-position: top;
}

.dep_list > ul > li:last-child{
    background-image: repeating-linear-gradient(to right, rgba(59, 59, 59, 1) 0, rgba(59, 59, 59, 1) 3px, transparent 3px, transparent 6px), repeating-linear-gradient(to right, rgba(59, 59, 59, 1) 0, rgba(59, 59, 59, 1) 3px, transparent 3px, transparent 6px);
    background-size: 100% 1px, 100% 1px;
    background-repeat: no-repeat, no-repeat;
    background-position: top, bottom;
}

.dep_list .dep_list_inner{
    position: relative;
    display: flex;
    width: 100%;
    overflow: hidden;
    transition: height 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.dep_list .dep_list_inner .left{
    flex: 1;
    padding-left: min(220px, 11.4583vw);
    display: flex;
    flex-direction: column;
    gap: min(15px, 0.7813vw) 0;
}

.dep_list > ul > li.active .dep_list_inner .left{
    position: relative;
}

.dep_list .dep_list_inner .desc_area{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: min(20px, 1.0417vw);
}

.dep_list .dep_list_inner .desc{
    font-size: min(16px, 0.8333vw);
    font-weight: 500;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.8);
    opacity: 0;
    transform: translateY(min(10px, 0.5208vw));
    transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.15s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.15s;
}

.dep_list .dep_list_inner .desc_area .desc_deco{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.dep_list .dep_list_inner .desc_area .desc_deco span{
    font-size: 12px;
    color: rgba(94, 94, 94, 1);
    font-weight: 500;
}

.dep_list > ul > li.active .dep_list_inner .desc{
    opacity: 1;
    transform: translateY(0);
}

.dep_list .right{
    margin-left: min(20px, 1.0417vw);
    opacity: 0.3;
    transform: translateY(min(15px, 0.7813vw));
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.1s, transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}

.dep_list > ul > li.active .right{
    opacity: 1;
    transform: translateY(0);
}

.dep_list .dep_list_inner .accor_btn{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 3;
}

.dep_list .dep_list_inner .accor_btn a{
    display: block;
    width: 100%;
    height: 100%;
}

.dep_list .dep_list_inner .num{
    position: absolute;
    left: 0;
    top: min(37px, 1.9271vw);
    font-weight: 700;
    line-height: 1.5;
    font-size: min(16px, 0.8333vw);
    color: #fff;
    opacity: 0.3;
    transition: all .7s;
}

.dep_list > ul > li.active .dep_list_inner .num{
    opacity: 1;
}

.dep_list .dep_list_inner .cate{
    padding: min(37px, 1.9271vw) 0;
    height: max-content;
}

.dep_list .dep_list_inner .cate strong {
    position: relative;
    display: inline-flex;
    padding-right: min(26px, 1.3542vw);
    font-size: min(36px, 1.875vw);
    line-height: 1;
    font-family: 'Arial', sans-serif;
    text-transform: none !important;
    color: #fff;
    opacity: 0.3;
    transition: all .7s;
}

.dep_list > ul > li.active .dep_list_inner .cate strong{
    opacity: 1;
}

.dep_list .dep_list_inner .cate strong::after{
    display: block;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: min(6px, 0.3125vw);
    height: min(6px, 0.3125vw);
    background: #fff;
    opacity: 0.3;
    transition: all .7s;
}

.dep_list > ul > li.active .dep_list_inner .cate strong::after{
    opacity: 1;
}

.dep_list .right .img{
    padding: min(20px, 1.0417vw) 0;
}

.dep_list .right .img figure{
    max-width: min(386px, 20.1042vw);
    width: 100%;
    aspect-ratio: 386 / 436;
    flex-shrink: 0;
    overflow: hidden;
}

.dep_list .right .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* generation_visual */



/* gene_overview */

.solution_overview{
    position: relative;
    background-color: #fff;
    background-image:
        linear-gradient(to right, rgba(0, 0, 0, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(0, 0, 0, 0.03) 1px, transparent 1px);
    background-size: 10px 10px;
}

.solution_overview .grid_deco .grid_line{
    background: rgba(0, 0, 0, 0.1);
}

.solution_overview .grid_deco .grid_line.hrz_dash{
    background: repeating-linear-gradient(
        to right,
        rgba(0, 0, 0, 0.1) 0px,
        rgba(0, 0, 0, 0.1) 6px,
        transparent 6px,
        transparent 12px
    );
}

.solution_overview .main_img{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.solution_overview .main_img.fade_in{
    opacity: 1;
    transform: translateY(0);
}

.solution_overview .sl_ov_deco{
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.solution_overview .sl_ov_deco.fade_in{
    opacity: 1;
    transform: translateY(0);
}

/* gene_visual */

.gene_visual_pin{
    position: relative;
}

#gene_visual{
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

#gene_visual::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:
        repeating-linear-gradient(
            30deg,
            rgba(255,255,255,0.03) 0,
            rgba(255,255,255,0.03) 1px,
            transparent 1px,
            transparent 30px
        ),
        repeating-linear-gradient(
            -30deg,
            rgba(255,255,255,0.03) 0,
            rgba(255,255,255,0.03) 1px,
            transparent 1px,
            transparent 30px
        );
    z-index: 1;
    pointer-events: none;
}

#gene_visual .container{
    position: relative;
    width: 100%;
    height: 100%;
}

#gene_visual .tit{
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    z-index: 10;
    word-break: break-word;
}

#gene_visual .tit h2{
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    line-height: 1.5;
}

.gene_diagonal{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.gene_diagonal_track{
    position: relative;
    width: 100%;
    height: 100%;
}

.gene_skewer_svg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    overflow: visible;
    opacity: 0;
    transform: translateY(-60px);
    transition: opacity 0.35s ease-out, transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}

.gene_skewer_svg.is_active{
    opacity: 1;
    transform: translateY(0);
}

.gene_skewer_svg line{
    stroke: #8E57F4;
    stroke-width: 1;
    stroke-dasharray: 4 6;
    stroke-linecap: round;
    opacity: 0.7;
}

.gene_diagonal_item{
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s ease;
    will-change: transform, opacity;
}

.gene_diagonal_item figure{
    width: 480px;
}

.gene_diagonal_item figure img,
.gene_diagonal_item figure svg{
    width: 100%;
    height: auto;
    display: block;
}


.gene_diagonal_info{
    position: absolute;
    bottom: 100px;
    left: 0;
    z-index: 10;
    color: #fff;
    display: flex;
    flex-direction: column;
}

.gene_diagonal_info .num{
    font-size: 16px;
    color: rgba(151, 151, 151, 1);
    margin-bottom: 40px;
    font-weight: 700;
}

.gene_diagonal_info h3{
    font-size: 60px;
    font-weight: 400;
    margin-top: 12px;
    font-family: 'Arial', sans-serif;
}

.gene_diagonal_info p{
    font-size: 18px;
    margin-top: 16px;
    line-height: 1.6;
}

@keyframes geneDiagFadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.gene_diagonal_info > .num,
.gene_diagonal_info > h3,
.gene_diagonal_info > p {
    opacity: 0;
}

.gene_diagonal_info.fade_up > .num,
.gene_diagonal_info.fade_up > h3,
.gene_diagonal_info.fade_up > p {
    animation: geneDiagFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.gene_diagonal_info.fade_up > h3 { animation-delay: 0.08s; }
.gene_diagonal_info.fade_up > p  { animation-delay: 0.16s; }

/* solution_info_list (공통) */

.solution_info_list_box{
    padding: 185px 0 240px 0;
}

.solution_info_list_box.type2{
    padding: 120px 0;
}


.solution_info_list_box .main_tit{
    margin-bottom: 38px;
    text-align: center;
    word-break: break-word;
}

.solution_info_list_box .main_tit h2{
    font-size: clamp(28px, 2.5vw, 48px);
    line-height: 1.5;
    font-weight: 600;
    color: #fff;
}

.solution_info_list_box .cate{
    display: block;
    text-align: right;
    font-size: 12px;
    font-weight: 500;
    color: rgba(76, 76, 76, 1);
    padding-right: 20px;
}

.solution_info_list{
    position: relative;
    padding-top: 40px;
}

.solution_info_list .deco_txt{
    position: absolute;
    left: 30px;
    top: calc(100% + 35px);
    opacity: 0.3;
    width: 190px;
}

.solution_info_list .grid_barcode{
    position: absolute;
    right: 30px;
    top: calc(100% + 35px);
    width: 200px;
    opacity: 0.3;
}

.solution_info_list ul{
    width: 100%;
    display: flex;
    gap: 40px;
}

.solution_info_list ul li{
    position: relative;
    width: calc(100% / 3);
    padding: 10px;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

.solution_info_list ul li::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 3000px;
    background: rgba(255, 255, 255, 0.05);
}

.solution_info_list ul li::after{
    display: block;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 3000px;
    background: rgba(255, 255, 255, 0.05);
}

.solution_info_list ul li > .cross_deco{
    position: absolute;
    z-index: 1;
}
.solution_info_list ul li > .cross_deco.lt{ top: -16px; left: -16px; }
.solution_info_list ul li > .cross_deco.rt{ top: -16px; right: -16px; }
.solution_info_list ul li > .cross_deco.lb{ bottom: -16px; left: -16px; }
.solution_info_list ul li > .cross_deco.rb{ bottom: -16px; right: -16px; }

.solution_info_list .sil_inner::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
    height: 3000px;
    background: rgba(255, 255, 255, 0.05);
    z-index: -1;
}

.solution_info_list .sil_inner{
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    border: 1px solid rgba(255, 255, 255, 0.072);
    background: rgba(7, 7, 7, 0.72);
    padding: 15px 15px 30px 15px;
}

.solution_info_list .sil_inner .img{
    width: 100%;
    margin-bottom: 25px;
}

.solution_info_list .sil_inner .img figure{
    width: 100%;
    aspect-ratio: 414 / 393;
    overflow: hidden;
}

.solution_info_list .sil_inner .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.solution_info_list .sil_inner .desc{
    display: flex;
    flex-direction: column;
    word-break: break-word;
    padding: 0 5px;
}

.solution_info_list .sil_inner .desc strong{
    font-size: 22px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    margin-bottom: 20px;
}

.solution_info_list .sil_inner .desc p{
    font-size: 16px;
    line-height: 1.4;
    color: rgba(222, 222, 222, 0.7);
    font-weight: 500;
}

.solution_info_list .sil_inner{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.solution_info_list .sil_inner.fade_in{
    opacity: 1;
    transform: translateY(0);
}

/* events */

#events_visual .grid_deco .grid_deco_inner{
    max-width: 1360px;
}

#events_visual .grid_deco .grid_line.vrt_dash{
    height: calc(100% - 85px);
    z-index: -1;
}

#events_visual .grid_deco .cross_deco.rb{
    position: absolute;
    right: -16px;
    bottom: calc(85px - 16px);
    z-index: 2;
    background: url('../img/common/grid_cross01.svg');
}

#events_visual .ev_cont .container{
    position: relative;
    max-width: 1360px;
    display: flex;
    flex-direction: column;
}

#events_visual{
    position: relative;
}

#events_visual .subPage_234_top_deco_absol{
    position: absolute;
    right: calc(100% + 30px);
    top: calc(100% + 30px);
    width: max-content;
    z-index: 11;
}

#events_visual .ev_top{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    aspect-ratio: 1360 / 100;
    padding: min(20px, 1.042vw);
}

#events_visual .ev_top::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(31, 31, 31, 1);
}

#events_visual .ev_top .cross_deco{
    position: absolute;
    bottom: -16px;
    background: url('../img/common/grid_cross02.svg');
    z-index: 2;
}

#events_visual .ev_top .cross_deco.lb{
    left: -16px;
}

#events_visual .ev_top span{
    font-size: 12px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.16);
}

#events_visual .ev_main_inner{
    position: relative;
}

#events_visual .ev_main{
    width: 100%;
    padding: min(85px, 4.427vw);
    overflow: hidden;
}


#events_visual .ev_tit .grid_barcode{
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2;
    opacity: 0.35;
}

#events_visual .ev_main .ev_tit{
    position: relative;
    margin-bottom: min(35px, 1.8229vw);
}

#events_visual .ev_main .ev_tit h2{
    font-size: min(100px, 5.2083vw);
    font-weight: 700;
    color: #fff;
    line-height: 1;
    font-family: Arial, sans-serif;
}

#events_visual .ev_main .ev_tit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#events_visual .ev_main .ev_tit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

/* ev_slide_area */
#events_visual .ev_slide_area{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: min(16px, 0.8333vw);
    width: 100%;
    min-width: 0;
}

#events_visual .ev_slide_area .blur_txtDeco{
    position: absolute;
    left: max(-40px, -2.0833vw);
    bottom: max(-30px, -1.5625vw);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

#events_visual .ev_slide_area .blur_txtDeco .inner{
    padding: 10px;
}

#events_visual .ev_slide_area .blur_txtDeco figure{
    width: 130px;
    margin-bottom: 30px;
}

#events_visual .ev_slide_wrap{
    display: flex;
    gap: min(20px, 1.0417vw);
    width: 100%;
    min-width: 0;
}

#events_visual .ev_left{
    width: 64%;
    min-width: 0;
}


#events_visual .ev_main_slide{
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#events_visual .ev_main_slide .swiper-slide{
    height: auto;
}

#events_visual .ev_main_slide .swiper-slide img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

#events_visual .ev_slide_deco{
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    padding: min(20px, 1.0417vw);
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(min(4px, 0.2083vw));
}

#events_visual .ev_slide_deco p{
    font-size: min(10px, 0.5208vw);
    font-weight: 500;
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.6;
    max-width: min(200px, 10.4167vw);
}

#events_visual .ev_right{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#events_visual .ev_desc_txt{
    text-align: right;
}

#events_visual .ev_desc_txt p{
    font-size: min(11px, 0.5729vw);
    font-weight: 400;
    color: rgba(255, 255, 255, 0.3);
    line-height: 1.6;
    display: inline-block;
    text-align: left;
    max-width: min(260px, 13.5417vw);
}

#events_visual .ev_desc_txt p span{
    color: rgba(148, 130, 255, 0.6);
}

/* ev_info_card - 4모서리 점 장식 */
#events_visual .ev_info_card{
    position: relative;
    padding: 50px 30px;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: rgba(20, 20, 20, 0.78);
    backdrop-filter: blur(10.5px);
    -webkit-backdrop-filter: blur(10.5px);
}

#events_visual .ev_info_slide{
    width: 100%;
    height: 100%;
}

#events_visual .ev_info_slide .swiper-slide{
    height: auto;
}

#events_visual .ev_info_card::before,
#events_visual .ev_info_card::after{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(217, 217, 217, 1);
    pointer-events: none;
}
#events_visual .ev_info_card::before{ top: -4px; left: -4px; }
#events_visual .ev_info_card::after{ top: -4px; right: -4px; }

#events_visual .ev_info_card .dot_bot_l,
#events_visual .ev_info_card .dot_bot_r{
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(217, 217, 217, 1);
    pointer-events: none;
}
#events_visual .ev_info_card .dot_bot_l{ bottom: -4px; left: -4px; }
#events_visual .ev_info_card .dot_bot_r{ bottom: -4px; right: -4px; }

#events_visual .ev_info_inner{
    display: flex;
    flex-direction: column;
    height: 100%;
}

#events_visual .ev_tag{
    display: inline-block;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 500;
    color: rgba(201, 201, 201, 1);
    width: fit-content;
    margin-bottom: 16px;
    background: rgba(255, 255, 255, 0.06);
}

#events_visual .ev_info_tit{
    font-size: min(24px, 1.25vw);
    font-weight: 700;
    color: #fff;
    margin-bottom: min(16px, 0.8333vw);
    line-height: 1.3;
}

#events_visual .ev_info_date{
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.4);
    line-height: 1.5;
}

#events_visual .ev_info_link{
    display: inline-flex;
    align-items: center;
    gap: min(8px, 0.4167vw);
    margin-top: auto;
    padding-top: 50px;
    text-decoration: none;
    color: #fff;
    font-size: min(16px, 0.8333vw);
    transition: color 0.3s;
}

#events_visual .ev_info_link:hover{
    color: #fff;
}

#events_visual .ev_info_link span{
    font-size: min(16px, 0.8333vw);
    font-weight: 300;
    color: #fff;
}

#events_visual .ev_info_link em{
    font-size: min(14px, 0.7292vw);
    font-weight: 500;
    font-style: normal;
}

#events_visual .ev_info_link i{
    display: inline-flex;
    width: min(14px, 0.7292vw);
    height: min(14px, 0.7292vw);
    transform: rotate(45deg);
    transform-origin: center;
}

#events_visual .ev_info_link i img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ev_thumb_area */
#events_visual .ev_thumb_area{
    position: relative;
    z-index: 10;
}

#events_visual .ev_thumb_slide{
    overflow: hidden;
}

#events_visual .ev_thumb_slide .swiper-slide{
    width: calc(50% - min(8px, 0.4167vw));
    opacity: 0.5;

}

#events_visual .ev_thumb_slide .swiper-slide img{
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    display: block;
}

#events_visual .ev_pagination{
    display: flex;
    justify-content: flex-end;
    gap: 44px;
}

#events_visual .ev_pagination .swiper-pagination-bullet{
    position: relative;
    width: 4px;
    height: 4px;
    border-radius: 0;
    background: rgba(135, 135, 135, 1);
    opacity: 1;
    overflow: hidden;
    transition: width 0.3s;
}

#events_visual .ev_pagination .swiper-pagination-bullet-active{
    width: 50px;
}

#events_visual .ev_pagination .swiper-pagination-bullet::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: rgba(142, 87, 244, 1);
    transition: none;
}

#events_visual .ev_pagination .swiper-pagination-bullet-active::after{
    width: 100%;
    transition: width 4s;
}

#events_visual .txtList_deco{
    position: absolute;
    left: calc(100% + 20px);
    bottom: 20px;
}

/* events_board */

#events_board .inner{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#events_board .filter_area{
    width: 100%;
    margin-bottom: 50px;
}

#events_board .filter_area ul{
    display: flex;
    gap: 20px;
}

#events_board .filter_area ul li button{
    display: flex;
}

#events_board .filter_area ul li button span{
    display: block;
    color: rgba(142, 142, 142, 1);
    font-weight: 500;
    transition: color .5s;
}

#events_board .filter_area ul li.active button span{
    color: #fff;
}

#events_board .evb_board_list{
    width: 100%;
    border-top: 1px solid rgba(42, 42, 42, 1);
}

#events_board .evb_board_list ul{
    display: flex;
    flex-wrap: wrap;
}

#events_board .evb_board_list ul li{
    position: relative;
    width: calc(100% / 3);
    border-bottom: 1px solid rgba(42, 42, 42, 1);
}

#events_board .evb_board_list ul li::after{
    display: block;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 40px);
    background: rgba(42, 42, 42, 1);
}

#events_board .evb_board_list ul li:nth-child(3n)::after{
    display: none;
}

#events_board .evb_board_list ul li a{
    display: block;
    padding: 30px 20px;
}

#events_board .evb_board_list .box{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#events_board .evb_board_list .img{
    width: 100%;
    margin-bottom: 20px;
}

#events_board .evb_board_list .img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#events_board .evb_board_list .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s;
}

#events_board .evb_board_list ul li a:hover .img figure img,
#events_board .evb_board_list ul li a:focus .img figure img{
    transform: scale(1.15);
}

#events_board .evb_board_list .txt{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#events_board .evb_board_list .txt .cate{
    display: inline-flex;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    font-size: 12px;
    font-weight: 500;
    color: rgba(201, 201, 201, 1);
    width: max-content;
    line-height: 1.2;
    margin-bottom: 16px;
}

#events_board .evb_board_list .txt .tit{
    font-size: 22px;
    color: #fff;
    font-weight: bold;
    margin-bottom: 9px;
}

#events_board .evb_board_list .txt .date{
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: rgba(134, 134, 134, 1);
}

/* education_board */

#education_board{
    padding: 250px 0 150px 0;
}

#education_board .edb_inner{
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
}

#education_board .tit_area{
    margin-bottom: 100px;
}

#education_board .tit_area h2{
    font-family: Arial, sans-serif;
    text-transform: uppercase;
    font-size: 100px;
    color: rgba(247, 247, 247, 1);
    font-weight: 700;
    letter-spacing: -4px;
}

#education_board .tit_area h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#education_board .tit_area h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#education_board .filter_area{
    width: 100%;
    margin-bottom: 50px;
}

#education_board .filter_area ul{
    display: flex;
    gap: 20px;
}

#education_board .filter_area ul li button{
    display: flex;
}

#education_board .filter_area ul li button span{
    display: block;
    color: rgba(142, 142, 142, 1);
    font-weight: 500;
    transition: color .5s;
}

#education_board .filter_area ul li.active button span{
    color: #fff;
}

#education_board .board_area{
    width: 100%;
}

#education_board .grid_deco .grid_line.vrt{
    position: absolute;
    top: 0;
    width: 1px;
    height: 100%;
    background: rgba(27, 27, 27, 1);
    pointer-events: none;
}

#education_board .grid_deco .grid_line.vrt:nth-child(1){
    left: calc((100% - 60px) / 4);
}

#education_board .grid_deco .grid_line.vrt:nth-child(2){
    left: calc((100% - 60px) / 4 + 20px);
}

#education_board .grid_deco .grid_line.vrt:nth-child(3){
    left: calc((100% - 60px) / 4 * 2 + 20px);
}

#education_board .grid_deco .grid_line.vrt:nth-child(4){
    left: calc((100% - 60px) / 4 * 2 + 40px);
}

#education_board .grid_deco .grid_line.vrt:nth-child(5){
    left: calc((100% - 60px) / 4 * 3 + 40px);
}

#education_board .grid_deco .grid_line.vrt:nth-child(6){
    left: calc((100% - 60px) / 4 * 3 + 60px);
}

#education_board .board_list{
    display: flex;
    flex-wrap: wrap;
    gap: 100px 20px;
}

#education_board .board_list > li{
    width: calc((100% - 60px) / 4);
}

#education_board .board_list > li a{
    display: block;
}

#education_board .board_list > li .box{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#education_board .board_list > li .img{
    width: 100%;
    margin-bottom: 32px;
}

#education_board .board_list > li .img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#education_board .board_list > li .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s;
}

#education_board .board_list > li a:focus .img img,
#education_board .board_list > li a:hover .img img{
    transform: scale(1.15);
}

#education_board .board_list > li .tags{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 16px;
}

#education_board .board_list > li .tags span{
    display: inline-flex;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.27);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    color: #fff;
    font-weight: 500;
    font-size: 12px;
}

#education_board .board_list > li .tit h3{
    color: #fff;
    font-weight: 700;
    font-weight: bold;
    line-height: 1.5;
    font-size: 18px;
    word-break: break-word;
}

#education_board .view_more{
    position: relative;
    width: 100%;
    margin-top: 150px;
    display: flex;
    justify-content: center;
}

#education_board .view_more button{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 24px;
    color: #000;
    background: #fff;
    font-weight: 500;
    font-size: 15px;
    width: 100%;
    height: 50px;
    max-width: 192px;
    transition: all .5s;
} 

#education_board .view_more button:hover{
    background: var(--main-brand-color);
    color: #fff;
}

/* education_detail */

#education_detail{
    padding: 85px 0 0 0;
}

#education_detail .edd_inner{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0 80px;
    z-index: 2;
}

#education_detail .edd_tit{
    position: absolute;
    left: 0;
    top: min(68px, 3.542vw);
    text-align: center;
    width: 100%;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.02);
    font-size: min(260px, 15vw);
}

#education_detail .edd_inner .box{
    position: relative;
    width: calc(50% - 40px);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 170px 0 140px 0;
    border-left: 1px solid rgba(255, 255, 255, 0.05);
    border-right: 1px solid rgba(255, 255, 255, 0.05);
}

#education_detail .edd_inner .box::before{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background: rgba(255, 255, 255, 0.05);
}

#education_detail .edd_inner .area{
    position: relative;
    width: 100%;
    padding: 16px;
    flex-grow: 1;
    z-index: 2;
}

#education_detail .edd_inner .area > .cross_deco{
    position: absolute;
    z-index: 1;
}
#education_detail .edd_inner .area > .cross_deco.lt{ top: -16px; left: -16px; }
#education_detail .edd_inner .area > .cross_deco.rt{ top: -16px; right: -16px; }
#education_detail .edd_inner .area > .cross_deco.lb{ bottom: -16px; left: -16px; }
#education_detail .edd_inner .area > .cross_deco.rb{ bottom: -16px; right: -16px; }

#education_detail .edd_inner .cont{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: rgba(7, 7, 7, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.072);
}

#education_detail .edd_inner .left .cont{
    padding: 28px;
}

#education_detail .edd_inner .right .cont{
    padding: 32px 42px 42px 42px;
}

#education_detail .edd_img{
    width: 100%;
    margin-bottom: 26px;
}

#education_detail .edd_img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#education_detail .edd_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#education_detail .edd_desc{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

#education_detail .edd_desc_txt{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#education_detail .edd_desc_txt .cate{
    margin-bottom: 18px;
}

#education_detail .edd_desc_txt .cate span{
    display: inline-flex;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.27);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    font-size: 12px;
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}

#education_detail .edd_desc_txt .tit{
    font-size: 28px;
    line-height: 1.375;
    color: #fff;
    font-weight: 700;
    word-break: break-word;
    padding-right: min(180px, 9.375vw);
}

#education_detail .edd_date{
    font-size: 14px;
    font-weight: 500;
    color: rgba(134, 134, 134, 1);
    letter-spacing: -0.2px;
    line-height: 1.5;
}

#education_detail .edd_notice{
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}

#education_detail .edd_notice strong{
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
    font-weight: 600;
}


#education_detail .edd_form_area{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    gap: 25px;
}

#education_detail .edd_input_box{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#education_detail .edd_form{
    height: 100%;
}

#education_detail .edd_form_stack{
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    transition: all .5s;
}

#education_detail .edd_form_stack.active{
    border-color: #fff;
}

#education_detail .edd_form_stack label{
    padding-right: 16px;
}

#education_detail .edd_form_stack label span{
    font-size: 15px;
    line-height: 1.5;
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
}

#education_detail .edd_form_stack label span b,
#education_detail .edd_input_placeholder b{
    color: var(--main-brand-color);
    font-weight: inherit;
}

#education_detail .edd_input_area{
    position: relative;
    flex: 1;
}

#education_detail .edd_input_area .edd_input_placeholder{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: rgba(255, 255, 255, 0.3);
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    pointer-events: none;
    cursor: default;
}

#education_detail .edd_input_area .edd_txt_input{
    width: 100%;
    height: 54px;
    text-align: right;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
    font-family: var(--font-Pretendard);
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 0;
    outline: none;
}

#education_detail .edd_input_area .edd_txt_input:-webkit-autofill,
#education_detail .edd_input_area .edd_txt_input:-webkit-autofill:hover,
#education_detail .edd_input_area .edd_txt_input:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    -webkit-text-fill-color: #fff;
    transition: background-color 5000s ease-in-out 0s;
}

#education_detail .edd_download_notice{
    flex: 1;
    padding: 15px 20px 27px 20px;
    display: flex;
    flex-direction: column;
    background: rgba(27, 27, 27, 1);
}

#education_detail .edd_download_notice .download_num{
    font-size: 14px;
    line-height: 1.5;
    color: #fff;
    font-weight: 500;
    margin-bottom: 10px;
}

#education_detail .edd_download_notice .download_num span.num{
    color: var(--main-brand-color);
}

#education_detail .edd_download_notice .download_list{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

#education_detail .edd_download_notice .download_list li{
    font-size: 13px;
    color: #fff;
    font-weight: 500;
    line-height: 1.375;
}

#education_detail .edd_download_btn{
    width: 100%;
}

#education_detail .edd_download_btn button{
    display: flex;
    width: 100%;
    padding: 16px 24px;
    text-align: center;
    justify-content: center;
    background: #fff;
    color: #000;
    font-size: 15px;
    font-weight: 500;
    font-family: var(--font-Pretendard);
    transition: all .3s;
}

#education_detail .edd_download_btn button:hover{
    background: var(--main-brand-color);
    color: #fff;
}

/* publication */

#publication{
    padding: 85px 0 0 0;
}

#publication .pb_inner{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

#publication .pb_inner .box{
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    border-left: 1px solid rgba(27, 27, 27, 1);
    border-right: 1px solid rgba(27, 27, 27, 1);
    padding: 150px 0;
}

#publication .pb_inner .box.right{
    padding: 0 0 150px 0;
}

#publication .pb_tit{
    width: 100%;
    margin-bottom: clamp(50px, 5.208vw, 100px);
}

#publication .pb_tit h2{
    font-size: clamp(40px, 5.208vw, 100px);
    font-family: Arial, sans-serif;
    color: rgba(247, 247, 247, 1);
    letter-spacing: -0.02em;
    text-transform: uppercase;
    font-weight: 700;
}

#publication .pb_tit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#publication .pb_tit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#publication .filter_area{
    width: 100%;
    margin-bottom: clamp(20px, 2.604vw, 50px);
}

#publication .filter_area ul{
    display: flex;
    gap: 6px clamp(13px, 1.042vw, 20px);
}

#publication .filter_area ul li button{
    display: flex;
}

#publication .filter_area ul li button span{
    display: block;
    color: rgba(142, 142, 142, 1);
    font-weight: 500;
    transition: color .5s;
}

#publication .filter_area ul li.active button span{
    color: #fff;
}

#publication .pb_article_pagination{
    position: relative;
    width: 100%;
    height: 760px;
}

#publication .pbap_inner{
    width: 100%;
    height: 100%;
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

#publication .pbap_inner::-webkit-scrollbar{
    display: none;
}

#publication .custom_scrollbar{
    position: absolute;
    right: 0;
    top: 0;
    width: 3px;
    height: 100%;
}

#publication .custom_scrollbar .scroll_thumb{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 999px;
}

#publication .pbap_bullet_area{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#publication .pbap_bullet_area > li{
    width: 100%;
    opacity: 0.3;
    transition: all .5s;
}

#publication .pbap_bullet_area > li:hover,
#publication .pbap_bullet_area > li.active{
    opacity: 1;
    background: rgba(24, 24, 24, 1);
}

#publication .pbap_bullet_area > li:not(:last-child){
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

#publication .pbap_bullet_area > li a{
    display: flex;
    width: 100%;
    height: 100%;
}

#publication .pbap_bullet_inner{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 16px 24px 24px 24px;
    word-break: break-word;
}

#publication .pbap_bullet_inner .cate{
    display: inline-flex;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 400;
    margin-bottom: 16px;
}


#publication .pbap_bullet_inner .tit{
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    line-height: 1.4;
    margin-bottom: 6px;
}

#publication .pbap_bullet_inner .author{
    color: rgba(111, 74, 245, 1);
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
}

#publication .pb_slide_box{
    flex: 1;
}

#publication .pb_slide_wrapper{
    width: 100%;
    height: 760px;
    display: flex;
    flex-direction: column;
    gap: 60px;
    will-change: transform;
}

#publication .pb_slide{
    position: relative;
    width: 100%;
    flex-shrink: 0;
    transition: opacity .5s;
}

#publication .pb_slide.next{
    opacity: 0.2;
}

#publication .pb_slide::after{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #0C0C0C 40.49%, rgba(12, 12, 12, 0) 100%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .5s, visibility .5s;
}

#publication .pb_slide.prev::after{
    opacity: 1;
    visibility: visible;
}

#publication .pb_slide_inner{
    width: 100%;
    padding: 0 36px;
    display: flex;
    flex-direction: column;
}

#publication .pb_slide_inner .cate{
    display: inline-flex;
    padding: 8px 12px;
    text-align: center;
    background: rgba(0, 0, 0, 0.17);
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: #fff;
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    width: max-content;
}

#publication .pb_slide_inner .txt{
    word-break: break-word;
    display: flex;
    flex-direction: column;
}

#publication .pb_slide_inner .txt h3{
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
    margin-top: 14px;
}

#publication .pb_slide_inner .txt .author{
    display: block;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 500;
    color: rgba(111, 74, 245, 1);
    margin-top: 8px;
}

#publication .pb_slide_inner .txt .desc{
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 400;
    margin-top: 24px;
    white-space: pre-wrap;
}

#publication .pb_slide_inner .txt .source{
    font-size: 13px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.4);
    font-weight: 400;
    margin-top: 12px;
    align-self: flex-start;
}

#publication .pb_slide_inner .link{
    margin-top: 60px;
    display: flex;
    justify-content: flex-end;
}

#publication .pb_slide_inner .link a{
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 345px;
    padding: 14px 20px;
    background: rgba(255, 255, 255, 0.08);
    transition: all .5s;
}

#publication .pb_slide_inner .link a:hover{
    background: var(--main-brand-color);
}

#publication .pb_slide_inner .link a span{
    font-size: 15px;
    line-height: 1.25;
    font-weight: 400;
    color: #fff;
}

#publication .pb_slide_inner .link a i{
    width: 16px;
}

/* case_studies */

#case_studies_main{
    padding: 85px 0 0 0;
    overflow-x: clip;
    overflow-y: visible;
}

#case_studies_main .csd_top_deco{
    position: relative;
    width: 100%;
    height: 100px;
    display: flex;
    border-bottom: 1px solid rgba(43, 43, 43, 1);
}

#case_studies_main .csd_top_deco .container{
    position: relative;
    max-width: min(1150px, 59.8958vw);
}

#case_studies_main .csd_top_deco .subPage_234_top_deco{
    position: absolute;
    width: auto;
    left: calc(100% + 20px);
    bottom: 20px;
}

#case_studies_main .csd_top_deco .subPage_234_top_deco .txt{
    padding: 0;
}

#case_studies_main .csd_top_deco .subPage_234_top_deco .txt figure{
    height: auto;
}

#case_studies_main .csd_inner{
    position: relative;
    display: flex;
}

#case_studies_main .csd_inner .case_main_left_deco{
    position: absolute;
    top: min(20px, 1.0417vw);
    right: min(20px, 1.0417vw);
    width: max-content;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#case_studies_main .csd_inner .case_main_left_deco .img{
    width: min(190px, 9.8958vw);
}

#case_studies_main .csd_inner .case_main_left_deco .img img{
    width: 100%;
    height: auto;
}

#case_studies_main .csd_inner .case_main_left_deco .case_deco_ani{
    position: relative;
    display: flex;
    align-items: center;
    padding-left: min(15px, 0.781vw);
}

#case_studies_main .csd_inner .case_main_left_deco .case_deco_ani span{
    display: inline-flex;
    padding: min(5px, 0.260vw) min(9px, 0.469vw);
    border-radius: 999px;
    font-size: min(12px, 0.625vw);
    font-weight: 400;
    color: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(43, 43, 43, 1);
}

#case_studies_main .csd_inner .case_main_left_deco .case_deco_ani span::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: min(6px, 0.313vw);
    height: min(6px, 0.313vw);
    background: rgba(217, 217, 217, 1);
    animation: blink 1s ease-in-out infinite;
}

#case_studies_main .csd_inner .box{
    flex: 1 1 0;
    min-width: 0;
}

#case_studies_main .csd_inner .box.left{
    position: relative;
    overflow: hidden;
}

#case_studies_main .csd_inner .box.left .vrt_dash_line{
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        rgba(43, 43, 43, 1) 0px,
        rgba(43, 43, 43, 1) 6px,
        transparent 6px,
        transparent 12px
    );
    display: none;
}

#case_studies_main .grid_deco .grid_deco_inner{
    max-width: min(1150px, 59.8958vw);
}

#case_studies_main .csd_container{
    flex: 0 1 min(1150px, 59.8958vw);
    max-width: min(1150px, 59.8958vw);
}

#case_studies_main .csd_wrapper{
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: min(46px, 2.3958vw) min(90px, 4.6875vw) min(70px, 3.6458vw) min(90px, 4.6875vw);
}

#case_studies_main .csdm_tit{
    width: 100%;
    margin-bottom: min(34px, 1.7708vw);
}

#case_studies_main .csdm_tit h2{
    font-size: min(88px, 4.583vw);
    font-weight: 700;
    font-family: Arial, sans-serif;
    color: #fff;
    text-transform: uppercase;
}

#case_studies_main .csdm_tit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#case_studies_main .csdm_tit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#case_studies_main .csd_swiper{
    position: relative;
    width: 100%;
    padding-right: min(80px, 4.1667vw);
}

#case_studies_main .csd_swiper .blur_txtDeco{
    position: absolute;
    right: 0;
    top: 80px;
}

#case_studies_main .csd_swiper .blur_txtDeco .inner{
    padding: 11px;
}

#case_studies_main .csd_swiper .blur_txtDeco figure{
    width: 125px;
    margin: 0 10px 30px 0;
}

#case_studies_main .csd_swiper .swiper-slide .csd_slide_item{
    opacity: 0;
    transition: opacity 0.6s;
}

#case_studies_main .csd_swiper .swiper-slide-active .csd_slide_item{
    opacity: 1;
}

#case_studies_main .csd_swiper .csd_slide_item{
    width: 100%;
}

#case_studies_main .csd_swiper .csd_pagination{
    display: flex;
    justify-content: flex-end;
    gap: min(44px, 2.2917vw);
}

#case_studies_main .csd_pagination .swiper-pagination-bullet{
    position: relative;
    width: min(4px, 0.2083vw);
    height: min(4px, 0.2083vw);
    border-radius: 0;
    background: rgba(135, 135, 135, 1);
    opacity: 1;
    overflow: hidden;
    transition: width 0.3s;
    margin: 0;
}

#case_studies_main .csd_pagination .swiper-pagination-bullet-active{
    width: min(50px, 2.6042vw);
}

#case_studies_main .csd_pagination .swiper-pagination-bullet::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: rgba(142, 87, 244, 1);
    transition: none;
}

#case_studies_main .csd_pagination .swiper-pagination-bullet-active::after{
    width: 100%;
    transition: width 6s;
}

#case_studies_main .csd_slide_item{
    position: relative;
    width: 100%;
    padding: 0 0 min(28px, 1.4583vw) min(80px, 4.1667vw);
}

#case_studies_main .csd_slide_item .img{
    position: relative;
    width: 100%;
}

#case_studies_main .csd_slide_item .img::after{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    z-index: 1;
}

#case_studies_main .csd_slide_item .img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#case_studies_main .csd_slide_item .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#case_studies_main .csd_slide_item .txt_area{
    position: absolute;
    left: 0;
    bottom: 0;
    width: max-content;
    max-width: 60%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateY(min(20px, 1.0417vw));
    transition: opacity 0.6s ease, transform 0.6s ease;
}

#case_studies_main .csd_swiper .swiper-slide-active .csd_slide_item .txt_area{
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.5s;
}

#case_studies_main .csd_slide_item .cate{
    display: flex;
    flex-wrap: wrap;
    gap: min(5px, 0.2604vw);
}

#case_studies_main .csd_slide_item .cate span{
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    color: rgba(178, 137, 255, 1);
}

#case_studies_main .csd_slide_item .tit{
    font-size: min(32px, 1.6667vw);
    line-height: 1.2;
    font-weight: 700;
    color: #fff;
    margin-top: min(14px, 0.7292vw);
}

#case_studies_main .csd_slide_item .link{
    position: relative;
    display: inline-block;
    margin-top: min(20px, 1.0417vw);
    width: max-content;
}

#case_studies_main .csd_slide_item .link a{
    width: max-content;
    display: flex;
    align-items: center;
    gap: 0 min(13px, 0.6771vw);
    padding: min(12px, 0.625vw) min(22px, 1.1458vw) min(12px, 0.625vw) min(16px, 0.8333vw);
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(min(27px, 1.4063vw));
    -webkit-backdrop-filter: blur(min(27px, 1.4063vw));
    color: #fff;
    text-transform: uppercase;
    border: 1px solid rgba(126, 126, 126, 1);
    clip-path: polygon(-1px -1px, calc(100% + 1px) -1px, calc(100% + 1px) calc(100% - min(15px, 0.7813vw)), calc(100% - min(15px, 0.7813vw)) calc(100% + 1px), -1px calc(100% + 1px));
    gap: 13px;
}

#case_studies_main .csd_slide_item .link a i{
    width: 6px;
}

#case_studies_main .csd_slide_item .link::after{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: min(15px, 0.7813vw);
    height: min(15px, 0.7813vw);
    background: linear-gradient(
        to bottom right,
        transparent calc(50% - 0.5px),
        rgba(126, 126, 126, 1) calc(50% - 0.5px),
        rgba(126, 126, 126, 1) calc(50% + 0.5px),
        transparent calc(50% + 0.5px)
    );
    pointer-events: none;
}

/* case_studies_main grid deco */
#case_studies_main .grid_deco .grid_line.hrz.pos_bot{
    position: absolute;
    bottom: 0;
}

#case_studies_main .csd_top_deco .csd_top_cross{
    position: absolute;
    bottom: 0;
    right: calc((100% - min(1150px, 59.8958vw)) / 2);
    transform: translate(50%, 50%);
    background: url('../img/common/grid_cross_wh.svg');
}

/* case_studies_list */
#case_studies_list{
    padding: 120px 0;
    overflow-x: clip;
    overflow-y: visible;
}

#case_studies_list .grid_deco{
    overflow: visible;
}

#case_studies_list .grid_deco .grid_deco_inner{
    max-width: min(1150px, 59.8958vw);
}

#case_studies_list .grid_deco .cross_deco.color2.pos_lt{
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    background: url('../img/common/grid_cross02.svg');
}

#case_studies_list .csl_inner{
    position: relative;
    display: flex;
}

#case_studies_list .csl_inner .box{
    position: relative;
    flex: 0 0 max(0px, calc((100% - min(1150px, 59.8958vw)) / 2));
    padding-bottom: 120px;
    flex-shrink: 0;
}

#case_studies_list .csd_list_filter{
    position: sticky;
    padding-right: 120px;
    top: min(120px, 6.25vw);
    width: max-content;
    margin-left: auto;
}

#case_studies_list .csd_list_filter ul{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: min(16px, 0.8333vw);
    padding-left: 20px;
}

#case_studies_list .csd_list_filter ul li{
    will-change: transform, opacity, padding-left;
}

#case_studies_list .csd_list_filter ul li.arc0{ padding-left: 0; }
#case_studies_list .csd_list_filter ul li.arc1{ padding-left: 20px; }
#case_studies_list .csd_list_filter ul li.arc2{ padding-left: 0; }

#case_studies_list .csd_list_filter ul li a{
    display: block;
    font-size: 15px;
    font-weight: 400;
    color: rgba(142, 142, 142, 1);
    transition: all 0.5s;
    padding: 3px;
    width: max-content;
}

#case_studies_list .csd_list_filter ul li.arc0 a,
#case_studies_list .csd_list_filter ul li a:hover,
#case_studies_list .csd_list_filter ul li a.active{
    color: #fff;
    border-bottom: 1px solid #fff;
}

#case_studies_list .csl_inner .box.left{

}


#case_studies_list .csl_inner .container{
    margin: 0 auto 0 0;
    padding: 0 0 0 100px;
    max-width: none;
    flex: 1 1 0;
    min-width: 0;
}

#case_studies_list .csdl_body{
    width: 100%;
    display: flex;
    flex-direction: column;
    max-width: min(1520px, 79.1667vw);
    padding-right: 200px;
}

#case_studies_list .csdl_item{
    position: relative;
    width: 100%;
    display: flex;
    padding-left: 100px;
    padding-bottom: 100px;
    flex-direction: column;
}

#case_studies_list .csdl_item::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    min-width: 200vw;
    height: 1px;
    background: rgba(43, 43, 43, 1);
}

#case_studies_list .csdl_item::before{
    content: '';
    position: absolute;
    bottom: max(-16px, -0.8333vw);
    width: min(32px, 1.6667vw);
    height: min(32px, 1.6667vw);
    background: url('../img/common/grid_cross01.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1;
}

#case_studies_list .csdl_item:nth-child(odd)::before{
    left: calc(-100px - min(16px, 0.8333vw));
}

#case_studies_list .csdl_item:nth-child(even)::before{
    left: calc(min(1150px, 59.8958vw) - 100px - min(16px, 0.8333vw));
}

#case_studies_list .csdl_item:first-child{
}

#case_studies_list .csdl_item:not(:first-child){
    margin-top: 100px;
}

#case_studies_list .csdl_top{

}

#case_studies_list .csdl_top strong{
    position: absolute;
    left: 0;
    top: max(-10px, -0.5208vw);
    font-size: 70px;
    font-weight: 700;
    font-family: Arial, sans-serif;
    background: radial-gradient(38.46% 77% at 80% 100%, #8C78D3 0%, #FFFFFF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    z-index: 3;
}

#case_studies_list .csdl_top span{
    display: flex;
    color: rgba(211, 188, 255, 1);
    font-size: 15px;
    font-weight: 500;
    padding-left: 10px;
    border-left: 1px solid #fff;
    line-height: 1.2;
}

#case_studies_list .csdl_box{
    width: 100%;
    margin-top: 18px;
}

#case_studies_list .csdl_area{
    display: flex;
    flex-wrap: wrap;
    gap: 40px 20px;
}

#case_studies_list .csdl_area > li{
    width: calc((100% - min(80px, 4.1667vw)) / 3);
}

#case_studies_list .csdl_area > li a{
    display: block;
}


#case_studies_list .csdl_area > li a .csdl_inner{
    width: 100%;
    display: flex;
    flex-direction: column;
}



#case_studies_list .csdl_area > li a .img{
    width: 100%;
}



#case_studies_list .csdl_area > li a .img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#case_studies_list .csdl_area > li a .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s;
}


#case_studies_list .csdl_area > li a:hover .img figure img,
#case_studies_list .csdl_area > li a:focus .img figure img{
    transform: scale(1.15);
}

#case_studies_list .csdl_area > li a .desc{
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 14px;
    word-break: break-word;
}

#case_studies_list .csdl_area > li a .desc h3{
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    line-height: 1.3;
}

#case_studies_list .csdl_area > li a .desc .cate{
    display: flex;
    flex-wrap: wrap;
    gap: min(6px, 0.3125vw) min(8px, 0.4167vw);
    margin-top: 12px;
}

#case_studies_list .csdl_area > li a .desc .cate span{
    color: rgba(155, 155, 155, 1);
    font-weight: 300;
    font-size: 14px;
}

/* news */

#news_visual .grid_deco .grid_deco_inner{
    max-width: 1360px;
}

#news_visual .grid_deco .grid_line.vrt_dash{
    height: calc(100% - var(--news-visual-pad-y));
}

#news_visual .grid_deco .grid_line.vrt_dash.pos_right,
#news_visual .grid_deco .grid_line.vrt_dash.pos_left{
    height: calc(100% + var(--news-visual-pad-y));
    top: calc(-1 * var(--news-visual-pad-y));
}

#news_visual .grid_deco .grid_line.vrt.pos_h_center{
    top: auto;
    bottom: 0;
    height: var(--news-visual-pad-y);
}

#news_visual .grid_deco .cross_deco.rb{
    position: absolute;
    right: -16px;
    bottom: calc(85px - 16px);
    z-index: 2;
    background: url('../img/common/grid_cross01.svg');
}

#news_visual .nw_cont .container{
    position: relative;
    max-width: 1360px;
    display: flex;
    flex-direction: column;
}

#news_visual{
    --news-visual-pad-y: 85px;
    position: relative;
    padding: var(--news-visual-pad-y) 0;
}

#news_visual .subPage_234_top_deco_absol{
    position: absolute;
    right: calc(100% + 30px);
    top: calc(100% + 30px);
    width: max-content;
    z-index: 11;
}

#news_visual .nw_top{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    aspect-ratio: 1360 / 100;
    padding: min(20px, 1.042vw);
}

#news_visual .nw_top::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(31, 31, 31, 1);
}

#news_visual .nw_top .cross_deco{
    position: absolute;
    bottom: -16px;
    background: url('../img/common/grid_cross02.svg');
    z-index: 2;
}

#news_visual .nw_top .cross_deco.lb{
    left: -16px;
}

#news_visual .nw_top span{
    font-size: 12px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.16);
}

#news_visual .nv_container{
    max-width: 1360px;
}

#news_visual .nv_inner{
    width: 100%;
    padding: 80px 100px 25px 100px;
    display: flex;
    gap: 30px;
}

#news_visual .nv_inner .nv_box{
    display: flex;
    flex-direction: column;
}

#news_visual .nv_inner .nv_box.left{
    width: 340px;
}

#news_visual .nv_inner .nv_box .tit_area{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
}

#news_visual .nv_inner .nv_box .tit_area .tit{
    font-size: 100px;
    color: #fff;
    font-weight: 700;
    font-family: Arial, sans-serif;
    text-transform: uppercase;
    margin-top: 20px;
}

#news_visual .nv_inner .nv_box .tit_area .tit .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#news_visual .nv_inner .nv_box .tit_area .tit .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#news_visual .nv_inner .nv_box .tit_area .tit_deco{
    width: max-content;
    opacity: 0.3;
    margin-top: 24px;
}

#news_visual .nv_inner .nv_box .slide_area{
    width: 100%;
}

#news_visual .nv_inner .nv_box.right{
    flex: 1;
    padding-top: 100px;
    overflow: visible;
    position: relative;
}

#news_visual .nv_slide{
    width: 100%;
    overflow: visible;
    position: relative;
    z-index: 2;
}

#news_visual .nv_slide .swiper-wrapper{
    overflow: visible;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

#news_visual .nv_slide .swiper-slide{
    position: relative;
    grid-area: 1 / 1;
    width: 100% !important;
    aspect-ratio: 772 / 445;
    backface-visibility: hidden;
    transform-origin: center center;
    transform: translate3d(24%, -38%, 0) scale(0.74);
    opacity: 0;
    pointer-events: none;
    filter: brightness(0.72);
    will-change: transform, opacity, filter;
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.45s ease, filter 0.8s ease;
    background: rgba(7, 7, 7, 1);
}

#news_visual .nv_slide .swiper-slide.is-stack-visible{
    opacity: 1;
    transform: translate3d(var(--nv-stack-offset-x, 0), var(--nv-stack-offset-y, 0), 0) scale(var(--nv-stack-scale, 1));
    filter: brightness(var(--nv-stack-brightness, 1));
}

#news_visual .nv_slide .swiper-slide.is-current{
    pointer-events: auto;
}

#news_visual .nv_slide .swiper-slide .img{
    width: calc(100% + 2px);
    aspect-ratio: 16 / 9;
    margin: -1px;
    transition: all .5s;
}

#news_visual .nv_slide .swiper-slide .img figure{
    width: 100%;
    height: 100%;
}

#news_visual .nv_slide .swiper-slide .img figure img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#news_visual .nv_slide .swiper-slide.is-stack-visible .img{
    opacity: 0;
}

#news_visual .nv_slide .swiper-slide.is-current .img{
    opacity: 1;
}

#news_visual .nv_slide .swiper-slide .nv_slide_status{
    display: inline-flex;
    position: absolute;
    left: 0;
    bottom: 100%;
    padding: 5px 16px;
    font-size: 10px;
    color: rgba(75, 75, 75, 1);
    background: rgba(36, 36, 36, 0.57);
    backdrop-filter: blur(12.5px);
    -webkit-backdrop-filter: blur(12.5px);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: color 0.4s ease, opacity 0.4s ease;
    font-family: var(--font-D2Coding);
    text-transform: capitalize;
}

#news_visual .nv_slide .swiper-slide.is-current .nv_slide_status{
    color: rgba(255, 255, 255, 0.95);
}

#news_visual .nv_slide .swiper-slide.is-next-card .nv_slide_status{
    color: rgba(194, 194, 194, 0.78);
}


#news_visual .nv_pagination{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding-right: 100px;
    margin-bottom: 70px;
}

#news_visual .nv_pagination .nv_pag_current,
#news_visual .nv_pagination .nv_pag_total{
    font-size: 14px;
    font-weight: 400;
    color: rgba(255,255,255,0.4);
    line-height: 1;
    min-width: 20px;
    text-align: center;
}

#news_visual .nv_pagination .nv_pag_current{
    color: #fff;
}

#news_visual .nv_pagination .nv_pag_bar{
    position: relative;
    width: 64px;
    display: flex;
    align-items: center;
}

#news_visual .nv_pagination .nv_pag_ticks{
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2px;
    z-index: 1;
}

#news_visual .nv_pagination .nv_pag_ticks span{
    display: block;
    width: 1px;
    height: 6px;
    background: rgba(255,255,255,0.2);
    transition: background 0.3s;
}

#news_visual .nv_pagination .nv_pag_ticks span.active{
    background: rgba(142, 87, 244, 1);
}

#news_visual .nv_pagination .nv_pag_fill{
    display: none;
}

#news_visual .nv_txt_slide_area{
    flex: 1;
    margin-top: 20px;
    display: flex;
    align-items: flex-end;
    position: relative;
    z-index: 10;
    /* padding: 0 15px; */
}

#news_visual .nv_txt_slide .swiper-wrapper{
    align-items: stretch;
}

#news_visual .nv_txt_slide  .swiper-slide{
    padding: 4px;
    height: auto !important;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner{
    position: relative;
    height: 100%;
    background: rgba(20, 20, 20, 0.78);
    backdrop-filter: blur(10.5px);
    -webkit-backdrop-filter: blur(10.5px);
    padding: 35px 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner::before,
#news_visual .nv_txt_slide .swiper-slide .nvts_inner::after{
    content: '';
    position: absolute;
    top: -4px;
    bottom: -4px;
    width: 4px;
    background: linear-gradient(to bottom, #fff 4px, transparent 4px, transparent calc(100% - 4px), #fff calc(100% - 4px));
    pointer-events: none;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner::before{
    left: -4px;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner::after{
    right: -4px;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner .desc{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px 0;
    word-break: break-word;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner .desc .date{
    font-size: 12px;
    line-height: 1.5;
    font-weight: 500;
    color: rgba(134, 134, 134, 1);
}

#news_visual .nv_txt_slide  .swiper-slide .nvts_inner .desc .tit{
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    color: #fff;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#news_visual .nv_txt_slide .swiper-slide .nvts_inner .desc .link{
    display: inline-flex;
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    margin-top: 50px;
}

/* news_list */

#news_list{
    position: relative;
    padding: 40px 0 110px 0;
}

#news_list .grid_deco .grid_deco_inner{
    max-width: 1360px;
}

#news_list .grid_deco .grid_line.vrt.pos_h_center{
    top: 0;
    height: 100%;
}

#news_list .nl_container{
    max-width: 1150px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

#news_list .nl_box{
    width: calc(50% - 50px);
    display: flex;
    flex-direction: column;
}

#news_list .nl_filter_area{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 25px 0;
    margin-bottom: 100px;
}

#news_list .nl_filter_area strong{
    font-size: 22px;
    color: #fff;
    font-weight: 500;
}

#news_list .nl_filter_area ul{
    display: flex;
    flex-direction: column;
    gap: 13px 0;

}

#news_list .nl_filter_area ul li a{
    display: inline-flex;
    width: max-content;
    font-size: 16px;
    font-weight: 500;
    color: rgba(142, 142, 142, 1);
    transition: all .5s;
}

#news_list .nl_filter_area ul li:hover a,
#news_list .nl_filter_area ul li.active a{
    color: #fff;
}

#news_list .news_list_floor{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 160px 0;
}

#news_list .news_list_content{
    width: 100%;
    display: flex;
}

#news_list .news_list_content a{
    display: flex;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#news_list .news_list_content a .img{
    width: 100%;
}

#news_list .news_list_content a .img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#news_list .news_list_content a .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-origin: center;
    transition: all .7s;
}

#news_list .news_list_content a:hover .img figure img{
    transform: scale(1.15);
}


#news_list .news_list_content a .desc{
    display: flex;
    flex-direction: column;
    margin-top: 45px;
}

#news_list .news_list_content a .desc .cate{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

#news_list .news_list_content a .desc .cate span{
    display: inline-flex;
    font-size: 12px;
    color: #fff;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.27);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    text-transform: capitalize;
    font-weight: 500;
}

#news_list .news_list_content a .desc .tit{
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    word-break: break-word;
    margin-top: 15px;
    line-height: 1.5;
}

#news_list .news_list_content a .desc .link_desc{
    display: inline-flex;
    margin-top: 15px;
    font-size: 12px;
    color: rgba(155, 155, 155, 1);
}

#news_list .view_more{
    position: relative;
    width: 100%;
    margin-top: 120px;
    display: flex;
    justify-content: center;
    z-index: 10;
}

#news_list .view_more a{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 190px;
    background: #fff;
    color: #000;
    font-size: 15px;
    padding: 8px 24px;
    height: 50px;
    font-weight: 500;
    transition: all .5s;
}

#news_list .view_more a:hover{
    background: var(--main-brand-color);
    color: #fff;
}

/* deep generative design */

#dgd_visual{
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: url('../../assets/img/sub/generation_bg.png') no-repeat;
    background-size: cover;
    background-position: center bottom;
}

#dgd_visual .grid_deco .grid_line.pos_left{
    left: auto;
    right: min(349px, 18.1771vw);
}

#dgd_visual .grid_deco .grid_line.pos_left.left{
    left: 0;
    right: auto;
}

#dgd_visual .dgd_vis_top{
    position: relative;
    width: 100%;
    padding-top: 85px;
    border-bottom: 1px solid rgba(43, 43, 43, 1);
}

#dgd_visual .dgd_vis_top .container{
    display: flex;
}

#dgd_visual .dgd_vis_top .top_tit{
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
}

#dgd_visual .dgd_vis_top .top_tit > .cross_deco.lb{
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%);
    background: url('../img/common/grid_cross_wh.svg');
}

#dgd_visual .dgd_vis_top .top_tit strong{
    font-size: clamp(14px, 1.1458vw, 22px);
    letter-spacing: max(-0.3px, -0.0156vw);
    line-height: 1.5;
    color: #fff;
    font-weight: 700;
    opacity: 0;
    transform: translateY(min(20px, 1.0417vw));
    transition: opacity 0.8s ease, transform 0.8s ease;
    word-break: break-word;
}

#dgd_visual .dgd_vis_top .top_tit strong.revealed{
    opacity: 1;
    transform: translateY(0);
}

#dgd_visual .dgd_vis_top .top_img_deco{
    position: relative;
    display: flex;
    width: 100%;
    max-width: min(350px, 18.2292vw);
    aspect-ratio: 350 / 287;
    border: 1px solid rgba(43, 43, 43, 1);
    opacity: 0;
    transform: translateY(min(20px, 1.0417vw));
    transition: opacity 0.8s ease, transform 0.8s ease;
}

#dgd_visual .dgd_vis_top .top_img_deco.revealed{
    opacity: 1;
    transform: translateY(0);
}

#dgd_visual .dgd_vis_top .top_img_deco .grid_barcode{
    position: absolute;
    top: calc(100% + 25px);
    right: min(25px, 1.3021vw);
    width: calc(100% - min(50px, 2.6042vw));
}

#dgd_visual .dgd_vis_top .top_img_deco > .cross_deco{
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    background: url('../img/common/grid_cross_wh.svg');
}

#dgd_visual .dgd_vis_top .top_img_deco .box{
    width: 50%;
    height: 100%;
}

#dgd_visual .dgd_vis_top .top_img_deco .img{
    width: 100%;
    height: 100%;
}

#dgd_visual .dgd_vis_top .top_img_deco .img figure{
    width: 100%;
    height: 100%;
}

#dgd_visual .dgd_vis_top .top_img_deco .left .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#dgd_visual .dgd_vis_top .top_img_deco .left{
    border-right: 1px solid rgba(43, 43, 43, 1);
}

#dgd_visual .dgd_vis_top .top_img_deco .right{
    background: rgba(101, 34, 225, 0.1);
}

#dgd_visual .dgd_vis_top .top_img_deco .right .img figure{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#dgd_visual .dgd_vis_top .top_img_deco .right .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#dgd_visual .dgd_vis_bot{
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border-bottom: 1px solid rgba(43, 43, 43, 1);
}

#dgd_visual .dgd_vis_bot .container{
    display: flex;
}

#dgd_visual .dgd_vis_bot .left{
    flex: 1;
}

#dgd_visual .dgd_vis_bot .dgd_tit{
    padding-bottom: min(25px, 1.3021vw);
}

#dgd_visual .dgd_vis_bot .dgd_tit h2{
    display: flex;
    flex-direction: column;
    font-family: Arial, sans-serif;
}

#dgd_visual .dgd_vis_bot .dgd_tit h2 strong{
    display: inline-flex;
    font-size: clamp(45px, 5.2083vw, 100px);
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
}

#dgd_visual .dgd_vis_bot .dgd_tit h2 strong:nth-child(2){
    padding-left: min(120px, 6.25vw);
}

#dgd_visual .dgd_vis_bot .dgd_tit h2 strong:nth-child(3){
    padding-left: min(75px, 3.9063vw);
}

#dgd_visual .dgd_vis_bot .dgd_tit h2 strong .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#dgd_visual .dgd_vis_bot .dgd_tit h2 strong .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#dgd_visual .dgd_vis_bot .right{
    position: relative;
    width: 100%;
    height: 100%;
    max-width: min(350px, 18.2292vw);
    padding: clamp(12px, 1.3021vw, 25px);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

#dgd_visual .dgd_vis_bot .right .dgd_vis_bot_decoTxt{
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    word-break: break-word;
}

#dgd_card{
    height: 100vh;
    padding: 0;
}

#dgd_card .dgd_card_container{
    height: 100%;
}

#dgd_card .deco_tit{
    position: absolute;
    left: 50%;
    top: 130px;
    transform: translateX(-50%);
    width: max-content;
    pointer-events: none;
    user-select: none;
    text-align: center;
}

#dgd_card .deco_tit strong{
    font-size: min(260px, 13.5417vw);
    color: rgba(0, 0, 0, 0.02);
    text-transform: uppercase;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 500;
}

#dgd_card .dgd_card_container{
    position: relative;
    display: flex;
    z-index: 10;
    gap: min(80px, 4.1667vw);
    padding: min(130px, 12.037vh) 0;
    box-sizing: border-box;
}

#dgd_card .left{
    flex: 1;
    min-width: 0;
}

#dgd_card .dgd_card_tit{
    display: flex;
    flex-direction: column;
}

#dgd_card .dgd_card_tit h2{
    display: flex;
    flex-direction: column;
    width: max-content;
    font-family: Arial, sans-serif;
    font-weight: 700;
    line-height: 1.3;
    font-size: min(24px, 2.2222vh);
    text-transform: uppercase;
}

#dgd_card .dgd_card_tit h2 span{
    display: inline-flex;
}

#dgd_card .dgd_card_tit h2 span:first-child{
    position: relative;
    padding-left: min(50px, 2.6042vw);
}

#dgd_card .dgd_card_tit h2 span:first-child::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    background: var(--main-brand-color);
}

#dgd_card .dgd_card_tit p{
    margin-top: min(16px, 0.8333vw);
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.7);
    font-size: min(18px, 1.6667vh);
}

#dgd_card .dgd_card_img_area{
    width: min(630px, 32.8125vw);
    padding-top: min(180px, 9.375vw);
    height: min(720px, 37.5vw);
}

#dgd_card .card_item .dgd_mobile_next{
    position: absolute;
    right: min(30px, 1.5625vw);
    top: min(30px, 1.5625vw);
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(82px, 4.2708vw);
    height: min(58px, 3.0208vw);
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font-family: Arial, Helvetica, sans-serif;
    font-size: min(32px, 1.6667vw);
    line-height: 1;
    cursor: pointer;
    transition: transform 0.25s ease, background 0.25s ease;
}

#dgd_card .card_item .dgd_mobile_next span{
    display: block;
    transform: translateY(-2px);
}

#dgd_card .card_item .dgd_mobile_next:hover{
    transform: translateX(4px);
}

#dgd_card .card_item .dgd_mobile_caption{
    position: absolute;
    left: min(30px, 1.5625vw);
    bottom: min(30px, 1.5625vw);
    z-index: 2;
    display: flex;
    align-items: flex-end;
    gap: min(12px, 0.625vw);
    color: #fff;
    pointer-events: none;
}

#dgd_card .card_item .dgd_mobile_caption strong{
    font-family: Arial, Helvetica, sans-serif;
    font-size: min(42px, 2.1875vw);
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: 0;
}

#dgd_card .card_item .dgd_mobile_caption span{
    margin-bottom: min(7px, 0.3646vw);
    font-family: Arial, Helvetica, sans-serif;
    font-size: min(17px, 0.8854vw);
    line-height: 1;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.52);
}

#dgd_card .card_stack_box{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: min(12px, 0.625vw);
}

#dgd_card.is-scroll-stack .card_stack_box{
    position: relative;
    overflow: visible;
    gap: 0;
}

#dgd_card .card_item{
    position: relative;
    width: 100%;
    aspect-ratio: 630 / 420;
    padding: min(20px, 1.0417vw);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

#dgd_card.is-scroll-stack .card_item{
    position: absolute;
    left: 0;
    top: 0;
    will-change: transform;
}

#dgd_card .card_item .img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#dgd_card .card_item .img figure{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#dgd_card .card_item .img figure img{
    width: 100%;
    height: 100%;
    transform: scale(1.3);
    object-fit: cover;
}

#dgd_card.is-scroll-stack .card_item .img figure img{
    will-change: transform;
}

#dgd_card .right{
    flex: 1;
    padding-top: min(180px, 9.375vw);
}

#dgd_card .dgd_card_desc{
    width: 100%;
    margin-top: 25%;
}

#dgd_card .dgd_pagination{
    display: flex;
    align-items: center;
    gap: min(12px, 0.625vw);
}

#dgd_card .dgd_pagination .dgd_pag_current,
#dgd_card .dgd_pagination .dgd_pag_total{
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.5);
    line-height: 1;
    min-width: 20px;
    text-align: center;
}

#dgd_card .dgd_pagination .dgd_pag_current{
    color: #000;
}

#dgd_card .dgd_pagination .dgd_pag_bar{
    position: relative;
    width: min(64px, 3.3333vw);
    display: flex;
    align-items: center;
}

#dgd_card .dgd_pagination .dgd_pag_ticks{
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2px;
    z-index: 1;
}

#dgd_card .dgd_pagination .dgd_pag_ticks span{
    display: block;
    width: 1px;
    height: 6px;
    background: rgba(142, 87, 244, 0.2);
    transition: background 0.3s;
}

#dgd_card .dgd_pagination .dgd_pag_ticks span.active{
    background: rgba(142, 87, 244, 1);
}

#dgd_card .dgd_card_desc_txt{
    width: 100%;
    position: relative;
    margin-top: min(32px, 1.6667vw);
}

#dgd_card .dgd_card_desc_item{
    width: 100%;
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    filter: blur(min(4px, 0.2083vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1),
                filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
    pointer-events: none;
    word-break: break-word;
}

#dgd_card .dgd_card_desc_item.active{
    opacity: 1;
    filter: blur(0px);
    pointer-events: auto;
}

#dgd_card .dgd_card_desc_item h3{
    font-size: min(32px, 2.963vh);
    line-height: 1.3;
    font-weight: 600;
}

#dgd_card .dgd_card_desc_item p{
    font-size: min(18px, 1.6667vh);
    line-height: 1.4;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.7);
    margin-top: min(10px, 0.5208vw);
}

#dgd_card .comp_name_tit{
    position: absolute;
    left: 0;
    bottom: 20px;
    z-index: -1;
    font-size: 12px;
    font-weight: 500;
    color: rgba(199, 199, 199, 1);
}

/* aslanX */

#subPageType01_visual.aslan .subPage_234_top_deco{
    border-bottom: 1px solid rgba(43, 43, 43, 1);
    height: 85px;
}

#subPageType01_visual.aslan .subPage_234_top_deco .container{
    position: relative;
    height: 100%;
    z-index: 10;
}

#subPageType01_visual.aslan .subPage_234_top_deco .txt{
    padding: 0;
    position: absolute;
    left: 30px;
    top: calc(100% + 30px);
}

#subPageType01_visual.aslan .subPage_234_top_deco .spt_td_img{
    top: 100%;
}

#subPageType01_visual.aslan .subPage_234_top_deco .spt_td_hrz_dash{
    top: calc(100% + min(250px, 13.0208vw));
}

#subPageType01_visual.aslan .subPage_234_top_deco .aslan_cross{
    position: absolute;
    top: calc(100% + min(250px, 13.0208vw));
    left: 0;
    transform: translate(-50%, -50%);
    background: url('../img/common/grid_cross_wh.svg');
    z-index: 1;
}

/* aslan_slogan */

#aslan_slogan{
    position: relative;
    padding: min(130px, 12.037svh) 0 min(210px, 19.4444svh) 0;
    height: 100svh;
}

#aslan_slogan .grid_deco .grid_line.pos_left{
    left: min(250px, 13.0208vw);
}

#aslan_slogan .grid_deco .grid_line.pos_right{
    right: min(250px, 13.0208vw);
}

#aslan_slogan .grid_deco .grid_line.pos_40{
    top: 40%;
}

#aslan_slogan .grid_deco .cross_deco.wh{
    background: url('../img/common/grid_cross_wh.svg');
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

#aslan_slogan .grid_deco .cross_deco.pos_40_right{
    position: absolute;
    top: 40%;
    right: min(250px, 13.0208vw);
    transform: translate(50%, -50%);
    z-index: 1;
}

#aslan_slogan .asls_container{
    position: relative;
    z-index: 10;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 100%;
}

.aslan_main_tit_area {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.aslan_main_tit_area .cate{
    font-family: Arial, sans-serif;
    font-weight: 400;
    letter-spacing: -0.02em;
    color: rgba(149, 149, 149, 1);
}

.aslan_main_tit_area h2{
    color: #fff;
    font-weight: 600;
    font-size: 48px;
    letter-spacing: -0.02em;
    margin-top: 26px;
}

#aslan_slogan .main_slogan_area{
    position: relative;
    width: 100%;
    margin-top: min(76px, 7.037svh);
    padding: 24px;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
}

#aslan_slogan .msa_inner{
    position: relative;
    height: 100%;
    aspect-ratio: 845 / 515;
}

#aslan_slogan .main_slogan_area > .corner{
    position: absolute;
    width: 16px;
    height: 16px;
    pointer-events: none;
}

#aslan_slogan .main_slogan_area > .corner.lt,
#aslan_slogan .main_slogan_area > .corner.rt{
    top: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_slogan .main_slogan_area > .corner.lb,
#aslan_slogan .main_slogan_area > .corner.rb{
    bottom: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_slogan .main_slogan_area > .corner.lt,
#aslan_slogan .main_slogan_area > .corner.lb{
    left: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_slogan .main_slogan_area > .corner.rt,
#aslan_slogan .main_slogan_area > .corner.rb{
    right: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_slogan .slogan_scrollEffect{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1.2s ease;
}

#aslan_slogan .slogan_scrollEffect.active{
    opacity: 1;
}

#aslan_slogan .slogan_scrollEffect .img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#aslan_slogan .slogan_scrollEffect .img img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

#aslan_slogan .slogan_scroll_pagination{
    width: 100%;
    text-align: center;
    margin-top: min(16px, 1.4815svh);
}

#aslan_slogan .slogan_scroll_pagination span{
    font-family: Arial, sans-serif;
    font-size: 12px;
    color: rgba(149, 149, 149, 1);
    font-weight: 400;
}

#aslan_slogan .slogan_scrollEffect .txt{
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#aslan_slogan .slogan_scrollEffect .slogan_se_tit{
    width: max-content;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: min(4px, 0.3704svh);
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

#aslan_slogan .slogan_scrollEffect.active .slogan_se_tit{
    opacity: 1;
    transform: translateY(0);
}

#aslan_slogan .slogan_scrollEffect .slogan_se_tit h3{
    font-family: Arial, sans-serif;
    font-size: min(48px, 4.4444svh);
    line-height: 1.3;
    font-weight: 700;
    color: #fff;
}

#aslan_slogan .slogan_scrollEffect .slogan_se_tit span{
    font-size: min(18px, 1.6667svh);
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 700;
}

#aslan_slogan .slogan_scrollEffect .slogan_se_desc{
    position: absolute;
    left: 50%;
    bottom: min(36px, 3.3333svh);
    transform: translateX(-50%);
    padding: 0 min(36px, 3.3333svh);
    text-align: center;
    width: max-content;
    opacity: 0;
    transition: opacity 0.8s ease 0.8s;
}

#aslan_slogan .slogan_scrollEffect.active .slogan_se_desc{
    opacity: 1;
}

#aslan_slogan .slogan_scrollEffect .slogan_se_desc p{
    font-size: min(16px, 1.4815svh);
    letter-spacing: -0.02em;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.5;
    font-weight: 500;
}


/* aslan_platform */

#aslan_platform .asp_box{
    width: 100%;
}

#aslan_platform .asp_box.top{
    border-bottom: 1px solid rgba(0, 0, 0, 0.21);
    padding-top: 160px;
}

#aslan_platform .aspb_t_container{
    position: relative;
    gap: 160px;
    display: flex;
    flex-wrap: wrap;
}

#aslan_platform .aspb_t_container::before{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.21);
}

#aslan_platform .aspb_t_item{
    width: calc(50% - 80px);
    position: relative;
}

#aslan_platform .aspb_t_item .border_left,
#aslan_platform .aspb_t_item .border_right{
    position: absolute;
    bottom: 0;
    width: 1px;
    height: 9999px;
    background: rgba(0, 0, 0, 0.21);
}

#aslan_platform .aspb_t_item .border_left{
    left: 0;
}

#aslan_platform .aspb_t_item .border_right{
    right: 0;
}

#aslan_platform .aspb_t_item.txt_area{
    padding: 60px 50px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#aslan_platform .aspb_t_item.txt_area .tit_area{
    display: flex;
    flex-direction: column;
}

#aslan_platform .aspb_t_item.txt_area .tit_area h2{
    font-size: 80px;
    line-height: 1.1;
    font-family: Arial, sans-serif;
    font-weight: 700;
    font-size: 80px;
}

#aslan_platform .aspb_t_item.txt_area .tit_area p{
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.5;
    margin-top: 20px;
}

#aslan_platform .aspb_t_item.txt_area .deco_txt{
    width: 190px;
}

#aslan_platform .aspb_t_item.visual_area .img_area{
    width: 100%;
    position: relative;
}

#aslan_platform .aspb_t_item.visual_area .img_area figure{
    width: 100%;
    aspect-ratio: 680 / 770;
    overflow: hidden;
}

#aslan_platform .aspb_t_item.visual_area .img_area figure img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.005);
}

#aslan_platform .aspb_t_deco{
    position: absolute;
    z-index: 2;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    width: max-content;
}

#aslan_platform .aspb_t_deco.fade_in{
    opacity: 1;
    transform: translateY(0);
}

#aslan_platform .aspb_t_deco span{
    display: inline-block;
    position: relative;
    padding: 30px;
    background: rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(8.68px);
    -webkit-backdrop-filter: blur(8.68px);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.4;
    white-space: nowrap;
}

#aslan_platform .aspb_t_deco::before,
#aslan_platform .aspb_t_deco::after,
#aslan_platform .aspb_t_deco span::before,
#aslan_platform .aspb_t_deco span::after{
    content: "";
    position: absolute;
    width: 4px;
    height: 4px;
    background: #000;
    z-index: 3;
    pointer-events: none;
}

#aslan_platform .aspb_t_deco::before{
    top: -2px;
    left: -2px;
}

#aslan_platform .aspb_t_deco::after{
    top: -2px;
    right: -2px;
}

#aslan_platform .aspb_t_deco span::before{
    bottom: -2px;
    left: -2px;
}

#aslan_platform .aspb_t_deco span::after{
    bottom: -2px;
    right: -2px;
}

#aslan_platform .aspb_t_deco.num1{
    top: 100px;
    right: calc(100% + 90px);
}

#aslan_platform .aspb_t_deco.num2{
    top: 50%;
    left: 0;
    /* 세로 중앙 정렬(-50%) 과 fade-in 시작 오프셋(+20px) 을 한 transform 에 합성.
       transform 은 동일 요소에서 마지막 선언만 적용되므로, 둘을 분리하면 한 쪽이 무시된다. */
    transform: translate(-50%, calc(-50% + 20px));
}

#aslan_platform .aspb_t_deco.num2.fade_in{
    /* fade-in 종료 상태: 중앙 정렬만 남기고 오프셋 0 */
    transform: translate(-50%, -50%);
}

#aslan_platform .asp_box.bot{
    position: relative;
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.21);
    z-index: 101;
    transition: background-color 0.45s ease, border-color 0.45s ease;
}

#aslan_platform .asp_box.bot.is_fixed{
    position: fixed;
    top: 85px;
    left: 0;
    width: 100%;
    background-color: #fff;
    z-index: 500;
    transition: top 0.35s ease, background-color 0.45s ease, border-color 0.45s ease;
}

#aslan_platform .asp_box.bot.is_dark{
    background-color: rgba(12, 12, 12, 1);
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

#aslan_platform .asp_box.bot.is_dark.is_fixed{
    background-color: rgba(12, 12, 12, 1);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_tit strong{
    color: rgba(255, 255, 255, 1);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_tit p{
    color: rgba(255, 255, 255, 0.5);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn a span.num,
#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn a .link_desc strong{
    color: rgba(255, 255, 255, 1);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn a .link_desc span{
    color: rgba(255, 255, 255, 0.55);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn a:hover,
#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn.is_active a{
    background: rgba(255, 255, 255, 0.08);
}

#aslan_platform .asp_box.bot.is_dark .aspb_b_item .link_btn a i img{
    filter: invert(1) brightness(1.1);
}

#aslan_platform .aspb_b_item .link_tit strong,
#aslan_platform .aspb_b_item .link_tit p,
#aslan_platform .aspb_b_item .link_btn a span.num,
#aslan_platform .aspb_b_item .link_btn a .link_desc strong,
#aslan_platform .aspb_b_item .link_btn a .link_desc span,
#aslan_platform .aspb_b_item .link_btn a i img{
    transition: color 0.45s ease, filter 0.45s ease;
}

#aslan_platform .aspb_b_container{
    display: flex;
    flex-wrap: wrap;
    gap: 160px;
}

#aslan_platform .aspb_b_item{
    width: calc(50% - 80px);
    padding: 10px 0;
    display: flex;
    align-items: center;
}

#aslan_platform .aspb_b_item .link_tit{
    width: max-content;
    display: flex;
    flex-direction: column;
    word-break: break-word;
    gap: 5px 0;
    padding: 0 50px;
}

#aslan_platform .aspb_b_item .link_tit strong{
    font-size: 24px;
    font-weight: 700;
    color: rgba(40, 49, 64, 1);
}

#aslan_platform .aspb_b_item .link_tit p{
    font-size: 15px;
    color: rgba(0, 0, 0, 0.4);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.02em;
}

#aslan_platform .aspb_b_item .link_area{
    width: 100%;
    display: flex;
    gap: 10px;
}

#aslan_platform .aspb_b_item .link_btn{
    position: relative;
    width: 50%;
}

#aslan_platform .aspb_b_item .link_btn a{
    position: relative;
    display: flex;
    width: 100%;
    padding: 15px 50px 15px 30px;
    transition: all .5s;
}

#aslan_platform .aspb_b_item .link_btn a i{
    position: absolute;
    right: 18px;
    top: 18px;
}

#aslan_platform .aspb_b_item .link_btn a i img{
    display: block;
    width: 14px;
    height: auto;
}

#aslan_platform .aspb_b_item .link_btn a:hover,
#aslan_platform .aspb_b_item .link_btn.is_active a{
    background: rgba(244, 244, 244, 1);
}

#aslan_platform .aspb_b_item .link_btn a span.num{
    line-height: 1.5;
    font-size: 18px;
    color: rgba(40, 49, 64, 1);
    font-weight: 500;
    height: max-content;
}

#aslan_platform .aspb_b_item .link_btn a .link_desc{
    display: flex;
    flex-direction: column;
    margin-left: 14px;
    gap: 2px;
}

#aslan_platform .aspb_b_item .link_btn a .link_desc strong{
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    color: rgba(40, 49, 64, 1);
}

#aslan_platform .aspb_b_item .link_btn a .link_desc span{
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: rgba(0, 0, 0, 0.5);
    font-weight: 500;
}

/* aslan_flow */

.aslan_sub_intro{
    position: relative;
    z-index: 100;
    width: 100%;
}

.aslan_sub_intro .aslan_container{
    position: relative;
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid rgba(234, 234, 234, 1);
    border-left: 1px solid rgba(234, 234, 234, 1);
    border-right: 1px solid rgba(234, 234, 234, 1);
}

.aslan_sub_intro.type2 .aslan_container{
    border-bottom-color: rgba(36, 36, 36, 1);
    border-left-color: rgba(36, 36, 36, 1);
    border-right-color: rgba(36, 36, 36, 1);
}

.aslan_sub_intro .area{
    position: relative;
    width: 100%;
    padding-top: 230px;
    z-index: 100;
}

.aslan_sub_intro .area .deco_tit{
    position: absolute;
    left: 50%;
    top: 11.8%;
    transform: translateX(-50%);
    width: max-content;
    z-index: -1;
}

.aslan_sub_intro .area .deco_tit strong{
    font-weight: 700;
    font-size: 222px;
    font-family: Arial, sans-serif;
    color: rgba(0, 0, 0, 0.04);
}

.aslan_sub_intro .tit{
    text-align: center;
    display: flex;
    flex-direction: column;
    padding: 0 20px;
}

.aslan_sub_intro .tit h2{
    font-size: 50px;
    color: rgba(0, 0, 0, 0.9);
    font-weight: 700;
}

.aslan_sub_intro .tit p{
    font-size: 16px;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.7);
    font-weight: 500;
    margin-top: 20px;
}

.aslan_sub_intro .visual_box{
    position: relative;
    width: 100%;
    margin-top: 60px;
}

.aslan_sub_intro .visual_box .deco_txt.wh{
    position: absolute;
    left: 40px;
    top: 40px;
}

.aslan_sub_intro .visual_box .deco_txt.wh.type2{
    left: auto;
    top: auto;
    right: 241px;
    bottom: -34px;
    padding: 12px 15px;
    background: rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(8.68px);
    -webkit-backdrop-filter: blur(8.68px);
    z-index: 2;
}

.aslan_sub_intro .visual_box .img{
    width: 100%;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.aslan_sub_intro .visual_box .img.fade_in{
    opacity: 1;
    transform: translateY(0);
}

.aslan_sub_intro .visual_box .deco_txt.wh,
.aslan_sub_intro .visual_box .img_desc{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.aslan_sub_intro .visual_box .deco_txt.wh figure,
.aslan_sub_intro .visual_box .img_desc figure{
    opacity: 0;
    transition: opacity 0.8s ease;
}

.aslan_sub_intro .visual_box .deco_txt.wh.fade_in,
.aslan_sub_intro .visual_box .img_desc.fade_in{
    opacity: 1;
    transform: translateY(0);
    z-index: 2;
}

.aslan_sub_intro .visual_box .deco_txt.wh.fade_in figure,
.aslan_sub_intro .visual_box .img_desc.fade_in figure{
    opacity: 1;
}

.aslan_sub_intro .visual_box .deco_txt.wh.fade_in figure{
    opacity: 0.6;
}

.aslan_sub_intro .visual_box .img figure img{
    width: 100%;
    display: block;
}

.aslan_sub_intro .visual_box .img_desc{
    position: absolute;
    left: -65px;
    bottom: 80px;
    padding: 20px 75px 20px 20px;
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(36px);
}

.aslan_sub_intro .visual_box .img_desc .cate{
    padding: 7px 10px;
    background: #fff;
    color: #000;
    font-weight: 700;
    font-size: 11px;
    width: max-content;
    display: inline-flex;
}

.aslan_sub_intro .visual_box .img_desc .name{
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    margin-top: 20px;
    font-family: Arial, sans-serif;
}

/* narnia_info_list_box 공통 */

.narnia_info_list_box{
    padding: 20px 0 240px 0;
    overflow: hidden;
}

.narnia_info_list_box .main_tit{
    margin-bottom: 38px;
    text-align: center;
    word-break: break-word;
}

.narnia_info_list_box .main_tit h2{
    font-size: min(48px, 2.5vw);
    line-height: 1.5;
    font-weight: 600;
    color: #fff;
}

.narnia_info_list_box .flow_cate{
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
}

.narnia_info_list_box .flow_cate .cate{
    font-size: 12px;
    font-weight: 500;
    color: rgba(186, 186, 186, 1);
}

.narnia_info_list_box .aslan_flow_list_tit{
    position: relative;
    z-index: 100;
    text-align: center;
    display: flex;
    flex-direction: column;
    margin-top: 80px;
}

.narnia_info_list_box .aslan_flow_list_tit h3{
    font-size: 36px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.9);
    word-break: break-word;
}

.narnia_info_list_box .aslan_flow_list_tit p{
    font-size: 16px;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.7);
    font-weight: 500;
    margin-top: 24px;
}

/* narnia_info_list_box type02 색상 오버라이드 */

.narnia_info_list_box.type02 .flow_cate .cate{
    color: rgba(76, 76, 76, 1);
}

.narnia_info_list_box.type02 .aslan_flow_list_tit h3{
    color: #fff;
}

.narnia_info_list_box.type02 .aslan_flow_list_tit p{
    color: rgba(222, 222, 222, 0.7);
}

.narnia_info_list_box.type02 .aslan_flow_list ul li::before,
.narnia_info_list_box.type02 .aslan_flow_list ul li::after{
    background: rgba(36, 36, 36, 1);
}

.narnia_info_list_box.type02 .aslan_flow_list .afl_inner::before{
    display: none;
}

.narnia_info_list_box.type02 .aslan_flow_list .afl_inner{
    border: 1px solid rgba(36, 36, 36, 1);
    background: rgba(18, 18, 18, 1);
}

.narnia_info_list_box.type02 .aslan_flow_list ul li > .center_line{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
    height: 3000px;
    background: rgba(36, 36, 36, 1);
    z-index: -1;
}

.narnia_info_list_box.type02 .aslan_flow_list .afl_inner .desc strong{
    color: #fff;
}

.narnia_info_list_box.type02 .aslan_flow_list .afl_inner .desc p{
    color: rgba(222, 222, 222, 0.7);
}

.aslan_flow_list{
    position: relative;
    padding-top: 45px;
}

.aslan_flow_list .deco_txt{
    position: absolute;
    left: 30px;
    top: calc(100% + 35px);
    opacity: 0.3;
    width: 190px;
}

.aslan_flow_list .grid_barcode{
    position: absolute;
    right: 30px;
    top: calc(100% + 35px);
    width: 200px;
    opacity: 0.3;
}

.aslan_flow_list ul{
    width: 100%;
    display: flex;
    gap: 40px;
}

.aslan_flow_list ul li{
    position: relative;
    width: calc(100% / 3);
    padding: 10px;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

.aslan_flow_list ul li::before{
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 9999px;
    background: rgba(234, 234, 234, 1);
}

.aslan_flow_list ul li::after{
    display: block;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 3000px;
    background: rgba(234, 234, 234, 1);
}

.aslan_flow_list ul li > .cross_deco{
    position: absolute;
    z-index: 1;
    opacity: 0.5;
}
.aslan_flow_list ul li > .cross_deco.lt{ top: -16px; left: -16px; }
.aslan_flow_list ul li > .cross_deco.rt{ top: -16px; right: -16px; }
.aslan_flow_list ul li > .cross_deco.lb{ bottom: -16px; left: -16px; }
.aslan_flow_list ul li > .cross_deco.rb{ bottom: -16px; right: -16px; }

.aslan_flow_list .afl_inner::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
    height: 3000px;
    background: rgba(234, 234, 234, 0.5);
    z-index: -1;
}

.aslan_flow_list .afl_inner{
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    border: 1px solid rgba(234, 234, 234, 0.5);
    background: rgba(245, 245, 245, 0.72);
    padding: 15px 15px 30px 15px;
    z-index: 10;
}

.aslan_flow_list .afl_inner .img{
    width: 100%;
    margin-bottom: 25px;
}

.aslan_flow_list .afl_inner .img figure{
    width: 100%;
    aspect-ratio: 414 / 393;
    overflow: hidden;
}

.aslan_flow_list .afl_inner .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.aslan_flow_list .afl_inner .desc{
    display: flex;
    flex-direction: column;
    word-break: break-word;
    padding: 0 5px;
    text-align: center;
}

.aslan_flow_list .afl_inner .desc strong{
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 20px;
}

.aslan_flow_list .afl_inner .desc p{
    font-size: 16px;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.7);
    font-weight: 500;
}

.aslan_flow_list .afl_inner{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.aslan_flow_list .afl_inner.fade_in{
    opacity: 1;
    transform: translateY(0);
}

/* aslan_studio */

.aslan_sub_intro.type2 .deco_tit strong{
    color: rgba(255, 255, 255, 0.06);
}

.aslan_sub_intro.type2 .tit h2{
    color: #fff;
}

.aslan_sub_intro.type2 .tit p{
    color: rgba(255, 255, 255, 0.7);
}

.aslan_sub_intro .img_desc.type2{
    background: rgba(97, 97, 97, 0.28);
}

.aslan_sub_intro .deco_txt.wh.type2.color2{
    background: rgba(126, 126, 126, 0.18);
}

.aslan_sub_intro .visual_box .deco_txt.color2.fade_in{
    opacity: 1;
}

#aslan_studio .area.type2{
}

#aslan_studio .studio_list_area{
    width: 100%;
    padding-top: 120px;
}

#aslan_studio .studio_list{
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 60px;
    padding: 50px 0;
    border-top: 1px solid rgba(36, 36, 36, 1);
    border-bottom: 1px solid rgba(36, 36, 36, 1);
    /* overflow: hidden; */
}

#aslan_studio .studio_list::before{
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to right, transparent calc(50% - 30.5px), rgba(255, 255, 255, 0.1) calc(50% - 30.5px), rgba(255, 255, 255, 0.1) calc(50% - 29.5px), transparent calc(50% - 29.5px)),
        linear-gradient(to right, transparent calc(50% + 29.5px), rgba(255, 255, 255, 0.1) calc(50% + 29.5px), rgba(255, 255, 255, 0.1) calc(50% + 30.5px), transparent calc(50% + 30.5px));
    pointer-events: none;
}

#aslan_studio .studio_list > li{
    position: relative;
    width: calc(50% - 30px);
}

#aslan_studio .studio_list > li:nth-child(1)::before{
    content: '';
    position: absolute;
    bottom: 0;
    left: -9999px;
    right: -9999px;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    pointer-events: none;
}

#aslan_studio .studio_list > li:nth-child(3)::before{
    content: '';
    position: absolute;
    top: 0;
    left: -9999px;
    right: -9999px;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    pointer-events: none;
}

#aslan_studio .studio_list > li .inner{
    position: relative;
    width: 100%;
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(255, 255, 255, 0.04);
    background: rgba(18, 18, 18, 1);
}

#aslan_studio .studio_list > li .inner .corner{
    position: absolute;
    width: 16px;
    height: 16px;
    pointer-events: none;
}

#aslan_studio .studio_list > li .inner .corner.lt{
    top: 0;
    left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_studio .studio_list > li .inner .corner.rt{
    top: 0;
    right: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_studio .studio_list > li .inner .corner.lb{
    bottom: 0;
    left: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_studio .studio_list > li .inner .corner.rb{
    bottom: 0;
    right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

#aslan_studio .studio_list > li .desc{
    width: 100%;
    display: flex;
    flex-direction: column;
    word-break: break-word;
}

#aslan_studio .studio_list > li .desc .num{
    font-size: 24px;
    font-weight: 700;
    color: rgba(142, 87, 244, 1);
    line-height: 1.3;
}

#aslan_studio .studio_list > li .desc strong{
    font-size: 24px;
    color: #fff;
    font-weight: 700;
    line-height: 1.3;
    margin-top: 10px;
}

#aslan_studio .studio_list > li .desc p{
    font-size: 16px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 12px;
}

#aslan_studio .studio_list > li .img{
    width: 100%;
    margin-top: 32px;
}

#aslan_studio .studio_list > li .img figure{
    width: 100%;
    aspect-ratio: 666 / 196;
    overflow: hidden;
}

#aslan_studio .studio_list > li .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-origin: center;
    transition: all .7s;
}

#aslan_studio .studio_list > li:hover .img figure img{
    transform: scale(1.15);
}

/* aslan_connect */

#aslan_combine{
    padding-bottom: 130px;
}

#aslan_combine .container{
    display: flex;
    flex-direction: column;
}

#aslan_combine .main_box{
    width: 100%;
}

#aslan_combine .main_box.top{
    display: flex;
    flex-wrap: wrap;
    padding-top: 130px;
    position: relative;
}

#aslan_combine .main_box.top::before,
#aslan_combine .main_box.top::after{
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(204, 204, 204, 1);
}

#aslan_combine .main_box.top::before{
    top: 130px;
}

#aslan_combine .main_box.top::after{
    bottom: 0;
}

#aslan_combine .main_box.top > .grid_line.pos_center{
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    height: auto;
    transform: translateX(-50%);
    background: repeating-linear-gradient(
        to bottom,
        rgba(204, 204, 204, 1) 0px,
        rgba(204, 204, 204, 1) 6px,
        transparent 6px,
        transparent 12px
    );
}

#aslan_combine .main_box.top > .cross_deco{
    position: absolute;
    z-index: 1;
}

#aslan_combine .main_box.top > .cross_deco.pos_tl{
    top: 114px;
    left: -16px;
}

#aslan_combine .main_box.top > .cross_deco.pos_tr{
    top: 114px;
    right: -16px;
}

#aslan_combine .main_box.top > .cross_deco.pos_bl{
    bottom: -16px;
    left: -16px;
    clip-path: inset(0 0 0 50%);
}

#aslan_combine .main_box.top > .cross_deco.pos_br{
    bottom: -16px;
    right: -16px;
    clip-path: inset(0 47% 0 0);
}

#aslan_combine .mbt_item{
    width: 50%;
}

#aslan_combine .mbt_item.left{
    padding: 60px;
    display: flex;
    flex-direction: column;
    gap: 100px;
}

#aslan_combine .ac_main_tit{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#aslan_combine .ac_main_tit .cate{
    font-family: Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: rgba(149, 149, 149, 1);
    letter-spacing: -0.02em;
}

#aslan_combine .ac_main_tit h2{
    font-size: 44px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.02em;
    padding-top: 32px;
}

#aslan_combine .mbt_item.right{
    padding: 40px;
}

#aslan_combine .grid_deco .grid_line.vrt_dash{
    background: repeating-linear-gradient(
        to bottom,
        rgba(204, 204, 204, 1) 0px,
        rgba(204, 204, 204, 1) 6px,
        transparent 6px,
        transparent 12px
    );
}

#aslan_combine .aslan_combine_slide_area{
    width: 100%;
    padding: 28px 36px;
    background: rgba(188, 188, 207, 1);
    box-sizing: border-box;
    position: relative;
}

#aslan_combine .aslan_combine_slide_area > .corner_dot{
    position: absolute;
    width: 4px;
    height: 4px;
    background: #111;
    z-index: 1;
}

#aslan_combine .aslan_combine_slide_area > .corner_dot.dot_tl{
    top: 0;
    left: 0;
}

#aslan_combine .aslan_combine_slide_area > .corner_dot.dot_tr{
    top: 0;
    right: 0;
}

#aslan_combine .aslan_combine_slide_area > .corner_dot.dot_bl{
    bottom: 0;
    left: 0;
}

#aslan_combine .aslan_combine_slide_area > .corner_dot.dot_br{
    bottom: 0;
    right: 0;
}

#aslan_combine .aslan_combine_slide{
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    --acs-fade-offset: 20px;
}

#aslan_combine .aslan_combine_slide[data-acs-direction="prev"]{
    --acs-fade-offset: -20px;
}

#aslan_combine .aslan_combine_slide .swiper-wrapper{
    align-items: stretch;
}

#aslan_combine .aslan_combine_slide .swiper-slide{
    position: relative;
    display: flex;
    flex-direction: column;
    height: auto;
    box-sizing: border-box;
}

#aslan_combine .acs_quote img{
    width: 52px;
    height: auto;
    display: block;
}

#aslan_combine .acs_logo{
    position: absolute;
    right: 0;
    top: 0;
}

#aslan_combine .acs_logo img{
    width: 120px;
    height: auto;
    display: block;
}

#aslan_combine .acs_content{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex: 1;
    padding-right: 136px;
    padding-top: 90px;
    margin-bottom: 24px;
    background: url('../img/common/db_quotes01.svg') no-repeat;
    background-size: 44px auto;
    overflow: hidden;
}

#aslan_combine .acs_content p{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    word-break: break-word;
    opacity: 0;
    transform: translateY(var(--acs-fade-offset, 20px));
    transition: opacity 0.6s ease 1.3s, transform 0.6s ease 1.3s;
}

#aslan_combine .swiper-slide-active .acs_content p{
    opacity: 1;
    transform: translateY(0);
}

#aslan_combine .acs_info{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-top: 24px;
    border-top: 1px solid rgba(100, 99, 109, 0.16);
    padding-right: 100px;
    overflow: hidden;
}

#aslan_combine .acs_info_left{
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transform: translateY(var(--acs-fade-offset, 20px));
    transition: opacity 0.5s ease 0.8s, transform 0.5s ease 0.8s;
}

#aslan_combine .swiper-slide-active .acs_info_left{
    opacity: 1;
    transform: translateY(0);
}

#aslan_combine .acs_info_left strong{
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #111;
}

#aslan_combine .acs_info_left span{
    font-size: 15px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -0.02em;
    color: rgba(17, 17, 17, 0.45);
}

#aslan_combine .acs_fraction{
    position: absolute;
    width: max-content;
    height: max-content;
    right: 0;
    left: auto;
    z-index: 2;
    font-size: 14px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.4);
}

#aslan_combine .acs_bottom{
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    width: max-content;
    justify-content: flex-end;
    align-items: center;
    z-index: 10;
}

#aslan_combine .acs_nav{
    display: flex;
    gap: 10px;
}

#aslan_combine .acs_nav button{
    width: 44px;
    height: 44px;
    border: 0;
    padding: 0;
    background: #111;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 200;
    line-height: 1;
    color: #fff;
    transition: opacity 0.2s ease, background 0.2s ease, color 0.2s ease;
}

#aslan_combine .acs_nav button span{
    display: block;
    transform: translateY(-1px);
}

#aslan_combine .acs_nav button.acs_next{
    background: #111;
    color: #fff;
}

#aslan_combine .acs_nav button.is_disabled{
    background: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.2);
    cursor: default;
    pointer-events: none;
}

#aslan_combine .acs_nav button:not(.is_disabled):hover{
    opacity: 0.9;
}

#aslan_combine .main_box.bot{
    position: relative;
    padding: 70px 0 50px 0;
}

#aslan_combine .main_box.bot > .cross_deco.pos_bl{
    position: absolute;
    bottom: -16px;
    left: -16px;
}

#aslan_combine .main_box.bot > .cross_deco.pos_br{
    position: absolute;
    bottom: -16px;
    right: -16px;
}

#aslan_combine .main_box.bot::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(100, 99, 109, 0.16);
}

#aslan_combine .aslan_part_slide_area{
    width: 100%;
    overflow: hidden;
}

#aslan_combine .aslan_part_slide{
    width: 100%;
    overflow: hidden;
}

#aslan_combine .aslan_part_slide .swiper-wrapper{
    display: flex;
    gap: 16px;
    width: max-content;
    will-change: transform;
    animation: apsMarquee 1s linear infinite;
    animation-play-state: running;
}

@media (hover: hover) and (pointer: fine){
    #aslan_combine .aslan_part_slide:hover .swiper-wrapper{
        animation-play-state: paused;
    }
}

@keyframes apsMarquee{
    0%{ transform: translateX(0); }
    100%{ transform: translateX(var(--aps-set-width, -50%)); }
}

@keyframes apsMarqueeY{
    0%{ transform: translateY(0); }
    100%{ transform: translateY(var(--aps-set-height, -50%)); }
}

#aslan_combine .aslan_part_slide .swiper-slide{
    width: auto;
    height: auto;
    flex-shrink: 0;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#aslan_combine .aps_item{
    min-height: 104px;
    padding: 24px 120px 24px 30px;
    background: rgba(48, 48, 48, 1);
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    grid-template-areas:
        "num tit"
        ". desc";
    column-gap: 14px;
    row-gap: 8px;
    align-content: center;
    align-items: start;
    backface-visibility: hidden;
}

#aslan_combine .aslan_part_slide .swiper-slide[data-aps-set-start] .aps_item{
    border-left: 1px solid rgba(255,255,255,0.15);
}

#aslan_combine .aps_item .aps_num{
    grid-area: num;
    font-family: 'Reddit Sans', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: rgba(255,255,255,0.5);
    line-height: 1.4;
}

#aslan_combine .aps_item .aps_tit{
    grid-area: tit;
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.02em;
    line-height: 1.4;
}

#aslan_combine .aps_item .aps_desc{
    grid-area: desc;
    margin: 0;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255,255,255,0.6);
    line-height: 1.5;
    letter-spacing: -0.01em;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden; 
}

/* aslan_consultLink */

#aslan_consultLink .ascl_container{
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

#aslan_consultLink .ascl_vline{
    position: absolute;
    top: 0;
    width: 1px;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        rgba(204, 204, 204, 1) 0,
        rgba(204, 204, 204, 1) 3px,
        transparent 3px,
        transparent 6px
    );
    pointer-events: none;
}

#aslan_consultLink .ascl_vline_l{ left: 0; }
#aslan_consultLink .ascl_vline_c{ left: 50%; }
#aslan_consultLink .ascl_vline_r{ right: 0; }

#aslan_consultLink .ascl_item{
    position: relative;
    padding: 72px 55px;
    width: 50%;
    display: flex;
    align-items: center;
}

#aslan_consultLink .ascl_corner{
    position: absolute;
    width: 16px;
    height: 16px;
    pointer-events: none;
}

#aslan_consultLink .ascl_tl{
    top: 0;
    left: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.3);
    border-left: 1px solid rgba(0, 0, 0, 0.3);
}

#aslan_consultLink .ascl_tr{
    top: 0;
    right: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.3);
    border-right: 1px solid rgba(0, 0, 0, 0.3);
}

#aslan_consultLink .ascl_bl{
    bottom: 0;
    left: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    border-left: 1px solid rgba(0, 0, 0, 0.3);
}

#aslan_consultLink .ascl_br{
    bottom: 0;
    right: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    border-right: 1px solid rgba(0, 0, 0, 0.3);
}

#aslan_consultLink .ascl_i_tit h2{
    font-size: 24px;
    line-height: 1.4;
    font-weight: 600;
    letter-spacing: -0.02em;
}

#aslan_consultLink .ascl_i_link{
    width: 100%;
}

#aslan_consultLink .ascl_i_link a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 18px 30px;
    gap: 16px;
    background: rgba(235, 235, 235, 1);
    transition: 0.5s;
}

#aslan_consultLink .ascl_i_link a span{
    color: #000;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.25;
}

#aslan_consultLink .ascl_i_link a i{
    position: relative;
    width: 16px;
    height: 16px;
}

#aslan_consultLink .ascl_i_link a i img{
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: auto;
    transition: 0.5s;
}

#aslan_consultLink .ascl_i_link a i img.wh{
    opacity: 0;
}

#aslan_consultLink .ascl_i_link a:hover{
    background: var(--main-brand-color);
}

#aslan_consultLink .ascl_i_link a:hover span{
    color: #fff;
}

#aslan_consultLink .ascl_i_link a:hover i img.bl{
    opacity: 0;
}

#aslan_consultLink .ascl_i_link a:hover i img.wh{
    opacity: 1;
}

/* aslan_ontology */

#aslan_ontology{
    padding: min(180px, 16.6667svh) 0;
    height: 100svh;
    background: url(../img/sub/aslan_ontology_bg.png) center no-repeat;
    background-size: cover;
}

#aslan_ontology .aso_container{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    position: relative;
}

#aslan_ontology .aso_container .blur_txtDeco{
    position: absolute;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

#aslan_ontology .aso_container .blur_txtDeco.num1{
    right: 100px;
    top: 0;
}

#aslan_ontology .aso_container .blur_txtDeco.num2{
    right: 0px;
    top: 130px;
}

#aslan_ontology .aso_container .blur_txtDeco .inner{
    padding: 11px;
}

#aslan_ontology .aso_container .blur_txtDeco figure{
    width: 125px;
    margin: 0 10px 30px 0;
}

#aslan_ontology .aso_main_txt{
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    z-index: 11;
}

#aslan_ontology .aso_main_txt .tit_area{
    display: flex;
    flex-direction: column;
    gap: min(34px, 3.1481vmin);
    word-break: break-word;
}

#aslan_ontology .aso_main_txt .tit_area span{
    font-size: clamp(14px, 1.6667vmin, 18px);
    letter-spacing: -0.02em;
    font-weight: 600;
    color: #fff;
}

#aslan_ontology .aso_main_txt .tit_area h2{
    font-family: Arial, sans-serif;
    font-size: min(80px, 7.4074vmin);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: #fff;
}

#aslan_ontology .aso_sub_txt{
    position: relative;
    z-index: 11;
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

#aslan_ontology .aso_sub_txt .txt_area{
    display: flex;
    flex-direction: column;
    gap: min(20px, 1.8519vmin);
}

#aslan_ontology .aso_sub_txt .txt_area p{
    color: rgba(255, 255, 255, 0.7);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.02em;
}

#aslan_ontology .aso_sub_txt .txt_area p b{
    color: #fff;
    font-weight: 700;
}

/* aslan_video */

#aslan_video{
    position: relative;
    padding: 120px 0 240px 0;
}

#aslan_video > .subPage_234_top_deco{
    position: absolute;
    left: 60px;
    bottom: 60px;
}

#aslan_video .asv_bg_deco_txt{
    position: absolute;
    left: 50%;
    bottom: -100px;
    transform: translateX(-50%);
    width: max-content;
    pointer-events: none;
    user-select: none;
}

#aslan_video .asv_bg_deco_txt strong{
    display: block;
    font-size: 625px;
    line-height: 1;
    font-family: Arial, sans-serif;
    letter-spacing: -0.02rem;
    color: rgba(255, 255, 255, 0.03);
    font-weight: 400;
}

#aslan_video .asvm_container{
    max-width: 1640px;
    display: flex;
    flex-direction: column;
}

#aslan_video .aslan_video_area{
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0 20px;
    margin-top: 50px;
}

#aslan_video .aslan_video_area::before,
#aslan_video .aslan_video_area::after{
    content: '';
    position: absolute;
    top: 0;
    width: 20px;
    height: 100%;
    border-color: rgba(255, 255, 255, 0.2);
    border-style: solid;
}

#aslan_video .aslan_video_area::before{
    left: 0;
    border-width: 1px 0 1px 1px;
}

#aslan_video .aslan_video_area::after{
    right: 0;
    border-width: 1px 1px 1px 0;
}

#aslan_video .aslan_video{
    width: 100%;
    max-width: 1320px;
    display: flex;
    gap: 50px;
}

#aslan_video .asv_main{
    width: 53%;
    display: flex;
    flex-direction: column;
}

.asvm_cont{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: rgba(7, 7, 7, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 28px;
}

.asvm_cont .edd_img{
    width: 100%;
    margin-bottom: 26px;
}

.asvm_cont .edd_img figure{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.asvm_cont .edd_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s;
}

.asvm_cont .edd_img a:hover figure img{
    transform: scale(1.15);
}

.asvm_cont .edd_desc{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.asvm_cont .edd_desc_txt{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.asvm_cont .edd_desc_txt .cate{
    margin-bottom: 18px;
}

.asvm_cont .edd_desc_txt .cate span{
    display: inline-flex;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.27);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    font-size: 12px;
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}

.asvm_cont .edd_desc_txt .tit{
    font-size: 28px;
    line-height: 1.375;
    color: #fff;
    font-weight: 700;
    word-break: break-word;
    padding-right: min(180px, 9.375vw);
}

.asvm_cont .edd_date{
    font-size: 14px;
    font-weight: 500;
    color: rgba(134, 134, 134, 1);
    letter-spacing: -0.2px;
    line-height: 1.5;
}

.asvm_cont .edd_notice{
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}

.asvm_cont .edd_notice strong{
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
    font-weight: 600;
}

.asvm_cont .edd_form_area{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    gap: 25px;
}

.asvm_cont .edd_input_box{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.asvm_cont .edd_form{
    height: 100%;
}

.asvm_cont .edd_form_stack{
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    transition: all .5s;
}

.asvm_cont .edd_form_stack.active{
    border-color: #fff;
}

.asvm_cont .edd_form_stack label{
    padding-right: 16px;
}

.asvm_cont .edd_form_stack label span{
    font-size: 15px;
    line-height: 1.5;
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
}

.asvm_cont .edd_form_stack label span b,
.asvm_cont .edd_input_placeholder b{
    color: var(--main-brand-color);
    font-weight: inherit;
}

.asvm_cont .edd_input_area{
    position: relative;
    flex: 1;
}

.asvm_cont .edd_input_area .edd_input_placeholder{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: rgba(255, 255, 255, 0.3);
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    pointer-events: none;
    cursor: default;
}

.asvm_cont .edd_input_area .edd_txt_input{
    width: 100%;
    height: 54px;
    text-align: right;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
    font-family: var(--font-Pretendard);
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 0;
    outline: none;
}

.asvm_cont .edd_input_area .edd_txt_input:-webkit-autofill,
.asvm_cont .edd_input_area .edd_txt_input:-webkit-autofill:hover,
.asvm_cont .edd_input_area .edd_txt_input:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    -webkit-text-fill-color: #fff;
    transition: background-color 5000s ease-in-out 0s;
}

.asvm_cont .edd_download_notice{
    flex: 1;
    padding: 15px 20px 27px 20px;
    display: flex;
    flex-direction: column;
    background: rgba(27, 27, 27, 1);
}

.asvm_cont .edd_download_notice .download_num{
    font-size: 14px;
    line-height: 1.5;
    color: #fff;
    font-weight: 500;
    margin-bottom: 10px;
}

.asvm_cont .edd_download_notice .download_num span.num{
    color: var(--main-brand-color);
}

.asvm_cont .edd_download_notice .download_list{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.asvm_cont .edd_download_notice .download_list li{
    font-size: 13px;
    color: #fff;
    font-weight: 500;
    line-height: 1.375;
}

.asvm_cont .edd_download_btn{
    width: 100%;
}

.asvm_cont .edd_download_btn button{
    display: flex;
    width: 100%;
    padding: 16px 24px;
    text-align: center;
    justify-content: center;
    background: #fff;
    color: #000;
    font-size: 15px;
    font-weight: 500;
    font-family: var(--font-Pretendard);
    transition: all .3s;
}

.asvm_cont .edd_download_btn button:hover{
    background: var(--main-brand-color);
    color: #fff;
}

#aslan_video .asv_list{
    flex: 1;
    padding-top: 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 80px;
}

#aslan_video .asv_list_inner{
    display: flex;
    flex-direction: column;
}

#aslan_video .asvl_item{
    width: 100%; 
}

#aslan_video .asvl_item:not(:last-child){
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

#aslan_video .asvl_item a{
    display: flex;
    gap: 20px;
}

#aslan_video .asvl_i_img figure{
    overflow: hidden;
    width: 200px;
    aspect-ratio: 16 / 9;
}

#aslan_video .asvl_i_img figure img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.8s;
}

#aslan_video .asvl_item a:hover .asvl_i_img figure img{
    transform: scale(1.15);
}

#aslan_video .asvl_i_desc{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 6px;
}

#aslan_video .asvl_i_desc .tags{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

#aslan_video .asvl_i_desc .tags span{
    display: inline-flex;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.27);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    color: #fff;
    font-weight: 500;
    font-size: 12px;
}

#aslan_video .asvl_i_desc .txt_area{
    width: 100%;
    padding-right: 80px; 
    word-break: break-word;
}

#aslan_video .asvl_i_desc .txt_area h4{
    font-weight: 700;
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
}

#aslan_video .asv_more{
    width: 100%;
}

#aslan_video .asv_more a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 18px 30px;
    gap: 16px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    transition: 0.5s;
}

#aslan_video .asv_more a:hover{
    background: var(--main-brand-color);
}

#aslan_video .asv_more a span{
    color: #fff;
}

#aslan_video .asv_more a i img{
    width: 16px;
    height: auto;
}

.sl_vis_container .tit_area{
    position: relative;
}

.solution_visual{
    padding: 120px 0 70px 0;
}

.solution_visual .grid_deco .grid_line{
    background: rgba(158, 158, 158, 0.4);
}

.sl_vis_container{
    display: flex;
    flex-direction: column;
}

.sl_vis_container .tit_area{
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    text-align: center;
}

.sl_vis_container .tit_area h2{
    font-size: 48px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #fff;
    font-weight: 700;
}

.sl_vis_container .tit_area::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(158, 158, 158, 0.4);
}
#opt_solution_visual .sl_vis_container .tit_area::after{
    display: none;
}

.sl_vis_container .tit_area .cross_deco.wh{
    position: absolute;
    bottom: 0;
    right: calc((100% - 1520px) / 2);
    transform: translate(50%, 50%);
    z-index: 1;
    background: url('../img/common/grid_cross_wh.svg');
    opacity: 0.5;
}

.sl_vis_container .tit_area .deco_txt{
    position: absolute;
    left: 16px;
    bottom: 16px;
    opacity: 0.4;
    width: 190px;
}

.sl_vis_container .vis_area{
    position: relative;
    width: 100%;
    padding: 45px 25px;
    
}

.sl_vis_container .vis_area .vis_area_inner{
    display: flex;
    width: 100%;
}

.sl_vis_container .vis_area_scrollbar{
    display: none;
    position: relative;
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.2);
    margin-top: 22px;
    cursor: pointer;
    touch-action: none;
}

.sl_vis_container .vis_area_scrollbar_thumb{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: rgba(142, 87, 244, 1);
    width: 0;
    cursor: grab;
    will-change: transform, width;
}

.sl_vis_container .vis_area_scrollbar_thumb.is_dragging{
    cursor: grabbing;
}

.sl_vis_container .vis_area .cross_deco.wh.bottom_left{
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%);
    z-index: 1;
    background: url('../img/common/grid_cross_wh.svg');
    opacity: 0.5;
}
.sl_vis_container .vis_area .cross_deco.wh.bottom_right{
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
    z-index: 1;
    background: url('../img/common/grid_cross_wh.svg');
    opacity: 0.5;
}

.sl_vis_container .vis_area::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(158, 158, 158, 0.4);
    pointer-events: none;
}

.sl_vis_container .vis_img{
    display: flex;
    flex-direction: column;
}

.sl_vis_container .vis_img.vi01{
    width: 47%; 
}

.sl_vis_container .vis_img.vi02{
    position: relative;
    z-index: 2;
    flex: 1;
    justify-content: flex-end;
}

.sl_vis_container .vis_img.vi03{
    width: 22%;
}

.sl_vis_container .vis_img .vis_img_box{
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.sl_vis_container .vis_img .vis_img_box.fade_in{
    opacity: 1;
    transform: translateY(0);
}

.sl_vis_container .vis_img.vi01 .vis_img_box{
    margin: 45px 0 170px 0;
}

.sl_vis_container .vis_img.vis_img_box figure{
    width: 100%;
}

.sl_vis_container .vis_img .vis_img_box figure img{
    display: block;
    width: 100%;
}

.sl_vis_container .vis_img.vi02 .vis_img_box figure{
    position: relative;
    width: 100%;
    aspect-ratio: 548 / 456;
}

.sl_vis_container .vis_img.vi02 .vis_img_box figure img{
    position: absolute;
    width: 100%;
    left: 50%;
    bottom: 0;
    transform: translate(-50%) scale(1.2);
    margin-left: -20px;
}

#opt_solution_visual {
    padding: 120px 0;
}

#opt_solution_visual .sl_vis_container .vis_img.vi01,
#opt_solution_visual .sl_vis_container .vis_img.vi02{
    width: auto;
    flex: 1;
}


#opt_solution_visual .sl_vis_container .vis_img.vi02{
    z-index: 2;
}

#opt_solution_visual .sl_vis_container .vis_img.vi03{
    width: 47%;
    z-index: 3;
}

#opt_solution_visual .sl_vis_container .vis_img.vi01 .vis_img_box{
    margin: 0;
}

#opt_solution_visual .sl_vis_container .vis_img.vi01 figure{
    width: auto;
    aspect-ratio: 460 / 380;
}

#opt_solution_visual .sl_vis_container .vis_img.vi02 figure{
    width: auto;
    aspect-ratio: 550 / 460;
}

#opt_solution_visual .sl_vis_container .vis_img.vi02 .vis_img_box figure img{
    margin-left: -10px;
    bottom: 20px;
    transform: translate(-50%) scale(1.45);
}


/* eval_list */

#eval_list{
    padding: 0 0 220px 0;
}

#eval_list .container{
    position: relative;
}

#eval_list .container::before,
#eval_list .container::after{
    content: "";
    position: absolute;
    bottom: -220px;
    width: 1px;
    height: 220px;
    background: rgba(255, 255, 255, 0.05);
    pointer-events: none;
}

#eval_list .container::before{
    left: 0;
}

#eval_list .container::after{
    right: 0;
}

#eval_list .grid_deco .grid_line.vrt{
    background: rgba(255, 255, 255, 0.05);
}

#eval_list .grid_deco .grid_line.pos_left{
    left: -70px;
}

#eval_list .grid_deco .grid_line.pos_left2{
    left: -140px;
}

#eval_list .grid_deco .grid_line.pos_right{
    right: -70px;
}

#eval_list .grid_deco .grid_line.pos_right2{
    right: -140px;
}

#eval_list .eval_deco.top{
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding: 120px 10px 25px 10px;
    border-left: 1px solid rgba(255, 255, 255, 0.05);
    border-right: 1px solid rgba(255, 255, 255, 0.05);
}

#eval_list .eval_deco.top .txtList_deco figure{
    display: block;
}

#eval_list .eval_deco.top .txtList_deco figure img{
    display: block;
}

#eval_list .eval_grid{
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-left: 1px solid rgba(255, 255, 255, 0.05);
}

#eval_list .eval_grid::before,
#eval_list .eval_grid::after{
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(255, 255, 255, 0.05);
    pointer-events: none;
}

#eval_list .eval_grid::before{
    top: 0;
}

#eval_list .eval_grid::after{
    bottom: 0;
}

#eval_list .eval_grid li{
    position: relative;
    padding: 10px;
    border-right: 1px solid rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

#eval_list .eval_grid li:nth-child(odd){
    border-right: none;
}

#eval_list .eval_grid li > .cross_deco{
    position: absolute;
    z-index: 1;
    width: 20px;
    height: 20px;
    background-image: url('../img/common/grid_cross_wh.svg') !important;
}
#eval_list .eval_grid li > .cross_deco.lt{ top: -10px; left: -10px; }
#eval_list .eval_grid li > .cross_deco.rt{ top: -10px; right: -10px; }
#eval_list .eval_grid li > .cross_deco.lb{ bottom: -10px; left: -10px; }
#eval_list .eval_grid li > .cross_deco.rb{ bottom: -10px; right: -10px; }

#eval_list .eval_grid li .eval_list_inner{
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    gap: 27px;
}

#eval_list .eli_img{
    width: max-content;
}

#eval_list .eli_img figure{
    width: 282px;
    aspect-ratio: 282 / 317;
    overflow: hidden;
}

#eval_list .eli_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s;
}

#eval_list .eval_grid li:hover .eli_img figure img{
    transform: scale(1.15);
}

#eval_list .eli_desc{
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 20px 20px 20px 0;
    gap: 20px;
}

#eval_list .eli_desc strong{
    font-size: 22px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
}

#eval_list .eli_desc p{
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: -0.02em;
    font-weight: 500;
    color: rgba(222, 222, 222, 0.7);
    word-break: break-word;
}

/* opt_desc */

#opt_desc{
    padding: 180px 0;
}
#opt_desc .grid_deco .grid_deco_inner{
    max-width: 960px;
}
#opt_desc .grid_deco .grid_line.vrt_line{
    background: rgba(255, 255, 255, 0.1);
}

#opt_desc .optd_container{
    position: relative;
    max-width: 960px;
    padding: 20px 15px;
}

#opt_desc .optd_container::before,
#opt_desc .optd_container::after{
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
}
#opt_desc .optd_container::before{
    top: 0;
}
#opt_desc .optd_container::after{
    bottom: 0;
}
#opt_desc .optd_container .cross_deco.wh{
    position: absolute;
    z-index: 1;
    background: url('../img/common/grid_cross_wh.svg');
    opacity: 0.5;
}
#opt_desc .optd_container .cross_deco.wh.tl{
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
}
#opt_desc .optd_container .cross_deco.wh.tr{
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
}
#opt_desc .optd_container .cross_deco.wh.bl{
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%);
}
#opt_desc .optd_container .cross_deco.wh.br{
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
}

#opt_desc .optd_inner{
    width: 100%;
    display: flex;
    padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

#opt_desc .optd_img{
    width: 375px;
}

#opt_desc .optd_img figure{
    width: 100%;
    aspect-ratio: 375 / 415;
    overflow: hidden;
}

#opt_desc .optd_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#opt_desc .optd_desc{
    flex: 1;
    padding: 30px;
    display: flex;
    flex-direction: column;
    word-break: break-word;
    gap: 20px;
}

#opt_desc .optd_desc h3{
    font-size: 22px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
}

#opt_desc .optd_desc p{
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: -0.02em;
    font-weight: 500;
    color: rgba(222, 222, 222, 0.7);
}

/* techBlog */

#techBlog_main{
    padding-top: 85px;
}

#techBlog_main .tbm_container{
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
}

#techBlog_main .tbm_container::before{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background-image: linear-gradient(to bottom, rgba(43, 43, 43, 1) 6px, transparent 6px);
    background-size: 1px 12px;
    background-repeat: repeat-y;
    transform: translateX(-50%);
    pointer-events: none;
}

#techBlog_main .tbm_box{
    width: 100%;
    display: flex;
}

#techBlog_main .tbm_box.top{
    flex: 1;
    position: relative;
}

#techBlog_main .tbm_box.top::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(43, 43, 43, 1);
    pointer-events: none;
}

#techBlog_main .tbm_box.bot{
    height: 55%;
    position: relative;
}

#techBlog_main .tbm_box.bot::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(43, 43, 43, 1);
    pointer-events: none;
}

#techBlog_main .tbm_box .left,
#techBlog_main .tbm_box .right{
    width: 50%;
    position: relative;
}

#techBlog_main .tbm_box.top .left{
    padding: 0px 50px 50px 0;
}

#techBlog_main .tbm_box.top .right .cross_deco{
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate(-50%, 50%);
    z-index: 1;
}

#techBlog_main .tbm_box.top .right .subPage_234_top_deco{
    position: absolute;
    right: 0;
    top: 40px;
    width: auto;
}

#techBlog_main .tbm_box.top .right .subPage_234_top_deco .txt{
    padding: 0;
}

#techBlog_main .tbm_tit_area{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

#techBlog_main .tbm_tit{
    width: 100%;
}

#techBlog_main .tbm_tit h2{
    font-size: clamp(40px, calc(5.6818vw - 9.0909px), 100px);
    font-family: Arial, sans-serif;
    color: rgba(247, 247, 247, 1);
    letter-spacing: -0.02em;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 160px;;
}

#techBlog_main .tbm_tit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#techBlog_main .tbm_tit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#techBlog_main .tbm_box.bot .right{
    padding: 16px;
    position: relative;
}

#techBlog_main .tbm_news_area{
    padding: 50px 36px 36px 0;
}

#techBlog_main .tbm_news_area .txt_area{
    width: 100%;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

#techBlog_main .tbm_news_area .txt_area.fade_in{
    opacity: 1;
    transform: translateY(0);
}

#techBlog_main .tbm_news_area .cate{
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

#techBlog_main .tbm_news_area .cate span{
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    color: rgba(178, 137, 255, 1);
}

#techBlog_main .tbm_news_area .tit{
    font-size: 32px;
    line-height: 1.2;
    font-weight: 700;
    color: #fff;
    margin-top: 14px;
}

#techBlog_main .tbm_news_area .desc{
    margin-top: 16px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.5);
}

#techBlog_main .tbm_news_area .link{
    position: relative;
    display: inline-block;
    margin-top: 52px;
    width: max-content;
}

#techBlog_main .tbm_news_area .link a{
    width: max-content;
    display: flex;
    align-items: center;
    gap: 60px;
    padding: 12px 22px 12px 16px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(27px);
    -webkit-backdrop-filter: blur(27px);
    color: #fff;
    text-transform: uppercase;
    border: 1px solid rgba(126, 126, 126, 1);
    clip-path: polygon(-1px -1px, calc(100% + 1px) -1px, calc(100% + 1px) calc(100% - 15px), calc(100% - 15px) calc(100% + 1px), -1px calc(100% + 1px));
}

#techBlog_main .tbm_news_area .link a i{
    width: 6px;
}

#techBlog_main .tbm_news_area .link::after{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 15px;
    height: 15px;
    background: linear-gradient(
        to bottom right,
        transparent calc(50% - 0.5px),
        rgba(126, 126, 126, 1) calc(50% - 0.5px),
        rgba(126, 126, 126, 1) calc(50% + 0.5px),
        transparent calc(50% + 0.5px)
    );
    pointer-events: none;
}

#techBlog_main .tbm_box.bot .right .tbm_img{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 4px;
}

#techBlog_main .tbm_box.bot .right .tbm_img figure{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#techBlog_main .tbm_box.bot .right .tbm_img figure img{
    width: 100%;
    height: 100%;
    max-height: 520px;
    object-fit: cover;
    object-position: center top;
    display: block;
}

#techBlog_main .tbm_box.bot .right .blur_txtDeco{
    position: absolute;
    left: 160px;
    top: -45px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

#techBlog_main .tbm_box.bot .right .blur_txtDeco .inner{
    padding: 11px;    
}

#techBlog_main .tbm_box.bot .right .blur_txtDeco figure{
    margin-bottom: 30px;
    width: 125px;
}

/* techblog_contents */

#techBlog_contents{
    padding: 120px 0;
}

#techBlog_contents .techBlog_article_area{
    width: 100%;
}

#techBlog_contents .tba_top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
    width: 100%;
    padding-bottom: 60px;
}

#techBlog_contents .tba_top .left{
    flex: 1 1 auto;
    min-width: 0;
}

#techBlog_contents .tba_top .right{
    flex: 0 0 auto;
}

#techBlog_contents .tba_top .filter_area{
    width: 100%;
}

#techBlog_contents .tba_top .filter_area ul{
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
}

#techBlog_contents .tba_top .filter_area ul li button{
    display: flex;
    align-items: center;
    padding: 4px 0;
}

#techBlog_contents .tba_top .filter_area ul li button span{
    display: block;
    color: rgba(142, 142, 142, 1);
    font-size: 16px;
    font-weight: 500;
    transition: color .4s;
}

#techBlog_contents .tba_top .filter_area ul li:hover button span,
#techBlog_contents .tba_top .filter_area ul li.active button span{
    color: #fff;
}

#techBlog_contents .tba_search{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 280px;
    height: 48px;
    padding: 0 16px;
    background: rgba(246, 246, 246, 0.1);
    transition: border-color .3s;
}

#techBlog_contents .tba_search:focus-within{
    border-color: rgba(90, 90, 90, 1);
}

#techBlog_contents .tba_search .search_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity .3s;
}

#techBlog_contents .tba_search .search_btn:hover{
    opacity: .7;
}

#techBlog_contents .tba_search .search_btn img{
    width: 18px;
    height: 18px;
    object-fit: contain;
}

#techBlog_contents .tba_search input{
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 100%;
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

#techBlog_contents .tba_search input::placeholder{
    color: rgba(134, 139, 148, 1);
    letter-spacing: -0.02em;
}

#techBlog_contents .tba_bot{
    width: 100%;
}

#techBlog_contents .tba_list{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 100px 24px;
    width: 100%;
}

#techBlog_contents .tba_list li a{
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

#techBlog_contents .tba_list .img{
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

#techBlog_contents .tba_list .img figure{
    width: 100%;
    height: 100%;
}

#techBlog_contents .tba_list .img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

#techBlog_contents .tba_list li a:hover .img figure img{
    transform: scale(1.08);
}

#techBlog_contents .tba_list .txt_area{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

#techBlog_contents .tba_list .meta{
    display: flex;
    align-items: center;
    gap: 6px;
}

#techBlog_contents .tba_list .meta .cate{
    display: inline-flex;
    align-items: center;
    padding: 6px 8px;
    background: rgba(109, 60, 236, 1);
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
}

#techBlog_contents .tba_list .meta .date{
    display: inline-flex;
    align-items: center;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
    font-size: 12px;
    font-weight: 400;
}

#techBlog_contents .tba_list .tit{
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .3s;
}

#techBlog_contents .view_more{
    position: relative;
    width: 100%;
    margin-top: 100px;
    display: flex;
    justify-content: center;
}

#techBlog_contents .view_more button{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 24px;
    color: #000;
    background: #fff;
    font-weight: 500;
    font-size: 15px;
    width: 100%;
    height: 50px;
    max-width: 192px;
    transition: all .5s;
    margin: 0 auto;
}

#techBlog_contents .view_more button:hover{
    background: var(--main-brand-color);
    color: #fff;
}

/* contact_main */

#contact_main{
    padding: 85px 0 150px 0;
    overflow: clip;
}

#contact_main .cm_container{
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
}

#contact_main .cm_container::before{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background-image: linear-gradient(to bottom, rgba(43, 43, 43, 1) 6px, transparent 6px);
    background-size: 1px 12px;
    background-repeat: repeat-y;
    transform: translateX(-50%);
    pointer-events: none;
}

#contact_main .cm_box{
    width: 100%;
    display: flex;
}

#contact_main .cm_box.top{
    flex: 1;
    position: relative;
}

#contact_main .cm_box.top::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(43, 43, 43, 1);
    pointer-events: none;
}

#contact_main .cm_box.bot{
    position: relative;
}
/* 
#contact_main .cm_box.bot::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(43, 43, 43, 1);
    pointer-events: none;
} */

#contact_main .cm_box .left,
#contact_main .cm_box .right{
    width: 50%;
    position: relative;
}

#contact_main .cm_box.top .left{
    padding: 0px 50px 50px 0;
}

#contact_main .cm_box.top .right .cross_deco{
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate(-50%, 50%);
    z-index: 1;
}

#contact_main .cm_box.top .right .subPage_234_top_deco{
    position: absolute;
    right: 0;
    top: 40px;
    width: auto;
}

#contact_main .cm_box.top .right .subPage_234_top_deco .txt{
    padding: 0;
}

#contact_main .cm_tit_area{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

#contact_main .cm_tit{
    width: 100%;
}

#contact_main .cm_tit h2{
    font-size: clamp(40px, calc(5.6818vw - 9.0909px), 100px);
    font-family: Arial, sans-serif;
    color: rgba(247, 247, 247, 1);
    letter-spacing: -0.02em;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 160px;
}

#contact_main .cm_tit h2 .char{
    display: inline-block;
    opacity: 0;
    filter: blur(min(12px, 0.625vw));
    transition: opacity 0.6s cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}

#contact_main .cm_tit h2 .char.revealed{
    opacity: 1;
    filter: blur(0);
}

#contact_main .contact_progress{
    position: sticky;
    left: 0;
    top: 100px;
    width: 100%;
    padding: 60px 60px 0 0;
    display: flex;
    flex-direction: column;
}

#contact_main .ctpg_top{
    width: 100%;
}

#contact_main .ctpg_top .ctpg_img{
    width: 100%;
    max-width: 260px;
    aspect-ratio: 260 / 126;
    overflow: hidden;
}

#contact_main .ctpg_top .ctpg_img figure{
    width: 100%;
    height: 100%;
}

#contact_main .ctpg_top .ctpg_img figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#contact_main .ctpg_top .ctpg_txt{
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    letter-spacing: -0.01em;
}

#contact_main .ctpg_indicator{
    width: 100%;
    margin-top: 100px;
}

#contact_main .ctpg_indi_list{
    display: flex;
    width: 100%;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}

#contact_main .ctpg_indi_item{
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    opacity: 0.3;
    transition: opacity 0.4s ease;
}

#contact_main .ctpg_indi_item.is-active,
#contact_main .ctpg_indi_item.is-filled,
#contact_main .ctpg_indi_item.is-scroll-active{
    opacity: 1;
}

#contact_main .ctpg_indi_bar{
    position: relative;
    display: block;
    width: 100%;
    height: 2px;
    background: rgba(255, 255, 255, 0.5);
    overflow: hidden;
    transition: height 0.3s ease;
}

#contact_main .ctpg_indi_bar i{
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0%;
    background: #fff;
    transition: width 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* #contact_main .ctpg_indi_item.is-active .ctpg_indi_bar,
#contact_main .ctpg_indi_item.is-filled .ctpg_indi_bar{
    height: 2px;
} */

#contact_main .ctpg_indi_item.is-active .ctpg_indi_bar i,
#contact_main .ctpg_indi_item.is-filled .ctpg_indi_bar i,
#contact_main .ctpg_indi_item.is-scroll-active .ctpg_indi_bar i{
    width: 100%;
}

#contact_main .ctpg_indi_num{
    margin-top: 20px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.04em;
    line-height: 1;
}

#contact_main .ctpg_indi_name{
    margin-top: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    letter-spacing: -0.01em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#contact_main .contact_form_area{
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 60px 0 0 60px;
}

#contact_main .cfa_form{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 80px;
}

#contact_main .cfa_item{
    width: 100%;
    opacity: 0.3;
    transition: opacity 0.4s ease;
}

#contact_main .cfa_item.active{
    opacity: 1;
}
/* 
#contact_main .cfa_item:not(.active) .cfa_field input,
#contact_main .cfa_item:not(.active) .cfa_field textarea{
    cursor: not-allowed;
} */

#contact_main .cfa_field input:disabled,
#contact_main .cfa_field textarea:disabled{
    color: #fff;
    -webkit-text-fill-color: #fff;
    opacity: 1;
}

#contact_main .cfa_num{
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.2);
}

#contact_main .cfa_num b{
    font-weight: inherit;
    color: #fff;
}

#contact_main .cfa_num i{
    font-style: normal;
    margin: 0 2px;
    color: rgba(255, 255, 255, 0.3);
}

#contact_main .cfa_tit{
    display: block;
    margin-top: 14px;
    font-size: 24px;
    line-height: 1.5;
    font-weight: 500;
    color: #fff;
    word-break: break-word;
}

#contact_main .cfa_field{
    position: relative;
    margin-top: 24px;
    width: 100%;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

#contact_main .cfa_item[data-step="6"] .cfa_field{
    padding-bottom: 0;
    padding-top: 12px;
    border-bottom: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

#contact_main .cfa_item[data-step="6"] .cfa_field .cfa_placeholder{
    top: 12px;
}

#contact_main .cfa_submit{
    margin-top: 80px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 24px;
    background: rgba(255, 255, 255, 1);
    border: 0;
    color: #000;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.5s;
}

#contact_main .cfa_submit .cfa_submit_txt{
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.5;
    color: #000;
    transition: color 0.5s;
}

#contact_main .cfa_submit:hover:not(:disabled){
    background: var(--main-brand-color);
}

#contact_main .cfa_submit:hover:not(:disabled) .cfa_submit_txt{
    color: #fff;
}

#contact_main .cfa_submit:disabled{
    cursor: not-allowed;
    opacity: 0.35;
}

#contact_main .cfa_field input,
#contact_main .cfa_field textarea{
    display: block;
    width: 100%;
    background: transparent;
    border: 0;
    outline: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    padding: 0;
    font-family: inherit;
    resize: none;
}

#contact_main .cfa_field textarea{
    height: 240px;
}

#contact_main .cfa_field .cfa_placeholder{
    position: absolute;
    left: 0;
    top: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    pointer-events: none;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.3);
    transition: opacity 0.3s ease;
}

#contact_main .cfa_item.filled .cfa_field .cfa_placeholder{
    opacity: 0;
}

#contact_main .cfa_field .cfa_star{
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 500;
    color: rgba(178, 137, 255, 1);
    line-height: 1;
}

/* techblog_post */

#techblog_post{
    padding: 100px 0;
}

#techblog_post .tbp_container{
    max-width: 900px;
    display: flex;
    flex-direction: column;
}

#techblog_post .tbp_top{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0px;
    border-bottom: 1px solid rgba(229, 229, 229, 1);
    text-align: center;
    word-break: break-word;
    margin-bottom: 60px;
}

#techblog_post .tbp_top .cate{
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: rgba(142, 87, 244, 1);
}

#techblog_post .tbp_top .tit{
    font-size: 38px;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
    margin: 20px 0;
}

#techblog_post .tbp_top .info{
    width: max-content;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#techblog_post .tbp_top .info .name{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: #fff;
}

#techblog_post .tbp_top .info .date{
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: rgba(122, 122, 122, 1);
}

#techblog_post .tbp_content{
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 0px 100px 100px 100px;
    margin-bottom: 60px;
    gap: 60px;
    border-bottom: 1px solid rgba(229, 229, 229, 1);
}

#techblog_post .tbp_content .tbp_img{
    width: 100%;
}

#techblog_post .tbp_content .tbp_img figure{
    width: 100%;
}

#techblog_post .tbp_content .tbp_img figure img{
    display: block;
    width: 100%;
}

#techblog_post .tbp_content .tbp_text{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#techblog_post .tbp_content .tbp_text p{

}

#techblog_post .tbp_content .tbp_text strong{
    display: block;
    font-size: 28px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: #fff;
    margin-bottom: 14px;
}

#techblog_post .tbp_content .tbp_text p{
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.7);
}

/* ── Toast UI 에디터 콘텐츠 스타일 ── */
#techblog_post .tbp_content .tbp_text a {
    color: #a87af7;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(168, 122, 247, 0.5);
    transition: color 0.2s, text-decoration-color 0.2s;
    word-break: break-word;
}
#techblog_post .tbp_content .tbp_text a:hover {
    color: #c4a0ff;
    text-decoration-color: rgba(196, 160, 255, 0.8);
}
#techblog_post .tbp_content .tbp_text h1,
#techblog_post .tbp_content .tbp_text h2,
#techblog_post .tbp_content .tbp_text h3,
#techblog_post .tbp_content .tbp_text h4,
#techblog_post .tbp_content .tbp_text h5,
#techblog_post .tbp_content .tbp_text h6 {
    color: #fff;
    font-weight: 700;
    line-height: 1.4;
    margin: 1.4em 0 0.6em;
}
#techblog_post .tbp_content .tbp_text h1 { font-size: 32px; }
#techblog_post .tbp_content .tbp_text h2 { font-size: 26px; }
#techblog_post .tbp_content .tbp_text h3 { font-size: 22px; }
#techblog_post .tbp_content .tbp_text h4 { font-size: 18px; }
#techblog_post .tbp_content .tbp_text ul,
#techblog_post .tbp_content .tbp_text ol {
    padding-left: 1.5em;
    margin: 0.8em 0;
    color: rgba(255,255,255,0.75);
    font-size: 18px;
    line-height: 1.7;
}
#techblog_post .tbp_content .tbp_text ul { list-style: disc; }
#techblog_post .tbp_content .tbp_text ol { list-style: decimal; }
#techblog_post .tbp_content .tbp_text li { margin: 0.3em 0; }
#techblog_post .tbp_content .tbp_text blockquote {
    margin: 1em 0;
    padding: 12px 20px;
    border-left: 4px solid #8e57f4;
    background: rgba(142, 87, 244, 0.08);
    color: rgba(255,255,255,0.7);
    font-style: italic;
    border-radius: 0 6px 6px 0;
}
#techblog_post .tbp_content .tbp_text code {
    background: rgba(255,255,255,0.1);
    color: #c4a0ff;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
    font-family: 'Courier New', monospace;
}
#techblog_post .tbp_content .tbp_text pre {
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 16px 20px;
    overflow-x: auto;
    margin: 1em 0;
}
#techblog_post .tbp_content .tbp_text pre code {
    background: none;
    padding: 0;
    color: #e2e8f0;
    font-size: 14px;
    line-height: 1.6;
}
#techblog_post .tbp_content .tbp_text img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 0.5em 0;
}
#techblog_post .tbp_content .tbp_text hr {
    border: none;
    border-top: 1px solid rgba(255,255,255,0.15);
    margin: 2em 0;
}
#techblog_post .tbp_content .tbp_text table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
    font-size: 16px;
}
#techblog_post .tbp_content .tbp_text th {
    background: rgba(142, 87, 244, 0.2);
    color: #fff;
    font-weight: 600;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.15);
    text-align: left;
}
#techblog_post .tbp_content .tbp_text td {
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.75);
}
#techblog_post .tbp_content .tbp_text tr:hover td {
    background: rgba(255,255,255,0.04);
}

#techblog_post .tbp_recentPost{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#techblog_post .tbpr_top{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#techblog_post .tbpr_top h3{
    font-size: 24px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: rgba(33, 33, 36, 1);
}

#techblog_post .tbpr_bot{
    width: 100%;
    margin-top: 32px;
    padding: 0 70px;
    position: relative;
}

#techblog_post .tbpr_slide{
    position: relative;
    overflow: hidden;
}

#techblog_post .tbpr_slide .swiper-slide{
    height: auto;
}

#techblog_post .tbpr_slide .swiper-slide a{
    display: flex;
    flex-direction: column;
    width: 100%;
}

#techblog_post .tbpr_slide .swiper-slide a .img{
    width: 100%;
}

#techblog_post .tbpr_slide .swiper-slide a .img figure{
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    aspect-ratio: 372 / 248;
}

#techblog_post .tbpr_slide .swiper-slide a .img figure img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.8s;
}

#techblog_post .tbpr_slide .swiper-slide a:hover .img figure img{
    transform: scale(1.15);
}

#techblog_post .tbpr_slide .swiper-slide a .desc{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    word-break: break-word;
}

#techblog_post .tbpr_slide .swiper-slide a .desc h4{
    font-size: 20px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: rgba(33, 33, 36, 1);
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#techblog_post .tbpr_slide .swiper-slide a .desc .date{
    display: block;
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    color: rgba(122, 122, 122, 1);
    letter-spacing: -0.02em;
}

#techblog_post .tbpr_slide .swiper-slide a .cate_area{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 16px;
}

#techblog_post .tbpr_slide .swiper-slide a .cate_area span{
    display: flex;
    padding: 6px 14px;
    text-align: center;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: -0.02em;
    font-weight: 400;
    width: max-content;
}

#techblog_post .tbpr_slide .swiper-slide a .cate_area .cate{
    background: rgba(142, 87, 244, 0.1);
    color: rgba(142, 87, 244, 1);
}

#techblog_post .tbpr_slide .swiper-slide a .cate_area .name{
    background: rgba(242, 243, 246, 1);
    color: rgba(122, 122, 122, 1);
    text-transform: capitalize;
}

#techblog_post .tbpr_bot > button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    border: none;
    background: rgba(242, 243, 246, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: rgba(180, 180, 185, 1);
    transition: background 0.3s, color 0.3s;
}

#techblog_post .tbpr_bot > .tbpr_prev{
    left: 0;
}

#techblog_post .tbpr_bot > .tbpr_next{
    right: 0;
}

#techblog_post .tbpr_bot > button:hover{
    background: rgba(230, 231, 235, 1);
    color: rgba(140, 140, 145, 1);
}

#techblog_post .tbpr_bot > button.swiper-button-disabled{
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}

/* tbp_share aside */
#techblog_post .tbp_content{
    position: relative;
}

#techblog_post .tbp_share{
    position: absolute;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
}

#techblog_post .tbp_share.is_fixed{
    position: fixed;
}

#techblog_post .tbp_share.is_bottom{
    position: absolute;
    bottom: 100px; /* tbp_content padding-bottom */
    top: auto !important;
    right: 0;
}

#techblog_post .tbp_share .share_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(35, 35, 35, 1);
    cursor: pointer;
    transition: background 0.2s;
    /* border: 1px solid rgba(238, 238, 238, 1); */
}

#techblog_post .tbp_share .share_btn:hover{
    background: var(--main-brand-color);
}

#techblog_post .tbp_share .share_btn img{
    display: block;
}

#techblog_post .tbp_share .share_btn.linkedin img{
    width: 27px;
    height: auto;
    filter: invert(1) brightness(1.8);
}

#techblog_post .tbp_share .share_btn.upload img{
    width: 20px;
    height: auto;
    filter: invert(1) brightness(1.8);
}

/* caseStudies_post */

#caseStudies_post{
    padding: 100px 0;
}

#caseStudies_post .csp_container{
    max-width: 900px;
    display: flex;
    flex-direction: column;
}

#caseStudies_post .csp_top{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0px;
    border-bottom: 1px solid rgba(229, 229, 229, 1);
    text-align: center;
    word-break: break-word;
    margin-bottom: 60px;
}

#caseStudies_post .csp_top .cate{
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: rgba(142, 87, 244, 1);
}

#caseStudies_post .csp_top .tit{
    font-size: 38px;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
    margin: 20px 0;
}

#caseStudies_post .csp_top .info{
    width: max-content;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#caseStudies_post .csp_top .info .name{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: #fff;
}

#caseStudies_post .csp_top .info .date{
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: rgba(122, 122, 122, 1);
}

#caseStudies_post .csp_content{
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 0px 100px 100px 100px;
    margin-bottom: 60px;
    gap: 60px;
    border-bottom: 1px solid rgba(229, 229, 229, 1);
    position: relative;
}

#caseStudies_post .csp_content .csp_img{
    width: 100%;
}

#caseStudies_post .csp_content .csp_img figure{
    width: 100%;
}

#caseStudies_post .csp_content .csp_img figure img{
    display: block;
    width: 100%;
}

#caseStudies_post .csp_content .csp_text{
    width: 100%;
    display: flex;
    flex-direction: column;
    white-space: pre-wrap;
    line-height: 1.8;
    letter-spacing: -0.01em;
    word-break: break-word;
}

#caseStudies_post .csp_content .csp_text strong{
    display: block;
    font-size: 28px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: #fff !important;
    margin-bottom: 14px;
}

#caseStudies_post .csp_content .csp_text p{
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.7) !important;
}

/* ── 케이스스터디 에디터 콘텐츠 스타일 ── */
#caseStudies_post .csp_content .csp_text *{
    color: rgba(255, 255, 255, 0.85) !important;
}
#caseStudies_post .csp_content .csp_text a {
    color: #a87af7;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(168, 122, 247, 0.5);
    transition: color 0.2s;
    word-break: break-word;
}
#caseStudies_post .csp_content .csp_text a:hover {
    color: #c4a0ff;
}
#caseStudies_post .csp_content .csp_text h1,
#caseStudies_post .csp_content .csp_text h2,
#caseStudies_post .csp_content .csp_text h3,
#caseStudies_post .csp_content .csp_text h4,
#caseStudies_post .csp_content .csp_text h5,
#caseStudies_post .csp_content .csp_text h6 {
    color: #fff;
    font-weight: 700;
    line-height: 1.4;
    margin: 1.4em 0 0.6em;
}
#caseStudies_post .csp_content .csp_text h1 { font-size: 32px; }
#caseStudies_post .csp_content .csp_text h2 { font-size: 26px; }
#caseStudies_post .csp_content .csp_text h3 { font-size: 22px; }
#caseStudies_post .csp_content .csp_text h4 { font-size: 18px; }
#caseStudies_post .csp_content .csp_text ul,
#caseStudies_post .csp_content .csp_text ol {
    padding-left: 1.5em;
    margin: 0.8em 0;
    color: rgba(255,255,255,0.75);
    font-size: 18px;
    line-height: 1.7;
}
#caseStudies_post .csp_content .csp_text ul { list-style: disc; }
#caseStudies_post .csp_content .csp_text ol { list-style: decimal; }
#caseStudies_post .csp_content .csp_text li { margin: 0.3em 0; }
#caseStudies_post .csp_content .csp_text blockquote {
    margin: 1em 0;
    padding: 12px 20px;
    border-left: 4px solid #8e57f4;
    background: rgba(142, 87, 244, 0.08);
    color: rgba(255,255,255,0.7);
    font-style: italic;
    border-radius: 0 6px 6px 0;
}
#caseStudies_post .csp_content .csp_text code {
    background: rgba(255,255,255,0.1);
    color: #c4a0ff;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
    font-family: 'Courier New', monospace;
}
#caseStudies_post .csp_content .csp_text pre {
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 16px 20px;
    overflow-x: auto;
    margin: 1em 0;
}
#caseStudies_post .csp_content .csp_text pre code {
    background: none;
    padding: 0;
    color: #e2e8f0;
    font-size: 14px;
    line-height: 1.6;
}
#caseStudies_post .csp_content .csp_text img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 0.5em 0;
}
#caseStudies_post .csp_content .csp_text hr {
    border: none;
    border-top: 1px solid rgba(255,255,255,0.15);
    margin: 2em 0;
}
#caseStudies_post .csp_content .csp_text table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
    font-size: 16px;
}
#caseStudies_post .csp_content .csp_text th {
    background: rgba(142, 87, 244, 0.2);
    color: #fff;
    font-weight: 600;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.15);
    text-align: left;
}
#caseStudies_post .csp_content .csp_text td {
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.75);
}
#caseStudies_post .csp_content .csp_text tr:hover td {
    background: rgba(255,255,255,0.04);
}

#caseStudies_post .csp_recentPost{
    width: 100%;
    display: flex;
    flex-direction: column;
}

#caseStudies_post .cspr_top{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#caseStudies_post .cspr_top h3{
    font-size: 24px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: rgba(33, 33, 36, 1);
}

#caseStudies_post .cspr_bot{
    width: 100%;
    margin-top: 32px;
    padding: 0 70px;
    position: relative;
}

#caseStudies_post .cspr_slide{
    position: relative;
    overflow: hidden;
}

#caseStudies_post .cspr_slide .swiper-slide{
    height: auto;
}

#caseStudies_post .cspr_slide .swiper-slide a{
    display: flex;
    flex-direction: column;
    width: 100%;
}

#caseStudies_post .cspr_slide .swiper-slide a .img{
    width: 100%;
}

#caseStudies_post .cspr_slide .swiper-slide a .img figure{
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    aspect-ratio: 372 / 248;
}

#caseStudies_post .cspr_slide .swiper-slide a .img figure img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.8s;
}

#caseStudies_post .cspr_slide .swiper-slide a:hover .img figure img{
    transform: scale(1.15);
}

#caseStudies_post .cspr_slide .swiper-slide a .desc{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    word-break: break-word;
}

#caseStudies_post .cspr_slide .swiper-slide a .desc h4{
    font-size: 20px;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: rgba(33, 33, 36, 1);
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#caseStudies_post .cspr_slide .swiper-slide a .desc .date{
    display: block;
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    color: rgba(122, 122, 122, 1);
    letter-spacing: -0.02em;
}

#caseStudies_post .cspr_slide .swiper-slide a .cate_area{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 16px;
}

#caseStudies_post .cspr_slide .swiper-slide a .cate_area span{
    display: flex;
    padding: 6px 14px;
    text-align: center;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: -0.02em;
    font-weight: 400;
    width: max-content;
}

#caseStudies_post .cspr_slide .swiper-slide a .cate_area .cate{
    background: rgba(142, 87, 244, 0.1);
    color: rgba(142, 87, 244, 1);
}

#caseStudies_post .cspr_slide .swiper-slide a .cate_area .name{
    background: rgba(242, 243, 246, 1);
    color: rgba(122, 122, 122, 1);
    text-transform: capitalize;
}

#caseStudies_post .cspr_bot > button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    border: none;
    background: rgba(242, 243, 246, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: rgba(180, 180, 185, 1);
    transition: background 0.3s, color 0.3s;
}

#caseStudies_post .cspr_bot > .cspr_prev{
    left: 0;
}

#caseStudies_post .cspr_bot > .cspr_next{
    right: 0;
}

#caseStudies_post .cspr_bot > button:hover{
    background: rgba(230, 231, 235, 1);
    color: rgba(140, 140, 145, 1);
}

#caseStudies_post .cspr_bot > button.swiper-button-disabled{
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}

/* csp_share aside */
#caseStudies_post .csp_share{
    position: absolute;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
}

#caseStudies_post .csp_share.is_fixed{
    position: fixed;
}

#caseStudies_post .csp_share.is_bottom{
    position: absolute;
    bottom: 100px; /* csp_content padding-bottom */
    top: auto !important;
    right: 0;
}

#caseStudies_post .csp_share .share_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(35, 35, 35, 1);
    cursor: pointer;
    transition: background 0.2s;
    /* border: 1px solid rgba(238, 238, 238, 1); */
}

#caseStudies_post .csp_share .share_btn:hover{
    background: var(--main-brand-color);
}

#caseStudies_post .csp_share .share_btn img{
    display: block;
}

#caseStudies_post .csp_share .share_btn.linkedin img{
    width: 27px;
    height: auto;
    filter: invert(1) brightness(1.8);
}

#caseStudies_post .csp_share .share_btn.upload img{
    width: 20px;
    height: auto;
    filter: invert(1) brightness(1.8);
}