/*
 * 카지노핫썰 모바일 최종 보정
 * 기존 PC 디자인을 유지하면서 1열 배치, 터치 영역, 가로 넘침을 정리합니다.
 */
@media (max-width: 767px) {
    html,
    body {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }

    img,
    video,
    iframe {
        max-width: 100% !important;
        height: auto;
    }

    #wrapper,
    #container_wr,
    #container,
    .tanga-main-wrap,
    .tanga-main-inner,
    .tanga-content-inner {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    #container_wr,
    .tanga-main-inner,
    .tanga-content-inner {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* 상단 로고와 메뉴 */
    .tanga-header,
    .tanga-nav,
    .tanga-main-header,
    .tanga-main-nav {
        min-width: 0 !important;
    }

    .tanga-header-inner,
    .tanga-nav-inner,
    .tanga-main-header-inner,
    .tanga-main-nav-inner {
        width: 100% !important;
        min-width: 0 !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .tanga-logo img,
    .tanga-main-logo img,
    #logo img {
        width: auto !important;
        max-width: 210px !important;
        max-height: 62px !important;
        object-fit: contain;
    }

    .tanga-menu,
    .tanga-main-menu,
    #gnb_1dul {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        width: 100% !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .tanga-menu::-webkit-scrollbar,
    .tanga-main-menu::-webkit-scrollbar,
    #gnb_1dul::-webkit-scrollbar {
        display: none;
    }

    .tanga-menu > li,
    .tanga-main-menu > li,
    #gnb_1dul > li {
        flex: 0 0 auto !important;
    }

    .tanga-menu > li > a,
    .tanga-main-menu > li > a,
    #gnb_1dul > li > a {
        min-height: 48px !important;
        padding: 0 16px !important;
        color: #fff !important;
        font-size: 15px !important;
        line-height: 48px !important;
        white-space: nowrap !important;
    }

    .tanga-menu li.active > a,
    .tanga-menu li:hover > a,
    .tanga-main-menu li.active > a,
    .tanga-main-menu li:hover > a,
    #gnb_1dul li.gnb_on > a {
        color: #f0a20a !important;
    }

    .tanga-menu .submenu,
    .tanga-menu .sub-menu,
    .tanga-main-menu .submenu,
    .tanga-main-menu .sub-menu,
    #gnb_1dul .gnb_2dul {
        min-width: 180px !important;
        max-width: calc(100vw - 24px) !important;
        z-index: 9999 !important;
    }

    /* 메인 콘텐츠 */
    .tanga-main-official-wrap,
    .tanga-main-story-wrap,
    .tanga-main-news-wrap,
    .tanga-main-guide-wrap,
    .tanga-trust-section,
    .tanga-major-section,
    .tanga-safe-section,
    .tanga-faq-section {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .tanga-main-story-grid,
    .tanga-main-guide-grid,
    .tanga-major-grid,
    .tanga-safe-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .tanga-main-news-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .tanga-main-guide-hero,
    .tanga-major-hero,
    .tanga-safe-hero {
        min-height: 250px !important;
        height: auto !important;
        padding: 26px 18px !important;
        background-position: center !important;
        background-size: cover !important;
    }

    .tanga-main-guide-hero::before,
    .tanga-major-hero::before,
    .tanga-safe-hero::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        background: rgba(16, 16, 16, .34) !important;
        pointer-events: none;
    }

    .tanga-main-guide-hero > *,
    .tanga-major-hero > *,
    .tanga-safe-hero > * {
        position: relative !important;
        z-index: 1 !important;
    }

    .tanga-main-guide-item,
    .tanga-trust-item,
    .tanga-major-item,
    .tanga-safe-item {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 12px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .tanga-main-guide-item p,
    .tanga-trust-item p,
    .tanga-major-item p,
    .tanga-safe-item p {
        min-width: 0 !important;
        font-size: 15px !important;
        line-height: 1.65 !important;
        overflow-wrap: anywhere;
    }

    .tanga-main-guide-number,
    .tanga-trust-number,
    .tanga-major-number,
    .tanga-safe-number {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        background: #f0a20a !important;
        color: #111 !important;
    }

    .tanga-main-guide-title,
    .tanga-trust-title,
    .tanga-major-title,
    .tanga-safe-title {
        width: calc(100% - 12px) !important;
        max-width: 100% !important;
        padding: 16px 20px !important;
        font-size: 20px !important;
        line-height: 1.35 !important;
        border-radius: 0 30px 30px 0 !important;
    }

    /* 게시판과 오른쪽 메뉴: 모바일에서는 순서대로 전부 표시 */
    body.tanga-board-sidebar-on #container_wr,
    body.tanga-member-sidebar-on #container_wr {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 12px !important;
        gap: 14px !important;
    }

    body.tanga-board-sidebar-on #container,
    body.tanga-member-sidebar-on #container {
        order: 1;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 12px 0 0 !important;
    }

    body.tanga-board-sidebar-on .tanga-board-side-login,
    body.tanga-member-sidebar-on .tanga-board-side-login {
        order: 2;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        margin: 0 0 24px !important;
        overflow: visible !important;
    }

    .tanga-side-login-card,
    .tanga-side-panel,
    .tanga-side-rank-panel,
    .tanga-side-telegram-banner {
        width: 100% !important;
        max-width: 100% !important;
    }

    .tanga-side-extra-panels,
    .tanga-side-extra-panels-inner {
        display: block !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .tanga-side-panel,
    .tanga-side-rank-panel {
        margin-bottom: 14px !important;
    }

    .tanga-side-mini-link {
        grid-template-columns: auto minmax(0, 1fr) auto !important;
        gap: 8px !important;
    }

    .tanga-side-mini-subject {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    /* 회원가입 폼 */
    body.tanga-member-sidebar-on .register,
    body.tanga-member-sidebar-on #register_form,
    body.tanga-member-sidebar-on .register_form_inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.tanga-member-sidebar-on .register {
        padding: 18px 14px !important;
    }

    .casino-register-brand {
        margin: 0 auto 18px !important;
        text-align: center !important;
    }

    .casino-register-brand img {
        width: auto !important;
        max-width: 210px !important;
        max-height: 72px !important;
        object-fit: contain !important;
    }

    #register_form .register_form_inner {
        padding: 0 !important;
    }

    #register_form input[type="text"],
    #register_form input[type="password"],
    #register_form input[type="email"],
    #register_form select {
        width: 100% !important;
        min-width: 0 !important;
        height: 48px !important;
        padding: 0 14px !important;
        font-size: 15px !important;
    }

    #register_form .form_01 li,
    #register_form .reg_mb_img_file {
        margin-bottom: 14px !important;
    }

    #register_form .btn_confirm {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 96px !important;
        gap: 8px !important;
    }

    #register_form .btn_confirm .btn_submit,
    #register_form .btn_confirm a,
    #register_form .btn_confirm button {
        width: 100% !important;
        min-width: 0 !important;
        height: 50px !important;
        margin: 0 !important;
        font-size: 17px !important;
    }

    /* 정보찾기 팝업 */
    .casino-contact-modal__dialog {
        width: calc(100% - 24px) !important;
        max-width: 520px !important;
        margin: 12px auto !important;
    }

    .casino-contact-modal__title {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 120px !important;
        padding: 20px !important;
        font-size: 30px !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }

    /* 푸터 */
    .casino-footer {
        margin-top: 28px !important;
        padding: 28px 16px 20px !important;
    }

    .casino-footer__inner {
        width: 100% !important;
        max-width: 100% !important;
    }

    .casino-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 22px 14px !important;
    }

    .casino-footer__brand {
        grid-column: 1 / -1 !important;
    }

    .casino-footer__logo img {
        width: auto !important;
        max-width: 210px !important;
        max-height: 68px !important;
        object-fit: contain !important;
    }

    .casino-footer a,
    .casino-footer p,
    .casino-footer li {
        overflow-wrap: anywhere;
    }

    /* 모바일 전용 헤더 최종 색상/아이콘 */
    html body #hd {
        background: #171717 !important;
        border-bottom: 3px solid #f0a20a !important;
    }

    html body #hd_wrapper {
        min-height: 72px !important;
        padding: 10px 16px !important;
        background: #171717 !important;
    }

    html body #logo,
    html body #hd #logo,
    html body .tanga-mobile-logo {
        flex: 1 1 calc(100% - 108px) !important;
    }

    html body #logo img,
    html body .tanga-mobile-logo img {
        width: 230px !important;
        max-width: 57vw !important;
        max-height: 54px !important;
    }

    html body #gnb_open,
    html body #user_btn,
    html body #gnb_close,
    html body #user_close {
        width: 44px !important;
        height: 44px !important;
        border: 1px solid #ffc12b !important;
        border-radius: 11px !important;
        background: #f0a20a !important;
        color: #111 !important;
        box-shadow: none !important;
    }

    .tanga-mobile-svg-icon {
        display: block !important;
        width: 23px !important;
        height: 23px !important;
        fill: none !important;
        stroke: #111 !important;
        stroke-width: 2.2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    html body .tanga-mobile-auth {
        order: 4 !important;
        width: 100% !important;
        margin-top: 8px !important;
    }

    html body .tanga-mobile-auth a,
    html body .tanga-mobile-auth a.tanga-mobile-join {
        height: 40px !important;
        border: 1px solid #f0a20a !important;
        border-radius: 9px !important;
        background: #f0a20a !important;
        color: #111 !important;
        box-shadow: none !important;
    }

    html body #gnb.hd_div,
    html body #user_menu.hd_div {
        background: #1e1e1e !important;
        border-top: 1px solid #3f3f3f !important;
    }

    html body #gnb_1dul .gnb_1dli {
        border-bottom-color: #3c3c3c !important;
        background: #1e1e1e !important;
    }

    html body #gnb_1dul .gnb_1da {
        color: #fff !important;
    }

    html body .btn_gnb_op,
    html body .gnb_2dul,
    html body #hd_nb a {
        background: #292929 !important;
        color: #fff !important;
    }

    html body .btn_gnb_op::after {
        color: #f0a20a !important;
    }

    html body .gnb_2da {
        color: #ddd !important;
    }

    /* 메인 흰색 박스를 PC와 같은 차콜/노란색 테마로 통일 */
    html body .tanga-main-official-wrap,
    html body .tanga-main-official-head,
    html body .tanga-main-story-box,
    html body .tanga-main-story-head,
    html body .tanga-main-news-box,
    html body .tanga-main-news-tabs,
    html body .tanga-main-news-tab,
    html body .tanga-main-guide-banner,
    html body .tanga-main-guide-write,
    html body .tanga-trust-section,
    html body .tanga-major-section,
    html body .tanga-major-body,
    html body .tanga-safe-section,
    html body .tanga-safe-body,
    html body .tanga-faq-section,
    html body .tanga-faq-item,
    html body .tanga-faq-answer,
    html body .tanga-faq-box {
        background: #252525 !important;
        border-color: #464646 !important;
        box-shadow: none !important;
        color: #eee !important;
    }

    html body .tanga-main-official-wrap,
    html body .tanga-main-story-box,
    html body .tanga-main-news-box {
        border-top-color: #f0a20a !important;
    }

    html body .tanga-main-official-head h2,
    html body .tanga-main-story-head h2,
    html body .tanga-main-story-list a,
    html body .tanga-main-news-tab,
    html body .tanga-main-news-list a,
    html body .tanga-main-guide-item,
    html body .tanga-main-guide-writebox,
    html body .tanga-trust-intro,
    html body .tanga-trust-item,
    html body .tanga-trust-footer,
    html body .tanga-major-item,
    html body .tanga-major-footer,
    html body .tanga-safe-item,
    html body .tanga-safe-footer,
    html body .tanga-faq-title,
    html body .tanga-faq-desc,
    html body .tanga-faq-item summary,
    html body .tanga-faq-answer,
    html body .tanga-faq-box {
        color: #eee !important;
    }

    html body .tanga-main-story-date,
    html body .tanga-main-news-date,
    html body .tanga-main-story-empty,
    html body .tanga-main-news-empty {
        color: #aaa !important;
    }

    html body .tanga-main-news-tab:hover,
    html body .tanga-main-news-tab:focus,
    html body .tanga-main-news-tab.is-active {
        background: #f0a20a !important;
        color: #111 !important;
    }

    html body .tanga-main-official-more,
    html body .tanga-main-news-label,
    html body .tanga-main-story-hot,
    html body .tanga-main-news-hot {
        border-color: #f0a20a !important;
        background: #f0a20a !important;
        color: #111 !important;
    }

    /* 빨간 제목을 모두 노란색으로 */
    html body .tanga-main-guide-title,
    html body .tanga-trust-title,
    html body .tanga-trust-title-small,
    html body .tanga-trust-title-yellow,
    html body .tanga-major-title,
    html body .tanga-major-title.purple,
    html body .tanga-major-title.pink,
    html body .tanga-safe-title,
    html body .tanga-safe-title.navy,
    html body .tanga-safe-title.purple {
        border-color: #f0a20a !important;
        background: #f0a20a !important;
        color: #111 !important;
        text-shadow: none !important;
        box-shadow: none !important;
    }

    /* 모바일 이미지/배너 크기 축소 */
    html body .tanga-main-official-slider {
        padding: 10px !important;
    }

    html body .tanga-main-official-track {
        gap: 9px !important;
    }

    html body .tanga-main-official-item {
        flex: 0 0 46vw !important;
        min-width: 46vw !important;
        max-width: 190px !important;
    }

    html body .tanga-main-official-thumb {
        aspect-ratio: 1 / .7 !important;
    }

    html body .tanga-main-guide-banner img {
        display: block !important;
        width: 100% !important;
        max-height: 210px !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    html body .tanga-main-guide-wrap .tanga-main-guide-hero,
    html body .tanga-major-hero,
    html body .tanga-safe-hero {
        min-height: 145px !important;
        max-height: 210px !important;
        padding: 12px !important;
        overflow: hidden !important;
    }

    html body .tanga-main-guide-wrap .tanga-main-guide-hero-copy {
        max-width: 66% !important;
    }

    html body .tanga-main-guide-wrap .tanga-main-guide-hero-copy p,
    html body .tanga-main-guide-wrap .tanga-main-guide-hero-copy .hero-strong,
    html body .tanga-major-hero-copy p,
    html body .tanga-safe-hero-copy p {
        font-size: 9px !important;
        line-height: 1.32 !important;
    }
}

@media (max-width: 420px) {
    .tanga-menu > li > a,
    .tanga-main-menu > li > a,
    #gnb_1dul > li > a {
        padding: 0 13px !important;
        font-size: 14px !important;
    }

    .tanga-main-news-tabs,
    .casino-footer__grid {
        grid-template-columns: 1fr !important;
    }

    .casino-footer__brand {
        grid-column: auto !important;
    }

    .casino-contact-modal__title {
        min-height: 104px !important;
        font-size: 26px !important;
    }
}
