@charset "UTF-8";
/*--------------------------------------*
* 基本設定
*--------------------------------------*/
/*--------------------------------------*
* ベースカラー
*--------------------------------------*/
/*--------------------------------------*
* フォント
*--------------------------------------*/
/*--------------------------------------*
* ブレイクポイント
*--------------------------------------*/
/*--------------------------------------*
* vw変換(SP用)
*--------------------------------------*/
/*--------------------------------------*
* vw変換(PC用)
*--------------------------------------*/
/*--------------------------------------*
* デフォルトスタイル
*--------------------------------------*/
html,
body {
  width: 100%;
  font-size: 16px;
  margin: 0 auto;
  font-family: "zen-kaku-gothic-antique", sans-serif; /* R:400,M:500 */
  scroll-behavior: smooth;
}

img,
video,
object {
  width: 100%;
  border: none;
  display: block;
  pointer-events: none;
}

@media screen and (min-width: 769px) {
  .spNone {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .spNone {
    display: none;
  }
}

@media screen and (min-width: 769px) {
  .pcNone {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .pcNone {
    display: block;
  }
}

@media print {
  img {
    display: none;
  }
}
/*--------------------------------------*
* aタグ
*--------------------------------------*/
a {
  display: block;
  text-decoration: none;
  transition: all 0.4s;
  color: #000;
}
@media screen and (min-width: 769px) {
  a:hover {
    opacity: 0.6;
    transition: all 0.4s;
  }
}
a[href=""] {
  pointer-events: none;
}

/*--------------------------------------*
* ローディング
*--------------------------------------*/
#loading-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 999;
}

/*-------------------
* コンテンツのスタイル
-------------------*/
/*--------------------------------------*
* 基本設定
*--------------------------------------*/
/*--------------------------------------*
* FV
*--------------------------------------*/
/*--------------------------------------*
* 基本設定
*--------------------------------------*/
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.opacity {
  opacity: 0;
}

@keyframes maskLeft {
  0% {
    mask-position: left;
    -webkit-mask-position: left;
  }
  100% {
    mask-position: right;
    -webkit-mask-position: right;
  }
}
@keyframes maskRight {
  0% {
    mask-position: right;
    -webkit-mask-position: right;
  }
  100% {
    mask-position: left;
    -webkit-mask-position: left;
  }
}
.mask_left {
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
}

.mask_right {
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
}

.mask_full {
  clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
}

@keyframes zoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}
@keyframes zoomOut {
  0% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
figure.zoom {
  overflow: hidden;
}

/*--------------------------------------*
* セクション共通
*--------------------------------------*/
.content {
  overflow: clip;
}

main {
  overflow: clip; /* 変更なし */
}

/*--------------------------------------*
ローディング
*--------------------------------------*/
#loading {
  background-color: #fdffda;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100vh;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s, visibility 1s;
}
#loading.is-active {
  opacity: 1;
  visibility: visible;
}
#loading.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#loading .loading__wrapper {
  position: absolute;
  left: 50%;
  transform: translate(-50%);
}
@media screen and (max-width: 768px) {
  #loading .loading__wrapper {
    top: 34%;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__wrapper {
    top: 37%;
  }
}
#loading .loading__img {
  overflow: clip;
}
@media screen and (max-width: 768px) {
  #loading .loading__img {
    width: 30.4vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__img {
    width: 13.5416666667vw;
  }
}
#loading .loading__img .loading__item img {
  -o-object-fit: cover;
     object-fit: cover;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #loading .loading__img .loading__item.item_1 img {
    width: 30.4vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__img .loading__item.item_1 img {
    width: 7.9166666667vw;
  }
}
@media screen and (max-width: 768px) {
  #loading .loading__img .loading__item.item_2 img {
    width: 28vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__img .loading__item.item_2 img {
    width: 7.2916666667vw;
  }
}
@media screen and (max-width: 768px) {
  #loading .loading__img .loading__item.item_3 img {
    width: 18.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__img .loading__item.item_3 img {
    width: 4.8611111111vw;
  }
}
@media screen and (max-width: 768px) {
  #loading .loading__img .loading__item.item_4 img {
    width: 16.8vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__img .loading__item.item_4 img {
    width: 4.375vw;
  }
}
#loading .loading__text {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #loading .loading__text {
    width: 29.3333333333vw;
    margin-top: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  #loading .loading__text {
    width: 6.3888888889vw;
    margin-top: 1.3888888889vw;
  }
}

/*--------------------------------------*
FV
*--------------------------------------*/
.fv {
  background-color: #fdffda;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .fv {
    height: 100vh;
  }
}
@media screen and (min-width: 769px) {
  .fv {
    height: calc(100svh - 50px);
  }
}
.fv__wrapper {
  position: relative;
  height: 100%;
}
.fv__sub-title {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  opacity: 0;
  transition: opacity 1s ease;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.fv__sub-title.is-visible {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .fv__sub-title {
    width: 84vw;
    z-index: 10;
    bottom: 3%;
  }
}
@media screen and (min-width: 769px) {
  .fv__sub-title {
    width: 80.2777777778vw;
    top: 2.2916666667vw;
  }
}
@media screen and (max-width: 768px) {
  .fv__sub-title__item.left {
    width: 31.4666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__sub-title__item.left {
    width: 10.2777777778vw;
  }
}
@media screen and (max-width: 768px) {
  .fv__sub-title__item.right {
    width: 16.5333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__sub-title__item.right {
    width: 5.5555555556vw;
  }
}
.fv__ver-text {
  position: absolute;
  display: flex;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .fv__ver-text {
    -moz-column-gap: 1.3333333333vw;
         column-gap: 1.3333333333vw;
    top: 42%;
    right: 2.4vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__ver-text {
    -moz-column-gap: 0.3472222222vw;
         column-gap: 0.3472222222vw;
    bottom: 2.9166666667vw;
    right: 11.8055555556vw;
  }
}
.fv__ver-text__item .clip-inner {
  height: -moz-fit-content;
  height: fit-content;
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1s ease;
  box-sizing: border-box;
  position: relative;
}
@media screen and (max-width: 768px) {
  .fv__ver-text__item .clip-inner {
    width: 8.8vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__ver-text__item .clip-inner {
    width: 2.9166666667vw;
  }
}
.fv__ver-text__item.is-visible .clip-inner {
  clip-path: inset(0 0 0 0);
}
@media screen and (max-width: 768px) {
  .fv__ver-text__item.right .clip-inner {
    height: 62.1333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__ver-text__item.right .clip-inner {
    height: 20.2083333333vw;
  }
}
@media screen and (max-width: 768px) {
  .fv__ver-text__item.left .clip-inner {
    height: 87.2vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__ver-text__item.left .clip-inner {
    height: 28.4027777778vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__inner {
    display: flex;
    justify-content: space-between;
    width: 74.3055555556vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 9.7222222222vw;
  }
}
@media screen and (max-width: 768px) {
  .fv__title {
    position: absolute;
    z-index: 10;
    top: 8%;
    left: 8%;
  }
}
@media screen and (min-width: 769px) {
  .fv__title {
    margin-top: 7vh;
    height: 27.5694444444vw;
  }
}
.fv__title .title {
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
  color: #f02121;
}
@media screen and (max-width: 768px) {
  .fv__title .title {
    font-size: 14.9333333333vw;
    line-height: 0.9285714286;
  }
}
@media screen and (min-width: 769px) {
  .fv__title .title {
    line-height: 1.0722891566;
    font-size: clamp(48px, 8vh, 83px);
  }
}
.fv__img {
  clip-path: url(#house-shape);
  opacity: 0;
  transition: opacity 1.5s ease;
}
.fv__img.is-visible {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .fv__img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -36%);
    width: 83.2vw;
    height: 111.7333333333vw;
    overflow: hidden;
    z-index: 1;
  }
}
@media screen and (min-width: 769px) {
  .fv__img {
    width: 30.0694444444vw;
    height: 40.3472222222vw;
  }
}
@media screen and (min-width: 769px) {
  .fv__description {
    position: absolute;
    left: 0;
    bottom: 0;
  }
}
@media screen and (min-width: 769px) {
  .fv__description .pc-description {
    transition: opacity 1s ease;
    opacity: 0;
    font-size: 1.0416666667vw;
    line-height: 2;
  }
  .fv__description .pc-description.is-visible {
    opacity: 1;
  }
}

/*--------------------------------------*
説明文
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .description {
    margin-top: 19.2vw;
    margin-bottom: 19.2vw;
  }
  .description__wrapper__text {
    text-align: center;
    font-weight: 400;
    line-height: 2;
    font-size: 4vw;
  }
}

/*--------------------------------------*
メゾン・パルクロ　テキスト
*--------------------------------------*/
.text__area {
  height: 100vh;
  position: relative;
  overflow-y: auto; /* 変更なし */
}
.text__area__wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.text__area__wrapper__text {
  text-align: center;
  font-weight: 400;
  line-height: 2;
  text-wrap: nowrap;
}
@media screen and (max-width: 768px) {
  .text__area__wrapper__text {
    font-size: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .text__area__wrapper__text {
    font-size: 1.0416666667vw;
  }
}
@media screen and (max-width: 768px) {
  .text__area__wrapper__arrow {
    width: 10.6666666667vw;
    margin: 5.3333333333vw auto 0;
  }
}
@media screen and (min-width: 769px) {
  .text__area__wrapper__arrow {
    width: 2.7777777778vw;
    margin: 2.3611111111vw auto 0;
  }
}

/*--------------------------------------*
目次
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .index {
    height: 300vh;
  }
}
@media screen and (min-width: 769px) {
  .index {
    height: 100vh;
  }
}
@media screen and (min-width: 769px) {
  .index {
    position: sticky;
    top: 0;
  }
}

.scale {
  position: relative;
  overflow: clip;
}
@media screen and (max-width: 768px) {
  .scale {
    position: sticky;
    top: 0;
    height: 100vh;
  }
}
.scale__title {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .scale__title {
    width: 50.9333333333vw;
    position: absolute;
    top: 8vw;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 769px) {
  .scale__title {
    width: 13.1944444444vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__img {
    width: 34.9333333333vw;
    position: absolute;
    top: 77.3333333333vw;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
  }
}
@media screen and (max-width: 768px) {
  .scale__img img {
    border-radius: 2.6666666667vw;
  }
}
.scale__menu {
  background-color: #fdffda;
  height: 100vh;
}
@media screen and (max-width: 768px) {
  .scale__menu {
    opacity: 0;
    width: 100vw;
  }
}
.scale__menu .scale__text {
  color: #f02121;
}
@media screen and (max-width: 768px) {
  .scale__menu .scale__text {
    visibility: hidden;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu .scale__text {
    padding-top: 12vw;
    margin-left: 6.4vw;
  }
}
@media screen and (min-width: 769px) {
  .scale__menu .scale__text {
    padding-top: 4.2361111111vw;
    margin-left: 2.9166666667vw;
  }
}
.scale__menu .scale__text__main {
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
}
@media screen and (max-width: 768px) {
  .scale__menu .scale__text__main {
    font-size: 8.8vw;
    margin-bottom: 1.3333333333vw;
  }
}
.scale__menu .scale__text__sub {
  font-family: "benton-modern-display-extra", serif; /* L:300*/
}
@media screen and (max-width: 768px) {
  .scale__menu .scale__text__sub {
    font-size: 5.3333333333vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu .scale__text__sub span {
    font-size: 3.7333333333vw;
  }
}
.scale__menu__list {
  display: grid;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .scale__menu__list {
    grid-template-columns: 32.2666666667vw 32.2666666667vw;
    grid-template-rows: 45.8666666667vw 45.8666666667vw;
    -moz-column-gap: 13.6vw;
         column-gap: 13.6vw;
    row-gap: 17.8666666667vw;
    margin-top: 16vw;
  }
}
.scale__menu__list__item {
  visibility: hidden;
}
.scale__menu__list__item a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.scale__menu__list__item__title {
  position: absolute;
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item__title {
    width: 27.7333333333vw;
  }
}
.scale__menu__list__item__img {
  margin-top: auto;
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item__img {
    width: 32.8vw;
    margin-top: 3.4666666667vw;
  }
}
.scale__menu__list__item__img__sub {
  position: absolute;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_1 .scale__menu__list__item__title {
    left: -5.6vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_1 .scale__menu__list__item__img__sub {
    width: 19.7333333333vw;
    right: -4.2666666667vw;
    bottom: -6.4vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_2 .scale__menu__list__item__title {
    right: -8.5333333333vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_2 .scale__menu__list__item__img__sub {
    width: 18.4vw;
    right: -6.9333333333vw;
    bottom: -5.8666666667vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_3 .scale__menu__list__item__title {
    left: -5.6vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_3 .scale__menu__list__item__img__sub {
    width: 19.7333333333vw;
    right: -3.2vw;
    bottom: -6.4vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_4 .scale__menu__list__item__title {
    right: -8.5333333333vw;
  }
}
@media screen and (max-width: 768px) {
  .scale__menu__list__item_4 .scale__menu__list__item__img__sub {
    width: 17.6vw;
    right: -5.6vw;
    bottom: -6.1333333333vw;
  }
}

/*--------------------------------------*
PC
*--------------------------------------*/
@media screen and (min-width: 769px) {
  .content-outer {
    position: relative;
  }
  /* PC 拡大画像 */
  .pc-scale {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    width: 100%;
    height: 100vh;
    z-index: 100;
  }
  .pc-scale .scale__title {
    width: 13.2638888889vw;
    margin: 6.9444444444vw auto 0;
  }
  .pc-scale .scale__img {
    width: 73.3333333333vw;
    height: 30.625vw;
    margin: 5.6944444444vw auto 0;
    overflow: clip;
  }
  .pc-scale .scale__img img {
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 0.6944444444vw;
    width: 17.2222222222vw;
    margin: 0 auto;
  }
  .pc-height {
    width: 100%;
    height: 200vh;
  }
  /* 横並びレイアウト */
  .pc-flex {
    display: grid;
    grid-template-columns: 28.4722222222vw 43.0555555556vw 28.4722222222vw;
  }
  .pc-flex .index {
    position: sticky;
  }
  .pc-flex .pc-index .scale__head,
  .pc-flex .pc-index .scale__menu__list__item {
    visibility: hidden; /* GSAPで制御するため非表示に */
  }
  .pc-flex .pc-index .scale__head.is-visible,
  .pc-flex .pc-index .scale__menu__list__item.is-visible {
    visibility: visible; /* 表示させるためのクラス */
  }
  .pc-flex .pc-right {
    position: sticky;
  }
  .pc-flex .content {
    padding-top: 0.6944444444vw;
  }
  .pc-index {
    background-color: #fdffda;
    height: 100vh;
  }
  .pc-index__wrapper {
    position: relative;
    height: 100vh;
  }
  .pc-index__inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .pc-index__head {
    color: #f02121;
  }
  .pc-index__head__main {
    font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 2.2916666667vw;
    margin-bottom: 0.6944444444vw;
  }
  .pc-index__head__sub {
    font-family: "benton-modern-display-extra", serif; /* L:300*/
    font-size: 1.3888888889vw;
  }
  .pc-index__head__sub span {
    font-size: 0.9722222222vw;
  }
  .pc-index__list {
    display: grid;
    justify-content: center;
    grid-template-columns: 8.4027777778vw 8.4027777778vw;
    grid-template-rows: 11.9444444444vw 11.9444444444vw;
    -moz-column-gap: 3.5416666667vw;
         column-gap: 3.5416666667vw;
    row-gap: 4.6527777778vw;
    margin-top: 4.1666666667vw;
  }
  .pc-index__list__item {
    visibility: hidden;
  }
  .pc-index__list__item a {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
  }
  .pc-index__list__item__title {
    position: absolute;
    width: 7.2222222222vw;
  }
  .pc-index__list__item__img {
    margin-top: auto;
  }
  .pc-index__list__item__img__sub {
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .pc-index__list__item_1 .pc-index__list__item__title {
    left: -1.4583333333vw;
  }
  .pc-index__list__item_1 .pc-index__list__item__img__sub {
    width: 4.9305555556vw;
    right: -1.1111111111vw;
    bottom: -1.3888888889vw;
  }
  .pc-index__list__item_2 .pc-index__list__item__title {
    right: -2.2916666667vw;
  }
  .pc-index__list__item_2 .pc-index__list__item__img__sub {
    width: 4.7916666667vw;
    right: -1.8055555556vw;
    bottom: -1.5277777778vw;
  }
  .pc-index__list__item_3 .pc-index__list__item__title {
    left: -1.4583333333vw;
  }
  .pc-index__list__item_3 .pc-index__list__item__img__sub {
    width: 5.1388888889vw;
    right: -0.8333333333vw;
    bottom: -1.6666666667vw;
  }
  .pc-index__list__item_4 .pc-index__list__item__title {
    right: -2.2916666667vw;
  }
  .pc-index__list__item_4 .pc-index__list__item__img__sub {
    width: 4.7222222222vw;
    right: -1.3888888889vw;
    bottom: -1.5277777778vw;
  }
}
/*--------------------------------------*
sec共通
*--------------------------------------*/
.sec__text__wrapper {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper {
    width: 97.6vw;
    height: 85.6vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper {
    width: 33.5416666667vw;
    height: 25.2777777778vw;
  }
}
.sec__text__wrapper__room {
  position: absolute;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__room {
    width: 40.2666666667vw;
    top: -10.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper__room {
    width: 13.5416666667vw;
    top: -4.0972222222vw;
  }
}
.sec__text__wrapper__sub-title {
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__sub-title {
    font-size: 4.2666666667vw;
    padding-top: 13.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper__sub-title {
    font-size: 1.1111111111vw;
    padding-top: 4.7222222222vw;
  }
}
.sec__text__wrapper__title {
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__title {
    font-size: 5.3333333333vw;
    margin-top: 8vw;
    margin-bottom: 6.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper__title {
    font-size: 1.5277777778vw;
    margin-top: 1.25vw;
    margin-bottom: 0.6944444444vw;
  }
}
.sec__text__wrapper__flex {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__flex {
    -moz-column-gap: 4.2666666667vw;
         column-gap: 4.2666666667vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__flex .img {
    width: 28.2666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper__flex .img {
    width: 11.3888888889vw;
  }
}
.sec__text__wrapper__flex .text {
  font-weight: 500;
  line-height: 2.1428571429;
}
@media screen and (max-width: 768px) {
  .sec__text__wrapper__flex .text {
    font-size: 3.7333333333vw;
    width: 53.3333333333vw;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text__wrapper__flex .text {
    font-size: 0.9722222222vw;
    width: 20vw;
    margin-top: 3.3333333333vw;
  }
}
.sec__text .other-text {
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .sec__text .other-text {
    font-size: 5.3333333333vw;
    margin-bottom: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .other-text {
    font-size: 1.3888888889vw;
    margin-bottom: 2.0833333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .rec-img {
    width: 38.6111111111vw;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .sec__text .own {
    margin-top: 21.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .own {
    margin-top: 15.7638888889vw;
    padding-bottom: 9.7222222222vw;
  }
}
.sec__text .own__title {
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
  text-shadow: 0.03em 0 currentColor, -0.03em 0 currentColor;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .sec__text .own__title {
    padding-top: 32.5333333333vw;
    margin-bottom: 5.3333333333vw;
    font-size: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .own__title {
    padding-top: 9.5138888889vw;
    margin-bottom: 1.0416666667vw;
    font-size: 2.0833333333vw;
  }
}
.sec__text .own__title span {
  display: inline-block;
  animation: bounce 0.6s ease;
  animation-fill-mode: both;
  animation-play-state: paused;
}
.sec__text .own__title.is-animate span {
  animation-play-state: running;
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
.sec__text .own .wide-img {
  overflow: clip;
  position: relative;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .sec__text .own .wide-img {
    margin-bottom: 26.6666666667vw;
    height: 96vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .own .wide-img {
    margin-bottom: 9.3055555556vw;
    height: 41.4583333333vw;
  }
}
.sec__text .own .wide-img img {
  height: 100%;
  width: auto;
  position: absolute;
  top: 0;
  left: 0;
}
.sec__text .own .wide-img img.js-pan {
  animation: pan 6s ease-out forwards;
}
.sec__text .own .wide-img.overflow {
  overflow-x: scroll;
}
.sec__text .own .wide-img.overflow::-webkit-scrollbar {
  height: 0.3472222222vw;
}
.sec__text .own .wide-img.overflow::-webkit-scrollbar-thumb {
  background-color: #d9d9d9;
}
@media screen and (max-width: 768px) {
  @keyframes pan {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(100vw - 100%));
    }
  }
}
@media screen and (min-width: 769px) {
  @keyframes pan {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(43.2638888889vw - 100%));
    }
  }
}
.sec__text .own .goods_1,
.sec__text .own .goods_2 {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__text .own .goods_1,
  .sec__text .own .goods_2 {
    width: 86.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__text .own .goods_1,
  .sec__text .own .goods_2 {
    width: 29.4444444444vw;
  }
}

@media screen and (max-width: 768px) {
  .credit {
    margin-top: 16vw;
  }
}
.credit__list {
  display: grid;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .credit__list {
    gap: 4.2666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .credit__list {
    grid-template-columns: 17.2222222222vw 17.2222222222vw;
    gap: 1.7361111111vw 1.1111111111vw;
  }
}
.credit__list__item a {
  display: flex;
  justify-content: center;
  align-items: center;
}
.credit__list__item a .img img {
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 768px) {
  .credit__list__item a .img img {
    width: 19.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .credit__list__item a .img img {
    width: 3.8194444444vw;
  }
}
.credit__list__item a .credit__text {
  line-height: 1.5;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .credit__list__item a .credit__text {
    font-size: 3.2vw;
    width: 40vw;
    margin-left: 5.3333333333vw;
    margin-right: 6.9333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .credit__list__item a .credit__text {
    font-size: 0.7638888889vw;
    width: 8.8888888889vw;
    margin-left: 0.7638888889vw;
  }
}
.credit__list__item a .btn {
  position: relative;
  border: solid 0.5px #000;
  background-color: #fdffda;
}
@media screen and (max-width: 768px) {
  .credit__list__item a .btn {
    width: 12.8vw;
    height: 5.3333333333vw;
    border-radius: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .credit__list__item a .btn {
    width: 3.6111111111vw;
    height: 1.5972222222vw;
    border-radius: 3.4722222222vw;
  }
}
.credit__list__item a .btn p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
  text-shadow: 0.03em 0 currentColor, -0.03em 0 currentColor;
}
@media screen and (max-width: 768px) {
  .credit__list__item a .btn p {
    font-size: 2.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .credit__list__item a .btn p {
    font-size: 0.6944444444vw;
  }
}

@media screen and (max-width: 768px) {
  .other-item-credit,
  .goods-credit_1,
  .goods-credit_2 {
    width: 85.3333333333vw;
    margin: 6.1333333333vw auto 0;
  }
}
@media screen and (min-width: 769px) {
  .other-item-credit,
  .goods-credit_1,
  .goods-credit_2 {
    width: 29.4444444444vw;
    margin: 2.3611111111vw auto 0;
  }
}
.other-item-credit .item-credit__list__item,
.goods-credit_1 .item-credit__list__item,
.goods-credit_2 .item-credit__list__item {
  display: inline;
}
.other-item-credit .item-credit__list__item:not(:last-child)::after,
.goods-credit_1 .item-credit__list__item:not(:last-child)::after,
.goods-credit_2 .item-credit__list__item:not(:last-child)::after {
  content: "";
  display: inline-block;
  width: 10px;
}
.other-item-credit .item-credit__list__item a,
.goods-credit_1 .item-credit__list__item a,
.goods-credit_2 .item-credit__list__item a {
  white-space: normal;
  word-break: break-all;
  overflow-wrap: break-word;
  display: inline;
}
.other-item-credit .item-credit__list__item a p,
.goods-credit_1 .item-credit__list__item a p,
.goods-credit_2 .item-credit__list__item a p {
  display: inline;
  border-bottom: solid 0.5px #000;
  line-height: 2.5;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .other-item-credit .item-credit__list__item a p,
  .goods-credit_1 .item-credit__list__item a p,
  .goods-credit_2 .item-credit__list__item a p {
    font-size: 3.2vw;
  }
}
@media screen and (min-width: 769px) {
  .other-item-credit .item-credit__list__item a p,
  .goods-credit_1 .item-credit__list__item a p,
  .goods-credit_2 .item-credit__list__item a p {
    font-size: 1.0416666667vw;
  }
}
.other-item-credit .item-credit__list__item a p .alphabet,
.goods-credit_1 .item-credit__list__item a p .alphabet,
.goods-credit_2 .item-credit__list__item a p .alphabet {
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
  text-shadow: 0.03em 0 currentColor, -0.03em 0 currentColor;
  margin-right: 0.2em;
}
@media screen and (max-width: 768px) {
  .other-item-credit .item-credit__list__item a p .alphabet,
  .goods-credit_1 .item-credit__list__item a p .alphabet,
  .goods-credit_2 .item-credit__list__item a p .alphabet {
    font-size: 2.6666666667vw;
  }
}
.other-item-credit .item-credit__list__item a p .item,
.goods-credit_1 .item-credit__list__item a p .item,
.goods-credit_2 .item-credit__list__item a p .item {
  flex: 1;
  min-width: 0;
}

@media screen and (max-width: 768px) {
  .goods-credit_1 {
    margin-bottom: 18.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .goods-credit_1 {
    margin-bottom: 10.1388888889vw;
  }
}

@media screen and (max-width: 768px) {
  .goods-credit_2 {
    padding-bottom: 21.3333333333vw;
  }
}

/*--------------------------------------*
sec__1 room301
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .sec__1 {
    padding-top: 25.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 {
    padding-top: 38.1944444444vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__1 .sec__text__wrapper {
    background-image: url(../assets/images/sec_1_bg.webp);
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_1_bg.webp);
  }
}
.sec__1 .img_1 {
  margin-left: auto;
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_1 {
    margin-top: 10.6666666667vw;
    width: 93.6vw;
    margin-bottom: 35.2vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_1 {
    margin-top: 8.6111111111vw;
    width: 39.9305555556vw;
    margin-bottom: 19.5138888889vw;
  }
}
.sec__1 .img_1 .js-rotateL {
  animation-delay: 1s;
}
.sec__1 .img_1 .dec_1 {
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_1 .dec_1 {
    width: 68vw;
    right: -14.9333333333vw;
    bottom: -30.9333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_1 .dec_1 {
    width: 18.125vw;
    right: 1.25vw;
    bottom: -7.6388888889vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_2 {
    width: 29.2361111111vw;
    margin: 0 auto 3.5416666667vw;
  }
}
.sec__1 .img_3 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_3 {
    width: 72.8vw;
    margin: 19.4666666667vw auto 43.4666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_3 {
    width: 26.0416666667vw;
    margin: 12.5vw auto 18.75vw;
  }
}
.sec__1 .img_3 .dec_1 {
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  .sec__1 .img_3 .dec_1 {
    width: 92.5333333333vw;
    top: 13.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_3 .dec_1 {
    width: 33.0555555556vw;
    top: 4.9305555556vw;
  }
}
.sec__1 .img_4 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_4 {
    width: 50.1333333333vw;
    margin: 0 6.6666666667vw 9.8666666667vw auto;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_4 {
    width: 18.0555555556vw;
    margin: 0 3.0555555556vw 7.6388888889vw auto;
  }
}
.sec__1 .img_4 .dec_1 {
  content: "";
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_4 .dec_1 {
    width: 25.3333333333vw;
    top: 22.1333333333vw;
    left: -23.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_4 .dec_1 {
    width: 11.1111111111vw;
    top: 6.5972222222vw;
    left: -9.7222222222vw;
  }
}
.sec__1 .img_4 .dec_2 {
  content: "";
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_4 .dec_2 {
    width: 21.3333333333vw;
    top: 42.4vw;
    left: -44.5333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_4 .dec_2 {
    width: 9.4444444444vw;
    top: 15.2083333333vw;
    left: -16.8055555556vw;
  }
}
.sec__1 .img_5 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_5 {
    width: 78.6666666667vw;
    margin: 0 0 0 3.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_5 {
    width: 28.3333333333vw;
    margin-left: 2.7777777778vw;
  }
}
.sec__1 .img_5 .dec_1 {
  content: "";
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_5 .dec_1 {
    width: 31.4666666667vw;
    top: -10.4vw;
    right: -36.5333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_5 .dec_1 {
    width: 9.2361111111vw;
    top: -3.8888888889vw;
    right: -13.75vw;
  }
}
.sec__1 .img_5 .dec_2 {
  content: "";
  display: block;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
  top: 0;
}
@media screen and (max-width: 768px) {
  .sec__1 .img_5 .dec_2 {
    width: 78.6666666667vw;
    height: 114.1333333333vw;
    left: 5.6vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .img_5 .dec_2 {
    width: 28.2638888889vw;
    height: 41.0416666667vw;
    left: 1.875vw;
  }
}
.sec__1 .decolation {
  margin-top: -9.7222222222vw;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .sec__1 .decolation {
    width: 44vw;
    margin-top: -27.4666666667vw;
    margin-right: -21.3333333333vw;
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__1 .decolation {
    width: 11.4583333333vw;
    margin-bottom: 1.6666666667vw;
  }
}
.sec__1 .own {
  background-color: #ffedd5;
}
.sec__1 .own .img_8 {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__1 .own .img_8 {
    width: 86.6666666667vw;
  }
}

/*--------------------------------------*
sec__2 room302
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .sec__2 {
    padding-top: 25.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 {
    padding-top: 10.5555555556vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .sec__text__wrapper {
    background-image: url(../assets/images/sec_2_bg.webp);
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_2_bg.webp);
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .sec__text__wrapper__room {
    top: -11.7333333333vw;
    right: 5.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper__room {
    top: -3.4722222222vw;
    right: 0;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .sec__text__wrapper__title {
    margin-bottom: 8vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper__title {
    margin-bottom: 1.7361111111vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper__flex {
    -moz-column-gap: 1.7361111111vw;
         column-gap: 1.7361111111vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .sec__text__wrapper__flex .img {
    width: 24.8vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper__flex .img {
    width: 9.375vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .sec__text__wrapper__flex .text {
    width: 59.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .sec__text__wrapper__flex .text {
    width: 20vw;
    margin-top: 1.3194444444vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .img_1 {
    margin-top: 14.4vw;
    margin-bottom: 21.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_1 {
    margin-top: 11.6666666667vw;
    margin-bottom: 16.25vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .img_2 {
    width: 91.7333333333vw;
    margin: 0 auto;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_2 {
    width: 33.3333333333vw;
    margin: 0 auto 4.8611111111vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .img_3 {
    margin-top: 29.8666666667vw;
    margin-bottom: 53.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_3 {
    margin: 12.0138888889vw auto 18.4027777778vw;
  }
}
.sec__2 .img_4 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_4 {
    width: 43.7333333333vw;
    margin: 0 auto 16vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_4 {
    width: 15.9027777778vw;
    margin: 0 auto 5.7638888889vw;
  }
}
.sec__2 .img_4::before {
  content: "";
  display: block;
  background-color: #f58c3b;
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
  .sec__2 .img_4::before {
    width: 65.6vw;
    height: 97.0666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_4::before {
    width: 23.75vw;
    height: 35.1388888889vw;
  }
}
.sec__2 .img_5 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 {
    width: 38.9333333333vw;
    height: 97.0666666667vw;
    margin: 0 auto 33.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 {
    width: 14.0972222222vw;
    height: 35.1388888889vw;
    margin: 0 auto 20.3472222222vw;
  }
}
.sec__2 .img_5 .bg-wrap {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
  overflow: clip;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 .bg-wrap {
    width: 65.6vw;
    height: 97.0666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 .bg-wrap {
    width: 23.75vw;
    height: 35.1388888889vw;
  }
}
.sec__2 .img_5 .grain {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: url("../assets/images/grain.webp");
  background-repeat: repeat;
  opacity: 0.25;
  mix-blend-mode: overlay;
}
.sec__2 .img_5 .clip-img {
  clip-path: inset(0 100% 0 0);
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 .clip-img {
    padding-top: 17.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 .clip-img {
    padding-top: 6.1111111111vw;
  }
}
.sec__2 .img_5 .txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 .txt {
    width: 48.8vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 .txt {
    width: 17.7777777778vw;
  }
}
.sec__2 .img_5 .txt .love {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 .txt .love {
    width: 28vw;
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 .txt .love {
    width: 10.0694444444vw;
  }
}
.sec__2 .img_5 .txt .culture {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_5 .txt .culture {
    width: 48.8vw;
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_5 .txt .culture {
    margin-top: 1.7361111111vw;
    width: 17.9166666667vw;
  }
}
.sec__2 .img_6_area {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_6_area {
    margin-bottom: 29.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_6_area {
    margin-bottom: 10.8333333333vw;
  }
}
.sec__2 .img_6_area .img_6 {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .sec__2 .img_6_area .img_6 {
    width: 89.0666666667vw;
    margin-top: -7.4666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_6_area .img_6 {
    width: 32.2222222222vw;
    margin-top: -2.3611111111vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .img_6_area .loop-txt-right {
    margin-top: -7.4666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_6_area .loop-txt-right {
    margin-top: -2.3611111111vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__2 .img_6_area .loop-txt .swiper-slide {
    width: 180.2666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__2 .img_6_area .loop-txt .swiper-slide {
    width: 65.2777777778vw;
  }
}
.sec__2 .img_6_area .loop-txt .swiper-slide img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.sec__2 .own {
  background-color: #e6ecfa;
}

/*--------------------------------------*
sec__3 room201
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .sec__3 {
    padding-top: 28.8vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 {
    padding-top: 10.5555555556vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__3 .sec__text__wrapper {
    background-image: url(../assets/images/sec_3_bg.webp);
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_3_bg.webp);
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .sec__text__wrapper__flex {
    -moz-column-gap: 2.2222222222vw;
         column-gap: 2.2222222222vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__3 .sec__text__wrapper__flex .img {
    width: 26.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .sec__text__wrapper__flex .img {
    width: 9.7222222222vw;
    margin-top: 1.3888888889vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__3 .sec__text__wrapper__flex .text {
    width: 59.7333333333vw;
    margin-top: 0;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .sec__text__wrapper__flex .text {
    width: 18.75vw;
    margin-top: 4.0277777778vw;
  }
}
.sec__3 .img_1 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_1 {
    margin: 18.1333333333vw auto 51.2vw;
    width: 84.8vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_1 {
    margin: 8.3333333333vw auto 20.9722222222vw;
    width: 36.5277777778vw;
  }
}
.sec__3 .img_1 .dec_1 {
  content: "";
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  z-index: -1;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_1 .dec_1 {
    height: 132.8vw;
    top: 18.9333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_1 .dec_1 {
    width: 43.0555555556vw;
    height: 57.1527777778vw;
    top: 8.1944444444vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_2 {
    width: 35.3472222222vw;
    margin: 0 auto 5.9722222222vw;
  }
}
.sec__3 .img_3 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_3 {
    width: 66.9333333333vw;
    margin: 39.4666666667vw auto 37.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_3 {
    width: 27.7083333333vw;
    margin: 19.1666666667vw auto 13.6805555556vw;
  }
}
.sec__3 .img_3 .dec_1 {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  z-index: 10;
  transition-delay: 0.5s;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_3 .dec_1 {
    width: 69.0666666667vw;
    top: -12.8vw;
    right: -7.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_3 .dec_1 {
    width: 28.5416666667vw;
    top: -3.9583333333vw;
    right: -2.2916666667vw;
  }
}
.sec__3 .img_4_area {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_4_area .img_4 {
    width: 44.8vw;
    margin: 0 auto 41.6vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_4_area .img_4 {
    width: 15.8333333333vw;
    margin: 0 auto 21.875vw;
  }
}
.sec__3 .img_4_area .bg {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
  .sec__3 .img_4_area .bg {
    width: 89.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_4_area .bg {
    width: 31.7361111111vw;
  }
}
.sec__3 .img_5_area {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__3 .img_5_area .img_5 {
    width: 74.9333333333vw;
    margin: 0 auto 26.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_5_area .img_5 {
    width: 26.4583333333vw;
    margin: 0 auto 16.25vw;
  }
}
.sec__3 .img_5_area .img_5_sub {
  position: absolute;
  animation: shake 2s ease-in-out infinite;
  transform: rotate(10deg);
}
@media screen and (max-width: 768px) {
  .sec__3 .img_5_area .img_5_sub {
    width: 44vw;
    top: 11.4666666667vw;
    left: 30.1333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__3 .img_5_area .img_5_sub {
    width: 15.625vw;
    top: 3.2638888889vw;
    left: 14.3055555556vw;
  }
}
.sec__3 .own {
  background-color: #fef6f6;
}

@keyframes shake {
  0% {
    transform: rotate(0);
  }
  20% {
    transform: rotate(0);
  }
  40% {
    transform: rotate(-3deg);
  }
  50% {
    transform: rotate(3deg);
  }
  60% {
    transform: rotate(-3deg);
  }
  80% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(0);
  }
}
/*--------------------------------------*
sec__4 room202
*--------------------------------------*/
@media screen and (max-width: 768px) {
  .sec__4 {
    padding-top: 33.0666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 {
    padding-top: 10.5555555556vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__4 .sec__text__wrapper {
    background-image: url(../assets/images/sec_4_bg.webp);
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_4_bg.webp);
  }
}
@media screen and (max-width: 768px) {
  .sec__4 .sec__text__wrapper__room {
    top: -9.0666666667vw;
    right: 1.0666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper__room {
    top: -3.4722222222vw;
    right: 0;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper__title {
    margin-bottom: 1.3888888889vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper__flex {
    -moz-column-gap: 0.9722222222vw;
         column-gap: 0.9722222222vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__4 .sec__text__wrapper__flex .img {
    width: 25.8666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper__flex .img {
    width: 10.0694444444vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__4 .sec__text__wrapper__flex .text {
    width: 59.7333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .sec__text__wrapper__flex .text {
    width: 18.4027777778vw;
    margin-top: 2.7777777778vw;
  }
}
.sec__4 .img_1 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_1 {
    margin: 10.6666666667vw auto 23.2vw;
    width: 100vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_1 {
    margin: 9.4444444444vw auto 23.6111111111vw;
    width: 43.0555555556vw;
  }
}
.sec__4 .img_1 .dec_1 {
  content: "";
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_1 .dec_1 {
    width: 71.2vw;
    margin: 7.2vw auto 0;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_1 .dec_1 {
    width: 30vw;
    margin: 0 auto;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_2 {
    margin-bottom: 4.5138888889vw;
  }
}
.sec__4 .img_3 {
  margin: 0 auto;
  border: solid 1px #000;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_3 {
    width: 89.6vw;
    margin-top: 26.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_3 {
    width: 37.8472222222vw;
    margin-top: 13.1944444444vw;
  }
}
.sec__4 .img_4 {
  border-left: solid 1px #000;
  border-right: solid 1px #000;
  border-bottom: solid 1px #000;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_4 {
    width: 89.6vw;
    margin: 0 auto 24vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_4 {
    width: 37.8472222222vw;
    margin: 0 auto 15.625vw;
  }
}
.sec__4 .img_5_area {
  position: relative;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_5_area {
    margin-bottom: 46.6666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_5_area {
    margin-bottom: 24.0277777778vw;
  }
}
.sec__4 .img_5_area .img_5 {
  position: absolute;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_5_area .img_5 {
    width: 45.3333333333vw;
    top: 34.6666666667vw;
    left: 4.5333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_5_area .img_5 {
    width: 17.0138888889vw;
    top: 14.5833333333vw;
    left: 2.0833333333vw;
  }
}
.sec__4 .img_5_area .img_6 {
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .sec__4 .img_5_area .img_6 {
    width: 58.4vw;
    margin-right: 6.9333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_5_area .img_6 {
    width: 24.5833333333vw;
    margin-right: 3.6805555556vw;
  }
}
@media screen and (max-width: 768px) {
  .sec__4 .img_7 {
    width: 88.5333333333vw;
    margin: 0 auto 25.0666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .sec__4 .img_7 {
    margin-bottom: 14.6527777778vw;
  }
}
.sec__4 .own {
  background-color: #ded4c5;
}

/*--------------------------------------*
PC 右側
*--------------------------------------*/
@media screen and (min-width: 769px) {
  .pc-right {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
  }
  .pc-right__wrapper {
    position: relative;
    width: 100%;
    height: 100vh;
  }
  .pc-right__wrapper::before {
    content: "";
    display: block;
    background-image: url(../assets/images/pc/pc-right.webp);
    background-position: center;
    background-repeat: repeat;
    background-size: cover;
    width: 100%;
    height: 100vh;
  }
  .pc-right .right-item {
    transition: opacity 0.5s ease;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 7.4305555556vw;
  }
  .pc-right .right-item.is-hidden {
    opacity: 0;
    visibility: hidden;
  }
  .pc-right .right-item .swiper-wrapper .swiper-slide img {
    width: 7.4305555556vw;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .pc-right .sec {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease;
  }
  .pc-right .sec.is-active {
    opacity: 1;
    visibility: visible;
  }
  .pc-right .sec__text__wrapper {
    width: 24.9305555556vw;
    height: 18.8194444444vw;
  }
  .pc-right .sec__text__wrapper__room {
    width: 10vw;
    top: -2.2222222222vw;
  }
  .pc-right .sec__text__wrapper__sub-title {
    font-size: 1.0416666667vw;
    padding-top: 2.7777777778vw;
  }
  .pc-right .sec__text__wrapper__title {
    font-size: 1.25vw;
    margin-top: 0.6944444444vw;
  }
  .pc-right .sec__text__wrapper__flex {
    -moz-column-gap: 0.6944444444vw;
         column-gap: 0.6944444444vw;
  }
  .pc-right .sec__text__wrapper__flex .img {
    width: 5.9027777778vw;
  }
  .pc-right .sec__text__wrapper__flex .text {
    font-size: 0.8333333333vw;
    width: 14.9305555556vw;
    margin-top: 0;
  }
  .pc-right .sec_1 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_1_bg.webp);
  }
  .pc-right .sec_1 .sec__text__wrapper__title {
    margin-bottom: 0.6944444444vw;
  }
  .pc-right .sec_1 .sec__text__wrapper__flex {
    -moz-column-gap: 0;
         column-gap: 0;
  }
  .pc-right .sec_1 .sec__text__wrapper__flex .img {
    width: 8.2638888889vw;
  }
  .pc-right .sec_1 .sec__text__wrapper__flex .text {
    margin-top: 2.2222222222vw;
  }
  .pc-right .sec_2 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_2_bg.webp);
  }
  .pc-right .sec_2 .sec__text__wrapper__title {
    margin-bottom: 0.8333333333vw;
  }
  .pc-right .sec_2 .sec__text__wrapper__flex .img {
    width: 6.9444444444vw;
  }
  .pc-right .sec_2 .sec__text__wrapper__flex .text {
    margin-top: 2.0833333333vw;
  }
  .pc-right .sec_3 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_3_bg.webp);
  }
  .pc-right .sec_3 .sec__text__wrapper__title {
    margin-bottom: 1.1805555556vw;
  }
  .pc-right .sec_3 .sec__text__wrapper__flex .img {
    width: 7.0833333333vw;
  }
  .pc-right .sec_3 .sec__text__wrapper__flex .text {
    margin-top: 1.0416666667vw;
  }
  .pc-right .sec_4 .sec__text__wrapper {
    background-image: url(../assets/images/pc/sec_4_bg.webp);
  }
  .pc-right .sec_4 .sec__text__wrapper__title {
    margin-bottom: 0.8333333333vw;
  }
  .pc-right .sec_4 .sec__text__wrapper__flex .img {
    width: 6.9444444444vw;
  }
  .pc-right .sec_4 .sec__text__wrapper__flex .text {
    margin-top: 1.25vw;
  }
  .pc-right .sec_2 .sec__text__wrapper__room, .pc-right .sec_4 .sec__text__wrapper__room {
    right: -0.6944444444vw;
  }
}
/*--------------------------------------*
top-btn
*--------------------------------------*/
.top-btn {
  position: fixed;
  z-index: 900;
  /* 初期状態は非表示 */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s, visibility 0.5s;
}
.top-btn.is-visible {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 768px) {
  .top-btn {
    width: 21.8666666667vw;
    right: 1.3333333333vw;
    bottom: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .top-btn {
    width: 6.9444444444vw;
    right: 2.7777777778vw;
    bottom: 2.7777777778vw;
  }
}

/*--------------------------------------*
プロフィール
*--------------------------------------*/
.profile {
  background-color: #fefbfb;
}
@media screen and (max-width: 768px) {
  .profile {
    padding: 21.3333333333vw 9.3333333333vw 25.6vw;
  }
}
@media screen and (min-width: 769px) {
  .profile {
    padding: 8.9583333333vw 0 8.3333333333vw;
  }
}
.profile h5 {
  font-family: "birra-pils", -apple-system, BlinkMacSystemFont, sans-serif;
  text-align: center;
  text-shadow: 0.03em 0 currentColor, -0.03em 0 currentColor;
}
@media screen and (max-width: 768px) {
  .profile h5 {
    font-size: 5.3333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .profile h5 {
    font-size: 1.3888888889vw;
  }
}
@media screen and (max-width: 768px) {
  .profile__img {
    width: 39.7333333333vw;
    margin: 5.8666666667vw auto 12.5333333333vw;
  }
}
@media screen and (min-width: 769px) {
  .profile__img {
    width: 10.3472222222vw;
    margin: 1.5277777778vw auto 3.2638888889vw;
  }
}
@media screen and (min-width: 769px) {
  .profile__wrapper {
    width: 40.7638888889vw;
    margin: 0 auto;
  }
}
.profile__name {
  font-weight: 500;
  line-height: 2.4375;
}
@media screen and (max-width: 768px) {
  .profile__name {
    font-size: 4.2666666667vw;
  }
}
@media screen and (min-width: 769px) {
  .profile__name {
    font-size: 1.25vw;
  }
}
.profile__text {
  line-height: 2.0833333333;
}
@media screen and (max-width: 768px) {
  .profile__text {
    font-size: 3.2vw;
  }
}
@media screen and (min-width: 769px) {
  .profile__text {
    font-size: 0.9027777778vw;
  }
}

.creditAjax_price__sale {
  color: red;
}

.creditAjax_price__sale::before {
  content: "¥";
}

.creditAjax_link.creditAjax__saleOn .proper {
  text-decoration: line-through;
}

.js-clip {
  position: relative;
  text-transform: uppercase;
  transition: all 0.8s ease;
  clip-path: inset(0 100% 0 0);
}
.js-clip.on {
  clip-path: inset(0);
}

.js-zoomOut {
  overflow: clip;
}
.js-zoomOut img {
  transition: transform 2s ease, opacity 1s ease;
  opacity: 0;
  transform: scale(1.2);
}
.js-zoomOut.on img {
  opacity: 1;
  transform: scale(1);
}/*# sourceMappingURL=style.css.map */