:root {
    --max-width: 1440px;
}
@media screen and (max-width: 1441px) {
    :root {
        --max-width: 100%;
    }
}

p{word-break: keep-all;}
#wrap {padding:68px 0 0;}
.inner {max-width: var(--max-width);margin: 0 auto;padding:120px 0;}
.cont {min-height: 90vh;}
.sec_bg {background: var(--gray-50);}
.sec_video {height: 700px;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.sec_video video {position: absolute; top:0;left:0;width: 100%;height: 100%;object-fit: cover;}
.sec_video .video_txt {position: relative;z-index: 10;align-items: center;justify-content: center;}
.sec_video h2 {font-size: var(--display-hero);font-weight: 700;line-height: 130%;letter-spacing: -1.12px;color: #fff;}
.sec_video p {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: var(--gray-200);text-align: center;word-break: keep-all;}
@media (max-width:1440px) {
    .inner {padding: 120px 40px;}
}
@media (max-width:768px) {
    .inner {padding: 80px 20px;}
}

.chip {display: flex;width: fit-content;height: 38px;padding: 0 16px;align-items: center;justify-content: center;border-radius: 60px;background: var(--gradient-primary-left);color: #fff !important;font-size: var(--chip);}
.btn {position: relative; display: flex;width: fit-content;min-width: 120px; height: 52px;padding: 0 16px;align-items: center;justify-content: center;border-radius: var(--rounded-sm);background: var(--gray-200);;color: var(--gray-600);font-size: var(--button-default);transition: all 0.3s ease;overflow: hidden;border: 1px solid transparent;}
.btn span {position:relative; z-index:1;}
.btn:hover {color: var(--gray-900);border: 1px solid var(--gray-700);background: #fff;}
.btn.primary {background: var(--gradient-primary-right);color: #fff;border: none;}
.btn.primary::before {content:""; position:absolute; inset:0; background:var(--gradient-primary-left); opacity:0; transition:opacity .4s ease;border: none;}
.btn.primary:hover::before {opacity:1;}
.btn.primary span {position:relative; z-index:1;}
.btn.gradient {position:relative; overflow:hidden; background:linear-gradient(258deg, #C779FF 16.78%, #4D8BFF 82.93%);color: #fff;border: none;}
.btn.gradient::before {content:""; position:absolute; inset:0; background:linear-gradient(258deg, #4D8BFF 16.78%, #C779FF 82.93%); opacity:0; transition:opacity .4s ease;border: none;}
.btn.gradient:hover::before {opacity:1;}
.btn.gradient span {position:relative; z-index:1;}
.btn.white {background: #fff;color: #000;font-weight: 600;}
.btn.white:hover {background: var(--primary-500);color: #fff;border: 1px solid transparent;}
.btn.line {background: transparent;border: 1px solid var(--border-default);color: var(--gray-600);}
.btn.line:hover {border: 1px solid var(--gray-700);color: var(--gray-900);}
.btn.gray {background: var(--gray-700);color: #fff;}
.btn.lg {font-size: var(--button-lg);}
.btn.full {width: 100%;font-size: var(--button-lg);font-weight: 700;height:60px;}
.btn_wrap {display: flex;align-items: center;justify-content: center;gap:var(--card-gap);}
.title {display: flex;gap:var(--card-gap);justify-content: center;flex-direction: column;}
.title h3 {font-size: var(--heading-1);font-weight: 700;line-height: 140%;color: var(--gray-900);letter-spacing: -0.4px;word-break: keep-all;}
.title p {font-size: var(--heading-4);font-weight: 600;line-height: 150%;color: var(--gray-700);letter-spacing: -0.24px;word-break: keep-all;}
@media (max-width:768px) {
    .chip {height: 32px;padding: 0 12px;}
}

header {position: fixed;top:0;left:0;width: 100%;height: 68px;background: #fff;z-index: 100;}
header > div {display: flex;justify-content: space-between;align-items: center;}
header .inner {padding: 0;} 
header .logo {position: relative;z-index: 101;} 
header ul {display: flex;height: 100%;}
header ul li a {position: relative;display: flex;align-items: center;justify-content: center; padding: 0 24px;height: 68px;font-size: var(--text-15);font-weight: 500;overflow: hidden;transition: all 0.3s ease;}
header ul li a::before {content:"";display: block;position: absolute;top:-6px;left:50%;transform: translateX(-50%);width: 5px;height: 5px;background: #000;border-radius: 50%;transition: all 0.3s ease;}
header ul li a:hover {color: var(--primary-500);}
header ul li a:hover::before {background: var(--primary-500);top:12px;}
header .brochure_nav_item {display:flex;align-items:center;margin-right:8px;}
header ul li .brochure_download_btn {height:38px;margin:15px 12px 15px 0;padding:0 16px;border-radius:999px;background:var(--gray-900);border:1px solid var(--gray-900);color:#fff;font-size:var(--text-14);font-weight:700;}
header ul li .brochure_download_btn::before {display:none;}
header ul li .brochure_download_btn:hover {background:#fff;border-color:var(--gray-900);color:var(--gray-900);}
header .jp_nav_item {display:flex;align-items:center;}
header ul li .jp_nav_btn {width:42px;height:38px;margin:15px 0 15px 4px;padding:0;border-radius:999px;background:#fff;border:1px solid var(--gray-300);color:var(--gray-900);font-size:var(--text-14);font-weight:700;}
header ul li .jp_nav_btn::before {display:none;}
header ul li .jp_nav_btn:hover {background:var(--primary-500);border-color:var(--primary-500);color:#fff;}

.m_menu_btn {display:none;}
@media (max-width:1440px) {
    header .inner {padding: 0 40px;} 
}
@media (max-width:768px) {
    header .inner {padding: 0;} 
    .m_menu_btn {display:flex; flex-direction:column; justify-content:center; gap:6px; width:40px; height:40px; padding:0; border:0; background:none; cursor:pointer; z-index:100;}
    .m_menu_btn span {display:block; width:20px; height:2px; background:#191F28; border-radius:999px; transition:transform .3s ease, opacity .3s ease;} 
    .m_menu_btn.active span:nth-child(1) {transform:translateY(8px) rotate(45deg);} 
    .m_menu_btn.active span:nth-child(2) {opacity:0;}
    .m_menu_btn.active span:nth-child(3) {transform:translateY(-8px) rotate(-45deg);}
    nav {position: fixed;top:0;right:-100%;width:100%;height:100vh;background: #fff;z-index: 100;transition: all 0.3s ease;}
    /* nav {position: fixed;top:0;right:-100%;width:100%;height:100vh;background: var(--gradient-secondary);z-index: 100;transition: all 0.3s ease;} */
    .active nav {right:0;}
    nav ul {flex-direction: column;align-items: center;justify-content: center;}
    nav ul li {width: 100%;}
    nav ul li a {height:80px;width: 100%;align-items: center;font-size: var(--display-hero);justify-content: flex-start;}
    nav ul li.brochure_nav_item {width:100%;justify-content:flex-start;margin:0;padding:0 24px;box-sizing:border-box;}
    nav ul li.brochure_nav_item .brochure_download_btn {width:fit-content;height:48px;margin:0 0 20px;padding:0 18px;font-size:var(--text-15);justify-content:center;border-radius:999px;}
    nav ul li.jp_nav_item {width:100%;justify-content:flex-start;margin:0;padding:0 24px;box-sizing:border-box;}
    nav ul li.jp_nav_item .jp_nav_btn {width:48px;height:48px;margin:0;padding:0;font-size:var(--text-15);justify-content:center;border-radius:999px;}
    header ul li a:hover {color: #fff;}
    header ul li a:hover::before {top:-12px;}
    header .logo {padding: 24px;}
}

.f_banner {padding: 120px 0;position: relative;}
.f_banner .banner_txt {display: flex;flex-direction: column;gap:var(--card-gap);position: relative;z-index: 1;align-items: center;text-align: center;padding: 0 20px;}
.f_banner .banner_txt h5 {color: #fff;font-size: var(--heading-1);font-weight: 700;line-height: 140%;letter-spacing: -0.4px;word-break: keep-all;}
.f_banner .banner_txt p {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: #fff;word-break: keep-all;}
.f_banner .banner_txt .btn_wrap {margin:44px 0 0;}
.f_banner video {position: absolute; top:0;left:0;width: 100%;height: 100%;object-fit: cover;}
@media (max-width:768px) {
    .f_banner {padding: 80px 0;}
}
footer {background: #1c1c1c;padding: 60px 0 ;color: var(--gray-300);}
footer .inner {padding: 0;}
footer address {margin:30px 0 0;display: flex;gap:38px;flex-direction: column;}
footer .add {display: flex;justify-content: space-between;}
footer .add h4 {font-size: var(--text-22);font-weight: 600;margin: 0 0 26px;line-height: 137%;}
footer .add h5 {font-size: var(--text-16);color: #fff;font-weight: 500;margin: 0 0 30px;}
footer .add p {font-weight: 500;line-height: 170%;font-size: var(--text-14);}
footer .copy {margin:30px 0 0;padding: 30px 0 0;border-top: 1px solid #5F666D;font-size: var(--text-12);}
@media (max-width:1440px) {
    footer .inner {padding: 0 40px;}
}
@media (max-width:768px) {
    footer {padding: 60px 20px;}
    footer .inner {padding: 0;}
    footer .add {flex-direction: column;gap:40px;}
    footer address {gap:20px;}
    footer .add h5 {margin:0 0 20px;}
}

#main .title {align-items: center;text-align: center;margin: 0 0 64px;}
#main .mainvisual {padding: 0 40px 40px 40px;}
#main .mainvisual > div {position: relative;height:86vh; max-height: 972px;border-radius: 40px;overflow: hidden;display: flex;align-items: center;justify-content: center;}
#main .mainvisual > div::before {content: "";display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(0deg, rgba(2, 5, 33, 0.49) 0%, rgba(11, 25, 128, 0.28) 30.77%, rgba(69, 120, 181, 0.28) 65.87%, rgba(102, 102, 102, 0.00) 100%);z-index: 1;}
#main .mainvisual > div .main_txt {display: flex;align-items: center;justify-content: center;flex-direction: column;gap:var(--card-gap); text-align: center;padding: 0 30px;word-break: keep-all;}
#main .mainvisual > div .main_txt h2 {font-size: var(--display-hero);font-weight: 700;line-height: 130%;letter-spacing: -1.12px;color: #fff;}
#main .mainvisual > div .main_txt p {font-size: var(--display-hero2);font-weight: 700;line-height: 140%;letter-spacing: -0.64px;color: #fff;word-break: keep-all;}
#main .mainvisual video {position: absolute; top:0;left:0; width: 100%;height: 100%;object-fit: cover;z-index: 0;}
.maintxt_swiper .swiper-slide {opacity: 0 !important; pointer-events: none;}
.maintxt_swiper .swiper-slide-active {opacity: 1 !important; pointer-events: auto;}
.swiper-slide.swiper-slide-active .main_txt span {animation: text 1s 0.2s both;}
.swiper-slide.swiper-slide-active .main_txt h2 {animation: text 1s 0.4s both;}
.swiper-slide.swiper-slide-active .main_txt p {animation: text 1s 0.6s both;}
@keyframes text {
    0% {opacity: 0; transform: translateY(40px);}
    100% {opacity: 1; transform: translateY(0);}
}
@media (max-width:768px) {
    #main .title {margin:0 0 40px;}
    #main .mainvisual {padding: 0 var(--card-padding) var(--card-padding);}
    #main .mainvisual > div {height:88vh}

}

#main .main_sec01 ul {display: flex;gap: var(--card-gap);}
#main .main_sec01 ul li {flex:1;display: flex;flex-direction: column;gap: var(--card-gap);background: var(--gray-50);border-radius: var(--rounded-sm);padding: var(--card-padding);}
#main .main_sec01 ul li h4 {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: var(--gray-900);}
#main .main_sec01 ul li p {font-size: var(--text-15);font-weight: 500;line-height: 160%;color: var(--gray-700);}
@media (max-width:768px) {
    #main .main_sec01 ul {flex-direction: column;}
}

#main .main_sec02 {background: var(--gray-50);}
#main .main_sec02 ul {display: grid; grid-template-columns: repeat(3, 1fr);gap: var(--card-gap);}
#main .main_sec02 ul li {display: flex;flex-direction: column;gap: var(--card-gap);background: var(--gray-50);border-radius: var(--rounded-sm);padding: var(--card-padding);height: 300px;justify-content: space-between;}
#main .main_sec02 ul li.bg01 {background: url('../images/main_0201.png') no-repeat center center/cover;}
#main .main_sec02 ul li.bg02 {background: url('../images/main_0202.png') no-repeat center center/cover;}
#main .main_sec02 ul li.bg03 {background: url('../images/main_0203.png') no-repeat center center/cover;}
#main .main_sec02 ul li.bg04 {background: url('../images/main_0204.png') no-repeat center center/cover;}
#main .main_sec02 ul li.bg05 {background: url('../images/main_0205.png') no-repeat center center/cover;}
#main .main_sec02 ul li.bg06 {background: url('../images/main_0206.png') no-repeat center center/cover;}
#main .main_sec02 ul li .txt {display: flex; flex-direction: column;gap: 10px;justify-content: center; align-items: center;text-align: center;max-width: 68%;word-break: keep-all;color: #fff;margin: 0 auto;}
#main .main_sec02 ul li .txt h4 {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;}
#main .main_sec02 ul li .txt p {font-size: var(--text-15);font-weight: 500;line-height: 160%;}
@media (max-width:768px) {
    #main .main_sec02 ul {grid-template-columns: repeat(1, 1fr);}
    #main .main_sec02 ul li {height:180px;}
    #main .main_sec02 ul li .txt {max-width: none;}
}

#main .main_sec03 .partner_logo {display: grid; grid-template-columns: repeat(4, 1fr);gap: var(--gard-gap) 0;}
#main .main_sec03 .partner_logo span {display: flex;height:80px;align-items: center;justify-content: center;padding: 0 20px;;}
@media (max-width:768px) {
    #main .main_sec03 .partner_logo {grid-template-columns: repeat(3, 1fr);}
}

#main .main_sec04 {background: var(--gray-50);}
#main .main_sec04 .chip {background: transparent;border: 1px solid #fff;}
#main .main_sec04 ul {display: flex;gap:var(--card-gap);}
#main .main_sec04 ul li {flex:1;position: relative;height:300px;border-radius:10px;padding: var(--card-padding);overflow: hidden;;}
#main .main_sec04 ul li > img {position: absolute;top: 0;left: 0; width: 100%;height: 100%;object-fit: cover;z-index: 0;}
#main .main_sec04 ul li .txt {display: flex;flex-direction: column;justify-content: space-between;position: relative;z-index: 1;height:100%;}
#main .main_sec04 ul li .txt h5 {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: #fff;margin:var(--card-gap) 0 0;word-break: keep-all;}
#main .main_sec04 ul li .txt span {text-align: right;}
@media (max-width:768px) {
    #main .main_sec04 ul {flex-direction: column;}
    #main .main_sec04 ul li .txt {min-height: 160px;}
}

.subvisual {padding: 150px 0;position: relative;height:700px;}
.subvisual.bgimg::before {content: "";display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #191f28;opacity: 0.8;z-index: 1;}
.subvisual .sub_txt {display: flex;flex-direction: column;gap:var(--card-gap);align-items: center;position: relative;z-index: 2;}
.subvisual h2 {font-size: var(--display-hero);font-weight: 700;line-height: 130%;letter-spacing: -1.12px;text-align: center;word-break: keep-all;}
.subvisual h2 span {background:linear-gradient(258deg, #C779FF 16.78%, #4D8BFF 82.93%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; font-weight:700;}
.subvisual h6 {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: var(--gray-700);word-break: keep-all;text-align: center;}
.subvisual .btn_wrap {margin-top: 40px;}

.subvisual.about {background: url('../images/subvisual_about.png') no-repeat center center/cover;color: #fff;}
@media (max-width:768px) {
    .subvisual {padding: 120px 20px;height:fit-content}
}
.search {margin: 0 auto;max-width: 500px;border-radius: 60px;border: 1px solid var(--border-default);display: flex;justify-content: space-between;align-items: center;padding: 16px 20px;}
.search input {border:none;outline:none;background: none;width: 100%;}

#solution .title {align-items: center;text-align: center;margin: 0 0 60px;}
#solution .solution_sec01 ul {display: flex;gap:var(--card-gap-lg);}
#solution .solution_sec01 ul li {padding: var(--card-padding);border-radius: var(--rounded-sm);text-align: center;color: #fff;flex:1;}
#solution .solution_sec01 ul li span {border-radius: 50%;}
#solution .solution_sec01 ul li h4 {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;margin: 20px 0 8px;}
#solution .solution_sec01 ul li p {font-size: var(--text-15);font-weight: 500;line-height: 160%;max-width: 80%;word-break: keep-all;margin: 0 auto;}
#solution .solution_sec01 ul li:nth-child(1) {background: #846b83;}
#solution .solution_sec01 ul li:nth-child(2) {background: #4C6D8B;}
#solution .solution_sec01 ul li:nth-child(3) {background: #597B7C;}
@media (max-width:768px) {
    #solution .title {margin:0 0 32px;}
    #solution .solution_sec01 ul {flex-direction: column;}
}

#solution .solution_sec02 {background: var(--gray-50);}
#solution .solution_sec02 .chip {padding: 10px;border-radius: var(--rounded-sm);height: 44px;}
#solution .solution_sec02 ul {display: flex;gap:var(--card-gap-lg);}
#solution .solution_sec02 ul li {background: #fff;padding: var(--card-padding);border-radius: var(--rounded-sm);}
#solution .solution_sec02 ul li h4 {font-size: var(--heading-3);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;margin: 20px 0 8px;}
#solution .solution_sec02 ul li p {font-size: var(--text-15);font-weight: 500;line-height: 160%;word-break: keep-all;color:var(--gray-700)}
@media (max-width:768px) {
    #solution .solution_sec02 ul {flex-direction: column;}
}
#solution .solution_sec03 .title {padding: 120px 0 0;}
#solution .solution_sec03 .system_item:nth-child(2n) {background: var(--gray-50);}
#solution .solution_sec03 .system_item > div {display: flex;justify-content: space-between;align-items: center;}
#solution .solution_sec03 .system_item > div .img_box {width: 910px;}
#solution .solution_sec03 .system_item > div h3 {font-size: var(--heading-2);font-weight: 600;line-height: 140%;letter-spacing: -0.32px;margin:0 0 16px;}
#solution .solution_sec03 .system_item > div p {font-size: var(--text-15);font-weight: 500;line-height: 160%;word-break: keep-all;color: var(--gray-700);}
#solution .solution_sec03 .system_item > div p span {font-weight: 700;color: var(--gray-900);}
#solution .solution_sec03 .system_item ul {border-top: 1px solid var(--border-default);padding: 20px 0 0;margin:30px 0 0}
#solution .solution_sec03 .system_item ul li {color: var(--gray-600);font-size: var(--text-15);line-height: 160%;padding: 0 0 0 24px;position: relative;margin:0 0 8px;background: url('../images/check.svg') no-repeat left center/16px;}
@media (max-width:768px) {
    #solution .solution_sec03 .system_item > div {flex-direction: column-reverse;align-items: flex-start;gap:30px;}
    #solution .solution_sec03 .system_item > div .img_box {width: 100%;}
    #solution .solution_sec03 .title {padding: 80px 0 0;margin:0;}
    #solution .solution_sec03 .txt_box {width: 100%;}
}

#solution .solution_sec04 {background: var(--gray-50);}
#solution .solution_sec04 ul {display: flex;gap:var(--card-gap);}
#solution .solution_sec04 ul li {background: #fff;padding: 48px 20px;border-radius: var(--rounded-sm);box-shadow: var(--shadow-card);text-align: center;color: #fff;}
#solution .solution_sec04 ul li span {color: #46DEC0;font-size: var(--text-13);line-height: 160%;}
#solution .solution_sec04 ul li h4 {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.32px;margin:2px 0 8px;}
#solution .solution_sec04 ul li p {font-size: var(--text-15);font-weight: 500;line-height: 160%;word-break: keep-all;}
#solution .solution_sec04 ul li:nth-child(1) {background: url('../images/solution_0401.png') no-repeat center center/cover;}
#solution .solution_sec04 ul li:nth-child(2) {background: url('../images/solution_0402.png') no-repeat center center/cover;}
#solution .solution_sec04 ul li:nth-child(3) {background: url('../images/solution_0403.png') no-repeat center center/cover;}
#solution .solution_sec04 ul li:nth-child(4) {background: url('../images/solution_0404.png') no-repeat center center/cover;}
@media (max-width:768px) {
    #solution .solution_sec04 ul {flex-direction: column;}
}
#solution .solution_sec05 .price_box {display: flex;gap:var(--card-gap);}
#solution .solution_sec05 .price_item {padding: 30px;border-radius: var(--rounded-sm);flex:1;border: 1px solid var(--border-default);height:fit-content}
#solution .solution_sec05 .price_item.hot {border:3px solid transparent; background:linear-gradient(#fff,#fff) padding-box, linear-gradient(271deg,#46DEC0 1.17%,#4D8BFF 48.28%,#C779FF 98.21%) border-box;}
#solution .solution_sec05 .price_item > div {display: flex;justify-content: space-between;align-items: center;}
#solution .solution_sec05 .price_item > div span {display:inline-block;font-weight: 700;font-size: var(--text-15); line-height: 160%; background:linear-gradient(271deg,#46DEC0 1.17%,#4D8BFF 48.28%,#C779FF 98.21%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;}
#solution .solution_sec05 .price_item h3 {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;}
#solution .solution_sec05 .price_item h4 {font-size: var(--heading-1);font-weight: 700;line-height: 140%;letter-spacing: -0.4px;margin:4px 0;}
#solution .solution_sec05 .price_item h4 span {font-size: var(--heading-3);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: var(--gray-600);}
#solution .solution_sec05 .price_item p {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: var(--gray-600);}
#solution .solution_sec05 .price_item ul {display: flex;flex-direction: column;gap: 8px;margin:20px 0 ;padding: 20px 0 0;border-top: 1px solid var(--border-default);}
#solution .solution_sec05 .price_item ul li {font-size: var(--text-15);font-weight: 500;line-height: 150%;word-break: keep-all;color: var(--gray-600);letter-spacing: -0.32px;position:relative; padding-left:24px;}
#solution .solution_sec05 .price_item ul li span {font-weight: 500;color: var(--gray-900);font-weight: 700;}
#solution .solution_sec05 .price_item ul li::before {content:""; position:absolute; left:0; top:.25em; width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.3334 4L6.00002 11.3333L2.66669 8' stroke='%238B95A1' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;}
#solution .solution_sec05 .price_item a {margin:30px 0 0;}
@media (max-width:768px) {
    #solution .solution_sec05 .price_box {flex-direction: column;}
}
#solution .solution_sec06 .faq_q {padding: 40px 0;font-size: var(--text-18);font-weight: 600;line-height: 1;border-bottom: 1px solid var(--border-default);display: flex;justify-content: space-between;align-items: center;width: 100%;}
#solution .solution_sec06 .faq_a {display:none;padding: 20px 40px;font-size: var(--text-16);font-weight: 400;line-height: 150%;background: var(--gray-50);word-break: keep-all;}
#solution .solution_sec06 .faq_list li.active .faq_q svg {transform:rotate(180deg);}
@media (max-width:768px) {
    #solution .solution_sec06 .faq_q {padding: 20px 0;}
    #solution .solution_sec06 .faq_a {padding: 20px;}
}

#portfolio .subvisual {padding:150px 0 30px;height: fit-content;}
#portfolio .category {margin: 60px auto 0;display: flex;gap:10px;justify-content: center;flex-wrap:wrap;max-width: 1200px;}
#portfolio .category a {padding: 0 16px;height: 38px;display: flex;align-items: center;justify-content: center;border-radius: 60px;color: var(--gray-600);font-size: var(--button-default);line-height: 1;font-weight: 600;border: 1px solid var(--border-default);transition: all 0.3s ease;}
#portfolio .category a.active {background: var(--gradient-primary-right);color: #fff;border: none;}
#portfolio .category a:hover {border:1px solid var(--gray-700);color: var(--gray-700);}
#portfolio .portfolio_list {margin: 120px auto 0;}
#portfolio .portfolio_list ul {display: grid;grid-template-columns:repeat(3, 1fr);gap: 80px 30px;}
#portfolio .portfolio_list ul li .thumb {aspect-ratio: 1/1;box-shadow: var(--shadow-card);overflow: hidden;transition: all 0.3s ease;}
#portfolio .portfolio_list ul li .thumb:hover {box-shadow: var(--shadow-card-hover);}
#portfolio .portfolio_list ul li .thumb img {width: 100%;height: 100%;object-fit: cover;transition: all 1s ease;}
#portfolio .portfolio_list ul li .thumb:hover img {transform:scale(1.1)}
#portfolio .portfolio_list ul li .tit {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: var(--gray-900);display: flex;justify-content: space-between;align-items: center;margin:20px 0 0;}
@media (max-width:768px) {
    #portfolio .subvisual {padding: 60px 0 0;}
    #portfolio .portfolio_list {margin:80px 0 0;}
    #portfolio .portfolio_list ul {grid-template-columns:repeat(1, 1fr);gap: 60px;}
}

#detail .inner {padding: 0 0;}
#detail img {width: 100%;}

#about .about_sec01 .title {flex-direction: row;}
#about .about_sec01 .title h3 {flex: 690 1 0;}
#about .about_sec01 .title p {flex: 750 1 0;}
#about .about_sec01 ul {display: grid;grid-template-columns:repeat(3, 1fr);gap: 24px;margin:60px 0 0;}
#about .about_sec01 ul li {position: relative;aspect-ratio: 1/1;}
#about .about_sec01 ul li .txt {position:absolute;top:0;left:0;display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;height: 100%;gap:10px;z-index: 1;text-align: center;}
#about .about_sec01 ul li .txt h5 {font-size: var(--heading-2);font-weight: 600;line-height: 140%;letter-spacing: -0.32px;color: #fff;}
#about .about_sec01 ul li .txt p {font-size: var(--heading-4);font-weight: 600;letter-spacing: -0.1px;line-height: 150%;color: #fff;max-width: 58%;word-break: keep-all;}
#about .about_sec01 ul li video {position: absolute; top:0;left:0;width: 100%;height: 100%;object-fit: cover;z-index: -1;}
@media (max-width:768px) {
    #about .about_sec01 .title {flex-direction: column;}
    #about .about_sec01 ul {grid-template-columns:repeat(1, 1fr);}
}
#about .about_sec02 {background: var(--gray-50);}
#about .about_sec02 > div {display: flex;align-items: flex-start;}
#about .about_sec02 > div .title {width: 400px;}
#about .about_sec02 table tr {border-top: 1px solid var(--border-default);}
#about .about_sec02 table th {padding: 30px 0;font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: var(--gray-900);text-align: left;min-width:200px;vertical-align: top;}
#about .about_sec02 table td {padding: 30px 0;font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: var(--gray-700);}
#about .about_sec02 table td p {word-break: keep-all;}
@media (max-width:768px) {
    #about .about_sec02 > div {flex-direction: column;gap:30px;}
    #about .about_sec02 > div .title {width: 100%;}
    #about .about_sec02 table th {padding: 20px 0;min-width:120px;}
    #about .about_sec02 table td {padding: 20px 0;}
}
#about .about_sec03 .title {margin:0 0 60px;}
#about .about_sec03 img {width: 100%;}

#about .about_sec04 {background: var(--gray-50);}
#about .about_sec04 > div {display: flex;align-items: flex-start;}
#about .about_sec04 > div .title {width: 400px;}
#about .about_sec04 > div .partner_logo {width:calc(100% - 400px);display: grid;grid-template-columns: repeat(3, 1fr);gap:30px 0;}
#about .about_sec04 > div .partner_logo span {display: flex;height:80px;align-items: center;justify-content: center;padding: 20px;;}
@media (max-width:768px) {
    #about .about_sec04 > div {flex-direction: column;gap:30px;}
    #about .about_sec04 > div .partner_logo {width: 100%;}
}
#about .about_sec05 .map {width: 100%;height: 480px;margin:60px 0 0;}
#about .about_sec05 .info {margin:40px 0 0;display: flex;}
#about .about_sec05 .info > div {display: flex;flex:1;gap:var(--card-gap);}
#about .about_sec05 .info > div h4 {width: 200px;font-weight: 600;font-size: var(--heading-3);line-height: 140%;letter-spacing: -0.24px;color: var(--gray-900);}
#about .about_sec05 .info > div > div h5 {font-weight: 600;font-size: var(--heading-4);line-height: 150%;letter-spacing: -0.1px;color: var(--gray-900);margin:0 0 4px;}
#about .about_sec05 .info > div > div h5 span {display: inline-block;margin:0 10px 0 0;}
#about .about_sec05 .info > div > div p {margin:0 0 20px;font-size: var(--text-15);color: var(--gray-700);font-weight: 500;line-height: 160%;padding: 0 16px;}
@media (max-width:768px) {
    #about .about_sec05 .map {height:320px;}
    #about .about_sec05 .info {flex-direction: column;}
    #about .about_sec05 .info > div:first-child {margin:0 0 20px;border-bottom: 1px solid var(--border-default);}
    #about .about_sec05 .info > div {flex-direction: column;}
}
#history .history_list {margin:120px 0 0;}
#history .history_list > div {display: flex;margin: 60px 0 0;}
#history .history_list > div h3 {width: 300px;font-size: var(--heading-1);font-weight: 700;line-height: 140%;color: var(--gray-900);}
#history .history_list > div table {width: calc( 100% - 300px );}
#history .history_list > div table {border-top: 1px solid var(--gray-800);}
#history .history_list > div table tr {border-bottom: 1px solid var(--border-default);}
#history .history_list > div table th {padding: var(--card-padding) 0;width: 200px; text-align: left;font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;color: var(--gray-900);}
#history .history_list > div table td {padding: var(--card-padding) 0;font-size: var(--text-15);color: var(--gray-700);font-weight: 500;}
@media (max-width:768px) {
    #history .history_list {margin:40px 0 0;}
    #history .history_list > div {flex-direction: column;gap:30px;}
    #history .history_list > div h3 {width: 100%;}
    #history .history_list > div table {width: 100%;}
    #history .history_list > div table th {width: 150px;}
}
#contact .subvisual {margin: 40px 0 100px; height:300px;border-radius: 20px;overflow: hidden;padding: 0 60px;display: flex;flex-direction: column; justify-content: center;gap:12px; align-items: flex-start;background: url('../images/subvisual_contact.png') no-repeat center center/cover;}
#contact .subvisual h2 {font-size: var(--display-hero);font-weight: 700;line-height: 130%;letter-spacing: -1.12px;color: #fff;}
#contact .subvisual p {font-size: var(--heading-4);font-weight: 600;line-height: 140%;letter-spacing: -0.24px;color: var(--gray-200);}
#contact .inner {padding: 0 0 80px;}
#contact .inquiry {display: flex;justify-content: space-between;}
#contact .gall_box {display: flex;gap:12px;margin:30px 0 0;}
#contact .gall_box .gall_box_right {display: flex;gap:12px;flex-direction: column;}
#contact .gall_box .gall_cont {border-radius: var(--rounded-sm);position: relative;}
#contact .gall_box .gall_cont > img {border-radius: var(--rounded-sm);}
#contact .gall_box .gall_cont .label {position: absolute;bottom:-11px;left:0;width:fit-content; display: flex;align-items: center;justify-content: center;gap:8px;padding: 8px 16px;background: #fff;border-radius: 60px;box-shadow: var(--shadow-card-hover);}
#contact .gall_box .gall_cont .label p {font-size: var(--text-13);line-height: 150%;color: var(--gray-900);}
#contact .inquiry_form {width: 780px;display: flex;flex-direction: column;gap: 100px;}
#contact .inquiry_form .form_tit {display: flex;flex-direction: column;gap:12px;}
#contact .inquiry_form .form_tit h5 {color: var(--gray-600);font-size: var(--heading-4);font-weight: 600;letter-spacing: -0.1px;}
#contact .inquiry_form .form_tit h5 span {color: var(--primary-500);}
#contact .inquiry_form .form_tit h4 {color: var(--gray-900);font-size: var(--heading-2);font-weight: 600;line-height: 140%;letter-spacing: -0.32px;}
#contact .inquiry_form .form_tit p {color: var(--gray-700);font-size: var(--text-15);line-height: 160%;}
@media (max-width:1440px) {
    #contact .inner {padding: 0 40px 80px;}
}
@media (max-width:768px) {
    #contact .subvisual {margin: 0 0 60px;padding: 0 30px;height: 240px;}
    #contact .inner {padding: 0 20px 80px;}
    #contact .inquiry {flex-direction: column;}
    #contact .gall_box {display: none;}
    #contact .inquiry_form {width: 100%;margin:40px 0 0;}
}

#contact .category_check_wrap {display: grid;grid-template-columns: repeat(5,1fr);gap:12px;margin: 30px 0 0;}
#contact .category_check_wrap .category_check span {display: flex;align-items: center;justify-content: center;cursor: pointer;border-radius: var(--rounded-sm);padding: 0 12px;height: 52px; border: 1px solid var(--border-default);color: var(--gray-600);font-size: var(--text-16);font-weight: 600; background: #fff;transition: all 0.3s ease;}
#contact .category_check_wrap .category_check input {display: none;}
#contact .category_check_wrap .category_check input:checked + span {background: var(--primary-500);border-color: var(--primary-500);color: #fff;}
@media (max-width:768px) {
    #contact .category_check_wrap {grid-template-columns: repeat(3,1fr);gap:8px;}
    #contact .category_check_wrap .category_check span {height: 46px;}
}

#contact .category_swiper {margin: 12px 0 0;}
#contact .category_swiper .swiper-slide {height: 150px;padding: 15px;display: flex;flex-direction: column;justify-content: space-between; align-items: flex-end;border-radius: var(--rounded-sm);}
#contact .category_swiper .swiper-slide h5 {font-size: var(--heading-4);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;width: 100%;padding: 5px 15px;color: #fff;}
#contact .category_swiper .swiper-slide.web {background: url('../images/contact_bg_01.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.app {background: url('../images/contact_bg_02.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.ecommerce {background: url('../images/contact_bg_03.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.maintenance {background: url('../images/contact_bg_04.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.ai {background: url('../images/contact_bg_05.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.dashboard {background: url('../images/contact_bg_06.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.erp {background: url('../images/contact_bg_07.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.system {background: url('../images/contact_bg_08.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.iot {background: url('../images/contact_bg_09.jpg') no-repeat center center/cover;}
#contact .category_swiper .swiper-slide.etc {background: url('../images/contact_bg_01.jpg') no-repeat center center/cover;}

#contact .contact_field_grid {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; margin:24px 0 0;}
#contact .contact_field_grid label {display:flex; flex-direction:column; gap:8px;}
#contact .contact_field_grid span {color:var(--gray-700); font-size:var(--text-15); font-weight:600;}
#contact .contact_field_grid em {color:var(--primary-500); font-style:normal;}
#contact .contact_field_grid input {width:100%; height:54px; outline:none; border-radius:4px; border:1px solid var(--border-default); padding:0 12px; font-size:var(--text-15);}
#contact .contact_field_grid input::placeholder {color:var(--gray-600);}
@media screen and (max-width: 780px) {
    #contact .contact_field_grid {grid-template-columns:1fr;}
}

#contact .inquiry_form textarea {min-height: 250px;width: 100%;margin:12px 0 0; resize:none;outline:none;border-radius: 4px;border: 1px solid var(--border-default);padding: 16px 12px;font-size: var(--text-15);line-height: 160%;}
#contact .inquiry_form textarea::placeholder {color: var(--gray-600);}

#contact .inquiry_form .file_upload_box {width:100%;margin:30px 0 0;}
#contact .inquiry_form .file_upload_box p {color: var(--gray-700);font-size: var(--text-15);line-height: 160%;font-weight: 600;margin:0 0 12px;}
#contact .inquiry_form .file_upload_label {display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; padding: 16px 0; border:1px solid var(--border-default); border-radius:4px; background:#fff; cursor:pointer;transition:all .25s ease}
#contact .inquiry_form .file_upload_label:hover {border-color:#3182F6; background:#F9FAFB;}
#contact .inquiry_form .file_upload_label input {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); border:0;}
#contact .inquiry_form .file_upload_icon {display:flex; align-items:center; justify-content:center; width:40px; height:40px; margin-bottom:4px; border-radius:50%; background:var(--gray-200);transition:all .25s ease}
#contact .inquiry_form .file_upload_text {color:var(--gray-600); font-size:var(--text-14); font-weight:500;line-height: 160%;}
#contact .inquiry_form .file_upload_label:hover .file_upload_icon {background:#3182F6;}
#contact .inquiry_form .file_item {display: flex;justify-content: space-between;align-items: center;border: 1px solid var(--border-default);background: var(--gray-50);margin:12px 0 0;padding: 16px 12px;}
#contact .inquiry_form .file_item_info {border-radius: 4px;display: flex;align-items: center;gap:10px;align-items: center;}
#contact .inquiry_form .file_item_icon {display: block; width: 36px;height: 36px;background: url('../images/file_icon.svg') no-repeat center center/contain;}
#contact .inquiry_form .file_item_name {font-size: var(--text-13);color: var(--gray-700);}
#contact .inquiry_form .file_delete {width: 24px;height: 24px;color: #D1D6DB;transition: all 0.3s ease;}
#contact .inquiry_form .file_delete:hover {color: var(--semantic-error);}
#contact .inquiry_form .check_agree {font-size: var(--text-15);}
#contact .inquiry_form .check_agree input {stroke: 1px solid #ddd;}

.agree_check {display:flex; align-items:center; gap:8px; cursor:pointer;margin: 12px 0 0;}
.agree_check input {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.agree_check .check_icon {display:block; flex:0 0 20px; width:20px; height:20px; border:1px solid #D1D6DB; border-radius:4px; background:#fff; transition:all .2s ease;}
.agree_check input:checked + .check_icon {border-color:var(--primary-500); background:var(--primary-500) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M8.33335 2.5L3.75002 7.08333L1.66669 5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 10px 10px;}
.agree_check .agree_text {color:var(--gray-700); font-size:var(--text-15); font-weight:500; line-height:1.4;}
.agree_check .agree_text a {color:var(--primary-500); text-decoration:underline; text-underline-offset:3px; font-weight:500;}
.agree_check .agree_text strong {color:var(--primary-500); font-weight:500;}

.form_notice {margin:0 0 24px; padding:16px 20px; border:1px solid rgba(49,130,246,.25); border-radius:10px; background:rgba(49,130,246,.08); color:var(--primary-700); font-size:var(--text-15); font-weight:600; line-height:1.5;}

#contact .inquiry_form .btn_wrap button {position: relative; width: 240px;height: 68px;margin: 0 auto;background: var(--primary-700);padding: 0 16px;border-radius: 60px;color: #fff;font-size: var(--button-lg);font-weight: 600;overflow: hidden;}
#contact .inquiry_form .btn_wrap button span {position: relative;}
#contact .inquiry_form .btn_wrap button::before {content: '';display: block; position: absolute; top: 0; background: var(--primary-500);width: 120%;height:100%; left: -10%;transform: skew(30deg);transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);}
#contact .inquiry_form .btn_wrap button:hover::before {transform: translate3d(100%,0,0);}

#privacy_modal .modal_inner > div {margin:0 0 20px;}
#privacy_modal h4 {color: var(--gray-700);font-size: var(--text-16);font-weight: 600;line-height: 150%;letter-spacing: -0.1px;margin:10px 0;}
#privacy_modal p {color: var(--gray-600);font-size: var(--text-14);line-height: 160%;margin:10px 0;}
#privacy_modal ul li {position: relative; color: var(--gray-600);font-size: var(--text-14);line-height: 160%;padding: 0 0 0 12px;}
#privacy_modal ul li::before {content:""; position:absolute; left:0; top:.78em; width:4px; height:4px; border-radius:50%; background:#8B95A1;}

.modal_wrap {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9999; display:none; align-items:center; justify-content:center;}
.modal_wrap.active {display:flex;}
.modal_wrap .modal {position:relative; display:flex; flex-direction:column; max-width:720px; width:calc(100% - 40px); height:80vh; margin:0 auto; background:#fff; border-radius:var(--rounded-sm); overflow:hidden;}
.modal_wrap .modal .modal_title {display:flex; flex:0 0 auto; padding:24px; justify-content:space-between; background:var(--primary-500);}
.modal_wrap .modal .modal_title h3 {color:#fff; font-size:var(--heading-4); font-weight:600; line-height:150%; letter-spacing:-0.1px;}
.modal_wrap .modal .modal_cont {flex:1; min-height:0; padding:24px;}
.modal_wrap .modal .modal_inner {height:100%; padding:20px; background:var(--gray-50); border-radius:var(--rounded-sm); overflow-y:auto; box-sizing:border-box; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;}
body.modal_open {overflow:hidden;position: fixed;left:0;width: 100%;}
