@charset "utf-8";

/********** header **********/
/* 오버레이와 패널의 확실한 쌓임 순서 보장 */
#sideDim{position: fixed; inset: 0; z-index: 900;}
#gnbPanel{position: fixed; inset: 0 0 0 auto; max-width: 360px; width: 100%; z-index: 1000;}
#menuClose.panel-close{position: absolute; top: 12px; right: 16px; z-index: 1002; pointer-events: auto;}
.gnb-mobile{position: relative; z-index: 1001;}
.gnb-mobile .m-gnb,
.gnb-mobile .m-sub{position: relative;z-index: 1001;}

/* 데스크톱/모바일 화살표 제거(유지) */
.gnb-desktop .has-sub > .sub-toggle::after,
.gnb-mobile  .has-sub > .sub-toggle::after{content: none !important; display: none !important; background: none !important;}

/* 스크롤 오프셋(유지) */
html { scroll-padding-top: var(--header-h); }
section[id] { scroll-margin-top: var(--header-h); }

/* ▼▼▼ 여기부터 데스크톱 드롭다운 표시 로직 보정 ▼▼▼ */
/* 데스크톱: 하위메뉴 기본 감춤(모든 li 중 직계 자식 .sub 대상) */
header .gnb-desktop li > .sub {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  /* 기존 오타 수정: rgba(0,0,8px,.25) → rgba(0,0,0,.25) */
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
  /* 초기 숨김 상태 명시 */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}

/* 데스크톱: hover/focus-within 시 표시 (모든 li 적용) */
@media (hover: hover) and (pointer: fine) {
  header .gnb-desktop li:hover > .sub,
  header .gnb-desktop li:focus-within > .sub {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
}

/* 서브 링크 스타일(유지) */
header .gnb-desktop li > .sub a {display: block;white-space: nowrap;}
header .gnb-desktop li > .sub a:hover,
header .gnb-desktop li > .sub a:focus {background: #E9E3DE; color:#796753; outline: none;}
/* ▲▲▲ 데스크톱 드롭다운 표시 로직 보정 끝 ▲▲▲ */

/* 사이드 패널/딤 (유지) */
.side-dim {inset: 0; background: rgba(0,0,0,.35);opacity: 0; visibility: hidden; transition: .2s ease;}
.side-panel {top: 0; right: 0; width: min(360px, 86vw); background: #fff; box-shadow: -4px 0 4px rgba(0,0,0,.25);transform: translateX(100%); transition: transform .25s ease;}
.panel-close {align-self: flex-end; background: transparent; border: none; font-size: 24px; line-height: 1; width: 24px; height: 24px; cursor: pointer;}
.menu-open .side-panel { transform: translateX(0); }
.menu-open .side-dim   { opacity: 1; visibility: visible; }
.no-scroll { overflow: hidden; touch-action: none; }

/* 모바일 GNB (유지) */
.m-gnb { list-style: none; margin: 8px 0 0; padding: 0; }
.m-gnb > li { border-bottom: 1px solid #eee; }
.m-gnb a, .m-gnb .sub-toggle {display: block; width: 100%; text-align: right;color: #222; background: none; border: none;}
.m-gnb .has-sub .sub-toggle { position: relative; }
.m-gnb .has-sub .sub-toggle::after {content: "▾";position: absolute; right: 8px; top: 50%; transform: translateY(-50%);}
.m-gnb .has-sub[aria-expanded="true"] .sub-toggle::after { content: "▴"; }

/* 햄버거 (유지) */
.hamburger {border: 0; background: transparent; cursor: pointer; }
.hamburger span, .hamburger span::before, .hamburger span::after {content: ""; position: absolute; left: 50%; transform: translateX(-50%);width: 24px; height: 2px; background: #222; transition: .2s ease;}
.hamburger span { top: 50%; }
.hamburger span::before { top: -8px; }
.hamburger span::after  { top:  8px; }

/* 공통 .sub(기존 margin-top이 hover 갭을 만들어 닫힘 유발 → 0으로 보정) */
.sub {box-shadow:0 0 8px rgba(0,0,0,.25); margin-top:0;}


/********************
** common
********************/
header{border-bottom:1px solid #eee}
.line1Word{overflow:hidden; text-overflow: ellipsis;}

/********************
** mainBanner
********************/
.mainBannerBtn {box-shadow:0 0 8px #6C8EEE; min-height:0px !important;}

/********************
** review
********************/
.reviewCnt {background:linear-gradient(to bottom, #FFFFFF, #F0F3FE); border:1px solid #C4D2F9;}

/********************
** service
********************/
.service {background-image:url('/img/mainServiceBg.jpg'); background-position:center center; background-size:cover;}
.serviceCntBox {background:linear-gradient(to bottom, #FFFFFF, #EEEEF0);}

/********************
** boardList
********************/
.qnaList, .tipList{border-top:1px solid #eee}
.qnaList:nth-child(1), .boardLatest > .tipList:nth-child(1){border-top:0}


/********************
** form
********************/
.formInput{border:1px solid #dcdcdc}
.formCheckbox{left:-999999px}
.formCheckboxLabel:before{content:''; display:block; width:20px; height:20px; background:url('/img/chkOff.svg')center center; background-size:cover; transition: ease-in-out 0.3s;}
.formCheckbox:checked + label:before{background:url('/img/chkOn.svg')center center; background-size:cover;}

.complaint{background:#fffec2}

/********************
** boardList
********************/
.boardBox{overflow-x:auto}
.boardListTbl{min-width:620px}
.boardListTbl td{border:1px solid #eee}
.pagination .active{background:#3349dc; color:#fff; border-radius:20px; font-weight: 600;}

.gallCnt{width:calc(25% - 18px)}
.gallCntBg{background-position: center center !important; background-size: cover !important;}


.se2_inputarea{background:#fff !important}
/********************
** policy
********************/
.policyTp {border-bottom:1px solid #26272B;}

/********************
** login
********************/
.loginBg {background:linear-gradient(to left, #2B38CA, #4968E8);}

/********************
** contactList
********************/
.contactTbl td{border-bottom:1px solid #d9dade; border-right:1px solid #d9dade;}
.contactTbl td:last-child {border-right: none;}


/********************
** contactView
********************/
.contactViewCnt p:nth-child(1){border-top:1px solid #d9dade}
.contactViewCnt p:nth-child(2){border-top:1px solid #eeeef0}
.contactViewBox .contactViewCnt:nth-last-child(1) p:nth-child(1){border-bottom:1px solid #d9dade}
.contactViewBox .contactViewCnt:nth-last-child(1) p:nth-child(2){border-bottom:1px solid #eeeef0}
.contactBtn{border:1px solid #d9dade}