@charset "UTF-8"; /* CSS Document */ @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=Noto+Sans+JP&family=Noto+Serif+JP:wght@300;400;500;700;900&family=Roboto:ital,wght@0,300;0,500;0,700;0,900;1,300;1,500;1,700&family=Shippori+Mincho:wght@400;500;600;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap'); *, *:before, *:after { -webkit-box-sizing: inherit; box-sizing: inherit; } html { -webkit-box-sizing: border-box; box-sizing: border-box; } body{ font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif; color: #150301; } img {width: 100%;height: auto;} .Lato {font-family:'Lato', sans-serif;} .Noto_Sans_JP {font-family: 'Noto Sans JP', sans-serif;} .Noto_Serif_JP {font-family: 'Noto Serif JP', serif;} .Roboto {font-family: 'Roboto', sans-serif;} .Shippori_Mincho {font-family: 'Shippori Mincho', serif;} .mrs-eaves-roman-small-caps {font-family: mrs-eaves-roman-small-caps, serif;font-style: normal;font-weight: 400;} .montserrat {font-family: "Montserrat", serif;} .jost{font-family: "Jost", serif;} .josefin-sans {font-family: "Josefin Sans", serif;} /*========================================================== fade SPは削除する ========================================================= */ .fade{ opacity : 0; transition: opacity 2s; } .fade.view{ opacity: 1; } @media screen and (max-width: 767px) { .fade{ text-align: unset; opacity : unset; transition: unset; } .fade.view{ opacity: unset; } } /*========================================================== Base-Kits ========================================================= */ .sp{display: none;} .pc{display: block;} @media(max-width:767px) { .sp{display: block;} .pc{display: none;} } /*========================================================== Font ========================================================= */ a { color: #025ABA; text-decoration: underline; font-weight: normal; transition:.3s; } a:visited { color: #666; } a:hover { color: #039; font-weight: normal; text-decoration: none; transition:.3s; } p{ margin-bottom: 1em; } strong { font-weight: 600; } .lato {font-family: 'Lato', sans-serif;} .wrap {min-width: 100%;margin: 0 auto;box-sizing: border-box;padding-right: 88px;} @media screen and (max-width: 767px) { .wrap {overflow: hidden;min-width: 100%;} } /* ========================================================= ============================================================ ============================================================ HEADER ============================================================ ============================================================ ========================================================= */ .header {width: 88px;height: 100vh; position: fixed;top:0;right: 0;background-image: url("../img/menu_bk_shinsekai.png");background-size: 100% auto;background-repeat: repeat-y;background-position: top right;z-index: 100;} .header .header__inner {width: 100%;} .header .header__inner .Menu .menu .global-navigation_list {width: 100%;} .header .header__inner .Menu .menu .global-navigation_list li {border-bottom: solid 1px #6A5B46;position: relative;} .header .header__inner .Menu .menu .global-navigation_list li a {padding: 24px 0;text-align: center;font-family: "Montserrat", serif;font-size: 27px;font-weight: 500;letter-spacing: 0.2em; color: #FFF;position: relative;} .header .header__inner .Menu .menu .global-navigation_list li a:after {content: '';width: 32px;height: 3px;border-radius: 2px;background-color:#D2B68E;position: absolute;left: calc(50% - 16px);bottom: 12px; } .header .header__inner .Menu .menu .global-navigation_list .lang_switch {padding: 32px 0 0;display: flex;justify-content: center;align-content: center;font-size: 17px;font-weight: 500;color: #FFF;} .header .header__inner .Menu .menu .global-navigation_list .lang_switch a {font-family: "Montserrat", serif;font-size: 17px;font-weight: 500;color: #FFF;margin: 0 0.5em;} .header .header__inner .header_logo {width: 32px;margin: 100px auto 100px;} .header .header__inner .header_logo h1 {} .header .header__inner .btn_reservation {width: 100%;position: absolute;bottom: 0;right: 0;} .header .header__inner .btn_reservation .search-bt {width: 100%;height: 100%;cursor: pointer;} .header .header__inner .bnr_bestrate {width: 280px; position: absolute;bottom: 88px;right: 88px;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking {width: 90%;margin: 32px auto 40px} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a {width: 100%;background-color: #D97318;color: #FFF;text-align: center;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;padding: 24px 0;text-decoration: none;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .en {font-family: "Montserrat", serif;font-size: 24px;font-weight: 600;letter-spacing: 0.1em;width: 100%;margin: 0 auto 16px;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .jp {font-size: 18px;font-weight: 700;width: 100%;margin: 0 auto 10px;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow {width: 100%;height: 24px;position: relative;display: block;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:before,.header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:after {position: absolute;top: 80%;right:calc(50% - 28px);height: 1px;background: #FFF;content: '';} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:before {width: 56px;transform: translateY(-50%);} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:after {width: 24px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} @media screen and (max-height: 660px) { .header .header__inner .header_logo {width: auto;height: calc(100vh - 310px);margin: 100px auto 100px;} .header .header__inner .header_logo h1 {width: auto;height: 100%;display: flex;justify-content: center;align-items: center;} .header .header__inner .header_logo h1 a {width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;} .header .header__inner .header_logo h1 img {width: auto;height: auto;max-width: 100%;max-height: 100%;} } @media screen and (max-width: 767px) { .header {width: 100%;height: 60px;background-image: url("../img/menu_bk_shinsekai_sp.png");background-size: cover;background-repeat: no-repeat;} .header .header__inner .header_logo {width: 40%;max-height: 25px; position: absolute;top:calc(50% - 7px);left: 5%;margin: 0;} .header .header__inner .btn_reservation {display: none;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a {padding: 5% 0 3%;text-decoration: none;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .en {font-size: 5.6vw;margin: 0 auto 3%;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .jp {font-size: 4.0vw;font-weight: 700;width: 100%;margin: 0 auto 1%;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow {width: 100%;height: 24px;position: relative;display: block;} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:before,.header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:after {position: absolute;top: 80%;right:calc(50% - 28px);height: 1px;background: #FFF;content: '';} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:before {width: 56px;transform: translateY(-50%);} .header .header__inner .Menu .menu .global-navigation_list .groupbooking a .arrow:after {width: 24px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} } /*---------------------------- * メニュー開閉ボタン *----------------------------*/ .menu-btn button {border: none;background: transparent;cursor: pointer;} .menu-btn{position: fixed;top: 20px;right: 4px;z-index: 2;width: 80px;height: 80px;display: flex;justify-content: center;align-items: center;color: #000;box-sizing: border-box;cursor: pointer;} @media screen and (max-width: 767px) { .menu-btn{width: 60px;height: 60px;top: 0;right: 0;} } /*---------------------------- * メニュー本体 *----------------------------*/ .menu{position: fixed;top: 0;right: 88px;z-index: 1;width:calc(50% - 88px);height: 100vh;display: flex;justify-content: center; align-items: flex-start; padding: 96px 0 40px;background:rgba(0,0,0,0.80);} .global-navigation_list {} .global-navigation_list li {} .global-navigation_list li a {display: block;height: 100%;width: 100%;color: #FFF;text-decoration: none;} .global-navigation_list li a:hover {color: #8dc21f;} @media screen and (max-width: 767px) { .wrap {width: 100%;overflow: hidden;padding: 60px 0 0;} .menu{position: fixed;top: 60px;right: 0px;z-index: 1;width:100%;height:calc(100vh - 60px);display: flex;justify-content: center; align-items: flex-start; padding: 12% 0 40px;background:rgba(0,0,0,0.80);} } /*---------------------------- * アニメーション部分 *----------------------------*/ /* アニメーション前のメニューの状態 */ .menu{pointer-events: none;opacity: 0;transition: opacity .3s linear;} /* アニメーション後のメニューの状態 */ .menu.is-active{pointer-events: auto;opacity: 1;} .MenuBtn.Style01 {position: relative;width: 50px;height: 50px;display: flex;justify-content: center;align-items: center;} .MenuBtn.Style01 .MenuBtn-BarFrame {position: relative;display: block;width: 24px;height: 2px;top: -5px;} .MenuBtn.Style01 .MenuBtn-BarFrame::after {display: block;content: "MENU";margin-top: 14px;letter-spacing: 0.1rem;text-align: center;color: #000;font-size: 12px;font-weight: 400;text-indent: -10px;} .MenuBtn.Style01 .MenuBtn-BarFrame-FirstBar {position: absolute;display: block;width: 100%;height: 50%;background-color: #000;transition: all .15s linear;} .MenuBtn.Style01 .MenuBtn-BarFrame-SecondBar {position: absolute;display: block;width: 100%;height: 50%;background-color: #000;transition: all .15s linear;transform: translateY(-8px) rotate(0deg);} .MenuBtn.Style01 .MenuBtn-BarFrame-ThirdBar {position: absolute;display: block;width: 100%;height: 50%;background-color: #000;transition: all .15s linear;transform: translateY(8px) rotate(0deg);} .MenuBtn.Style01.isClosed .MenuBtn-BarFrame-FirstBar {opacity: 0;} .MenuBtn.Style01.isClosed .MenuBtn-BarFrame-SecondBar {transform: translateY(0) rotate(45deg);} .MenuBtn.Style01.isClosed .MenuBtn-BarFrame-ThirdBar {transform: translateY(0) rotate(-45deg);} @media screen and (max-width: 1216px) { .MenuBtn.Style01 .MenuBtn-BarFrame::after {font-size: 9px;padding-left: 7px;} } /* ========================================================= ============================================================ ============================================================ MV ============================================================ ============================================================ ========================================================= */ .mv {width: 100%;height: 100vh;aspect-ratio: 1440 / 800;background-image: url("../img/mv.jpg");background-size: cover;background-repeat: no-repeat;background-position: center;z-index: 10;} .mv .in {width: 100%;height: 100%; display: flex;justify-content: center;align-items: center;position: relative;} .mv .in:after {content: '';color: #FFF; width: 1px;height: 158px;position: absolute;background-color: #FFF;left: calc(50% - 0.5px);bottom: 0;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;} .mv .in:before {content: 'SCROLL';font-family: "Montserrat", serif;color: #FFF;font-size: 10px; font-weight: 500;letter-spacing: 0.3rem;line-height: 2; position: absolute;left: calc(50% + 1px);bottom: 90px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;} .mv .in .mv_logo {width: 27.8%;max-width: 400px;height: auto;-webkit-filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.6)); */filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.9));} .mv .reservation_area {width: 100%;height: auto;position: absolute;left: 0;bottom: -70px;} .mv .reservation_area .reservation_box {width: 100%;padding-right: 88px; display: flex;justify-content: center;align-items: center;} .mv .reservation_area .reservation_box button {background-color: inherit;border: none;z-index: 10;} @media screen and (max-width: 992px) { .mv {min-height: 767px;aspect-ratio: auto;} .mv .reservation_area {width: 100%;height: auto;position: absolute;left: 0;bottom: -13%;} } @media screen and (max-width: 767px) { .mv {width: 100%;min-height:calc(100vh - 60px);height:calc(100vh - 60px);aspect-ratio: auto;} .mv .in:after {display: none;} .mv .in:before {display: none;} .mv .in .mv_logo {width: 50%;height: auto;} .mv .reservation_area {width: 100%;height: auto;position: absolute;left: 0;bottom: -15rem;} .mv .reservation_area .reservation_box {padding-right: 0; } .mv .reservation_area .reservation_box button {width: 100%; background-color: inherit;border: none;z-index: 10;} } .f_banner {width: 1008px;margin: 0 auto 64px;} .f_banner a {display: block;} .f_banner a img {width: 100%;height: auto;vertical-align: bottom;transition: all 0.5s;} .f_banner a:hover img {opacity: 0.7;} @media screen and (max-width: 767px) { .f_banner {width: 90%;margin: 0 auto 8%;} } /* ========================================================= ============================================================ ============================================================ footer ============================================================ ============================================================ ========================================================= */ footer {background-color: #000;padding: 96px 0;position: relative;} footer .in {max-width: 1040px;box-sizing: border-box;padding: 0 16px; margin: 0 auto 0;display: flex;justify-content: flex-start;} footer .in .mark_area {width: 424px;border-right: solid 1px #FFF;} footer .in .mark_area .logo_box {width: 176px;margin: 0 0 24px;} footer .in .mark_area .txt_box {color: #FFF;} footer .in .mark_area .txt_box .add {font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 1.6;} footer .in .mark_area .txt_box .tel {font-family: "Montserrat", serif;font-size: 22px;font-weight: 500;letter-spacing: 0.15em;line-height: 1.6;} footer .sns_area {position: absolute;right:0;bottom: 50%;transform: translate(0,50%);display: flex;justify-content: flex-end;align-items: center;} footer .sns_area .sns_tit {-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 12px;letter-spacing: 0.3em;line-height: 1.8; font-weight: 500;color: #FFF;} footer .sns_area .sns_tit img {} footer .sns_area .sns_btn {width: 48px;} footer .sns_area .sns_btn a {display: block; width: 48px;margin: 0;padding: 12px 0;} footer .f_nav {padding-left: 88px;} footer .f_nav li {position: relative;} footer .f_nav li a {padding-left: 1.5em;font-family: "Montserrat", serif;font-size: 14px;letter-spacing: 0.05em;line-height: 2.4; font-weight: 500;color: #FFF;text-decoration: none;position: relative;} footer .f_nav li a:hover {text-decoration: underline;} footer .f_nav li a::before, footer .f_nav li a::after{ position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; } footer .f_nav li a::before{ left: 3px; width: 8px; height: 8px; border-top: 4px solid #D2B68E; border-right: 4px solid #D2B68E; -webkit-transform: rotate(45deg); transform: rotate(45deg); } footer .f_nav ul {padding-left: 1.5em} footer .f_nav ul li {} footer .f_nav ul li a {padding-left: 1.5em} @media screen and (max-width: 767px) { footer .f_nav {display: none;} } .f_btn {display: none;height: 0;} .f_btn img {} .f_btn .menu_box {width: 100%;height: 0; margin: 0;display: none;} @media screen and (max-width: 767px) { footer {background-color: #000;padding: 12% 0;position: relative;} footer .in {width: 90%;margin: 0 auto 5%;display: block;} footer .in .mark_area {width: 100%;border-right: none;} footer .in .mark_area .logo_box {width: 40%;margin: 0 auto 5%;} footer .in .mark_area .txt_box {color: #FFF;} footer .in .mark_area .txt_box .add {font-size: 3.6vw;font-weight: 500;line-height: 1.6;text-align: center;} footer .in .mark_area .txt_box .tel {font-family: "Montserrat", serif;font-size: 4vw;font-weight: 500;line-height: 1.6;text-align: center;} footer .sns_area {position: relative;right: auto;bottom: auto;transform: translate(0,0);display:block;text-align: center;} footer .sns_area .sns_tit {-ms-writing-mode: lr-tb;writing-mode: horizontal-tb;font-family: "Montserrat", serif;font-size: 14px;letter-spacing: 0.1em;line-height: 1.8; font-weight: 500;color: #D2B68E;} footer .sns_area .sns_btn {width: 100%;display: flex;justify-content: center;align-items: center;} footer .sns_area .sns_btn a {display: block; width: 40px;margin: 0 3%;padding: 0;} .f_btn {display: block;position: fixed;left: 0;bottom: 0;width: 100%;height: auto; vertical-align: bottom;z-index: 100;} .f_btn img {width: 100%;height: auto;} .f_btn .menu_box {width: 100%;height: auto; margin: 0;display: block;} .f_btn .menu_box .btn_menu {} .f_btn .menu_box .content_menu {} } /* ========================================================= PAGE TOP ========================================================= */ .pagetop {width: 82px;height: 82px;position: fixed;bottom: 7px;right: 95px;padding:9px;transition:all .3s;font-family: "Montserrat", serif;font-size: 0.6rem;font-weight: 700; letter-spacing: 0.1rem;z-index: 3;background-image:url("../img/btn_pagetop.png");background-repeat: no-repeat;background-size: 100% auto;background-position: center center;cursor:pointer;display: flex;justify-content: center;align-items: center;} .pagetop a {width: 64px;height: 64px;position: fixed;display: flex;justify-content: center;align-items: center;text-align: center;;color: #000;text-decoration: none;cursor:pointer;box-sizing: border-box;padding:0;} .pagetop a span {display: inline-block;padding-top: 0.8rem;} .pagetop a:hover {color: #FFF;} .pagetop:after{content:"";position:absolute;top:1.5rem;right:43%;margin:auto;width: .8rem;height: .8rem;border-top: .2em solid #000;border-right: .2em solid #000;transform: rotate(315deg);transition:.3s;} .pagetop:hover:after{border-top: .2rem solid #FFF;border-right: .2rem solid #FFF;} @media screen and (max-width: 767px) { .pagetop { display: none !important;} } /* ========================================================= ============================================================ ============================================================ BUTTON ============================================================ ============================================================ ========================================================= */ /*== ボタン共通設定 */ .btn {display: block;margin: 0 auto 0;} .btn:hover { } .btn a {display: block;color: #FFF;text-decoration: none;font-size: clamp(12px, 1.6vw, 16px);position: relative;background-color:#8dc21f;line-height: 56px;padding-right: 3em;box-sizing: border-box; height: 56px;border-radius: 28px;padding: 0 64px 0 64px;background-image: url("../img/ico_ichiran.png");background-size: 17px auto;background-position: right 11px center;background-repeat: no-repeat;transition: all 0.5s;text-align: center;} .btn a:hover {display: block;box-sizing: border-box; color: #8dc21f;text-decoration: none;background-color:#FFF;background-image: url("../img/ico_ichiran.png");border: solid 1px #8dc21f;} a .btn.sc {font-size: clamp(12px, 1.6vw, 16px); color: #FFF;line-height: 56px; padding-right: 3em;text-decoration: none;box-sizing: border-box; height: 56px;border-radius: 28px;padding: 0 88px 0 32px;background-color:#e35800;display: inline-block;background-image: url("../img/ico_btnarrow.png");background-size: 17px auto;background-position: right 11px center;background-repeat: no-repeat;transition: all 0.5s;} a:hover .btn.sc {color: #e35800;background-color:#FFF;background-image: url("../img/ico_arrow_or.png"); } @media screen and (max-width: 767px) { .btn a {font-size: 4.0vw;} .btn.sc {font-size: 4.0vw;} } #pageNate {width: 100%;padding: 50px 0 104px;display: flex;justify-content: space-between;} #pageNate .btn_next {} #pageNate .btn_next a {text-decoration: none;padding: 0 1em 8px 0;border-bottom: solid 2px #000;} #pageNate .btn_prwv {} #pageNate .btn_prwv a {text-decoration: none;padding: 0 1em 8px 0;border-bottom: solid 2px #000;} .wp-pagenavi {width: 100%;margin: 0 auto 0;display: flex;justify-content: center;align-items: center;} .wp-pagenavi span {width: 56px;height: 56px;border-radius: 28px;display: flex;justify-content: center;align-items: center;margin: 0 5px;} .wp-pagenavi span.current {background-color: #FFF;color: #8dc21f;font-size: 15px;font-weight: 700;} .wp-pagenavi a {width: 56px;height: 56px;border-radius: 28px;display: flex;justify-content: center;align-items: center;text-decoration: none;margin: 0 5px;} .wp-pagenavi a.page {background-color: #8dc21f;color: #FFF;font-size: 15px;font-weight: 700;transition: all 0.5s;} .wp-pagenavi a.previouspostslink {background-color: #8dc21f;color: #FFF;font-size: 15px;font-weight: 700;transition: all 0.5s;} .wp-pagenavi a.nextpostslink {background-color: #8dc21f;color: #FFF;font-size: 15px;font-weight: 700;transition: all 0.5s;} .wp-pagenavi a.previouspostslink:hover,.wp-pagenavi a.nextpostslink:hover, .wp-pagenavi a.page:hover {background-color: #FFF;color: #8dc21f;} @media screen and (max-width: 767px) { #pageNate {width: 100%;padding: 6% 0 15%;display: flex;justify-content: space-between;} #pageNate .btn_next {} #pageNate .btn_next a {font-size: 3.6vw; text-decoration: none;padding: 0 1em 4px 0;border-bottom: solid 2px #000;} #pageNate .btn_prwv {} #pageNate .btn_prwv a {font-size: 3.6vw; text-decoration: none;padding: 0 1em 4px 0;border-bottom: solid 2px #000;} } /* ========================================================= ============================================================ ============================================================ contents ============================================================ ============================================================ ========================================================= */ /*========= TOP CONTENT ===============*/ .top_concept {width: 100%;position: relative;} .top_concept:before {content:'';width: 456px;height: 456px;background-image: url("../img/triangle_r.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;right: 0;top:0;z-index: -1;} .top_concept .in {width: 100%;max-width: 1392px; margin: 0 auto 0;position: relative;padding: 120px 0 112px;} /*.top_concept .in:before {content: '';color: #FFF; width: 1px;height: 72px;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;}*/ .group_bookings_bnr {width: 100%;display: flex;justify-content: center;align-items: center;margin: 40px auto 112px;} .group_bookings_bnr a {width: 1008px;border: solid 16px #D2B68E;text-decoration: none;} .group_bookings_bnr a .bnr {padding: 5px;background-color: #FFF;display: flex;justify-content: space-between;transition: all 0.5s;} .group_bookings_bnr a:hover .bnr {padding: 5px;background-color: #FFF;display: flex;justify-content: space-between;opacity: 0.7;} .group_bookings_bnr a .bnr .ph {width: 50%;} .group_bookings_bnr a .bnr .ph img {} .group_bookings_bnr a .bnr .txt {width: 50%;background-color: #D97318;color: #FFF;text-align: center;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;padding: 24px 0;} .group_bookings_bnr a .bnr .txt .en {font-family: "Montserrat", serif;font-size: 28px;font-weight: 600;letter-spacing: 0.1em;} .group_bookings_bnr a .bnr .txt .jp {font-size: 18px;font-weight: 700;} .group_bookings_bnr a .bnr .txt .arrow {width: 100%;height: 24px;position: relative;display: block;} .group_bookings_bnr a .bnr .txt .arrow:before,.group_bookings_bnr a .bnr .txt .arrow:after {position: absolute;top: 80%;right:calc(50% - 28px);height: 1px;background: #FFF;content: '';} .group_bookings_bnr a .bnr .txt .arrow:before {width: 56px;transform: translateY(-50%);} .group_bookings_bnr a .bnr .txt .arrow:after {width: 24px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} .top_concept .in .concept_box {width: 100%;display: flex;} .top_concept .in .concept_box.concept01 {margin-bottom: 32px;} .top_concept .in .concept_box .concept_in {width: 100%;display: flex;justify-content: space-between;} .top_concept .in .concept_box .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 36px;position: relative;} .top_concept .in .concept_box .concept_in .concept_num:after {content: '';width: 1px;height: 128px;background-color:#D2B68E;position: absolute;left: 50%;bottom: 300px; } .top_concept .in .concept_box .concept_in .col_l {width: 49.95%;padding-left: 4.1%; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:184px auto;background-position: left top;} .top_concept .in .concept_box .concept_in .col_l .tit {color: #000;text-align: left;} .top_concept .in .concept_box .concept_in .col_l .tit .en {font-family: "Montserrat", serif;font-size: 18px;font-weight: 700;letter-spacing: 0.15rem;margin-bottom: 16px;} .top_concept .in .concept_box .concept_in .col_l .tit h2 {margin: 0 0 40px;padding: 0;text-align: left;font-size: 32px;font-weight: 700;line-height: 1.40;letter-spacing: 0.05em;} .top_concept .in .concept_box .concept_in .col_l .ph {width: 100%;} .top_concept .in .concept_box .concept_in .col_l .ph img {} .top_concept .in .concept_box .concept_in .col_r {width: 46%;margin-left: 4.1%;padding-top: 32px;} .top_concept .in .concept_box .concept_in .col_r .ph {width: 100%;margin-bottom: 64px;} .top_concept .in .concept_box .concept_in .col_r .ph img {} .top_concept .in .concept_box .concept_in .col_r p {width:86%;margin: 0 auto 0;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;} .top_concept .in .concept_box.concept02 .concept_in {flex-flow: row-reverse;} .top_concept .in .concept_box.concept02 .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 0;margin-left: 36px;position: relative;} .top_concept .in .concept_box.concept02 .concept_in .col_l{width: 41.2%;padding-left: 4.6%; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:184px auto;background-position: left top;} .top_concept .in .concept_box.concept02 .concept_in .col_l .tit {padding: 32px 0 0;} .top_concept .in .concept_box.concept02 .concept_in .col_l .ph {width: 67%;margin: 0 auto} .top_concept .in .concept_box.concept02 .concept_in .col_l p {width:90%;margin: 0 auto 0;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 40px;} .top_concept .in .concept_box.concept02 .concept_in .col_r {width: 59.7%;margin-left: auto;margin-right: -2.1%;padding-top: 32px;} .top_concept .in .concept_box.concept02 .concept_in .col_r .ph {position: relative;} .top_concept .in .concept_box.concept03 {margin-bottom: 64px;} .top_concept .in .concept_box.concept03 .concept_in .col_l .ph img {margin-left: -56px;} .top_concept .in .concept_box.concept03 .concept_in .col_l p {width:90%;margin: 0 auto 0;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 40px;} .top_concept .in .concept_box.concept04 .concept_in {flex-flow: row-reverse;} .top_concept .in .concept_box.concept04 .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 0;margin-left: 36px;position: relative;} .top_concept .in .concept_box.concept04 .concept_in .col_l{width: 46.7%; padding: 0; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:184px auto;background-position: right top;} .top_concept .in .concept_box.concept04 .concept_in .col_l .tit {padding: 32px 0 0;} .top_concept .in .concept_box.concept04 .concept_in .col_l .ph {width: 90%;margin: 0;} .top_concept .in .concept_box.concept04 .concept_in .col_l p {width:90%;margin: 0;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 40px;} .top_concept .in .concept_box.concept04 .concept_in .col_r {width: 41.9%;margin-left: 0;margin-right: 11.67%;padding-top: 24px;} .top_concept .in .concept_box.concept04 .concept_in .col_r .ph {position: relative;} @media screen and (max-width: 767px) { .top_concept:before {content:'';width: 60%;height: auto;aspect-ratio: 3 / 3;background-image: url("../img/triangle_r.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;right: 0;top:0;z-index: -1;} .top_concept .in {width: 94%;margin: 0 auto 0;position: relative;padding: 18rem 0 2.5rem;} .group_bookings_bnr {width: 100%;display: flex;justify-content: center;align-items: center;margin: 5% auto 15%;} .group_bookings_bnr a {width: 90%;border: solid 16px #D2B68E;text-decoration: none;} .group_bookings_bnr a .bnr {padding: 5px;background-color: #FFF;display: block;} .group_bookings_bnr a:hover .bnr {opacity: 1;} .group_bookings_bnr a .bnr .ph {width: 100%;} .group_bookings_bnr a .bnr .txt {width: 100%;background-color: #D97318;color: #FFF;text-align: center;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;padding: 8% 0 3%;} .group_bookings_bnr a .bnr .txt .en {font-family: "Montserrat", serif;font-size: 4.8vw;font-weight: 700;margin-bottom: 3%;} .group_bookings_bnr a .bnr .txt .jp {font-size: 4.0vw;font-weight: 700;margin-bottom: 3%;} .group_bookings_bnr a .bnr .txt .arrow {width: 100%;height: 16px;position: relative;display: block;} .group_bookings_bnr a .bnr .txt .arrow:before,.group_bookings_bnr a .bnr .txt .arrow:after {position: absolute;top: 80%;right:calc(50% - 28px);height: 1px;background: #FFF;content: '';} .group_bookings_bnr a .bnr .txt .arrow:before {width: 56px;transform: translateY(-50%);} .group_bookings_bnr a .bnr .txt .arrow:after {width: 16px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} .top_concept .in .concept_box {width: 100%;display: flex;} .top_concept .in .concept_box.concept01 {margin-bottom: 5%;} .top_concept .in .concept_box .concept_in {width: 100%;display:flex;flex-wrap: wrap;} .top_concept .in .concept_box .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 5%;position: relative;} .top_concept .in .concept_box .concept_in .concept_num:after {content: '';width: 1px;height: 128px;background-color:#D2B68E;position: absolute;left: 50%;bottom:auto;top:150px; } .top_concept .in .concept_box .concept_in .col_l {width: 90%;padding-left: 0; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:34.5% auto;background-position: left top;float: left;} .top_concept .in .concept_box .concept_in .col_l .tit {color: #000;text-align: left;padding-left: 3%;} .top_concept .in .concept_box .concept_in .col_l .tit .en {font-family: "Montserrat", serif;font-size: 4.0vw;font-weight: 700;margin-bottom: 2%;} .top_concept .in .concept_box .concept_in .col_l .tit h2 {margin: 0 0 5%;padding: 0;text-align: left;font-size:5.4vw;font-weight: 700;line-height: 1.40;letter-spacing: 0.05em;} .top_concept .in .concept_box .concept_in .col_l .ph {width: 80%;} .top_concept .in .concept_box .concept_in .col_r {width: 98%;margin-left: 5%;padding-top: 0;margin-top: -10%;margin-right: -5%;} .top_concept .in .concept_box .concept_in .col_r .ph {width: 70%;margin-bottom: 5%;margin-left: 30%} .top_concept .in .concept_box .concept_in .col_r p {width:95%;margin: 0 5% 0 0;font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;} .top_concept .in .concept_box .concept_in .col_r {width: 98%;margin-left: 5%;padding-top: 0;margin-top: -10%;margin-right: -5%;} .top_concept .in .concept_box .concept_in .col_r .ph {width: 70%;margin-bottom: 5%;margin-left: 30%} .top_concept .in .concept_box .concept_in .col_r p {width:95%;margin: 0 5% 0 0;font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;} .top_concept .in .concept_box.concept02 .concept_in {flex-flow: row-reverse;} .top_concept .in .concept_box.concept02 .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 0;margin-left: 5%;position: relative;} .top_concept .in .concept_box.concept02 .concept_in .col_l{width: 90%;padding-left: 30%; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:34.5% auto;background-position: left 45% top 5rem;} .top_concept .in .concept_box.concept02 .concept_in .col_l .tit {padding: 32px 0 0;} .top_concept .in .concept_box.concept02 .concept_in .col_l .ph {width: 180%;margin: 0 auto 0 -50%} .top_concept .in .concept_box.concept02 .concept_in .col_l .ph.concept_img04 {width:70%;margin: -85% 0 20% -40%;} .top_concept .in .concept_box.concept02 .concept_in .col_l p {width:80%;margin: 2% auto 0 35%;font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 40px;} .top_concept .in .concept_box.concept03 {margin-bottom: 8%;} .top_concept .in .concept_box.concept03 .concept_in .col_l {background-position: left top 5%;} .top_concept .in .concept_box.concept03 .concept_in .col_l .concept_img06 {width: 80%;margin:0 auto 0 -5%} .top_concept .in .concept_box.concept03 .concept_in .col_l .concept_img05 {width: 85%;margin:-10% auto 5% 20%} .top_concept .in .concept_box.concept03 .concept_in .col_l p {width:110%;margin: 0 auto 0 -10%;font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 0;} .top_concept .in .concept_box.concept04 .concept_in {flex-flow: row-reverse;} .top_concept .in .concept_box.concept04 .concept_in .concept_num {width: 15px;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;letter-spacing: 0.2em;margin-right: 0;margin-left: 5%;position: relative;} .top_concept .in .concept_box.concept04 .concept_in .col_l{width: 90%; padding: 0; background-image: url("../img/tit_bk.png");background-repeat: no-repeat; background-size:34.5% auto;background-position: left 5% top 10%;margin-left: 1.5%;} .top_concept .in .concept_box.concept04 .concept_in .col_l .tit {padding: 0 0 0;} .top_concept .in .concept_box.concept04 .concept_in .col_l .concept_img07 {width: 75%;margin:0 auto 0 40%} .top_concept .in .concept_box.concept04 .concept_in .col_l .concept_img08 {width: 85%;margin:-10% auto 5% 0%} .top_concept .in .concept_box.concept04 .concept_in .col_l p {width:110%;margin: 0;font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;letter-spacing: 0.05em;margin-bottom: 5%;} } /*========= TOP TOPICS ===============*/ .top_topics {width: 100%;background-color: #F5F5F5;position: relative;} .top_topics:before {content:'';width: 456px;height: 456px;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;left: 0;top:0;z-index: 0;} .top_topics .in {width: 100%;margin: 0 auto 0;position: relative;padding: 120px 0 120px;} .top_topics .in:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_topics .in h2 {font-family: "Montserrat", serif;font-size: 36px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .top_topics .in h2 span {position: relative;} .top_topics .in h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .top_topics .in .slide_area {} .top_topics .in .slide_area .topics_slide {height: 350px;} .top_topics .in .slide_area .topics_slide .sp-slides {height: 350px;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide {width: 280px;height: 320px!important;background-color: #FFF;box-shadow: 0 0 8px rgba(0,0,0,0.2);} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a {width: 100%;height: 100%;display: block; position: relative;box-sizing: border-box;padding: 16px;text-decoration: none;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .ph {width: 248px;height: 160px;overflow: hidden;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .cat {width: 32px;height: 96px;box-sizing: border-box;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 12px;font-weight: 600;letter-spacing: 0.2em;color: #FFF;position: absolute;left:0px;top:0px;padding: 8px 0 0;line-height: 32px;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .cat.news { border-bottom: 20px solid transparent;border-left: 32px solid #138AA9;border-right: 0px solid transparent;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .cat.cat-blog {border-bottom: 20px solid transparent;border-left: 32px solid #D97318;border-right: 0px solid transparent;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .cat.events {border-bottom: 20px solid transparent;border-left: 32px solid #5B9334;border-right: 0px solid transparent;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .txt_area {width: 100%;padding: 8px 0 0;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .txt_area .date_area {margin-bottom: 8px;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .txt_area .date_area .date {font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;letter-spacing: 0.1em;color: #999999;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .txt_area h3 {font-size: 14px;font-weight: 700;color: #000;line-height: 1.8;} @media screen and (max-width: 767px) { .top_topics:before {content:'';width: 60%;height: auto;aspect-ratio: 3 / 3;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;left: 0;top:0;z-index: 0;} .top_topics .in {width: 100%;margin: 0 auto 0;position: relative;padding: 22% 0 15%;} .top_topics .in:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_topics .in h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .top_topics .in .slide_area .topics_slide .sp-slides .sp-slide a .ph {width: 100%;height: auto;overflow: hidden;aspect-ratio:248 / 160;} } /*========= TOP ROOM TYPE ===============*/ .top_room_type {width: 100%;background-color: #F2EDE7;position: relative;} .top_room_type .in {width: 100%;margin: 0 auto 0;position: relative;padding: 120px 0 0;} .top_room_type .in:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_room_type .in h2 {font-family: "Montserrat", serif;font-size: 36px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .top_room_type .in h2 span {position: relative;} .top_room_type .in h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .tab_area {width: 100%;margin: 0 auto 0;} .tab_area .p_nav {max-width: 1040px;box-sizing: border-box;padding: 0 16px;;margin: 0 auto 0;display: flex;justify-content: space-between;} .tab_area .p_nav .btn.tab {width: 48.5%;height: 72px; text-align: center;line-height: 72px;font-family: "Montserrat", serif;font-size: clamp(14px, 2.8vw, 26px);font-weight: 500;letter-spacing: 0.12em;color: #BEA283;position: relative;cursor: pointer;} .tab_area .p_nav .btn:before {content: '';position: absolute;left: 1.5em;top:0.8em;display: inline-block;vertical-align: middle;color: #E0CBB4;line-height: 1;width: 0.8em;height: 0.8em;border: 0.1em solid currentColor;border-left: 0;border-bottom: 0;box-sizing: border-box;transform: translateY(-25%) rotate(135deg);} .tab_area .p_nav .btn.tab.active {background-color: #FFF;color: #000;} .tab_area .p_nav .btn.active:before {color: #000;} .tab_area .tab_container {width: 100%;background-color: #FFF;padding: 0 0 40px 0;} .tab_area .tab_container .tab_content {display: none;max-width: 1040px;box-sizing: border-box;padding: 0 16px;;margin: 0 auto;} .tab_area .tab_container .tab_content.show {display: block;} .tab_area .tab_container .tab_content .inner {width: 100%;display: flex;flex-wrap: wrap;justify-content: space-between;padding: 5rem 0 0;} .room_col {width: 48.5%;margin-bottom: 5rem;} .room_col a {display: block;text-decoration: none;} .room_col a .ph {width: 100%;height: 300px;overflow: hidden;margin-bottom: 2.5rem;} .room_col a .tit {text-align: center;color: #000;} .room_col a .tit .en {font-family: "Montserrat", serif;font-size: 16px;font-weight: 600;letter-spacing: 0.1em;} .room_col a .tit .jp {font-size: 20px;font-weight: 700;letter-spacing: 0.05em;line-height: 1.8;} .room_col a .detail_tb {width: 100%;box-sizing: border-box;padding: 1.5rem;font-feature-settings: "palt";} .room_col a .detail_tb .detail_tr {width: 100%;display: flex;justify-content: space-between;line-height: 1.4;padding: 1em 0;border-bottom: solid 1px #E1E2E2;color: #000;} .room_col a .detail_tb .detail_tr .detail_th {width: 25%;box-sizing: border-box;padding-right: 0.5em;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;border-right: solid 1px #E1E2E2;} .room_col a .detail_tb .detail_tr .detail_td {width: 75%;box-sizing: border-box;padding-left: 1em;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 2em;} .room_col a .btn {max-width: 314px;height: 72px;display: flex;justify-content: center;align-items: center;background-color: #D2B68E;box-sizing: border-box;transition: all 0.5s;} .room_col a .btn span {font-family: "Montserrat", serif;font-size: 16px;font-weight: 700;color: #000;letter-spacing: 0.1em;position: relative;padding-right: 72px;} .room_col a .btn span:before,.room_col a .btn span:after {position: absolute;top: 50%;right: 0px;height: 1px;background: #231815;content: '';} .room_col a .btn span:before {width: 56px;transform: translateY(-50%);} .room_col a .btn span:after {width: 24px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} .room_col a:hover .btn {background-color: #FFF;border: solid 1px #D2B68E;box-sizing: border-box;transition: all 0.5s;} .room_col a:hover .btn span {color: #D2B68E;} .room_col a:hover .btn span:before,.room_col a:hover .btn span:after {background: #D2B68E;} @media screen and (max-width: 767px) { .top_room_type .in {width: 100%;margin: 0 auto 0;position: relative;padding: 22% 0 0;} .top_room_type .in:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_room_type .in h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 500;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .top_room_type .in h2 span {position: relative;} .tab_area .p_nav {width: 100%;margin: 0 auto 0;display: flex;justify-content: space-between;} .tab_area .p_nav .btn.tab {width: 50%;height: 40px; text-align: center;line-height: 40px;font-family: "Montserrat", serif;font-size: 2.8vw;font-weight: 600;color: #BEA283;position: relative;cursor: pointer;} .tab_area .p_nav .btn:before {content: '';position: absolute;left: 0.7em;top:calc(50% - 0.2em);display: inline-block;vertical-align: middle;color: #E0CBB4;line-height: 1;width: 0.5em;height: 0.5em;border: 0.1em solid currentColor;border-left: 0;border-bottom: 0;box-sizing: border-box;transform: translateY(-25%) rotate(135deg);} .tab_area .p_nav .btn.tab.active {background-color: #FFF;color: #000;} .tab_area .p_nav .btn.active:before {color: #000;} .tab_area .tab_container {width: 100%;background-color: #FFF;padding: 0 0 40px;} .tab_area .tab_container .tab_content {display: none;width: 90%;margin: 0 auto;} .tab_area .tab_container .tab_content.show {display: block;} .tab_area .tab_container .tab_content .inner {width: 100%;display: block;padding: 2rem 0 0;} .room_col {width: 100%;margin-bottom:2rem;} .room_col a {display: block;text-decoration: none;} .room_col a .ph {width: 100%;height: auto;overflow: hidden;margin-bottom: 1.5rem;} .room_col a .tit {text-align: center;color: #000;} .room_col a .tit .en {font-family: "Montserrat", serif;font-size: 3.6vw;font-weight: 600;letter-spacing: 0.1em;} .room_col a .tit .jp {font-size: 4.2vw;font-weight: 700;letter-spacing: 0.05em;line-height: 1.8;} .room_col a .detail_tb {width: 100%;box-sizing: border-box;padding: 0 0 10%;} .room_col a .detail_tb .detail_tr {width: 100%;display: flex;justify-content: space-between;line-height: 1.0;padding: 1em 0;border-bottom: solid 1px #E1E2E2;color: #000;} .room_col a .detail_tb .detail_tr .detail_th {width: 25%;box-sizing: border-box;padding-right: 0.5em;font-size: 3.6vw;font-weight: 500;border-right: solid 1px #E1E2E2;} .room_col a .detail_tb .detail_tr .detail_td {width: 75%;box-sizing: border-box;padding-left: 1em;font-size: 3.6vw;font-weight: 500;} .room_col a .btn {width: 90%;height: 55px;display: flex;justify-content: center;align-items: center;background-color: #D2B68E;box-sizing: border-box;transition: all 0.5s;} .room_col a .btn span {font-family: "Montserrat", serif;font-size: 3.6vw;font-weight: 700;color: #000;position: relative;padding-right: 72px;} .room_col a .btn span:before,.room_col a .btn span:after {position: absolute;top: 50%;right: 0px;height: 1px;background: #231815;content: '';} .room_col a .btn span:before {width: 56px;transform: translateY(-50%);} .room_col a .btn span:after {width: 24px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} } /*========= TOP FACILITY ===============*/ .top_facility {width: 100%;background-color: #F7F7F7;position: relative;} .top_facility:before {content:'';width: 456px;height: 456px;background-image: url("../img/triangle_r.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;right: 0;top:0;z-index: 0;} .top_facility .in {width: 100%;margin: 0 auto 0;position: relative;padding: 120px 0 120px;} .top_facility .in:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_facility .in h2 {font-family: "Montserrat", serif;font-size: 40px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .top_facility .in h2 span {position: relative;} .top_facility .in h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} #js-slider {} .slider {overflow: hidden;} .slick-list {overflow: visible!important;} .slider .slick-slide {margin: 20px 0;padding: 0;position: relative;} .slider .slick-slide .slide-img {height: auto;transition: all 0.6s ease 0.4s;;box-shadow: 7px 7px 15px -5px #666;overflow: hidden;background-color: #FFF;box-sizing: border-box;padding: 30px;transform: scale(0.85);opacity: 0.6;} .slider .slick-slide.slick-current .slide-img {transform: scale(1.00);opacity: 1;} .slider .slick-slide .slide-img .ph {width: 100%;height: auto;aspect-ratio: 1471 / 895;margin-bottom: 16px;} .slider .slick-slide .slide-img .ph img {display: block;width: 100%;height: 100%;object-fit: cover;} .slider .slick-slide .slide-img .tit {font-family: "Montserrat", serif;font-size: 16px;font-weight: 700;letter-spacing: 0.15em;color: #000;line-height: 1.8;} .slider .slick-slide .slide-img p {font-size: 14px;font-weight: 500;color: #000;margin: 0;line-height: 1.8;} .slider .slick-arrow {width: 64px;height: 64px;background-color: #D2B68E;border: solid 8px #E5D9C2;cursor: pointer;font-size: 0;position: absolute;top: 50%;z-index: 1;transform: translateY(-50%);filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));transition: all 0.5s;} .slider .slick-arrow::before {content: '';display: block;width: 18px;height: 18px;border: 1px solid #09000d;border-width: 3px 3px 0 0;position: absolute;top: 14px;transform: rotate(45deg);} .slider .slick-next {right: 20%;} .slider .slick-prev {left: 20%;} .slider .slick-next::before {left: 14px;} .slider .slick-prev::before {border-width: 0 0 3px 3px;right: 14px;} .top_facility .slick-prev:hover,.top_facility .slick-prev:focus,.top_facility .slick-next:hover,.top_facility .slick-next:focus{background:#E5D9C2;border-color:#D2B68E; } .slick-dots {text-align: center;} .slick-dots li {display: inline-block;background: #D2B68E;border: solid 3px #E5D9C2;} .slick-dots button {display: block;width: 24px;height: 24px;margin: 6px;font-size: 0;padding: 0;border: solid 3px #FFF;outline: none;cursor: pointer;background: #CFCFCF;} .slick-dots .slick-active button {background: #D2B68E;border: solid 3px #E5D9C2;} @media screen and (max-width: 767px) { .top_facility:before {content:'';width: 60%;height: auto;aspect-ratio: 3 / 3;;background-image: url("../img/triangle_r.png");background-repeat: no-repeat;background-size: 100% auto;position: absolute;right: 0;top:0;z-index: 0;} .top_facility .in {width: 100%;margin: 0 auto 0;position: relative;padding: 22% 0 15%;} .top_facility .in:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_facility .in h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom:15%;} .slick-slider .slick-track, .slick-slider .slick-list {width: 84%;margin: 0 auto;} .slider .slick-slide {margin: 20px 0;padding: 0;position: relative;} .slider .slick-slide .slide-img {height: auto;transition: all 0.6s ease 0.4s;;box-shadow: 7px 7px 15px -5px #666;overflow: hidden;background-color: #FFF;box-sizing: border-box;padding: 10px;transform: scale(0.90);opacity: 0.6;} .slider .slick-slide.slick-current .slide-img {transform: scale(1.00);opacity: 1;} .slider .slick-slide .slide-img .ph {width: 100%;height: auto;aspect-ratio: 1471 / 895;margin-bottom: 16px;} .slider .slick-slide .slide-img .ph img {display: block;width: 100%;height: 100%;object-fit: cover;} .slider .slick-slide .slide-img .tit {font-family: "Montserrat", serif;font-size: 3.6vw;font-weight: 500;color: #000;line-height: 1.8;} .slider .slick-slide .slide-img p {font-size: 3.2vw;font-weight: 500;color: #000;margin: 0;line-height: 1.8;} .slider .slick-arrow {width: 40px;height: 40px;background-color: #D2B68E;border: solid 4px #E5D9C2;cursor: pointer;font-size: 0;position: absolute;top: 48%;z-index: 1;transform: translateY(-50%);filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));} .slider .slick-arrow::before {content: '';display: block;width: 12px;height: 12px;border: 1px solid #09000d;border-width: 3px 3px 0 0;position: absolute;top: 10px;transform: rotate(45deg);} .slider .slick-next {right: 0;} .slider .slick-prev {left: 0;} .slider .slick-next::before {left: 10px;} .slider .slick-prev::before {border-width: 0 0 3px 3px;right: 10px;} .dots .slick-dots {text-align: center;} .dots .slick-dots li {display: inline-block;} .dots .slick-dots button {display: block;width: 24px;height: 24px;margin: 6px;font-size: 0;padding: 0;border: solid 3px #FFF;outline: none;cursor: pointer;background: #CFCFCF;} .dots .slick-dots .slick-active button {background: #D2B68E;border: solid 3px #E5D9C2;} } /*========= TOP FACILITY COMING　SOON===============*/ .facility-cominsoon {width: 60%;margin: 140px auto 48px auto;text-align: center;font-family: "Montserrat", serif;font-size: 2rem;letter-spacing: 0.2rem;line-height: 1.6em;} @media screen and (max-width: 767px) {.facility-cominsoon {width: 80%;margin: 20px auto 20px auto;font-size: 1.8rem;}} /*========= TOP access ===============*/ .top_access {width: 100%;position: relative;} .top_access .in {width: 100%;margin: 0 auto 0;position: relative;padding: 120px 0 120px;} .top_access .in:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_access .in h2 {font-family: "Montserrat", serif;font-size: 40px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .top_access .in h2 span {position: relative;} .top_access .in h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .top_access .in .map_area {max-width: 1216px;margin: 0 auto 80px} .top_access .in .map_area_col2 {max-width: 1216px;margin: 0 auto;display: flex;justify-content: space-between;margin-bottom: 72px;} .top_access .in .map_area_col2 .txt_col {width: 41.1%;} .top_access .in .map_area_col2 .txt_col .logo {width: 76.8%;margin: 0 0 40px;} .top_access .in .map_area_col2 .txt_col p {font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;color: #000;font-family: "Montserrat", sans-serif;letter-spacing: 0.1em;line-height: 1.8;margin-bottom: 40px;} .top_access .in .map_area_col2 .txt_col .access_detail {margin: 0 0 18px 0;} .top_access .in .map_area_col2 .txt_col .access_detail .tit {width: 100%;height: 47px;display: flex;align-items: center; font-size: 18px;font-weight: 700;color: #000;padding-left: 48px;position: relative;margin-bottom: 16px;} .top_access .in .map_area_col2 .txt_col .access_detail .tit:before {content: '';width: 39px;height: 47px;background-image: url("../img/ico_acc.png");background-repeat: no-repeat;background-size: 100% auto;background-position: center center;position: absolute;left: 0;top:0;} .top_access .in .map_area_col2 .txt_col .access_detail ul {margin: 0;padding: 0;} .top_access .in .map_area_col2 .txt_col .access_detail ul li {font-size: 14px;font-weight: 500;line-height: 1.6;padding: 0 0 0 1em;position: relative;} .top_access .in .map_area_col2 .txt_col .access_detail ul li:before {content: '・';position: absolute;left: 0;top:0;} .top_access .in .map_area_col2 .ph {width: 57.2%;} .top_access .in .map_area_col3 {max-width: 1216px;margin: 0 auto;display: flex;justify-content: space-between;align-items: flex-start;} .top_access .in .map_area_col3 .col {width: 31.6%;} .top_access .in .map_area_col3 .col .tit {width: 100%;height: 55px;display: flex;align-items: center; font-size: 18px;font-weight: 700;color: #000;padding: 0 0 0 48px;position: relative;margin-bottom: 16px;border-bottom: solid 1px #000;} .top_access .in .map_area_col3 .col .tit:before {content: '';width: 39px;height: 47px;background-image: url("../img/ico_acc.png");background-repeat: no-repeat;background-size: 100% auto;background-position: center center;position: absolute;left: 0;top:0;} .top_access .in .map_area_col3 .col ul {margin: 0 0 2em;;padding: 0;font-weight: 700;} .top_access .in .map_area_col3 .col ul li {font-size: 14px;font-weight: 500;line-height: 1.6;padding: 0 0 0 1em;position: relative;} .top_access .in .map_area_col3 .col ul li:before {content: '・';position: absolute;left: 0;top:0;} .top_access .in .map_area_col3 .col p {font-size: 14px;font-weight: 500;line-height: 1.6;} /* =GoogleMap==== */ .gmap_wrapper {max-width: 1216px;margin: 0px auto 80px;} .gmap {position: relative; width: 100%;height: 0;padding-top: 56.25%;} .gmap iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .gmap_wrapper .gmap-txt {width: 90%;line-height: 1.6;font-size: 14px;line-height: 1.6;text-align: center;margin: 24px auto;color: #B26E6F;font-weight: bold;} @media screen and (max-width: 767px) { .top_access .in {width: 100%;margin: 0 auto 0;position: relative;padding: 22% 0 15%;} .top_access .in:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #000;left: calc(50% - 0.5px);top: 0;} .top_access .in h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .top_access .in h2 span {position: relative;} .top_access .in .map_area {width: 100%;margin: 0 auto 10%} .top_access .in .map_area_col2 {width: 90%;margin: 0 auto;display: block;margin-bottom: 8%;} .top_access .in .map_area_col2 .txt_col {width: 100%;margin-bottom: 5%;} .top_access .in .map_area_col2 .txt_col .logo {width: 100%;margin: 0 0 5%;} .top_access .in .map_area_col2 .txt_col p {font-size: 3.6vw;font-weight: 700;color: #000;line-height: 1.8;margin-bottom: 5%;} .top_access .in .map_area_col2 .txt_col .access_detail .tit {width: 100%;height: 32px;display: flex;align-items: center; font-size: 4vw;font-weight: 700;color: #000;padding-left: 2.2rem;position: relative;margin-bottom: 2%;} .top_access .in .map_area_col2 .txt_col .access_detail .tit:before {content: '';width: 26px;height: 32px;background-image: url("../img/ico_acc.png");background-repeat: no-repeat;background-size: 100% auto;background-position: center center;position: absolute;left: 0;top:0;} .top_access .in .map_area_col2 .txt_col .access_detail ul li {font-size: 3.2vw;font-weight: 500;line-height: 1.6;padding: 0 0 0 1em;position: relative;} .top_access .in .map_area_col2 .txt_col .access_detail ul li:before {content: '・';position: absolute;left: 0;top:0;} .top_access .in .map_area_col2 .ph {width: 100%;} .top_access .in .map_area_col3 {width: 90%;margin: 0 auto;display: block;} .top_access .in .map_area_col3 .col {width: 100%;} .top_access .in .map_area_col3 .col .tit {width: 100%;height: 36px;display: flex;align-items: center; font-size: 4vw;font-weight: 700;color: #000;padding: 0 0 0 2.2rem;position: relative;margin-bottom: 2%;border-bottom: solid 1px #000;} .top_access .in .map_area_col3 .col .tit:before {content: '';width: 26px;height: 36px;background-image: url("../img/ico_acc.png");background-repeat: no-repeat;background-size: 100% auto;background-position: center top;position: absolute;left: 0;top:0;} .top_access .in .map_area_col3 .col ul {margin: 0 0 2em;;padding: 0;font-weight: 700;font-size: 3.4vw;} .top_access .in .map_area_col3 .col ul li {font-size: 3.2vw;font-weight: 500;line-height: 1.6;padding: 0 0 0 1em;position: relative;} .top_access .in .map_area_col3 .col ul li:before {content: '・';position: absolute;left: 0;top:0;} .top_access .in .map_area_col3 .col p {font-size: 3.2vw;font-weight: 500;line-height: 1.6;} .gmap_wrapper .gmap-txt {font-size: 3.2vw;} } /* ========================================================= ============================================================ ============================================================ Fonts ============================================================ ============================================================ ========================================================= */ a { color: #025ABA; text-decoration: underline; font-weight: normal; transition:.3s; } a:visited { /*color: #666;*/ } a:hover { color: #039; font-weight: normal; text-decoration: none; transition:.3s; } p{ margin-bottom: 0.5rem; } /* ========================================================= ============================================================ ============================================================ Topics ============================================================ ============================================================ ========================================================= */ .p_header.topics {width: 100%;min-width: 100%; height: 368px;position: relative;overflow: hidden;background-image:url("../img/page_header_topics.jpg");background-size: cover;display: flex;justify-content: center;align-items: center;} .p_header h2 {width: 232px;height:auto;margin: auto;} .pan {width: 100%;box-sizing: border-box;padding: 0 10%; height: 72px;background-color: #000;} .pan ul {width: 100%;height: 100%;display: flex;justify-content: flex-start;align-items: center;} .pan ul li {color: #FFF;display: inline-block;font-size: 14px;font-weight: 500;} .pan ul li a {margin-right: 2rem;position: relative;color: #FFF;text-decoration: none;} .pan ul li a:after {content: '>';position: absolute;right: -1.5rem;top:0;color: #FFF;} .content-area {width: 100%;} .content-area .page_header {width: 100%;height: 360px;margin: 0 auto 0;position: relative;padding: 120px 0 0;background-color: #F2EDE7;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 456px auto;} .content-area .page_header:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .content-area .page_header h2 {font-family: "Montserrat", serif;font-size: 40px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .content-area .page_header h2 span {position: relative;} .content-area .page_header h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .content-area .page_header .topics_nav {width: 100%;border-bottom: solid 4px #D2B68E;position: absolute;bottom: 0;} .term-cat-blog .content-area .page_header .topics_nav {width: 100%;border-bottom: solid 4px #D97318;position: absolute;bottom: 0;} .term-events .content-area .page_header .topics_nav {width: 100%;border-bottom: solid 4px #5B9334;position: absolute;bottom: 0;} .term-news .content-area .page_header .topics_nav {width: 100%;border-bottom: solid 4px #138AA9;position: absolute;bottom: 0;} .content-area .page_header .topics_nav ul {max-width: 864px;margin: 0 auto 0;display: flex;justify-content: space-between;} .content-area .page_header .topics_nav ul li {width: 160px;height: 45px;font-family: "Montserrat", serif;font-size: 14px;font-weight: 700;color: #D2B68E;text-align: center;letter-spacing: 0.1em;display: flex;justify-content: center;align-items: center;} .content-area .page_header .topics_nav ul li a {text-decoration: none;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;color: #D2B68E;} .content-area .page_header .topics_nav ul li.tit {} .content-area .page_header .topics_nav ul li.all { } .content-area .page_header .topics_nav ul li.all a.current {background-color:#D2B68E;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.all a:hover {background-color:#D2B68E;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.events {} .content-area .page_header .topics_nav ul li.events a.current {background-color:#5B9334;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.events a:hover {background-color:#5B9334;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.news {} .content-area .page_header .topics_nav ul li.news a.current {background-color:#138AA9;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.news a:hover {background-color:#138AA9;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.cat-blog {} .content-area .page_header .topics_nav ul li.cat-blog a.current {background-color:#D97318;color: #FFF;font-weight: 500;} .content-area .page_header .topics_nav ul li.cat-blog a:hover {background-color:#D97318;color: #FFF;font-weight: 500;} .content-area .site-content {} .content-area .site-content .topics_area {max-width: 1040px;box-sizing: border-box;padding: 0 16px;;margin: 0 auto 0;padding: 72px 0;} .content-area .site-content .topics_area .archive-topics_box {width: 100%;box-sizing: border-box;padding: 16px;background-color: #FFF;box-shadow: 0 0 8px rgba(0,0,0,0.2);margin-bottom: 40px;position: relative;} .content-area .site-content .topics_area .archive-topics_box:after {content:''; display: block;height: 0;width: 0;position: absolute;bottom: 0px;right: 0px;border-left: 30px solid transparent;border-bottom: 30px solid #D2B68E;} .content-area .site-content .topics_area .archive-topics_box a {width: 100%;height: 100%;display: flex;justify-content: space-between;text-decoration: none;} .content-area .site-content .topics_area .archive-topics_box .ph {width: 248px;height: 160px;overflow: hidden;} .content-area .site-content .topics_area .archive-topics_box .cat {width: 32px;height: 96px;box-sizing: border-box;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;color: #FFF;letter-spacing: 0.2em;position: absolute;left:0px;top:0px;padding: 8px 0 0;line-height: 32px;} .content-area .site-content .topics_area .archive-topics_box .cat.news { border-bottom: 20px solid transparent;border-left: 32px solid #138AA9;border-right: 0px solid transparent;} .content-area .site-content .topics_area .archive-topics_box .cat.cat-blog {border-bottom: 20px solid transparent;border-left: 32px solid #D97318;border-right: 0px solid transparent;} .content-area .site-content .topics_area .archive-topics_box .cat.events {border-bottom: 20px solid transparent;border-left: 32px solid #5B9334;border-right: 0px solid transparent;} .content-area .site-content .topics_area .archive-topics_box .txt_area {width: calc(100% - 280px);} .content-area .site-content .topics_area .archive-topics_box .txt_area .date_area {} .content-area .site-content .topics_area .archive-topics_box .txt_area .date_area .date {font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;color: #999999;letter-spacing: 0.2em;line-height: 1.0;margin-bottom: 8px;} .content-area .site-content .topics_area .archive-topics_box .txt_area h3 {font-size: 18px;font-weight: 700;color:#000;margin-bottom: 16px;line-height: 1.4;} .content-area .site-content .topics_area .archive-topics_box .txt_area .txt {font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;color:#000;line-height: 1.6;} .content-area .site-content .topics_area .archive-topics_box .btn_more {position: absolute;bottom: 16px;right: 32px;font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;color: #000;letter-spacing: 0.2em;} .content-area .site-content .topics_area .archive-topics_box .btn_more span {padding-right: 56px;position: relative;} .content-area .site-content .topics_area .archive-topics_box .btn_more span:before,.content-area .site-content .topics_area .archive-topics_box .btn_more span:after {position: absolute;top: 50%;right: 0px;height: 1px;background: #231815;content: '';} .content-area .site-content .topics_area .archive-topics_box .btn_more span:before {width: 40px;transform: translateY(-50%);} .content-area .site-content .topics_area .archive-topics_box .btn_more span:after {width: 16px;transform: translateY(-50%) rotate(30deg);transform-origin: right center;} .single_topics {width: 100%;height:auto;margin: 0 auto 0;position: relative;padding: 120px 0 120px;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 456px auto;} .single_topics:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .single_topics h2 {font-family: "Montserrat", serif;font-size: 40px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .single_topics h2 span {position: relative;} .single_topics h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .single_topics .site-content {width: 1216px;margin: 0 auto 72px;background-color: #F7F7F7;box-sizing: border-box; padding: 104px;} .single_topics .site-content .topics_area {width: 100%;box-sizing: border-box;background-color: #FFF;position: relative;padding: 32px 64px;} .single_topics_box {width: 100%;} .single_topics_box .cat {width: 32px;height: 96px;box-sizing: border-box;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;color: #FFF;letter-spacing: 0.2em;position: absolute;left:0px;top:0px;padding: 8px 0 0;line-height: 32px;} .single_topics_box .cat.news { border-bottom: 20px solid transparent;border-left: 32px solid #138AA9;border-right: 0px solid transparent;} .single_topics_box .cat.cat-blog {border-bottom: 20px solid transparent;border-left: 32px solid #D97318;border-right: 0px solid transparent;} .single_topics_box .cat.events {border-bottom: 20px solid transparent;border-left: 32px solid #5B9334;border-right: 0px solid transparent;} .single_topics_box .date {font-family: "Montserrat", serif;font-size: 14px;font-weight: 500;color: #999999;letter-spacing: 0.2em;margin-bottom: 32px;} .single_topics_box h3 {font-size: 28px;font-weight: 700;color: #000;letter-spacing: 0.02em;padding: 0; margin: 0 0 32px;font-feature-settings: "palt";} .single_topics_box .ph {width: 480px;margin: 0 auto 72px;} .single_topics_box .txt {font-size: 17px;font-weight: 500;color: #000;letter-spacing: 0.02em;line-height: 1.8;} .rooms_btn_area {max-width: 1040px;margin: 0 auto;display: flex;flex-flow: row-reverse;justify-content: space-between;} .btn_roomplan {width: 592px;height: 72px;box-sizing: border-box;margin-left: 83px;} .btn_roomplan a {width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;background-color: #000;color:#FFF;font-size: 18px;font-weight: 700;text-decoration: none;transition: all 0.5s;} .btn_roomplan a span {padding-left: 2em;background-image: url("../img/ico_plan.png");background-repeat: no-repeat;background-size: 30px auto;background-position: left center;line-height: 31px;} .btn_roomplan a:hover {opacity: 0.7;} .btn_ichiran {display: flex;justify-content: center;align-items: center;} .btn_ichiran a {width: 56px;height: 56px;border: solid 7px #E5D9C2;box-sizing: border-box;background-color: #D2B68E;display: flex;position: relative;text-indent: -9999px;transition: all 0.5s;} .btn_ichiran a[rel=prev]:before {content: ''; position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;vertical-align: middle;width: 14px;height: 14px;border-top: 2px solid #000;border-right: 2px solid #000;-webkit-transform: rotate(225deg);transform: rotate(225deg);} .btn_ichiran a[rel=next]:before {content: ''; position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;vertical-align: middle;width: 14px;height: 14px;border-top: 2px solid #000;border-right: 2px solid #000;-webkit-transform: rotate(45deg);transform: rotate(45deg);} .btn_ichiran a.listback {width: 365px;height: 72px;background-color: #D2B68E;border-color: #D2B68E;margin: 0 50px;text-indent: 0;text-decoration: none;display: flex;justify-content: center;align-items: center;} .btn_ichiran a:hover {background-color: #E5D9C2;border-color: #D2B68E;} .btn_ichiran a.listback span {color: #000;padding: 0 0 0 96px;font-family: "Montserrat", serif;font-size: 16px;font-weight: 700;letter-spacing: 0.1em;position: relative;} .btn_ichiran a.listback span:before,.btn_ichiran a.listback span:after {position: absolute;top: 50%;left: 0px;height: 1px;background: #231815;content: '';} .btn_ichiran a.listback span:before {width: 56px;transform: translateY(-50%);} .btn_ichiran a.listback span:after {width: 24px;transform: translateY(-50%) rotate(-30deg);transform-origin: left center;} @media screen and (max-width: 767px) { .p_header.topics {width: 100%;min-width: 100%; height: auto;aspect-ratio: 752 / 368;position: relative;overflow: hidden;background-image:url("../img/page_header_topics_sp.jpg");background-size: cover;display: flex;justify-content: center;align-items: center;} .p_header h2 {width: 40%;height:auto;margin: auto;} .pan {display: none;} .content-area .page_header {width: 100%;height: 14rem;margin: 0 auto 0;position: relative;padding: 22% 0 0;background-color: #F2EDE7;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 60% auto;} .content-area .page_header:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .content-area .page_header h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .content-area .page_header h2 span {position: relative;} .content-area .page_header .topics_nav ul {width: 94%;margin: 0 auto 0;display: flex;justify-content: space-between;} .content-area .page_header .topics_nav ul li {width: 24%;height: 40px;font-family: "Montserrat", serif;font-size: 3.4vw;font-weight: 700;color: #D2B68E;text-align: center;letter-spacing: 0.05em;display: flex;justify-content: center;align-items: center;} .content-area .page_header .topics_nav ul li.tit {display: none;} .content-area .site-content {} .content-area .site-content .topics_area {width: 94%;margin: 0 auto 0;padding: 8% 0;} .content-area .site-content .topics_area .archive-topics_box {width: 100%;box-sizing: border-box;padding: 4%;background-color: #FFF;box-shadow: 0 0 8px rgba(0,0,0,0.2);margin-bottom: 5%;position: relative;} .content-area .site-content .topics_area .archive-topics_box a {width: 100%;height: 100%;display: flex;justify-content: space-between;text-decoration: none;} .content-area .site-content .topics_area .archive-topics_box .ph {width: 45%;height: auto;overflow: hidden;aspect-ratio: 248 / 160;} .content-area .site-content .topics_area .archive-topics_box .txt_area {width: 51%;} .content-area .site-content .topics_area .archive-topics_box .txt_area .date_area .date {font-family: "Montserrat", serif;font-size: 3.0vw;font-weight: 500;color: #999999;letter-spacing: 0.2em;line-height: 1.0;margin-bottom: 1%;} .content-area .site-content .topics_area .archive-topics_box .txt_area h3 {font-size: 3.8vw;font-weight: 700;color:#000;margin-bottom: 2%;line-height: 1.6;} .content-area .site-content .topics_area .archive-topics_box .txt_area .txt {display: none;} .single_topics {width: 100%;height:auto;margin: 0 auto 0;position: relative;padding: 22% 0 15%;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 60% auto;} .single_topics:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .single_topics h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .single_topics h2 span {position: relative;} .single_topics h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .single_topics .site-content {width: 94%;margin: 0 auto 9%;background-color: #F7F7F7;box-sizing: border-box; padding: 3%;} .single_topics .site-content .topics_area {width: 100%;box-sizing: border-box;background-color: #FFF;position: relative;padding: 3% 6%;} .single_topics_box {width: 100%;} .single_topics_box .cat {width: 32px;height: 96px;box-sizing: border-box;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;font-family: "Montserrat", serif;font-size: 12px;font-weight: 500;color: #FFF;letter-spacing: 0.2em;position: absolute;left:0px;top:0px;padding: 8px 0 0;line-height: 32px;} .single_topics_box .cat.news { border-bottom: 20px solid transparent;border-left: 32px solid #138AA9;border-right: 0px solid transparent;} .single_topics_box .cat.cat-blog {border-bottom: 20px solid transparent;border-left: 32px solid #D97318;border-right: 0px solid transparent;} .single_topics_box .cat.events {border-bottom: 20px solid transparent;border-left: 32px solid #5B9334;border-right: 0px solid transparent;} .single_topics_box .date {font-family: "Montserrat", serif;font-size: 3.4vw;font-weight: 500;color: #999999;letter-spacing: 0.2em;margin-bottom: 4%;margin-left: 20px;} .single_topics_box h3 {font-size: 4.8vw;font-weight: 700;color: #000;letter-spacing: 0.02em;padding: 0; margin: 0 0 4% 20px;font-feature-settings: "palt";line-height: 1.6;} .single_topics_box .ph {width: 100%;margin: 0 auto 9%;} .single_topics_box .txt {font-size: 3.7vw;font-weight: 500;color: #000;letter-spacing: 0.02em;line-height: 1.6;} .rooms_btn_area {max-width: 90%;margin: 0 auto 0;;display:block;} .btn_roomplan {width: 90%;height: 56px;margin: 0 auto 5%;box-sizing: border-box;} .btn_roomplan a {font-size: 3.6vw;font-weight: 700;text-decoration: none;transition: all 0.5s;} .btn_roomplan a span {padding-left: 2em;background-image: url("../img/ico_plan.png");background-repeat: no-repeat;background-size: 1.5em auto;background-position: left center;line-height: 31px;} .btn_ichiran {display: flex;justify-content: center;align-items: center;} .btn_ichiran a {width: 40px;height: 40px;border: solid 5px #E5D9C2;box-sizing: border-box;background-color: #D2B68E;display: flex;position: relative;text-indent: -9999px;transition: all 0.5s;} .btn_ichiran a[rel=prev]:before {content: ''; position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;vertical-align: middle;width: 10px;height: 10px;border-top: 2px solid #000;border-right: 2px solid #000;-webkit-transform: rotate(225deg);transform: rotate(225deg);} .btn_ichiran a[rel=next]:before {content: ''; position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;vertical-align: middle;width: 10px;height: 10px;border-top: 2px solid #000;border-right: 2px solid #000;-webkit-transform: rotate(45deg);transform: rotate(45deg);} .btn_ichiran a.listback {width: 50%;height: 56px;background-color: #D2B68E;border-color: #D2B68E;margin: 0 5%;text-indent: 0;text-decoration: none;display: flex;justify-content: center;align-items: center;} .btn_ichiran a:hover {background-color: #E5D9C2;border-color: #D2B68E;} .btn_ichiran a.listback span {color: #000;padding: 0 0 0 72px;font-family: "Montserrat", serif;font-size: 3.6vw;font-weight: 700;position: relative;} .btn_ichiran a.listback span:before,.btn_ichiran a.listback span:after {position: absolute;top: 50%;left: 0px;height: 1px;background: #231815;content: '';} .btn_ichiran a.listback span:before {width: 48px;transform: translateY(-50%);} .btn_ichiran a.listback span:after {width: 20px;transform: translateY(-50%) rotate(-30deg);transform-origin: left center;} } /* ========================================================= ============================================================ ============================================================ ROOM TYPE ============================================================ ============================================================ ========================================================= */ .p_header.rooms {width: 100%;min-width: 100%; height: 368px;position: relative;overflow: hidden;background-image:url("../img/page_header_rooms.jpg");background-size: cover;display: flex;justify-content: center;align-items: center;} .post-type-archive-rooms {} .post-type-archive-rooms .content-area .page_header {height: auto;padding-bottom: 80px} .page_header .read_area {width: 664px;margin: 0 auto 56px;} .page_header .read_area .en {font-family: "Montserrat", serif;font-size: 18px;font-weight: 700;letter-spacing: 0.15em;text-align: center;margin-bottom: 16px;} .page_header .read_area h3 {font-size: 32px;font-weight: 700;text-align: center;margin: 0 auto 40px;padding: 0;} .page_header .read_area p {font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;line-height: 1.8;} .post-type-archive-rooms .content-area .site-content {margin-top: -72px;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content {max-width: 1216px;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner{display: block;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col {width: 100%;margin-bottom: 40px;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a {width: 100%; display: flex;justify-content: space-between;align-items: flex-end;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .ph {width: 57.24%;height: auto;aspect-ratio: 696 / 434;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area {width: 46%;margin-left: -3.3%;background-color: #FFF;box-sizing: border-box;padding: 3% 3.3%;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .tit {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .tit .en {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .tit .jp {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .detail_tb {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .detail_tb .detail_tr {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .detail_tb .detail_tr .detail_th {} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area .in .detail_tb .detail_tr .detail_td {} .post-type-archive-en_rooms .content-area .page_header {height: auto;padding-bottom: 80px} .post-type-archive-en_rooms .content-area .site-content {margin-top: -72px;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content {max-width: 1216px;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner{display: block;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col {width: 100%;margin-bottom: 40px;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a {width: 100%; display: flex;justify-content: space-between;align-items: flex-end;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .ph {width: 57.24%;height: auto;aspect-ratio: 696 / 434;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area {width: 46%;margin-left: -3.3%;background-color: #FFF;box-sizing: border-box;padding: 3% 3.3%;} .single_rooms {width: 100%;height:auto;margin: 0 auto 0;position: relative;padding: 120px 0 120px;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 456px auto;} .single_rooms:before {content: '';width: 1px;height: 72px;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .single_rooms h2 {font-family: "Montserrat", serif;font-size: 40px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;} .single_rooms h2 span {position: relative;} .single_rooms h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .single_rooms .site-content {max-width: 1040px;box-sizing: border-box;padding: 0 16px;;margin: 0 auto 72px;background-color: inherit;box-sizing: border-box; padding:0;} .single_rooms .site-content .rooms_single_area {} .single_rooms .site-content .rooms_single_area .single_topics_box {text-align: center;} .single_rooms .site-content .rooms_single_area .single_topics_box .sub_tit {font-family: "Montserrat", serif;font-size: 21px;font-weight: 500;letter-spacing: 0.1em; text-align: center;margin-bottom: 16px;} .single_rooms .site-content .rooms_single_area .single_topics_box .room_tit {font-size: 28px;font-weight: 700;text-align: center;margin: 0 auto 40px;padding: 0;} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide {background-color: #F7F7F7;padding:0 0 4px;margin-bottom: 52px;} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide .sp-slides {} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide .sp-slides .sp-slide {} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide .sp-slides .sp-slide img {} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide .sp-thumbnails {} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide .sp-thumbnails img.sp-thumbnail {} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content {width: 100%;display: flex;justify-content: space-between;margin-bottom: 52px;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .explanation {width: 48%;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 1.6;text-align: left;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb {width: 48%;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr {width: 100%;display: flex;justify-content: space-between;line-height: 1.4;padding: 1em 0;border-bottom: solid 1px #E1E2E2;color: #000;text-align: left;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr .detail_th {width: 25%;box-sizing: border-box;padding-right: 0.5em;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;border-right: solid 1px #E1E2E2;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr .detail_td {width: 75%;box-sizing: border-box;padding-left: 1em;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 2em;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb {width: 100%;min-height: 104px; box-sizing: border-box;padding: 16px;display: flex;justify-content: space-between;align-items: center;background-color: #F5F5F5;margin-bottom: 16px;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_th {width: 24%;box-sizing: border-box;border-right: solid 1.5px #E1E2E2;font-family: "Montserrat", serif;font-size: 18px;font-weight: 600;letter-spacing: 0.1em;line-height: 1.8;text-align: left;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_th span {font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_td {width: 74%;font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 2em;text-align: left;} .room_facilities {width: 100%;padding: 1em 0;} .room_facilities .tit {font-family: "Montserrat", serif;font-size: 18px;font-weight: 600;letter-spacing: 0.1em;line-height: 1.8;text-align: left;} .room_facilities .tit span {padding-left: 1em;font-family:"游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: clamp(12px, 1.6vw, 16px);font-weight: 700;text-align: left;} .room_facilities .com {font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;line-height: 2em;text-align: left;} @media screen and (max-width: 767px) { .p_header.rooms {width: 100%;min-width: 100%; height: auto;aspect-ratio: 752 / 368;position: relative;overflow: hidden;background-image:url("../img/page_header_rooms_sp.jpg");background-size: cover;display: flex;justify-content: center;align-items: center;} .post-type-archive-rooms {} .post-type-archive-rooms .content-area .page_header {height: auto;padding-bottom: 40px} .page_header .read_area {width: 94%;margin: 0 auto 7%;} .page_header .read_area .en {font-family: "Montserrat", serif;font-size: 4.2vw;font-weight: 700;text-align: center;margin-bottom: 2%;} .page_header .read_area h3 {font-size: 6.4vw;font-weight: 700;text-align: center;margin: 0 auto 5%;padding: 0;} .page_header .read_area p {font-size: 3.6vw;font-weight: 700;line-height: 1.8;} .post-type-archive-rooms .content-area .site-content {margin-top: -40px;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content {width: 94%;margin: 0 auto 0;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner{display: block;padding: 1rem 0 0;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col {width: 100%;margin-bottom: 5%;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a {width: 100%; display: block;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .ph {width: 100%;height: auto;margin-bottom: 0;} .post-type-archive-rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area {width: 100%;margin-left: 0;background-color: #FFF;box-sizing: border-box;padding: 5% 0;} .post-type-archive-en_rooms .content-area .page_header {height: auto;padding-bottom: 40px} .post-type-archive-en_rooms .content-area .site-content {margin-top: -40px;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content {width: 94%;margin: 0 auto 0;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner{display: block;padding: 1rem 0 0;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col {width: 100%;margin-bottom: 5%;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a {width: 100%; display: block;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .ph {width: 100%;height: auto;margin-bottom: 0;} .post-type-archive-en_rooms .content-area .site-content .tab_area .tab_container .tab_content .inner .room_col a .txt_area {width: 100%;margin-left: 0;background-color: #FFF;box-sizing: border-box;padding: 5% 0;} .single_rooms {width: 100%;height:auto;margin: 0 auto 0;position: relative;padding: 22% 0 15%;background-image: url("../img/triangle_l.png");background-repeat: no-repeat;background-position: left top;background-size: 60% auto;} .single_rooms:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .single_rooms h2 {font-family: "Montserrat", serif;font-size: 5.4vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .single_rooms h2 span {position: relative;} .single_rooms h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .single_rooms .site-content {width: 94%;margin: 0 auto 8%;background-color: inherit;box-sizing: border-box; padding:0;} .single_rooms .site-content .rooms_single_area {} .single_rooms .site-content .rooms_single_area .single_topics_box {text-align: center;} .single_rooms .site-content .rooms_single_area .single_topics_box .sub_tit {font-family: "Montserrat", serif;font-size: 4.2vw;font-weight: 500;text-align: center;margin-bottom: 2%;} .single_rooms .site-content .rooms_single_area .single_topics_box .room_tit {font-size: 4.8vw;font-weight: 700;text-align: center;margin: 0 auto 5%;padding: 0;} .single_rooms .site-content .rooms_single_area .single_topics_box #rooms_slide {background-color: #F7F7F7;padding:0 0 4px;margin-bottom: 6%;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content {width: 100%;display: block;margin-bottom: 6%;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .explanation {width: 100%;font-size: 3.6vw;font-weight: 500;line-height: 1.6;text-align: left;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb {width: 100%;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr {width: 100%;display: flex;justify-content: space-between;line-height: 1.0;padding: 1em 0;border-bottom: solid 1px #E1E2E2;color: #000;text-align: left;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr .detail_th {width: 25%;box-sizing: border-box;padding-right: 0.5em;font-size: 3.6vw;font-weight: 500;border-right: solid 1px #E1E2E2;} .single_rooms .site-content .rooms_single_area .single_topics_box .txt_content .detail_tb .detail_tr .detail_td {width: 75%;box-sizing: border-box;padding-left: 1em;font-size: 3.6vw;font-weight: 500;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb {width: 100%;min-height: auto; box-sizing: border-box;padding: 5%;display:block;background-color: #F5F5F5;margin-bottom: 3%;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_th {width: 100%;box-sizing: border-box;border-right: none;border-bottom: solid 1.0px #E1E2E2;font-family: "Montserrat", serif;font-size: 4.0vw;font-weight: 500;line-height: 1.8;padding: 0 0 0.6em;margin-bottom: 0.8em;text-align: center;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_th span {font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: 3.6vw;font-weight: 700;} .single_rooms .site-content .rooms_single_area .single_topics_box .gr_tb .gr_td {width: 100%;font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: 3.6vw;font-weight: 500;text-align: left;line-height: 1.6;} .room_facilities {width: 100%;padding: 1em 0;} .room_facilities .tit {font-family: "Montserrat", serif;font-size: 4.0vw;font-weight: 600;letter-spacing: 0.1em;line-height: 1.8;text-align: left;} .room_facilities .tit span {padding-left: 1em;font-family:"游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size: 3.6vw;font-weight: 700;text-align: left;} .room_facilities .com {font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;font-size:3.6vw;font-weight: 500;text-align: left;line-height: 1.6;} } /* ========================================================= ============================================================ ============================================================ Contact ============================================================ ============================================================ ========================================================= */ .contact .sec01 {padding: 104px 0 40px;} .contact .sec01 .sec_t {font-family: 'Shippori Mincho', serif;font-size: 36px;line-height: 1.66;letter-spacing: 0.05em; color: #00aaa5;margin-bottom: 40px;text-align: center;} .contact .sec01 .in {width: 1000px;margin: 0 auto 0;} .contact .sec01 .in .read {background-color: #f2f2f2;font-size: clamp(12px, 1.6vw, 16px);font-weight: 500;color: #5d7782;letter-spacing: 0.1em;line-height: 1.86;box-sizing: border-box;padding: 48px;margin-bottom: 48px;} .contact .sec01 .in .form-box {width: 800px;margin: 0 auto 0;} .contact .sec01 .in table.table-style01 {display: block;text-align: left;} .contact .sec01 .in table.table-style01 tbody {width: 100%;} .contact .sec01 .in table.table-style01 tr {display: flex;flex-wrap: wrap; width: 100%;padding-bottom: 32px;} .contact .sec01 .in table.table-style01 tr th {width: 100%;padding: 5px 0;font-family: 'Shippori Mincho', serif;font-size: 22px;line-height: 1.66;letter-spacing: 0.05em; color:#5d7782;} .contact .sec01 .in table.table-style01 tr th span.must {color: #c94324;box-sizing: border-box;border: solid 1px #c94324;font-size: 13px;display: inline-block;margin-right: 5px;padding: 0 5px;} .contact .sec01 .in table.table-style01 tr td {width: 100%;font-size: 18px;} .contact .sec01 .in table.table-style01 tr td input {width: 100%;box-sizing: border-box;padding: 8px;font-size: 18px;outline: #b2b2b2;} .contact .sec01 .in table.table-style01 tr td textarea {width: 100%;box-sizing: border-box;padding: 8px;font-size: 18px;outline: #b2b2b2;} .contact .sec01 .in table.table-style01 tr td input[type="radio"] {width: auto;} .contact .sec01 .in table.table-style01 tr td .mwform-radio-field {display: block;} .submit_area {width: 800px;margin: 24px auto 80px;background-color: #f2f2f2;box-sizing: border-box;padding: 72px;text-align: center;font-size: clamp(12px, 1.6vw, 16px);line-height: 1.86;} .submit_area a.policy_link {padding-right: 1.5em;position: relative;} .submit_area a.policy_link:after {content: "";position: absolute;right: 0.2em;top:0; width: 1.1em;height: 100%;background-image:url("../img/icon_link.png");background-repeat: no-repeat;background-size: contain;background-position: right top;} .btn-submit {display: inline-block;position: relative;} .btn-submit:after {content: "";position: absolute;top: 50%;bottom: 0;right: 2rem;font-size: 90%;display: flex;justify-content: center;align-items: center;transition: right 0.3s;width: 6px;height: 6px;border-top: solid 2px #FFF;border-right: solid 2px #FFF;transform: translateY(-50%) rotate(45deg);} .btn-submit input[type="submit"]{border: 0px;border-radius: 32px;background-color: #8dc21f;width:316px;height:64px;color: #FFF;font-size: 19px;cursor: pointer;} .btn-submit[disabled] input[type="submit"] {cursor: default;pointer-events: none;} .thanks .p_header {width: 100%;height: 448px;overflow: hidden;position: relative;} .thanks .content_wrap {} .thanks .content_wrap .sec01 {text-align: center;padding: 88px 0 96px;} .thanks .content_wrap .sec01 .sec_t {font-family: 'Shippori Mincho', serif;font-size: 24px;line-height: 1.66;letter-spacing: 0.05em;color: #5d7782;padding-bottom: 0.5em;margin-bottom: 1.0em;text-align: center} .thanks .content_wrap .sec01 .sec_t span {border-bottom: solid 2px #5d7782;padding-bottom: 0.5em} .thanks .content_wrap .sec01 .in {} .thanks .content_wrap .sec01 .in p {font-size: clamp(12px, 1.6vw, 16px);letter-spacing: 0.13em;} .thanks .content_wrap .sec01 .in .ema {font-family: 'Shippori Mincho', serif;font-size: 24px;line-height: 1.66;letter-spacing: 0.05em;margin-bottom: 80px;} .thanks .content_wrap .sec01 .in .ema a {color: #00aaa5;text-decoration: none;} .thanks .content_wrap .sec01 .in .btn_apply {width: 270px;margin-top: 88px;} .mw_wp_form .vertical-item {display: block;} @media screen and (max-width: 767px) { .contact .p_header {width: 100%;height:auto;overflow: hidden;position: relative;} .contact .sec01 {padding: 10% 0 5%;} .contact .sec01 .sec_t {font-family: 'Shippori Mincho', serif;font-size:6.4vw;line-height: 1.66;letter-spacing: 0.05em; color: #00aaa5;margin-bottom: 5%;text-align: center;} .contact .sec01 .in {width: 90%;margin: 0 auto 0;} .contact .sec01 .in .read {background-color: #f2f2f2;font-size: 4vw;font-weight: 500;color: #5d7782;letter-spacing: 0.1em;line-height: 1.86;box-sizing: border-box;padding: 5%;margin-bottom: 48px;} .contact .sec01 .in .form-box {width: 100%;margin: 0 auto 0;} .contact .sec01 .in table.table-style01 {display: block;text-align: left;} .contact .sec01 .in table.table-style01 tbody {width: 100%;} .contact .sec01 .in table.table-style01 tr {display: flex;flex-wrap: wrap; width: 100%;padding-bottom: 5%;} .contact .sec01 .in table.table-style01 tr th {width: 100%;padding: 5px 0;font-family: 'Shippori Mincho', serif;font-size: 4.8vw;line-height: 1.66;letter-spacing: 0.05em; color:#5d7782;} .contact .sec01 .in table.table-style01 tr th span.must {color: #c94324;box-sizing: border-box;border: solid 1px #c94324;font-size: 3.4vw;display: inline-block;margin-right: 5px;padding: 0 5px;} .contact .sec01 .in table.table-style01 tr td {width: 100%;font-size: 4.8vw;} .contact .sec01 .in table.table-style01 tr td input {width: 100%;box-sizing: border-box;padding: 8px;font-size: 4.8vw;outline: #b2b2b2;} .contact .sec01 .in table.table-style01 tr td textarea {width: 100%;box-sizing: border-box;padding: 8px;font-size: 4.8vw;outline: #b2b2b2;} .submit_area {width: 100%;margin: 3% auto 10%;background-color: #f2f2f2;box-sizing: border-box;padding: 5%;text-align:left;font-size: 4.6vw;line-height: 1.86;} .btn-submit {display: block;} .btn-submit input[type="submit"]{width:100%;height:64px;color: #FFF;font-size: 4.4vw;cursor: pointer;} .thanks .p_header {width: 100%;height:auto;overflow: hidden;position: relative;} .thanks .content_wrap {} .thanks .content_wrap .sec01 {text-align: left;padding: 10% 0 10%;} .thanks .content_wrap .sec01 .sec_t {font-family: 'Shippori Mincho', serif;font-size: 5.2vw;line-height: 1.66;letter-spacing: 0.05em;color: #5d7782;padding-bottom: 0.5em;margin-bottom: 1.0em;text-align: center} .thanks .content_wrap .sec01 .sec_t span {border-bottom: solid 2px #5d7782;padding-bottom: 0.5em} .thanks .content_wrap .sec01 .in {} .thanks .content_wrap .sec01 .in p {width: 90%;margin: 0 auto 1em;font-size: 4.0vw;letter-spacing: 0.13em;} .thanks .content_wrap .sec01 .in .ema {font-family: 'Shippori Mincho', serif;font-size: 5.2vw;line-height: 1.66;letter-spacing: 0.05em;width: 90%;margin: 0 auto 10%;} .thanks .content_wrap .sec01 .in .ema a {color: #00aaa5;text-decoration: none;} .thanks .content_wrap .sec01 .in .btn_apply {width: 70%;margin-top: 10%;} .mw_wp_form .vertical-item {display: block;} .mwform-checkbox-field.vertical-item {text-align: center;} } /* ========================================================= ============================================================ ============================================================ 404 ============================================================ ============================================================ ========================================================= */ .p_header.notfound404 {width: 100%;min-width: 100%; height: 368px;position: relative;overflow: hidden;background-image:url("../img/pagetitle-404.jpg");background-size: cover;display: flex;justify-content: center;align-items: center;} .error404-page {width: 100%;height:auto;margin: 0 auto 0;position: relative;padding: 176px 0 120px;} .error404-page:before {content: '';width: 1px;height: 120px;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .error404-page h2 {font-family: "Montserrat", serif;font-size: 72px;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.15em;margin-bottom: 96px;position: relative;} .error404-page h2 span {} .error404-page h2 span:after {content: '';width: 64px;height: 3px;border-radius: 2px;background-color: #D2B68E;position: absolute;left: calc(50% - 32px);bottom: -16px;} .error404 h2 .s_tit {font-size: 16px;display: block;letter-spacing: 0.45em;} .error404-page .site-content {max-width: 1040px;box-sizing: border-box;;margin: 0 auto 72px;background-color: inherit;padding:0;} .error404-page .site-content h3 {text-align: center;font-size: 26px;font-weight: 700;margin: 0 auto 80px;} .error404-page .site-content p {text-align: center;font-size: 16px;font-weight: 700;line-height: 1.6;letter-spacing: 0.02em; margin: 0 auto 80px;} @media screen and (max-width: 767px) { .p_header.notfound404 {width: 100%;min-width: 100%; height: auto;aspect-ratio: 752 / 368;position: relative;overflow: hidden;background-position: center;} .error404-page {width: 100%;height:auto;margin: 0 auto 0;position: relative;box-sizing: border-box; padding: 22% 5% 15%;} .error404-page:before {content: '';width: 1px;height: 4rem;position: absolute;background-color: #231815;left: calc(50% - 0.5px);top: 0;} .error404-page h2 {font-family: "Montserrat", serif;font-size: 8.8vw;font-weight: 600;color: #000;text-align: center;letter-spacing: 0.1em;margin-bottom: 15%;} .error404 h2 .s_tit {font-size: 3vw;display: block;letter-spacing: 0.05em;} .error404-page .site-content {max-width: 1040px;box-sizing: border-box;;margin: 0 auto 72px;background-color: inherit;padding:0;} .error404-page .site-content h3 {text-align: center;font-size: 6.4vw;font-weight: 700;margin: 0 auto 10%;line-height: 1.6;} .error404-page .site-content p {text-align: center;font-size: 4vw;font-weight: 700;line-height: 1.6;letter-spacing: 0.02em; margin: 0 auto 10%;} } /* ========================================================= ============================================================ ============================================================ About ============================================================ ============================================================ ========================================================= */ .aboutpage_wrap { display: flex; border-bottom: 1px solid #d18200; padding: 96px 0; } .aboutpage_left_box { width: 30%; text-align: center; } .aboutpage_right_box { width: 65%; margin-left: 5%; } .aboutpage-organization { max-width: 500px; margin-left: auto; margin-right: auto; text-align: center; margin-top: 72px; } .aboutpage-logo { max-width: 180px; margin-left: auto; margin-right: auto; text-align: center; } .aboutpage-map { max-width: 500px; margin-left: auto; margin-right: auto; text-align: center; margin-top: 72px; } h4 { color: #18b7cd; font-weight: 600; font-size: 1.8rem; display: inline-block; position: relative; text-align: center; } h4 span{ display: block; font-size: 0.6rem; font-family: "Lato", sans-serif; font-weight: 300; font-style: normal; color: #18b7cd; display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; border: 0; letter-spacing: 0.3rem; margin-top: 24px; } h4:after { content: ''; width: 220px; height: 2px; display: inline-block; background-color: #18b7cd; position: absolute; bottom: 24px; left: calc(50% - 110px) } h5{ color: #150201; font-weight: 600; font-size: 1.6rem; line-height: 2.8rem; } .about-li{ line-height: 1.8rem; text-indent: -3rem; padding-left: 2rem; } /*========================================================== table ========================================================= */ .line_table { width: 100%; min-width: 600px; margin: 0px; border-collapse: collapse; line-height: 1.6rem; } .line_table th { padding: 15px; margin: 0px; border-bottom: 1px solid #D0D0D0; background-color: #e7e4d4; /* 背景色指定 */ } .line_table td { padding: 15px; border-bottom: 1px solid #D0D0D0; } @media screen and (max-width: 767px) { .aboutpage_wrap { display: block; } .aboutpage_left_box { width: 100%; text-align: center; margin-bottom: 32px; } .aboutpage_right_box { width: 100%; margin-left: 0px; } .line_table { width: 100%; min-width: 100%; } } /* ========================================================= ============================================================ ============================================================ Project ============================================================ ============================================================ ========================================================= */ .projectpage_wrap{ border-bottom: 1px solid #d18200; padding: 96px 0; } .projectpage_flex{ display: flex; margin-bottom: 80px; } .projectpage_left_box { width: 60%; margin: 0% 24px; } .projectpage_left_box h5{ margin-top: 24px; } rojectpage_right_box { vertical-align: top; text-align: center; } @media screen and (max-width: 767px) { .projectpage_flex{ display: block; margin-bottom: 80px; } .projectpage_left_box { width: 100%; margin: 0% 0%; text-align: center; } } /*========================================================== Swiper ========================================================= */ .projectpage_swiper_container { margin-left: auto; margin-right: auto; max-width: 800px; position: relative; border-radius: 16px; } .projectpage_swiper_container .swiper { max-width: 800px; border-radius: 16px; } .projectpage_swiper_container .swiper-slide img { height: auto; width: 100%; border-radius: 16px 16px 0px 0px; } .projectpage_swiper_container .swiper-txtarea { height: auto; padding: 24px; background-color: #FFFFFF; border-radius: 0px 0px 16px 16px; } .projectpage_swiper_container .swiper-txtarea h6{ font-size: 1.2rem; line-height: 2.0rem; font-weight:600; color: #aacc03; } /* 前への矢印 */ .projectpage_swiper_container .swiper-button-prev { left: -50px; } /* 次への矢印 */ .projectpage_swiper_container .swiper-button-next { right: -50px; } .projectpage_swiper_container .swiper-button-next, .projectpage_swiper_container .swiper-button-prev { --swiper-navigation-color: #aacc03; //変更する色を指定 } .projectpage_swiper_container .sample-slider [class^="swiper-button-"]::after{ font-size: 300px; } /* ページネーション */ .projectpage_swiper_container .swiper-pagination-bullets.swiper-pagination-horizontal { background-color: #BE2C2E; bottom: -25px; height: 100px; } .projectpage_swiper_container .swiper-pagination span.swiper-pagination-bullet-active{ opacity: .4; } .projectpage_swiper_container .swiper-pagination { bottom: -40px !important; } /* 上下の配列を入れ替える*/ .flex--reverse { flex-direction: row-reverse; } @media screen and (max-width: 767px) { .projectpage_swiper_container .swiper {  max-width: 80％; width: 80%; } /* 前への矢印 */ .projectpage_swiper_container .swiper-button-prev { left: -10px; } /* 次への矢印 */ .projectpage_swiper_container .swiper-button-next { right: -10px; } } /*========= アニメーションの指定 ===============*/ /*動きのきっかけの起点となるクラス名 はじめは非表示に*/ .scale-up-tlTrigger, .scale-up-blTrigger, .scale-up-brTrigger, .fadeInTrigger, .fadeInUpTrigger, .fadeInUpBigTrigger, .fadeInDownTrigger, .fadeInLeft06Trigger, .zoomIn06Trigger, .zoomOut06Trigger, .fadeInUpTriggerOnce{ opacity:0; } /* アニメーションの回数を決めるCSS*/ .count2{ animation-iteration-count: 2;/*この数字を必要回数分に変更*/ } /* アニメーションスタートの遅延時間を決めるCSS*/ .delay-time{ animation-delay: 0.5s; } .animate__delay-02s{ animation-delay: 0.2s; } .animate__delay-04s{ animation-delay: 0.4s; } .animate__delay-06s{ animation-delay: 0.6s; } .animate__delay-08s{ animation-delay: 0.8s; } .animate__delay-10s{ animation-delay: 1.0s; } .animate__delay-20s{ animation-delay: 2.0s; } /* アニメーション自体が変化する時間を決めるCSS*/ .change-time{ animation-duration: 4.5s;/*この数字を変化させたい時間に変更*/ } @-webkit-keyframes zoomIn06 { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 100% { opacity: 1; } } @keyframes zoomIn06 { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 100% { opacity: 1; } } .animate__zoomIn06 { -webkit-animation-name: zoomIn06; animation-name: zoomIn06; } @-webkit-keyframes zoomOut06 { from { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 1; } } @keyframes zoomOut06 { from { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 1; } } .animate__zoomOut06 { -webkit-animation-name: zoomOut06; animation-name: zoomOut06; } @-webkit-keyframes fadeInUp06 { from { opacity: 0; -webkit-transform: translate3d(0, 5%, 0); transform: translate3d(0, 5%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes fadeInUp06 { from { opacity: 0; -webkit-transform: translate3d(0, 5%, 0); transform: translate3d(0, 5%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .animate__fadeInUp06 { -webkit-animation-name: fadeInUp06; animation-name: fadeInUp06; } @-webkit-keyframes fadeInLeft06 { from { opacity: 0; -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes fadeInLeft06 { from { opacity: 0; -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .animate__fadeInLeft06{ -webkit-animation-name: fadeInLeft06; animation-name: fadeInLeft06; } /** * ---------------------------------------- * animation scale-up-br * ---------------------------------------- */ @-webkit-keyframes scale-up-br { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } } @keyframes scale-up-br { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } } .animate__scale-up-br { -webkit-animation-name: scale-up-br; animation-name: scale-up-br; } /** * ---------------------------------------- * animation scale-up-bl * ---------------------------------------- */ @-webkit-keyframes scale-up-bl { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } } @keyframes scale-up-bl { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } } .animate__scale-up-bl { -webkit-animation-name: scale-up-bl; animation-name: scale-up-bl; } /** * ---------------------------------------- * animation scale-up-tr * ---------------------------------------- */ @-webkit-keyframes scale-up-tr { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } } @keyframes scale-up-tr { 0% { opacity: 0; -webkit-transform: scale(0.0); transform: scale(0.0); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } } .animate__scale-up-tr { -webkit-animation-name: scale-up-tr; animation-name: scale-up-tr; } /** * ---------------------------------------- * loading animation * ---------------------------------------- */ .loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 10; background-color: #fff; display: flex; align-items: center; justify-content: center; animation: fadeOut 1.5s 2.5s forwards; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } } .loading__logo { opacity: 0; animation: logo_fade 2.0s 0.5s forwards; width: 100px; } @keyframes logo_fade { 0% { opacity: 0; transform: translateY(10px); } 60% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } } /* ========================================================= ============================================================ ============================================================ EN-PAGE ============================================================ ============================================================ ========================================================= */ .top_concept .in .concept_box .concept_in .col_l .tit .en-h2 h2 {margin: 0 0 0px;padding: 0;text-align: left;font-size: 32px;font-family: 'Montserrat';font-weight: 700;line-height: 1.40;letter-spacing: 0.05em;}