@charset "UTF-8";
html,body{font-family:"YakuhanMin", YakuHanMP, "Yu Mincho", "YuMincho", "Noto Serif JP", serif;}
/* html,body{height: 100%;font-family: "Shin Go Regular","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";} */

@media screen and (min-width: 769px) {
body{font-size:15px;line-height:1.6;}
.sp{display: none!important;}
.wrap1024{max-width: 1084px;margin: 0 auto;padding: 0 30px;}
.note{font-size:13px;}
sup{font-size:60%;}
}

@media screen and (max-width: 768px) {
body{font-size:13px;line-height:1.5;}
.pc{display: none!important;}
.wrap1024{max-width: 100%;padding: 0 20px;}
.note{font-size:11px;}
}

.tx_center{text-align: center;}

/*||||||||||||||||| ヘッダー＆メニュー |||||||||||||||||*/

header.header_menu{position: fixed;width: 100%; top: 0;z-index: 1000;left: 0;padding: 0 20px 7px;background: #fff;}

header .header_wrap{display: flex;justify-content: center;margin: 0 auto;align-items: flex-start;flex-wrap: wrap; width: 100%;}

header h1{padding-top: 7px;margin-right: 10px;flex: 1 0 186px;align-self: center;}
header h1 a:hover img{opacity: 0.6;}

/*header.header_menu{position: fixed;width: 100%; top: 0;z-index: 1000;left: 0;padding: 0 0 10px;background: #fff;max-width: 1920px;margin: 0 auto;right: 0;}

header .header_wrap{display: flex;justify-content: space-between;margin: 0 auto;flex-wrap: wrap;align-items: flex-start;width: 100%;}

header h1{padding-top: 20px;}
header h1 a:hover img{opacity: 0.6;} */

/* PC用右上ボタン */
.pc_header_menu_r{display: flex;justify-content: flex-end;margin-top: 7px;width: calc(100% - 200px);}
.pc_header_menu_r li.out_map{align-self: center;}
.pc_header_menu_r li.out_map a{color: #333;font-size: 14px;display: inline-block;margin-right: 25px;}
.pc_header_menu_r li.out_map a:hover{opacity: 0.6;}
.pc_header_menu_r li.request_btn{width: 170px;margin-right:1%;}
.pc_header_menu_r li.reservation_btn{width: 170px;}
.pc_header_menu_r li.request_btn::before{content: "";display: block;position: absolute;top: 5px;left: 5px;width: calc(100% - 12px);height: calc(100% - 12px);border: 1px solid #fff;}
.pc_header_menu_r li.request_btn::before,.pc_header_menu_r li.reservation_btn::before{content: "";display: block;position: absolute;top: 0;bottom: 0;right: 0;margin: auto; left: 0;width: calc(100% - 12px);height: calc(100% - 12px);border: 1px solid #fff;}
/* .pc_header_menu_r{display: flex;justify-content: flex-end;margin-top: 20px;}
.pc_header_menu_r li.out_map{align-self: center;}
.pc_header_menu_r li.out_map a{color: #333;font-size: 14px;margin-right: 30px;}
.pc_header_menu_r li.out_map a:hover{opacity: 0.6;}
.pc_header_menu_r li.request_btn{margin-right: 10px;}
.pc_header_menu_r li.request_btn,
.pc_header_menu_r li.reservation_btn{width: 170px;}
.pc_header_menu_r li.request_btn::before,
.pc_header_menu_r li.reservation_btn::before{content: "";display: block;position: absolute;top: 0;bottom: 0;right: 0;margin: auto; left: 0;width: calc(100% - 12px);height: calc(100% - 12px);border: 1px solid #fff;} */
/* ロールオーバ（めくれる） */
a.re_roleover{display: block;text-align: center;box-sizing: border-box;padding:6px 0;color:#fff;font-size:13px;overflow: hidden;position: relative;transition: .3s;letter-spacing: 0.1em;}
a.re_roleover::before{content: "";position: absolute;top: 0;left: 0;z-index: -1; width: 150%;height: 100%;transform-origin: right top;transform: skewX(-30deg) scale(0, 1);transition: transform .3s;background: #fff;}
a.re_roleover::after{content: "";position: absolute; z-index: -2;top: 0;left: 0;width: 100%;height: 100%;display: block;}
a.re_roleover:hover::before{content: "";transform-origin: right top;transform: skewX(-30deg) scale(1, 1);}
a.re_roleover span{font-size: 15px;display: block;border-bottom: 1px solid #fff;width: calc(100% - 18px);margin: 0 auto;}

.request_btn a{border:1px solid #e29fab;}
.request_btn a::after{
width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(
-45deg, #69B2C3, #82AEBE, #A6A8B7, #C9A3B0, #E29FAB);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    display: block;
}
.request_btn a:hover{color:#e29fab;}
.request_btn a:hover span{border-bottom: 1px solid #e29fab;}

.reservation_btn a{border:1px solid #e29fab;}
.reservation_btn a::after{
width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(
-45deg, #7385AB, #617BA9, #6E66A2, #7A539A, #844696);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    display: block;
}
.reservation_btn a{border:1px solid #e29fab ;}
.reservation_btn a:hover{color:#e29fab;}
.reservation_btn a:hover span{border-bottom: 1px solid #e29fab;}

@keyframes gradient {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}
/*ハンバーガーメニュー*/
header .hb_menu{display: none;}

/* メニュー */
header .menu{display: flex;max-width: 1920px;margin: 10px auto 0;width: 100%;}
header .menu a{text-align: center;display: block;padding: 5px;border-bottom: 1px solid #fff;flex: 1;border-right: dotted 1px #888;}
header .menu a:first-of-type{border-left: dotted 1px #888;}
header .menu a > *{display: block;line-height: 1.7;}
header .menu a > i{font-size: 14px;color: #333;}
header .menu a > span{font-size: 13px;color: #477aad;}
header .menu a::after{position: absolute;bottom: -2px;left: 0;right: 0;content: '';width: calc(100% - 6px);height: 2px;background: #df98a8;transform: scale(0, 1);margin: 0 auto;transform-origin: center top;transition: transform 0.3s;}
header .menu a:last-of-type{border-bottom: none;}
header .menu a:hover::after{transform: scale(1, 1);}

/* 未公開ページ
header .menu a[href$="concept.html"],
header .menu a[href$="design.html"],
header .menu a[href$="evaluation.html"]
{pointer-events: none;}
header .menu a[href$="concept.html"] *,
header .menu a[href$="design.html"] *,
header .menu a[href$="evaluation.html"] *
{opacity: 0.3;}
 */
header .menu a.nolink{pointer-events: none;opacity: 0.3;}

/* セレクトページ（フッターメニューも共通） */
#top .menu a[href$="./"]::after,
#concept .menu a[href$="concept.html"]::after,
#location .menu a[href$="location.html"]::after,
#access .menu a[href$="access.html"]::after,
#room_plan .menu a[href$="room_plan.html"]::after,
#design .menu a[href$="design.html"]::after,
#equipment .menu a[href$="equipment.html"]::after,
#evaluation .menu a[href$="evaluation.html"]::after,
#outline .menu a[href$="outline.html"]::after,
#map .menu a[href$="map.html"]::after
{transform: scale(1, 1);}


/* スクロール後 */
.scroll_down header.header_menu{box-shadow:0px 0px 5px 1px #d3d3d3;}
@media only screen and (min-width: 769px){
.scroll_down header .menu a > span{display: none!important;}
}

@media only screen and (min-width: 769px){
header .menu a[href$="outline.html"],
header .menu a[href$="map.html"]
{display: none;}
}

/*||||||||||||||||| スマホ版メニュー（全ページ共通） |||||||||||||||||*/
/* 固定メニュー */
@media only screen and (max-width: 768px) {

header.header_menu{padding: 0;height: auto;background: rgba(255,255,255,0.8);box-shadow: none;}

header .header_wrap{display: block;align-items: center;}

header h1{padding: 10px;z-index: 100;}
header h1 img{width: 160px;}

.pc_header_menu_r{display: none;}

/*ハンバーガーメニュー*/
header .hb_menu{position: absolute;top:20px;width: 30px;height: 32px;right: 20px;z-index: 990;transition: all 0.3s;cursor: pointer;display: block;}
header .hb_menu span{display: block;height: 3px;width: 30px;position: absolute;top:10px;left: 0;}
header .hb_menu span i{display: block;height: 3px;width: 30px;transition: all 0.3s;background: #fff;box-shadow: 1px 1px 4px #888;}
header .hb_menu span::before,
header .hb_menu span::after{content:"";position: absolute;left: 0; display: block;height: 3px;width: 30px;background: #fff;transition: all 0.3s;box-shadow: 1px 1px 4px #888;}
header .hb_menu span::before{top:-10px;}
header .hb_menu span::after{bottom:-10px;}

header.h_active .hb_menu span::before{transform:rotate(-135deg);top:0;right:0;content:'';box-shadow: none;background: #333;}
header.h_active .hb_menu span::after{transform:rotate(135deg);bottom:0;right:0;content:'';box-shadow: none;background: #333;}
header.h_active .hb_menu span i{display: none;background: #333;}

/* メニュー */
header .menu{position: fixed;top: 0;right: 0;background: rgba(255,555,255,0.9);width: 100vw;height: 100vh;padding: 15vh 50px 40vh;transform: translateY(-50px);opacity: 0;pointer-events: none;transition: all 0.3s;flex-wrap: wrap;margin-top: 0;}
header .menu a{font-size:14px;color: #333;padding: 2vh;flex: 0 1 50%;}
header .menu a:first-of-type{border-left:none;flex: 0 1 100%;padding: 1vh;border-top: solid 2px #888;}
header .menu a:nth-of-type(odd){border-right:none;border-top:none;}
header .menu a::after{background: #888;transform: scale(1, 1);bottom:0;}
header .menu a:hover::after,
header .menu a.select::after{background: #df98a8;}

header.h_active .menu{transform: translateY(0);pointer-events: painted;opacity: 1;}

/* セレクトページ（フッターメニューも共通） */
#top .menu a[href$="./"],
#concept .menu a[href$="concept.html"],
#location .menu a[href$="location.html"],
#access .menu a[href$="access.html"],
#room_plan .menu a[href$="room_plan.html"],
#design .menu a[href$="design.html"],
#equipment .menu a[href$="equipment.html"],
#evaluation .menu a[href$="evaluation.html"],
#outline .menu a[href$="outline.html"],
#map .menu a[href$="map.html"]
{background: #fcf0f3;}
#top .menu a[href$="./"]::after,
#concept .menu a[href$="concept.html"]::after,
#location .menu a[href$="location.html"]::after,
#access .menu a[href$="access.html"]::after,
#room_plan .menu a[href$="room_plan.html"]::after,
#design .menu a[href$="design.html"]::after,
#equipment .menu a[href$="equipment.html"]::after,
#evaluation .menu a[href$="evaluation.html"]::after,
#outline .menu a[href$="outline.html"]::after,
#map .menu a[href$="map.html"]::after
{background: #df98a8;}

}


/*|||||||||| フッター前［資料請求ボタン・注釈］（全ページ共通） ||||||||||*/
#footer_before{padding: 50px 0 0;background: #fff;}
#footer_before .footer_wrap{margin: 0 auto;max-width: 1044px;padding: 0 10px;}
#footer_before .footer_wrap > p{font-size: 14px;margin-bottom: 50px;}
#footer_before .footer_re_btn{display: flex;justify-content: space-around;width:90%;margin: 0 auto;}
#footer_before .footer_re_btn li{width: 48%;}
#footer_before .footer_re_btn a.re_roleover{display: block;width: 100%;margin: 0 auto;color: #fff;text-align: center;box-sizing: border-box;}
#footer_before .footer_re_btn a.re_roleover span{display: block;padding: 15px 5px;border: 1px solid #fff;font-size: 24px;letter-spacing: 0.1em;}
#footer_before .footer_re_btn a.re_roleover i{font-size: 18px;}
#footer_before .footer_re_btn a.re_roleover small{display: block;font-size: 14px;padding: 5px 0 0 0;  color: #fff;border-top: none;margin-top: 7px;}
#footer_before .footer_re_btn a.re_roleover:hover,
#footer_before .footer_re_btn a.re_roleover:hover small{color:#e29fab;background: none;}
#footer_before .note{margin-bottom: 50px;}
#footer_before a.re_roleover span {width: calc(100% - 12px);}

@media only screen and (max-width: 768px) {
#footer_before{padding: 30px 15px 0;}
#footer_before .footer_wrap > p{font-size: 12px;margin-bottom: 30px;}
#footer_before .footer_re_btn{width:100%;flex-wrap: wrap;}
#footer_before .footer_re_btn li{width: 100%;}
#footer_before .footer_re_btn a.re_roleover{margin: 0 auto;font-size: 18px;background: url("../img/btn_bk_sp.png") no-repeat;background-position: top right 130%;}
#footer_before .footer_re_btn a.re_roleover span{font-size: 20px;padding: 7px 5px;}
#footer_before .footer_re_btn a.re_roleover i{font-size: 15px;}
#footer_before .footer_re_btn a.re_roleover small{font-size: 12px;padding: 3px 0 0 0;margin-top: 4px;letter-spacing: 0em;}
#footer_before .note{margin-bottom: 30px;}
#footer_before a.re_roleover span {width: calc(100% - 8px);height: calc(100% - 8px);}
#footer_before .footer_re_btn li:nth-of-type(n+2){margin-top: 10px;}
}

/*||||||||||||||||| フッター（全ページ共通） |||||||||||||||||*/
footer{padding:0 0 30px;}

@media only screen and (max-width: 768px) {
footer{padding:0 0 70px;}
}

/* フッターメニューPCのみ */
.footer_menu_wrap{background: #ebebe8;padding: 15px 30px;margin-top: 50px;}
.footer_menu_wrap .menu{max-width: 1200px;margin: 0 auto;display: flex;}
.footer_menu_wrap .menu a{flex: 1;font-size: 14px;color: #333;border-right: 1px solid #555;text-align: center;display: flex;justify-content: center;align-items: center;line-height: 1.3;}
.footer_menu_wrap .menu a small{font-size: 13px;display: block;letter-spacing: -0.1em;}
.footer_menu_wrap .menu a::after{position: absolute;bottom: -2px;left: 0;right: 0;content: '';width: 90%;height: 1px;background: #333;transform: scale(0, 1);margin: 0 auto;transform-origin: center top;transition: transform 0.3s;}
.footer_menu_wrap .menu a:hover::after{transform: scale(1, 1);}
.footer_menu_wrap .menu a:last-of-type{border-right: none;}

@media only screen and (max-width: 1200px) {
.footer_menu_wrap .menu a small{display: inline;}
}

/* 未公開ページ */
/* .footer_menu_wrap .menu a[href$="concept.html"],
.footer_menu_wrap .menu a[href$="design.html"],
.footer_menu_wrap .menu a[href$="evaluation.html"] */
.footer_menu_wrap .menu a.nolink{color: #bbb;pointer-events: none;}


/* フッター電話番号 */
footer .footer_tel{padding: 70px 0 50px;text-align: center;}
footer .footer_tel_wrap > *{text-align: left;}
footer .footer_tel dl{margin: 0 auto;display: flex;align-items: flex-end;justify-content: center;}
footer .footer_tel .footer_tel_wrap{display: inline-block;}
footer .footer_tel_wrap p{font-size: 13.5px;}
footer .footer_tel dl dt{margin-right: 30px;}
footer .footer_tel dl dd{}
footer .footer_tel .tel{font-size: 60px;color:#000;display: block;line-height: 1;margin-top: 7px;pointer-events: none;letter-spacing: 0.07em;}
footer .footer_tel .tel::before{content: "";background: url("../img/freedial.png") no-repeat;display: inline-block;width: 79px;background-size: contain;height: 50px;margin-right: 0.1em;vertical-align: -7px;}

@media only screen and (max-width: 960px) {
footer .footer_tel .tel{font-size: 6.8vw;letter-spacing: 0;}
footer .footer_tel .tel::before{content: "";background: url("../img/freedial.png") no-repeat;width: 8vw;background-size: contain;height: 6vw;margin-right: 0.1em;}
}

@media only screen and (max-width: 768px) {
footer .footer_tel{padding: 30px 0;}
footer .footer_tel_wrap > p{padding: 0 20px;}
footer .footer_tel dl{padding: 0 20px;flex-wrap: wrap;}
footer .footer_tel dt,
footer .footer_tel dd{width: 100%;}
footer .footer_tel dl dt{margin-right: 0;}
footer .footer_tel_wrap p{font-size: 11px;}
footer .footer_tel .tel{font-size: 11vw;margin: 5px 0;pointer-events:painted;letter-spacing: 0;}
footer .footer_tel .tel::before{content: "";background: url("../img/freedial.png") no-repeat;display: inline-block;width: 44px;background-size: contain;height: 28px;margin-right: 0.1em;vertical-align: 0;}
}


/* フッターロゴマーク集 */
footer .footer_logo{padding: 45px 30px;margin: 0 auto 60px;background: #f4f7f7;}
footer .footer_logo .mark{display: flex;justify-content: center; align-items: center;}
footer .footer_logo .mark li{margin-right: 20px;}
footer .footer_logo .mark li:last-of-type{margin-right: 0;}
footer .footer_logo .brand{display: flex;justify-content: center;margin-top: 45px;}
footer .footer_logo .brand li{margin-right: 30px;}
footer .footer_logo .brand li:last-of-type{margin-right: 0;}
footer .footer_logo .brand li a{transition: all 0.3s;}
footer .footer_logo .brand li a:hover{opacity: 0.6;}

@media only screen and (max-width: 768px) {
footer .footer_logo{padding: 20px 20px;display: block;margin: 0 auto 30px;}
footer .footer_logo .mark{width: 100%;margin: 0 auto;}
footer .footer_logo .mark li{margin-right: 10px}
footer .footer_logo .brand{width: 100%;flex-wrap: wrap;justify-content: flex-start;margin-top: 10px;}
footer .footer_logo .brand li{margin-top: 10px;margin-right: 0;height: 45px;}
footer .footer_logo .brand li img{max-height: 100%;}
}

/* フッターコピーライト */
footer .copy {text-align: center;font-size: 13px;}

@media only screen and (max-width: 768px) {
footer .copy {font-size: 10px;}
}


/* ブランドサイトはこちら */
footer .brand_site{margin: 60px 0 60px;text-align: center;}
footer .brand_site a{display: inline-block;color: #000;font-size: 15px;}
footer .brand_site a::before{content: ""; display: inline-block;width: 33px;height: 23px; background: url("../img/icon-footer-logo4.png") no-repeat;background-size: contain;margin-right: 0.5em;vertical-align: -0.5em;}
footer .brand_site a::after{content: "";position: absolute;bottom: -7px;left: 0;width: 100%;height: 1px;background: #000;transform: scale(1, 1);transition: .3s;}
footer .brand_site a:hover::after{content: "";position: absolute;bottom: -7px;left: 0;width: 100%;height: 1px;background: #000;transform: scale(0, 1);}

@media only screen and (max-width: 768px) {
footer .brand_site{margin: 30px 0 40px;}
footer .brand_site a{font-size: 13px;}
footer .brand_site a::before{content: "";width: 23px;height: 15px; background: url("../img/icon-footer-logo4.png") no-repeat;background-size: contain;margin-right: 0.5em;vertical-align: -0.2em;}
footer .brand_site a::after{content: "";bottom: -5px;}
}


/* SP版フットメニュー */
.footmenu{background: linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%); /* background: url("../img/footmenu_bk.jpg") center center/cover; */ display: flex;position: fixed;bottom: 0;left: 0;width: 100%;padding: 5px 0;z-index: 1000;}
.footmenu a{width: 25%;text-align: center;color: #fff;border-right: 1px solid #fff;}
.footmenu a p{margin-top: 5px;line-height: 1;font-size: 9px;}
.footmenu a:last-of-type{border-right: none;}



/* トップへ戻るボタン */
a#page_top{background: linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%);width: 30px;height: 30px;position: fixed;right: 30px;bottom: 50px;border: 1px solid #fff;}
a#page_top::before{content: "";width: 12px;height: 12px;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);z-index: 99;}

@media only screen and (max-width: 768px) {
a#page_top{right: 10px;bottom: 60px;}
}

article{margin-top: 150px;}

@media only screen and (max-width: 768px) {
article{margin-top: 0;}
}

/*||||||||||||||||| 下層ページ共通 |||||||||||||||||*/

.layer .page_tit{text-align: center;background: linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%);color: #fff;font-size: 28px;padding: 15px 0 13px;animation-name: fadeIn;letter-spacing: 0.1em;}
.layer .page_tit02{text-align: center;background: linear-gradient(to right,#7fccd6,#dfedd4);color: #000;font-size: 28px;padding: 15px 0 13px;animation-name: fadeIn;letter-spacing: 0.1em;}
.layer .page_tit02 span{display: inline-block;padding: 0 0.7em;margin-left: 65px;}
.layer .page_tit02 span::before{content: "";background-image: url("../img/tit_mark.png");width: 48px;height: 48px;background-size: contain;display: inline-block;position: absolute;right: 100%;top: 0;}
.layer main .page_tit02{position: absolute;z-index: 1;top: 50%;left: 0;right: 0; transform: translateY(-50%);width: 550px;margin: 0 auto;}
.layer main .main_img{width: 100%;}
.cap_w{text-shadow: 0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000;position: absolute;bottom: 10px;right: 15px;z-index: 1;color: #fff;font-size: 13px;}
.cap_b{position: absolute;bottom: 10px;right: 15px;z-index: 1;color: #000;font-size: 13px;}
.fig_cap{font-size: 13px;text-align: right;margin-top: 7px;}

.layer .contents_tit{text-align: center;font-size: 28px;margin-top: 50px;animation-name: fadeInUp;}
.layer .contents_tit + *{margin-top: 45px;}
.layer .contents_tit + p{margin-top: 20px;animation-name: fadeInUp;}

.layer .item_tit{font-size: 24px;text-align: center;margin-top: 60px;animation-name: fadeInUp;}
.layer .item_tit + p{margin-top: 15px;animation-name: fadeInUp;}


@media only screen and (max-width: 768px) {
.layer article{margin-top: 70px;}
.layer .page_tit{font-size: 22px;padding: 10px 0 8px;}
.layer .page_tit02{font-size: 22px;padding: 10px 0 8px;}
.layer .page_tit02 span{margin-left: 30px;}
.layer .page_tit02 span::before{width: 30px;height: 30px;}
.layer main .page_tit02{width: 280px;}
.cap_w{font-size: 11px;bottom: 6px;right: 8px;}
.cap_b{font-size: 11px;bottom: 6px;right: 8px;}
.fig_cap{font-size: 11px;margin-top: 5px;}

.layer .contents_tit{font-size: 20px;margin-top: 20px;}
.layer .contents_tit + *{margin-top: 20px;}

.layer .item_tit{font-size: 18px;margin-top: 40px;}
.layer .item_tit + p{margin-top: 10px;}

}
