@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200..900&display=swap');

@font-face {
  font-family: 'chalkboard';
  src: url('../font/font_chalkboard.woff2') format('woff2');
}

:root {
  --black: #1D1D1D;
  --base: #f1f1f1;
}

/* ======================================================================================

    reset

====================================================================================== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure, article, section { margin: 0; padding: 0; border: 0; outline: 0; box-sizing: border-box;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }

img{vertical-align:middle; width:100%; height:auto;}


body{
position: relative;
font-size:16px;
line-height: 180%;
color: var(--black);
font-family: 'Noto Sans JP', "sans-serif";
font-weight: 400;
letter-spacing: 30%;
background: var(--base);
}


@media only screen and (max-width:840px) {
body{
font-size:12px;
line-height: 200%;
letter-spacing: 20%;
}
}

html,body{height: 100%;}

a{color: var(--black);}
a:hover{opacity: .8;}

a,a img,a:hover img,li,li:hover,a::after,a:hover::after,a::before,a:hover::before,input,input:hover,.trigger,.trigger:hover,i{-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}

p{margin-bottom:30px; padding:0;}

p:last-of-type {margin-bottom: 0;}



h1,h2,h3,h4,h5{font-weight:normal; margin:0; padding:0; position: relative; width: 100%;}

td,li,dt,dd{position: relative;}


.Heading1{font-family: 'Noto Sans JP', "sans-serif"; font-weight: 600; font-size: 32px; line-height: 160%; letter-spacing: 30%; margin-bottom: 80px;}
.Heading2{font-weight: 600; font-size: 24px; line-height: 34px; letter-spacing: 30%; margin-bottom: 60px;}

.Heading1 .SubHeading1{font-size: 14px; line-height: 100%; letter-spacing: 20%;}

.Bt1{background: #1B2D21; border-radius: 500px; color: #fff; font-size: 16px; letter-spacing: 10%; text-decoration: none; width: 300px; display: inline-block; display: flex; align-items: center; justify-content: center;}

@media only screen and (max-width:840px) {
.Heading1{font-size: 18px; margin-bottom: 60px;}
.Heading2{font-weight: 400; font-size: 16px; line-height: 140%; letter-spacing: 20%; margin-bottom: 40px;}
.Bt1{font-size: 14px; line-height: 32px; padding: 5px; min-width: 250px;}
}

.Overflow{overflow: hidden;}

/* --- フェードイン基本設定 --- */
.fade-el {opacity: 0; transition-property: opacity, transform; transition-timing-function: ease-out; will-change: opacity, transform;}
.fade-el.is-visible {opacity: 1 !important; transform: translate(0, 0) !important;}

/* 背景固定 */
.BgFix {position: relative; width: 100%; height: auto; overflow: hidden; clip-path: inset(0);}
.BgFix::before {content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100svh; background-size: cover; background-position: center; background-repeat: no-repeat; z-index: -1; will-change: transform; transform: translateZ(0);}

/* パララクスセクション */
.parallax-section {position: relative;}
.parallax-item {position: absolute; will-change: transform; transition: transform 0.1s ease-out;}

.Inner{margin:0 auto; position:relative; max-width:1370px; padding-left:40px; padding-right:40px;}

div.ReservBt{display: none;}

@media only screen and (max-width:840px) {
.Inner{padding-left:24px; padding-right:24px;}

div.ReservBt{position: fixed; left: 0; bottom: 0; z-index: 10; display: block; width: 100%;}
div.ReservBt a{background: #1D1D1D; width: 100%; height: 63px; display: flex; align-items: center; justify-content: center; text-decoration: none; color: #fff;}
div.ReservBt a:hover{opacity: 1; background: #323232;}
}




header.Header{background: #fff; position: fixed; top: 0; left: 0; width: 100%; z-index: 5;}
header.Header .Inner{display: flex; align-items: center; min-height: 80px; position: relative;}
header.Header .LogoArea{width: 111px;}
header.Header .Inner nav{flex: 1; display: flex; justify-content: flex-end;}
header.Header ul{display: flex; align-items: center; justify-content: flex-end; grid-gap: 25px;}
header.Header ul a{font-family: "new-spirit", 'Noto Serif JP', "sans-serif"; font-weight: 600; font-size: 16px; letter-spacing: 5%; line-height: 100%; text-decoration: none;}
header.Header ul img.Insta{width: 16px;}


@media only screen and (max-width:840px) {
header.Header .LogoArea{width: 90px;}
header.Header .Inner{min-height: 50px;}
header.Header .Inner nav{display: none;}
}

.hamburger {display: none; width: 21px; height: 10.5px; position: relative; background: none; border: none; cursor: pointer; z-index: 200; position: fixed; right: 40px; top: 20px;}
.hamburger span {display: block; position: absolute; width: 100%; height: 1.5px; background: #333; transition: 0.3s;}
.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 4.5px; }
.hamburger span:nth-child(3) { bottom: 0; }

.hamburger.active span:nth-child(1) { transform: translateY(4.5px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: translateY(-4.5px) rotate(-45deg); }

.sp-nav {position: fixed; top: 0; right: -100%; width: 80%; height: 100vh; background: var(--base); transition: all 0.4s ease; z-index: 150; padding: 40px 20px; box-sizing: border-box; overflow-y: auto;}
.sp-nav.open {right: 0;}

.sp-nav ul li a {display: block; padding: 15px; text-decoration: none; text-align: center; font-family: "new-spirit", 'Noto Serif JP', "sans-serif"; font-weight: 600; font-size: 16px; letter-spacing: 5%; line-height: 100%;}
.sp-nav ul li a .Insta{width: 40px;}
.overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0,0,0,0.5); display: none; z-index: 140;}
.overlay.show { display: block; }

@media screen and (max-width: 840px) {
.hamburger { display: block; }
}

section.MainVisual{height: 100%; position: relative;}
section.MainVisual::before {background-image: url("../img/mainvisual.webp");}
section.MainVisual .LogoArea{max-width: 374px; position: relative; z-index: 1; padding-top: 80px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
section.MainVisual .Bt1{position: absolute; left: 50%; bottom: 50px; transform: translate(-50%,0); background: #fff; color: #1D1D1D; width: 200px; height: 50px;}
section.MainVisual .Bt1:hover{background: #E8E8E8; opacity: 1;}
@media screen and (max-width: 840px) {
section.MainVisual{height: 100vw;}
section.MainVisual .LogoArea{padding-top: 50px;}
section.MainVisual .Bt1{display: none;}
}

.LineBreak{display: block; margin-bottom: 30px;}

section.Visual1{position: relative; z-index: 0; aspect-ratio: 15 / 8; width: 100%;}
section.Visual1::before {background-image: url("../img/visual1.webp");}

section.About{position: relative;}
section.About .Inner{padding-top: 111px; padding-bottom: 80px;}
section.About .Heading1{margin-bottom: 0px;}

section.About .Aboutphoto1{margin-bottom: 110px; width: 100%; aspect-ratio: 2.4 / 1;}
section.About .Aboutphoto1 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px;}

section.About2{position: relative;}
section.About2 .Inner{padding-top: 0px; padding-bottom: 0px; min-height: 1100px;}
section.About2 .TxtArea{max-width: 40%;}
section.About2 .Aboutphoto2{position: absolute; right: 0; top: 0; width: 40%; aspect-ratio: 627 / 765;}
section.About2 .Aboutphoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px 0 0 32px;}
section.About2 .Aboutphoto3{position: absolute; left: 20%; bottom: 0; max-width: 554px; aspect-ratio: 1 / 1;}
section.About2 .Aboutphoto3 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px;}

section.About2 .Bt1{width: 240px; height: 60px; background: #fff; border: #1D1D1D solid 1px; color: #1D1D1D; margin-top: 35px; font-size: 14px;}
.MbType1{margin-bottom: 50px;}

@media only screen and (max-width:1020px) {
section.About2 .Inner{min-height: 1200px;}
}

@media only screen and (max-width:840px) {
section.About .Inner{padding-top: 40px; padding-bottom: 24px;}
section.About .Aboutphoto1{margin-bottom: 40px; aspect-ratio: 17 / 10;}
section.About .Aboutphoto1 img{border-radius: 16px;}
section.About2 .Inner{min-height: 500px;}
section.About2 .TxtArea{max-width: 100%;}
section.About2 .Aboutphoto2{position: relative; width: 75.6%; aspect-ratio: 295 / 360; margin-left: auto; margin-bottom: 40px;}
section.About2 .Aboutphoto2 img{border-radius: 16px 0 0 16px;}
section.About2 .Aboutphoto3{position: relative; width: 69.4%; aspect-ratio: 1 / 1; margin-right: auto;  left: 25px;}
section.About2 .Aboutphoto3 img{border-radius: 16px;}

section.About2 {font-size: 14px;}
.MbType1{margin-bottom: 50px;}
}

section.Morning{position: relative;}
section.Morning .Inner{padding: 180px 0 0 0; width: 85%; margin-right: 0;}
section.Morning .Heading1{text-align: center; position: relative;}
section.Morning .Heading1::after{content: ""; position: absolute; left: 50%; top: -20px; transform: translate(-50%,0); background: url("img/icon_day.svg") no-repeat; background-size: 140px; width: 140px; height: 10px;}

section.Morning .MorningPhoto1{aspect-ratio: 1291 / 558; position: relative; margin-bottom: 308px;}
section.Morning .MorningPhoto1 img.Bg{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px 0 0 32px;}
section.Morning .MorningPhoto1 img.Icon{position: absolute; left: 0; top: 0; transform: translate(-50%,-50%); width: 258px;}

section.Morning .MorningPhoto2{aspect-ratio: 63 / 46; position: absolute; right: 7%; top: 60%; width: 41%;}
section.Morning .MorningPhoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px;}

section.Morning .TxtArea{max-width: 408px; padding-bottom: 73px;}
section.Morning .Heading2{margin-bottom: 80px;}

section.Morning .Bg1{background: #fff; border-radius: 32px; position: absolute; bottom: 0; width: 73%; height: 65%; z-index: -1;}

@media only screen and (min-width:841px) {
section.Morning .Bg1{left: 0;}
}

section.Morning .memo{font-size: 13px; font-weight: 100;}

@media only screen and (max-width:1010px) {
section.Morning .MorningPhoto1{margin-bottom: 150px;}
section.Morning .MorningPhoto2{top: 55%;}
}

@media only screen and (max-width:840px) {
section.Morning .Inner{padding: 80px 0 0 0;}
section.Morning .MorningPhoto1 img.Icon{width: 158px;}
section.Morning .MorningPhoto1{margin-bottom: 300px; aspect-ratio: 316 / 224;}
section.Morning .MorningPhoto1 img.Bg{border-radius: 16px 0 0 16px;}
section.Morning .MorningPhoto2{top: 54%;}
section.Morning .MorningPhoto2 img{border-radius: 16px;}
section.Morning .Heading2{font-weight: 700; font-size: 24px; line-height: 180%; letter-spacing: 20%; margin-bottom: 32px;}
section.Morning .memo{font-size: 11px; font-weight: 100;}

section.Morning .Bg1{border-radius: 16px 0 0 16px; right: 0; width: 95%; height: 75%;}
}


@media only screen and (max-width:500px) {
section.Morning .MorningPhoto1 img.Icon{width: 100px;}
section.Morning .MorningPhoto1{margin-bottom: 270px;}
section.Morning .MorningPhoto2{top: 41%; width: 200px;}

}

section.Lunch{position: relative;}
section.Lunch .Inner{padding: 205px 0 0 0; width: 85%; margin-left: 0; margin-bottom: 80px;}
section.Lunch .Inner2{padding: 0; width: 85%; margin-right: 0; margin-left: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
section.Lunch .Heading2{font-size: 32px; line-height: 180%; letter-spacing: 30%; margin-bottom: 40px;}
section.Lunch .LunchPhoto1{aspect-ratio: 1291 / 558; position: relative;}
section.Lunch .LunchPhoto1 img.Bg{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 0 32px 32px 0;}
section.Lunch .LunchPhoto1 img.Icon{position: absolute; right: 0; top: 0; transform: translate(50%,-50%); width: 258px;}
section.Lunch .LunchPhoto2{aspect-ratio: 663 / 800; width: 51%; margin-top: 116px;}
section.Lunch .LunchPhoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px;}
section.Lunch .TxtArea{max-width: 408px; margin-right: 7%;}
section.Lunch .Menu{margin-top: 155px;}
section.Lunch .Bg1{width: 100%; height: 42%; background: #fff; position: absolute; left: 0; top: 30%; width: 100%; z-index: -1;}
section.Lunch .memo{font-size: 13px; font-weight: 100; letter-spacing: 0;}
@media only screen and (max-width:1200px) {
section.Lunch .LunchPhoto2{width: 41%;  margin-top: 0px;}
section.Lunch .Bg1{height: 47%;}
}


@media only screen and (max-width:980px) {
section.Lunch .Inner{margin-bottom: 24px;}
section.Lunch .Inner2{width: 86%; margin-right: auto; margin-left: auto;}
section.Lunch .LunchPhoto1{aspect-ratio: 316 / 224;}
section.Lunch .LunchPhoto1 img.Icon{width: 158px;}
section.Lunch .LunchPhoto1 img.Bg{border-radius: 0 16px 16px 0;}
section.Lunch .LunchPhoto2{aspect-ratio: 200 / 241; width: 51%; margin-bottom: 40px;}
section.Lunch .LunchPhoto2 img{border-radius: 16px;}
section.Lunch .TxtArea{max-width: 100%; margin-right: 15%;}
section.Lunch .Menu{margin-top: 100px; margin-right: 0%;}
section.Lunch .Heading2{font-size: 24px; font-weight: 700; letter-spacing: 20%; margin-bottom: 32px;}
section.Lunch .Bg1{aspect-ratio: 1512 / 758; background: #fff; position: absolute; left: 0; top: 30%; width: 100%; z-index: -1;}
section.Lunch .Bg1{width: 95%; height: 55%; left: 0; top: 20%; z-index: -1; border-radius: 0 16px 16px 0;}
section.Lunch .memo{font-size: 11px;}
}

@media only screen and (max-width:500px) {
section.Lunch .Inner{padding: 105px 0 0 0;}
section.Lunch .LunchPhoto1 img.Icon{width: 100px;}
}

section.Dinner{position: relative;}
section.Dinner .Inner{padding: 180px 0 0 0; width: 85%; margin-right: 0; position: relative;}

section.Dinner .DinnerPhoto1{aspect-ratio: 1291 / 558; position: relative; margin-bottom: 100px;}
section.Dinner .DinnerPhoto1 img.Bg{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px 0 0 32px;}
section.Dinner .DinnerPhoto1 img.Icon{position: absolute; left: 0; top: 0; transform: translate(-50%,-50%); width: 258px;}

section.Dinner .DinnerBox1{display: flex; flex-wrap: wrap; justify-content: space-between;}

section.Dinner .DinnerPhoto2{aspect-ratio: 740 / 406; width: 57%;}
section.Dinner .DinnerPhoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px 0 0 32px;}

section.Dinner .TxtArea{max-width: 500px; padding-bottom: 73px;}
section.Dinner .TxtArea p{margin-bottom: 50px; max-width: 408px;}
section.Dinner .TxtArea p.memo{margin-bottom: 0;}
section.Dinner .Heading2{margin-bottom: 40px; font-weight: 700; font-size: 32px; line-height: 180%; letter-spacing: 30%;}

section.Dinner .Bg1{background: #fff; border-radius: 32px; position: absolute; right: 0; top: 24%; width: 70.5%; height: 27.5%; z-index: -1;}

section.Dinner ul.MenuList{padding: 100px 20px 40px 20px; width: 100%; display: flex; flex-wrap: wrap; justify-content: center; grid-gap: 34px;}
section.Dinner ul.MenuList li{max-width: 408px; padding: 20px; border-radius: 32px; background: #fff;}
section.Dinner ul.MenuList img{border-radius: 32px; margin-bottom: 27px;}
section.Dinner ul.MenuList p{font-size: 13px; font-weight: 400px; line-height: 200%; letter-spacing: 10%;}
section.Dinner ul.MenuList p.MenuTitle{font-size: 24px; font-weight: 500px; line-height: 160%; letter-spacing: 0%; margin-bottom: 7px;}
section.Dinner ul.MenuList p.Price{font-size: 14px; font-weight: 400px; line-height: 180%; letter-spacing: 10%;}

@media only screen and (min-width:1251px) {
section.Dinner .DinnerPhoto2sp{display: none;}
}

@media only screen and (max-width:1250px) {
section.Dinner .DinnerPhoto2sp{aspect-ratio: 224 / 146; width: 65%; margin-left: auto; margin-bottom: 40px; margin-right: 0;}
section.Dinner .DinnerPhoto2sp img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 16px 0 0 16px;}
section.Dinner .DinnerPhoto2{display: none;}
section.Dinner .TxtArea{max-width: 100%; padding-bottom: 60px;}

section.Dinner .Heading2{font-weight: 700; font-size: 24px; line-height: 180%; letter-spacing: 11%;}
section.Dinner .TxtArea p.memo{font-weight: 700;}
section.Dinner .Bg1{top: 24%; width: 70.5%; height: 17.5%;}
}

@media only screen and (max-width:840px) {
section.Dinner .Inner{padding: 120px 0 0 0;}
section.Dinner .DinnerPhoto1{aspect-ratio: 316 / 224; position: relative; margin-bottom: 50px;}
section.Dinner .DinnerPhoto1 img.Bg{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 16px 0 0 16px;}
section.Dinner .TxtArea{padding-bottom: 0px;}
section.Dinner .TxtArea p{margin-bottom: 24px; padding-right: 30px;}
section.Dinner .DinnerPhoto1 img.Icon{width: 158px;}
section.Dinner ul.MenuList{padding-top: 40px; grid-gap: 16px;}
section.Dinner ul.MenuList li{padding: 24px; border-radius: 16px;}
section.Dinner ul.MenuList img{border-radius: 16px; margin-bottom: 16px;}
section.Dinner ul.MenuList p{font-size: 12px; font-weight: 500px; line-height: 160%; letter-spacing: 0;}
section.Dinner ul.MenuList p.MenuTitle{font-size: 16px; font-weight: 700px; line-height: 180%; letter-spacing: 10%; margin-bottom: 0px;}
section.Dinner ul.MenuList p.Price{font-weight: 500px;}
section.Dinner .Bg1{border-radius: 16px 0 0 16px; top: 13%; width: 95%; height: 21%;}
}

@media only screen and (max-width:500px) {
section.Dinner .DinnerPhoto1 img.Icon{width: 100px;}
}

section.ReservArea{background: #222; padding: 60px 20px 80px 20px; text-align: center;}
section.ReservArea h2{font-family: 'chalkboard'; color: #fff; font-weight: 400; font-size: 14px; line-height: 100%; letter-spacing: 20%; margin-bottom: 25px;}
section.ReservArea .Bt1{font-weight: 700; font-size: 18px; letter-spacing: 10%; color: #373737; width: 340px; height: 70px; background: #fff; margin: 0 auto 20px;}
section.ReservArea .TxtArea{max-width: 446px; margin: 0 auto; font-size: 12px; text-align: left; color: #999999;}

@media only screen and (max-width:840px) {
section.ReservArea{display: none;}
}

section.Bar{position: relative; padding-bottom: 200px;}
section.Bar .Inner{display: flex; flex-wrap: wrap; justify-content: space-between;}
section.Bar .Inner2{padding: 164px 0 0 0; width: 85%; margin-left: 0; margin-right: auto;}
section.Bar .Inner3{padding: 0px 0 0 0; width: 85%; margin-right: 0; margin-left: auto;}

section.Bar .BarPhoto1{aspect-ratio: 1291 / 558; position: relative; margin-bottom: 40px;}
section.Bar .BarPhoto1 img.Bg{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 0 32px 32px 0;}
section.Bar .BarPhoto1 img.Icon{position: absolute; right: 0; top: 0; transform: translate(50%,-50%); width: 258px;}

section.Bar .BarPhoto2{aspect-ratio: 1291 / 558; position: relative; margin-bottom: 80px;}
section.Bar .BarPhoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px 0 0 32px;}

section.Bar .TxtArea{max-width: 518px;}
section.Bar .BarPhoto3Area{max-width: 519px; font-size: 14px;}
section.Bar .BarPhoto3{aspect-ratio: 26 / 20; position: relative; margin-bottom: 40px;}
section.Bar .BarPhoto3 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 32px;}

section.Bar .Bg1{width: 100%; height: 27.5%; position: absolute; top: 50%; left: 0; background: #fff; z-index: -1;}

section.Bar .Heading1{margin-bottom: 40px;}
section.Bar p.memo{max-width: 448px; font-size: 12px; line-height: 150%;}

@media only screen and (min-width:1131px) {
section.Bar .BarPhoto3AreaSp{display: none;}
}

@media only screen and (max-width:1130px) {
section.Bar .BarPhoto3Area{display: none;}
section.Bar .TxtArea{max-width: 100%; padding-bottom: 60px; padding-right: 10%;}

section.Bar .BarPhoto3AreaSp{width: 55%; margin-left: auto; font-size: 10px; margin-bottom: 40px;}

section.Bar .BarPhoto3{aspect-ratio: 26 / 20; position: relative; margin-bottom: 16px;}
section.Bar .Heading1{margin-bottom: 40px; font-size: 22px; font-weight: 700; line-height: 180%; letter-spacing: 10%;}
}



@media only screen and (max-width:840px) {
section.Bar{padding-bottom: 100px;}
section.Bar .BarPhoto1{aspect-ratio: 318 / 224; margin-bottom: 24px; border-radius: 0 16px 16px 0;}
section.Bar .BarPhoto1 img.Icon{width: 158px;}

section.Bar .BarPhoto2{aspect-ratio: 318 / 224; margin-bottom: 30px;}
section.Bar .BarPhoto2 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 16px 0 0 16px;}
section.Bar .BarPhoto3 img{width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 16px;}

section.Bar .Bg1{width: calc(100% - 24px); height: 69%; top: 18%; border-radius: 0 16px 16px 0;}
section.Bar .TxtArea{padding-bottom: 0px; padding-right: 0%;}
section.Bar .TxtArea .BarTxt{padding-right: 10%; margin-bottom: 75px;}
section.Bar p.memo{font-size: 10px;}
}

@media only screen and (max-width:500px) {
section.Bar .BarPhoto1 img.Icon{width: 100px;}
}




iframe[src*="google.com/maps"] {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
	width: 630px; height: 300px;
}

@media only screen and (max-width:840px) {
iframe[src*="google.com/maps"] {
	width: 100%; height: 250px;
}
}


section.News{padding-top: 200px; margin-bottom: 400px;}
section.News .heading1,
section.NewsArchive .heading1,
section.NewsSingle .heading1{font-size: 36px; font-weight: 500; line-height: 45.11px; letter-spacing: 0.1em; text-align: center; margin-bottom: 100px;}
section.News .heading1 span.Sub,
section.NewsArchive .heading1 span.Sub,
section.NewsSingle .heading1 span.Sub{font-size: 14px; font-weight: 600; line-height: 20.12px; letter-spacing: 0.2em; margin-left: 20px;}
section.News ul{margin-bottom: 100px;}
section.News ul li{margin-bottom: 50px;}
section.News ul li:last-child{margin-bottom: 0px;}
section.News ul li a{text-decoration: none; display: block; position: relative;}
section.News ul li .Day{font-size: 12px; position: absolute; bottom: 0; left: 0; display: inline-block;}
section.News ul li .ViewMore{font-size: 12px; position: absolute; bottom: 0; right: 0; display: inline-block;}
section.News ul li .NewsTitle{font-size: 16px; font-weight: 600; line-height: 22.99px; letter-spacing: 0.2em; padding: 0 100px 0 120px;}

@media only screen and (max-width:840px) {
section.News{padding-top: 50px; margin-bottom: 200px;}
section.News .heading1,
section.NewsArchive .heading1,
section.NewsSingle .heading1{font-size: 24px; margin-bottom: 50px; text-align: center; padding-left: 20px;}
section.News .heading1 span.Sub,
section.NewsArchive .heading1 span.Sub,
section.NewsSingle .heading1 span.Sub{font-size: 12px; margin-left: 20px;}
section.NewsArchive .heading1 span.Sub,
section.NewsSingle .heading1 span.Sub{display: block;}
section.News ul{margin-bottom: 80px;}
section.News ul li{margin-bottom: 30px;}
section.News ul li .Day{font-size: 12px; position: relative; display: block;}
section.News ul li .ViewMore{display: none;}
section.News ul li .NewsTitle{font-size: 14px; font-weight: 600; line-height: 20.12px; letter-spacing: 0.2em; text-align: left; padding: 0 0px 0 0px;}
}

section.NewsArchive .Inner{padding-top: 200px; padding-bottom: 200px; max-width: 1000px;}
section.NewsArchive ul li{margin-bottom: 50px;}
section.NewsArchive ul li:last-child{margin-bottom: 0px;}
section.NewsArchive ul li a{text-decoration: none; display: block; position: relative;}
section.NewsArchive ul li .Day{font-size: 12px; font-weight: 600; line-height: 17.24px; letter-spacing: 0.2em; position: absolute; bottom: 0; left: 0;}
section.NewsArchive ul li .NewsTitle{font-size: 16px; font-weight: 600; line-height: 22.99px; letter-spacing: 0.2em; padding-left: 200px}

@media only screen and (max-width:840px) {
section.NewsArchive ul li{margin-bottom: 30px;}
section.NewsArchive ul li .Day{font-size: 11px; font-weight: 600; line-height: 15.81px; letter-spacing: 0.05em; position: relative;}
section.NewsArchive ul li .NewsTitle{font-size: 14px; font-weight: 600; line-height: 20.12px; letter-spacing: 0.2em; padding-left: 0px;}
}

.Footer{padding-top: 120px; padding-bottom: 74px; background: #222; color: #fff;}
.Footer .LogoArea{width: 148px; margin: 0 auto 34px;}
.Footer ul{display: flex; flex-wrap: wrap; justify-content: center; grid-gap: 25px; margin-bottom: 39px;}
.Footer ul a{font-family: "new-spirit", "sans-serif"; font-size: 16px; letter-spacing: 5%; text-decoration: none; color: #fff;}
.Footer .Copy{font-size: 10px; text-align: center; letter-spacing: 10%;}

@media only screen and (max-width:840px) {
.Footer{padding-top: 67px; padding-bottom: 60px;}
.Footer .LogoArea{width: 148px; margin: 0 auto 30px;}
.Footer ul{margin-bottom: 30px;}
.Footer ul .Insta{width: 24px;}
}

/* == News 投稿 == */

section.OtherPage .Inner{padding-top: 220px; padding-bottom: 200px; max-width: 850px;}
section.OtherPage .heading1{margin-bottom: 100px;}

section.OtherPage span.Day{font-size: 12px; font-weight: 600; line-height: 17.24px; letter-spacing: 0.2em; display: block; margin-bottom: 50px;}
section.OtherPage .entry-title{font-size: 26px; font-weight: 500; line-height: 150%; letter-spacing: 20%;}

section.OtherPage .page-content{font-size: 14px; font-weight: 400; line-height: 150%; letter-spacing: 20%;}

body.single .page-content h1{font-size: 26px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content h2{font-size: 20px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content h3{font-size: 16px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content h4{font-size: 14px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content h5{font-size: 12px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content h6{font-size: 11px; font-weight: 600; letter-spacing: 0.1em;}
body.single .page-content ul{margin-bottom: 50px;}
body.single .page-content li{padding: 2px 5px 2px 10px; position: relative; border-left: var(--black) solid 2px; border-radius: 5px; margin-bottom: 15px;}
body.single .page-content li:last-child{margin-bottom: 0px;}
body.single .page-content blockquote.wp-block-quote{padding: 30px; margin-bottom: 50px;}
body.single .page-content blockquote.wp-block-quote cite{font-size: 80%;}
body.single .page-content figure.wp-block-image{margin-bottom: 50px;}
body.single .page-content figcaption{text-align: center; font-size: 80%; color: #666;}
body.single .page-content table{width: 100%; border-collapse:collapse; line-height: 1.5;}
body.single .page-content th{border: #00281A solid 1px; padding: 10px; font-weight: normal;}
body.single .page-content td{border: #00281A solid 1px; padding: 10px;}
body.single .page-content .has-text-align-center{text-align: center;}
body.single .page-content .has-text-align-right{text-align: right;}
body.single .page-content a{text-decoration: underline;}
body.single .page-content a:link,
body.single .page-content a:visited{color: #00281A}
body.single .page-content a:hover{opacity: .8}
body.single .page-content a.bt01{text-decoration: none;}


.entry-meta .screen-reader-text,
.entry-meta time.entry-date,
.entry-meta time.updated,
.entry-meta .byline{display: none;}

.post-thumbnail{max-width: 300px;}
.entry-header span.day{font-size: .8rem; color: #666; padding-left: 10px; margin-bottom: 10px;}

nav.navigation h2.screen-reader-text,
nav.navigation .nav-subtitle{display: none;}
nav.post-navigation .nav-links{display: flex; flex-wrap: wrap; justify-content: space-between; font-size: .8rem;}
.nav-previous a,
.nav-next a{padding: 5px 30px; position: relative; color: #00281A; text-decoration: none; border-top: #00281A solid 1px;}

.nav-previous a::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:3px solid transparent;
    border-right-color: #00281A;
	bottom: 0;
	top: 50%;
	left: 5px;
	transform: translate(0,-50%);
	z-index:1;}
.nav-previous a:hover::after{left: 3px;}

.nav-next a::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:3px solid transparent;
    border-left-color: #00281A;
	bottom: 0;
	top: 50%;
	right: 5px;
	transform: translate(0,-50%);
	z-index:1;}
.nav-next a:hover::after{right: 3px;}

.nav-links svg{display: none;}
.nav-links{width: 100%; position: relative; display: flex; flex-wrap: wrap; justify-content: center; font-size: .8rem;}
.nav-links span.page-numbers{color: #666;}
.nav-links a.prev,
.nav-links a.next{position: absolute; top:0; margin: 0; padding: 5px 30px; border-top: #00281A dotted 1px; color: #00281A; text-decoration: none;}
.nav-links a.prev{left: 0;}
.nav-links a.prev::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:3px solid transparent;
    border-right-color: #00281A;
	bottom: 0;
	top: 50%;
	left: 5px;
	transform: translate(0,-50%);
	z-index:1;}
.nav-links a.prev:hover::after{left: 3px;}
.nav-links a.next{right: 0;}
.nav-links a.next::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:3px solid transparent;
    border-left-color: #00281A;
	bottom: 0;
	top: 50%;
	right: 5px;
	transform: translate(0,-50%);
	z-index:1;}
.nav-links a.next:hover::after{right: 3px;}

.nav-links .meta-nav{display: none;}
.nav-links .page-numbers{padding: 0 10px;}

.page-content{padding: 100px 0;}

.page-content .wp-block-heading{margin-bottom: 50px;}

.back-to-top{text-align: center; margin-top: 40px;}
.back-to-top .Bt1{padding: 0px 20px; font-size: 12px; line-height: 3; min-width: 200px;}

@media only screen and (max-width:840px) {
section.OtherPage .entry-title{font-size: 18px;}
.page-content{padding: 50px 0;}
.page-content h1{font-size: 18px; font-weight: 600; letter-spacing: 0.1em;}
.page-content h2{font-size: 16px; font-weight: 600; letter-spacing: 0.1em;}
.page-content h3{font-size: 14px; font-weight: 600; letter-spacing: 0.1em;}
.page-content h4{font-size: 12px; font-weight: 600; letter-spacing: 0.1em;}
.page-content h5{font-size: 11px; font-weight: 600; letter-spacing: 0.1em;}
}




/* == form == */

input[type="text"],
input[type="tel"],
input[type="email"],
select,
textarea{margin:0; padding:20px; width:100%; background:#fff; box-sizing: border-box; border: 0;}

.textarea_h{min-height:200px; margin-bottom: 20px;}

.bt_submit{background:#000; color:#FFF; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: -0.011em; text-align: center; border: 0; padding: 15px 100px; border-radius: 10px;}
.bt_submit:hover{opacity: .8}

.formtitle{position:relative; padding:0 0 0 10px; font-size: 1.2rem; margin-bottom: 5px;}
.formtitle::after{position: absolute; z-index: 2; content: ''; border: 1px solid #d20000; border-radius: 100%; top:.7em; left:0em; width:5px; height:5px;}
.formtitle span{background:rgba(200, 80, 0, 1); color:#fff; padding:2px 4px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; font-size:50%; margin-left:10px;}



/* ======================================================================================

    other

====================================================================================== */


@media only screen and (min-width:841px) {
	
.pc{display:block;}
.sp{display:none;}

.PcBlock{display:block;}


.res10{width:10%;}
.res11{width:11%;}
.res12{width:12%;}
.res13{width:13%;}
.res14{width:14%;}
.res15{width:15%;}
.res16{width:16%;}
.res17{width:17%;}
.res18{width:18%;}
.res19{width:19%;}
.res20{width:20%;}
.res21{width:21%;}
.res22{width:22%;}
.res23{width:23%;}
.res24{width:24%;}
.res25{width:25%;}
.res26{width:26%;}
.res27{width:27%;}
.res28{width:28%;}
.res29{width:29%;}
.res30{width:30%;}
.res31{width:31%;}
.res32{width:32%;}
.res33{width:33%;}
.res34{width:34%;}
.res35{width:35%;}
.res36{width:36%;}
.res37{width:37%;}
.res38{width:38%;}
.res39{width:39%;}
.res40{width:40%;}
.res41{width:41%;}
.res42{width:42%;}
.res43{width:43%;}
.res44{width:44%;}
.res45{width:45%;}
.res46{width:46%;}
.res47{width:47%;}
.res48{width:48%;}
.res49{width:49%;}
.res50{width:50%;}
.res51{width:51%;}
.res52{width:52%;}
.res53{width:53%;}
.res54{width:54%;}
.res55{width:55%;}
.res56{width:56%;}
.res57{width:57%;}
.res58{width:58%;}
.res59{width:59%;}
.res60{width:60%;}
.res61{width:61%;}
.res62{width:62%;}
.res63{width:63%;}
.res65{width:65%;}
.res66{width:66%;}
.res67{width:67%;}
.res68{width:68%;}
.res69{width:69%;}
.res70{width:70%;}
.res71{width:71%;}
.res72{width:72%;}
.res73{width:73%;}
.res74{width:74%;}
.res75{width:75%;}
.res76{width:76%;}
.res77{width:77%;}
.res78{width:78%;}
.res79{width:79%;}
.res80{width:80%;}
.res81{width:81%;}
.res82{width:82%;}
.res83{width:83%;}
.res84{width:84%;}
.res85{width:85%;}
.res86{width:86%;}
.res87{width:87%;}
.res88{width:88%;}
.res89{width:89%;}
.res90{width:90%;}
}



@media only screen and (max-width:840px) {
	
.pc{display:none;}
.sp{display:block;}

.SpBlock{display:block;}
.PcBlock{display:inline-block;}

.SpNone{display:none;}

.res10,.res11,.res12,.res13,.res14,.res15,.res16,.res17,.res18,.res19,.res20,.res21,.res22,.res23,.res24,.res25,.res26,.res27,.res28,.res29,.res30,.res31,.res32,.res33,.res34,.res35,.res36,.res37,.res38,.res39,.res40,.res41,.res42,.res43,.res44,.res45,.res46,.res47,.res48,.res49,.res50,.res51,.res52,.res53,.res54,.res55,.res56,.res57,.res58,.res59,.res60,.res61,.res62,.res63,.res64,.res65,.res66,.res67,.res68,.res69,.res70,.res71,.res72,.res73,.res74,.res75,.res76,.res77,.res78,.res79,.res80,.res81,.res82,.res83,.res84,.res85,.res86,.res87,.res88,.res89,.res90{width:100%; margin-bottom:10px;}

}



/*--------共通--------*/


.photo_l{float:left; margin:0 10px 10px 0;}
.photo_r{float:right; margin:0 0px 10px 10px;}

.box_l{float:left;}
.box_r{float:right;}
.box_c{margin:0 auto;}

.txt_r{text-align:right;}
.txt_l{text-align:left;}
.txt_c{text-align:center;}

.block{display:block;}
.overflow{overflow:hidden;}
.cl{clear:both;}

.img_b5 img{margin-bottom:5px;}
.img_b10 img{margin-bottom:10px;}

.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w60{width:60%;}
.w65{width:65%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}

.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}

.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}

.mtb5{margin:5px 0 !important;}
.mtb10{margin:10px 0 !important;}
.mtb15{margin:15px 0 !important;}
.mtb20{margin:20px 0 !important;}

.ptb5{padding:5px 0 !important;}
.ptb10{padding:10px 0 !important;}
.ptb15{padding:15px 0 !important;}
.ptb20{padding:20px 0 !important;}

.mr3{margin-right:3px !important;}
.mr4{margin-right:4px !important;}
.mr5{margin-right:5px !important;}
.mr6{margin-right:6px !important;}
.mr7{margin-right:7px !important;}
.mr8{margin-right:8px !important;}
.mr9{margin-right:9px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}

.f70per{font-size:70%}
.f80per{font-size:80%}
.f90per{font-size:90%}
.f110per{font-size:110%}
.f120per{font-size:120%}
.f130per{font-size:130%}
.f140per{font-size:140%}
.f150per{font-size:150%}
.f160per{font-size:160%}
.f170per{font-size:170%}
.f180per{font-size:180%}


.movie-wrap {position: relative; padding-bottom: 50%; padding-top: 30px; height: 0; overflow: hidden;}
.movie-wrap iframe {position: absolute; top: 0; left: 0; width:100%; height:100%;}

#page-top{position: fixed; bottom: 30px; right: 30px; z-index:20;}
#page-top{width: 50px; height: 50px; border: #fff solid 0px; border-radius: 500rem; opacity: .5; background: rgba(160,0,0,1)}
#page-top:hover{opacity: 1;}
#page-top::before{content: 'Back'; width: 100%; text-align: center; font-size: .7rem; color: #fff; position: absolute; left: 0; bottom: 5px; margin: auto;}
#page-top::after{
content: "";
position: absolute;
right: 0px;
left: 0px;
width: 0px;
height: 0px;
top: 7px;
margin: auto;
border-style: solid;
border-color: transparent transparent #fff transparent ;
border-width: 0px 6px 10px 6px;}
