@charset "UTF-8";

:root {
  /* カラー（色） */
  --color: #000;
  --color-gray: #999;
  --color-gray2: #909090;
  --color-bg-gray: #efefef;
  --color-bg-gray2: #f5f5f5;
  --color-red: #9b3b3b;
  --color-red2: #ff0000;
}

html, body{height: 100%;}

body{font-family:'Jost',Meiryo,'Hiragino Kaku Gothic ProN','Hiragino Sans',sans-serif;background-color:#FFF;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media screen and (min-width:768px) {
  body{min-width:1200px;margin:0 auto;}
}
/* body.is-open{height:100%;width:100%;position:fixed;left:0;} */

button, input, select, textarea{font-family:inherit;}

.smt_on{display:none!important;}

/*-------------------------
__header
-------------------------*/
#header{background-color:rgba(225, 225, 225, .0);height:133px;box-sizing:border-box;position:fixed;left:0;right:0;top:0;transition:.3s;z-index:10;}
#header .mypage_area{background-color: var(--color);width:100%;position:absolute;top:0;left:0;}
#header .mypage_area>.inner{height:100%;margin:0 25px;}
#header .mypage_area>.inner ul{display:flex;justify-content:flex-end;align-items:center;}
#header .mypage_area>.inner ul li{height: 100%;font-size: 1.4em;line-height: 1.5;color: #fff;padding: 0.5em 1em;}
#header .mypage_area>.inner ul li:last-child{padding-right: 0;}
#header .mypage_area>.inner ul li a{color: #fff;text-decoration: none;padding-left: 1em;display: block;transition:.3s;position: relative;}
#header .mypage_area>.inner ul li a::before{content: "";width: 0.5em;height: 0.5em;clip-path: polygon(0 0, 100% 50%, 0 100%);background-color: #fff;position: absolute;top: 0.5em;left: 0;}
#header > .inner{display:flex;justify-content:space-between;align-items:center;height:100%;margin:0 25px;padding:35px 0 0;box-sizing:border-box;transition:.3s;}
#header #logo{font-size:1px;line-height:0;height:24px;width:169px;}
#header #logo svg{height: 100%;width: 100%;opacity: 0;display: flex;align-items: flex-start;object-fit: contain;}
#header #nav {display:flex;align-items:center;margin-right:70px;opacity:0;transition:.3s;}
#header #nav > ul{display:flex;}
#header #nav > ul > li{height:58px;position:relative;}
#header #nav > ul > li:not(:last-child){margin-right:30px;}
#header #nav > ul > li > a{font-size:1.6em;line-height:1.5;letter-spacing:0 04em;color:#000;text-decoration:none;display:flex;justify-content:center;align-items:center;height:100%;transition:color .3s;}
@media only screen and (min-width: 768px) {
  #header .mypage_area>.inner ul li a:hover,
  #header #nav > ul > li > a:hover{color:var(--color-gray);}
}
#header #nav > ul > li ul {display:none;width:156px;position:absolute;left:-10px;top:58px;z-index:11;}
#header #nav > ul > li.selected ul{display:block;}
#header #nav > ul > li ul li + li {border-top:1px solid #fff;}
#header #nav > ul > li ul li a {font-size:1.4em;line-height:36px;color:#fff;letter-spacing:0.04em;text-decoration:none;text-align:left;display:block;background-color:rgba(0, 0, 0, .9);height:36px;box-sizing:border-box;padding-left:12px;transition:background-color .3s;}
@media only screen and (min-width: 768px) {
  #header #nav > ul > li ul li a:hover{background-color:rgba(0, 0, 0, 1);}
}

#fix_logo{font-size:1px;line-height:0;height:90px;width:99px;position:fixed;left:30px;top:65px;opacity:0;z-index:10;}
#fix_logo svg{height:auto;width:100%;transition:.3s;}

/*-------------------------
__content
-------------------------*/
#content{display:block;}

.topic_path{max-width:960px;margin:0 auto;padding:0 0 80px;clear:both;position:relative;z-index:1;}
.topic_path ul{display:flex;flex-wrap:wrap;justify-content:flex-end;}
.topic_path.tal ul{justify-content:flex-start;}
.topic_path li{font-size:1.4em;line-height:1.5;color:var(--color);}
.topic_path li::before{content:">";color:var(--color);margin:0 5px;}
.topic_path li:first-child::before{content:"";margin:0;}
.topic_path li a{font-weight:400;color:var(--color);transition:color .3s;}
@media only screen and (min-width: 768px) {
  .topic_path li a:hover{color:var(--color-gray);}
}

.page_ttl_box{max-width:960px;margin:0 auto;padding-bottom:100px;padding-top:200px;}
.page_ttl{font-size:6.4em;line-height:1.3;font-weight:500;letter-spacing:0.04em;text-align:left;margin-top:-30px;}
.page_ttl::after{content:"";display:block;height:2px;width:40px;margin-top:25px;background-color:var(--color);}
.page_ttl span{font-size:28%;font-weight:400;display:block;}

.page_txt{font-size: 1.4em;line-height: 1.5em;padding-top: 2em;text-align: left;text-align: left;}

.c_ttl{font-size:100%;margin-bottom:60px;}
.c_ttl .en{font-size:3.5em;font-weight:500;color:var(--color);letter-spacing:0.04em;text-align:left;display:block;white-space:nowrap;}
.c_ttl .jp{font-size:1.4em;font-weight:700;color:var(--color-gray2);letter-spacing:0.08em;text-align:left;display:block;margin-top:7px;transition:color .3s;}
.c_ttl > span > span{display:inline-block;}

.c_btn{font-size:16px;font-weight: 700;line-height:70px;letter-spacing:0.08em;text-align:center;text-decoration:none;display:block;background-color:var(--color);height:70px;box-sizing:border-box;overflow:hidden;position:relative;transition:.2s;border: solid 1px var(--color);border-radius: 10px;padding: 0 2em 0 4em;}
.c_btn::before{content:"";display:block;background-color:#fff;height:100%;width:100%;position:absolute;left:0;top:0;z-index:2;transition:transform .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;transform:scale(0, 1);transform-origin:right top;}
.c_btn::after{content: "";width: 8px;height: 8px;border-style: solid;border-color: #fff;border-width: 1px 1px 0 0;transform: translateY(-50%) rotate(45deg);z-index: 2;position: absolute;top: 50%;left: 1.5em;}
.c_btn span{color:#fff;position:relative;z-index:3;}
@media only screen and (min-width: 768px) {
  .c_btn:hover{border: solid 1px var(--color);}
  .c_btn:hover::before{transform-origin:left top;transform:scale(1, 1);}
  .c_btn:hover::after{border-color: var(--color);}
  .c_btn:hover span{color:var(--color);}
}

.more_btn a{text-decoration:none;display:block;text-align:right;position:relative;}
.more_btn a .txt{font-size:1.4em;letter-spacing:0.08em;color:var(--color);display:inline-block;margin-right:5px;margin-bottom:18px;transition:color .3s;}
@media only screen and (min-width: 768px) {
  .more_btn a:hover .txt{color:var(--color-gray);}
}
.more_btn a .line{display:block;background-color:var(--color);height:1px;width:100%;transform-origin:left top;}
@media only screen and (min-width: 768px) {
  .more_btn a:hover .line{width:calc(100% + 8px);transition:.3s;}
}
.more_btn a .arrow{display:block;background-color:var(--color);width:1px;height:10px;position:absolute;bottom:-1px;right:2px;transform:rotate(-45deg);}
@media only screen and (min-width: 768px) {
  .more_btn a:hover .arrow{right:-6px;transition:.3s;}
}

.fadeInUp{opacity:0;}

.page_back{width: 100%;padding-top: 60px;}
.page_back .c_btn{width: 300px;margin: 0 auto;}

.m_search_lnk_wrap{max-width: 960px;margin: 0 auto;}
.m_search_lnk_wrap .m_search_lnk_ttl{font-size: 1.6em;font-weight: 700;line-height: 1.3em;color: var(--color-gray);padding-bottom: 1em;}
.m_search_lnk_wrap .m_search_lnk{margin: -5px;display: flex; flex-wrap: wrap;}
.m_search_lnk_wrap .m_search_lnk li{width: 20%;padding: 5px;box-sizing: border-box;}
.m_search_lnk_wrap .m_search_lnk li a{font-size: 1.4em;font-weight: 700;color: var(--color);text-decoration: none;background-color: #eee;padding: 1em;border-radius: 10px;box-sizing: border-box;transition: all .3s;display: block;}
@media only screen and (min-width: 768px) {
    .m_search_lnk_wrap .m_search_lnk li a:hover{color: #fff;background-color: var(--color);}
}

.recommend{width: 100%;padding-top: 60px;}
.recommend .box_wrap{display: flex;flex-wrap: wrap;margin: -10px;}
.recommend .box_wrap .box{width: 25%;padding: 10px;box-sizing: border-box;}
.recommend .box_wrap .box a{text-decoration: none;display: block;position: relative;}
.recommend .box_wrap .box a::after{content: "";width: 100%;aspect-ratio: 1 / 1;border: 2px solid var(--color);box-sizing: border-box;transition: opacity .3s cubic-bezier(0.8, 0, 0.2, 1) 0s, left .3s cubic-bezier(0.8, 0, 0.2, 1) 0s, right .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;position: absolute;left: -5px;top: -5px;}
.recommend .box_wrap .box a .img{width: 100%;aspect-ratio: 1 / 1;display: block;overflow: hidden;}
.recommend .box_wrap .box a .img img{width: 100%;height: 100%;object-fit: cover;transition: transform .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;}
.recommend .box_wrap .box a .mask{display: none;}
.recommend .box_wrap .box a .txt_box{padding-top: 10px;}
.recommend .box_wrap .box a .txt_box .kind{font-size: 1.2em;line-height: 1.3;color: var(--color-gray);font-weight: 700;padding-top: 1em;padding-bottom: 0.5em;display: block;}
.recommend .box_wrap .box a .txt_box .add {font-size: 1.6em;color: var(--color);line-height: 1.3;display: block;}
.recommend .box_wrap .box a .txt_box .price {font-size: 1.2em;color: var(--color);line-height: 1.3;display: block;font-feature-settings: 'palt';}
.recommend .box_wrap .box a .txt_box .price span {font-size: 18px;}
@media only screen and (min-width: 768px) {
    .recommend .box_wrap .box a:hover::after{opacity: 0;left: 0;right: 0;}
    .recommend .box_wrap .box a:hover .img img {transform: scale(1.2);}
}

/*-------------------------
__footer
-------------------------*/
#footer{background:var(--color) url(../images/foot_illust.png) repeat-x center bottom;background-size:auto 90px;padding-bottom:120px;padding-top:60px;}
#footer > .inner{display:flex;max-width:960px;margin:0 auto;}
#footer .foot_link_box{width:50%;display:flex;flex-wrap: wrap;border-right:1px solid #fff;}
#footer .foot_link_box .foot_link{text-align:left;width:50%;padding-bottom:15px;padding-top:15px;}
#footer .foot_link_box .foot_link li{font-size:1.5em;line-height:2.1;letter-spacing:0.04em;}
#footer .foot_link_box .foot_link li a{color:#fff;text-decoration:none;transition:color .3s;}
#footer .foot_link_box .foot_lnk_ttl{width: 100%;text-align: left;margin-top: 30px;position: relative;z-index: 1;}
#footer .foot_link_box .foot_lnk_ttl::before{content: "";width: 100%;height: 1px;background-color: #fff;position: absolute;top: 15px;left: 0;z-index: -1;}
#footer .foot_link_box .foot_lnk_ttl span{font-size:1.5em;color: var(--color-gray);line-height:2.1;background-color: var(--color);padding-right: 1em;display: inline-block;}
#footer .footer_com{font-size:1.5em;color: #fff;line-height:2.1;text-align: left;padding-bottom: 60px;}
@media only screen and (min-width: 768px) {
  #footer .foot_link_box .foot_link li a:hover{color:var(--color-gray);}
}
#footer .foot_info_box{width:50%;display:flex;justify-content:center;align-items:center;}
#footer .foot_info_box .foot_info{text-align:left;display:inline-block;}
#footer .foot_info_box .foot_info dt{font-size:2.3em;line-height:1.3;font-weight:700;color:#fff;letter-spacing:0.04em;padding-bottom:10px;}
#footer .foot_info_box .foot_info dd.txt{font-size:1.4em;line-height:2;color:#fff;letter-spacing:0.04em;}
#footer .foot_info_box .foot_info dd.txt span + span{margin-left:2em;}
#footer .foot_info_box .foot_info dd.txt a{font-size:1px;line-height:0;vertical-align:middle;display:inline-block;margin-top:-5px;transition:opacity .3s;}
@media only screen and (min-width: 768px) {
  #footer .foot_info_box .foot_info dd.txt a:hover{opacity:.6;}
}
#footer .foot_info_box .foot_info dd.tel{font-size:2.8em;line-height:1.3;font-weight:500;color:#fff;letter-spacing:0.08em;margin:10px 0;}
#footer .foot_info_box .foot_info dd.tel a{color:#fff;margin-right:2em;}
@media only screen and (min-width: 768px) {
  #footer .foot_info_box .foot_info dd.tel a{text-decoration:none;pointer-events:none;}
}
#footer .foot_info_box .foot_info dd.tel .ico{font-size:1px;line-height:0;vertical-align:middle;display:inline-block;margin:-7px 5px 0 0;}
#footer .foot_logo{font-size:1px;line-height:0;width:64px;margin:80px auto 25px;}
#footer .foot_logo svg{fill:#fff;height:auto;width:100%;}
#footer .copyright{font-size:1.2em;color:#fff;letter-spacing:0.08em;}

.scroll_btn{font-size:1.4em;color:#000;display:flex;justify-content:center;align-items:center;height:120px;width:120px;margin-top: -60px;position:fixed;z-index:100;right:-15px;top:50%;transform:rotate(90deg);}
.scroll_btn.top{opacity:0;z-index:-1;filter:invert(100%);mix-blend-mode:exclusion;}
.scroll_btn.bottom{opacity:0;}
.scroll_btn a,
.scroll_btn > span{display:inline-block;white-space:nowrap;position:relative;}
.scroll_btn a{color:#000;text-decoration:none;}
.scroll_btn a span,
.scroll_btn > span span{display:block;background-color:#000;height:1px;width:48px;position:absolute;left:0;top:-4px;opacity:0;}
.scroll_btn a span{animation:scroll_line_down 1.5s ease-in-out infinite;}
.scroll_btn > span span{animation:scroll_line_up 1.5s ease-in-out infinite;}
@keyframes scroll_line_up {
	0% {width:0;left:0;opacity:0;}
	30% {width:26px;opacity:1;}
	100% {width:0;left:48px;opacity:1;}
}
@keyframes scroll_line_down {
  0% {width:0;left:48px;opacity:1;}
  70% {width:26px;opacity:1;}
  100% {width:0;left:0;opacity:0;}
}

.fixed_btn{padding: calc(25px / 2);display: flex;position: fixed;bottom: 0;right: 0;z-index: 99;}
.fixed_btn>.btn{text-decoration: none;border: solid 1px var(--color);margin: calc(25px / 2);border-radius: 10px;box-sizing: border-box;overflow: hidden;display: block;}
.fixed_btn>.btn>span{width: 140px;height: 140px;font-size: 1.4em;line-height: 1.3em;font-weight: 700;color: #fff;background-color: var(--color);padding: 25px;padding-top: 6em;box-sizing: border-box;transition: .3s;display: block;position: relative;}
.fixed_btn.color_change>.btn>span{background-color: #555;}
.fixed_btn>.btn>span::before{content: "";width: 3em;height: 3em;-webkit-background-size: contain;background-size: contain;background-repeat: no-repeat;margin-left: -1.5em;position: absolute;top: 1.5em;left: 50%;}
.fixed_btn>.btn.contact>span::before{background-image: url("/images/icon01.svg");}
.fixed_btn>.btn.reserve>span::before{background-image: url("/images/icon02.svg");}
@media only screen and (min-width: 768px) {
    .fixed_btn>.btn:hover>span{filter: invert(100%);}
}

.toggle_btn_box{height:25px;width:30px;position:fixed;right:25px;top:70px;z-index:1000;opacity:0;transition:.3s;}
.toggle_btn{background:transparent;display:flex;justify-content:center;align-items:center;height:100%;width:100%;padding:0;border:none;border-radius:0;cursor:pointer;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:.3s;}
.toggle_btn .btn_line{background-color:var(--color);height:1px;width:100%;position:relative;transition:.3s;}
.toggle_btn .btn_line::before,
.toggle_btn .btn_line::after{content:"";display:block;background-color:var(--color);height:100%;width:100%;position:absolute;transition:.3s;}
.toggle_btn .btn_line::before{transform:translateY(-12px);}
.toggle_btn .btn_line::after{transform: translateY(12px);}
.is-open .toggle_btn{transform:rotate(180deg);}
.is-open .toggle_btn .btn_line{background-color:transparent;}
.is-open .toggle_btn .btn_line::before,
.is-open .toggle_btn .btn_line::after{background-color:#fff;}
.is-open .toggle_btn .btn_line::before{transform:rotate(135deg);}
.is-open .toggle_btn .btn_line::after{transform:rotate(-135deg);}

#drawer_menu{height:100%;min-height:100%;width:100%;max-width:100%;position:fixed;left:0;top:0;overflow:auto;opacity:0;visibility:hidden;transition:opacity .4s, visibility .4s;overscroll-behavior:contain;scrollbar-width:none;z-index:900;}
#drawer_menu::-webkit-scrollbar{display:none;}
#drawer_menu > .inner{height:calc(100% + 1px);width:100%;}
#drawer_menu > .inner > .menu_box{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:rgba(0, 0, 0, .85);height:100%;width:100%;min-height:600px;overflow-y:auto;}
#drawer_menu > .inner > .menu_box .menu_box_inner{width: 100%;max-width: 1280px;padding: 0 32px;box-sizing: border-box;display: flex;flex-wrap: wrap;justify-content: center;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul{text-align:left;padding: 0 32px;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li{font-size:3.2em;line-height:1.5;color:#FFF;letter-spacing:0.08em;padding: 0.5em 0;opacity:0;transform:translateX(200px);transition:opacity .2s ease, transform .6s ease;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li a{color:#FFF;text-decoration:none;display:block;transition:color .3s;}
#drawer_menu > .inner > .menu_box .btn{font-size: 24px;border:  solid 1px #fff;margin-top: 32px;}
@media only screen and (min-width: 981px) {
  #drawer_menu > .inner > ul > li a:hover{color:var(--color-gray);}
}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li span{font-size:50%;letter-spacing:0.04em;vertical-align:middle;display:inline-block;margin-left:20px;margin-top:-6px;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li > ul{display:flex;margin-left:20px;margin-top:5px;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li > ul li{font-size:43%;letter-spacing:0.04em;}
#drawer_menu > .inner > .menu_box .menu_box_inner > ul > li > ul li:not(:last-child){margin-bottom:5px;margin-right:1em;}
.is-open #drawer_menu{visibility:visible;opacity:1;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li{opacity:1;transform:translateX(0);transition:transform 1s ease, opacity 1s ease}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(2){transition-delay:.1s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(3){transition-delay:.2s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(4){transition-delay:.3s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(5){transition-delay:.4s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(6){transition-delay:.5s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(7){transition-delay:.6s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(8){transition-delay:.7s;}
.is-open #drawer_menu > .inner > .menu_box .menu_box_inner > ul > li:nth-of-type(9){transition-delay:.8s;}

/*-------------------------
__404
-------------------------*/
#error{max-width:1000px;margin:0 auto;padding:0 0 180px;box-sizing:border-box;position:relative;z-index:1;}
#error p{font-size:1.6em;line-height:2;color:var(--color);letter-spacing:0.04em;text-align:left;padding-bottom:30px;}
#error p a{color:var(--color);text-decoration:underline;transition:.3s;}
#error p a:hover{color:#999;}

/*-------------------------
__EZ-SEARCH
-------------------------*/
.asp_content_wrap{opacity:0;}
#asp_content{width:960px;margin:0 auto;padding:140px 0 120px;position:relative;z-index:1;}
#asp_content .topic_path{padding:0 0 15px;}
#asp_content .topic_path:last-child{padding:15px 0 0;}
#asp_content #asp_ms_header{padding-top:0;}

#asp_content .asp_pageTitle{font-size:24px;line-height:1.5;font-weight:700;color:var(--color);text-align:left;height:auto;margin:0 0 20px;padding:8px 0 8px 12px;border-left:5px solid var(--color);border-bottom:1px solid #CCC;}
#asp_content .page_title{font-size:24px;line-height:1.5;font-weight:700;color:#3b3f3f;text-align:left;height:auto;margin:0 0 20px;padding:8px 0 8px 12px;border-left:5px solid var(--color);border-bottom:1px solid #CCC;}

#asp_content .bnr_request{max-width:730px;margin:50px auto 0;}
#asp_content .bnr_request a{font-size:1px;line-height:0;display:block;}
#asp_content .bnr_request a img{height:auto;width:100%;transition:.3s;}
@media only screen and (min-width: 768px) {
  #asp_content .bnr_request a:hover img{opacity:0.7;}
}

#asp_content .chenge{margin-top:5px;position:absolute;top:60px;right:4px;height:26px;overflow:hidden;z-index:99;color:#fff!important;}
#asp_content .chenge a{color:#fff!important;text-decoration:underline;display:inline-block;*display:inline;*zoom:1;}
#asp_content .chengea:hover{color:#fff!important;text-decoration:none;}
#asp_content .chenge a:hover img{margin-top:-26px;}
#asp_content .chenge span{background-color:#fff;font-size:13px;line-height:26px;padding-left:5px;vertical-align:top;padding-top:6px;padding-bottom:6px;}
#asp_content .chenge span a{background-color:#fff;color:#fff!important;text-decoration:underline;display:inline-block;*display:inline;*zoom:1;}
#asp_content .chenge span a:hover{background-color:#fff;color:#fff!important;text-decoration:none;}

#asp_content #result_footer #shadow_box #shadow{background:none;height:auto;border-top:1px solid #fff;top:auto;}
#asp_content #result_footer #result_box .result p span{color:#fff;}

.checked .asp_wrap .scroll_btn{bottom:125px;}