@charset "UTF-8";

/* 서브 공통 */
.sub-content {background: #fff;}

/* 서브 비주얼 */
.sub-visual {background:#fff; padding:90px 0 30px; position: relative; overflow: hidden;border-bottom:1px solid #eee; max-width:1280px; margin:0 auto;}
.sub-visual .title {position: relative; z-index: 2;}
.sub-visual .category {display: inline-block; font-size: 15px; font-weight: 600; color: #293aaf; margin-bottom: 16px; letter-spacing: 0.5px;}
.sub-visual h2 {font-size: 42px; font-weight: 700; color: #1a1a1a; line-height: 1.3;}
/* ==================== 회사소개 페이지 ==================== */
.sub-content .inner{padding:0; max-width:1280px; margin:0 auto;}

/* 회사소개 서브비주얼 */
.company-visual {background: #F8FAFB; padding: 80px 0 60px; position: relative;}
.company-visual .title {position: relative; z-index: 2;}
.company-visual .category {display: inline-block; font-size: 15px; font-weight: 600; color: #666; margin-bottom: 16px; letter-spacing: 0.5px;}
.company-visual h2 {font-size: 48px; font-weight: 700; color: #1a1a1a; line-height: 1.3;}

/* 회사소개 메인 배너 */
.company-intro {padding: 60px 0 40px;}
.company-intro .intro-banner {background: linear-gradient(135deg, #2D4A9E 0%, #4A6FD8 100%); border-radius: 32px; padding: 90px 80px; display: flex; align-items: center; justify-content: space-between; gap: 60px; position: relative; overflow: hidden; box-shadow: 0 20px 60px rgba(45,74,158,0.3);}
.company-intro .intro-banner::before {content: ''; position: absolute; top: -100px; right: -100px; width: 400px; height: 400px; background: radial-gradient(circle, rgba(255,255,255,0.15) 0%, transparent 70%); border-radius: 50%;}
.company-intro .text-area {flex: 1; color: #fff; position: relative; z-index: 2;}
.company-intro .text-area h3 {font-size: 32px; font-weight: 400; line-height: 1.6;}
.company-intro .text-area h3 strong {display: block; font-size: 36px; font-weight: 700; }
.company-intro .badge-list {display: flex; gap: 16px;}
.company-intro .badge-list li {font-size: 14px; font-weight: 500; padding: 14px 24px; background: rgba(255,255,255,0.25); backdrop-filter: blur(10px); border-radius: 12px; border: 1px solid rgba(255,255,255,0.3); line-height: 1.5; text-align: center;}
.company-intro .visual-area {position: absolute; z-index: 2; bottom: 0; right:5%;}
.company-intro .visual-area img {width: 100%; height: auto; }

/* 4가지 X - 가로 배치 */
.company-value {padding: 0 0; background: #fff; margin-bottom:80px;}
.company-value .value-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1400px; margin: 0 auto;}
.company-value .value-item {background: #F8FAFB; padding: 30px 28px; border-radius: 20px; display: flex; flex-direction: row; align-items: center; gap: 20px; transition: all 0.3s ease; border: 1px solid #E8EAED;}
.company-value .value-item:hover {background: #fff; transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,0.08);}
.company-value .icon-wrap {width: 80px; height: 80px; flex-shrink: 0;}
.company-value .icon-wrap img{width:90%;}
.company-value .icon-wrap svg {width: 100%; height: 100%; filter: drop-shadow(0 4px 12px rgba(0,0,0,0.12));}
.company-value .text-area {flex: 1; text-align: left;}
.company-value h4 {font-size: 18px; font-weight: 700; color: #1a1a1a; margin-bottom: 6px;}
.company-value p {font-size: 13px; color: #666; line-height: 1.6;}

/* 태블릿 반응형 */
@media (max-width: 1024px) {
.company-value .value-list {grid-template-columns: repeat(2, 1fr); gap: 20px;}
.company-value .value-item {padding: 28px 24px; gap: 18px;}
.company-value .icon-wrap {width: 70px; height: 70px;}
.company-value h4 {font-size: 17px;}
.company-value p {font-size: 13px;}
.sub-visual .title{text-align: center;}
.sub-content .inner{padding:0 6%;}
.company-intro .visual-area{width:40%;}
.company-intro .visual-area img { max-width:330px;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
.company-value {padding: 60px 0;}
.company-value .value-list {grid-template-columns: 1fr; gap: 16px;}
.company-value .value-item {padding: 24px 20px; gap: 16px;}
.company-value .icon-wrap {width: 60px; height: 60px;}
.company-value h4 {font-size: 16px; margin-bottom: 4px;}
.company-value p {font-size: 12px;}
.sub-content .inner{padding:0 5%;}
}

/* 신뢰의 서비스 */
.company-service {padding: 100px 0; background: linear-gradient(135deg, #2D4A9E 0%, #4A6FD8 100%); position: relative; overflow: hidden;}
.company-service::before {content: ''; position: absolute; top: -200px; left: -200px; width: 600px; height: 600px; background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%); border-radius: 50%;}
.company-service .content-area {display: grid; grid-template-columns: 1fr 1fr; gap: 80px; position: relative; z-index: 2; color: #fff;}
.company-service .left-text h3 {font-size: 36px; font-weight: 700; line-height: 1.6; margin-bottom: 30px;}
.company-service .left-text .desc {font-size: 16px; line-height: 1.8; opacity: 0.95;}
.company-service .right-text p {font-size: 16px; line-height: 1.9; margin-bottom: 20px; opacity: 0.9;}
.company-service .right-text .highlight {font-size: 17px; font-weight: 700; color: #FFD93D; margin: 30px 0;}
.company-service .right-text .sub-info {margin-top: 40px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,0.2);}
.company-service .right-text .sub-info p {font-size: 18px; margin-bottom: 12px;font-weight: bold;}

/* 고객제공업무 */
.company-business {padding: 100px 0; background: #fff;}
.company-business .title {text-align: center; margin-bottom: 70px;}
.company-business .title h3 {font-size: 42px; font-weight: 700; color: #1a1a1a;}
.company-business .business-list {display: grid; grid-template-columns: repeat(5, 1fr); gap: 30px; max-width: 1400px; margin: 0 auto;}
.company-business .business-item {background: #fff; padding: 40px 20px; border-radius: 20px; text-align: center; border: 2px solid #F0F4F8; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);}
.company-business .business-item:hover {border-color: #293aaf; transform: translateY(-8px); box-shadow: 0 15px 40px rgba(74,144,226,0.2);}
.company-business .icon-3d {width: 100px; height: 100px; margin: 0 auto 20px;}
.company-business .icon-3d svg {width: 100%; height: 100%; filter: drop-shadow(0 6px 16px rgba(0,0,0,0.15));}
.company-business h5 {font-size: 16px; font-weight: 600; color: #333; line-height: 1.4;}

/* 태블릿 반응형 */
@media (max-width: 1024px) {
.company-visual h2 {font-size: 38px;}
.company-intro {padding: 80px 0;}
.company-intro .intro-banner {padding: 60px 50px; gap: 40px;}
.company-intro .text-area h3 {font-size: 28px;}
.company-intro .text-area h3 strong {font-size:28px;}
.company-intro .visual-area {flex: 0 0 350px;}
.company-intro .badge-list {flex-direction: column;}
.company-value .value-list {grid-template-columns: repeat(2, 1fr); gap: 20px;}
.company-service {padding: 80px 0;}
.company-service .content-area {grid-template-columns: 1fr; gap: 50px;}
.company-service .left-text h3 {font-size: 30px;}
.company-business {padding: 80px 0;}
.company-business .title h3 {font-size: 36px;}
.company-business .business-list {grid-template-columns: repeat(3, 1fr); gap: 24px;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
.company-visual {padding: 60px 0 40px;}
.company-visual h2 {font-size: 28px;}
.company-intro {padding: 60px 0;}
.company-intro .intro-banner {flex-direction: column; padding: 40px 30px; gap: 30px; text-align: center;}
.company-intro .text-area h3 {font-size: 22px;}
.company-intro .text-area h3 strong {font-size: 26px; margin-top: 6px;}
.company-intro .badge-list {justify-content: center; flex-wrap: wrap;}
.company-intro .badge-list li {padding: 12px 20px; font-size: 13px;}
.company-intro .visual-area {flex: 0 0 auto; max-width: 300px;}
.company-value {padding: 60px 0;}
.company-value .value-list {grid-template-columns: 1fr; gap: 16px;}
.company-value .value-item {padding: 30px 24px; gap: 16px;}
.company-value .icon-wrap {width: 70px; height: 70px;}
.company-value h4 {font-size: 17px;}
.company-value p {font-size: 13px;}
.company-service {padding: 60px 0;}
.company-service .content-area {gap: 40px;}
.company-service .left-text h3 {font-size: 24px;}
.company-service .left-text .desc {font-size: 15px;}
.company-service .left-text .desc br{display: none;}
.company-service .right-text p {font-size: 14px;}
.company-service .right-text p br{display: none;}
.company-service .right-text .highlight {font-size: 16px; margin: 24px 0;}
.company-service .right-text .sub-info {margin-top: 30px; padding-top: 24px;}
.company-business {padding: 60px 0;}
.company-business .title h3 {font-size: 28px;}
.company-business .business-list {grid-template-columns: repeat(2, 1fr); gap: 16px;}
.company-business .business-item {padding: 30px 16px;}
.company-business .icon-3d {width: 80px; height: 80px; margin-bottom: 16px;}
.company-business h5 {font-size: 14px;}
.company-service .right-text .sub-info p br{display: none;}
}
/* ==================== 지점안내 ==================== */

/* 지점안내 서브 비주얼 */
.branch-visual {background: #fff; padding: 80px 0 60px; position: relative; overflow: hidden;}
.branch-visual::before {content: ''; position: absolute; top: -50%; right: -10%; width: 600px; height: 600px; background: radial-gradient(circle, rgba(74,144,226,0.08) 0%, transparent 70%); border-radius: 50%;}
.branch-visual .title {position: relative; z-index: 2;}
.branch-visual .category {display: inline-block; font-size: 15px; font-weight: 600; color: #293aaf; margin-bottom: 16px; letter-spacing: 0.5px;}
.branch-visual h2 {font-size: 48px; font-weight: 700; color: #1a1a1a; line-height: 1.3;}
.branch-visual h2 .emoji {display: inline-block; animation: wave 1.5s ease-in-out infinite;}

/* 지점 리스트 */
.branch-list-section {padding: 100px 0; background: #fff;}
.branch-list-section .title {text-align: center; margin-bottom: 70px;}
.branch-list-section .title h3 {font-size: 42px; font-weight: 700; color: #1a1a1a; margin-bottom: 16px;}
.branch-list-section .title p {font-size: 17px; color: #666; line-height: 1.6;}
.branch-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}
.branch-card {background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.08); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative;}
.branch-card::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(90deg, #293aaf, #667eea); transform: scaleX(0); transform-origin: left; transition: transform 0.4s ease;}
.branch-card:hover::before {transform: scaleX(1);}
.branch-card:hover {transform: translateY(-12px); box-shadow: 0 20px 50px rgba(0,0,0,0.15);}
.branch-card .thumb {position: relative; padding-top: 60%; overflow: hidden; background: #f5f5f5;}
.branch-card .thumb img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}
.branch-card:hover .thumb img {transform: scale(1.1);}
.branch-card .badge {position: absolute; top: 16px; right: 16px; background: rgba(74,144,226,0.95); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 14px; border-radius: 20px; backdrop-filter: blur(10px);}
.branch-card .info {padding: 30px;}
.branch-card .info h4 {font-size: 22px; font-weight: 700; color: #1a1a1a; margin-bottom: 10px; transition: color 0.3s;}
.branch-card:hover .info h4 {color: #293aaf;}
.branch-card .info .address {font-size: 14px; color: #999; margin-bottom: 20px; display: flex; align-items: center; gap: 6px;}
.branch-card .info .address::before {content: '📍'; font-size: 16px;}
.branch-card .contact {border-top: 1px solid #F0F4F8; padding-top: 20px;}
.branch-card .contact .tel {display: flex; align-items: center; gap: 8px; font-size: 16px; color: #333; font-weight: 600; margin-bottom: 8px;}
.branch-card .contact .tel::before {content: '📞'; font-size: 18px;}
.branch-card .contact .time {display: flex; align-items: center; gap: 8px; font-size: 14px; color: #666;}
.branch-card .contact .time::before {content: '🕐'; font-size: 16px;}

/* 애니메이션 */
@keyframes wave {0%, 100% {transform: rotate(0deg);} 25% {transform: rotate(20deg);} 75% {transform: rotate(-20deg);}}

/* ==================== 가맹안내 ==================== */

/* 가맹안내 메인 소개 */
.franchise-intro {padding: 20px 0; background: #fff;}
.franchise-intro .inner {display: flex; align-items: center; gap: 80px;}
.franchise-intro .text-area {flex: 1;}
.franchise-intro .text-area h3 {font-size:46px; font-weight: 700; line-height: 1.5; margin-bottom: 30px; color: #1a1a1a; letter-spacing:-2px;}
.franchise-intro .text-area h3 strong {font-weight: 700; color: #293aaf;}
.franchise-intro .text-area .desc {font-size: 18px; color: #666; line-height: 1.8;}
.franchise-intro .visual-area {flex: 0 0 600px;}
.franchise-intro .visual-area img {width: 100%; filter: drop-shadow(0 20px 40px rgba(0,0,0,0.1));}

/* 가맹안내 4가지 핵심가치 - 새로운 디자인 */
.franchise-value {padding: 100px 0; background: #fff;}
.franchise-value .title {text-align: left; margin-bottom: 70px;}
.franchise-value .title h3 {font-size: 42px; font-weight: 700; color: #1a1a1a;}
.franchise-value .value-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1400px; margin: 0 auto;}
.franchise-value .value-item {padding: 50px 30px 40px; border-radius: 28px; text-align: left;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden;
display: flex; flex-direction: column; align-items: flex-start;justify-content: space-between; }
.franchise-value .value-item:hover {transform: translateY(-12px); box-shadow: 0 20px 50px rgba(0,0,0,0.15);}
.franchise-value h4 {font-size:24px; font-weight: 700; margin-bottom:8px; position: relative; z-index: 2; color: #16181d; }
.franchise-value p {font-size: 16px; line-height: 1.5; margin-bottom:8px; position: relative; z-index: 2; color: rgba(0,0,0,0.4); font-weight: 500;}
.franchise-value .icon-3d {width: 180px; height: 180px; position: relative; z-index: 1;}
.franchise-value .icon-3d img{width:150%;}
.franchise-value .icon-3d svg {width: 100%; height: 100%; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.12));}

/* 노란색 카드 */
.franchise-value .value-item--yellow {background:#fffaee; border: 1px solid rgba(255, 215, 77, 0.3);}
.franchise-value .value-item--yellow:hover {box-shadow: 0 20px 50px rgba(255, 193, 7, 0.25);}

/* 파란색 카드 */
.franchise-value .value-item--blue {background:#eff8ff; border: 1px solid rgba(107, 166, 255, 0.3);}
.franchise-value .value-item--blue:hover {box-shadow: 0 20px 50px rgba(61, 126, 219, 0.25);}

/* 보라색 카드 */
.franchise-value .value-item--purple {background:#f7f4ff; border: 1px solid rgba(167, 139, 250, 0.3);}
.franchise-value .value-item--purple:hover {box-shadow: 0 20px 50px rgba(124, 58, 237, 0.25);}

/* 핑크색 카드 */
.franchise-value .value-item--pink {background:#fff4fa; border: 1px solid rgba(240, 171, 252, 0.3);}
.franchise-value .value-item--pink:hover {box-shadow: 0 20px 50px rgba(217, 70, 239, 0.25);}

/* 태블릿 반응형 */
@media (max-width: 1024px) {
.franchise-value {padding: 80px 0;}
.franchise-value .title h3 {font-size: 36px;}
.franchise-value .value-list {grid-template-columns: repeat(2, 1fr); gap: 20px;}
.franchise-value .value-item {min-height:auto; padding: 40px 24px 36px;}
.franchise-value h4 {font-size: 20px;}
.franchise-value p {font-size: 14px; margin-bottom: 30px;}
.franchise-value .icon-3d {width: 150px; height: 150px;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
.franchise-value {padding: 60px 0;}
.franchise-value .title {margin-bottom: 50px;}
.franchise-value .title h3 {font-size: 28px;}
.franchise-value .value-list {grid-template-columns: 1fr; gap: 20px;}
.franchise-value .value-item {padding: 40px 30px; text-align: center;align-items: center;}
.franchise-value h4 {font-size: 23px; margin-bottom: 14px;}
.franchise-value p {font-size: 16px; margin-bottom: 30px;}
.franchise-value .icon-3d {width: 180px;}
.franchise-value .icon-3d img{width: 100%;}
}
/* 비교표 */
.franchise-compare {padding: 100px 0; background: #fff;}
.franchise-compare .title {text-align: center; margin-bottom: 70px;}
.franchise-compare .title h3 {font-size: 42px; font-weight: 700; color: #1a1a1a; margin-bottom: 16px;}
.franchise-compare .title p {font-size: 17px; color: #666; line-height: 1.6;}
.franchise-compare .compare-table {max-width: 1200px; margin: 0 auto; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.08);}
.franchise-compare table {width: 100%; border-collapse: collapse;}
.franchise-compare thead {background: linear-gradient(135deg, #2D4A9E 0%, #4A6FD8 100%);}
.franchise-compare th {padding: 24px 20px; color: #fff; font-size: 18px; font-weight: 700; text-align: center; border-right: 1px solid rgba(255,255,255,0.1);}
.franchise-compare th:last-child {border-right: none;}
.franchise-compare tbody tr {border-bottom: 1px solid #F0F4F8; transition: background 0.3s;}
.franchise-compare tbody tr:hover {background: #F9FAFB;}
.franchise-compare tbody tr:last-child {border-bottom: none;}
.franchise-compare td {padding: 28px 20px; font-size: 16px; color: #333; text-align: center; border-right: 1px solid #F0F4F8;}
.franchise-compare td:last-child {border-right: none;}
.franchise-compare td:first-child {font-weight: 600; color: #1a1a1a;}
.franchise-compare .profit {font-size: 20px; font-weight: 700; color: #293aaf;}

/* 가맹절차 */
.franchise-process {padding: 100px 0; background: linear-gradient(180deg, #F9FAFB 0%, #fff 100%);}
.franchise-process .title {text-align: center; margin-bottom: 70px;}
.franchise-process .title h3 {font-size: 42px; font-weight: 700; color: #1a1a1a; margin-bottom: 16px;}
.franchise-process .title p {font-size: 17px; color: #666;}
.franchise-process .process-list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}
.franchise-process .process-item {background: #fff; padding: 50px 40px; border-radius: 24px; display: flex; align-items: center; justify-content: space-between; gap: 30px; box-shadow: 0 4px 20px rgba(0,0,0,0.06); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden;}
.franchise-process .process-item::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(90deg, #667eea, #764ba2); transform: scaleX(0); transform-origin: left; transition: transform 0.4s ease;}
.franchise-process .process-item:hover::before {transform: scaleX(1);}
.franchise-process .process-item:hover {transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0,0,0,0.15);}
.franchise-process .text-area {flex: 1;}
.franchise-process .step {display: inline-block; font-size: 13px; font-weight: 600; color: #293aaf; background: #E8F4FF; padding: 6px 12px; border-radius: 12px; margin-bottom: 12px;}
.franchise-process h4 {font-size: 20px; font-weight: 700; color: #1a1a1a; line-height: 1.4;}
.franchise-process .icon {flex: 0 0 80px; width: 80px; height: 80px; background: #F0F7FF; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all 0.4s ease;}
.franchise-process .process-item:hover .icon {background: linear-gradient(135deg, #667eea, #764ba2); transform: scale(1.1) rotate(5deg);}
.franchise-process .icon img {width: 45px; height: 45px; transition: filter 0.3s ease;}
.franchise-process .process-item:hover .icon img {filter: brightness(0) invert(1);}

/* 태블릿 반응형 */
@media (max-width: 1024px) {
.sub-visual h2 {font-size: 38px;}
.company-intro {padding: 80px 0;}
.company-intro .intro-banner {padding: 60px 40px; gap: 50px;}
.company-intro .text-area h3 {font-size: 32px;}
.company-intro .text-area h3 strong {font-size: 32px;}
.company-intro .visual-area {flex: 0 0 350px;}
.company-value .value-list {grid-template-columns: repeat(2, 1fr); gap: 20px;}
.company-value .value-item {padding: 40px 30px;}
.company-service {padding: 80px 0;}
.company-service .inner {flex-direction: column; gap: 50px;}
.company-service .title h3 {font-size: 36px;}
.company-service .service-text {padding: 50px 40px;}
.company-business .business-list {grid-template-columns: repeat(3, 1fr);}
.branch-visual h2 {font-size: 38px;}
.branch-list-section {padding: 80px 0;}
.branch-list-section .title h3 {font-size: 36px;}
.branch-grid {grid-template-columns: repeat(2, 1fr); gap: 24px;}
.franchise-intro {padding: 80px 0;}
.franchise-intro .inner {flex-direction: column; gap: 50px;}
.franchise-intro .text-area h3 {font-size: 36px;}
.franchise-intro .visual-area {flex: 0 0 auto; max-width: 400px;}
.franchise-value {padding: 80px 0;}
.franchise-value .title h3 {font-size: 36px;}
.franchise-value .value-list {grid-template-columns: 1fr; gap: 24px;}
.franchise-compare {padding: 80px 0;}
.franchise-compare .title h3 {font-size: 36px;}
.franchise-compare th {font-size: 16px; padding: 20px 16px;}
.franchise-compare td {font-size: 15px; padding: 24px 16px;}
.franchise-process {padding: 80px 0;}
.franchise-process .title h3 {font-size: 36px;}
.franchise-process .process-list {grid-template-columns: repeat(2, 1fr); gap: 24px;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
.sub-visual {padding: 60px 0 40px;}
.sub-visual h2 {font-size: 28px;}
.company-intro {padding:30px 0 0; }
.company-intro .intro-banner {flex-direction: column; padding: 40px 30px 200px; gap: 40px; text-align: center;}
.company-intro .visual-area{width: 100%; text-align: center; right:0; max-width:100%}
.company-intro .text-area h3 {font-size: 24px;}
.company-intro .text-area h3 strong {font-size: 25px; margin-top: 8px;}
.company-intro .intro-list {justify-content: center; font-size: 14px;}
.company-intro .intro-list li {padding: 10px 20px;}
.company-intro .visual-area {flex: 0 0 auto; width:90%;}
.company-value {padding:30px 0 60px;}
.company-value .value-list {grid-template-columns: 1fr; gap: 16px;}
.company-value .value-item {padding: 30px 24px; align-items: center; gap: 16px;}
.company-value .icon {width: 60px; height: 60px; flex: 0 0 60px;}
.company-value .icon img {width: 32px; height: 32px;}
.company-value h4 {font-size: 18px; margin-bottom: 6px;}
.company-value p {font-size: 13px;}
.company-service {padding: 60px 0;}
.company-service .inner {flex-direction: column; gap: 40px; text-align: center;}
.company-service .title h3 {font-size: 26px;}
.company-service .title .desc {font-size: 15px;}
.company-service .service-text {padding: 40px 24px;}
.company-service .service-text p {font-size: 15px; margin-bottom: 20px;}
.company-service .service-text .highlight {font-size: 17px; padding: 20px 0; margin: 30px 0;}
.company-business {padding: 60px 0;}
.company-business .title h3 {font-size: 28px; padding: 15px 30px;}
.company-business .business-list {grid-template-columns: repeat(2, 1fr); gap: 16px;}
.company-business .business-item {padding: 30px 16px;}
.company-business .icon {width: 60px; height: 60px; margin-bottom: 16px;}
.company-business .icon img {width: 32px; height: 32px;}
.company-business h5 {font-size: 14px;}
.branch-visual {padding: 60px 0 40px;}
.branch-visual h2 {font-size: 28px;}
.branch-list-section {padding: 60px 0;}
.branch-list-section .title {margin-bottom: 50px;}
.branch-list-section .title h3 {font-size: 28px;}
.branch-list-section .title p {font-size: 15px;}
.branch-grid {grid-template-columns: 1fr; gap: 20px;}
.branch-card .info {padding: 24px;}
.branch-card .info h4 {font-size: 20px;}
.branch-card .contact {padding-top: 16px;}
.franchise-intro {padding: 60px 0;}
.franchise-intro .inner {flex-direction: column; gap: 40px; text-align: center;}
.franchise-intro .text-area h3 {font-size: 26px;}
.franchise-intro .text-area .desc {font-size: 15px;}
.franchise-intro .visual-area {max-width: 320px;}
.franchise-value {padding: 60px 0;}
.franchise-value .title {margin-bottom: 50px;}
.franchise-value .title h3 {font-size: 28px;}
.franchise-value .value-list {gap: 20px;}
.franchise-value .value-item {flex-direction: column; text-align: center; padding: 40px 24px; gap: 4px;}
.franchise-value h4 {font-size: 20px;}
.franchise-value .icon {width: 80px; height: 80px;}
.franchise-value .icon img {width: 45px; height: 45px;}
.franchise-compare {padding: 60px 0;}
.franchise-compare .title {margin-bottom: 50px;}
.franchise-compare .title h3 {font-size: 24px;}
.franchise-compare .title p {font-size: 15px;}
.franchise-compare .compare-table {overflow-x: auto;}
.franchise-compare table {min-width: 600px;}
.franchise-compare th {font-size: 14px; padding: 16px 12px;}
.franchise-compare td {font-size: 13px; padding: 20px 12px;}
.franchise-compare .profit {font-size: 17px;}
.franchise-process {padding: 60px 0;}
.franchise-process .title {margin-bottom: 50px;}
.franchise-process .title h3 {font-size: 28px;}
.franchise-process .title p {font-size: 15px;}
.franchise-process .process-list {grid-template-columns: 1fr; gap: 20px;}
.franchise-process .process-item {flex-direction: column; text-align: center; padding: 40px 24px; gap: 20px;}
.franchise-process h4 {font-size: 18px;}
.franchise-process .icon {width: 70px; height: 70px;}
.franchise-process .icon{flex: 0 0 70px;}
.franchise-process .icon img {width: 40px; height: 40px;}
}
/* ==================== 온라인 문의 ==================== */

/* 온라인 문의 섹션 */
.inquiry-section {padding: 100px 0; background: #fff;}
.inquiry-section .title {text-align: center; margin-bottom: 70px;}
.inquiry-section .title h2 {font-size: 48px; font-weight: 700; color: #1a1a1a; margin-bottom: 16px;}
.inquiry-section .title p {font-size: 17px; color: #666; line-height: 1.6;}
.inquiry-form-wrap {max-width: 800px; margin: 0 auto;}
.inquiry-form {background: #fff; border-radius: 24px; padding: 60px; box-shadow: 0 4px 30px rgba(0,0,0,0.08); border: 1px solid #F0F4F8;}
.inquiry-form .form-group {margin-bottom: 30px;}
.inquiry-form .form-group:last-of-type {margin-bottom: 0;}
.inquiry-form label {display: block; font-size: 15px; font-weight: 600; color: #333; margin-bottom: 10px;}
.inquiry-form input[type="text"], .inquiry-form input[type="tel"], .inquiry-form textarea {width: 100%; padding: 16px 20px; font-size: 15px; color: #333; background: #F8FAFB; border: 1px solid #E5E7EB; border-radius: 12px; transition: all 0.3s ease; font-family: inherit;}
.inquiry-form input[type="text"]:focus, .inquiry-form input[type="tel"]:focus, .inquiry-form textarea:focus {background: #fff; border-color: #293aaf; outline: none; box-shadow: 0 0 0 4px rgba(74,144,226,0.1);}
.inquiry-form textarea {resize: vertical; min-height: 180px; line-height: 1.6;}
.inquiry-form .form-check-wrap {margin: 40px 0;}
.inquiry-form .form-check {display: flex; align-items: center; gap: 10px;}
.inquiry-form input[type="checkbox"] {width: 20px; height: 20px; cursor: pointer; accent-color: #293aaf;}
.inquiry-form .form-check label {margin: 0; font-size: 14px; font-weight: 400; color: #666; cursor: pointer; display: flex; align-items: center; gap: 4px;}
.inquiry-form .link-detail {color: #293aaf; text-decoration: underline; font-weight: 500; transition: color 0.3s; background: none; border: none; padding: 0; cursor: pointer;}
.inquiry-form .link-detail:hover {color: #2D4A9E;}
.inquiry-form .btn-submit {width: 100%; padding: 18px 0; font-size: 17px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #2D4A9E 0%, #4A6FD8 100%); border: none; border-radius: 12px; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 8px 24px rgba(74,144,226,0.3);}
.inquiry-form .btn-submit:hover {transform: translateY(-2px); box-shadow: 0 12px 32px rgba(74,144,226,0.4);}
.inquiry-form .btn-submit:active {transform: translateY(0); box-shadow: 0 4px 16px rgba(74,144,226,0.3);}

/* 태블릿 반응형 - 온라인 문의 */
@media (max-width: 1024px) {
.inquiry-section {padding: 80px 0;}
.inquiry-section .title h2 {font-size: 38px;}
.inquiry-form {padding: 50px 40px;}
}

/* 모바일 반응형 - 온라인 문의 */
@media (max-width: 768px) {
.inquiry-section {padding: 60px 0;}
.inquiry-section .title {margin-bottom: 50px;}
.inquiry-section .title h2 {font-size: 28px;}
.inquiry-section .title p {font-size: 15px;}
.inquiry-form {padding: 40px 24px; border-radius: 16px;}
.inquiry-form label {font-size: 14px; margin-bottom: 8px;}
.inquiry-form input[type="text"], .inquiry-form input[type="tel"], .inquiry-form textarea {padding: 14px 16px; font-size: 14px; border-radius: 10px; box-sizing:border-box}
.inquiry-form textarea {min-height: 150px;}
.inquiry-form .form-check-wrap {margin: 30px 0;}
.inquiry-form .form-check {flex-direction: row; align-items: flex-start;}
.inquiry-form input[type="checkbox"] {flex-shrink: 0;}
.inquiry-form .form-check label {font-size: 13px; line-height: 1.5;}
.inquiry-form .btn-submit {padding: 16px 0; font-size: 16px; border-radius: 10px;}
}




/* 가맹 문의 폼 섹션 */
.franchise-contact {background: linear-gradient(135deg, #F8FAFB 0%, #FFFFFF 100%); padding: 120px 0; position: relative;}
.franchise-contact::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('data:image/svg+xml,<svg width="60" height="60" xmlns="http://www.w3.org/2000/svg"><circle cx="1" cy="1" r="1" fill="%23293aaf" opacity="0.03"/></svg>'); pointer-events: none;}
.franchise-contact .inner {display: flex; align-items: center; gap: 80px; position: relative; z-index: 2;}
.franchise-contact .text-area {flex: 1;}
.franchise-contact .text-area .badge {display: inline-block; font-size: 18px; font-weight: 700; color: #1a1a1a; margin-bottom: 16px;}
.franchise-contact .text-area h3 {font-size: 48px; font-weight: 700; line-height: 1.3; color: #1a1a1a; margin-bottom: 24px;}
.franchise-contact .text-area .desc {font-size: 18px; line-height: 1.8; color: #666;}
.franchise-contact .form-area {flex: 1; background: #fff; border-radius: 24px; padding: 50px 60px; box-shadow: 0 10px 40px rgba(0,0,0,0.08); box-sizing:border-box}
.franchise-contact .form-area h4 {font-size: 32px; font-weight: 700; color: #1a1a1a; margin-bottom: 40px; text-align: center;}
.franchise-contact .franchise-form .form-group {margin-bottom: 28px; display: flex; align-items: center; gap: 20px;}
.franchise-contact .franchise-form .form-group label {font-size: 18px; font-weight: 600; color: #333; min-width: 100px; text-align: left; box-sizing:border-box;}
.franchise-contact .franchise-form .form-group input {flex: 1; padding: 16px 20px; border: 2px solid #E5E7EB; border-radius: 12px; font-size: 16px; background: #FAFBFC; transition: all 0.3s; box-sizing:border-box;}
.franchise-contact .franchise-form .form-group input:focus {outline: none; border-color: #293aaf; background: #fff; box-shadow: 0 0 0 4px rgba(41,58,175,0.1); transform: translateY(-2px);}
.franchise-contact .franchise-form .form-group input::placeholder {color: #9CA3AF;}
.franchise-contact .franchise-form .btn-submit {width: 100%; padding: 18px; background: #293aaf; color: #fff; font-size: 18px; font-weight: 700; border-radius: 12px; margin-top: 20px; border: none; cursor: pointer; transition: all 0.3s; box-shadow: 0 4px 16px rgba(41,58,175,0.3);}
.franchise-contact .franchise-form .btn-submit:hover {background: #1E2D8F; transform: translateY(-2px); box-shadow: 0 6px 24px rgba(41,58,175,0.4);}
.franchise-contact .link-detail {color: #293aaf; text-decoration: underline; font-weight: 500; transition: color 0.3s; background: none; border: none; padding: 0; cursor: pointer;}
.franchise-contact .link-detail:hover {color: #2D4A9E;}

/* 태블릿 반응형 */
@media (max-width: 1024px) {
.franchise-contact {padding: 100px 0;}
.franchise-contact .inner {flex-direction: column; gap: 60px;}
.franchise-contact .text-area {text-align: center;}
.franchise-contact .text-area h3 {font-size: 38px;}
.franchise-contact .text-area .desc {font-size: 16px;}
.franchise-contact .form-area {width: 100%; max-width: 600px; padding: 40px 50px;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
.franchise-contact {padding: 60px 0;}
.franchise-contact .inner {gap: 40px;}
.franchise-contact .text-area .badge {font-size: 15px;}
.franchise-contact .text-area h3 {font-size: 28px;}
.franchise-contact .text-area .desc {font-size: 15px;}
.franchise-contact .form-area {padding: 30px 24px;}
.franchise-contact .form-area h4 {font-size: 24px; margin-bottom: 32px;}
.franchise-contact .franchise-form .form-group {flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 24px;}
.franchise-contact .franchise-form .form-group label {font-size: 15px; min-width: auto;}
.franchise-contact .franchise-form .form-group input {width: 100%; padding: 14px 16px; font-size: 15px;}
.franchise-contact .franchise-form .btn-submit {font-size: 16px; padding: 16px;}
}