icon{
}
icon[src=today]{
color: #d6c539;
}
icon[src=location_on]{
color: #cf0709;
}
icon[src=business]{
color: #33ac13;
}

@media all and (min-width:1025px) {
}.events{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: auto;
padding: 0 10px;



}
.events article{
position: relative;
width: 48%;
margin-top: 2%;
padding-bottom: 8px;
border-radius: 4px;
box-shadow: 1px 1px 3px rgba(51, 51, 51, 0.4);
background-color: #ffffff;

}
.events img{
border-radius: 4px 4px 0 0;
}
.events figure{


}
.events article nav{
position: absolute;
top: 3px;
right: 3px;


}
.events figure h2{
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin: 5px 0;
padding: 0 5px;
font-size: 1.1rem;
line-height: 1.2;
}
.events figure p{
position: relative;
margin-left: 5px;
font-size: 0.9rem;
line-height: 1;
}
.events figure ul{
display: flex;
justify-content: start;
margin: 10px 0 5px 5px;
font-size: 1rem;
line-height: 1;

}
.events article nav [active]{
color: #cc0000;
}
.events article nav icon{
font-size: 30px;
line-height: 1;
}
.events figure ul li{
}
.events figure ul li+li{
margin-left: 1rem;
}

@media all and (min-width:1025px) {
.events{
}
.events article{
width: 32%;

}
.events article a{
}
.events article a:hover{
opacity: 0.8;
}
}.event{




}
.event .outline{
overflow: hidden;
position: relative;
height: 280px;


}
.event .map{
padding: 30px 8px 45px 8px;
background-color: #f0f0f0;
color: #333333;




}
.event .description{
max-width: 960px;
margin: 0 auto;
padding: 30px 8px 45px 8px;
background-color: #ffffff;
color: #333333;




}
.event .needs{
padding: 30px 8px 45px 8px;
background-color: #f5f5f5;
color: #333333;


}
.event .printer{
margin: 0;
padding: 20px 0;
text-align:center;


}
.event .outline summary{
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding-bottom: 60px;
background-color: rgba(0, 0, 0, 0.5);
color: #ffffff;
text-align: center;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1ch;




}
.event .outline figure{
overflow: hidden;
width: 100%;
height: 100%;



}
.event .map h2{
margin-bottom: 10px;
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
text-align: center;
}
.event .map figure{
display: block;
width: 98%;
height: 350px;
margin: 12px auto 0 auto;
text-align: center;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;

}
.event .map nav{
max-width: 650px;
max-height: 200px;
margin: 10px auto 0 auto;
overflow-y: auto;

}
.event .map dl{
position: relative;
display: inline-block;
width: 49%;
margin-top: 6px;
font-size: 1rem;
line-height: 44px;


}
.event .description h3{
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
text-align: center;
}
.event .description h4{
margin-top: 20px;
border-bottom: 1px #17446d solid;
font-size: 1.1rem;
font-weight: bold;
line-height: 1.5;
}
.event .description p{
margin-top: 10px;
font-size: 1rem;
line-height: 1.5;
}
.event .description aside{
}
.event .needs h3{
display: block;
width: 200px;
margin: 0 auto 30px auto;
border-radius: 44px;
background-color: #919191;
color: #ffffff;
font-size: 1.5rem;
line-height: 44px;
text-align: center;
}
.event .needs dl{
margin: 0;
padding: 12px 8px;
border-bottom: 1px #696969 solid;
background-color: #ffffff;



}
.event .printer a{
position: relative;
display: inline-block;
width: 45%;
max-width: 220px;
height: 50px;
padding: 0 10px;
border-radius: 5px;
background-color: #333333;
color: #ffffff;
font-size: 1rem;
line-height: 50px;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;


}
.event .printer icon{
display: inline-block;
margin-right: 5px;
font-size: 1.2rem;
}
.event .outline summary h1{
display: block;
max-width: 95%;
margin: 0 auto;
font-size: 1.2rem;
font-weight: bold;
line-height: 1.2;
}
.event .outline summary p{
display: block;
margin-top: 10px;
font-size: 1.2rem;
font-weight: bold;
line-height: 1.2;
}
.event .outline summary ul li{
display: inline-block;
font-size: 1.1rem;
font-weight: bold;
line-height: 1.2;

}
.event .outline summary icon{
margin-right: 2px;
}
.event .outline figure img{
width: 100%;
height: 100%;
}
.event .outline figure nav{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #333333;
font-size: 0.8rem;
line-height: 30px;
text-align: center;

}
.event .outline figure figcaption{
position: absolute;
bottom: 40px;
left: 0;
width: 100%;
text-align: center;

}
.event .map figure img{
display: inline-block;
width: auto;
height: 100%;

}
.event .map nav a{
display: block;
text-decoration: underline;

}
.event .map dl dt{
display: inline-block;
width: 25%;
max-width: 44px;
background-color:  #005399;
color: #ffffff;
text-align: center;
}
.event .map dl dd{
display: inline-block;
width: 75%;
padding: 0 7px;
background-color: #3373a7;
color: #ffffff;
}
.event .description aside p{
margin-top: 5px;
}
.event .needs dl:first-of-type{
border-top: 1px #696969 solid;
}
.event .needs dl dt{
margin: 0;
font-size: 1.1rem;
font-weight: bold;
line-height: 1.5;
}
.event .needs dl dd{
margin: 0;
font-size: 1rem;
line-height: 1.5;
}
.event .printer a+a{
margin-left: 10px;
}
.event .printer a:hover{
background-color: #000000;
}
.event .outline summary ul li+li{
margin-left: 20px;
}
.event .outline figure nav a{

}
.event .outline figure figcaption span{
padding: 0 20px;
border-radius: 20px;
background-color: #dadada;
color: #525252;
font-size: 1rem;
line-height: 1.5;
}
.event .map figure img+img{
margin-left: 10px;
}
.event .map nav a:hover{
opacity: 0.8;
text-decoration: none;
}
.event .outline figure nav a:hover,
.event .outline figure nav a[active]{
color: #ffffff;
}
.event .outline figure nav a+a{
margin-left: 8px;
}

@media all and (min-width:1025px) {
.event{



}
.event .outline{
height: 450px;


}
.event .map{
padding: 30px 20px 45px 20px;




}
.event .description{
padding: 30px 20px 45px 20px;
}
.event .needs{
padding: 30px 20px 45px 20px;


}
.event .outline summary{


}
.event .outline figure{

}
.event .map figure{
width: 650px;
}
.event .map nav{
}
.event .map dl{

}
.event .needs h3{
max-width: 960px;
border-radius: 60px;
font-size: 1.2rem;
line-height: 60px;
}
.event .needs dl{
display: table;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0;
border-right: 1px #696969 solid;


}
.event .outline summary h1{
max-width: 640px;
font-size: 1.2rem;
line-height: 1.2;
}
.event .outline summary p{
font-size: 1.2rem;
line-height: 1.2;
}
.event .outline summary ul li{
font-size: 1.2rem;
line-height: 120%;
}
.event .outline figure nav{
}
.event .outline figure figcaption{
bottom: 60px;
}
.event .map nav a{
}
.event .map dl dt{
width: 15%;

}
.event .map dl dd{
width: 85%;
}
.event .needs dl dt{
display: table-cell;
width: 200px;
padding: 10px 20px;
border-left: 1px #696969 solid;
}
.event .needs dl dd{
display: table-cell;
padding: 10px 20px;
border-left: 1px #696969 solid;
}
.event .outline figure nav a{

}
.event .map nav a:hover{
opacity: 0.8;
text-decoration: none;
}
.event .outline figure nav a:hover{
color: #ffffff;
}
.event .outline figure nav a+a{
margin-left: 2px;
}
}.shop{

}
.shop .outline{
overflow: hidden;
position: relative;
height: 120px;


}
.shop .menu{
max-width: 960px;
margin: 0 auto;
padding: 30px 8px 45px 8px;
background-color: #ffeede;





}
.shop .outline summary{
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding-bottom: 60px;
background-color: rgba(0, 0, 0, 0.5);
color: #ffffff;
text-align: center;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1ch;




}
.shop .outline figure{
overflow: hidden;
width: 100%;
height: 100%;



}
.shop .menu h2{
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
text-align: center;
}
.shop .menu nav{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 800px;
margin: 10px auto;
}
.shop .menu figure{
}
.shop .menu a{
width: 48%;
font-size: 1rem;
text-decoration: underline;

}
.shop .menu aside{
display: none;
}
.shop .outline summary h1{
display: block;
max-width: 95%;
margin: 0 auto;
font-size: 1.2rem;
font-weight: bold;
line-height: 1.2;
}
.shop .outline summary p{
display: block;
font-size: 1rem;
line-height: 1.2;
}
.shop .outline summary ul{
}
.shop .outline summary icon{
margin-right: 2px;
}
.shop .outline figure img{
width: 100%;
height: 100%;
}
.shop .outline figure nav{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #333333;
font-size: 0.8rem;
line-height: 30px;
text-align: center;

}
.shop .outline figure figcaption{
position: absolute;
bottom: 40px;
left: 0;
width: 100%;
text-align: center;

}
.shop .menu figure img{
box-shadow: 1px 1px 3px rgb(51 51 51 / 40%);
}
.shop .menu a:hover{
opacity: 0.8;
text-decoration: none;
}
.shop .outline summary ul li{
display: inline-block;
font-size: 1.1rem;
font-weight: bold;
line-height: 1.2;

}
.shop .outline figure nav a{

}
.shop .outline figure figcaption span{
padding: 0 20px;
border-radius: 20px;
background-color: #dadada;
color: #525252;
font-size: 1rem;
line-height: 1.5;
}
.shop .outline summary ul li+li{
margin-left: 20px;
}
.shop .outline figure nav a:hover,
.shop .outline figure nav a[active]{
color: #ffffff;
}
.shop .outline figure nav a+a{
margin-left: 8px;
}

.register{
background-color: #f0f0f0;
padding: 10px;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;

}
.register li{
width: 20%;
list-style: none;
text-align: center;






}
.register li:nth-child(1),
.register li:nth-child(2){
position: relative;
}
.register li:nth-child(1) span,
.register li:nth-child(2) span{
content: "";
position: absolute;
top: 0;
right: 4px;
width: 6vw;
height: 6vw;
border-radius: 14px;
background-color: #e10000;
color: #fff;
text-align: center;
line-height: 6vw;
font-size: 4vw;
}
.register li a{
display: block;
}
.register li:last-child{
width: 50%;
}
.register li icon:before{
font-size: 9vw;
}
.register li.buy{
display: flex;
flex-wrap: nowrap;
justify-content: space-evenly;
align-items: center;
background-color: #e10000;
border-radius: 10px;
color: #fff;
font-size: 19px;


}
.register li.buy span{
display: block;
font-size: 16px;
color: #000;
}
.register li.buy icon[src="arrow_forward"]{
display: block;
}

.product{
width: 90%;
max-width: 600px;
padding: 2%;
border-radius: 10px;
background-color: rgb(0 0 0 / 90%);









}
.product h2{
font-size: 1.2rem;
text-align: center;
}
.product h3{
background-color: #e10000;
color: #ffffff;
font-size: 1rem;
line-height: 35px;
text-align: center;
}
.product p{
margin-top: 20px;
}
.product figure{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
margin-top: 8px;

}
.product dl{
display: flex;
justify-content: space-between;
align-items: center;
padding: 5px;
border-top: 1px solid;


}
.product input{
width: 44px;
margin: 0 5px;
border: none;
font-size: 16px;
line-height: 35px;
text-align: center;
}
.product icon{
font-size: 25px;
line-height: 35px;
}
.product a{

}
.product nav{
margin-top: 20px;
text-align: center;

}
.product figure img,
.product figure figcaption{
width: 49%;
}
.product dl:first-of-type{
margin-top: 10px;
}
.product dl:last-of-type{
border-bottom: 1px solid;
}
.product a[button]{
padding: 5px 8px;
border-radius: 4px;
background-color: gray;
}
.product a:hover{
opacity: 0.8;
}
.product nav input{
width: 98%;
max-width: 300px;
background-color: #e10000;
color: #ffffff;
}

@media all and (min-width:1025px) {
.shop{

}
.shop .outline{
height: 280px;


}
.shop .menu{
}
.shop .outline summary{
}
.shop .outline figure{
}
.shop .menu a{
width: 32%;

}
.shop .outline summary h1{
max-width: 640px;
font-size: 1.5rem;
line-height: 1.2;
}
.shop .outline figure figcaption{
bottom: 60px;
}
.shop .menu a:hover{
opacity: 0.8;
text-decoration: none;
}

.register{
padding: 20px;
justify-content: space-evenly;

}
.register li{
width: 80px;



}
.register li:nth-child(1) span,
.register li:nth-child(2) span{
width: 25px;
height: 25px;
line-height: 25px;
font-size: 14px;
}
.register li:last-child{
width: 180px;
}
.register li icon:before{
font-size: 36px;
}
}.review{
margin-top: 50px;







}
.review h3{
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
text-align: center;
}
.review h4{
font-size: 1.5rem;
font-weight: 700;
line-height: 100%;
text-align: center;
}
.review .item{
overflow: auto;
width: 98%;
height: 350px;
max-width: 850px;
margin: 20px auto 0 auto;
padding: 10px;
border: 1px #cccccc solid;


}
.review .form{
width: 98%;
max-width: 850px;
margin: 20px auto 0 auto;
padding: 20px;
background-color: #efefef;
}
.review .star{
position: relative;
display: inline-block;
z-index: 0;
white-space: nowrap;
color: #cccccc;



}
.review .rate{
position: relative;
margin-top: 10px;

}
.review .photo{
margin: 0 0 10px 0;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;

}
.review .item time{
float: right;
font-size: 0.9rem;
line-height: 1.2;
}
.review .item dd{
border-top: 1px #ccc dotted;
margin-top: 5px;
padding-top: 5px;

}
.review .star:before,
.review .star:after{
content: '★★★★★';
}
.review .star:after{
position: absolute;
z-index: 1;
top: 0;
left: 0;
overflow: hidden;
white-space: nowrap;
color: #ffcf32;
}
.review .star[data-rate="5"]:after{ width: 100%; }
.review .star[data-rate="4.5"]:after{ width: 90%; }
.review .star[data-rate="4"]:after{ width: 80%; }
.review .star[data-rate="3.5"]:after{ width: 70%; }
.review .star[data-rate="3"]:after{ width: 60%; }
.review .star[data-rate="2.5"]:after{ width: 50%; }
.review .star[data-rate="2"]:after{ width: 40%; }
.review .star[data-rate="1.5"]:after{ width: 30%; }
.review .star[data-rate="1"]:after{ width: 20%; }
.review .star[data-rate="0.5"]:after{ width: 10%; }
.review .star[data-rate="0"]:after{ width: 0%; }
.review .rate > a{
display: inline-block;
width: 35px;
height: 35px;
text-decoration: none;


}
.review .photo img{
display: inline-block;
max-width: 150px;
height: auto;

}
.review .item dd+dt{
margin-top: 20px;
}
.review .rate > a:before{
content: "★";
color: #cccccc;
font-size: 35px;
}
.review .rate > a.active:before{
content: "★";
color: #ffcf32;
}
.review .photo img+img{
margin-left: 5px;
}

@media all and (min-width:1025px) {
}