@charset "utf-8";
/* リセットCSS */
*,:after,:before{box-sizing:border-box;border-style:solid;border-width: 0;}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow-y: scroll;}body{margin:0}main{display:block;}h1,h2,h3,h4,h5,h6{font-size:inherit;line-height:inherit;font-weight: 700;margin: 0;}address,blockquote,dl,figure,form,iframe,ol,p,pre,table,ul{margin:0;}ol,ul{padding:0;list-style:none}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit;transition: var(--hover-transform);}em{font-style:normal}abbr[title]{text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight: 400;}code,kbd,samp{font-family:monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}embed,iframe,img,object{vertical-align:bottom;}[type=checkbox]{-webkit-appearance:checkbox;appearance:checkbox;}[type=radio]{-webkit-appearance:radio;appearance:radio}button,input{overflow:visible}button,select{text-transform:none;}[type=button],[type=reset],[type=submit],button{cursor:pointer;-webkit-appearance:none;appearance:none}[type="button"][disabled],[type="reset"][disabled],[type="submit"][disabled],button[disabled]{cursor:default}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}select::-ms-expand{display:none}fieldset,option{padding:0}fieldset{margin:0;min-width:0}legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}label[for]{cursor:pointer}details{display:block}summary{display: block;outline: none;cursor: pointer;}summary::-webkit-details-marker {display: none;}table{border-collapse: collapse;border-spacing:0}caption{text-align:left}[hidden],template{display:none}img{max-width: 100%;}
/* IEブラウザの注意喚起 */
.iebox{display:none;}@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {.iebox{display:block;padding: 20px;position: fixed;bottom:0;width: 100%;z-index: 9999;text-align: center;background: red;color:#fff;font-weight: 800;}}


/* 初期は非表示 */
.com-sec-tit .letter {
  opacity: 0;
}

/* is-visible になったらアニメーション開始 */
.com-sec-tit.is-visible .letter {
  opacity: 1;
}

.com-sec-tit.is-visible .letter {
  animation: slideIn .8s cubic-bezier(0,1.2,.13,1.5) forwards;
}

/* 文字が左から出てくるアニメーション（お好みの動きでどうぞ） */
@keyframes slideIn {
  0% {
    opacity: 0;
    transform: translate3d(-100px,0,0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}

/* 汎用CSS
===================================================== */

:root {
	--font-color: #000000;
	--main-color:#FFF136;
	--accent-color:#D80132;
	--main-font: "Noto Sans JP", serif;
	--en-font: "Jost", serif;
	--hover-transform:all .3s ease-in-out;
	--hamburger-transform:display .5s ease-in-out;
	--show-anime:opacity .5s , translate 1s;
	--clip-triangle-top: polygon(50% 0, 100% 100%, 0 100%);
	--clip-triangle-bottom: polygon(0 0, 100% 0, 50% 100%);
	--clip-triangle-right: polygon(0 0, 100% 50%, 0 100%);
	--clip-triangle-left: polygon(0 50%, 100% 0, 100% 100%);
	--clip-triangle-lower-left: polygon(0 0, 100% 100%, 0 100%);
	--clip-triangle-upper-left: polygon(0 0, 100% 0, 0 100%);
	--clip-triangle-lower-right: polygon(100% 0, 100% 100%, 0 100%);
	--clip-triangle-upper-right: polygon(0 0, 100% 0, 100% 100%);
}

/* スマホでテキストの折り返し用 */
.ib {display: inline-block}

/* フォーム */
label {margin-bottom:8px;}
select,
input[type=date],
input[type=email],
input[type=number],
input[type=password],
input[type=tel],
input[type=text],
input[type=url],
textarea {width: 100%;max-width: 100%;padding: 8px 16px;border: 1px solid;margin-top: 4px;}
select,input,textarea {line-height: 1.1;font-family: inherit;font-size: inherit;font-weight: inherit;}

input[type="submit"],
input[type="button"]{padding: 12px 16px;}

.fontM{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;}
.fontG{font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;}
.fonten{font-family:var(--en-font)}

/* 基本レイアウト
===================================================== */

html{height: -webkit-fill-available;}
body{min-height: 100vh;min-height: -webkit-fill-available;font-size: 16px;font-family:var(--main-font);line-height:1.6;letter-spacing: .05em;color: var(--font-color);text-align: justify;font-feature-settings: "palt";}
body.fix {position: fixed;overflow: hidden;width: 100vw;height: 100vh;}

#page{overflow:hidden;background-color: #FFEA31;}
.container{width: 1366px;max-width: 100%;padding-inline: 24px;margin-inline: auto;position: relative;z-index:11;}

@media(max-width:560px){
	body{font-size:14px;}
}

.loding{position:absolute;inset:0;margin:auto;width:100%;background-color: #fff;z-index: 111111;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;opacity:1;visibility:visible;transition:var(--hover-transform)}
.loding .loding-txt{width:280px;max-width:80%;}
.loding .loding-logo{width:480px;max-width:80%;}
.loaded .loding{opacity:0;visibility:hidden;z-index:-1111;overflow: hidden;}

#page{display:none;}
.loaded #page{display:block;}

.sec-header{position:fixed;width: 100%;z-index:11;background-color:#fff;}
.header-content{display:grid;grid-template-columns:80px minmax(0 , 1fr) auto;align-items: center;gap: 16px;padding-block:8px 0;padding-inline:40px;}
.header_Menu_list{display:flex;justify-content:flex-end;align-items: center;gap: 16px;}
.header_Menu_list li{width: 34px;aspect-ratio:1/1;}
.header_Menu_list li img{width:100%;height:100%;object-fit:contain}

.scrollbar{background:#fff url(../images/anime-scrollbar.png)repeat-x bottom center / auto 39px;animation: bg-slide 40s linear infinite;height:40px;}

/* ハンバーガーメニュー */
.hamburgerbutton {position: relative;display: block;text-decoration: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;border: none;cursor: pointer;aspect-ratio: 1/1;width: 70px;background-color: transparent;padding: 0;/* margin:0 auto; *//* top: 0; *//* right: 0; */z-index: 111;}
.hamburgerbutton-line {position: absolute;inset:0;margin: auto;width: 37px;height: 4px;border-radius: 8px;-webkit-transition: inherit;transition: inherit;background-color: #000;}
.hamburgerbutton-line::before,
.hamburgerbutton-line::after {position: absolute;display: block;width: 100%;height: 100%;border-radius: 8px;background-color: inherit ;content: '';-webkit-transition: inherit;transition: inherit;transition: transform .2s;}
.hamburgerbutton-line::before {top: -10px;}
.hamburgerbutton-line::after {top: 10px;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line {background-color: transparent;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::before,
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::after {top: 0;background-color: #000;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::before {transform: rotate(45deg);width:100%;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::after {transform: rotate(-45deg);width:100%;}
.visuallyHidden {position: absolute;white-space: nowrap;width: 1px;height: 1px;overflow: hidden;border: 0;padding: 0;clip: rect(0 0 0 0);clip-path: inset(50%); margin: -1px;}
.nav_hamburger_menu{position:fixed;top:0;right:0;bottom:0;left:0;margin-inline: auto;padding-block: 10px;padding-inline: 16px;background-color: #fff;width:100%;height: 100dvh;overflow-y: scroll;transition: opacity .5s;display:none;}
.hamburger-content{width: 100%;display: grid;place-items: center;height: 100%;margin-inline: auto;}
.hamburger_Menu_list{padding-block: 80px;padding-inline: 24px;}
.hamburger_Menu_list li a{display:block;}
.hamburger_Menu_list li:not(:first-child){margin-top: 40px;}
.is-drawerActive .nav_hamburger_menu{display: block;}

.sec-footer{padding-block:48px 8px;background:#fff url(../images/bar.png)repeat-x top / auto 32px;position:relative;text-align:center;animation: bg-slide 40s linear infinite;}
.footer-logo img{width:10%;min-width:160px;}
.sec-footer p{font-size:12px;margin-top:.5em}
@keyframes bg-slide {
	0% {background-position: 0 0;}
	100% {background-position: -1920px 0;}
}


@keyframes mvLoop {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes mvLoop2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}
main{position:relative;}
.bg-content{position:fixed;width:100%;height: 100svh;min-height:640px;z-index: 0;}
#p1{position:absolute;left:-10%;top: 0;width:33%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.2s}
#p2{position:absolute;left:-14%;top: 55%;width:32%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.4s}
#p3{position:absolute;left: 11%;top:30%;width:22%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.6s}
#p4{position:absolute;right:-10%;top: 0;width:27%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.2s}
#p5{position:absolute;right:8%;top: 20%;width:28%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.4s}
#p6{position:absolute;right:-5%;top: 64%;width:33%;animation: fuwafuwa 1.5s cubic-bezier(.445, .05, .55, .95) infinite alternate;animation-delay:.6s}
.main-contant{padding-block: 120px 80px;width:640px;max-width:100%;margin-inline:auto;background-color: #FFEFC2;position:relative;overflow:hidden}
.main-contant::before{content:'';position:absolute;inset:0;margin:auto;background: url(../images/bg.png)repeat-y top / 100% 480px;z-index:1;pointer-events:none}
.menu-head{position:relative;}
.menu-head .menu-dragonhead{position:absolute;top:0;right:0;scale:0;opacity:0;width:100%;translate:100% 0;transition:all 1s ease;}
.show.menu-head .menu-dragonhead{width:100%;scale:1;opacity:1;translate:0 0;animation: rotate 2s ease-in-out infinite alternate;}
.menu-head .menu-1{margin-top:40px;}
.menu-head .menu-2{margin-top:40px;}
.menu-head .menu-3{margin-top:40px;}
.menu-head .menu-4{margin-top:40px;}
.menu-tail{position:relative}
.menu-tail .kimuchi{position:absolute;top:0;right:0;animation: poyopoyo 2s ease-in-out infinite alternate;}
.menu-tail .menu-dragontail{position:absolute;top:0;left:0;scale:0;opacity:0;width:20%;transition:all 1s ease}
.menu-tail .menu-dragontail{width:100%;scale:1;opacity:1;animation: rotate 2s ease-in-out infinite alternate;}
.point-2{margin-top: 56px;}
.point-3{margin-top: -35px;}
.access{padding-top: 55px;}
.access-map{width:100%;aspect-ratio:3/2;margin-top:32px;padding-inline: 77px;}
.access-map iframe{width:100%;height:100%;}
.access-note{margin-top:24px;padding-inline: 77px;font-size: 14px;text-align:right;}
.access-note p + p{margin-top:.5em;}
.time{padding-top: 55px;}
.time-des{margin-top:24px;font-weight:bold;width: 481px;margin-inline: auto;position:relative;}
.time-des .opentime{display:flex;align-items:center;flex-wrap: wrap;line-height: 1.4;}
.time-des p span:first-of-type{width: 72px;}
.open{font-size: 24px;margin-right:8px;}
.close{margin-top: 4px;}
.takeout{width:120px;position:absolute;right: 32px;bottom: 13px;}
.tel{font-size: 24px;margin-top: 16px;}
.image{padding-top: 80px;}
.image-item{display:flex;align-items:center;;gap:40px;margin-top:40px;padding-inline:77px;}
.image-item div{flex:1;}
.line{margin-top: 80px;padding-inline: 77px;text-align: center;}


@keyframes fuwafuwa {
	0% {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
	}
100% {
	-webkit-transform: translate3d(0, 6%, 0);
	transform: translate3d(0, 2%, 0)
	}
}

@keyframes rotate {
	0% {
		transform:rotate(-2deg);
	}
	100% {
		transform:rotate(2deg);
	}
}

@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.98);
  }
}

@media(max-width:1500px){
	#p1{left:-17%;}
	#p2{left:-14%;}
	#p3{left: 8%;top:39%;width: 18%;}
	#p4{right:-12%;}
	#p5{right:6%;top: 30%;width: 21%;}
	#p6{right:-15%;}
}

@media(max-width:1024px){
	.header-content{padding-inline:16px;}
	.header_Menu_list li{width:32px;}
	.hamburgerbutton{width:40px}
	#p2{left:-15%}
	#p3{display:none}
	#p5{display:none}
	#p6{right:-15%;}
}

@media(max-width:640px){
	.access-map{padding-inline:44px;}
	.access-note{padding-inline:44px;}
	.time-des{padding-inline: 44px;}
	.image-item{padding-inline:44px;gap:16px;}
	.open{font-size:18px;}
	.takeout{right:100px;width:100px;}
}