@charset "utf-8";
/* CSS Document */
/*共通*/
html {font-size: 17px;scroll-padding-top: 100px;}
.f1, dt {font-size: 1.3rem;}
.f2 {font-size: 1.2rem;}
.br900, .br400 {display: none;}
a{ word-break: break-all;}
h2 {display: flex; justify-content: center;}
h2 img { margin: 0 auto; max-width: 650px;  margin-bottom: 2rem;}
.toku_content h2 {padding-bottom: 3%;}
.nav1 a, .nav1 a:visited, .spli2 a, .spli2 a:visited {text-decoration: none;color: #231815;}
h1 .mainbanner{ margin-bottom: -2px!important; width:100%;vertical-align: bottom; display: block;	padding-top: 4rem;}
.brsp {display: none;}
/*コンテンツ幅*/
.content {background-color: #fff; 	border: 5px solid;border-image:url("../img/frame.png") 15 round;max-width: 1100px;width: 95%;margin: 0 auto;}
/*メニュー*/
.schedule h2, .online h2, .summary h2, .shibuki h2 {padding-top: 4rem;}
.cafeshop_content h2{padding-bottom: 5%;}
.infoarea { background-color: #FAC261; padding:1rem 0 5rem 0; position: relative;}
.line {position: absolute;bottom: -22%;}
.sns {margin: 0 auto;}
.flex { display: flex; justify-content: space-around; max-width: 1100px; margin: 0 auto;}
/*shop*/
#shop {background: url("../img/bat_bg.png") repeat-y, url("../img/bg-yellow.png") repeat-y;position: relative; padding-bottom: 6.5rem; background-size: contain; background-position: center; }
.nami {position: absolute; bottom: 0;}
.online_content{ border: #1E120F solid 4px;margin: 0 auto;width: 90%;  box-sizing: border-box;}
.summary_content { font-weight: bold; padding: 3rem; text-align: center;}
/*特典*/
.toku_content img {border: 1px solid black; margin: 2rem auto;}
.toku_content {text-align: center; font-weight: bold; padding: 4rem 8rem;; border: 5px solid;border-image:url(../img/frame.png) 15 round;}
.toku_p {text-align: center; font-weight: bold;}
.tokuimg {width: 55%!important;}
.schedule-in dl {display: flex; justify-content: space-between;align-items: center;}
.schedule-in dl:not(:first-child){padding-top: 1.5rem;}
.cafeshop_content2 dd { padding: 2rem 0 2rem 4rem;}
.storelist  img {width: 6rem; margin: 0 auto;}
.storelist p {font-weight: bold; }
.cafeshop dt, .cafeshop dd {display: inline-block; vertical-align: middle;}
.cafeshop dt {width: 25%; text-align: left;}
.cafeshop dd {width: 65%;line-height: 1.7rem; font-weight: 500;}
.toku_text {  background-color: #fff;  margin: 0 auto; max-width: 1100px;width: 95%;}
.toku_p2 {font-weight: normal;text-align: left;}
.schedule{	margin: 0px auto;	position: relative;}
.cafeshop_content2{width: 90%; margin: 0 auto; box-sizing: border-box;background: url() repeat-y;}
.inner {  width: 95%; background: #fff;  padding: 2rem;  text-align: center;  margin: 0 auto;	border: 5px solid;  border-image: url(../img/frame.png) 15 round; max-width: 1100px;}
.twitter_content {padding: 0!important; margin-top: 0rem!important; margin-bottom: 0; }
.inner2 { /*height: 400px; */ width: 40%; padding: 0em; text-align: center; margin: 0rem 2em 0rem;}
.css-1dbjc4n.r-14lw9ot.r-1ets6dv.r-1q9bdsx.r-rs99b7.r-1udh08x {  border: 3px solid #333;}
p.event_info_inner_content { padding: 2rem 0; font-weight: bold; text-align: center;}
.info_left {  border: 10px solid;border-image:url(../img/frame.png) 15 round;font-weight: bold; background-color:#fff; position: relative;}
.event_info_inner { position: inherit; padding: 15px 0;  z-index: 1;}
.online_banner {width: 60%; margin: 0 auto;}
.online_banner img {padding: 2rem 0;}
.online_content p {padding-bottom: 2.5rem; padding-top: 2.5rem;}
.online_content dt {text-align: left; font-size: inherit; }
.online_content dl, .online_content p, .online_content div{position: inherit; z-index: 1;}
section .inner2 ul.box{background-color:#ffffff;padding:2em 1em;height:21em; min-width: 180px;}
section .inner2 ul.box li{list-style:none;text-align: left;width:100%;line-height:2.25em;border-bottom:1px solid #ccc;}
section .inner2 ul.box li p{line-height: 1.5em;}
p {margin: 0 auto;}
.twitter-left { height: 400px;display: flex; align-items: center;}
.twitter-right {border: 10px solid;border-image:url(../img/frame.png) 15 round; background: #fff;}
.on li{list-style: none;line-height: 1.1rem;}
.at{width:20%;}
.date {width: 75%;}
section.tokuten .tokuten_img {width:900px;background-color: #fff;margin:0 auto;}
.cafeshop_content {padding: 4rem;margin-bottom: 1rem;}
.toku_content h3{text-align: center;font-weight: bold;}
section .inner-item h2{margin-bottom:2em;}
.item1 {width: 90%!important; margin: 0 auto; display: flex;justify-content: space-evenly; align-items: center;}
.item1 a, .item1 div {width: 40%;}
.attention li { padding-top: 0.5rem;}
.attention_main{padding: 5rem 0; background:#FAC261;position: relative;}
.attention { background-color: #ffffff; border: 5px solid; border-image: url(../img/frame.png) 15 round;max-width: 1100px; margin: 0 auto; position: relative;width: 95%;}
.attention div {position: absolute; right: 0px; bottom: -70px; max-width: 120px;}
.descr1 {margin-top: 1rem;}
.term1 {background: #4F2A22;color: #fff; font-size: 0.8rem; padding: 0.5rem 0;}
.prices1 {font-weight: bold;font-size: 0.85rem;}
.itemname1 {font-weight: bold;font-size: 0.85rem; height: 4rem;  display: flex; align-items: center;  justify-content: center;}
.itemname1 small {display: contents; font-weight: normal;}
/*２列結合*/
.prices1 {font-weight: bold;padding: 0 0 0.5em 0!important;}
footer .copyright { font-size: 0.8rem; color: #fff; background-color: #B17536; padding: 1rem 0;}
/*summary*/
.summary .f2 {font-weight: normal;}
/*schedule*/
dt {width: 32%; text-align: center;}
dd {width: 65%;}
.on {display: flex; padding: 0.2rem 0;justify-content: space-between;}
.online h3 { max-width: 650px; margin: 0 auto;padding: 2rem 0;}

.syuryo{position: relative;}

.syuryo .syuryo-img {
    position: absolute;
    line-height: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    max-width: 200px;
    transform: rotate(10deg);
	top: -8%;
	left: 33%;}
.syuryo .syuryo-img2 {
    position: absolute;
    line-height: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    max-width: 140px;
    transform: rotate(7deg);
	top: -50%;
	left: 23%;}
.entyo{position: relative;}
.entyo .entyo-img {
    position: absolute;
    line-height: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    max-width: 130px;
    transform: rotate(5deg);
	top: -80%;
	left: 25%;}

/*twitter*/
.bat1, .bat2 {position: absolute;}
.bat1 {max-width: 4rem; top: 5%; right: 13%}
.bat2 {max-width: 3rem;right: 3%; transform: rotateZ(45deg); top: 15%;}
/*tokuten*/
.bg1 {background:url("../img/bg_brown.png") repeat-y; padding: 5rem 0;}
/*item*/
#item ul {display: flex; flex-wrap: wrap; justify-content: space-between;}
#item li {width: calc(96%/5);}
#item li:last-child {margin-right: 40%;}
/*attention*/
.attention p {padding: 2rem;}
.shizuku {position: absolute; top: 0;width: 100%;z-index: 1;}
@media screen and (max-width: 1280px){
	.line {bottom: -13%;}
}
@media screen and (max-width: 1015px){
	.line {bottom: -10%;}
	.cafeshop_content {padding: 2.5rem;}
}
@media screen and (max-width: 900px){
	.br900 {display: block;}
	#item li {width: calc(98%/2);}
	.date {width: 80%;}
	dt {font-size: 1.25rem;}
	#shop {padding-bottom: 5rem;}
}
@media screen and (max-width: 750px){
	.flex {flex-direction: column;align-items: center;}
	.inner2 {width: 70%;}
	.info_left {margin-bottom: 2rem;}
	h2 img {margin-bottom: 1.5rem;}
	.schedule h2, .online h2, .summary h2, .shibuki h2{padding-top: 3rem;}
	.schedule-in dl {flex-direction: column;}
	dt {width: 100%; margin-bottom: 1rem;}
	dd, .online_banner {width: 80%;}
	.cafeshop_content, .summary_content, .toku_content  {padding: 2rem;}
	.line {bottom: -5.6%;}
	.bg1 {padding: 4rem 0;}
	#shop {padding-bottom: 4rem;}
	.attention_main {padding: 4rem 0 5rem;}
	.attention div {max-width: 100px;}
	.inner2 {height: 380px;}
	.twitter-left, .info_left {height: 300px;}
	
}
@media screen and (max-width: 600px){
	html {scroll-padding-top: 50px;}
	.inner2 {width: 80%;}
	.inner {padding: 2rem 0.5rem;}
	.line {bottom: -4%;}
}
@media screen and (max-width: 480px){
	.br400 {display: block;}
	dd {width: 95%;}
	.at {width: 30%;}
	h2 img {width: 120%;}
	.attention div {max-width: 80px;}
	.summary_content {padding: 2rem 0.8rem; }
	.summary .f2{font-size: 1.1rem;}
	.cafeshop_content{padding: 2rem 1rem;}
	.prices1 {font-weight: normal;}
	#item li:not(:last-child) {margin-top: 0.5rem;}
	.on {padding: 0.3rem 0;}
}
@media screen and (max-width: 420px){
	.line {bottom: -3.5%;}
}


/*Twitter*Twitter復活したら以下消去*/ 
.flex {display: inherit; max-width: 1100px;  margin: 0 auto; }
.inner2 {width: inherit; margin: 0;}
.twitter-left {height: 280px;font-size: 1.2rem;}
.info_left {border: 5px solid;  border-image: url(../img/frame.png) 15 round;width: 95%; margin: 0 auto;}
.twitter_content {display: none;}
.bat3, .bat4 {position: absolute;}
.bat3 {max-width: 4rem; bottom: 5%; left: 13%}
.bat4 {max-width: 3rem;left: 3%; transform: rotateZ(45deg); bottom: 15%;}
@media screen and (max-width: 1280px){
	.line {bottom: -15%!important;}
}
@media screen and (max-width: 870px){
	.line {bottom: -12%!important;}
}
@media screen and (max-width: 750px){
	
.line { bottom: -9.2%!important;}
	.infoarea {padding-bottom: 2rem;}
	.bat3, .bat1 {max-width: 3rem;}
	.bat4, .bat2{max-width: 2rem;}
}
@media screen and (max-width: 520px){
.line { bottom: -7%!important;}
}