/* BASIC css start */
/* 띠배너 추가됨에 따라 헤더 스타일 추가 수정 */
#header.scroll #topbanner{transform: translateY(0%);max-height: 45px;opacity: 0;pointer-events: none;}
#header.scroll.click.show .open-menu-wrap, .open-menu-wrap[aria-hidden="false"] {top:105px !important;}
#header.scroll.click.show.is-fixed .open-menu-wrap, .open-menu-wrap[aria-hidden="false"] {top:60px !important;}

#topbanner {
    transition: transform .35s ease, max-height .35s ease, opacity .25s ease;
    overflow: hidden;    /* 높이가 줄어들 때 내용물이 삐져나오지 않게 함 */
    max-height: 200px;   /* 실제 배너 높이보다 넉넉하게 설정 */
    opacity: 1;
}
/* 스크롤이 내려갔을 때 배너를 숨김 */
#header.is-fixed #topbanner {
    max-height: 0 !important;   /* 높이를 0으로 줄임 */
    opacity: 0 !important;      /* 투명하게 만듦 */
    padding-top: 0 !important;  /* 패딩이 있다면 이것도 제거 */
    padding-bottom: 0 !important;
    margin: 0 !important;       /* 여백 제거 */
}
/* 헤더를 상단에 고정하고 싶다면 */
#header.is-fixed {
   /* position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;*/
}
/* 모바일: 띠배너 추가됨에 따라 헤더 스타일 추가 수정 */
@media (max-width: 768px) {
    .header-container--md.scroll {
        top: 45px !important;
        z-index: 9999;
    }
    .header-container--md.scroll.is-fixed {
        top: 0px !important;
    }
    .header-container--md.scroll.is-fixed + .m-search-area, .side-menu-wrap.active {
        top: 50px!important;
        padding-top: 0;
    }
    .header-container--md.scroll + .m-search-area, .side-menu-wrap.active {
        top: 94px!important;
    }
    .header-container--md {z-index: 9999;}
    .header-container--md.scroll.is-fixed {top: 45px;}
    .scroll.is-fixed + .side-menu-wrap.active {top: 46px !important;}
    .container-small {margin-top: 130px!important;}
    .side-menu-wrap {z-index: 100 !important;}
}


.cw-useinfotitle { font-weight: 700; padding-top: var(--cw-size-70); font-size: var(--cw-size-24); line-height: var(--cw-size-32); color: #000; }
.cw-useinfocnts { display: grid; gap: var(--cw-size-60); margin-top: var(--cw-size-40); }
.cw-useinfocnts dl dt { display: flex; justify-content: space-between; padding-bottom: var(--cw-size-12); align-items: center; border-bottom: 1px solid var(--cw-heading-color); }
.cw-useinfocnts dl dt > span { font-size: var(--cw-size-18); line-height: var(--cw-size-26); color: #343434; font-weight: 700; }
.cw-useinfocnts dl dd ul { display: grid; gap: var(--cw-size-4); padding: var(--cw-size-12) 0; align-items: center; font-size: var(--cw-size-14); line-height: var(--cw-size-20); color: var(--cw-color-80); }
.cw-useinfocnts dl dd ul li strong { color: var(--cw-heading-color); font-weight: 600; }


.container-small {
    max-width: 1540px;
    margin: auto;
    padding: 0 12px;
    margin-top: 60px;
    margin-bottom: 100px;
}

/* 여기서부터 헤더 직접스타일 */
#header { box-shadow: none; border-bottom: 1px solid #DADCE0; }
#header .head_inner .head_middle nav ul.main_m > li > a { color: #000!important; }
#header .head_inner .head_right ul.user_icon li a { color: #000!important; }


/* PC */
body[data-page="info"] #header {
  background-color: box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* 모바일 */
body[data-page="info"] .header-container--md {
  background-color: #fff !important; 
}

/* scroll 상태에서 보이는 요소들 */
body[data-page="info"] #header img.swap,
body[data-page="info"] .header-container--md img.swap {
  content: attr(data-dark);
}






@media (max-width: 991.98px) {
    .cw-useinfotitle { display: none; }
    .footer-container { margin-top: var(--cw-size-80) !important; margin-bottom: 0 !important; }
    .privacyContent {
        margin-top: 100px;
    }
}
@media (max-width: 767.98px) {
.header-container--md .ham a {
    color: #000 !important;
}
    .cw-useinfocnts { gap: var(--cw-size-40); }
    .cw-useinfocnts dl dt { padding-bottom: var(--cw-size-10); }
    .cw-useinfocnts dl dt > span { font-size: var(--cw-size-16); }
    .cw-useinfocnts dl dd ul { font-size: var(--cw-size-13); line-height: var(--cw-size-18); }
}
/* BASIC css end */

