/* The review list keeps its existing mobile layout below 769px. */
@media screen and (min-width: 769px) and (max-width: 1099px) {
  #header, #headerBox, #gNaviWrap, #listArea { min-width: 0; }
  #header { height: auto; padding-bottom: 18px; }
  #headerIn, #headerBoxIn { width: calc(100% - 40px); max-width: 960px; row-gap: 18px; }
  #logoWrap, #logoWrapLogin { flex: 1; min-width: 180px; max-width: 270px; height: 54px; }
  #headerBoxIn { height: auto; gap: 20px; justify-content: flex-start; }
  #gNaviWrap { height: auto; }
  #gNavi { width: calc(100% - 40px); max-width: 940px; }
  #gNavi ul { column-gap: 16px; }
  .breadcrumb4 .breadcrumb_in, #sns { width: calc(100% - 40px); max-width: 960px; }
  #sns { justify-content: center; gap: 24px; }
  #reviews { width: calc(100% - 40px); max-width: 960px; }
  #reviews > ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 50px 24px; }
  #reviews > ul > li { width: auto; margin: 0; }
  #reviews .item .circle { margin: 0 auto; }
  #listArea { height: auto; min-height: 1200px; padding-bottom: 40px; box-sizing: border-box; }
  #listArea ul { width: calc(100% - 40px); max-width: 920px; }
  #footer ul { width: calc(100% - 40px); max-width: 1100px; justify-content: center; gap: 14px; }
}
@media screen and (min-width: 769px) and (max-width: 959px) {
  #reviews > ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}