@font-face {
	font-family: 'Pretendard';
	src: url('/fonts/Pretendard.woff') format('woff');
	font-display: swap;
}

:root {
	--font-family-main: 'Pretendard', 'Malgun Gothic', sans-serif;
	
	--about-navy: #2e2f5b;
	--about-text: #383434;
	--about-divider: #383434;
	
	--poda-orange: #ff6d00;
	--poda-orange-2: #ff9201;
	--poda-orange-3: #f68f37;
	--poda-card-bg: #fdf8ee;
	--poda-card-border: #38343433;
	--poda-text: #383434;
	--poda-text-light: #383434;

	--kkk-navy: #183857;
	--kkk-blue: #357abd;
	--kkk-text: #383434;
	--kkk-text-light: #383434;
	
	--kai-navy: #0C2A4A;
	--kai-accent: #2e2f5b;
	--kai-blue: #0c447c;
	--kai-heading: #181b38;
	--kai-text: #383434;
	--kai-text-light: #817979;
	--kai-light-bg: #f9f9f9;
	--kai-subtext: #95b4d4;
	--kai-reason-bg: rgba(217, 217, 217, 0.5);
	
	--dopple-text: #383434;
	--dopple-text-light: #383434;
	--dopple-navy: #28293b;
	--dopple-body-bg: #6e6f83;
	--dopple-border: #dddddd;
	--dopple-accent-1: #99a6ec;
	--dopple-accent-2: #d7b3fd;
	--dopple-accent-3: #f5a5d1;
	--dopple-accent-4: #f7a0ab;
	--dopple-accent-5: #f6ce4c;
	--dopple-accent-6: #6de5b6;

	--notice-text: #383434;
	--notice-text-sub: #383434;
	--notice-border: #e2e2e2;
	--notice-navy: #2e2f5b;
	--notice-num-bg: #f1f1f1;

	--admin-navy: #2e2f5b;
	--admin-navy-dark: #22233f;
	--admin-text: #383434;
	--admin-text-light: #8a8a8a;
	--admin-border: #e2e2e6;
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-family: var(--font-family-main);
	letter-spacing: -0.02em;
	-webkit-tap-highlight-color: transparent;
}

li {
	list-style-type: none;
}

section {
    margin: 40px 50px;
    padding: 200px 10px;
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

body {
    text-align: center;
    background-color: #f8f9fa;
    padding-top: 130px;
}

img { max-width:100%; }

button {
	border: none;
	cursor: pointer;
}

.mobile-only {
    display: none;
}

.divider {
    width: 1px;
    height: 800px;
    background-color: rgba(56, 52, 52, 0.5);
    margin: 0 auto;
    animation: divider-darken linear;
    animation-timeline: view();
}

@keyframes divider-darken {
    to {
        background-color: rgba(56, 52, 52, 1);
    }
}

.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 40px 50px 20px;
    background-color: #ffffff;
    border-bottom: 1px solid #e0e0e0;
    position: fixed;
    top: 0;
    width: 100%;
    height: 130px;
    z-index: 1000;
    overflow: visible;
}

.header_logo {
    display: flex;
    align-items: center;
}

.header_logo img {
    height: 50px;
    object-fit: contain;
}

.header_nav {
    position: relative;
}

.header_menu {
    position: relative;
    display: flex;
    gap: 100px;
    padding: 0;
    list-style: none;
    margin: 0;
}

.header_menu-item {
	padding-top: 20px;
    position: relative;
    padding-bottom: 20px;
}

.header_menu-link {
    font-size: 24px;
    font-weight: 600;
    color: #383434;
    text-decoration: none;
    cursor: pointer;
}

.header_menu-link:hover {
    color: #666666;
    text-decoration: underline;
}

.header_dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding-top: 30px;
    z-index: 2;
    list-style: none;
    margin: 0;
}

.header_nav:hover .header_dropdown-bg {
    display: block;
}

.header_dropdown a {
    display: inline-block;
    text-decoration: none;
    color: #383434;
    font-size: 20px;
    font-weight: 500; 
    padding: 12px 20px;
    border-radius: 10px;
    white-space: nowrap;
}

.header_dropdown-bg {
    display: none;
    position: absolute;
    top: 100%;
    left: -30px;
    right: -30px;
    height: 270px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 1;
}

.header_nav:hover .header_dropdown {
	display: flex;
}

.header_menu_mobile {
    display: none;
    background: none;
    border: none;
    font-size: 28px;
    color: #28293B;
    cursor: pointer;
}

.header_menu_close {
    display: none;
    background: none;
    border: none;
    font-size: 28px;
    color: #28293B;
    cursor: pointer;
}

.hero {
    width: 100%;
    height: calc(100vh - 130px);
    background-color: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.page-hero {
    position: relative;
}

.page-hero-bg {
    width: 100%;
    height: 400px;
    object-fit: cover;
}

.page-hero-title {
    position: absolute;
    left: 40px;
    bottom: 40px;
    font-size: 46px;
    font-weight: 700;
    color: #ffffff;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.footer {
    position: relative;
    background-color: #28293b;
    padding: 40px 40px 40px;
    text-align: center;
    color: #ffffff;
}

.footer_container {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
}

.footer_logo {
    width: 70px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.footer_policy {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.policy-link {
    color: rgba(255, 255, 255, 0.85);
    font-size: 15px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.policy-link:hover {
    color: #ffffff;
}

.policy-link.font-bold {
    font-weight: 700;
    color: #ffffff;
}

.policy-link-text {
    color: #2563eb;
    text-decoration: underline;
    text-underline-offset: 4px;
    font-weight: 700;
    transition: color 0.2s ease;
}

.policy-link-text:hover {
    color: #1d4ed8;
}

.footer_info {
    text-align: left; 
}

.footer_text_row {
    margin-bottom: 8px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
}

.footer_text {
    display: inline-block;
}

.footer-divider-v {
    margin: 0 10px;
    color: rgba(255, 255, 255, 0.2);
    font-size: 12px;
}

.footer_top {
    position: fixed;
    right: 50px;
    bottom: 50px;
    display: flex;
    opacity:0; 
    visibility:hidden; 
    pointer-events:none;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s ease;
    width: 60px;
    height: 60px;
    gap: 8px;
    padding: 10px;
    background-color: rgba(46, 47, 91, 0.5);
    border-radius: 50%;
    border: none;
    color: #ffffff;
    font-size: 16px;
    cursor: pointer;
}

.footer_top.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

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

.reveal.is-visible {
    opacity: 1;
    transform: none;
}

.hero-image-mobile {
    display: none;
}

.hero-image {  
    display: block;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    margin-top: -130px; 
    padding-top: 130px;  
}

.hero-image img {
    width: 100%;
    height: calc(100vh - 130px);  
    object-fit: cover;
}


body.about-page {
    background-color: #ffffff;
}

.about-headline {
    font-size: 44px;
    font-weight: 600;
    color: var(--about-text);
    line-height: 1.3;
}

.header_menu-link.active {
    text-decoration: underline;
    position: relative;
    color: #2e2f5b;
    font-weight: 800;
}

.about_logo {
	width: 100%;
    max-width: 180px;
	height: auto;
	margin-bottom: 100px;
}

.about-intro .about-headline {
    margin-bottom: 40px;
}

.about-body {
    font-size: 24px;
    line-height: 1.6;
    color: var(--about-text);
}

.about-body p {
    margin-bottom: 28px;
}

.about-strength {
    display: flex;
    justify-content: space-between;
    gap: 50px;
    flex-direction: column;
}

.about-strength-text {
    flex: 0 0 auto;
    text-align: center;
}

.about-lead {
    margin-top: 24px;
    font-size: 24px;
    line-height: 1.6;
    color: var(--about-text);
    text-align: center;
}

.strength-cards {
    display: flex;
    flex: 1;
    gap: 50px;
    margin: auto;
}

.strength-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.strength-col.offset {
    margin-top: 200px;
}

.strength-col > div {
    background-color: #f9f9f9;
    border-radius: 20px;
    box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
    padding: 20px;
    text-align: center;
    margin: 30px 0;
    width: 100%;
    max-width: 350px; 
    height: auto;
}

.strength-card-img {
    width: 100%;
    aspect-ratio: 320 / 213;
    object-fit: cover;
    border-radius: 20px;
}

.strength-card-title {
    margin-top: 24px;
    font-size: 24px;
    font-weight: 700;
    color: var(--about-text);
}

.strength-card-desc {
    margin-top: 24px;
    font-size: 20px;
    line-height: 1.5;
    color: var(--about-text);
}

.about-management .about-headline {
    margin-bottom: 150px;
    text-align: center;
}

.exec-list {
    display: flex;
    flex-direction: column;
    gap: 100px;
    align-items: center;
}

.exec-card {
    display: flex;
    gap: 40px;
}

.exec-photo {
    flex: 0 0 auto;
    width: 230px;
}

.exec-info {
    flex: 1 1 auto;
    max-width: 750px;
    text-align: left;
}

.exec-name {
    font-size: 40px;
    font-weight: 500;
    color: var(--about-text);
    margin-bottom: 30px;
}

.exec-title {
    font-size: 25px;
    margin-left: 8px;
}

.exec-career-label {
    font-size: 26px;
    font-weight: 600;
    color: var(--about-text);
    margin-bottom: 16px;
}

.exec-develop-label {
    font-size: 25px;
    font-weight: 600;
    color: var(--about-text);
    margin-bottom: 16px;
}

.exec-lecture-label {
    font-size: 25px;
    font-weight: 600;
    color: var(--about-text);
    margin-top: 30px;
    margin-bottom: 16px;
}

.exec-table {
    width: 100%;
    table-layout: fixed
}

.timeline-date {
    padding: 10px 0;
    font-size: 22px;
    font-weight: 500;
    width: 220px;
    color: var(--about-text);
}

.timeline-desc{
    font-size: 22px;
    color: var(--about-text);
}

.about-vision .about-headline {
    margin-bottom: 150px;
}

.vision-list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    max-width: 1000px; 
    margin: 0 auto;
}

.vision-item{
	text-align: left;
}

.vision-num {
    font-size: 30px;
    font-weight: 700;
    color: var(--about-text);
    margin-bottom: 24px;
}

.vision-sub {
    font-size: 24px;
    font-weight: 700;
    color: var(--about-text);
    margin-bottom: 20px;
}

.vision-desc {
    font-size: 24px;
    line-height: 1.6;
    color: var(--about-text);
}

.about-bi .about-headline {
    margin-bottom: 150px;
}

.bi-list{
    display: flex;
    flex-direction: column;
    gap: 80px;
    max-width: 1000px; 
    margin: 0 auto;
    text-align: left;
}

.bi-subhead {
    font-size: 30px;
    font-weight: 600;
    color: #383434;
    position: relative;
    margin-bottom: 30px;
}

.bi-design {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
    margin: 10px auto;
}

.bi-colors {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
    margin: 10px auto;  
}

.bi-design img,
.bi-colors img {
    max-width: 100%;
    height: auto;
}

.bi-concept p {
    font-size: 24px;
    line-height: 1.8;
    color: #383434
}

.bi-concept p:last-child {
    margin-bottom: 0;
}

.bi-under-logo {
    text-align: center;
}

.bi-under-logo img {
    height: 200px;
    width: auto;
}

body.poda-page {
    background-color: #ffffff;
}

.poda-headline {
    font-size: 36px;
    font-weight: 600;
    color: var(--poda-text);
    line-height: 1.4;
}

.poda-headline .accent {
    color: var(--poda-orange);
}

.poda-brand {
    text-align: center;
}

.poda-brand-mark {
    height: 140px;
    width: auto;
    margin-top: 100px;
    margin-bottom: 350px;
}

.poda-brand-mark2 {
    height: 130px;
    width: auto;
    margin-top: 100px;
    margin-bottom: 200px;
}

.poda-headline-section .poda-headline {
    max-width: 1200px;
    margin: auto;
    font-size: 40px;
}

.poda-acronym {
    margin-top: 30px;
    font-size: 20px;
    color: var(--poda-orange-2);
    letter-spacing: 10px;
}

.poda-acronym strong {
    color: var(--poda-orange);
    font-weight: 700;
    letter-spacing: 10px; 
}

.poda-body {
    font-size: 24px;
    line-height: 1.7;
    color: var(--poda-text);
    margin-top:30px;
}

.poda-body p {
    margin-bottom: 26px;
}

.poda-body-strong {
    font-weight: 700;
    font-size: 28px;
    margin-top:50px;
}

.problem-columns {
    display: flex;
    justify-content: center;
    gap: 119px;
    margin-top: 50px;
}

.problem-columns img {
    width: 1400px;  
    height: auto;
}

.poda-feature-row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;  
    gap: 60px;
}

.poda-feature-row.reverse {
    flex-direction: row-reverse;
}

.poda-feature-text {
    flex: 0 0 auto;
    max-width: 380px;
}

.poda-feature-text .poda-headline {
    text-align: left;
}

.poda-quote {
    margin-top: 24px;
    font-size: 22px;
    font-weight: 500;
    color: var(--poda-text-light);
    line-height: 1.6;
    text-align: left;
}

.poda-quote-underline {
    display: block;
    margin-top: 16px;
    width: 100px;
    height: 2px;
    background: var(--poda-orange);
}

.poda-steps {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.poda-step {
    display: flex;
    border-radius: 10px;
}

.poda-step-photo {
    flex: 0 0 auto;
    width: 240px;
    height: 240px;
    background: #F8C167;
}

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

.poda-step-text {
    flex: 0 0 500px;
    height: 240px;
    background: #f7f7f7;
    padding: 40px;
    text-align: left; 
}

.poda-step-title {
    font-size: 30px;
    font-weight: 700;
    color: var(--poda-orange-2);
    margin-bottom: 20px;
}

.poda-step-sub {
    margin-top: 4px;
    font-size: 24px;
    font-weight: 700;
    color: var(--poda-text);
    margin-bottom: 10px;
}

.poda-step-list {
    margin-top: 22px;
}

.poda-step-list li {
    font-size: 18px;
    line-height: 1.7;
    color: var(--poda-text);
}

.poda-feature-2 .poda-headline {
    max-width: none;
    margin-bottom: 50px;
}

.poda-feature-row-2 {
    display: flex;
    gap: 60px;
    flex-direction: column;
}

.poda-feature-image {
    flex: 1;
    display: flex;
    justify-content: center;
}

.poda-feature-image img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.poda-feature-image.center {
    margin-top: 50px;
}

.poda-points {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    justify-items: center;
    align-items: center;
    height: auto;
    max-width: 1200px;
    margin: 0 auto;
}

.poda-point {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 28px 20px;
    background: #ffffff;
    border: 1px solid var(--poda-card-border);
    border-radius: 16px;
    width: 100%;
    height: 100%;
}

.poda-point-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(255, 146, 1, 0.12);
    color: var(--poda-orange-2);
    font-size: 20px;
}

.poda-point-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    margin-bottom: 14px;
    font-size: 24px;
    font-weight: 700;
    color: var(--poda-orange-2);
}

.poda-point-title .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--poda-orange-2);
}

.poda-point-desc {
    margin-top: 10px;
    font-size: 20px;
    line-height: 1.6;
    color: var(--poda-text-light);
}

.poda-closing-text {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.5;
    color: var(--poda-text);
    margin-top: 100px;
}

.poda-closing-text .accent {
    color: var(--poda-orange);
}

.poda-closing-text .accent-2 {
    color: var(--poda-orange-2);
}

body.kkk-page {
    text-align: center;
    background-color: #ffffff;
}

.kkk-subtitle-text {
    font-size: 44px;
    font-weight: 700;
    color: var(--kkk-text);
    line-height: 1.4;
}

.kkk-headline {
    font-size: 44px;
    font-weight: 700;
    color: var(--kkk-text);
    line-height: 1.4;
    margin-bottom: 50px;
}

.kkk-headline.center {
    text-align: center;
}

.kkk-lead {
    margin-top: 20px;
    font-size: 24px;
    line-height: 1.6;
    color: var(--kkk-text);
}

.kkk-lead.center {
    text-align: center;
}

.kkk-brand {
    text-align: center;
}

.kkk-logo {
    height: 240px;
    width: auto;
    margin-top: 50px;
    margin-bottom: 100px;
}

.bottom_logo {
    height: 250px;
    width: auto;
}

.kkk-tagline {
    text-align: center;
}

.kkk-tagline-text {
    max-width: 900px;
    margin: 50px auto;
    font-size: 28px;
    line-height: 1.6;
    color: var(--kkk-text);
    letter-spacing: 26px;
    line-height: 3;
}

.kkk-tagline-text strong {
    color: var(--kkk-navy);
    font-weight: 700;
    letter-spacing: 26px;
}

.kkk-body {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 24px;
    line-height: 1.7;
    color: var(--kkk-text);
    margin-top: 20px;
}

.kkk-body p:last-child {
    margin-bottom: 0;
}

.kkk-body-strong {
    font-weight: 700;
}

.problem-list {
    display: flex;
    flex-direction: column;
    gap: 40px;
    text-align: left;
    max-width: 1000px;
    margin: 0 auto;
}

.problem-item {
    padding-top: 32px;
}

.problem-num {
    font-size: 32px;
    font-weight: 700;
    color: var(--kkk-text);
    margin-bottom: 12px;
}

.problem-quote {
    font-size: 24px;
    font-weight: 700;
    color: var(--kkk-text);
    margin-bottom: 16px;
}

.kkk_problem-desc {
    max-width: 900px;
    font-size: 22px;
    line-height: 1.7;
    color: var(--kkk-text-light);
}

.kkk-callout {
    background: #0C2A4A;
    border: 1px solid var(--kkk-text);
    border-radius: 10px;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.25);
    padding: 44px 50px;
    text-align: center;
    color: #ffffff;
    margin-top: 50px;
}

.kkk-callout-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 16px;
}

.kkk-callout-sub {
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 8px;
}

.kkk-callout-desc {
    font-size: 22px;
    font-weight: 500;
}

.kkk-steps .kkk-headline {
    margin-bottom: 16px;
}

.kkk-steps .kkk-lead {
    margin-bottom: 60px;
}

.kkk-headline.kkk-headline-steps {
    font-size: 44px;
}

.steps-grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 1000px;
    margin: 0 auto;
}

.step-card {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #a6c0db;
    background: #ffffff;
}

.step-card-header {
    padding: 30px;
    background: #0c2a4a;
    cursor: pointer;
}

.step-card-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.step-badge {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
}

.step-card-header-top i {
    flex-shrink: 0;
    color: #ffffff;
    transition: transform 0.3s ease;
}

.step-card.is-open .step-card-header-top i {
    transform: rotate(180deg);
}

.step-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.5;
    margin-top: 20px;
    text-align: left;
}

.step-tag {
    font-size: 18px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.75);
    margin-top: 12px;
    text-align: left;
}

.step-card-body {
    max-height: 0;
    overflow: hidden;
    padding: 0 30px;
    transition: max-height 0.4s ease, padding 0.4s ease;
    text-align: left;
}

.step-card.is-open .step-card-body {
    max-height: 4000px;
    padding: 24px 30px;
}

.step-card-body p {
    font-size: 20px;
    line-height: 1.6;
    color: var(--kkk-text);
    margin-bottom: 10px;
    text-align: left;
}

.step-card-body p:last-child {
    margin-bottom: 0;
}

.kkk-points .kkk-headline {
    margin-bottom: 50px;
}

.points-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 1200px; 
    margin: 0 auto;
}

.kkk_point-card {
    border-radius: 10px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    padding: 32px;
}

.point-1 { background: #f3f3f3; }
.point-2 { background: #cfe6ee; }
.point-3 { background: #b9dcec; }
.point-4 { background: #a2b8c2; }

.point-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--kkk-text);
    line-height: 1.6;
    margin-bottom: 16px;
    text-align: left;
}

.point-desc {
    font-size: 20px;
    line-height: 1.6;
    color: var(--kkk-text);
    text-align: left;
}

.kkk-shots .kkk-headline{
	margin-bottom: 50px;
}

.kkk-shot-grid {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-top: 50px;
}

.kkk-shot-item {
    display: flex;
    align-items: stretch;
    width: 100%;
    text-align: left;
}

.kkk-shot-img-box {
    flex-shrink: 0;
    width: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #DEEBFD;
}

.kkk-shot-img {
    width: 100%;
    max-width: 400px;
    height: auto;
}

.kkk-shot-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #F7F9FB;
    padding: 24px;
}

.kkk-shot-step {
    font-size: 26px;
    color: #307AEB;
    font-weight: 700;
}

.kkk-shot-title {
    margin: 10px 0;
    font-size: 26px;
    font-weight: 700;
    color: var(--kkk-text);
}

.kkk-shot-desc {
    font-size: 20px;
    line-height: 1.5;
    color: var(--kkk-text);
}

.kkk-shot-desc::before {
    content: "●";
    margin-right: 6px;
    color: var(--kkk-text);
    font-size: 6px;
    vertical-align: middle;
}

.kkk-closing-text {
    max-width: 900px;
    margin: 50px auto;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.6;
    color: var(--kkk-text);
}

.kkk-closing-text strong {
    color: var(--kkk-navy);
}

body.kaminoai-page {
    background-color: #ffffff;
    text-align: left;
}

.kaminoai-brand {
    text-align: center;
}

.kaminoai-brand-mark {
    height: 120px;
    width: auto;
    margin-top: 100px;
    margin-bottom: 350px;
}

.kaminoai-brand-mark2 {
    height: 120px;
    width: auto;
    margin-top: 200px;
    margin-bottom: 200px;
}

.kaminoai-tagline {
    text-align: center;
}

.kaminoai-tagline-text {
    font-size: 44px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--kai-text);
}

.kaminoai-tagline-text strong {
    color: var(--kai-accent);
    font-weight: 700;
}

.kaminoai-tagline-sub {
    margin-top: 16px;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 8px;
    color: var(--kai-accent);
}

.kaminoai-body {
    margin: 40px auto;
    font-size: 26px;
    line-height: 1.7;
    color: var(--kai-text);
    text-align: center;
}

.kaminoai-body p {
    margin-bottom: 24px;
}

.kaminoai-body p:last-child {
    margin-bottom: 0;
}

.kaminoai-body-strong {
    font-weight: 600;
    font-size: 28px;
    color: var(--kai-blue);
}

.kaminoai-callout {
    display: flex;
    align-items: center;
    gap: 28px;
    background: var(--kai-navy);
    border: 1px solid var(--kai-text);
    border-radius: 10px;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.25);
    padding: 32px 50px;
    margin: 50px auto;
    max-width: 1200px;
}

.kaminoai-callout > i {
    flex: 0 0 auto;
    font-size: 40px;
    color: #5DC9A5;
}

.kaminoai-callout-title {
    font-size: 26px;
    font-weight: 500;
    color: #ffffff;
    margin-bottom: 10px;
}

.kaminoai-callout-sub {
    font-size: 24px;
    font-weight: 400;
    color: var(--kai-subtext);
}

.kaminoai-tagline2 {
    text-align: center;
}

.kaminoai-tagline2-text {
    max-width: 900px;
    margin: 0 auto 70px;
    font-size: 44px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--kai-text);
    text-align: center;
}

.reason-list {
    display: flex;
    flex-direction: column;
    gap: 24px;    
    max-width: 1200px;
    margin: 0 auto;
}

.reason-text{
	text-align: left;
}

.reason-item {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    background: #FFFFFF;
    border: 1px solid #E7E7E7;
    border-radius: 10px;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
    padding: 32px 40px;    
}

.reason-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--kai-text);
    margin-bottom: 12px;
}

.reason-item > i {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    font-size: 28px;
    color: #0C447C;
}

.reason-quote {
    font-size: 24px;
    font-weight: 500;
    color: var(--kai-text-light);
    margin-bottom: 12px;
}

.reason-desc {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.7;
    color: var(--kai-text);
}

.kaminoai-callout-light {
    background: var(--kai-light-bg);
    border-radius: 10px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    padding: 44px 50px;
    text-align: center;
    max-width:1200px;
    margin: 50px auto;
}

.kaminoai-process-title {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--kai-text);
    margin-bottom: 16px;
}

.kaminoai-process-sub {
    font-size: 22px;
    color: var(--kai-text);
}

.process-steps {
    display: flex;
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

.process-step {
    flex: 1;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    border: 1px solid #d9d9d9;
}

.process-step-head {
    background: var(--kai-navy);
    color: #dfdfe9;
    font-size: 22px;
    font-weight: 700;
    padding: 18px 10px;
}

.process-step-head strong {
    color: #ffffff;
}

.process-step-title {
    margin: 30px auto;
    font-size: 24px;
    font-weight: 700;
    color: var(--kai-text);
}

.process-step-desc {
    margin: 12px 24px 24px;
    font-size: 22px;
    line-height: 1.6;
    font-weight: 500;
    color: var(--kai-text-light);
}

.engine-row {
    display: flex;
    align-items: flex-start;
    gap: 60px;
    flex-direction: column;
    max-width:1200px; 
    margin: 0 auto;
}

.engine-text {
    flex: 0 0 auto;
    margin-bottom: 50px;
}

.kaminoai-headline {
    font-size: 44px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--kai-heading);
}

.engine-desc {
    margin-top: 24px;
    font-size: 24px;
    line-height: 1.6;
    color: var(--kai-heading);
}

.engine-underline {
    display: block;
    margin-top: 20px;
    width: 100px;
    height: 2px;
    background: var(--kai-heading);
}

.engine-carousel {
    width: 90%;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 16px;
}


.engine-carousel-prev i,
.engine-carousel-next i {
    color: #ffffff;
    font-size: 18px;
}

.engine-carousel-viewport {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.engine-carousel-track {
    display: flex;
    gap: 24px;
}

.kaminoai_point-card {
    flex: 0 0 336px;
    width: 336px;
    border-radius: 12px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

.point-card-img {
    width: 100%;
    height: 210px;
    object-fit: cover;
    display: block;
}

.point-card-body {
    padding: 24px;
}

.point-card-num {
    font-size: 20px;
    font-weight: 600;
    color: var(--kai-heading);
    margin-bottom: 12px;
}

.point-card-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--kai-heading);
    margin-bottom: 12px;
}

.point-card-desc {
    font-size: 20px;
    line-height: 1.7;
    color: var(--kai-text-light);
}

.engine-carousel-prev,
.engine-carousel-next {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--kai-navy);
    border: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.engine-carousel-prev:hover,
.engine-carousel-next:hover {
    background: var(--kai-heading);
}

.kaminoai-closing {
    text-align: center;
}

.kaminoai-closing-text {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.6;
    color: var(--kai-text);
}

.kaminoai-closing-text strong {
    color: var(--kai-blue);
}

body.dopplemate-page {
    margin-top: 0;
    text-align: left;
    background-color: #ffffff;
}

.dopple-brand {
    text-align: center;
}

.dopple-logo-top {
    max-width: 500px;
    width: 100%;
    height: auto;
    margin-top: 100px;
    margin-bottom: 200px;
}

.dopple-logo-bottom {
    max-width: 708px;
    width: 100%;
    height: auto;
    margin-top: 200px;
    margin-bottom: 90px;
}

.dopple-tagline {
    text-align: center;
}

.dopple-tagline-text {
    font-size: 44px;
    font-weight: 700;
    color: var(--dopple-text);
}

.dopple-tagline-sub {
    margin-top: 16px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 12px;
    color: var(--dopple-text-light);
}

.dopple-box-wrap {
    text-align: center;
}

.dopple-honeycomb {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    margin-top: 80px;
}

.dopple-hc-row {
    display: flex;
    justify-content: center;
    gap: 40px;
}

.dopple-hc-row-wide {
    margin-top: 5px;
}

.dopple-hc-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;        
    max-width: 195px;
    height: 138px;
    padding: 15px;
    border-radius: 20px;
    background: var(--dopple-navy);
    box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.25);
}

.dopple-hc-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    font-size: 26px;
}

.dopple-hc-label {
    margin-top: 10px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -1px;
    text-align: center;
}

.dopple-body {
    max-width: 1000px;
    margin: 60px auto 0;
    font-size: 24px;
    line-height: 1.8;
    color: var(--dopple-text);
    text-align: center;
}

.dopple-cards {
    display: flex;
    flex-direction: column;
    gap: 40px;
    max-width: 1200px; 
    margin: 0 auto;
}

.dopple-card {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--dopple-border);
    background: var(--dopple-body-bg);
}

.dopple-card-header {
    padding: 40px;
    background: var(--dopple-navy);
    cursor: pointer;
}

.dopple-card-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.dopple-card-title {
    font-size: 26px;
    font-weight: 700;
}

.dopple-accent-1 { color: var(--dopple-accent-1); }
.dopple-accent-2 { color: var(--dopple-accent-2); }
.dopple-accent-3 { color: var(--dopple-accent-3); }
.dopple-accent-4 { color: var(--dopple-accent-4); }
.dopple-accent-5 { color: var(--dopple-accent-5); }
.dopple-accent-6 { color: var(--dopple-accent-6); }

.dopple-card-header-top i {
    flex-shrink: 0;
    color: #ffffff;
    transition: transform 0.3s ease;
}

.dopple-card.is-open .dopple-card-header-top i {
    transform: rotate(180deg);
}

.dopple-card-desc {
    margin: 20px;
    font-size: 20px;
    line-height: 1.6;
    color: #ffffff;
}

.dopple-card-desc strong {
    font-weight: 700;
}

.dopple-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.dopple-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px;
    border: 1px solid #ffffff;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    font-size: 16px;
}

.dopple-card-body {
    max-height: 0;
    overflow: hidden;
    padding: 0 40px;
    transition: max-height 0.4s ease, padding 0.4s ease;
}

.dopple-card.is-open .dopple-card-body {
    max-height: 4000px;
    padding: 40px;
}

.dopple-list {
    list-style: disc;
    padding-left: 22px;
    color: #ffffff;
}

.dopple-list li {
    margin-bottom: 24px;
    font-size: 18px;
    line-height: 1.8;
}

.dopple-list li:last-child {
    margin-bottom: 0;
}

.dopple-list strong {
    display: block;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 4px;
}

.dopple-icon-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.dopple-icon-row {
    display: flex;
    align-items: center;
    gap: 24px;
}

.dopple-icon-circle {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--dopple-navy);
    font-size: 22px;
}

.dopple-icon-text {
    color: #ffffff;
    font-size: 18px;
    line-height: 1.8;
}

.dopple-icon-text strong {
    display: block;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 4px;
}

.dopple-image-grid {
    display: grid;
    gap: 24px;
}

.dopple-image-grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

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

.dopple-image-card {
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--dopple-border);
}

.dopple-image-card-img {
    width: 100%;
    height: 270px;
    object-fit: cover;
    display: block;
}

.dopple-image-card-text {
    padding: 20px;
}

.dopple-image-card-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 12px;
}

.dopple-image-card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
}

body.notice-page {
    margin-top: 0;
    text-align: left;
    background-color: #ffffff;
}

.notice-page-title {
    text-align: center;
    font-size: 44px;
    font-weight: 700;
    color: var(--notice-navy);
    margin: 100px;
}

.notice-table-meta{
	max-width: 1200px;
    margin: 40px auto;
    margin-bottom: 100px;
}

.notice-section{
	max-width: 1200px;
    margin: 40px auto;
    margin-bottom: 100px;
}

.notice-table {
    width: 100%;
    border-collapse: collapse;
    border-top: 2px solid var(--notice-text);
}

.notice-row {
    height: 48px;
    border-bottom: 1px solid var(--notice-border);
    font-size: 20px;
    color: var(--notice-text-sub);
}

.notice-row:hover {
    background: var(--notice-row-hover, #fafafa);
}

.notice-row:hover .notice-col-title a {
    text-decoration: underline;
}

.notice-col-title {
    padding-left: 20px;
    width: 700px;
    vertical-align: middle;
}

.notice-col-date {
    width: 50px;
    vertical-align: middle;
}

.notice-col-actions {
    width: 50px;
    vertical-align: middle;
}

.notice-col-title a {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--notice-text-sub);
    text-decoration: none;
    cursor: pointer;
}

.notice-col-title .fa-thumbtack {
    font-size: 18px;
    color: var(--notice-navy);
    flex-shrink: 0;
}

.notice-row-empty {
    height: 120px;
}

.notice-row-empty td {
    text-align: center;
    color: var(--notice-text-sub);
    cursor: default;
    vertical-align: middle;
}

.notice-more {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 20px;
    padding: 10px 0;
    background: none;
    border: none;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.notice-more:hover {
    opacity: 0.7;
}

.notice-more:disabled {
    opacity: 0.4;
    cursor: default;
}

.notice-detail-section {
    max-width: 1200px;
    margin: 40px auto;
}

.notice-detail-title {
    margin-right: auto;
    padding-left: 20px;
    font-size: 34px;
    font-weight: 700;
    color: var(--notice-text-sub);
}

.notice-detail-meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    margin: 30px auto;
    border-bottom: 2px solid var(--notice-text);
    padding-bottom: 16px;
    font-size: 18px;
    color: var(--notice-text-sub);
}

.notice-detail-views {
    display: flex;
    align-items: center;
    gap: 6px;
}

.notice-detail-views i {
    color: var(--notice-text-sub);
    font-size: 14px;
}

.notice-detail-body {
	padding-left: 20px;
    min-height: 260px;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.8;
    color: var(--notice-text);
    border-bottom: 1px solid var(--notice-border);
    margin: 30px auto;
}

.notice-detail-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.notice-detail-actions {
    display: flex;
    justify-content: center;
    padding-top: 40px;
}

.notice-detail-actions {
    gap: 16px;
}

.notice-detail-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    height: 40px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.notice-detail-btn-outline {
    background: #ffffff;
    color: rgba(84, 78, 78, 0.8);
    border: 1px solid rgba(84, 78, 78, 0.8);
}

.notice-detail-btn-outline:hover {
    background: rgba(84, 78, 78, 0.08);
}

.admin-order-row:hover {
    background-color: #f8fafc;
    cursor: pointer;
}
.admin-detail-row > td {
    padding: 0 !important;
    border-bottom: 2px solid #e2e8f0 !important;
}
.admin-detail-box {
    background: #f8fafc;
    padding: 20px 40px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    box-shadow: inset 0 3px 6px rgba(0,0,0,0.02);
}
.detail-group .detail-label {
    font-size: 12px;
    font-weight: 700;
    color: #64748b;
    margin-bottom: 6px;
}
.detail-group .detail-value {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    word-break: break-all;
}
.detail-group .detail-value.highlight {
    color: #2563eb;
    background: #eff6ff;
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-block;
}

.note-editable ul {
    list-style-type: inherit;
    display: list-item;
    padding-left: 1.5em;
}

.note-editable ol {
    padding-left: 20px;
    list-style-type: decimal;
    padding-left: 1.5em;
}

.note-editable li {
    list-style-type: inherit;
    display: list-item;
    padding-left: 1.5em;
}

.notice-write-section {
    padding: 40px;
    max-width: 1200px;
    margin: 40px auto;
}

.notice-write-title {
    display: block;
    width: 100%;
    height: 58px;
    padding: 0 24px;
    font-size: 22px;
    font-weight: 500;
    color: var(--notice-text);
    background: #ffffff;
    border: 1px solid #CCCCCC;
    border-radius: 2px;
    outline: none;
    margin-bottom: 20px;
}

.notice-write-title::placeholder {
    color: rgba(84, 78, 78, 0.5);
}

.notice-write-body {
    min-height: 380px;
    width: 100%;
    padding: 32px 24px;
    font-size: 16px;
    line-height: 1.8;
    color: var(--notice-text);
    outline: none;
}

.notice-write-body:empty::before {
    content: attr(data-placeholder);
    font-size: 22px;
    font-weight: 500;
    color: rgba(84, 78, 78, 0.5);
}

.notice-write-body img {
    max-width: 100%;
    border-radius: 8px;
    margin: 12px 0;
}

.notice-write-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 40px;
}

.notice-row-link {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    height: 100%;
    color: var(--notice-text-sub);
    text-decoration: none;
}

.notice-row-link:hover .notice-col-title {
    text-decoration: underline;
}

.notice-row-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    margin-left: auto;
}

.notice-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    border-radius: 6px;
    color: #a0a0a0;
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.notice-action-btn:hover {
    background: #f1f1f1;
    color: var(--notice-text-sub);
}

.notice-action-delete:hover {
    background: #fdecec;
    color: #d64545;
}

.notice-action-btn.is-active {
    color: var(--notice-navy);
}

.notice-meta-admin {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notice-write-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    height: 40px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.notice-write-btn-primary {
    background: rgba(84, 78, 78, 0.8);
    color: #ffffff;
    border: none;
}

.notice-write-btn-primary:hover {
    background: rgba(84, 78, 78, 1);
}

.notice-write-btn-secondary {
    background: rgba(255, 255, 255, 0.8);
    color: var(--notice-text-sub);
    border: 1px solid var(--notice-text);
}

.notice-write-btn-secondary:hover {
    background: #f5f5f5;
}

.inquiry-row {
    padding-right: 16px;
}

.inquiry-col-name {
    flex: 0 0 100px;
    text-align: right;
    padding-right: 24px;
    color: var(--notice-text-sub);
}

.inquiry-status {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 30px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.inquiry-status-pending {
    background: #ffffff;
    border: 1px solid var(--notice-text);
    color: var(--notice-text);
}

.inquiry-status-done {
    background: var(--notice-text);
    color: #ffffff;
}

.inquiry-write-section {
    padding: 60px 0 120px;
}

.inquiry-write-title {
    padding-bottom: 20px;
    font-size: 25px;
    font-weight: 500;
    color: var(--notice-text-sub);
    border-bottom: 2px solid var(--notice-text);
}

.inquiry-form-row {
    display: flex;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid var(--notice-border);
}

.inquiry-form-row-password {
    border-bottom: none;
}

.inquiry-form-label {
    flex: 0 0 164px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: var(--notice-text-sub);
}

.inquiry-form-field {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
}

.inquiry-input,
.inquiry-select,
.inquiry-textarea {
    height: 26px;
    padding: 0 10px;
    font-size: 14px;
    color: var(--notice-text);
    background: #ffffff;
    border: 1px solid var(--notice-text-sub);
    border-radius: 4px;
    outline: none;
}

.inquiry-input {
    width: 100%;
    max-width: 585px;
}

.inquiry-input-sm {
    max-width: 230px;
}

.inquiry-textarea {
    width: 100%;
    max-width: 585px;
    height: 110px;
    padding: 10px;
    font-family: inherit;
    line-height: 1.6;
    resize: vertical;
}

.inquiry-email-field {
    flex-wrap: nowrap;
}

.inquiry-input-email {
    width: 230px;
}

.inquiry-email-at {
    font-size: 16px;
    color: var(--notice-text-sub);
}

.inquiry-select {
    width: 118px;
    cursor: pointer;
}

.inquiry-input-email-domain {
    width: 150px;
    display: none;
}

.inquiry-input-email-domain.is-visible {
    display: inline-block;
}

.inquiry-file-trigger {
    width: 100%;
    max-width: 585px;
    height: 26px;
    padding: 0 10px;
    font-size: 14px;
    text-align: left;
    color: rgba(0, 0, 0, 0.5);
    background: #ffffff;
    border: 1px solid var(--notice-text-sub);
    border-radius: 4px;
    cursor: pointer;
}

.inquiry-file-trigger.has-file {
    color: var(--notice-text);
}

.inquiry-input-pw {
    max-width: 127px;
}

.inquiry-pw-hint {
    font-size: 14px;
    font-weight: 300;
    color: rgba(0, 0, 0, 0.7);
}

.inquiry-write-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 40px;
}

.inquiry-answer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 40px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--notice-text);
}

.inquiry-answer-title {
    font-size: 25px;
    font-weight: 500;
    color: var(--notice-text-sub);
}

.inquiry-answer-body {
    min-height: 150px;
    border-bottom: 1px solid var(--notice-border);
}

.inquiry-answer-textarea {
    display: block;
    width: 100%;
    height: 140px;
    margin-top: 24px;
    padding: 16px;
    font-size: 16px;
    font-family: inherit;
    line-height: 1.6;
    color: var(--notice-text);
    background: #ffffff;
    border: 1px solid var(--notice-text-sub);
    border-radius: 12px;
    outline: none;
    resize: vertical;
}

.inquiry-answer-textarea::placeholder {
    font-size: 18px;
    color: rgba(84, 78, 78, 0.5);
}

.inquiry-answer-actions {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 24px;
}

.inquiry-modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    align-items: center;
    justify-content: center;
}

.inquiry-modal-overlay.active {
    display: flex;
}

.inquiry-modal-box {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 12px;
    width: 100%;
    max-width: 360px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    text-align: center;
    margin: 15px;
}

.inquiry-modal-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #333333;
}

.inquiry-modal-desc {
    font-size: 12px;
    color: #666666;
    margin-bottom: 20px;
}

.inquiry-modal-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #dddddd;
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 20px;
    box-sizing: border-box;
    outline: none;
}

.inquiry-modal-input:focus {
    border-color: #333333;
}

.inquiry-modal-actions {
    display: flex;
    gap: 10px;
}

.inquiry-modal-btn {
    flex: 1;
    padding: 10px 0;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border: none;
    transition: background-color 0.2s;
}

.inquiry-modal-btn.btn-cancel {
    background-color: #f1f1f1;
    color: #555555;
}

.inquiry-modal-btn.btn-cancel:hover {
    background-color: #e2e2e2;
}

.inquiry-modal-btn.btn-submit {
    background-color: #334155;
    color: #ffffff;
}

.inquiry-modal-btn.btn-submit:hover {
    background-color: #1e293b;
}

.inquiry-board-custom {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

.board-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px ;
}

.board-total {
    font-size: 15px;
    font-weight: 500;
    color: #64748b;
}

.board-total strong {
    color: #0f172a;
    font-weight: 700;
}

.inquiry-board-custom .notice-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    border: 1px solid #e2e8f0;
}

.inquiry-board-custom .notice-table thead {
    background-color: #f8fafc;
}

.inquiry-board-custom .notice-table th,
.inquiry-board-custom .notice-table td {
    vertical-align: middle;
}

.inquiry-board-custom .notice-table th {
    background-color: #f8fafc;
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
    border-radius: 0;
    box-shadow: none;
    text-align: left;
}

.inquiry-board-custom .notice-table th:last-child {
    text-align: center;
    margin: 0;
    height: auto;
    line-height: normal;
}

.inquiry-board-custom .notice-table th:last-child * {
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    box-shadow: none;
    display: inline;
    vertical-align: middle;
}

.inquiry-board-custom .notice-row {
    transition: background-color 0.2s ease;
}

.inquiry-board-custom .notice-row:hover {
    background-color: #f8fafc;
}

.inquiry-board-custom .notice-row td {
    padding: 18px 20px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 15px;
    color: #334155;
}

.inquiry-board-custom .notice-row:last-child td {
    border-bottom: none;
}

.inquiry-board-custom .notice-table :is(th, td):nth-child(1) { text-align: left; width: 80px; }
.inquiry-board-custom .notice-table :is(th, td):nth-child(2) { text-align: center; width: 120px; }
.inquiry-board-custom .notice-table :is(th, td):nth-child(3) { text-align: left; }
.inquiry-board-custom .notice-table :is(th, td):nth-child(4) { text-align: center; width: 120px; }
.inquiry-board-custom .notice-table :is(th, td):nth-child(5) { text-align: center; width: 100px; }

.notice-col-num, .notice-col-date, .notice-col-author { font-size: 14px; }
.notice-col-num, .notice-col-date { font-variant-numeric: tabular-nums; }
.notice-col-num { color: #94a3b8; }
.notice-col-date, .notice-col-author { color: #64748b; }

.notice-col-title a {
    color: #0f172a;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.2s ease;
}

.inquiry-board-custom .notice-row:hover .notice-col-title a {
    color: #2563eb;
}

.inquiry-board-custom .inquiry-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 28px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    border: none;
}

.inquiry-status-done { background-color: #e0f2fe; color: #0369a1; }
.inquiry-status-pending { background-color: #f1f5f9; color: #64748b; }

.notice-container {
	width: 100%;
	max-width: 1200px;
    margin: 40px auto;
    margin-bottom: 100px;
	padding: 0 40px;
}

.notice-meta {
    max-width: 100%;
    margin: 15px 0 12px 0;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    font-weight: 500;
    color: #64748b; 
}

.notice-meta span {
    font-weight: 700;
    color: #1e293b;
}

.notice-write-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 16px;
    background-color: #334155; 
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    border-radius: 8px;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.notice-write-link:hover {
    background-color: #1e293b;
    transform: translateY(-1px);
}

.notice-write-link:active {
    transform: translateY(0);
}

.inquiry-detail-section {
	padding: 5% 40px;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.inquiry-detail-card {
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
    padding: 32px;
    box-sizing: border-box;
}

.inquiry-card-header {
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 20px;
    margin-bottom: 24px;
}

.inquiry-title-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.inquiry-detail-title {
	text-align: center;
    font-size: 30px;
    font-weight: 500;
    color: var(--notice-text-sub);
    margin: 0;
    line-height: 1.35;
}

.inquiry-detail-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 14px;
    color: #64748b;
	padding-bottom: 20px;
	border-bottom: 2px solid var(--notice-text);
}

.inquiry-detail-writer {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 20px;
}

.meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.meta-item i, 
.inquiry-detail-date i {
    color: #94a3b8;
    font-size: 13px;
}

.meta-item strong {
    color: #1e293b;
}

.inquiry-detail-date {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    color: #94a3b8;
}

.inquiry-detail-body {
    min-height: 140px;
    font-size: 15px;
    line-height: 1.7;
    color: #334155;
    word-break: break-word;
	padding: 60px 0;
	font-weight: 500;
}

.inquiry-detail-actions {
    display: flex;
    justify-content: flex-end;
    padding: 20px 40px 0;
    border-top: 1px solid #f1f5f9;
    margin-top: 24px;
}

.notice-list-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 20px;
    background-color: #f1f5f9;
    color: #475569;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
	justify-content: center;
	width: 128px;
	height: 40px;
}

.notice-list-btn:hover {
    background-color: #e2e8f0;
    color: #0f172a;
}

.inquiry-reply-section {
	margin-top: 30px;
	border-top: 1px solid #cbd5e1;
	padding-top: 20px;
}

.inquiry-reply-section .inquiry-reply-header {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	border-bottom: 1px dashed #cbd5e1;
	padding-bottom: 15px;
}

.inquiry-reply-section .inquiry-reply-header .inquiry-reply-icon {
	width: 40px;
	height: 40px;
	font-size: 18px;
	border-radius: 10px;
	margin-right: 15px;
}

.inquiry-reply-date {
	color: #64748b;
	font-size: 14px;
}

.inquiry-reply-body {
	padding: 20px 0;
	min-height: 30px;
	line-height: 1.6;
	color: #334155;
	font-size: 20px;
}

.inquiry-reply-body ul {
	padding-left: 20px;
	list-style-type: disc;
}

.inquiry-reply-body ol {
	padding-left: 20px;
	list-style-type: decimal;
}

.inquiry-reply-body li {
	list-style-type: inherit;
	display: list-item;
}

.inquiry-reply-body img {
	width: 100%;
	height: auto;
}

.inquiry-reply-body iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16/9;
}

.inquiry-reply-body table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 15px;
}

.inquiry-reply-body table th,
.inquiry-reply-body table td {
	border: 1px solid #ccc;
	padding: 8px 10px;
	vertical-align: middle;
}

.inquiry-reply-body table th {
	background-color: #f8f9fa;
	font-weight: bold;
	text-align: center;
}

.inquiry-reply-section .inquiry-reply-header .inquiry-reply-icon {
	width: 40px;
	height: 40px;
	font-size: 18px;
	border-radius: 10px;
	margin-right: 15px;	
	background-color: #f1f5f9;
	color: #0f172a;
	display: flex;
	align-items: center;
	justify-content: center;
}

body.admin-login-page {
    min-height: 100vh;
    padding-top: 0;
    text-align: left;
    background-color: #f5f6fa;
}

.admin-login-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 24px;
}

.admin-login-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 380px;
    padding: 48px 40px 40px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(46, 47, 91, 0.12);
}

.admin-login-logo img {
    height: 50px;
    width: auto;
}

.admin-login-title {
    margin: 20px auto;
    font-size: 20px;
    font-weight: 700;
    color: var(--admin-text);
}

.admin-login-error {
    width: 100%;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 10px 14px;
    font-size: 13px;
    color: #d64545;
    background: #fdecec;
    border-radius: 8px;
}

.admin-login-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 16px;
}

.admin-login-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.admin-login-field label {
    font-size: 13px;
    font-weight: 600;
    color: var(--admin-text-light);
}

.admin-login-field input {
    height: 46px;
    padding: 0 14px;
    font-size: 15px;
    color: var(--admin-text);
    background: #f8f9fb;
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    outline: none;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.admin-login-field input:focus {
    border-color: var(--admin-navy);
    background: #ffffff;
}

.admin-login-btn {
    margin-top: 8px;
    height: 48px;
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    background: var(--admin-navy);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.admin-login-btn:hover {
    background: var(--admin-navy-dark);
}

.purchase-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 100px 20px 150px;
    text-align: center;
}

.purchase-title {
    font-size: 46px;
    font-weight: 800;
    color: #0f172a; 
    margin-bottom: 16px;
    letter-spacing: -0.03em;
}

.purchase-desc {
    font-size: 20px;
    color: #475569;
    margin-bottom: 70px;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    max-width: 1200px;
    margin: 0 auto;
}

.product-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.04);
    overflow: hidden;
    text-align: left;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	cursor: pointer;
}

.product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
    border-color: #cbd5e1;
}

.product-card.highlight {
    background: linear-gradient(145deg, #0f172a 0%, #1e293b 100%);
    border: 1px solid #334155;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.25);
    transform: translateY(-12px);
    position: relative;
}

.product-card.highlight:hover {
    transform: translateY(-16px);
    box-shadow: 0 30px 60px rgba(15, 23, 42, 0.35);
}

.best-label {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(90deg, #3b82f6, #2563eb);
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    padding: 6px 20px;
    border-radius: 0 0 12px 12px;
    letter-spacing: 1px;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

.product-header {
    padding: 40px 30px 30px;
    text-align: center;
    border-bottom: 1px solid #f1f5f9;
}

.product-card.highlight .product-header {
    border-bottom: 1px solid #334155;
}

.product-name {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.product-card.highlight .product-name {
    color: #f8fafc;
}

.product-price {
    font-size: 42px;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.04em;
}

.product-card.highlight .product-price {
    color: #ffffff;
}

.product-price .period {
    font-size: 18px;
    font-weight: 500;
    color: #64748b;
}

.product-card.highlight .product-price .period {
    color: #94a3b8;
}

.badge-basic, .badge-pro, .badge-premium {
    font-size: 12px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 20px;
    letter-spacing: 0.5px;
}

.badge-basic {
    color: #475569;
    background: #f1f5f9;
}

.badge-pro {
    color: #eff6ff;
    background: #3b82f6;
}

.badge-premium {
    color: #ffffff;
    background: #0f172a;
}

.product-body {
    padding: 40px 30px;
    flex: 1; 
}

.product-benefits {
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-benefits li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 16px;
    font-weight: 500;
    color: #334155;
    margin-bottom: 20px;
    line-height: 1.5;
}

.product-card.highlight .product-benefits li {
    color: #e2e8f0;
}

.product-benefits li:last-child {
    margin-bottom: 0;
}

.product-benefits li i {
    color: #2563eb; 
    font-size: 16px;
    margin-top: 4px;
}

.product-card.highlight .product-benefits li i {
    color: #60a5fa; 
}

.product-benefits li.not-included,
.product-benefits li.not-included i,
.product-benefits li i.fa-xmark {
    color: #cbd5e1 !important;
}

.product-card.highlight .product-benefits li.not-included,
.product-card.highlight .product-benefits li.not-included i,
.product-card.highlight .product-benefits li i.fa-xmark {
    color: #64748b !important;
}

.product-footer {
    padding: 0 30px 40px;
}

.btn-purchase {
    display: block;
    width: 100%;
    padding: 16px;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    background: #2563eb;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-purchase:hover {
    background: #1d4ed8;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25);
}

.btn-outline {
    background: #ffffff;
    color: #0f172a;
    border: 2px solid #e2e8f0;
}

.btn-outline:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #0f172a;
    box-shadow: none;
}

.product-card.premium .btn-outline {
    border: 2px solid #0f172a;
}

.product-card.premium .btn-outline:hover {
    background: #0f172a;
    color: #ffffff;
}

.product-card.highlight .btn-purchase {
    background: #3b82f6;
    color: #ffffff;
    border: none;
}

.product-card.highlight .btn-purchase:hover {
    background: #60a5fa;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.6); 
    z-index: 9999;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(4px); 
}

.modal-content {
    background: #ffffff;
    width: 90%;
    max-width: 520px;
    padding: 40px;
    border-radius: 24px;
    position: relative;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.15);
    text-align: left;
    animation: modalFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	max-height: 90vh;
	overflow-y: auto;
}

@keyframes modalFadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.modal-close {
    position: absolute;
    top: 24px;
    right: 24px;
    background: transparent;
    border: none;
    font-size: 24px;
    color: #94a3b8;
    cursor: pointer;
    transition: color 0.2s ease, transform 0.2s ease;
}

.modal-close:hover {
    color: #0f172a;
    transform: scale(1.1);
}

.modal-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 16px 0;
}

.modal-desc {
    font-size: 16px;
    font-weight: 600;
    color: #2563eb; 
    margin: 0 0 24px 0;
    line-height: 1.5;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}

.modal-feature-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.modal-feature-list li {
    position: relative;
    padding-left: 20px;
    font-size: 15px;
    line-height: 1.6;
    color: #475569;
    margin-bottom: 16px;
}

.modal-feature-list li:last-child {
    margin-bottom: 0;
}

.modal-feature-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #3b82f6;
    font-size: 20px;
    line-height: 1.2;
}

.modal-feature-list strong {
    color: #0f172a;
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
}

.purchase-policy-box {
    max-width: 1200px;
    margin: 80px auto 0;
    padding: 40px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    text-align: left;
}

.purchase-policy-box h4 {
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 20px;
}

.policy-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.policy-list li {
    position: relative;
    padding-left: 16px;
    font-size: 15px;
    font-weight: 500;
    color: #64748b;
    line-height: 1.7;
    margin-bottom: 10px;
}

.policy-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #94a3b8;
}

.btn-detail-text {
    width: 100%;
    margin-top: 12px;
    padding: 10px;
    background: transparent;
    border: none;
    color: #64748b;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: color 0.2s;
}
.btn-detail-text:hover {
    color: #0f172a;
    text-decoration: underline;
}

.product-card.highlight .btn-detail-text {
    color: #94a3b8; 
}
.product-card.highlight .btn-detail-text:hover {
    color: #ffffff; 
    text-decoration: underline;
}

body.payment-window-page {
    background-color: #f8fafc;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
}

.payment-wrapper {
    width: 100%;
    max-width: 500px;
    background: #ffffff;
    min-height: 100vh;
    box-shadow: 0 0 30px rgba(15, 23, 42, 0.05);
}

.payment-header {
    padding: 16px;
    background: #0f172a;
    color: #ffffff;
    text-align: center;
}

.payment-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
}

.payment-content {
    padding: 20px 20px 30px;
}

.payment-section {
    margin-bottom: 24px;
	padding: 0 10px 30px 10px;
}

.payment-section .section-title {
    font-size: 15px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e8f0;
}

.payment-section .section-desc {
    font-size: 12px;
    color: #64748b;
    margin-bottom: 12px;
    line-height: 1.4;
}

.order-summary-box {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 16px;
    border-radius: 10px;
    text-align: center;
}

.order-item-name {
    font-size: 16px;
    font-weight: 800;
    color: #2563eb;
    margin-bottom: 4px;
}

.order-item-price {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
}

.order-item-price span {
    font-size: 14px;
    color: #64748b;
    font-weight: 500;
}

.guest-order-form .form-group {
    margin-bottom: 12px;
}

.guest-order-form label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #475569;
    margin-bottom: 6px;
}

.guest-order-form input {
    width: 100%;
    height: 42px; 
    padding: 0 12px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-size: 14px;
    color: #0f172a;
    outline: none;
    transition: all 0.2s ease;
}

.guest-order-form input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.pg-mockup {
    display: flex;
    gap: 16px;
    padding: 8px 0;
}

.radio-label, .checkbox-label {
    font-size: 14px;
    font-weight: 500;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.terms-section {
    margin-bottom: 20px;
    padding: 14px; 
    background: #f8fafc;
    border-radius: 8px;
}

.payment-actions {
    display: flex;
    gap: 12px;
    margin-top: 10px;
}

.btn-pay-cancel {
    flex: 1; 
    padding: 14px;
    background: #ffffff;
    color: #64748b;
    font-size: 15px;
    font-weight: 700;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-pay-cancel:hover {
    background: #f8fafc;
    color: #0f172a;
    border-color: #94a3b8;
}

.btn-pay-submit {
    flex: 2;
    padding: 14px;
    background: #2563eb;
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-pay-submit:hover {
    background: #1d4ed8;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.25);
}

body.policy-page {
    background-color: #f8fafc;
    text-align: left;
}

.policy-section {
    max-width: 900px;
    margin: 60px auto 120px;
    padding: 60px 70px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.03);
}

.policy-title {
    font-size: 32px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 40px;
    padding-bottom: 24px;
    border-bottom: 2px solid #e2e8f0;
    text-align: center;
    letter-spacing: -0.02em;
}

.policy-content {
    font-size: 15px;
    line-height: 1.8;
    color: #475569;
}

.policy-content h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 36px 0 16px;
}

.policy-content p {
    margin-bottom: 16px;
}

.policy-content ul {
    list-style-type: disc;
    padding-left: 24px;
    margin-bottom: 24px;
}

.policy-content li {
    margin-bottom: 8px;
}

.policy-content strong {
    color: #334155;
}

.history-login-box {
	max-width: 480px;
	margin: 0 auto;
	background: #ffffff;
	padding: 50px 40px;
	border: 1px solid #e2e8f0;
	border-radius: 24px;
	box-shadow: 0 4px 24px rgba(15, 23, 42, 0.04);
	text-align: left;
}

.history-error-msg {
	display: none;
	margin-bottom: 24px;
	padding: 14px 16px;
	font-size: 14px;
	font-weight: 500;
	color: #d64545;
	background: #fdecec;
	border-radius: 8px;
	text-align: center;
}

.history-form-group {
	margin-bottom: 24px;
}

.history-form-group.last {
	margin-bottom: 32px;
}

.history-label {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #475569;
	margin-bottom: 8px;
}

.history-input {
	width: 100%;
	height: 48px;
	font-size: 15px;
	padding: 0 12px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	color: #0f172a;
	outline: none;
	transition: all 0.2s ease;
	box-sizing: border-box;
}

.history-input:focus {
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.btn-history-search {
	font-size: 16px;
	padding: 16px;
	border-radius: 12px;
	width: 100%;
}

.history-result-area {
	display: none;
	max-width: 800px;
	margin: 0 auto;
	text-align: left;
}

.history-result-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	border-bottom: 2px solid #0f172a;
	padding-bottom: 16px;
	margin-bottom: 30px;
}

.history-result-title {
	font-size: 28px;
	font-weight: 800;
	color: #0f172a;
	margin: 0;
}

.btn-history-reset {
	background: none;
	border: none;
	color: #64748b;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
	padding: 0;
}

.history-list-container {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.history-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}

.history-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #f1f5f9;
	padding-bottom: 16px;
	margin-bottom: 16px;
}

.history-card-order-no {
	font-size: 13px;
	color: #94a3b8;
	margin-bottom: 4px;
}

.history-card-plan-name {
	font-size: 20px;
	font-weight: 800;
	color: #0f172a;
}

.history-badge {
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 700;
}

.history-badge.success { background: #e0f2fe; color: #0369a1; }
.history-badge.pending { background: #f1f5f9; color: #64748b; }
.history-badge.error   { background: #fdecec; color: #d64545; }

.history-card-details {
	display: grid;
	grid-template-columns: 100px 1fr;
	gap: 12px 0;
	font-size: 15px;
}

.history-card-label {
	color: #64748b;
	font-weight: 600;
}

.history-card-value {
	color: #334155;
	font-weight: 700;
}

.history-card-value.highlight {
	color: #2563eb;
	word-break: break-all;
}

.pay-th-date { width: 12%; text-align: center; }
.pay-th-info { width: 30%; }
.pay-th-email { width: 20%; }
.pay-th-price { width: 13%; text-align: center; }
.pay-th-status { width: 12%; text-align: center; }
.pay-th-manage { width: 13%; text-align: center; }

.pay-td-date { text-align: center; color: #64748b; font-size: 14px; }
.pay-td-time { font-size: 12px; color: #94a3b8; }

.admin-pay-table .pay-td-info { padding-left: 0 !important; cursor: pointer; }
.pay-plan-name { font-weight: 700; color: #0f172a; }
.pay-order-no { font-size: 13px; color: #64748b; margin-top: 4px; }
.pay-icon-key { margin-right: 4px; }

.pay-td-email { color: #475569; }
.pay-td-price { text-align: center; font-weight: 700; }
.pay-td-status { text-align: center; }
.pay-td-manage { text-align: center; }

.pay-btn-refund { width: 60px; padding: 6px; font-size: 12px; height: auto; }

.pay-td-date.is-canceled { color: #94a3b8; }
.pay-plan-name.is-canceled { color: #94a3b8; text-decoration: line-through; }
.pay-order-no.is-canceled { color: #94a3b8; }
.pay-td-email.is-canceled { color: #94a3b8; }
.pay-td-price.is-canceled { color: #94a3b8; }

.text-strike { color: #94a3b8; text-decoration: line-through; }
.text-danger { color: #d64545; }

.admin-search-wrap {
    display: flex;
    gap: 8px;
    align-items: center;
}

.admin-search-select {
    height: 36px;
    padding: 0 12px;
    font-size: 13px;
    color: #334155;
    background-color: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    cursor: pointer;
}

.admin-search-select:focus {
    border-color: #3b82f6;
}

.admin-search-input-box {
    display: flex;
    align-items: center;
    position: relative;
}

.admin-search-input {
    width: 220px;
    height: 36px;
    padding: 0 36px 0 12px;
    font-size: 13px;
    color: #0f172a;
    background-color: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    outline: none;
    transition: all 0.2s ease;
}

.admin-search-input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.admin-search-input::placeholder {
    color: #94a3b8;
}

.admin-search-btn {
    position: absolute;
    right: 8px;
    background: none;
    border: none;
    color: #64748b;
    font-size: 14px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

.admin-search-btn:hover {
    color: #0f172a;
}

/* =============== 반응형 =============== */
@media (max-width: 992px) {
    .product-grid {
        grid-template-columns: repeat(2, 1fr); 
    }
    .product-card.highlight {
        transform: none;
    }
}

@media (max-width: 768px) {
	body {
	    padding-top: 80px;
	}
	section {
	    margin: 20px 10px;
	    padding: 100px 10px;
	}
	.divider {
	    height: 400px;
	    background-color: rgba(56, 52, 52, 0.5);
	}
	.footer_top {
	    right: 10px;
	    bottom: 20px;
	    width: 40px;
	    height: 40px;
	}
	
	.page-hero-bg {
	    height: 250px;
		object-position: right center;
	}

	/* 헤더 */
	.header{
		padding: 20px;
	    width: 100%;
    	height: 80px;
	}
	.header_logo img{
    	height: 30px;
    }
	.mobile-only {
        display: inline;
    }
    .header_nav {
    	position: fixed; 
    	top:0; 
    	right:0; 
    	width: 100%;
    	height:100%; 
    	background:#fff; 
    	z-index:999; 
    	padding:100px 30px 30px;
    	transform: translateX(100%);
    	transition: transform .3s ease;
    }
    .header_menu_mobile {
        display: block;
    }
    
    .header_menu_close {
	    display: block;
	    position: absolute;
	    top: 30px;
	    right: 30px;
	}
	
	.footer {
	    position: relative;
	    background-color: #28293b;
	    padding: 20px;
	    text-align: center;
	    color: #ffffff;
	}
	
	.footer_container {
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    gap: 10px;
	    justify-content: center;
	}
	
	.footer_logo {
	    width: 50px;
	    margin-top: 20px;
	    margin-bottom: 0px;
	}
	
	.footer_copy{
		font-size: 12px;
		margin-top: 5px;
	}
		
	.page-hero {
	    position: relative;
	    margin: 0;
	    border-radius: 0;
	}
	
	.hero-image-mobile {
	    display: block;
	    height: 100vh;
	    margin-top: -80px; 
	    padding-top: 80px;
	    overflow: hidden;
	}
	.hero-image-mobile img {
	    width: 100%;
	    height: calc(100vh - 80px);
	    object-fit: cover;
	}
	.hero-image {
	    display: none;
	}

    .header_nav.active {
        transform: translateX(0);
    }

    .header_nav.active .header_menu {
        flex-direction: column;
        gap: 0;
    }

    .header_nav.active .header_menu-item {
        border-bottom: 1px solid #e0e0e0;
        padding: 15px 0;
    }

    .header_nav.active .header_dropdown {
        display: none;
        position: static;
        transform: none;
        padding-top: 10px;
        align-items: flex-start;
    }

    .header_nav.active .header_menu-item.open .header_dropdown {
        display: flex;
    }

    .header_dropdown-bg {
        display: none !important;
    }
	
    .page-hero-title {
        font-size: 32px;
    }
    
    .about_logo {
		width: 100%;
	    max-width: 100px;
		height: auto;
		margin-bottom: 50px;
	}
	
    .about-headline {
    	font-size: 22px;
    	margin-bottom: 50px;
    }
    
	.about-management .about-headline {
	    margin-bottom: 100px;
	    text-align: center;
	}
	
	.about-vision .about-headline {
	    margin-bottom: 100px;
	}
	
	.about-bi .about-headline {
	    margin-bottom: 100px;
	}
    
    .about-body, .about-lead {
    	font-size: 16px;
    }
    
    .about-lead br, .about-body br,
	.bi-concept br, .kkk-body br, 
	.kaminoai-body br, .process-step-desc br {
        display: none;
    }
    
    .strength-cards {
	    flex-direction: column;
	}
	
	.strength-col.offset {
	    margin-top: 0;
	}

    .about-strength {
        flex-direction: column;
    }
    
    .strength-col > div {
    	margin: 0px;
	}
    
    .about-strength-text {
        max-width: none;
    }
        
    .strength-card-title {
    	font-size: 16px;
    	margin-top: 10px;
   	}
    	
    .strength-card-desc {
    	font-size: 14px;
		margin-top: 10px;
    }	
    
    .exec-photo {
    	width:100%;
    	max-width: 150px;
	}
    
    .exec-name{
    	font-size: 24px;
    	font-weight: 600;
   	}
   	
   	.exec-title{
    	font-size: 18px;
   	}
   	
   	.exec-career-label, .exec-develop-label, .exec-lecture-label{
   		font-size: 20px;
   	}
   	
   	.exec-list { 
   		align-items: center; 
	}
   	
   	.exec-info {
   		text-align: center;
   	}
   	
   	.exec-table, .exec-table tbody,	.exec-table tr {
	    display: block;
	    width: 100%;
	}
	
	.timeline-date,	.timeline-desc {
	    display: block;
	    width: 100%;
	    font-size: 18px;
	}
	
	.timeline-date {
		font-weight: 600;}
	
	.timeline-desc {
	    margin-bottom: 20px;
	}
    
    .exec-card {
        flex-direction: column;
        align-items: center;
    }
    
    .vision-num {
    	font-size: 18px;}
    	
	.vision-sub {
		font-size: 16px;}
		
	.vision-desc{
		font-size: 16px;}
		
	.bi-subhead{
		font-size: 20px;}
		
	.bi-concept p{
		font-size: 16px;}
		
    .bi-under-logo img {
    	height: 100px; 
        width: auto;
    	margin: 0 auto;
  	}
		    	
    .desktop-only { display: none !important; }
     .mobile-only { display: block !important; }
    
    body.poda-page {
        overflow-x: hidden;
        width: 100%;
    }

    .poda-brand-mark,
    .poda-brand-mark2 {
        max-width: 80%;
        height: auto;
        margin: 40px auto;
    }

    .poda-headline-section .poda-headline,
    .poda-headline {
        font-size: 18px;
        max-width: 100%;
        padding: 0;
        word-break: keep-all;
    }
   
   .poda-quote {
       font-size: 15px;
   }
	.poda-acronym,
    .poda-acronym strong {
        font-size: 15px;
        letter-spacing: 3px;
    }

    .poda-body {
        font-size: 18px;
        padding: 0 15px;
        word-break: keep-all;
    }

    .poda-body-strong {
        font-size: 20px;
    }

    .problem-columns {
        flex-direction: column;
        align-items: center;
        gap: 40px;
        width: 100%;
        padding: 0 15px;
    }

    .problem-columns img {
        width: 112%;
        max-width: none;
        height: auto;
    }

    .poda-feature-row,
    .poda-feature-row.reverse {
        flex-direction: column;
        gap: 30px;
        width: 100%;
    }

    .poda-feature-text {
        align-self: stretch;
        max-width: 100%;
        margin-left: 0;
        padding: 0 15px;
    }

    .poda-steps {
        width: 100%;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .poda-step {
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .poda-step-photo {
        width: 100%;
    }

    .poda-step-text {
        width: 100%;
        flex: none;
        height: auto;
        padding: 24px 20px;
    }

    .poda-step-title {
        font-size: 20px;
    }

    .poda-step-sub {
        font-size: 18px;
    }

    .poda-step-list li {
        font-size: 15px;
        word-break: keep-all;
    }

    .poda-feature-row-2 {
        gap: 30px;
        width: 100%;
    }

    .poda-points {
        grid-template-columns: 1fr;
        width: 100%;
        padding: 0 15px;
    }

    .poda-point {
        width: 100%; 
        max-width: 100%;
        height: auto;
        padding: 24px 16px;
    }

    .poda-point-icon {
        display: none;
    }

    .poda-point-title {
        font-size: 20px;
    }
    
    .poda-point-desc {
        font-size: 16px;
        word-break: keep-all;
    }

    .poda-closing-text {
        font-size: 20px;
        padding: 0 15px;
        margin-top: 60px;
        word-break: keep-all;
    }

    .carousel-track {
       display: flex;
       gap: 12px;
       overflow-x: auto;
       scroll-snap-type: x mandatory;
       scroll-behavior: smooth;
       padding: 10%;
       padding-left: 25%;
       padding-right: 18%;

       -ms-overflow-style: none;
       scrollbar-width: none;
     }
     .carousel-track::-webkit-scrollbar { display: none; }

     .carousel-img {
       flex: 0 0 100%; 
       max-width: 230px;
       width: 100%;
       scroll-snap-align: center;
       scroll-margin-top: 100px;
       border-radius: 12px;
     }

     .carousel-dots {
       display: flex;
       justify-content: center;
       gap: 8px;
       margin-top: 12px;
     }

     .carousel-dots .dot {
       width: 24px;
       height: 6px;
       border-radius: 4px;
       background-color: #e0e0e0;
       animation-name: activeDot;
       animation-range: cover 30% cover 70%;
       animation-fill-mode: both;
     }
	 
     .poda-section, body {
     	timeline-scope: --i1, --i2, --i3, --i4;
     }

     #img-1 { view-timeline: --i1 inline; }
     #img-2 { view-timeline: --i2 inline; }
     #img-3 { view-timeline: --i3 inline; }
     #img-4 { view-timeline: --i4 inline; }

     .dot-1 { animation-timeline: --i1; }
     .dot-2 { animation-timeline: --i2; }
     .dot-3 { animation-timeline: --i3; }
     .dot-4 { animation-timeline: --i4; }

     @keyframes activeDot {
       0%, 100% { width: 24px; background-color: #e0e0e0; }
       50% { width: 48px; background-color: #ff6d00; }
  	}
  
     .poda-pet {
        background: #FFF9EF;
        border: 1px solid #F48A2A;
        border-radius: 16px;
        padding: 10%;
        max-width: 100%;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
        margin-top: 5%;
   }
   .poda-pet h2 {
        margin: 0 0 12px 0;
        font-size: 20px;
        font-weight: 700;
        color: #222222;
        line-height: 1.4;
        word-break: keep-all; 
   }

   .poda-pet h2 .highlight {
        color: #F48A2A;
        font-weight: 800;
        margin-left: 4px;
   }      

   .poda-pet-info {
       margin: 0;
        font-size: 15px;
        font-weight: 400;
        color: #555555;
        line-height: 1.6;
        word-break: keep-all;
   }
    
    .kkk-logo{
        height: auto; 
        width: 100%;
        max-width: 250px;
        margin: 0 auto;    
    }
    
    .kkk-tagline-text, .kkk-tagline-text strong {
    	letter-spacing: 6px;
    }
    
    .kkk-subtitle-text, .kkk-headline {
    	font-size: 22px;}
    	
   	.kkk-headline.kkk-headline-steps{
   		font-size: 22px;}
    	
   	.kkk-body, .kkk-lead{
   		font-size: 16px;}
   		
    .step-card-header {
        padding: 20px;
    }
    
    .step-tag {
    	font-size: 14px;}

    .step-card.is-open .step-card-body {
        padding: 20px;
    }

    .point-title br{
    	display: none;}

    .step-title {
    	font-size: 16px;}

    .step-card-body p {
    	font-size: 16px;
    	margin-bottom: 0;}

    .step-tag br{
   		display:none;
    }

    .kkk_point-card {
    	padding: 20px;}   
    
    .point-title {
    	font-size: 18px;}
    
    .point-desc {
    	font-size: 16px;}
    
    .points-grid {
        grid-template-columns: 1fr;
    }

    .kkk-shot-item {
        flex-direction: column;
        align-items: center;
        border-radius: 10px;
        overflow: hidden;
    }

	.kkk-shot-img-box {
        max-width: 400px;
        width: 100%;
    }

    .kkk-shot-text {
        max-width: 400px;
        width: 100%;
        padding: 18px;
    }

    .kkk-shot-img {
        width: 220px;
        max-width: 220px;
    }
    
    .kkk-shot-step {
    	font-size: 16px;}
    	
    .kkk-shot-title {
    	font-size: 20px;
    	margin: 4px 0;}
    	
    .kkk-shot-desc {
    	font-size: 14px;}

    .problem-num {
    	font-size: 20px;}
    	
    .problem-quote {
    	font-size: 18px;}
    
    .kkk-tagline-text, .kkk-callout-title {
        font-size: 16px;
    }
    
    .kkk-closing-text {
    	font-size: 22px;}
    
    .kkk-lead br{
    	display: none;
    }
    
    .kkk_problem-desc, .kkk-callout-sub, .kkk-callout-desc{
    	font-size: 16px;}
    
    .bottom_logo{
        height: auto; 
        width: 100%;
        max-width: 200px;
        margin: 0 auto;     	
    }
	
    .kaminoai-brand-mark{
        height: auto; 
        width: 100%;
        max-width: 250px; 
        margin: 0 auto;    
    }
    
    .kaminoai-tagline-sub{
    	display: none;
		font-size: 16px;
		letter-spacing: 6px;
	}
    
   	.kaminoai-body, .kaminoai-body-strong{
   		font-size: 16px;
   	}
   	
   	.kaminoai-callout{
   		display: none;
   	}
   	
   	.reason-title{
   		font-size: 18px;
	}
	
	.reason-quote{
		font-size: 18px;
	}
	
	.reason-desc{
		font-size: 16px;
	}
    
    .reason-item {
        flex-direction: column;
        padding: 20px;
        gap: 16px;
    }
    
    .process-steps {
        flex-direction: column;
    }
    
    .kaminoai-process-title{
    	font-size: 22px;
    }
    
    .kaminoai-callout-light{
    	padding: 14px;}
    	
    .process-step-head{
    	font-size: 18px;
    	padding: 10px;
    }
    
    .process-step-title{
    	font-size: 18px;
    	margin: 15px;
    }
    
    .process-step-desc{
    	font-size: 16px;
    	margin: 15px;
    }
    
   	.kaminoai-process-sub{
   		font-size: 16px;
	}
	
    .kaminoai-headline{
    	font-size: 22px;
   	}
   	
   	.engine-carousel-prev, .engine-carousel-next { 
   		display: none; 
   	}
   	
   	.engine-carousel-viewport { 
   		overflow: visible; 
   	}
   	
   	.engine-carousel-track { 
   		flex-direction: column; 
   	}
   	
   	.kaminoai_point-card {
   		flex: 1;
   		height: auto;
   		width: 100%;
   		max-width: 360px;
   	}
   	
   	.engine-carousel-track {
   		display: flex;
   		align-items: center;
   	}
   	
   	.point-card-body {
	    padding: 16px;
	}
   	
   	.point-card-img {
	    width: 100%;
	    height: 100px;
	    object-fit: cover;
	    display: block;
	}
	
	.point-card-num {
		font-size: 18px;
	}
	
	.point-card-title {
		font-size: 16px;
	}
	
	.point-card-desc {
		font-size: 12px;
	}
   	
   	.engine-desc{
    	font-size: 14px;
   	}
    
    .engine-row {
        display: flex;
    	flex-direction: column;
    	align-items: center;
    	}
    .engine-text {
        flex: 1 1 auto;
        margin-bottom: 0;
    }
    .kaminoai-tagline-text,
    .kaminoai-tagline2-text,
    .kaminoai-closing-text {
        font-size: 22px;
    }
    .kaminoai-brand-mark2{
        height: auto; 
        width: 100%;
        max-width:300px; 
        margin: 0 auto;
   	}
	
   	.dopple-logo-top{
   		height: auto;
      	max-width: 200px;
        width: 100%;
        margin: 0 auto;
   	}
      
    .dopple-body {
    	font-size: 18px;
    }
      
    .dopple-tagline-text {
        font-size: 24px;
    }
    
    .dopple-card-header {
        padding: 24px;
    }
    .dopple-card.is-open .dopple-card-body {
        padding: 24px;
    }
    .dopple-card-header-top {
        align-items: flex-start;
    }
    .dopple-image-grid-3,
    .dopple-image-grid-2 {
        grid-template-columns: 1fr;
    }
    
    .dopple-card-title {
    	font-size: 22px;
    }
    
    .dopple-card-desc {
    	font-size: 16px;
    }
    
    .dopple-list strong {
    	font-size: 18px;
    }
    
    .dopple-list li {
    	font-size: 16px;
    }
    
    .dopple-icon-text strong{
    	font-size: 18px;
    }
    
    .dopple-icon-text {
    	font-size: 16px;
    }
    
    .dopple-honeycomb {
        gap: 4%;
        margin-top: 10%;
        padding: 0 4%;
    }

    .dopple-hc-row {
        flex-wrap: wrap;
        gap: 3%;
        width: 100%;
        justify-content: center;
    }

    .dopple-hc-item {
        width: 44%; 
        aspect-ratio: 4 / 3;
        height: auto;
        padding-top: 5%;
        margin-top: 10%;
        border-radius: 8%;
        box-shadow: -4px 4px 8px rgba(0, 0, 0, 0.2);
    }

    .dopple-hc-icon {
        width: 35%;
        height: auto;
        aspect-ratio: 1;
        font-size: 125%;
    }

    .dopple-hc-label {
        margin-top: 3%;
        font-size: 85%;
        letter-spacing: -0.05em;
        word-break: keep-all;
        padding: 0 3%;
    }

	.notice-page-title {
		font-size: 22px;
		margin: 50px;}
		
	.notice-meta, .notice-col-title, .notice-col-date {
	    font-size: 16px;
	}
	
    .notice-col-date {
        flex: 0 0 100px;
        padding-left: 12px;
    }
    .notice-col-title {
        padding-left: 8px;
    }

    .notice-detail-body {
        font-size: 16px;
        min-height: 160px;
    }
    
    .notice-detail-title {
    	font-size: 22px;}
    	
    .notice-detail-views, .notice-detail-meta {
    	font-size: 14px;}

    .admin-login-card {
        padding: 40px 24px 32px;
    }
	
	.purchase-section {
	    padding: 50px 20px 80px;
	}

	.purchase-title {
	    font-size: 28px;
	    margin-bottom: 12px;
	}

	.purchase-desc {
	    font-size: 16px;
	    margin-bottom: 40px;
	    word-break: keep-all;
	}
	
	.product-grid {
        grid-template-columns: 1fr; 
    }

	.product-card {
	    max-width: 100%;
	}

	.product-header {
	    padding: 30px 20px;
	}

	.product-name {
	    font-size: 24px;
	}

	.product-price {
	    font-size: 32px;
	}

	.product-body {
	    padding: 30px 20px;
	}

	.product-benefits li {
	    font-size: 15px;
	    word-break: keep-all;
	}

	.product-footer {
	    padding: 0 20px 30px;
	}

	.btn-purchase {
	    padding: 15px;
	    font-size: 18px;
	}

	.payment-modal-header {
	    padding: 16px 20px;
	}

	.payment-modal-title {
	    font-size: 18px;
	}

	.payment-modal-body {
	    padding: 20px;
	}

	.pg-placeholder {
	    height: 200px;
	}

	.pg-placeholder p {
	    font-size: 16px;
	}

	.pg-placeholder span {
	    font-size: 14px;
	}

	.purchase-policy-box {
	    padding: 24px;
	}
	
	.notice-container {
        max-width: 100%;
        padding: 0 24px;
        box-sizing: border-box;
        margin-bottom: 20px;
    }

    .board-top-bar,
    .notice-meta {
        margin-top: 10px;
        margin-bottom: 12px;
        gap: 10px;
    }

    .board-total,
    .notice-meta {
        font-size: 13px;
    }

    .notice-write-link {
        padding: 8px 14px;
        font-size: 12px;
        height: auto;
    }

    .inquiry-board-custom .notice-table-wrapper {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .inquiry-board-custom .notice-table {
        min-width: 100%;
    }
    
	.inquiry-board-custom .notice-col-num {
		display: none;
	}

    .inquiry-board-custom .notice-table :is(th, td):nth-child(1) {
        display: table-cell;
        width: 44px;
        text-align: left;
    }

    .inquiry-board-custom .notice-table th {
        padding: 12px 10px;
        font-size: 13px;
    }

    .inquiry-board-custom .notice-row td {
        padding: 12px 10px;
        font-size: 13px;
    }

    .inquiry-board-custom .notice-table :is(th, td):nth-child(2) { width: 90px; }
    .inquiry-board-custom .notice-table :is(th, td):nth-child(3) { width: auto; word-break: keep-all;}
    .inquiry-board-custom .notice-table :is(th, td):nth-child(4) { width: 85px; }
    .inquiry-board-custom .notice-table :is(th, td):nth-child(5) { width: 70px; }

    .inquiry-board-custom .inquiry-status {
        width: 48px;
        height: 24px;
        font-size: 11px;
    }

    .inquiry-detail-section {
        margin: 16px auto;
        gap: 16px;
    }

    .inquiry-detail-card {
        padding: 18px 16px;
    }

    .inquiry-card-header {
        padding-bottom: 14px;
        margin-bottom: 16px;
    }

    .inquiry-title-wrapper {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 12px;
    }

    .inquiry-detail-title {
        font-size: 17px;
        word-break: break-all;
    }

    .inquiry-detail-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        font-size: 13px;
    }

    .inquiry-detail-writer {
        font-size: 14px;
        gap: 10px;
    }

    .inquiry-detail-date {
        font-size: 13px;
    }

    .inquiry-detail-body {
        min-height: 100px;
        font-size: 14px;
        line-height: 1.6;
    }

    .inquiry-detail-actions {
        padding-top: 14px;
        margin-top: 16px;
    }

    .notice-list-btn {
        width: 100%;
        justify-content: center;
        padding: 10px 0;
        font-size: 13px;
    }

    .inquiry-reply-section {
        margin-top: 20px;
        padding-top: 16px;
    }

    .inquiry-reply-section .inquiry-reply-header .inquiry-reply-icon {
        width: 32px;
        height: 32px;
        font-size: 14px;
        margin-right: 10px;
    }

    .inquiry-reply-body {
        font-size: 15px;
        padding: 12px 0;
    }
	.inquiry-write-title {
		margin-top: 5%;
	}

    .inquiry-form-row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 16px 0;
        border-bottom: 1px solid #f1f3f5;
    }

    .inquiry-form-label {
        flex: none;
        width: 100%;
        font-size: 14px;
        font-weight: 600;
        color: #333333;
        margin-bottom: 2px;
        text-align: left;
    }

    .inquiry-form-field {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
        box-sizing: border-box;
    }

    .inquiry-form-field input[type="text"],
    .inquiry-form-field input[type="email"],
    .inquiry-form-field input[type="password"],
    .inquiry-form-field select {
        box-sizing: border-box;
        height: 44px; 
        padding: 0 12px;
        font-size: 14px;
        color: #222222;
        background-color: #ffffff;
        border: 1px solid #dce1e7;
        border-radius: 6px;
        outline: none;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
        -webkit-appearance: none; 
        appearance: none;
    }

    .inquiry-form-field input[type="text"]:focus,
    .inquiry-form-field input[type="email"]:focus,
    .inquiry-form-field input[type="password"]:focus,
    .inquiry-form-field select:focus {
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
    }

    .inquiry-form-field > input[type="text"]:only-child,
    .inquiry-form-field > select:only-child {
        max-width: none;
    }

    .inquiry-form-field input[name*="email"],
    .inquiry-form-field input[id*="email"],
    .inquiry-form-field select {
        flex: 1 1 0px;
        min-width: 0;
    }

    .inquiry-form-field span {
        font-size: 14px;
        color: #888888;
        font-weight: 500;
        flex: none;
   	}
	
	.history-login-box {
		padding: 30px 20px;
	}
	.history-result-title {
		font-size: 20px;
	}
	.history-card {
		padding: 20px;
	}
	
	.policy-section {
        margin: 40px 20px 80px;
        padding: 40px 24px;
    }
    .policy-title {
        font-size: 24px;
    }
	.modal-content {
        padding: 30px 24px;
    }
    .modal-title {
        font-size: 20px;
    }
    .modal-desc {
        font-size: 15px;
    }
	.footer_info {
        text-align: center;
    }
    .footer-divider-v.desktop-only {
        display: none;
    }
    .footer_text {
        display: block;
        margin-bottom: 4px;
    }

	.board-top-bar {
	    flex-direction: column;
	    align-items: flex-start;
	    gap: 12px;
	}
	.admin-search-wrap {
	    width: 100%;
	}
	.admin-search-select {
	    width: 35%;
	    flex-shrink: 0;
	}
	.admin-search-input-box {
	    width: 65%;
	    flex-grow: 1;
	}
	.admin-search-input {
	    width: 100%;
	}
}