@charset "utf-8";
.crumb {font-size: 1.8rem;color: var(--gray);}
.crumb a:hover {color: var(--blue);}
.crumb [aria-current] {color: var(--navy);}
.display {font-size: clamp(5rem, 8.5vw, 14.4rem);font-weight: 800;line-height: 1.15;letter-spacing: -.02em;color: var(--navy);}
.cat {position: relative;display: grid;grid-template-columns: repeat(5, minmax(max-content, 23rem));gap: 4.8rem;width: 100%;overflow-x: auto;scrollbar-width: none;}
.cat::-webkit-scrollbar {display: none;}
.cat button {position: relative;padding: .6rem 0 1.4rem;text-align: left;font-weight: 500;color: var(--gray);white-space: nowrap;transition: color .3s;}
.cat button:hover, .cat button[aria-pressed='true'] {color: var(--blue);}
.cat button::after {content: '';position: absolute;left: 0;bottom: 0;width: 100%;height: .2rem;background: var(--blue);scale: 0 1;transform-origin: left center;transition: scale .45s var(--ease);}
.cat button[aria-pressed='true']::after {scale: 1 1;}
.guide {background: var(--ice);}
.guide .t-sec {color: var(--navy);}
.guide .btn {margin-top: -.8rem;}
.navy {background: var(--navy);color: #fff;}
.navy .contact-note span {color: var(--muted);}
.d-wrap {display: grid;grid-template-columns: minmax(0, 76fr) minmax(0, 62fr);gap: 8rem;width: 100%;align-items: start;}
.d-photo {position: relative;aspect-ratio: 760 / 800;overflow: hidden;background: #eef2f8;cursor: zoom-in;}
.d-photo img {width: 100%;height: 100%;object-fit: cover;transform-origin: var(--zx, 50%) var(--zy, 50%);transition: scale .5s var(--ease);}
.d-photo.is-zoom img {scale: 1.7;}
.d-photo .hint {position: absolute;right: 1.6rem;bottom: 1.6rem;padding: .6rem 1.4rem;border-radius: 10rem;background: rgba(11, 23, 53, .72);color: #fff;font-size: 1.3rem;pointer-events: none;transition: opacity .3s;}
.d-photo.is-zoom .hint {opacity: 0;}
.d-info {display: flex;flex-direction: column;align-items: flex-start;gap: 4rem;}
.t-detail {font-size: clamp(4.2rem, 4.7vw, 8rem);font-weight: 700;line-height: 1.15;letter-spacing: -.01em;}
.ice {background: var(--ice);}
.sub-board {padding-block: 8rem 12rem;}
.sub-hero {position: relative;padding-block: clamp(7rem, 9vw, 14rem) clamp(5rem, 6vw, 9rem);background: #fff;overflow: clip;}
.sub-hero .inner {position: relative;z-index: 1;display: flex;flex-direction: column;align-items: flex-start;gap: 2.4rem;}
.sub-ghost {position: absolute;right: var(--page-gutter);bottom: -.12em;max-width: 100%;font-size: clamp(8rem, 12vw, 20rem);font-weight: 800;line-height: 1;letter-spacing: -.02em;white-space: nowrap;color: #eef3fc;pointer-events: none;user-select: none;}
.sub-tt {font-size: clamp(4.4rem, 6.6vw, 11.2rem);font-weight: 800;line-height: 1.15;letter-spacing: -.02em;color: var(--navy);}
.sub-ds {max-width: 72rem;}
.crumb ol {display: flex;flex-wrap: wrap;gap: .4rem 1rem;}
.crumb li + li::before {content: '/';margin-right: 1rem;color: #aab4c6;}
.sub-tabs {position: sticky;top: var(--header-h);z-index: 40;background: #fff;border-bottom: .1rem solid #e3e9f2;transition: top .35s var(--ease);}
.hd.is-fixed ~ main .sub-tabs {top: 8.4rem;}
.sub-tabs ul {display: flex;gap: 6.4rem;overflow-x: auto;scrollbar-width: none;}
.sub-tabs ul::-webkit-scrollbar {display: none;}
.sub-tabs a {position: relative;display: block;padding: 2.2rem 0;font-weight: 500;white-space: nowrap;color: var(--navy);transition: color .3s;}
.sub-tabs a:hover, .sub-tabs a.is-on {color: var(--blue);}
.sub-tabs a::after {content: '';position: absolute;left: 0;bottom: -.1rem;width: 100%;height: .3rem;background: var(--blue);scale: 0 1;transform-origin: left center;transition: scale .45s var(--ease);}
.sub-tabs a:hover::after, .sub-tabs a.is-on::after {scale: 1 1;}
.review.cols-2 {grid-template-columns: repeat(2, minmax(0, 1fr));}
.review.cols-4 {grid-template-columns: repeat(4, minmax(0, 1fr));}
.ice .row {background: #fff;}
.ice .row:hover {background: #e8efff;}
.ice .tl-item:hover {background: #fff;}
.sheet-dl {display: flex;flex-direction: column;gap: 2.4rem;width: 100%;}
.split {display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 8rem;align-items: center;width: 100%;}
.split-tx {display: flex;flex-direction: column;align-items: flex-start;gap: 3.2rem;}
.split-ph {overflow: hidden;aspect-ratio: 4 / 3;background: #eef2f8;}
.split-ph img {width: 100%;height: 100%;object-fit: cover;transition: scale .8s var(--ease);}
.split-ph:hover img {scale: 1.05;}
.map-box {display: grid;place-items: center;min-height: 36rem;border: .1rem dashed #b9c6dc;background: var(--ice);text-align: center;color: var(--gray);}
.map-box small {font-size: 1.4rem;}
.tl {display: flex;flex-direction: column;width: 100%;border-top: .1rem solid #dbe3f0;}
.tl-item {display: grid;grid-template-columns: 20rem minmax(0, 1fr);gap: 4.8rem;padding: 4rem 0;border-bottom: .1rem solid #dbe3f0;transition: padding .4s var(--ease), background .3s;}
.tl-item:hover {padding-left: 1.6rem;background: #f8faff;}
.tl-yr {color: var(--blue);}
.tbl-wrap {width: 100%;overflow-x: auto;}
.tbl {width: 100%;border-collapse: collapse;border-top: .2rem solid var(--navy);}
.tbl th {padding: 2rem 1.6rem;background: var(--ice);font-weight: 700;text-align: center;}
.tbl td {padding: 2rem 1.6rem;border-bottom: .1rem solid #e3e9f2;text-align: center;color: var(--gray);}
.tbl .tbl-tt {text-align: left;font-weight: 500;color: var(--navy);}
.tbl tbody tr {transition: background .2s;}
.tbl tbody tr:hover {background: #f8faff;}
.note {font-size: 1.5rem;color: var(--gray);}
.note a {color: var(--blue);text-decoration: underline;}
.faq {width: 100%;border-top: .2rem solid var(--navy);}
.faq-item {border-bottom: .1rem solid #dbe3f0;}
.faq-q {display: flex;align-items: center;gap: 2rem;width: 100%;padding: 3rem 0;font-size: 2.2rem;font-weight: 700;text-align: left;color: var(--navy);transition: color .3s;}
.faq-q:hover {color: var(--blue);}
.faq-q > span:nth-child(2) {flex: 1;}
.faq-no {color: var(--blue);font-weight: 800;}
.faq-q i {position: relative;flex: none;width: 2.4rem;height: 2.4rem;}
.faq-q i::before, .faq-q i::after {content: '';position: absolute;left: 0;top: 1.1rem;width: 100%;height: .2rem;background: currentColor;transition: rotate .3s;}
.faq-q i::after {rotate: 90deg;}
.faq-q[aria-expanded='true'] i::after {rotate: 0deg;}
.faq-a {padding: 0 0 3.2rem 4.2rem;}
.faq-a:not([hidden]) {animation: fade .4s var(--ease);}
.doc-list {display: flex;flex-direction: column;gap: 2.4rem;width: 100%;}
.doc {display: flex;align-items: center;justify-content: space-between;gap: 2rem;padding: 3.2rem 4rem;background: var(--ice);transition: background .3s, translate .4s var(--ease);}
.doc:hover {background: #e8efff;translate: .8rem 0;}
.doc-btn {flex: none;padding: 1.2rem 2.4rem;border: .1rem solid var(--blue);font-weight: 500;color: var(--blue);}
.doc-btn.is-off {border-color: #c0cadb;color: var(--muted);}
.form {display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 3.2rem 4.8rem;width: 100%;max-width: 120rem;}
.fld {display: flex;flex-direction: column;gap: .8rem;}
.fld-wide {grid-column: 1 / -1;}
.fld label {font-size: 1.6rem;font-weight: 700;}
.fld input[type='text'], .fld input[type='tel'], .fld select, .fld textarea {width: 100%;padding: 1.4rem 1.6rem;border: .1rem solid #cfd8e6;border-radius: 0;background: #fff;font-size: 1.6rem;transition: border-color .3s, box-shadow .3s;}
.fld textarea {min-height: 16rem;resize: vertical;}
.fld input:focus, .fld select:focus, .fld textarea:focus {border-color: var(--blue);box-shadow: 0 0 0 .3rem rgba(36, 92, 255, .18);outline: 0;}
.fld [aria-invalid='true'] {border-color: #d6293e;}
.chk {display: flex;align-items: center;gap: 1rem;font-weight: 500;}
.chk input {width: 2rem;height: 2rem;accent-color: var(--blue);}
.err {min-height: 1.8rem;font-size: 1.3rem;color: #d6293e;}
.done {padding: 2rem;background: var(--tech-bg);border-left: .4rem solid var(--blue);}
@media (max-width: 1280px) {
.d-wrap {gap: 4.8rem;}
.split {gap: 4.8rem;}
}
@media (max-width: 1024px) {
.d-wrap {grid-template-columns: 1fr;}
.d-photo {aspect-ratio: 4 / 3;cursor: default;}
.d-photo .hint {display: none;}
.split {grid-template-columns: 1fr;gap: 4rem;}
.review.cols-4 {grid-template-columns: repeat(2, minmax(0, 1fr));}
.tl-item {grid-template-columns: 12rem minmax(0, 1fr);gap: 2.4rem;}
.form {grid-template-columns: 1fr;}
.sub-tabs ul {gap: 3.2rem;}
.sub-ghost {opacity: .6;}
}
@media (max-width: 768px) {
.cat {gap: 2.4rem;}
.cat button {width: auto;white-space: nowrap;}
.sub-board {padding-block: 5rem 8rem;}
.sub-ghost {display: none;}
.review.cols-2, .review.cols-4 {grid-template-columns: 1fr;}
.tl-item {grid-template-columns: 1fr;gap: .8rem;padding: 3rem 0;}
.doc {flex-direction: column;align-items: flex-start;padding: 2.4rem;}
.faq-q {padding: 2.4rem 0;font-size: 1.8rem;}
.faq-a {padding-left: 0;}
.map-box {min-height: 24rem;}
}