@charset "utf-8";
/* 서브공통 */
.sub-section {margin-bottom: var(--space-100);}
.sub-section:last-child {margin-bottom: 0;}
.sub-com-tit {font-size: var(--font-size-30); font-weight: 700; color: #121212; margin-bottom: var(--space-30); line-height: 0.933em;}
.sub-com-tit:before {content: ''; display: inline-block; width: 20px; height: 22px; background: url(../images/sub/accre-icon.png) no-repeat center / contain; margin-right: 14px;}

.procedure-chk-box {padding: var(--space-30) var(--space-40); border-radius: var(--radius-16); border: 1px solid #ddd; text-align: left; margin-top: var(--space-20);}
.procedure-chk-tit {display: flex; align-items: center; font-size: 18px; font-weight: 600; color: var(--color-sub); margin-bottom: var(--space-20);}
.procedure-chk-tit:before {content: ''; display: inline-block; width: 24px; height: 24px; background: url(../images/sub/service-chk.png) no-repeat center / contain; margin-right: 10px;}
.procedure-chk-tit:not(:has(~ .procedure-chk-item)) {margin-bottom: 0;}
.procedure-chk-item {position: relative; font-size: 16px; line-height: 1em; margin-bottom: var(--space-15); padding-left: 12px;}
.procedure-chk-item:last-child {margin-bottom: 0;}
.procedure-chk-item:before {content: ''; position: absolute; left: 0; top: 4px; width: 6px; height: 6px; background: var(--color-sub); border-radius: 50%;}
.procedure-box {padding: var(--space-30) var(--space-40); margin-bottom: var(--space-40); border: 1px solid #ddd; border-radius: var(--radius-8); font-size: var(--font-size-18); line-height: 1.666em;}
.procedure-box .prm {font-size: var(--font-size-20); color: var(--color-primary); font-weight: 700; margin-top: var(--space-20); line-height: normal;}

/********************* 회사소개 *********************/
/* 인사말 */
.greeting-content {display: flex; gap: var(--space-60);}
.greeting-top-txt {width: clamp(300px, calc(835 / var(--inner) * 100vw), 835px); padding: var(--space-60) var(--space-85) var(--space-60) 250px; background: var(--color-primary); color:#fff; border-radius: 0 var(--radius-16) var(--radius-16) 0;}
.greeting-top-txt p {font-size:var(--font-size-20); font-weight:600; line-height:1.3em;}
.greeting-top-txt p.strong {font-size:var(--font-size-32); font-weight:700; line-height:1.3em; margin-top: 15px;}
.greeting-text { max-width: clamp(300px, calc(835 / var(--inner) * 100vw), 835px); margin-top: var(--space-60); padding-right: var(--space-30);}
.greeting-tit {color: #121212; font-size:var(--font-size-24); font-weight:700; line-height:1em; margin-bottom: var(--space-30);}
.greeting-desc {gap: var(--space-20); margin-bottom: var(--space-20); font-size: var(--font-size-18); line-height:1.666em;}
.greeting-sign {gap: var(--space-30);}
.greeting-sign p {color: #121212; font-size:var(--font-size-20); font-weight:600; line-height:1em;}

/* 공평성 보장 선언문 */
.impartiality-content {gap: var(--space-100); padding: var(--space-100); border: 2px solid #ddd; text-align: center; background: url('/images/sub/impart-bg.png') no-repeat center bottom 40% / clamp(400px, calc(555 / var(--inner) * 100vw), 555px);}
.impartiality-logo {margin-bottom: var(--space-40);}
.impartiality-intro {font-size: var(--font-size-28); line-height: 1.785em; color: var(--color-sub); font-weight: 600;}
.impartiality-list {text-align: left; padding: var(--space-40) 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.impartiality-list li {display: flex; gap: 5px; margin-bottom: var(--space-30); font-size: var(--font-size-20); line-height: 1.5em; }
.impartiality-list li span {flex-shrink: 0;;}
.impartiality-list li:last-child {margin-bottom: 0;}
.impartiality-bottom {gap: var(--space-40);}
.impartiality-date {font-size: var(--font-size-20); line-height: 2em;}
.impartiality-company {font-size: var(--font-size-31); font-weight: 600; color: var(--color-sub); line-height: 1.29em;}
.impartiality-ceo {font-size: var(--font-size-20); color: #121212; display: flex; align-items: center; justify-content: center; gap: var(--space-20); line-height: 2em;}

/* 찾아오시는 길 */
.root_daum_roughmap {width: 100% !important;}
.root_daum_roughmap .wrap_map {height: 600px !important;}
.root_daum_roughmap .wrap_controllers {display: none !important;}
.map {margin-bottom: var(--space-60);}
.dir-wrap { gap: var(--space-80); width: 100%;}
.dir-item {display: flex; align-items: center; justify-content: center; gap: 30px;}
.dir-item.adress {width: 100%; padding-bottom: 80px;}
.dir-item.adress p {font-size: var(--font-size-20); line-height: 1em; color: #121212; font-weight: 700;}
.dir-item .icon {flex-shrink:0;}
.dir-item p {font-size:var(--font-size-20); line-height:1em; color:#505050;}
.dir-item p span {font-weight: 600; color:var(--color-sub);}
.item-wrap {width: 100%;}
.item-wrap .dir-item {flex: 1; border-right: 1px solid #ddd;}
.item-wrap .dir-item:last-child {border-right: none;}

/********************* 견적요청 *********************/
/* 공통 */
.btn-wrap {display: flex; justify-content: flex-end;}
.btn-download {display: inline-flex; align-items: center; justify-content: center; gap: 20px; padding: 13px 20px; border: 1px solid var(--color-sub); border-radius: 8px; color: var(--color-sub); font-size: var(--font-size-14); line-height: 1em;}
.btn-download:after {content: ''; display: inline-block; width: 30px; height: 30px; background: url('/images/sub/download.svg') no-repeat center center / contain; transition: transform 0.3s ease-in-out;}
.btn-download:hover {border-color: var(--color-primary); color: var(--color-primary);}
.btn-download:hover:after {transform: translateY(3px);}

/* 교정 견적 요청 */
.quotation-top {margin-bottom: var(--space-60);}
.quotation-top-txt {padding: var(--space-40); border-radius: var(--radius-16); border: 1px solid #ddd; margin-bottom: var(--space-60);}
.quotation-top-txt > p {display: flex; align-items: flex-start; gap: 10px; font-size: var(--font-size-18); line-height: 1.5em; color: var(--color-primary); font-weight: 600; margin-bottom: var(--space-20);}
.inquiry-info {gap: var(--space-20);}
.inquiry-info-item {display: flex; align-items: center; gap: 10px;}
.inquiry-info-item p { font-size: var(--font-size-16); line-height: 1em;}
.inquiry-info-item p span {font-size: var(--font-size-18); color: #121212; font-weight: 600; line-height: 1.666em;}
.board-form table th .required {color: var(--color-primary); font-size: var(--font-size-16); line-height: 1em; font-weight: 700;}
.board-form table td.radio-wrap {padding: 35px 20px;}
.radio-wrap div {display: flex; gap: var(--space-40);}
.board-form .input {border-radius: 4px;}

/* 인정서 및 인정범위 */

.accreditation-top-txt {display: flex; align-items: center; justify-content: space-between; padding: var(--space-30) var(--space-40); border-radius: var(--radius-16); border: 1px solid #ddd; margin-bottom: var(--space-30);}
.accreditation-number {font-size: var(--font-size-18); font-weight: 600; color: #121212; margin-bottom: var(--space-10);}
.accreditation-number span {color: var(--color-sub); margin-left: var(--space-10);}
.accreditation-desc {font-size: var(--font-size-18); line-height: 1.667em; color: #505050;}
.accreditation-desc span {color: var(--color-sub); font-weight: 700;}
.accreditation-logos {display: flex; align-items: center; gap: var(--space-50);}

.accreditation-section-head {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: var(--space-20) var(--space-30); margin-bottom: var(--space-60); border: 1px solid #ddd; border-left: none; border-right: none;}
.accreditation-section-tit {font-size: var(--font-size-20); font-weight: 700; color: #121212;}
.accreditation-certs {display: flex; justify-content: center; gap: var(--space-50); margin-bottom: var(--space-60);}
.accreditation-cert-item {border: 1px solid #ddd;}
.accreditation-cert-item img {display: block; width: 100%; height: auto; object-fit: contain;}
.accreditation-scope-txt {font-size: var(--font-size-18); margin-top: var(--space-20);}
.accreditation-content .btn-wrap {gap: var(--space-20);}

/* tab-menu */
.tab-menu {margin-bottom: var(--space-30);}
.tab-menu li {flex: 1; text-align: center; height: 60px; padding: 0 var(--space-20); font-size: var(--font-size-16); background:#F9F9F9 ; color: #505050; cursor: pointer; border: 1px solid #ddd; border-bottom: 1px solid var(--color-primary); line-height: 58px; white-space: nowrap;}
.tab-menu li:first-of-type {border-radius: 8px 0 0 0}
.tab-menu li:last-of-type {border-radius: 0 8px 0 0}
.tab-menu li.active {background: #fff; color: var(--color-primary); font-weight: 700; border-color: var(--color-primary); border-bottom: none;}
.tab-menu li:not(:first-of-type) {border-left: 1px solid transparent;}
.tab-menu li:not(:first-of-type).active {border-left: 1px solid var(--color-primary);}

.accreditation-list .content {display: none; margin-top: var(--space-20); padding: 0 var(--space-30);}
.accreditation-list .tit a {display: block; position: relative; color: #121212; font-size: var(--font-size-20); font-weight: 600; line-height: 1.5em; padding: var(--space-20) var(--space-30); border: 1px solid #ddd; border-radius: var(--radius-8);}
.accreditation-list .tit a:after {content: ""; position: absolute; right: 20px; top: 50%; display: inline-block; width: 9px; height: 9px; border-right: 2px solid #505050; border-bottom: 2px solid #505050; transform: rotate(45deg) translateY(-50%);}
.accreditation-list li.active a:after {transform: rotate(-135deg);}
.accreditation-list li {margin-bottom: var(--space-20);}
.accreditation-list li:last-child {margin-bottom: 0;}
.accreditation-list li.active a {border-color: #121212;}

/* 인정범위 탭 내 테이블  */
.accreditation-scope-table {width: 100%; border-collapse: collapse;}
.accreditation-scope-table thead {background: #f4f4f4;}
.accreditation-scope-table th {padding: var(--space-20) var(--space-100); font-size: var(--font-size-18); font-weight: 700; color: #121212; text-align: center; border: 1px solid #ddd; border-left: none; border-right: none; line-height: normal;}
.accreditation-scope-table th:last-child {text-align: left;}
.accreditation-scope-table td {padding: var(--space-20) var(--space-90); font-size: var(--font-size-18); line-height: 1.5em; font-weight: 500; border-bottom: 1px solid #eee; text-align: center;}
.accreditation-scope-table td:last-child {text-align: left; font-weight: 400;}
.accreditation-scope-table tbody tr:last-child td {border-bottom: none;}
.accreditation-scope-table tbody tr {background: #fff;}

/********************* 교정업무절차 *********************/

/* 교정이란? */
.procedure-list li {display: flex; align-items: center; gap: var(--space-23); padding: 0 var(--space-30); border-bottom: 1px solid #ddd; height: 120px;}
.procedure-num {flex-shrink: 0; font-size: var(--font-size-30); font-weight: 700; color: var(--color-primary); line-height: 1em;}
.procedure-txt {font-size: var(--font-size-18); line-height: 1.666em;}

/* 국가교정기관이란?*/
.procedure-org-flow {display: flex; align-items: center; justify-content: space-between; gap: 0; flex-wrap: wrap; margin-top: var(--space-50);}
.procedure-flow-item {display: flex; flex-direction: column; gap: 28px; align-items: center; justify-content: center; width: clamp(200px, calc(400 / var(--inner) * 100vw), 400px); aspect-ratio: 1/1;  min-height: 180px; padding: var(--space-32); border-radius: 50%; text-align: center; background: #fff; border: 20px solid rgba(218, 30, 55, 0.60);}
.procedure-flow-gray {border: 20px solid rgba(28, 43, 57, 0.60);}
.procedure-flow-tit {display: block; font-size: var(--font-size-24); font-weight: 700; color: var(--color-sub);}
.procedure-flow-desc {max-width: 218px; font-size: var(--font-size-18); line-height: 1.555em;}
.procedure-flow-arrow {flex-shrink: 0; width: 0; height: 0; border-top: 16px solid transparent; border-bottom: 16px solid transparent; border-left: 23px solid var(--color-sub);}
.procedure-list.list-type02 li {justify-content: space-between; height: unset; padding: var(--space-30) var(--space-150) var(--space-30) var(--space-30); margin-bottom: var(--space-20); border: 1px solid #ddd; border-radius: var(--radius-8);}
.procedure-list.list-type02 li:last-child {margin-bottom: 0;}
.procedure-list.list-type02 li .flex {gap: var(--space-30); width: 100%;}

/* 교정의뢰  */
/* tab-menu */
.tab-menu.request-tab-menu {margin-bottom: var(--space-100);}
.request-step-head {text-align: center; margin-bottom: var(--space-60);}
.request-step-tit {font-size: var(--font-size-40); font-weight: 700; color: #000; line-height: 1em; margin-bottom: var(--space-20);}
.request-step-desc {font-size: var(--font-size-18); line-height: 1.555em;}
.request-step-desc strong {color: #121212; font-weight: 600;}
.request-step-row {display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px;}
.request-step-card {display: flex; flex-direction: column; position: relative; padding: var(--space-40) var(--space-30); background: #F4F4F4;  border-radius: var(--radius-8);}
.request-step-card:after {content: ''; position: absolute; top: 50%; right: -27px; transform: translateY(-50%); width: 0; height: 0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 9px solid var(--color-sub);}
.request-step-card:nth-of-type(4n):after {display: none;}
.step-num {display: flex; align-items: flex-start; justify-content: space-between;}
.request-step-label {display: flex; align-items: center; font-size: var(--font-size-16); font-weight: 600; color: var(--color-primary); line-height: 1em;}
.request-step-label:before {content: ''; flex-shrink: 0; display: inline-block; width: 3px; height: 17px; background: var(--color-primary); border-radius: 99px; margin-right: var(--space-10);}
.request-step-card .request-step-icon {align-self: flex-end;}
.request-step-card-tit {font-size: var(--font-size-20); font-weight: 700; color: var(--color-sub); margin-bottom: var(--space-25);}
.request-step-detail {list-style: none; margin: 0; padding: 0; font-size: var(--font-size-14); line-height: 1.6em;}
.request-step-detail li {display: flex; gap:5px; align-items: flex-start; position: relative; padding-left: 12px; margin-bottom: var(--space-15); font-size:16px; line-height: 1.2em;}
.request-step-detail .detail-label {flex-shrink: 0; font-weight: 600; color: #121212;}
.request-step-detail li:before {content: ''; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; background: #878787; border-radius: 50%;}
.request-step-detail li.request-step-sub {font-weight: 600; margin-top: var(--space-12); padding-left: 0;}
.request-step-detail li.request-step-sub:before {display: none;}
.request-detail-box {padding: var(--space-15); background: #fff;}
.detail-box-tit {font-size: var(--font-size-14); font-weight: 600; color: var(--color-primary); margin-bottom: var(--space-15);}
.request-detail-box li {font-size: var(--font-size-14); line-height: 1.57em;}

/* 교정 연간 계약제 */
.annual-flow-row {display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: 30px 90px;}
.annual-card {display: flex; flex-direction: column; align-items: center; position: relative; padding: var(--space-30) var(--space-50); background: #f4f4f4; border-radius: var(--radius-8);}
.annual-card:after {content: ''; position: absolute; top: 50%; right: -52px; transform: translateY(-50%); width: 0; height: 0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 9px solid var(--color-sub);}
.annual-card:nth-of-type(3n):after {display: none;}
.annual-card-icon {margin-bottom: var(--space-30);}
.annual-card-num {font-size: var(--font-size-20); font-weight: 700; color: var(--color-primary); line-height: 1.4em; margin-bottom: 4px;}
.annual-card-txt {font-size: var(--font-size-18); line-height: 1.555em; color: #121212; text-align: center;}
.inquiry-item {flex: 1; display: flex; align-items: center; justify-content: center; gap: var(--space-30); padding: var(--space-40) var(--space-10); border-right: 1px solid #ddd;}
.inquiry-item:last-child {border-right: none;}
.inquiry-item p {display: flex; flex-direction: column; gap: 4px; font-size: var(--font-size-20);}
.inquiry-item p span {font-weight: 700; color: var(--color-primary);}

/********************* 교정관리시스템 *********************/
/* cms */
.cms-signup-flow {display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px;}
.cms-signup-card {flex: 1; display: flex; flex-direction: column; align-items: center; padding: var(--space-20); position: relative;}
.cms-signup-card-icon {margin-bottom: var(--space-30);}
.cms-signup-card-num {font-size: var(--font-size-20); font-weight: 700; color: var(--color-primary); line-height: 1.4em; margin-bottom: 4px;}
.cms-signup-card-txt {font-size: var(--font-size-18); color: #505050; text-align: center;}
.cms-signup-card:after {content: ''; position: absolute; top: 50%; right: -25px; transform: translateY(-50%); width: 24px; height: 24px; background: url(../images/sub/cms-arrow.png) no-repeat center center / contain;}
.cms-signup-card:last-of-type:after {display: none;}
.cms-inquiry-item p span {color: var(--color-sub);}
.cms-btn-wrap {margin-top: var(--space-100);}
.cms-btn-wrap a.cms-btn {max-width: 286px; height: 68px; background: var(--color-primary); color: #fff; font-size: var(--font-size-20); font-weight: 700; line-height: 1.4em; display: flex; align-items: center; justify-content: center; padding: 0 var(--space-20); white-space: nowrap;}
/* 성적서 진위 여부 확인 */
.report-box {padding: var(--space-40) var(--space-30); border-radius: var(--radius-8); border: 1px solid #ddd; text-align: center; margin-bottom: var(--space-20);}
.report-box:last-child {margin-bottom: 0;}
.report-box p {font-size: var(--font-size-18); color: #505050; text-align: center; margin-bottom: 5px;}
.report-box p:last-child {margin-bottom: 0;}
.report-box .report-tit {display: flex; align-items: center; justify-content: center; color: var(--color-sub); font-size: var(--font-size-20); font-weight: 700; color: var(--color-sub); margin-bottom: var(--space-15); line-height: 1em;}
.report-box .report-tit:before {content: ''; display: inline-block; width: 16px; height: 16px; background: url(../images/sub/report-chk.png) no-repeat center / contain; margin-right: 10px;}


/********************* 고객지원 *********************/
/* faq */
.btn-pack.faq-btn {min-width: 110px;}