@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;600&family=Noto+Serif+JP:wght@300;600&display=swap");
/******************************************************

top

******************************************************/
#main { background: #efefef; }
#main #main_slide { display: none; }
#main #main_slide.slick-initialized { display: block; }
#main #main_slide.slick-dotted.slick-slider { margin-bottom: 0; }
#main #main_slide .slick-dots { bottom: inherit; top: 67vw; }
#main #main_slide .slick-dots li button:before { content: ""; font-size: 16px; color: #fff; opacity: 0.7; box-sizing: border-box; border: 2px solid #9fa0a0; border-radius: 50px; width: 15px; height: 15px; }
#main #main_slide .slick-dots li.slick-active button:before { background: #9fa0a0; opacity: 1; }
#main img { width: 100%; height: auto; }
#main > .note { padding: 10px; }
#main li .note { padding: 10px; width: 100%; font-size: 12px; line-height: 1.6; }
@media screen and (max-width: 830px) { #main li .note { padding-top: 35px; width: 100%; } }
@media screen and (max-width: 640px) { #main > .note { padding-top: 25px; } }

.merit { background: url("../img/common/footer-bg.jpg") center top; background-size: 100rem 50rem; border-top: 2px solid #aa9765; text-align: center; padding-bottom: 3em; font-size: 10px; }
.merit .note { margin: 5px 10px 10px; text-align: left; display: block; color: #fff; }
.merit .merit-txt1, .merit .merit-txt2 { color: #fff; font-feature-settings: "palt"; line-height: 1.5; letter-spacing: 20%; }
.merit .merit-txt1 { font-size: 4.8em; margin-top: 1rem; }
.merit .merit-txt2 { font-size: 3.2em; margin-top: 3rem; }
.merit .merit-img { width: 80%; margin: auto; margin-top: 3em; max-width: 900px; }
@media screen and (max-width: 930px) { .merit { font-size: 9px; } }
@media screen and (max-width: 640px) { .merit { font-size: 7px; } }

.conv-btn { width: 90%; margin: auto; max-width: 1000px; font-size: 10px; }
.conv-btn a { display: block; width: 100%; padding: 18px 0; color: #fff; font-size: 2.5rem; letter-spacing: 0.1em; position: relative; background: #c31831; transition: .3s; text-align: center; }
.conv-btn a::after { content: ""; display: block; position: absolute; right: 10px; top: 45%; width: 10px; height: 10px; border-top: 1px solid #fff; border-right: 1px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.conv-btn a:hover { filter: brightness(120%); }
.conv-btn.top-reserve { margin-top: 4em; margin-bottom: 7em; }
.conv-btn.top-request a { background: #000; }
@media screen and (max-width: 640px) { .conv-btn a { font-size: 2rem; } }

.info-ttl { text-align: center; font-family: 'EB Garamond', serif; font-weight: 300; font-style: normal; letter-spacing: 0.05em; -webkit-font-smoothing: antialiased; font-size: 20px; letter-spacing: 20%; }

.information { border: 2px solid #aa9765; font-size: 10px; box-sizing: border-box; max-width: 1100px; padding: 2rem 0% 4rem; margin-top: 4rem; }
.information ul { display: flex; flex-wrap: wrap; align-items: center; width: 100%; }
.information ul li { box-sizing: border-box; }
.information ul li:nth-child(1) { width: 28%; margin-left: 5%; }
.information ul li:nth-child(1) h4 { color: #aa9765; font-size: 3rem; font-feature-settings: "palt"; line-height: 1.7; letter-spacing: 5%; }
.information ul li:nth-child(2) { width: 67%; }
.information ul li:nth-child(3) { width: 100%; padding: 0 7%; }
@media screen and (max-width: 1100px) { .information ul li:nth-child(1) h4 { font-size: 2.6vw; } }
@media screen and (max-width: 640px) { .information { padding: 3rem 5% 3rem; }
  .information ul { display: block; }
  .information ul li:nth-child(1) { width: 100%; text-align: center; }
  .information ul li:nth-child(1) h4 { font-size: 5vw; }
  .information ul li:nth-child(2) { width: 100%; padding: 3% 0; }
  .information ul li:nth-child(3) { width: 100%; } }

.contents-link { margin: auto; max-width: 1100px; font-size: 10px; margin-bottom: 5em; width: 90%; }
.contents-link a { display: flex; border: 2px solid #aa9765; box-sizing: border-box; background: #fff; }
.contents-link a .photo-sec { width: 58%; transition: 0.5s opacity; }
.contents-link a .copy-sec { width: 42%; background: url("../img/top/contents-bg.jpg") center center no-repeat; background-size: cover; color: #fff; padding: 3% 0; font-feature-settings: "palt"; transition: 0.5s opacity; }
.contents-link a .copy-sec .ttl-en { font-family: 'EB Garamond', serif; font-weight: 300; font-style: normal; letter-spacing: 0.05em; -webkit-font-smoothing: antialiased; font-size: 4.6em; display: flex; align-items: flex-end; }
.contents-link a .copy-sec .ttl-en img { width: 24%; height: auto; }
.contents-link a .copy-sec .ttl-kana { letter-spacing: 10%; font-size: 2.6em; line-height: 2; margin-top: 3rem; }
.contents-link a:hover .photo-sec { opacity: 0.7; }
.contents-link a:hover .copy-sec { opacity: 0.7; }
.contents-link.right-link a .photo-sec { order: 2; }
.contents-link.right-link a .copy-sec { order: 1; text-align: left; padding-left: 5%; }
.contents-link.right-link a .copy-sec .ttl-en img { margin-left: 3%; }
.contents-link.left-link a .photo-sec { order: 1; }
.contents-link.left-link a .copy-sec { order: 2; text-align: right; padding-right: 5%; }
.contents-link.left-link a .copy-sec .ttl-en { justify-content: flex-end; }
.contents-link.left-link a .copy-sec .ttl-en span { order: 2; }
.contents-link.left-link a .copy-sec .ttl-en img { margin-right: 3%; order: 1; }
@media screen and (max-width: 1100px) { .contents-link a .copy-sec .ttl-en { font-size: 4vw; }
  .contents-link a .copy-sec .ttl-en img { width: 24%; }
  .contents-link a .copy-sec .ttl-kana { font-size: 2.4vw; margin-top: 2.6vw; } }
@media screen and (max-width: 930px) { .contents-link { font-size: 9px; } }
@media screen and (max-width: 640px) { .contents-link { font-size: 7px; }
  .contents-link a { display: block; }
  .contents-link a .photo-sec { width: 100%; }
  .contents-link a .copy-sec { width: 100%; padding-bottom: 5vw; }
  .contents-link a .copy-sec .ttl-en { font-size: 8vw; }
  .contents-link a .copy-sec .ttl-en img { width: 20%; }
  .contents-link a .copy-sec .ttl-kana { font-size: 4vw; margin-top: 2.6vw; }
  .contents-link.right-link a .photo-sec { order: 1; }
  .contents-link.right-link a .copy-sec { order: 2; text-align: left; padding-right: 8%; padding-left: 8%; }
  .contents-link.right-link a .copy-sec .ttl-en img { margin-left: 3%; }
  .contents-link.left-link a .photo-sec { order: 1; }
  .contents-link.left-link a .copy-sec { order: 2; text-align: left; padding-right: 8%; padding-left: 8%; }
  .contents-link.left-link a .copy-sec .ttl-en { justify-content: flex-start; }
  .contents-link.left-link a .copy-sec .ttl-en span { order: 1; }
  .contents-link.left-link a .copy-sec .ttl-en img { margin-left: 3%; order: 2; } }

.container { background: none; padding-top: 6rem; }
.container > div.note { margin: 5px; }
@media screen and (max-width: 640px) { .container { padding-top: 6rem; } }

.float_bnr { position: fixed; bottom: 100px; right: 1rem; z-index: 2; width: 60%; max-width: 300px; transition: all 0.3s ease 0s; visibility: visible; opacity: 1; }
.float_bnr .close { position: absolute; top: -15px; right: 0; background: #000; width: 30px; height: 30px; z-index: 3; border-radius: 50%; cursor: pointer; border: solid 1px #fff; }
.float_bnr .close .txt { text-align: center; color: #fff; font-size: 26px; line-height: 26px; }
.float_bnr a { display: block; }
.float_bnr a img { width: 100%; height: auto; transition: .3s; }
.float_bnr a:hover img { filter: brightness(110%); }
.float_bnr.float_pickup .close { top: -20px; }
@media screen and (max-width: 930px) { .float_bnr { bottom: 150px; } }
@media screen and (max-width: 640px) { .float_bnr .close { top: -18px; width: 25px; height: 25px; }
  .float_bnr .close .txt { font-size: 20px; line-height: 20px; }
  .float_bnr.float_pickup .close { top: -20px; } }

.floatbox { position: fixed; /*bottom: 100px;*/ bottom: 10px; right: 1rem; z-index: 100; width: 60%; max-width: 300px; transition: all 0.3s ease 0s; visibility: visible; opacity: 1; }
.floatbox .close { position: absolute; top: -15px; right: 0; background: #000; width: 30px; height: 30px; z-index: 3; border-radius: 50%; cursor: pointer; border: solid 1px #fff; }
.floatbox .close .txt { text-align: center; color: #fff; font-size: 26px; line-height: 26px; }
.floatbox a { display: block; }
.floatbox a img { width: 100%; height: auto; transition: .3s; }
.floatbox a:hover img { filter: brightness(110%); }
.floatbox .float_zeh { position: relative; bottom: 0; right: 0; width: 100%; }
.floatbox .float_event { position: relative; bottom: 0; right: 0; width: 100%; margin-bottom: 2rem; }
.floatbox .float_pickup { position: relative; bottom: 0; right: 0; width: 100%; }
@media screen and (max-width: 930px) { .floatbox { z-index: 99; /*bottom: 150px;*/ } }
@media screen and (max-width: 640px) { .floatbox { width: 40%; } }