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

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bungee+Inline&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New&display=swap');

:root {
  --Yellow: #F1E68A;
  --Green: #65AE7C;
  --Orange: #E1844C;
  --Black: #1F2937;
  --Gold: #D4B95E;
  
  --Mv_H: 816px;
  --Mv_W: 63px;
}

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

    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;}
@media only screen and (max-width:840px) {
.imgSP{padding-left: 15%; padding-right: 15%;}
}

html,body{height: 100%;}

body{
position: relative;
font-size:14px;
line-height: 200%;
color: #4B5563;
font-family: 'Noto Sans JP', sans-serif;
font-weight: 400;
line-height: 28px;
letter-spacing: 0px;
}

html {
scroll-behavior: smooth; /* スムーズにスクロールさせる */
}

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;}

a:link {text-decoration:none; color:#4B5563;}
a:visited {text-decoration:none; color:#4B5563;}
a:hover{opacity: .7}

a:hover img{opacity:0. 8; filter: alpha(opacity=80); -ms-filter: "alpha( opacity=80 )";}

p{margin:0; padding:0;}

h1,h2,h3,h4,h5{margin:0; padding:0; position: relative; width: 100%; line-height: 1;}

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

.Heading1{font-family: "Bungee Inline", sans-serif; font-size: 90px; letter-spacing: 0.75px;}


.Inner{max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 25px; padding-right: 25px;}

/* 共通：アニメーション前の基本状態 */
.fade-el {
    opacity: 0;
    transition: opacity 1s ease-out, transform 1s ease-out;
    will-change: opacity, transform;
}

/* 下から上に10px移動 */
.fade-up {
    transform: translateY(30px);
}

/* その場でフェードイン */
.fade-in {
    transform: translateY(0);
}

/* 左から右に10px移動 */
.fade-left {
    transform: translateX(-20px);
}

/* JavaScriptで付与する「表示状態」のクラス */
.is-visible {
    opacity: 1;
    transform: translate(0, 0); /* 位置を元に戻す */
}


.ReserveArea{text-align: center; margin-top: 40px;}
.ReserveArea .Bt01{padding: 10px 40px 10px 20px; display: inline-block; border-radius: 500px;}


header.Header{position: fixed; background: #fff; top: 0; left: 0; width: 100%; font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 500; font-size: 12px; line-height: 16px; letter-spacing: 1.2px; z-index: 5;}
header.Header .Inner{padding: 10px 20px; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; height: 64px;}
header.Header ul.nav_pc{display: flex; flex-wrap: nowrap; grid-gap: 30px;}
header.Header .HeaderLogo{max-width: 219px;}
header.Header ul.nav_pc li i{font-size: 150%;}
header.Header .BtReserve a{font-family: 'Noto Sans JP', sans-serif; font-weight: 500; color: #fff; background: var(--Black); padding: 8px 24px; letter-spacing: 0px; line-height: 1;}

@media only screen and (max-width:840px) {
header.Header .HeaderLogo{max-width: 150px;}
header.Header ul.nav_pc{padding-right: 40px;}
header.Header ul.nav_pc li i{font-size: 200%;}
}

.hamburger {
  display: none; /* デフォルトは非表示 */
}

/* 840px以下の設定 */
@media screen and (max-width: 840px) {
  .hamburger {
    display: block;
    position: fixed;
	top: 20px;
	right: 15px;
    width: 30px;
    height: 24px;
    cursor: pointer;
    z-index: 110; /* メニューより上に配置 */
  }

  /* 三本線の基本形 */
  .hamburger span {
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #333;
    transition: all 0.4s;
  }
  .hamburger span:nth-child(1) { top: 0; }
  .hamburger span:nth-child(2) { top: 11px; }
  .hamburger span:nth-child(3) { bottom: 0; }

  /* 「×」への変化（activeクラスがついた時） */
  .hamburger.active span:nth-child(1) {
    transform: translateY(11px) rotate(-45deg);
  }
  .hamburger.active span:nth-child(2) {
    opacity: 0;
  }
  .hamburger.active span:nth-child(3) {
    transform: translateY(-11px) rotate(45deg);
  }

  /* メニューの右側配置 */
  .nav {
    position: fixed;
    top: 0;
    right: -100%; /* 初期位置は右の画面外 */
    width: 70%;    /* メニューの幅 */
    height: 100vh;
    background: #fff;
	box-shadow: 0 0 5px 5px rgba(0,0,0,.1);
    transition: all 0.5s;
    z-index: 105;
    padding-top: 80px;
  }

  .nav.active {
    right: 0; /* 表示 */
  }

  .nav-list {
    list-style: none;
    padding: 0;
    text-align: center;
	font-size: 16px;
  }
  
  .nav-list li { margin: 20px 0; }

  /* 背景を暗くするオーバーレイ */
  .overlay.active {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 100;
  }
}


main{margin-top: 64px;}

section.MainVisual{height: var(--Mv_H); position: relative; background: url("../img/mv.jpg") center center no-repeat; background-size: 80%; overflow: hidden;}
section.MainVisual .Cap{width: var(--Mv_W); height: 100%; position: absolute;}
section.MainVisual .Cap img{height: 90%; width: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
section.MainVisual .Cap1{background: var(--Yellow); left: 0; color: var(--Black);}
section.MainVisual .Cap2{background: var(--Green); right: 0; color: #fff; letter-spacing: .3px;}
section.MainVisual .MvLogo{position: absolute; left: 50%; top: 50px; transform: translate(-50%,0); max-width: 361px;}
section.MainVisual .vertical-ticker{width: 770px; height: var(--Mv_W); overflow: hidden; position: absolute; display: flex; align-items: center;}
section.MainVisual .Cap1 .vertical-ticker{transform: rotate(-90deg); transform-origin: top left; left: 0; top: 790px;}
section.MainVisual .Cap2 .vertical-ticker{transform: rotate(90deg); transform-origin: top left; left: 65px; top: 25px;}
section.MainVisual .ticker-content{display: flex; white-space: nowrap; animation: scroll-vertical 60s linear infinite;}
section.MainVisual .item{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 900; font-size: 18px; padding-right: 30px;}
/*  
@keyframes scroll-vertical {
0% {transform: translateX(0);}
100% {transform: translateX(-50%);}
}
*/

@media only screen and (max-width:840px) {
section.MainVisual{height: 100vh;}
section.MainVisual .Cap{display: none;}
section.MainVisual .MvLogo{max-width: 250px;}
section.MainVisual{background-size: 400px;}
}


section.About .Inner{padding-top:150px; padding-bottom: 150px; display: flex; flex-wrap: wrap; justify-content: space-between;}
section.About .Heading1{color: var(--Green); margin-bottom: 20px;}
section.About .SubHeading1{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 18px; margin-bottom: 20px;}
section.About .TxtArea{width: 40%;}
section.About .PhotoArea{width: 60%; padding: 0 10%;}
section.About ul{display: flex; justify-content: space-between; margin-top: 50px;}
section.About ul li{width: 28%; border: var(--Green) solid 1px; border-radius: 10px; padding: 20px 15px; text-align: center; font-weight: 700; font-size: 10px; letter-spacing: 1px; color: var(--Green); line-height: 1;}
section.About svg{fill: var(--Green); width: 20px; margin-bottom: 15px;}
section.About svg.IconWifi{width: 24px;}

@media only screen and (max-width:840px) {
.Heading1{font-size: 60px;}
section.About .TxtArea{width: 100%; margin-bottom: 40px;}
section.About .PhotoArea{width: 100%; padding: 0 0%;}
section.About ul li{width: 31%;}
}


section.EventHeader{position: relative;}
section.EventHeader .Icon{max-width: 291px; position: absolute; left: 50%; bottom: 0; transform: translate(-100%,50%);}
section.EventFooter{position: relative;}
section.EventFooter .Icon{max-width: 263px; position: absolute; left: 50%; bottom: 0; transform: translate(-100%,-10%);}
section.Event{background: var(--Green); color: #fff;}
section.Event .Inner{padding-top: 65px; padding-bottom: 65px;}
section.Event ul.EventUl{display: flex; flex-wrap: wrap; justify-content: center; grid-gap: 3%; margin-top: 60px;}
section.Event ul.EventUl li{width: 30%; border-radius: 20px; background: #fff; overflow: hidden;}
section.Event ul.EventUl .Tag{font-weight: 700; font-size: 10px; letter-spacing: 1px; margin-bottom: 15px;}
section.Event ul.EventUl .Tag1{color: #E8C872}
section.Event ul.EventUl .Tag2{color: #7FB5A8}
section.Event ul.EventUl .Tag3{color: #E09F6D}
section.Event ul.EventUl h3{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 18px; color: #1F2937; margin-bottom: 10px;}
section.Event ul.EventUl .TxtArea{padding: 20px; color: #6B7280; font-weight: 400; font-size: 12px; line-height: 1.6;}
.PlanArea{margin-top: 50px; text-align: left;}
.PlanArea h3{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 18px; margin-bottom: 30px; border-left: #fff solid 3px; padding: 3px 0 3px 10px;}
.PlanArea h4{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 16px; margin-bottom: 10px; border-bottom: #fff solid 2px; padding-bottom: 10px;}
.PlanArea table{width: 100%;}
.PlanArea table td{padding: 10px; text-align: center;}
.PlanArea table tr.border td{border-bottom: #fff dotted 1px;}
section.Event .Box{border: #fff solid 1px; border-radius: 10px; padding: 40px 30px; position: relative; margin-top: 40px; margin-bottom: 80px;}
section.Event .Box .Title{position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%); background: var(--Green); border-radius: 500px; border: #fff solid 1px; color: #fff; padding: 0 20px; font-weight: 400;}
section.Event .Box ul{display: flex; flex-wrap: wrap; justify-content: center; grid-gap: 30px;}
section.Event .Box i{margin-right: 5px;}
section.Event ul.FacilityOverview{display: flex; flex-wrap: wrap; justify-content: space-between;}
section.Event ul.FacilityOverview li{width: 30%;}

section.Event .Bt01{background: #fff; color: var(--Green);}

@media only screen and (max-width:840px) {
section.Event ul.FacilityOverview li{width: 100%; margin-bottom: 40px;}
section.Event ul.FacilityOverview li:last-child{margin-bottom: 0px;}

section.Event ul.EventUl li{width: 100%; margin-bottom: 40px;}
section.Event ul.EventUl li:last-child{margin-bottom: 0px;}

section.Event .Box .Title{width: 80%; text-align: center;}

.PlanArea h4{font-size: 14px; margin-bottom: 10px; border-bottom: #fff solid 2px; padding-bottom: 10px;}
.PlanArea table{font-size: 12px;}

section.EventFooter .Icon{width: 163px; left: 50%; bottom: 0; transform: translate(-80%,20%);}
}

section.Lunch{background: #FDF9F1;}
section.Lunch .Inner{padding-top:150px; padding-bottom: 150px; display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1170;}
section.Lunch .Heading1{color: var(--Orange); margin-bottom: 20px; font-size: 58px;}
section.Lunch .SubHeading1{font-weight: 400; font-size: 18px; margin-bottom: 20px; color: var(--Orange); letter-spacing: 1.2px; padding-left: 55px; position: relative;}
section.Lunch .SubHeading1::before{content: ""; width: 48px; height: 1px; border-bottom: var(--Orange) solid 1px; position: absolute; left: 0; top: 50%;}
section.Lunch .SubHeading2{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 18px; margin-bottom: 20px;}
section.Lunch .SubHeading2 svg{width: 15px; margin-right: 5px;}
section.Lunch .TxtArea{max-width: 600px;}
section.Lunch .PhotoArea{max-width: 505px;}
section.Lunch .PhotoArea img{border-radius: 20px;}
section.Lunch ul{display: flex; margin-top: 50px; grid-gap: 15px; margin-bottom: 30px;}
section.Lunch ul li{border: #000 solid 1px; border-radius: 500px; padding: 5px 10px; text-align: center; font-weight: 700; font-size: 12px; letter-spacing: 1px; color:#000; line-height: 1; background: #fff;}
section.Lunch dl{border-top: #000 solid 1px; border-bottom: #000 solid 1px; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px 0;}
section.Lunch dl dt{width: 40%; font-size: 12px; font-weight: 700; font-size: 12px; letter-spacing: 1.2px;text-align: center;}
section.Lunch dl dd{width: 60%; font-size: 22px; text-align: center; font-weight: 300;}

@media only screen and (max-width:840px) {
section.Lunch dl{margin-bottom: 40px;}
section.Lunch .PhotoArea{padding: 0 15%;}
section.Lunch dl dt{width: 100%;}
section.Lunch dl dd{width: 100%;}
}

section.Beer{background: #1F2937; color: #9CA3AF;}
section.Beer .Inner{padding-top:150px; padding-bottom: 150px; display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1140;}
section.Beer .Heading1{color: var(--Gold); margin-bottom: 20px; font-size: 58px;}
section.Beer .SubHeading1{font-weight: 400; font-size: 18px; margin-bottom: 20px; color: var(--Gold); letter-spacing: 1.2px; padding-left: 55px; position: relative;}
section.Beer .SubHeading1::before{content: ""; width: 48px; height: 1px; border-bottom: var(--Gold) solid 1px; position: absolute; left: 0; top: 50%;}
section.Beer .TxtArea{max-width: 550px;}
section.Beer .PhotoArea{max-width: 505px; overflow: hidden; aspect-ratio: 1 / 1;}
section.Beer .PhotoArea img{border-radius: 20px; width: 100%; height: 100%; object-fit: cover;}
section.Beer ul{display: flex; margin-top: 50px; grid-gap: 15px; margin-bottom: 30px;}
section.Beer ul li{border: #000 solid 1px; border-radius: 500px; padding: 5px 10px; text-align: center; font-weight: 700; font-size: 12px; letter-spacing: 1px; color:#000; line-height: 1; background: #fff;}
section.Beer table.BeerPrice{margin-bottom: 40px; font-size: 14px; font-weight: 700; color: #fff; width: 100%;}
section.Beer table.BeerPrice tr.border td{border-bottom: #fff solid 1px;}
section.Beer table.BeerPrice td{padding: 30px 0 10px;}
section.Beer table.BeerPrice .Price{margin-bottom: 40px; color: var(--Gold); font-size: 16px; font-weight: 300; text-align: right;}
section.Beer dl{}
section.Beer dl dt{font-size: 12px; font-weight: 700; font-size: 12px; letter-spacing: 1.2px;}
section.Beer dl dd{font-size: 22px; font-weight: 300; color: #fff;}


@media only screen and (max-width:840px) {
section.Beer .PhotoArea{padding: 0 15%; margin-bottom: 40px;}
}

section.BBQ{background: #FDF9F1;}
section.BBQ .BBQArea{display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 80px;}
section.BBQ .IconBBQ{width: 166px; position: absolute; left: 30%; top: 0;}
section.BBQ .Inner{padding-top:150px; padding-bottom: 150px; max-width: 1080; position: relative;}
section.BBQ .Heading1{color: #1F2937; margin-bottom: 20px; font-size: 58px;}
section.BBQ .SubHeading1{font-weight: 400; font-size: 18px; margin-bottom: 20px; color: var(--Green); letter-spacing: 1.2px; padding-left: 55px; position: relative;}
section.BBQ .SubHeading1::before{content: ""; width: 48px; height: 1px; border-bottom: var(--Green) solid 1px; position: absolute; left: 0; top: 50%;}
section.BBQ .TxtArea{max-width: 600px;}
section.BBQ .PhotoArea{max-width: 505px; aspect-ratio: 1 / 1; overflow: hidden;}
section.BBQ .PhotoArea img{border-radius: 20px; width: 100%; height: 100%; object-fit: cover;}
section.BBQ .BBQArea ul{display: flex; margin-top: 50px; grid-gap: 15px; margin-bottom: 30px;}
section.BBQ .BBQArea ul li{border: #000 solid 1px; border-radius: 500px; padding: 5px 10px; text-align: center; font-weight: 700; font-size: 12px; letter-spacing: 1px; color:#000; line-height: 1; background: #fff;}
section.BBQ dl{border-top: #000 solid 1px; border-bottom: #000 solid 1px; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px 0;}
section.BBQ dl dt{width: 40%; font-size: 12px; font-weight: 700; font-size: 12px; letter-spacing: 1.2px;text-align: center;}
section.BBQ dl dd{width: 60%; font-size: 22px; text-align: center; font-weight: 300;}

section.BBQ .PriceBox{display: flex; flex-wrap: wrap; justify-content: space-between;}
section.BBQ .PriceBox li{width: 48%;}
section.BBQ table{width: 100%;}
section.BBQ .Price1{background: #F9FAFB; border: #000 solid 1px; border-radius: 30px 30px 0 0;}
section.BBQ .Price1 td{padding: 20px 30px;}
section.BBQ .Price1 h3{font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700;font-size: 20px; letter-spacing: -0.5px;}
section.BBQ .Price1 h3 .Sub{font-family: 'Noto Sans JP', sans-serif; font-weight: 700; font-size: 10px;letter-spacing: 1px; display: block; margin-top: 10px; color: #9CA3AF;}
section.BBQ .Price1 .Price{font-weight: 300; font-size: 30px; color: var(--Green); text-align: right;}
section.BBQ .Price1 .Price .Sub{font-weight: 700; font-size: 10px; letter-spacing: 1px; display: block; margin-top: 0px; color: #9CA3AF;}
section.BBQ .Price2{background: #fff; border: #000 solid 1px; border-top: 0; border-radius: 0 0 30px 30px; padding: 30px 40px;}
section.BBQ .Price2 td{padding: 5px 0px; border-bottom: #F3F4F6 dotted 1px;}
section.BBQ .Price2 .Price{text-align: right; font-weight: 700; font-size: 10px; color: #9CA3AF;}
section.BBQ .Price2 span.Icon{background: #F3F4F6; padding: 0 5px;}

section.BBQ .Lineup{background: #fff; border: #000 solid 1px; border-top: 0; border-radius: 0 0 30px 30px; padding: 30px 40px;}
section.BBQ .Lineup ul{padding-left: 10px; margin-bottom: 20px;}
section.BBQ .Lineup ul li{padding: 5px 0px; border-bottom: #9CA3AF dotted 1px; width: 100%;}
section.BBQ .Lineup ul li.Sub{border-bottom: 0px; font-size: 80%;}

section.BBQ .Bt01{background: #fff; border: #1F2937 solid 1px; color: #1F2937;}

@media only screen and (max-width:840px) {
section.BBQ .IconBBQ{width: 140px; position: absolute; left: 30%; top: -50px;}
section.BBQ .PriceBox li{width: 100%; margin-bottom: 40px;}
section.BBQ .PriceBox li:last-child{margin-bottom: 0px;}
}

section.Rental{background: var(--Orange); text-align: center; position: relative; color: #fff;}
section.Rental .IconRental{position: absolute; right: 15%; top: -50px; width: 226px;}
section.Rental .Inner{padding-top:150px; padding-bottom: 150px; max-width: 1200px;}
section.Rental .Heading1{margin-bottom: 20px; font-size: 48px;}

section.Rental .TxtArea{margin-bottom: 30px;}

section.Rental .PhotoArea {aspect-ratio: 16 / 9; overflow: hidden;}
section.Rental .PhotoArea img{border-radius: 20px; width: 100%; height: 100%; object-fit: cover;}

section.Rental .Bt01{background: #fff; color: var(--Orange); border-radius: 500px;}

section.Access .Inner{max-width: 1080; padding-top:150px; padding-bottom: 150px; display: flex; flex-wrap: wrap; justify-content: space-between;}
section.Access .Heading1{margin-bottom: 50px; font-size: 36px; font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; letter-spacing: 0;}
section.Access .SubHeading1{font-weight: 700; font-size: 10px; color: #9CA3AF; letter-spacing: 2px;}

section.Access dl{border-left: #1F2937 solid 1px; padding-left: 40px; margin-bottom: 40px;}
section.Access dt{font-weight: 700; font-size: 12px; color: #6B7280;}
section.Access dd{font-weight: 500; font-size: 16px; color: #27272A; margin-bottom: 25px;}
section.Access dd.FontSize{font-size: 24px; font-weight: 400;}
section.Access .TxtArea{width: 48%;}
section.Access .Map{width: 48%;}
section.Access .Map iframe{width: 100%; aspect-ratio: 4 / 3;}
.Bt01{padding-right: 30px; position: relative; display: inline-block;}
.Bt01::after{content: "→"; position: absolute; right: 10px; top: 50%; transform: translate(0,-50%);}
.Bt01:hover::after{right: 5px;}
section.Access .Bt01{background: var(--Orange); padding: 10px 50px 10px 30px; border-radius: 500px; color: #fff}

@media only screen and (max-width:840px) {
section.Access .TxtArea{width: 100%; margin-bottom: 40px;}
section.Access .Map{width: 100%;}
}

footer.Footer{background: var(--Yellow);}
footer.Footer .Inner{padding-top:50px; padding-bottom: 50px; max-width: 1170px; display: flex; flex-wrap: wrap; justify-content: space-between; border-bottom: #1F2937 solid 1px;}
footer.Footer .Box_Footerlogo,
footer.Footer .Box_Sitemap,
footer.Footer .Box_PWG{width: 30%;}
footer.Footer img.FooterLogo{max-width: 125px; margin-bottom: 20px;}
footer.Footer ul.FooterSns{display: flex; flex-wrap: wrap; grid-gap: 10px;}
footer.Footer ul.FooterSns li a{border: #000 solid 1px; border-radius: 100%; aspect-ratio: 1 / 1; width: 32px; display: inline-block; position: relative;}
footer.Footer ul.FooterSns li img{width: 12px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
footer.Footer .FooterHeading{font-weight: 700; font-size: 12px; color: #6B7280; margin-bottom: 20px;}
footer.Footer .Box_PWG a{text-decoration: underline;}
footer.Footer ul.FooterNav li{margin-bottom: 15px;}
footer.Footer ul.FooterNav li:last-child{margin-bottom: 0px;}
footer.Footer ul.FooterNav li a{font-weight: 700; font-size: 14px; color: #1F2937;}
footer.Footer .copy{font-weight: 700; font-size: 10px; text-align: center; padding: 20px 0 40px;}
footer.Footer .Bt01{background: #fff; padding: 10px 50px 10px 30px; border-radius: 500px; color: #1F2937; margin-top: 30px;}

@media only screen and (max-width:840px) {
footer.Footer .Box_Footerlogo{width: 100%; text-align: center; margin-bottom: 40px;}
footer.Footer .Box_Sitemap,
footer.Footer .Box_PWG{width: 47%;}
footer.Footer ul.FooterNav li{margin-bottom: 10px;}
footer.Footer ul.FooterSns{justify-content: center;}
}





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

    other

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


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


.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;}

.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;}
.mb80{margin-bottom:80px !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%}




.memo{font-size:85%;}

.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;}