/* SHINKO PUBLIC MOBILE 2026-09-28
   Desktop layout is unchanged. These rules apply only to phones/tablets. */
@media screen and (max-width: 767px) {
  html, body {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
  }

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

  #wrap,
  #menuwall,
  #menubox,
  #search,
  #header,
  #meinwrap,
  #centerbox,
  #cenerwrap,
  #leftbox,
  #rightbox,
  #conents_centerbox,
  #check_list,
  #check_wall,
  #footer,
  #foot01,
  #foot02,
  #foot03,
  #foot04 {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

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

  /* top navigation: keep all items usable, scroll sideways when needed */
  #menuwall {
    overflow: visible !important;
  }
  #menubox {
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
  }
  #menubox > ul,
  #menubox > ul.MenuBarHorizontal {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #menubox > ul > li,
  #menubox > ul.MenuBarHorizontal > li {
    float: none !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 112px !important;
  }
  #menubox > ul > li > a,
  #menubox > ul.MenuBarHorizontal > li > a {
    white-space: nowrap !important;
    padding: 11px 13px !important;
    font-size: 13px !important;
  }
  #menubox ul ul {
    min-width: 180px !important;
  }

  /* search / favorite bar */
  #search {
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 10px !important;
  }
  #search > div {
    float: none !important;
    height: auto !important;
    line-height: normal !important;
    margin: 0 !important;
  }
  #search .search_01 {
    order: 1;
    width: 100% !important;
    flex: 1 1 100% !important;
  }
  #search .search_04 {
    order: 2;
    width: auto !important;
    flex: 1 1 auto !important;
  }
  #search .search_03 {
    order: 3;
    width: auto !important;
    margin-left: auto !important;
  }
  #search input,
  #search .gsc-control-cse,
  #search .gsc-search-box,
  #search .gsc-input-box {
    max-width: 100% !important;
    width: 100% !important;
  }

  #header {
    height: auto !important;
    padding: 8px 10px !important;
  }
  #header img {
    display: block !important;
    margin: 0 auto !important;
  }

  /* main three-column desktop layout -> stacked mobile layout */
  #meinwrap {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    padding: 0 10px !important;
  }
  #centerbox {
    order: 1 !important;
  }
  #rightbox {
    order: 2 !important;
  }
  #leftbox {
    order: 3 !important;
  }
  #centerbox,
  #rightbox,
  #leftbox,
  #cenerwrap {
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* new arrivals */
  .newbox {
    display: grid !important;
    grid-template-columns: 78px minmax(0,1fr) !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .new01,
  .new02 {
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  .new02 {
    white-space: normal !important;
    word-break: break-word !important;
  }
  .righton,
  .title01,
  .title02,
  .title03,
  .title04 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* property cards */
  .content {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }
  .conbox {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px !important;
  }
  .conbox01,
  .conbox02_top,
  .conbox03 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .conbox02_top img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 150px !important;
    margin: 0 auto !important;
  }
  .conbox03 {
    word-break: break-word !important;
  }
  .conbox03 ul {
    padding-left: 16px !important;
  }

  /* side menus */
  #leftbox iframe[src*="facebook.com"] {
    display: none !important;
  }
  .leftmenu01,
  .rightmenu01,
  .rightmenu02,
  .rightmenu03 {
    float: none !important;
    width: 100% !important;
    max-width: 360px !important;
    height: auto !important;
    margin: 6px auto !important;
  }
  .leftmenu01 img,
  .rightmenu01 img,
  .rightmenu02 img,
  .rightmenu03 img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  .koyomi {
    float: none !important;
    display: inline-block !important;
    vertical-align: top !important;
    width: 48% !important;
    height: auto !important;
    margin: 1% !important;
  }

  /* checked/favorite list */
  #check_list {
    height: auto !important;
    padding: 10px !important;
  }
  #check_wall {
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    padding: 0 !important;
  }
  .check_box00,
  .check_box01 {
    display: none !important;
  }
  .check_box {
    float: none !important;
    width: auto !important;
    height: auto !important;
  }
  .check_photo {
    width: 100% !important;
    height: auto !important;
  }
  .check_photo img {
    max-width: 110px !important;
  }
  .check_text {
    float: none !important;
    width: 100% !important;
    height: auto !important;
  }

  /* company / information fixed pages */
  #conents_centerbox,
  .company_box,
  .company_box_left,
  .company_box_right,
  .company_map {
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .company_box_left,
  .company_box_right {
    margin-bottom: 12px !important;
  }
  .company_map img {
    width: 100% !important;
    height: auto !important;
  }
  .info_left {
    width: 38% !important;
  }
  .info_right {
    width: 60% !important;
  }

  /* general content safety */
  #meinwrap table,
  #conents_centerbox table,
  .category_text table {
    max-width: 100% !important;
  }
  input,
  select,
  textarea {
    max-width: 100% !important;
  }

  /* footer */
  #footer {
    height: auto !important;
    padding: 0 10px !important;
  }
  #foot01,
  #foot02,
  #foot03,
  #foot04 {
    height: auto !important;
    min-height: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .footlink,
  .footlink2 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 0 12px !important;
  }
  #foot03-1,
  #foot03-2 {
    float: none !important;
    width: 100% !important;
    height: auto !important;
  }
}

@media screen and (max-width: 480px) {
  .content {
    grid-template-columns: 1fr !important;
  }
  .koyomi {
    display: block !important;
    width: 100% !important;
    margin: 6px 0 !important;
  }
  #check_wall {
    grid-template-columns: 1fr !important;
  }
  #menubox > ul > li,
  #menubox > ul.MenuBarHorizontal > li {
    min-width: 104px !important;
  }
}


/* SHINKO MOBILE SEARCH/FLOW V2 2026-09-28 */
.shinko-mobile-quicknav {
  display: none;
}

@media screen and (max-width: 767px) {
  .shinko-mobile-quicknav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    width: 100%;
    padding: 8px 10px;
    background: #eef2f4;
    border-bottom: 1px solid #c7d0d5;
    position: relative;
    z-index: 2500;
  }
  .shinko-mobile-quicknav a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 8px 6px;
    border: 1px solid #607985;
    border-radius: 5px;
    background: #ffffff;
    color: #314b58 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    touch-action: manipulation;
  }
  .shinko-mobile-quicknav a.shinko-rent-search {
    grid-column: 1 / -1;
    background: #4b6572;
    color: #ffffff !important;
    font-size: 15px !important;
  }

  /* Search/category result cards: support .conbox02 as well as TOP .conbox02_top */
  .conbox {
    position: relative !important;
    cursor: pointer;
    touch-action: manipulation;
  }
  .conbox01,
  .conbox02,
  .conbox02_top,
  .conbox03 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .conbox02 {
    padding: 4px 0 !important;
    text-align: center !important;
  }
  .conbox02 a,
  .conbox02_top a {
    display: block !important;
    width: 100% !important;
    position: relative !important;
    z-index: 5 !important;
    touch-action: manipulation;
  }
  .conbox02 img,
  .conbox02_top img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 160px !important;
    margin: 0 auto !important;
    pointer-events: auto !important;
  }
  .conbox03 {
    overflow: visible !important;
  }
  .conbox.shinko-mobile-property-card {
    min-height: 0 !important;
  }

  /* Old Spry submenu is mouse-hover oriented. Keep it from covering mobile cards. */
  #MenuBar1 ul {
    z-index: 5000 !important;
  }
}

@media screen and (max-width: 480px) {
  .shinko-mobile-quicknav {
    grid-template-columns: 1fr;
  }
  .shinko-mobile-quicknav a.shinko-rent-search {
    grid-column: auto;
  }
}

