@charset "utf-8";

:root {
	--sub-font-size-1: 7.6rem;
	--sub-font-size-2: 4.5rem;
	--sub-font-size-3: 2.8rem;
	--sub-font-size-4: 2.2rem;
}

/* Sub Header */
.container:has(.product, .connect, .solution) header h1 a { background-image: url('/images/logo_w.svg'); }
.container:has(.product, .connect, .solution) header .header-right .lang-select p { color:white; }
.container:has(.product, .connect, .solution) header .header-right .lang-select p::after { border-top-color:white; }

.container:has(.product, .connect, .solution) header.rolled h1 a { background-image: url('/images/logo.svg'); }
.container:has(.product, .connect, .solution) header.rolled .header-right .lang-select p { color: var(--main-black); }
.container:has(.product, .connect, .solution) header.rolled .header-right .lang-select p::after { border-top-color:var(--main-black); }


/* Sub-visual */
.sub-visual { width: 100%; height:88vh; padding-top: 14.8rem; padding-bottom: 11rem; overflow: hidden; border-radius: 0 0 5rem 5rem; color:white; background-size: cover; }
.sub-visual .inner { height:100%; }
.sub-visual .visual-wrap { display: flex; flex-direction: column; justify-content: space-between; height:100%; }

.sub-visual .breadcrumb { display: flex; justify-content: right; letter-spacing: 0; z-index: 5; }
.sub-visual .breadcrumb > ul { display: flex; align-items: center; gap:3.8rem; font-size: 1.5rem; font-weight: 500; }
.sub-visual .breadcrumb > ul > li { position: relative; display: flex; align-items: center; gap:1rem; cursor: pointer; }
.sub-visual .breadcrumb > ul > li::after { content: ''; width: 12px; aspect-ratio: 2/1; background: url('/images/breadcrumb_arw.svg') no-repeat center/contain; transform: translateY(1px); }
.sub-visual .breadcrumb > ul > li:nth-child(1) { color:#AAAAAA; }
.sub-visual .breadcrumb > ul > li:nth-child(2)::after { filter: brightness(2); }
.sub-visual .breadcrumb .sub-menu { display: none; position: absolute; left:0; bottom:-1rem; transform: translateY(100%); }
.sub-visual .breadcrumb .sub-menu ul { display: flex; flex-direction: column; gap:1.5rem; padding: 2rem; padding-right:3.5rem; border-radius: 1rem; background: white; }
.sub-visual .breadcrumb .sub-menu a { position: relative; white-space: nowrap; color:var(--main-black); font-size: 1.6rem; }
.sub-visual .breadcrumb .sub-menu a::after { content: ""; display: block; width:100%; height:1px; position: absolute; left:0px; bottom:0; transform: scaleX(0); background-color: var(--key-color); transition: transform 0.6s; transform-origin: right; }
.sub-visual .breadcrumb .sub-menu a:hover { color: var(--key-color); }
.sub-visual .breadcrumb .sub-menu a:hover::after { transform: scaleX(1); transform-origin: left; }

.sub-visual .visual-text-wrap p:nth-child(1) { display: inline-block; padding:.7rem 1.3rem; border-radius: 5px; border:1px solid #9291A7; font-size: 1.6rem; font-weight: 600; background: #FFFFFF4D; line-height: 1.1; text-transform: uppercase; letter-spacing: 0; }
.sub-visual .visual-text-wrap h2 { padding:2.5rem 0 3.5rem; font-size: 7.6rem; font-weight: 500; line-height: 1.1; }
.sub-visual .visual-text-wrap p:nth-child(3) { font-size: 2rem; font-weight: 400; line-height: 1.3; letter-spacing: 0; }

.sub-visual .visual-btn-wrap { display: flex; gap:1.5rem; margin-top: 12.8rem; }
.sub-visual .visual-btn-wrap .btn-link { font-size: 1.8rem; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(1) { background: linear-gradient(93.47deg, #084AF7 14.46%, #4966FB 88.73%); }
.sub-visual .visual-btn-wrap .btn-link:nth-child(1) .trans-x-box > span::after { color:white; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(1)::before { content: ''; z-index: -1; position: absolute; left:0; top:0; width: 100%; height: 100%; background: #00000033; opacity: 0; transition: .3s ease-in-out; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(1):hover::before { opacity: 1; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(2) { border:1px solid var(--sub-black); }
.sub-visual .visual-btn-wrap .btn-link:nth-child(2):hover { background: #7CFF01; border-color: #7CFF01; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(2):hover::after { filter:none; }
.sub-visual .visual-btn-wrap .btn-link:nth-child(2) .trans-x-box > span::after { color:var(--main-black); }

/* Sub-contents */
.sub-contents { min-height: 30rem; padding-top: 15rem; }
.sub-contents .inner { max-width: 1520px; }

:root { 
    --eng-tit66: 500 6.6rem/110% var(--font-family);
    --eng-tit45: 600 4.5rem/120% var(--font-family);
    --eng-tit28: 600 2.8rem/120% var(--font-family);
    --eng-tit24: 600 2.4rem/120% var(--font-family);
    --eng-txt18: 400 1.8rem/130% var(--font-family);
    --eng-txt20: 400 2rem/130% var(--font-family);

    --sub-tit-h3: 600 7.6rem/110% var(--font-family);
    --sub-sub-tit: 400 2rem/130% var(--font-family);
}
@media screen and (max-width:1600px){ 
    .sub-visual { background-position-x: 40%; }
}
@media screen and (max-width:1440px){ 
    :root { 
        --eng-txt18: 400 2rem/130% var(--font-family);
        --sub-tit-h3: 600 7rem/110% var(--font-family);
    }
}
@media screen and (max-width:1320px){ 
    :root { 
        --eng-tit45: 600 4rem/120% var(--font-family);
        --eng-tit66: 500 6rem/110% var(--font-family);
        --sub-tit-h3: 600 6.4rem/110% var(--font-family);
    }

    .sub-visual { height: 75vh; }
}
@media screen and (max-width:1024px){ 
    :root { 
        --eng-tit66: 500 5.2rem/110% var(--font-family);
        --sub-tit-h3: 600 5.6rem/110% var(--font-family);
    }
    .sub-visual .visual-text-wrap h2 { padding: 2rem 0 3rem; font-size: 6.2rem; }
}
@media screen and (max-width:800px){ 
    :root { 
        --sub-tit-h3: 600 5rem/110% var(--font-family);
    }
}
@media screen and (max-width:640px){ 
    :root { 
        --sub-tit-h3: 600 4.5rem/110% var(--font-family);
    }

    .sub-visual { background-position-x: center; }
}
@media screen and (max-width:480px){ 
    :root { 
        --eng-tit66: 500 3.75rem/110% var(--font-family);
        --sub-tit-h3: 600 4.5rem/110% var(--font-family);
    }
    
    .inner { width: calc(100% - 5rem); }

    .sub-visual { max-height: 520px; padding-top: 68px; padding-bottom: 60px; border-radius: 0 0 25px 25px; }
    .sub-visual .visual-wrap { justify-content: start; gap:22px; }
    .sub-visual .visual-wrap > div:last-child { display: flex; flex:1; flex-direction: column; justify-content: space-between; }
    .sub-visual .breadcrumb { justify-content: center; padding: 9px; border-radius: 10rem; }
    .sub-visual .breadcrumb.on { background-color: #fff; }
    .sub-visual .breadcrumb > ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; width: 94%; }
    .sub-visual .breadcrumb > ul > li { justify-content: space-between; }
    .sub-visual .breadcrumb.on > ul > li:nth-child(2) { color: var(--main-black); }
    .sub-visual .breadcrumb.on > ul > li:nth-child(2)::after { filter: none; }
    .sub-visual .visual-text-wrap p:nth-child(1) { font-size: 1.25rem; padding: 0.6rem 1.25rem; }
    .sub-visual .visual-text-wrap h2 { font-size: 4.5rem; padding: 1.75rem 0 2.5rem; }
    .sub-visual .visual-text-wrap p:nth-child(3) { max-width: 32rem; font-size: 1.85rem; }
    .sub-visual .visual-btn-wrap { flex-direction: column; margin-top: 80px; gap:15px; }
    .sub-visual .visual-btn-wrap .btn-link { width: 100%; height:42px; }
    .sub-contents { padding-top: 6.25rem; }
}




/* ------------------- Product S ------------------------- */

/* Product 공통(Summary) */
.prod-sec-summary { padding-bottom: 15rem; margin-bottom: 7.5rem; overflow: hidden; position: relative; }
.prod-sec-summary .inner { z-index: 3; }
.prod-sec-summary .sec-contents { display: grid; grid-template-columns: 61.6rem auto; }
.prod-sec-summary .sec-contents .rg-box { padding-top: 5.6rem; padding-left: 12.8rem; }
.prod-sec-summary .sec-contents .rg-box .box-tit { max-width: 680px; font: var(--eng-tit45); margin-bottom: 5rem; }
.prod-sec-summary .sec-contents .rg-box .box-tit > span { color: #ccc; }
.prod-sec-summary .sec-contents .rg-box .box-txt { font: 400 2rem/140% 'Pretendard', sans-serif; letter-spacing: -0.4px; color: var(--sub-black); } 
.prod-sec-summary .sec-contents .rg-box .box-txt + .box-txt { margin-top: 3rem; }
.prod-sec-summary .bg-tit { position: absolute; right:10%; bottom:0; font-size: 20rem; font-weight: 500; color: #ECF7FF; white-space: nowrap; line-height: 1.1; text-transform: capitalize; }
.prod-sec-summary .view-video { height: 48px; padding: 0 30px; margin-top: 5rem; border:1px solid var(--sub-black); border-radius: 5rem; justify-content: center; background: white; }
.prod-sec-summary .view-video:hover { border-color: transparent; }
.prod-sec-summary .view-video .trans-x-box > span span { line-height: 22px; }
.prod-sec-summary .view-video .trans-x-box > span::after { color:white; }
.prod-sec-summary .view-video::after { content: ''; z-index: -1; position: absolute; left:0; top:0; width: 100%; height: 100%; background: linear-gradient(93.47deg, #084AF7 14.46%, #4966FB 88.73%); opacity: 0; transition: .3s ease-in-out; }
.prod-sec-summary .view-video:hover::before { background-image: url('/images/ico_play_h.svg'); }
.prod-sec-summary .view-video:hover::after { opacity: 1; }

    /* Product 개별(05, 06-Summary) */
    .prod-sec-summary:has(.conts2) { padding-bottom: 15rem; }
    .prod-sec-summary .sec-contents.conts2 { display: block; margin-top: 7rem; }
    .prod-sec-summary .sec-contents.conts2 .sec-tit { position: relative; display: flex; align-items: center; gap: 1.25rem; font: 600 2.2rem/130% var(--font-family);padding-bottom: 1.5rem; margin-bottom: 4rem; border-bottom: 1px solid #ccc; }
    .prod-sec-summary .sec-contents.conts2 .sec-tit::before { content: ''; width: 1rem; height: 1rem; border-radius: 50%; background-color: var(--main-black); }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(1, 1fr); gap: 3rem; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li { display: flex; flex-direction: column; background-color: #fff; box-shadow: 0 20px 20px rgba(136,136,136,0.1); border-radius: 10px; }
    .prod-sec-summary .sec-contents.conts2 .li-tit { font: 600 1.8rem/140% var(--font-family); color: #fff;  border-radius: 1rem 1rem 0 0; padding: 1.5rem 0; text-align: center; }
    .prod-sec-summary .sec-contents.conts2 .li-tit > br { display: none; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li:nth-child(1) .li-tit { background-color: #63C1FF; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li:nth-child(2) .li-tit { background-color: var(--blue04); } 
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li:nth-child(3) .li-tit { background-color: #0472FB; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li:nth-child(4) .li-tit { background-color: #084AF7; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul { flex:1; display: flex; align-items: center; justify-content: center; padding: 3rem 4.6rem; background-color: #fff; border-radius: 0 0 10px 10px; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li { font: var(--eng-txt18); padding-left: 2.4rem; color: #666; position: relative; }
    .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li::before { content: ''; width: 0.5rem; height: 0.5rem; background-color: #666; position: absolute; left: 0; top: 1rem; border-radius: 5rem; }

    .product05 .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul { display: block; }
    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul { padding: 3rem 4rem; text-align: center; }
    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li { padding-left: 0; }
    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li::before { display: none; }
    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul { grid-template-columns: repeat(4, 1fr); }

    /* Product 개별(07-Summary) */
    .product07 .prod-sec-summary:has(.conts2) { padding-bottom: 17rem; margin: 0; }
    .product07 .prod-sec-summary .bg-tit { z-index: -1; bottom:50%; transform: translateY(50%); }
    .product07 .prod-sec-summary .sec-contents.conts2 .sec-tit { border: 0; margin: 0; padding: 0; padding-left: 2.25rem; float: left; }
    .product07 .prod-sec-summary .sec-contents.conts2 .sec-tit::before { content: ''; position: absolute; left:0; top:1rem; }
    .product07 .prod-sec-summary .sec-contents.conts2 .img-box { z-index: 1; position: relative; width: 100%; max-width: 82rem; margin: 0 auto; float: left; }



/* Product 공통(Features) */
.prod-sec-features { width: calc(100vw - 8rem); margin: 0 auto; padding: 13rem 0; border-radius: 4rem; background-color: #ECF7FF; } 
.prod-sec-features .sec-contents { display: grid; grid-template-columns: auto 100.4rem; }
.prod-sec-features .sec-contents .sub-tit { font: 600 2rem/140% var(--font-family); color: var(--key-color); margin-bottom: 2rem; }
.prod-sec-features .sec-contents .tit { font: var(--eng-tit45); }
.prod-sec-features .sec-contents .rg-box dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3rem; }
.prod-sec-features .sec-contents .rg-box dl > div { min-height: 29.6rem; background-color: #fff; border-radius: 1.5rem; padding: 3.5rem 3.5rem 4.5rem; }
.prod-sec-features .sec-contents .rg-box dl dt { display: grid; grid-template-columns: auto 7.5rem; margin-bottom: 2.5rem; }
.prod-sec-features .sec-contents .rg-box .feat-tit { font: var(--eng-tit28); }
.prod-sec-features .sec-contents .rg-box .ico-box { aspect-ratio: 1/1; border-radius: 1rem; overflow: hidden; }
.prod-sec-features .sec-contents .rg-box dd { font: var(--eng-txt18); color: var(--sub-black); }



/* Product 공통(Architecture) */
.prod-sec-architecture { padding: 17rem 0; }
.prod-sec-architecture h4.tit { font: var(--eng-tit66); margin-bottom: 8rem; text-align: center; }
.prod-sec-architecture .img-box { margin: 0 auto; }
.img-box.img-mob { display: none; text-align: center; }

    /* Product 개별(06-Architecture) */
    .product06 .prod-sec-architecture h4.tit { margin-bottom: 2.5rem; }
    .product06 .prod-sec-architecture .sub-tit { font: 400 2rem/130% var(--font-family); color: var(--sub-black); text-align: center; }
    .product06 .prod-sec-architecture .img-box { position: relative; top: -12.5rem; z-index: -1; }



/* Product 공통(Key Features) */
.prod-sec-key { padding: 13rem 0 19rem; background-color: var(--cool-gray100); position: relative; }
.prod-sec-key:has(.feat-list > ul >li:nth-child(4))::after { content: ''; width: 100%; height: 28.5rem; background: linear-gradient(180deg, rgba(241, 245, 248, 0.00) 0%, var(--cool-gray100) 50%); position: absolute; left: 0; bottom: 0; z-index: 3; }
.prod-sec-key .tit { font: var(--eng-tit66); margin-bottom: 8rem; text-align: center; }
.prod-sec-key .feat-list { max-height: 49.6rem; overflow-y: scroll; }
.prod-sec-key .feat-list::-webkit-scrollbar { width: 0.7rem; }
.prod-sec-key .feat-list::-webkit-scrollbar-thumb { background-color: var(--sub-key-color); border-radius: 10px; }
.prod-sec-key .feat-list::-webkit-scrollbar-track { background-color: transparent; }
.prod-sec-key .feat-list > ul:has(>li:nth-child(4)) { padding-bottom: 8rem; }
.prod-sec-key .feat-list ul { display: flex; flex-direction: column; gap: 2rem; }
.prod-sec-key .feat-list .feat-box { display: grid; grid-template-columns: 12.5% 35.5% 52%; min-height: 13.1rem; align-items: center; padding: 3rem 5rem; background-color: #fff; border-radius: 10px; }
.prod-sec-key .feat-list .feat-box .num { font: 600 2rem/130% var(--font-family); color: var(--blue04); }
.prod-sec-key .feat-list .feat-box .tit { font: var(--eng-tit28); text-align: left; margin: 0; } 
.prod-sec-key .feat-list .feat-box .txt-li { gap: 0; }
.prod-sec-key .feat-list .feat-box .txt-li li { padding-left: 2.4rem; font: var(--eng-txt18); color: var(--sub-black); position: relative; }
.prod-sec-key .feat-list .feat-box .txt-li li::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: var(--sub-black); position: absolute; left: 1rem; top: 1rem; }

    /* Product 개별(05-Key Features) */
    .prod-sec-key .feat-list .ft-list-head { display: grid; grid-template-columns: 37% 31.5% 31.5%; border-radius: 1rem; padding: 1.5rem 0; background-color: var(--cool-gray200); margin-bottom: 2rem; }
    .prod-sec-key .feat-list .ft-list-head > p { font: 500 1.8rem/140% var(--font-family); text-align: center; letter-spacing: -0.32px; color: var(--sub-black); }
    .prod-sec-key .feat-list.feat-list-tb .feat-box { grid-template-columns: 12% 25% 31.5% 31.5%; }

    /* Product 개별(06-Key Features) */
    .product06 .prod-sec-key .feat-list .feat-box .ft-couple { display: grid; grid-template-columns: 30% 70%; }
    .product06 .prod-sec-key .feat-list .feat-box .ft-couple > ul { gap: 0; }



/* Product 공통(Business Impact) */
.prod-sec-impact { padding: 17rem 0 0; overflow: hidden; }
.prod-sec-impact .tit { font: var(--eng-tit66); margin-bottom: 8rem; text-align: center; }
.prod-sec-impact .swiper-container { overflow: visible; }
.prod-sec-impact .impact-box { height: 48.8rem; padding: 5rem 4rem 4rem; border-radius: 1.5rem; border: 1px solid #DDD; background: linear-gradient(180deg, #FFF 0%, var(--cool-gray100) 100%); }
.prod-sec-impact .impact-box .ico-box { width: 15.4rem; aspect-ratio: 1/1; margin: 0 auto 5rem; position: relative; }
.prod-sec-impact .impact-box .ico-box > img { position: relative; z-index: 3; }
.prod-sec-impact .impact-box .ico-box::after { content: ''; width: 13.2rem; height: 13.2rem; border-radius: 50%; background-color: #fff; position: absolute; left: -2.5rem; bottom: 2px; z-index: 1; }
.prod-sec-impact .impact-box .tit { font: var(--eng-tit24); margin-bottom: 2rem; text-align: left; }
.prod-sec-impact .impact-box li { font: var(--eng-txt18); color: var(--sub-black); padding-left: 1.5rem; position: relative; }
.prod-sec-impact .impact-box li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: var(--sub-black); position: absolute; left: 0; top: 1rem; }
.prod-sec-impact .swiper-container-horizontal > .swiper-scrollbar { display: none; }

    .product04 .prod-sec-impact, 
    .product05 .prod-sec-impact, 
    .product06 .prod-sec-impact, 
    .product07 .prod-sec-impact, 
    .product08 .prod-sec-impact, 
    .product09 .prod-sec-impact, 
    .product10 .prod-sec-impact { padding-bottom: 15rem; }


@media screen and (max-width:1600px){ 
    /* Product 공통(Summary) */
    .prod-sec-summary .sec-contents .rg-box { padding-top: 4rem; padding-left: 12rem; }
}
@media screen and (max-width:1440px){ 
    /* Product 공통(Summary) */
    .prod-sec-summary { padding-bottom: 12rem;}
    .prod-sec-summary .sec-contents { grid-template-columns: 55rem auto; }
    .prod-sec-summary .sec-contents .rg-box { padding-top: 4rem; padding-left: 10rem; }
    .prod-sec-summary .sec-contents .rg-box .box-txt > br { display: none; }
        /* Product 개별(05-Summary) */
        .prod-sec-summary .sec-contents.conts2 .li-tit > br { display: block; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul { padding: 3rem 2rem; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li > br { display: none; }
        .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul { gap: 2rem; }

    /* Product 공통(Features) */
    .prod-sec-features .sec-contents { grid-template-columns: auto 92rem; }

    /* Product 공통(Key Features) */
    .prod-sec-key .feat-list .feat-box { grid-template-columns: 10% 35% 55%; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact .impact-box { height: 54rem; }
    .prod-sec-impact .impact-box .ico-box { width: 12rem; margin-bottom: 4rem; }
    .prod-sec-impact .impact-box .ico-box::after { width: 10rem; height: 10rem; left: -4rem; }
}
@media screen and (max-width:1320px){ 
    /* Product 공통(Summary) */
    .prod-sec-summary .sec-contents { display: block; }
    .prod-sec-summary .sec-contents .lf-box .img-box { width: 75%; margin: 0 auto; }
    .prod-sec-summary .sec-contents .rg-box { padding-top: 10rem; padding-left: 0; }
    .prod-sec-summary .sec-contents .rg-box .box-tit { max-width: 70rem; }
    .prod-sec-summary .sec-contents .rg-box .box-tit >br { display: none; }
    .prod-sec-summary .sec-contents .rg-box .box-txt { font-size: 3rem; }
        /* Product 개별(05-Summary) */
        .prod-sec-summary .sec-contents.conts2 .li-tit > br { display: none; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul { gap: 2rem; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul { padding: 3rem 3.5rem; }
        .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul { grid-template-columns: repeat(2, 1fr); }

    /* Product 공통(Features) */
    .prod-sec-features .sec-contents { display: block; }
    .prod-sec-features .sec-contents .lf-box { margin-bottom: 4rem; }
    .prod-sec-features .sec-contents .rg-box dl { gap: 2rem; }

    /* Product 공통(Architecture) */
    .prod-sec-architecture { padding: 15rem 0; }

    /* Product 공통(Key Features) */
    .prod-sec-key .feat-list .feat-box .txt-li li > br { display: none; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact .impact-box .tit > br { display: none; }
} 
@media screen and (max-width:1024px){ 
    /* Product 공통(Summary) */
    .prod-sec-summary .sec-contents .rg-box .box-txt { font-size: 2.2rem; }
    .prod-sec-summary .bg-tit { font-size: 14rem; }
        /* Product 개별(05,06-Summary) */
        .prod-sec-summary .sec-contents.conts2 .sec-tit { margin-bottom: 3rem; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul { grid-template-columns: auto; }
        .prod-sec-summary .sec-contents.conts2 .li-tit > br { display: none; }
        .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul { grid-template-columns: auto; }
        /* Product 개별(07-Summary) */
        .product07 .prod-sec-summary .sec-contents.conts2 .sec-tit { margin-bottom: 3rem; float: unset; }
        .product07 .prod-sec-summary .sec-contents.conts2 .img-box { float: unset; }

    /* Product 공통(Architecture) */
    .img-box.img-pc { display: none; }
    .img-box.img-mob { display: block; }
        /* Product 개별(06-Architecture) */
        .product06 .prod-sec-architecture .img-box { top: 4rem; }

    /* Product 공통(Key Features) */
    .prod-sec-key { padding: 12rem 0 10rem; }
    .prod-sec-key:has(.feat-list > ul >li:nth-child(4))::after::after { height: 20rem; }
    .prod-sec-key .feat-list { max-height: 60rem; }
    .prod-sec-key .feat-list > ul { padding-bottom: 10rem; }
    .prod-sec-key .feat-list .feat-box { display: block; border-radius: 5px; }
    .prod-sec-key .feat-list .feat-box .tit { padding: 2rem 0 0; position: relative; }
    .prod-sec-key .feat-list .feat-box .tit > br { display: none; }
    .prod-sec-key .feat-list .feat-box .tit::after { content: ''; width: 1.25rem; height: 1rem; background: url('/images/product/sub_ico_arr_down.png') no-repeat center/contain; position: absolute; right: 0; top: 0; } 
    .prod-sec-key .feat-list .feat-box .tit.on::after { transform: rotate(180deg); }
    .prod-sec-key .feat-list .feat-box .txt-li { display: none; padding-top: 3rem; }
        /* Product 개별(05-Key Features) */
        .prod-sec-key .feat-list .ft-list-head { display: none; }
        .prod-sec-key .feat-list .feat-box .txt-li + .txt-li { border-top: 1px dashed #ddd; margin-top: 2rem; padding-top: 2rem; }
        /* Product 개별(06-Key Features) */
        .product06 .prod-sec-key .feat-list .feat-box .ft-couple { display: block; }

    .product04 .prod-sec-impact, 
    .product05 .prod-sec-impact, 
    .product06 .prod-sec-impact, 
    .product07 .prod-sec-impact, 
    .product08 .prod-sec-impact, 
    .product09 .prod-sec-impact, 
    .product10 .prod-sec-impact { padding-bottom: 10rem; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact .impact-box { height: 52rem; padding: 4rem 3rem 3rem; }
    .prod-sec-impact .impact-box .ico-box { width: 10.5rem; margin-bottom: 3.5rem; }
    .prod-sec-impact .impact-box .ico-box::after { width: 9rem; height: 9rem; left: -4rem; }
}
@media screen and (max-width:800px){ 
    /* Product 공통(Features) */
    .prod-sec-features { padding: 10rem 0; }
    .prod-sec-features .sec-contents .rg-box dl { grid-template-columns: auto; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact .swiper-container-horizontal > .swiper-scrollbar { display: block; width: calc(100vw - 5rem); height: 1px; left: 0; }
    .prod-sec-impact .swiper-scrollbar-drag { height: 3px; background: var(--blue04); top: -1px; }
}
@media screen and (max-width:768px){ 
    .prod-sec-key .feat-list .feat-box  { min-height: none; }
    .prod-sec-key:has(.feat-list > ul >li:nth-child(4))::after { height: 130px; }
    .product07 .prod-sec-summary .sec-contents.conts2 .img-box img { display: none; }
    .product07 .prod-sec-summary .sec-contents.conts2 .img-box::before { content: ''; display: block; position: relative; left:-20px; width: calc(100% + 40px); aspect-ratio: 1/1; background: url('/images/product/sub_07_mfa_img2_m.png') no-repeat center/contain; }
}
@media screen and (max-width:640px){ 
    .product02 .sub-visual { background: url('/images/sub_visual_Rathon-SSO_m.jpg') no-repeat center/cover !important; }
    .product03 .sub-visual { background: url('/images/sub_visual_Rathon-LDAP_m.jpg') no-repeat center/cover !important; }
    .product04 .sub-visual { background-position-x: 0%; }
    .product05 .sub-visual { background: url('/images/sub_visual_RTJCrypto_m.jpg') no-repeat center/cover !important; }
    .product06 .sub-visual { background-position-x: 45%; }
    .product07 .sub-visual { background-position-x: 54%; }
    .product08 .sub-visual { background: url('/images/sub_visual_Symantec Siteminder_m.jpg') no-repeat center/cover !important; }
    .product08 .sub-visual .visual-text-wrap h2 { max-width: 330px; }
    .product10 .sub-visual { background: url('/images/sub_visual_IBM-SDS-m.jpg') no-repeat center/cover !important; }

    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul { display: block; }
    .product06 .prod-sec-summary .sec-contents.conts2 .cont-list > ul > li:not(:last-child) { margin-bottom: 20px; }
    .product06 .prod-sec-architecture { padding: 80px 0 120px; overflow: hidden; }
        .product06 .prod-sec-architecture .img-box { width: calc(100% + 40px); position: relative; left:-20px; }
        .product06 .prod-sec-architecture .img-box img { min-width: 550px; position: relative; left:50%; transform: translateX(-50%); }

    /* Product 공통(Summary) */
    .prod-sec-summary .sec-contents .rg-box { padding-top: 5rem; }
    .prod-sec-summary .sec-contents .rg-box .box-tit { font-size: 3.6rem; }
    .prod-sec-summary .bg-tit { font-size: 100px; }
    .prod-sec-summary .view-video { width: 100%; height: 42px; margin-top: 30px; }
        /* Product 개별(07-Summary) */
        .product07 .prod-sec-summary:has(.conts2) { padding-bottom: 12rem; }
        .product07 .prod-sec-summary .sec-contents.conts2 .sec-tit { margin-bottom: 3.75rem; }

    /* Product 공통(Features) */
    .prod-sec-features { width: 100%; padding: 8rem 1rem; border-radius: 0; }

    /* Product 공통(Key Features) */
    .prod-sec-key { padding: 12rem 0 14rem; }
    .prod-sec-key:has(.feat-list > ul >li:nth-child(4))::after { height: 12.5rem; bottom: 3.5rem; }
    .prod-sec-key .feat-list { max-height: 60rem; }
    .prod-sec-key .feat-list .feat-box .num { font-size: 2.7rem;}
    .prod-sec-key .feat-list .feat-box .tit { font-size: 3rem; }
    .prod-sec-key .feat-list > ul { gap: 1.25rem; padding-bottom: 10rem; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact .impact-box { height: 56rem; }
    .prod-sec-impact .impact-box .tit { font-size: 2.2rem; letter-spacing: -0.4px; }

}
@media screen and (max-width:480px){ 
    /* Product 공통(Summary) */
    .prod-sec-summary { padding-bottom: 9rem; margin-bottom: 6.25rem; }
    .prod-sec-summary .sec-contents .lf-box .img-box { width: 100%; max-width: 360px; }
    .prod-sec-summary .sec-contents .rg-box { padding-top: 1.25rem; }
    .prod-sec-summary .sec-contents .rg-box .box-tit { font-size: 3rem; margin-bottom: 3rem; }
    .prod-sec-summary .sec-contents .rg-box .box-txt { font-size: 1.85rem; letter-spacing: -0.3px; }
        /* Product 개별(05-Summary) */
        .prod-sec-summary:has(.conts2) { padding-bottom: 10rem; }
        .prod-sec-summary .sec-contents.conts2 .sec-tit { align-items: flex-start; font-size: 2rem; }
        .prod-sec-summary .sec-contents.conts2 .sec-tit::before { width: 0.75rem; height: 0.75rem; margin-top: 1rem; }
        .prod-sec-summary .sec-contents.conts2 .li-tit { font-size: 1.875rem; }
        .prod-sec-summary .sec-contents.conts2 .cont-list > ul ul li { font-size: 1.875rem; }
        /* Product 개별(07-Summary) */
        .product07 .prod-sec-summary:has(.conts2) { padding-bottom: 10rem; }

    /* Product 공통(Features) */
    .prod-sec-features { padding-top: 5.5rem; }
    .prod-sec-features .sec-contents .sub-tit { font-size: 1.85rem; margin-bottom: 1.25rem; }
    .prod-sec-features .sec-contents .tit { font-size: 3rem; }
    .prod-sec-features .sec-contents .rg-box dl > div { min-height: 26.5rem; padding: 2.5rem; }
    .prod-sec-features .sec-contents .rg-box .feat-tit { font-size: 2.25rem; }
    .prod-sec-features .sec-contents .rg-box dl dt { grid-template-columns: auto 5rem; }
    .prod-sec-features .sec-contents .rg-box dd { font-size: 1.75rem; }

    /* Product 공통(Architecture) */
    .prod-sec-architecture { padding: 10rem 0; }
        

    /* Product 공통(Key Features) */
    .prod-sec-key { padding: 5.75rem 0 5rem; }
    .prod-sec-key .tit { margin-bottom: 4rem; }
    .prod-sec-key .feat-list .feat-box { padding: 3.025rem; }
    .prod-sec-key .feat-list .feat-box .num { font-size: 1.875rem; }
    .prod-sec-key .feat-list .feat-box .tit { font-size: 2.25rem; padding: 1.24rem 0 0; }

    /* Product 공통(Business Impact) */
    .prod-sec-impact { padding: 10rem 0; }
    .prod-sec-impact .tit { margin-bottom: 4.25rem; }
    .prod-sec-impact .swiper-container { max-width: 33.25rem; margin: 0; }
    .prod-sec-impact .impact-box { height: 55rem; padding: 5rem 3rem 3rem; }
    .prod-sec-impact .impact-box .ico-box { width: 14.5rem; }

    .product04 .prod-sec-impact, 
    .product05 .prod-sec-impact, 
    .product06 .prod-sec-impact, 
    .product07 .prod-sec-impact, 
    .product08 .prod-sec-impact, 
    .product09 .prod-sec-impact, 
    .product10 .prod-sec-impact { padding-bottom: 8rem; }
}

/* ------------------- Product E ------------------------- */





/* ------------------- Usecase S ------------------------- */

/* Usecase 공통 */
.sub.usecase { margin-top: 12.6rem; }
.sub.usecase .inner { max-width: 1320px; }
.sub .tit-box .list-h3 { font: var(--sub-tit-h3); margin-bottom: 1.5rem; text-align: center; }

/* 검색 */
.srch-box { display: flex; justify-content: space-between; align-items: center; } 
.srch-box .select-box { display: flex; gap: 2rem; }
.srch-box .select-box select { width: 26rem; padding: 1.3rem 2.5rem 1.4rem; border-radius: 3rem; font: var(--eng-txt18); color: var(--sub-black); background: var(--cool-gray100) url('/images/usecase/sub_srch_arr_down.png') no-repeat 90% center/12px 10px; border: 0; }
.srch-box .select-box select:focus { outline: 0; }
.srch-box .input-box { display: flex; align-items: center; gap: 1rem; width: 36.8rem; padding: 1.3rem 2.5rem 1.4rem; border-radius: 3rem; background-color: var(--cool-gray100); }
.srch-box .input-box input[type="text"] { width: calc(100% - 3.1rem); border: 0; font: var(--eng-txt18); color: var(--sub-black); background-color: transparent; } 
.srch-box .input-box input[type="text"]::placeholder { color: #ccc; }
.srch-box .input-box input[type="text"]:focus { outline: 0; }
.srch-box .input-box > button { display: block; width: 2.1rem; height: 2.1rem; font-size: 0; text-indent: -9999px; background: url('/images/usecase/sub_srch_ico_srch.png') no-repeat center/contain; }

/* 페이지네이션 */
.pagenation-wrap ul { display: flex; justify-content: center; align-items: center; gap: 3rem; }
.pagenation-wrap ul li { font: 400 2rem/120% "Geist", sans-serif; color: var(--sub-black); position: relative; cursor: pointer; }

.pagenation-wrap ul li:not(.num) { font-size: 0; text-indent: -9999px; }
.pagenation-wrap ul li.pprev { width: 2.2rem; height: 2.5rem; background: url('/images/usecase/sub_pagenation_pprev.png') no-repeat center/contain; }
.pagenation-wrap ul li.pprev.un-active { background-image: url('/images/usecase/sub_pagenation_pprev_un.png'); }
.pagenation-wrap ul li.prev { width: 3.1rem; height: 2.5rem; background: url('/images/usecase/sub_pagenation_prev.png') no-repeat center/contain; }
.pagenation-wrap ul li.prev.un-active { background-image: url('/images/usecase/sub_pagenation_prev_un.png'); }
.pagenation-wrap ul li.next { width: 3.1rem; height: 2.5rem; background: url('/images/usecase/sub_pagenation_next.png') no-repeat center/contain; }
.pagenation-wrap ul li.nex.un-active { background-image: url('/images/usecase/sub_pagenation_next_un.png'); }
.pagenation-wrap ul li.nnext { width: 2.2rem; height: 2.5rem; background: url('/images/usecase/sub_pagenation_nnext.png') no-repeat center/contain; }
.pagenation-wrap ul li.nnext.un-active { background-image: url('/images/usecase/sub_pagenation_nnext_un.png'); }

.pagenation-wrap ul li.num.on { color: #fff; }
.pagenation-wrap ul li.num::before { content: ''; width: 4.8rem; height: 4.8rem; border-radius: 50%; background-color: var(--blue04); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; display: none; }
.pagenation-wrap ul li.num.on::before { display: block; }


/* Usecase - List(01) */
.usecase.usecase-list { padding-top: 15rem; padding-bottom: 16.5rem; }
.usecase-list .tit-box { padding-bottom: 10rem; margin-bottom: 5rem; border-bottom: 1px solid #ddd; }

.usecase-list .tit-box .sub-tit { font: var(--sub-sub-tit); color: var(--sub-black); text-align: center; }
.usecase-list .list-box { margin-top: 7rem; margin-bottom: 11rem; }
.usecase-list .list-box ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10rem 4rem; }
.usecase-list .list-box .case-box .img-box { aspect-ratio: 414/285; border-radius: 1.2rem; overflow: hidden; margin-bottom: 3rem; } 
.usecase-list .list-box .case-box .img-box > img { width: 100%; max-width: unset; height: 100%; object-fit: cover; transition: .3s ease-in-out; }
.usecase-list .list-box li:hover .case-box .img-box img { transform: scale(1.1); }
.usecase-list .list-box .case-box .txt-box { display: block; }
.usecase-list .list-box .case-box .ico-box { display: flex; gap: 1rem; margin-bottom: 2rem; }
.usecase-list .list-box .case-box .ico-box > span { display: block; font: 600 1.4rem/110% var(--font-family); padding: 0.5rem 1rem; border-radius: 0.5rem; }
.usecase-list .list-box .case-box .ico-box > span.ico-sol { color: var(--main-black); background-color: #7CFF01; }
.usecase-list .list-box .case-box .ico-box > span.ico-ind { color: #fff; background-color: #087DFE; }
.usecase-list .list-box .case-box .txt-box dl { max-width: 34rem; }
.usecase-list .list-box .case-box .txt-box dt { display: -webkit-box; height: 6rem; overflow: hidden; font: 600 2.2rem/130% var(--font-family); text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.usecase-list .list-box .case-box .txt-box dd { margin-top: 1rem; font: 400 1.6rem/130% var(--font-family); color: var(--sub-black); }


/* Usecase - view */
.usecase.usecase-view { padding-top: 13rem; padding-bottom: 15rem; }
.usecase-view .btn-back { display: block; width: 4.4rem; height: 2.4rem; font-size: 0; text-indent: -9999px; background: url('/images/usecase/sub_ico_back.png') no-repeat center/contain; }

.usecase-view .view-wrap { width: 100%; max-width: 1064px; margin: 1.5rem auto 0; }
.usecase-view .tit-box { margin-bottom: 5rem; }
.usecase-view .tit-box .badge { display: flex; justify-content: center; gap: 1rem; margin-bottom: 3rem; }
.usecase-view .tit-box .badge > span { display: block; font: 600 1.4rem/110% var(--font-family); padding: 0.5rem 1rem; border-radius: 0.5rem; }
.usecase-view .tit-box .badge > span.ico-sol { color: var(--main-blacks); background-color: #7CFF01; }
.usecase-view .tit-box .badge > span.ico-ind { color: #fff; background-color: #087DFE; }
.usecase-view .tit-box .view-h3 { max-width: 82rem; margin: 0 auto; font: 600 4rem/120% var(--font-family); letter-spacing: -0.4px; margin-bottom: 1.4rem; text-align: center; }
.usecase-view .tit-box .sub-tit { max-width: 92rem; margin: 0 auto; font: var(--eng-txt18); color: var(--sub-black); text-align: center; }
.usecase-view .view-cont { padding-bottom: 10rem; }
.usecase-view .view-cont .img-box { border-radius: 1.5rem; overflow: hidden; margin-bottom: 7rem; }
.usecase-view .view-cont .cont-box > div + div { margin-top: 5rem; }
.usecase-view .view-cont .cont-box dt { font: 600 3.2rem/110% var(--font-family); letter-spacing: -0.64px; margin-bottom: 1.5rem; }
.usecase-view .view-cont .cont-box dd { font: var(--eng-txt18); color: var(--sub-black); }
.usecase-view .view-cont .cont-box ul { padding-left: 1.6rem; }
.usecase-view .view-cont .cont-box li { list-style: disc; }
.usecase-view .btn-wrap > button { display: flex; justify-content: center; gap: 0.5rem; min-width: 16.5rem; padding: 1.3rem 3rem; font: 500 1.8rem/120% var(--font-family); letter-spacing: -0.18px; border-radius: 5rem; border: 1px solid var(--sub-black); color: var(--sub-black); margin: 0 auto; } 
.usecase-view .btn-wrap > button::after { content: ''; width: 2.2rem; height: 2.2rem; background: url('/images/usecase/sub_btn_more.png') no-repeat center/contain; }


/* Usecase - no list */
.usecase-list .list-box ul:has(.no-list-box) { display: block; }
.no-list-box { display: flex; flex-direction: column; align-items: center; gap: 2.3rem; padding: 20rem 0 15rem; }
.no-list-box .ico-box { width: 40px; aspect-ratio: 1/1; }
.no-list-box .txt { font: 400 2.8rem/120% var(--font-family); color: var(--sub-black); }


@media screen and (max-width:1320px){ 
    /* Usecase - List(01) */
    .usecase.usecase-list,
    .usecase.usecase-view { padding-top: 12rem; padding-bottom: 15rem; }
    .usecase-list .list-box ul { gap: 8rem 3rem; }
}
@media screen and (max-width:1024px){ 
    /* Usecase - List(01) */
    .usecase-list .tit-box { padding-bottom: 7rem; margin-bottom: 4rem; }
    .usecase-list .list-box { margin-top: 5rem; }
    .usecase-list .list-box ul { gap: 8rem 2rem; }
    .usecase-list .list-box .case-box .img-box { margin-bottom: 2rem; }
    .usecase-list .list-box .case-box .ico-box { margin-bottom: 1rem; }
}
@media screen and (max-width:800px){ 
    /* 검색 */
    .srch-box { flex-direction: column; gap: 1rem; }
    .srch-box .select-box { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; width: 100%; }
    .srch-box .select-box select { width: 100%; }
    .srch-box .input-box { width: 100%; }

    /* Usecase - List(01) */
    .sub.usecase { margin-top: 8.5rem; }
    .usecase.usecase-list { padding-top: 8rem; padding-bottom: 12rem; }
    .usecase-list .tit-box { padding-bottom: 4rem; margin-bottom: 3rem; }
    .usecase-list .list-box { margin-bottom: 8rem; }
    .usecase-list .list-box ul { grid-template-columns: repeat(2, 1fr); }

    /* Usecase - view */
    .usecase-view .tit-box .badge { margin-bottom: 2rem; }
    .usecase-view .tit-box .view-h3 { font-size: 2.75rem; }
    .usecase-view .tit-box .sub-tit { font-size: 1.875rem; }
    .usecase-view .view-cont .img-box { aspect-ratio: 320/216; margin-bottom: 5rem; }
    .usecase-view .view-cont .img-box > img { width: 100%; max-width: unset; height: 100%; object-fit: cover; }
}
@media screen and (max-width:480px){ 
    /* 검색 */
    .srch-box .select-box { grid-template-columns: auto; gap: 1.25rem; }

    /* 페이지네이션 */
    .pagenation-wrap ul { gap: 3.2rem; }
    .pagenation-wrap ul li.num::before { width: 4rem; height: 4rem; }
    .pagenation-wrap ul li.pprev,
    .pagenation-wrap ul li.nnext { width: 2rem; height: 2.2rem; }
    .pagenation-wrap ul li.prev,
    .pagenation-wrap ul li.next { width: 2.8rem; height: 2.2rem; }

    /* Usecase - List(01) */
    .usecase.usecase-list { padding-top: 10.5rem; padding-bottom: 10rem; }
    .usecase-list .list-box ul { grid-template-columns: repeat(1, 1fr); gap: 6.25rem; }
    .usecase-list .list-box .case-box .img-box { aspect-ratio: 320/216; }
    .usecase-list .list-box .case-box .ico-box > span { padding: 0.625rem 1.25rem; }
    .usecase-list .list-box .case-box .ico-box > span.ico-sol { font-size: 1.25rem; }
    .usecase-list .list-box .case-box .txt-box dt { height: 5.25rem; font-size: 2rem; margin-bottom: 1.25rem; }
    .usecase-list .list-box .case-box .txt-box dd { font-size: 1.775rem; }

    /* Usecase - view */
    .usecase.usecase-view { padding-top: 3.75rem; padding-bottom: 10rem; }
    .usecase-view .view-wrap { margin: 4.375rem auto 0; }
    .usecase-view .btn-back { width: 3.75rem; height: 2rem; }
    .usecase-view .view-cont { padding-bottom: 6.25rem; }
    .usecase-view .view-cont .cont-box > div + div { margin-top: 3.75rem; }
    .usecase-view .view-cont .cont-box dt { font-size: 2.75rem; margin-bottom: 1.25rem; }
    .usecase-view .view-cont .cont-box dd { font-size: 1.875rem; }
    .usecase-view .btn-wrap > button { width: 100%; font-size: 1.875rem; padding: 1.5rem; }

    /* Usecase - no list */
    .usecase-no .no-list-box { gap: 2.5rem; padding: 12.5rem 0 18.75rem; }
    .usecase-no .no-list-box .txt { font-size: 2.25rem; }
}

/* ------------------- Usecase E ------------------------- */



/* ------------------- form 공통 S ------------------------- */
.form-wrap label.essen { display: flex; align-items: center; gap: 1rem; font: 500 2rem/130% var(--font-family); margin-bottom: 1.5rem; position: relative; }
.form-wrap label.essen::before { content: ''; width: 0.6rem; height: 0.6rem; border-radius: 50%; background-color: var(--blue04); }
.form-wrap .input-wrap { width: 100%; padding: 1.7rem 3rem; border-radius: 1rem; border: 1px solid #ddd; background-color: var(--cool-gray100); }
.form-wrap .input-wrap > input { display: inline-block; width: 100%; border: 0; background-color: transparent; font: var(--eng-txt20); color: var(--sub-black); }
.form-wrap .input-wrap > input::placeholder { color: #aaa; }
.form-wrap .input-wrap:has(input:disabled) { background:#E3E8ED; }
.form-wrap .input-wrap > input:disabled::placeholder { color:transparent; }
.form-wrap .input-wrap > input:focus { outline: 0; }
.form-wrap .input-wrap:has(input:focus) { outline: 2px solid var(--blue04); }
.form-wrap textarea { height: 40vh; max-height: 34.5rem; font: var(--eng-txt20); color: var(--sub-black); padding: 1.7rem 3rem; border-radius: 1rem; border: 1px solid #ddd; background-color: var(--cool-gray100); }
.form-wrap textarea::placeholder { color: #aaa; }
.form-wrap textarea:focus { outline: 2px solid var(--blue04); }
.form-wrap input[type="checkbox"] { display: none; }
.form-wrap input[type="checkbox"] + label { display: flex; align-items: center; gap: 1rem; font: 400 1.6rem/110% var(--font-family); color: var(--sub-black); }
.form-wrap input[type="checkbox"] + label::before { content: ''; display: block; width: 2rem; height: 2rem; background: url('/images/sub_ico_chk_off.svg') no-repeat center/contain; }
.form-wrap input[type="checkbox"]:checked + label::before  { background-image: url('/images/sub_ico_chk_on.svg'); }

.form-wrap .frm-sec { display: flex; flex-wrap: wrap; gap: 4rem 3.6rem; padding-bottom: 6rem; margin-bottom: 4rem; border-bottom: 1px solid #ddd; }
.form-wrap .frm-sec:last-child { margin-bottom: 0; }
.form-wrap .frm-sec .frm-set { width: 100%; }
.form-wrap .frm-sec .frm-set.frm-half { width: calc((100% - 3.6rem) / 2); }

.form-wrap .txt-box { width: 100%; height: 20rem; padding: 3rem; border-radius: 1rem; border: 1px solid #ddd; font: 400 1.6rem/130% var(--font-family); color: var(--sub-black); background-color: var(--cool-gray100); overflow-y: scroll; margin-bottom: 2rem; }
.form-wrap .txt-box::-webkit-scrollbar { width: 4px; /* 스크롤바 두께 */}
.form-wrap .txt-box::-webkit-scrollbar-thumb { background-color: #23B7FA; /* 스크롤바 색상 */ border-radius: 10px; /* 스크롤바 둥근 테두리 */ }
.form-wrap .txt-box::-webkit-scrollbar-track { background-color: transparent;  /*스크롤바 뒷 배경 색상*/ }
.form-wrap .txt-box > div + div { margin-top: 1.5rem; }
.form-wrap .txt-box ul { padding-left: 1.6rem; }
.form-wrap .txt-box ul > li { list-style: disc; }
.form-wrap .frm-chk { display: flex; justify-content: space-between; } 
.form-wrap .frm-chk a { font: 400 1.6rem/110% var(--font-family); color: var(--sub-black); text-decoration: underline; }

.btn-wrap .btn-active { display: flex; justify-content: center; gap: 0.5rem; width: 100%; max-width: 19rem; padding: 1.3rem 0; margin: 8rem auto 0; border-radius: 5rem; background-color: var(--blue04); color: #fff; font: 600 1.8rem/140% var(--font-family); }
.btn-wrap .btn-active::after { content: ''; display: block; width: 2.2rem; height: 2.2rem; background: url('/images/sub_btn_more_wh.png') no-repeat center/contain; }
.btn-wrap .btn-active::before { content: ''; z-index: -1; position: absolute; inset: 0; background: linear-gradient(93.47deg, #084AF7 14.46%, #4966FB 88.73%); opacity: 0; transition: .3s ease-in-out; }
.btn-wrap .btn-active:hover::before { opacity: 1; }
.esg-form .trans-x-wrap .trans-x-box > span::after { color:white; }

@media screen and (max-width:1320px){ 
    .form-wrap .frm-sec { gap: 4rem 2.5rem; padding-bottom: 5rem; margin-bottom: 3rem; }
}
@media screen and (max-width:800px){ 
    .form-wrap .frm-sec { flex-direction: column; flex-wrap: nowrap; }
    .form-wrap .frm-sec .frm-set.frm-half { width: 100%; }
}
@media screen and (max-width:640px){ 
    .form-wrap .frm-chk { flex-direction: column; gap: 2.5rem; }
    .form-wrap .frm-chk a { font-size: 1.875rem; text-align: right; }
    .btn-wrap .btn-active { width: 100%; max-width: 50rem; padding: 1.5rem 0; font-size: 1.875rem; }
}
@media screen and (max-width:500px){ 
    .container:has(.product, .connect, .solution) header h1 a { background: url('/images/logo.svg') no-repeat center/contain; }
}
@media screen and (max-width:480px){ 
    .form-wrap .frm-sec { gap: 3.75rem; padding-bottom: 3.75rem; margin-bottom: 3.75rem; }
    .form-wrap label.essen { margin-bottom: 1.875rem; font-size: 1.875rem; }
    .form-wrap .input-wrap { padding: 1.75rem 1.875rem; }
    .form-wrap .input-wrap > input { font-size: 1.875rem; }
    .form-wrap textarea { max-height: 28.5rem; }
    .form-wrap .txt-box { height: 23.75rem; padding: 2.25rem 2rem; }
    .form-wrap input[type="checkbox"] + label { align-items: flex-start; font-size: 1.75rem; }

}

/* ------------------- form 공통 E ------------------------- */



/* ------------------- Support S ------------------------- */

/* Support - contact us */
.sub.contact { padding-top: 23.1rem; padding-bottom: 15rem; background-color: var(--cool-gray100); }
.sub.contact .inner { max-width: 1440px; }
.sub.contact .contact-wrap { padding: 10rem 9rem 13rem; border-radius: 3rem; background-color: #fff; } 

.contact-wrap .tit-box { padding-bottom: 7rem; border-bottom: 1px solid var(--sub-black); margin-bottom: 2rem; }
.contact-wrap .sub-tit { font: var(--eng-txt20); color: var(--sub-black); margin-top: 1.5rem; text-align: center; }
.contact-wrap .tel-box { text-align: right; font: 600 1.8rem/130% var(--font-family); color: var(--blue04); }

.contact-wrap .contact-form { margin-top: 4rem; }
.contact .trans-x-wrap .trans-x-box > span::after { color:white; }


/* Support - complate */
.sub.contact.complate { margin-top: 12.6rem; padding-top: 17rem; padding-bottom: 0; background-color: transparent; }
.complate .comp-wrap { text-align: center; }
.complate .comp-wrap .ico-box { width: 10rem; aspect-ratio: 1/1; margin: 0 auto 8rem; }
.complate .comp-wrap .mini-tit { font: var(--eng-tit28); text-align: center; margin-bottom: 1.5rem; }
.complate .comp-wrap .sub-tit { font: var(--eng-txt18); color: var(--sub-black); }
.complate .comp-wrap .btn-wrap { margin-top: 10rem; }


/* form - contact us */
.contact .frm-sec1 .frm-set:not(.frm-half) { display: flex; gap: 2rem; }
.contact .frm-sec1 .frm-set > label { margin-right: 2rem; }
.contact .frm-sec1 .frm-set.frm-set:not(.frm-half) > label { margin-bottom: 0; }
.contact .frm-set input[type="radio"] { display: none; }
.contact .frm-set input[type="radio"] + label { display: block; padding: 1.5rem 3rem; border-radius: 3rem; font: 600 2rem/100% var(--font-family); color: var(--sub-black); text-align: center; background-color: #ECF7FF; cursor: pointer; }
.contact .frm-set input[type="radio"]:checked + label { color: #fff; background-color: var(--blue04); }

@media screen and (max-width:1320px){ 
    /* Support - contact us */
    .sub.contact { padding-top: 20rem; }
}
@media screen and (max-width:1024px){ 
    /* Support - contact us */
    .sub.contact { padding-top: 18rem; }
    .sub.contact .contact-wrap { padding: 8rem 5.5rem; }
}
@media screen and (max-width:800px){ 
    /* Support - contact us */
    .sub.contact { padding-top: 16rem; }
    .sub.contact .contact-wrap { padding: 6rem 4rem; }
    .contact-wrap .sub-tit > br { display: none; }

    /* Support - complate */
    .sub.contact.complate { margin-top: 10rem; padding-top: 12rem; }
    .complate .comp-wrap .ico-box { width: 9rem; }
}
@media screen and (max-width:640px){ 
    /* form - contact us */
    .contact .frm-sec1 .frm-set:not(.frm-half) { flex-wrap: wrap; gap: 2rem 1rem; }
    .contact .frm-sec1 .frm-set:not(.frm-half) > label { width: 100%; }
    .contact .frm-sec1 .frm-set:not(.frm-half) > div { width: calc((100% - 2rem) / 2); }
}
@media screen and (max-width:480px){ 
    /* Support - contact us */
    .sub.contact { padding-bottom: 10rem; }
    .sub.contact .contact-wrap { padding: 6.25rem 1.875rem; }
    .contact-wrap .tit-box { padding-bottom: 4.375rem; margin-bottom: 1.5rem; }
    .sub.contact .tit-box .list-h3 { font-size: 3.75rem; margin-bottom: 1.875rem; }
    .contact-wrap .sub-tit { width: 90%; margin: 0 auto; font-size: 1.875rem; }

    /* Support - complate */
    .sub.contact.complate { margin-top: 8.5rem; padding-top: 14.25rem; }
    .complate .comp-wrap .ico-box { width: 8.75rem; margin: 0 auto 5rem; }
    .complate .comp-wrap .mini-tit { font-size: 2.25rem; margin-bottom: 1.25rem; }
    .complate .comp-wrap .sub-tit { font-size: 1.875rem; }
    .complate .comp-wrap .btn-wrap { margin-top: 6.25rem; }
 
    /* form - contact us */
    .contact .frm-sec1 .frm-set:not(.frm-half) > div { width: max-content; }
    .contact .frm-set input[type="radio"] + label { font-size: 1.75rem; padding: 1.25rem 1.875rem; }
}

/* ------------------- Support E ------------------------- */





/* ------------------- Company S ------------------------- */

/* Company - ESG 공통 */
.company-esg { background-color: var(--cool-gray100); }
.company-esg > .tap-cont { display: none; }
.company-esg > .tap-cont.active { display: block; }
.company-esg .sub-contents .inner { max-width: 1440px; }
.company-esg .sub-visual { display: flex; justify-content: center; align-items: center; height: auto; aspect-ratio: 1/0.364; max-height: 70rem; border-radius: 0; }
.company-esg .sub-visual h2 { font: 600 7.6rem/110% var(--font-family); color: #fff; }
.company-esg .tap-menu { display: flex; justify-content: center; width: 100%; background-color: #fff; }
.company-esg .tap-menu > a { display: block; width: 50%; max-width: 30.7rem; padding: 2.5rem 0; text-align: center; font: 500 2rem/140% var(--font-family); color: var(--sub-black); letter-spacing: -0.4px; }
.company-esg .tap-menu > a.active { color: var(--blue04); border-bottom: 2px solid var(--blue04); }

.tap-cont-ESG-02 .sub-contents { padding-bottom: 16rem; }


/* Company - ESG philosophy */
.company-esg .philosophy { background-color: #fff; }
.company-esg .philosophy .sub-contents .inner { max-width: 1520px; }
.philosophy .sub-contents { padding-top: 0; padding-bottom: 16rem; }
.philosophy .sub-tit { font: 600 1.4rem/130% var(--font-family); }

.philosophy .sec-philosophy { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2rem; width: 100%; height: 100vh; max-height: 970px; background: url('/images/company/sub_esg_philosophy_bg.jpg') no-repeat center/cover; }
.philosophy .sec-philosophy .sub-tit { color: #fff; }
.philosophy .sec-philosophy p:not(.sub-tit) { max-width: 118rem; margin: 0 auto; font: 600 4.5rem/150% var(--font-family); text-align: center; color: #66D370; }

.philosophy .sec-vision { padding-top: 17rem; }
.philosophy .sec-vision .tit-box { text-align: center; margin-bottom: 8rem; }
.philosophy .sec-vision .tit-box .sub-tit { color: #084AF7; margin-bottom: 2rem; }
.philosophy .sec-vision .tit-box h4 { font: var(--eng-tit45); }
.philosophy .sec-vision .cont { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3rem; padding: 4rem; border-radius: 3rem; background-color: var(--cool-gray100); }

.philosophy .sec-vision .cont-wrap { display: flex; flex-direction: column; gap: 8rem; padding: 0; }
.philosophy .sec-vision .cont .txt-box { padding-left: 4rem; padding-top: 3rem; position: relative; }
.philosophy .sec-vision .cont.cont2 .txt-box { padding-left: 5rem; }
.philosophy .sec-vision .cont .ico-box { width: 8rem; aspect-ratio: 1/1; border-radius: 1rem; overflow: hidden; margin-bottom: 7rem; }
.philosophy .sec-vision .cont .cont-tit { font: 500 5rem/110% var(--font-family); letter-spacing: -0.5px; margin-bottom: 1rem; }
.philosophy .sec-vision .cont .sub-txt { font: var(--eng-txt18); margin-bottom: 2rem; color: var(--sub-black); }
.philosophy .sec-vision .cont li {display: flex; align-items: flex-start; gap: 1rem; font: var(--eng-txt20); position: relative; }
.philosophy .sec-vision .cont li::before { content: ''; display: block; width: 2rem; height: 2rem; background: url('/images/company/sub_esg_philosophy_ico_chk.png') no-repeat center/contain; margin-top: 0.4rem; flex-shrink: 0; }
.philosophy .sec-vision .cont li + li { margin-top: 0.5rem; }
.philosophy .sec-vision .cont .txt-box a { display: flex; align-items: center; gap: 0.5rem; width: max-content; border-radius: 4rem; background-color: #fff; padding: 1.3rem 3rem; font: 500 1.8rem/120% var(--font-family); color: var(--sub-black); margin-top: 4rem; }
.philosophy .sec-vision .cont .txt-box a::after { content: ''; display: block; width: 2.2rem; height: 2.2rem; background: url('/images/company/sub_esg_ico_download.svg') no-repeat center/contain; }
.philosophy .sec-vision .cont.cont1 .txt-box a { margin-top: 5.3rem; }
.philosophy .sec-vision .cont .img-box { width: 100%; aspect-ratio: 705/569; border-radius: 2.5rem; overflow: hidden; }
.philosophy .sec-vision .cont .img-box > img { width: 100%; max-width: unset; height: 100%; object-fit: cover; }


/* Company - ESG Ethics */
.company-esg .tit-box { margin-bottom: 6rem; }
.company-esg .tit-box h4 { font: 500 2.8rem/120% var(--font-family); margin-bottom: 3rem; }
.company-esg .tit-box > div { display: grid; grid-template-columns: 96rem auto; gap: 7rem; padding: 5rem; border-radius: 2.5rem; background-color: var(--cool-gray200); }
.company-esg .tit-box .txt-box p { font: 400 2rem/160% var(--font-family); }
.company-esg .tit-box .txt-box p + p { margin-top: 2rem; }
.company-esg .tit-box .txt-box p > b { font-weight: 600; }
.company-esg .tit-box .img-box { aspect-ratio: 314/223; max-width: 39.25rem; margin: 0 0 0 auto; border-radius: 2rem; overflow: hidden; }
.company-esg .tit-box .img-box > img { width: 100%; max-width: unset; height: 100%; object-fit: cover; }
.company-esg .tap-cont-ESG-02 { background: var(--cool-gray100); }

.company-esg .cont-wrap { padding: 10rem 8.5rem; border-radius: 3rem; background-color: #fff; position: relative; }
.company-esg .cont-wrap .tap-menu { margin-bottom: 5rem; }
.company-esg .cont-wrap .tap-menu > .mob-menu { display: none; }
.company-esg .cont-wrap .tap-menu ul { display: flex; height: 4.2rem; border-radius: 3.2rem; background-color: var(--cool-gray100); padding: 0.4rem; }
.company-esg .cont-wrap .tap-menu ul li { display: flex; justify-content: center; align-items: center; height: 3.4rem; padding: 0 1.5rem; border-radius: 5rem; color: var(--sub-black); font: 600 1.6rem/120% var(--font-family); cursor: pointer; }
.company-esg .cont-wrap .tap-menu ul li.on { background-color: var(--blue04); color: #fff; }

.company-esg .cont-wrap .cont-tit { margin-bottom: 4.5rem; }
.company-esg .cont-wrap .cont-tit .tit { font: var(--eng-tit45); margin-bottom: 1.5rem; text-align: center; } 
.company-esg .cont-wrap .cont-tit .sub-tit { font: var(--eng-txt18); color: var(--sub-black); text-align: center; } 
.company-esg .cont-wrap .cont-feat { padding: 6rem 8.5rem; border-radius: 2rem; border: 1px solid #ddd; margin-bottom: 6rem; }
.company-esg .cont-wrap .cont-feat ul { display: flex; justify-content: center; }
.company-esg .cont-wrap .feat-box:nth-child(2) { margin: 0 9.6rem 0 11.1rem; }
.company-esg .cont-wrap .cont2 .feat-box:nth-child(2) { margin: 0 13rem 0 7.5rem; }
.company-esg .cont-wrap .feat-box { text-align: center; }
.company-esg .cont-wrap .feat-box .ico-box { width: 7.5rem; aspect-ratio: 1/1; border-radius: 1rem; overflow: hidden; margin: 0 auto 3rem; }
.company-esg .cont-wrap .feat-box .tit { font: var(--eng-tit24); margin-bottom: 1rem; }
.company-esg .cont-wrap .esg_human .feat-box .tit { margin-bottom: 0; }
.company-esg .cont-wrap .feat-box .txt { font: var(--eng-txt18); color: var(--sub-black); }

.company-esg .form-wrap .frm-sec1 .frm-set > div { display: flex; align-items: center; gap: 2rem; }
.company-esg .form-wrap .frm-sec1 .frm-set > div > div { display: flex; align-items: center; gap: 1rem;}
.company-esg .form-wrap .frm-sec1 .frm-set input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 2rem; height: 2rem; border: 1px solid #ddd; background-color: var(--cool-gray100); border-radius: 50%; outline: none; cursor: pointer; }
.company-esg .form-wrap .frm-sec1 .frm-set input[type="radio"]:checked { background-color: var(--blue04); width: 2rem; height: 2rem; border: 3px solid white; box-shadow: 0 0 0 1.6px var(--blue04); }
.company-esg .form-wrap .frm-sec1 .frm-set input[type="radio"] + label { font: var(--eng-txt20); color: var(--sub-black); }
.company-esg .form-wrap .frm-sec1 .frm-set:nth-child(1) .input-wrap { max-width: 32rem; }
.company-esg .form-wrap .frm-sec1 select { width: 100%; padding: 1.7rem 3rem; border-radius: 1rem; border: 1px solid #ddd; background: var(--cool-gray100) url('/images/sub_ico_arr_down_line.svg') no-repeat 95% center/13px 7px; font: var(--eng-txt20); color: var(--sub-black); }
.company-esg .form-wrap .frm-sec1 select:focus { outline: 2px solid var(--blue04); }
.company-esg .form-wrap .txt-box > p { margin-bottom: 1rem; }
.company-esg .form-wrap .txt-box ol { display: flex; flex-direction: column; gap: 1rem; }
.company-esg .form-wrap .txt-box ol ol { padding-left: 1.4rem; padding-top: 1rem; }
.company-esg .form-wrap .txt-box ol ol p { padding-top: 0.5rem; }
 
@media screen and (max-width:1440px){
    /* Company - ESG philosophy */
    .philosophy .sec-vision .cont .ico-box { margin-bottom: 4rem; }
    .philosophy .sec-vision .cont .cont-tit { font-size: 4.5rem; }
    .philosophy .sec-vision .cont .txt-box a,
    .philosophy .sec-vision .cont.cont1 .txt-box a { margin-top: 3.5rem; }

    /* Company - ESG Ethics */
    .company-esg .sub-visual h2 { font-size: 7rem; }
    .company-esg .tit-box > div { gap: 2rem; }
}
@media screen and (max-width:1320px){
    /* Company - ESG philosophy */
    .company-esg .philosophy .sub-contents { padding-top: 0; padding-bottom: 12rem; }
    .philosophy .sec-philosophy { height: auto; padding: 16rem 0; }
    .philosophy .sec-philosophy p:not(.sub-tit) { width: 90%; font-size: 4.2rem; }

    .philosophy .sec-vision .cont { grid-template-columns: auto 40%; }
    .philosophy .sec-vision .cont.cont2 { grid-template-columns: 40% auto; }
    .philosophy .sec-vision .cont .txt-box { padding-left: 2rem; padding-top: 1rem; }
    .philosophy .sec-vision .cont.cont2 .txt-box { padding-left: 2rem; }
    .philosophy .sec-vision .cont .ico-box { width: 6rem; margin-bottom: 3rem; }
    .philosophy .sec-vision .cont .cont-tit { font-size: 3.8rem; }

    /* Company - ESG Ethics */
    .company-esg .sub-visual h2 { font-size: 6rem; }
    .company-esg .tap-cont-ESG-02 .sub-contents { padding-top: 12rem; padding-bottom: 13rem; }
    .company-esg .tit-box > div { grid-template-columns: auto 30rem; gap: 3rem; }
    .company-esg .tit-box .txt-box p > br { display: none; }
    .company-esg .tit-box .img-box { max-width: 30rem; }
    .company-esg .cont-wrap { padding: 8rem; }
    .company-esg .cont-wrap .cont-tit .sub-tit > br { display: none; }
    .company-esg .cont-wrap .cont-feat { padding: 5rem; }
    .company-esg .cont-wrap .cont-feat ul { gap: 5rem; }
    .company-esg .cont-wrap .feat-box:nth-child(2),
    .company-esg .cont-wrap .cont2 .feat-box:nth-child(2) { margin: 0; }
    .company-esg .cont-wrap .feat-box .txt > br { display: none; }

    .company-esg .form-wrap .frm-sec1 { flex-direction: column; flex-wrap: nowrap; }
    .company-esg .form-wrap .frm-sec1 > .frm-set { width: 100%; }
}
@media screen and (max-width:1024px){
    /* Company - ESG philosophy */
    .philosophy .sec-vision .cont-wrap { gap: 4rem; }
    .philosophy .sec-vision .cont { display: flex; flex-direction: column; padding: 6rem; }
    .philosophy .sec-vision .cont.cont2 { flex-direction: column-reverse; }
    .philosophy .sec-vision .cont .txt-box,
    .philosophy .sec-vision .cont.cont2 .txt-box { padding-left: 0; }
    .philosophy .sec-vision .cont li > br { display: none; }

    /* Company - ESG Ethics */
    .company-esg .sub-visual h2 { font-size: 5rem; }
    .company-esg .tap-cont-ESG-02 .sub-contents { padding-top: 10rem; padding-bottom: 12rem; }
    .company-esg .tit-box > div { grid-template-columns: auto; }
    .company-esg .cont-wrap { padding: 6rem; }
}
@media screen and (max-width:800px){
    /* Company - ESG philosophy */
    .philosophy .sec-vision { padding-top: 80px; }
    .philosophy .sec-vision .tit-box { margin-bottom: 5rem; }
    .philosophy .tit-box h4 { width: 100%; max-width: 40rem; margin: 0 auto; }
    .company-esg .philosophy .sec-vision .tit-box h4 { max-width: unset; font-size: 4.5rem; }
    .company-esg .philosophy .sec-vision .tit-box h4 > br { display: none; }
 
    /* Company - ESG Ethics */
    .company-esg .sub-visual { height: 50vh; max-height: 50rem; aspect-ratio: unset; }
    .company-esg .tap-menu > a { font-size: 1.875rem; padding: 1.875rem 0 1.75rem; }
    .company-esg .tap-cont-ESG-02 .sub-contents { padding-top: 8rem; }    
    .company-esg .cont-wrap { padding: 4rem; }
    .company-esg .cont-wrap .cont-tit .tit { font-size: 3.5rem; }
    .company-esg .cont-wrap .cont-feat ul { flex-direction: column; }
    .company-esg .cont-wrap .feat-box .tit > br { display: none; }
}
@media screen and (max-width:640px){
    /* Company - ESG philosophy */
    .philosophy .sec-philosophy { gap: 1.25rem; padding: 13.5rem 0; }
    .philosophy .sec-philosophy .sub-tit { font-size: 1.5rem; margin-bottom: 0; }
    .philosophy .sec-philosophy p:not(.sub-tit) { font-size: 3rem; } 
    .company-esg .philosophy .sec-vision .tit-box h4 { font-size: 3rem; }
    .philosophy .sec-vision .tit-box .sub-tit { margin-bottom: 10px; }
    .philosophy .sec-vision .cont { gap: 6.75rem; padding: 3.75rem; border-radius: 1.875rem; }
    .philosophy .sec-vision .cont .ico-box { width: 6.25rem; margin-bottom: 5rem; }
    .philosophy .sec-vision .cont .cont-tit { font-size: 4rem; margin-bottom: 1.25rem; }
    .philosophy .sec-vision .cont .sub-txt { font-size: 1.875rem; margin-bottom: 1.875rem; }
    .philosophy .sec-vision .cont .txt-box { padding-top: 0; }
    .philosophy .sec-vision .cont li { font-size: 1.875rem; }
    .philosophy .sec-vision .cont li::before { width: 1.75rem; height: 1.75rem; }
    .philosophy .sec-vision .cont .txt-box a,
    .philosophy .sec-vision .cont.cont1 .txt-box a { justify-content: center; gap: 0.625rem; width: 100%; margin-top: 3.75rem; }

    /* Company - ESG Ethics */
    .company-esg .sub-visual h2 { font: 4.5rem; }
    .company-esg .sub-contents { padding-bottom: 10rem; }   
    .company-esg .tit-box { margin-bottom: 15.25rem; }
    .company-esg .tit-box > div { padding: 3.5rem; }
    .company-esg .cont-wrap { padding: 6.25rem 4rem; }
    .company-esg .cont-wrap .tap-menu { display: block; width: 100%; background-color: transparent; position: absolute; left: 50%; top: -3.75rem; transform: translate(-50%, -100%); }
    .company-esg .cont-wrap .tap-menu > .mob-menu { display: block; height: 42px; background: var(--blue04) url('/images/sub_ico_arr_down_wh.svg') no-repeat 95% center/9px 8px; color: #fff; border-radius: 5rem; padding: 1.625rem 2.875rem 1.5rem; font: 600 15px/120% var(--font-family); }
    .company-esg .cont-wrap .tap-menu ul { display: block; width: 100%; height: auto; max-height: 0; padding: 0 4px; background-color: #fff; border-radius: 20px; position: absolute; top: 6rem; box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.15); overflow: hidden; transition: all 0.4s ease; }
    .company-esg .cont-wrap .tap-menu ul.active { padding: 4px; max-height: 20rem; }
    .company-esg .cont-wrap .tap-menu ul li { justify-content: flex-start; font-size: 16px; height: 40px; padding: 4px 22px; color:var(--main-black); }
    .company-esg .cont-wrap .tap-menu ul li.on { background-color: var(--cool-gray100); color: var(--sub-black); }
    .company-esg .cont-wrap .cont-feat { padding: 4rem; }
    .company-esg .cont-wrap .cont-feat ul { gap: 3.75rem; }
    .company-esg .cont-wrap .feat-box { display: grid; grid-template-columns: 5rem auto; gap: 1.875rem; text-align: left; }
    .company-esg .cont-wrap .feat-box .ico-box { width: 5rem; }

    .company-esg .form-wrap .frm-sec1 .frm-set > div { flex-wrap: wrap; }
    .company-esg .form-wrap .frm-sec1 .frm-set:nth-child(1) .input-wrap { max-width: unset; }
}
@media screen and (max-width:480px){ 
    /* Company - ESG philosophy */
    .philosophy .sec-philosophy p:not(.sub-tit) { width: 80%; margin: 0 auto; }
    .company-esg .philosophy .sec-vision .tit-box h4 { width: 80%; margin: 0 auto; }
    .philosophy .sec-vision .cont { padding: 30px; }
    .philosophy .sec-vision .cont .cont-tit { padding: 0; }
    .philosophy .sec-vision .cont .sub-txt > br { display: none; }
    .philosophy .sec-vision .cont .img-box { aspect-ratio: 288/232; border-radius: 1.25rem; }
    
    /* Company - ESG Ethics */
    .company-esg .tit-box > div { padding: 2.5rem; }
    .company-esg .tit-box .txt-box p > br { display: block; }
    .company-esg .tit-box .img-box { max-width: none; }
    .company-esg .cont-wrap { padding: 6.25rem 1.875rem; }
    .company-esg .cont-wrap .cont-tit  { padding: 0 5%; margin-bottom: 3.75rem; }
    .company-esg .cont-wrap .cont-tit .tit { font-size: 3rem; margin-bottom: 1.25rem; }
    .company-esg .cont-wrap .cont-tit .sub-tit { font-size: 1.875rem; }
    .company-esg .cont-wrap .cont-feat { padding: 3.75rem 2.5rem; margin-bottom: 5rem; }
    .company-esg .cont-wrap .feat-box .tit { font-size: 2rem; }
    .company-esg .cont-wrap .feat-box .txt { font-size: 1.875rem; }
}
/* ------------------- Company E ------------------------- */



.client { padding-top: 12.6rem; padding-bottom: 15rem; background: #F1F5F8; }
.client h2 { font-size: var(--sub-font-size-1); line-height: 1.1; font-weight: 600; text-align: center; }
.client .client-logos > div { margin-top: 10rem; }
.client .client-logos h3 { margin-bottom: 3rem; font-size: var(--sub-font-size-3); line-height: 1.2; font-weight: 600; }
.client .client-logos ul { display: grid; grid-template-columns: repeat(5, 1fr); gap:2rem; }
.client .client-logos li { display: flex; align-items: center; justify-content: center; aspect-ratio: 288/130; border-radius: 1rem; background: white; }


.technical-support { text-align: center; }
.technical-support h2 { font-size: var(--sub-font-size-1); line-height: 1.1; font-weight: 600; }
.technical-support h3 { font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.2; }
.technical-support h4 { font-size: var(--sub-font-size-4); font-weight: 600; margin-bottom: 1.5rem; padding-left: 2rem; position: relative; text-align: left; }
.technical-support h4::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: .9rem; height: .9rem; background-color: var(--main-black); border-radius: 50%; } 
.technical-support h5 { font-size: var(--sub-font-size-3); font-weight: 600; text-align: center; }
.technical-support .section-1 { padding:12.6rem 0 17rem; }
.technical-support .section-1 h3 { margin-top: 10rem; }
.technical-support .title-wrap { text-align: center; margin-bottom: 8rem; }
.technical-support .title-wrap p { margin-top:1.5rem; font-size: 2rem; line-height: 1.3; color: var(--sub-black); } 
.technical-support .process-table-wrap { display: flex; gap:3rem; margin-top: 8rem; } 
.technical-support .process-table-wrap table { flex:1; box-shadow: 0px 20px 20px 0px #8888881A; border-radius: 1rem; }
.technical-support .process-table-wrap th { font-size: var(--font-size-3); font-weight: 600; background-color: #B5E2FF; padding: 1.3rem; border-radius: 1rem 1rem 0 0; }
.technical-support .process-table-wrap td { padding: 3rem 2.4rem; text-align: left; font-size: var(--font-size-3); line-height: 1.3; border-radius: 0 0 1rem 1rem; }
.technical-support table ul { padding-left: 20px; } 
.technical-support table ul li { list-style: disc; font-size: var(--font-size-3); color: var(--sub-black); line-height: 1.3; } 

.technical-support .section-2 { padding:13rem 0 15rem; background: #F1F5F8; }
.technical-support .content-table-wrap { margin-bottom: 8rem; } 
.technical-support .content-table-wrap table { width: 100%; border-collapse: separate; border-spacing: 0 2rem;}
.technical-support .content-table-wrap tr:has(td) { box-shadow: 0px 20px 20px 0px #8888881A; border-radius: 1rem; }
.technical-support .content-table-wrap th { padding: 1.6rem; background: #E3E8ED; color: #414648; font-size: var(--font-size-3); line-height: 1.3; }
.technical-support .content-table-wrap td { padding: 3.4rem; text-align: left; background: white; }
.technical-support .content-table-wrap th:nth-child(1),
.technical-support .content-table-wrap td:nth-child(1) { width:22%; border-radius: 1rem 0 0 1rem; }
.technical-support .content-table-wrap th:last-child,
.technical-support .content-table-wrap td:last-child { width: 36%; border-radius: 0 1rem 1rem 0; }


.policy { padding-top: 16.2rem; padding-bottom: 15rem; }
.policy h2 { font-size: 6.6rem; line-height: 1.1; font-weight: 500; }
.policy .h2-wrap { display: flex; justify-content: space-between; align-items: end; padding-bottom: 5rem; border-bottom: 2px solid var(--main-black); }
.policy .h2-wrap select { width: 368px; height: fit-content; font-size: var(--font-size-3); padding: 1rem 1.4rem; border: 1px solid var(--sub-black); cursor: pointer; background: white url('/images/select_arw.svg') no-repeat center right 20px / 12px; }
.policy .policy-item-title { cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 2.5rem 3.5rem 2.5rem 0; font-size: var(--font-size-3); font-weight: 600; line-height: 1.3; border-bottom: 1px solid var(--main-black); }
.policy .policy-item-title .arrow { width: 17px; height: 10px; transition: transform 0.3s ease; background: white url('/images/select_arw.svg') no-repeat center / cover; } 
.policy .policy-item-title.active .arrow { transform: rotate(180deg); } 
.policy .policy-item-content { display: none; padding: 2rem 0; line-height: 1.3; font-size: var(--font-size-3); color:var(--sub-black); border-bottom: 1px solid var(--main-black); } 
.policy .policy-item-content > div { display: flex; flex-direction: column; gap:1.5rem; }
.policy ul { padding-left: 2rem; } 
.policy ul li { margin-bottom: 1rem; list-style: disc; } 
.policy ol { padding-left: 2.5rem; } 
.policy ol li { position: relative; }
.policy ol li::before { content: ""; position: absolute; left: -2.5rem; top: 0; }
.policy ol li:nth-child(1):before { content: '①'; }
.policy ol li:nth-child(2):before { content: '②'; }
.policy ol li:nth-child(3):before { content: '③'; }
.policy ol li:nth-child(4):before { content: '④'; }
.policy ol li:nth-child(5):before { content: '⑤'; }
.policy ol li:nth-child(6):before { content: '⑥'; }
.policy ol li:nth-child(7):before { content: '⑦'; }
.policy ol li:nth-child(8):before { content: '⑧'; }
.policy ol li:nth-child(9):before { content: '⑨'; }
.policy ol li:nth-child(10):before { content: '⑩'; }
.policy ol li:nth-child(11):before { content: '⑪'; }
.policy ol li:nth-child(12):before { content: '⑫'; }
.policy ol li:nth-child(13):before { content: '⑬'; }
.policy ol li:nth-child(14):before { content: '⑭'; }

.policy .policy-cookie { display: flex; flex-direction: column; gap:5rem; }
.policy .policy-cookie h4 { margin-bottom: 2rem; font-size: var(--font-size-3); font-weight: 600; }
.policy .policy-cookie-content { display: flex; flex-direction: column; gap:1.5rem; font-size: var(--font-size-3); line-height: 1.3; color: var(--sub-black); }


.certifications h2 { padding-top: 15rem; padding-bottom: 10rem; font-size: var(--sub-font-size-1); line-height: 1.1; font-weight: 600; text-align: center; }
.certifications h5 { margin-bottom: 2rem; font-weight: 600; font-size: var(--sub-font-size-3); }
.certifications .h3-wrap h3 { font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.2; }
.certifications .h3-wrap p { margin-top: 1.5rem; font-size: var(--font-size-3); line-height: 1.3; color:var(--sub-black); }
.certifications .certifications-intro-wrap { z-index: 1; position: relative; padding: 13rem 0; background: #ECF7FF; }
.certifications .certifications-intro-wrap::before { content: ''; z-index: -1; display: block; position: absolute; right:0; bottom:0; aspect-ratio: 587/833; max-width: 587px; width: 60%; background:url('/images/company/cert_bg.svg') no-repeat center/contain; }
.certifications .certifications-intro { display: grid; grid-template-columns: repeat(2, 1fr); gap:5rem; }
.certifications .certifications-intro > div { display: flex; flex-direction: column; justify-content: space-between; gap:5rem; }
.certifications .certifications-intro > div:nth-child(1) p { max-width:468px; }
.certifications .certifications-intro > div:nth-child(2) p { max-width:620px; }
.certifications .certifications-intro .cert-item-wrap { position: relative; display: flex; gap:3rem; }
.certifications .certifications-intro .cert-item { width: fit-content; }
.certifications .swiper-pagination { display: none; pointer-events: none; }

.certifications .cert-item p { margin-top: 2.5rem; font-size: var(--font-size-2); color:var(--sub-black); text-align: center; }
.certifications .cert-item img { max-width: none; }
.certifications .certification-program-wrap { padding: 17rem 0 15rem; }
.certifications .certification-program-wrap .h3-wrap { margin-bottom: 8rem; }
.certifications .certification-program-wrap .cert-item-wrap:not(:last-child) { margin-bottom: 10rem; }
.certifications .certification-program-wrap .cert-item-wrap-2 { display: flex; gap:3rem; }
.cert-item-2 { width: 40%; display: flex; gap:3rem; }
.certifications .certification-program-wrap .cert-item-wrap-2 .swiper-arrow { display: none; }
.certifications .certification-program-wrap .cert-item-wrap-2 .cert-other { width: 60%; position: relative; }
.certifications .certification-program-wrap .cert-item-wrap-3 { display: flex; gap:3rem; }
.certifications .swiper-container { width: 100%; }
.certifications .swiper-container .swiper-wrapper { width: 100%; height: fit-content; }
.certifications .swiper-button-prev,
.certifications .swiper-button-next { top:40%; }
.certifications .swiper-button-prev { transform: translateX(-100%); }
.certifications .swiper-button-next { transform: translateX(100%) scaleX(-1); }

.item-dummy { opacity: 0; pointer-events: none; }


.careers { overflow-x: hidden; }
.careers h3 { font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.2; }
.careers h4 { font-size: var(--sub-font-size-3); font-weight: 600; line-height: 1.2; }
.careers .sub-visual { height:70rem; border-radius: 0; }
.careers .sub-visual .inner { display: flex; align-items: center; justify-content: center; }
.careers .sub-visual h2 { font-size: var(--sub-font-size-1); font-weight: 600; line-height: 1.1; }
.careers .h3-wrap p { margin-bottom: 2rem; color:#084AF7; font-size: 14px; font-weight: 600; }
.careers .h3-wrap h3 { margin-bottom: 8rem; }
.careers .careers-section-01 { padding-bottom: 17rem; text-align: center; }
.careers .careers-section-01 .img-box { border-radius: 3rem; overflow: hidden; }
.careers .careers-section-02 { padding-bottom: 15rem; }
.careers .careers-section-02 h3 { margin-bottom: 3rem; }
.careers .careers-section-02 .talent-list { display: grid; grid-template-columns: repeat(3, 1fr); gap:3rem; height: 73rem; }
.careers .careers-section-02 .talent-list > div { display: flex; align-items: end; padding: 3.5rem; border-radius: 2rem; color:white; }
.careers .careers-section-02 .talent-list > div:nth-child(1) { grid-row: 1/3; background: url('/images/careers/01_2_1.jpg') no-repeat center/cover; }
.careers .careers-section-02 .talent-list > div:nth-child(2) { grid-column: 2/4; background: url('/images/careers/01_2_2.jpg') no-repeat center/cover; }
.careers .careers-section-02 .talent-list > div:nth-child(3) { background: url('/images/careers/01_2_3.jpg') no-repeat center/cover; }
.careers .careers-section-02 .talent-list > div:nth-child(4) { background: url('/images/careers/01_2_4.jpg') no-repeat center/cover; }
.careers .careers-section-02 .talent-list p { margin-top: 1rem; font-size: var(--font-size-3); line-height: 1.3; }
.careers .careers-section-03 { padding: 13rem 0; text-align: center; background: #ECF7FF; }
.careers .careers-section-03 ul { display: grid; grid-template-columns: repeat(4, 1fr); gap:4rem; margin-top: 8rem; }
.careers .careers-section-03 li { position: relative; }
.careers .careers-section-03 li:not(:last-child)::after { content: ''; position: absolute; right: -3rem; top: 40%; transform: translateY(-50%) scaleX(-1); width: 1.4rem; height: 2.7rem; background: url('/images/swiper_arw.svg') no-repeat center/contain; }
.careers .careers-section-03 h4 { margin-top: 2rem; font-weight: 500; }
.careers .careers-section-03 .process-info { display: flex; justify-content: right; margin-top: 5rem; font-size: var(--font-size-3); color:var(--sub-black); text-align: left; }
.careers .careers-section-03 .process-info dl { display: grid; grid-template-columns: repeat(2, auto); gap:.5rem; }
.careers .careers-section-03 .process-info dt { position: relative; padding-left: 1.6rem; }
.careers .careers-section-03 .process-info dt::before { content: ''; position: absolute; left: 0; top: 1rem; width: 4px; height: 4px; background: var(--sub-black); border-radius: 50%; }
.careers .careers-section-04 { padding: 17rem 0 7rem; }
.careers .careers-section-04 h3 { margin-bottom: 8rem; }
.careers .careers-section-04 .employee-benefits-list { display: grid; grid-template-columns: 1fr 1024px; gap:3rem; margin-bottom: 10rem; }
.careers .careers-section-04 .employee-benefits-list ul { display: grid; grid-template-columns: repeat(5, 1fr); gap:6rem 1rem; justify-content: space-between; text-align: center; }
.careers .careers-section-04 .employee-benefits-list .step { margin-top: 1.5rem; font-size: var(--font-size-2); font-weight: 500; line-height: 1.2; }
.careers .careers-section-05 { padding: 0 0 15rem; text-align: center; }
.careers .careers-section-05 p { margin-top: 1.5rem; font-size: var(--font-size-3); color: #575757; }
.careers .careers-section-05 .swiper-container { margin-top: 8rem; }
.careers .careers-section-05 .swiper-container li { width: 64.6rem; aspect-ratio: 646/461; border-radius: 2rem; overflow: hidden; }

.careers .grow-with-us { height: 90vh; padding: 11.5rem 0; background: url('/images/careers/01_6.jpg') no-repeat center/cover; color:white; overflow: hidden; }
.careers .grow-with-us .grow-with-us-inner { display: flex; align-items: end; height:100%; width: 92%; max-width: 1660px; margin: 0 auto; }
.careers .grow-with-us h3 { font-size: 6.6rem; font-weight: 500; line-height: 1.3; }
.careers .grow-with-us p { max-width: 680px; margin: 3rem 0 6rem; font-size: var(--font-size-2); color:#AAAAAA; }
.careers .grow-with-us .btn-link { border:1px solid white; }
.careers .grow-with-us .btn-link:hover { background: #7CFF01; border-color: #7CFF01; }
.careers .grow-with-us .btn-link:hover::after { filter:none; }
.careers .grow-with-us .btn-link .trans-x-box > span::after { color:var(--main-black); }

.careers .swiper-arrow { width: 103px; height: 22px; margin: 60px auto 0; position: relative; }
.careers .swiper-pagination { display: block; color:var(--sub-black); font-size: 16px; font-weight: 500; bottom:0; left:50%; transform: translateX(-50%); }
.careers .swiper-button-prev, .careers .swiper-button-next { width: 23px; top:0; bottom:auto; }
.careers .swiper-button-next, .careers .swiper-container-rtl .swiper-button-prev,
.careers .swiper-button-prev, .careers .swiper-container-rtl .swiper-button-next { background-size: 6px; }


.connect { overflow: hidden; }
.connect h3 { font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.2; }
.connect .h3-wrap p { margin-bottom: 2rem; color:#084AF7; font-size: 14px; font-weight: 600; }
.connect .sub-visual { height: 100vh; padding: 11.4rem 0; border-radius: 0; } 
.connect .sub-visual .inner { display: flex; flex-direction: column; justify-content: end; height: 100%; }
.connect .sub-visual-text { text-align: center; font-size: var(--sub-font-size-4); line-height: 1.3; }
.connect .sub-visual-title { position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); display: flex; height: 100%; align-items: center; justify-content: center; }
.connect .sub-visual-title .line { position: relative; height:100%; }
.connect .sub-visual-title .line span { position: absolute; left:50%; top:50%; width: 1px; height: 100%; background:white; }
.connect .sub-visual-title p { font-size: 10rem; line-height: 1; font-weight: 500; flex-shrink: 0; }
.connect .sub-visual-title p:nth-child(1) { padding-right: 5rem; }
.connect .sub-visual-title p:nth-child(3) { padding-left: 5rem; }
.connect .sub-contents { padding-top: 0; }
.connect .company-intro-section { position: relative; height: 100vh; display: flex; align-items: center; text-align: center; overflow: hidden; }
.connect .company-intro-section .h3-wrap { max-width: 1000px; margin:0 auto 5rem; }
.connect .company-intro-section .company-intro-bg { opacity: 1 !important; position: absolute; inset: 0; background: url('/images/company/01_1.jpg') no-repeat center / cover; }
.connect [data-aos^=zoom][data-aos^=zoom].aos-animate { transform: translateZ(0) scale(1.2); }
.connect .company-intro-text { max-width: 890px; margin:0 auto; font-size: var(--font-size-2); color:#414648; line-height: 1.6; }

.connect .business-section { padding: 17rem 0; text-align: center; }
.connect .business-section h3 { margin-bottom: 8rem; font-size: 6.6rem; font-weight: 500; }
.connect .business-section .core-business-list ul { display: flex; gap: 3rem; } 
.connect .business-section .core-business-list li { flex:1; }
.connect .business-section .core-business-list li:nth-child(2) { transform: translateY(5rem); }
.connect .business-section .core-business-list li a { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; gap:4rem; padding: 9.6rem 2rem; overflow: hidden; border-radius: 2.5rem; background: linear-gradient(146.91deg, #AEE3FB 0%, #ECF7FF 92.51%); transition: .3s ease-in-out; }
.connect .business-section .core-business-list li a::before { content: ''; z-index: -1; position: absolute; inset: 0; background:linear-gradient(155.58deg, #5BCCFF -6.89%, #ECF7FF 76.25%); }
.connect .business-section .core-business-list li:hover a { transform: translateY(2rem); }
.connect .business-section .core-business-list h4 { font-size: 3.4rem; font-weight: 500; line-height: 1.1; }
.connect .business-section .core-business-list .arrow-link { position: absolute; top: 3.5rem; right: 3.5rem; width: 6.2rem; height: 6.2rem; border-radius: 50%; background: #084AF7 url("/images/company/01_3_arw.svg") no-repeat center/3rem; } 
.connect .core-business-marquee { margin-top: 18rem; }
.connect .core-business-marquee ul { display: flex; gap:15px; }
.connect .core-business-marquee ul + ul { margin-top: 2rem; flex-direction: row-reverse; }
.connect .core-business-marquee li { height: 64px; display: flex; align-items: center; gap:1rem; padding-left: 15px; padding-right: 2.5rem; color:#009AFF; background: #E3F4FF; flex-shrink: 0; transition: .3s ease-in-out; font-size: 2.4rem; font-weight: 600; border-radius: 5rem; }
.connect .core-business-marquee li p { transition: .3s ease-in-out; }
.connect .core-business-marquee li:hover { background: #009AFF; }
.connect .core-business-marquee li:hover p { filter: saturate(0) brightness(10); }

.connect .vision-section { z-index: 1; height: 100vh; display: flex; align-items: center; justify-content: center; color: white; position: relative; }
.connect .vision-section .vision-bg { z-index: -1; position: absolute; inset: 0; background: url('/images/company/01_3.jpg') no-repeat center / cover; }
.connect .vision-section .h3-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 84%; aspect-ratio: 1/1; text-align: center; background: url('/images/company/01_3_circle.svg') no-repeat center/contain; transform: rotate(-15deg); }
.connect .vision-section .h3-wrap.aos-animate { transform: rotate(0); }
.connect .vision-section .h3-wrap p { color:white; }
.connect .vision-section .h3-wrap h3 { font-size: 3.6rem; }
.connect .vision-section .inner { max-width: 1280px; height: 100%; display: flex; align-items: center; justify-content: center; }
.connect .absolute-text { position: absolute; width: 100%; max-width: 33.6rem; overflow: hidden; }
.connect .absolute-text h5 { position: relative; display: block; width: 100%; padding-bottom: 1rem; font-size: 16px; line-height: 1.4; }
.connect .absolute-text h5 .title { overflow: hidden; }
.connect .absolute-text h5 .title span { display: block; }
.connect .absolute-text h5 .line { position: absolute; left:0; bottom:0; width: 100%; height: 1px; background:#6D7578; }
.connect .absolute-text h5 .circle { display: inline-block; position: absolute; bottom:-2.5px; width: 5px; height: 5px; background: #6D7578; border-radius: 50%; }
.connect .absolute-text .text-content { margin-top: 3rem; font-size: var(--font-size-2); line-height: 1.3; overflow: hidden; }
.connect .absolute-text.left-text { left:0; top:25%; }
.connect .absolute-text.left-text h5 .circle { right:0; }
.connect .absolute-text.right-text { right:0; bottom:25%; text-align: right; }
.connect .absolute-text.right-text h5 .circle { left:0; }

.connect .history-section { padding: 17rem 0; }
.connect .history-section .year { padding-bottom:3.5rem; margin-bottom: 3rem; font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.1; color:#009AFF; border-bottom:3px solid #009AFF; }
.connect .history-section ul ul { max-width: 382px; width:90%; padding-left: 2rem; }
.connect .history-section ul ul li { margin-bottom: 7px; list-style: disc; font-size: var(--font-size-3); color: #575757; line-height: 1.3; } 
.connect .history-section ul ul li > * { line-height: 1.3; }
.connect .history-section .swiper-arrow { position: relative; height: 6rem; margin-top: 9rem; margin-bottom: 3rem; }
.connect .swiper-button-prev, .connect .swiper-button-next { top:0; background: url('/images/company/swiper_arw.svg') no-repeat center/contain; }
.connect .swiper-button-prev, .connect .swiper-container-rtl .swiper-button-next { left:auto; right:7rem; }
.connect .history-list-wrap { padding-left: 20rem; }

.connect .partners-section { padding: 13rem 0; text-align: center; background: #F1F5F8; }
.connect .partners-section h3 { font-size: 6.6rem; padding-bottom: 8rem; }
.connect .partners-list ul { display: flex; gap:2rem; }
.connect .partners-list ul:last-child { margin-top: 2rem; flex-direction: row-reverse; }
.connect .partners-list ul li { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 31.6rem; aspect-ratio: 316/130; border-radius: 1rem; background: white; }

.connect .company-info-section { padding: 17rem 0; }
.connect .company-info-section .company-info { display: flex; justify-content: space-between; gap:10rem; }
.connect .company-info-section h3 { font-weight: 500; font-size: 6.6rem; }
.connect .company-info-section .map { flex: 1; height: 60rem; border-radius: 2rem; overflow: hidden; }
.connect .company-info-section .info { display: flex; flex-direction: column; justify-content: space-between; max-width: 54.8rem; padding: 2.6rem 0; }
.connect .company-info-section .info ul li { display: grid; grid-template-columns: 19rem 1fr; margin-bottom: 7px; font-size: var(--font-size-2); } 
.connect .company-info-section .info ul li strong { flex-shrink: 0; font-weight: 500; } 
.connect .company-info-section .info ul li span { color:var(--sub-black); }



@media screen and (max-width:1660px){ 
	.connect .history-list-wrap { padding-left: 4%; }
}
@media screen and (max-width:1300px){ 
	.careers .sub-visual { height: 70vh; }
	.careers .careers-section-02 .talent-list { height: 66rem; }
	.careers .careers-section-03 ul .icon { width:90%; margin:0 auto; }
	.careers .careers-section-04 .employee-benefits-list { grid-template-columns: 1fr 700px; }
	.careers .careers-section-04 .employee-benefits-list .icon { width: 60px; margin:0 auto; }
	.careers .careers-section-05 .swiper-container li { width: 54.6rem; }
	.careers .grow-with-us h3 { font-size: 6rem; }

	.connect .sub-visual-title p { font-size: 8rem; }
}
@media screen and (max-width:1024px){ 
	:root {
		--sub-font-size-1: 36px;
		--sub-font-size-2: 24px;
		--sub-font-size-3: 18px;
		--sub-font-size-4: 16px;
	}

	.policy { padding-top: 80px; padding-bottom: 100px; }
	.policy h2 { font-size: 32px; }
	.policy .h2-wrap { padding-bottom: 30px; }
	.technical-support .process-table-wrap { flex-direction: column; }

	.certifications h2 { padding-top: 80px; padding-bottom: 100px; }
	.certifications-intro-wrap { padding: 60px 0; }
	.certifications .certifications-intro { grid-template-columns: repeat(1, 1fr); gap:80px; }
	.certifications .certifications-intro > div { gap:40px; }
	.certifications .certifications-intro .cert-item-wrap { gap:16px; }

	.certifications h5 { margin-bottom: 10px; }
	.certifications .certification-program-wrap { padding: 80px 0; }
	.certifications .certification-program-wrap .h3-wrap { margin-bottom: 40px; }
	.certifications .certification-program-wrap .cert-item-wrap:not(:last-child) { margin-bottom: 50px; }

	.certifications .swiper-arrow { position: absolute; inset: 0; width: 20%; margin:0 auto; }
	.certifications .swiper-pagination { position: relative; width: 100%; display: block; color:var(--sub-black); font-size: 16px; font-weight: 500; margin:20px auto 0; height: 5.2rem; line-height: 5.2rem; }
	.certifications .swiper-button-prev, .certifications .swiper-button-next { top:auto; bottom:0; }

	.careers .careers-section-02 .talent-list { height: 60rem; gap:1.5rem; }
	.careers .careers-section-02 .talent-list > div { padding: 2rem; }
	.careers .careers-section-03 h4 { margin-top: 1rem; }
	.careers .careers-section-04 .employee-benefits-list ul { grid-template-columns: repeat(4, 1fr); gap:4rem 1rem; }
	.careers .careers-section-04 .employee-benefits-list { grid-template-columns: 1fr 540px; }
	.careers .careers-section-04 .employee-benefits-list .icon { width: 52px; }

	.connect .sub-visual-title p:nth-child(1) { padding-right:3vw; font-size: 60px; }
	.connect .sub-visual-title p:nth-child(3) { padding-left:3vw; font-size: 60px; }
	.connect .business-section h3 { font-size: 50px; }
	.connect .business-section .core-business-list ul { gap:2rem; }
	.connect .business-section .core-business-list li a { padding: 6rem 2rem; gap:3rem; }
	.connect .business-section .core-business-list .icon { width: 150px; margin:0 auto; }
	.connect .business-section .core-business-list h4 { font-size: 26px; }
	.connect .business-section .core-business-list .arrow-link { width:44px; height:44px; right:20px; top:20px; }
	.connect .core-business-marquee li { height: 54px; }

	.connect .absolute-text.left-text { top:15%; }
	.connect .absolute-text.right-text { bottom:15%; }
	.connect .vision-section .h3-wrap { height: auto; width: 100%; max-width: 650px; }

	.connect .company-info-section h3 { font-size: 46px; }
	.connect .company-info-section .company-info { gap:30px; }
}
@media screen and (max-width:768px){ 
	.client .client-logos ul { grid-template-columns: repeat(3, 1fr); gap:12px; }
	.client .client-logos li { border-radius: 5px; }
	.client .client-logos li img { width: 130px; }

	.technical-support .title-wrap p br { display: none; }
	.technical-support .section-1 h3 { margin-top: 50px; }
	.technical-support .title-wrap { margin-bottom: 40px; }
	.technical-support .section-1 { padding: 80px 0; }
	.technical-support .process-table-wrap { gap:15px; }

	.technical-support .section-2 { padding: 60px 0 80px; }
	.technical-support h4 { margin-bottom: 5px; }
	.technical-support h5 { text-align: left; }
	.technical-support .content-table { overflow-x: auto; }
	.technical-support .content-table-wrap table { width: 800px; border-spacing: 0 10px; }
	.technical-support .content-table-wrap tr { box-shadow: none; }
	.technical-support .content-table-wrap th { padding: 12px; }
	.technical-support .content-table-wrap td { padding: 25px; }

	.policy { padding-top: 60px; padding-bottom: 80px; }
	.policy .h2-wrap { flex-direction: column; align-items: flex-start; gap:30px;}

	.certifications .certification-program-wrap .cert-item-wrap-2 .swiper-arrow { display: block; }
	.certifications .certification-program-wrap .cert-item-wrap-2 { flex-wrap:wrap; }
	.certifications .certification-program-wrap .cert-item-wrap-2 .cert-other { width: 100%; }
	.certifications .certification-program-wrap .cert-item-wrap-3 { flex-wrap:wrap; gap:50px 16px; }
	.certifications .certification-program-wrap .cert-item-wrap-3 > div { width: calc(50% - 8px); }
    .certifications .certification-program-wrap .cert-item-wrap:not(:last-child) { gap:50px; }
	
	.cert-item-2 { width: 100%; gap:16px; }
	.cert-item-2 > div { width: calc(50% - 8px); }
	.item-dummy { display: none; }

	.careers .sub-visual { height: 385px; }
	.careers .h3-wrap p { margin-bottom: 10px; font-size: 12px; }
	.careers .h3-wrap h3 { margin-bottom: 40px; }
	.careers .careers-section-01 { padding-bottom: 80px; }
	.careers .careers-section-01 .img-box { height: 338px; }
	.careers .careers-section-01 .img-box img { height: 100%; object-fit: cover; }
	.careers .careers-section-02 { padding-bottom: 80px; }
	.careers .careers-section-02 h3 { margin-bottom: 15px; }
	.careers .careers-section-02 .talent-list { height: auto; grid-template-columns: repeat(1, 1fr); gap:15px; }
	.careers .careers-section-02 .talent-list > div { height: 234px; padding: 20px; grid-column: auto !important; grid-row: auto !important; }
	.careers .careers-section-03 { padding: 60px 0; }
	.careers .careers-section-03 .process-info dl { width: 100%; grid-template-columns: repeat(1, 1fr); }
	.careers .careers-section-03 .process-info dd { padding-left: 20px; }
	.careers .careers-section-03 ul { grid-template-columns: repeat(1, 1fr); margin-top: 40px; gap:70px; }
	.careers .careers-section-03 ul .icon { width: 200px; }
	.careers .careers-section-03 .process-info { margin-top: 30px; }
	.careers .careers-section-03 li:not(:last-child)::after { right:50%; top:auto; bottom:-60px; transform:translateX(50%) rotate(270deg); }
	.careers .careers-section-04 { padding: 80px 0 40px; }
	.careers .careers-section-04 h3 { margin-bottom: 40px; }
	.careers .careers-section-04 .employee-benefits-list { grid-template-columns: 1fr; gap:35px; margin-bottom: 50px; }
	.careers .careers-section-04 .employee-benefits-list ul { grid-template-columns: repeat(2, 1fr); gap:35px 10px; }
	.careers .careers-section-04 .employee-benefits-list .icon { height: 60px; }
	.careers .careers-section-05 .swiper-container { margin-top: 40px; }
	.careers .careers-section-05 .swiper-container li { width: 255px; }
	.careers .swiper-arrow { margin-top: 30px; }
	.careers .careers-section-05 { padding-bottom: 80px; }
	.careers .grow-with-us h3 { font-size: 30px; }
	.careers .grow-with-us { height: 495px; padding: 60px 0; }
	.careers .grow-with-us .grow-with-us-inner { width: 100%; padding: 0 20px; }
    .careers .grow-with-us .grow-with-us-inner > div { width: 100%; }
	.careers .grow-with-us-inner h3 { max-width: 300px; }
	.careers .grow-with-us-inner p { width: 264px; margin: 15px 0 40px; }
	.careers .grow-with-us-inner .btn-link { width: 100%; }

    .connect .company-intro-text { padding:0 10px; }
	.connect .sub-visual { max-height: none; min-height: 640px; padding: 30px 0; }
	.connect .sub-visual-title { height: auto; flex-direction: column; }
	.connect .sub-visual-title p:nth-child(1) { padding-right:0; font-size: 50px; }
	.connect .sub-visual-title p:nth-child(3) { padding-left:0; font-size: 50px; }
	.connect .sub-visual-title .line span { transform: translate(-50%,-50%) rotate(90deg); }
    .connect .h3-wrap p { margin-bottom: 10px; }
    .connect .vision-section .h3-wrap h3 { margin-top: 0; font-size: 19px; }
    .connect .vision-section .h3-wrap h3 br { display: none; }

	.connect .business-section { padding: 80px 0; }
	.connect .business-section h3 { margin-bottom: 40px; font-size: 30px; }
	.connect .business-section .core-business-list ul { flex-direction: column; gap:15px; }
	.connect .business-section .core-business-list li a { padding: 40px; border-radius: 15px; gap:20px; }
	.connect .business-section .core-business-list li .icon { width: 130px; margin: 0 auto; }
	.connect .business-section .core-business-list .arrow-link { width: 40px; height: 40px; background-size: 20px; }
	.connect .business-section .core-business-list h4 { font-size: 20px; }
	.connect .business-section .core-business-list li:nth-child(2) { transform: initial; }
	.connect .core-business-marquee { margin-top: 60px; }
	.connect .core-business-marquee ul { gap:10px; }
	.connect .core-business-marquee ul + ul { margin-top: 10px; }
	.connect .core-business-marquee li { padding-left: 10px; padding-right: 15px; height: 43px; font-size: 16px; }
	.connect .core-business-marquee li img { width: 20px; }

	.connect .absolute-text { height: 40%; padding: 0 15px; overflow: initial; }
	.connect .absolute-text h5 { padding-bottom: 10px; position: initial; }
	.connect .absolute-text h5 .line { width: 1px; height: 100%; }
	.connect .absolute-text.left-text { top:5%; left:5%; }
	.connect .absolute-text.left-text h5 .circle { left:-2.5px; right:auto; }
	.connect .absolute-text.right-text { display: flex; flex-direction: column; justify-content: end; bottom:5%; right:5%; }
	.connect .absolute-text.right-text h5 .line { left:auto; right:0; }
	.connect .absolute-text.right-text h5 .circle { left:auto; right:-2.5px; bottom:auto; top:0; }
	.connect .absolute-text .text-content { margin-top: 0; }

	.connect .history-section { padding: 80px 0; }
	.connect .history-section .swiper-arrow { margin-top: 20px; margin-bottom: 30px; }
	.connect .history-section .h3-wrap { max-width: 284px; }
	.connect .history-section .year { padding-bottom: 20px; margin-bottom: 15px; }
	.connect .history-list-wrap { padding-left: 20px; }
	.connect .history-list-wrap .swiper-slide { width: 275px; }
	.connect .history-section ul ul li { font-size: 15px; }
	.connect .partners-section { padding: 60px 0; }
	.connect .partners-section h3 { padding-bottom: 30px; font-size: 30px; }
	.connect .partners-list ul { gap:10px; }
	.connect .partners-list ul li { width: 165px; padding: 15px; border-radius: 7px; }
	.connect .partners-list ul:last-child { margin-top: 10px; }

	.connect .company-info-section { padding: 80px 0; }
	.connect .company-info-section .company-info { display: block; }
	.connect .company-info-section h3 { font-size: 30px; margin-bottom: 30px; }
	.connect .company-info-section h3 br { display: none; }
	.connect .company-info-section .info { padding-top: 40px; }
	.connect .company-info-section .map { height: auto; aspect-ratio: 32/21; }

    .certifications h2 { padding-bottom: 50px; }
    .certifications .certifications-intro-wrap { padding-top: 60px; }
}
@media screen and (max-width:480px){ 
	.client .client-logos ul { grid-template-columns: repeat(2, 1fr); gap:10px; }
	.policy .h2-wrap select { width: 100%; }
}



/* ------------------- Solution S ------------------------- */

.solution .h3-wrap span { position: relative; display: inline-flex; align-items: center; gap:5px; padding:.7rem 1.3rem; border: 1px solid #C1E6FF; background: #EEF8FF; color:#009AFF; font-size: 1.4rem; font-weight: 600; line-height: 1.1; text-transform: uppercase; border-radius: 5px; }
.solution .h3-wrap span::before { content: ''; width: 3px; aspect-ratio: 1/1; border-radius: 3px; background: #009AFF; }
.solution .h3-wrap h3 { margin-top: 2.5rem; font-size: var(--sub-font-size-2); font-weight: 600; line-height: 1.2; }

.solution .sub-visual { height: auto; padding-top: 17%; aspect-ratio: 1905/1259; background-size: cover; background-position: bottom; }
.solution .sub-visual .inner { max-width: 1420px; }
.solution .visual-text-wrap { max-width: 630px; }
.solution .visual-text-wrap h2 { padding: 1.5rem 0 3.5rem; font-size: 6rem; }
.solution .visual-text-wrap p:first-child { position: relative; padding: 0; padding-left: 2.5rem; font-weight: 500; line-height: 1.1; color:white; border:none; background: none; text-transform:none; }
.solution .visual-text-wrap p:first-child::before { content: ''; position: absolute; left:0; top:44%; display: block; width: 1.5rem; height: 1px; background: white; }
.solution .visual-text-wrap p:last-child { max-width: 470px; font-size: var(--font-size-2); color:#CBD2D9; }
.solution .sub-visual .visual-btn-wrap { margin-top: 10rem; }
.solution .sub-visual .visual-btn-wrap .btn-link:nth-child(2) { border-color: white; }
.solution .sub-visual .visual-btn-wrap .btn-link:nth-child(2):hover { border-color: #7CFF01; }

.solution .solution-about { padding-bottom: 17rem; text-align: center; }
.solution .solution-about .feature-list { display: flex; gap:3rem; margin-top: 8rem; }
.solution .solution-about .feature-list > li { padding: 6rem 5rem 10.4rem; flex:1; border-radius: 2.5rem; background: white; box-shadow: 0px 30px 30px 0px #8888881A; }
.solution .solution-about .feature-list > li:has(ul) { padding-bottom: 7.1rem; }
.solution .solution-about .feature-list > li h4 { margin-top: 5rem; margin-bottom: 1.5rem; font-weight: 600; font-size: var(--font-size-1); line-height: 1.2; } 
.solution .solution-about .feature-list > li p { font-size: var(--font-size-3); line-height: 1.3; color:var(--sub-black); } 
.solution .solution-about .feature-list ul { margin-top: 3rem; text-align: left; padding-left: 20px; color:var(--sub-black); font-size: 15px; }
.solution .solution-about .feature-list ul li { list-style: disc; }

.solution .solution-vision { padding: 13rem 0; background: #F1F5F8; }
.solution .solution-vision .h3-wrap { text-align: center; }
.solution .solution-vision .h3-wrap span { background: white; }
.solution .solution-vision ul { display: grid; grid-template-columns: repeat(2, 1fr); gap:3rem; margin-top: 8rem; }
.solution .solution-vision li { padding: 3rem; padding-bottom: 5rem; background: white; box-shadow: 0px 30px 30px 0px #8888881A; border-radius: 3rem; }
.solution .solution-vision li .img-box { height: 434px; border-radius: 2.5rem; overflow: hidden; }
.solution .solution-vision li .img-box img { max-width: none; height: 100%; object-fit: cover; }
.solution .solution-vision li .text-box { padding: 4.5rem 2rem 0; }
.solution .solution-vision li h4 { margin-bottom: 1rem; font-size: var(--sub-font-size-3); font-weight: 600; line-height: 1.2; }
.solution .solution-vision li p { max-width: 48rem; color:var(--sub-black); font-size: var(--font-size-3); }
    .solution .solution-vision ul:has(li:nth-child(5)) { grid-template-columns: repeat(6, 1fr); }
    .solution .solution-vision ul:has(li:nth-child(5)) li { grid-column: span 2; }
    .solution .solution-vision ul:has(li:nth-child(5)) li:nth-child(n + 4) { grid-column: span 3; }

.solution .solution-architecture { padding: 17rem 0; text-align: center; }
.solution .solution-architecture h3 { margin-bottom: 8rem; font-size: 6.6rem; font-weight: 500; line-height: 1.1; }
    .solution-05 .solution-architecture { position: relative; z-index: 5; }

.solution .case-link-list { position: relative; padding-bottom: 34rem; overflow: hidden; }
.solution .case-link-list .h3-wrap { max-width: 77rem; margin-bottom: 8rem; }
.solution .case-link-list .bg-tit { position: absolute; right:10%; bottom:2rem; font-size: 20rem; font-weight: 500; background-clip: text; -webkit-background-clip: text; color: transparent; background-image: linear-gradient(180deg, #B5E2FF 0%, #FFFFFF 100%); white-space: nowrap; text-transform: capitalize; }

    /* solution-03 */
    .solution-03 .case-link-list-inner { display: flex; justify-content: space-between; }
    .solution-03 .case-link-list-inner .h3-wrap { width: 38rem; flex-shrink: 0; }
    .solution-03 .case-link-list-inner .swiper-container { margin: 5.4rem 0 0; transform: translateX(10%); }
    .solution-03 .case-link-list { padding-bottom: 23rem; }
    .solution-03 .case-link-list .bg-tit { bottom: 10rem; }

    /* solution-04 */
    .solution-04 .case-link-list-inner { display: flex; justify-content: space-between; }
    .solution-04 .case-link-list-inner .h3-wrap { width: 66rem; flex-shrink: 0; }
    .solution-04 .case-link-list-inner .swiper-container { margin: 5.4rem 0 0; }
    .solution-04 .case-link-list { padding-bottom: 23rem; }
    .solution-04 .case-link-list .bg-tit { bottom: 10rem; }

.solution .tab-menu { margin:5rem auto 8rem; }
.solution .tab-menu > p { position: relative; display: none; width: 100%; height: 42px; background: #009AFF; color: white; font-weight: 600; border-radius: 5rem; cursor: pointer; }
.solution .tab-menu > p::after { content: ''; position: absolute; right:20px; top:50%; display: block; border:5px solid transparent; border-top:7px solid white; transform: translateY(-25%); transition: .3s ease-in-out; }
.solution .tab-menu > p.active::after { transform: translateY(-65%) rotate(180deg); }
.solution .tab-menu ul { width: fit-content; margin:0 auto; padding:4px; background: #F1F5F8; border-radius: 5rem; display: flex; justify-content: center; align-items: center; gap: 1px; }
.solution .tab-menu button { padding:5px 1.5rem; border-radius: 5rem; background: transparent; font-size: 16px; font-weight: 600; }
.solution .tab-menu button.active { background: #009AFF; color:white; }
.solution .tab-cont { display: none; }
.solution .tab-cont.active { display: block; }

/* solution-05 */
.solution .zero-trust ul { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap:10px; padding: 4.5rem 3.5rem 3.5rem; background: linear-gradient(172.22deg, #63C1FF 3.64%, #0472FB 98.14%); border-radius: 2rem; text-align: left; }
.solution .zero-trust ul::before { content: 'Zero Trust'; position: absolute; left:50%; transform: translate(-50%,-50%); top:0; padding: 1rem 2.4rem; background: var(--main-black); color:white; border-radius: 5rem; font-size: var(--font-size-3); font-weight: 600; }
.solution .zero-trust li:nth-child(even) { order: 1; }
.solution .zero-trust li { position: relative; background: white; border-radius: 1rem; font-size: var(--font-size-3); cursor: pointer; }
.solution .zero-trust li .zero-title { display: flex; align-items: center; gap:1.5rem; height: 7.5rem; padding: 1.5rem; font-weight: 600; }
.solution .zero-trust li .zero-title p { position: relative; padding-left:2.2rem; flex:1; }
.solution .zero-trust li .zero-title p::before { content: '❶'; position: absolute; left:0; top:0; }
.solution .zero-trust li:nth-child(1) .zero-title p::before { content: '❶'; }
.solution .zero-trust li:nth-child(2) .zero-title p::before { content: '❷'; }
.solution .zero-trust li:nth-child(3) .zero-title p::before { content: '❸'; }
.solution .zero-trust li:nth-child(4) .zero-title p::before { content: '❹'; }
.solution .zero-trust li:nth-child(5) .zero-title p::before { content: '❺'; }
.solution .zero-trust li:nth-child(6) .zero-title p::before { content: '❻'; }
.solution .zero-trust li:nth-child(7) .zero-title p::before { content: '❼'; }
.solution .zero-trust li:nth-child(8) .zero-title p::before { content: '❽'; }
.solution .zero-trust li .zero-title span { position: relative; width: 4rem; aspect-ratio: 1/1; border-radius: 5rem; background: #D5EEFF; transition: .3s ease-in-out; }
.solution .zero-trust li .zero-title span::before,
.solution .zero-trust li .zero-title span::after { content: ''; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); width: 40%; height:1.5px; border-radius: 3px; background: #009AFF; }
.solution .zero-trust li .zero-title span::after { transform: translate(-50%,-50%) rotate(90deg); }
.solution .zero-trust li .zero-content { display: none; z-index: 2; position: absolute; left: 0; width: 100%; bottom:10px; transform: translateY(100%); padding: 25px 22px 40px; background: white; border-radius: 0 0 1rem 1rem; font-size: 16px; color:var(--sub-black); box-shadow: 0px 30px 30px 0px #8888881A; }
.solution .zero-trust li.active { background: white !important; z-index: 5; }
.solution .zero-trust ul:has(.active) li { background: #EDF3F8; }
.solution .zero-trust li.active .zero-title span { transform: rotate(135deg); }

/* solution-06 */
.solution .solution-architecture .h4-wrap { text-align: left; }
.solution .solution-architecture .h4-wrap h4 { position: relative; padding-left: 2rem; padding-bottom: 1.5rem; border-bottom:1px solid #CCCCCC; font-size: var(--sub-font-size-4); line-height: 1.3; font-weight: 600; }
.solution .solution-architecture .h4-wrap h4::before { content: ''; position: absolute; left:0; display: block; width: .9rem; height: .9rem; top:1rem; border-radius: 50%; background: var(--main-black); }
.solution .solution-architecture .h4-wrap p { margin-top: 3rem; font-size: var(--font-size-3); color:var(--sub-black); }
.solution .solution-architecture .architecture-list ul { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap:6rem 4.2rem; margin-top: 6rem; text-align: center; }
.solution .solution-architecture .architecture-list li { position: relative; border-radius: 10px; box-shadow: 0px 20px 20px 0px #8888881A; }
.solution .solution-architecture .architecture-list li::after { content: ''; position: absolute; right:0; top:50%; transform: translate(100%, -50%); width: 4.2rem; aspect-ratio: 42/12; background: url('/images/solution/06_3_arw.svg') right/contain; }
.solution .solution-architecture .architecture-list li:nth-child(3)::after { width: calc(300% + 8.4rem); height: 6rem; top:auto; bottom:0; transform: translateY(100%); background: url('/images/solution/06_3_line.svg') no-repeat center/contain; }
.solution .solution-architecture .architecture-list li:nth-child(6)::after { display: none; }
.solution .solution-architecture .architecture-list li h5 { padding: 1.3rem 1rem; color:white; font-size: var(--font-size-3); border-radius: 10px 10px 0 0 ; }
.solution .solution-architecture .architecture-list li:nth-child(1) h5 { background: #63C1FF; }
.solution .solution-architecture .architecture-list li:nth-child(2) h5 { background: #23B7FA; }
.solution .solution-architecture .architecture-list li:nth-child(3) h5 { background: #009AFF; }
.solution .solution-architecture .architecture-list li:nth-child(4) h5 { background: #0472FB; }
.solution .solution-architecture .architecture-list li:nth-child(5) h5 { background: #084AF7; }
.solution .solution-architecture .architecture-list li:nth-child(6) h5 { background: #0137C5; }
.solution .solution-architecture .architecture-list li p { max-width: 34.5rem; margin:0 auto; padding: 3.5rem 1rem; font-size: var(--font-size-3); color:var(--sub-black); }


@media screen and (max-width:1500px){ 
    /* solution-03 */
    .solution-03 .case-link-list-inner { display: block; }
    .solution-03 .case-link-list-inner .h3-wrap { max-width: 50rem; }
    .solution-03 .case-link-list-inner .swiper-container { margin: 0; transform: none; }
    /* solution-04 */
    .solution-04 .case-link-list-inner { display: block; }
    .solution-04 .case-link-list-inner .h3-wrap { max-width: 80rem; }
    .solution-04 .case-link-list-inner .swiper-container { margin: 0; transform: none; }
}
@media screen and (max-width:1300px){ 
    .solution .solution-about .feature-list { margin-top: 6rem; gap:2rem; }
    .solution .solution-about .feature-list > li { padding: 4rem 4rem 8rem; }
    .solution .solution-about .feature-list > li .icon { width: 130px; margin:0 auto; }
    .solution .solution-about .feature-list > li h4 { margin-top: 4rem; }

    .solution .solution-vision ul { margin-top: 6rem; gap:2rem; }
    .solution .solution-vision li { padding: 2rem; padding-bottom: 5rem; }
    .solution .solution-vision li .text-box { padding: 3.5rem 1.5rem 0; }
    .solution .solution-vision li .img-box { height: 300px; }

    .solution .zero-trust ul { grid-template-columns: repeat(2, 1fr); }
    .solution .zero-trust li:nth-child(even) { order:initial; }
}
@media screen and (max-width:1024px){ 
    .solution .solution-about .feature-list { display: grid; grid-template-columns: repeat(2, 1fr); }
    .solution .solution-about .feature-list > li:nth-child(1) { grid-column: 1/3; }
    .solution .solution-vision li .img-box { height: 240px; }

    .solution .case-link-list .bg-tit { font-size: 14rem; }

}
@media screen and (max-width:900px){ 
    .solution .sub-visual { padding-top: 148px; aspect-ratio: auto; height: 580px; }
    .solution .visual-text-wrap { max-width: 400px; }
    .solution .visual-text-wrap h2 { font-size: 40px; }
}
@media screen and (max-width:768px){ 
    .solution .sub-visual { padding-top: 148px; overflow: visible; max-height: none; height: 760px; padding-bottom: 0; }
    .solution .visual-text-wrap p:first-child { padding-left: 13px; font-size: 12px; }
    .solution .visual-text-wrap p:first-child::before { width: 10px; }
    .solution .visual-text-wrap h2 { padding: 10px 0 25px; font-size: 30px; }
        .solution-04 .visual-text-wrap h2 { max-width: 194px; }

    .solution .solution-about { padding-bottom: 80px; }
        .solution-03 .solution-about .h3-wrap h3 { max-width: 202px; margin: 15px auto 0; }
        .solution-05 .solution-about .h3-wrap h3 br { display: none; }

    .solution .solution-vision { padding: 60px 0; }
        .solution-01 .solution-vision .h3-wrap h3 br { display: none; }
        .solution-02 .solution-vision .h3-wrap h3 br { display: none; }

    .solution .solution-architecture { padding: 80px 0; }
    .solution .solution-architecture h3 { margin-bottom: 40px; font-size: 30px; }

    .solution .tab-menu { z-index: 2; position: relative; width: 100%; height: 42px; margin-top: 30px; margin-bottom: 40px; font-size: 15px; }
	.solution .tab-menu ul { display: none; position: relative; width: 100%; margin-top:10px; box-shadow: 0px 7.2px 7.2px 0px #81818126; border-radius: 20px; background: white; }
	.solution .tab-menu button { width: 100%; height: 100%; padding: 4px 22px; height: 40px; text-align: left; }
	.solution .tab-menu button.active { background: #F1F5F8; color:var(--sub-black); }
	.solution .tab-menu > p { display: flex; align-items: center; padding: 0 22px; }
    
    .solution .solution-architecture .architecture-list ul { display: grid; grid-template-columns: repeat(1, 1fr); gap:30px; max-width: 500px; margin:40px auto 0; }
    .solution .solution-architecture .architecture-list li::after ,
    .solution .solution-architecture .architecture-list li:nth-child(3)::after { width:30px; height:12px; right:50%; top:auto; bottom:-15px; transform: translate(50%, 50%) rotate(90deg); background: url('/images/solution/06_3_arw.svg') no-repeat right/cover; }
    .solution .solution-architecture .architecture-list li h5 { font-size: 15px; }
    .solution .solution-architecture .architecture-list li p { padding: 20px 10px; font-size: 15px; }
    .solution .solution-architecture .h4-wrap p { margin-top: 15px; font-size: 15px; }

    .solution .case-link-list-inner .h3-wrap { margin-bottom: 40px; }
    .solution .case-link-list { padding-bottom: 170px; }
    .solution .case-link-list .bg-tit { font-size: 100px; }
    .solution .swiper-container-horizontal > .swiper-scrollbar { margin-top: 30px; }
        .solution-01 .case-link-list .h3-wrap h3 { max-width: 270px; }
        .solution-02 .case-link-list .h3-wrap h3 { max-width: 270px; }
        .solution-03 .case-link-list { padding-bottom: 170px; }
        .solution-03 .case-link-list .bg-tit { bottom: 2rem; }
        .solution-04 .case-link-list .h3-wrap h3 { max-width: 350px; }

    .solution .zero-trust ul { max-width: 500px; padding: 28px 23px 23px; margin: 58px auto 0; grid-template-columns: repeat(1, 1fr); gap:8px; }
    .solution .zero-trust li { background: white; }
    .solution .zero-trust li .zero-title { height: 65px; }
    .solution .zero-trust li .zero-content { background: white; }
}
@media screen and (max-width:630px){ 
    .solution .solution-about .feature-list { max-width: 360px; margin: 40px auto 0; grid-template-columns: repeat(1, 1fr); gap:15px; }
    .solution .solution-about .feature-list > li:nth-child(1) { grid-column: auto; }
    .solution .solution-about .feature-list > li { padding: 35px 23px 50px; border-radius: 15px; }
    .solution .solution-about .feature-list > li .icon { width: 100px; }
    .solution .solution-about .feature-list > li h4 { margin-top: 30px; margin-bottom: 10px; }
    .solution .solution-about .feature-list > li p { font-size: 15px; }
    .solution .solution-about .feature-list ul { margin-top: 15px; font-size: 11px; }

    .solution .solution-vision ul { max-width: 360px; margin: 40px auto 0; gap:15px; grid-template-columns:repeat(1, 1fr) }
    .solution .solution-vision li { padding: 13px; padding-bottom: 30px; border-radius: 15px; }
    .solution .solution-vision li .text-box { padding: 15px 10px 0; }
    .solution .solution-vision li .img-box { height:auto; aspect-ratio: 684/434; border-radius: 10px; }
    .solution .solution-vision ul:has(li:nth-child(5)) { grid-template-columns:repeat(1, 1fr); }
    .solution .solution-vision ul:has(li:nth-child(5)) li { grid-column: auto; }
    .solution .solution-vision ul:has(li:nth-child(5)) li:nth-child(n + 4) { grid-column: auto; }
}
@media screen and (max-width:530px){ 
    .solution .sub-visual { margin-bottom: 150px; }
    .solution-01 .sub-visual { background: url('/images/sub_visual_IAM Solution_m.jpg') no-repeat bottom/cover !important; }
    .solution-02 .sub-visual { background: url('/images/sub_visual_Authentication Solution_m.jpg') no-repeat bottom/cover !important; }
    .solution-03 .sub-visual { background: url('/images/sub_visual_Directory Solution_m.jpg') no-repeat bottom/cover !important; }
    .solution-04 .sub-visual { background: url('/images/sub_visual_Encryption Module_m.jpg') no-repeat bottom/cover !important; }
    .solution-05 .sub-visual { background: url('/images/sub_visual_Zero Trust_m.jpg') no-repeat bottom/cover !important; }
    .solution-06 .sub-visual { background: url('/images/sub_visual_Consulting Service_m.jpg') no-repeat bottom/cover !important; }

    .solution .sub-visual .visual-btn-wrap { position: absolute; margin-top: 0; bottom:-50px; transform: translateY(100%); width: 100%; flex-direction: column; }
    .solution .sub-visual .visual-btn-wrap .btn-link { width: 100%; }
    .solution .sub-visual .visual-btn-wrap .btn-link:nth-child(2) { border-color: var(--sub-black); color:var(--sub-black); }
    .solution .sub-visual .visual-btn-wrap .btn-link:nth-child(2)::after { filter: saturate(0) brightness(2); }

    .solution .sub-contents { padding-top: 80px; }
}
















/* ------------------- Solution E ------------------------- */