@charset "utf-8";
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');

/* reset */
* {
  margin: 0;
  padding: 0;
  line-height: 1.4em;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  -webkit-hyphens: auto;
  hyphens: auto;
  letter-spacing: -0.05em;
  vertical-align: middle;
  font-family: inherit;
  color: inherit;
  font-weight: inherit;
}

html, body {height: 100%; font-size: 12px; font-family: 'Pretendard', sans-serif;}
body {color: #333; -webkit-text-size-adjust: none; word-break: keep-all; word-wrap: break-word; overflow-x: hidden;}
legend, caption, figcaption {display: none;}
ul,ol {list-style-image: none; list-style-position: outside; list-style-type: none; border: 0px;}
img,fieldset, frameset, frameborder, frame {border: 0;}
a, img, span, b, input, select, em, textarea, label, strong {vertical-align: middle; outline-style: none; color: inherit; font-family: inherit;}
a {color: inherit; text-decoration: none; cursor: pointer; color: inherit; font-family: inherit;}
a:hover {text-decoration: none;}
i, em {font-style: normal;}
textarea {resize: none;}
button {border: none; background: none; outline: none; cursor: pointer;}
input[type="text"],input[type="password"], textarea {-webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-radius: 0;}
select {border-radius: 0; background: #fff;}
label {cursor: pointer;}

/* responsive font */
@media screen and (max-width: 1200px) {
  html {font-size: 16px;}
}

@media screen and (max-width: 768px) {
  html {font-size: 15px;}
}

@media screen and (max-width: 540px) {
  html {font-size: 14px;}
}

@media screen and (max-width: 420px) {
  html {font-size: 13px;}
}

img {max-width: 100%;}

@media all and (max-width: 1200px) {
  .mobile-hidden {display: none !important;}
}

/* layout */
.wrap,
#wrap {width: 100%; max-width: 1200px; margin: 0 auto; background: #fff; display: flex; flex-direction: column; min-height: 100vh;}
.wrap > footer,
.wrap > .footer-new {margin-top: auto;}
.wrapper {width: 1200px; margin: 0 auto;}
.header {position: fixed; top: 0; left: 0; width: 100%; height: 45px; background: #fff; z-index: 20; box-sizing: border-box; border-bottom: 1px solid #e0e0e0;}
.header:after {content: ""; position: absolute; top: 100%; left: 0; width: 100%; height: 80px; background: url("/public/storage/pattern.jpg") center / cover no-repeat; display: block;}
.header .wrapper {position: relative; text-align: center; display: flex; align-items: center; height: 100%;}
.header .logo {line-height: 1; display: flex; align-items: center;}
.header .logo a {font-size: 22px; font-weight: bold; display: flex; align-items: center;}
.header .logo img {height: 20px; display: block;}

@media all and (max-width: 1200px) {
  .header:after {display: none;}
  .header {padding: 8px 0; height: 50px; border-bottom: none;}
  .header .logo {height: 30px; position: relative; padding-right: 0; text-align: left; float: none; font-size: 18px;}
  .header .logo img {height: 20px;}
  .wrapper {width: 100%; padding: 0 15px;}
  #wrap,
.wrap {padding-top: 50px;}
}

#content {overflow: hidden; padding-bottom: 0; margin-top: 94px; background: #fff;}

@media all and (max-width: 1200px) {
  #content {padding-bottom: 50px; margin-top: 0;}
  #content .sub-content {box-sizing: border-box;}
}

.lnb ~ #content .sub-content .content-title {margin-top: 0;}
.lnb ~ #content .sub-content.wrapper {width: auto;}

/* LNB (서브 좌측 네비게이션) */
.sub-layout {display: flex; gap: 40px; max-width: 1200px; margin: 0 auto; padding: 0 0 60px;}
.lnb {width: 220px; flex-shrink: 0;}
.lnb-menu {list-style: none; margin: 0; padding: 0; border: 1px solid #e0e0e0; border-top: 2px solid #2a166f; border-radius: 0 0 8px 8px; overflow: hidden;}
.lnb-menu li a {display: block; padding: 13px 20px; font-size: 14px; color: #555; text-decoration: none; border-bottom: 1px solid #f0f0f0; transition: all 0.2s;}
.lnb-menu li:last-child a {border-bottom: none;}
.lnb-menu li a:hover {color: #2a166f; background: #f7f5ff; padding-left: 25px;}
.lnb-menu li.on a {color: #2a166f; font-weight: 700; background: #F5F5DC; border-left: none; padding-left: 20px; position: relative;}
.lnb-menu li.on a:after {content: '\f054'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 11px; color: #2a166f;}
.lnb-banner {margin-top: 20px; background: #f5f6f8; border-radius: 8px; padding: 24px 20px; text-align: center;}
.lnb-banner h4 {font-size: 16px; font-weight: 700; color: #2a166f; margin-bottom: 12px;}
.lnb-banner p {font-size: 13px; color: #555; line-height: 1.5; margin-bottom: 14px;}
.lnb-banner .btn-lecture {display: inline-block; padding: 10px 28px; background: #2a166f; color: #fff; font-size: 14px; font-weight: 600; border-radius: 20px; text-decoration: none; transition: background 0.2s;}
.lnb-banner .btn-lecture:hover {background: #1a0e4f;}
.lnb-downloads {margin-top: 10px;}

.lnb-downloads a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border: 2px solid #999;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #999;
  text-decoration: none;
  transition: all 0.2s;
}

.lnb-downloads a + a {margin-top: 8px;}
.lnb-downloads a:hover {background: #F5F5DC; color: #2a166f; border-color: #F5F5DC;}
.lnb-downloads a i {font-size: 12px;}
.sub-layout > .lnb-wrap {width: 220px; flex-shrink: 0;}
.sub-layout > .lnb,
.sub-layout > nav.lnb {width: 220px; flex-shrink: 0;}
.sub-layout > .sub-content {flex: 1; min-width: 0;}
.sub-layout > .sub-content .content-title {margin-top: 0;}

@media all and (max-width: 1200px) {
  .sub-layout {flex-direction: column; gap: 0; padding: 0 15px 40px;}
  .lnb {display: none;}
}

.content-title {position: relative; margin-bottom: 40px; margin-top: 95px;}
.content-title h2 {display: inline-block; line-height: 36px; font-size: 25px; border-bottom: 2px solid #2a166f; padding-bottom: 20px;}
.content-title .breadcrumb {position: absolute; top: 15px; right: 0; line-height: 36px;}
.content-title .breadcrumb ul {overflow: hidden;}
.content-title .breadcrumb ul li {float: left; font-size: 14px; color: #999;}
.content-title .breadcrumb ul li img {vertical-align: middle;}

@media all and (max-width: 1200px) {
  .content-title {display: block; margin-bottom: 35px; margin-top: 30px; padding-top: 10px;}
  .content-title h2 {line-height: 27px; font-size: 1.6rem; border-bottom: 2px solid #2a166f; padding-bottom: 15px;}
}

.content-detail h2 {font-size: 25px; line-height: 120%; margin-bottom: 20px; color: #2a166f;}
.lnb ~ #content .content-title h2 {margin-top: 0;}
.header + .sub-visual-wrap {min-height: auto; margin-top: 0;}

.sub-visual-wrap {
  position: relative;
  z-index: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  min-height: 100px;
  padding: 30px 40px;
  background: #F5F5DC center / cover no-repeat;
  border-radius: 8px;
  overflow: hidden;
}

.sub-visual-wrap.hero-intro {background: linear-gradient(135deg, #F5F5DC 0%, #F5F5DC 45%, #9b8ec4 100%); position: relative;}
.sub-visual-wrap.hero-intro .sub-hero-desc p {color: #000; font-size: 15px; text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 16px rgba(255,255,255,0.5), 0 0 24px rgba(255,255,255,0.3);}
.sub-visual-wrap.hero-intro .sub-hero-desc i {color: rgba(42,22,111,0.3);}
.sub-visual-wrap.hero-course {background: linear-gradient(135deg, #F5F5DC 0%, #F5F5DC 45%, #a8b0b8 100%); position: relative;}
.sub-visual-wrap.hero-course .sub-hero-desc p {color: #000; font-size: 15px; text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 16px rgba(255,255,255,0.5), 0 0 24px rgba(255,255,255,0.3);}
.sub-visual-wrap.hero-course .sub-hero-desc i {color: rgba(42,22,111,0.3);}
.sub-visual-wrap.hero-custom {background: linear-gradient(135deg, #F5F5DC 0%, #F5F5DC 45%, #8bc7a0 100%); position: relative;}
.sub-visual-wrap.hero-custom .sub-hero-desc p {color: #000; font-size: 15px; text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 16px rgba(255,255,255,0.5), 0 0 24px rgba(255,255,255,0.3);}
.sub-visual-wrap.hero-custom .sub-hero-desc i {color: rgba(42,22,111,0.3);}
.sub-visual-wrap.hero-lecture {background: linear-gradient(135deg, #F5F5DC 0%, #F5F5DC 45%, #e8a88a 100%); position: relative;}
.sub-visual-wrap.hero-lecture .sub-hero-desc p {color: #000; font-size: 15px; text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 16px rgba(255,255,255,0.5), 0 0 24px rgba(255,255,255,0.3);}
.sub-visual-wrap.hero-lecture .sub-hero-desc i {color: rgba(42,22,111,0.3);}
.sub-visual-wrap.hero-news {background: linear-gradient(135deg, #F5F5DC 0%, #F5F5DC 45%, #8ab8d4 100%); position: relative;}
.sub-visual-wrap.hero-news .sub-hero-desc p {color: #000; font-size: 15px; text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 16px rgba(255,255,255,0.5), 0 0 24px rgba(255,255,255,0.3);}
.sub-visual-wrap.hero-news .sub-hero-desc i {color: rgba(42,22,111,0.3);}
.sub-visual-wrap::before {display: none;}
.sub-visual-wrap > * {position: relative; z-index: 1;}

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

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

.sub-visual-wrap .sub-hero-title {font-size: 28px; font-weight: 800; color: #2a166f; text-shadow: none; animation: subHeroFadeIn 0.8s ease both;}
.sub-visual-wrap .sub-hero-desc {text-align: right; display: flex; align-items: center; gap: 16px; animation: subHeroSlideIn 0.8s 0.3s ease both;}
.sub-visual-wrap .sub-hero-desc p {font-size: 13px; color: #555; line-height: 1.5; text-shadow: none;}
.sub-visual-wrap .sub-hero-desc i {font-size: 40px; color: rgba(42,22,111,0.3);}
.sub-visual-wrap + .sub-layout {margin-top: 50px;}
.sub-visual-wrap h2 {font-size: 47px;}

@media all and (max-width: 1200px) {
  .sub-visual-wrap {min-height: auto; padding: 20px 24px; border-radius: 0; margin: 0;}
  .sub-visual-wrap .sub-hero-title {font-size: 22px;}
  .sub-visual-wrap .sub-hero-desc p {font-size: 12px;}
  .sub-visual-wrap .sub-hero-desc i {font-size: 30px;}
  .sub-visual-wrap + .sub-layout {margin-top: 25px;}
}

/* etc */

/* business (사업소개) */
.biz-heading {font-size: 22px; font-weight: 700; color: #2a166f; padding-bottom: 12px; border-bottom: 2px solid #2a166f; margin-bottom: 16px;}
.biz-text {font-size: 18px; line-height: 1.7; color: #555;}
.biz-list {list-style: none; padding: 0; margin: 0;}
.biz-list li {position: relative; font-size: 18px; line-height: 1.7; color: #555; padding-left: 20px;}
.biz-list li:before {content: ''; position: absolute; top: 12px; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #F5F5DC;}
.biz-table {width: 100%; border-collapse: collapse; min-width: 400px;}
.biz-table th {padding: 12px 16px; background: #2a166f; color: #fff; font-size: 15px; font-weight: 500; text-align: left; white-space: nowrap;}
.biz-table td {padding: 12px 16px; border-bottom: 1px solid #e8e8e8; font-size: 15px; color: #555; line-height: 1.5;}
.biz-table tbody tr:hover {background: #f9f9f9;}
.biz-table th:first-child,
.biz-table td:first-child {width: 30%; white-space: nowrap;}

@media screen and (max-width: 768px) {
  .biz-heading {font-size: 19px;}
  .biz-text {font-size: 16px;}
  .biz-list li {font-size: 16px;}
  .biz-table th,
.biz-table td {font-size: 14px; padding: 10px 12px;}
}

@media screen and (max-width: 480px) {
  .biz-heading {font-size: 17px;}
  .biz-text {font-size: 15px;}
  .biz-list li {font-size: 15px;}
}

/* 인사말 */
.greeting-wrap {display: flex; gap: 40px; align-items: center;}
.greeting-photo {flex-shrink: 0; width: 200px;}
.greeting-photo img {width: 100%; border-radius: 8px; display: block;}
.greeting-body {flex: 1; min-width: 0;}
.greeting-headline {font-size: 22px; font-weight: 700; color: #2a166f; margin-bottom: 10px;}
.greeting-sub {font-size: 14px; color: #888; line-height: 1.6; margin-bottom: 6px;}
.greeting-intro {font-size: 15px; color: #555; line-height: 1.6; margin-bottom: 0;}
.greeting-text {font-size: 16px; color: #555; line-height: 1.8; text-align: justify;}
.greeting-text + .greeting-text {margin-top: 16px;}
.greeting-summary {font-size: 14px; color: #666; line-height: 1.7; margin-top: 16px; padding-top: 16px; border-top: 1px solid #e8e8e8;}
.greeting-content {margin-top: 40px; padding-top: 40px; border-top: 1px solid #e8e8e8;}
.greeting-sign {margin-top: 30px; text-align: right;}
.greeting-sign img {height: 160px; width: auto;}

@media screen and (max-width: 768px) {
  .greeting-wrap {flex-direction: column; gap: 24px;}
  .greeting-photo {width: 150px;}
  .greeting-headline {font-size: 19px;}
  .greeting-text {font-size: 15px;}
}

/* 연혁 */
.history-tabs {display: flex; gap: 0; margin-bottom: 40px; border: 1px solid #e0e0e0; border-radius: 6px; overflow: hidden; width: 100%;}

.history-tab {
  flex: 1;
  padding: 12px 10px;
  font-size: 16px;
  font-weight: 600;
  color: #999;
  background: #f9f9f9;
  border: none;
  border-right: 1px solid #e0e0e0;
  cursor: pointer;
  transition: all 0.2s;
  text-align: center;
}

.history-tab:last-child {border-right: none;}
.history-tab.on {color: #2a166f; font-weight: 700; background: #F5F5DC;}
.history-panel {display: none;}
.history-panel.on {display: block;}
.timeline {position: relative; padding: 0 10px;}

@media screen and (max-width: 768px) {
  .history-tabs {overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; scrollbar-width: none;}
  .history-tabs::-webkit-scrollbar {display: none;}
  .history-tab {padding: 10px 5px; font-size: 14px; white-space: nowrap; flex-shrink: 0;}
}

.timeline::before {content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: #e0e0e0; transform: translateX(-50%);}

.timeline-year {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
  background: #2a166f;
  display: inline-block;
  padding: 6px 20px;
  border-radius: 20px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 24px;
  z-index: 1;
}

.timeline-item {position: relative; width: 45%; padding: 20px 24px; margin-bottom: 24px; background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; margin-left: 0; text-align: right;}
.timeline-item.right {margin-left: 55%; text-align: left;}

.timeline-item::before {
  content: '';
  position: absolute;
  top: 24px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #2a166f;
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px #2a166f;
  z-index: 1;
  right: -32px;
}

.timeline-item.right::before {left: -32px; right: auto;}
.timeline-item::after {content: ''; position: absolute; top: 27px; width: 0; height: 0; border: 6px solid transparent; right: -12px; border-left-color: #f9f9f9;}
.timeline-item.right::after {left: -12px; right: auto; border-left-color: transparent; border-right-color: #f9f9f9;}
.timeline-item.highlight {background: #F5F5DC; border-color: #e8e0b0;}
.timeline-item.highlight::before {background: #F5F5DC; box-shadow: 0 0 0 2px #2a166f, 0 0 8px rgba(42,22,111,0.3);}
.timeline-item.highlight::after {border-left-color: #F5F5DC;}
.timeline-item.highlight.right::after {border-left-color: transparent; border-right-color: #F5F5DC;}
.timeline-date {font-size: 13px; font-weight: 700; color: #2a166f; margin-bottom: 6px; display: block;}
.timeline-text {font-size: 14px; color: #555; line-height: 1.6;}
.timeline-item.highlight .timeline-text {font-size: 15px; font-weight: 600; color: #333;}
.timeline-photo {margin-top: 10px; max-width: 100%; border-radius: 8px; overflow: hidden;}
.timeline-photo img {width: 100%; display: block;}
.img-placeholder {width: 100%; height: 120px; background: #e8e8e8; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 13px; color: #999;}

@media screen and (max-width: 768px) {
  .timeline::before {left: 8px;}
  .timeline-year {left: 0; transform: none; font-size: 16px;}
  .timeline-item {width: auto; margin-left: 30px !important; text-align: left !important;}
  .timeline-item:nth-child(odd) {text-align: left;}
  .timeline-item::before {left: -26px !important; right: auto !important;}
  .timeline-item::after {display: none;}
  .timeline-item:nth-child(even) .timeline-date,
.timeline-item:nth-child(even) .timeline-text {text-align: left;}
}

/* 교육철학 */
.phil-intro {text-align: center; margin-bottom: 50px;}
.phil-main-title {font-size: 26px; font-weight: 800; color: #2a166f; margin-bottom: 16px;}
.phil-main-desc {font-size: 15px; color: #666; line-height: 1.7;}
.phil-cards {display: flex; gap: 24px; margin-bottom: 50px;}
.phil-card {flex: 1; position: relative; border-radius: 10px; overflow: visible; box-shadow: 0 2px 12px rgba(0,0,0,0.06);}
.phil-card-header {display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; color: #fff; border-radius: 10px 10px 0 0;}
.phil-card-title {font-size: 18px; font-weight: 700;}
.phil-card-badge {width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 800; color: #fff;}
.phil-card-body {padding: 24px 20px 60px; background: #f9f9f9; border-radius: 0 0 10px 10px;}
.phil-card-body p {font-size: 14px; color: #555; line-height: 1.7;}

.phil-card-icon {
  position: absolute;
  bottom: -24px;
  left: 50%;
  transform: translateX(-50%);
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fff;
  border: 3px solid #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.phil-card-icon i {font-size: 22px; color: #2a166f;}
.phil-values {margin-top: 60px;}
.phil-value-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 20px;}
.phil-value-item {text-align: center; padding: 30px 16px; background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; transition: box-shadow 0.2s;}
.phil-value-item:hover {box-shadow: 0 4px 16px rgba(0,0,0,0.08);}
.phil-value-item i {font-size: 32px; color: #2a166f; margin-bottom: 14px;}
.phil-value-item h4 {font-size: 16px; font-weight: 700; color: #2a166f; margin-bottom: 10px;}
.phil-value-item p {font-size: 13px; color: #666; line-height: 1.6;}

@media screen and (max-width: 768px) {
  .phil-cards {flex-direction: column;}
  .phil-value-grid {grid-template-columns: repeat(2, 1fr);}
  .phil-main-title {font-size: 22px;}
}

@media screen and (max-width: 480px) {
  .phil-value-grid {grid-template-columns: 1fr;}
}

/* FAQ 아코디언 */
.course-intro-box {padding: 24px; background: #f7f5ff; border-radius: 10px; border-left: 4px solid #2a166f; margin-bottom: 30px;}
.course-intro-box .biz-text {font-size: 14px;}
.course-intro-box .biz-text + .biz-text {margin-top: 10px;}
.faq-list {border-top: 2px solid #2a166f;}
.faq-item {border-bottom: 1px solid #e8e8e8;}

.faq-question {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 18px 20px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  color: #333;
  text-align: left;
  gap: 14px;
  transition: background 0.2s;
}

.faq-question:hover {background: #f9f9f9;}

.faq-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #2a166f;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  flex-shrink: 0;
}

.faq-question i {margin-left: auto; color: #999; font-size: 14px; transition: transform 0.3s;}
.faq-item.open .faq-question i {transform: rotate(180deg);}
.faq-item.open .faq-question {background: #f7f5ff; color: #2a166f;}
.faq-answer {display: none; padding: 20px 20px 20px 66px;}
.faq-item.open .faq-answer {display: block;}
.faq-answer p {font-size: 16px; color: #555; line-height: 1.8;}
.faq-answer p + p {margin-top: 10px;}
.faq-answer .biz-list {margin-top: 12px;}
.faq-answer .biz-list li {font-size: 16px; padding-left: 0;}
.faq-answer .biz-list li:before {content: '*'; display: inline; position: static; width: auto; height: auto; background: none; border-radius: 0; margin-right: 6px; font-weight: 700; color: #2a166f;}

/* 교육과정 공통 */
.course-section {margin-bottom: 20px; padding: 24px; background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; position: relative; padding-left: 80px; transition: box-shadow 0.2s;}
.course-section:last-child {margin-bottom: 0;}
.course-section:hover {box-shadow: 0 4px 16px rgba(0,0,0,0.06);}

.course-section::before {
  content: attr(data-num);
  position: absolute;
  left: 24px;
  top: 24px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #2a166f;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.course-step {font-size: 16px; font-weight: 700; color: #2a166f; margin-bottom: 10px;}
.course-section .biz-text {font-size: 14px;}
.course-section .biz-list {margin-top: 8px;}
.course-section .biz-list li {font-size: 14px; line-height: 1.7; padding-left: 0;}
.course-section .biz-list li:before {content: '*'; display: inline; position: static; width: auto; height: auto; background: none; border-radius: 0; margin-right: 6px; font-weight: 700; color: #2a166f;}

@media screen and (max-width: 768px) {
  .course-section {padding-left: 24px; padding-top: 70px;}
  .course-section::before {top: 20px; left: 24px;}
}

/* 콘텐츠 준비 중 */
.preparing {text-align: center; padding: 80px 20px; background: #f9f9f9; border-radius: 12px; border: 1px dashed #ddd;}
.preparing-icon {width: 80px; height: 80px; margin: 0 auto 24px; border-radius: 50%; background: #F5F5DC; display: flex; align-items: center; justify-content: center;}
.preparing-icon i {font-size: 32px; color: #2a166f;}
.preparing-title {font-size: 22px; font-weight: 700; color: #2a166f; margin-bottom: 12px;}
.preparing-desc {font-size: 15px; color: #888; line-height: 1.7; margin-bottom: 24px;}
.preparing-btn {display: inline-block; padding: 10px 24px; background: #2a166f; color: #fff; font-size: 14px; font-weight: 600; border-radius: 6px; text-decoration: none; transition: background 0.2s;}
.preparing-btn:hover {background: #1a0e4f; color: #fff;}

/* 수업후기 */
.review-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
.review-col {display: flex; flex-direction: column; gap: 20px;}
.review-slider-wrap {border: 1px solid #eee; border-radius: 10px; overflow: hidden; position: relative;}
.review-ctrl {position: absolute; top: 8px; right: 8px; z-index: 2; display: flex; gap: 4px;}

.review-ctrl button {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 50%;
  background: rgba(0,0,0,0.4);
  color: #fff;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.review-ctrl button:hover {background: rgba(0,0,0,0.7);}
.review-ctrl button.on {background: #2a166f;}
.review-slider {position: relative; aspect-ratio: 3/4;}
.review-slide {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; opacity: 0; transition: opacity 0.8s ease;}
.review-slide.on {opacity: 1;}

@media screen and (max-width: 768px) {
  .review-grid {grid-template-columns: 1fr;}
}

/* 언론보도 */
.press-gallery {margin-bottom: 24px; border-radius: 8px; overflow: hidden;}
.press-gallery img {width: 100%; display: block; border-radius: 8px;}
.press-gallery-row {display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;}
.press-gallery-3col {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.press-media-item {text-align: center;}
.press-caption {font-size: 14px; color: #555; margin-top: 8px; font-weight: 500;}

@media screen and (max-width: 768px) {
  .press-gallery-row {grid-template-columns: 1fr;}
}

/* 수업사진 */
.photo-gallery {display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;}
.photo-item {border-radius: 8px; overflow: hidden; cursor: pointer; position: relative;}
.photo-item img {width: 100%; height: 180px; object-fit: cover; display: block; transition: transform 0.3s;}
.photo-item:hover img {transform: scale(1.05);}
.photo-item::after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0); transition: background 0.3s;}
.photo-item:hover::after {background: rgba(0,0,0,0.1);}

@media screen and (max-width: 768px) {
  .photo-gallery {grid-template-columns: repeat(2, 1fr);}
  .photo-item img {height: 140px;}
}

@media screen and (max-width: 480px) {
  .photo-gallery {grid-template-columns: 1fr;}
  .photo-item img {height: auto;}
}

.photo-more-wrap {text-align: center; margin: 30px 0;}

.photo-more-btn {
  display: inline-flex;
  align-items: center;
  padding: 12px 32px;
  background: #fff;
  border: 2px solid #2a166f;
  color: #2a166f;
  font-size: 15px;
  font-weight: 600;
  border-radius: 30px;
  cursor: pointer;
  transition: all 0.2s;
}

.photo-more-btn:hover {background: #2a166f; color: #fff;}
.photo-modal {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; display: none;}
.photo-modal.on {display: flex; align-items: center; justify-content: center;}
.photo-modal-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85);}
.photo-modal-content {position: relative; z-index: 1; max-width: 800px; width: 90%; max-height: 90vh; display: flex; flex-direction: column;}
.photo-modal-close {position: absolute; top: -40px; right: 0; background: none; border: none; color: #fff; font-size: 28px; cursor: pointer; z-index: 2;}
.photo-modal-main {display: flex; align-items: center; gap: 10px;}
.photo-modal-prev,
.photo-modal-next {background: none; border: none; color: #fff; font-size: 24px; cursor: pointer; padding: 10px; flex-shrink: 0; transition: color 0.2s;}
.photo-modal-prev:hover,
.photo-modal-next:hover {color: #F5F5DC;}
.photo-modal-img {flex: 1; text-align: center; overflow: hidden; border-radius: 8px;}
.photo-modal-img img {max-width: 100%; max-height: 65vh; object-fit: contain; display: block; margin: 0 auto; border-radius: 8px;}
.photo-modal-thumbs {display: flex; gap: 6px; margin-top: 12px; justify-content: center; flex-wrap: wrap;}
.photo-modal-thumb {width: 56px; height: 56px; border-radius: 4px; overflow: hidden; cursor: pointer; border: 2px solid transparent; transition: border-color 0.2s; flex-shrink: 0;}
.photo-modal-thumb.on {border-color: #F5F5DC;}
.photo-modal-thumb img {width: 100%; height: 100%; object-fit: cover;}

@media screen and (max-width: 768px) {
  .photo-modal-thumb {width: 40px; height: 40px;}
  .photo-modal-prev,
.photo-modal-next {font-size: 18px; padding: 6px;}
}

/* 공개특강 */
.lecture-banner {border-radius: 10px; padding: 50px 40px; text-align: center; margin-bottom: 30px; position: relative; overflow: hidden; background: repeating-linear-gradient(90deg, rgba(139,90,43,0.05) 0px, transparent 2px, transparent 8px), repeating-linear-gradient(90deg, rgba(160,110,60,0.04) 0px, transparent 1px, transparent 12px), repeating-linear-gradient(180deg, rgba(139,90,43,0.03) 0px, transparent 1px, transparent 6px), linear-gradient(135deg, #c4955a 0%, #d4a76a 20%, #e8c99b 40%, #d9b07a 60%, #c4955a 80%, #b8894e 100%);}
.lecture-banner::after {content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(ellipse, rgba(255,255,255,0.15) 0%, transparent 60%); animation: lectureShine 4s ease-in-out infinite;}

@keyframes lectureShine {
  0%, 100% {transform: translate(-30%, -30%) rotate(0deg);}
  50% {transform: translate(10%, 10%) rotate(5deg);}
}

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

.lecture-banner-inner {position: relative; z-index: 1; animation: lectureFadeUp 0.8s ease both;}
.lecture-tit {animation: lectureFadeUp 0.6s ease both;}
.lecture-instructor {animation: lectureFadeUp 0.8s 0.2s ease both;}
.lecture-info {animation: lectureFadeUp 0.8s 0.4s ease both;}
.lecture-banner::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: 50px; background: rgba(0,0,0,0.6); z-index: 0;}
.lecture-banner-inner {position: relative; z-index: 1;}
.lecture-banner-inner {max-width: 480px; margin: 0 auto; background: #fff; padding: 40px 36px; border-top: 4px solid #333;}
.lecture-tit {display: block; font-size: 38px; font-weight: 900; color: #222; margin-bottom: 6px;}
.lecture-instructor {font-size: 18px; font-weight: 700; color: #333; margin-bottom: 20px;}
.lecture-divider {width: 100%; height: 1px; background: #ddd; margin: 0 auto 20px;}
.lecture-info {font-size: 16px; color: #555; line-height: 1.8;}
.lecture-info strong {color: #222;}
.lecture-form {margin-top: 20px;}
.form-grid {display: grid; grid-template-columns: repeat(2, 1fr); border-top: 2px solid #2a166f;}
.form-row {display: flex; align-items: center; border-bottom: 1px solid #f0f0f0; padding: 12px 0; padding-left: 10px;}

@media screen and (max-width: 768px) {
  .form-grid {grid-template-columns: 1fr;}
}

.form-label {width: 100px; font-size: 14px; font-weight: 600; color: #2a166f; flex-shrink: 0;}
.form-field {flex: 1; display: flex; align-items: center; gap: 6px;}
.form-input {padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; outline: none;}
.form-input:focus {border-color: #2a166f;}
.form-select {padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; outline: none; min-width: 160px;}
.form-tel span {color: #999;}
.form-privacy {margin-top: 20px; padding: 16px; background: #f9f9f9; border-radius: 6px; border: 1px solid #eee;}
.privacy-check {display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #333; cursor: pointer;}
.privacy-check input[type="checkbox"] {width: 18px; height: 18px; accent-color: #2a166f;}
.privacy-desc {font-size: 12px; color: #999; margin-top: 8px; line-height: 1.5;}
.form-submit {margin-top: 20px; text-align: right;}
.btn-lecture-submit {padding: 12px 30px; background: #2a166f; color: #fff; font-size: 15px; font-weight: 600; border-radius: 6px; cursor: pointer; transition: background 0.2s;}
.js-date-edit {color: inherit; text-decoration: none; border-bottom: 1px dashed transparent; transition: border-color 0.2s;}
.js-date-edit:hover {border-bottom-color: #999;}
.date-modal {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 20000;}
.date-modal.on {display: flex; align-items: center; justify-content: center;}
.date-modal-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.date-modal-box {position: relative; background: #fff; padding: 30px; border-radius: 12px; width: 400px; max-width: 90vw; box-shadow: 0 8px 30px rgba(0,0,0,0.2);}
.date-modal-box h3 {font-size: 18px; font-weight: 700; color: #2a166f; margin-bottom: 16px;}
.date-modal-close {position: absolute; top: 12px; right: 12px; background: none; border: none; font-size: 24px; color: #999; cursor: pointer;}
.date-modal-close:hover {color: #333;}
.date-modal-input {width: 100%; padding: 12px; font-size: 15px; border: 1px solid #ddd; border-radius: 6px; box-sizing: border-box;}

.date-modal-save {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 12px;
  background: #2a166f;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}

.date-modal-save:hover {background: #1a0e4f;}
.pw-error {color: #e53935; font-size: 13px; margin-top: 8px;}
.btn-lecture-submit:hover {background: #1a0e4f;}

@media screen and (max-width: 768px) {
  .lecture-banner {padding: 30px 20px;}
  .lecture-tit {font-size: 22px;}
  .form-row {flex-direction: column; align-items: flex-start; gap: 6px;}
  .form-label {width: auto;}
}

/* 장학금 수여 */
.scholar-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px;}
.scholar-section {background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; overflow: hidden;}
.scholar-title {font-size: 18px; font-weight: 700; color: #2a166f; padding: 20px 24px; border-bottom: 2px solid #2a166f; margin: 0;}
.scholar-title i {margin-right: 8px;}
.scholar-gallery {padding: 20px 24px 0;}
.scholar-gallery img {width: 100%; border-radius: 8px; display: block;}
.scholar-gallery-double {display: flex; flex-direction: column; gap: 10px;}
.scholar-slider {position: relative; overflow: hidden; border-radius: 8px;}
.scholar-slide {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 0.8s ease;}
.scholar-slide.on {position: relative; opacity: 1;}
.scholar-gallery-double .scholar-slider {aspect-ratio: 4/3;}
.scholar-gallery-double .img-placeholder,
.scholar-gallery-double img {aspect-ratio: 4/3; height: auto; object-fit: cover;}
.scholar-gallery-single .img-placeholder,
.scholar-gallery-single img {min-height: 620px; object-fit: cover;}
.scholar-info {padding: 20px 24px 24px;}
.scholar-info .biz-list li {font-size: 16px; line-height: 1.8; padding-left: 0;}
.scholar-info .biz-list li:before {content: '*'; position: static; width: auto; height: auto; background: none; border-radius: 0; display: inline; margin-right: 6px; font-weight: 700; color: #2a166f;}
.scholar-desc {font-size: 15px; color: #555; line-height: 1.8; margin-bottom: 16px; text-align: justify;}
.scholar-badge {display: inline-block; padding: 8px 16px; background: #2a166f; color: #fff; font-size: 14px; font-weight: 700; border-radius: 20px; margin-bottom: 12px;}
.scholar-target {font-size: 16px; color: #555; margin-bottom: 12px; line-height: 1.8;}
.scholar-sub {font-size: 15px; font-weight: 700; color: #2a166f; margin: 16px 0 8px; padding-bottom: 6px; border-bottom: 1px solid #e8e8e8;}
.scholar-detail {margin-bottom: 12px;}
.scholar-detail-item {margin-bottom: 12px;}
.scholar-detail-item strong {font-size: 16px; color: #333; display: block; margin-bottom: 6px;}

@media screen and (max-width: 768px) {
  .scholar-grid {grid-template-columns: 1fr;}
}

/* 맞춤학습 */
.custom-list {display: flex; flex-direction: column; gap: 24px;}
.custom-card {display: flex; gap: 24px; padding: 24px; background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; transition: box-shadow 0.2s;}
.custom-card:hover {box-shadow: 0 4px 16px rgba(0,0,0,0.08);}
.custom-img {flex-shrink: 0; width: 280px; border-radius: 8px; overflow: hidden;}
.custom-img img {width: 100%; display: block;}
.custom-body {flex: 1; display: flex; flex-direction: column; justify-content: center;}
.custom-title {font-size: 20px; color: #333; margin-bottom: 14px;}
.custom-title strong {color: #2a166f;}
.custom-desc {font-size: 15px; color: #555; line-height: 1.8;}

@media screen and (max-width: 768px) {
  .custom-card, .custom-card:nth-child(even) {flex-direction: column;}
  .custom-img {width: 100%;}
}

/* 자격증 */
.cert-wrap {display: flex; gap: 30px; align-items: flex-start;}
.cert-img {flex: 1; border-radius: 8px; overflow: hidden;}
.cert-img img {width: 100%; display: block;}
.cert-table {flex: 1; min-width: 0; overflow-x: auto;}
.cert-table .biz-table {width: 100%;}
.cert-table .biz-table {border-top: 2px solid #2a166f;}
.cert-table .biz-table td {text-align: center; padding: 10px 16px;}
.cert-table .biz-table td:first-child {width: 60px;}
.cert-table .biz-table td:last-child {width: 80px;}

@media screen and (max-width: 768px) {
  .cert-wrap {flex-direction: column;}
  .cert-img {width: 180px;}
}

/* 교재안내 */
.textbook-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;}
.textbook-card {display: flex; gap: 20px; padding: 24px; background: #f9f9f9; border-radius: 10px; border: 1px solid #eee; transition: box-shadow 0.2s;}
.textbook-card:hover {box-shadow: 0 4px 16px rgba(0,0,0,0.08);}
.textbook-img {flex-shrink: 0; width: 160px;}
.textbook-img img {width: 100%; border-radius: 6px; display: block;}
.textbook-body {flex: 1; min-width: 0; display: flex; flex-direction: column;}
.textbook-title {font-size: 17px; font-weight: 700; color: #2a166f; margin-bottom: 12px;}
.textbook-title span {font-weight: 500; color: #888; font-size: 14px;}
.textbook-list {list-style: none; margin: 0; padding: 0;}
.textbook-list li {font-size: 13px; color: #555; line-height: 1.6; padding: 3px 0 3px 14px; position: relative;}
.textbook-list li:before {content: '*'; position: absolute; left: 0; font-weight: 700; color: #2a166f;}
.textbook-price {margin-top: auto; padding-top: 14px; font-size: 16px; font-weight: 700; color: #2a166f;}

@media screen and (max-width: 768px) {
  .textbook-grid {grid-template-columns: 1fr;}
  .textbook-card {flex-direction: column;}
  .textbook-img {width: 100%; max-width: 200px;}
}

/* 교육목표 */
.goal-7q {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px;}
.q-item {display: flex; align-items: center; gap: 8px;}
.q-badge {display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; font-size: 14px; font-weight: 800;}
.q-name {font-size: 14px; color: #555; font-weight: 500;}

@media screen and (max-width: 768px) {
  .goal-7q {gap: 8px;}
  .q-badge {width: 34px; height: 34px; font-size: 12px;}
}

/* 오시는 길 - 카카오맵 약도 폰트 오버라이드 */
.root_daum_roughmap_landing {font-family: 'Pretendard', sans-serif !important;}
.root_daum_roughmap_landing .cont {font-size: 14px !important;}
.root_daum_roughmap_landing .section .tit {font-size: 15px !important; font-weight: 700 !important;}
.root_daum_roughmap_landing .section .title {font-size: 15px !important; font-weight: 700 !important;}
.root_daum_roughmap_landing .section .address .txt {font-size: 14px !important;}
.root_daum_roughmap_landing .section .phone .txt {font-size: 14px !important;}
.root_daum_roughmap_landing .section .wrap_list {font-size: 13px !important;}
.root_daum_roughmap_landing .section .wrap_list a {font-size: 13px !important;}
.root_daum_roughmap_landing .section .wrap_list li {font-size: 13px !important;}
.root_daum_roughmap_landing .section .txt_item {font-size: 13px !important;}

/* 헤더 네비게이션 + 햄버거 메뉴 */
.header-nav {position: absolute; left: 50%; transform: translateX(-50%);}
.header-nav ul {display: flex; gap: 40px; list-style: none; margin: 0; padding: 0;}
.header-nav ul li a {font-size: 15px; font-weight: 500; color: #2a166f; text-decoration: none; position: relative; transition: color 0.2s;}
.header-nav ul li a:hover {color: #2a166f;}
.header-nav ul li a:after {content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px; background: #2a166f; transition: width 0.3s;}
.header-nav ul li a:hover:after {width: 100%;}
.header-nav ul li.on a {color: #2a166f;}
.header-nav ul li.on a:after {width: 100%;}
.profile {position: relative; margin-left: auto;}
.hamburger {display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-right: -8px; background: none; border: none; cursor: pointer; z-index: 25;}
.hamburger i {font-size: 28px; color: #2a166f; transition: color 0.2s;}
.hamburger:hover i {color: #999;}
.hamburger .mobile-bar {display: none;}


.side-menu {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; pointer-events: none; visibility: hidden;}
.side-menu.on {pointer-events: auto; visibility: visible;}
.side-overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0); transition: background 0.3s;}
.side-menu.on .side-overlay {background: rgba(0,0,0,0.5);}

.side-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 300px;
  height: 100%;
  background: #fff;
  box-shadow: -4px 0 20px rgba(0,0,0,0.15);
  padding: 30px 24px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
}

.side-menu.on .side-panel {transform: translateX(0);}

.side-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  background: none;
  border: none;
  font-size: 28px;
  color: #999;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.2s;
}

.side-close:hover {background: #f5f5f5; color: #2a166f;}
.side-title {display: block; font-size: 20px; font-weight: 700; color: #2a166f; margin-top: 20px; padding-bottom: 20px; border-bottom: 2px solid #F5F5DC; text-align: left;}
.side-user {display: flex; gap: 8px;}

.side-user-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 1;
  justify-content: center;
  padding: 10px 0;
  font-size: 13px;
  color: #555;
  background: #f5f5f5;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.2s;
}

.side-user-btn:hover {background: #2a166f; color: #fff;}
.side-user-btn i {font-size: 12px;}
.side-auth {margin-top: 20px;}
.side-nav {margin-top: 16px;}
.side-nav ul {list-style: none; margin: 0; padding: 0;}
.side-nav ul li {border-bottom: 1px solid #f0f0f0;}
.side-nav .side-sub li:last-child {border-bottom: none;}
.side-nav ul li a {display: block; padding: 16px 0; font-size: 17px; font-weight: 500; color: #333; text-decoration: none; transition: color 0.2s;}
.side-nav ul li a:hover {color: #F5F5DC;}
.side-nav ul li.has-sub {position: relative;}
.side-nav ul li a.side-nav-toggle {display: flex; align-items: center; justify-content: space-between; padding-right: 0;}
.side-nav ul li a.side-nav-toggle i {font-size: 12px; color: #999; transition: transform 0.3s;}
.has-sub.on > a.side-nav-toggle i {transform: rotate(180deg);}
.has-sub.on > a.side-nav-toggle {color: #2a166f; font-weight: 700;}
.side-nav .side-sub {display: none; list-style: none; margin: 0; padding: 0 0 8px;}
.has-sub.on .side-sub {display: block;}
.side-nav .side-sub li a {padding: 10px 0 10px 16px; font-size: 15px; font-weight: 400; color: #666; position: relative; text-align: left;}
.side-nav .side-sub li a:before {content: '-'; position: absolute; left: 4px; color: #999;}
.side-nav .side-sub li a:hover {color: #2a166f;}
.side-copyright {margin-top: auto; padding-top: 30px; font-size: 12px; color: #bbb; line-height: 1.6;}

@media screen and (max-width: 768px) {
  .header-nav {display: none;}
  .hamburger i.fa-circle-user {display: none;}
  .hamburger {flex-direction: column; justify-content: center; gap: 5px; padding: 8px;}
  .hamburger::before, .hamburger::after {content: ''; display: block; width: 22px; height: 2px; background: #2a166f; border-radius: 2px;}
  .hamburger .mobile-bar {display: block; width: 22px; height: 2px; background: #2a166f; border-radius: 2px;}
  .side-panel {width: 260px; padding: 24px 20px;}
  .side-title {font-size: 18px;}
  .side-nav ul li a {font-size: 16px; padding: 14px 0;}
}

/* 통합 반응형 푸터 */
.footer-new {background: #333; margin-bottom: 0; color: #ccc; font-size: 15px; line-height: 1.6; margin-top: 0; width: 100vw; position: relative; left: 50%; transform: translateX(-50%);}
.footer-inner {max-width: 1200px; margin: 0 auto; padding: 40px 0 30px; box-sizing: border-box;}
.footer-top {display: flex; justify-content: space-between; align-items: center; padding-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,0.15);}
.footer-nav ul {display: flex; gap: 28px; list-style: none; margin: 0; padding: 0;}
.footer-nav ul li a {color: #F5F5DC; font-size: 15px; font-weight: 500; text-decoration: none; transition: color 0.2s;}
.footer-nav ul li a:hover {color: #F5F5DC;}
.footer-sns {display: flex; gap: 12px; align-items: center;}
.footer-sns a {display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.1); transition: background 0.2s;}
.footer-sns a:hover {background: rgba(255,255,255,0.25);}
.footer-sns a img {height: 20px; width: auto;}
.footer-sns a i {font-size: 18px; color: #ccc; transition: color 0.2s;}
.footer-sns a:hover i {color: #fff;}
.footer-body {display: flex; justify-content: space-between; gap: 40px; padding: 28px 0; border-bottom: 1px solid rgba(255,255,255,0.08);}
.footer-info {flex: 1;}
.footer-logo {font-size: 18px; font-weight: 700; color: #fff; margin: 0 0 14px;}
.footer-addr p {font-size: 14px; color: #999; line-height: 1.8; margin: 0;}
.footer-highlight {color: #ccc; font-weight: 700; text-decoration: none;}
.footer-highlight:hover {color: #fff;}
.footer-contact {flex-shrink: 0; text-align: right;}
.footer-hours {font-size: 13px; color: #888; margin: 0 0 4px; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,0.08);}
.footer-tel {font-size: 20px; font-weight: 700; color: #F5F5DC; margin: 0 0 4px; letter-spacing: 1px;}
.footer-tel a {color: #F5F5DC;}
.footer-email {font-size: 14px; color: #999; margin: 4px 0 0;}
.footer-bottom {padding-top: 20px; text-align: center;}
.footer-copyright {font-size: 13px; color: #666; margin: 0;}

@media screen and (max-width: 1024px) {
  .footer-inner {padding: 32px 24px 24px;}
  .footer-body {flex-direction: column; gap: 24px;}
  .footer-contact {text-align: left;}
}

@media screen and (max-width: 768px) {
  .footer-new {margin-top: 40px;}
  .footer-inner {padding: 28px 20px 20px;}
  .footer-top {flex-direction: column; gap: 16px; align-items: flex-start;}
  .footer-nav ul {flex-wrap: wrap; gap: 16px;}
  .footer-logo {font-size: 16px;}
  .footer-tel {font-size: 18px;}
}

@media screen and (max-width: 480px) {
  .footer-inner {padding: 24px 16px 16px;}
  .footer-nav ul {gap: 12px;}
  .footer-nav ul li a {font-size: 14px;}
  .footer-addr p {font-size: 13px;}
  .footer-tel {font-size: 17px;}
}

/* 메인 페이지 */

/* 메인 3분할 레이아웃 */
.main-split {display: flex; gap: 0; max-width: 1200px; margin: 0 auto 50px; min-height: 570px; position: relative;}
.main-split .bg-bar {position: absolute; left: 0; width: 100%; height: auto; background: none; z-index: 0;}
.main-split .col-side {width: 300px; flex-shrink: 0; display: flex; flex-direction: column; gap: 0; position: relative; z-index: 1;}
.main-split .col-hero {flex: 1; position: relative; overflow: hidden; z-index: 1; background: #fff; border-radius: 12px;}
.main-split .col-hero .hero-inner {display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 40px 30px; text-align: center; background: #f9f9f9 url('/public/storage/hero-main.jpg') center / 100% auto no-repeat; position: relative; z-index: 0;}
.main-split .col-hero .hero-inner::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(
160deg,
rgba(42, 22, 111, 0.75) 0%,
rgba(0, 0, 0, 0.4) 50%,
rgba(42, 22, 111, 0.6) 100%
); z-index: -1;}

@keyframes heroFloat {
  0%, 100% {transform: translateY(0);}
  50% {transform: translateY(-6px);}
}

.hero-inner .hero-title {animation: heroFloat 3s ease-in-out infinite;}

@keyframes heroPulse {
  0%, 100% {box-shadow: 0 4px 15px rgba(0,0,0,0.3);}
  50% {box-shadow: 0 4px 25px rgba(245,245,220,0.5);}
}

.hero-inner .btn-hero {animation: heroPulse 2s ease-in-out infinite;}
.hero-inner .hero-sub {font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 14px; letter-spacing: 0.5px; text-shadow: 0 2px 8px rgba(0,0,0,0.5);}
.hero-inner .hero-title {font-size: 42px; font-weight: 900; color: #fff; line-height: 1.25; margin-bottom: 20px; text-shadow: 0 3px 12px rgba(0,0,0,0.6);}
.hero-inner .hero-desc {font-size: 14px; color: rgba(255,255,255,0.9); line-height: 1.7; margin-bottom: 20px; text-shadow: 0 1px 6px rgba(0,0,0,0.5);}
.hero-inner .hero-highlight {font-size: 20px; font-weight: 700; color: #FFD700; margin-bottom: 24px; -webkit-text-stroke: 1px rgba(255,255,255,0.4); text-shadow: 0 2px 8px rgba(0,0,0,0.5), 0 0 15px rgba(255,215,0,0.3);}
.hero-inner .btn-hero {display: inline-block; padding: 14px 40px; background: #F5F5DC; color: #2a166f; font-size: 16px; font-weight: 700; border-radius: 6px; text-decoration: none; transition: all 0.3s; box-shadow: 0 4px 15px rgba(0,0,0,0.3);}
.hero-inner .btn-hero:hover {background: #fff; color: #2a166f; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.4);}
.hero-inner .hero-date {margin-top: 16px; font-size: 15px; font-weight: 600; color: rgba(255,255,255,0.9); -webkit-text-stroke: 0.5px rgba(255,255,255,0.5); text-shadow: 0 1px 6px rgba(0,0,0,0.5), 0 0 10px rgba(245,245,220,0.3);}

/* 사이드 카드 */
.info-card {padding: 17px 20px 24px; border-bottom: 1px solid #e8e8e8; display: flex; align-items: flex-start; gap: 16px;}
.info-card .card-text {flex: 1; min-width: 0;}
.info-card .card-text h3 {font-size: 15px; font-weight: 700; color: #2a166f; margin-bottom: 2px; line-height: 1.3;}
.info-card .card-text p {font-size: 12px; color: #777; line-height: 1.6; margin-bottom: 0;}
.info-card .card-icon {flex-shrink: 0; display: flex; align-items: center; justify-content: center;}
.info-card .card-icon i {font-size: 52px; color: #b0bec5;}
.info-card .card-text .btn-detail {display: inline-block; margin-top: 20px; padding: 5px 14px; background: #555; color: #fff; font-size: 11px; border-radius: 2px; text-decoration: none; transition: background 0.2s;}
.btn-detail:hover {background: #555; color: #fff;}

/* 유튜브 바로가기 */
.quick-menu {background: #f0f0f0; padding: 15px 20px; border: none; min-height: 130px; box-sizing: border-box;}
.quick-menu h3 {font-size: 14px; font-weight: 700; color: #2a166f; margin-bottom: 12px;}
.yt-slider {position: relative; overflow: hidden; min-height: 60px;}
.yt-slide {position: absolute; top: 0; left: 0; width: 100%; opacity: 0; transition: opacity 0.5s ease; pointer-events: none;}
.yt-slide.on {position: relative; opacity: 1; pointer-events: auto;}
.yt-banner {display: flex; align-items: center; gap: 14px; text-decoration: none; padding: 10px 0 0;}
.yt-logo-icon {flex-shrink: 0; position: relative;}
.yt-logo-icon img {width: 60px; height: auto; border-radius: 4px; display: block;}
.yt-logo-icon i {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 20px; color: rgba(255,0,0,0.9); text-shadow: 0 1px 3px rgba(0,0,0,0.3);}
.yt-banner-text {font-size: 12px; color: #555; line-height: 1.5;}
.yt-banner:hover .yt-banner-text {color: #555;}
.quick-menu ul {display: flex; gap: 8px; list-style: none; margin: 0; padding: 0;}
.quick-menu ul li {flex: 1; text-align: center;}
.quick-menu ul li a {display: block; text-decoration: none; color: #fff;}

/* 고객센터 */
.cs-box {background: #f0f0f0; padding: 15px 20px; position: relative; border: none; min-height: 130px; box-sizing: border-box;}
.cs-box h3 {font-size: 14px; font-weight: 700; color: #2a166f; margin-bottom: 6px;}
.cs-box .cs-tel {font-size: 24px; font-weight: 800; color: #2a166f; letter-spacing: -0.5px; line-height: 1.1; position: relative; display: inline-block;}
.cs-box .cs-tel .cs-map-icon {position: absolute; top: 50%; transform: translateY(-50%); line-height: 0;}
.cs-box .cs-time {font-size: 11px; color: #888; margin-top: 4px; line-height: 1.4;}
.cs-map-icon {position: absolute; top: 50%; right: 20px; transform: translateY(-50%); color: #999; font-size: 44px; transition: color 0.2s;}
.cs-map-icon:hover {color: #999;}

/* 사이드 게시판 */
.side-board {flex: 1; padding: 16px 20px; display: flex; flex-direction: column;}
.side-board .board-head {display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid #2a166f;}
.side-board .board-head h3 {font-size: 14px; font-weight: 700; color: #2a166f; letter-spacing: 1px;}
.side-board .board-head a {font-size: 18px; color: #999; text-decoration: none;}
.side-board .board-head a:hover {color: #999;}
.side-board ul {list-style: none; margin: 0; padding: 0;}
.side-board ul li {padding: 6px 0; border-bottom: 1px solid #f0f0f0;}
.side-board ul li:last-child {border-bottom: none;}
.side-board ul li a {display: block; font-size: 13px; color: #555; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.4;}
.side-board ul li a:hover {color: #555;}
.side-board ul li .date {display: block; font-size: 11px; color: #bbb; margin-top: 2px;}

/* 메인 페이지 반응형 */
@media screen and (max-width: 1200px) {
  .main-split {margin: 0; padding-top: 0; flex-direction: column; min-height: auto;}
  .main-split .col-side {width: 100%; flex-direction: row; flex-wrap: wrap;}
  .main-split .col-hero {order: -1; height: auto; margin: 0 15px; border-radius: 12px; overflow: hidden;}
  .main-split .col-hero .hero-inner {background-size: cover; min-height: 400px;}
  .info-card {width: 50%; box-sizing: border-box;}
  .quick-menu {width: 100%;}
  .cs-box {width: 100%;}
  .side-board {width: 50%; box-sizing: border-box;}
}

@media screen and (max-width: 768px) {
  .main-split .col-hero {height: auto;}
  .main-split .col-hero .hero-inner {min-height: 350px;}
  .info-card {width: 100%;}
  .side-board {width: 100%;}
}