@charset "UTF-8";
/**************************************
							共 通 項 目
**************************************/
body { background-color: #000000; color: #FFFFFF; }

.wrapper { width: 100%; max-width: 1920px; margin: 0 auto; }

#topcontrol { z-index: 9999; }

.btn { display: flex; align-items: center; justify-content: center; text-align: center; color: #C09F41; font-size: 1.4rem; position: relative; transition: .4s; border: solid 2px #C09F41; height: 40px; }
.btn a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; display: block; text-indent: -9999px; }
.btn:hover { background-color: #C09F41; color: #FFFFFF; }

h1 { font-size: 0; }

/**************************************
						 ヘ ッ ダ ー
**************************************/
.fixed { position: sticky; top: 0; width: 100%; z-index: 9999; background-color: rgba(0, 0, 0, 0.9); backdrop-filter: blur(5px); box-shadow: 0px 1px 1px #000000; }
.fixed .header { display: flex; justify-content: space-between; align-items: center; }
.fixed .header img { max-width: 150px; height: auto; }
.fixed .header .btn { aspect-ratio: 3 / 1; border-radius: 20px; }

.hero-area { width: 100%; }
.hero-area img { width: 100%; height: auto; }
@media (min-width: 1200px) { .hero-area img { height: 630px; object-fit: cover; } }

/**************************************
						コ ン テ ン ツ
**************************************/
.about { font-size: 1.4rem; line-height: 1.6; }
.about img { width: 100%; height: auto; }

.movie { background: url("../img/bg.jpg"), rgba(0, 0, 0, 0.85); background-position: center; background-size: cover; background-repeat: no-repeat; background-blend-mode: multiply; font-size: 0; }
.movie .youtube { aspect-ratio: 16 / 9; }
.movie .youtube iframe { width: 100%; height: 100%; }
@media (min-width: 992px) { .movie { background-attachment: fixed; } }

.detaile { font-size: 0; }
.detaile h2 { font-family: "Times New Roman", "Noto Serif JP", "游明朝", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif; font-weight: 700; font-size: 3.25rem; position: relative; padding-left: 0.5em; line-height: 1; }
.detaile h2::before { position: absolute; top: 0; left: 0; width: 0.2em; height: 100%; content: ""; display: block; background-color: #C09F41; }
@media (min-width: 992px) { .detaile h2 { font-size: 6.0rem; } }
.detaile img { width: 100%; height: auto; }
.detaile .tbn { display: flex; flex-wrap: wrap; justify-content: space-between; }
.detaile .tbn li { width: calc(50% - 0.75rem); }
@media (min-width: 992px) { .detaile .tbn li { width: calc((100% / 6) - 0.75rem); } }

.spec { background: url("../img/gallery/02.jpg"), rgba(0, 0, 0, 0.85); background-position: center; background-size: cover; background-repeat: no-repeat; background-blend-mode: multiply; font-size: 0; }
.spec h3 { font-size: 3.2rem; font-weight: 700; text-align: center; font-family: "Times New Roman", "Noto Serif JP", "游明朝", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.spec .specsheet { display: flex; flex-wrap: wrap; width: 100%; }
.spec .specsheet li:nth-child(even) { width: 50%; }
.spec .specsheet li:nth-child(odd) { width: 50%; color: #C09F41; }
.spec .specsheet li { font-size: 1.6rem; display: flex; align-items: center; border-bottom: dashed 1px #D1D2D4; font-weight: 700; }
@media (min-width: 992px) { .spec { background-attachment: fixed; } }

/**************************************
						フ ッ タ ー
**************************************/
.shop { background: #000000; color: #FFFFFF; }
.shop img { width: 100%; height: auto; }
.shop a, .shop a:visited { color: #FFFFFF; transition: .4s; }
.shop a:hover { color: #C09F41; }
.shop .shopinfo { display: flex; flex-direction: column; align-items: center; }
.shop .shopinfo img { max-width: 55vw; height: auto; }
.shop .shopinfo h4 { font-size: 1.6rem; font-weight: 700; text-align: center; }
.shop .shopinfo p { font-size: 1.6rem; border-bottom: dashed 1px #333; width: 100%; color: #FFFFFF; }
.shop .shopinfo p span { font-size: 2.0rem; font-weight: 700; color: #FFFFFF; }
@media (min-width: 992px) { .shop .shopinfo img { max-width: 250px; height: auto; }
  .shop .shopinfo h4 { font-size: 1.6rem; }
  .shop .shopinfo p { font-size: 1.6rem; }
  .shop .shopinfo p span { font-size: 2.0rem; } }
.shop .mapimg img { max-width: 800px; height: auto; }
.shop .copyright { font-size: 1.2rem; text-align: center; color: #D1D2D4; }
