/* Shared only by the legacy Aurora and Uyuni features. */
#footer ul { max-width: 100%; box-sizing: border-box; }
.feature-map-links { display: none; }
@media screen and (max-width: 1100px) {
  #header, #headerBox, #gNaviWrap { min-width: 0; }
  #header { height: auto; }
  #headerIn { padding: 16px; gap: 16px; }
  #headerIn, #headerUtility { flex-wrap: wrap; }
  #logoWrap, #logoWrapLogin, #headerUtility { width: 100%; height: auto; }
  #logoWrap #headerLogo, #logoWrapLogin #headerLogo,
  #logoWrap #headerTxt, #logoWrap div, #logoWrapLogin div { position: static; margin: 0; }
  #headerUtility > div:first-child { flex: 1; min-width: 0; }
  #headerSearch form { display: flex; padding-right: 12px; }
  #headerSearch input[type="text"] { width: 100%; min-width: 0; }
  #headerSearch input[type="submit"] { flex: 0 0 60px; }
  #headerLinks .dropMenu.favoriteContent, #headerLinks .dropMenu.historyContent { left: 0; max-width: calc(100vw - 32px); }
  #gNaviWrap, #gNavi { width: auto; height: auto; }
  #gNavi ul li a { display: block; height: auto; line-height: 1.5; }
  #gNavi ul { margin-right: 0; flex-wrap: wrap; justify-content: center; }
  #gNavi ul li { padding: 10px; line-height: 1.5; }
  #headerBoxIn { width: auto; padding: 16px; gap: 16px; flex-wrap: wrap; }
  #headerBoxIn > div, #headerBoxIn > p { max-width: 100%; box-sizing: border-box; }
  #headerBoxIn input { max-width: 100%; box-sizing: border-box; }
  #footer ul { padding: 0 16px; gap: 12px; flex-wrap: wrap; justify-content: center; }
  #footer ul .line { display: none; }
  #footer #copyright { padding: 0 16px; overflow-wrap: anywhere; }
}
@media screen and (max-width: 960px) {
  #wrapper { overflow-wrap: anywhere; }
  #wrapper img { max-width: 100%; height: auto; }
  #wrapper iframe { max-width: 100%; }
  #wrapper .contents,
  #wrapper .howto_area > .inner .howto_contents,
  #wrapper .review_area > .inner .review_contents {
    width: auto; margin-left: 16px; margin-right: 16px;
  }
  #main_header { height: auto; min-height: 220px; margin-bottom: 32px; }
  #main_header .inner, #main_header .inner .ttl { width: auto; height: auto; }
  #main_header .inner { padding: 24px 16px 40px; }
  #main_header .bg { height: 100%; }
  #wrapper .aurora_area .area_img, #wrapper .aurora_area .area_txt,
  #wrapper .tips .clothes_txt, #wrapper .tips .clothes_txt div,
  #wrapper .uyuni_caution .elevation .e_img, #wrapper .uyuni_caution .elevation .e_txt {
    float: none; width: auto; margin-bottom: 24px;
  }
  /* The original image map has fixed pixel coordinates; expose equivalent links at narrow widths. */
  #wrapper .area_img img[usemap] { pointer-events: none; }
  .feature-map-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; }
  #wrapper .clearfix::before, #wrapper .clearfix::after { display: none; }
  #wrapper .city .tab_city { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  #wrapper .city .tab_city li, #wrapper .city .tab_city li.tab_last { float: none; width: auto; height: auto; margin: 0; }
  #wrapper .city .tab_city li a { width: auto; height: auto; padding: 18px 4px; font-size: 16px; background-size: 100% 100%; }
  #wrapper .city .city_table table { float: none; width: 100%; height: auto; margin-bottom: 16px; table-layout: fixed; }
  #wrapper .city .city_table table th { width: 32%; padding: 12px 8px; }
  #wrapper .city .city_table table td { padding: 12px 8px; }
  #wrapper .city_table .btn, #wrapper .hotel_note { width: auto; max-width: 100%; }
  #wrapper .tips table { width: 100%; table-layout: fixed; }
  #wrapper .tips table th { width: 30%; padding: 12px 8px; }
  #wrapper .tips table td { padding: 12px; }
  #wrapper .howto_area, #wrapper .howto_area > .inner,
  #wrapper .review_area, #wrapper .review_area > .inner {
    position: relative; height: auto; overflow: visible;
  }
  #wrapper .howto_area > .inner, #wrapper .review_area > .inner { padding-bottom: 32px; }
  #wrapper .howto_area > .inner .howto_contents ul,
  #wrapper .review_area > .inner .review_contents ul,
  #wrapper .area_tour_list, #wrapper .to_do_list, #wrapper .area_info_list {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px;
  }
  #wrapper .howto_area > .inner .howto_contents ul li,
  #wrapper .review_area > .inner .review_contents ul li,
  #wrapper .area_tour_list li, #wrapper .to_do_list li, #wrapper .area_info_list li {
    float: none; width: auto; height: auto; margin: 0; padding: 0;
  }
  #wrapper .area_tour_list li p, #wrapper .to_do_list li p { height: auto; margin-bottom: 20px; }
  #wrapper .slide_image_wrapper p#slide_image_prev a,
  #wrapper .hotel_slider_wrapper p#image_prev a { top: 35%; left: 12px; }
  #wrapper .slide_image_wrapper p#slide_image_next a,
  #wrapper .hotel_slider_wrapper p#image_next a { top: 35%; left: auto; right: 12px; }
  #wrapper .review_area > .inner .review_contents ul li .review_img { max-width: 100%; }
  #wrapper .review_area > .inner .review_contents ul li .review_img img { max-width: 100%; }
  #wrapper .to_detail img { max-width: calc(100% - 32px); }
}
@media screen and (max-width: 600px) {
  #headerUtility { gap: 12px; }
  #headerUtility > div:first-child { flex-basis: 100%; }
  #headerSearch form { padding-right: 0; }
  #headerLogo.logo { font-size: 24px; letter-spacing: 3px; }
  #gNavi ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #gNavi ul li { padding: 8px 4px; text-align: center; }
  #gNavi ul li a { font-size: 12px; }
  #wrapper .howto_area > .inner .howto_contents ul,
  #wrapper .review_area > .inner .review_contents ul,
  #wrapper .area_tour_list, #wrapper .to_do_list, #wrapper .area_info_list { grid-template-columns: minmax(0, 1fr); }
  #wrapper .contents .desc_txt, #wrapper .contents .desc_txt2 { text-align: left; }
}