@charset "UTF-8";
body{background:#fff}


/*ヒーロー画像フェードイン*/
div.animation_box {
  padding:30px 10px 10px;
  animation: 1s zoomFadeIn forwards;
}
@keyframes zoomFadeIn {
  0% {
    opacity: 0.3;
    transform: scale(0.3);
  }
  90% {
    opacity: 1;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
div.animation_box2 {
  padding:10px;
  animation: 1.2s zoomFadeIn forwards;
}


/* 折り畳みここから */
.readmore {
  position: relative;
  margin: 20px auto 0;
  padding: 0 0 75px;
}
.readmore label {
  position: absolute;
  display: table;
  left: 50%;
  bottom: 0;
  margin: 0 auto;
  width: 200px;
  padding: 10px 0;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background-color: #333;
  transform: translateX(-50%);
  cursor: pointer;
  z-index: 1;
}
.readmore label::before{
  content: '続きを見る';
}
.readmore input[type="checkbox"]:checked ~ label::before {
  content: '元に戻す';
}
.readmore input[type="checkbox"]{
  display: none;
}
.readmore-content {
  position: relative;
  height: 650px;
  overflow: hidden;
}
.readmore-content::before {
  position: absolute;
  display: block;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  height: 75px;
  background: linear-gradient( rgba(255,255,255,0) 0%, rgba(230,0,18,0.8) 50%, #e60012 100%);
}
.readmore input[type="checkbox"]:checked ~ .readmore-content {
  height: auto;
}
.readmore input[type="checkbox"]:checked ~ .readmore-content::before {
  display: none;
}
/* 折り畳みここまで*/



a,a:hover{color:#0645ad}
h1{/*font-size:1.75em;color:#e60012;margin:10px*/}
h2{
    font-size:1.6em;
    text-align:center;
    font-weight: bold;
    margin :0 auto 40px; 
    width: fit-content;
    position: relative;
    padding: .5em .7em;
    border: 3px solid #333333;
    color: #333333;
    background-color: #fff;
}
h2::before,
h2::after {
    position: absolute;
    border: solid #333333;
    content: '';
}
h2::before {
    top: 2px;
    right: -12px;
    transform: skewY(45deg);
    width: 8px;
    height: 100%;
    border-width: 3px 2px 2px 0;
    background-color: #333333;
}
h2::after {
    bottom: -12px;
    left: 2px;
    transform: skewX(45deg);
    width: 100%;
    height: 6px;
    border-width: 0 2px 3px 4px;
    background-color: #333333;
}
h3 {
	font-size: 1.6em;
  font-weight: bold;
  margin: 30px auto 10px;
  padding:10px;
  background-color: rgba(255, 220, 220, 0.5);
  border-bottom:1px solid #ffd4d4 ;
}
h3.headingno::before {
	/*content: attr(data-number);
	display: inline-block;
	margin-right: 14px;
  border:1px solid #fff;
  padding:10px;
  */
}
.h3comment {margin:10px 0 20px 10px; font-size:0.9em;}

.mt10 {margin-top:10px!important;}
.mt20 {margin-top:20px!important;}
.mt30 {margin-top:30px!important;}
.mt40 {margin-top:40px!important;}
.mt50 {margin-top:50px!important;}

.mb10 {margin-bottom:10px!important;}
.mb20 {margin-bottom:20px!important;}
.mb30 {margin-bottom:30px!important;}
.mb40 {margin-bottom:40px!important;}
.mb50 {margin-bottom:50px!important;}

.seat{ margin-bottom:20px; padding:20px; display:block; box-sizing: border-box;}
.seat img { text-align: center; margin:0 auto; width:100%; display:block;}
.note{font-size:0.8em;text-align:left;margin:5px 0 0}
.bold {font-weight:bold;}
.text_20em {font-size:2.0em;}
.text_16em {font-size:1.6em;}
.text_14em {font-size:1.4em;}
.text_12em {font-size:1.2em;}
.text_08em {font-size:0.8em;}
.tac { text-align: center; }
.text_w { color:#fff; }

.maxwidth500 {max-width:500px!important; margin:0 auto;}
.maxwidth800 {max-width:800px!important; margin:0 auto;}
.maxwidth1000 {max-width:1000px!important; margin:0 auto;}
.maxwidth1200 {max-width:1200px!important; margin:0 auto;}

.block4 a {font-size:0.8em;text-decoration: none;}

.img_circle { border-radius:50%; border:3px solid #e60012; box-shadow: 3px 3px 2px 1px rgb(105, 105, 105);}
.event_link { /*padding-top: 10px; */display: grid; border:2px solid #e60012; border-radius:4px; background-color: #e60012;margin:-8px;padding:4px; box-shadow: 3px 3px 2px 1px rgb(105, 105, 105);color:#fff;height:40px;align-items: center;}

.store_name {font-size:1.2em; border-bottom:3px solid #ffffff;color:#fff;margin-top:40px;}

.meisterblock {background-color:#fff; border:1px solid #a1a1a1;padding:5px;margin:5px;}
.meisterrank1, .meisterrank2 {font-size:0.8em;margin-top:5px;}
.meisterrank1:before {content: "★";color:#ffbb00;}
.meisterrank2:before {content: "★★";color:#ffbb00;}
.meistername {font-size:0.8em;}
.meistersegment {font-size:0.8em;}
.meistercomment1 {font-size:0.8em;font-weight:bold;margin-top:10px;}
.meistercomment2 {font-size:0.8em;}
.imgRadius {border-radius: 10px;}

a.button{text-align:center;display:block;padding:10px;margin:10px;border-radius:5px;background:#70c13f;color:#fff;font-weight:bold;}
.button_green { text-align:center;display:block;padding:10px;margin:10px 25px;border-radius:5px;background:#70c13f;color:#fff;font-weight:bold; }
.contents08 a {text-decoration: none;}

.contents01 {background-color: #e60012;position: relative; margin-bottom:50px;}
.contents01::before  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    /*transform: skewY(3deg) translateY(60px);*/
    z-index: -1;
}

.contents02 {margin-bottom:60px;}

.contents03 { position: relative; padding-top:100px;padding-bottom:20px;}
.contents03::before  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(-5deg) translateY(50px);
    z-index: -1;
}
.contents03::after  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(5deg) translateY(50px);
    z-index: -1;
}

.contents04 {padding-top:80px;}

.contents05 { position: relative; padding-top:100px;padding-bottom:20px;margin-bottom:100px;}
.contents05::before  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(-5deg) translateY(50px);
    z-index: -1;
}
.contents05::after  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(5deg) translateY(50px);
    z-index: -1;
}

.contents06 {padding-top:80px;}

.contents07 { position: relative; padding-top:100px;padding-bottom:20px;margin-bottom:100px;}
.contents07::before  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(-5deg) translateY(50px);
    z-index: -1;
}
.contents07::after  { content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e60012;
    transform: skewY(5deg) translateY(50px);
    z-index: -1;
}

.contents08 {padding-top:50px;}

  .block32 {
		width: 62%;
		padding: 5px 2px;
		marign: 0;
		float: left;
	}
  .block31 {
		width: 31%;
		padding: 5px 2px;
		marign: 0;
		float: left;
	}


@media screen and (min-width: 640px){

	.commentblock {display:flex;}
	.seat img{width:100%; max-width:1000px;}
	.pc_w1200 {max-width: 1200px;margin:0 auto;}
	.pc_text_14em {font-size:1.4em;}

	.block2 {
		width: 47%;
		padding: 5px 1.5%;
		marign: 0;
		float: left;
		_width: 49.5%;
	}
	.block3 {
		width: 31%;
		padding: 5px 2.5%;
		marign: 0;
		float: left;
		_width: 32%;
	}
	.block4 {
		width: 20%;
		padding: 5px 1.5%;
		marign: 0;
		float: left;
		_width: 22%;
	}
	#c05 .block4 {
		width: 22%;
		padding: 10px;
		float: left;
	}

	/* モバイル専用項目(PCで非表示) */
	.sp_only{display:none}

	.contents03 {margin-bottom: 100px;}

}


/* モバイル表示モード */
@media screen and (max-width: 639px){
  div.animation_box { padding:0;}
	h1{/*background:#fff;font-size:1.2em;border-top:1px solid #ccc;border-bottom:3px solid #ccc;margin:0;padding:10px;*/}
	h2{font-size:1.4em;text-align:center}
	h3{font-size:1.2em;}
  .h3comment {margin:0 0 20px; font-size:0.75em;}

	.seat img{width:100%}
	.sp_text_06em { font-size:0.6em;}
	.sp_text_08em { font-size:0.8em;}
  .sp_text_1em { font-size:1em;}
  .sp_text_11em { font-size:1.1em;}
	.sp_text_12em { font-size:1.2em;}
  .sp_text_14em { font-size:1.4em;}
	.sp_tal {text-align: left;}

  .readmore-content { height: 1200px;}
  
  .contents01 { margin-bottom:50px;}
	.contents01::before { /*transform: skewY(3deg) translateY(20px);*/}
	.contents02 { padding-top:0;padding-bottom:20px; margin-bottom:0;}
	.contents03 { padding-top:100px;padding-bottom:10px;}
	.contents04 { padding-top:100px;padding-bottom:10px;}
	.contents05 { padding-top:100px;padding-bottom:10px;}

	.block4 {
		width: 42%;
		padding: 10px 3.5%;
		marign: 0;
		float: left;
		_width: 45%;
	}
  #c05 .block4 {
		width: 90%;
	}
  .event_link { height:60px; }


	/* PC専用項目(スマホで非表示) */
	.pc_only{display:none !important}
}