@charset "utf-8";
/* 「香港特集」レスポンシブ TOPのみCSS */
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
#mv {
  color: #fff;
  text-align: center;
  font-weight: bold;
}
.mv__inner {
  display: grid;
  justify-items: center;
  padding: var(--mv-inner-yohaku, min((116vw / 7.5), 116px) 0 min((66vw / 7.5), 66px));
  .is-pc & {
    --mv-inner-yohaku: 63px 0 120px;
    --mv-logo-gap: 29px;
    --mv-discoverhongkong-yohaku-ue: 33px;
  }
}
.mv__logo {
  display: grid;
  justify-items: center;
  gap: var(--mv-logo-gap, min((38vw / 7.5), 38px));
}
.mv__logo--copy, .mv__logo--image {
  width: auto;
  height: var(--mv-logo-size-h, min((40vw / 7.5), 30px));
  object-fit: contain;
  &.mv__logo--image {
    --mv-logo-size-h: min((339vw / 7.5), 339px);
    .is-pc & {
      --mv-logo-size-h: 411px;
    }
  }
}
.mv__discoverhongkong {
  margin-top: var(--mv-discoverhongkong-yohaku-ue, min((58vw / 7.5), 58px));
}
.mv__discoverhongkong--logo {
  width: auto;
  height: min((64vw / 7.5), 64px);
  object-fit: contain;
}
.mv__lead--wrapper {
  align-content: end;
}
.mv__lead {
  width: min(var(--default-width-sp), 612px);
  font-family: var(--default-ff-min);
  font-size: min((24vw / 7.5), 18px);
  line-height: calc(48 / 18);
  letter-spacing: 2px;
}
.mv__photo--wrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
/*------------------------------------------------*/
#mainArea {
  .sec-nav {
    background: url("../../all/images/bg_pattern_graph.gif") repeat 0 bottom / min((33vw / 7.5), 33px);
    padding-top: min((40vw / 7.5), 57px);
  }
  .sec-nav__list {
    width: min((700vw / 7.5), var(--default-width-pc));
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    gap: min((16vw / 7.5), 15px) min((9vw / 7.5), 8px);
    justify-content: center;
  }
  .sec-nav__list--item--link {
    width: max-content;
    font-size: min((18vw / 7.5), 14px);
    display: flex;
    gap: .75em;
    padding: .6em .8em .7em 1em;
    border-radius: 200px;
    color: var(--sec-nav-btn-fc, inherit);
    background: var(--sec-nav-btn-bg, #fff);
    border: 1px solid #000;
    font-style: italic;
    letter-spacing: 0;
    &::after {
      content: "△";
      transform: rotate(180deg);
      font-style: normal;
    }
  }
  .section {
    padding: min((90vw / 7.5), 90px) 0 min((110vw / 7.5), 110px);
    background: var(--sec-bg);
    .section__title {
      margin-bottom: var(--secttl-mb);
      .base-title__picture {
        width: var(--secttl-img-size-w, auto);
        height: var(--secttl-img-size-h);
        object-fit: contain;
      }
    }
    &#area {
      --sec-bg: url("../../all/images/bg_pattern_graph.gif") repeat 0 0 / min((33vw / 7.5), 33px);
    }
    &#theme {
      --sec-bg: url("../images/theme_kazari.webp") no-repeat center top max((-76vw / 7.5), -46px) / min((1984vw / 7.5), 1984px), url("../../all/images/bg_pattern_orange.gif") repeat 0 0 / min((50vw / 7.5), 50px);
      --secttl-fc: var(--default-color-green);
      padding-top: min((215vw / 7.5), 250px);
    }
    &#report {
      --sec-bg: url("../../all/images/bg_pattern_yellow.gif") repeat 0 0 / min((50vw / 7.5), 50px);
      --secttl-mb: min((56vw / 7.5), 70px);
      --secttl-size-h: min((138vw / 7.5), 148px);
      --secttl-ico-left-bg: url("../images/report_title_kazari_left.webp");
      --secttl-ico-left-size-w: min((135vw / 7.5), 152px);
      --secttl-ico-left-size-h: min((106vw / 7.5), 119px);
      --secttl-ico-right-bg: url("../images/report_title_kazari_right.webp");
      --secttl-ico-right-size-w: min((109vw / 7.5), 109px);
      --secttl-ico-right-size-h: min((78vw / 7.5), 78px);
      --slider-pagination-bg: var(--default-color-purple);
      --slider-pagination-size-w-active: min((27vw / 7.5), 27px);
      --slider-pagination-size-h-active: min((23vw / 7.5), 23px);
      --slider-pagination-bg-active: url("../../all/images/icon_dot_heart.svg") no-repeat 0 0 / contain;
      --slider-pagination-radius-active: 0;
      .section__inner {
        width: 100%;
      }
      .section__title {
        font-family: var(--default-ff-gothic-dot);
        text-align: center;
        line-height: 1.2;
        letter-spacing: .2em;
        .base-title__text--main--text {
          display: grid;
          font-size: min((30vw / 7.5), 30px);
          .is-inline-block:last-child {
            font-size: min((44vw / 7.5), 44px);
            color: var(--default-color-purple);
            small {
              font-size: calc(36em / 44);
            }
          }
        }
      }
    }
    &#support {
      --secttl-mb: min((48vw / 7.5), 53px);
      --secttl-img-size-w: 100%;
      --secttl-img-size-h: min((170vw / 7.5), 170px);
    }
    &#basic-info {
      --sec-bg: url("../../all/images/bg_pattern_pink.gif") repeat 0 0 / min((33vw / 7.5), 33px);
      --secttl-mb: min((57vw / 7.5), 30px);
      --secttl-size-h: var(--secttl-ico-left-size-h);
      --secttl-ico-left-bg: url("../images/info_title_kazari_left.webp");
      --secttl-ico-left-size-w: min((174vw / 7.5), 174px);
      --secttl-ico-left-size-h: min((173vw / 7.5), 173px);
      --secttl-ico-right-bg: url("../images/info_title_kazari_right.webp");
      --secttl-ico-right-size-w: min((156vw / 7.5), 129px);
      --secttl-ico-right-size-h: min((130vw / 7.5), 108px);
    }
    &:is(#theme, #basic-info) {
      .section__title {
        font-weight: bold;
        text-align: center;
        line-height: 1.2;
        .base-title__text--main--text {
          display: grid;
          gap: .3em;
          font-size: min((40vw / 7.5), 30px);
          text-shadow: 0 3px 0 rgba(0, 0, 0, .3);
          letter-spacing: .2em;
          .is-inline-block:last-child {
            font-size: min((60vw / 7.5), 44px);
            color: var(--secttl-fc, #fff);
            text-shadow: var(--default-text-shadow);
          }
        }
      }
    }
    &:is(#report, #basic-info) {
      .section__title {
        height: var(--secttl-size-h);
        display: grid;
        justify-items: center;
        .base-title__inner {
          position: relative;
          display: grid;
          &::before, &::after {
            content: "";
            position: absolute;
            background: var(--secttl-ico-bg) no-repeat 0 0 / cover;
            width: var(--secttl-ico-size-w);
            height: var(--secttl-ico-size-h);
          }
          &::before {
            --secttl-ico-bg: var(--secttl-ico-left-bg);
            --secttl-ico-size-w: var(--secttl-ico-left-size-w);
            --secttl-ico-size-h: var(--secttl-ico-left-size-h);
            left: 0;
          }
          &::after {
            --secttl-ico-bg: var(--secttl-ico-right-bg);
            --secttl-ico-size-w: var(--secttl-ico-right-size-w);
            --secttl-ico-size-h: var(--secttl-ico-right-size-h);
            right: 0;
          }
          #report & {
            align-content: end;
            &::before {
              top: 0;
              translate: max((-114vw / 7.5), -170px) 0;
            }
            &::after {
              bottom: 0;
              translate: min((100vw / 7.5), 135px) 0;
            }
          }
          #basic-info & {
            align-content: center;
            &::before {
              top: 0;
              translate: max((-210vw / 7.5), -262px) 0;
            }
            &::after {
              top: 50%;
              translate: min((185vw / 7.5), 240px) -50%;
            }
          }
        }
      }
    }
  }
}
/*area*/
#area {
  .section__inner {
    width: var(--sec-inner-size, min(var(--default-width-sp), 680px));
  }
  .section__title {
    position: absolute;
    top: var(--secttl-posi-tate, min((23vw / 7.5), 23px));
    left: var(--secttl-posi-yoko, min((18vw / 7.5), 18px));
  }
  .is-sp & {
    --secttl-img-size-h: min((132vw / 7.5), 132px);
    --map-lineup-item-size: min((172vw / 7.5), 172px);
    --map-lineup-item-shadow-size: min((6vw / 7.5), 6px);
  }
  .is-pc & {
    --sec-inner-size: min((992vw / 10.9), var(--default-width-pc));
    --secttl-posi-tate: min((11vw / 10.9), 11px);
    --secttl-posi-yoko: min((58vw / 10.9), 58px);
    --secttl-img-size-h: min((132vw / 10.9), 132px);
    --map-bg-size-h: min((838vw / 10.9), 838px);
    --map-lineup-item-size: min((172vw / 10.9), 172px);
    --map-lineup-item-shadow-size: min((6vw / 10.9), 6px);
    --map-lineup-item-yohaku: min((6vw / 10.9), 6px);
    --map-lineup-item-photo-size-h: min((114vw / 10.9), 114px);
    --map-lineup-item-fs: min((24vw / 10.9), 24px);
  }
  .is-type-kowloon {
    --area-color: #32b16c;
  }
  .is-type-hongkong {
    --area-color: var(--default-color-pink);
  }
}
.area-map {
  position: relative;
  .is-sp & {
    padding-bottom: min((169vw / 7.5), 169px);
  }
}
.area-map__bg {
  width: 100%;
  height: var(--map-bg-size-h, min((800vw / 7.5), 800px));
  .base-picture__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.area-map__lineup--item {
  position: absolute;
  left: var(--map-lineup-item-posi-yoko, 0);
  &.is-type-kowloon {
    top: var(--map-lineup-item-posi-tate, 0);
  }
  &.is-type-hongkong {
    bottom: var(--map-lineup-item-posi-tate, 0);
  }
  .is-sp & {
    --map-lineup-item-posi-tate: var(--map-lineup-item-posi-tate-is-sp);
    --map-lineup-item-posi-yoko: var(--map-lineup-item-posi-yoko-is-sp);
  }
  .is-pc & {
    --map-lineup-item-posi-tate: var(--map-lineup-item-posi-tate-is-pc);
    --map-lineup-item-posi-yoko: var(--map-lineup-item-posi-yoko-is-pc);
  }
  /*九龍*/
  &.is-west_kowloon {
    --map-lineup-item-posi-tate-is-sp: min((182vw / 7.5), 182px);
    --map-lineup-item-posi-yoko-is-sp: min((45vw / 7.5), 45px);
    --map-lineup-item-posi-tate-is-pc: min((187vw / 10.9), 187px);
    --map-lineup-item-posi-yoko-is-pc: min((74vw / 10.9), 74px);
  }
  &.is-mong_kok {
    --map-lineup-item-posi-tate-is-sp: min((245vw / 7.5), 245px);
    --map-lineup-item-posi-yoko-is-sp: min((434vw / 7.5), 434px);
    --map-lineup-item-posi-tate-is-pc: min((255vw / 10.9), 255px);
    --map-lineup-item-posi-yoko-is-pc: min((607vw / 10.9), 607px);
  }
  &.is-tsim_sha_tsui {
    --map-lineup-item-posi-tate-is-sp: min((487vw / 7.5), 487px);
    --map-lineup-item-posi-yoko-is-sp: min((16vw / 7.5), 16px);
    --map-lineup-item-posi-tate-is-pc: min((379vw / 10.9), 379px);
    --map-lineup-item-posi-yoko-is-pc: min((138vw / 10.9), 138px);
  }
  /*香港島*/
  &.is-old_town_central {
    --map-lineup-item-posi-tate-is-sp: min((58vw / 7.5), 58px);
    --map-lineup-item-posi-yoko-is-sp: min((91vw / 7.5), 91px);
    --map-lineup-item-posi-tate-is-pc: min((94vw / 10.9), 94px);
    --map-lineup-item-posi-yoko-is-pc: min((222vw / 10.9), 222px);
  }
  &.is-wan_chai {
    --map-lineup-item-posi-yoko-is-sp: min((290vw / 7.5), 290px);
    --map-lineup-item-posi-tate-is-pc: min((86vw / 10.9), 86px);
    --map-lineup-item-posi-yoko-is-pc: min((478vw / 10.9), 478px);
  }
  &.is-causeway_bay {
    --map-lineup-item-posi-tate-is-sp: min((88vw / 7.5), 88px);
    --map-lineup-item-posi-yoko-is-sp: min((488vw / 7.5), 488px);
    --map-lineup-item-posi-tate-is-pc: min((193vw / 10.9), 193px);
    --map-lineup-item-posi-yoko-is-pc: min((689vw / 10.9), 689px);
  }
}
.area-map__lineup--item--link {
  width: var(--map-lineup-item-size);
  height: var(--map-lineup-item-size);
  background: var(--area-color);
  display: grid;
  grid-template-rows: var(--map-lineup-item-photo-size-h, min((114vw / 7.5), 114px)) 1fr;
  align-items: center;
  font-family: var(--default-ff-min);
  font-style: italic;
  font-size: var(--map-lineup-item-fs, min((24vw / 7.5), 24px));
  text-align: center;
  line-height: 1;
  color: #fff;
  padding: var(--map-lineup-item-yohaku, min((6vw / 7.5), 6px));
  padding-bottom: 0;
  border: 1px solid #000;
  box-shadow: var(--map-lineup-item-shadow-size) var(--map-lineup-item-shadow-size) 0px 0px rgba(0, 0, 0, .5);
  .is-fs-small {
    font-size: calc(18em / 24);
  }
}
.area-map__lineup--item--photo {
  order: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*area -- area-detail*/
.js-modal-target {
  width: 100%;
  height: 100%;
  background: rgba(115, 104, 98, .6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  display: grid;
  translate: -110% 0;
  /*transition: translate .4s;*/
  &.is-modal-dsp {
    translate: 0 0;
  }
}
.area-detail__wrapper {
  width: min((710vw / 7.5), var(--default-width-pc));
  margin: auto;
  overflow: hidden;
  position: relative;
  --slider-arrow-size: min((20vw / 7.5), 30px);
  .splide__pagination__page {
    --slider-pagination-bg: #ece8e2;
    --slider-pagination-bg-active: var(--area-color);
  }
}
.area-detail__content {
  padding: min((35vw / 7.5), 33px) min((30vw / 7.5), 47px);
}
.area-detail__close {
  cursor: pointer;
  position: absolute;
  --size: min((60vw / 7.5), 60px);
  width: var(--size);
  height: var(--size);
  background: #000;
  color: #fff;
  border-radius: 100%;
  top: min((6vw / 7.5), 3px);
  right: min((19vw / 7.5), 23px);
  display: grid;
  justify-items: center;
  align-items: center;
  &::before {
    content: var(--default-icon-close);
    font-family: var(--default-ff-icon);
    font-size: min((40vw / 7.5), 40px);
    line-height: 1lh;
    font-weight: bold;
    margin-left: .05em;
  }
}
.area-detail__lineup--item {
  max-height: 90lvh;
  overflow-y: auto;
  overflow-x: visible;
  padding: 0 var(--map-lineup-item-shadow-size) var(--map-lineup-item-shadow-size) !important;
  position: relative;
}
.area-detail__lineup--item--inner {
  position: relative;
  z-index: 1;
  height: max-content;
  min-height: 100%;
  font-weight: bold;
  background: #ece8e2;
  display: grid;
  align-content: start;
  box-shadow: var(--map-lineup-item-shadow-size) var(--map-lineup-item-shadow-size) 0px 0px #000;
  .is-sp & {
    grid-template-areas:
      "ttl"
      "img"
      "txt";
    gap: min((30vw / 7.5), 30px);
  }
  .is-pc & {
    grid-template-areas:
      "ttl ttl"
      "img txt";
    gap: min((17vw / 10.9), 17px) min((22vw / 10.9), 22px);
    grid-template-columns: auto 1fr;
    padding: min((19vw / 10.9), 19px) min((38vw / 10.9), 38px) min((34vw / 10.9), 34px);
    --photo-size-w: auto;
    --photo-size-h: min((240vw / 10.9), 240px);
  }
}
.area-detail__lineup--item--title {
  grid-area: ttl;
  --area-label-size: min((120vw / 7.5), 100px);
  min-height: var(--area-label-size);
  .is-sp & {
    padding: min((30vw / 7.5), 30px) min((20vw / 7.5), 20px) 0;
  }
  .base-title__inner {
    display: grid;
    align-items: center;
    .is-sp & {
      gap: min((30vw / 7.5), 30px);
      grid-template-columns: auto 1fr;
    }
    .is-pc & {
      grid-template-columns: auto 100%;
      overflow: hidden;
      .base-title__text--main {
        translate: max((-120vw / 7.5), -100px) 0;
      }
    }
  }
  .base-title__text--sub.is-before {
    background: var(--area-color);
    display: grid;
    justify-items: center;
    align-items: center;
    border-radius: 100%;
    color: #fff;
    font-family: var(--default-ff-min);
    font-size: min((28vw / 7.5), 24px);
    line-height: 1.2;
    text-align: center;
    height: var(--area-label-size);
    aspect-ratio: 1;
  }
  .base-title__text--main--text {
    font-size: min((48vw / 7.5), 40px);
    line-height: calc(50 / 48);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    .is-main {
      -webkit-text-stroke: .5px;
      text-stroke: .5px;
    }
    .is-ruby {
      font-size: min((30vw / 7.5), 24px);
      translate: 0 .1em;
    }
    .is-en {
      width: 100%;
      font-size: min((24vw / 7.5), 18px);
      margin-top: .4em;
      word-break: break-all;
    }
    .is-pc & {
      justify-content: center;
      text-align: center;
    }
  }
}
.area-detail__lineup--item--photo {
  grid-area: img;
  width: var(--photo-size-w, 100%);
  height: var(--photo-size-h, min((300vw / 7.5), 300px));
  object-fit: contain;
  text-align: center;
}
.area-detail__lineup--item--texts {
  grid-area: txt;
  .is-sp & {
    padding: 0 min((46vw / 7.5), 46px) min((38vw / 7.5), 38px);
  }
}
.area-detail__lineup--item--lead {
  font-size: min((28vw / 7.5), 20px);
  line-height: calc(26 / 20);
  margin-bottom: .75em;
}
.area-detail__lineup--item--point {
  background: #daceba;
  font-size: min((18vw / 7.5), 16px);
  line-height: 1.2;
  padding: .8em 1.25em .9em;
  margin-top: 1.5em;
}
.area-detail__lineup--item--point--item {
  padding-left: 1em;
  text-indent: -1em;
  &:not(:first-child) {
    margin-top: .3em;
  }
}
/*theme*/
.theme__banners {
  margin-top: min((66vw / 7.5), 66px);
}
/*report*/
.report__lineup--wrapper {
  padding-bottom: min((65vw / 7.5), 45px);
}
.report__lineup {
  gap: min((32vw / 7.5), 42px);
}
.report__lineup--item {
  width: max-content !important;
}
.report__lineup--item--link {
  display: block;
  width: min((454vw / 7.5), 320px);
  height: min((596vw / 7.5), 420px);
  position: relative;
}
.report__lineup--item-bg {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.report__lineup--item--detail {
  height: 100%;
  position: relative;
  z-index: 1;
  display: grid;
  align-content: end;
  gap: min((8vw / 7.5), 7px);
  color: #fff;
  line-height: calc(26 / 16);
  padding: min((23vw / 7.5), 16px) min((19vw / 7.5), 14px);
  background: linear-gradient(to top, rgba(0, 0, 0, .8) 0%, transparent 100%);
}
.report__lineup--item--detail--reporter {
  display: grid;
  grid-template-columns: min((85vw / 7.5), 60px) 1fr;
  gap: min((13vw / 7.5), 9px);
  align-items: center;
  font-size: min((25vw / 7.5), 18px);
  line-height: 1.2;
}
.report__lineup--item--detail--reporter--face {
  aspect-ratio: 1;
  object-fit: cover;
}
/*photo-runner*/
.photo-runner {
  margin-top: min((50vw / 7.5), 60px);
}
.photo-runner__list {
  gap: min((12vw / 7.5), 10px);
  height: min((168vw / 7.5), 168px);
}
.photo-runner__list--item {
  width: auto !important;
  height: min((154vw / 7.5), 154px);
  object-fit: contain;
  padding-top: min((30vw / 7.5), 20px);
  --animation-setting: steps(2, jump-start) piko;
  &:nth-child(odd) {
    align-self: start;
  }
  &:nth-child(even) {
    align-self: end;
  }
  &:nth-child(1 of .is-visible, .is-visible ~ .photo-runner__list--item) {
    animation: .4s var(--animation-setting)
  }
  &:nth-child(3n of .is-visible, .is-visible ~ .photo-runner__list--item) {
    animation: .5s var(--animation-setting)
  }
  &:nth-child(6n of .is-visible, .is-visible ~ .photo-runner__list--item) {
    animation: .4s .7s var(--animation-setting)
  }
  &.is-visible + .photo-runner__list--item:not(.is-visible) {
    animation: .5s .2s var(--animation-setting)
  }
}
@keyframes piko {
  0% {
    translate: 0 max((-30vw / 7.5), -20px);
  }
  to {
    translate: 0 0;
  }
}
/*support*/
.support__lineup {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: min((40vw / 7.5), 20px);
  .is-sp & {
    width: min((515vw / 7.5), var(--default-width-pc));
    grid-template-columns: 1fr;
    margin: auto;
  }
}
.support__lineup--item {
  --support-item-shadow-size: min((18vw / 7.5), 11px);
  margin: 0 var(--support-item-shadow-size) var(--support-item-shadow-size) 0;
  position: relative;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: 0;
  &::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    bottom: 0;
    background: #fff;
    border: 1px solid #000;
    translate: var(--support-item-shadow-size) var(--support-item-shadow-size);
  }
  .support__lineup--item--title, .support__lineup--item--detail {
    border: 1px solid #000;
    background: var(--support-item-bg, #fff);
    position: relative;
    z-index: 1;
  }
  .support__lineup--item--title {
    border-bottom: none;
    font-size: min((32vw / 7.5), 20px);
    line-height: calc(36 / 32);
    font-weight: bold;
    text-align: center;
    padding: .4em .5em .5em;
    align-content: center;
    .is-total & {
      --support-item-bg: var(--default-color-pink);
    }
    .is-branch & {
      --support-item-bg: #ffbe22;
    }
    .is-product & {
      --support-item-bg: #55b861;
    }
  }
  .support__lineup--item--detail {
    padding: .75em 1em 1.5em;
    line-height: calc(34 / 24);
  }
  .support__lineup--item--links {
    margin-top: 1.25em;
  }
  .support__lineup--item--link {
    display: flex;
    align-items: center;
    gap: min((19vw / 7.5), 14px);
    font-weight: bold;
    &:not(:first-child) {
      margin-top: .5em;
      .is-sp & {
        margin-top: .7em;
      }
    }
    &::before {
      content: "";
      background: url(../../all/images/icon_dot_heart.svg) no-repeat center center / cover;
      height: min((22vw / 7.5), 14px);
      aspect-ratio: 19 / 17;
    }
  }
}
/*branch */
#mainArea:has(#support + #branch) {
  #support {
    padding-bottom: 0;
  }
}
.branch {
  background: #fff;
  padding: min((80vw / 7.5), 40px) min((40vw / 7.5), 50px);
  display: grid;
  grid-template-areas:
    "img"
    "ttl"
    "txt"
    "info"
    "btn";
  .is-pc & {
    grid-template:
      "img ttl"auto "img txt"1fr "info info"auto "btn btn"auto / 300px 1fr;
    gap: 0 min((30vw / 10.9), 30px);
  }
}
.branch__title {
  grid-area: ttl;
  font-size: min((48vw / 7.5), 30px);
  line-height: 1.2;
  font-weight: bold;
  letter-spacing: .1em;
  margin-bottom: .4em;
  .is-sp & {
    text-align: center;
    margin-top: 1em;
  }
}
.branch__texts {
  grid-area: txt;
}
.branch__lead {
  font-size: min((30vw / 7.5), 18px);
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: .4em;
  .is-sp & {
    text-align: center;
  }
}
.branch__photo {
  grid-area: img;
  .base-picture__image {
    width: 100%;
    height: min((333vw / 7.5), 333px);
    object-fit: contain;
    .is-pc & {
      height: 200px;
    }
  }
}
.branch__info {
  grid-area: info;
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 5px min((15vw / 7.5), 10px);
  margin-top: min((30vw / 7.5), 20px);
  .branch__info--item {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: span 2;
    align-items: baseline;
    line-height: calc(30 /24);
    .branch__info--item--title {
      background: #000;
      font-size: min((16vw / 7.5), 14px);
      line-height: 1.2;
      color: #fff;
      font-weight: bold;
      text-align: center;
      padding: .4em .75em .5em;
    }
  }
}
.branch__button--wrapper {
  grid-area: btn;
  --btn-yohaku-ue: min((50vw / 7.5), 30px);
  --btn-gap: min((28vw / 7.5), 15px);
  width: min((500vw / 7.5), 695px);
  margin-left: auto;
  margin-right: auto;
}
/*basic-info*/
.basic-info__list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0 min((20vw / 7.5), 30px);
  border-bottom: 1px solid;
  .is-pc & {
    grid-template-columns: repeat(2, max-content 1fr);
    .basic-info__list--item {
      &:first-child, &:last-child {
        grid-column: span 4;
        .basic-info__list--item--detail {
          grid-column: span 3;
        }
      }
    }
  }
  .basic-info__list--item {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: span 2;
    padding: 1em .25em;
    border-top: 1px solid;
    font-size: min((24vw / 7.5), 14px);
    line-height: calc(34 / 24);
    &.is-name {
      align-items: baseline;
    }
  }
  .basic-info__list--item--title {
    font-weight: bold;
  }
  .basic-info__list--item--subtext {
    font-size: min((14vw / 7.5), 14px);
  }
  .basic-info__list--item--detail {
    .is-name & {
      display: grid;
      grid-template-areas:
        "maintxt img"
        "subtxt subtxt";
      grid-template-columns: auto 1fr;
      gap: .2em 1em;
      align-items: center;
      .is-pc & {
        grid-template-areas:
          "maintxt img"
          "subtxt img";
        grid-template-columns: 1fr auto;
        justify-content: space-between;
      }
      .basic-info__list--item--text {
        grid-area: maintxt;
      }
      .basic-info__list--item--subtext {
        grid-area: subtxt;
      }
      .basic-info__list--item--image {
        grid-area: img;
        .base-picture__image {
          display: block;
          width: auto;
          height: min((33vw / 7.5), 33px);
          object-fit: contain;
        }
      }
    }
    .is-habit & {
      .basic-info__list--item--text {
        .is-inline-block {
          padding-left: 1em;
          text-indent: -1em;
          &:not(:first-child) {
            margin-top: .25em;
          }
        }
      }
    }
  }
}
.basic-info__comment {
  margin-top: min((70vw / 7.5), 45px);
  .base-picture__image {
    height: var(--info-comment-img-h, min((583vw / 7.5), 583px));
  }
  .is-pc & {
    --info-comment-img-h: min((298vw / 10.9), 298px);
  }
}
.basic-info__banners {
  margin-top: min((90vw / 7.5), 45px);
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  #mainArea {
    .sec-nav__list--item--link {
      &:hover {
        --sec-nav-btn-fc: #fff;
        --sec-nav-btn-bg: #000
      }
    }
  }
  .area-map__lineup--item--link {
    transition: translate var(--default-hover-speed);
    &:hover {
      translate: 0 max((-10vw / 7.5), -9px);
    }
  }
  .report__lineup--wrapper {
    margin-top: var(--default-hover-move-tate-size);
  }
  .report__lineup--track {
    padding-top: min((10vw / 7.5), 20px) !important;
  }
  .report__lineup--item {
    background: #fff;
    transition: var(--default-hover-transition4);
    transform: var(--move-posi);
    .report__lineup--item--link {
      transition: var(--default-hover-transition);
    }
    &:hover {
      --move-posi: translateY(var(--default-hover-move-tate-size));
      .report__lineup--item--link {
        opacity: var(--default-hover-opacity);
      }
    }
  }
}