@charset "UTF-8";
/*数値の設定
------------------------------------------*/
/*上記数値の設定を呼び出しているmixin
------------------------------------------*/
/*
よく使用するmixin
------------------------------------------*/
/* ====================
MV
======================= */
/*文字の縦書き*/
.mv_text h2 { font-size: clamp(24px, 3vw, 32px); letter-spacing: 0.09em; line-height: 1.4; display: flex; justify-content: center; text-align: left; }

.mv_text h2 span { display: inline-block; white-space: pre; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -webkit-text-orientation: upright; -ms-text-orientation: upright; text-orientation: upright; }

/* ページ用カスタム */
.mv_text h3 { font-size: clamp(15px, 2.2vw, 25px); text-align: center; margin-top: 120px; }

#pageMainvisual .mv_text { padding: 120px 0 60px; }

#pageMainvisual .mv_text .lead { margin-top: 60px; }

@media only screen and (max-width: 767px) { #pageMainvisual .mv_text h2 span { max-width: inherit; } }
/* -----------------------------------------------------------------------------
↓↓ ページ内共通スタイル ↓↓
-------------------------------------------------------------------------------- */
.gallery_map { margin: 0 0 70px; }
.gallery_map .inner { max-width: 1000px; }
.gallery_map .HeadTitle { font-size: clamp(22px, 3vw, 30px); }
.gallery_map figure { text-align: center; }

.modelroom_slider { margin-bottom: 50px; }
.modelroom_slider .modelroom_typeBox { margin-bottom: 30px; }
.modelroom_slider .modelroom_typeBox .type, .modelroom_slider .modelroom_typeBox .ldk { font-size: 36px; line-height: 1.5; }
.modelroom_slider .modelroom_typeBox .ldk { margin-bottom: 10px; }
.modelroom_slider .modelroom_typeBox .area { font-size: 18px; }
.modelroom_slider .modelroom_slider_text { position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.7); color: #fff; padding: 2px 10px; }
.modelroom_slider .slideWrap { overflow: hidden; width: 100%; margin: auto; }
.modelroom_slider .slideWrap img { display: block; max-width: 100%; height: auto; }
.modelroom_slider .thumb .slick-track { display: flex; justify-content: center; flex-flow: row wrap; transform: unset !important; width: 100% !important; }
.modelroom_slider .thumb .slick-slide { display: block !important; float: none !important; flex: 0 0 calc(20% - 10px); margin: 0 6px; }
.modelroom_slider .thumb .slick-slide:nth-of-type(5n) { margin-right: 0; }
.modelroom_slider .thumb .slick-slide:nth-of-type(5n+1) { margin-left: 0; }
.modelroom_slider .thumb .slick-slide .thumb-item { position: relative; transition: .3s ease; cursor: pointer; }
.modelroom_slider .thumb .slick-slide .thumb-item:hover { opacity: 0.5; }
.modelroom_slider .thumb .slick-slide:not(.slick-current) .thumb-item::before { content: ""; position: absolute; width: 100%; height: 100%; display: block; background-color: #888888; mix-blend-mode: multiply; }
.modelroom_slider .slick-prev, .modelroom_slider .slick-next { display: block; background-image: url("../img/pages/modelroom/slider_arrow.svg"); background-size: 100%; background-repeat: no-repeat; width: 34px; height: 67px; z-index: 10; background-position: center; -webkit-filter: drop-shadow(0px 0 3px black); filter: drop-shadow(0px 0 3px black); }
.modelroom_slider .slick-prev::before, .modelroom_slider .slick-next::before { content: initial; }
.modelroom_slider .slick-prev:hover, .modelroom_slider .slick-prev:focus, .modelroom_slider .slick-next:hover, .modelroom_slider .slick-next:focus { background-image: url("../img/pages/modelroom/slider_arrow.svg"); background-size: 100%; background-repeat: no-repeat; outline: initial; /*opacity: 0.7;*/ color: initial; background-position: center; }
.modelroom_slider .slick-prev { left: 30px; }
.modelroom_slider .slick-next { right: 30px; transform: rotate(180deg) translateY(50%); transform-origin: center; }

@media only screen and (max-width: 767px) { .gallery_map { margin: 0 0 50px; }
  .modelroom_slider .thumb .slick-track { justify-content: flex-start; }
  .modelroom_slider .thumb .slick-slide { flex: 0 0 calc(33.333% - 10px); margin: 0 7.5px; }
  .modelroom_slider .thumb .slick-slide:nth-of-type(5n) { margin-right: 7.5px; }
  .modelroom_slider .thumb .slick-slide:nth-of-type(5n+1) { margin-left: 7.5px; }
  .modelroom_slider .thumb .slick-slide:nth-of-type(3n) { margin-right: 0; }
  .modelroom_slider .thumb .slick-slide:nth-of-type(3n+1) { margin-left: 0; }
  .modelroom_slider .slick-prev, .modelroom_slider .slick-next { width: 4.5vw; height: 9vw; }
  .modelroom_slider .slick-prev { left: 4vw; }
  .modelroom_slider .slick-next { right: 4vw; } }
/* -----------------------------------------------------------------------------
↑↑ ページ内共通スタイル ↑↑
-------------------------------------------------------------------------------- */
.reserve_merit { background: #3E3A39; color: #C8BB9B; padding: 60px 0; margin: 60px 0; }
.reserve_merit .HeadTitle { font-size: clamp(22px, 3vw, 30px); text-align: center; }
.reserve_merit .reserve_meritList { display: flex; flex-wrap: wrap; justify-content: space-between; }
.reserve_merit .reserve_meritList__item { width: calc((100% / 3) - 40px); margin-top: 20px; position: relative; }
.reserve_merit .reserve_meritList__item:after { content: ''; width: 30px; height: 30px; border: 0; border-top: solid 1px #fff; border-right: solid 1px #fff; position: absolute; top: 0; right: -35px; bottom: 0; transform: rotate(45deg); margin: auto; }
.reserve_merit .reserve_meritList__item:last-child:after { display: none; }
.reserve_merit .reserve_meritList h4 { font-size: clamp(20px, 3vw, 24px); line-height: 1.7; text-align: center; margin-bottom: 10px; }
.reserve_merit .reserve_meritList p { padding-top: 15px; }
.reserve_merit .topInfo_entry { max-width: 350px; width: 100%; margin: 0 auto; padding: 0 15px; }
.reserve_merit .topInfo_entry a { display: block; background: #7A6A56; color: #fff; font-size: 20px; letter-spacing: 2px; padding: 10px 5px; margin: 20px 0; position: relative; overflow: hidden; text-align: center; }
.reserve_merit .topInfo_entry a:after { content: ""; border: 3px solid #3E3A39; border-top: none; border-bottom: none; position: absolute; top: 0; left: 3px; z-index: 2; width: calc(100% - 6px); height: 100%; }
.reserve_merit .topInfo_entry a:before { content: ""; animation: 3s 0s shine linear infinite; background: linear-gradient(to right, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0) 75%); height: 100%; width: 100%; left: -100%; position: absolute; top: 0; transform: skewX(-15deg); }
@media only screen and (max-width: 767px) { .reserve_merit .reserve_meritList__item { width: 100%; padding-bottom: 50px; }
  .reserve_merit .reserve_meritList__item:after { transform: rotate(135deg) translateX(-50%); top: inherit; right: 50%; } }

@keyframes shine { 20% { left: 100%; }
  100% { left: 100%; } }