/**
 * ═══════════════════════════════════════════════════
 *  shop-responsive.css
 *  클래스 기반 컴포넌트 + 페이지별 + 반응형 CSS
 *  (element/ID 전역 셀렉터는 shop.css)
 *  breakpoints: 1000px / 900px / 768px / 600px / 480px
 * ═══════════════════════════════════════════════════
 */


/* ══════════════════════════════════════════════════
   공통 유틸리티 클래스
   ══════════════════════════════════════════════════ */
.hide { display: none;}

.f-20 { font-size: 20px;}
.f-16 { font-size: 16px;}
.f-14 { font-size: 14px;}
.f-12 { font-size: 14px;}

.table {}
.table th{ padding: 5px;}
.table td { padding: 5px 5px;}

/** header components **/
h1{ margin: 0 3px;}
.btn-branch { margin-left: 20px; padding-right: 23px; background:url('../images/main/arrow-down.png') 100% 50% no-repeat; border:0;font-size: 16px; color: #000;}
.btn-branch.on { background-image:url('../images/main/arrow-up.png'); }

.btn-search { width: 35px; border: 1px solid #DADDE0; border-right: 0; background: url("../images/main/search.png") 80% 50% no-repeat;border-radius: 5px 0 0  5px;}

.ico-cart { display: inline-block; margin-left: 5px; width: 21px; height: 29px; background: url("../images/main/cart.png") 50% 50% no-repeat; }
.cart-num { display: inline-block; margin-left: -5px; width: 20px; height: 20px; border-radius: 50%; background: #000; color: #fff;
    text-align: center; font-size: 12px; vertical-align: top; padding-top: 1px; }
.input-search {  border: 1px solid #DADDE0;border-left: 0; outline: none; border-radius: 0 5px 5px 0;}
.input-search:focus { outline: none;border: 1px solid #DADDE0;border-left: 0;box-shadow: none; transition: none;}
.input-search:focus .bth-search { border: 3px solid #000;}
.hd-user-avatar svg { display: block; }

/* ── 유저 드롭다운 버튼 ── */
.hd-user-btn {
    display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; background: #fff;
    border: 1.5px solid #e0e0e0; border-radius: 20px; font-size: 14px; font-weight: 700; color: #222;
    transition: box-shadow .15s, border-color .15s;
}
.hd-user-btn:hover, .hd-user-btn:focus, .hd-user-btn.show {
    border-color: #35C5F0; box-shadow: 0 2px 8px rgba(53,197,240,.18); background: #fff; color: #222;
}
.hd-user-avatar {
    display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%;
    background: linear-gradient(135deg, #35C5F0, #0eaddd); color: #fff; font-size: 13px; font-weight: 900;
    flex-shrink: 0;
}
.hd-user-name { max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── 드롭다운 패널 ── */
.hd-dropdown {
    min-width: 180px; border-radius: 12px; overflow: hidden; border: 1px solid #e8e8e8;
    box-shadow: 0 8px 28px rgba(0,0,0,0.12); padding: 0; margin-top: 6px !important;
    right: 0 !important; left: auto !important;
}
.hd-dropdown-header { padding: 14px 18px 10px; background: linear-gradient(135deg, #f0faff, #e8f7fe); }
.hd-dh-name { font-size: 13px; font-weight: 800; color: #1a8ab5; display: block; }
.hd-dropdown-item {
    display: flex; align-items: center; gap: 8px; padding: 10px 18px; font-size: 14px; color: #333;
    transition: background .12s;
}
.hd-dropdown-item:hover { background: #f5faff; color: #35C5F0; }
.hd-di-icon { font-size: 15px; width: 20px; text-align: center; }
.hd-logout:hover { background: #fff5f5 !important; color: #e05252 !important; }

/* ── 로그인 버튼 ── */
.hd-login-btn {
    padding: 6px 18px !important; background: #35C5F0; color: #fff !important; border-radius: 20px; font-weight: 700;
    font-size: 14px; transition: background .15s;
}
.hd-login-btn:hover { background: #29b5de; }

/** banner - Swiper centeredSlides 구조 (Nature Republic 스타일) **/

/* 바깥 래퍼: overflow:hidden 으로 양옆 peek 영역 clipping */
.main-banner-wrap {
    width: 100%;
    padding: 10px 0 30px;
    overflow: hidden;
    position: relative;
}

/* Swiper: 100% = 100vw, slidesPerView:1.3 → Swiper가 초기부터 양쪽 슬라이드 배치 보장 */
.main-banner {
    position: relative;
    width: 100%;
    height: 460px;
    overflow: visible;
}

/* 각 슬라이드: width는 Swiper가 slidesPerView:1.3 으로 제어 */
.main-banner .swiper-slide {
    height: 460px;
    border-radius: 16px;
    overflow: hidden;
    transition: transform .4s, opacity .4s;
    opacity: 0.5;
    transform: scale(0.95);
}
/* 활성 슬라이드 */
.main-banner .swiper-slide-active {
    opacity: 1;
    transform: scale(1);
}
.main-banner .swiper-slide a { display: block; width: 100%; height: 100%; }
.main-banner .swiper-slide img { display: block; width:100%; height: 100%; object-fit: cover; }

/* 배너 네비게이션 바 — 이미지 위 하단 중앙 */
.main-bn-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 20px;
    left: 18%;
    transform: translateX(-50%);
    z-index: 10;
    gap: 0;
    user-select: none;
}
.main-bn-nav > span,
.main-bn-nav > button {
    /* pill 묶음처럼 보이도록 */
}
/* prev + counter + next 묶음 */
.main-bn-nav .main-bn-prev,
.main-bn-nav .main-bn-counter,
.main-bn-nav .main-bn-next {
    background: rgba(255,255,255,0.75);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.main-bn-nav .main-bn-prev  { border-radius: 30px 0 0 30px; border-right: 1px solid #e5e5e5; }
.main-bn-nav .main-bn-next  { border-radius: 0 30px 30px 0; border-left:  1px solid #e5e5e5; }
.main-bn-nav .main-bn-counter { border-radius: 0; }
.main-bn-prev, .main-bn-next {
    width: 36px;
    height: 36px;
    border: none;
    color: #555;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
    flex-shrink: 0;
}
.main-bn-prev:hover, .main-bn-next:hover { background: #f0f0f0 !important; }
.main-bn-counter {
    font-size: 14px;
    font-weight: 600;
    color: #555;
    letter-spacing: 1px;
    padding: 0 14px;
    height: 36px;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.tab-location { margin: 0 0 10px; padding: 0; display: flex; width: 100%; text-align: left; border-bottom:1px solid #ddd; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; touch-action: pan-x; }
.tab-location::-webkit-scrollbar { display: none; }
.tab-location li { padding: 12px 20px; cursor: pointer; white-space: nowrap; flex-shrink: 0; }
.tab-location li.on { border-bottom: 2px solid #35C5F0; color: #35C5F0; font-weight: 700; }

.branch-list { width: 100%; overflow: hidden; padding: 10px 0; position: relative; }
.branch-list .swiper-wrapper { display: flex; padding: 0; margin: 0;  }
.branch-list .swiper-slide { flex-shrink: 0; width: 200px; height: 240px; position: relative; overflow: hidden; }
.branch-list .swiper-slide:last-child { margin-right: 0 !important; }
.branch-list .thumb img { width: 100%; display: block;  transition: transform 0.3s ease, filter 0.3s ease;}
.branch-list .thumb img:hover{ transform: scale(1.05); filter: brightness(1.1);  }
.branch-list .cont { position: absolute; bottom: 5px; left: 10px; color: white; text-shadow: 1px 1px 5px rgba(0,0,0,0.7); }
.branch-list .country { display: block; font-size: 12px; font-weight: 200; height: 13px;}
.branch-list .title { display: block; font-size: 16px;}

.notice-area { display: flex; justify-content:space-between; margin-top: 50px;}
.notice-area .box { width: 580px; padding: 15px; border: 1px solid #ddd;}
.notice-area ul { padding: 0; margin: 0; font-size: 14px;}
.notice-area .box h3 { font-size: 20px;}
.box .box-head {display:flex;justify-content:space-between;align-items:center;}
.box .more-btn {font-size:14px;font-weight:500;text-decoration:none;transition:color .2s ease,transform .2s ease;}
.box .more-btn:hover {color:#0f172a;transform:translateX(2px);}
.box .more-btn::after {content:" +";font-size:14px;}

/** 지점 메인 (branch main) **/
.branch-main { width: 100%; }
.branch-top { display: flex; width: 100%; max-width: 1200px; margin: 0 auto; }
.branch-top .title { flex: 1; max-width: 700px; padding: 60px 0 0 30px; color: #fff; }
.branch-top .thumb { padding: 20px; display: block; flex-shrink: 0; }
.branch-top .thumb img { display: block; width: 100%; max-width: 500px; height: 280px; object-fit: cover; }
/* 관심지점 버튼 */
.btn-branch-fav {
    display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; padding: 8px 18px;
    background: rgba(255,255,255,.15); border: 1.5px solid rgba(255,255,255,.5); border-radius: 24px; color: #fff;
    font-size: 14px; font-weight: 700; cursor: pointer; transition: all .2s; backdrop-filter: blur(4px);
}
.btn-branch-fav:hover { background: rgba(255,255,255,.25); border-color: #fff; }
.btn-branch-fav.active { background: rgba(255,197,50,.2); border-color: #f5c832; color: #ffe066; }
.btn-branch-fav .fav-icon { font-size: 18px; }

.products { margin: 0 auto; padding: 0 0 100px; display: flex; flex-wrap: wrap; gap: 25px; max-width: 1200px; }
.product_item { display: table; margin-bottom: 0; width: calc(50% - 13px); }
.product_item .thumb { display: table-cell; width: 260px; height: 200px; background: #f2f2f2; }
.product_item .thumb img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 0.3s ease, filter 0.3s ease; border-radius: 5px; }
.product_item .thumb img:hover { transform: scale(1.03); filter: brightness(1.1); }
.product_item .contents { position: relative; display: table-cell; padding-left: 15px; vertical-align: top; }
.product_item .contents .name { font-size: 18px; font-weight: bold; }
.product_item .contents .intro { font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product_item .contents .price { position: absolute; bottom: 5px; right: 10px; }
.product_item .contents .price .tit { font-weight: bold; font-size: 18px; color: #0EADDD; }
.product_item .contents .price .number { font-weight: bold; font-size: 18px; }
.product-tags { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.product-tag { padding: 2px 10px; font-size: 12px; font-weight: 600; color: #0EADDD; background: #f0faff; border-radius: 12px; white-space: nowrap; }
.products .sub_news { padding: 10px; border: 1px solid #ddd; border-radius: 5px; }
.products .sub_news .title { font-size: 18px; }
.products .sub_news .more-btn { margin-top: -3px; }
.products .sub_news .list_thumb { display: flex; }
.products .sub_news .list_thumb li { padding: 0 2px; }
.products .sub_news .list_thumb li a { display: block; }
.products .sub_news .list_thumb .thumb { position: relative; height: 148px; }
.products .sub_news .list_thumb .tit { position: absolute; width: 99%; bottom: 0; left: 1px; background: rgba(0,0,0,0.5); color: #fff; white-space: nowrap; overflow: hidden; font-size: 12px; border-radius: 5px; }

/* 배너 + 날씨/환율 통합 영역 */
.info-row { display: flex; align-items: stretch; max-width: 1200px; margin: 0 auto; gap: 18px; padding: 12px 0; }
.info-banner { flex: 0 0 calc(50% - 10px); border-radius: 10px; overflow: hidden;  display: flex; align-items: center; justify-content: center; min-height: 120px; }
.info-banner img { width: 100%; height: 100%; object-fit: cover; display: block; }
.info-banner .banner-empty { color: #ccc; font-size: 13px; text-align: center; }
.info-cards { display: flex; flex-direction: row;  flex: 0 0 calc(50% - 8px); }
.info-card { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #ddd; border-radius: 5px; padding: 10px 16px; flex: 1; min-width: 0; }
.info-card .label { font-size: 14px; font-weight: 500; color: #bbb; letter-spacing: 0.4px; text-transform: uppercase; margin-bottom: 1px; }
.info-card:last-child { margin-left: 10px; }
@media (max-width: 768px) {
    .info-card:last-child { margin-left: 0; margin-top: 0; }
    .info-row { flex-direction: column; }
    .info-banner { flex: none; width: 100%; height: auto !important;;  min-height: 50px !important;; }
    .info-banner a { display: block; width: 100%; height:auto !important; }
    .info-banner img { width: 100%; height: auto; object-fit: cover; display: block; }
    .info-cards { flex: none; width: 100%; flex-direction: row; }
    .main-bn-nav { display: none; }
}
/* 날씨 카드 */
.weather-icon { font-size: 40px; line-height: 1; flex-shrink: 0; }
.weather-info { flex-shrink: 0; }
.weather-info .temp-current { font-size: 22px; font-weight: 800; color: #222; line-height: 1.1; }
.weather-info .temp-current span { font-size: 13px; font-weight: 400; color: #888; }
.weather-info .temp-range { font-size: 12px; color: #999; margin-top: 2px; }
.weather-info .weather-desc { font-size: 12px; color: #666; }
.weather-sub { display: none; }
/* 환율 카드 */
.exchange-icon { font-size: 22px; flex-shrink: 0; width: 50px; text-align: center;}
.exchange-info { flex-shrink: 0; }
.exchange-info .ex-rate { font-size: 20px; font-weight: 800; color: #222; line-height: 1.1; }
.exchange-info .ex-rate span { font-size: 12px; font-weight: 400; color: #888; }
.exchange-info .ex-date { font-size: 12px; color: #bbb; margin-top: 2px; }
.exchange-sub { display: none; }

.estimation-list {  margin-top: 50px; width: 1200px; max-width: 100%; }
.estimation-list .cont { padding-left: 20px; width: 40%;}
.estimation-list .cont .link { display: inline-block; padding: 5px; border: 1px solid #ddd; font-size: 14px; }
.estimation-list .list { width: 60%;}

.contents_basic { margin: 20px auto; width: 1100px; max-width: 100%; min-height: 500px;}

/** footer  **/
.footer { margin: 0 auto; padding:30px 0; display: flex; width: 1200px; max-width: 100%; }
.footer .support { padding-left: 90px; padding-right: 45px; border-right: 1px solid #E4E4E4;}
.footer .support .tit { padding-bottom: 12px;}
.footer .support .info { padding:15px 0; line-height: 1.8em;}
.footer .support .link { display: block; text-align: center; padding:10px; margin-bottom: 10px;  border: 1px solid #ddd; font-size: 14px;}
.footer .nav { padding:0; width: 230px;  font-size: 14px;  border-right: 1px solid #E4E4E4;}
.footer .nav .list { padding: 15px 0 0 45px; }
.footer .nav .list li  {  padding-bottom: 15px;}
.footer .corp { padding: 10px 0 0 45px; font-size: 14px;}
.footer .corp .cont { line-height: 2em;}
.footer .corp .banner { padding: 20px 0; }
.footer .corp .banner img { display: inline-block; margin-right: 10px;}
.footer .corp .crt { margin-top: 5px; max-width: 480px; color: #959595; font-size: 11px;}
.footer .corp .copyright {margin-top: 10px;color: #959595; font-size: 11px;}

/*  게시판 */
.board_container { margin: 0 auto; padding-bottom: 50px; width: 1100px; max-width: 100%; min-width: 0; min-height: 800px;display: flex; align-content: space-around;}
.board_container h2 { text-align: left; font-size: 24px; padding: 30px 0 0;}
.board_container h3 { text-align: left; font-size: 20px; }
.board_container .list { width: 100%; }
.board_container .board_nav { width: 220px;}
.board_container .contents { width: 880px;}
.board_nav .list { padding: 10px 0; width: 180px;}
.board_nav .list li { border-bottom: 1px solid #d9d9d9;}
.board_nav .list li > a { display: block; padding: 10px 5px; font-size: 18px; }
.board_nav .list li > a:hover { background-color: #0EADDD; color: #fff;}
.board_nav .list li a.active { background-color: #0EADDD; color: #fff;}

.board_container .table_list { width: 100%;}
.board_container .table_list th { padding: 15px 0 10px; text-align: center; border-bottom: 1px solid #d9d9d9;}
.board_container .table_list td { padding: 8px 0; border-bottom: 1px solid #d9d9d9;}
.board_container .board_top { display: flex; justify-content:space-between;padding: 40px 0 10px;}
.branch_filter a{ margin-bottom: 5px;}

.pagination { display: flex; justify-content: center; margin: 40px auto 40px; gap: 40px; }
.pagination li.active span { background-color: #35C5F0; color: #fff; border-radius: 4px; padding: 4px 8px; font-weight: 700; }
.pagination li a, .pagination li span { font-size: 20px; }
.pagination li.page-num a, .pagination li.page-num span { font-size: 20px; }
.pagination li.disabled span { color: #ccc !important; cursor: default; }
.pagination li.prev a, .pagination li.next a,
.pagination li.first a, .pagination li.last a { font-size: 20px; }

.sub-contents { margin: 10px auto; width:100%; min-height: 300px; max-width: 1100px;}



/* ══════════════════════════════════════════════════
   Shared Component: cm-tabs (커뮤니티 탭 내비)
   사용: community.blade.php, review/list.blade.php, talk/list.blade.php
   ══════════════════════════════════════════════════ */
.cm-tabs {
    display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #e8e8e8;
    flex-wrap: wrap; max-width: 1200px; margin: 0 auto 10px; padding: 24px 15px 0;
}
.cm-tabs .cm-tab-title { font-size: 22px; font-weight: 900; color: #222; margin-right: 16px; padding-bottom: 10px; display: none; }
.cm-tabs a {
    font-size: 15px; font-weight: 400; color: #999; text-decoration: none; padding: 5px 12px 7px;
    border-bottom: 2px solid transparent; transition: all .15s;
}
.cm-tabs a:hover { color: #555; }
.cm-tabs a.active { color: #222; border-bottom-color: #222; font-weight: 800; }
.cm-tabs .cm-tab-right { display: none; }
.cm-tabs .cm-search { border: 1px solid #ddd; border-radius: 20px; padding: 6px 14px; font-size: 13px; outline: none; width: 200px; }
.cm-tabs .cm-btn-write {
    background: #20B2D6; color: #fff; border: none; border-radius: 20px; padding: 7px 20px; font-size: 13px;
    font-weight: 700; cursor: pointer; text-decoration: none; display: none;
}
.cm-tabs .cm-btn-write:hover { background: #29b5de; }

/* community 페이지 내부(.cm-wrap)에서는 max-width/padding 제거 */
.cm-wrap .cm-tabs { max-width: none; margin: 0 0 28px; padding: 0; }

/* 지점 메인 탭 */
.branch-tabs { max-width: 1200px; margin: 10px auto 0; padding: 0; }
.branch-tabs a { font-size: 16px; padding: 10px 18px 12px; }

/* 지점 카테고리 필터 */
.branch-cat-filter {
    max-width: 1200px; margin: 0 auto; padding: 12px 0 15px; display: flex; flex-wrap: wrap; gap: 8px;
}
.cat-filter-btn {
    padding: 5px 16px; font-size: 13px; font-weight: 600; border: 1.5px solid #ddd; border-radius: 20px;
    background: #fff; color: #666; cursor: pointer; transition: all .15s; white-space: nowrap;
}
.cat-filter-btn:hover { border-color: #0EADDD; color: #0EADDD; }
.cat-filter-btn.active { background: #0EADDD; color: #fff; border-color: #0EADDD; }


/* ══════════════════════════════════════════════════
   Page CSS (base styles)
   ══════════════════════════════════════════════════ */


/* ──────────────────────────────────────────────────
   0. 마이페이지 사이드 네비 (sidenav)
   ────────────────────────────────────────────────── */
/* 마이페이지 공통 레이아웃 */
.my-layout { max-width: 1080px; margin: 40px auto; padding: 0 20px 60px; display: flex; gap: 28px; align-items: flex-start; }
.my-layout .my-side  { width: 220px; flex-shrink: 0; position: sticky; top: 90px; }
.my-layout .my-main  { flex: 1; min-width: 0; }

/* 사이드 프로필 */
.my-side-profile {
    display: flex; align-items: center; gap: 12px; padding: 18px 16px;
    background: linear-gradient(135deg, #20B2D6, #0eaddd); border-radius: 14px; margin-bottom: 8px;
    box-shadow: 0 4px 16px rgba(32,178,214,.25);
}
.my-side-avatar {
    width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.25); display: flex;
    align-items: center; justify-content: center; font-size: 20px; font-weight: 900; color: #fff; flex-shrink: 0;
    border: 2px solid rgba(255,255,255,.4);
}
.my-side-info { color: #fff; min-width: 0; }
.my-side-name { font-size: 18px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 3px; }
.my-side-point { font-size: 16px; opacity: .9; display: flex; align-items: center; gap: 3px; }
.my-side-pt-icon { font-size: 10px; color: #FFE066; }
.my-side-point strong { font-size: 16px; font-weight: 900; color: #FFE066; }

/* 사이드 네비 */
.my-side-nav { background: #fff; border: 1px solid #ebebeb; border-radius: 12px; overflow: hidden; margin-bottom: 8px; padding-bottom: 10px; }
.my-side-group-label { font-size: 14px; font-weight: 800; color: #bbb; letter-spacing: .6px; text-transform: uppercase; padding: 10px 16px 4px; }
.my-side-link {
    display: flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 14px; color: #555;
    text-decoration: none; transition: background .12s, color .12s; border-left: 3px solid transparent;
    white-space: nowrap;
}
.my-side-link:hover { background: #f5faff; color: #20B2D6; text-decoration: none; }
.my-side-link.active { background: #f0faff; color: #20B2D6; font-weight: 800; border-left-color: #20B2D6; }
.my-side-icon { font-size: 14px; width: 18px; text-align: center; flex-shrink: 0; }

/* 로그아웃 */
.my-side-logout {
    display: block; text-align: center; padding: 8px; font-size: 14px; color: #aaa; text-decoration: none;
    border: 1px solid #ebebeb; border-radius: 8px; transition: all .12s;
}
.my-side-logout:hover { color: #e05252; border-color: #f5c0c0; background: #fff5f5; text-decoration: none; }


/* ──────────────────────────────────────────────────
   1. 마이페이지 (mypage)
   ────────────────────────────────────────────────── */
/* 프로필 카드 (메인 영역) */
.mp-profile-card {
    background: linear-gradient(135deg, #20B2D6 0%, #0eaddd 100%); border-radius: 16px; padding: 28px 24px; color: #fff;
    display: flex; align-items: center; gap: 20px; margin-bottom: 20px; box-shadow: 0 6px 24px rgba(53,197,240,.28);
}
.mp-avatar {
    width: 60px; height: 60px; border-radius: 50%; background: rgba(255,255,255,.25); display: flex;
    align-items: center; justify-content: center; font-size: 26px; font-weight: 900; color: #fff; flex-shrink: 0;
    border: 3px solid rgba(255,255,255,.4); position: relative; cursor: pointer; overflow: hidden;
}
.mp-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.mp-avatar-overlay {
    position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.45); color: #fff; font-size: 10px;
    font-weight: 700; text-align: center; padding: 4px 0; line-height: 1.2;
}
#mp-avatar-input { display: none; }
.mp-profile-info { flex: 1; }
.mp-name  { font-size: 18px; font-weight: 800; margin-bottom: 3px; }
.mp-email { font-size: 12px; opacity: .8; margin-bottom: 6px; }
.mp-badge {
    display: inline-flex; align-items: center; gap: 5px; background: rgba(255,255,255,.2); border-radius: 12px;
    padding: 3px 10px; font-size: 11px; font-weight: 700;
}

/* 포인트 배너 */
.mp-point-banner {
    background: #fff; border: 1.5px solid #20B2D6; border-radius: 12px; padding: 16px 20px; margin-bottom: 20px;
    display: flex; align-items: center; justify-content: space-between; box-shadow: 0 2px 10px rgba(53,197,240,.10);
}
.mp-point-left { display: flex; align-items: center; gap: 10px; }
.mp-point-ico { font-size: 28px; }
.mp-point-label { font-size: 12px; color: #aaa; }
.mp-point-val { font-size: 26px; font-weight: 900; color: #20B2D6; line-height: 1.1; }
.mp-point-right a {
    padding: 8px 16px; background: #20B2D6; color: #fff; border-radius: 8px; font-size: 13px; font-weight: 700;
    text-decoration: none; transition: background .15s;
}
.mp-point-right a:hover { background: #29b5de; }

/* 통계 */
.mp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
.mp-stat-box {
    background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; padding: 16px 12px; text-align: center;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.mp-stat-num  { font-size: 24px; font-weight: 900; color: #222; line-height: 1.1; }
.mp-stat-label{ font-size: 14px; color: #aaa; margin-top: 4px; }
.mp-stat-box.pending .mp-stat-num  { color: #f6a623; }
.mp-stat-box.paid    .mp-stat-num  { color: #3a9c5a; }
.mp-stat-box.cancelled .mp-stat-num{ color: #e05252; }

/* 섹션 카드 */
.mp-section {
    background: #fff; border: 1px solid #e8e8e8; border-radius: 14px; margin-bottom: 16px; overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.mp-section-head {
    padding: 14px 20px; border-bottom: 1px solid #f0f0f0; font-size: 14px; font-weight: 800; color: #222; display: flex;
    align-items: center; gap: 8px;
}
.mp-section-body { padding: 20px; }

/* 폼 */
.mp-field { margin-bottom: 16px; }
.mp-label { font-size: 11px; font-weight: 700; color: #888; letter-spacing:.4px; text-transform:uppercase; margin-bottom: 5px; display:block; }
.mp-input {
    width: 100%; padding: 10px 13px; border: 1.5px solid #e0e0e0; border-radius: 8px; font-size: 14px; color: #222;
    background: #fafafa; outline: none; transition: border-color .2s; box-sizing: border-box;
}
.mp-input:focus { border-color: #20B2D6; background: #fff; }
.mp-input[readonly] { background: #f5f5f5; color: #999; cursor: not-allowed; }
.mp-input-hint { font-size: 11px; color: #bbb; margin-top: 4px; }
.mp-save-btn {
    padding: 11px 28px; background: #20B2D6; color: #fff; border: none; border-radius: 8px; font-size: 14px;
    font-weight: 800; cursor: pointer; transition: background .15s;
}
.mp-save-btn:hover { background: #29b5de; }

/* 알림 */
.mp-alert { padding: 10px 14px; border-radius: 8px; font-size: 13px; margin-bottom: 14px; display: none; }
.mp-alert.success { background: #f0fff4; color: #3a9c5a; border-left: 3px solid #3a9c5a; }
.mp-alert.error   { background: #fff0f0; color: #e05252; border-left: 3px solid #e05252; }

/* 뱃지 */
.mp-badge-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 12px; padding: 4px 0; }
.mp-badge-item {
    display: flex; flex-direction: column; align-items: center; padding: 14px 6px 10px; border-radius: 12px;
    background: #fff; border: 1.5px solid #e8e8e8; transition: all .2s;
}
.mp-badge-item.earned {
    border-color: #20B2D6; background: linear-gradient(135deg, #f0fbff 0%, #e6f9ff 100%);
    box-shadow: 0 2px 8px rgba(53,197,240,.15);
}
.mp-badge-item.locked { opacity: 1; filter: none; }
.mp-badge-icon { font-size: 28px; margin-bottom: 6px; line-height: 1; }
.mp-badge-name { font-size: 11px; font-weight: 700; color: #333; text-align: center; line-height: 1.3; }
.mp-badge-count { font-size: 10px; color: #20B2D6; font-weight: 800; margin-top: 2px; }
.mp-badge-lock  { font-size: 10px; color: #ccc; margin-top: 2px; }


/* ──────────────────────────────────────────────────
   2. 장바구니 (cart)
   ────────────────────────────────────────────────── */
.cart-wrap { max-width: 960px; margin: 40px auto; padding: 0 20px; }
.cart-wrap h2 { font-size: 24px; font-weight: 800; margin-bottom: 28px; }
.cart-empty { text-align:center; padding: 80px 0; color: #aaa; font-size: 18px; }
.cart-empty a { display:inline-block; margin-top:20px; padding:12px 30px;
                background:#20B2D6; color:#fff; border-radius:6px; font-size:15px; text-decoration:none; }

/* 비로그인 안내 배너 */
.guest-banner {
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; background:#fff8e1;
    border:1px solid #ffe082; border-left: 4px solid #FFC107; border-radius:8px; padding:14px 20px; margin-bottom:24px;
    font-size:14px; color:#555;
}
.guest-banner strong { color:#333; }
.guest-banner a { display:inline-block; padding:8px 20px; background:#20B2D6; color:#fff;
                  border-radius:6px; font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap; }
.guest-banner a:hover { background:#29b5de; }

.location-group { margin-bottom: 36px; border: 1px solid #e0e0e0; border-radius: 12px; overflow: hidden; }
.location-header { display:flex; justify-content:space-between; align-items:center;
                   background:#f7f9fa; padding: 14px 20px; border-bottom: 1px solid #e0e0e0; }
.location-title { font-size: 17px; font-weight: 800; color: #222; }
.location-badge { font-size: 12px; background:#20B2D6; color:#fff; padding:3px 10px; border-radius:20px; margin-left:8px; }
.location-note  { font-size: 12px; color: #888; }

.cart-item { display:flex; gap:16px; padding: 20px; border-bottom: 1px solid #f0f0f0; }
.cart-item:last-child { border-bottom: none; }
.cart-thumb { width:120px; height:90px; border-radius:8px; overflow:hidden; flex-shrink:0; }
.cart-thumb img { width:100%; height:100%; object-fit:cover; }
.cart-thumb-none { width:120px; height:90px; background:#eee; border-radius:8px;
                   display:flex; align-items:center; justify-content:center; color:#bbb; font-size:12px; }
.cart-body { flex:1; }
.cart-name { font-size:16px; font-weight:700; margin-bottom:6px; }
.cart-name a { color:#222; text-decoration:none; }
.cart-name a:hover { color:#20B2D6; }
.cart-pax  { font-size:13px; color:#666; margin-bottom:8px; }
.cart-price { font-size:13px; color:#20B2D6; font-weight:700; }

.cart-remove { align-self:flex-start; background:none; border:none; color:#ccc;
               font-size:20px; cursor:pointer; padding:0; line-height:1; }
.cart-remove:hover { color:#ff5555; }

/* 인원 조정 */
.cart-persons { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:10px; padding-top:10px; border-top:1px solid #f0f0f0; }
.cart-person-item { display:flex; align-items:center; gap:6px; }
.cart-person-label { font-size:12px; color:#666; min-width:28px; }
.cp-btn { width:26px; height:26px; border:1.5px solid #ddd; background:#fff; border-radius:5px;
           font-size:15px; font-weight:700; color:#555; cursor:pointer;
           display:flex; align-items:center; justify-content:center; }
.cp-btn:hover { border-color:#20B2D6; color:#20B2D6; }
.cp-count { font-size:14px; font-weight:800; color:#20B2D6; min-width:18px; text-align:center; }

.cart-total-bar { background:#f7f9fa; border:1px solid #e0e0e0; border-radius:10px;
                  padding:20px 24px; margin-top:10px; }
.cart-total-bar .total-title { font-size:15px; font-weight:700; margin-bottom:12px; color:#222; }
.cart-total-row { display:flex; justify-content:space-between; font-size:14px; margin-bottom:6px; }
.cart-total-row strong { color:#20B2D6; font-size:16px; }
.cart-total-note { font-size:11px; color:#aaa; margin-top:8px; }
.btn-checkout { display:block; width:100%; margin-top:16px; padding:14px 0; text-align:center;
                background:#ff6b35; color:#fff; font-size:16px; font-weight:700;
                border-radius:8px; text-decoration:none; }
.btn-checkout:hover { background:#e85a25; color:#fff; }


/* ──────────────────────────────────────────────────
   3. 나의 여행 / 주문내역 (orders)
   ────────────────────────────────────────────────── */
/* ── 나의 여행 메인 컨텐츠 ── */
.or-main-title { font-size: 20px; font-weight: 800; color: #222; margin-bottom: 20px; }

/* 빈 상태 */
.or-empty { text-align: center; padding: 80px 0; color: #bbb; }
.or-empty-icon { font-size: 56px; margin-bottom: 16px; }
.or-empty-text { margin-bottom: 20px; }
.or-empty a { display: inline-block; padding: 10px 28px; background: #20B2D6;
              color: #fff; border-radius: 7px; font-size: 14px; font-weight: 700;
              text-decoration: none; }

/* 주문 카드 */
.or-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 12px;
           margin-bottom: 20px; overflow: hidden; }

/* 카드 헤더 */
.or-card-head { display: flex; align-items: center; justify-content: space-between;
                padding: 16px 22px; background: #f7f9fa; border-bottom: 1px solid #e8e8e8;
                flex-wrap: wrap; gap: 8px; }
.or-order-no { font-family: monospace; font-size: 14px; font-weight: 800; color: #20B2D6; }
.or-head-right { display: flex; align-items: center; gap: 12px; }
.or-date { font-size: 12px; color: #aaa; }
.or-badge { padding: 4px 12px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.or-badge.paid     { background: #d4edda; color: #155724; }
.or-badge.pending  { background: #fff3cd; color: #856404; }
.or-badge.cancelled{ background: #f8d7da; color: #721c24; }
.or-badge.cancel-req{ background: #ffe8cc; color: #b45309; }

/* 카드 바디 */
.or-card-body { padding: 18px 22px; }

/* 상품 행 */
.or-item { display: flex; align-items: flex-start; gap: 14px;
           padding: 12px 0; border-bottom: 1px solid #f5f5f5; }
.or-item:last-child { border-bottom: none; padding-bottom: 0; }
.or-item-info { flex: 1; }
.or-item-name { font-size: 14px; font-weight: 700; color: #222; margin-bottom: 4px; }
.or-item-meta { font-size: 12px; color: #888; line-height: 1.8; }
.or-item-price { text-align: right; white-space: nowrap; }
.or-item-deposit { font-size: 14px; font-weight: 700; color: #20B2D6; }
.or-item-charge  { font-size: 11px; color: #aaa; margin-top: 2px; }

/* 카드 푸터 */
.or-card-foot { display: flex; align-items: center; justify-content: space-between;
                padding: 14px 22px; border-top: 1px solid #f0f0f0;
                background: #fafafa; flex-wrap: wrap; gap: 10px; }
.or-total-area { font-size: 13px; color: #666; }
.or-total-area strong { font-size: 16px; color: #ff6b35; margin-left: 4px; }
.or-foot-right { display: flex; gap: 8px; }
.or-btn { padding: 8px 18px; border-radius: 7px; font-size: 13px; font-weight: 700;
           text-decoration: none; display: inline-block; transition: all .15s; border: none;
           cursor: pointer; }
.or-btn-detail { background: #f0f0f0; color: #555; }
.or-btn-detail:hover { background: #e0e0e0; }
.or-btn-cancel { background: #fff; color: #e05252; border: 1.5px solid #e05252; }
.or-btn-cancel:hover { background: #fff0f0; }

/* 무통장 계좌 안내 인라인 */
.or-bank-inline { margin-top: 10px; padding: 12px 16px; background: #fffbf0;
                  border: 1px solid #f6d860; border-radius: 8px; font-size: 12px; color: #856404; }
.or-bank-inline .row { display: flex; gap: 8px; margin-bottom: 4px; }
.or-bank-inline .row:last-child { margin-bottom: 0; }
.or-bank-inline .lbl { color: #aaa; min-width: 52px; }
.or-bank-inline .val { font-weight: 700; color: #333; }

/* 상세 펼치기 토글 */
.or-detail-toggle { font-size: 12px; color: #aaa; cursor: pointer; user-select: none; }
.or-detail-toggle:hover { color: #20B2D6; }
.or-extra { display: none; padding-top: 12px; border-top: 1px solid #f5f5f5; margin-top: 12px; }
.or-extra-row { display: flex; gap: 8px; font-size: 13px; padding: 4px 0; }
.or-extra-lbl { color: #aaa; min-width: 72px; }
.or-extra-val { color: #444; }


/* ──────────────────────────────────────────────────
   4. 결제 (checkout)
   ────────────────────────────────────────────────── */
.co-wrap { max-width: 1100px; margin: 40px auto; padding: 0 20px; }
.co-wrap > h2 { font-size: 22px; font-weight: 800; margin-bottom: 24px; color: #222; }

/* 2단 그리드 */
.co-grid { display: grid; grid-template-columns: 1fr 320px; gap: 24px; align-items: start; }

/* 공통 섹션 박스 */
.co-section { background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; margin-bottom: 16px; overflow: hidden; }
.co-section-head { padding: 14px 20px; background: #f7f9fa; border-bottom: 1px solid #e0e0e0;
                   font-size: 15px; font-weight: 800; color: #222; }
.co-section-body { padding: 20px; }

/* 날짜 선택 */
.date-row { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; }
.date-sep { color: #ccc; font-size: 18px; font-weight: 700; text-align: center; }
.co-label { display: block; font-size: 11px; font-weight: 700; color: #999; margin-bottom: 5px; letter-spacing: 0.3px; }
.co-input { width: 100%; padding: 10px 12px; border: 1.5px solid #e0e0e0; border-radius: 7px;
            font-size: 14px; color: #222; background: #fafafa; box-sizing: border-box; }
.co-input:focus { outline: none; border-color: #20B2D6; background: #fff; }

/* 인원 선택 */
.person-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.person-item .p-label { font-size: 14px; font-weight: 700; color: #333; margin-bottom: 2px; }
.person-item .p-age  { font-size: 11px; color: #aaa; margin-bottom: 10px; }
.person-counter { display: flex; align-items: center; gap: 12px; }
.p-btn { width: 32px; height: 32px; border: 1.5px solid #ddd; background: #fff; border-radius: 6px;
          font-size: 16px; font-weight: 700; color: #555; cursor: pointer; }
.p-btn:hover { border-color: #20B2D6; color: #20B2D6; }
.p-count { font-size: 17px; font-weight: 800; color: #20B2D6; min-width: 20px; text-align: center; }

/* 내 여행 상품 카드 */
.tour-card { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid #f0f0f0; position: relative; transition: background .15s; }
.tour-card:last-child { border-bottom: none; }
.tour-card-ghost { opacity: 0.4; background: #e8f8fd; border-radius: 8px; }
.tour-card-chosen { background: #f8fdff; box-shadow: 0 2px 12px rgba(53,197,240,.15); border-radius: 8px; }

/* 드래그 핸들 */
.tour-drag-handle { flex-shrink: 0; width: 24px; display: flex; align-items: center; justify-content: center;
                    font-size: 18px; color: #ccc; cursor: grab; user-select: none; -webkit-user-select: none;
                    transition: color .15s; }
.tour-drag-handle:hover { color: #20B2D6; }
.tour-drag-handle:active { cursor: grabbing; }

/* 스케줄 행 (날짜 뱃지 + 드롭다운) */
.tour-schedule-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tour-day-badge { display: inline-block; padding: 2px 8px; background: #20B2D6; color: #fff; border-radius: 10px;
                  font-size: 11px; font-weight: 700; white-space: nowrap; }
.tour-date-select { border: 1px solid #e0e0e0; border-radius: 6px; padding: 3px 8px; font-size: 12px; color: #555;
                    background: #fafafa; cursor: pointer; outline: none; }
.tour-date-select:focus { border-color: #20B2D6; }

.tour-thumb { width: 100px; height: 75px; border-radius: 7px; overflow: hidden; flex-shrink: 0; background: #eee; }
.tour-thumb img { width: 100%; height: 100%; object-fit: cover; }
.tour-thumb-none { width: 100px; height: 75px; border-radius: 7px; background: #eee; flex-shrink: 0;
                   display: flex; align-items: center; justify-content: center; color: #bbb; font-size: 11px; }
.tour-info { flex: 1; }
.tour-name { font-size: 14px; font-weight: 700; color: #222; margin-bottom: 4px; }
.tour-meta { font-size: 12px; color: #888; margin-bottom: 6px; }
.tour-price { font-size: 12px; color: #20B2D6; font-weight: 700; margin-bottom: 8px; }
.tour-price > span { vertical-align: baseline; }

/* 상품별 인원 조정 */
.tour-persons { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #f0f0f0; }
.tour-person-item { display: flex; align-items: center; gap: 6px; }
.tour-person-label { font-size: 12px; color: #666; min-width: 28px; }
.tp-btn { width: 24px; height: 24px; border: 1.5px solid #ddd; background: #fff; border-radius: 5px;
           font-size: 14px; font-weight: 700; color: #555; cursor: pointer; line-height: 1;
           display: flex; align-items: center; justify-content: center; }
.tp-btn:hover { border-color: #20B2D6; color: #20B2D6; }
.tp-count { font-size: 14px; font-weight: 800; color: #20B2D6; min-width: 16px; text-align: center; }

/* 예약자 정보 */
.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.info-grid.full { grid-template-columns: 1fr; }

/* 우측 sticky 패널 */
.co-panel { background: #fff; border: 1px solid #e0e0e0; border-radius: 10px;
            padding: 22px; position: sticky; top: 20px; }
.co-panel-title { font-size: 15px; font-weight: 800; color: #222; margin-bottom: 16px;
                  padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; }

/* 약관 */
.agree-all { display: flex; align-items: center; gap: 8px; padding: 11px 13px;
             background: #f7f9fa; border: 1px solid #e0e0e0; border-radius: 7px; margin-bottom: 8px; }
.agree-all label { font-size: 13px; font-weight: 700; color: #222; cursor: pointer; }
.agree-sub { display: flex; align-items: center; gap: 8px; padding: 5px 2px; }
.agree-sub label { font-size: 12px; color: #666; cursor: pointer; }
.agree-all input, .agree-sub input { width: 15px; height: 15px; cursor: pointer; accent-color: #20B2D6; flex-shrink: 0; vertical-align: middle; }
.agree-all label, .agree-sub label { vertical-align: middle; line-height: 1.4; }
.terms-view-link { font-size: 12px; color: #20B2D6; text-decoration: none; margin-left: 4px; vertical-align: baseline; }
.terms-view-link:hover { color: #1aa3d0; }

/* 약관 레이어 팝업 */
.terms-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 9999;
                 display: flex; align-items: center; justify-content: center; }
.terms-popup { background: #fff; border-radius: 12px; width: 90%; max-width: 640px; max-height: 80vh;
               display: flex; flex-direction: column; box-shadow: 0 8px 30px rgba(0,0,0,.2); }
.terms-popup-head { display: flex; justify-content: space-between; align-items: center;
                    padding: 16px 20px; border-bottom: 1px solid #eee; flex-shrink: 0; }
.terms-popup-head span { font-size: 16px; font-weight: 700; color: #222; }
.terms-popup-head button { background: none; border: none; font-size: 24px; color: #999; cursor: pointer; line-height: 1; }
.terms-popup-head button:hover { color: #333; }
.terms-popup-body { padding: 20px; overflow-y: auto; font-size: 13px; line-height: 1.7; color: #444; }
.terms-popup-body h3 { font-size: 16px; font-weight: 700; color: #222; margin: 0 0 6px; }
.terms-popup-body h4 { font-size: 14px; font-weight: 700; color: #333; margin: 18px 0 6px; }
.terms-popup-body p { margin: 0 0 8px; }
.terms-popup-body ol { padding-left: 20px; margin: 0 0 8px; }
.terms-popup-body li { margin-bottom: 4px; }
.terms-table { width: 100%; border-collapse: collapse; font-size: 12px; margin: 8px 0 12px; }
.terms-table th, .terms-table td { border: 1px solid #ddd; padding: 8px 10px; text-align: left; vertical-align: top; }
.terms-table th { background: #f5f7f9; font-weight: 700; color: #333; white-space: nowrap; }
.terms-table td { color: #555; line-height: 1.6; }

/* 금액 요약 */
.price-summary { margin: 16px 0; padding: 14px; background: #f7f9fa; border-radius: 8px; }
.price-row { display: flex; justify-content: space-between; font-size: 13px; color: #555; margin-bottom: 6px; }
.price-row:last-child { margin-bottom: 0; }
.price-row .val { font-weight: 700; color: #222; }
.price-row .val-usd { font-weight: 700; color: #888; }
.price-total { display: flex; justify-content: space-between; align-items: center;
               padding-top: 12px; border-top: 1.5px solid #ddd; margin-top: 10px; }
.price-total .t-label { font-size: 14px; font-weight: 700; color: #333; }
.price-total .t-amount { font-size: 20px; font-weight: 800; color: #ff6b35; }

/* 잔금 안내 */
.panel-charge-row { font-size: 13px; color: #333; text-align: right; margin-bottom: 4px; }
.panel-charge-row strong { color: #333; font-weight: 800; }
.panel-charge-note { display: none; font-size: 10px; color: #bbb; text-align: right; margin-bottom: 14px; }

/* 결제 버튼 */
.btn-pay { display: block; width: 100%; margin-top: 14px; padding: 14px 0; text-align: center;
           background: #ff6b35; color: #fff; font-size: 15px; font-weight: 800;
           border: none; border-radius: 8px; cursor: pointer; transition: background 0.2s; }
.btn-pay:hover { background: #e85a25; }
.btn-pay:disabled { background: #ccc; cursor: not-allowed; }
.btn-back { display: block; text-align: center; margin-top: 10px; font-size: 12px; color: #aaa; text-decoration: none; }
.btn-back:hover { color: #20B2D6; }

.co-empty { text-align: center; padding: 60px 0; color: #aaa; font-size: 16px; }
.co-empty a { display: inline-block; margin-top: 16px; padding: 10px 24px;
              background: #20B2D6; color: #fff; border-radius: 6px; font-size: 14px; text-decoration: none; }

/* 출발 공항 / 항공권 */
.airport-list { display: flex; flex-wrap: wrap; gap: 10px 20px; }
.airport-list span { display: flex; align-items: center; gap: 5px; font-size: 14px; color: #333; cursor: pointer; }
.airport-list input[type=radio] { cursor: pointer; accent-color: #20B2D6; }
.airport-etc-input { border: 1px solid #ccc; border-radius: 6px; padding: 5px 10px; font-size: 13px; width: 110px; margin-left: 4px; }
.airport-etc-input.disable { background: #f5f5f5; color: #ccc; }

.airline-list { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.airline-list span { display: flex; align-items: center; gap: 5px; font-size: 14px; color: #333; cursor: pointer; }
.airline-list input[type=radio] { cursor: pointer; accent-color: #20B2D6; }

.schedule-wrap { margin-top: 14px; padding: 14px 16px; background: #f8f9fa; border-radius: 8px; }
.schedule-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 14px; color: #555; }
.schedule-row:last-of-type { margin-bottom: 0; }
.schedule-label { min-width: 32px; font-weight: 700; color: #333; }
.schedule-date { padding: 7px 10px; border: 1.5px solid #ddd; border-radius: 6px; font-size: 13px; }
.schedule-flight { flex: 1; padding: 7px 10px; border: 1.5px solid #ddd; border-radius: 6px; font-size: 13px; }
.schedule-hint { font-size: 11px; color: #f6a623; margin-top: 8px; margin-bottom: 0; }
.schedule-flight { position: relative; cursor: pointer; }

/* 항공편 선택 드롭다운 */
.schedule-layer { display: none; position: absolute; z-index: 100; background: #fff;
                  border: 1.5px solid #20B2D6; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.12);
                  max-height: 200px; overflow-y: auto; }
.schedule-layer.show { display: block; }
.schedule-layer ul { list-style: none; margin: 0; padding: 4px 0; }
.schedule-layer li { padding: 9px 14px; font-size: 13px; color: #333; cursor: pointer; white-space: nowrap; }
.schedule-layer li:hover { background: #f0fbff; color: #20B2D6; }

/* 호텔/리조트 */
.hotel-status-list { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.hotel-status-list span { display: flex; align-items: center; gap: 5px; font-size: 14px; color: #333; cursor: pointer; }
.hotel-status-list input[type=radio] { cursor: pointer; accent-color: #20B2D6; }
.hotel-grade-list { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.hotel-grade-item { display: flex; align-items: center; gap: 8px; padding: 10px 16px;
                    border: 1.5px solid #e0e0e0; border-radius: 8px; cursor: pointer; transition: border-color .2s; }
.hotel-grade-item:hover { border-color: #20B2D6; }
.hotel-grade-item input[type=radio] { accent-color: #20B2D6; }
.hotel-grade-budget { font-size: 11px; color: #aaa; margin-left: 4px; }

/* 결제수단 선택 */
.pay-method-list { display: flex; gap: 10px; margin-bottom: 14px; }
.pay-method-btn {
    flex: 1; padding: 10px 0; border: 2px solid #e0e0e0; border-radius: 8px; background: #fff; font-size: 13px;
    font-weight: 700; color: #888; cursor: pointer; text-align: center; transition: all .2s;
}
.pay-method-btn.active { border-color: #20B2D6; color: #20B2D6; background: #f0fbff; }
.bank-info-box {
    background: #f7f9fa; border: 1px solid #e0e0e0; border-radius: 8px; padding: 14px 16px; margin-bottom: 14px;
    font-size: 13px; color: #444; display: none;
}
.bank-info-box .bank-row { display: flex; gap: 8px; margin-bottom: 6px; }
.bank-info-box .bank-row:last-child { margin-bottom: 0; }
.bank-info-box .bank-label { color: #aaa; min-width: 52px; }
.bank-info-box .bank-val { font-weight: 700; color: #222; }

/* ── 포인트 사용 (checkout) ────────────────────────── */
.point-use-box { margin: 14px 0; padding: 14px; background: #fffdf5; border: 1px solid #ffe8b0; border-radius: 8px; }
.point-use-title {
    display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-size: 13px;
    font-weight: 700; color: #333;
}
.point-balance-label { font-size: 12px; font-weight: 400; color: #888; }
.point-balance-label strong { color: #ff6b35; font-weight: 700; }
.point-input-row { display: flex; align-items: center; gap: 6px; }
.point-input { flex: 1; text-align: right; font-weight: 700; font-size: 14px; }
.point-input::-webkit-inner-spin-button,
.point-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.point-input[type=number] { -moz-appearance: textfield; }
.point-won { font-size: 13px; color: #888; font-weight: 700; flex-shrink: 0; }
.btn-use-all {
    flex-shrink: 0; padding: 7px 12px; font-size: 12px; font-weight: 700; color: #fff; background: #20B2D6;
    border: none; border-radius: 6px; cursor: pointer;
}
.btn-use-all:hover { background: #1a9fc0; }
.point-hint { font-size: 11px; margin-top: 6px; min-height: 16px; }
.point-row { border-top: 1px dashed #eee; padding-top: 8px; margin-top: 6px; }
.point-final-row { border-top: 1px solid #ddd; padding-top: 10px; margin-top: 6px; }

/* ──────────────────────────────────────────────────
   5. 포인트 내역 (my/points)
   ────────────────────────────────────────────────── */
/* ── 포인트 내역 ── */
.pt-title { font-size: 20px; font-weight: 800; color: #222; margin-bottom: 20px; }

/* 포인트 요약 배너 */
.pt-summary { display: flex; gap: 14px; margin-bottom: 24px; flex-wrap: wrap; }
.pt-summary-card {
    flex: 1; min-width: 120px; padding: 18px 20px; border-radius: 14px; background: #fff; border: 1px solid #ebebeb;
    text-align: center;
}
.pt-summary-card.main-card { background: linear-gradient(135deg, #20B2D6, #0eaddd); border: none; color: #fff; }
.pt-summary-label { font-size: 14px; font-weight: 600; opacity: .75; margin-bottom: 6px; }
.pt-summary-value { font-size: 22px; font-weight: 900; }
.pt-summary-card.main-card .pt-summary-value { color: #FFE066; }
.pt-summary-unit { font-size: 14px; font-weight: 600; margin-left: 2px; color:#aaa;}

/* 내역 테이블 영역 */
.pt-log-section { background: #fff; border: 1px solid #ebebeb; border-radius: 12px; overflow: hidden; }
.pt-log-header {
    display: flex; align-items: center; justify-content: space-between; padding: 14px 20px;
    border-bottom: 1px solid #f0f0f0; font-size: 16px; font-weight: 800; color: #444;
}
.pt-log-count { font-size: 14px; color: #aaa; font-weight: 400; }

/* 내역 행 */
.pt-log-item {
    display: flex; align-items: center; gap: 12px; padding: 14px 20px; border-bottom: 1px solid #f9f9f9;
    transition: background .1s;
}
.pt-log-item:last-child { border-bottom: none; }
.pt-log-item:hover { background: #fafcff; }

.pt-log-icon {
    width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
    font-size: 16px; flex-shrink: 0;
}
.pt-log-icon.earn   { background: #e8f8ee; }
.pt-log-icon.use    { background: #fef3e8; }
.pt-log-icon.expire { background: #f5f5f5; }
.pt-log-icon.admin  { background: #e8f4fe; }

.pt-log-info { flex: 1; min-width: 0; }
.pt-log-reason { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 3px;
                 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-log-date   { font-size: 12px; color: #ccc; }

.pt-log-amount { text-align: right; white-space: nowrap; }
.pt-log-pts    { font-size: 15px; font-weight: 900; }
.pt-log-pts.earn   { color: #2ecc71; }
.pt-log-pts.use    { color: #e05252; }
.pt-log-pts.expire { color: #aaa; }
.pt-log-pts.admin  { color: #20B2D6; }
.pt-log-balance { font-size: 12px; color: #ccc; margin-top: 2px; }

/* 빈 상태 */
.pt-empty { text-align: center; padding: 60px 0; color: #bbb; }
.pt-empty-icon { font-size: 48px; margin-bottom: 12px; }
.pt-empty-text { font-size: 16px; }

/* 페이지네이션 */
.pt-pagination { display: flex; justify-content: center; margin-top: 24px; gap: 4px; }
.pt-page-btn {
    padding: 6px 12px; border-radius: 7px; font-size: 13px; font-weight: 600; border: 1px solid #e0e0e0;
    background: #fff; color: #555; text-decoration: none; transition: all .12s;
}
.pt-page-btn:hover { background: #f0faff; border-color: #20B2D6; color: #20B2D6; text-decoration: none; }
.pt-page-btn.active { background: #20B2D6; border-color: #20B2D6; color: #fff; }
.pt-page-btn.disabled { opacity: .4; pointer-events: none; }


/* ──────────────────────────────────────────────────
   6. 내가 쓴 댓글 (my/comments)
   ────────────────────────────────────────────────── */
/* ── 내가 쓴 댓글 ── */
.cm-title { font-size: 20px; font-weight: 800; color: #222; margin-bottom: 20px; }

/* 빈 상태 */
.cm-empty { text-align: center; padding: 80px 0; color: #bbb; }
.cm-empty-icon { font-size: 52px; margin-bottom: 14px; }
.cm-empty-text,.mr-empty-text, .or-empty-text, .est-my-empty-text{ font-size: 16px; }

/* 댓글 카드 */
.cm-card {
    background: #fff; border: 1px solid #ebebeb; border-radius: 12px; margin-bottom: 14px; overflow: hidden;
    transition: box-shadow .15s;
}
.cm-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); }

/* 상단: 게시물 출처 */
.cm-card-source {
    display: flex; align-items: center; gap: 8px; padding: 10px 18px; background: #f9fafb;
    border-bottom: 1px solid #f0f0f0; font-size: 12px; color: #999;
}
.cm-source-badge { padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 700; background: #e8f4fe; color: #1a7dc7; }
.cm-source-badge.review { background: #fef3e8; color: #d46b08; }
.cm-source-title {
    flex: 1; font-size: 13px; color: #555; font-weight: 600; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; text-decoration: none;
}
.cm-source-title:hover { color: #20B2D6; text-decoration: none; }
.cm-source-date { font-size: 11px; color: #ccc; white-space: nowrap; }

/* 댓글 본문 */
.cm-card-body { padding: 14px 18px; }
.cm-body-text { font-size: 14px; color: #333; line-height: 1.7; word-break: break-word; }
.cm-body-text.deleted { color: #ccc; font-style: italic; }

/* 상태 표시 */
.cm-status { display: inline-block; margin-top: 6px; font-size: 11px; padding: 2px 8px; border-radius: 8px; font-weight: 600; }
.cm-status.hidden  { background: #fff3cd; color: #856404; }
.cm-status.deleted { background: #f8d7da; color: #721c24; }

/* 페이지네이션 */
.cm-pagination { display: flex; justify-content: center; margin-top: 24px; gap: 4px; }
.cm-page-btn {
    padding: 6px 12px; border-radius: 7px; font-size: 13px; font-weight: 600; border: 1px solid #e0e0e0;
    background: #fff; color: #555; text-decoration: none; transition: all .12s;
}
.cm-page-btn:hover { background: #f0faff; border-color: #20B2D6; color: #20B2D6; text-decoration: none; }
.cm-page-btn.active { background: #20B2D6; border-color: #20B2D6; color: #fff; }
.cm-page-btn.disabled { opacity: .4; pointer-events: none; }


/* ──────────────────────────────────────────────────
   6-1. 리뷰 글쓰기 (review/write)
   ────────────────────────────────────────────────── */
.rw-wrap { max-width: 860px; margin: 30px auto; padding: 0 15px; }
.rw-wrap h2 { font-size: 24px; font-weight: 800; margin-bottom: 4px; color: #222; }
.rw-subtitle { color: #888; font-size: 14px; margin-bottom: 28px; padding-bottom: 20px; border-bottom: 2px solid #333; }
.rw-error-msg { padding: 12px 16px; background: #fff0f0; color: #e05252; border-radius: 8px; margin-bottom: 16px; font-size: 13px; }

/* 섹션 */
.rw-section { background: #fff; border: 1px solid #eee; border-radius: 14px; padding: 28px 24px; margin-bottom: 20px; }
.rw-photo-section { background: #f8fbff; border-color: #d8e8f4; }
.rw-section-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; }
.rw-section-num {
    display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%;
    background: #20B2D6; color: #fff; font-weight: 800; font-size: 15px; flex-shrink: 0;
}
.rw-section-title { font-size: 17px; font-weight: 800; color: #222; }
.rw-section-desc { font-size: 13px; color: #888; margin-top: 2px; }

/* 사진 업로드 영역 (블로그 스타일) */
.rw-photo-upload-area { background: #f8fbff; border: 1px solid #d8e8f4; border-radius: 10px; padding: 16px; }
.rw-photo-upload-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.rw-photo-upload-title { font-size: 14px; font-weight: 700; color: #333; }
.rw-photo-add-btn {
    padding: 6px 16px; background: #fff; color: #20B2D6; border: 1.5px solid #20B2D6; border-radius: 6px; font-size: 13px;
    font-weight: 700; cursor: pointer; transition: background .15s;
}
.rw-photo-add-btn:hover { background: #fff; }
.rw-photo-empty { text-align: center; color: #aaa; font-size: 13px; padding: 20px 0; }

/* 사진 리스트 (가로 스와이프 카드형) */
.rw-photo-list {
    display: flex; flex-direction: row; gap: 8px;
    overflow-x: auto; padding-bottom: 6px;
}
.rw-photo-list::-webkit-scrollbar { height: 4px; }
.rw-photo-list::-webkit-scrollbar-thumb { background: #ccc; border-radius: 2px; }
.rw-photo-list { cursor: grab; user-select: none; }
.rw-photo-list img { pointer-events: none; }
.rw-photo-list.dragging { cursor: grabbing; }
.rw-ph-item {
    display: flex; flex-direction: column; gap: 6px;
    background: #fff; border: 1px solid #e8e8e8; border-radius: 8px;
    padding: 8px; flex-shrink: 0; width: 160px; transition: box-shadow .15s;
}
.rw-ph-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.rw-ph-thumb { position: relative; width: 100%; height: 60px; border-radius: 6px; overflow: hidden; background: #f0f0f0; }
.rw-ph-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rw-ph-main {
    position: absolute; top: 2px; left: 2px; background: #20B2D6; color: #fff; font-size: 9px; font-weight: 800;
    padding: 1px 5px; border-radius: 3px;
}
.rw-ph-set-main {
    position: absolute; top: 2px; left: 2px; background: rgba(0,0,0,0.45); color: #fff; font-size: 9px; font-weight: 700;
    padding: 1px 5px; border-radius: 3px; border: none; cursor: pointer;
}
.rw-ph-set-main:hover { background: #20B2D6; }
.rw-ph-num {
    position: absolute; bottom: 3px; right: 4px; background: rgba(0,0,0,0.45); color: #fff;
    font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; line-height: 1.4;
}
.rw-ph-meta { width: 100%; }
.rw-ph-tag {
    width: 100%; padding: 4px 6px; border: 1px solid #e0e0e0; border-radius: 5px; font-size: 14px; color: #555;
    background: #fafafa; outline: none; cursor: pointer; box-sizing: border-box;
}
.rw-ph-tag:focus { border-color: #20B2D6; }
.rw-ph-tag-hint { font-size: 10px; color: #bbb; }
.rw-ph-actions { display: flex; gap: 4px; }
.rw-ph-insert {
    flex: 1; padding: 5px 4px; background: #333; color: #fff; border: none; border-radius: 5px; font-size: 11px;
    font-weight: 700; cursor: pointer; transition: background .15s; text-align: center;
}
.rw-ph-insert:hover { background: #20B2D6; }
.rw-ph-remove {
    width: 28px; height: 28px; flex-shrink: 0; background: none; color: #ccc; border: 1px solid #e0e0e0; border-radius: 5px;
    font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.rw-ph-remove:hover { background: #e05252; color: #fff; border-color: #e05252; }

/* 입력 필드 */
.rw-row { display: flex; gap: 16px; }
.rw-col-6 { flex: 1; }
.rw-col-3 { flex: 0 0 auto; width: 180px; }
.rw-field { margin-bottom: 0px; }
.rw-label { display: block; font-size: 13px; font-weight: 700; color: #333; margin: 14px 0 6px; }
.rw-required { color: #e05252; margin-left: 2px; }
.rw-input,
.rw-select {
    width: 100%;
    padding: 10px 13px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
    color: #222;
    background: #fafafa;
    outline: none;
    transition: border-color .2s;
    box-sizing: border-box;
}
.rw-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 17px center;
    padding-right: 36px;
}
.rw-input:focus,
.rw-select:focus {
    border-color: #20B2D6;
    background: #fff;
}
.rw-textarea {
    width: 100%; padding: 14px; border: 1.5px solid #e0e0e0; border-radius: 8px; font-size: 14px; color: #222;
    background: #fafafa; outline: none; resize: vertical; min-height: 250px; line-height: 1.7;
    transition: border-color .2s; box-sizing: border-box;
}
.rw-textarea:focus { border-color: #20B2D6; background: #fff; }

/* 별점 */
.rw-rating { display: flex; align-items: center; gap: 4px; }
.rw-star { font-size: 32px; color: #ddd; cursor: pointer; transition: color .15s, transform .15s; user-select: none; line-height: 1; }
.rw-star:hover { transform: scale(1.15); }
.rw-star.active { color: #f5a623; }
.rw-rating-text { margin-left: 10px; font-size: 14px; font-weight: 700; color: #f5a623; }

/* 버튼 */
.rw-form-footer { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 10px; margin-bottom: 40px; }
.rw-submit-btn {
    padding: 12px 40px; background: #20B2D6; color: #fff; border: none; border-radius: 10px; font-size: 18px;
    font-weight: 800; cursor: pointer; transition: background .15s;
}
.rw-submit-btn:hover { background: #29b5de; }
.rw-cancel-btn {
    padding: 14px 28px; border: 1px solid #ddd; border-radius: 10px; color: #888; text-decoration: none;
    font-size: 14px; font-weight: 600; transition: all .15s;
}
.rw-cancel-btn:hover { border-color: #999; color: #555; }


/* ──────────────────────────────────────────────────
   7. 여행토크 작성 (talk/write)
   ────────────────────────────────────────────────── */
.talk-write-wrap { max-width: 860px; margin: 30px auto; padding: 0 15px; }
.talk-write-wrap h2 { font-size: 22px; font-weight: 700; margin-bottom: 24px; padding-bottom: 12px; border-bottom: 2px solid #333; }
.talk-field { margin-bottom: 20px; }
.talk-label { display: block; font-size: 13px; font-weight: 700; color: #333; margin-bottom: 6px; }
.talk-label .required { color: #e05252; margin-left: 2px; }
.talk-input,
.talk-select {
    width: 100%;
    padding: 10px 13px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
    color: #222;
    background: #fafafa;
    outline: none;
    transition: border-color .2s;
    box-sizing: border-box;
}
.talk-input:focus,
.talk-select:focus {
    border-color: #20B2D6;
    background: #fff;
}
.talk-textarea {
    width: 100%; padding: 14px; border: 1.5px solid #e0e0e0; border-radius: 8px; font-size: 14px; color: #222;
    background: #fafafa; outline: none; resize: vertical; min-height: 300px; line-height: 1.7;
    transition: border-color .2s; box-sizing: border-box;
}
.talk-textarea:focus { border-color: #20B2D6; background: #fff; }
.talk-error { color: #e05252; font-size: 12px; margin-top: 4px; }

/* 사진 업로드 */
.talk-photo-area {
    border: 2px dashed #e0e0e0; border-radius: 10px; padding: 20px; text-align: center; color: #aaa; cursor: pointer;
    transition: border-color .15s;
}
.talk-photo-area:hover { border-color: #20B2D6; }
.talk-photo-area input[type=file] { display: none; }
.talk-photo-preview { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.talk-photo-thumb { position: relative; width: 100px; height: 100px; border-radius: 8px; overflow: hidden; }
.talk-photo-thumb img { width: 100%; height: 100%; object-fit: cover; }
.talk-photo-thumb .remove-photo {
    position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; background: rgba(0,0,0,.6); color: #fff;
    border: none; border-radius: 50%; font-size: 12px; cursor: pointer; display: flex; align-items: center;
    justify-content: center;
}

/* 버튼 */
.talk-form-footer { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.talk-submit-btn {
    padding: 12px 36px; background: #20B2D6; color: #fff; border: none; border-radius: 8px; font-size: 15px;
    font-weight: 800; cursor: pointer; transition: background .15s;
}
.talk-submit-btn:hover { background: #29b5de; }
.talk-cancel-btn {
    padding: 12px 24px; border: 1px solid #ddd; border-radius: 8px; color: #888; text-decoration: none; font-size: 14px;
    font-weight: 600; transition: all .15s;
}
.talk-cancel-btn:hover { border-color: #999; color: #555; }


/* ──────────────────────────────────────────────────
   8. 여행토크 상세 (talk/view)
   ────────────────────────────────────────────────── */
.talk-view-wrap { max-width: 860px; margin: 30px auto; padding: 0 15px; }

/* 헤더 */
.talk-view-header { border-bottom: 2px solid #333; padding-bottom: 16px; margin-bottom: 20px; }
.talk-view-header .branch-badge {
    display: inline-block; background: #20B2D6; color: #fff; font-size: 12px; padding: 2px 10px; border-radius: 20px;
    margin-bottom: 10px;
}
.talk-view-header h2 { font-size: 22px; font-weight: 700; margin-bottom: 10px; }
.talk-view-meta { display: flex; gap: 16px; font-size: 14px; color: #888; align-items: center; flex-wrap: wrap; }
.talk-view-meta .author { display: flex; align-items: center; gap: 6px; font-weight: 600; color: #333; }
.talk-view-meta .author img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.talk-view-actions { margin-left: auto; display: flex; gap: 8px; }
.talk-view-actions a,
.talk-view-actions button {
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 6px;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid #ddd;
    background: #fff;
    color: #666;
    transition: all .15s;
}
.talk-view-actions a:hover { border-color: #20B2D6; color: #20B2D6; }
.talk-view-actions .btn-del { border-color: #e05252; color: #e05252; }
.talk-view-actions .btn-del:hover { background: #e05252; color: #fff; }

/* 본문 */
.talk-view-body { padding: 20px 0 40px; border-bottom: 1px solid #e0e0e0; font-size: 16px; line-height: 1.8; color: #333; }
.talk-view-body img { max-width: 100%; height: auto; border-radius: 6px; margin: 8px 0; }

/* 사진 */
.talk-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 20px 0; border-bottom: 1px solid #e0e0e0; }
.talk-photos a { display: block; position: relative; padding-top: 75%; overflow: hidden; border-radius: 8px; background: #eee; }
.talk-photos a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.talk-photos a:hover img { transform: scale(1.05); }

/* 좋아요 */
.talk-like-area { display: flex; justify-content: center; padding: 24px 0; border-bottom: 1px solid #e0e0e0; }
.btn-talk-like {
    display: inline-flex; align-items: center; gap: 8px; padding: 10px 28px; border: 2px solid #e0e0e0;
    border-radius: 30px; background: #fff; font-size: 16px; font-weight: 700; color: #888; cursor: pointer;
    transition: all .2s;
}
.btn-talk-like:hover { border-color: #e05252; color: #e05252; }
.btn-talk-like.liked { border-color: #e05252; color: #e05252; background: #fff5f5; }
.btn-talk-like .heart { font-size: 20px; transition: transform .2s; }
.btn-talk-like.liked .heart { transform: scale(1.2); }

/* 댓글 */
.talk-comments { padding: 24px 0; }
.talk-comments h4 { font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.comment-item { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid #f0f0f0; }
.comment-avatar {
    width: 36px; height: 36px; border-radius: 50%; background: #e8e8e8; display: flex; align-items: center;
    justify-content: center; font-size: 14px; font-weight: 700; color: #888; flex-shrink: 0;
}
.comment-body { flex: 1; min-width: 0; }
.comment-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.comment-nickname { font-size: 16px; font-weight: 700; color: #333; }
.comment-date { font-size: 12px; color: #aaa; }
.comment-delete { font-size: 11px; color: #ccc; border: none; background: none; cursor: pointer; margin-left: auto; }
.comment-delete:hover { color: #e05252; }
.comment-text { font-size: 16px; color: #444; line-height: 1.5; }
.comment-empty { text-align: center; padding: 30px 0; color: #bbb; font-size: 14px; }

/* 댓글 작성폼 */
.comment-form { margin-top: 16px; border: 1.5px solid #e0e0e0; border-radius: 10px; overflow: hidden; }
.comment-form textarea {
    width: 100%; border: none; padding: 14px; font-size: 16px; resize: vertical; min-height: 80px; outline: none;
    box-sizing: border-box;
}
.comment-form-footer {
    display: flex; align-items: center; justify-content: space-between; padding: 8px 14px; background: #fafafa;
    border-top: 1px solid #f0f0f0;
}
.nickname-label { font-size: 14px; color: #aaa; }
.comment-submit {
    padding: 6px 20px; background: #20B2D6; color: #fff; border: none; border-radius: 6px; font-size: 16px;
    font-weight: 700; cursor: pointer;
}
.comment-submit:hover { background: #29b5de; }
.comment-login-msg { text-align: center; padding: 30px; color: #aaa; font-size: 16px; }
.comment-login-msg a { color: #20B2D6; font-weight: 700; }

/* 하단 버튼 */
.talk-view-footer { padding: 20px 0; display: flex; justify-content: center; }
.talk-back-btn {
    padding: 10px 30px; border: 1px solid #ddd; border-radius: 8px; color: #666; text-decoration: none; font-size: 16px;
    font-weight: 600; transition: all .15s;
}
.talk-back-btn:hover { border-color: #20B2D6; color: #20B2D6; }


/* ──────────────────────────────────────────────────
   9. 여행토크 목록 (talk/list)
   ────────────────────────────────────────────────── */
.talk-wrap { display: flex; flex-direction: column; max-width: 1200px; margin: 30px auto; padding: 0 15px; }

/* 사이드바 → tab-location과 동일한 가로 탭 */
.talk-sidebar { width: 100%; }
.talk-sidebar h3 { display: none; }
.talk-sidebar ul { list-style: none; margin: 0 0 20px; padding: 0 0 30px; display: flex; width: 100%; text-align: left; border-bottom: 1px solid #ddd; justify-content: flex-start; flex-wrap: wrap; }
.talk-sidebar ul::-webkit-scrollbar { display: none; }
.talk-sidebar ul li { padding: 3px 16px; cursor: pointer; white-space: nowrap; }
.talk-sidebar ul li a { display: inline; text-decoration: none; color: inherit; font-size: 16px; }
.talk-sidebar ul li a.active { color: #35C5F0; font-weight: 700; }

/* 콘텐츠 */
.talk-content { flex: 1; min-width: 0; width: 1100px; margin: 0 auto; }
.talk-header { display: flex; align-items: center; gap: 12px; margin: 30px 0 40px; }
.talk-header h2 { font-size: 22px; font-weight: 700; margin: 0; flex: 1; }
.talk-btn-write-fixed { margin-left: auto; }
.talk-header-right { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.talk-sort-btn {
    padding: 6px 14px; border: 1px solid #ddd; border-radius: 20px; font-size: 14px; font-weight: 600; color: #888;
    background: #fff; cursor: pointer; text-decoration: none; transition: all .15s;
}
.talk-sort-btn:hover, .talk-sort-btn.active { border-color: #20B2D6; color: #20B2D6; background: #f0fbff; }
.talk-search { border: 1px solid #ddd; border-radius: 20px; padding: 6px 14px; font-size: 14px; outline: none; width: 180px; }
.talk-search:focus { border-color: #20B2D6; }
.talk-btn-write {
    display: inline-block; background: #35C5F0; color: #fff; border: none; border-radius: 6px; padding: 8px 18px;
    font-size: 14px; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; transition: background .15s;
}
.talk-btn-write:hover { background: #1db3de; color: #fff; }

/* 게시글 리스트 (Reddit 스타일) */
.talk-list { display: flex; flex-direction: column; gap: 0; }
.talk-item {
    display: flex; align-items: flex-start; gap: 16px; padding: 20px 0; border-bottom: 1px solid #f0f0f0;
    text-decoration: none; color: inherit; transition: background .1s;
}
.talk-item:hover { background: #fafcff; }

/* 페이지네이션 */
.pagination { font-size: 18px !important; }
.pagination .page-link { font-size: 18px !important; }

/* 좋아요 카운트 (좌측) */
.talk-vote { display: flex; flex-direction: row; align-items: center; gap: 12px; margin-top: 8px; line-height: 1; }
.talk-vote-heart { font-size: 18px !important; color: #aaa; line-height: 1; }
.talk-vote-count { font-size: 16px; font-weight: 400; color: #aaa; line-height: 1; }
.talk-vote-label { font-size: 12px; color: #bbb; margin-top: 2px; }
.talk-vote-like { display: flex; flex-direction: row; align-items: center; gap: 4px; }
.talk-vote-comment { display: flex; flex-direction: row; align-items: center; gap: 4px; font-size: 16px; color: #aaa; }

/* 메인 콘텐츠 */
.talk-item-body { flex: 1; min-width: 0; }
.talk-item-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.talk-location-badge {
    display: inline-block; font-size: 12px; font-weight: 700; color: #20B2D6; background: #f0fbff; border-radius: 10px;
    padding: 1px 8px;
}
.talk-item-title {
    font-size: 18px; font-weight: 700; color: #222; margin: 6px 0; line-height: 1.3; display: -webkit-box;
    -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.talk-item-desc {
    font-size: 16px; color: #888; margin-bottom: 6px; display: -webkit-box; -webkit-line-clamp: 3;
    -webkit-box-orient: vertical; overflow: hidden;
}
.talk-item-meta { display: flex; align-items: center; gap: 12px; font-size: 12px; color: #aaa; }
.talk-author-group { display: inline-flex; align-items: center; gap: 6px; }
.talk-item-meta .author { display: flex; align-items: center; gap: 5px; font-weight: 600; color: #666; font-size: 14px; }
.talk-author-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.talk-author-avatar-default { display: inline-flex; align-items: center; justify-content: center; }
.talk-item-thumb { width: 80px; height: 80px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }

/* 빈 상태 */
.talk-empty { text-align: center; padding: 60px 0; color: #aaa; font-size: 15px; }


/* ──────────────────────────────────────────────────
   10. 여행후기 상세 (review/view)
   ────────────────────────────────────────────────── */
.review-view-wrap { max-width: 860px; margin: 30px auto; padding: 0 15px; }
.review-view-header { border-bottom: 2px solid #333; padding-bottom: 16px; margin-bottom: 20px; }
.review-view-header .branch-badge {
    display: inline-block; background: #2255cc; color: #fff; font-size: 12px; padding: 2px 10px; border-radius: 20px;
    margin-bottom: 10px;
}
.review-view-header h2 { font-size: 22px; font-weight: 700; margin-bottom: 10px; }
.review-view-meta { display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: #888; }
.review-meta-row1 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.review-meta-row2 { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.review-meta-author { display: flex; align-items: center; gap: 6px; font-weight: 600; color: #555; }
.review-author-icon-fallback { display: inline-flex; align-items: center; justify-content: center; }
.review-view-stars { color: #f5a623; font-size: 16px; }
.review-view-body { padding: 20px 0; border-bottom: 1px solid #e0e0e0; font-size: 15px; line-height: 1.8; color: #333; }
.review-view-body img { max-width: 100%; height: auto; border-radius: 6px; margin: 8px 0; }
.review-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 20px 0; border-bottom: 1px solid #e0e0e0; }
.review-photos a { display: block; position: relative; padding-top: 75%; overflow: hidden; border-radius: 8px; background: #eee; }
.review-photos a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.review-photos a:hover img { transform: scale(1.05); }
.review-photos .main-badge {
    position: absolute; top: 6px; left: 6px; background: rgba(34,85,204,.85); color: #fff; font-size: 10px;
    padding: 1px 7px; border-radius: 20px;
}
.review-view-footer { padding: 20px 0; display: flex; justify-content: center; }
.review-view-footer .btn { font-size: 18px; }
/* 좋아요 */
.review-like-area { display: flex; justify-content: center; padding: 24px 0; border-bottom: 1px solid #e0e0e0; }
.btn-review-like {
    display: inline-flex; align-items: center; gap: 8px; padding: 10px 28px; border: 2px solid #e0e0e0;
    border-radius: 50px; background: #fff; font-size: 15px; font-weight: 700; color: #888; cursor: pointer;
    transition: all .2s; user-select: none;
}
.btn-review-like .heart { font-size: 18px; transition: transform .2s; }
.btn-review-like:hover  { border-color: #e05252; color: #e05252; }
.btn-review-like.liked  { border-color: #e05252; color: #e05252; background: #fff5f5; }
.btn-review-like.liked .heart { transform: scale(1.2); }
/* 댓글 */
.review-comments { padding: 24px 0; border-top: 1px solid #e0e0e0; }
.review-comments h4 { font-size: 20px; font-weight: 700; margin-bottom: 16px; color: #222; }
.review-comments .comment-avatar { background: #2255cc; color: #fff; }
.review-comments .comment-meta { gap: 10px; }
.review-comments .comment-text { line-height: 1.6; word-break: break-all; }
.review-comments .comment-delete {
    font-size: 12px; text-decoration: none; margin-left: auto; flex-shrink: 0; align-self: flex-start; padding: 0;
}
.review-comments .comment-delete:hover { color: #e33; }
.review-comments .comment-form { margin-top: 20px; background: #f9f9f9; border-radius: 8px; padding: 16px; border: none; }
.review-comments .comment-form textarea { border: 1px solid #ddd; border-radius: 6px; padding: 10px 12px; }
.review-comments .comment-form textarea:focus { outline: none; border-color: #2255cc; }
.review-comments .comment-form-footer { margin-top: 8px; padding: 0; background: transparent; border-top: none; }
.review-comments .comment-form-footer .nickname-label { font-size: 13px; color: #888; }
.review-comments .comment-submit { background: #2255cc; padding: 8px 20px; font-size: 14px; }
.review-comments .comment-submit:hover { background: #1a44aa; }
.review-comments .comment-login-msg {
    background: #f9f9f9; border-radius: 8px; font-size: 14px; color: #888; margin-top: 16px; padding: 16px;
}
.review-comments .comment-login-msg a { color: #2255cc; }
.review-comments .comment-empty { padding: 20px 0; font-size: 16px; }


/* ──────────────────────────────────────────────────
   11. 여행후기 목록 (review/list)
   ────────────────────────────────────────────────── */
.review-wrap { display: flex; flex-direction: column; max-width: 1200px; margin: 30px auto; padding: 0 15px; }

/* 사이드바 → 항상 가로 탭 (talk-sidebar와 동일) */
.review-sidebar { width: 100%; }
.review-sidebar h3 { display: none; }
.review-filter { display: none; }
.review-sidebar ul { list-style: none; margin: 0 0 20px; padding: 0 0 30px; display: flex; width: 100%; text-align: left; border-bottom: 1px solid #ddd; justify-content: flex-start; flex-wrap: wrap; }
.review-sidebar ul::-webkit-scrollbar { display: none; }
.review-sidebar ul li { padding: 3px 14px; cursor: pointer; white-space: nowrap; }
.review-sidebar ul li a { display: inline; text-decoration: none; color: inherit; font-size: 16px; }
.review-sidebar ul li a.active { color: #35C5F0; font-weight: 700; }

/* 갤러리 */
.review-content { flex: 1; min-width: 0; }
.review-title-row { display: flex; align-items: center; margin: 30px 0 40px; }
.review-title-row h2 { font-size: 22px; font-weight: 700; margin: 0; flex: 1; }
.review-btn-write { padding: 8px 18px; background: #35C5F0; color: #fff; border-radius: 6px; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.review-btn-write:hover { background: #1db3de; color: #fff; }
.pc-only { display: inline-block; }
.review-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }

.review-card {
    border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.08);
    transition: transform .2s, box-shadow .2s; cursor: pointer; display: flex; flex-direction: column;
}
.review-card:hover { transform: translateY(-4px); box-shadow: 0 6px 20px rgba(0,0,0,.14); }
.review-thumb { position: relative; aspect-ratio: 5/3; overflow: hidden; background: #eee; }
.review-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block; transition: transform .3s; }
.review-card:hover .review-thumb img { transform: scale(1.05); }
.review-photo-badge {
    position: absolute; bottom: 8px; right: 8px; background: rgba(0,0,0,.55); color: #fff; font-size: 11px;
    padding: 2px 7px; border-radius: 20px;
}
.review-branch-badge {
    position: absolute; top: 10px; left: 10px; background: rgba(34,85,204,.85); color: #fff; font-size: 14px;
    padding: 4px 10px; border-radius: 20px;
}
.review-info { padding: 10px 12px 12px; }
.review-info .title {
    font-size: 18px; font-weight: 600; color: #222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    margin: 4px 0;
}
.review-meta { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 12px; color: #888; width: 100%; }
.review-meta-author-row { display: flex; align-items: center; margin-bottom: 4px; width: 100%; }
.review-stars-row { display: flex !important; flex-direction: row !important; align-items: center; justify-content: space-between; width: 100%; }
.review-card-stats { display: flex; align-items: center; gap: 15px; width: 100%; }
.review-card-stat-like { display: flex; align-items: center; gap: 4px; font-size: 13px; color: #94969b; }
.review-card-stat-comment { display: flex; align-items: center; gap: 4px; font-size: 13px; color: #94969b; }
.review-card-hit { display: flex; align-items: center; gap: 4px; font-size: 13px; color: #94969b; }
.review-card-author { display: flex; align-items: center; gap: 10px; }
.review-card-author-name { font-size: 14px; color: #666; font-weight: 600; line-height: 1; }
.review-card-date { font-size: 14px; color: #aaa; line-height: 1; }
.review-meta-row { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.review-meta-left { display: flex; gap: 6px; align-items: center; }
.review-meta-right { display: flex; gap: 4px; align-items: center; }
.review-stars { color: #f5a623; font-size: 16px; }
.review-empty { grid-column: 1 / -1; text-align: center; padding: 60px 0; color: #aaa; font-size: 15px; }
.review-hit { color: #aaa; font-size: 12px; }
.review-like { color: #e05252; font-size: 14px; margin-left: auto; }


/* ──────────────────────────────────────────────────
   12. 커뮤니티 홈 (community)
   ────────────────────────────────────────────────── */
/* ─── 커뮤니티 전체 ─── */
.cm-wrap { max-width: 1200px; margin: 0 auto; padding: 24px 15px 60px; }

/* ─── 상단 영역: 메인 배너 + BEST 사이드바 ─── */
.cm-hero { display: flex; gap: 24px; margin-bottom: 28px; }
.cm-hero-left { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cm-hero-card { position: relative; display: block; border-radius: 10px; overflow: hidden; height: 220px; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.08); text-decoration: none; color: inherit; }
.cm-hero-card > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cm-hero-card .cm-hero-overlay {
    position: absolute; bottom: 0; left: 0; right: 0; padding: 16px;
    background: linear-gradient(transparent, rgba(0,0,0,.65)); color: #fff;
}
.cm-hero-card .cm-hero-title { font-size: 15px; font-weight: 800; line-height: 1.3; margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.cm-hero-card .cm-hero-author { display: flex; align-items: center; gap: 6px; font-size: 12px; opacity: .9; }
.cm-hero-card .cm-hero-author img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
.cm-hero-badge { display: inline-block; background: rgba(32,178,214,.85); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; margin-bottom: 6px; }
.cm-best-mark { position: absolute; top: 10px; left: 10px; background: linear-gradient(135deg, #f5a623, #e8900c); color: #fff; font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 4px; letter-spacing: 1px; z-index: 2; box-shadow: 0 2px 6px rgba(0,0,0,.2); }

/* BEST 여행토크 사이드바 */
.cm-best { width: 280px; flex-shrink: 0; max-height: 468px; overflow: hidden; display: flex; flex-direction: column; }
.cm-best h3 { font-size: 16px; font-weight: 900; color: #222; margin-bottom: 8px; flex-shrink: 0; }
.cm-best-item { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f0f0f0; text-decoration: none; color: inherit; }
.cm-best-item:hover { background: #fafafa; }
.cm-best-item .cm-best-thumb { width: 52px; height: 52px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.cm-best-item .cm-best-info { flex: 1; min-width: 0; }
.cm-best-tag { display: inline-block; font-size: 14px; font-weight: 700; color: #20B2D6; margin-bottom: 2px; }
.cm-best-title {
    font-size: 16px; font-weight: 600; color: #333; line-height: 1.3; padding: 2px 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;
}
.cm-best-meta { display: flex; gap: 10px; margin-top: 2px; font-size: 12px; color: #aaa; }
.cm-best-meta span { display: flex; align-items: center; gap: 3px; }

/* ─── 이벤트 배너 ─── */
.cm-event-banner { margin-bottom: 20px; height: 170px; overflow: hidden; }
.cm-event-banner a { display: block; width: 100%; height: 100%; }
.cm-event-banner img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
@media (max-width: 768px) { .cm-event-banner { height: 120px; } }

/* ─── 주제별 섹션 ─── */
.cm-topic { margin-bottom: 36px; }
.cm-topic-title { font-size: 18px; font-weight: 900; color: #222; margin-bottom: 6px; }
.cm-topic-desc { font-size: 14px; color: #888; margin-bottom: 14px; }
.cm-topic-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.cm-wrap .cm-card {
    background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.06);
    transition: transform .15s, box-shadow .15s; cursor: pointer; text-decoration: none; color: inherit; border: none;
    margin-bottom: 0; display: block; min-width: 0;
}
.cm-wrap .cm-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,.1); }
.cm-card-thumb { position: relative; overflow: hidden; }
.cm-card-img { width: 100%; height: 180px; object-fit: cover; display: block; }
.cm-wrap .cm-card-body { padding: 12px 14px 14px; background: transparent; border-bottom: none; overflow: hidden; min-width: 0; }
.cm-card-author { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.cm-card-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; background: #e8e8e8; }
.cm-card-name { font-size: 14px; font-weight: 700; color: #333; }
.cm-card-badge { position: absolute; top: 10px; left: 10px; font-size: 12px; font-weight: 700; background: #20B2D6; color: #fff; border-radius: 10px; padding: 2px 8px; }
.cm-card-title {
    font-size: 16px; font-weight: 700; color: #222; line-height: 1.3; margin-bottom: 4px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    display: block; width: 100%; min-width: 0;
}
.cm-card-desc {
    font-size: 12px; color: #999; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; overflow: hidden;
}
.cm-card-stats { display: flex; gap: 10px; margin-top: 6px; font-size: 14px; color: #bbb; }
.cm-card-stats span { display: flex; align-items: center; gap: 3px; }


/* ──────────────────────────────────────────────────
   13. 나의여행후기 (my/reviews)
   ────────────────────────────────────────────────── */
.mr-title { font-size: 20px; font-weight: 800; color: #222; margin-bottom: 20px; }

/* 요약 배너 */
.mr-summary { display: flex; gap: 12px; margin-bottom: 24px; }
.mr-summary-card { flex: 1; padding: 16px; background: #fff; border: 1px solid #ebebeb; border-radius: 12px; text-align: center; }
.mr-summary-card.main-card { background: linear-gradient(135deg, #f0faff, #e8f7fe); border-color: #cce9f6; }
.mr-summary-label { font-size: 14px; color: #888; margin-bottom: 6px; }
.mr-summary-value { font-size: 22px; font-weight: 900; color: #222; }
.mr-summary-unit { font-size: 12px; font-weight: 500; color: #aaa; margin-left: 2px; }

/* 빈 상태 */
.mr-empty { text-align: center; padding: 80px 0; color: #bbb; }
.mr-empty-icon { font-size: 52px; margin-bottom: 14px; }
.mr-empty-link {
    display: inline-block; margin-top: 16px; padding: 10px 24px; background: #20B2D6; color: #fff; border-radius: 8px;
    font-size: 13px; font-weight: 700; text-decoration: none;
}
.mr-empty-link:hover { background: #29b5de; text-decoration: none; color: #fff; }

/* 카드 그리드 */
.mr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 28px; }

.mr-card {
    border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid #ebebeb;
    box-shadow: 0 2px 8px rgba(0,0,0,.06); text-decoration: none; color: inherit;
    transition: transform .18s, box-shadow .18s; display: block;
}
.mr-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,.11); text-decoration: none; color: inherit; }

/* 썸네일 */
.mr-thumb { position: relative; padding-top: 68%; overflow: hidden; background: #f0f0f0; }
.mr-thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.mr-card:hover .mr-thumb img { transform: scale(1.05); }
.mr-thumb-empty {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center;
    justify-content: center; font-size: 32px; color: #ccc; background: #f5f5f5;
}
.mr-branch-badge {
    position: absolute; top: 8px; left: 8px; background: rgba(34,85,204,.82); color: #fff; font-size: 11px;
    padding: 2px 8px; border-radius: 20px;
}
.mr-status-badge {
    position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,.55); color: #fff; font-size: 11px;
    padding: 2px 8px; border-radius: 20px;
}

/* 정보 */
.mr-info { padding: 10px 12px 14px; }
.mr-info-title {
    font-size: 14px; font-weight: 700; color: #222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    margin-bottom: 4px;
}
.mr-stars { color: #f5a623; font-size: 13px; margin-bottom: 6px; }

/* ★ 핵심: 좋아요 / 댓글 수 강조 */
.mr-stats { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.mr-stat-like { font-size: 14px; font-weight: 800; color: #e05252; }
.mr-stat-comment { font-size: 14px; font-weight: 800; color: #20B2D6; }

.mr-meta { display: flex; align-items: center; gap: 8px; font-size: 11px; color: #aaa; }

/* 페이지네이션 — 공통 .my-paging */
.my-paging { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 28px; padding: 14px 0; }
.my-pg-arrow {
    display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%;
    border: 1px solid #e0e0e0; background: #fff; color: #888; text-decoration: none; transition: all .15s;
}
.my-pg-arrow:hover { border-color: #20B2D6; color: #20B2D6; background: #f0faff; text-decoration: none; }
.my-pg-arrow.disabled { opacity: .3; pointer-events: none; }
.my-pg-nums { display: flex; align-items: center; gap: 2px; }
.my-pg-num {
    display: flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; border-radius: 10px;
    font-size: 13px; font-weight: 600; color: #888; text-decoration: none; transition: all .15s;
}
.my-pg-num:hover { background: #f0faff; color: #20B2D6; text-decoration: none; }
.my-pg-num.active { background: #20B2D6; color: #fff; font-weight: 800; box-shadow: 0 2px 8px rgba(53,197,240,.3); }
.my-pg-info { font-size: 12px; color: #bbb; margin-left: 8px; }


/* ──────────────────────────────────────────────────
   14. 나의여행토크 (my/talks)
   ────────────────────────────────────────────────── */
.mt-title { font-size: 20px; font-weight: 800; color: #222; margin-bottom: 20px; }

/* 요약 배너 */
.mt-summary { display: flex; gap: 12px; margin-bottom: 24px; }
.mt-summary-card { flex: 1; padding: 16px; background: #fff; border: 1px solid #ebebeb; border-radius: 12px; text-align: center; }
.mt-summary-card.main-card { background: linear-gradient(135deg, #f0faff, #e8f7fe); border-color: #cce9f6; }
.mt-summary-label { font-size: 12px; color: #888; margin-bottom: 6px; }
.mt-summary-value { font-size: 22px; font-weight: 900; color: #222; }
.mt-summary-unit { font-size: 12px; font-weight: 500; color: #aaa; margin-left: 2px; }

/* 빈 상태 */
.mt-empty { text-align: center; padding: 80px 0; color: #bbb; }
.mt-empty-icon { font-size: 52px; margin-bottom: 14px; }
.mt-empty-link {
    display: inline-block; margin-top: 16px; padding: 10px 24px; background: #20B2D6; color: #fff; border-radius: 8px;
    font-size: 13px; font-weight: 700; text-decoration: none;
}
.mt-empty-link:hover { background: #29b5de; text-decoration: none; color: #fff; }

/* 토크 리스트 */
.mt-list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 28px; }

.mt-item {
    display: flex; align-items: stretch; gap: 0; background: #fff; border: 1px solid #ebebeb; border-radius: 12px;
    overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .18s, transform .18s;
}
.mt-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.09); transform: translateY(-2px); text-decoration: none; color: inherit; }

/* 좌측: 좋아요 박스 */
.mt-vote {
    display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 72px;
    padding: 16px 12px; background: #fef5f5; border-right: 1px solid #f5e0e0; flex-shrink: 0;
}
.mt-vote-count { font-size: 22px; font-weight: 900; color: #e05252; line-height: 1; }
.mt-vote-label { font-size: 10px; color: #e05252; margin-top: 4px; font-weight: 600; }

/* 중앙: 콘텐츠 */
.mt-item-body { flex: 1; padding: 14px 16px; min-width: 0; }
.mt-item-top { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.mt-branch-tag { font-size: 11px; color: #20B2D6; font-weight: 700; background: #f0faff; padding: 1px 6px; border-radius: 4px; }
.mt-status-badge { font-size: 10px; color: #fff; background: rgba(0,0,0,.5); padding: 1px 6px; border-radius: 4px; }
.mt-item-title {
    font-size: 15px; font-weight: 700; color: #222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    margin-bottom: 4px;
}
.mt-item-desc {
    font-size: 13px; color: #777; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 8px;
}
.mt-item-meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #aaa; }
.mt-meta-comment { font-weight: 800; color: #20B2D6; }
.mt-meta-view { color: #aaa; }
.mt-meta-date { color: #bbb; }

/* 우측: 썸네일 */
.mt-item-thumb { width: 100px; flex-shrink: 0; overflow: hidden; }
.mt-item-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.mt-item:hover .mt-item-thumb img { transform: scale(1.05); }




/* ══════════════════════════════════════════════════
   16. 출석체크 (attendance)
   ══════════════════════════════════════════════════ */

/* ── 이벤트 배너 ── */
.att-banner { max-width: 780px; margin: 0 auto; padding: 0 px; }
.att-banner img { display: block; width: 100%; height: auto; object-fit: cover; }

/* ── 전체 래퍼 ── */
.att-wrap { max-width: 780px; margin: 0 auto; padding: 32px 24px 60px; }

/* ── 헤더 ── */
.att-header { text-align: center; margin-bottom: 28px; }
.att-header h2 { display: none; }
.att-header p { font-size: 18px; color: #888; margin: 0; }
.att-header p strong { color: #20B2D6; font-weight: 800; font-size: 20px;}

/* ── 통계 카드 ── */
.att-stats { display: flex; gap: 10px; margin-bottom: 24px; }
.att-stat-card { flex: 1; text-align: center; background: #f8fafb; border: 1px solid #eef2f5; border-radius: 14px; padding: 22px 12px; }
.att-stat-card.att-stat-point { background: linear-gradient(135deg, #e8f7fe, #f0faff); border-color: #d0ecf8; }
.att-stat-num { display: block; font-size: 24px; font-weight: 900; color: #222; line-height: 1.2; }
.att-stat-point .att-stat-num { color: #20B2D6; }
.att-stat-label { display: block; font-size: 14px; color: #999; margin-top: 6px; font-weight: 600; }

/* ── 달력 ── */
.att-calendar {
    background: #fff; border: 1px solid #eef2f5; border-radius: 16px; padding: 28px 24px; margin-bottom: 28px;
    box-shadow: 0 2px 12px rgba(0,0,0,.04);
}

/* 월 네비 */
.att-cal-nav { display: flex; align-items: center; justify-content: center; gap: 20px; margin-bottom: 16px; }
.att-cal-arrow {
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%;
    font-size: 22px; color: #999; text-decoration: none; transition: all .15s; background: #f5f7f9;
}
.att-cal-arrow:hover { background: #20B2D6; color: #fff; text-decoration: none; }
.att-cal-title { font-size: 22px; font-weight: 800; color: #222; min-width: 140px; text-align: center; }

/* 요일 헤더 + 날짜 그리드 공통 */
.att-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.att-cal-weekdays { margin-bottom: 8px; }
.att-cal-weekdays span { text-align: center; font-size: 14px; font-weight: 700; color: #aaa; padding: 6px 0; }
.att-cal-sun { color: #e05252 !important; }
.att-cal-sat { color: #4a7edd !important; }

/* 날짜 칸 */
.att-day {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 76px; border-radius: 12px; background: #fafbfc; transition: background .15s;
}
.att-day-empty { background: transparent; }
.att-day-num { font-size: 16px; font-weight: 600; color: #555; }
.att-day-future { opacity: .4; }
.att-day-future .att-day-num { color: #ccc; }

/* 오늘 */
.att-day-today { background: #fff; border: 2px solid #20B2D6; }
.att-day-today .att-day-num { color: #20B2D6; font-weight: 800; }

/* 출석 완료 */
.att-day-checked { background: transparent; border: none; }
.att-day-checked .att-day-num { color: #555; font-weight: 600; }
.att-day-stamp-img {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px;
    object-fit: contain; pointer-events: none; z-index: 2;
}

/* 출석 버튼 */
.att-check-btn {
    display: inline-block; padding: 4px 14px; font-size: 13px; font-weight: 800; color: #fff; background: #20B2D6;
    border: none; border-radius: 10px; cursor: pointer; transition: all .15s; margin-top: 2px;
    animation: att-pulse 1.5s infinite;
}
.att-check-btn:hover { background: #29b5de; transform: scale(1.05); }
@keyframes att-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(53,197,240,.4); }
    50% { box-shadow: 0 0 0 6px rgba(53,197,240,0); }
}

/* ── 안내사항 ── */
.att-info { background: #f8fafb; border: 1px solid #eef2f5; border-radius: 12px; padding: 18px 20px; }
.att-info-title { font-size: 14px; font-weight: 800; color: #555; margin-bottom: 10px; }
.att-info ul { list-style: none; margin: 0; padding: 0; }
.att-info li { position: relative; font-size: 14px; color: #888; padding-left: 14px; margin-bottom: 6px; line-height: 1.6; }
.att-info li::before { content: "•"; position: absolute; left: 0; color: #ccc; }
.att-info li strong { color: #20B2D6; font-weight: 700; }

/* ── 축하 팝업 ── */
.att-popup-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 9999; display: flex; align-items: center;
    justify-content: center;
}
.att-popup {
    background: #fff; border-radius: 20px; padding: 36px 32px 28px; text-align: center; max-width: 300px; width: 90%;
    box-shadow: 0 20px 60px rgba(0,0,0,.15); animation: att-popIn .3s ease-out;
}
@keyframes att-popIn {
    from { opacity: 0; transform: scale(.85) translateY(20px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}
.att-popup-icon { font-size: 48px; margin-bottom: 12px; }
.att-popup-title { font-size: 20px; font-weight: 900; color: #222; margin-bottom: 8px; }
.att-popup-msg { font-size: 15px; color: #666; margin-bottom: 24px; }
.att-popup-msg strong { color: #20B2D6; font-weight: 800; }
.att-popup-btn {
    display: inline-block; padding: 10px 40px; font-size: 15px; font-weight: 700; color: #fff; background: #20B2D6;
    border: none; border-radius: 12px; cursor: pointer; transition: background .15s;
}
.att-popup-btn:hover { background: #29b5de; }


/* ──────────────────────────────────────────────────
   베스트리뷰 공개 페이지 (/best/review)
   ────────────────────────────────────────────────── */

/* 배너 */
.best-banner { max-width: 1200px; margin: 0 auto; padding: 0; }
.best-banner img { width: 100%; display: block; }

/* 월 네비게이션 */
.best-month-nav {
    max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 20px;
    padding: 32px 15px 24px;
}
.best-month-title { font-size: 24px; font-weight: 800; color: #222; margin: 0; white-space: nowrap; }
.best-nav-btn {
    display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid #ddd; color: #333; background: #fff; text-decoration: none; transition: all .2s; cursor: pointer;
    flex-shrink: 0;
}
.best-nav-btn:hover { background: #222; color: #fff; border-color: #222; }
.best-nav-btn.disabled { color: #ccc; border-color: #eee; cursor: default; pointer-events: none; }

/* 갤러리 래퍼 */
.best-review-wrap { max-width: 1200px; margin: 0 auto; padding: 0 15px 60px; overflow: hidden; }
.best-review-wrap .review-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* 작성자 표시 */
.review-author { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 12px; color: #888; }
.review-author-name { font-weight: 600; color: #555; }
.review-product { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #aaa; font-size: 11px; }



/* 페이지네이션 — 공통 .my-paging 사용 */




/* ══════════════════════════════════════════════════
   공통 반응형 (Common Responsive)
   ══════════════════════════════════════════════════ */


/* ====================================
   반응형: 1000px 이하 (모바일 공통)
   ==================================== */
@media (max-width: 1000px) {

    /* --- 공통 --- */
    .container {padding:0 12px;}
    .contents_basic { margin: 20px auto; width:100%; min-height: 300px;}
    .grid {grid-template-columns:repeat(2,1fr);gap:12px;}
    .main-banner img {object-fit:cover;}
    .card-title {font-size:16px;}
    .event-list {grid-template-columns:repeat(2,1fr);}
    .footer {grid-template-columns:repeat(2,1fr);}
    #container { width: 100%; padding: 0; }
    .footer { width: 100%; padding: 30px 20px; }
    .estimation-list { width: 100%; }

    /* --- 13. 커뮤니티 홈 태블릿 --- */
    .cm-topic-grid { grid-template-columns: repeat(2, 1fr); }
    .talk-content { width: 100%;}

        /* --- 날씨/환율 태블릿 세로 배치 --- */
    .info-row { flex-direction: column; margin: 0 auto; padding: 12px 16px; }
    .info-banner { flex: none; width: 100%; }
    .info-cards { flex: none; width: 100%; flex-direction: row; }
    .info-card:last-child { margin-left: 10px; margin-top: 0; }
    .branch-cat-filter { padding-left: 16px; }

    /* --- 헤더: 1000px 이하에서도 PC와 동일하게 유지 --- */

    /* --- 배너: 모바일에서 정상 표시 --- */
    .main-banner-wrap { padding: 12px 0 12px; }
    .main-banner { height: auto; border-radius: 0; }
    .main-banner .swiper-slide { height: auto; border-radius: 0; opacity: 1; transform: scale(1); }
    .main-bn-prev, .main-bn-next { width: 30px; height: 30px; font-size: 18px; }
    .main-bn-counter { font-size: 13px; padding: 0 10px; height: 30px; }
    .main-banner .swiper-slide img { object-fit: cover;}
    /* --- Destinations 헤더 모바일 --- */
    .reveal { padding: 50px 10px 0;}
    .main-theme-head { margin-bottom: 8px; padding: 0 5px; }

    /* --- 탭: 모바일 전용 스타일 --- */
    .tab-location { padding: 0; }
    .tab-location li { padding: 8px 12px; font-size: 16px; }

    /* --- 지점 카드: 모바일 Swiper 터치 스와이프 --- */
    .branch-list { padding:8px 5px; overflow: hidden; }
    .branch-list .swiper-wrapper { width: auto; }
    .branch-list .swiper-slide { width: 160px; height: 155px; border-radius: 10px; overflow: hidden; }
    .branch-list .swiper-slide:last-child { margin-right: 0 !important; }
    .branch-list .thumb img { height: 155px; object-fit: cover; }
    .branch-list .title { font-size: 15px; font-weight: 700; }
    .branch-list .country { font-size: 11px; height: auto; }

    /* --- 견적현황 섹션 --- */
    .estimation-section { padding: 20px 0 0; background: #fff; }
    .estimation-inner { flex-direction: column-reverse; gap: 0; padding: 0; }
    .estimation-table-wrap { width: 100%; padding: 16px 12px; box-shadow: none; border-radius: 0; border-top: 1px solid #eee; }
    .estimation-table th:nth-child(2),
    .estimation-table td:nth-child(2) { display: none; }
    .estimation-table th { font-size: 13px; padding: 8px 6px; }
    .estimation-table td { font-size: 13px; padding: 8px 6px; }
    .estimation-cta { flex: none; width: 100%; padding: 24px 12px; background: #f0f4f8; box-sizing: border-box; }
    .estimation-cta .cta-sub { font-size: 13px; }
    .estimation-cta .cta-title { font-size: 20px; margin-bottom: 16px; }
    .cta-select { font-size: 14px; }
    .cta-btns { gap: 8px; }
    .btn-kakao, .btn-estimate { font-size: 14px; padding: 13px 0; }

    /* --- 이벤트 / 공지사항 --- */
    .notice-area { flex-direction: column; margin: 0; padding: 12px; gap: 12px; max-width: 100%; }
    .notice-area .box { width: 100%; border-radius: 10px; padding: 16px; }
    .notice-area .box h3,
    .notice-area .box .title { font-size: 16px; }
    .notice-area ul li { font-size: 13px; }

    /* --- 푸터 --- */
    footer { padding: 0;  }
    .footer { flex-direction: column; width: 100%; padding: 30px 16px 30px; gap: 0; }
    .footer .support { padding: 0 0 16px; border-right: none; border-bottom: 1px solid #E4E4E4; }
    .footer .nav { width: 100%; border-right: none; border-bottom: 1px solid #E4E4E4; padding: 14px 0; }
    .footer .nav .list { padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
    .footer .nav .list li { padding-bottom: 8px; width: 50%; font-size: 12px; }
    .footer .corp { padding: 14px 0 0; font-size: 12px; }
    .footer .corp .cont { line-height: 1.8em; }
    .footer .corp .banner { padding: 12px 0; }
    .footer .corp .banner img { width: 72px; }

    /* --- 게시판 --- */
    .board_container { flex-direction: column; width: 100%; padding: 0 12px 40px; min-height: auto; }
    .board_container .board_nav { width: 100%; margin-bottom: 0; }
    .board_container .board_nav h2 { display: none; }
    .board_nav .list {
        display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
        width: 100%; padding: 8px 0; gap: 0; border-bottom: 2px solid #eee;
    }
    .board_nav .list::-webkit-scrollbar { display: none; }
    .board_nav .list li { flex-shrink: 0; border-bottom: none; }
    .board_nav .list li > a { padding: 8px 16px; font-size: 14px; white-space: nowrap; border-radius: 20px; color: #666; }
    .board_nav .list li > a:hover { background: #f0f7ff; color: #0EADDD; }
    .board_nav .list li a.active { background: #0EADDD; color: #fff; font-weight: 700; }

    .board_container .contents { width: 100%; }
    .board_container .board_top { flex-direction: column; gap: 10px; padding: 16px 0 10px; }
    .board_container .board_top h3 { font-size: 17px; }
    .board_container .board_top .search { width: 100%; }
    .board_container .board_top .search form { width: 100%; }
    .board_container .board_top .search .input-search { width: 100%; font-size: 13px; }

    /* 지점 필터: 가로 스크롤 */
    .branch_filter {
        display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
        gap: 6px; padding-bottom: 4px;
    }
    .branch_filter::-webkit-scrollbar { display: none; }
    .branch_filter a { flex-shrink: 0; white-space: nowrap; font-size: 12px; padding: 5px 12px !important; }

    /* 테이블형 게시판: 카드 리스트 */
    .board_container .table_list { border-top: 2px solid #333; }
    .board_container .table_list tr:first-child { display: none; }
    .board_container .table_list tr {
        display: flex; flex-wrap: wrap; align-items: center; padding: 12px 4px; border-bottom: 1px solid #f0f0f0;
    }
    .board_container .table_list td { border-bottom: none; padding: 0; text-align: left; }
    /* 제목: 항상 첫째 줄 전체 폭 */
    .board_container .table_list td:first-child {
        width: 100%; order: 1; font-size: 14px; font-weight: 600; line-height: 1.5; padding-bottom: 6px;
    }
    .board_container .table_list td:first-child a { color: #333; }
    /* 마지막 셀 = 날짜: 오른쪽 정렬 */
    .board_container .table_list td:last-child { order: 10; font-size: 11px; color: #bbb; margin-left: auto; }
    /* 중간 셀들: 작은 메타 텍스트 */
    .board_container .table_list td:not(:first-child):not(:last-child) { order: 2; font-size: 12px; color: #999; margin-right: 10px; }
    .board_container .table_list td:not(:first-child):not(:last-child) a { color: #0EADDD; font-size: 12px; }

    /* 페이지네이션 */
    .pagination { display: flex; justify-content: center; flex-wrap: nowrap; gap: 30px; overflow: visible; }
    .pagination .page-item .page-link { font-size: 11px; padding: 5px 7px; }

    /* news 검색바 */
    .news-search-bar { width: 100%; }
    .news-search-bar form { width: 100%; }
    .news-search-bar input { width: 100% !important; flex: 1; font-size: 13px; }

    /* 게시판 상세보기 */
    .board_title { padding: 20px 0 10px !important; font-size: 16px !important; }
    .board_view { padding: 16px 0; font-size: 14px; line-height: 1.8; word-break: break-word; }
    .board_view img { max-width: 100% !important; height: auto !important; }
    .board_answer { padding: 16px !important; }
    .btn_area { padding: 16px 0; }
    .btn_area .btn { font-size: 16px; padding: 11px 20px; }

    /* --- 1. 상품 상세 --- */
    .product_image { width: 100% !important; height: auto; }
    .product_image img { height: 320px; }
    .view_container {
        width: 100% !important; min-width: unset !important; flex-direction: column; padding: 0 16px;
        box-sizing: border-box;
    }
    .view_container .detail { width: 100%; }
    .view_container .detail img { max-width: 100%; }
    .view_container .price_area { width: 100%; padding-left: 0; margin-top: 24px; }
    .view_container .people { position: static; }
    .view_container .tab { position: sticky; top: 56px; z-index: 10; }
    .view_container .tab ul {
        display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; white-space: nowrap;
    }
    .view_container .tab ul::-webkit-scrollbar { display: none; }
    .view_container .tab li { display: block; flex-shrink: 0; width: auto; padding: 12px 16px; font-size: 14px; }
    .view_container .point .list { flex-direction: column; gap: 6px; }
    .view_container .point .list li { width: 100%; }
    .view_container .blog .list { flex-direction: row; flex-wrap: wrap; gap: 4%; }
    .view_container .blog .list li { width: 48%; }
    .view_container .blog .list .thumb img { height: 180px; }
    .view_container .schedule .box { height: auto; min-height: 60px; }
    .view_container .schedule .day { width: 60px; font-size: 13px; }
    .view_container .schedule .tour_name { font-size: 15px; }

    /* --- 5. 결제 --- */
    .co-grid { grid-template-columns: 1fr; }
    .co-wrap { padding: 0 12px; margin: 24px auto; }
    .co-wrap > h2 { font-size: 20px; }
    .co-panel { position: static; }
    .co-section-head { padding: 12px 14px; font-size: 14px; }
    .co-section-body { padding: 14px; }
    .tour-card { flex-direction: row; flex-wrap: wrap; gap: 10px; }
    .tour-drag-handle { position: absolute; top: 14px; right: 8px; width: auto; font-size: 20px; }
    .tour-thumb, .tour-thumb-none { width: 100%; height: 140px; }
    .tour-schedule-row { width: 100%; }
    .schedule-row { flex-direction: column; align-items: flex-start; gap: 6px; }
    .schedule-date, .schedule-flight { width: 100%; box-sizing: border-box; }
    .hotel-grade-list { gap: 8px; }
    .hotel-grade-item { padding: 8px 12px; font-size: 13px; }
    .mr-grid { grid-template-columns: repeat(2, 1fr); }

    /* --- 여행토크 탭 태블릿: 2줄 줄바꿈 --- */
    .talk-sidebar ul { flex-wrap: wrap !important; overflow-x: visible; }
    .talk-sidebar ul li { flex-shrink: 0; padding: 3px 2px; }
    .talk-sidebar ul li a { padding: 5px 10px; font-size: 16px; }

    /* --- 상품 그리드 (1000px 이하 1컬럼) --- */
    .products { flex-direction: column; gap: 0; padding: 0 0 60px; max-width: 100% !important; }
    .product_item { display: block !important; width: 100% !important; margin-right: 0; margin-top: 0; border-bottom: 1px solid #f0f0f0; padding: 16px; }
    .product_item .thumb { display: block !important; width: 100% !important; height: 220px; }
    .product_item .thumb img { height: 220px !important; border-radius: 8px; }
    .product_item .contents { display: block !important; padding-left: 0 !important; margin-top: 10px; position: static !important; }
    .product_item .contents .name { font-size: 18px; }
    .product_item .contents .intro { font-size: 14px; margin-top: 4px; color: #666; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .product_item .contents .price { position: static !important; margin-top: 8px; text-align: right; }
    .product_item .contents .price .tit { font-size: 18px; }
    .product_item .contents .price .number { font-size: 18px; }
    .product-tags { margin-top: 4px; }
    .product-tag { font-size: 14px; padding: 1px 8px; }
}
@media (min-width: 700px) {
    .view_container .point .list { flex-direction: row !important; flex-wrap: wrap !important; gap: 6px; }
    .view_container .point .list li { width: calc(50% - 3px) !important; }
}
/* ====================================
   반응형: 991px 이하 (헤더 공통)
   ==================================== */
@media (max-width: 991px) {
    #nav .container { justify-content: space-between; align-items: center; flex-wrap: nowrap; }
    #nav .top-right { flex-shrink: 0; margin-left: auto; display: flex; align-items: center; }
    #nav .navbar-collapse { display: none !important; }
    #nav .navbar-right { display: flex !important; flex-direction: row !important; align-items: center; flex-wrap: nowrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
    #nav .navbar-right > li { display: flex; align-items: center; }
    #nav .navbar-right .nav-link { padding: 0; display: flex; align-items: center; }
    #nav .navbar-right .hd-user-btn { padding: 3px; border: none; background: none; gap: 0; }
    #nav .navbar-right .hd-user-btn::after { display: none; }
    #nav .navbar-right .hd-user-name { display: none; }
    #nav .navbar-right .hd-dropdown { right: 0; left: auto; transform: none; }
    #nav .navbar-toggler { display: none !important; }
}
@media (max-width: 530px) {
    .review-grid { grid-template-columns: 1fr !important; }
}
/* ====================================
   반응형: 640px 이하
   ==================================== */
@media (max-width: 640px) {
    .pagination { gap: 20px !important; }
    /* --- 여행토크 탭 모바일: 가로 스크롤 --- */
    .talk-sidebar ul { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; touch-action: pan-x; user-select: none; }
    .talk-sidebar ul li { flex-shrink: 0; }

    /* --- 헤더 --- */
    #nav .container { height: 50px; padding: 0 12px; justify-content: space-between; align-items: center; flex-wrap: nowrap; }
    #nav .top-left { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
    #nav .top-left h1 img { content: url('../images/main/logo.png'); width: 35px !important; margin-top: 3px;}
    #nav .top-left .menu { font-size: 16px; white-space: nowrap; }
    #nav .btn-branch { font-size: 15px; white-space: nowrap; margin-left: 0; }
    #nav .top-right { flex-shrink: 0; margin-left: auto; display: flex; align-items: center; }
    #nav form.d-flex { display: none !important; }
    #nav .navbar-collapse { display: none !important; }
    #nav .navbar-right { display: flex !important; flex-direction: row !important; align-items: center; flex-wrap: nowrap; gap: 6px; list-style: none; margin: 0; padding: 0; position: relative; }
    #nav .navbar-right > li { display: flex; align-items: center; }
    #nav .navbar-right .nav-link { padding: 0; display: flex; align-items: center; }
    #nav .navbar-right .ico-cart { font-size: 18px; }
    #nav .navbar-right .cart-num { font-size: 10px; }
    #nav .navbar-right .hd-user-btn { padding: 3px; border: none; background: none; gap: 0; }
    #nav .navbar-right .hd-user-btn::after { display: none; }
    #nav .navbar-right .hd-user-avatar { width: 28px; height: 28px; font-size: 12px; }
    #nav .navbar-right .hd-user-name { display: none; }
    #nav .navbar-right .hd-login-btn { font-size: 12px; padding: 4px 12px !important; }
    #nav .navbar-right .hd-dropdown { right: 0; left: auto; transform: none; position: absolute; top: 100%; }
    #nav .navbar-toggler { display: none !important; }

    .grid {grid-template-columns:1fr;}
    .event-list {grid-template-columns:1fr;}
    .footer {grid-template-columns:1fr;}
    .box-head h3 {font-size:16px;}
    .more-btn {font-size:13px;}

    /* --- 지점 메인 --- */
    #branch-all { top: 47px; }
    #branch-all .list { margin: 0 auto; padding:10px 0 20px 20px; width:100%; background:rgba(255,255,255,0.9); border-bottom-left-radius:8px; border-bottom-right-radius: 8px;  }
    #branch-all .list a{position: relative;  padding:13px 10px 0; border-radius:8px; font-size: 14px; }
    #branch-all .list a:not(:last-child)::after {content: "|";position: absolute; padding-left: 8px; color:#333333;}
    #branch-all .list .country { display: block; padding: 14px 0; width: 85px;  font-size: 15px; margin-right: 10px;}

    /* --- 관심지점 버튼 --- */
    .btn-branch-fav { font-size: 12px; padding: 6px 14px; margin-top: 10px; }
    .btn-branch-fav .fav-icon { font-size: 15px; }

    /* --- 지점 상단 히어로 영역 --- */
    .branch-top { width: 100% !important; flex-direction: column; padding: 24px 16px 0; }
    .branch-top .title { width: 100% !important; padding: 0 0 16px !important; }
    .branch-top .title h2 { font-size: 22px; margin: 6px 0; }
    .branch-top .title .cont { font-size: 13px; line-height: 1.6; margin-top: 8px; }
    .branch-top .thumb { display: none; padding: 12px 0 0 !important; }
    .branch-top .thumb img { width: 100% !important; height: 200px !important; }

    /* --- 상품 그리드 --- */
    .products { flex-direction: column; gap: 0; padding: 0 0 60px; max-width: 100% !important; }
    .product_item {
        display: block !important; /* table → block */; width: 100% !important; margin-top: 0;
        border-bottom: 1px solid #f0f0f0; padding: 16px;
    }
    .product_item .thumb { display: block !important;   /* table-cell → block */ width: 100% !important; height: 220px; }
    .product_item .thumb img { height: 220px !important; border-radius: 8px; }

    .product_item .contents {
        display: block !important; /* table-cell → block */; padding-left: 0 !important; margin-top: 10px;
        position: static !important;
    }
    .product_item .contents .name { font-size: 18px; }
    .product_item .contents .intro { font-size: 16px; margin-top: 4px; color: #666; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .product_item .contents .price { position: static !important; margin-top: 8px; text-align: right; }
    .product_item .contents .price .tit { font-size: 15px; }
    .product_item .contents .price .number { font-size: 16px; }
    .product-tags { margin-top: 4px; }
    .product-tag { font-size: 14px; padding: 1px 8px; }

    /* --- 알림/소식 카드 (sub_news) --- */
    .products .sub_news { width: 100% !important; margin: 0; border-radius: 0 !important; border-left: none; border-right: none; }
    .products .sub_news .title { font-size: 16px; }
    .products .sub_news .list_thumb { flex-wrap: nowrap; overflow-x: auto; gap: 6px; padding-bottom: 4px; }
    .products .sub_news .list_thumb::-webkit-scrollbar { display: none; }
    .products .sub_news .list_thumb li { flex-shrink: 0; width: 130px; padding: 0 !important; }
    .products .sub_news .list_thumb .thumb { height: 110px !important; }
    .products .sub_news .list_thumb .thumb img { width: 130px; height: 110px; object-fit: cover; }
    .products .sub_news .list_thumb .tit { font-size: 11px; padding: 2px 4px; }

    /* --- 0. 사이드 네비 --- */
    .my-layout { flex-direction: column; }
    .my-layout .my-side { width: 100%; position: static; }
    .my-side-nav { display: flex; flex-wrap: wrap; border-radius: 10px; }
    .my-side-group-label { display: none; }
    .my-side-link { flex: 1; justify-content: center; min-width: 80px; padding: 10px 8px; font-size: 12px; border-left: none; border-bottom: 3px solid transparent; }
    .my-side-link.active { border-left: none; border-bottom-color: #20B2D6; }

    /* --- 2. 마이페이지 --- */
    .mp-profile-card { flex-direction: column; text-align: center; padding: 20px 16px; gap: 12px; }
    .mp-profile-info { display: flex; flex-direction: column; align-items: center; }
    .mp-point-banner { flex-direction: column; gap: 12px; text-align: center; padding: 16px; }
    .mp-point-left { flex-direction: column; gap: 6px; }
    .mp-point-val { font-size: 22px; }
    .mp-stats { gap: 8px; }
    .mp-stat-num { font-size: 20px; }
    .mp-stat-label { font-size: 10px; }
    .mp-section-head { padding: 12px 16px; font-size: 13px; }
    .mp-section-body { padding: 16px; }
    .mp-badge-grid { gap: 8px; }
    .mp-badge-item { padding: 10px 4px 8px; }
    .mp-badge-icon { font-size: 24px; }
    .mp-save-btn { width: 100%; }
    .my-layout .my-main { width: 100%; }
    .my-layout { flex-direction: column; }
    .my-layout .my-side { width: 100%; position: static; }
    .my-side-nav { display: flex; flex-wrap: wrap; border-radius: 10px; }
    .my-side-group-label { display: none; }
    .my-side-link { flex: 1; justify-content: center; min-width: 80px; padding: 10px 8px; font-size: 12px; border-left: none; border-bottom: 3px solid transparent; }
    .my-side-link.active { border-left: none; border-bottom-color: #35C5F0; }

    /* --- 3. 장바구니 --- */
    .cart-wrap { padding: 0 12px; margin: 24px auto; }
    .cart-wrap h2 { font-size: 20px; margin-bottom: 20px; }
    .guest-banner { flex-direction: column; text-align: center; padding: 12px 14px; font-size: 13px; }
    .location-header { flex-direction: column; gap: 4px; padding: 12px 14px; }
    .location-note { font-size: 11px; }
    .cart-item { flex-direction: column; padding: 14px; gap: 12px; }
    .cart-thumb { width: 100%; height: 160px; }
    .cart-thumb-none { width: 100%; height: 120px; }
    .cart-name { font-size: 15px; }
    .cart-persons { gap: 6px 14px; }
    .cart-remove { align-self: flex-end; margin-top: -40px; }
    .cart-total-bar { padding: 16px 14px; }

    /* --- 4. 나의 여행 --- */
    .or-main-title { font-size: 18px; }
    .or-card-head { flex-direction: column; align-items: flex-start; padding: 12px 14px; }
    .or-head-right { width: 100%; justify-content: space-between; }
    .or-card-body { padding: 14px; }
    .or-item { flex-direction: column; gap: 8px; }
    .or-item-price { text-align: left; display: flex; gap: 8px; align-items: center; }
    .or-card-foot { flex-direction: column; align-items: flex-start; padding: 12px 14px; gap: 10px; }
    .or-foot-right { width: 100%; display: flex; }
    .or-foot-right .or-btn { flex: 1; text-align: center; }
    .or-bank-inline .row { flex-direction: column; gap: 2px; }
    .or-bank-inline .lbl { min-width: unset; }
    .or-extra-row { flex-direction: column; gap: 2px; }
    .or-extra-lbl { min-width: unset; }

    /* --- 5. 결제 보완 --- */
    .person-grid { grid-template-columns: 1fr 1fr; }
    .info-grid { grid-template-columns: 1fr; }

    /* --- 6. 포인트 내역 --- */
    .pt-title { font-size: 18px; }
    .pt-summary { flex-direction: column; gap: 10px; }
    .pt-summary-card { min-width: unset; padding: 14px 16px; }
    .pt-summary-value { font-size: 18px; }
    .pt-log-header { padding: 12px 14px; }
    .pt-log-item { padding: 12px 14px; gap: 10px; }
    .pt-log-icon { width: 30px; height: 30px; font-size: 14px; border-radius: 8px; }
    .pt-log-reason { font-size: 12px; }
    .pt-log-pts { font-size: 14px; }
    .pt-log-balance { font-size: 10px; }

    /* --- 7. 내가 쓴 댓글 --- */
    .cm-title { font-size: 18px; }
    .cm-card-source { flex-wrap: wrap; padding: 8px 12px; gap: 6px; }
    .cm-source-title { white-space: normal; min-width: 0; }
    .cm-card-body { padding: 12px 14px; }
    .cm-body-text { font-size: 13px; }

    /* --- 7-1. 리뷰 글쓰기 --- */
    .rw-wrap { padding: 0 12px; margin: 20px auto; }
    .rw-wrap h2 { font-size: 20px; }
    .rw-section { padding: 20px 16px; }
    .rw-row { flex-direction: column; gap: 0; }
    .rw-col-3 { width: 100%; }
    .rw-star { font-size: 28px; }
    .rw-form-footer { flex-direction: column; }
    .rw-submit-btn { width: 100%; padding: 14px 0; }
    .rw-cancel-btn { width: 100%; text-align: center; padding: 12px 0; }

    /* --- 8. 여행토크 작성 --- */
    .talk-write-wrap { padding: 0 12px; margin: 20px auto; }
    .talk-write-wrap h2 { font-size: 18px; margin-bottom: 18px; }
    .talk-textarea { min-height: 200px; font-size: 14px; }
    .talk-photo-thumb { width: 80px; height: 80px; }
    .talk-form-footer { flex-direction: column; }
    .talk-submit-btn { width: 100%; padding: 14px 0; }
    .talk-cancel-btn { width: 100%; text-align: center; padding: 12px 0; }

    /* --- 9. 여행토크 상세 --- */
    .talk-view-wrap { padding: 0 12px; margin: 20px auto; }
    .talk-view-header h2 { font-size: 20px; }
    .talk-photos { grid-template-columns: repeat(2, 1fr); }
    .talk-view-meta { flex-direction: row; gap: 10px; align-items: center; flex-wrap: wrap; }
    .talk-view-actions { margin-left: 0; }
    .talk-view-body { font-size: 16px; }
    .talk-photos a:hover img { transform: none; }

    /* --- 10. 여행후기 상세 --- */
    .review-view-wrap { padding: 0 12px; margin: 20px auto; }
    .review-view-header h2 { font-size: 18px; }
    .review-view-meta { flex-direction: column; gap: 8px; align-items: flex-start; }
    .review-photos { grid-template-columns: repeat(2, 1fr); }
    .review-view-body { font-size: 14px; }
    .review-photos a:hover img { transform: none; }
    .btn-review-like { padding: 8px 20px; font-size: 14px; }

    /* --- 11. 여행토크 목록 --- */
    .talk-header-right { width: 100%; margin-left: 0; position: sticky; top: 0; z-index: 100; background: #fff; padding: 8px 0; flex-wrap: wrap; }
    .talk-sort-btn { flex-shrink: 0; }
    .talk-search { flex: 1; min-width: 100px; }

    /* --- 12. 여행후기 목록 --- */
    .review-sidebar ul { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; touch-action: pan-x; user-select: none; }
    .review-sidebar ul::-webkit-scrollbar { display: none; }
    .review-sidebar ul li { flex-shrink: 0; padding: 3px 2px; }
    .review-sidebar ul li a { padding: 5px 10px; font-size: 16px; }

    /* --- 13. 커뮤니티 홈 --- */
    .cm-hero { flex-direction: column; }
    .cm-hero-left { grid-template-columns: 1fr; }
    .cm-hero-card { height: 200px; }
    .cm-best { width: 100%; }
    .cm-topic-grid { grid-template-columns: repeat(2, 1fr); }
    .cm-tabs .cm-tab-right { display: none; }
    .cm-tabs .cm-tab-title { font-size: 18px; }
    .cm-event-banner { }
    .cm-event-banner .cm-event-title { font-size: 20px; }

    /* --- 14. 나의여행후기 --- */
    .mr-summary { flex-direction: column; }
    .mr-grid { grid-template-columns: 1fr; }
    .mr-stats { font-size: 13px; }

    /* --- 15. 나의여행토크 --- */
    .mt-summary { flex-direction: column; }
    .mt-vote { min-width: 56px; padding: 12px 8px; }
    .mt-vote-count { font-size: 18px; }
    .mt-item-thumb { width: 70px; }
    .mt-item-title { font-size: 14px; }
    .mt-item-desc { -webkit-line-clamp: 1; }

    /* --- 17. 베스트리뷰 --- */
    .best-banner { padding: 0; }
    .best-month-nav { gap: 12px; padding: 20px 12px 16px; }
    .best-month-title { font-size: 18px; }
    .best-nav-btn { width: 34px; height: 34px; }
    .best-nav-btn svg { width: 16px; height: 16px; }
    .best-review-wrap { padding: 0 12px 40px; }
    .best-review-wrap .review-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
}

/* ====================================
   반응형: 500px 이하 - 날씨/환율 세로 배치
   ==================================== */
@media (max-width: 800px) {
    .review-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px) {
    .info-cards { flex-direction: column; }
    .info-card:last-child { margin-left: 0; margin-top: 10px; }
}

/* ====================================
   반응형: 480px 이하 (소형 모바일) - 메인 공통
   ==================================== */
@media (max-width: 480px) {
    /* 메인 인덱스 */
    .main-banner { height: 230px; }
    .main-banner .swiper-slide { height: 230px; }
    .branch-list .swiper-slide { height: 130px; }
    .branch-list .thumb img { height: 130px; }
    .estimation-cta .cta-title { font-size: 18px; }
    .main-banner .swiper-slide img { object-fit: cover; border-radius: 10px;}
    /* 지점 메인 */
    .branch-top .thumb img { height: 160px !important; }
    .product_item .thumb { height: 220px; }
    .product_item .thumb img { height: 220px !important; }

    /* 게시판 */
    .board_nav .list li > a { font-size: 13px; padding: 7px 12px; }
    .board_container .board_top h3 { font-size: 15px; }
    .board_container .table_list td:nth-child(1) { font-size: 13px; }

    /* 1. 상품 상세 */
    .product_image img { height: 200px; }
    .view_container { padding: 0 12px; }
    .view_container .detail .tit h2 { font-size: 18px; }
    .view_container .detail .tit .intro { font-size: 14px; }
    .view_container h3 { font-size: 18px; }
    .view_container .tab li { padding: 10px 12px; font-size: 16px; }
    .pax-name { font-size: 14px; }
    .pax-counter .btn-minus,
    .pax-counter .btn-plus { width: 32px; height: 32px; font-size: 18px; }
    .view_container .blog .list .thumb img { height: 150px; }
    .view_container .schedule .tour_name { font-size: 14px; }
    .view_container .schedule .tour_name .summary { font-size: 13px; }

    /* 2. 마이페이지 */
    .mp-avatar { width: 50px; height: 50px; font-size: 22px; }
    .mp-name { font-size: 16px; }
    .mp-point-val { font-size: 20px; }
    .mp-stat-num { font-size: 18px; }
    .mp-stat-box { padding: 12px 8px; }
    .mp-badge-grid { grid-template-columns: repeat(auto-fill, minmax(75px, 1fr)); }
    .mp-badge-name { font-size: 10px; }

    /* 3. 장바구니 */
    .cart-thumb { height: 140px; }
    .cp-btn { width: 32px; height: 32px; font-size: 16px; }
    .btn-checkout { font-size: 15px; padding: 13px 0; }
    .cart-total-row { font-size: 13px; }
    .cart-total-row strong { font-size: 15px; }

    /* 4. 나의 여행 */
    .or-order-no { font-size: 13px; }
    .or-item-name { font-size: 13px; }
    .or-item-meta { font-size: 11px; }
    .or-item-deposit { font-size: 13px; }
    .or-badge { padding: 3px 10px; font-size: 11px; }
    .or-btn { padding: 8px 14px; font-size: 12px; }

    /* 5. 결제 */
    .person-grid { grid-template-columns: 1fr; }
    .p-btn { width: 36px; height: 36px; font-size: 18px; }
    .tp-btn { width: 28px; height: 28px; }
    .airport-list, .airline-list { gap: 8px 16px; }
    .airport-list span, .airline-list span { font-size: 13px; }
    .pay-method-list { flex-direction: column; }
    .pay-method-btn { padding: 12px 0; }
    .price-total .t-amount { font-size: 18px; }
    .btn-pay { font-size: 16px; padding: 16px 0; }
    .date-row { grid-template-columns: 1fr; gap: 8px; }
    .date-sep { display: none; }
    .bank-info-box .bank-row { flex-direction: column; gap: 2px; }
    .bank-info-box .bank-label { min-width: unset; }

    /* 6. 포인트 내역 */
    .pt-summary-value { font-size: 16px; }
    .pt-log-item { gap: 8px; }
    .pt-log-reason { white-space: normal; }

    /* 7. 내가 쓴 댓글 */
    .cm-card-source { font-size: 11px; }
    .cm-source-badge { font-size: 10px; padding: 2px 6px; }

    /* 7-1. 리뷰 글쓰기 */
    .rw-section-header { gap: 10px; }
    .rw-section-num { width: 28px; height: 28px; font-size: 13px; }
    .rw-section-title { font-size: 15px; }
    .rw-star { font-size: 26px; }


    /* 8. 여행토크 작성 */
    .talk-photo-thumb { width: 70px; height: 70px; }
    .talk-photo-area { padding: 16px; }

    /* 9. 여행토크 상세 */
    .talk-view-header h2 { font-size: 20px; }
    .talk-view-body { font-size: 16px; }
    .btn-talk-like { padding: 8px 20px; font-size: 14px; }

    /* 10. 여행후기 상세 */
    .review-view-header h2 { font-size: 16px; }
    .review-view-body { font-size: 13px; }

    /* 11. 여행토크 목록 */
    .talk-item-thumb { width: 60px; height: 60px; }
    .talk-vote-heart { font-size: 18px; }
    .talk-vote-count { font-size: 18px; }
    .talk-vote-comment { font-size: 18px; }

    /* 12. 여행후기 목록 */
    .review-grid { grid-template-columns: 1fr; }

    /* 13. 커뮤니티 홈 */
    .cm-topic-grid { grid-template-columns: 1fr; }

    /* 15. 나의여행토크 */
    .mt-item-thumb { display: none; }
    .mt-vote { min-width: 48px; }
    .mt-vote-count { font-size: 16px; }

    /* 16. 출석체크 */
    .att-banner { padding: 0px; }
    .att-banner img { border-radius: 0px; }
    .att-wrap { padding: 30px 12px 40px; }
    .att-header h2 { font-size: 22px; }
    .att-stats { gap: 6px; }
    .att-stat-card { padding: 12px 4px; border-radius: 10px; }
    .att-stat-num { font-size: 20px; }
    .att-stat-label { font-size: 11px; }
    .att-calendar { padding: 14px 10px; border-radius: 12px; }
    .att-cal-title { font-size: 18px; }
    .att-day { min-height: 44px; border-radius: 8px; }
    .att-day-num { font-size: 12px; }
    .att-day-stamp-img { width: 44px; height: 44px; }
    .att-check-btn { font-size: 10px; padding: 2px 8px; }
    .att-popup { padding: 28px 20px 22px; }
    .att-popup-icon { font-size: 40px; }
    .att-popup-title { font-size: 18px; }

    /* 17. 베스트리뷰 */
    .best-month-title { font-size: 16px; }
    .best-review-wrap .review-grid { grid-template-columns: 1fr; }
}