@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanmp.min.css");
@import url("https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanjp.min.css");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;600;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&family=EB+Garamond:wght@400;500;600;700;800&family=Public+Sans:wght@100;200;300;400;500;600;700;800;900&family=Oswald:wght@200;300;400;500;600&family=Allura&display=swap");
html, body {margin: 0;padding: 0;border: 0;}
.pre-inc *{margin: 0;padding: 0;border: 0;font-size: 100%;font-weight: normal;vertical-align: baseline;box-sizing: border-box;font-style: normal;position: relative;}
.pre-inc article, .pre-inc aside, .pre-inc details, .pre-inc figcaption, .pre-inc figure,.pre-inc header, .pre-inc hgroup, .pre-inc menu, .pre-inc nav, .pre-inc section{display: block;}
.pre-inc ol, .pre-inc ul {list-style: none;}
.pre-inc table {border-collapse: collapse;border-spacing: 0;}
.pre-inc img {-ms-interpolation-mode: bicubic;max-width: 100%;vertical-align: bottom;backface-visibility: hidden;}
.pre-inc a {text-decoration: none;}
.pre-inc .animated {-webkit-animation-duration: 1.5s;animation-duration: 1.5s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
.pre-inc .animated.hinge {-webkit-animation-duration: 1.5s;animation-duration: 1.5s;}
@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeInDown {
0% {opacity: 0;transform: translateY(-3rem);}
100% {opacity: 1;transform: translateY(0);}
}
@keyframes fadeInLeft {
0% {opacity: 0;transform: translateX(-8rem);}
100% {opacity: 1;transform: translateX(0);}
}
@keyframes fadeInRight {
0% {opacity: 0;transform: translateX(8rem);}
100% {opacity: 1;transform: translateX(0);}
}
@keyframes fadeInUp {
0% {opacity: 0;transform: translateY(3rem);}
100% {opacity: 1;transform: translateY(0);}
}
@keyframes scale_x_c {
0%{transform: scaleX(0);}
100% {transform: scaleX(1);}
}
@keyframes scale_x_l {
0%{transform: scaleX(0);transform-origin: left;}
100% {transform: scaleX(1);transform-origin: left;}
}
@keyframes scale_x_r {
0%{transform: scaleX(0);transform-origin: right;}
100% {transform: scaleX(1);transform-origin: right;}
}
@keyframes scale_y_t {
0%{transform: scaleY(0);transform-origin: top;}
100% {transform: scaleY(1);transform-origin: top;}
}
@keyframes scale_y_b {
0%{transform: scaleY(0);transform-origin: bottom;}
100% {transform: scaleY(1);transform-origin: bottom;}
}
@keyframes bokashi_img {
0%{filter: blur(8px) brightness(180%);transform: scale(1.07)}
100%{filter: blur(0) brightness(100%);transform: scale(1)}
}
@keyframes bokashi {
0%{filter: blur(8px);transform: scale(1.07)}
100%{filter: blur(0);transform: scale(1)}
}
@keyframes width100 {
0%{opacity: 0;width: 0%;}
100% {opacity: 1;width: 100%;}
}

@keyframes height100 {
0%{opacity: 0;height: 0%;}
100% {opacity: 1;height: 100%;}
}
/* ヘッダー吹き出し */
@keyframes purun {0%   { transform:translate(0%, 0%); }10%  { transform:translate(4%,0%); }20%  { transform:translate(8%,0%); }40%  { transform:translate(-8%,0%); }60%  { transform:translate(4%,0%); }80% { transform:translate(0%, 0%); }
100% { transform:translate(0%, 0%); }
}
@keyframes purun_sp {0%   { transform:translate(0%, 0%); }10%  { transform:translate(0%,6%); }20%  { transform:translate(0%,12%); }40%  { transform:translate(0%,-12%); }60%  { transform:translate(0%,6%); }80% { transform:translate(0%, 0%); }
100% { transform:translate(0%, 0%); }
}

/* ローディング */
@keyframes spCircRot {from { transform: rotate(0deg); }to { transform: rotate(359deg); }
}


@media screen and (min-width: 769px) {
html {font-size: 20px;}
body {font-size: 20px;line-height: 1.5;}
}
@media screen and (min-width: 769px) and (max-width: 1200px) {
html {font-size: 1.7vw;}
body {font-size: 1.7vw;}
}
@media screen and (max-width: 768px) {
html {font-size: 4vw;}
body {font-size: 4vw;line-height: 1.5;}
}
.pre-inc{--main_color: #19150c;--gold: #94823e;}
.pre-inc{font-family: YakuHanMP, "游明朝体", "Yu Mincho", YuMincho, "Noto Serif JP", serif;}
.pre-inc sup {vertical-align: 0.5em;font-size: 0.6em;}
.pre-inc img {-ms-interpolation-mode: bicubic;max-width: 100%;vertical-align: bottom;backface-visibility: hidden;}
.pre-inc article *{font-weight: 300;}
.pre-inc .note {font-size: 0.65em;margin-top: 0.7em;}

@media screen and (min-width: 769px) {
.pre-inc .sp {display: none !important;}
.pre-inc .wrap1024 {max-width: 51.2em;margin: 0 auto;}
.pre-inc article {margin-top: 115px;}
}

/* キャプション類 */
.pre-inc .cap_w,.pre-inc .cap_wb,.pre-inc .cap_b,.pre-inc .cap_bw,.pre-inc .cap_l{font-size: 0.6em;position: absolute;right: 0.5em; bottom: 0.5em;z-index: 1;line-height: 1.4;text-align: right;}
.pre-inc .cap_w {color: #fff;}
.pre-inc .cap_wb {color: #fff;text-shadow: 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9), 0px 0px 0.5em rgba(0, 0, 0, 0.9);text-align: right;}
.pre-inc .cap_b {color: #000;}
.pre-inc .cap_bw {text-shadow: 0px 0px 0.5em rgba(255, 255, 255, 0.9), 0px 0px 0.5em rgba(255, 255, 255, 0.9), 0px 0px 0.5em rgba(255, 255, 255, 0.9), 0px 0px 0.5em rgba(255, 255, 255, 0.9), 0px 0px 0.5em rgba(255, 255, 255, 0.9), 0px 0px 0.5em rgba(255, 255, 255, 0.9);}
.pre-inc .cap_o {font-size: 0.6em;margin-top: 0.8em;text-align: right; position: static;}
.pre-inc .cap_ol {font-size: 0.6em;margin-top: 0.8em;position: static;}
.pre-inc .cap_oc {font-size: 0.6em;margin-top: 0.8em;position: static;text-align: center;}
.pre-inc .cap_l {right: auto;left: 1em;text-align: left;}
.pre-inc .cap_u {right: 1em;top: 1em;text-align: right;font-size: 0.5em;}

@media screen and (max-width: 768px) {
.pre-inc .pc {display: none !important;}
.pre-inc .wrap1024 {max-width: 100%;padding: 0 4vw;}
.pre-inc article {margin-top: 75px;}
/* キャプション類 */
.pre-inc .cap_w,.pre-inc .cap_wb,.pre-inc .cap_b,.pre-inc .cap_bw,.pre-inc .cap_l,.pre-inc .cap_o,.pre-inc .cap_ol, .pre-inc .cap_oc,.pre-inc .cap_l {font-size: 0.5em;}
.pre-inc .cap_u {right: 1em;top: unset;bottom: 0.5em;text-align: right;font-size: 0.28em;}
}

/*||||||||||||||||| ヘッダー＆メニュー |||||||||||||||||*/
.pre-inc header {position: fixed;width: 100%;top: 0;left: 0;z-index: 100000;padding: 10px 20px;background: rgba(247, 247, 247, 0.9);height: 115px;}
.pre-inc.scroll_down header {box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);}
.pre-inc.layer.scroll_down header, .pre-inc.h_active header {box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);}
.pre-inc header .header_wrap {display: flex;justify-content: space-between;margin: 0 auto;align-items: center;max-width: 1920px;}
.pre-inc header h1 {margin-right: 10px;}
.pre-inc header h1 img {width: 200px;}
.pre-inc header h1 a {pointer-events: painted;}
.pre-inc header h1 a span {display: inline-block;}
.pre-inc header h1 a small {font-size: 0.7em;}
.pre-inc .header_right {display: flex;align-items: center;height: calc(100% + 20px);position: absolute;right: 100px;top: -10px;}
.pre-inc .header_right a {transition: 0.3s all;}
.pre-inc .header_right .hr_om {display: flex;flex-direction: column;justify-content: center;margin-right: 15px;}
.pre-inc .header_right .hr_om a {font-size: 14px;color: #fff;padding: 3px 0;}
.pre-inc .header_right .hb {width: 125px;height: 50%;display: flex;justify-content: center;align-items: center;color: #fff;letter-spacing: 0;font-size: 15px;margin-left: 7px;}
.pre-inc .header_right .hb i {z-index: 1;text-align: center;line-height: 1.2;}
.pre-inc .header_right .hb::before {content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;transition: 0.3s all;}
.pre-inc .header_right .hb_reservation {background: linear-gradient(to right, #910001, #e10011);order: 2;}
.pre-inc .header_right .hb_reservation::before {background: linear-gradient(to right, #e10011, #910001);}
.pre-inc .header_right .hb_request {background: linear-gradient(to right, #987942, #cca756);order: 1;}
.pre-inc .header_right .hb_request::before {background: linear-gradient(to right, #cca756, #987942);}
.pre-inc .header_right .hb:hover::before {opacity: 0;}
.pre-inc .header_right .hr_om a:hover {opacity: 0.6;}

@media only screen and (min-width: 769px) {
.pre-inc .header_right a .fukidashi {width: 8.3em;height: 3.2em;background: url("../common/img/request_f.png") no-repeat center center/contain;position: absolute;left: -8.5em;margin: auto 0;top: 0;bottom: 0;animation: purun 2s linear 0s 1;animation-iteration-count: infinite;font-size: 20px;filter: drop-shadow(5px 5px 5px #aaa);}
}
@media only screen and (min-width: 1920px) {
.pre-inc header .header_wrap {padding: 0 20px;}
.pre-inc header .hb_menu {right: 25px !important;pointer-events: painted;}
}
@media only screen and (max-width: 768px) {
.pre-inc .header_right {right: 62px;}
.pre-inc .header_right .hr_om a {font-size: 12px;}
.pre-inc .header_right .hb {width: 140px;}
.pre-inc .header_right a.hb_reservation {width: 74px;}
.pre-inc .header_right a.hb_reservation {height: 70%;}
.pre-inc .header_right a.hb_reservation span {font-size: 12px;letter-spacing: 0;padding-left: 0;}
.pre-inc .header_right a.hb_request {width: 74px;font-size: 12px;margin-left: 2px;height: 70%;}
.pre-inc .header_right a.hb_request span {font-size: 12px;letter-spacing: 0;padding-left: 0;}
.pre-inc header .hb_menu {right: 12px !important;}
.pre-inc .header_right a .fukidashi {width: 13.8em;height: 2.5em;background: url("../common/img/request_f_sp.png") no-repeat center center/contain;position: absolute;left: 0;bottom: -2.2em;animation: purun_sp 2s linear 0s 1;animation-iteration-count: infinite;font-size: 14px !important;}
}

/*ハンバーガーメニュー*/
.pre-inc header .hb_menu {position: absolute;top: 0;bottom: 0;margin: auto 0;width: 30px;height: 32px;right: 25px;z-index: 990;transition: all 0.3s;cursor: pointer;display: block;pointer-events: painted;}
.pre-inc header .hb_menu span {display: block;height: 1px;width: 30px;position: absolute;top: 0;bottom: 0;left: 0;margin: auto 0;}
.pre-inc header .hb_menu span i {display: block;height: 1px;width: 100%;transition: all 0.3s;background: #333;border-radius: 3px;}
.pre-inc header .hb_menu span::before,
.pre-inc header .hb_menu span::after {content: "";position: absolute;left: 0;display: block;height: 1px;width: 100%;background: #333;transition: all 0.3s;border-radius: 3px;}
.pre-inc header .hb_menu span::before {top: -10px;}
.pre-inc header .hb_menu span::after {bottom: -10px;width: 100%;}
.pre-inc.h_active .hb_menu span::before {transform: rotate(-135deg);top: 0;right: 0;background: #333;}
.pre-inc.h_active .hb_menu span::after {transform: rotate(135deg);bottom: 0;right: 0;width: 100%;background: #000;}
.pre-inc.h_active .hb_menu span i {display: none;}

/* メニュー */
.pre-inc .menu_wrap {width: 400px;font-size: 20px;opacity: 0;pointer-events: none;background: rgba(255, 255, 255, 0.95);position: fixed;right: 0;transition: 0.3s all;z-index: 11000;overflow-y: auto;box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);padding: 0 1em 0.5em;height: calc(100% - 85px);top: 85px;}
.pre-inc.h_active .menu_wrap {pointer-events: painted;opacity: 1;}
.pre-inc .menu_wrap .menu {display: flex;flex-wrap: wrap;}
.pre-inc .menu_wrap .menu > * {width: 100%;display: flex;align-items: flex-end;border-bottom: solid 1px #ccc;padding: 0.7em 0.5em;}
.pre-inc .menu_wrap .menu > *::after {content: "";width: 0.3em;height: 0.3em;display: block;border-right: 2px solid #555;border-top: 2px solid #555;transform: rotate(45deg);position: absolute;right: 1em;top: 0;bottom: 0;margin: auto 0;}
.pre-inc .menu_wrap .menu > * > * {line-height: 1.3;transition: 0.3s all;}
.pre-inc .menu_wrap .menu > * > i {font-size: 0.7em;color: #000;}
.pre-inc .menu_wrap .menu > * > i.link::after{content: "";display: block;height: 0.9em;width: 2.2em;position: absolute;right: -2.7em;top: 0.3em;background: url(../common/img/menu_link.svg) no-repeat center center / contain;}
.pre-inc .menu_wrap .menu > * > span {font-size: 0.6em;color: #333;margin-left: 1em;}
.pre-inc .menu a.menu_entry {background: linear-gradient(to right, #cca756, #987942);justify-content: center;margin-top: 0.5em;padding: 0.4em 0.1em;border-bottom: none;}
.pre-inc .menu a.menu_entry::after {border-right-color: #fff;border-top-color: #fff;}
.pre-inc .menu a.menu_entry i {color: #fff;text-align: center;}
.pre-inc .menu a.menu_entry i::after {content: "間取りや、最新情報をお届けします。";display: block;font-size: 0.8em;margin-top: 0.2em;}
.pre-inc .menu a.menu_entry span {display: none;}
.pre-inc .menu a.menu_reserve {background: linear-gradient(to right, #e10011, #910001);justify-content: center;margin-top: 0.5em;padding: 0.4em 0.1em;}
.pre-inc .menu a.menu_reserve::after {border-right-color: #fff;border-top-color: #fff;}
.pre-inc .menu a.menu_reserve i {color: #fff;text-align: center;}
.pre-inc .menu a.menu_reserve i::after {content: "事前ご予約で、スムーズにご案内。";display: block;font-size: 0.8em;margin-top: 0.2em;}
.pre-inc .menu a.menu_reserve span {display: none;}
.pre-inc .menu a[href*=reservation_pl3] {background: linear-gradient(to right, #e10011, #910001);justify-content: center;margin-top: 0.5em;padding: 0.4em 0.1em;border-bottom: none;}
.pre-inc .menu a[href*=reservation_pl3]::after {border-right-color: #fff;border-top-color: #fff;}
.pre-inc .menu a[href*=reservation_pl3] i {color: #fff;text-align: center;}
.pre-inc .menu a[href*=reservation_pl3] i::after {content: "事前ご予約で、スムーズにご案内。";display: block;font-size: 0.8em;margin-top: 0.2em;}
.pre-inc .menu a[href*=reservation_pl3] span {display: none;}

@media only screen and (min-width: 769px) {
.pre-inc .menu_wrap {transform: translateX(3%);}.pre-inc.h_active .menu_wrap {  transform: translateX(0%);}
}
/* 未公開ページ（フッターメニューも共通） */
/* .menu a[href$="evaluation"]{pointer-events: none;}.menu a[href$="evaluation"] *{opacity: 0.2;} */

/* NEW */
.pre-inc .menu_wrap .menu a[href$=area-guide]::before,
.pre-inc .menu_wrap .menu a[href$=interview]::before {content: "NEW";display: block;font-size: 0.45em;line-height: 1;position: absolute;color: #750000;top: 0.5em;left: 0.5em;text-align: center;}

/* セレクトページ（フッターメニューも共通） */
.pre-inc#top .menu_wrap .menu a[href$="./"] > *, .pre-inc#position .menu_wrap .menu a[href$=position] > *, .pre-inc#concept .menu_wrap .menu a[href$=concept] > *, .pre-inc#location .menu_wrap .menu a[href$=location] > *, .pre-inc#interview .menu_wrap .menu a[href$=interview] > *, .pre-inc#area-guide .menu_wrap .menu a[href$=area-guide] > *, .pre-inc#access .menu_wrap .menu a[href$=access] > *, .pre-inc#plan .menu_wrap .menu a[href$=plan] > *, .pre-inc#design .menu_wrap .menu a[href$=design] > *, .pre-inc#equipment .menu_wrap .menu a[href$=equipment] > *, .pre-inc#evaluation .menu_wrap .menu a[href$=evaluation] > *, .pre-inc#outline .menu_wrap .menu a[href$=outline] > *, .pre-inc#map .menu_wrap .menu a[href$=map] > *,.pre-inc .menu_wrap .menu a.active > * {color: #750000;pointer-events: none;}

@media screen and (min-width: 769px) {
.pre-inc header + .menu_wrap .menu > *:hover > * {opacity: 0.3;}
}

@media screen and (min-width: 769px) and (max-width: 1399px) {
.pre-inc header {padding: 10px 15px;}
.pre-inc a.re_roleover span {font-size: 15px;}
.pre-inc header .request_btn i {left: auto;  right: -10px;}
}

@media screen and (min-width: 769px) and (max-width: 1000px) {
.pre-inc a.re_roleover span {font-size: 1.5vw;}
}

/* スマホ版メニュー固定メニュー */
@media only screen and (max-width: 768px) {
.pre-inc header {padding: 7px 12px;  height: 75px;}
.pre-inc header .header_wrap {width: 100%;  height: 100%;}
.pre-inc header h1 img {width: 120px;}
.pre-inc.h_active {overflow: hidden;}
.pre-inc .menu_wrap {width: 100%;font-size: 5.3vw;height: calc(100% - 110px);position: fixed;  top: 55px;  transform: translateY(-3%);}
.pre-inc .menu_wrap .menu {width: 100%;  margin: 0 auto;}.pre-inc.h_active .menu_wrap {  transform: translateY(0%);}
}

/* SP版フットメニュー */
.pre-inc .footmenu {background: var(--main_color);display: flex;position: fixed;bottom: 0;left: 0;width: 100%;z-index: 1000000;}
.pre-inc .footmenu a {text-align: center;color: #fff;flex: 1;padding: 5px 0;}
.pre-inc .footmenu a::after {content: "";width: 1px;height: calc(100% - 10px);position: absolute;right: 0;top: 5px;display: block;background: #fff;}
.pre-inc .footmenu a img {width: 22px;}
.pre-inc .footmenu a p {margin-top: 5px;line-height: 1;font-size: 9px;height: 2em;display: flex;justify-content: center;align-items: center;}
.pre-inc .footmenu a:last-of-type::after {display: none;}
.pre-inc .footmenu a.fm_reserve {background: linear-gradient(to right, #192348, #2b3d7e);}

/* トップへ戻るボタン */
.pre-inc a#page_top {background: var(--main_color);width: 30px;height: 30px;position: fixed;right: 30px;bottom: 50px;display: none;z-index: 1000;}
.pre-inc a#page_top::before {content: "";width: 10px;height: 10px;display: block;position: absolute;margin: auto;top: 25%;bottom: 0;left: 0;right: 0;border-top: 1px solid #fff;border-right: 1px solid #fff;transform: rotate(-45deg);}

@media only screen and (max-width: 768px) {
.pre-inc a#page_top {right: 10px;  bottom: 60px;}
}



/*||||||||||||||||| コンテンツ |||||||||||||||||*/
/* メイン */
.pre-inc .salon_main{background: url("../img/salon/main_bk.webp") no-repeat center center/cover;overflow: hidden;padding: 2.5em 0 3em;}
.pre-inc .salon_main > i{display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: rgba(0,0,0,0.9);animation: 3s fadeIn 0.5s forwards;opacity: 0;}
.pre-inc .salon_main .wrap1024{text-align: center;color: #fff;opacity: 0;animation: 2s fadeIn 1s forwards;}
.pre-inc .salon_tit{font-size: 2.5em;}
.pre-inc .salon_tit + p{font-size: 0.9em;margin-top: 1em;}
.pre-inc .salon_tit_s{font-size: 2.8em;margin-top: 0.5em;background: linear-gradient(to bottom, #644f1d 20%, #ab9d68 45%, #9d803a 60%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;font-family: "EB Garamond", serif;letter-spacing: 0.05em;}
.pre-inc .salon_tit_s small{font-size: 0.64em;background: linear-gradient(to bottom, #644f1d 20%, #ab9d68 45%, #9d803a 60%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.pre-inc .salon_video{margin-top: 2em;cursor: pointer;pointer-events: none;}
.pre-inc .salon_video::before{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: url("../img/salon/video_poster_pc.jpg") no-repeat center center/cover;z-index: 1;}
.pre-inc .salon_video.play::before{display: none;}
.pre-inc .salon_video video{width: 100%;pointer-events: auto;}
.pre-inc .salon_video i:nth-of-type(1){display: block;width: 7.5em;height: 1px;background: #fff;position: absolute;top: -0.5em;left: -1em;animation: 2s fadeInRight 1.5s forwards;opacity: 0;}
.pre-inc .salon_video i:nth-of-type(2){display: block;width: 1px;height: 7.5em;background: #fff;position: absolute;top: -1em;left: -0.5em;animation: 2s fadeInUp 1.5s forwards;opacity: 0;}
.pre-inc .salon_video i:nth-of-type(3){display: block;width: 7.5em;height: 1px;background: #fff;position: absolute;bottom: -0.5em;right: -1em;animation-name: fadeInLeft;}
.pre-inc .salon_video i:nth-of-type(4){display: block;width: 1px;height: 7.5em;background: #fff;position: absolute;bottom: -1em;right: -0.5em;animation-name: fadeInDown;}

@media screen and (min-width: 769px) {
}

@media screen and (max-width: 768px) {
.pre-inc .salon_tit{font-size: 1.8em;}
.pre-inc .salon_tit_s{font-size: 1.7em;}
.pre-inc .salon_video{width: 90vw;margin-inline: auto;}
.pre-inc .salon_video::before{background: url("../img/salon/video_poster_sp.jpg") no-repeat center center/cover;}

}

/* 共通 */
.pre-inc .section_tit{font-family: "EB Garamond", serif;font-size: 5em;line-height: 1;color: #a99f73;}
.pre-inc .section_tit i{display: inline-block;opacity: 0;}
.pre-inc .section_tit i.text_ani{animation: 2s fadeIn 0s forwards;}

@media screen and (max-width: 768px) {
.pre-inc .section_tit{font-size: 2.8em;}
}

/* CONCEPT */
.pre-inc .concept_intro{padding: 4.5em 0;background: url("../img/salon/concept_intro_bk_pc.webp") no-repeat center center/cover;}
.pre-inc .concept_intro .section_tit_s{font-size: 1.8em;margin-top: 1.5em;letter-spacing: 0.05em;animation-name: fadeInUp;}
.pre-inc .concept_intro .section_tit_s + p{font-size: 0.9em;margin-top: 1em;letter-spacing: 0.05em;line-height: 2;animation-name: fadeInUp;}
.pre-inc .concept_salonmap{padding: 4.5em 0;background: url("../img/salon/concept_salonmap_bk.webp") no-repeat center center/cover;color: #fff;}
.pre-inc .concept_salonmap .concept_salonmap_tit{font-size: 1.5em;text-align: center;animation-name: fadeInUp;}
.pre-inc .concept_salonmap .concept_salonmap_tit_s{font-size: 1.5em;text-align: center;margin-top: 0.2em;margin-bottom: 2em;animation-name: fadeInUp;}
.pre-inc .concept_salonmap .concept_salonmap_tit_s small{font-size: 0.67em;text-align: center;display: block;}
.pre-inc .concept_salonmap_wrap{max-width: 782px;margin: 1em auto 0;animation-name: fadeInUp;}
.pre-inc .concept_salonmap_img i{width: 1.25em;height: 1.25em;display: flex;justify-content: center;align-items: center;background: #a99f73;border: 1px solid #fff;box-shadow: 0.05em 0.05em 0.2em rgba(0,0,0,0.7);position: absolute;cursor: pointer;transition: 0.3s all;}
.pre-inc .concept_salonmap_img i span{font-size: 0.8em;line-height: 1;color: #fff;}
.pre-inc .concept_salonmap_img .a{left: 19.8em;top: 4.95em;}
.pre-inc .concept_salonmap_img .b{left: 6.3em;top: 12em;}
.pre-inc .concept_salonmap_img .c01{left: 2.4em;top: 5.65em;}
.pre-inc .concept_salonmap_img .c02{left: 2.4em;top: 12.35em;}
.pre-inc .concept_salonmap_img .c03{left: 2.4em;top: 19.8em;}
.pre-inc .concept_salonmap_img .c04{left: 7.65em;top: 20.95em;}
.pre-inc .concept_salonmap_img .d{left: 12em;top: 5.3em;}
.pre-inc .concept_salonmap_img .e{left: 29em;top: 4.45em;}
.pre-inc .concept_salonmap_img .f{left: 19em;top: 15.5em;}
.pre-inc .concept_salonmap_list{display: flex;margin-top: 1em;}
.pre-inc .concept_salonmap_list > *{width: 50%;}
.pre-inc .concept_salonmap_list > * p{cursor: pointer;margin-top: 0.5em;transition: 0.3s all;}
.pre-inc .concept_salonmap_list > * p > span{font-size: 0.9em;margin-left: 0.3em;}

.pre-inc .modal_bk {display: none;position: fixed;z-index: 1000000;inset: 0;background: rgba(0, 0, 0, 0.9);cursor: pointer;}
.pre-inc .s_modal{z-index: 1000001;position: fixed;width: 51.2em;inset: 0;max-height: 80vh;margin: auto;opacity: 0;pointer-events: none;transition: 0.5s all;}
.pre-inc .s_modal.active{opacity: 1;pointer-events: auto;}
.pre-inc .s_modal .s_modal_wrap{overflow-y: auto;width: 100%;height: 100%;background: #fff;margin: auto 0;}
.pre-inc .s_modal .s_modal_tit > span{font-size: 1em;display: inline-block;margin-left: 0.5em;}
.pre-inc .s_modal .s_modal_tit + p{font-size: 0.8em;margin-top: 1em;}
.pre-inc .s_modal .s_modal_tit_s{font-size: 0.9em;margin-top: 1em;}
.pre-inc .s_modal .s_modal_tit_s + p{font-size: 0.8em;margin-top: 1em;}
.pre-inc .s_modal p + figure{margin-top: 1.5em;display: inline-block;}
.pre-inc .s_modal p + figure [src$='.svg']{width: 20em;}
.pre-inc .s_modal .s_modal_item{padding: 3.5em 4em;}
.pre-inc .s_modal dl.s_modal_item{display: flex;justify-content: space-between;}
.pre-inc .s_modal .s_modal_item > dt{width: 20em;}
.pre-inc .s_modal .s_modal_item > dd{width: 22em;}
.pre-inc .s_modal .close_btn{font-family: "EB Garamond", serif;color: #fff;font-size: 0.8em;margin: 1.5em auto 0; width: 5em;text-align: center;transition: 0.3s all;cursor: pointer;}
.pre-inc .alpha{width: 1.25em;height: 1.25em;display: inline-flex;justify-content: center;align-items: center;background: #a99f73;vertical-align: 0.1em;}
.pre-inc .alpha > span{font-size: 0.8em;line-height: 1;color: #fff;}

@media screen and (min-width: 769px) {
.pre-inc .concept_salonmap_img i:hover{opacity: 0.6;}
.pre-inc .s_modal .close_btn:hover{opacity: 0.6;}
.pre-inc .concept_salonmap_list > * p:hover{opacity: 0.6;}
}

@media screen and (max-width: 768px) {
.pre-inc .concept_intro{background: url("../img/salon/concept_intro_bk_sp.webp") no-repeat center center/cover;padding: 3em 0;}
.pre-inc .concept_intro .section_tit_s{font-size: 1.4em;}
.pre-inc .concept_salonmap{padding: 3em 0;}
.pre-inc .concept_salonmap .concept_salonmap_tit{font-size: 1.3em;}
.pre-inc .concept_salonmap .concept_salonmap_tit_s{font-size: 1.1em;}
.pre-inc .concept_salonmap_img{font-size: 2.3vw;}
.pre-inc .concept_salonmap_img i{width: 5vw;height: 5vw;}
.pre-inc .concept_salonmap_img i span{font-size: 3.5vw;}
.pre-inc .concept_salonmap_img .cap_o{font-size: 2.5vw;}
.pre-inc .concept_salonmap_list > * p{display: flex;}

.pre-inc .s_modal{width: 92vw;max-height: 80vh;}
.pre-inc .s_modal p + figure{display: block;}
.pre-inc .s_modal p + figure img{width: 100%;}
.pre-inc .s_modal .s_modal_item{padding: 1.5em 1.5em;}
.pre-inc .s_modal dl.s_modal_item{flex-wrap: wrap;}
.pre-inc .s_modal .s_modal_item > dt{width: 100%;}
.pre-inc .s_modal .s_modal_item > dd{width: 100%;margin-top: 1.5em;}
}

/* GUEST ROOM */
.pre-inc #guestroom .section_tit{text-align: center;}
.pre-inc .concept_guestroom{padding: 4.5em 0;background: url("../img/salon/concept_salonmap_bk.webp") no-repeat center center/cover;color: #fff;}
.pre-inc .concept_guestroom_wrap{width: 100%;max-width: 1024px;margin: 70px auto 0px;animation-name: fadeInUp;}
.pre-inc .concept_guestroom_img ul{display:flex;flex-wrap: wrap;justify-content: space-between;}
.pre-inc .concept_guestroom_img li:nth-child(1){width:67.7%;}
.pre-inc .concept_guestroom_img li:nth-child(2){width:30%;}
.pre-inc .concept_guestroom_img li:nth-child(3){width:49%;margin-top:1em}
.pre-inc .concept_guestroom_img li:nth-child(4){width:49%;margin-top:1em}
.pre-inc .room_list ul{display:flex;flex-wrap: wrap;justify-content: space-between;margin-top: 1.5em;}
.pre-inc .room_list li{width:49%;}
.pre-inc .room_list li:nth-child(n+3){margin-top:1em}
.pre-inc .concept_guestroom .section_tit_s{font-size: 1.8em;margin-top: 1.5em;letter-spacing: 0.05em;animation-name: fadeInUp;}
.pre-inc .concept_guestroom .section_tit_s + p{font-size: 0.9em;margin-top: 1em;letter-spacing: 0.05em;line-height: 2;animation-name: fadeInUp;}

@media screen and (max-width: 768px) {
.pre-inc .concept_guestroom .section_tit_s{font-size:1.4em;}
.pre-inc .concept_guestroom_wrap{margin:2em auto 0;}
.pre-inc .room_list ul{justify-content: center;}
.pre-inc .room_list li{width:90%;}
.pre-inc .room_list li:nth-child(n+2){margin-top:1em}
}

/* PHOTO GALLERY */
.pre-inc #photo_gallery{padding: 4.5em 0;background: url("../img/salon/photo_gallery_bk.webp") no-repeat center center/cover;}
.pre-inc #photo_gallery .section_tit{text-align: right;}
.pre-inc #photo_gallery .comingsoon{margin: 3em auto 0;background: #999;width: 40em;height: 22.5em;display: flex;justify-content: center;align-items: center;animation-name: fadeInUp;}
.pre-inc #photo_gallery .comingsoon span{font-family: "EB Garamond", serif;color: #fff;font-size: 1.6em;}

@media screen and (max-width: 768px) {
.pre-inc #photo_gallery{padding: 3em 0;}
.pre-inc #photo_gallery .comingsoon{font-size: 2.3vw;}
}

/* gallery_slider追加 */
.pre-inc .gallery_container{width: 100%;max-width: 800px;margin: 70px auto 0px;animation-name: fadeInUp;}
.pre-inc .gallery_slide figure{position: relative;}
.pre-inc .gallery_slide figure figcaption{color: #FFF;font-family: "EB Garamond", serif;font-size: 46px;line-height: 1;position: absolute;left: 10px;bottom: 10px;filter: drop-shadow(1px 1px 1px rgba(0,0,0,1)) drop-shadow(1px 1px 2px rgba(0,0,0,0.5));}
.pre-inc .gallery_container .slick-dotted.slick-slider{margin-bottom: 0px;}
.pre-inc .gallery_note{margin-top:3em;color:#fff;font-size: 0.65em;}
.pre-inc .shapedots .slick-dots{text-align: right;}
.pre-inc .shapedots .slick-dots li,.pre-inc .shapedots .slick-dots li button{width: 30px;height: 10px;padding: 0;margin: 0 3px;}
.pre-inc .shapedots{position: relative;}
.pre-inc .shapedots .slick-dots li{background: #999999;width: 30px;height: 10px;margin: 0 2px;}
.pre-inc .shapedots .slick-dots li.slick-active{background: #a99f73;}
.pre-inc .shapedots .slick-dots li button{font-size: 0;line-height: 0;display: block;width: 30px;height: 10px;padding: 0px;cursor: pointer;color: transparent;border: 0;outline: none;background: transparent;}
.pre-inc .shapedots .slick-dots li button::before {display: none;}

@media screen and (max-width: 768px){
.pre-inc .gallery_slide figure figcaption{font-size: 24px;}
}

/* MAP */
.pre-inc #map{padding: 4.5em 0;background: url("../img/salon/map_bk.webp") no-repeat center center/cover;}
.pre-inc .map_item{display: flex;justify-content: space-between;margin-top: 3em;color: #fff;}
.pre-inc .map_item > dt{width: 29em;text-align: center;animation-name: fadeInUp;}
.pre-inc .map_item > dt .map_tit{font-size: 1.2em;}
.pre-inc .map_item > dt .map_frame{border: 1px solid #fff;padding: 1em;margin-top: 1.3em;font-size: 1em;}
.pre-inc .map_item > dt .parking{font-size: 0.9em;margin-top: 1.5em;}
.pre-inc .map_item > dt .parking::before{content: "";width: 1.333em;height: 1.333em;vertical-align: -0.2em;background: url("../img/salon/parking_icon.png") no-repeat center center/cover;display: inline-block;margin-right: 0.3em;}
.pre-inc .map_item > dt .parking ~ p{font-size: 0.8em;margin-top: 1.3em;}
.pre-inc .map_item > dt .parking + p{margin-top: 2.5em;}
.pre-inc .map_item > dd{width: 19.5em;animation-name: fadeInUp;}
.pre-inc .map_item > dd figure{background: #fff;}
.pre-inc .map_item > dd figure img{width: 100%;}
.pre-inc #map a{display: block;width: 20em;margin: 3em auto 0;text-align: center;color: #fff;padding: 0.7em;border: 1px solid;border-image: linear-gradient(170deg,#9a792d,#a69e6f,#6c5010);border-image-slice: 1;}
.pre-inc #map a::before{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: linear-gradient(170deg,#9a792d,#a69e6f,#6c5010);transition: 0.3s all;}
.pre-inc #map a span{font-size: 1em;letter-spacing: 0.05em;text-decoration: none;z-index: 2;}

@media screen and (min-width: 769px) {
.pre-inc .map_item > dd{animation-delay: 0.3s;}
.pre-inc #map a:hover::before{opacity: 0;}
}

@media screen and (max-width: 768px) {
.pre-inc #map{padding: 3em 0;}
.pre-inc .map_item{margin-top: 2em;flex-wrap: wrap;}
.pre-inc .map_item > dt{width: 100%;}
.pre-inc .map_item > dd{width: 100%;margin-top: 1.5em;;}

}

/*# sourceMappingURL=salon.css.map */