/* Site-wide mobile-first overrides for crawfish.kozow.com */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
img, video, iframe {
  max-width: 100%;
  height: auto;
}
input, select, textarea, button {
  font-size: 16px;
  max-width: 100%;
}

.header > .logo-item a {
  font-size: 0 !important;
}
.header > .logo-item img {
  display: none !important;
}
.header > .logo-item a::after {
  content: "필포";
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.gnb a[href="/page1"] {
  font-size: 0 !important;
}
.gnb a[href="/page1"]::after {
  content: "필포";
  font-size: 16px;
  font-weight: 700;
}

@media (max-width: 900px) {
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }
  .container {
    min-width: 0 !important;
    max-width: 100%;
  }
  .body.fixed-width {
    width: auto !important;
    margin: 0 !important;
    padding: 8px 12px calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .content {
    overflow: visible !important;
  }
  .content img {
    max-width: 100%;
    height: auto;
  }

  /* Header: keep logo off the hamburger */
  .header > h1,
  .header > .logo-item {
    float: none !important;
    display: block !important;
    max-width: calc(100% - 56px);
    padding: 0 12px !important;
    line-height: 50px !important;
  }
  .header > .logo-item a,
  .header > h1 a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0 !important;
  }
  .header > .logo-item a::after,
  .header > h1 a::after {
    content: "필포";
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.04em;
    color: inherit;
  }
  .header > .side,
  .header > .custom_area,
  .search_wrap {
    display: none !important;
  }

  /* Hamburger usable with a thumb */
  .gnb {
    float: none !important;
    position: static !important;
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    font-size: 1em !important;
    background: #fff;
  }
  .gnb #mobile_menu_btn,
  .gnb .menu_btn {
    display: block !important;
    position: absolute !important;
    top: 3px !important;
    right: 6px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 20;
  }
  .gnb .menu_btn .menu_bar {
    width: 20px;
    height: 14px;
    position: relative;
    top: 15px;
    left: 12px;
  }
  .gnb .menu_btn .menu_bar div {
    height: 0;
    border-top: 2px solid #383431;
    position: absolute;
    width: 20px;
  }
  .gnb .menu_btn .menu_bar div.btn1 { top: 0; }
  .gnb .menu_btn .menu_bar div.btn2 { top: 6px; }
  .gnb .menu_btn .menu_bar div.btn3 { bottom: 0; top: auto; }

  /* Closed by default; JS slideDown opens it */
  .gnb > ul {
    display: none;
    float: none !important;
    padding: 8px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    max-height: min(70vh, 520px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #fff !important;
    -webkit-overflow-scrolling: touch;
  }
  .gnb > ul > li {
    float: none !important;
    position: static !important;
    width: 100% !important;
  }
  .gnb > ul > li > a {
    display: block !important;
    min-height: 44px;
    padding: 12px 4px !important;
    line-height: 1.3 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #222 !important;
    border-top: 1px solid #eee;
  }

  /* Do not dump 50 child boards into the hamburger */
  .gnb > ul .depth2,
  .gnb > ul .depth3 {
    display: none !important;
  }

  html.phm-nav-open,
  html.phm-nav-open body {
    overflow: hidden;
  }

  /* Login toast/bar covers the thumb zone */
  #nc_container {
    display: none !important;
  }

  .login_widget .signin {
    width: auto !important;
    max-width: 100% !important;
    left: 12px !important;
    right: 12px !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  .footer {
    margin-bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  }
  .footer .site_map,
  .footer .f_info2,
  .footer .sub_desc {
    display: none !important;
  }
  a.btn_top {
    display: none !important;
  }

  /* Bottom app bar */
  .phm-tab {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10050;
    background: #141821;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .phm-tab a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    gap: 2px;
    color: #f7f1e6;
    text-decoration: none !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.02em;
  }
  .phm-tab a i {
    font-size: 18px;
    line-height: 1;
  }
}

@media (min-width: 901px) {
  .phm-tab { display: none !important; }
}