@charset "UTF-8";
/* ----------------------------------------------
　PC設定
------------------------------------------------*/
#container #contents .c-title {
  margin-bottom: var(--m55);
}
#container #contents .p-shop__photoList {
  margin-bottom: var(--m45);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  grid-gap: var(--m40) 0;
}
#container #contents .p-shop__photoList__sub {
  width: 49%;
  max-width: 560px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  grid-gap: min(2vw,40px) 0;
}
#container #contents .p-shop__photoList__photo {
  width: 49%;
  position: relative;
  z-index: 1;
}
#container #contents .p-shop__photoList__photo:not(.main) {
  max-width: 260px;
}
#container #contents .p-shop__photoList__photo.main {
  width: 50%;
}
#container #contents .p-shop__photoList__photo__comment{
  font-size: var(--fs14_15);
  padding: .25em .5em;
  background-color: var(--mainblue);
  color: #fff;
  text-align: right;
}
#container #contents .p-shop__photoList__photo:not(.main) .p-shop__photoList__photo__comment{
  font-size: min(1.34529vw,15px);
}
#container #contents .p-shop__photoList__photo.main .p-shop__photoList__photo__comment {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: .25em 1.5em;
  background: rgba(8, 51, 141, .85);
}
#container #contents .p-shop__address {
  margin-bottom: var(--m80);
}
#container #contents .p-shop__address__map {
  aspect-ratio: 3/1;
  margin-bottom: var(--m14);
}
#container #contents .p-shop__address__map iframe {
  width: 100%;
  height: 100%;
}
#container #contents .p-shop__address__text {
  font-size: var(--fs18_23);
  color: var(--mainblue);
  font-weight: bold;
  border: 3px solid var(--mainblue);
  text-align: center;
  padding: 10px 0;
}
#container #contents .p-shop__comInfo {
  margin-bottom: var(--m60);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  grid-gap: var(--m40) 3.33%;
}
#container #contents .p-shop__comInfo__textArea {
  width: 50.01%;
}
#container #contents .p-shop__comInfo__textArea__outline {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
#container #contents .p-shop__comInfo__textArea__outline__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  margin-bottom: var(--m25);
}
#container #contents .p-shop__comInfo__textArea__outline__dt {
  font-size: var(--fs14_18);
  font-weight: 500;
  width: 8em;
}
#container #contents .p-shop__comInfo__textArea__outline__dd {
  font-size: var(--fs14_18);
  font-weight: 500;
}
#container #contents .p-shop__comInfo__name {
  font-size: var(--fs18_26);
  font-weight: 600;
  border-bottom: 3px solid var(--maincol);
  text-align: center;
  padding-bottom: 0.25em;
  margin-bottom: var(--m30);
}
#container #contents .p-shop__comInfo__imageArea {
  width: 46.66%;
  position: relative;
  z-index: 1;
}
#container #contents .p-shop__comInfo__imageArea::after {
  content: "";
  display: inline-block;
  width: 26.78%;
  aspect-ratio: 150/142;
  background: url(/images/chara/shop_chara.svg) center/cover no-repeat;
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(8%, 2%);
  z-index: 1;
}
#container #contents .p-shop__pay__title {
  font-size: var(--fs18_23);
  font-weight: 600;
  text-align: center;
  color: #fff;
  background-color: var(--mainblue);
  padding: 0.25em 1em;
  margin-bottom: var(--m50);
}
#container #contents .p-shop__pay__text {
  margin-bottom: var(--m55);
}
#container #contents .p-shop__pay__text__span {
  font-size: var(--fs14_20);
  font-weight: 600;
  text-align: center;
  display: block;
  line-height: 1.9;
}
#container #contents .p-shop__pay__list {
  display: flex;
  flex-wrap: wrap;
  grid-gap: var(--m16) 1.33%;
}
#container #contents .p-shop__pay__list__box {
  width: 49.335%;
  border: 3px solid var(--mainblue);
  border-radius: var(--m20);
  overflow: hidden;
}
#container #contents .p-shop__pay__list__box__title {
  font-size: var(--fs18_23);
  font-weight: bold;
  color: #fff;
  text-align: center;
  background-color: var(--mainblue);
  padding: 0.25em 0.5em;
}
#container #contents .p-shop__pay__list__box__image {
  padding: var(--m25) 8px;
  max-width: 250px;
  margin: 0 auto;
  height: calc(100% - var(--fs18_23) * 1.5 * 1.25);
  display: flex;
  align-items: center;
}
#container #contents .p-shop__pay__list__box__image:has(.illust) {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(100% - var(--fs18_23) * 1.9);
}
#container #contents .p-shop__pay__list__box__image:has(.illust) .illust {
  width: 85%;
}

/* ----------------------------------------------
　PAD以下設定
------------------------------------------------*/
@media all and (max-width: 768px) {
  #container #contents .p-shop__photoList__sub {
    width: 100%;
    grid-gap: var(--m40) 7.14%;
    max-width: unset;
  }
  #container #contents .p-shop__photoList__photo {
    width: 46.43%;
  }
  #container #contents .p-shop__photoList__photo:not(.main) {
    max-width: unset;
  }
  #container #contents .p-shop__photoList__photo.main {
    width: 100%;
  }
  #container #contents .p-shop__photoList__photo:not(.main) .p-shop__photoList__photo__comment{
    font-size: min(2.702vw,15px);
  }
  #container #contents .p-shop__address__map {
    aspect-ratio: 3/2;
  }
  #container #contents .p-shop__comInfo__textArea {
    width: 100%;
  }
  #container #contents .p-shop__comInfo__imageArea {
    width: 100%;
  }
  #container #contents .p-shop__pay__list__box {
    width: 49.335%;
  }
}
/* ----------------------------------------------
　SP調整
------------------------------------------------*/
@media all and (max-width: 600px) {
  #container #contents .p-shop__address__map {
    aspect-ratio: 1/1;
  }
  #container #contents .p-shop__photoList__sub {
    grid-gap: var(--m30);
    max-width: unset;
  }
  #container #contents .p-shop__photoList__photo {
    width: calc(50% - 7.5px);
  }
}