@charset "utf-8";
/* 2026-09-28 : 원본 main.css 형식에 맞춘 속성별 줄바꿈·탭 들여쓰기 : moon0 */

/* 2026-09-27 : B 시안 반응형 디자인·로컬 글꼴·공통 토큰 : moon0 */
@font-face {
	font-family:"Noto Sans KR";
	src:url("fonts/NotoSansKR.woff2") format("woff2");
	font-weight:100 900;
	font-style:normal;
	font-display:swap
}

@font-face {
	font-family:Manrope;
	src:url("fonts/Manrope.woff2") format("woff2");
	font-weight:200 800;
	font-style:normal;
	font-display:swap
}

/* 공통 색상 변수 */
:root {
	--navy:#102c54;
	--blue:#2457a6;
	--ice:#eaf1fa;
	--surface:#f7f9fc;
	--line:#d7e2f0;
	--text:#25364d;
	--muted:#60738d;
	--white:#fff
}

/* 기본 요소와 레이아웃 */
* {
	box-sizing:border-box
}

html {
	scroll-behavior:smooth;
	scroll-padding-top:24px
}

body {
	margin:0;
	color:var(--text);
	font:400 16px/1.7 "Noto Sans KR",sans-serif;
	letter-spacing:-.02em;
	word-break:keep-all;
	background:white
}

a {
	color:inherit;
	text-decoration:none
}

button,input,select {
	font:inherit
}

button,a {
	-webkit-tap-highlight-color:transparent
}

a:hover {
	color:var(--blue)
}

button {
	cursor:pointer
}

img {
	max-width:100%;
	height:auto
}

h1,h2,h3,p {
	margin:0
}

h1,h2,h3 {
	color:var(--navy);
	font-weight:700
}

h2 {
	font-size:32px;
	line-height:1.5;
	letter-spacing:-.035em
}

h3 {
	font-size:21px;
	line-height:1.5
}

p+p {
	margin-top:6px
}

a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible {
	outline:3px solid #4389ee;
	outline-offset:5px
}

button {
	border:0
}

main {
	min-height:60vh
}

.container {
	width:calc(100% - 160px);
	max-width:1280px;
	margin:auto
}

.eyebrow {
	font:700 11px/1.6 Manrope,"Noto Sans KR",sans-serif;
	letter-spacing:.11em;
	color:var(--blue);
	text-transform:uppercase
}

.section {
	padding:72px 0
}

.section-header {
	margin-bottom:32px
}

.section-header .eyebrow {
	margin-bottom:16px
}

.section-header h2+p {
	color:var(--muted);
	margin-top:16px
}

.muted {
	color:var(--muted)
}

.tint {
	background:var(--surface)
}

.ice {
	background:var(--ice)
}

.button {
	min-height:52px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:13px 26px;
	font-weight:700;
	font-size:15px;
	border-radius:5px;
	background:var(--blue);
	color:white;
	gap:12px
}

.button:hover {
	background:#1b4789;
	color:white
}

.button-white {
	background:white;
	color:var(--blue)
}

.button-white:hover {
	background:var(--ice);
	color:var(--navy)
}

.text-link {
	font-size:14px;
	font-weight:700;
	color:var(--blue);
	display:inline-block;
	margin-top:24px
}

.skip-link {
	position:fixed;
	top:-80px;
	left:16px;
	z-index:99;
	padding:12px 24px;
	background:white;
	color:var(--navy)
}

.skip-link:focus {
	top:10px
}

/* 상단 메뉴 */
.site-header {
	background:var(--navy);
	color:white
}

.header-inner {
	display:flex;
	align-items:center;
	justify-content:space-between;
	min-height:88px;
	gap:32px
}

.wordmark {
	font-size:28px;
	font-weight:700;
	letter-spacing:-.05em;
	white-space:nowrap
}

/* 2026-09-28 : 푸터 공통 로고(그레이) : moon0 */
.wordmark-logo {
	display:inline-flex;
	align-items:center;
	line-height:0
}
.footer-brand .wordmark-logo {
	min-width:auto
}
.footer-brand .wordmark-logo img {
	height:40px;
	width:auto;
	display:block
}
.footer-brand .wordmark-logo-gray img {
	filter:grayscale(1);
	opacity:.72
}

.site-header a:hover {
	color:#bfd6ff
}

.primary-nav {
	display:flex;
	align-items:center;
	gap:32px;
	font-size:15px;
	font-weight:500
}

.nav-group {
	position:relative
}

.nav-group summary {
	cursor:pointer;
	list-style:none
}

.nav-group summary::-webkit-details-marker {
	display:none
}

.nav-group summary:after {
	content:"⌄";
	font-size:12px;
	margin-left:8px
}

.nav-panel {
	position:absolute;
	z-index:20;
	top:38px;
	left:-22px;
	width:220px;
	background:white;
	padding:12px;
	box-shadow:0 16px 40px #08172e30;
	border:1px solid var(--line);
	border-radius:6px;
	color:var(--navy)
}

.nav-panel a {
	display:block;
	padding:8px 12px
}

.site-header .nav-panel a:hover {
	color:var(--blue);
	background:var(--ice)
}

/* 2026-09-29 : 예약시스템 드롭다운 분야/지원·기능 구분 : moon0 */
.nav-panel-label {
	margin:0;
	padding:4px 12px 2px;
	font-size:11px;
	font-weight:600;
	letter-spacing:.04em;
	color:var(--muted)
}

.nav-panel-aside {
	margin-top:8px;
	padding:6px 0;
	border-top:1px solid var(--line);
	background:var(--ice);
	border-radius:4px
}

.nav-panel-aside .nav-panel-label {
	padding-top:6px
}

.site-header .nav-panel-aside a:hover {
	background:white
}

.menu-toggle {
	display:none;
	background:transparent;
	color:white
}

/* 메인 비주얼 */
.home-hero {
	background:var(--navy);
	color:white;
	text-align:center;
	padding:48px 0 42px
}

.home-hero h1 {
	font-size:58px;
	line-height:1.33;
	letter-spacing:-.03em;
	color:white;
	margin:24px 0 22px
}

.home-hero .eyebrow {
	color:var(--ice);
	font-size:12px
}

.hero-description {
	font-size:17px;
	color:var(--ice);
	line-height:1.6
}

.hero-actions {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:32px;
	margin-top:38px
}

.hero-actions>a:not(.button) {
	font-size:15px;
	font-weight:500
}

.architecture {
	width:calc(100% - 280px);
	max-width:1160px;
	margin:56px auto 0
}

.domain-row {
	display:grid;
	grid-template-columns:repeat(6,1fr);
	gap:10px
}

.domain-row a {
	border:1px solid var(--blue);
	border-radius:4px;
	padding:12px 2px 10px;
	font-weight:700;
	line-height:1.3;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:6px
}

.domain-row-icon {
	width:32px;
	height:32px;
	display:block;
	object-fit:contain;
	border-radius:4px;
	background:#000
}

.domain-row a:hover {
	background:var(--blue);
	color:white
}

.connector-top {
	--connector-gap:10px;
	--connector-cols:6;
	--connector-inset:calc((100% - (var(--connector-cols) - 1) * var(--connector-gap)) / var(--connector-cols) / 2);
	height:54px;
	position:relative
}

.connector-top-rails {
	display:grid;
	grid-template-columns:repeat(var(--connector-cols),minmax(0,1fr));
	gap:var(--connector-gap);
	height:30px;
	position:relative
}

.connector-top-rails::before {
	content:"";
	position:absolute;
	left:var(--connector-inset);
	right:var(--connector-inset);
	bottom:0;
	height:1.3px;
	background:var(--blue)
}

.connector-top-rails span {
	display:block;
	position:relative;
	min-width:0
}

.connector-top-rails span::after {
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:1.3px;
	background:var(--blue);
	transform:translateX(-50%)
}

.connector-top-stem {
	position:absolute;
	left:50%;
	top:28.7px;
	width:1.3px;
	height:25.3px;
	background:var(--blue);
	transform:translateX(-50%)
}

.platform-core {
	display:block;
	padding:21px;
	background:var(--blue);
	border-radius:7px;
	box-shadow:0 17px 0 -1px var(--navy),0 18px 0 0 var(--blue);
	position:relative;
	z-index:1
}

.platform-core:hover {
	color:white;
	background:#2d63b8
}

.platform-core h2 {
	font-size:27px;
	color:white
}

.platform-core p {
	font-size:14px;
	color:var(--ice);
	margin-top:3px
}

/* 2026-09-29 : 운영 기능 네모 중앙으로 이어지는 연결선 : moon0 */
.connector-bottom {
	--connector-gap:24px;
	--connector-cols:4;
	--connector-inset:calc((100% - (var(--connector-cols) - 1) * var(--connector-gap)) / var(--connector-cols) / 2);
	height:60px;
	position:relative;
	display:flex;
	align-items:flex-end
}

.connector-bottom-stem {
	position:absolute;
	left:50%;
	top:0;
	width:1.3px;
	height:21px;
	background:var(--blue);
	transform:translateX(-50%)
}

.connector-bottom-rails {
	display:grid;
	grid-template-columns:repeat(var(--connector-cols),minmax(0,1fr));
	gap:var(--connector-gap);
	width:100%;
	height:21px;
	position:relative;
	align-self:flex-end
}

.connector-bottom-rails::before {
	content:"";
	position:absolute;
	left:var(--connector-inset);
	right:var(--connector-inset);
	top:0;
	height:1.3px;
	background:var(--blue)
}

.connector-bottom-rails span {
	display:block;
	position:relative;
	min-width:0;
	height:100%
}

.connector-bottom-rails span::after {
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:1.3px;
	background:var(--blue);
	transform:translateX(-50%)
}

.operation-row {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:24px
}

.operation-row a {
	border-radius:5px;
	background:var(--ice);
	padding:20px 10px;
	color:var(--navy)
}

.operation-row h3 {
	font-size:22px
}

.operation-row p {
	font-size:13px
}

.architecture-caption {
	font:500 11px/1.7 Manrope,sans-serif;
	letter-spacing:.09em;
	margin:36px 0 0;
	color:var(--ice)
}

.support {
	padding:36px 0 40px
}

.support-heading {
	display:flex;
	justify-content:space-between;
	align-items:baseline;
	margin-bottom:20px;
	gap:20px
}

.support-heading h2 {
	font-size:22px
}

.support-heading p {
	font-size:14px;
	color:var(--muted)
}

.support-grid {
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:16px
}

.metric,.support-card {
	min-height:244px;
	border-radius:8px;
	padding:24px
}

.metric {
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:16px;
	text-align:center;
	background:var(--ice);
	color:var(--navy)
}

.metric strong {
	white-space:nowrap;
	font:700 40px/1.45 Manrope,sans-serif;
	letter-spacing:-.02em;
	color:var(--blue)
}

.metric strong small {
	font:500 18px "Noto Sans KR",sans-serif
}

.metric p {
	font-size:15px;
	font-weight:500
}

.support-card {
	background:var(--surface);
	border:1px solid var(--line);
	display:flex;
	flex-direction:column;
	gap:12px
}

.support-card h3 {
	font-size:24px
}

.support-card p:not(.eyebrow) {
	font-size:13px;
	color:var(--muted);
	line-height:1.7
}

.support-card .button {
	min-height:44px;
	font-size:14px;
	margin-top:auto;
	padding:9px
}

.footnote {
	font-size:12px;
	color:var(--muted);
	margin-top:22px
}

.split-heading {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:80px;
	align-items:center;
	margin-bottom:42px
}

.split-heading .eyebrow {
	margin-bottom:16px
}

.split-heading h2 {
	font-size:38px
}

.split-heading>p {
	font-size:17px
}

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

.workflow-card {
	padding:30px 28px;
	background:var(--surface);
	min-height:278px;
	display:flex;
	flex-direction:column;
	gap:15px
}

.workflow-card h3 {
	font-size:24px
}

.workflow-card>p:not(.eyebrow) {
	color:var(--muted);
	font-size:15px
}

.workflow-tag {
	background:var(--ice);
	padding:10px;
	text-align:center;
	font-size:14px;
	color:var(--blue);
	margin-top:auto
}

.center-note {
	text-align:center;
	color:var(--muted);
	font-size:13px;
	margin-top:24px
}

.benefits {
	display:grid;
	grid-template-columns: .85fr 1.15fr;
	gap:90px
}

.benefits h2 {
	font-size:35px;
	margin:20px 0
}

.benefit-rows article {
	border-top:1px solid var(--line);
	padding:24px 0
}

.benefit-rows h3 {
	margin-bottom:8px
}

.benefit-rows p {
	font-size:14px
}

/* 하단 안내 영역 */
.cta {
	background:var(--blue);
	color:white;
	padding:52px 0
}

.cta-inner {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:40px;
	min-height:160px
}

.cta .eyebrow {
	color:var(--ice);
	margin-bottom:15px
}

.cta h2 {
	color:white;
	font-size:36px;
	line-height:1.45
}

.cta h2+p {
	font-size:15px;
	color:var(--ice);
	margin-top:16px
}

.cta .button {
	min-width:240px;
	flex-shrink:0
}

/* 푸터 */
.site-footer {
	background:white;
	padding:32px 0;
	color:var(--muted)
}

.footer-brand {
	display:flex;
	gap:44px;
	align-items:center;
	margin-bottom:22px;
	min-height:65px
}

.footer-brand .wordmark {
	color:var(--navy);
	font-size:27px;
	min-width:150px
}

.footer-brand p {
	font-size:14px;
	color:var(--text)
}

.footer-brand .eyebrow {
	font-size:10px;
	color:var(--muted);
	letter-spacing:0
}

.footer-phone {
	margin-left:auto;
	font-size:13px
}

.footer-phone strong {
	display:block;
	color:var(--navy);
	font:700 21px Manrope,sans-serif
}

.footer-legal {
	display:flex;
	gap:40px;
	flex-wrap:wrap;
	margin-bottom:20px;
	color:var(--navy);
	font-size:14px
}

.strong {
	font-weight:700
}

address {
	font-style:normal;
	font-size:13px;
	line-height:2
}

address span {
	padding:0 8px
}

.copyright {
	font-size:12px;
	margin-top:20px
}

.back-top {
	position:fixed;
	bottom:20px;
	right:20px;
	width:42px;
	height:42px;
	display:grid;
	place-items:center;
	background:var(--navy);
	color:white;
	border:1px solid #aec3e1;
	border-radius:50%;
	z-index:10
}

.back-top:hover {
	color:white;
	background:var(--blue)
}

/* 서브페이지 공통 영역 */
.page-hero,.solution-hero {
	background:var(--navy);
	color:white
}

.page-hero {
	padding:28px 0 64px
}

.breadcrumb {
	font-size:12px;
	color:#c4d3e6;
	margin-bottom:36px
}

.intro-grid {
	display:grid;
	grid-template-columns:1fr 350px;
	gap:80px;
	align-items:center;
	min-height:202px
}

.intro-grid h1 {
	font-size:48px;
	color:white;
	line-height:1.45;
	letter-spacing:-.025em
}

.intro-grid p {
	font-size:16px;
	color:var(--ice);
	margin-top:20px
}

.intro-aside {
	background:var(--blue);
	border-radius:8px;
	padding:24px 28px;
	min-height:156px
}

.intro-aside h2 {
	font-size:18px;
	color:white
}

.intro-aside p {
	font-size:14px;
	margin-top:12px
}

.section-tabs {
	border-bottom:1px solid var(--line);
	background:white
}

.section-tabs .container {
	display:grid;
	grid-template-columns:repeat(4,1fr)
}

.section-tabs a {
	padding:22px 0;
	color:var(--muted);
	font-size:15px
}

.section-tabs a:first-child,.section-tabs a:hover {
	color:var(--blue);
	font-weight:700
}

.overview {
	display:grid;
	grid-template-columns:.65fr 1fr;
	gap:100px;
	align-items:start
}

.overview h2 {
	font-size:32px;
	margin:20px 0
}

.overview p {
	color:var(--muted);
	font-size:16px
}

.overview .eyebrow {
	color:var(--blue);
	font-size:12px
}

.structure-list>p {
	font-size:13px;
	color:var(--blue);
	margin-bottom:20px
}

.structure-row {
	display:grid;
	grid-template-columns:32px 170px 1fr;
	gap:20px;
	background:var(--surface);
	padding:26px 30px;
	margin-bottom:16px;
	align-items:center;
	font-size:14px
}

.structure-row small {
	font:500 11px Manrope,sans-serif;
	color:var(--muted)
}

.structure-row strong {
	color:var(--navy);
	font-size:20px
}

.structure-row span {
	color:var(--muted);
	font-size:13px
}

.domain-grid {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:20px
}

.domain-tile {
	padding:24px 14px 22px;
	min-height:124px;
	border:1px solid var(--line);
	background:white;
	border-radius:6px;
	text-align:center;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:8px
}

.domain-tile-icon {
	width:28px;
	height:28px;
	display:block;
	object-fit:contain;
	border-radius:4px;
	background:#000
}

.domain-tile:last-child {
	background:var(--ice)
}

.domain-tile:hover {
	border-color:var(--blue)
}

.domain-tile.on {
	border-color:var(--blue);
	box-shadow:inset 0 0 0 1px var(--blue);
	background:var(--ice)
}

.domain-tile h3 {
	font-size:21px;
	margin:0
}

.domain-tile p {
	font-size:13px;
	margin:0;
	color:var(--muted)
}

.operation-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px 32px
}

.operation-card {
	background:var(--surface);
	border-radius:6px;
	min-height:150px;
	padding:24px
}

.operation-card h3 {
	font-size:22px;
	margin-bottom:10px
}

.operation-card p {
	font-size:15px;
	line-height:1.8
}

.solution-hero {
	padding:16px 0 66px
}

.solution-hero .intro-grid {
	grid-template-columns:1fr 320px
}

.solution-hero .intro-grid h1 {
	font-size:44px;
	margin:22px 0 16px
}

.solution-hero .intro-grid p {
	margin-top:0
}

.solution-hero .intro-grid .lead {
	font-size:23px;
	margin-bottom:12px;
	color:white
}

.solution-hero .eyebrow {
	color:#c6d9f4
}

.solution-hero .intro-aside {
	padding:28px;
	min-height:228px
}

.solution-hero .intro-aside h2 {
	font:700 32px/1.5 Manrope,sans-serif;
	margin:14px 0
}

.solution-hero .intro-aside p {
	font-size:14px;
	margin-top:12px
}

.solution-hero .intro-aside .eyebrow {
	font-size:11px
}

.solution-tabs {
	border-bottom:1px solid var(--line);
	padding:14px 0
}

.tabs-grid {
	display:grid;
	grid-template-columns:repeat(6,1fr);
	gap:8px;
	max-width:1160px
}

.tabs-grid a {
	border:1px solid var(--line);
	border-radius:3px;
	text-align:center;
	font-size:14px;
	font-weight:700;
	padding:14px 4px
}

.tabs-grid a[aria-current],.tabs-grid a:hover {
	background:var(--blue);
	color:white;
	border-color:var(--blue)
}

.solution-flow .split-heading h2 {
	font-size:32px
}

.solution-flow .split-heading>p {
	font-size:16px
}

.demo-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:56px
}

.demo-panel {
	background:var(--surface);
	padding:28px;
	border-radius:6px
}

.demo-top {
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:20px
}

.demo-top h3 {
	font-size:22px
}

.demo-top span {
	font-size:11px;
	color:var(--muted)
}

.demo-steps {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:8px;
	margin:26px 0;
	color:var(--muted);
	font-size:11px;
	pointer-events:none;
	user-select:none
}

.demo-steps span:nth-child(2) {
	color:var(--blue);
	font-weight:700
}

.demo-window {
	background:white;
	border:1px solid var(--line);
	border-radius:4px;
	padding:20px;
	min-height:215px
}

.demo-window h4 {
	font-size:16px;
	color:var(--navy);
	margin:0 0 18px
}

.demo-field {
	padding:10px 12px;
	font-size:12px;
	background:var(--surface);
	color:var(--muted)
}

.demo-line {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:12px;
	margin-top:10px;
	font-size:12px;
	min-height:36px
}

.demo-line strong {
	color:var(--blue);
	font-weight:500;
	pointer-events:none
}

.demo-button {
	background:var(--blue);
	color:white;
	padding:9px 24px;
	display:block;
	margin:20px 0 0 auto;
	border-radius:3px;
	font-size:12px;
	width:fit-content;
	pointer-events:none;
	cursor:default;
	user-select:none
}

.demo-row {
	display:flex;
	justify-content:space-between;
	width:100%;
	padding:10px;
	background:var(--surface);
	color:var(--navy);
	font-size:12px;
	text-align:left;
	margin-top:7px;
	pointer-events:none;
	cursor:default;
	user-select:none;
	box-sizing:border-box
}

.demo-row span {
	color:var(--blue)
}

.capabilities-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0 60px;
	margin-top:50px
}

.capability {
	padding:22px 0;
	border-top:1px solid var(--line);
	min-height:122px
}

.capability h3 {
	font-size:20px;
	margin-bottom:8px
}

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

.guide-button {
	background:none;
	padding:0;
	color:var(--blue);
	font-size:14px;
	font-weight:700;
	margin-top:28px
}

.guide-content {
	padding:32px;
	background:white;
	border:1px solid var(--line);
	margin-top:24px
}

.guide-content img {
	display:block;
	margin:auto
}

/* 2026-09-29 : 예약 가이드 흐름(화면+번호·화살표, 간격 축소·이미지 확대) : moon0 */
.booking-guide-flow {
	display:grid;
	grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);
	grid-template-rows:auto 32px auto;
	grid-template-areas:
		"s1 a12 s2 a23 s3 a34 s4"
		".   .   .   .   .   a45 ."
		".   .   .   .  s6  a56 s5";
	column-gap:18px;
	row-gap:14px;
	align-items:start;
	max-width:1200px;
	margin:0 auto
}

.booking-guide-s1 { grid-area:s1 }
.booking-guide-a12 { grid-area:a12 }
.booking-guide-s2 { grid-area:s2 }
.booking-guide-a23 { grid-area:a23 }
.booking-guide-s3 { grid-area:s3 }
.booking-guide-a34 { grid-area:a34 }
.booking-guide-s4 { grid-area:s4 }
.booking-guide-a45 { grid-area:a45 }
.booking-guide-s5 { grid-area:s5 }
.booking-guide-a56 { grid-area:a56 }
.booking-guide-s6 { grid-area:s6 }

.booking-guide-step {
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:12px;
	margin:0;
	min-width:0
}

.booking-guide-num {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	border-radius:50%;
	background:#f29221;
	color:#fff;
	font:700 14px Manrope,sans-serif;
	box-shadow:0 1px 0 rgba(0,0,0,.08)
}

.booking-guide-step img {
	display:block;
	width:100%;
	max-width:100%;
	height:auto;
	margin:0;
	border:1px solid #d7dde6;
	background:#fff;
	object-fit:contain;
	object-position:top center
}

.booking-guide-arrow {
	width:22px;
	height:22px;
	justify-self:center;
	align-self:center;
	background:#c5ccd6;
	clip-path:polygon(0 20%, 55% 20%, 55% 0, 100% 50%, 55% 100%, 55% 80%, 0 80%)
}

.booking-guide-arrow.is-left {
	transform:rotate(180deg)
}

.booking-guide-arrow.is-down {
	transform:rotate(90deg)
}

/* 2026-09-29 : 3~5단계 가이드는 가로 flex + 화살표 : moon0 */
.booking-guide-flow.is-flex {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
	gap:14px 6px;
	grid-template-columns:none;
	grid-template-rows:none;
	grid-template-areas:none
}
.booking-guide-flow.is-flex .booking-guide-step {
	flex:1 1 170px;
	max-width:240px
}
.booking-guide-flow.is-flex .booking-guide-arrow {
	flex:0 0 22px;
	margin-top:42px
}

.expansion {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:80px;
	align-items:center;
	padding:50px 0
}

.expansion h2 {
	font-size:30px
}

.expansion-diagram {
	display:grid;
	grid-template-columns:1fr 36px 1.65fr;
	gap:12px;
	align-items:center;
	text-align:center
}

.expansion-diagram span {
	padding:16px;
	background:var(--ice);
	color:var(--blue);
	font-weight:700;
	font-size:15px;
	border-radius:3px
}

.expansion-diagram span:first-child {
	background:var(--blue);
	color:white
}

.expansion-diagram b {
	font-size:28px;
	color:var(--blue)
}

.expansion p {
	font-size:14px;
	margin-top:22px
}

.legal-body {
	max-width:960px;
	margin:auto;
	line-height:1.95;
	font-size:15px;
	overflow-wrap:anywhere
}

.legal-body .mgdep01 {
	font-size:24px;
	font-weight:700;
	color:var(--navy);
	margin:30px 0 18px
}

.legal-body .mgdep02 {
	font-size:18px;
	font-weight:700;
	color:var(--navy);
	margin:24px 0 12px
}

.legal-body .mguide {
	padding:24px;
	background:var(--ice);
	margin-bottom:28px
}

.legal-body table {
	border-collapse:collapse;
	width:100%;
	font-size:13px
}

.legal-body th,.legal-body td {
	border:1px solid var(--line);
	padding:12px
}

.original-detail {
	margin-top:40px;
	border:1px solid var(--line);
	padding:22px;
	border-radius:5px
}

.original-detail summary {
	cursor:pointer;
	color:var(--navy);
	font-weight:700
}

.original-detail>div {
	margin-top:24px;
	line-height:1.8
}

.case-toolbar {
	display:flex;
	align-items:end;
	gap:16px;
	flex-wrap:wrap;
	margin-bottom:28px
}

.case-toolbar label {
	display:flex;
	flex-direction:row;
	align-items:center;
	font-size:13px;
	gap:10px
}

.case-toolbar select,.case-toolbar input {
	border:1px solid var(--line);
	background:white;
	border-radius:4px;
	padding:10px 14px
}

.case-toolbar .button {
	min-height:47px
}

.case-list {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:24px
}

.case-card {
	border:1px solid var(--line);
	padding:26px;
	display:flex;
	flex-direction:column;
	gap:15px;
	min-height:220px;
	border-radius:5px
}

.case-card h3 {
	font-size:21px
}

.case-card p {
	font-size:14px;
	color:var(--muted)
}

.case-card span {
	color:var(--blue);
	font-size:13px;
	margin-top:auto
}

.case-empty {
	padding:48px;
	background:var(--surface);
	text-align:center;
	grid-column:1/-1;
	color:var(--muted)
}

.case-body {
	max-width:1000px;
	margin:auto;
	overflow-wrap:anywhere
}

.case-body img {
	max-width:100%;
	height:auto
}

.case-body table {
	max-width:100%
}

.pagination {
	display:flex;
	gap:12px;
	justify-content:center;
	margin-top:32px
}

.pagination a {
	border:1px solid var(--line);
	padding:8px 16px
}

.pagination a[aria-current] {
	background:var(--blue);
	color:white
}

.resource-links {
	display:flex;
	flex-wrap:wrap;
	gap:16px;
	margin-top:28px
}

.resource-links a {
	font-size:14px;
	color:var(--blue);
	border-bottom:1px solid var(--line);
	padding:8px 0
}

.empty-heading {
	padding:80px 0
}

.notice-box {
	border-left:3px solid var(--blue);
	background:var(--ice);
	padding:20px;
	margin-top:28px;
	font-size:14px
}

@media(min-width:1500px) {
	.home-hero {
		padding-bottom:44px
	}
	.architecture {
		margin-top:64px
	}
}

@media(max-width:1100px) {
	.container {
		width:calc(100% - 64px)
	}
	.primary-nav {
		gap:20px;
		font-size:13px
	}
	.architecture {
		width:calc(100% - 80px)
	}
	.split-heading,.overview,.benefits {
		gap:40px
	}
	.overview {
		grid-template-columns:.8fr 1fr
	}
	.structure-row {
		grid-template-columns:24px 110px 1fr;
		gap:12px;
		padding:20px
	}
	.structure-row strong {
		font-size:17px
	}
	.intro-grid {
		gap:40px;
		grid-template-columns:1fr 280px
	}
	.metric strong {
		font-size:30px
	}
	.support-card {
		padding:20px
	}
	.support-card .button {
		font-size:12px
	}
	.demo-grid {
		gap:24px
	}
	.demo-panel {
		padding:20px
	}
	.demo-top {
		display:block
	}
	.demo-top span {
		display:block;
		margin-top:5px
	}
	.cta h2 {
		font-size:30px
	}
	.home-hero h1 {
		font-size:52px
	}
	.footer-brand {
		gap:28px
	}
}

@media(max-width:780px) {
	.container {
		width:calc(100% - 40px)
	}
	.header-inner {
		min-height:72px
	}
	.wordmark {
		font-size:25px
	}
	.menu-toggle {
		display:block;
		padding:8px 0;
		font-size:14px
	}
	.menu-toggle span {
		margin-left:12px
	}
	.primary-nav {
		display:none;
		position:absolute;
		top:72px;
		left:0;
		right:0;
		padding:24px;
		background:var(--navy);
		z-index:30;
		border-top:1px solid #315173;
		align-items:stretch;
		flex-direction:column;
		gap:22px;
		font-size:16px
	}
	.primary-nav.is-open {
		display:flex
	}
	.nav-panel {
		position:static;
		width:100%;
		box-shadow:none;
		margin-top:14px;
		display:grid;
		grid-template-columns:1fr 1fr;
		font-size:14px
	}
	.nav-panel-section {
		display:contents
	}
	.nav-panel-label {
		grid-column:1 / -1
	}
	.nav-panel-aside {
		grid-column:1 / -1;
		margin-top:4px
	}
	.home-hero {
		padding:40px 0 32px
	}
	.home-hero h1 {
		font-size:36px;
		line-height:1.4;
		margin-top:22px
	}
	.home-hero>.container>.eyebrow {
		font-size:9px
	}
	.hero-description {
		font-size:14px
	}
	.hero-actions {
		gap:18px;
		margin-top:28px;
		flex-wrap:wrap
	}
	.hero-actions .button {
		font-size:13px;
		padding:12px 18px
	}
	.hero-actions>a:not(.button) {
		font-size:13px
	}
	.architecture {
		width:calc(100% - 40px);
		margin-top:40px
	}
	.domain-row {
		grid-template-columns:repeat(4,1fr);
		gap:8px
	}
	.domain-row a {
		font-size:12px;
		padding:10px 2px 8px;
		gap:4px
	}
	.domain-row-icon {
		width:28px;
		height:28px
	}
	.connector-top {
		--connector-gap:8px;
		--connector-cols:4;
		height:32px
	}
	.connector-top-rails {
		height:18px
	}
	.connector-top-stem {
		top:16.7px;
		height:15.3px
	}
	.connector-top-rails span:nth-child(n+5) {
		display:none
	}
	.platform-core {
		padding:20px 10px
	}
	.platform-core h2 {
		font-size:21px
	}
	.platform-core p {
		font-size:12px
	}
	.connector-bottom {
		--connector-gap:8px;
		--connector-cols:2;
		height:45px
	}
	.connector-bottom-stem {
		height:16px
	}
	.connector-bottom-rails {
		height:16px
	}
	.connector-bottom-rails span:nth-child(n+3) {
		display:none
	}
	.operation-row {
		gap:8px;
		grid-template-columns:repeat(2,1fr)
	}
	.operation-row a {
		padding:15px 8px
	}
	.operation-row h3 {
		font-size:19px
	}
	.operation-row p {
		font-size:11px
	}
	.architecture-caption {
		font-size:8px;
		margin-top:28px
	}
	.support-heading {
		display:block
	}
	.support-heading h2 {
		font-size:20px
	}
	.support-heading p {
		font-size:12px;
		margin-top:8px
	}
	.support-grid {
		grid-template-columns:repeat(2,minmax(0,1fr));
		gap:12px
	}
	.metric,.support-card {
		min-height:220px;
		padding:20px 14px
	}
	.metric strong {
		font-size:clamp(18px,5.5vw,28px)
	}
	.metric strong small {
		font-size:13px
	}
	.metric p {
		font-size:13px
	}
	.support-card h3 {
		font-size:22px
	}
	.support-card .eyebrow {
		font-size:9px
	}
	.support-card p:not(.eyebrow) {
		font-size:12px
	}
	.support-card .button {
		font-size:11px
	}
	.section {
		padding:48px 0
	}
	.split-heading,.overview,.benefits {
		grid-template-columns:1fr;
		gap:24px
	}
	.split-heading {
		margin-bottom:28px
	}
	.split-heading h2 {
		font-size:29px
	}
	.split-heading>p {
		font-size:15px
	}
	.workflow-grid {
		grid-template-columns:1fr;
		gap:16px
	}
	.workflow-card {
		min-height:240px;
		padding:24px
	}
	.workflow-card h3 {
		font-size:23px
	}
	.benefits h2 {
		font-size:29px
	}
	.cta {
		padding:40px 0
	}
	.cta-inner {
		flex-direction:column;
		align-items:flex-start;
		gap:28px
	}
	.cta h2 {
		font-size:28px
	}
	.cta .button {
		min-width:220px
	}
	.footer-brand {
		flex-wrap:wrap;
		gap:16px
	}
	.footer-brand .wordmark {
		min-width:auto;
		margin-right:12px
	}
	.footer-brand p {
		font-size:12px
	}
	.footer-brand .eyebrow {
		font-size:8px
	}
	.footer-phone {
		margin-left:0;
		display:flex;
		align-items:baseline;
		gap:12px
	}
	.footer-phone strong {
		font-size:18px
	}
	.footer-legal {
		gap:12px 24px;
		font-size:12px
	}
	.site-footer address {
		font-size:11px;
		line-height:2
	}
	.site-footer address span {
		padding:0 4px
	}
	.copyright {
		font-size:10px
	}
	.page-hero {
		padding:22px 0 38px
	}
	.breadcrumb {
		font-size:10px;
		margin-bottom:24px
	}
	.intro-grid,.solution-hero .intro-grid {
		grid-template-columns:1fr;
		gap:28px
	}
	.intro-grid h1 {
		font-size:32px
	}
	.intro-grid p {
		font-size:14px
	}
	.intro-aside {
		min-height:auto;
		padding:22px
	}
	.intro-aside p {
		font-size:13px
	}
	.section-tabs a {
		font-size:12px;
		padding:18px 2px;
		text-align:center
	}
	.overview h2 {
		font-size:28px
	}
	.overview p {
		font-size:14px
	}
	.structure-row {
		grid-template-columns:24px 105px 1fr;
		padding:18px 14px;
		gap:10px
	}
	.structure-row strong {
		font-size:16px
	}
	.structure-row span {
		font-size:12px
	}
	.domain-grid {
		grid-template-columns:1fr 1fr;
		gap:12px
	}
	.domain-tile {
		padding:22px 12px;
		min-height:118px
	}
	.domain-tile h3 {
		font-size:18px
	}
	.domain-tile p {
		font-size:12px
	}
	.section-header h2 {
		font-size:27px
	}
	.section-header h2+p {
		font-size:14px
	}
	.operation-grid {
		grid-template-columns:1fr;
		gap:16px
	}
	.operation-card h3 {
		font-size:20px
	}
	.operation-card p {
		font-size:14px
	}
	.solution-hero {
		padding:14px 0 36px
	}
	.solution-hero .intro-grid h1 {
		font-size:31px;
		margin:18px 0 12px
	}
	.solution-hero .intro-grid .lead {
		font-size:18px
	}
	.solution-hero .intro-grid p {
		font-size:14px
	}
	.solution-hero .intro-aside {
		min-height:auto;
		padding:22px
	}
	.solution-hero .intro-aside h2 {
		font-size:25px;
		margin:8px 0
	}
	.solution-hero .intro-aside p {
		margin-top:8px
	}
	.tabs-grid {
		grid-template-columns:repeat(4,1fr);
		gap:7px
	}
	.tabs-grid a {
		font-size:12px;
		padding:9px 2px
	}
	.solution-flow .split-heading h2 {
		font-size:28px
	}
	.solution-flow .split-heading>p {
		font-size:14px
	}
	.demo-grid {
		grid-template-columns:1fr;
		gap:20px
	}
	.demo-top {
		display:flex
	}
	.demo-top h3 {
		font-size:20px
	}
	.demo-top span {
		font-size:10px
	}
	.demo-steps {
		font-size:10px;
		gap:4px
	}
	.demo-window {
		padding:16px
	}
	.capabilities-grid {
		grid-template-columns:1fr;
		gap:0;
		margin-top:30px
	}
	.capability {
		min-height:110px
	}
	.capability h3 {
		font-size:19px
	}
	.expansion {
		grid-template-columns:1fr;
		gap:28px;
		padding:40px 0
	}
	.expansion h2 {
		font-size:27px
	}
	.expansion-diagram {
		grid-template-columns:1fr 24px 1.6fr;
		gap:8px
	}
	.expansion-diagram span {
		font-size:12px;
		padding:13px 8px
	}
	.guide-content {
		padding:16px 12px
	}
	.booking-guide-flow:not(.is-flex) {
		grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);
		grid-template-rows:auto;
		grid-template-areas:
			"s1 a12 s2"
			"s3 a34 s4"
			"s5 a56 s6";
		column-gap:12px;
		row-gap:18px
	}
	.booking-guide-flow:not(.is-flex) .booking-guide-a23,
	.booking-guide-flow:not(.is-flex) .booking-guide-a45 {
		display:none
	}
	/* 모바일 2열: 각 행은 오른쪽 화살표(1→2, 3→4, 5→6) */
	.booking-guide-flow:not(.is-flex) .booking-guide-a34.is-right,
	.booking-guide-flow:not(.is-flex) .booking-guide-a56.is-left {
		transform:none
	}
	.booking-guide-flow.is-flex .booking-guide-step {
		flex-basis:44%;
		max-width:48%
	}
	.booking-guide-flow.is-flex .booking-guide-arrow {
		flex-basis:18px;
		margin-top:36px
	}
	.legal-body {
		font-size:14px
	}
	.legal-body .mguide {
		padding:18px
	}
	.legal-body table {
		display:block;
		overflow-x:auto
	}
	.case-list {
		grid-template-columns:1fr
	}
	.case-empty {
		padding:32px 20px
	}
	.case-toolbar {
		align-items:stretch
	}
	.case-toolbar label {
		flex:1
	}
	.back-top {
		width:36px;
		height:36px;
		right:12px;
		bottom:12px
	}
	.case-body {
		overflow-x:auto
	}
}

@media(prefers-reduced-motion:reduce) {
	html {
		scroll-behavior:auto
	}
	* {
		animation:none!important;
		transition:none!important
	}
}

/* 2026-09-28 : 원본 상세자료·고객지원·연혁의 반응형 보완 : moon0 */
.original-detail table {
	border-collapse:collapse;
	width:100%;
	font-size:14px
}

.original-detail th,.original-detail td {
	border:1px solid var(--line);
	padding:12px
}

.original-detail h3 {
	font-size:23px;
	font-weight:700;
	color:var(--navy);
	margin:28px 0 15px
}

.original-detail ul {
	padding-left:24px
}

/* 2026-09-29 : 상세 탭 목록은 번호 텍스트만 표시, 기본 불릿 제거 : moon0 */
.original-detail .sctab_list {
	padding-left:0;
	list-style:none
}
.original-detail .sctab_list > li {
	list-style:none
}

.original-detail img {
	max-width:100%;
	height:auto
}

.original-detail iframe {
	max-width:100%
}

.support-resources {
	margin-top:52px
}

.faq-item {
	border-bottom:1px solid var(--line)
}

.faq-item summary {
	padding:24px 0;
	cursor:pointer;
	color:var(--navy);
	font-weight:700;
	list-style:none
}

.faq-item summary:after {
	content:'+';
	float:right;
	color:var(--blue)
}

.faq-item[open] summary:after {
	content:'−'
}

.faq-item summary span {
	display:inline-block;
	margin-right:20px;
	color:var(--muted);
	font-size:13px;
	font-weight:400
}

.faq-answer {
	background:var(--surface);
	padding:26px;
	margin-bottom:20px;
	font-size:15px;
	line-height:1.9;
	white-space:normal;
	overflow-wrap:anywhere
}

.history-block {
	margin-top:48px
}

/* 2026-09-28 : 연혁 연도별 접기·카드 구성 : moon0 */
.history-years {
	display:grid;
	gap:12px;
	margin-top:8px
}
.history-year {
	border:1px solid var(--line);
	border-radius:18px;
	background:#fff;
	overflow:hidden
}
.history-year>summary {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	padding:16px 20px;
	cursor:pointer;
	list-style:none;
	background:linear-gradient(135deg, #f7fafc 0%, #eef5ff 100%)
}
.history-year>summary::-webkit-details-marker {
	display:none
}
.history-year-badge {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:88px;
	padding:8px 14px;
	border-radius:999px;
	background:var(--navy);
	color:#fff;
	font:700 18px Manrope,sans-serif;
	letter-spacing:.02em
}
.history-year-meta {
	display:inline-flex;
	align-items:center;
	gap:8px;
	color:var(--muted);
	font-size:13px
}
.history-year-meta strong {
	color:var(--blue);
	font:700 16px Manrope,sans-serif
}
.history-year[open]>summary .history-year-meta span {
	transform:rotate(180deg)
}
.history-year-meta span {
	display:inline-block;
	transition:transform .2s ease
}
.history-cards {
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
	gap:12px;
	padding:16px 18px 18px;
	margin:0;
	list-style:none;
	background:#fff
}
.history-card {
	border:1px solid #e4edf7;
	border-radius:14px;
	padding:14px 16px;
	background:linear-gradient(180deg, #fff 0%, #f8fbff 100%);
	box-shadow:0 1px 0 rgba(16,44,84,.04)
}
.history-card h3 {
	font-size:15px;
	line-height:1.45;
	color:var(--navy)
}
.history-card p {
	margin-top:8px;
	font-size:13px;
	line-height:1.55;
	color:var(--muted);
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	overflow:hidden
}

.support-heading .text-link {
	margin-top:0
}

@media(max-width:780px) {
	.original-detail {
		padding:16px
	}
	.original-detail table {
		display:block;
		overflow-x:auto
	}
	.original-detail>div {
		overflow-wrap:anywhere
	}
	.history-year>summary {
		padding:14px 16px
	}
	.history-year-badge {
		min-width:76px;
		font-size:16px
	}
	.history-cards {
		grid-template-columns:1fr;
		padding:12px 14px 14px
	}
	.faq-item summary span {
		display:block;
		margin-bottom:8px
	}
	.faq-answer {
		padding:18px
	}
	.support-heading .text-link {
		margin-top:10px
	}
}

/* 2026-09-28 : 통합예약 플랫폼 상세자료 카드·표 구성 : moon0 */
.platform-detail {
	display:grid;
	gap:36px
}
.platform-detail-block h3 {
	font-size:22px;
	margin-bottom:14px;
	color:var(--navy)
}
.platform-detail-block>p {
	font-size:15px;
	color:var(--text);
	margin-bottom:18px
}
.platform-feature-grid {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:14px
}
.platform-feature-card {
	border:1px solid #e4edf7;
	border-radius:16px;
	padding:18px 18px 16px;
	background:linear-gradient(180deg, #fff 0%, #f8fbff 100%);
	box-shadow:0 1px 0 rgba(16,44,84,.04)
}
.platform-feature-wide {
	grid-column:1 / -1
}
.platform-feature-num {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:42px;
	padding:4px 10px;
	border-radius:999px;
	background:var(--navy);
	color:#fff;
	font:700 12px Manrope,sans-serif;
	letter-spacing:.04em
}
.platform-feature-card h4 {
	margin-top:10px;
	font-size:17px;
	color:var(--navy)
}
.platform-feature-card>p {
	margin-top:8px;
	font-size:14px;
	color:var(--muted);
	line-height:1.6
}
.platform-chip-list,
.platform-point-list {
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin:14px 0 0;
	padding:0;
	list-style:none
}
.platform-chip-list li {
	padding:6px 10px;
	border-radius:999px;
	background:#eef5ff;
	color:var(--navy);
	font-size:12px;
	font-weight:600
}
.platform-point-list {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:8px 14px
}
.platform-point-list li {
	position:relative;
	padding-left:14px;
	font-size:13px;
	color:var(--text);
	line-height:1.5
}
.platform-point-list li:before {
	content:"";
	position:absolute;
	left:0;
	top:.55em;
	width:6px;
	height:6px;
	border-radius:50%;
	background:var(--blue)
}
.platform-sub-table {
	width:100%;
	margin-top:14px;
	border-collapse:collapse;
	font-size:13px;
	background:#fff
}
.platform-sub-table caption {
	caption-side:top;
	text-align:left;
	padding:0 0 8px;
	font-size:12px;
	font-weight:700;
	color:var(--muted)
}
.platform-sub-table th,
.platform-sub-table td {
	border:1px solid #e4edf7;
	padding:10px 12px;
	vertical-align:top;
	text-align:left;
	line-height:1.55
}
.platform-sub-table thead th {
	background:#f3f7fc;
	color:var(--navy);
	font-weight:700
}
.platform-sub-table tbody th {
	width:28%;
	background:#fafcfe;
	color:var(--navy);
	font-weight:700
}
.platform-tech-grid {
	display:grid;
	grid-template-columns:220px 1fr;
	gap:20px;
	align-items:start
}
.platform-tech-visual {
	border:1px solid #e4edf7;
	border-radius:16px;
	padding:16px;
	background:#fff;
	text-align:center
}
.platform-tech-visual img {
	max-width:100%;
	height:auto
}
.platform-video {
	position:relative;
	width:100%;
	padding-top:56.25%;
	border-radius:14px;
	overflow:hidden;
	background:#102c54
}
.platform-video iframe {
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	border:0
}
.platform-detail .dia_img {
	margin-top:12px
}
.platform-detail .dia_img img {
	max-width:100%;
	height:auto;
	border-radius:12px
}

/* 2026-09-29 : 예약/발권 흐름도 HTML/CSS 재구성 : moon0 */
.ticket-flow {
	--flow-accent:#f15a24;
	--flow-line:#c5c5c5;
	--flow-link:80px;
	display:grid;
	grid-template-columns:minmax(160px,200px) minmax(120px,150px) minmax(160px,200px);
	justify-content:center;
	column-gap:var(--flow-link);
	row-gap:0;
	align-items:center;
	margin-top:16px;
	padding:24px 28px;
	background:#f3f3f3;
	border-radius:12px
}
.ticket-flow-col {
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:28px;
	min-width:0
}
.ticket-flow-dst {
	align-items:center
}
.ticket-flow-circle {
	position:relative;
	width:100%;
	aspect-ratio:1;
	margin:0 auto;
	border:1px solid var(--flow-accent);
	border-radius:50%;
	background:#fff;
	overflow:hidden;
	text-align:center
}
.ticket-flow-circle strong {
	display:flex;
	align-items:center;
	justify-content:center;
	height:38%;
	padding:8px 10px 4px;
	background:var(--flow-accent);
	color:#fff;
	font-size:15px;
	font-weight:700;
	line-height:1.3
}
.ticket-flow-circle ul,
.ticket-flow-circle p {
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:4px;
	height:62%;
	margin:0;
	padding:8px 12px 12px;
	list-style:none;
	font-size:13px;
	font-weight:600;
	color:#333;
	line-height:1.35
}
.ticket-flow-circle li:before {
	content:"- ";
	font-weight:500
}
.ticket-flow-mid {
	gap:20px
}
.ticket-flow-box {
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:48px;
	margin:0;
	padding:12px 8px;
	border:1px solid #bdbdbd;
	border-radius:8px;
	background:#fff;
	font-size:14px;
	font-weight:700;
	color:#333;
	box-shadow:0 1px 0 rgba(0,0,0,.04)
}
.ticket-flow-in,
.ticket-flow-out {
	position:absolute;
	top:50%;
	width:var(--flow-link);
	height:12px;
	transform:translateY(-50%);
	pointer-events:none
}
.ticket-flow-in {
	right:100%
}
.ticket-flow-out {
	left:100%
}
/* 점선 */
.ticket-flow-in:before,
.ticket-flow-out:before {
	content:"";
	position:absolute;
	top:50%;
	left:0;
	right:8px;
	border-top:2px dashed var(--flow-line);
	transform:translateY(-50%)
}
/* 정삼각 화살촉 */
.ticket-flow-in:after,
.ticket-flow-out:after {
	content:"";
	position:absolute;
	top:50%;
	right:0;
	width:0;
	height:0;
	border-style:solid;
	border-width:5px 0 5px 8px;
	border-color:transparent transparent transparent var(--flow-accent);
	transform:translateY(-50%)
}

/* 2026-09-29 : 통합관리 흐름도 HTML/CSS 재구성 : moon0 */
.integ-diagram {
	--integ-accent:#f15a24;
	margin-top:16px;
	padding:8px 4px 4px;
	text-align:center
}
.integ-diagram-items {
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:10px;
	margin:0;
	padding:0;
	list-style:none
}
.integ-diagram-items li {
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:72px;
	padding:18px 8px 12px;
	border:1px solid var(--integ-accent);
	border-radius:6px;
	background:#fff;
	box-sizing:border-box
}
.integ-diagram-num {
	position:absolute;
	top:-11px;
	left:50%;
	transform:translateX(-50%);
	width:22px;
	height:22px;
	border-radius:50%;
	background:var(--integ-accent);
	color:#fff;
	font-size:12px;
	font-weight:700;
	line-height:22px;
	text-align:center
}
.integ-diagram-label {
	font-size:13px;
	font-weight:700;
	color:#333;
	line-height:1.35
}
.integ-diagram-label small {
	display:inline-block;
	margin-top:2px;
	font-size:11px;
	font-weight:500;
	color:#666
}
.integ-diagram-hub {
	position:relative;
	z-index:1;
	width:148px;
	height:148px;
	margin:28px auto 0;
	display:flex;
	align-items:center;
	justify-content:center;
	border:2px solid var(--integ-accent);
	border-radius:50%;
	background:#fff;
	box-shadow:0 0 0 6px #fff,0 0 0 8px var(--integ-accent);
	font-size:15px;
	font-weight:700;
	color:#333;
	line-height:1.35
}
.integ-diagram-hub:before {
	content:"";
	position:absolute;
	left:50%;
	bottom:100%;
	width:120%;
	height:36px;
	transform:translateX(-50%);
	background:linear-gradient(to top,rgba(241,90,36,.12),transparent);
	clip-path:polygon(15% 100%,85% 100%,100% 0,0 0);
	z-index:-1;
	pointer-events:none
}

@media(max-width:900px) {
	.platform-feature-grid,
	.platform-point-list,
	.platform-tech-grid {
		grid-template-columns:1fr
	}
	.ticket-flow {
		grid-template-columns:1fr;
		gap:16px;
		padding:16px 12px 20px
	}
	.ticket-flow-src,
	.ticket-flow-mid {
		flex-direction:row;
		flex-wrap:wrap;
		justify-content:center;
		gap:12px
	}
	.ticket-flow-circle {
		width:min(46%,168px)
	}
	.ticket-flow-box {
		flex:1 1 140px
	}
	.ticket-flow-in,
	.ticket-flow-out {
		display:none
	}
	.ticket-flow-dst .ticket-flow-circle {
		width:min(56%,180px)
	}
	.integ-diagram-items {
		grid-template-columns:repeat(2,minmax(0,1fr));
		gap:14px 10px
	}
	.integ-diagram-hub {
		width:120px;
		height:120px;
		font-size:13px;
		margin-top:22px
	}
}

/* 2026-09-29 : 특수기능 상세자료 테이블·구성도 CSS : moon0 */
.expert-detail .sctab_list {
	display:flex;
	flex-wrap:wrap;
	gap:8px 18px;
	margin:0 0 8px;
	padding:0;
	border-bottom:1px solid var(--line)
}
.expert-detail .sctab_list > li {
	margin:0;
	padding:0 0 10px
}
.expert-detail .sctab {
	display:inline-block;
	font-size:14px;
	font-weight:700;
	color:var(--muted)
}
.expert-detail .sctab_list > li.active .sctab {
	color:var(--navy)
}
.expert-table-wrap {
	overflow-x:auto;
	-webkit-overflow-scrolling:touch
}
.expert-spec-tb,
.expert-comp-tb {
	width:100%;
	border-collapse:collapse;
	font-size:14px;
	line-height:1.55
}
.expert-spec-tb caption,
.expert-comp-tb caption {
	position:absolute;
	width:1px;
	height:1px;
	overflow:hidden;
	clip:rect(0,0,0,0)
}
.expert-spec-tb th,
.expert-spec-tb td,
.expert-comp-tb th,
.expert-comp-tb td {
	border:1px solid var(--line);
	padding:14px 16px;
	vertical-align:top;
	text-align:left
}
.expert-spec-tb thead th,
.expert-comp-tb thead th {
	background:#f4f7fb;
	color:var(--navy);
	font-weight:700;
	text-align:center;
	vertical-align:middle
}
.expert-spec-tb tbody th,
.expert-comp-tb tbody th {
	width:18%;
	background:#fafbfd;
	color:var(--navy);
	font-weight:700;
	vertical-align:middle
}
.expert-spec-shot {
	width:24%;
	text-align:center;
	vertical-align:middle!important;
	background:#fff
}
.expert-spec-shot img {
	display:block;
	width:100%;
	max-width:220px;
	height:auto;
	margin:0 auto;
	border:1px solid var(--line);
	border-radius:6px;
	background:#fff
}
.expert-spec-tb td ul,
.expert-comp-tb td ul {
	margin:0;
	padding-left:18px
}
.expert-spec-tb td li + li {
	margin-top:6px
}
.expert-comp-tb thead th:nth-child(2),
.expert-comp-tb tbody td:nth-child(2) {
	text-align:center;
	color:#6b7280
}
.expert-comp-tb thead th:nth-child(3),
.expert-comp-tb tbody td:nth-child(3) {
	text-align:center
}
.expert-comp-tb td.is-yes {
	color:#0f6b4c;
	font-weight:700
}
.exper-arch {
	--arch-accent:#f29221;
	display:grid;
	grid-template-columns:minmax(0,1.35fr) 56px minmax(0,1fr);
	gap:16px;
	align-items:stretch;
	margin-top:12px;
	padding:22px;
	background:#f3f4f6;
	border-radius:12px
}
.exper-arch-front {
	display:grid;
	grid-template-columns:1fr 1.15fr;
	gap:12px;
	padding:14px;
	background:#e8eaee;
	border-radius:10px
}
.exper-arch-col,
.exper-arch-back {
	display:flex;
	flex-direction:column;
	gap:12px;
	min-width:0
}
.exper-arch-card {
	margin:0;
	background:#fff;
	border:1px solid #d7dde6;
	border-radius:8px;
	overflow:hidden
}
.exper-arch-card h4 {
	margin:0;
	padding:10px 12px;
	background:var(--arch-accent);
	color:#fff;
	font-size:14px;
	font-weight:700;
	text-align:center
}
.exper-arch-card p,
.exper-arch-card ul {
	margin:0;
	padding:14px 16px;
	font-size:13px;
	font-weight:600;
	color:#333;
	line-height:1.45;
	text-align:center
}
.exper-arch-card ul {
	list-style:none;
	text-align:left
}
.exper-arch-card li {
	position:relative;
	padding-left:12px
}
.exper-arch-card li + li {
	margin-top:5px
}
.exper-arch-card li:before {
	content:"-";
	position:absolute;
	left:0;
	color:#888
}
.exper-arch-link {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:14px
}
.exper-arch-arrow {
	display:block;
	width:36px;
	height:18px;
	background:#9aa3af;
	clip-path:polygon(0 25%, 58% 25%, 58% 0, 100% 50%, 58% 100%, 58% 75%, 0 75%)
}
.exper-arch-arrow.is-in {
	background:#3b82c4;
	transform:scaleX(-1)
}
.exper-arch-arrow.is-out {
	background:#9aa3af
}
@media (max-width:900px) {
	.exper-arch {
		grid-template-columns:1fr;
		gap:12px
	}
	.exper-arch-link {
		flex-direction:row;
		padding:4px 0
	}
	.exper-arch-arrow.is-in {
		transform:rotate(-90deg) scaleX(-1)
	}
	.exper-arch-arrow.is-out {
		transform:rotate(90deg)
	}
	.expert-spec-tb thead {
		display:none
	}
	.expert-spec-tb,
	.expert-spec-tb tbody,
	.expert-spec-tb tr,
	.expert-spec-tb th,
	.expert-spec-tb td {
		display:block;
		width:100%
	}
	.expert-spec-tb tr {
		margin-bottom:14px;
		border:1px solid var(--line);
		border-radius:8px;
		overflow:hidden
	}
	.expert-spec-tb tbody th,
	.expert-spec-tb td {
		border:0;
		border-top:1px solid var(--line)
	}
	.expert-spec-tb tbody th {
		width:auto;
		border-top:0;
		background:#f4f7fb
	}
	.expert-spec-shot {
		width:auto
	}
}

/* 2026-09-28 : 실제 집계 숫자 길이로 320px 모바일 통계 폭 검증 : moon0 */