@charset "utf-8";

body {
font-family: 'gokan','Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
background-color: #FFF7D9;
color:#530B02;
letter-spacing: .05em;
font-weight: normal;
margin:0;
}
*{
box-sizing: border-box;
}
p{
line-height:1.7em;
font-size:1.5rem;
margin:1em 0;
}
.re{position:relative;}
.ab{position:absolute;}
.float-left{float: left;}
.clear{clear: both;}
img{ max-width: 100%; display: block; }
.flex{
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
}
a{text-decoration: none;}
a:hover{opacity: .8; transition:.3s;}

.DivLink{
    position:relative;
}
.DivLink .Link{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
table{
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
ul {
  list-style: none;
  margin:0;
  padding:0;
}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
/* Google Mapを囲う要素 */
.map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%; /* 比率を4:3に固定 */
}
/* Google Mapのiframe */
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.products-menu-box-01{
  margin:0 0 10rem;
}
.menu-h2{
  color:#FDC600;
  background-color:#af7a17;
  font-size: 2.5rem;
  font-weight:normal;
  text-align: center;
  padding:.4em 1em;
  margin:2em 0 1.5em;
}
.plin-p{
  width:95%;
  margin:0 auto 2em;
  font-size:1.6rem;
}


/*ALL*/
@font-face {
font-family: '五感';
src: url('../font/DF-SinSou-W3.ttc') format('truetype');
}
@font-face {
font-family: 'gokan';
src: url('../font/DFSinSo-W3-WINP-RKSJ-H-02.ttf') format('truetype');
}


.inner{
  max-width: 1270px;
  width:85%;
  margin:0 auto;
}

.page-link{
  margin:-75px 0 0;
  padding:75px 0 0;
}

section.page-content {
  padding: 8rem 0 11rem;
}

/* ---- ページタイトル ---- */
.h2-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
  position: relative;
}

/* ロゴマーク */
.h2-box-mark {
  display: none;
}

/* 上部ライン */
.h2-box-deco {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 560px;
}
.h2-box-deco::before,
.h2-box-deco::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(180,130,50,0.5), rgba(180,130,50,0.5));
}
.h2-box-deco:last-of-type::before,
.h2-box-deco:last-of-type::after {
  background: linear-gradient(to left, transparent, rgba(180,130,50,0.5), rgba(180,130,50,0.5));
}
.h2-box-deco-inner {
  padding: 0 1.6rem;
  color: rgba(180,130,50,0.7);
  font-size: 0.75rem;
  letter-spacing: 0.3em;
}

/* タイトルテキスト */
.h2-box-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding: 1.6rem 0;
}
.h2-box p {
  font-size: 7rem;
  line-height: 1em;
  margin: 0 0 1.2rem;
  padding: 0;
  white-space: nowrap;
  font-family: 'Nunito', 'gokan', sans-serif;
  font-weight: 300;
  letter-spacing: 0.2em;
  color: #530B02;
}
.h2-box h2, .h2-box h1 {
  font-size: 1.1rem;
  margin: 0;
  font-weight: normal;
  letter-spacing: 0.55em;
  color: #530B02;
  opacity: 0.45;
}

/* 不要な要素は非表示 */
.h2-box-left,
.h2-box-line,
.h2-box-icon,
.h2-box-right {
  display: none;
}



/*流れるGOKAN*/
@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 80s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 3);
  min-width: 600px;
  padding: 1em 0;
}
.scroll-infinity__item>img {
  width: 100%;
}


/*FOOTER*/
footer {
  background-color: #FDC600;
}
.footer-main {
  width: 100%;
}
.footer-inner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 4rem;
  max-width: 1100px;
  margin: 0 auto;
  padding: 6rem 4rem 4rem;
}

/* ロゴ列 */
.footer-logo-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1.2;
}
.footer-logo-col > a img {
  width: 180px;
  margin-bottom: 2rem;
}
.footer-concept {
  font-size: 1.3rem;
  line-height: 2em;
  color: #530B02;
  margin: 0 0 2.5rem;
}
.footer-sns {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-sns a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1.5px solid #530B02;
  border-radius: 50%;
  color: #530B02;
  transition: background-color 0.25s, color 0.25s;
}
.footer-sns a:hover {
  background-color: #530B02;
  color: #FDC600;
}
.footer-svg-icon {
  width: 18px;
  height: 18px;
}

/* ナビ列 */
.footer-nav-col {
  flex: 0.8;
}
.footer-nav-title {
  font-size: 1.1rem;
  letter-spacing: 0.25em;
  color: #530B02;
  font-family: Georgia, serif;
  margin: 0 0 1.8rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgba(83,11,2,0.3);
}
.footer-nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.footer-nav-list a {
  font-size: 1.3rem;
  color: #530B02;
  text-decoration: none;
  letter-spacing: 0.1em;
  transition: opacity 0.2s;
}
.footer-nav-list a:hover {
  opacity: 0.6;
}

/* 店舗情報列 */
.footer-info-col {
  flex: 1;
}
.footer-info-dl {
  margin: 0;
}
.footer-info-dl dt {
  font-size: 1.2rem;
  color: #530B02;
  font-weight: normal;
  letter-spacing: 0.1em;
  margin: 0 0 0.4rem;
  opacity: 0.7;
}
.footer-info-dl dd {
  font-size: 1.3rem;
  color: #530B02;
  line-height: 1.9em;
  margin: 0 0 1.8rem;
}

/* フッターボトム */
.footer-bottom {
  border-top: 1px solid rgba(83,11,2,0.2);
  padding: 2rem 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
}
.footer-links {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 3rem;
  margin: 0;
}
.footer-links a {
  font-size: 1.2rem;
  color: #530B02;
  text-decoration: none;
  opacity: 0.8;
  transition: opacity 0.2s;
}
.footer-links a:hover {
  opacity: 1;
}
p.copy {
  font-size: 1.2rem;
  color: #530B02;
  opacity: 0.7;
  margin: 0;
}

/* 旧スタイル互換 */
.footer-box {
  display: none;
}

/* ヘッダーSVGアイコン */
.nav-svg-icon {
  width: 22px;
  height: 22px;
  display: block;
  color: #530B02;
}
.nav-icon-li {
  display: flex;
  align-items: center;
  margin-top: 12px;
}
.nav-icon-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  transition: background-color 0.25s;
}
.nav-icon-link:hover {
  background-color: rgba(83,11,2,0.12);
}


.yellow-btn{
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  background-color: #FDC600;
  color: #2b2117;
  border: 1.5px solid #FDC600;
  padding: 1.1em 2.8em;
  font-size: 1.4rem;
  letter-spacing: 0.18em;
  margin: 7rem auto 0;
  width: fit-content;
  border-radius: 100px;
  font-family: Georgia, 'Times New Roman', serif;
  text-decoration: none;
  transition: background-color 0.3s, color 0.3s;
  position: relative;
  overflow: hidden;
}
.yellow-btn:hover{
  background-color: #2b2117;
  color: #FDC600;
}
.yellow-btn:hover .btn-arrow{
  color: #FDC600;
}
.btn-arrow{
  font-size: 1.2em;
  line-height: 1;
  color: #2b2117;
  transition: color 0.3s, transform 0.3s;
  display: inline-block;
}
.yellow-btn:hover .btn-arrow{
  transform: translate(2px, -2px);
}

#footer ul{
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap:30px;
  margin:0 0 3rem;
}
#footer ul li img{
  width:auto;
  margin:0;
}



section.gokan-link{
  margin:10rem 0;
}
section.gokan-link a{
  display: block;
  margin:0 auto;
  max-width:900px;
  transition: .3s;
}
section.gokan-link a:hover{
  opacity: .9;
}







/*=======================================================
==========================================================
　　　　　　　　　　　　　PC only
==========================================================
========================================================*/
@media screen and (min-width:1190px) {
html { font-size: 62.5%; }
.pc-none { display: none; }
.pc-br::after {
  content: "\A" ;
  white-space: pre;
}

header{
  background-color: rgba(253, 198, 0, .85);
  margin: -75px 0 0 0;
  z-index: 100;
  position: relative;
}

/* サブページではヘッダーを画面内に表示（TOPページのみ-75pxでヒーロー画像に重ねる） */
body.subpage header {
  margin: 0;
}

#global-nav {
  width: 100%;
}

#global-nav.m_fixed {
  background-color: rgba(253, 198, 0, .85);
	left: 0;
	position: fixed;
	top: 0;
}

#global-nav .inner {
  margin: 0 auto;
  width: 90%;
  padding: 0;
  max-width: 1270px;
}

.header-logolist{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  height: 75px;
}
.header-logolist > div img{
  margin: 5px 0 0;
  height: 50px;
}

.global-list {
	display: flex;
	list-style: none;
  align-items: center;
	margin: 0;
	padding: 0;
}
.global-list li a {
  font-size: 1.6rem;
  color:#530B02;
  margin: 0 1.5em;
  display: block;
}
.global-list li:not(.nav-icon-li):last-child a{
  margin: 0 1.5em;
}
.global-list .nav-icon-li {
  margin-left: 0.1em;
}
.global-list .nav-icon-first {
  margin-left: 0;
  padding-left: 2em;
  border-left: 1px solid rgba(83, 11, 2, 0.35);
}



.gokan-link_flex{
  display: flex;
  flex-direction: column;
  gap:2em;
  justify-content: center;
  align-items: center;
}
.gokan-link_flex a{
  display: block;
  width:100%;
  max-width: 300px;
}
.gokan-link_flex a img{
  height:auto;
  object-fit: cover;
  width: 100%;
}



}

/* ===== STORYページ ===== */
.story-content {
  padding: 4rem 0 10rem;
  max-width: 800px;
  margin: 0 auto;
}

/* リードブロック */
.story-lead-block {
  text-align: center;
  padding: 4rem 0 7rem;
  border-bottom: 1px solid rgba(180, 130, 50, 0.3);
  margin-bottom: 7rem;
}
.story-catch {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.2rem;
  letter-spacing: 0.45em;
  color: #8a5c10;
  margin: 0 0 2.5rem;
  text-transform: uppercase;
}
.story-lead {
  font-family: 'gokan', serif;
  font-size: 1.6rem;
  line-height: 2.6em;
  color: #3a2210;
  margin: 0 0 2rem;
  text-align: left;
}
.story-sub {
  font-family: 'gokan', serif;
  font-size: 1.5rem;
  line-height: 2.6em;
  color: #8a5c10;
  text-align: left;
  margin: 0;
}

/* 各セクション */
.story-section {
  margin-bottom: 7rem;
}
.story-section-deco {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
}
.story-section-num {
  font-family: 'Nunito', sans-serif;
  font-weight: 300;
  font-size: 2.8rem;
  color: rgba(180, 130, 50, 0.5);
  letter-spacing: 0.1em;
  line-height: 1;
}
.story-section-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, rgba(180,130,50,0.4), transparent);
}
.story-section-title {
  font-family: 'gokan', serif;
  font-size: 2.2rem;
  font-weight: normal;
  color: #530B02;
  letter-spacing: 0.15em;
  margin: 0 0 0.5rem;
}
.story-section-en {
  font-family: 'Nunito', sans-serif;
  font-weight: 300;
  font-size: 1.1rem;
  letter-spacing: 0.3em;
  color: rgba(83, 11, 2, 0.4);
  margin: 0 0 2.5rem;
}
.story-section-text {
  font-family: 'gokan', serif;
  font-size: 1.55rem;
  line-height: 2.6em;
  color: #3a2210;
  margin: 0;
}

/* 五つの定め */
.story-five {
  display: flex;
  justify-content: space-between;
  margin: 4rem 0 0;
  padding: 3rem 0;
  border-top: 1px solid rgba(180, 130, 50, 0.3);
  border-bottom: 1px solid rgba(180, 130, 50, 0.3);
  list-style: none;
}
.story-five li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
}
.story-five-ja {
  font-family: 'gokan', serif;
  font-size: 2rem;
  color: #530B02;
  letter-spacing: 0.15em;
}
.story-five-en {
  font-family: 'Nunito', sans-serif;
  font-weight: 300;
  font-size: 1.0rem;
  letter-spacing: 0.2em;
  color: rgba(83, 11, 2, 0.45);
}

/*=======================================================
==========================================================
  　　　　　　　　　　　　SP only
==========================================================
========================================================*/
@media screen and (max-width:768px) {
html { font-size: 54%; }
body{min-width: 360px;}
.sp-none { display: none; }
.sp-br::after {
  content: "\A" ;
  white-space: pre;
  letter-spacing: 0;
}
header{
  position: fixed;
  z-index: 999;
  top: 0;
  width: 100%;
}
.page-link{
  margin:-60px 0 0;
  padding:60px 0 0;
}
/* Navbar & Navmenu color */
.header {
  background-color: rgba(253, 198, 0, .85);
  width: 100%;
  height: 62px;
  position: relative;
}

/* Nav items */
.menu {
  list-style: none;
  position: absolute;
  width: 100%;
  height: 100vh;
  top: 0;
  margin-top: 62px;
  padding: 3% 0 10px 0;
  clear: both;
  background: rgba(255, 247, 217, .95);
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
  transform: scale(1, 0);
  transform-origin: top;
}

.toji{
  transform: scale(1, 0);
}

/* Hamburger menu button */
.menu-btn:checked ~ .menu {
  transform: scale(1, 1);
  transform-origin: top;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

/* Hamburger menbu text */
.menu a {
  text-decoration: none;
  font-weight: 500;
  letter-spacing: 2px;
  font-size: 1.6rem;
  text-transform: capitalize;
  color: #640C06;
  opacity: 0;
  transition: 0.5s;
}

.menu li {
  border-top: 1px solid rgba(112, 6, 0, .34);
  padding: 23px 0;
  margin: 0 7%;
  opacity: 0;
  transition: 0.5s;
  text-align: center;
}
.menu li:first-child {
  border-top: none;
}

.menu-btn:checked ~ .menu a,
.menu-btn:checked ~ .menu li {
  opacity: 1;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s;
}

.menu li.insta-li a{
  display: block;
  width: fit-content;
  margin: 0 auto;
}

.menu-btn {
  display: none;
}

.menu-icon {
  display: inline-block;
  position: relative;
  cursor: pointer;
  padding: 24px 14px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  float: right;
  margin: 5px 5px 0 0;
}

.navicon {
  background: #640C06;
  display: block;
  height: 2.8px;
  width: 26px;
  position: relative;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before,
.navicon:after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  background: #640C06;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before {
  top: 9px;
}

.navicon:after {
  bottom: 9px;
}

/* Hamburger Menu Animation Start */
.menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before {
  top: 0;
}
.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  bottom: 0;
}

.menu-btn:checked ~ .menu-icon .navicon {
  background: rgba(0, 0, 0, 0);
  transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
/* Hamburger Menu Animation End */

/* Navbar Container */
.navtext-container {
  width: 100%;
  height: 62px;
  position: absolute;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Navbar Text */
.sp-h_logo img{
  height: 42px;
  object-fit: cover;
  margin: 7px 0 0;
}


section.page-content {
    padding: 5rem 0 8rem;
}

.h2-box p {
  font-size: 4.5rem;
}
.h2-box-line {
  height: 5rem;
}
.h2-box-right {
  display: none;
}

.yellow-btn {
  margin: 5rem auto 0;
  font-size: 1.3rem;
  padding: 1.0em 2.2em;
}














}/*====================================================
  　　　　　　　　　　　　さらに細かく480以下
=======================================================*/
@media screen and (max-width:480px) {

}
/*=======================================================
==========================================================
  　　　　　　　　　　　　Ipad only
==========================================================
========================================================*/
@media screen and (min-width:768px) and ( max-width:1190px) {
html { font-size: 59%; }
.pc-none { display: none; }
.pc-br::after {
  content: "\A" ;
  white-space: pre;
}
header{
  background-color: rgba(253, 198, 0, .85);
  margin: -75px 0 0 0;
  z-index: 100;
  position: relative;
}

/* サブページではヘッダーを画面内に表示（TOPページのみ-75pxでヒーロー画像に重ねる） */
body.subpage header {
  margin: 0;
}

#global-nav {
  width: 100%;
}

#global-nav.m_fixed {
  background-color: rgba(253, 198, 0, .85);
	left: 0;
	position: fixed;
	top: 0;
}

#global-nav .inner {
  margin: 0 auto;
  width: 90%;
  padding: 0;
  max-width: 1270px;
}

.header-logolist{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  height: 75px;
}
.header-logolist > div img{
  margin: 5px 0 0;
  height: 50px;
}

.global-list {
	display: flex;
	list-style: none;
  align-items: center;
	margin: 0;
	padding: 0;
}
.global-list li a {
  font-size: 1.5rem;
  color: #530B02;
  margin: 0 .7em;
  display: block;
}
.global-list li:not(.nav-icon-li):last-child a{
  margin: 0 0 0 .7em;
}
.global-list .nav-icon-li {
  margin-left: 0.1em;
}
.global-list .nav-icon-first {
  margin-left: 0;
  padding-left: 1.8em;
  border-left: 1px solid rgba(83, 11, 2, 0.35);
}

.gokan-link_flex a img{
  height:64px;
  object-fit: cover;
}


}/*=======================================================
==========================================================
==========================================================
========================================================*/
