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

:root {
	--font-family-main: 'Pretendard', 'Malgun Gothic', sans-serif;
}

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

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%; }

/* 가로선 */
.divider-h {
    max-width: 1120px;
    margin: 0 auto;
    border: none;
    border-top: 1px solid rgba(56, 52, 52, 0.5);
}

.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 =============== */
/* 헤더 */
.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;
}

/* about, business, notice */
.header_menu-item {
	padding-top: 20px;
    position: relative;
    padding-bottom: 20px;
}

/* about, business, notice 링크 */
.header_menu-link {
    font-size: 24px;
    font-weight: 600;
    color: #383434;
    text-decoration: none;
    cursor: pointer;
}

/* about, business, notice */
.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 a:hover {
    background-color: rgba(90, 85, 129, 0.5);  /* 호버 시: 남색 반투명 pill */
    color: #ffffff;
}

.header_dropdown-bg {
    display: none;
    position: absolute;
    top: 100%;
    left: -30px;
    right: -30px; /* .menu 전체 폭(About~Culture)에 맞춰 늘어남 */
    height: 270px; /* 가장 긴 목록(Business 4개) 기준 */
    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 =============== */
/* 메인 콘텐츠 (헤더 아래 공간) */

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

.page-hero {
    position: relative;
    height: 400px;
    overflow: hidden;
}

.page-hero-bg {
    width: 100%;
    height: 100%;
    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 =============== */
.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_brand {
    font-size: 22px;
    font-weight: 600;
}

.footer_addr,
.footer_reg {
    margin-top: 8px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.85);
}

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

.footer_copy {
    margin-top: 20px;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.85);
}

.footer_top {
    position: fixed;
    right: 100px;
    bottom: 100px;
    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;
}

/* =============== about =============== */
:root {
    --about-navy: #2e2f5b;
    --about-text: #383434;
    --about-divider: #383434;
}

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

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

/* 메뉴 about 글씨 */
body.about-page .header_menu > .header_menu-item:first-child > .header_menu-link {
	text-decoration: underline; /* 밑줄 */
    position: relative;
    color: var(--about-navy);
    font-weight: 800;
}

/* ----- Intro ----- */
.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: 770px;
    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);
}


/* ----- VISION & MISSION ----- */
.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);
}

/* ----- COMPANY BI ----- */
.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;
}


/* =============== business 공통 =============== */
/* Active nav state on Business pages */
body.business-page .header_menu > .header_menu-item:nth-child(2) > .header_menu-link {
	text-decoration: underline; /* 밑줄 */
    position: relative;
    color: #2e2f5b;
    font-weight: 800;
}


/* =============== PODA =============== */
:root {
    --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;
}

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;
}

/* ----- 4가지 문제점  ----- */
.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);
}

/* ----- 기능 1: Step 카드 ----- */
.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);
}

/* ----- 기능 2: Point 카드 + 이미지 ----- */
.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-feature-final {
    text-align: center;
}

.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);
}

/* =============== KKK =============== */
:root {
    --kkk-navy: #183857;
    --kkk-blue: #357abd;
    --kkk-text: #383434;
    --kkk-text-light: #383434;
}

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-url {
    margin-top: 16px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.12em;
    color: var(--kkk-navy);
}

/* ----- 태그라인 ----- */
.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;
}

/* ----- 3단계 분석 ----- */
.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;
}

/* ----- 4가지 포인트 ----- */
.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);
}

/* =============== KAMINOAI =============== */
:root {
    --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);
}

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);
}

/* ----- 태그라인 2 ----- */
.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;
}

/* ----- 4가지 문제 리스트 ----- */
.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);
}

/* ----- 프로세스: 콜아웃(라이트) + 3단계 카드 ----- */
.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);
}

/* =============== DOPPLEMATE =============== */
:root {
    --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;
}

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: 5;
}

.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;
}

/* ----- 카드1 스타일 리스트 (불릿) ----- */
.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);
}

/* =============== notice =============== */
:root {
    --notice-text: #383434;
    --notice-text-sub: #383434;
    --notice-border: #e2e2e2;
    --notice-navy: #2e2f5b;
    --notice-num-bg: #f1f1f1;
}

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

.notice-container {
    margin: 0 auto;
    padding: 0 40px;
}

body.notice-page .header_menu > .header_menu-item:nth-child(3) > .header_menu-link {
	text-decoration: underline;
    position: relative;
    color: var(--notice-navy);
    font-weight: 800;
}

.notice-list-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    height: 40px;
    border-radius: 12px;
    background: rgba(84, 78, 78, 0.8);
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s ease;
}

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


/* =============== notice - 공지사항 목록 =============== */
.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-meta {
    margin-bottom: 12px;
    font-size: 18px;
    font-weight: 500;
    color: var(--notice-text-sub);
}

.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, .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-meta-admin {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.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);
}


/* =============== 공지사항 작성 =============== */
.notice-write-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 16px;
    background: rgba(84, 78, 78, 0.8);
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    border-radius: 8px;
    text-decoration: none;
    transition: background 0.2s ease;
}

.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-write-link:hover {
    background: rgba(84, 78, 78, 1);
}

.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);
}


/* =============== 1:1 문의 =============== */
.notice-meta-admin {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notice-write-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 16px;
    background: rgba(84, 78, 78, 0.8);
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
    border-radius: 8px;
    text-decoration: none;
    transition: background 0.2s ease;
}

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




.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;
}

/* =============== notice - 1:1문의 작성 =============== */
.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;
}


/* =============== 1:1문의 상세 =============== */
.inquiry-detail-section {
    padding: 60px 0 120px;
}

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

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

.inquiry-detail-writer {
    display: flex;
    gap: 20px;
}

.inquiry-detail-body {
    min-height: 220px;
    padding: 60px 0;
    text-align: center;
    font-size: 30px;
    font-weight: 500;
    color: var(--notice-text-sub);
}

.inquiry-detail-attachment {
    padding: 16px 0;
    border-bottom: 1px solid var(--notice-border);
    font-size: 18px;
    font-weight: 500;
    color: var(--notice-text-sub);
}

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

/* ----- 답변 ----- */
.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);
}

/* =============== 1:1문의 상세 =============== */
.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;
}


/* =============== 어드민 로그인 =============== */
:root {
    --admin-navy: #2e2f5b;
    --admin-navy-dark: #22233f;
    --admin-text: #383434;
    --admin-text-light: #8a8a8a;
    --admin-border: #e2e2e6;
}

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);
}


/* =============== 반응형 =============== */
@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;
	}
		

	/* 헤더 */
	.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_brand{
		font-size: 16px;
		margin-top: 5px;
		margin-bottom: 10px;}
	
	.footer_addr, .footer_reg, .footer_copy{
		font-size: 12px;
		margin-top: 5px;}
		
	/* 히어로 */
	.page-hero {
	    position: relative;
	    margin: 0;
	    height: 320px;
	    border-radius: 0;
	    overflow: hidden;
	}
	
	/* 메인홈 */
	.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;
    }
	
	
	/* hero */
    .page-hero-title {
        font-size: 32px;
    }
    
    /* @about */
    .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 {
        display: none;
    }
    
    .about-body 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: flex-start; 
   		margin-left: 20px;
	}
   	
   	.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: flex-start;
    }
    
    .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-concept br {
        display: none;
    }
    
    .bi-under-logo img {
    	height: 100px; 
        width: auto;
    	margin: 0 auto;
  	}
		    	
    /* @poda */
    .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%;

       -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;
       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;
     }
     /* Dots 하일라이트 */
     .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: #555555; }
  }
  
     .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 */
    
    .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;}
   		
	.kkk-body br{
		display: none;}

    .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 */
    .kaminoai-brand-mark{
        height: auto; 
        width: 100%;
        max-width: 250px; 
        margin: 0 auto;    
    }
    
    .kaminoai-tagline-sub{
    	display: none;}
    
    .kaminoai-tagline-sub{
    	font-size: 16px;}
    
    .kaminoai-tagline-sub{
    	letter-spacing: 6px;
    }
    
    .kaminoai-body br{
    	display: none;
   	}
   	
   	.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;
    }
    
    .process-step-desc br {
    	display: none;}
    	
   	.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;
   	}
	/* @dopplemate */
   	.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 */
	.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;
    }
        .notice-write-toolbar {
        flex-wrap: wrap;
        height: auto;
        padding: 8px;
    }    
    
}