body { }
a{color:inherit;text-decoration:none;}
a, button{-webkit-tap-highlight-color: transparent;}
a:focus{outline:none;}
.kmsol_wrap { position: relative; z-index: 1; }
.kong_competition_title h2, .test_title h2, .kong_brand_product_title h2, .mobile_part_title h2, .kong_power_part_title h2 { font-family: Pretendard-SemiBold, sans-serif; font-size: 52px; line-height: 1.2; }
.kong_competition_title h2 span, .test_title h2 span, .kong_brand_product_title h2 span, .mobile_part_title h2 span { color: #93c157; }
.kong_competition_title p, .test_title p, .kong_brand_product_title p, .mobile_part_title p { font-family: Pretendard-Light, sans-serif; font-size: 22px; color: #898989; box-sizing: border-box; padding-top: 30px; }
.kong_power_part_title h2 { color: #ffffff; }
.kong_power_part_title h2 span { color: #b6ff57; }
.kong_power_part_title p { font-family: Pretendard-Light, sans-serif; font-size: 22px; color: #ffffff; box-sizing: border-box; padding-top: 30px; }
.kong_power_part_img { position: relative; }
.kong_power_part_img img:nth-child(2) { position: absolute; bottom: -3%; left: 68%; }
.kong_competition_part { padding: 150px 0 0; background-image: url(/resources/img/kongshop/competition_bg.png); background-size: cover; background-repeat: no-repeat; }
.kong_competition_title { text-align: center; }
.kong_competition_img { padding: 50px 0 0; text-align: center; }
.kong_power_part { padding: 250px 0; background-image: url(/resources/img/kongshop/powerdeal_bg.png); background-size: cover; background-repeat: no-repeat; display: flex; justify-content: center; align-items: center; }
.kong_power_part_title { margin-right: 6rem; }
.kong_test_part { display: flex; justify-content: center; align-items: center; padding: 100px 0; }
.kong_test_box { position: relative; margin-right: 6rem; }
.kong_test_box_slide { width: 410px; position: absolute; top: 35%; left: 10%; }
.kong_test_box_slide > img { }
.kong_brand_product { display: flex; justify-content: center; align-items: center; background-color: #f7faff; padding: 100px 0; }
.kong_brand_product_title { margin-right: 6rem; }
.kong_brand_product_box { width: 628px; position: absolute; top: 25%; left: 0%; }
.kong_brand_product_img { position: relative; }
.kong_mobile_part { display: flex; justify-content: center; align-items: center; padding: 250px 0 100px; }
.kong_mobile_box { margin-right: 10rem; }
.mobile_circle { width: 370px; height: 370px; border-radius: 275px; background-color: #cdf1dd; position: relative; }
.kong_mobile_box_img { position: absolute; top: -9%; right: 2%; }
.kong_mobile_box_deco { position: absolute; top: -43%; left: -24%; }
.slick-slide.slick-current.slick-active { border: 1px solid red; box-shadow: 0 0 0 2px orangered inset; border-radius: 10px; }
/* header*/
#header {position: sticky;height: 80px;padding: 0 13px;background: #fff;backdrop-filter: blur(14px);display: flex;align-items: center;z-index: 1000;}
.header-menu { display:flex; gap:40px; margin-left:auto; }
.header-menu a { color:#fff; font-size:15px; font-weight:500; letter-spacing:.03em; }
.header-menu a:hover { color:#7cf3ff; }
.header-cta a { height: 34px; padding: 0 22px; display: inline-flex; align-items: center; border-radius: 999px; background: rgba(255,255,255,0.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgb(0 0 0 / 35%); color: #000000; font-size: 12px; font-weight: 500; letter-spacing: 0.05em; transition: .25s ease; }

.header-cta a:hover { background: rgba(255,255,255,0.14); border-color: #7cf3ff; color: #7cf3ff; }



.kmsol_logo_wrap { width: 75%; }
.main_full_wrap { width:100%; margin:0 auto; }
.main_wrap { max-width: 1200px; margin: 0 auto; width: 100%; }
.kmsol_top_menu { width: 100%; padding-right: 20px; }
.kmsol_top_menu_list { display: flex; justify-content: space-between; }
.kmsol_top_menu_list a { color: #04304A; }
#top_menu_toggle { display: flex; width: 100%; }
#top_menu_toggle li { flex:1; display:flex; justify-content: center; padding: 6px; }
#menu-toggle { display: none; }
#top_menu_box { display: none; }
/* 기본 스타일 */
.kmsol_top_menu_list { list-style: none; padding: 0; margin: 0; display: flex; }
.kmsol_top_menu_list li { position: relative; }
.kmsol_top_menu_list > li > a { display: block; padding: 15px 20px; color: #123; text-decoration: none; font-weight: bold; transition: background 0.3s; }
.kmsol_top_menu_list > li > a:hover { color:rgba(56, 177, 83, 0.937255); }
/* 서브 메뉴 스타일 */
.kmsol_top_menu_list ul { list-style: none; padding: 0; margin: 0; position: absolute; top: 100%; left: 0; background-color: rgba(56, 177, 83, 0.937255); display: none; min-width: 150px; border-radius: 4px; }
.kmsol_top_menu_list ul li a { display: block; padding: 10px 15px; color: white; text-decoration: none; transition: background 0.3s; }
.kmsol_top_menu_list ul li a:hover { background-color: rgba(47, 147, 206, 0.937255); }
/* 마우스를 올리면 서브 메뉴 표시 */
.kmsol_top_menu_list li:hover > ul { display: block; }
#top_menu_toggle .has-submenu ul { display: none; position: absolute; width: 150px; padding: 31px; }
#top_menu_toggle li a { color:#123; }
#top_menu_toggle li:hover ul { display:block; }
#top_menu_toggle .has-submenu > ul > li > a { font-size:16px; color:#fff; }
#top_menu_toggle .has-submenu > ul > li { background: #43b175; }
#top_menu_toggle .has-submenu > ul > li:first-child { border-top-left-radius:4px; border-top-right-radius:4px; }
#top_menu_toggle .has-submenu > ul > li:last-child { border-bottom-left-radius:4px; border-bottom-right-radius:4px; }
#top_menu_toggle .has-submenu > ul > li:hover { background: #3d9cc8; }
.has-submenu { width:100%; }
.menu-container { flex: 1; display: flex; justify-content: flex-end; }
#top_menu_toggle { display: flex; align-items: center; gap: 30px; }
#top_menu_toggle > li > a {
 font-size: 16px;
 font-weight: 500;
 letter-spacing: -0.01em;
 color: rgb(0 0 0 / 90%); /* 배경이 어두우니까 */
 padding: 0 !important;
}

.header-cta a { font-size: 18px; letter-spacing: 0.04em; font-weight: 600; }

/*뉴스*/
.news_link_section {
 padding: 80px 20px;
 background: #f8f9fb;
}

.news_link_inner {
 max-width: 1000px;
 margin: 0 auto;
}

.news_link_list {
 display: flex;
 flex-direction: column;
 gap: 20px;
}

.news_link_btn {
 display: flex;
 align-items: center;
 gap: 27px;
 padding: 17px 26px;
 background: #fff;
 border: 1px solid #e5e7eb;
 border-radius: 20px;
 text-decoration: none;
 transition: all 0.2s ease;
 box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

.news_link_btn:hover {
 transform: translateY(-3px);
 box-shadow: 0 8px 24px rgba(0,0,0,0.08);
 border-color: #ccc;
}

.news_link_thumb {
 width: 135px;
 aspect-ratio: 1 / 1;
 border-radius: 16px;
 overflow: hidden;
 flex-shrink: 0;
 background: #f1f1f1;
}

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

.news_link_content {
 flex: 1;
 min-width: 0;
 display: flex;
 flex-direction: column;
 justify-content: center;
 gap: 12px;
}

.news_link_media {
 width: 180px;
 height: 36px;
 display: flex;
 align-items: center;
 overflow: hidden;
}

.news_link_media img {
 max-width: 100%;
 max-height: 100%;
 object-fit: contain;
 display: block;
}

.news_link_title {
 font-size: 25px;
 font-weight: 700;
 color: #313131;
 line-height: 1.45;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.news_link_arrow {
 font-size: 30px;
 color: #999;
 flex-shrink: 0;
 margin-left: 12px;
}

@media (max-width: 768px) {
 .news_link_btn {
  gap: 16px;
  padding: 18px;
  align-items: center;
 }

 .news_link_thumb {
  width: 88px;
  border-radius: 12px;
 }

 .news_link_media {
  width: 130px;
  height: 28px;
 }

 .news_link_title {
  font-size: 18px;
 }

 .news_link_arrow {
  font-size: 24px;
  margin-left: 0;
 }
}

/*right_banner*/
.right_banner { position: fixed; top: 18%; right: 1%; color: #04304A; }
.right_banner div { width: 150px; text-align: center; background: #ffffff; border: 1px solid #ffffff; padding: 15px; border-radius: 50px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25); font-weight: 600; }
.right_banner div:first-child { margin-bottom: 20px; }
.right_banner div i { padding-right: 10px; }

/*섹션2*/
.section2_wrap {
 position: relative;
 overflow: hidden;
 padding: 180px 0 180px;
 background: linear-gradient(360deg, rgb(6 10 39 / 38%), rgb(11 34 69 / 23%)), url(/resources/img/section2_bg.jpg) center / cover no-repeat;
}

.section2_wrap::before {
 display: none;
}

.section2_inner {
 position: relative;
 z-index: 2;
 max-width: 1280px;
 margin: 0 auto;
 padding: 0 40px;
}

.section2_title {
 text-align: center;
 margin-bottom: 70px;
}

.section2_title h2 {
 font-size: 52px;
 line-height: 1.25;
 font-weight: 800;
 letter-spacing: -0.03em;
 color: #ffffff;
}

.section2_title h2 span {
 display: inline-block;
 color: #ffffff;
}

.section2_cards {
 max-width: 980px;
 margin: 0 auto;
 display: flex;
 flex-direction: column;
 gap: 18px;
}

.section2_card {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 30px;
 min-height: 122px;
 padding: 28px 34px;
 border-radius: 16px;
 background: rgba(255, 255, 255, 0.04);
 border: 1px solid rgba(255, 255, 255, 0.14);
 box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);

 opacity: 0;
 transform: translateY(40px);
 transition: opacity 0.3s ease, transform 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}

.section2_card.show {
 opacity: 1;
 transform: translateY(0);
}

.section2_card:hover {
 transform: translateY(-4px);
 border-color: rgb(101 183 255 / 27%);
 box-shadow: 0 18px 40px rgb(25 255 255 / 9%);
}

.section2_card.active {
 background: linear-gradient(90deg, #0c84ff 0%, #003373 100%);
 border-color: rgba(255, 255, 255, 0.15);
}

.card_text {
 position: relative;
 z-index: 2;
 flex: 1;
}

.card_label {
 display: inline-block;
 margin-bottom: 10px;
 font-size: 14px;
 font-weight: 800;
 color: #00d9ff;
 letter-spacing: -0.01em;
}

.section2_card h3 {
 margin: 0 0 8px;
 font-size: 28px;
 font-weight: 700;
 line-height: 1.35;
 letter-spacing: -0.02em;
 color: #ffffff;
}

.section2_card p {
 margin: 0;
 font-size: 17px;
 line-height: 1.6;
 color: rgba(255, 255, 255, 0.72);
}

.section2_card.active .card_label,
.section2_card.active h3,
.section2_card.active p {
 color: #ffffff;
}

.feature_icon {
 flex-shrink: 0;
 width: 84px;
 height: 84px;
 border-radius: 20px;
 background: #0b0d14;
 border: 1px solid rgba(255, 255, 255, 0.08);
 display: flex;
 align-items: center;
 justify-content: center;
}

.feature_icon img {
 width: 74px;
 height: 74px;
 object-fit: contain;
}

.section2_card.active .feature_icon {
 background: #0a0c12;
}

@media screen and (max-width: 1024px) {
 .section2_wrap {
  padding: 120px 0;
 }

 .section2_title h2 {
  font-size: 40px;
 }

 .section2_card h3 {
  font-size: 23px;
 }

 .section2_card p {
  font-size: 16px;
 }
}

@media screen and (max-width: 768px) {
 .section2_inner {
  padding: 0 20px;
 }

 .section2_title {
  margin-bottom: 45px;
 }

 .section2_title h2 {
  font-size: 30px;
  line-height: 1.35;
 }

 .section2_card {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  min-height: 122px;
  padding: 28px 34px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
  transition: all 0.3s ease;
  overflow: hidden;
 }

 .card_icon {
  width: 72px;
  height: 72px;
  border-radius: 18px;
 }

 .section2_card h3 {
  font-size: 21px;
 }

 .section2_card p {
  font-size: 15px;
 }
}
/* ===== 카테고리 탭 ===== */
/* ============================= */
/* 카테고리 전체 래퍼 */
/* ============================= */
.main_category_tabs {
 position: relative;
 z-index: 20;
 background: transparent !important;
 border: 0 !important;
 padding-top: 6px;
 padding-bottom: 0;
 margin-bottom: -122px;
 transform: translateY(20px);
}

/* ============================= */
/* 떠있는 다크 글래스 박스 */
/* ============================= */
.main_category_inner {
 max-width: 1320px;
 margin: 0 auto;
 padding: 0;
 overflow: hidden;

 background: rgba(7, 15, 30, 0.45) !important;

 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);

 border: 1px solid rgba(255, 255, 255, 0.08);
 border-radius: 23px;

 box-shadow:
         6px 6px 40px rgba(0, 0, 0, 0.28),
         0 8px 18px rgba(0, 0, 0, 0.18);
}

/* ============================= */
/* 행 */
/* ============================= */
.main_category_inner .category_row {
 display: grid;
 grid-template-columns: 190px 1fr;
 margin: 0;
 padding: 0;
}

.main_category_inner .category_row + .category_row {
 border-top: 1px solid rgba(255,255,255,0.08);
}

/* ============================= */
/* 왼쪽 라벨 */
/* ============================= */
.main_category_inner .category_label {
 display: flex;
 align-items: center;
 padding: 16px 20px;
 box-sizing: border-box;
 font-size: 14px;
 font-weight: 700;
 color: #ffffff !important;
 background: rgba(8, 18, 38, 0.88) !important;

 /* 🔥 세로선 하나만 */
 border-right: 1px solid rgba(255,255,255,0.08);
}

.main_category_inner .category_label.accent {
 color: #ffffff !important;
 background: rgba(8, 18, 38, 0.94) !important;
}

/* ============================= */
/* 오른쪽 리스트 */
/* ============================= */
.main_category_inner .category_list {
 list-style: none;
 margin: 0;
 padding: 0;
 display: grid;
 grid-template-columns: repeat(6, 1fr);
}

/* 🔥 핵심: 기존 border 전부 제거 */
.main_category_inner .category_list li {
 margin: 0;
 padding: 0;
 background: transparent !important;
 border: none !important;
}

/* 🔥 세로선은 여기서만 생성 (겹침 방지) */
.main_category_inner .category_list li + li {
 border-left: 1px solid rgba(255,255,255,0.08);
}

.main_category_inner .category_list li a {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 56px;
 padding: 12px 10px;
 box-sizing: border-box;
 font-size: 13px;
 font-weight: 600;
 line-height: 1.4;
 text-align: center;
 text-decoration: none;
 color: rgba(255, 255, 255, 0.88) !important;
 background: #747bb11a !important;

 /* 🔥 기존 inset 라인 제거 (겹침 원인) */
 box-shadow: none;
 transition:
         background-color 0.22s ease,
         color 0.22s ease,
         box-shadow 0.22s ease,
         transform 0.18s ease;
}

.main_category_inner .category_list li a:hover {
 color: #ffffff !important;
 background: #2d70efde !important;
 box-shadow: none;
}

/* 활성 메뉴 */
.main_category_inner .category_list li.is-active {
 background: rgba(37, 99, 235, 0.20) !important;
}

.main_category_inner .category_list li.is-active a {
 color: #ffffff !important;
 /* background: rgb(26 36 91 / 22%) !important; */
 font-weight: 700;
 box-shadow: none;
}

/* ============================= */
/* 메인 배너 */
/* ============================= */
.main_visual,
.km_main_visual,
.hero_section,
.visual_section {
 margin-top: 0 !important;
 padding-top: 0 !important;
 position: relative;
 z-index: 1;
}

/* ===== í–‰ ===== */

.category_row{
 display:grid;
 grid-template-columns:180px 1fr;
 border-bottom: 1px solid #474747;
 /* border-left:1px solid #e5e7eb; */
 /* border-right:1px solid #e5e7eb; */
 padding-left: 10px;
}

.category_row:last-child{
 border-bottom:none;
}

/* ===== 왼쪽 라벨 ===== */


/* ===== 우측 테이블 ===== */

.category_list{
 display:grid;
 grid-template-columns:repeat(6, 1fr);
 list-style:none;
 margin:0;
 padding:0;
 border-left:1px solid rgba(255, 255, 255, 0.06); /* ← 세로선 시작 */
 /* font-size: 1.8em; */
}

/* ⭐ 핵심: 셀 높이 통일 */

.category_list li{
 display:flex;
 border-right:1px solid rgba(255, 255, 255, 0.06);
 background: #f8fafc;
}

/* 마지막 세로선 제거 */

.category_list li:last-child{
 border-right:none;
}

/* ===== 링크 ===== */

.category_list li a{
 flex:1;
 display:flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 padding:16px 10px;
 font-size: 0.85em;
 color:#374151;
 font-weight:500;
 line-height:1.3;
 transition:.15s ease;
}

/* hover */

.category_list li a:hover{
 background: #edf3f8;
 color:#111827;
}

/* ===== ✅ active (셀 안에서만 pill) ===== */

.category_list li.is-active a{
 font-weight:700;
}

/* =========================
   📱 모바일
========================= */

@media (max-width:768px){

 .main_category_inner{
  padding:16px 20px;
 }

 .category_row{
  grid-template-columns:1fr;
  gap:10px;
  border-bottom:none;
  margin-bottom:18px;
  border-left: none;
  border-right: none;
  padding-left: 0;
 }
 .category_row:first-child {
  padding-top: 70px;
 }

 .category_label{
  padding:0;

 }

 .category_list{
  grid-template-columns:repeat(2,1fr);
  border:1px solid #e5e7eb;
  border-radius:12px;
  overflow:hidden;
 }

 .category_list li{
  border-right:1px solid #e5e7eb;
  border-bottom:1px solid #e5e7eb;
 }

 .category_list li:nth-child(2n){
  border-right:none;
 }

 .category_list li:last-child,
 .category_list li:nth-last-child(2){
  border-bottom:none;
 }

 .category_list li a{
  padding:14px 8px;
  font-size:13px;
 }

}


/*section3*/
.main_section3_wrap { padding:200px 0; }

.main_section3 { max-width:1600px; margin:0 auto; padding:0 40px; }


.main_section3_wrap { display:flex; justify-content:center; }

/* 글래스 패널 */
.section3_panel { position:relative; width:100%; max-width:1600px; border-radius:32px; overflow:hidden; }

/* 파란 글래스 PNG */
.panel_bg { width:100%; display:block; }

/* ë‚´ìš© */
.section3_content { position:absolute; inset:0; padding:120px 100px; display:flex; flex-direction:column; justify-content:flex-start; }

/* 타이틀 */
.section3_title { max-width:700px; margin-bottom:90px; }

.section3_badge { display:inline-flex; padding:8px 22px; border-radius:999px; border:1px solid rgba(124,243,255,.4); color:#7cf3ff; font-size:13px; margin-bottom:20px; }

.section3_title h2 {font-size: 56px;line-height: 1.2;font-weight: 700;letter-spacing: -0.02em;color: #fff;}

/* 카드 */
.section3_cards { display:flex; gap:50px; }

.section3_item { flex:1; color:#fff; }

.section3_item img { width:100%; border-radius:12px; margin-bottom:24px; }

.section3_item h3 { font-size:26px; font-weight:600; margin-bottom:14px; }

.section3_item p { font-size:22px; line-height:1.7; color:#fff; }

/*main4*/
.main_section4_wrap {position: relative;overflow: hidden;padding:160px 0 200px;background: linear-gradient(180deg, #f7fbf9 0%, #ffffff 70% );}
.main_section4_wrap::before {content:"";position:absolute;inset:-20% -10%;background:radial-gradient(circle at 18% 28%, rgba(69,176,73,0.12), transparent 55% ), radial-gradient(circle at 82% 72%, rgba(150,210,170,0.10), transparent 55%);
 pointer-events:none;z-index:0;}
.main_section4 {max-width:1300px; margin:0 auto;padding: 0 24px;min-height: auto;justify-content: center;display: grid;grid-template-columns: 1.1fr .9fr;gap: 60px;align-items: center;position: relative;z-index: 2;}
.main_section4 .section4_left { max-width: 100%; text-align: left; }
.main_section4 .section4_left h2 {margin-bottom: 20px;color: #111827;font-size: 56px;line-height: 1.2;font-weight: 700;letter-spacing: -0.02em;}
.main_section4 .section4_desc { font-size: 24px; font-weight: 800; line-height: 1.7; margin-bottom: 32px; color: #4b5563; }
.main_section4 .section4_desc br { display: none; }
.main_section4 .section4_list { margin-bottom: 36px; text-align: left; display: flex; flex-direction: column; gap: 10px}
.main_section4 .section4_list li {font-size: 20px;color: #334155;font-weight: 600;padding-left: 22px;position: relative;}
.main_section4 .section4_list li::before {content:"✔";position:absolute;left:0;color:#22c55e;font-weight:900;}
.main_section4 .section4_btn {display: inline-block;width: auto;text-align: center;font-size: 20px;padding: 14px 28px;border-radius: 999px;color: #fff;background: linear-gradient(135deg, #3590CF, #45B049);box-shadow: 0 12px 28px rgba(53,144,207,.35);transition: .2s;}
.main_section4 .section4_btn:hover {transform: translateY(-2px);box-shadow: 0 18px 40px rgba(53,144,207,.45);}
.section4_mockup {position: relative;height: 520px;}
.section4_mockup img {position: absolute;width: 305px;border-radius: 32px;transition: .3s;}
.section4_mockup .mockup_1 {top: 0;left: 40px;transform: rotate(-6deg);z-index: 2;}
.section4_mockup .mockup_2 {top: -77px;left: 260px;transform: rotate(5deg);z-index: 1;}
.section4_mockup img:hover {transform: scale(1.03);}
/* 복지몰 사례 */
.welfare_section { padding:160px 0 200px; position:relative; overflow:hidden; background:linear-gradient(180deg,#f8fbff 0%,#ffffff 70%); }
.welfare_section::before { content:""; position:absolute; inset:-20% -10%; background:radial-gradient(circle at 18% 28%, rgba(53,144,207,0.12), transparent 55%), radial-gradient(circle at 82% 72%, rgba(180,200,220,0.10), transparent 55%); pointer-events:none; z-index:0; }
.welfare_inner { position:relative; z-index:2; max-width:1400px; margin:0 auto; padding:0 60px; display:grid; grid-template-columns:46% 54%; gap:48px; align-items:flex-start; }
.welfare_text { position:sticky; top:120px; align-self:flex-start; }
.welfare_text h2 {font-size:56px;font-weight: 700;letter-spacing:-0.02em;color:#111827;margin-bottom:8px;}
.welfare_subtitle { font-size:24px; font-weight:800; color:#2563eb; margin-bottom:26px; }
.welfare_desc { font-size:17px; line-height:1.7; color:#475569; max-width:560px; margin-bottom:22px; }
.welfare_list { list-style:none; padding:0; margin:0 0 26px 0; display:grid; gap:9px; }
.welfare_list li { font-size:18px; color:#334155; font-weight:600; padding-left:22px; position:relative; }
.welfare_list li::before { content:"✔"; position:absolute; left:0; color:#2563eb; font-weight:900; }
.welfare_btn {display: inline-block;width: auto;text-align: center;font-size: 20px;padding: 14px 28px;border-radius: 999px;color: #fff;background: #2563eb;box-shadow: 0 12px 28px rgba(53, 144, 207, .35);transition: .2s;; }
.welfare_btn:hover { transform:translateY(-3px); box-shadow:0 18px 45px rgba(59,130,246,0.25); }
/* 카드 레이아웃 */
.welfare_cards { display:grid; grid-template-columns:repeat(2,330px); gap:16px 18px; justify-content:start; position:relative; }
.welfare_card { width:330px; height:410px; border-radius:18px; background:rgba(255,255,255,0.94); border:1px solid rgba(0,0,0,0.06); box-shadow:0 14px 34px rgba(0,0,0,0.07); transition:.25s ease; display:flex; flex-direction:column; overflow:hidden; }
.welfare_card:hover { transform:translateY(-10px); box-shadow:0 26px 70px rgba(53,144,207,0.18); border-color:rgba(53,144,207,0.32); }
.welfare_card img { width:100%; height:180px; object-fit:cover; display:block; flex-shrink:0; }
.welfare_card h3 { padding:16px 18px 6px; font-size:22px; line-height:1.35; font-weight:800; color:#111827; }
.welfare_card p { padding:0 18px 16px; font-size:18px; line-height:1.55; color:#64748b; }
/* 카드 미세 오프셋 (콩샵 느낌) */
.welfare_card:nth-child(odd) { transform:translateX(-12px); }
.welfare_card:nth-child(even) { transform:translateX(12px); margin-top:36px; }
/*섹션5*/
.main_section5_wrap {
 position: relative;
 width: 100%;
 padding: 160px 0 200px;
 overflow: hidden;
}

.main_section5_wrap::before {
 content: "";
 position: absolute;
 inset: 0;
 background: url("/resources/img/solution_benefits_bg.jpg") no-repeat center/cover;

 opacity: 0;
 transform: scale(1.08);
 transition: transform 1.2s ease, opacity 1.2s ease;

 z-index: 0;
}

.main_section5_wrap.active::before {
 opacity: 1;
 transform: scale(1);
}

.main_section5_wrap > * {
 position: relative;
 z-index: 1;
}
.cursor-circle {
 position: fixed;
 top: 0;
 left: 0;
 width: 30px;
 height: 30px;
 border-radius: 50%;
 background: transparent; /* 내부 비움 */
 border: 2px solid #ffffff; /* 흰색 테두리 */
 pointer-events: none;
 transform: translate(-50%, -50%);
 z-index: 99999;
}
.main_section5_wrap > * {
 position: relative;
 z-index: 1;
}
.kmsol_step_wrap { position:relative; overflow:hidden; }
.kmsol_step_bg { position:absolute; inset:0; overflow:hidden; z-index:0; }
.kmsol_step_bg img { position:absolute; width:100%; height:auto; left:50%; transform:translateX(-50%); top:-300px; }
.main_section5 { position:relative; z-index:2; max-width:1300px; margin:0 auto; padding:0 40px; }
.section5_title h3 {
 font-size: 17px;
 line-height: 1.7;
 font-weight: 500;
 letter-spacing: -0.02em;
 color: #222;
 margin-bottom: 50px;
}

.section5_title h2 {
 font-size: 56px;
 line-height: 1.2;
 font-weight: 700;
 letter-spacing: -0.02em;
 color: #222;
 margin-bottom: 20px;
}

.section5_title h2 .reveal_text {
 position: relative;
 display: inline;
 z-index: 1;
 font: inherit;
 line-height: inherit;
 letter-spacing: inherit;
 vertical-align: baseline;
 color: #fff;
 margin: 0 auto;
}

/* 배경 박스 */
.section5_title h2 .reveal_text::after {
 content: "";
 position: absolute;
 left: -8px;
 right: -8px;
 top: -0.08em;
 bottom: -0.06em;
 background: #2563eb;
 border-radius: 0px;
 z-index: -1;

 transform: scaleX(1);
 transform-origin: left center;
 transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.section5_title h2 .reveal_text.active::after {
 transform: scaleX(0);
}

.section5_title h2 .reveal_text.active {
 color: #2563eb;
}
.section5_cards {display:flex;gap: 40px;}
.section5_card {
 flex: 1;
 background: #ffffff8f;
 border: 1px solid rgba(255,255,255,0.15);
 border-radius: 16px;
 padding: 28px 36px;
 color: #222;
 backdrop-filter: blur(8px);
 display: flex;
 flex-direction: column;
 justify-content: space-between;

 opacity: 0;
 transform: translateY(40px);
 visibility: hidden;

 transition:
         opacity 0.5s ease,
         transform 0.5s ease,
         box-shadow 0.25s ease,
         border-color 0.25s ease;
}

.main_section5_wrap.active .section5_card {
 opacity: 1;
 transform: translateY(0);
 visibility: visible;
}

.main_section5_wrap.active .section5_card:nth-child(1) { transition-delay: 0.3s; }
.main_section5_wrap.active .section5_card:nth-child(2) { transition-delay: 0.6s; }
.main_section5_wrap.active .section5_card:nth-child(3) { transition-delay: 0.9s; }
.main_section5_wrap.active .section5_card:nth-child(4) { transition-delay: 1.1s; }
.section5_card .num { display:block; font-size:57px; font-weight:700; color:#2563eb ; margin-bottom:14px; }
.section5_card h3 { font-size:25px; font-weight:600; margin-bottom:12px; }
.section5_card p {font-size: 16px;line-height:1.6;color:#222;}

.card_icon { position: absolute; top: 18px; right: 18px; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; }
.card_icon img { width: 50px; height: 48px; }

/*섹션6*/
@keyframes scrollMove {
 0% {
  opacity: 0;
  transform: translateY(0);
 }
 30% {
  opacity: 1;
 }
 100% {
  opacity: 0;
  transform: translateY(12px);
 }
}

.scroll_icon {
 position: absolute;
 left: 50%;
 bottom: 158px; /* 위치 조절 */
 transform: translateX(-50%);
 z-index: 4;
}

/* 마우스 모양 */
.scroll_icon {
 width: 26px;
 height: 42px;
 border: 2px solid #fff;
 border-radius: 20px;
 opacity: 0.9;
}

/* 안에 움직이는 점 */
.scroll_icon span {
 display: block;
 width: 4px;
 height: 8px;
 background: #fff;
 border-radius: 2px;
 margin: 6px auto 0;
 animation: scrollMove 1.5s infinite;
}

.main_section6_wrap.section6_card_ver {
 padding: 230px 0 200px;
 background-image: url('/resources/img/back_test.png');
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
}

.section6_card_ver .main_section6 {
 max-width: 1400px;
 margin: 0 auto;
 padding: 0 20px;
}

.section6_card_ver .section6_title {
 max-width: 760px;
 /* text-align: center; */
}

.section6_card_ver .section6_title h2 {
 font-size: 52px;
 line-height: 1.25;
 font-weight: 700;
 color: #111;
 margin: 0;
 letter-spacing: -0.03em;
}

.section6_card_ver .section6_desc {
 margin-top: 41px;
 font-size: 17px;
 line-height: 1.7;
 color: #222;
 letter-spacing: -0.02em;
}

/* 카드 리스트 */
.section6_card_ver .s6_card_list {
 display: flex;
 gap: 24px;
 margin-top: 80px;
 opacity: 0;
 transform: translateY(250px);
 transition: all 2.3s ease;
}
/* 등장 상태 */
.section6_card_ver.show .s6_card_list {
 opacity: 1;
 transform: translateY(0);
}

/* 카드 */
.section6_card_ver .s6_card_item {
 width: calc(25% - 18px);
}


.section6_card_ver .s6_card_box {
 position: relative;
 height: 510px;
 border-radius: 12px;
 overflow: hidden;
 background-size: cover;
 background-position: center;
 cursor: pointer;
 transition: all .35s ease;
}

/* 이미지 */
.bg1 { background-image: url('/resources/img/km_benefit_01.png'); }
.bg2 { background-image: url('/resources/img/km_benefit_02.png'); }
.bg3 { background-image: url('/resources/img/km_benefit_03.png'); }
.bg4 { background-image: url('/resources/img/km_benefit_04.png'); }

/* 기본 어두운 그라데이션 */
.section6_card_ver .s6_card_box::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(
         to bottom,
         rgba(0,0,0,0.2) 0%,
         rgba(0,0,0,0.4) 40%,
         rgba(0,0,0,0.85) 100%
 );
 z-index: 1;
}

/* hover 어둡게 */
.section6_card_ver .s6_card_box::after {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(0,0,0,0.45);
 opacity: 0;
 transition: opacity .3s ease;
 z-index: 2;
}

.section6_card_ver .s6_card_box:hover::after {
 opacity: 1;
}

/* 중앙 텍스트 */
.section6_card_ver .s6_card_center {
 position: absolute;
 top: 79%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
 padding: 0 24px;
 text-align: center;
 z-index: 3;
 transition: transform .35s ease;
}

/* 제목 */
.section6_card_ver .s6_card_center h3 {
 color: #fff;
 font-size: 29px;
 font-weight: 600;
 margin: 0;
}

/* 설명 */
.section6_card_ver .s6_card_desc {
 margin-top: 16px;
 font-size: 15px;
 line-height: 1.7;
 color: rgba(255,255,255,0.85);

 opacity: 0;
 transform: translateY(12px);
 transition: all .35s ease;
}

/* hover 효과 */
.section6_card_ver .s6_card_box:hover .s6_card_center {
 transform: translate(-50%, -60%);
}

.section6_card_ver .s6_card_box:hover .s6_card_desc {
 opacity: 1;
 transform: translateY(0);
}

/* 카드 hover 상승 */
.section6_card_ver .s6_card_box:hover {
 transform: translateY(-6px);
 box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

/* 반응형 */
@media (max-width: 1200px) {
 .section6_card_ver .s6_card_list {
  flex-wrap: wrap;
 }

 .section6_card_ver .s6_card_item {
  width: calc(50% - 12px);

 }
}

@media (max-width: 768px) {
 .main_section6_wrap.section6_card_ver {
  padding: 100px 0;
 }

 .section6_card_ver .s6_card_item {
  width: 100%;
 }

 .section6_card_ver .s6_card_box {
  height: 320px;
 }

 .section6_card_ver .s6_card_desc {
  opacity: 1;
  transform: none;
 }

 .section6_card_ver .s6_card_box:hover .s6_card_center {
  transform: translate(-50%, -50%);
 }
}
/*섹션7*/
.main_section7_wrap {padding:160px 0 220px;position:relative;background: linear-gradient(180deg, rgb(0 0 0 / 75%), rgba(10, 25, 47, 0.96)), url(/resources/img/section7_bg.png) center / cover no-repeat;overflow:hidden;}
.main_section7 { max-width:1400px; margin:0 auto; padding:0 60px; }
.section7_title { margin-bottom:90px; text-align:center; }
.section7_title h2 {color:#ffffff;font-size:56px;font-weight: 700;margin-top:18px;letter-spacing:-0.02em;}
.section7_title .ks_about_kicker { color:#7dd3fc !important; }
.section2_title .ks_about_kicker { color:#7dd3fc !important; }
.main_section8 .ks_about_kicker {color: #ffffff !important;}
.section7_cards {
 display: flex;
 gap: 16px;
}

.section7_card {
 flex: 1;
 overflow: hidden;
 border-radius: 8px;
 background: transparent;
 will-change: transform, opacity;
 opacity: 0;
 transform: translateY(24px);
 transition: opacity 0.7s ease, transform 0.7s ease;
}

.section7_card.show {
 opacity: 1;
 transform: translateY(0);
}

.section7_thumb {
 height: 270px;
 background: #4ea3ff;
 overflow: hidden;
}

.section7_thumb img {
 transition: transform 0.5s ease;
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}
.section7_card:hover .section7_thumb img {
 transform: scale(1.05);
}

.section7_caption {
 background: rgba(0,0,0,0.9);
 padding: 19px 21px;
 text-align: left;
}

.section7_caption p {
 margin: 0 0 4px;
 color: #fff;
 font-size: 17px;
 font-weight: 700;
 line-height: 1.3;
}

.section7_caption span {
 color: rgba(255,255,255,0.8);
 font-size: 14px;
 line-height: 1.4;
}

.section7_card:hover {
 transform: translateY(-10px);
 box-shadow: 0 0 0 2px #4ea3ff;
}

.section7_card:hover .section7_thumb img {
 transform: scale(1.04);
 transition: transform 0.45s ease;
}

.section7_icon::before { content:""; width:54px; height:54px; background-repeat:no-repeat; background-position:center; background-size:contain; }
.icon-network::before { background-image:url("/resources/img/kmsol_work_place1.png"); }
.icon-distributed::before { background-image:url("/resources/img/kmsol_work_place2.png"); }
.icon-error::before { background-image:url("/resources/img/kmsol_work_place3.png"); }
.icon-legacy::before { background-image:url("/resources/img/kmsol_work_place4.png"); }

/*섹션8*/

.main_section8 {
 opacity: 0;
 transform: translateY(40px);
 transition:
         opacity 0.8s ease,
         transform 0.8s ease;
}

/* 보여질 때 */
.main_section8.show {
 opacity: 1;
 transform: translateY(0);
}

.main_section8_wrap {
 padding: 150px 0 150px;
 position: relative;
 margin-bottom: 40px;
 overflow: hidden;
 background: #000;
}

.main_section8_video {
 position: absolute;
 top: 50%;
 left: 50%;
 width: 100%;
 height: 100%;
 object-fit: cover;
 transform: translate(-50%, -50%);
 z-index: 0;
}

.main_section8_overlay {
 position: absolute;
 inset: 0;
 background: rgba(0, 0, 0, 0.45);
 z-index: 1;
}

.main_section8 {
 position: relative;
 z-index: 2;
 max-width: 1400px;
 margin: 0 auto;
 padding: 0 80px;
 display: flex;
 justify-content: center;
 align-items: center;
 text-align: center;
}

.section8_left {
 color: #fff;
 display: flex;
 flex-direction: column;
 align-items: center;
}

.section8_left h2 {
 font-size: 52px;
 font-weight: 600;
 line-height: 1.25;
 margin: 24px 0;
 color: #ffffff;
 letter-spacing: -0.02em;
}

.section8_left p {
 font-size: 20px;
 line-height: 1.7;
 color: #ffffff;
 letter-spacing: -0.02em;
 margin-bottom: 40px;
}

.kmsol-consult-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 300px;
 height: 56px;
 padding: 0 32px;
 border-radius: 999px;
 border: 1.5px solid rgba(255,255,255,0.9);
 color: #fff;
 font-size: 18px;
 font-weight: 700;
 text-decoration: none;
 transition: background 0.3s ease, border-color 0.3s ease;
}

.kmsol-consult-btn:hover {
 background: linear-gradient(90deg, #1c1c1c, #2a2a2a);
}

.kmsol-consult-btn .arrow {
 display: inline-block;
 margin-left: 6px;
 animation: arrowFlow 1.6s ease-in-out infinite;
}

@keyframes arrowFlow {
 0% {
  transform: translateX(0);
  opacity: 0.6;
 }
 50% {
  transform: translateX(6px);
  opacity: 1;
 }
 100% {
  transform: translateX(0);
  opacity: 0.6;
 }
}
/*메인 포트폴리오 부분*/

.main_section9_spotlight {
 position: absolute;
 inset: 0;
 z-index: 2;
 pointer-events: none;

 background: radial-gradient(
         circle at 50% 50%,
         rgba(255,255,255,0.08) 0%,
         rgba(255,255,255,0.04) 18%,
         rgba(0,0,0,0.55) 45%,
         rgba(0,0,0,0.85) 100%
 );

 opacity: 0;
 transform: scale(0.9);
 filter: blur(10px);

 transition:
         opacity 1.2s ease,
         transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.main_section9_wrap.main_section9_parallax {
 position: relative;
 overflow: hidden;
 min-height: 880px;
 background: #0b0b0d;
}

/* 실제 움직이는 배경 */
.main_section9_bg {
 position: absolute;
 top: -50px;
 left: -50px;
 width: calc(100% + 100px);
 height: calc(100% + 100px);
 z-index: 1;

 background-image: url('/resources/img/port_polio.jpg');
 background-size: cover;
 background-position: center center;
 background-repeat: no-repeat;

 transform: translate3d(0, 40px, 0) scale(1.14);
 opacity: 0;
 will-change: transform, opacity;
 transition:
         transform 1.35s cubic-bezier(0.22, 1, 0.36, 1),
         opacity 1s ease;
}

/* 어두운 오버레이 */
.main_section9_overlay {
 position: absolute;
 inset: 0;
 z-index: 2;
 background:
         linear-gradient(
                 180deg,
                 rgba(0, 0, 0, 0.65) 0%,
                 rgba(0, 0, 0, 0.80) 50%,
                 rgba(0, 0, 0, 0.80) 70%,
                 rgba(0, 0, 0, 0.65) 100%
         );
 opacity: 0;
 transition: opacity 1s ease;
}

.main_section9 {
 position: relative;
 z-index: 3;
 max-width: 1600px;
 min-height: 1030px;
 margin: 0 auto;
 padding: 0 20px;

 display: flex;
 align-items: center;
 justify-content: center;
}

.main_section9_content {
 text-align: center;
 transform: translateY(40px);
 opacity: 0;
 will-change: transform, opacity;
 transition:
         transform 1s cubic-bezier(0.22, 1, 0.36, 1),
         opacity 0.9s ease;
}

.main_section9_title {
 margin: 0;
 color: #fff;
 font-size: 58px;
 line-height: 1.18;
 font-weight: 700;
 letter-spacing: -0.045em;
 word-break: keep-all;
 text-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
}

.main_section9_title .count_num {
 display: inline-block;
 min-width: 2.9ch;
 font-size: 1.4em;
 letter-spacing: -5.02px;
 font-weight: 700;
}

.main_section9_desc {
 margin: 34px 0 0;
 color: rgb(255 255 255);
 font-size: 22px;
 line-height: 1.7;
 font-weight: 500;
 word-break: keep-all;
 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

.main_section9_btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 277px;
 height: 61px;
 margin-top: 46px;
 padding: 0 11px;
 border: 2px solid rgba(255, 255, 255, 0.92);
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.02);
 color: #fff;
 font-size: 21px;
 font-weight: 600;
 text-decoration: none;

 opacity: 0;
 transform: translateY(24px);
 transition:
         background .3s ease,
         color .3s ease,
         border-color .3s ease,
         transform .9s cubic-bezier(0.22, 1, 0.36, 1),
         opacity .8s ease;
}

/* 화면 진입 시 */
.main_section9_wrap.active .main_section9_bg {
 transform: translate3d(0, 0, 0) scale(1.06);
 opacity: 1;
}

.main_section9_wrap.active .main_section9_overlay {
 opacity: 1;
}

.main_section9_wrap.active .main_section9_content {
 transform: translateY(0);
 opacity: 1;
}

.main_section9_wrap.active .main_section9_btn {
 opacity: 1;
 transform: translateY(0);
 transition-delay: 0.22s;
}

/* hover */
.main_section9_btn:hover {
 background: #fff;
 color: #111;
 border-color: #fff;
 transform: translateY(-2px);
}

/* 태블릿 */
@media (max-width: 1280px) {
 .main_section9_wrap.main_section9_parallax,
 .main_section9 {
  min-height: 760px;
 }

 .main_section9_title {
  font-size: 60px;
 }

 .main_section9_desc {
  font-size: 21px;
  margin-top: 28px;
 }

 .main_section9_btn {
  min-width: 240px;
  height: 66px;
  font-size: 24px;
  margin-top: 38px;
 }
 .main_section9_title .count_num {
  font-size: 1.9em;
 }
}

/* 모바일 */
@media (max-width: 768px) {
 .main_section9_wrap.main_section9_parallax,
 .main_section9 {
  min-height: 560px;
 }

 .main_section9 {
  padding: 0 16px;
 }

 .main_section9_content {
  transform: translateY(28px);
 }

 .main_section9_title {
  font-size: 38px;
  line-height: 1.28;
 }

 .main_section9_desc {
  margin-top: 20px;
  font-size: 16px;
  line-height: 1.7;
 }

 .main_section9_btn {
  min-width: 180px;
  height: 52px;
  margin-top: 30px;
  padding: 0 24px;
  font-size: 18px;
  border-width: 1.5px;
 }
 .main_section9_title .count_num {
  font-size: 2.3em;
 }
}

/*footer*/
#footer {max-width: 1500px;margin: 0 auto;padding: 50px 10px;}
.footer_logo { margin-bottom: 20px; }
.footer_content span { font-weight: 600;margin-top:18px;color:#9ca3af; display: block}
/*inquiry_content*/
.inquiry_page {
 position: relative;
 min-height: 100vh;
 padding: 48px 20px 80px;
 overflow: hidden;
 background: radial-gradient(circle at 20% 75%, rgb(0 56 255 / 25%) 0%, rgb(30 66 193 / 8%) 20%, transparent 45%), radial-gradient(circle at 80% 20%, rgb(23 52 255 / 18%) 0%, transparent 40%), linear-gradient(120deg, #000 0%, #020a16 35%, #031b2d 55%, #000 100%);
}

.inquiry_content {
 max-width: 760px;
 margin: 0 auto;
}

.main_wrap h2 {
 display: none;
}

/* 상단 비주얼 */
.inquiry_visual {
 margin-bottom: 20px;
}

.inquiry_visual__inner {
 position: relative;
 overflow: hidden;
 min-height: 140px;
 border-radius: 20px;
 border: 1px solid rgba(255,255,255,0.08);
 background:
         radial-gradient(circle at 40% 70%, rgba(40, 76, 255, 0.95) 0%, rgba(40, 76, 255, 0.2) 10%, rgba(0,0,0,0) 22%),
         radial-gradient(circle at 58% 35%, rgba(0, 163, 255, 0.30) 0%, rgba(0,0,0,0) 25%),
         linear-gradient(115deg, #020202 0%, #02111f 38%, #031423 55%, #000 100%);
 box-shadow: 0 10px 30px rgba(0,0,0,0.35);
}

.inquiry_visual__inner::before {
 content: "";
 position: absolute;
 top: -40px;
 right: 22%;
 width: 180px;
 height: 240px;
 background: linear-gradient(180deg, rgba(0,153,255,0.35), rgba(0,153,255,0));
 filter: blur(10px);
 transform: rotate(25deg);
 opacity: 0.9;
}

.inquiry_visual__inner::after {
 content: "";
 position: absolute;
 top: -30px;
 right: 10%;
 width: 120px;
 height: 220px;
 background: linear-gradient(180deg, rgba(66,130,255,0.18), rgba(66,130,255,0));
 filter: blur(8px);
 transform: rotate(25deg);
}

.inquiry_visual__text {
 position: relative;
 z-index: 2;
 margin: 0;
 padding: 34px 32px;
 color: #fff;
 font-size: 18px;
 line-height: 1.6;
 font-weight: 700;
 word-break: keep-all;
}

/* 폼 박스 */
.inquiry_form_box {
 background: linear-gradient(180deg, #232323 0%, #171717 100%);
 border-radius: 20px;
 padding: 32px;
 box-shadow: 0 16px 40px rgba(0,0,0,0.45);
 border: 1px solid rgba(255,255,255,0.04);
}

.inquiry_content form {
 max-width: 100%;
 background: transparent;
 padding: 0;
 border-radius: 0;
 box-shadow: none;
 margin: 0;
}

.form_section + .form_section {
 margin-top: 28px;
}

.form_section_title {
 margin: 0 0 18px;
 color: #fff;
 font-size: 20px;
 font-weight: 700;
 padding: 0;
}

.form_row {
 margin-bottom: 18px;
}

.inquiry_content label {
 display: block;
 margin-bottom: 8px;
 color: #f3f6fb;
 font-size: 15px;
 font-weight: 700;
}

.inquiry_content label span,
.inquiry_content label em {
 color: #4d8dff;
 font-style: normal;
}

.inquiry_content input[type="text"],
.inquiry_content input[type="tel"],
.inquiry_content input[type="email"],
.inquiry_content input[type="url"],
.inquiry_content input[type="number"],
.inquiry_content input[type="file"],
.inquiry_content select,
.inquiry_content textarea {
 width: 100%;
 height: 52px;
 padding: 0 16px;
 background: #555;
 border: 1px solid transparent;
 border-radius: 8px;
 color: #fff;
 font-size: 15px;
 box-sizing: border-box;
 outline: none;
 transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.inquiry_content textarea {
 height: 140px;
 padding: 16px;
 resize: vertical;
 font-family: 'Pretendard', sans-serif;
}

.inquiry_content input[type="file"] {
 padding: 12px 16px;
 line-height: normal;
 background: #4e4e4e;
}

.inquiry_content input::placeholder,
.inquiry_content textarea::placeholder {
 color: rgba(255,255,255,0.55);
}

.inquiry_content select {
 appearance: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 cursor: pointer;
 background-image:
         linear-gradient(45deg, transparent 50%, #cfd8ea 50%),
         linear-gradient(135deg, #cfd8ea 50%, transparent 50%);
 background-position:
         calc(100% - 20px) calc(50% - 2px),
         calc(100% - 14px) calc(50% - 2px);
 background-size: 6px 6px, 6px 6px;
 background-repeat: no-repeat;
}

.inquiry_content input:focus,
.inquiry_content select:focus,
.inquiry_content textarea:focus {
 border-color: #2890ff;
 box-shadow: 0 0 0 3px rgba(40, 144, 255, 0.15);
 background: #5c5c5c;
}

/* 체크박스 영역 */
.check_group {
 display: flex;
 flex-wrap: wrap;
 gap: 10px 14px;
 padding: 14px 16px;
 background: #2b2b2b;
 border-radius: 12px;
 border: 1px solid rgba(255,255,255,0.05);
}

.check_item {
 display: inline-flex !important;
 align-items: center;
 gap: 8px;
 margin: 0 !important;
 color: #e9eefc !important;
 font-weight: 500 !important;
 cursor: pointer;
}

.inquiry_content input[type="checkbox"] {
 width: 18px;
 height: 18px;
 margin: 0;
 accent-color: #3150f0;
 flex: 0 0 auto;
}

.check_item span {
 color: #e9eefc;
 font-size: 14px;
 font-weight: 500;
}

/* 개인정보 */
.privacy_check {
 margin-bottom: 14px;
}

.agree_item {
 justify-content: flex-start;
}

.privacy_policy {
 height: 200px;
 overflow: hidden;
 overflow-y: auto;
 padding: 16px;
 border-radius: 12px;
 border: 1px solid rgba(255,255,255,0.06);
 background: #111;
}

.privacy_policy > p {
 margin: 0;
 color: rgba(255,255,255,0.72);
 font-size: 14px;
 line-height: 1.8;
 white-space: pre-line;
}

.privacy_policy > p > b {
 display: block;
 margin-top: 6px;
 color: #fff;
 font-weight: 700;
}

/* 안내문구 / 버튼 */
.form_notice {
 margin: 18px 0 14px;
 text-align: center;
 color: #fff;
 font-size: 15px;
 font-weight: 600;
}

.submit_btn {
 width: 100%;
 height: 56px;
 border: none;
 border-radius: 12px;
 background: linear-gradient(90deg, #2f49df 0%, #3554f6 100%);
 color: #fff;
 font-size: 18px;
 font-weight: 700;
 cursor: pointer;
 transition: transform 0.15s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.submit_btn:hover {
 transform: translateY(-1px);
 box-shadow: 0 12px 24px rgba(49, 80, 240, 0.35);
 background: linear-gradient(90deg, #2f49df 0%, #3554f6 100%);
}

.submit_btn:active {
 transform: translateY(0);
}

.mobile-menu-wrap {
 display: none;
}

/* 반응형 */
@media (max-width: 768px) {
 html,
 body {
  overflow-x: hidden;
 }

 .main_full_wrap,
 .main_wrap,
 .inquiry_page,
 .inquiry_content,
 .inquiry_visual,
 .inquiry_visual__inner,
 .inquiry_form_box,
 .form_section,
 .form_row {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
 }

 .main_wrap {
  padding-left: 0 !important;
  padding-right: 0 !important;
 }

 .inquiry_page {
  padding: 28px 16px 56px;
  overflow-x: hidden;
 }

 .inquiry_content {
  margin: 60px auto 0;
 }

 .inquiry_visual {
  margin-left: 0;
  margin-right: 0;
 }

 .inquiry_visual__inner {
  min-height: 120px;
  border-radius: 16px;
 }

 .inquiry_visual__text {
  padding: 26px 22px;
  font-size: 16px;
 }

 .inquiry_form_box {
  margin-left: 0;
  margin-right: 0;
  padding: 22px 18px;
  border-radius: 16px;
 }

 .form_section_title {
  font-size: 18px;
 }

 .inquiry_content input[type="text"],
 .inquiry_content input[type="tel"],
 .inquiry_content input[type="email"],
 .inquiry_content input[type="url"],
 .inquiry_content input[type="number"],
 .inquiry_content input[type="file"],
 .inquiry_content select,
 .inquiry_content textarea {
  width: 100%;
  max-width: 100%;
  font-size: 14px;
 }

 .submit_btn {
  width: 100%;
  height: 52px;
  font-size: 16px;
 }
}


/*kongshop*/
/*kong_platform_part*/
.kong_platform_part { background-image: url(/resources/img/kongshop/platform_bg.png); background-repeat: no-repeat; background-size: cover; }
.platform_content { display: flex; justify-content: center; padding: 150px 0 60px 0; }
.platform_content li { width: 280px; background-color: #ffffff; border-radius: 10px; padding:15px 0; box-sizing: border-box; font-family: Pretendard-SemiBold, sans-serif; font-size: 25px; margin:0 30px 30px 0; display: flex; align-items: center; height: 70px; }
.platform_content li p { padding-left: 20px; box-sizing: border-box; width: 60%; }
.platform_content img { padding-left: 20px; box-sizing: border-box; }
.platform_title { max-width: 1300px; text-align: center; margin: 0 auto; color: #ffffff; font-family: Pretendard-Medium, sans-serif; font-size: 35px; padding-bottom: 150px; box-sizing: border-box; line-height: 1.2; }
.platform_title p > span { font-weight: 600; }



@media screen and (max-width: 768px){
 .kong_platform_part { padding: 100px 30px; }
 .kong_test_part { display: flex; align-items: center; padding: 100px 30px; flex-direction: column; }
 .kong_test_box { position: relative; margin-right: 0!important; margin-bottom: 3rem; }
 .test_title { text-align: center; }
 .test_title h2 { font-size: 3rem; }
}

.ks_about_wrap {width: 100%;padding: 80px 20px;background: url(https://kmsol.kr/resources/img/kmsol_bg.png);}
.ks_about_inner { max-width: 1500PX; margin: 0 auto; }

.ks_about_section { padding: 52px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.ks_about_section:last-child { border-bottom: 0; }

.ks_about_head { margin: 133px 0 33px; }
.ks_about_kicker {--mint: #359bb9;position: relative;display: inline-flex;align-items: center;justify-content: center;padding: 10px 26px;border-radius: 999px;overflow: hidden;backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);color: #2563eb;font-size: 15px;font-weight: 600;letter-spacing: .02em;margin: 3px 0 35px;border: 1px solid;}
.ks_about_title {font-size: 43px;line-height: 1.25;letter-spacing: -0.8px;color: #000000;font-weight: 800;padding: 0px 0 12px;}
.ks_about_subtitle {margin-top: 12px;font-size: 25px;line-height: 1.5;letter-spacing: -0.2px;color: rgb(59 59 59 / 72%);}

.ks_about_body { display: grid; gap: 12px; }
.ks_about_desc {font-size: 19px;line-height: 1.8;letter-spacing: -0.2px;color: rgb(0 0 0 / 78%);}

.ks_service_grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.ks_service_card {background: rgb(255 255 255);border: 1px solid rgb(0 0 0 / 8%);border-radius: 16px;padding: 18px 18px 30px;}
.ks_service_card_head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.ks_service_num {font-size: 17px;font-weight: 800;color: #03A9F4;background: rgb(192 212 255 / 22%);border: 1px solid rgb(0 80 255 / 35%);padding: 6px 20px;border-radius: 999px;margin: 10px;}
.ks_service_title {font-size: 27px;line-height: 1.35;letter-spacing: -0.3px;color: #575757;font-weight: 800;margin: 0;flex: 1;text-align: right;}
.ks_service_list { margin: 0; padding-left: 18px; display: grid; gap: 7px; }
.ks_service_item {font-size: 22px;line-height: 1.2;letter-spacing: -0.2px;color: rgb(0 0 0 / 78%);}

.ks_history_list { display: grid; gap: 10px; margin-top: 18px; }
.ks_history_item {display: grid;grid-template-columns: 90px 1fr;gap: 14px;align-items: center;padding: 14px 16px;border: 1px solid rgb(0 0 0 / 8%);border-radius: 14px;background: rgba(255, 255, 255, 0.03);}
.ks_history_year {font-size: 34px;font-weight: 900;letter-spacing: -0.2px;color: #000000;margin: 0;}
.ks_history_text {font-size: 19px;line-height: 1.7;letter-spacing: -0.2px;color: rgb(20 20 20 / 78%);margin: 0;display: flex;align-items: center;}
.ks_patent_grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
@media (max-width:920px){.ks_patent_grid{grid-template-columns:repeat(1,minmax(0,1fr));}}

.ks_patent_card{border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:18px;background:#fff;box-shadow:0 8px 26px rgba(0,0,0,.06);transition:transform .25s ease,box-shadow .25s ease,opacity .7s ease,transform .7s ease;opacity:0;transform:translateY(22px);}
.ks_patent_card.is_show{opacity:1;transform:translateY(0);}
.ks_patent_card:hover{transform:translateY(-6px);box-shadow:0 14px 34px rgba(0,0,0,.10);}

.ks_patent_top{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;}
.ks_patent_badge{display:inline-flex;align-items:center;justify-content:center;max-width:max-content;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:-.2px;background:rgba(0,0,0,.06);color:rgba(0,0,0,.72);}
.ks_patent_badge.ks_patent_badge_on{background:rgba(0,0,0,.82);color:#fff;position:relative;overflow:hidden;}

.ks_patent_badge.ks_patent_badge_on::after{content:"";position:absolute;inset:-40%;background:radial-gradient(circle,rgba(255,255,255,.35),rgba(255,255,255,0) 60%);animation:ks_patent_pulse 2.2s ease-in-out infinite;}
@keyframes ks_patent_pulse{0%{transform:scale(.7);opacity:.0;}35%{opacity:.7;}100%{transform:scale(1.2);opacity:0;}}

.ks_patent_title{font-size: 27px;line-height:1.35;letter-spacing:-.3px;margin:0;color:rgba(0,0,0,.88);}
.ks_patent_en{font-size: 18px;line-height:1.45;margin:0;color:rgba(0,0,0,.55);}

.ks_patent_meta{display:flex;flex-direction:column;gap:8px;padding:12px 12px;border-radius:12px;background:rgba(0,0,0,.03);margin-bottom:12px;}
.ks_patent_row{display:flex;gap:10px;align-items:flex-start;}
.ks_patent_key{width:110px;flex:0 0 110px;margin:0;font-size:12px;color:rgba(0,0,0,.55);}
.ks_patent_val{margin:0;font-size:13px;color:rgba(0,0,0,.85);word-break:break-word;}

.ks_patent_desc{margin:0;font-size:13px;line-height:1.6;color:rgba(0,0,0,.72);}

.ks_patent_card.is_show:nth-child(1){transition-delay:.08s;}
.ks_patent_card.is_show:nth-child(2){transition-delay:.16s;}
.ks_patent_card.is_show:nth-child(3){transition-delay:.24s;}
.ks_patent_card.is_show:nth-child(4){transition-delay:.32s;}


@media (max-width: 920px){
 .ks_about_wrap { padding: 64px 16px; }
 .ks_about_title { font-size: 26px; }
 .ks_service_grid { grid-template-columns: 1fr; }
 .ks_patent_grid { grid-template-columns: 1fr; }
 .ks_service_title { text-align: left; }
}

@media (max-width: 480px){
 .ks_about_section { padding: 44px 0; }
 .ks_about_title { font-size: 24px; }
 .ks_about_subtitle { font-size: 15px; }
 .ks_about_desc { font-size: 15px; }
 .ks_history_item { grid-template-columns: 72px 1fr; }
 .ks_patent_row { grid-template-columns: 110px 1fr; }
}

/*포트폴리오*/
/*공통*/
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section_head { margin-bottom: 48px; }
.section_head h2 { font-size: 36px; font-weight: 700; margin-bottom: 12px; color: #1e2a3a; }
.section_head .desc {font-size: 22px;color: #6b7c93;line-height: 1.6; }

/*메인*/

.pf-dev-thumb {
 width: 100%;
 aspect-ratio: 1 / 1;
 overflow: hidden;            /* 중요: 이미지 튀어나오는거 막음 */
 border-radius: 18px;
}
.pf-dev-item:hover .pf-dev-thumb img {
 transform: scale(1.08);   /* 살짝 확대 */
}

.pf-dev-thumb img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 transition: transform .5s ease;   /* 부드럽게 */
}

.kmsol_portpolio_hero {
 position: relative;
 overflow: hidden;
 padding: 150px 0 110px;
 color: #fff;
}

.kmsol_portpolio_bg_video {
 position: absolute;
 top: 50%;
 left: 50%;
 width: 100%;
 height: 100%;
 object-fit: cover;
 transform: translate(-50%, -50%);
 z-index: 0;
}

.kmsol_portpolio_hero::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(
         180deg,
         rgba(8, 15, 30, 0.72) 0%,
         rgba(8, 15, 30, 0.45) 45%,
         rgba(8, 15, 30, 0.68) 100%
 );
 z-index: 1;
}

.kmsol_portpolio_hero .kmsol_company_inner {
 position: relative;
 z-index: 2;
 display: flex;
 flex-direction: column;
 align-items: center;
 text-align: center;
}

.kmsol_portpolio_hero .kmsol_company_kicker {
 background: rgba(255,255,255,0.08);
 border: 1px solid rgba(255,255,255,0.14);
 color: #dbeafe;
}

.kmsol_portpolio_hero .kmsol_company_hero_title {
 color: #ffffff;
 max-width: 900px;
}

.kmsol_portpolio_hero .kmsol_company_hero_subtitle {
 color: rgba(255,255,255,0.88);
 max-width: 820px;
}

/* 히어로 아래 전체 영역 */
.portfolio_dark_wrap {
 background: #0a0a0a;
 color: #ffffff;
}

/* 공통 */
.section_head {
 text-align: center;
 margin-bottom: 48px;
}

.section_head h2 {
 font-size: 38px;
 font-weight: 800;
 color: #ffffff;
 margin-bottom: 14px;
}

.section_head .desc {
 font-size: 17px;
 line-height: 1.8;
 color: rgba(255,255,255,0.72);
}

/* 포트폴리오 유형 */
.pf-dev-section {
 position: relative;
 overflow: hidden;
 padding: 130px 0 160px;
 background: #0a0a0a;
}

.pf-dev-bg {
 position: absolute;
 inset: 0;
 background: url('/resources/img/test_kmsol.jpg') center center / cover no-repeat;
 pointer-events: none;
}

.pf-dev-bg::after {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(10, 10, 10, 0.45);
}

.pf-dev-section .container {
 position: relative;
 z-index: 2;
 max-width: none;
 width: 100%;
 padding-left: 0;
 padding-right: 0;
}

.pf-dev-header {
 text-align: center;
 margin-bottom: 80px;
 padding: 0 24px;
}

.pf-dev-header h2 {
 font-size: 38px;
 font-weight: 800;
 color: #ffffff;
 margin-bottom: 10px;
}

.pf-dev-header p {
 font-size: 20px;
 line-height: 1.6;
 color: rgba(255,255,255,0.72);
}

.pf-dev-marquee {
 width: 100%;
 overflow: hidden;
 position: relative;
}

.pf-dev-track {
 display: flex;
 align-items: flex-start;
 gap: 24px;
 width: max-content;
 padding: 0 24px;
 animation: portfolioMarquee 36s linear infinite;
}

.pf-dev-item {
 flex: 0 0 auto;
 width: 360px;   /* 기존보다 크게 */
}

.pf-dev-item img {
 width: 360px;
 height: 360px;
 object-fit: cover;
 display: block;
 border-radius: 18px;
}

.pf-dev-item p {
 margin-top: 14px;
 font-size: 18px;
 line-height: 1.5;
 color: #ffffff;
 font-weight: 600;
}

@keyframes portfolioMarquee {
 0% {
  transform: translateX(0);
 }
 100% {
  transform: translateX(calc(-50% - 12px));
 }
}
/* 프로젝트 유형 */
.portfolio_types {
 padding: 120px 0;
 background: #0a0a0a;
}

.portfolio_types .container {
 max-width: 1180px;
}

.portfolio_types .section_head {
 grid-column: 1 / -1;
 margin-bottom: 20px;
}

.portfolio_types .section_head {
 text-align: center;
 margin-bottom: 56px;
}

.portfolio_types .section_head h2 {
 font-size: 38px;
 font-weight: 800;
 color: #fff;
 margin-bottom: 18px;
}
.portfolio_types .section_head .desc {
 font-size: 18px;
 line-height: 1.8;
 color: rgba(255,255,255,0.72);
}

.type_card:hover .type_footer {
 background: rgba(255,255,255,0.1);
 color: #60a5fa;
 transform: translateY(-2px);
}

.type_grid {
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 24px;
}
.type_hint {
 display: flex;
 justify-content: center;
 align-items: center;
 height: 55px;
 margin: 6px 0 5px;
 pointer-events: none;
}

.type_hint_arrow {
 position: relative;
 width: 18px;
 height: 18px;
 opacity: 0.9;
 animation: hintFloat 1.8s ease-in-out infinite;
}

.type_hint_arrow::before,
.type_hint_arrow::after {
 content: "";
 position: absolute;
 left: 50%;
 transform: translateX(-50%);
}

.type_hint_arrow::before {
 top: 0;
 width: 2px;
 height: 18px;
 background: linear-gradient(
         180deg,
         rgba(96,165,250,0) 0%,
         rgba(96,165,250,0.95) 100%
 );
 border-radius: 999px;
 box-shadow: 0 0 10px rgba(96,165,250,0.35);
}

.type_hint_arrow::after {
 bottom: -1px;
 width: 10px;
 height: 10px;
 border-right: 2px solid #60a5fa;
 border-bottom: 2px solid #60a5fa;
 transform: translateX(-50%) rotate(45deg);
 box-shadow: 0 0 10px rgba(96,165,250,0.18);
}

@keyframes hintFloat {
 0% {
  transform: translateY(-4px);
  opacity: 0.45;
 }
 50% {
  transform: translateY(6px);
  opacity: 1;
 }
 100% {
  transform: translateY(-4px);
  opacity: 0.45;
 }
}

.type_card {
 position: relative;
 min-height: 326px;
 padding: 20px 22px 22px;
 border-radius: 26px;
 background: linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
 border: 1px solid rgba(255,255,255,0.08);
 box-shadow: 0 12px 32px rgba(0,0,0,0.28);
 display: flex;
 flex-direction: column;
 align-items: center;
 text-align: center;
 transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
 overflow: hidden;
}
.type_card::before {
 content: "";
 position: absolute;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
 width: 60%;
 height: 1px;

 background: radial-gradient(
         circle,
         #60a5fa 0%,
         rgba(96,165,250,0.6) 40%,
         transparent 100%
 );

 pointer-events: none;   /* 핵심 */
}
.type_card:hover {
 transform: translateY(-6px);
 border-color: rgba(59,130,246,0.45);
 box-shadow: 0 18px 40px rgba(0,0,0,0.4);
}

.type_badge {
 min-width: 102px;
 height: 40px;
 padding: 0 18px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 17px;
 font-weight: 800;
 color: #fff;
 background: linear-gradient(90deg, #25c7d9 0%, #357cff 100%);
 margin-bottom: 26px;
}

.type_icon {
 width: 50px;
 height: 50px;
 margin: 10px auto 18px;
 border-radius: 12px;
 background-repeat: no-repeat;
 background-position: center;
 background-size: 63%;
 background-color: rgba(255,255,255,0.04);
}
/* 1번 */
.type_card:nth-child(1) .type_icon {
 background-image: url('/resources/img/km_icon_01.png');
}

/* 2번 */
.type_card:nth-child(2) .type_icon {
 background-image: url('/resources/img/km_icon_02.png');
}

/* 3번 */
.type_card:nth-child(3) .type_icon {
 background-image: url('/resources/img/km_icon_03.png');
}

/* 4번 */
.type_card:nth-child(4) .type_icon {
 background-image: url('/resources/img/km_icon_04.png');
}
/* 제목 */
.type_card h3 {
 font-size: 22px;
 line-height: 1.5;
 font-weight: 800;
 color: #fff;
 margin: 0 0 14px;
 word-break: keep-all;
}

.type_card p {
 font-size: 1.1em;
 line-height: 1.8;
 color: rgba(255,255,255,0.78);
 margin: -3px 0 10px;
 word-break: keep-all;
}

.type_footer {
 margin-top: 15px;
 width: 100%;
 min-height: 28px;
 border-radius: 14px;
 background: rgba(255,255,255,0.06);
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 12px 14px;
 font-size: 0.9em;
 line-height: 1.5;
 font-weight: 800;
 color: #ffffff;
 transition: background .25s ease, color .25s ease, transform .25s ease;
}

.type_link {
 font-size: 15px;
 font-weight: 700;
 color: #ffffff;
 opacity: 0.92;
}

/* 실제 구축 프로젝트 */
.portfolio_projects {
 position: relative;
 padding: 120px 0;
 background:
         radial-gradient(
                 900px circle at 80% 20%,
                 rgba(0, 120, 255, 0.12),
                 transparent 40%
         ),
         radial-gradient(
                 800px circle at 20% 80%,
                 rgba(0, 160, 120, 0.14),
                 transparent 45%
         ),
         radial-gradient(
                 600px circle at 50% 50%,
                 rgba(0, 80, 200, 0.08),
                 transparent 50%
         ),
         linear-gradient(
                 to bottom,
                 #0a0a0a 0%,
                 #0a0a0a 20%,
                 rgba(10, 10, 10, 0.6) 40%,
                 rgba(10, 10, 10, 0.6) 60%,
                 #0a0a0a 80%,
                 #0a0a0a 100%
         ),
         #0a0a0a;
}

.project_result_controls {
 margin-top: 20px;
 display: flex;
 gap: 12px;
 align-items: center;
 justify-content: center;
 flex-wrap: wrap;
}

.result_badge {
 display: inline-flex;
 align-items: center;
 height: 38px;
 padding: 0 14px;
 border-radius: 999px;
 font-size: 14px;
 font-weight: 700;
 background: rgba(255,255,255,0.08);
 border: 1px solid rgba(255,255,255,0.14);
 color: #ffffff;
}

.result_badge:empty {
 display: none;
}

.result_reset {
 background: transparent;
 border: none;
 color: rgba(255,255,255,0.72);
 font-size: 14px;
 font-weight: 600;
 cursor: pointer;
}

.result_reset:hover {
 color: #ffffff;
}

.project_list {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 28px;
}

.project_item {
 display: flex;
 gap: 22px;
 padding: 24px;
 border-radius: 24px;
 background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.03) 100%);
 border: 1px solid rgba(255,255,255,0.10);
 transition: all .3s ease;
 box-shadow: 0 10px 30px rgba(0,0,0,0.22);
}

.project_item:hover {
 transform: translateY(-6px);
 border-color: rgba(255,255,255,0.18);
 box-shadow: 0 18px 38px rgba(0,0,0,0.35);
}

.project_thumb {
 width: 210px;
 height: 145px;
 flex-shrink: 0;
 overflow: hidden;
 border-radius: 16px;
 background: #141414;
 cursor: pointer;
}

.project_thumb img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 transition: transform .35s ease;
}

.project_item:hover .project_thumb img {
 transform: scale(1.04);
}

.project_body h3 {
 margin-bottom: 12px;
 font-size: 21px;
 font-weight: 800;
 color: #ffffff;
 line-height: 1.4;
}

.project_body .badge {
 display: inline-flex;
 align-items: center;
 margin-bottom: 14px;
 height: 34px;
 padding: 0 12px;
 border-radius: 999px;
 font-size: 13px;
 font-weight: 700;
 background: rgba(255,255,255,0.08);
 border: 1px solid rgba(255,255,255,0.12);
 color: #ffffff;
}

.project_body p {
 font-size: 0.9em;
 line-height: 1.7;
 color: rgba(255,255,255,0.72);
}

/* CTA */
.portfolio_cta {
 padding: 120px 24px 140px;
 text-align: center;

 background:
         radial-gradient(
                 ellipse at bottom center,
                 rgba(37, 99, 235, 0.35) 0%,
                 rgba(37, 99, 235, 0.18) 25%,
                 rgba(37, 99, 235, 0.08) 45%,
                 rgba(10, 10, 10, 1) 70%
         ),
         #0a0a0a;
}

.portfolio_cta h2 {
 font-size: 38px;
 line-height: 1.4;
 margin-bottom: 30px;
 color: #ffffff;
 font-weight: 800;
}

.btn_primary {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 height: 56px;
 padding: 0 34px;
 border-radius: 999px;
 background: #ffffff;
 color: #0a0a0a;
 font-weight: 800;
 font-size: 17px;
 text-decoration: none;
 transition: all .25s ease;
}

.btn_primary:hover {
 transform: translateY(-2px);
 background: #f2f2f2;
}

/* 오버레이 */
.image_overlay {
 position: fixed;
 inset: 0;
 background: rgba(0,0,0,.82);
 display: flex;
 align-items: center;
 justify-content: center;
 z-index: 9999;
}

.image_overlay[hidden] {
 display: none !important;
}

.overlay_inner {
 position: relative;
 max-width: 90vw;
 max-height: 90vh;
}

.overlay_inner img {
 max-width: 90vw;
 max-height: 90vh;
 border-radius: 14px;
 display: block;
}

.overlay_close {
 position: absolute;
 top: -42px;
 right: 0;
 background: none;
 border: none;
 color: #fff;
 font-size: 28px;
 cursor: pointer;
}

.overlay_nav {
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 background: rgba(255,255,255,0.12);
 border: 1px solid rgba(255,255,255,0.16);
 color: #fff;
 font-size: 34px;
 width: 48px;
 height: 48px;
 border-radius: 50%;
 cursor: pointer;
 backdrop-filter: blur(8px);
}

.overlay_nav.prev {
 left: -70px;
}

.overlay_nav.next {
 right: -70px;
}

#overlayImage {
 opacity: 0;
 transition: opacity .25s ease;
}

#overlayImage.is-loaded {
 opacity: 1;
}

.overlay_index {
 position: absolute;
 bottom: -36px;
 left: 50%;
 transform: translateX(-50%);
 font-size: 14px;
 color: rgba(255,255,255,.82);
}

.overlay_badge {
 position: absolute;
 top: -38px;
 left: 0;
 font-size: 13px;
 padding: 6px 12px;
 border-radius: 999px;
 background: rgba(255,255,255,0.10);
 border: 1px solid rgba(255,255,255,0.14);
 color: #ffffff;
}

/* 반응형 */
@media (max-width: 1280px) {
 .pf-dev-item {
  width: 420px;
 }

 .pf-dev-item img {
  height: 300px;
 }
}

@media (max-width: 1024px) {
 .portfolio_types .container {
  grid-template-columns: 1fr;
 }

 .project_list {
  grid-template-columns: 1fr;
 }

 .project_item {
  flex-direction: column;
 }

 .project_thumb {
  width: 100%;
  height: 220px;
 }

 .overlay_nav.prev {
  left: 10px;
 }

 .overlay_nav.next {
  right: 10px;
 }
}

@media (max-width: 768px) {
 .kmsol_portpolio_hero {
  padding: 120px 0 80px;
 }

 .pf-dev-section {
  padding: 72px 0 72px;
 }

 .pf-dev-header h2,
 .section_head h2,
 .portfolio_cta h2 {
  font-size: 28px;
 }

 .pf-dev-header p,
 .section_head .desc {
  font-size: 16px;
 }

 .pf-dev-item {
  width: 300px;
 }

 .pf-dev-item img {
  height: 215px;
  border-radius: 14px;
 }

 .pf-dev-item p {
  font-size: 15px;
  margin-top: 10px;
 }

 .portfolio_types {
  padding: 70px 0 90px;
 }

 .type_card {
  padding: 24px 20px;
  border-radius: 18px;
 }

 .type_card h3 {
  font-size: 20px;
 }

 .type_card p {
  font-size: 15px;
 }

 .portfolio_projects {
  padding: 80px 0;
 }

 .project_item {
  padding: 20px;
  border-radius: 18px;
 }

 .project_body h3 {
  font-size: 18px;
 }

 .project_body p {
  font-size: 15px;
 }

 .portfolio_cta {
  padding: 70px 24px 100px;
 }
}
/* */
.dev_swiper_section { padding:28px 0; max-width: 1920px; margin: 0 auto; }
.dev_swiper_header { display:flex; flex-direction:column; gap:6px; margin:0 0 16px 0; }
.dev_swiper_title { font-size:22px; line-height:1.2; margin:0; }
.dev_swiper_desc { font-size:13px; line-height:1.4; margin:0; opacity:0.65; }

.dev_swiper { position:relative; }
/* 카드 유리(Glassmorphism) 느낌 */
.dev_card { height:220px; border-radius:16px; padding:18px; box-sizing:border-box; display:flex; flex-direction:column; gap:10px; background: url(https://kmsol.kr/resources/img/260112_kmsol_bg3.png); box-shadow:0 10px 30px rgba(0,0,0,0.10); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); position:relative; overflow:hidden; background-size: cover; }

/* 유리 반사 하이라이트 */
.dev_card::before { content:""; position:absolute; left:-30%; top:-40%; width:160%; height:140%; /* background: linear-gradient(135deg, rgba(255, 255, 255, 0.40), rgb(255 255 255 / 7%) 55%); */
 transform:rotate(8deg); pointer-events:none; }

/* 살짝 테두리 라이트 */
.dev_card::after { content:""; position:absolute; inset:0; border-radius:16px; border:1px solid rgba(255,255,255,0.20); pointer-events:none; }

/* 텍스트 가독성 */
.dev_card_category { color: #fff; }
.dev_card_title { font-size: 29px; line-height:1.25; font-weight: 900; letter-spacing:-0.02em; position:relative; z-index:1; background: #fff; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
/* dev_card_text 그라데이션 텍스트 느낌 */
.dev_card_text { font-size: 18px; line-height:1.45; margin-top:2px; position:relative; z-index:1; background: #fff; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }

/* 호버 효과(데스크탑) */
@media (hover:hover){
 .dev_card { }
 .dev_card:hover { }
}

/* 모바일 높이만 살짝 */
@media (max-width: 767px){
 .dev_card { height:200px; padding:16px; }
 .dev_card_title { font-size:16px; }
 .dev_card_text { font-size:12.5px; }
}


.dev_swiper_nav { position:absolute; right:0; top:-54px; display:flex; gap:8px; }
.dev_swiper_btn { width:34px; height:34px; border-radius:10px; border:1px solid rgba(0,0,0,0.12); background:#fff; cursor:pointer; position:relative; }
.dev_swiper_prev::before { content:""; position:absolute; inset:0; margin:auto; width:8px; height:8px; border-left:2px solid rgba(0,0,0,0.55); border-bottom:2px solid rgba(0,0,0,0.55); transform:rotate(45deg); }
.dev_swiper_next::before { content:""; position:absolute; inset:0; margin:auto; width:8px; height:8px; border-right:2px solid rgba(0,0,0,0.55); border-top:2px solid rgba(0,0,0,0.55); transform:rotate(45deg); }

.dev_swiper .swiper-pagination { position:relative; margin-top:14px; }
.dev_swiper .swiper-pagination-bullet { opacity:0.25; background:#fff; }
.dev_swiper .swiper-pagination-bullet-active { opacity:0.85; }

@media (max-width: 767px){
 .dev_swiper_section { padding:18px 0; }
 .dev_swiper_nav { display:none; }
 .dev_card { height:200px; padding:16px; }
 .dev_card_title { font-size:16px; }
 .dev_card_text { font-size:12.5px; }

 .portfolio_cta {
  padding: 40px 24px 100px;
 }
}

.welfare_example_swiper_wrap { width:100%; padding:30px 0; }
.welfare_example_swiper { width:100%; }
.welfare_example_swiper_slide { border-radius:14px; overflow:hidden; }
.welfare_example_swiper_img { width:100%; display:block; }


.portfolio_wrap { width: 100%; background: url(/resources/img/kmsol_bg.png); background-size: cover; }
.portfolio_container { max-width: 1600px; margin: 0 auto; padding: 160px 24px 200px; }

.portfolio_title { margin: 0 0 65px; text-align: center; font-size: 55px; font-weight: 500; letter-spacing: -0.02em; }
.portfolio_title_em {color: #1e76ff;font-weight: 700;font-size: 55px;}

.portfolio_grid { display: flex; align-items: center; justify-content: space-between; gap: 56px; }

.portfolio_left { width: 440px; flex: 0 0 440px; }
.portfolio_badge { display: inline-flex; align-items: baseline; gap: 2px; font-weight: 900; color: #03A9F4; font-size: 31px; margin: 0 0 14px; }
.portfolio_badge_small { font-weight: 800; font-size: 30px; vertical-align: super; }
.portfolio_name { margin: 0 0 10px; font-size: 36px; font-weight: 800; letter-spacing: -0.02em; }
.portfolio_desc { margin: 0; font-size: 19px; line-height: 1.5; color: #4b5563; }

.portfolio_divider { height: 1px; background: #e5e7eb; margin: 28px 0 14px; }

.portfolio_bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.portfolio_pager { display: flex; align-items: center; gap: 10px; }
.portfolio_btn { width: 34px; height: 34px; border-radius: 999px; border: 1px solid #0066ff; display: inline-flex; align-items: center; justify-content: center; color: #111; background: #fff; }
.portfolio_btn svg { width: 16px; height: 16px; }

.portfolio_count { font-size: 14px; color: #111; letter-spacing: -0.01em; }
.portfolio_count_now { color: #1e76ff; font-weight: 800; }
.portfolio_more { font-size: 20px; font-weight: 700; color: #374151; }
.portfolio_more:hover { text-decoration: underline; text-underline-offset: 3px; }

.portfolio_right { flex: 1; min-width: 0; }
.portfolio_phones { display: flex; align-items: flex-end; justify-content: flex-start; gap: 24px; }

.portfolio_phone_item { flex: 0 0 auto; }
.portfolio_phone_item.is_big { width: 324px; background: url(/resources/img/phone_border.png); padding: 7px 2px; background-size: cover; height: 645px; }
.portfolio_phone_item.is_small { position: relative; width: 324px; background: url(/resources/img/phone_border.png); padding: 7px 2px; background-size: cover; height: 645px; }

.portfolio_phone_media { width: 92%; border-radius: 34px; overflow: hidden; height: 635px; position: relative; left: 15px; top: 9px; background: #fff; z-index: 1; }
.portfolio_phone_item.is_small::before { position: absolute; content: ''; background: url('https://kmsol.kr/resources/img/kmsol_logo.png') no-repeat; background-size: contain; /* 이미지가 잘리지 않도록 추가 */width: 64px; height: 38px; /* 정렬 핵심 */left: 50%; transform: translateX(-50%); /* 가로만 중앙 정렬할 때 */ /* 위치 조정 (505% 대신 구체적인 px이나 % 사용 권장) */top: 44%; opacity: 0.2; z-index: 3; }
.portfolio_phone_img { width: 100%; display: block; }

.portfolio_mobile_video { width: 100%; }
.portfolio_mobile_video_el { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: 33px; }

@media (max-width: 1024px){
 .portfolio_container { padding: 44px 18px 64px; }
 .portfolio_grid { gap: 32px; }
 .portfolio_left { width: 320px; flex: 0 0 320px; }
 .portfolio_phone_item.is_big { width: 210px; }
 .portfolio_phone_item.is_small { width: 170px; }
 .portfolio_phones { gap: 18px; }
}

@media (max-width: 768px){
 .portfolio_title { font-size: 24px; margin: 0 0 26px; }
 .portfolio_grid { flex-direction: column; align-items: stretch; }
 .portfolio_left { width: 100%; flex: 1 1 auto; }
 .portfolio_right { width: 100%; }

 .portfolio_phones { gap: 14px; overflow-x: auto; padding: 10px 2px 18px; }
 .portfolio_phones::-webkit-scrollbar { height: 8px; }
 .portfolio_phones::-webkit-scrollbar-thumb { background: #e5e7eb; border-radius: 999px; }

 .portfolio_phone_img { display: none; }
 .portfolio_mobile_video { display: block; }
}
.welfare_logo_swiper { width:100%; overflow:hidden; }
.welfare_logo_swiper .swiper-wrapper { align-items:center; transition-timing-function:linear !important; padding:0 0 40px }
.welfare_logo_swiper .swiper-slide { width:auto !important; padding:0 22px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.welfare_logo_swiper .swiper-slide img { height:44px; max-width:140px; object-fit:contain; display:block; }
.welfare_logo_swiper .swiper-slide p { font-size:13px; line-height:1; margin:0; white-space:nowrap; display: none; }

.kmsol_header_wrap {
 width: 100%;
 background: transparent;
 border-bottom: 1px solid transparent;
 box-sizing: border-box;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 1000;
 transition:
         background-color 0.35s ease,
         border-color 0.35s ease,
         box-shadow 0.35s ease,
         backdrop-filter 0.35s ease;
 border-bottom: 1px solid #eee;
}

.kmsol_header_wrap > div {
 max-width: 1800px;
 margin: 0 auto;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 18px 24px;
 box-sizing: border-box;
 width: 100%;
 background: transparent;
 transition:
         padding 0.3s ease,
         background-color 0.35s ease;
}

/* 스크롤 상태 */
.kmsol_header_wrap.is-scrolled {
 background: rgba(0, 0, 0, 0.55) !important;
 border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
 backdrop-filter: blur(10px);
 -webkit-backdrop-filter: blur(10px);
 border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.kmsol_header_wrap.is-scrolled > div {
 padding: 14px 24px;
 background: transparent !important;
}

/* 로고 */
.kmsol_header_logo_wrap {
 margin: 0;
 padding: 0;
 display: flex;
 align-items: center;
}

.kmsol_header_logo_wrap a {
 display: flex;
 align-items: center;
}

.kmsol_header_logo_wrap img {
 display: block;
 height: 25px;
 width: auto;
}

/* 메뉴 */
.kmsol_header_menu_container {
 flex: 1;
 display: flex;
 justify-content: center;
}

.kmsol_header_top_menu {
 display: flex;
 align-items: center;
 gap: 14px;
 position: relative;
}

.kmsol_header_menu_list {
 list-style: none;
 margin: 0;
 padding: 0;
 display: flex;
 align-items: center;
 gap: 22px;
}

.kmsol_header_menu_list li {
 margin: 0;
 padding: 0;
}

.kmsol_header_menu_list a {
 font-size: 15px;
 font-weight: 500;
 color: #111;
 text-decoration: none;
 line-height: 1;
 white-space: nowrap;
 transition: color 0.25s ease;
}

.kmsol_header_menu_list a:hover {
 color: #0a58ff !important;
 font-weight: 700;
}

/* 스크롤 시 메뉴 글자 흰색 */
.kmsol_header_wrap.is-scrolled .kmsol_header_menu_list a {
 color: #fff !important;
}

.kmsol_header_wrap.is-scrolled .kmsol_header_menu_list a:hover {
 color: #8ec5ff !important;
}

/* CTA */
.kmsol_header_cta_wrap {
 display: flex;
 align-items: center;
}

.kmsol_header_cta_btn {
 position: relative;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 12px 23px;
 border-radius: 33px;

 color: #fff;
 font-size: 16px;
 font-weight: 600;
 text-decoration: none;
 line-height: 1;

 overflow: hidden;
 z-index: 1;
}

/* 기본 그라디언트 */
.kmsol_header_cta_btn::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(45deg, #3590cf, #8BC34A);
 z-index: -2;
}

/* 호버용 배경 */
.kmsol_header_cta_btn::after {
 content: "";
 position: absolute;
 inset: 0;
 background: #2f2f2f;
 opacity: 0;
 transition: opacity 0.35s ease;
 z-index: -1;
}

/* 호버 */
.kmsol_header_cta_btn:hover::after {
 opacity: 1;
}

/* 햄버거 */
.kmsol_header_menu_toggle_btn {
 display: none;
 width: 34px;
 height: 34px;
 cursor: pointer;
 flex-direction: column;
 justify-content: center;
 gap: 6px;
}

.kmsol_header_menu_toggle_btn span {
 display: block;
 width: 24px;
 height: 2px;
 background: #111;
 border-radius: 2px;
 margin: 0 auto;
}

.kmsol_header_wrap.is-scrolled .kmsol_header_menu_toggle_btn span {
 background: #fff !important;
}
/* ============================= */
/* 로고 전환 추가 */
/* ============================= */

/* 겹치기 */
.kmsol_header_logo_wrap a {
 position: relative;
}

/* 기본 로고 */
.logo-default {
 position: relative;
 z-index: 1;
 transition: opacity 0.3s ease;
}

/* 흰 로고 */
.logo-white {
 position: absolute;
 top: 0;
 left: 0;
 opacity: 0;
 transition: opacity 0.3s ease;
}

/* 스크롤 시 흰 로고 */
.kmsol_header_wrap.is-scrolled .logo-default {
 opacity: 0;
}

.kmsol_header_wrap.is-scrolled .logo-white {
 opacity: 1;
}
.ks_history_wrap {max-width: 1500px;margin: 0 auto;padding: 28px 16px 56px;display: flex;flex-wrap: wrap;gap: 10px;}
.ks_history_head { margin: 0 0 22px; }
.ks_history_title { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -0.3px; color: #111; }
.ks_history_desc { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: #666; }

.ks_history_group {margin: 18px 0 0;border-radius: 16px;border: 1px solid #e9e9e9;background: #fff;overflow: hidden;flex: 0 0 auto;width: 49%;}
.ks_history_group_head { display: flex; align-items: center; gap: 12px; padding: 16px 16px; background: #fafafa; border-bottom: 1px solid #eee; }
.ks_history_year {}
.ks_history_year_line { flex: 1; height: 1px; background: #e6e6e6; }

.ks_history_group_body { position: relative; padding: 14px 16px 16px; }
.ks_history_group_body::before {content: "";position: absolute;left: 42px;top: 14px;bottom: 16px;width: 2px;background: #efefef;border-radius: 2px;}

.ks_history_row { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 10px; padding: 10px 0; }
.ks_history_row::before {}
.ks_history_row + .ks_history_row { border-top: 1px dashed #efefef; }

.ks_history_month {margin: 0;font-size: 20px;font-weight: 800;color: #111;text-align: center;padding: 6px 0;background: #fff;border: 1px solid #eee;border-radius: 999px;/* opacity: 0; */}
.ks_history_month_empty { color: #9a9a9a; border-color: #f0f0f0; background: #fcfcfc; }

.ks_history_text {word-break: keep-all;}

@media (max-width: 480px) {
 .ks_history_title { font-size: 22px; }
 .ks_history_group_head { padding: 14px 14px; }
 .ks_history_group_body { padding: 12px 14px 14px; }
 .ks_history_group_body::before { left: 32px; }
 .ks_history_row { grid-template-columns: 52px 1fr; }
 .ks_history_month { font-size: 12px; }
 .ks_history_text { font-size: 13px; }
}

.ks_history_group{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.ks_history_group.is_show{opacity:1;transform:translateY(0);}

.ks_history_group_head{opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease;}
.ks_history_group.is_show .ks_history_group_head{opacity:1;transform:translateY(0);transition-delay:.05s;}

.ks_history_row{opacity:0;transform:translateY(12px);transition:opacity .55s ease,transform .55s ease;}
.ks_history_group.is_show .ks_history_row{opacity:1;transform:translateY(0);}

.ks_history_group.is_show .ks_history_row:nth-child(1){transition-delay:.10s;}
.ks_history_group.is_show .ks_history_row:nth-child(2){transition-delay:.18s;}
.ks_history_group.is_show .ks_history_row:nth-child(3){transition-delay:.26s;}
.ks_history_group.is_show .ks_history_row:nth-child(4){transition-delay:.34s;}
.ks_history_group.is_show .ks_history_row:nth-child(5){transition-delay:.42s;}
.ks_history_group.is_show .ks_history_row:nth-child(6){transition-delay:.50s;}
.ks_history_group.is_show .ks_history_row:nth-child(7){transition-delay:.58s;}
.ks_history_group.is_show .ks_history_row:nth-child(8){transition-delay:.66s;}

.solution_page_wrap { max-width: 1200px; margin: 0 auto; padding: 80px 20px; }
.solution_header { text-align: center; margin-bottom: 70px; }
.solution_title { font-size: 38px; font-weight: 800; letter-spacing: -0.6px; color: #111; }
.solution_sub_title { margin-top: 12px; font-size: 18px; color: #777; line-height: 1.6; }

.solution_content { display: flex; gap: 24px; align-items: stretch; }

.solution_main {flex: 1;padding: 44px 42px;border: 1px solid #eee;border-radius: 26px;background: #fff;box-shadow: 0 10px 30px rgba(0,0,0,0.05);display: flex;align-items: center;flex-direction: column;justify-content: center;}
.solution_main_title {font-size: 35px;font-weight: 800;letter-spacing: -0.4px;color: #111;text-align: center;}
.solution_main_desc {margin-top: 10px;font-size: 21px;color: #666;text-align: center;}

.solution_badge { display: inline-flex; align-items: center; margin-top: 18px; padding: 8px 14px; border-radius: 999px; font-size: 14px; font-weight: 700; color: #222; background: #f4f6ff; border: 1px solid #e6e9ff; }

.solution_mockup { margin-top: 28px; display: flex; gap: 16px; align-items: flex-end; }
.solution_mockup img { width: calc(50% - 8px); border-radius: 16px; border: 1px solid #f1f1f1; background: #fafafa; }
.solution_main_footer { margin-top: 28px; font-size: 22px; font-weight: 800; color: #111; letter-spacing: -0.3px; }
.solution_main_footer strong { color: #ff3b3b; }

.solution_cards { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.solution_card { padding: 26px 18px; border: 1px solid #eee; border-radius: 22px; background: #fff; text-align: center; box-shadow: 0 10px 24px rgba(0,0,0,0.04); transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; }
.solution_card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(0,0,0,0.08); border-color: #e2e2e2; }

.solution_card img { width: 52px; height: 52px; object-fit: contain; margin-bottom: 14px; }
.solution_card_desc { font-size: 14px; color: #666; line-height: 1.55; min-height: 44px; }
.solution_card_title { display: block; margin-top: 12px; font-size: 17px; font-weight: 800; letter-spacing: -0.3px; color: #111; }

@media (max-width: 1024px) {
 .solution_content { flex-direction: column; }
 .solution_cards { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
 .solution_page_wrap { padding: 120px 16px 56px; }
 .solution_title { font-size: 30px; }
 .solution_sub_title { font-size: 16px; }
 .solution_main { padding: 34px 22px; }
 .solution_cards { grid-template-columns: repeat(2, 1fr); }
 .solution_mockup { flex-direction: column; }
 .solution_mockup img { width: 100%; }
}

@media (max-width: 420px) {
 .solution_cards { grid-template-columns: 1fr; }
}

/* 샘플 사이트 */
.solution_sample_wrap { margin-top: 80px; padding: 60px 20px; border: 1px solid #eee; border-radius: 28px; background: #fff; }
.solution_sample_header { text-align: center; margin-bottom: 36px; }
.solution_sample_title {font-size: 38px;font-weight: 800;color: #111;}
.solution_sample_desc {margin-top: 10px;font-size: 18px;color: #777;}

.sample_site_list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; list-style: none; padding: 0; margin: 0; }
.sample_site_item { border: 1px solid #eee; border-radius: 22px; overflow: hidden; background: #fff; transition: transform .2s, box-shadow .2s; }
.sample_site_item:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(0,0,0,.08); }

.sample_site_thumbnail {height: 330px;background-size: cover;background-position: center;}
.sample_site_name {margin: 16px 16px 0;font-size: 22px;font-weight: 700;color: #111;text-align: center;}

.sample_site_buttons { display: flex; gap: 10px; padding: 14px 16px 20px; }
.sample_site_btn { flex: 1; height: 40px; border-radius: 12px; border: 1px solid #ddd; background: #f7f7f7; font-size: 14px; font-weight: 700; text-align: center; line-height: 40px; color: #111; text-decoration: none; }
.sample_site_btn.mobile { background: #fff2f2; border-color: #ffc6c6; color: #ff3b3b; }

@media (max-width: 1200px) { .sample_site_list { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .sample_site_list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .sample_site_list { grid-template-columns: 1fr; } }

.sample_site_image_1 { background-image: url("/resources/img/sample_1.jpg"); }
.sample_site_image_2 { background-image: url("/resources/img/sample_2.jpg"); }
.sample_site_image_3 { background-image: url("/resources/img/sample_3.jpg"); }
.sample_site_image_4 { background-image: url("/resources/img/sample_4.jpg"); }
.sample_site_image_5 { background-image: url("/resources/img/sample_5.jpg"); }
.sample_site_image_6 { background-image: url("/resources/img/sample_6.jpg"); }
.sample_site_image_7 { background-image: url("/resources/img/sample_7.jpg"); }
.sample_site_image_8 { background-image: url("/resources/img/sample_8.jpg"); }
.sample_site_image_9 { background-image: url("/resources/img/sample_9.jpg"); }
.sample_site_image_10 { background-image: url("/resources/img/sample_10.jpg"); }
.sample_site_image_11 { background-image: url("/resources/img/sample_11.jpg"); }
.sample_site_image_12 { background-image: url("/resources/img/sample_12.jpg"); }
.sample_site_image_13 { background-image: url("/resources/img/sample_13.jpg"); }

/* 찾아오시는 길 */
.page_container{max-width: 1200px;margin: 0 auto;padding: 100px 20px;}
.page_header{margin-bottom:18px;text-align: center;}
.page_title{margin:0;font-size: 38px;font-weight: 800;letter-spacing: -0.6px;color: #111;}
.page_sub_title{
 margin-top: 12px;
 font-size: 18px;
 color: #777;
 line-height: 1.6;
}
.page_content_grid{display:grid;grid-template-columns:1.4fr 0.6fr;gap:18px;margin-top:18px;}
.ui_card{background:#fff;border:1px solid rgba(16,17,18,0.08);border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(16,17,18,0.06);}
.ui_card_header{padding:18px 18px 14px;border-bottom:1px solid rgba(16,17,18,0.06);display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.ui_card_header_left{display:flex;flex-direction:column;gap:6px;}
.ui_card_title{margin:0;font-size:18px;font-weight:900;letter-spacing:-0.02em;}
.ui_card_sub_title{margin:0;font-size:13px;color:#606573;line-height:1.55;}
.ui_card_badge{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;background:#f2f4ff;border:1px solid rgba(74,92,255,0.14);color:#2a38c7;font-size:12px;font-weight:800;white-space:nowrap;}
.ui_card_body{padding:18px;}
.ui_divider{height:1px;background:rgba(16,17,18,0.06);margin:14px 0;}
.ui_icon{width:16px;height:16px;flex:0 0 16px;display:inline-block;}
.ui_button_row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.ui_button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 14px;border-radius:14px;border:1px solid rgba(16,17,18,0.12);background:#fff;font-size:13px;font-weight:900;letter-spacing:-0.01em;transition:transform .05s ease;}
.ui_button:active{transform:scale(0.99);}
.ui_button_primary{background:#101114;color:#fff;border-color:#101114;}
.ui_button_secondary{background:#f6f7fb;border-color:rgba(16,17,18,0.10);}
.ui_note_box{padding:14px 14px;border-radius:16px;background:#f6f7fb;border:1px dashed rgba(16,17,18,0.16);color:#4a4f5a;font-size: 17px;line-height:1.7;}
.map{padding:0;}
.map_header{padding:18px 18px 14px;border-bottom:1px solid rgba(16,17,18,0.06);display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.map_header_left{display:flex;flex-direction:column;gap:6px;}
.map_title{margin:0;font-size: 26px;font-weight:900;letter-spacing:-0.02em;}
.map_sub_title{margin:0;font-size: 18px;color:#606573;line-height:1.55;}
.map_header_badge{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;background:#f2f4ff;border:1px solid rgba(74,92,255,0.14);color:#2a38c7;font-size:12px;font-weight:800;white-space:nowrap;}
.map_content{padding:0;}
.map_embed_area{position:relative;width:100%;padding-top:56.25%;background:linear-gradient(180deg,#f4f6ff 0%,#f6f7fb 100%);}
.map_embed_iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.map_footer{padding:18px;border-top:1px solid rgba(16,17,18,0.06);}
.map_action_buttons{display:flex;gap:10px;flex-wrap:wrap;}
.map_action_button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 14px;border-radius:14px;border:1px solid rgba(16,17,18,0.12);background:#fff;font-size: 15px;font-weight:900;letter-spacing:-0.01em;transition:transform .05s ease;}
.map_action_button:active{transform:scale(0.99);}
.map_action_button_primary{background:#101114;color:#fff;border-color:#101114;}
.company_info{padding:0;}
.company_info_header{padding:18px 18px 14px;border-bottom:1px solid rgba(16,17,18,0.06);}
.company_info_title{margin:0;font-size:18px;font-weight:900;letter-spacing:-0.02em;}
.company_info_sub_title{margin:6px 0 0;font-size:13px;color:#606573;line-height:1.55;}
.company_info_body{padding:18px;}
.company_info_list{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.company_info_item{gap:10px;padding:12px 12px;border-radius:16px;border:1px solid rgba(16,17,18,0.07);background:#fff;display: flex;align-items: center;}
.company_info_item_icon{margin-top:2px;}
.company_info_item_label{min-width:86px;font-size: 14px;color:#6a7080;font-weight:900;letter-spacing:-0.01em;}
.company_info_item_value{font-size:14px;color:#101114;line-height:1.6;word-break:keep-all;}
.company_info_compact_text{margin:0;font-size:13px;line-height:1.8;color:#4a4f5a;}
.company_info_compact_text strong{color:#101114;}
@media (max-width:980px){.page_content_grid{grid-template-columns:1fr;}}
@media (max-width:520px){.page_title{font-size:24px;}.ui_card_header,.map_header,.company_info_header{padding:16px;}.ui_card_body,.map_footer,.company_info_body{padding:16px;}.company_info_item_label{min-width:76px;}}

/*모바일 버전 인덱스*/
@media (max-width: 992px){
 #header { display:flex; position: fixed; top: 12px; left: 12px; right: 12px; transform: none;
  height: 56px; padding: 0 16px; width: auto; max-width: none;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-radius: 18px; z-index: 3000; }

 /* 로고 */
 .kmsol_logo_wrap { width:auto; display:flex; align-items:center; }
 .kmsol_header_logo_wrap img {height: 22px;}
 .kmsol_header_wrap>div {padding: 18px 0px}
 /* 기존 메뉴 숨김 */
 #top_menu_toggle,
 .kmsol_header_cta_wrap { display:none !important; }
 .mobile-menu-wrap { display:block; }
 .mobile-hamburger {
  position: fixed;
  top: 28px;
  right: 28px;
  z-index: 5000;
  width: 30px;
  height: 24px;
  background: transparent;
  border: 0;
  padding: 0;
 }

 .mobile-hamburger span {
  position: absolute;   /* ✅ 겹치게 */
  left: 0;
  width: 100%;
  height: 2px;
  background: #000;
  border-radius: 2px;
  transition: all .35s ease;
  transform-origin: center;
 }
 .mobile-hamburger span:nth-child(1) {
  top: 0;
 }

 .mobile-hamburger span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
 }

 .mobile-hamburger span:nth-child(3) {
  bottom: 0;
 }
 .mobile-menu-open .mobile-hamburger span:nth-child(1) {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
 }

 .mobile-menu-open .mobile-hamburger span:nth-child(2) {
  opacity: 0;
 }

 .mobile-menu-open .mobile-hamburger span:nth-child(3) {
  bottom: auto;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
 }

 .mobile-menu-overlay { position:fixed; inset:0; background:rgba(10,15,20,0.6); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:.4s ease; z-index: 4000; }
 .mobile-menu-open .mobile-menu-overlay { opacity: 1; visibility: visible; pointer-events: auto; }
 .mobile-menu-links { display:flex; flex-direction:column; gap:34px; text-align:center; }
 .mobile-menu-links a { color:#fff; font-size:26px; font-weight:600; text-decoration:none; letter-spacing:.02em; }
 .mobile-menu-links .mobile-cta { margin-top:20px; padding:14px 34px; border-radius:999px; background:linear-gradient(90deg,#7b6cff,#5a49e5); box-shadow:0 10px 30px rgba(123,108,255,.6); font-size:18px; }
 .main_section_content{min-height: 42vh;grid-template-columns:1fr;padding:120px 20px 80px;gap:10px;}
 .main_section1_wrap .hero-left h1{font-size:32px;line-height:1.25;text-align:center;}
 .main_section1_wrap .hero-left p{font-size:16px;line-height:1.7;text-align:center;margin-top:18px;}
 .hero-btn{display:flex;width:fit-content;margin: 21px auto 0;font-size:16px;padding:14px 28px;}
 .hero-right{width:100%;margin:24px auto 0;justify-content:center;}
 .hero-glass-visual{width:100%;max-width:360px;height:360px;margin:0 auto;}
 .glass-panel{border-radius:16px;backdrop-filter:blur(14px);}
 .main-panel{position:relative;}
 .status-panel,.org-panel{display:none;}
 .panel-head strong{font-size:14px;}
 .panel-head span{font-size:11px;padding:3px 7px;}
 .panel-grid{gap:10px;padding:14px;}
 .metric{padding:12px;}
 .metric .label{font-size:11px;}
 .metric .value{font-size:15px;}
 .metric .sub{font-size:11px;}
 .org-tree{padding:14px 0;}
 .org-tree .branch{gap:14px;}
 .abstract-ring{display:none;}
 .abstract-grid{opacity:0.25;width:200px;height:140px;left:10px;}
 .abstract-circle{width:220px;height:220px;right:-40px;top:-20px;}
 .hero-dots{bottom:-26px;}
 .dot-btn{width:8px;height:8px;}

 /*섹션2*/
 .section2_wrap{padding:96px 0 110px;}
 .section2_inner{padding:0 20px;}
 .section2_title{max-width:100%;margin-bottom:48px;text-align:center;}
 .ks_about_kicker{font-size:14px;margin-bottom:12px;}
 .section2_title h2{font-size:32px;line-height:1.35;}
 .section2_cards{grid-template-columns:1fr;gap:24px;}
 .section2_card{padding:32px 24px;border-radius:22px;}
 .card_icon{width:54px;height:54px;margin-bottom:18px;}
 .section2_card h3{font-size:20px;margin-bottom:10px;}
 .section2_card p{font-size:16px;line-height:1.6;}
 .section2_card:hover{transform:none;}

 /*카테고리탭*/

 .main_section3_wrap { padding: 120px 0; }
 .main_section3 { padding: 0 20px; }
 .main_section3 .section3_panel { border-radius: 24px; height: 1600px; }
 .main_section3 .section3_panel .panel_bg { object-fit: cover; height: 100%; }
 .main_section3 .section3_content { position: absolute; padding: 60px 24px 80px; }
 .main_section3 .section3_title { margin-bottom: 60px; text-align: center; }
 .main_section3 .section3_title h2 { font-size: 32px; line-height: 1.3; }
 .main_section3 .section3_title h2 br { display: none; }
 .main_section3 .section3_cards { flex-direction: column; gap: 48px; }
 .main_section3 .section3_item { text-align: center; }
 .main_section3 .section3_item img { max-width: 90%; margin: 0 auto 24px; }
 .main_section3 .section3_item h3 { font-size: 20px; line-height: 1.4; }
 .main_section3 .section3_item p { font-size: 15px; line-height: 1.7; word-break: keep-all; }
 .main_section3 .section3_item p br { display: none; }

 .main_section4_wrap{padding:100px 0 120px;}
 .main_section4{grid-template-columns:1fr;gap:48px;padding:0 20px;}
 .main_section4 .section4_left h2{font-size:32px;line-height:1.25;margin-bottom:16px;}
 .main_section4 .section4_desc{font-size:16px;font-weight:500;line-height:1.6;margin-bottom:24px;}
 .main_section4 .section4_list li{font-size:15px;padding-left:20px;}
 .main_section4 .section4_btn{font-size:16px;padding:14px 22px;}
 .section4_mockup{height:360px;display:flex;justify-content:center;}
 .section4_mockup img{width:200px;border-radius:22px;transition:none;}
 .section4_mockup .mockup_1{transform:none;}
 .section4_mockup .mockup_2{transform:none; left: 155px;}
 .section4_mockup img:hover {transform: none;}
 .main_section5_wrap { padding: 100px 0 80px; }

 .welfare_section{padding:100px 0 120px;}
 .welfare_inner{grid-template-columns:1fr;gap:40px;padding:0 20px;}
 .welfare_text{position:static;top:auto;}
 .welfare_text h2{font-size:32px;line-height:1.25;}
 .welfare_subtitle{font-size:18px;margin-bottom:18px;}
 .welfare_desc{font-size:15px;line-height:1.6;margin-bottom:18px;}
 .welfare_list li{font-size:15px;padding-left:20px;}
 .welfare_btn{font-size:16px;padding:12px 22px;}

 .welfare_cards{grid-template-columns:1fr;justify-content:center;gap:18px;}
 .welfare_card{width:100%;height:auto;transition:none;transform:none;}
 .welfare_card:hover{transform:none;box-shadow:0 14px 34px rgba(0,0,0,0.07);}
 .welfare_card:nth-child(odd){transform:none;}
 .welfare_card:nth-child(even){transform:none;margin-top:0;}
 .welfare_card img{height:160px;}
 .welfare_card h3{font-size:18px;}
 .welfare_card p{font-size:15px;}

 .main_section5 { padding: 0 24px; }
 .section5_title {margin-bottom: 48px;text-align: center;}
 .section5_title h2 { font-size: 32px; line-height: 1.3; }
 .section5_title br { display: none; }
 .section5_cards { flex-direction: column; gap: 20px; }
 .section5_card { padding: 22px 24px; }
 .section5_card .num { font-size: 36px; margin-bottom: 6px; }
 .section5_card h3 { font-size: 18px; margin-bottom: 8px; }
 .section5_card p { font-size: 14px; line-height: 1.6; }
 .section5_card p br { display: none; }



 .main_section6_wrap { padding: 80px 0 120px; }
 .main_section6 { padding: 0 24px; }
 .section6_title h2 { font-size: 32px; line-height: 1.3; }
 .section6_flow { flex-direction: column; margin-top: 60px; gap: 36px; }
 .flow_line { width: 2px; height: 36px; border-top: none; border-left: 2px dashed rgba(90,220,200,0.35); margin: 0 auto; }
 .flow_item { width: 100%; max-width: 280px; margin: 0 auto; }
 .flow_circle { width: 96px; height: 96px; margin-bottom: 45px; border: unset; }
 .flow_item h3 { font-size: 18px; margin-bottom: 6px; }
 .flow_item p { font-size: 14px; line-height: 1.6; }
 .flow_item p br { display: none; }

 .portfolio_container{padding:48px 16px 64px;}
 .portfolio_title{font-size:32px;line-height:1.3;margin-bottom:24px;text-align:center;}
 .portfolio_title_em{font-size:32px; display: block; text-align: center}
 .portfolio_grid{flex-direction:column;gap:24px;}
 .portfolio_left{width:100%; display: flex; flex-direction: column; align-items: center}
 .portfolio_badge{font-size:18px;margin-bottom:6px;}
 .portfolio_badge_small{font-size:16px;}
 .portfolio_name{font-size:22px;margin-bottom:8px;}
 .portfolio_desc{font-size:15px;line-height:1.6;}
 .portfolio_divider{margin:18px 0 12px;}
 .portfolio_bottom{flex-direction:column;align-items:flex-start;gap:12px;}
 .portfolio_more{font-size: 16px;display: inline-block;background: #1e76ff;padding: 13px 20px;color: #fff;}
 .portfolio_right{width:100%;}
 .portfolio_phone_item.is_big{display:none !important;}
 .portfolio_mobile_video,
 .portfolio_mobile_video_el{display:none !important;}
 .portfolio_phones{display:flex;justify-content:center;gap:5px;overflow:hidden;/* padding:8px 0 0; */}
 .portfolio_phone_item.is_small{width: 157px;height: 314px;}
 .portfolio_phone_media{width:90%;height: 90%;left: 8px;top: 20px;border-radius: 12px;}
 .portfolio_phone_img{display:block;width:100%;}
 .portfolio_phone_item.is_small::before{display:none;}



 .main_section7_wrap { padding: 100px 0 120px; }
 .main_section7 { padding: 0 24px; }
 .section7_cards { flex-direction: column; gap: 20px; }
 .section7_card { padding: 28px 22px; }
 .section7_card p { font-size: 15px; line-height: 1.6; }
 .section7_card p br { display: none; }

 .main_section8_wrap { padding: 120px 0 140px; }

 .main_section8 { flex-direction: column; gap: 48px; padding: 0 24px; text-align: center; }

 /* 왼쪽 텍스트 */
 .section8_left h2 { font-size: 32px; line-height: 1.3; margin: 16px 0; }

 .section8_left p { font-size: 15px; line-height: 1.7; }

 .section8_left p br,
 .section8_left h2 br { display: none; }

 /* 👉 프레임 이미지 제거 */
 .form_frame { display: none; }

 /* 👉 카드 자체를 글래스 UI로 */
 .section8_form_img { max-width: 100%; width: 100%; }

 .kmsol-form { position: static; inset: auto; width: 100%;
  background: rgba(30,35,40,0.7); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.12); border-radius: 24px; padding: 28px 24px 32px; box-sizing: border-box; box-shadow: 0 30px 80px rgba(0,0,0,.6); }

 .kmsol-fields { padding-right: 0; gap: 16px; }

 .kmsol-form label { font-size: 13px; text-align: left; }

 .kmsol-form input,
 .kmsol-form select { height: 44px; font-size: 15px; border-radius: 10px; }

 .kmsol-submit { margin-top: 24px; height: 52px; font-size: 17px; border-radius: 999px; }

 .welfare_section { padding:100px 0 120px; }

 /* 전체 레이아웃 → 세로 */
 .welfare_inner { grid-template-columns: 1fr; gap:60px; padding:0 24px; }

 /* 텍스트 영역 */
 .welfare_text { text-align:left; }

 .welfare_text h2 { font-size:34px; line-height:1.3; margin-bottom:18px; }

 .welfare_text p { font-size:16px; line-height:1.7; }

 /* 카드 영역 → 1열 */
 .welfare_cards { grid-template-columns: 1fr; gap:24px; }

 /* 카드 */
 .welfare_card { border-radius:16px; }

 .welfare_card img { height:150px; }

 .welfare_card h3 { padding:18px 20px 22px; font-size:16px; line-height:1.45; }

 /* hover 과한 효과 방지 (모바일) */
 .welfare_card:hover { transform:none; box-shadow:
         0 0 40px rgba(124,243,255,0.2),
         inset 0 0 0 1px rgba(124,243,255,0.3); }


}


/*카테고리*/
:root{--svc-max:1200px;--svc-pad:24px;--svc-ink:#0f172a;--svc-sub:#475569;--svc-line:rgba(15,23,42,.10);--svc-soft:rgba(15,23,42,.06);--svc-accent:#2563eb;}
.svc_page{color:var(--svc-ink);background:#fff;}
.svc_container{
 max-width: var(--svc-max);
 margin: 0 auto;
 padding: 0 var(--svc-pad);
 opacity: 0;
 transform: translateY(32px);
 animation: svcFadeUp 0.9s cubic-bezier(.22, 1, .36, 1) forwards;
}

@keyframes svcFadeUp {
 from {
  opacity: 0;
  transform: translateY(40px);
 }
 to {
  opacity: 1;
  transform: translateY(0);
 }
}
.svc_section{
 padding: 100px 0;
}

.svc_section_alt{
 background:
         linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.svc_section_head{
 display: flex;
 flex-direction: column;
 gap: 12px;
 margin-bottom: 36px;
}

.svc_h2{
 font-size: 36px;
 line-height: 1.2;
 letter-spacing: -0.03em;
 margin: 0;
 font-weight: 700;
 color: var(--svc-ink);
}

.svc_h3{
 font-size: 21px;
 line-height: 1.35;
 margin: 0 0 10px;
 font-weight: 700;
 letter-spacing: -0.025em;
 color: var(--svc-ink);
}

.svc_p{
 margin: 0;
 color: var(--svc-sub);
 font-size: 18px;
 line-height: 1.8;
}

.svc_p2{
 margin: 0;
 color: var(--svc-sub);
 font-size: 16px;
 line-height: 1.75;
}
.svc_badge {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 padding: 11px 18px;
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.12);
}
.svc_btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 18px;border-radius:12px;text-decoration:none;border:1px solid transparent;transition:.18s ease;white-space:nowrap;}
.svc_btn_primary{background:var(--svc-accent);color:#fff;box-shadow:0 10px 24px rgba(37,99,235,.20);}
.svc_btn_primary:hover{transform:translateY(-1px);box-shadow:0 14px 34px rgba(37,99,235,.28);}
.svc_btn_ghost{background: #fff;color: #475569;border-color: rgb(255 255 255);}

.svc_hero{position:relative;padding: 200px 0px 150px 0px;color:#fff;background: linear-gradient(rgb(6 19 55 / 95%), rgb(0 0 0 / 13%)), url(/resources/img/hero_network.jpg) center / cover no-repeat;}
.svc_hero_grid{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;}
.svc_title{margin: 21px 0 31px;font-size:48px;line-height:1.12;letter-spacing:-.03em;font-weight: 700;}
.svc_desc{margin:0;color:#fff;font-size:20px;line-height:1.8;max-width:560px;letter-spacing: -0.02em;font-weight: 500;}
.svc_cta_row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;}
.svc_points{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;list-style:none;padding:0;margin: 37px 0 0;}
.svc_points li{border:1px solid var(--svc-line);background:#fff;border-radius: 14px;padding: 15px 25px;display:flex;flex-direction:column;gap:6px;display: none;}
.svc_points b{font-size: 16px;font-weight: 560;color: #000}
.svc_points span{font-size: 15px;color:var(--svc-sub);}

/* 카드 그리드 (배경 제거) */
.svc_card_grid{
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 20px;
}

/* 카드 */
/* 카드 */
.svc_card{
 padding: 28px 22px;
 border-radius: 20px;

 background: #ffffff;
 border: 1px solid rgba(0,0,0,0.06);

 box-shadow: 0 6px 18px rgba(0,0,0,0.04);

 transition: all .3s cubic-bezier(.22, .61, .36, 1);
 position: relative;
 overflow: hidden;
}

/* 🔥 상단 1px 그라디언트 라인 */
.svc_card::before{
 content:"";
 position:absolute;
 top:0;
 left:24px;
 right:24px;
 height: 2px;
 background: linear-gradient(
         90deg,
         rgba(0,113,227,0) 0%,
         rgba(0,113,227,0.65) 50%,
         rgba(0,113,227,0) 100%
 );
 opacity:0;
 transform: translateY(-2px) scaleX(0.7);
 transform-origin: center;
 transition:
         opacity .35s ease,
         transform .35s cubic-bezier(.22, .61, .36, 1);
}

/* hover */
.svc_card:hover{
 transform: translateY(-6px);
 box-shadow: 0 18px 40px rgba(0,0,0,0.10);
}

/* 🔥 라인 부드럽게 등장 */
.svc_card:hover::before{
 opacity:1;
 transform: translateY(0) scaleX(1);
}

/* 아이콘 영역 */
.svc_icon{
 width: 36px;
 height: 36px;
 border-radius: 10px;

 display: flex;
 align-items: center;
 justify-content: center;

 margin-bottom: 14px;

 background: #f5f5f7;
}

/* 아이콘 SVG */
.svc_icon svg{
 width: 18px;
 height: 18px;
 stroke: #1d1d1f;
}

/* 제목 */
.svc_card h3{
 margin: 0 0 8px;
 font-size: 17px;
 font-weight: 700;
 letter-spacing: -0.02em;
 color: #1d1d1f;
}

/* 설명 */
.svc_card p{
 margin: 0;
 font-size: 14px;
 line-height: 1.6;
 color: #6e6e73;
}

/* 반응형 */
@media(max-width: 1024px){
 .svc_card_grid{
  grid-template-columns: repeat(2, 1fr);
 }
}

@media(max-width: 640px){
 .svc_card_grid{
  grid-template-columns: 1fr;
 }
}

.svc_scope_grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:14px;
}

.svc_scope{
 border:1px solid var(--svc-line);
 background:#fff;
 border-radius:16px;
 padding:20px;

 transition: all .28s cubic-bezier(.22, .61, .36, 1);
 position: relative;
 overflow: hidden;
}

/* 🔥 1px 그라디언트 라인 */
.svc_scope::before{
 content:"";
 position:absolute;
 top:0;
 left:20px;
 right:20px;
 height: 2px;
 background: linear-gradient(
         90deg,
         rgba(0,113,227,0) 0%,
         rgba(0,113,227,0.6) 50%,
         rgba(0,113,227,0) 100%
 );
 opacity:0;
 transform: translateY(-2px) scaleX(0.7);
 transform-origin: center;
 transition:
         opacity .35s ease,
         transform .35s cubic-bezier(.22, .61, .36, 1);
}

/* hover */
.svc_scope:hover{
 transform: translateY(-5px);
 box-shadow: 0 14px 30px rgba(0,0,0,0.08);
 border-color: rgba(0,0,0,0.12);
}

/* 🔥 라인 부드럽게 등장 */
.svc_scope:hover::before{
 opacity:1;
 transform: translateY(0) scaleX(1);
}

/* 리스트 */
.svc_list{
 margin:10px 0 0;
 padding-left:18px;
 color:var(--svc-sub);
 font-size:16px;
 line-height:1.7;
}

.svc_capture_grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:14px;
}

.svc_capture_box{
 position:relative;
 border:1px solid var(--svc-line);
 border-radius:16px;
 background:#fff;
 overflow:hidden;
 transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.svc_capture_box:hover{
 transform: translateY(-8px);
 box-shadow: 0 18px 40px rgba(15,23,42,.12);
 border-color: rgba(15,23,42,.12);
}
.svc_cap_caption{
 padding:12px 14px;
 border-top:1px solid var(--svc-line);
 font-weight:900;
 font-size:14px;
}
.svc_hero_capture{position:relative;border:1px solid var(--svc-line);border-radius:18px;background:#fff;overflow:hidden;min-height: 0px;box-shadow:0 18px 60px rgba(15,23,42,.12);}
.svc_capture_img{
 width:100%;
 height:100%;
 display:block;
 object-fit:cover;
 max-height:430px;
 object-position:top;
 border-radius:22px;
}
.svc_h2{
 display:flex;
 align-items:center;
 gap:12px;
}

.svc_dot{
 width:12px;
 height:12px;
 border-radius:50%;
 background:#60a5fa; /* 하늘색 */
 box-shadow:0 0 0 rgba(96,165,250,.6);
 animation: svcDotPulse 1s infinite;
}
.svc_thumb {
 width: 100%;
 border-radius: 20px;
 overflow: hidden;
 margin-bottom: 18px;
 background: #f6f7fb;
 aspect-ratio: 16 / 9;
}

.svc_thumb img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}
/* 은은한 퍼지는 효과 */
@keyframes svcDotPulse{
 0%{
  transform:scale(1);
  box-shadow:0 0 0 0 rgba(96,165,250,.5);
 }
 70%{
  transform:scale(1.1);
  box-shadow:0 0 0 10px rgba(96,165,250,0);
 }
 100%{
  transform:scale(1);
  box-shadow:0 0 0 0 rgba(96,165,250,0);
 }
}
.svc_hero_capture .svc_capture_img{width: 100%;height:100%;display:block;object-fit: cover;max-height: 430px;background:#fff;object-position: top;}
/* ✅ 이미지 src가 비었을 때 img는 숨기고 placeholder 보여주기 */
.svc_capture_img:not([src]), .svc_capture_img[src=""]{display:none;}
.svc_capture_empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:260px;background:repeating-linear-gradient(45deg, rgba(15,23,42,.03) 0px, rgba(15,23,42,.03) 10px, rgba(15,23,42,.06) 10px, rgba(15,23,42,.06) 20px);}
.svc_hero_capture .svc_capture_empty{min-height:320px;}
.svc_capture_empty_title{font-weight:900;color:rgba(15,23,42,.70);}
.svc_capture_empty_desc{font-size:13px;color:rgba(15,23,42,.45);}

.svc_cta{padding:72px 0;background:linear-gradient(180deg,#0b1b2b 0%, #071521 100%);color:#fff;}
.svc_cta_box{border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:26px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.06);backdrop-filter:blur(10px);}
.svc_cta .svc_h2{color:#fff;font-size:30px;}
.svc_cta .svc_p{color:rgba(255,255,255,.78);}
.svc_cta_btns{display:flex;gap:12px;flex-wrap:wrap;}
.svc_cta .svc_btn_ghost{color:#fff;border-color:rgba(255,255,255,.22);}
.svc_cta .svc_btn_ghost:hover{background:rgba(255,255,255,.08);}

:root{
 --svc-max: 1200px;
 --svc-pad: 24px;

 --svc-ink: #111827;
 --svc-sub: #6b7280;

 --svc-line: rgba(15, 23, 42, 0.08);
 --svc-soft: rgba(15, 23, 42, 0.04);

 --svc-accent: #1d4ed8;
 --svc-accent-dark: #163a8a;

 --svc-card-bg: rgba(255,255,255,0.88);
 --svc-shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.06);
 --svc-shadow-md: 0 18px 45px rgba(15, 23, 42, 0.10);
 --svc-shadow-lg: 0 28px 60px rgba(15, 23, 42, 0.14);

 --svc-radius-sm: 16px;
 --svc-radius-md: 20px;
 --svc-radius-lg: 24px;

 --svc-transition: all .35s ease;
}

/* ✅ 반응형 */
@media (max-width:1100px){.svc_hero_grid{grid-template-columns:1fr;}.svc_card_grid{grid-template-columns:repeat(2,1fr);}.svc_scope_grid{grid-template-columns:1fr;}.svc_capture_grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){:root{--svc-pad:16px;}.svc_hero{padding:72px 0 52px;}.svc_title{font-size:34px;}.svc_h2{font-size:26px;}.svc_points{grid-template-columns:1fr;}.svc_card_grid{grid-template-columns:1fr;}.svc_capture_grid{grid-template-columns:1fr;}.svc_cta_box{flex-direction:column;align-items:flex-start;}}

.svc_hero_capture .svc_capture_img {
 display: block;
 object-fit: cover;
 max-height: 430px;
 background: #fff;
 object-position: top;
}

.svc_capture_box {
 position: relative;
 overflow: visible;
}

.svc_capture_img {
 position: relative;
 height: 430px;
}
/* ===== Image Modal ===== */
.image_modal {
 position: fixed;
 inset: 0;
 display: none;
 z-index: 9999;
}

.image_modal.active {
 display: block;
}

.modal_overlay {
 position: absolute;
 inset: 0;
 background: rgba(0,0,0,0.75);
 backdrop-filter: blur(4px);
}

.modal_content {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 max-width: 90%;
 max-height: 90%;
}

.modal_content img {
 width: 100%;
 height: auto;
 border-radius: 12px;
 box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}

.modal_close {
 position: absolute;
 top: -40px;
 right: 0;
 background: #fff;
 border: none;
 width: 36px;
 height: 36px;
 border-radius: 50%;
 font-size: 27px;
 cursor: pointer;
}

.zoomable {cursor: pointer}


.svc_kicker{margin:14px 0 0;font-size:15px;line-height:1.6;color:rgba(255,255,255,.9);}
.svc_kicker b{font-weight:800;color:#fff;}
.svc_assets_grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:start;margin-top:22px;}
.svc_assets_cards{display:flex;flex-direction:column;gap:12px; height: 100%; justify-content: space-between}
.svc_asset_card{display:flex;gap:12px;padding:24px 16px;border:1px solid #e9eef6;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(15,23,42,.04);}
.svc_asset_icon{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,rgba(56,124,227,.12),rgba(56,124,227,.04));display:flex;align-items:center;justify-content:center;font-size:28px;flex:0 0 46px;}
.svc_asset_txt .svc_h3{margin:0 0 6px; font-size: 24px;}
.svc_asset_txt .svc_p2{margin:0;color:#55657a;}
.svc_asset_note{padding:14px 16px;border-radius:16px;background:#f6f9ff;border:1px dashed #cfe0ff;}
.svc_asset_badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#387ce3;color:#fff;font-size:15px;font-weight:700;margin-bottom:8px;}
.svc_assets_shots{display:flex;flex-direction:column;gap:12px;}
.svc_shot_main,.svc_shot{border-radius:18px;overflow:hidden;border:1px solid #e9eef6;background:#fff;}
.svc_shot_main img,.svc_shot img{width:100%;height:auto;display:block;}
.svc_shot_cap{padding:10px 12px;font-size:15px;color:#6b7b91;background:#fff;border-top:1px solid #eef2f7;}
.svc_shot_row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media (max-width:1024px){.svc_assets_grid{grid-template-columns:1fr;}.svc_shot_row{grid-template-columns:1fr;}}

/* ===== WHY VISUAL STYLE ===== */

.svc_why_visual .why_item{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:80px;
 align-items:center;
 padding:100px 0;
 border-bottom:1px solid rgba(15,23,42,.06);
}

.svc_why_visual .why_item:last-child{
 border-bottom:none;
}

.why_text{
 max-width:520px;
}

.why_no{
 font-size:64px;
 font-weight:800;
 color:rgba(15,23,42,.07);
 margin-bottom:20px;
}

.why_text h3{
 font-size:30px;
 margin-bottom:16px;
 font-weight:700;
 letter-spacing:-0.02em;
}

.why_text p{
 font-size:20px;
 line-height:1.8;
 color:#5b6b82;
}

.why_media img{
 width:100%;
 border-radius:18px;
 display:block;
}

/* 모바일 */
@media(max-width:900px){
 .svc_why_visual .why_item{
  grid-template-columns:1fr;
  gap:40px;
  padding:70px 0;
 }

 .why_no{
  font-size:42px;
 }
}

/* ===== SCOPE REDESIGN ===== */

.svc_scope_redesign .scope_rows{
 margin-top:60px;
 display:flex;
 flex-direction:column;
 gap:50px;
}

.scope_row{
 display:grid;
 grid-template-columns:60px 1fr;
 gap:24px;
 align-items:start;
 padding-bottom:40px;
 border-bottom:1px solid rgba(15,23,42,.06);
}

.scope_row:last-child{
 border-bottom:none;
}

.scope_icon{
 width:48px;
 height:48px;
 border-radius:50%;
 background:#2563eb;
 color:#fff;
 display:flex;
 align-items:center;
 justify-content:center;
 font-weight:700;
 font-size: 30px;
}

.scope_text h3{
 font-size:26px;
 margin-bottom:12px;
 font-weight:700;
}

.scope_text p{
 font-size:17px;
 line-height:1.8;
 color:#5b6b82;
 max-width:620px;
}

@media(max-width:900px){
 .scope_row{
  grid-template-columns:1fr;
  gap:16px;
 }
}


/*메인 운영중인 구조 3-4*/
.svc_impact_landing{background:radial-gradient(1200px 600px at 15% 10%,rgba(37,99,235,.28),transparent 60%),radial-gradient(900px 520px at 85% 30%,rgba(96,165,250,.18),transparent 55%),linear-gradient(180deg,#0b1220 0%,#070f1a 100%);color:#fff;padding:110px 0;position:relative;overflow:hidden;}
.svc_impact_head{text-align:center;max-width:920px;margin:0 auto 56px;display:flex;flex-direction:column;gap:14px;}
.svc_impact_kicker{margin:0 auto;width:max-content;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-weight:800;letter-spacing:-.02em;font-size:14px;color:rgba(255,255,255,.86);}
.svc_impact_title{margin:0;font-size:56px;line-height:1.15;letter-spacing:-.03em;}
.svc_impact_title span{color:#60a5fa;}
.svc_impact_desc{margin:0;color:rgba(255,255,255,.78);font-size:18px;line-height:1.75;}
.svc_impact_desc b{color:#fff;font-weight:800;}

.svc_compare_wrap{display:grid;grid-template-columns:1fr 100px 1fr;gap:22px;align-items:stretch;max-width:1050px;margin:0 auto;}
.svc_compare_col{border-radius:24px;padding:34px 34px 28px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);backdrop-filter:blur(10px);box-shadow:0 18px 70px rgba(0,0,0,.35);position:relative;overflow:hidden;}
.svc_compare_col:before{content:"";position:absolute;inset:-2px;opacity:.6;pointer-events:none;background:radial-gradient(600px 240px at 20% 10%,rgba(255,255,255,.10),transparent 55%);}
.svc_compare_left{opacity:.65;transform:translateY(6px);}
.svc_compare_right{background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 55%,#1d4ed8 100%);border-color:rgba(255,255,255,.18);box-shadow:0 22px 90px rgba(37,99,235,.34);}

.svc_compare_top{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
.svc_compare_icon{width:52px;height:52px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);}
.svc_compare_icon.is-accent{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);}
.svc_compare_title{margin:0;font-size:24px;letter-spacing:-.02em;}
.svc_compare_sub{margin:0;color:rgba(255,255,255,.78);font-size:16px;line-height:1.5;}

.svc_compare_list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;font-size:20px;line-height:1.55;color:rgba(255,255,255,.84);}
.svc_compare_list li{display:flex;gap:10px;align-items:flex-start;}
.svc_bullet{opacity:.9;margin-top:1px;}
.svc_compare_list.is-strong{color:#fff;}
.svc_check{width:20px;height:20px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25);flex:0 0 20px;margin-top:2px;font-size:13px;}

.svc_compare_bottom{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;}
.svc_pill{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);font-size:13px;font-weight:800;color:#fff;}

.svc_vs{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;position:relative;}
.svc_vs_badge{font-size: 42px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-weight:1000;letter-spacing:-.02em;}
.svc_vs_line{width:1px;flex:1;background:linear-gradient(180deg,rgba(255,255,255,.00),rgba(255,255,255,.22),rgba(255,255,255,.00));}

@media(max-width:1024px){.svc_impact_title{font-size:38px;}.svc_compare_wrap{grid-template-columns:1fr;gap:14px;}.svc_vs{order:2;flex-direction:row;}.svc_vs_line{height:1px;width:100%;}}
@media(max-width:600px){.svc_impact_landing{padding:80px 0;}.svc_impact_title{font-size:30px;}.svc_compare_col{padding:22px;}.svc_compare_list{font-size:15px;}}
@media(max-width:1024px){

 .svc_compare_wrap{
  grid-template-columns:1fr;
  gap:20px;
 }

 .svc_compare_left{order:1;}
 .svc_vs{order:2;}
 .svc_compare_right{order:3;}

}
@media(max-width:1024px){

 .svc_vs{
  flex-direction:row;
  gap:14px;
 }

 .svc_vs_badge{
  font-size:28px;
 }

 .svc_vs_line{
  height:1px;
  width:80px;
 }

 .svc_p{
  font-size: 0.8em;
  line-height: 1.8;
 }
 .svc_section{
  padding: 40px 0;
 }
 .svc_section_head{
  margin-left: 16px;
 }


}
.svc_stat_row{display:flex;gap:12px;margin:18px 0 10px;}
.svc_stat{flex:1;padding:14px 16px;border:1px solid #e9eef5;border-radius:14px;background:#fff;}
.svc_stat b{display:block;font-size:18px;line-height:1.1; color: #000; font-weight: 700}
.svc_stat span{display:block;margin-top:6px;color:#475569;font-size:16px;}
.svc_scope_layout{display:grid;grid-template-columns:1.4fr .6fr;gap:22px;align-items:start;}
.svc_scope_media{position:sticky;top:110px;}
.svc_scope_media img{width:100%;border-radius:16px;border:1px solid #e9eef5;}

.kmshop_section{padding:80px 0;}
.kmshop_section.alt{background:#f8fafd;}
.kmshop_h2{font-size:28px;font-weight:700;margin-bottom:14px;}
.kmshop_sub{margin-bottom:40px;color:#555;}

.kmshop_card_grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.kmshop_card{background:#fff;border:1px solid #e6ecf5;border-radius:16px;padding:22px;transition:0.3s;}
.kmshop_card:hover{transform:translateY(-6px);box-shadow:0 10px 25px rgba(0,0,0,0.05);}
.kmshop_card h3{font-size:20px;margin-bottom:10px;}
.kmshop_card p{font-size:16px;color:#666;}

.svc_scope_grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;}
.svc_scope{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:28px;}
.svc_scope h3{font-size:18px;margin-bottom:10px;}

.svc_list{list-style:none;padding:0;margin-top:14px;}
.svc_list li{position:relative;padding-left:26px;margin-bottom:8px;color:#6b7280;}
.svc_list li::before{content:"•";position:absolute;left:0;top:0;color:#2563eb;font-size:14px;font-weight:700;}

.svc_stat{background:#fff;color:#111;padding:16px 20px;border-radius:14px;min-width:160px;}

/* ===== process section ===== */

.svc_process{background:#f8fafc;}
.svc_process_grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:50px;}
.svc_process_item{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:28px;text-align:center;transition:0.2s;}
.svc_process_item:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.06);}
.svc_process_num{width:46px;height:46px;border-radius:50%;background:#2563eb;color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.svc_process_item h3{font-size:18px;margin-bottom:10px;}
.svc_process_item p{font-size:14px;color:#6b7280;line-height:1.5;}

/* welfare assets - 복지몰 전용 */

.svc_kmwelfare .svc_welfare_assets{background:#f8fafc;}
.svc_kmwelfare .svc_assets_grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:50px;}
.svc_kmwelfare .svc_asset{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:32px 28px;text-align:center;transition:0.2s;display:flex;flex-direction:column;align-items:center;}
.svc_kmwelfare .svc_asset:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,0.06);}
.svc_kmwelfare .svc_asset_icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:14px;background:#f1f5f9;border-radius:14px;}
.svc_kmwelfare .svc_asset h3{font-size:18px;margin-bottom:8px;}
.svc_kmwelfare .svc_asset p{font-size:16px;color:#6b7280;line-height:1.5;}

@media (max-width:768px){
 .svc_scope_grid{display:flex;flex-direction:column;gap:16px;}
}

@media (max-width:768px){
 .svc_scope_grid{display:flex;flex-direction:column;gap:16px;}
 .svc_process_grid{grid-template-columns:repeat(2,1fr);gap:16px;}
 .svc_process_item{padding:20px;}
 .svc_process_num{width:40px;height:40px;font-size:14px;margin-bottom:12px;}
 .svc_process_item h3{font-size:16px;}
 .svc_process_item p{font-size:13px;}
}

@media (max-width:480px){
 .svc_process_grid{grid-template-columns:1fr;}
}
body{word-break:keep-all;}

@media (max-width:768px){

 .svc_welfare_assets .svc_assets_grid{grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px;}

 .svc_welfare_assets .svc_asset{padding:22px 16px;border-radius:14px;min-height:150px;}

 .svc_welfare_assets .svc_asset_icon{width:44px;height:44px;font-size:22px;margin-bottom:10px;}

 .svc_welfare_assets .svc_asset h3{font-size:16px;margin-bottom:6px;}

 .svc_welfare_assets .svc_asset p{font-size:14px;line-height:1.5;word-break:keep-all;}

}

@media (max-width:480px){

 .svc_welfare_assets .svc_assets_grid{grid-template-columns:repeat(2,1fr);}

}


/*메인섹션1*/
.main_section1_wrap {
 position:relative;
 overflow:hidden;
 padding: 0px 0 130px;
 background: radial-gradient(1200px 600px at 50% 10%, rgb(0 80 255 / 28%), transparent 60%), radial-gradient(900px 520px at 85% 30%, rgba(96, 165, 250, .18), transparent 55%), linear-gradient(
         8deg, #0b1220 0%, #070f1a 100%);
}
.main_section1_wrap * { box-sizing:border-box; }
.main_section_content {
 width: 100%;
 max-width: 1440px;
 margin: 0 auto;
 padding: 0 40px;

 display: flex;
 flex-direction: column;
 align-items: center;     /* 가로 가운데 */
 justify-content: center; /* 세로 가운데 (높이 있을 때) */
 text-align: center;
}
.hero_visual {position:relative;width:100%;margin: 0 auto -211px;}
.scene {width:100%;min-height: 810px;overflow:hidden;perspective: 37em;mask:linear-gradient(90deg, rgba(0,0,0,0), #000 12%, #000 88%, rgba(0,0,0,0));-webkit-mask:linear-gradient(90deg, rgba(0,0,0,0), #000 12%, #000 88%, rgba(0,0,0,0));}
.scene, .a3d { display:grid; }
.a3d { place-self:center; transform-style:preserve-3d; animation:heroRotate 45s linear infinite; }

@keyframes heroRotate { to { transform:rotateY(360deg); } }

.card { --w:280px; --ba:calc(1turn/var(--n)); grid-area:1/1; width:var(--w); aspect-ratio:7/10; object-fit:cover; border-radius:28px; backface-visibility:hidden; box-shadow:0 18px 40px rgba(0,0,0,.16); transform:rotateY(calc(var(--i) * var(--ba))) translateZ(calc(-1 * (.5 * var(--w) + .5em) / tan(.5 * var(--ba)))); }

.hero-left { position:relative; z-index:2; max-width:900px; }
.hero-left h1 {margin: 0 0 20px;font-family:'Pretendard', sans-serif;font-size: 51px;line-height:1.18;font-weight: 600;letter-spacing:-0.04em;color: #ffffff;}
.hero-left p {margin:0;font-family:'Pretendard', sans-serif;font-size: 20px;line-height:1.6;font-weight: 300;letter-spacing:-0.03em;color: #ffffff;word-break:keep-all;}

.hero_btn_group {
 display: flex;
 flex-wrap: wrap;
 gap: 18px;
 margin-top: 17px;
 justify-content: center; /* 버튼 가운데 정렬 */
}
.hero-btn {display:inline-flex;align-items:center;justify-content:center;min-width: 250;height: 65px;padding: 0 35px;border-radius:14px;font-family:'Pretendard', sans-serif;font-size: 16px;font-weight:600;line-height:1;text-decoration:none;transition:all .25s ease;}
.hero-btn-dark {background: #2365ff;color:#ffffff;}
.hero-btn-dark:hover { transform:translateY(-2px); background:#17bd6a; }

@media (prefers-reduced-motion: reduce) { .a3d { animation-duration:120s; } }

@media all and (max-width:1280px) {
 .main_section1_wrap { padding:80px 0 70px; }
 .main_section_content { padding:0 28px; }
 .scene { min-height:380px; }
 .card { --w:240px; border-radius:24px; }
 .hero-left h1 { font-size:52px; }
 .hero-left p { font-size:24px; }
 .hero-btn { min-width:250px; height:62px; font-size:24px; }
}

@media all and (max-width:1024px) {
 .main_section1_wrap { padding:70px 0 60px; }
 .scene { min-height:320px; }
 .card { --w:200px; border-radius:20px; }
 .hero-left h1 { font-size:42px; }
 .hero-left p { font-size:20px; line-height:1.55; }
 .hero_btn_group { gap:14px; margin-top:32px; }
 .hero-btn { min-width:auto; height:56px; padding:0 22px; font-size:20px; }
}

@media all and (max-width:767px) {
 .main_section1_wrap {padding: 48px 0 53px;}
 .main_section_content { padding:0 20px; }
 .hero_visual { margin-bottom:26px; }
 .scene { min-height:220px; perspective:24em; }
 .card { --w:130px; border-radius:16px; }
 .hero-left h1 { margin:0 0 14px; font-size:28px; line-height:1.3; }
 .hero-left p { font-size:16px; line-height:1.6; }
 .hero_btn_group { gap:10px; margin-top:22px; }
 .hero-btn { width:100%; min-width:0; height:48px; padding:0 16px; border-radius:10px; font-size:16px; }
}
/* =========================
   현재 노출된 HTML 기준
   모바일 깨짐 보정만 최소 적용
========================= */
@media screen and (max-width: 768px) {

 html, body {
  overflow-x: hidden;
 }

 /* 1) 메인 비주얼 3D 카드 영역
    - 좌우 잘림 방지
    - 카드 높이/원근감만 약하게 축소 */
 .hero_visual {
  margin-bottom: 12px;
  overflow: hidden;
 }

 .scene {
  min-height: 179px;
  perspective: 33em;
  mask: none;
  -webkit-mask: none;
 }

 .card {
  --w: 160px;
  border-radius: 14px;
 }

 .main_section_content {
  padding: 0 16px;
 }

 .hero-left h1 {
  font-size: 26px;
  line-height: 1.35;
 }

 .hero-left p {
  font-size: 15px;
  line-height: 1.7;
 }

 .hero_btn_group {
  gap: 5px;
  margin-top: 11px;
 }

 .hero-btn {
  width: 100%;
  min-width: 0;
  height: 51px;
  padding: 0 28px;
  font-size: 15px;
 }

 /* 2) section5 카드
    - 카드 안 텍스트/아이콘 겹침 방지 */
 .main_section5 {
  padding: 0 16px;
 }

 .section5_cards {
  gap: 16px;
 }

 .section5_card {
  padding: 22px 18px;
 }

 .section5_card .num {
  font-size: 34px;
 }

 .section5_card h3 {
  font-size: 18px;
  line-height: 1.4;
  padding-right: 42px;
 }

 .section5_card p {
  font-size: 14px;
  line-height: 1.6;
 }

 .card_icon {
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
 }

 .card_icon img {
  width: 38px;
  height: 38px;
 }

 /* 3) section7 타겟 카드
    - 모바일에서 카드 내부 패딩 과다/썸네일 비율 과다 보정 */
 .main_section7 {
  padding: 0 16px;
 }

 .section7_title {
  margin-bottom: 36px;
 }

 .section7_thumb {
  height: 210px;
 }

 .section7_caption {
  padding: 16px 16px 18px;
 }

 .section7_caption p {
  font-size: 16px;
 }

 .section7_caption span {
  font-size: 13px;
 }

 /* 4) section2 기능 카드
    - 긴 제목 줄바꿈 안정화
    - 아이콘 영역 과다 폭 보정 */
 .section2_inner {
  padding: 0 16px;
 }

 .section2_title h2 {
  font-size: 32px;
  line-height: 1.35;
 }

 .section2_card {
  gap: 16px;
  padding: 22px 18px;
 }

 .section2_card h3 {
  font-size: 18px;
  line-height: 1.45;
 }

 .section2_card p {
  font-size: 14px;
  line-height: 1.6;
 }

 .feature_icon {
  width: 68px;
  height: 68px;
  border-radius: 16px;
 }

 .feature_icon img {
  width: 54px;
  height: 54px;
 }

 /* 5) dev swiper 카드
    - 카드 높이 고정이 너무 커서 텍스트 뜨는 부분 보정 */
 .dev_swiper {
  padding-left: 16px;
  padding-right: 16px;
 }

 .dev_card {
  height: 180px;
  padding: 16px;
  border-radius: 14px;
 }

 .dev_card_category {
  font-size: 13px;
 }

 .dev_card_title {
  font-size: 18px;
  line-height: 1.35;
 }

 .dev_card_text {
  font-size: 13px;
  line-height: 1.55;
 }

 /* 6) section6 카드형 자산 영역
    - scroll icon이 텍스트 위를 덮는 문제 보정
    - hover 기반 설명을 모바일에서 항상 읽기 쉽게 */
 .section6_card_ver .main_section6 {
  padding: 0 16px;
 }

 .section6_card_ver .section6_title h2 {
  font-size: 32px;
  line-height: 1.35;
 }

 .section6_card_ver .section6_desc {
  font-size: 15px;
  line-height: 1.7;
 }

 .section6_card_ver .s6_card_box {
  height: 300px;
 }

 .section6_card_ver .s6_card_center {
  top: 68%;
  padding: 0 18px 18px;
 }

 .section6_card_ver .s6_card_center h3 {
  font-size: 22px;
  line-height: 1.35;
 }

 .section6_card_ver .s6_card_desc {
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.6;
 }

 .scroll_icon {
  bottom: 158px;
  width: 22px;
  height: 34px;
 }

 .scroll_icon span {
  width: 3px;
  height: 7px;
 }

 /* 7) section9 CTA
    - 제목/버튼만 약간 축소 */
 .main_section9_title {
  font-size: 39px;
  line-height: 1.3;
 }

 .main_section9_desc {
  font-size: 15px;
  line-height: 1.7;
 }

 .main_section9_btn {
  min-width: 170px;
  height: 50px;
  padding: 0 20px;
  font-size: 16px;
 }

 /* 8) 상담 폼
    - 이미 모바일용 유리카드 처리가 있으므로
      텍스트/필드 크기만 소폭 보정 */
 .main_section8 {
  padding: 0 16px;
 }

 .section8_left h2 {
  font-size: 28px;
  line-height: 1.35;
 }

 .section8_left p {
  font-size: 15px;
  line-height: 1.7;
 }

 .kmsol-form {
  padding: 24px 18px 28px;
 }

 .kmsol-form input,
 .kmsol-form select {
  height: 42px;
  font-size: 14px;
 }

 .kmsol-submit {
  height: 48px;
  font-size: 15px;
 }

 /* 9) 하단 로고 롤링
    - 로고가 너무 크거나 줄바꿈 밀림 방지 */
 .welfare_logo_swiper .swiper-slide {
  padding: 0 14px;
 }

 .welfare_logo_swiper .swiper-slide img {
  height: 34px;
  max-width: 110px;
 }
}

/* 초소형 폰만 추가 보정 */
@media screen and (max-width: 480px) {
 .hero-left h1,
 .section2_title h2,
 .section6_card_ver .section6_title h2,
 .section8_left h2,
 .main_section9_title {
  font-size: 24px;
 }

 .section7_thumb {
  height: 180px;
 }

 .section6_card_ver .s6_card_box {
  height: 260px;
 }

 .card {
  --w: 92px;
 }
}.mobilebr {
  display: none;
 }

@media (max-width: 1024px) {
 .mobilebr {
  display: block !important;
 }
}

@media (max-width: 768px) {
 .section7_title h2 {
  font-size: 32px;
  line-height: 1.35;
 }
}

@media (max-width: 768px) {
 .section6_card_ver .section6_title {
  text-align: center;
 }

 .section6_card_ver .section6_title h2 {
  text-align: center;
 }

 .section6_card_ver .section6_desc {
  text-align: center;
 }
}

@media (max-width: 768px) {
 .main_section6_wrap.section6_card_ver {
  background-position: 80% center;
 }
}



@media (max-width: 768px) {
 .main_category_tabs {
  margin-bottom: 0;
  transform: none;
  padding: 82px 20px 16px; /* 기존 90px 28px 22px -> 전체 세로폭 축소 */
  background: #09204a;
  border: 0;
  box-shadow: none;
 }

 .main_category_tabs .main_category_inner {
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: transparent !important; /* 뒤 배경 제거 */
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 0;
  box-shadow: none !important; /* 회색 뜨는 느낌 제거 */
  border-radius: 0;
  overflow: visible;
 }

 /* 각 그룹 */
 .main_category_tabs .main_category_inner .category_row {
  display: block;
  grid-template-columns: none;
  margin: 0 0 10px 0; /* 그룹 간격 축소 */
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
 }

 .main_category_tabs .main_category_inner .category_row:last-child {
  margin-bottom: 0;
 }

 /* 왼쪽 큰 라벨 제거 */
 .main_category_tabs .main_category_inner .category_label {
  display: none;
 }

 /* 3칸 x 2줄 */
 .main_category_tabs .main_category_inner .category_list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0;
  background: #5c6475;
  border: 0;
  border-radius: 14px; /* 기존 16px -> 살짝 축소 */
  overflow: hidden;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none !important; /* 카드 뒤 회색 그림자 제거 */
 }

 /* 그룹 사이 선 제거 */
 .main_category_tabs .main_category_inner .category_row + .category_row .category_list {
  border-top: none;
 }

 .main_category_tabs .main_category_inner .category_list li {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
 }

 /* 세로 구분선 */
 .main_category_tabs .main_category_inner .category_list li:nth-child(3n+2),
 .main_category_tabs .main_category_inner .category_list li:nth-child(3n+3) {
  border-left: 1px solid rgba(255, 255, 255, 0.06);
 }

 /* 가로 구분선 */
 .main_category_tabs .main_category_inner .category_list li:nth-child(n+4) {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
 }

 .main_category_tabs .main_category_inner .category_list li a {
  min-height: 48px; /* 기존 70px -> 세로폭 축소 */
  padding: 8px 4px; /* 기존 10px 6px -> 축소 */
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  word-break: keep-all;
  white-space: normal;
  line-height: 1.25; /* 줄간격 축소 */
  font-size: 11px;   /* 기존 12px -> 살짝 축소 */
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  background: transparent;
  box-shadow: none;
  text-decoration: none;
 }

 .main_category_tabs .main_category_inner .category_list li a:hover {
  background: rgba(255, 255, 255, 0.04);
 }

 .main_category_tabs .main_category_inner .category_list li.is-active {
  background: transparent;
 }

 .main_category_tabs .main_category_inner .category_list li.is-active a {
  background: rgba(59, 130, 246, 0.35);
  color: #ffffff;
  font-weight: 800;
  box-shadow: none;
 }
 .pf-dev-marquee {
  width: 100%;
  overflow: hidden;
  position: relative;
 }

 .pf-dev-track {
  display: flex;
  gap: 16px;
  width: max-content;
  animation: portfolioMarquee 36s linear infinite;
 }

 .pf-dev-item {
  flex: 0 0 auto;
  width: 280px;
 }

 .pf-dev-thumb {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 18px;
  background: #111;
 }

 .pf-dev-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
 }

 .pf-dev-item:hover .pf-dev-thumb img {
  transform: scale(1.08);
 }

 .pf-dev-item p {
  margin-top: 12px;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 700;
  color: #fff;
  word-break: keep-all;
  white-space: normal;
 }
 .pf-dev-section {
  padding: 72px 0 80px;
 }

 .pf-dev-header {
  padding: 0 20px;
  margin-bottom: 28px;
 }

 .pf-dev-header h2 {
  font-size: 28px;
  line-height: 1.25;
  margin-bottom: 12px;
 }

 .pf-dev-header p {
  font-size: 16px;
  line-height: 1.6;
  word-break: keep-all;
 }

 .pf-dev-track {
  gap: 14px;
  padding: 0 20px;
 }

 .pf-dev-item {
  width: 220px;   /* 모바일에서 이 정도가 적당 */
 }

 .pf-dev-thumb {
  border-radius: 16px;
 }

 .pf-dev-item p {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.5;
 }
 .portfolio_types {
  padding: 80px 0 90px;
 }

 .portfolio_types .container {
  padding: 0 20px;
 }

 .portfolio_types .section_head {
  margin-bottom: 34px;
 }

 .portfolio_types .section_head h2 {
  font-size: 28px;
  line-height: 1.3;
  margin-bottom: 14px;
 }

 .portfolio_types .section_head .desc {
  font-size: 16px;
  line-height: 1.7;
  word-break: keep-all;
 }

 .type_grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
 }

 .type_card {
  min-height: auto;
  padding: 16px 14px 16px;
  border-radius: 20px;
 }

 .type_badge {
  min-width: 72px;
  height: 32px;
  padding: 0 12px;
  font-size: 13px;
  margin-bottom: 16px;
 }

 .type_icon {
  width: 40px;
  height: 40px;
  margin: 0 auto 16px;
  background-size: 58%;
  border-radius: 10px;
 }

 .type_card h3 {
  font-size: 0.8em;
  line-height: 1.45;
  margin: 0 0 10px;
  word-break: keep-all;
 }

 .type_card p {
  font-size: 0.8em;
  line-height: 1.65;
  margin: 0 0 16px;
  word-break: keep-all;
 }

 .type_hint {
  height: 34px;
  margin: 4px 0 10px;
 }

 .type_footer {
  min-height: 28px;
  font-size: 14px;
  line-height: 1.4;
  border-radius: 12px;
  padding: 10px 12px;
 }
}
/* 하단 배너 */
.svc_bottom_banner {
 padding: 40px 0 80px;
}

.svc_bottom_banner_inner {
 position: relative;
 overflow: hidden;
 border-radius: 28px;
 padding: 28px 32px;
 text-align: center;
 color: #fff;
 background: #05070a;
 isolation: isolate;
}

/* 배경 영상 */
.svc_bottom_video {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 object-fit: cover;
 z-index: 0;
}

/* 어두운 오버레이 */
.svc_bottom_banner_inner::before {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 1;
 pointer-events: none;
 background:
         linear-gradient(
                 to bottom,
                 rgba(4, 9, 20, 0.36) 0%,
                 rgba(3, 8, 18, 0.58) 45%,
                 rgba(2, 5, 12, 0.78) 100%
         );
}

/* 살짝 블루/그린 톤 보정 */
.svc_bottom_banner_inner::after {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 1;
 pointer-events: none;
 background:
         radial-gradient(circle at 20% 20%, rgba(0, 102, 255, 0.16), transparent 35%),
         radial-gradient(circle at 80% 30%, rgba(0, 255, 163, 0.08), transparent 35%);
 mix-blend-mode: screen;
}

/* 콘텐츠 위로 */
.svc_bottom_banner_inner > *:not(.svc_bottom_video) {
 position: relative;
 z-index: 2;
}

.svc_bottom_badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 34px;
 padding: 0 14px;
 border-radius: 999px;
 margin-bottom: 18px;
 font-size: 13px;
 font-weight: 700;
 color: #eaf2ff;
 background: rgba(255, 255, 255, 0.12);
 border: 1px solid rgba(255, 255, 255, 0.18);
 backdrop-filter: blur(6px);
}

.svc_bottom_title {
 margin: 0;
 font-size: 36px;
 line-height: 1.35;
 font-weight: 800;
 letter-spacing: -0.03em;
 color: #fff;
 text-shadow: 0 4px 20px rgba(0, 0, 0, 0.28);
}

.svc_bottom_cta {
 margin-top: 23px;
}

.svc_bottom_btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 240px;
 height: 47px;
 padding: 0 24px;
 border-radius: 15px;
 background: linear-gradient(135deg, #373737, #2f2f2f);
 color: #ffffff;
 font-size: 16px;
 font-weight: 700;
 letter-spacing: -0.02em;
 text-decoration: none;
 border: 2px solid rgba(255, 255, 255, 0.2);
 box-shadow:
         0 8px 20px rgba(0, 0, 0, 0.32),
         0 0 18px rgba(255, 255, 255, 0.05);
 transition:
         transform 0.3s ease,
         background 0.3s ease,
         color 0.3s ease,
         border-color 0.3s ease,
         box-shadow 0.3s ease;
}

.svc_bottom_btn:hover {
 transform: translateY(-4px) scale(1.02);
 background: rgba(255, 255, 255, 0.06);
 color: #ffffff;
 border-color: #ffffff;
 backdrop-filter: blur(10px);
 box-shadow:
         0 12px 30px rgba(0, 0, 0, 0.35),
         0 0 20px rgba(0, 102, 255, 0.22);
}

.svc_bottom_btn:active {
 transform: translateY(-1px) scale(0.98);
}

@media (max-width: 768px) {
 .svc_bottom_banner {
  padding: 28px 0 60px;
 }

 .svc_bottom_banner_inner {
  border-radius: 22px;
  padding: 40px 20px;
 }

 .svc_bottom_title {
  font-size: 28px;
 }


}
..svc_bottom_btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 10px;

 min-width: 240px;
 height: 47px;
 padding: 0 24px;
 border-radius: 15px;

 background: linear-gradient(135deg, #373737, #2f2f2f);
 color: #ffffff;
 font-size: 16px;
 font-weight: 700;
 letter-spacing: -0.02em;
 text-decoration: none;
 border: 2px solid rgba(255, 255, 255, 0.2);
 box-sizing: border-box;
 transition: all 0.3s ease;
}

.btn_text {
 display: inline-block;
 line-height: 1;
}

.btn_arrow_wrap {
 display: inline-flex;
 align-items: center;
 justify-content: flex-start;
 width: 24px;   /* 기존보다 조금 넓게 */
 height: 20px;
 overflow: visible; /* 잘리는 느낌 방지 */
 flex-shrink: 0;
}

.btn_arrow_icon {
 width: 18px;
 height: 18px;
 display: block;
 flex-shrink: 0;
 will-change: transform, opacity;
 animation: arrowLoop 1.8s ease-in-out infinite;
}

@keyframes arrowLoop {
 0% {
  transform: translateX(0);
  opacity: 0.72;
 }
 50% {
  transform: translateX(4px); /* 6px -> 4px로 줄임 */
  opacity: 1;
 }
 100% {
  transform: translateX(0);
  opacity: 0.72;
 }

}

.svc_bottom_btn:hover {
 transform: translateY(-4px) scale(1.02);
 background: rgba(255, 255, 255, 0.06);
 color: #ffffff;
 border-color: #ffffff;
 backdrop-filter: blur(10px);
 box-shadow:
         0 12px 30px rgba(0, 0, 0, 0.35),
         0 0 20px rgba(0, 102, 255, 0.22);
}

/* hover 시 속도 변경하지 않고, 이동폭만 아주 살짝 */
.svc_bottom_btn:hover .btn_arrow_icon {
 animation: arrowLoopHover 1.8s ease-in-out infinite;
}

@keyframes arrowLoopHover {
 0% {
  transform: translateX(0);
  opacity: 0.82;
 }
 50% {
  transform: translateX(5px);
  opacity: 1;
 }
 100% {
  transform: translateX(0);
  opacity: 0.82;
 }
}

.svc_bottom_btn:active {
 transform: translateY(-1px) scale(0.98);
}
.footer_policy {display: block;margin-top:8px;font-size:13px;color:#888;}
.footer_policy:hover {color:#000; text-decoration:underline;}

.privacy_wrap { width:100%; max-width:1000px; margin:0 auto; padding:60px 20px; }
 .privacy_box { background:#fff; padding:50px 40px; border-radius:16px; box-shadow:0 4px 20px rgba(0,0,0,0.06); }
 .privacy_title { font-size:32px; font-weight:700; margin-bottom:12px; color:#111; }
 .privacy_date { font-size:15px; color:#777; margin-bottom:40px; }
 .privacy_desc { font-size:16px; color:#444; margin-bottom:40px; }
 .privacy_section { margin-bottom:36px; }
 .privacy_section h2 { font-size:22px; font-weight:700; margin-bottom:16px; color:#111; border-bottom:2px solid #eee; padding-bottom:10px; }
 .privacy_section p { font-size:16px; color:#444; margin-bottom:12px; }
 .privacy_section ul { padding-left:20px; margin-bottom:12px; }
 .privacy_section ul li { font-size:16px; color:#444; margin-bottom:8px; }
 .privacy_table { width:100%; border-collapse:collapse; margin-top:16px; }
 .privacy_table th, .privacy_table td { border:1px solid #ddd; padding:14px 12px; text-align:left; font-size:15px; vertical-align:top; }
 .privacy_table th { background:#f1f3f5; font-weight:600; color:#111; }
 .privacy_notice { margin-top:30px; padding:20px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:12px; font-size:15px; color:#555; }
 @media screen and (max-width:768px){
 .privacy_wrap { padding:30px 16px; }
 .privacy_box { padding:30px 20px; border-radius:12px; margin: 60px 0 0; }
 .privacy_title { font-size:26px; }
 .privacy_section h2 { font-size:20px; }
 .privacy_section p, .privacy_section ul li { font-size:15px; }
 .privacy_table th, .privacy_table td { font-size:14px; padding:10px 8px; }
 }