@charset "UTF-8";
/*==========================================================
	ウィンドウ・フォントサイズ設定
==========================================================*/
/*==========  サイズ設定 END  =============================*/
/*==========================================================
	レスポンシブ設定
==========================================================*/
/*==========  レスポンシブ設定 END  =====================*/
#afSite-page.system section {
  padding: 17em 2vw 5em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section {
    padding: 8em 6vw 12vw;
  }
}
#afSite-page.system section::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 60em;
  background-color: hsl(0, 100%, 35%);
  z-index: -1;
  top: 0;
  left: 0;
  clip-path: polygon(0 0, 0 100%, 100% calc(10% + 2vw), 100% 0);
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section::before {
    clip-path: polygon(0 0, 0 100%, 100% calc(30% + 2vw), 100% 0);
    height: 60vh;
  }
}
#afSite-page.system section h2.type02 {
  position: absolute;
  left: 50%;
  transform: translateX(calc(-50% - 0.12em)) rotate(-10deg);
  top: -0.8em;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: max(12px, 12.5em);
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section h2.type02 {
    font-size: max(12px, 6em);
    top: -0.6em;
  }
}
#afSite-page.system section h2.type02 span {
  font-size: 0.07em;
  display: inline-block;
  transform: rotate(10deg);
  color: hsl(0, 0%, 95%);
  letter-spacing: 0.04em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section h2.type02 span {
    font-size: 0.1458em;
  }
}
#afSite-page.system section article {
  display: flex;
  flex-direction: column;
  max-width: 84rem;
  background-color: hsl(0, 0%, 7%);
  gap: 4em 0;
}
#afSite-page.system section article.head {
  padding: 8em 5em 0;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article.head {
    padding: 10em 0 16vw 10vw;
  }
}
#afSite-page.system section article.bottom {
  padding: 0 5em 5em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article.bottom {
    padding: 4em 0 6vw;
    background-color: transparent;
  }
}
#afSite-page.system section article .warp-title {
  font-size: inherit;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid hsl(0, 0%, 95%);
  padding-inline: 1em;
  padding-bottom: 0.4em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .warp-title {
    flex-direction: column;
    align-items: flex-start;
  }
}
#afSite-page.system section article .warp-title h3 {
  font-size: max(12px, 1.875em);
  font-weight: 300;
}
#afSite-page.system section article .warp-title .notice {
  font-size: max(12px, 1.125em);
}
#afSite-page.system section article .warp-title .notice::before {
  content: "（";
}
#afSite-page.system section article .warp-title .notice::after {
  content: "）";
}
#afSite-page.system section article .warp-title .en {
  font-family: "Cormorant", serif;
  font-weight: 500;
  font-style: normal;
  font-size: max(12px, 1.5em);
  margin-left: auto;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .warp-title .en {
    display: none;
  }
}
#afSite-page.system section article .box-price {
  position: relative;
  font-size: inherit;
  display: flex;
  flex-direction: column;
  gap: 1em 0;
}
#afSite-page.system section article .box-price .price-list {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  font-size: inherit;
  gap: 0.8em 0;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list {
    gap: 6vw 0;
  }
}
#afSite-page.system section article .box-price .price-list div {
  position: relative;
  grid-column: span 2;
  display: grid;
  grid-template-columns: subgrid;
  font-size: inherit;
  padding-inline: 2em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div {
    padding-inline: 2vw;
  }
}
#afSite-page.system section article .box-price .price-list div dt {
  display: flex;
  justify-content: flex-end;
  font-size: max(12px, 4em);
  font-weight: 300;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div dt {
    font-size: max(12px, 3.5em);
    align-self: flex-end;
  }
}
#afSite-page.system section article .box-price .price-list div dt::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "分";
}
#afSite-page.system section article .box-price .price-list div dd {
  font-size: inherit;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div dd {
    flex-direction: column;
  }
}
#afSite-page.system section article .box-price .price-list div dd .price-regular {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: max(12px, 1.5em);
  font-weight: 300;
  letter-spacing: 0.1em;
  display: flex;
  margin-right: 0.5em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div dd .price-regular {
    font-size: max(12px, 1.125em);
    margin-right: unset;
  }
}
#afSite-page.system section article .box-price .price-list div dd .price-regular::before {
  content: "定価";
  font-size: 0.9em;
}
#afSite-page.system section article .box-price .price-list div dd .price-regular::after {
  font-size: 0.9em;
  content: "円→";
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div dd .price-regular::after {
    content: "円↓";
  }
}
#afSite-page.system section article .box-price .price-list div dd .price-sale {
  font-size: max(12px, 4em);
  font-weight: 300;
  display: flex;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .price-list div dd .price-sale {
    font-size: max(12px, 3.5em);
  }
}
#afSite-page.system section article .box-price .price-list div dd .price-sale::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "円";
}
#afSite-page.system section article .box-price .list-option {
  position: relative;
  font-size: inherit;
  display: grid;
  grid-template-columns: 40% 1fr;
}
#afSite-page.system section article .box-price .list-option > div {
  border-bottom: 1px solid hsl(0, 0%, 95%);
  font-size: inherit;
  grid-column: span 2;
  display: grid;
  grid-template-columns: subgrid;
  padding-block: 1em;
  gap: 0 2em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .list-option > div {
    gap: 0 4vw;
  }
}
#afSite-page.system section article .box-price .list-option > div dt {
  font-size: max(12px, 1.25em);
  text-align: right;
  align-self: center;
}
#afSite-page.system section article .box-price .list-option > div dd {
  font-size: inherit;
  display: flex;
  align-items: center;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .list-option > div dd {
    flex-direction: column;
  }
}
#afSite-page.system section article .box-price .list-option > div dd em {
  font-size: max(12px, 2.25em);
  font-weight: 300;
}
#afSite-page.system section article .box-price .list-option > div dd i {
  font-size: max(12px, 1.25em);
  margin-inline: 0.1em;
}
#afSite-page.system section article .box-price .list-option > div dd .item-price {
  font-size: max(12px, 2.875em);
  display: flex;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-price .list-option > div dd .item-price {
    font-size: max(12px, 2.5em);
  }
}
#afSite-page.system section article .box-price .list-option > div dd .item-price::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "円";
}
#afSite-page.system section article .box-price .caution {
  grid-column: span 2;
  text-align: center;
  font-size: max(12px, 1.125em);
}
#afSite-page.system section article .box-chihiro {
  position: relative;
  font-size: inherit;
  display: flex;
  flex-direction: column;
  gap: 1em 0;
  z-index: 1;
  margin-top: 3em;
}
#afSite-page.system section article .box-chihiro h3 {
  color: #ffc400;
}
#afSite-page.system section article .box-chihiro::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  background-color: #801f19;
  width: calc(100% + 3em);
  height: calc(100% + 5em);
  z-index: -1;
  border-radius: 2em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-chihiro::before {
    width: calc(100% + 10vw);
    height: calc(100% + 5em);
    translate: 0 -50%;
    right: -6vw;
    left: unset;
    border-radius: 4vw 0 0 4vw;
  }
}
#afSite-page.system section article .box-chihiro .price-list {
  position: relative;
  display: grid;
  grid-template-columns: auto auto;
  font-size: inherit;
  justify-content: center;
  gap: 0.3em 0;
}
#afSite-page.system section article .box-chihiro .price-list div {
  position: relative;
  grid-column: span 2;
  display: grid;
  grid-template-columns: subgrid;
  font-size: inherit;
  padding-inline: 2em;
  gap: 0 2em;
}
#afSite-page.system section article .box-chihiro .price-list div dt {
  display: flex;
  justify-content: flex-end;
  font-size: max(12px, 4em);
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-chihiro .price-list div dt {
    font-size: max(12px, 3.5em);
  }
}
#afSite-page.system section article .box-chihiro .price-list div dt::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "分";
}
#afSite-page.system section article .box-chihiro .price-list div dd {
  font-size: inherit;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#afSite-page.system section article .box-chihiro .price-list div dd .price-sale {
  font-size: max(12px, 4em);
  display: flex;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .box-chihiro .price-list div dd .price-sale {
    font-size: max(12px, 3.5em);
  }
}
#afSite-page.system section article .box-chihiro .price-list div dd .price-sale::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "円";
}
#afSite-page.system section article .box-chihiro .list-option {
  position: relative;
  font-size: inherit;
  display: grid;
  grid-template-columns: 50% 1fr;
}
#afSite-page.system section article .box-chihiro .list-option > div {
  border-bottom: 1px solid hsl(0, 0%, 95%);
  font-size: inherit;
  grid-column: span 2;
  display: grid;
  grid-template-columns: subgrid;
  padding-block: 1em;
  gap: 0 2em;
}
#afSite-page.system section article .box-chihiro .list-option > div dt {
  font-size: max(12px, 1.5em);
  text-align: right;
  align-self: center;
}
#afSite-page.system section article .box-chihiro .list-option > div dd {
  font-size: inherit;
  display: flex;
  align-items: center;
}
#afSite-page.system section article .box-chihiro .list-option > div dd .item-price {
  font-size: max(12px, 2.875em);
  display: flex;
}
#afSite-page.system section article .box-chihiro .list-option > div dd .item-price::after {
  font-size: 0.328em;
  display: flex;
  align-items: flex-end;
  line-height: 2.1em;
  content: "円";
}
#afSite-page.system section article .box-chihiro .caution {
  grid-column: span 2;
  text-align: center;
  font-size: max(12px, 1.125em);
}
#afSite-page.system section article .box-chihiro a {
  align-self: center;
  background-color: hsl(0, 100%, 35%);
  border: 1px solid hsl(0, 0%, 95%);
  border-radius: 100vmax;
  font-size: max(12px, 1.125em);
  padding: 0.5em 5em;
  margin-top: 2rem;
}
#afSite-page.system section article .text_parking {
  font-size: max(12px, 1.5em);
  text-align: right;
  padding-right: 3em;
  margin-top: 1em;
  letter-spacing: 0.08em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article .text_parking {
    text-align: center;
    padding-right: unset;
  }
}
#afSite-page.system section article nav {
  position: relative;
  font-size: 1em;
  width: 80%;
  display: flex;
  flex-direction: column;
  gap: 1em 0;
  align-self: center;
  margin-top: 5em;
  z-index: 1;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article nav {
    width: 100%;
    margin-top: unset;
  }
}
#afSite-page.system section article nav h2 {
  align-items: flex-start;
  gap: 0.3em 0;
}
#afSite-page.system section article nav .view-more {
  position: absolute;
  bottom: 2em;
  right: 2em;
}
#afSite-page.system section article nav p {
  font-size: max(12px, 0.875em);
  line-height: 1.8em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article nav p {
    margin-bottom: 6vw;
  }
}
#afSite-page.system section article nav .box_magazine {
  position: relative;
  font-size: 1em;
  padding: 2em;
  display: flex;
  flex-direction: column;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article nav .box_magazine {
    justify-content: flex-start;
    padding: 2em 2em 4em;
  }
}
#afSite-page.system section article nav .box_magazine::before, #afSite-page.system section article nav .box_magazine::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#afSite-page.system section article nav .box_magazine::before {
  background: url(../img/magazine_bg.webp) no-repeat center center/cover;
}
#afSite-page.system section article nav .box_magazine::after {
  background-color: rgba(178.5, 0, 0, 0.7);
}
#afSite-page.system section article nav .box_credit {
  position: relative;
  font-size: 1em;
  display: flex;
  flex-direction: column;
  padding: 2em;
}
@media (max-width: 767px) and (orientation: portrait) {
  #afSite-page.system section article nav .box_credit {
    padding: 2em 2em 4em;
  }
}
#afSite-page.system section article nav .box_credit::before, #afSite-page.system section article nav .box_credit::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#afSite-page.system section article nav .box_credit::before {
  background: url(../img/credit_bg.webp) no-repeat center center/cover;
}
#afSite-page.system section article nav .box_credit::after {
  background-color: rgba(40, 40, 40, 0.7);
}
#afSite-page.system section article nav .box_credit ul {
  display: grid;
  font-size: 1em;
  grid-template-columns: repeat(4, 1fr);
  width: 70%;
  max-width: 28rem;
  gap: 0 0.8em;
  margin-top: 2em;
}
#afSite-page.system section article nav .box_credit ul li {
  background-color: #fff;
  font-size: 1em;
  display: flex;
  align-items: center;
  height: 2.4em;
  border-radius: 0.5em;
}
#afSite-page.system section article nav .box_credit ul li img {
  width: 70%;
  margin: 0 auto;
}
#afSite-page.system section article nav .box_credit ul li.amex {
  background-color: rgb(9, 81, 161);
}
#afSite-page.system section article nav .box_credit ul li.amex img {
  width: 80%;
}
#afSite-page.system section article nav .box_credit ul li.jcb img {
  width: 50%;
}
#afSite-page.system section article .map-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1.4;
}
#afSite-page.system section article .map-wrap iframe {
  width: 100%;
  height: 100%;
}
#afSite-page.system section article .add-wrap {
  font-size: 1em;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: center;
  gap: 0.2em 0;
  margin-top: 1em;
}
#afSite-page.system section article .add-wrap span,
#afSite-page.system section article .add-wrap a {
  font-size: max(12px, 0.875em);
}

/*# sourceMappingURL=system.css.map */
