@charset "UTF-8";
/* //////////////////////////////////////////////////

Title : style.scss
For   : Page/feature/2025/250327_official/

Created       : 2025-03-18
Last Modified : 2025-03-27

==========================================

Content

////////////////////////////////////////////////// */
/**
 * variables, layouts
 */

 html {
  font-size: 62.5%;
}

#FR250327official {
  --color-dark: #000000;
  --color-gray: #58595B;
  --color-white: #ffffff;
  --color-blue: #97B9CE;
  --font-hiragino: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "MS PMincho", "MS Mincho", serif;
  --font-yu-mincho: "游明朝", "YuMincho", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  --font-en: "minion-pro-display", serif;
  --font-ja: "ryo-display-plusn", serif;
  --font-weight-display: 400;
  --font-weight-m: 500;
  overflow: clip;
}

#FR250327official {
  width: 100%;
  margin-inline: auto;
  border-bottom: 1px solid var(--color-dark);
}

/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  #FR250327official {
    --rate: 100vw / 750;
    -webkit-padding-after: min(146 * var(--rate),146px);
            padding-block-end: min(146 * var(--rate),146px);
  }
  #FR250327official .hidden-sml {
    display: none !important;
  }
  .archive {
    border-top: none !important;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  #FR250327official {
    --rate: 100vw/1400;
    -webkit-padding-after: min(134 * var(--rate),134px);
            padding-block-end: min(134 * var(--rate),134px);
  }
  #FR250327official .hidden-lrg {
    display: none !important;
  }
}

/* --- for middle viewport --- */
@media screen and (min-width: 768px) and (max-width: 1400px) {
  html {
    font-size: 0.7142857143vw;
  }
}
/**
 * common
 */
.lpFrayID img,
.lpFrayID picture {
  display: var(--display, block);
}
.lpFrayID img {
  width: 100%;
  height: auto;
}
.lpFrayID a {
  display: var(--display, inline-block);
}
.lpFrayID .credit-tate a {
  display: var(--display, block);
}
.lpFrayID a:has(img) {
  --display: block;
}
.lpFrayID * {
  font-feature-settings: "palt" 1;
  font-family: var(--font-family, var(--font-ja));
  font-weight: var(--font-weight, 400);
  color: var(--font-color, var(--color-dark));
  box-sizing: border-box;
  text-align: var(--text-align, initial);
}
.lpFrayID .en {
  --font-family: var(--font-en);
}
.lpFrayID .ja {
  --font-family: var(--font-ja);
}
.lpFrayID__section {
  max-width: 1400px;
  width: 100%;
  margin-inline: auto;
  position: relative;
}

/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .lpFrayID {
    overflow-x: hidden;
  }
  .main-inner .archive {
    padding-bottom: 12.9333333333vw !important;
  }
}
/**
 * firstview
 */
.firstview__lead {
  position: relative;
  margin-inline: auto;
}
.firstview__title {
  position: absolute;
  pointer-events: none;
}
.firstview__details {
  --text-align: center;
}
.firstview__heading {
  line-height: 1;
}
.firstview__heading > span {
  --font-weight: 600;
  display: block;
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .firstview__heading > span {
    font-family: var(--font-yu-mincho);
  }
  .firstview__lead {
    max-width: 1200px;
  }
  .firstview__title {
    width: min(410* var(--rate),410px);
    left: min(61* var(--rate),61px);
    bottom: min(52* var(--rate),52px);
  }
  .firstview__details {
    -webkit-margin-before: min(59* var(--rate),59px);
    margin-block-start: min(59* var(--rate),59px);
  }
  .firstview__description {
    --font-family: var(--font-ja);
    -webkit-margin-before: min(27* var(--rate),27px);
    margin-block-start: min(27* var(--rate),27px);
    font-size: min(13* var(--rate),13px);
    line-height: 2;
    letter-spacing: 0.14em;
    font-weight: var(--font-weight-m);
    color: var(--color-gray);
  }
  .text_anim p {
    font-family: var(--font-en);
    font-size: min(54 * (100vw/1400), 54px);
    letter-spacing: 0.06em;
    line-height: 1.1;
    margin: 0;
    text-align: left;
    color: #9a3a49;
  }
  .text_anim span {
    opacity: 0;
    display: inline-block;
    transform: translateY(min(5 * (100vw/1400), 5px));
    transition: opacity 0.5s ease, transform 0.5s ease;
    font-family: var(--font-en);
    font-weight: 400;
    font-style: normal;
    position: relative;
    z-index: 10;
    color: #9a3a49;
  }
  .text_anim p:nth-child(4) {
    padding-top: min(13 * (100vw/1400), 13px);
  }
  
  .text_anim p:nth-child(n+4) {
    font-size: min(21 * (100vw/1400), 21px);
    letter-spacing: 0.06em;
    margin-top: min(1 * (100vw/1400), 1px);
    line-height: 1.32;
    padding-left: min(2 * (100vw/1400), 2px);
  }
  .lpFrayID .credit-tate a::after {
    display: none;
  }
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .firstview__title {
    width: min(428 * var(--rate),428px);
    left: min(37 * var(--rate),37px);
    bottom: min(80 * var(--rate),80px);
  }
  .firstview__details {
    -webkit-margin-before: min(110* var(--rate),110px);
    margin-block-start: min(110* var(--rate),110px);
  }
  .firstview__heading--secondary {
    font-size: min(27 * var(--rate),27px);
    letter-spacing: 0.14em;
  }
  .firstview__heading--primary {
    -webkit-margin-before: min(30 * var(--rate),30px);
            margin-block-start: min(30 * var(--rate),30px);
    font-size: min(36 * var(--rate),36px);
    letter-spacing: 0.14em;
  }
  .firstview__description {
    -webkit-margin-before: min(35* var(--rate),35px);
    margin-block-start: min(35* var(--rate),35px);
    font-size: min(26* var(--rate),26px);
    line-height: 2;
    letter-spacing: 0.14em;
    font-weight: var(--font-weight-m);
    color: var(--color-gray);
  }
}
/**
 * main contents: common
 */
.mainContents__section, .mainContents__shell, .mainContents__block {
  position: relative;
}
.mainContents__section--footer {
  --font-family: var(--font-en);
  --text-align: center;
}
.mainContents__block {
  display: grid;
}
.mainContents__cell--decoration {
  position: absolute;
  pointer-events: none;
}
.mainContents__styling {
  position: relative;
}
.mainContents__styling::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: -1;
}
.mainContents__heading--body {
  display: inline-block;
}
.mainContents__description {
  --text-align: justify;
  line-height: 2;
  line-break: strict;
}
.mainContents__prices {
  --font-color: var(--color-gray);
  --font-family: var(--font-en);
  position: relative;
}
.mainContents__prices > a:not(:last-child)::after {
  content: ",";
}
.mainContents__prices > .colon_none::after {
  display: none;
}
.mainContents__button {
  display: block;
  margin-inline: auto;
}
.mainContents__staff-credit {
  --font-color: var(--color-gray);
  line-height: 1.75;
}
.mainContents__details {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  /* transform: rotate(90deg); */
}
.mainContents__heading {
  /* font-size: min(17 * (100vw/1400), 17px);
  font-family: var(--font-en);
  letter-spacing: 0.1em;
  font-weight: var(--font-weight-display);
  line-height: 1.1764705882; */
  position: var(--position, relative);
}
.mainContents__img_title {
  color: var(--color-blue);
  font-family: var(--font-en);
  font-weight: var(--font-weight-display);
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.mainContents__section--footer .c-text_btn {
  width: fit-content;
  margin-inline: auto;
  font-size: min(22 * (100vw/1400), 22px);
  line-height: 1.4;
  letter-spacing: 0.1em;
  font-family: var(--font-en);
  font-weight: var(--font-weight-display);
  color: var(--color-dark);
  border-bottom: min(3 * (100vw/1400), 3px) double var(--color-gray);
  /* padding-bottom: 0.3rem; */
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .mainContents__section + * {
    -webkit-margin-before: var(--section-spacer, min(140 * var(--rate),140px));
            margin-block-start: var(--section-spacer, min(140 * var(--rate),140px));
  }
  .mainContents__section--footer {
    letter-spacing: 0.075em;
  }
  .mainContents__description {
    font-size: min(13 * var(--rate),13px);
    letter-spacing: 0.16em;
    font-family: var(--font-yu-mincho);
  }
  .mainContents__heading {
    --headig-spacer: min(7* var(--rate),7px);
}
  .mainContents__prices {
    -webkit-margin-before: var(--price-spacer, min(24 * var(--rate),24px));
            margin-block-start: var(--price-spacer, min(24 * var(--rate),24px));
    font-size: min(12 * var(--rate),12px);
    line-height: 1.75;
    letter-spacing: 0.1em;
  }
  .mainContents__prices > * {
    --prices-spacer: .1em;
  }
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .mainContents__section + * {
    -webkit-margin-before: var(--section-spacer, min(190 * var(--rate),190px));
            margin-block-start: var(--section-spacer, min(190 * var(--rate),190px));
  }
  .mainContents__heading {
    font-size: min(30 * var(--rate),30px);
    --headig-spacer: min(15* var(--rate),15px);
  }
  .mainContents__description {
    font-size: min(24 * var(--rate),24px);
    letter-spacing: 0.14em;
  }
  .mainContents__prices {
    -webkit-margin-before: var(--price-spacer, min(28 * var(--rate),28px));
            margin-block-start: var(--price-spacer, min(28 * var(--rate),28px));
    font-size: min(24* var(--rate),24px);
    line-height: 1.85;
    letter-spacing: 0.09em;
  }
  .mainContents__prices > * {
    --prices-spacer: .09em;
  }
  .mainContents__section--footer .c-text_btn {
    font-size: min(44*(100vw / 750));
    line-height: 1.25;
    letter-spacing: 0.09em;
    border-bottom: min(6*100vw/750) double var(--color-gray);
    padding-bottom: min(11*100vw/750);
  }
}
/**
 * main contents: each contents
 */
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .mainContents {
    -webkit-margin-before: min(93 * var(--rate),93px);
            margin-block-start: min(93 * var(--rate),93px);
  }

  .mainContents__block01 {
    width: min(880 * (100vw/1400), 880px);
    height: min(1120 * (100vw/1400), 1120px);
    margin-left: min(240 * (100vw/1400), 240px);
    display: flex;
    justify-content: space-between;
    position: relative;
  }
  .mainContents__block01 .mainContents__cell01 {
    width: min(550 * (100vw/1400), 550px);
  }
  .mainContents__block01 .mainContents__cell02 {
    width: min(380 * (100vw/1400), 380px);
    position: absolute;
    left: min(500 * (100vw/1400), 500px);
    top: min(550 * (100vw/1400), 550px);
    z-index: 2;
  }
  .mainContents__block01 .mainContents__details {
    top: max(-1*(100vw / 1400), -1px);
    left: min(19.5*(100vw / 1400), 19.5px);
    /* color: var(--color-white); */
    width: min(26.6*(100vw / 1400), 26.6px);
  }
  /* .mainContents__block01 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-white);
  } */
  .mainContents__block01 .mainContents__heading--body {
    color: var(--color-white);
    padding-left: min(60 * (100vw/1400), 60px);
  }
  .mainContents__block01 .mainContents__img_title {
    display: block;
    width: min(32.3887 * (100vw/1400), 32.3887px);
    /* font-size: min(44*(100vw / 1400), 44px);
    transform: rotate(90deg); */
    position: absolute;
    top: max(-39*(100vw / 1400), -39px);
    right: max(-72*(100vw / 1400), -72px);
  }
  .mainContents__block01 .mainContents__img_title span {
    color: var(--color-blue);
    font-family: var(--font-en);
    font-weight: var(--font-weight-display);
    letter-spacing: 0.06em;
    white-space: nowrap;
  }
  .mainContents__block02 {
    margin-top: min(180 * (100vw/1400), 180px);
  }
  .mainContents__block02 .mainContents__cell01 {
    width: min(460 * (100vw/1400), 460px);
    position: relative;
    margin-left: min(470 * (100vw/1400), 470px);
  }
  .mainContents__block02 .mainContents__details {
    top: min(0*(100vw / 1400), 0px);
    right: min(18*(100vw / 1400), 18px);
    width: min(27*(100vw / 1400), 27px);
  }
  /* .mainContents__block02 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block02 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(30 * (100vw/1400), 30px);
  }
  .mainContents__block02 .mainContents__img_title {
    font-size: min(47 * (100vw/1400), 47px);
    transform: rotate(-90deg);
    position: absolute;
    top: min(504 * (100vw/1400), 504px);
    left: max(-259 * (100vw/1400), -259px);
  }
  .mainContents__block02 .mainContents__cell02 {
    width: min(1250 * (100vw/1400), 1250px);
    margin-top: min(119 * (100vw/1400), 119px);
    margin-left: min(150 * (100vw/1400), 150px);
    position: relative;
    display: flex;
    justify-content: space-between;
    height: min(950 * (100vw/1400), 950px);
  }
  .mainContents__block02 .mainContents__cell02 .mainContents__flex01 {
    width: min(400 * (100vw/1400), 400px);
    position: relative;
    z-index: 3;
  }
  .mainContents__block02 .mainContents__cell02 .mainContents__flex02 {
    position: absolute;
    width: min(990 * (100vw/1400), 990px);
    top: min(290 * (100vw/1400), 290px);
    left: min(260 * (100vw/1400), 260px);
  }
  .mainContents__block02 .mainContents__prices {
    text-align: right;
  }

  .mainContents__block03 {
    margin-top: min(242 * (100vw/1400), 242px);
  }
  .mainContents__block03 .mainContents__cell01 {
    width: min(850 * (100vw/1400), 850px);
    margin-left: 0;
    display: flex;
    justify-content: space-between;
    row-gap: min(10 * (100vw/1400), 10px);
  }
  .mainContents__block03 .mainContents__cell01 .mainContents__flex01 {
    width: min(420 * (100vw/1400), 420px);
    position: relative;
  }
  .mainContents__block03 .mainContents__cell01 .mainContents__flex02 {
    width: min(420 * (100vw/1400), 420px);
  }
  .mainContents__block03 .mainContents__details {
    top: min(0*(100vw / 1400), 0px);
    left: min(19.5*(100vw / 1400), 19.5px);
    width: min(26.5*(100vw / 1400), 26.5px);
  }
  /* .mainContents__block03 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block03 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(30 * (100vw/1400), 30px);
  }
  .mainContents__block03 .mainContents__cell02 {
    width: min(480 * (100vw/1400), 480px);
    margin-top: min(80 * (100vw/1400), 80px);
    margin-left: min(730 * (100vw/1400), 730px);
    position: relative;
  }
  .mainContents__block03 .mainContents__img_title {
    font-size: min(44 * (100vw/1400), 44px);
    transform: rotate(-90deg);
    position: absolute;
    top: min(337 * (100vw/1400), 337px);
    left: max(-332 * (100vw/1400), -332px);
  }
  .mainContents__block03 .mainContents__prices{
    position: absolute;
    top: min(576 * (100vw/1400), 576px);
    right: max(-161 * (100vw/1400), -161px);
  }

  .mainContents__block04 {
    margin-top: min(180 * (100vw/1400), 180px);
  }
  .mainContents__block04 .mainContents__cell01 {
    width: min(570 * (100vw/1400), 570px);
    position: relative;
    margin: 0 auto;
  }
  .mainContents__block04 .mainContents__details {
    top: min(0*(100vw / 1400), 0px);
    right: min(19.5*(100vw / 1400), 19.5px);
    width: min(26.5*(100vw / 1400), 26.5px);
  }
  /* .mainContents__block04 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block04 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(30 * (100vw/1400), 30px);
  }
  .mainContents__block04 .mainContents__img_title {
    font-size: min(47 * (100vw/1400), 47px);
    text-align: center;
    margin-left: min(3 * (100vw/1400), 3px);
  }
  .mainContents__block04 .mainContents__cell02 {
    width: min(440 * (100vw/1400), 440px);
    margin: 0 auto;
    margin-top: min(35 * (100vw/1400), 35px);
  }
  .mainContents__block04 .mainContents__cell02 .mainContents__styling {
    margin-top: min(31 * (100vw/1400), 31px);
  }
  .mainContents__block04 .mainContents__prices {
    text-align: center;
  }

  .mainContents__block05 {
    width: min(980 * (100vw/1400), 980px);
    margin-top: min(176 * (100vw/1400), 176px);
    margin-left: min(190 * (100vw/1400), 190px);
    display: flex;
    justify-content: space-between;
    row-gap: min(80 * (100vw/1400), 80px);
    position: relative;
  }
  .mainContents__block05 .mainContents__cell01 {
    width: min(500 * (100vw/1400), 500px);
  }
  .mainContents__block05 .mainContents__details {
    top: min(0*(100vw / 1400), 0px);
    left: min(19*(100vw / 1400), 19px);
    width: min(27*(100vw / 1400), 27px);
  }
  /* .mainContents__block05 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block05 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(30 * (100vw/1400), 30px);
  }
  .mainContents__block05 .mainContents__cell02 {
    width: min(400 * (100vw/1400), 400px);
    margin-top: min(420 * (100vw/1400), 420px);
    position: relative;
  }
  .mainContents__block05 .mainContents__img_title {
    font-size: min(44 * (100vw/1400), 44px);
    transform: rotate(90deg);
    position: absolute;
    top: min(396 * (100vw/1400), 396px);
    right: max(-278 * (100vw/1400), -278px);
  }

  .mainContents__section--footer {
    --section-spacer: min(175 * var(--rate),175px);
  }
  .mainContents__button {
    width: min(123 * var(--rate),123px);
    border-bottom: min(3 * var(--rate),3px) double var(--color-gray);
    -webkit-padding-after: min(10 * var(--rate),10px);
            padding-block-end: min(10 * var(--rate),10px);
  }
  .mainContents__staff-credit {
    -webkit-margin-before: min(136 * var(--rate),136px);
            margin-block-start: min(136 * var(--rate),136px);
    font-size: min(14 * var(--rate),14px);
    letter-spacing: 0.1em;
  }
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .mainContents {
    -webkit-margin-before: min(144 * var(--rate),144px);
            margin-block-start: min(144 * var(--rate),144px);
  }

  .mainContents__block01 {
    width: min(750*(100vw / 750),750px);
    height: auto;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-direction: column;
  }
  .mainContents__block01 .mainContents__cell01 {
    width: 100%;
  }
  .mainContents__block01 .mainContents__cell02 {
    width: min(560*(100vw / 750),560px);
    position: relative;
    margin-left: min(190*(100vw / 750),190px);
    margin-top: min(110*(100vw / 750),110px);
  }
  .mainContents__block01 .mainContents__details {
    top: 0px;
    left: 15px;
    width: 24.2px;
  }
  /* .mainContents__block01 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-white);
  } */
  .mainContents__block01 .mainContents__heading--body {
    color: var(--color-white);
    padding-left: min(40*(100vw / 750),40px);
  }
  .mainContents__block01 .mainContents__img_title {
    /* font-size: min(62*(100vw / 750),62px);
    transform: rotate(-90deg); */
    display: block;
    position: absolute;
    top: -26px;
    left: -47px;
    width: 23px;
  }
  .mainContents__block01 .mainContents__prices {
    text-align: right;
    padding-right: min(37*(100vw / 750),37px);
  }
  /* .mainContents__block02 {
    margin-top: min(190*(100vw / 750));
  } */
  .mainContents__block02 .mainContents__cell01 {
    width: min(650*(100vw / 750),650px);
    position: relative;
    margin-left: min(100*(100vw / 750),100px);
  }
  .mainContents__block02 .mainContents__details {
    top: 0px;
    right: 14.5px;
    width: 23.9px;
  }
  /* .mainContents__block02 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block02 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(40*(100vw / 750),40px);
  }
  .mainContents__block02 .mainContents__img_title {
    font-size: min(66*(100vw / 750),66px);
    transform: rotate(90deg);
    position: absolute;
    top: min(202*(100vw / 750),202px);
    left: initial;
    right: max(-356*(100vw / 750),-356px);
  }
  .mainContents__block02 .mainContents__cell02 {
    width: min(750*(100vw / 750),750px);
    margin: 0 auto;
    margin-top: min(110*(100vw / 750),110px);
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: auto;
  }
  .mainContents__block02 .mainContents__cell02 .mainContents__flex01 {
    width: min(580*(100vw / 750),580px);
  }
  .mainContents__block02 .mainContents__cell02 .mainContents__flex02 {
    position: static;
    width: min(750*(100vw / 750),750px);
    margin: 0 auto;
    margin-top: 40px;
  }
  .mainContents__block02 .mainContents__prices {
    text-align: center;
  }

  /* .mainContents__block03 {
    margin-top: 24.2rem;
  } */
  .mainContents__block03 .mainContents__cell01 {
    width: min(640*(100vw / 750),640px);
    height: min(1460*(100vw / 750),1460px);
    margin-left: min(60*(100vw / 750),60px);
    position: relative;
  }
  .mainContents__block03 .mainContents__cell01 .mainContents__flex01 {
    width: min(540*(100vw / 750),540px);
    position: relative;
    z-index: 3;
  }
  .mainContents__block03 .mainContents__cell01 .mainContents__flex02 {
    width: min(460*(100vw / 750),460px);
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .mainContents__block03 .mainContents__details {
    top: 0;
    left: 15px;
    width: 24.3px;
  }
  /* .mainContents__block03 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block03 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(40*(100vw / 750),40px);
  }
  .mainContents__block03 .mainContents__cell02 {
    width: min(600*(100vw / 750),600px);
    margin-top: min(79*(100vw / 750),79px);
    margin-left: min(150*(100vw / 750),150px);
    position: relative;
  }
  .mainContents__block03 .mainContents__img_title {
    font-size: min(62*(100vw / 750),62px);
    transform: rotate(-90deg);
    position: absolute;
    top: min(416*(100vw / 750),416px);
    left: max(-462*(100vw / 750),-462px);
  }
  .mainContents__block03 .mainContents__prices{
    position: static;
    text-align: right;
    padding-right: min(37*(100vw / 750));
  }
  .mainContents__block03 .credit-tate a {
    display: inline-block;
  }

  /* .mainContents__block04 {
    margin-top: 18rem;
  } */
  .mainContents__block04 .mainContents__cell01 {
    width: min(750*(100vw / 750),750px);
    position: relative;
    margin: 0 auto;
  }
  .mainContents__block04 .mainContents__details {
    top: 0;
    right: 14px;
    width: 24px;
  }
  /* .mainContents__block04 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block04 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(40*(100vw / 750),40px);
  }
  .mainContents__block04 .mainContents__img_title {
    font-size: min(66*(100vw / 750),66px);
    text-align: center;
    margin-left: min(5*(100vw / 750),5px);
  }
  .mainContents__block04 .mainContents__cell02 {
    width: min(580*(100vw / 750),580px);
    margin: 0 auto;
    margin-top: min(52*(100vw / 750),52px);
  }
  .mainContents__block04 .mainContents__cell02 .mainContents__styling {
    margin-top: min(49*(100vw / 750),49px);
  }
  .mainContents__block04 .mainContents__prices {
    text-align: center;
  }

  .mainContents__block05 {
    width: min(750*(100vw / 750),750px);
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    row-gap: 0;
    flex-direction: column;
    position: relative;
  }
  .mainContents__block05 .mainContents__cell01 {
    width: min(660*(100vw / 750),660px);
    margin-left: min(90*(100vw / 750),90px);
  }
  .mainContents__block05 .mainContents__details {
    top: 0;
    left: 59.5px;
    width: 23.8px;
  }
  /* .mainContents__block05 .mainContents__heading {
    -webkit-padding-after: var(--headig-spacer);
    padding-block-end: var(--headig-spacer);
    border-bottom: 1px solid var(--color-dark);
  } */
  .mainContents__block05 .mainContents__heading--body {
    color: var(--color-dark);
    padding-left: min(40*(100vw / 750),40px);
  }
  .mainContents__block05 .mainContents__cell02 {
    width: min(600*(100vw / 750),600px);
    margin-top: min(110*(100vw / 750),110px);
    position: relative;
  }
  .mainContents__block05 .mainContents__img_title {
    font-size: min(62*(100vw / 750),62px);
    transform: rotate(90deg);
    position: absolute;
    top: min(236*(100vw / 750),236px);
    right: max(-386*(100vw / 750),-386px);
  }
  .mainContents__block05 .mainContents__prices {
    padding-left: min(40*(100vw / 750),40px);
  }

  .mainContents__section--footer {
    --section-spacer: min(185 * var(--rate),185px);
  }
  .mainContents__button {
    width: min(221 * var(--rate),221px);
    -webkit-padding-after: min(21 * var(--rate),21px);
            padding-block-end: min(21 * var(--rate),21px);
    border-bottom: min(6 * var(--rate),6px) double var(--color-gray);
  }
  .mainContents__staff-credit {
    -webkit-margin-before: min(146 * var(--rate),146px);
            margin-block-start: min(146 * var(--rate),146px);
    font-size: min(25 * var(--rate),25px);
    letter-spacing: 0.09em;
  }
}
/**
 * animation
 */
.js-animation-trigger.anim-zoom-in {
  overflow: hidden;
}
.js-animation-trigger.anim-zoom-in img {
  opacity: 0;
  transform: scale(1.1);
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-animation-trigger.anim-zoom-in.is-active img {
  opacity: 1;
  transform: scale(1);
}
.js-animation-trigger.anim-fade-toLeft {
  opacity: 0;
  transform: translateX(5%);
}
.js-animation-trigger.anim-fade-toLeft.is-active {
  opacity: 1;
  transform: translateX(0);
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-animation-trigger.anim-fade-toRight {
  opacity: 0;
  transform: translateX(-5%);
}
.js-animation-trigger.anim-fade-toRight.is-active {
  opacity: 1;
  transform: translateX(0);
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-animation-trigger.anim-fade-toTop {
  opacity: 0;
  transform: translateY(5%);
}
.js-animation-trigger.anim-fade-toTop.is-active {
  opacity: 1;
  transform: translateY(0);
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-animation-trigger.anim-fade-toBottom {
  opacity: 0;
  transform: translateY(-5%);
}
.js-animation-trigger.anim-fade-toBottom.is-active {
  opacity: 1;
  transform: translateY(0);
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-animation-trigger.anim-fade-in {
  opacity: 0;
}
.js-animation-trigger.anim-fade-in.is-active {
  opacity: 1;
  transition: all 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .js-animation-trigger.mainContents__heading {
    transition: all 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  .js-animation-trigger.mainContents__heading01 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading01 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading02 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading02 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading03 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading03 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading04 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading04 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading05 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading05 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading.is-active {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
  }
  .js-animation-trigger.mainContents__heading.is-active .mainContents__heading--body {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
  }
  .js-animation-trigger .mainContents__heading--body {
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .js-animation-trigger.mainContents__heading {
    transition: all 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  .js-animation-trigger.mainContents__heading01 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading01 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading02 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading02 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading03 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading03 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading04 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading04 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading05 {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  .js-animation-trigger.mainContents__heading05 .mainContents__heading--body {
    -webkit-clip-path: inset(0 100% 0 0);
            clip-path: inset(0 100% 0 0);
  }
  .js-animation-trigger.mainContents__heading.is-active {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
  }
  .js-animation-trigger.mainContents__heading.is-active .mainContents__heading--body {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
  }
  .js-animation-trigger .mainContents__heading--body {
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}