@charset "utf-8";
/*------------------------  limited-time_menu/page.css  ------------------------*/



/*-----  main-visual  -----*/
.main-visual { margin: 0 0 50px; }

@media screen and (max-width: 800px) {
 .main-visual { margin: 0 0 30px; }
}



/*-----  time-nav  -----*/
.time-nav { display: flex; flex-wrap: wrap; margin: 0 -7px 50px; }
.time-nav .nav { flex-basis: calc(100%/4); padding: 0 7px; }
.time-nav .nav .link { display: flex; flex-direction:column; justify-content: center; align-items: center; height: 70px; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 6px rgba(0,0,0,0.1); }
.time-nav .nav .nav01 { background: #cdeaad; }
.time-nav .nav .nav02 { background: #eddb97; }
.time-nav .nav .nav03 { background: #f4b9b2; }
.time-nav .nav .nav04 { background: #b1d9eb; }
.time-nav .nav .en { display: block; font-family: 'Kanit', sans-serif; font-weight: 800; font-size: 21px; }
.time-nav .nav .sub { display: block; padding: 3px 0 3px; font-weight: 600; font-size: 15px; }

@media screen and (max-width: 800px) {
 .time-nav { margin: 0 -5px 25px; }
 .time-nav .nav { flex-basis: calc(100%/2); padding: 0 5px 10px; }
 .time-nav .nav .link { height: 58px; }
 .time-nav .nav .en { font-size: 19px; }
 .time-nav .nav .sub { padding: 2px 0 2px; font-size: 14px; }
}



/*-----  main-title  -----*/
.main-title { display: flex; align-items: center; padding: 0 0 25px; }
.main-title .ico { width: 40px; }
.main-title .title { flex: 1; padding-left: 12px; font-weight: 800; font-size: 32px; line-height: 1.3; }

@media screen and (max-width: 800px) {
 .main-title { padding: 0 0 15px; }
 .main-title .ico { width: 30px; }
 .main-title .title { padding-left: 8px; font-size: 24px; }
}



/*-----  time-block  -----*/
.time-block { padding: 0 0 60px; }
.time-block .time-block-inner { padding: 40px 5% 50px; }

.time-block .time-head { display: flex; justify-content: space-between; align-items: end; padding: 0 0 35px; }
.time-block .time-title { display: flex; align-items: end; }
.time-block .time-title .title { padding: 0 14px 0 0; }
.time-block .time-title .title img { width: auto; height: 50px; }
.time-block .time-title .sub { flex: 1; margin: 0 0 3px 0; font-weight: 800; font-size: 18px; }
.time-block .time-zone { display: flex; align-items: end; margin-bottom: -5px; font-family: 'Kanit', sans-serif; font-weight: 800; font-size: 40px; }
.time-block .time-zone .to { display: inline-block; margin: 0 6px 7px 6px; font-family: 'Noto Sans JP', sans-serif; font-weight: 800; font-size: 22px; }
.time-block .time-zone .days { display: inline-block; margin: 0 10px 7px 0; font-family: 'Noto Sans JP', sans-serif; font-weight: 800; font-size: 18px; }

.time-block .menu-block { display: flex; align-items: center; padding: 40px 0 40px; }
.time-block .menu-block .block-img { flex-basis: 50%; }
.time-block .menu-block .block-info { flex: 1; padding: 0 2% 0 4%; }
.time-block .menu-block .block-info .name { padding: 0 0 18px; font-weight: 800; font-size: 30px; line-height: 1.3; }
.time-block .menu-block .block-info .txt { padding: 0 0 10px; font-size: 16px; line-height: 1.6; }
.time-block .menu-block .block-info .price-block { padding: 5px 0 0; }
.time-block .menu-block .block-info .box { padding: 16px 0 0; }
.time-block .menu-block .block-info .box .item { padding: 0 0 7px; font-weight: 800; font-size: 16px; }
.time-block .menu-block .block-info .box .data { flex: 1; display: flex; align-items: end; }
.time-block .menu-block .block-info .box .price { margin: 0 10px 0 0; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 34px; letter-spacing: 0; }
.time-block .menu-block .block-info .box .price .yen { font-size: 30px; }
.time-block .menu-block .block-info .box .set { margin: 0 0 1px; font-weight: 600; font-size: 14px; line-height: 1.3; }
.time-block .menu-block .block-info .sauce-block { display: flex; flex-wrap: wrap; padding: 15px 0 0; }
.time-block .menu-block .block-info .sauce-block .sauce { margin: 0 5px 5px 0; padding: 4px 10px; font-weight: 600; font-size: 12px; color: #fff; border-radius: 9999px; }
.time-block .menu-block:nth-of-type(odd) { flex-direction: row-reverse; }
.time-block .menu-block:nth-of-type(odd) .block-info { padding: 0 4% 0 2%; }
.time-block .btn-menu { margin: 40px auto 0; max-width: 300px; }
.time-block .btn-menu .btn { justify-content: center; }

#morning .time-block-inner { background: url(../images/bg_morning.jpg) center bottom #deecd1; background-size: cover; }
#morning .menu-block { border-top: 1px solid #61b30a; }
#morning .btn-block { border-top: 1px solid #61b30a; }

#lunch .time-block-inner { background: url(../images/bg_lunch.jpg) center bottom #f2eac9; background-size: cover; }
#lunch .menu-block { border-top: 1px solid #d39f00; }
#lunch .btn-block { border-top: 1px solid #d39f00; }

#combo .time-block-inner { background: url(../images/bg_combo.jpg) center bottom #f4dad7; background-size: cover; }
#combo .menu-block { border-top: 1px solid #e05144; }
#combo .btn-block { border-top: 1px solid #e05144; }

#dinner .time-block-inner { background: url(../images/bg_dinner.jpg) center bottom #dfeef6; background-size: cover; }
#dinner .menu-block { border-top: 1px solid #2ba2da; }
#dinner .btn-block { border-top: 1px solid #2ba2da; }

.sauce-block .f01 { background: #b35e04; }
.sauce-block .f02 { background: #943712; }
.sauce-block .f03 { background: #db7a08; }
.sauce-block .f04 { background: #64b862; }
.sauce-block .f05 { background: #ea2d28; }


@media screen and (max-width: 1060px) {
 .time-block .menu-block .block-info .box .data { display: block; }
 .time-block .menu-block .block-info .box .set { margin: 4px 0 0; }
}


@media screen and (max-width: 800px) {
 .time-block { padding: 0 0 40px; }
 .time-block .time-block-inner { padding: 20px 20px 35px; }

 .time-block .time-head { display: block; padding: 0 0 20px; }
 .time-block .time-title { display: block; }
 .time-block .time-title .title { padding: 0; }
 .time-block .time-title .title img { height: 34px; }
 .time-block .time-title .sub { margin: 6px 0 0; font-size: 16px; }
 .time-block .time-zone { margin: 15px 0 0; margin-bottom: 0; font-size: 31px; }
 .time-block .time-zone .to { margin: 0 3px 6px 3px; font-size: 18px; }
 .time-block .time-zone .days { margin: 0 6px 6px 0; font-size: 16px; }

 .time-block .menu-block { display: block; padding: 25px 0 35px; }
 .time-block .menu-block .block-img { margin: 0 auto 12px; max-width: 420px; }
 .time-block .menu-block .block-info { padding: 0; }
 .time-block .menu-block .block-info .name { padding: 0 0 15px; font-size: 24px; }
 .time-block .menu-block .block-info .txt { padding: 0 0 10px; font-size: 15px; }
 .time-block .menu-block .block-info .price-block { padding: 0; }
 .time-block .menu-block .block-info .box .item { font-size: 15px; }
 .time-block .menu-block .block-info .box .price {  font-size: 28px; }
 .time-block .menu-block .block-info .box .price .yen { font-size: 24px; }
 .time-block .menu-block .block-info .box .set { margin: 5px 0 0; font-size: 14px; }
 .time-block .menu-block .block-info .sauce-block { padding: 10px 0 0; }
 .time-block .menu-block:nth-of-type(odd) .block-info { padding: 0; }
 .time-block .btn-menu { margin: 32px auto 0; max-width: 300px; }
}




/*----- animation -----*/
.fade-in { opacity: 0; transform: translateY(10px); transition: 1s; }
.in { opacity: 1; transform: translateY(0px); }

.fade-in1 { opacity: 0; transform: translateY(10px); transition: 1s 0.5s; }
.fade-in2 { opacity: 0; transform: translateY(10px); transition: 1s 1.0s; }
.fade-in3 { opacity: 0; transform: translateY(10px); transition: 1s 1.5s; }
.in { opacity: 1; transform: translateY(0px); }

@media screen and (max-width: 768px) {
 .fade-in1 { transition: 1s 0.2s; }
 .fade-in2 { transition: 1s 0.2s; }
 .fade-in3 { transition: 1s 0.2s; }
}