/* CSS Document */


 /*--------------------------------------
背景設定CSS
---------------------------------------*/


.bg_takano {
	background: #DCBEEF;
	background: linear-gradient(90deg,rgba(220, 190, 239, 1) 0%, rgba(176, 172, 206, 1) 100%);
}

.bg_takano02 {
  background-color: #EFEFEF;
}

.bg_top {
  background-image: url("../img/bg_top.png");
	width: 100%;
	max-width: 100%;
	background-size: 100% auto;
	background-position: 0px 100%;
	background-repeat: no-repeat;
}

.bg_under {
  background-image: url("../img/bg_under.png");
	width: 100%;
	max-width: 100%;
	background-size: 100% auto;
	background-position: bottom;
	background-repeat: no-repeat;
}


.kadomaru{
	border-radius: 20px;
}



button_b.button_b,
a.button_b {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 125%;
    font-weight: bold;
	color: #FFFFFF;
    display: block;
    text-align: center;
    width: 100%;
    max-width: 500px;
	background: #1d2463;
    margin: 1em auto;
    padding: 0.6em 1em;
    border-radius: 1.1em;/*角丸*/
    position: relative;
    transition: all 0.5s;/*なめらかに色変える*/
}



 /*--------------------------------------
youtube
---------------------------------------*/
.youtube01 {
	wide:100%;
	height:500px
}

@media screen and (max-width: 768px) {
.youtube01 {
	wide:100%;
	height:300px
}
}




 /*--------------------------------------
──── 囲み文字 ────
---------------------------------------*/
.title_txt p {
    font-size: 200%;
    line-height: 1.3;
	text-align:center;

}

@media screen and (max-width: 768px) {
.title_txt p {
    font-size: 130%;
}
}



/*--------------------------------------
↓↓↓↓↓↓↓↓スマホ設定↓↓↓↓↓↓↓↓
---------------------------------------*/

/*PCスマホ表示なし*/
.pc { display:block; }
.pc_in { display:inline-block; }
.sp { display:none; }
@media screen and (max-width:767px){
	.pc { display:none; }
	.pc_in { display:none; }
	.sp { display:block; }
}

/*--------------------------------------
背景切り替え画像　最前面に配置
---------------------------------------*/
.z-index-1{
    position: absolute;
    z-index: 1;
}



/*--------------------------------------
レイアウト関連
---------------------------------------*/
/*----両端ぴったり横並び----*/
.items {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin:-5px;/*----両端の間隔を相殺----*/
}
.items .item_2 {
  width: 50%;
  text-align: center;
}
.items .item_3 {
  width: 33%;
  text-align: center;
}
.items .item_4 {
  width: 25%;
  text-align: center;
}



.items .item_5 {
  width: 100%;
  text-align: center;
}


.item-img {
  padding: 5px;/*----最小の間隔を指定----*/

}
.item-body {
  padding: 0;
}


/*--------------------------------------
文字点滅
---------------------------------------*/

.blinking{
    -webkit-animation:blink 1s ease-in-out infinite alternate;
    -moz-animation:blink 1s ease-in-out infinite alternate;
    animation:blink 1s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

/*--------------------------------------
TOPICS(おしらせ)
---------------------------------------*/


/*AT詳細 背景設定*/
.bg_at {
  padding: 0 60px;}

.topics{
	padding: 3em 0;
}


.topics p{
	color: #ffffff;
	font-size: 110%;
	font-weight: bold;

	
}

.x_border{
	border: solid 1px #ffffff;
	width: 70%;
	margin: 0 15% ;
}

.x_border a{
  color: #ffffff;
}

.bg_kadomaru {
	border-radius:30px;
	padding: 2%;
}



@media screen and (max-width: 767px){
	
/*AT詳細 背景設定*/
.bg_at {
  padding: 0 20px;}

.topics{
	padding: 5px 0;
}
	
.topics p{
	font-size: 80%;
}
	
	
.x_border{
	border: solid 1px #ffffff;
	width: 90%;
	margin: 0 5% ;
}
	
.bg_kadomaru{
	border-radius: 0.5em;
	padding: 10px;
}
	
	

	
}



/* スクロールバー デコ */

.scrollArea{
	height: 200px;
	overflow: auto;
	padding-right: 20px;
}


/*スクロールバーの横幅指定*/
.scrollArea.deco::-webkit-scrollbar {
    width: 15px;
}
/*スクロールバーの背景色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-track {
  border-radius: 10px;
	background: #f2f2f2;
}
/*スクロールバーの色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-thumb {
  border-radius: 10px;
	background:#baaf56;
}



 /*--------------------------------------
イベント 横スクロースcss
---------------------------------------*/


.event-list {
	overflow-x:scroll;
	display: flex;
	white-space: nowrap;/*要素を横にはみ出させる*/
	width: 100%;
	-webkit-overflow-scrolling: touch;
}


.event-list::-webkit-scrollbar {
  display: none;/*スクロールバー非表示*/
	
	
}

.event-list li{
    margin-bottom: 0px;
}



.event-bana  {
	width: 50%;
	padding: 10px;
	vertical-align: top;/*要素を上揃えに*/
	flex-shrink: 0;
	display: inline-block;
    white-space: normal;
}	

.event-bana img  {
	width: 100%;
}	

.event-bana_  {
	width:100%;/*バナー画像を横いっぱいに表示するために必要!!*/
	
}	




.event-item  {
	width: 50%;
	font-size: 50px;
	background-color: #024873;
	border-radius: 10px;
	padding: 10px;
	margin: 1% 1%;	
	vertical-align: top;/*要素を上揃えに*/
	flex-shrink: 0;
	display: inline-block;
    white-space: normal;
}	




.event-item img  {
	border-radius: 10px 10px 0 0;
	width: 100%;
}	



.event-item_  {
	width:100%;/*バナー画像を横いっぱいに表示するために必要!!*/
	
}	

.event-title{
	text-align: center;
	font-size: 30%;
	color: #FFFFFF;
	padding: 0px 10px 10px;
	margin: 0px auto;
	line-height: 150%;
	white-space:  normal;/*文字をはみ出させない*/

}	

.event-naiyo{
	display: flex;
	text-align: left;
	font-size: 30%;
	color: #FFFFFF;
	padding: 0px 10px 10px;
	line-height: 150%;
	white-space:  normal;/*文字をはみ出させない*/

}	






@media screen and (max-width:767px){
	
.event-list {
	overflow-x:scroll;
	display: flex;
	white-space: nowrap;/*要素を横にはみ出させる*/
	width: 100%;
}
	

	
	
	
	.event-item  {
	width: 70%;
	font-size: 50px;
	background-color: #024873;
	float: left;
	border-radius: 10px;
	padding: 10px;
	margin: 1% 1%;	
	vertical-align: top;/*要素を上揃えに*/
	flex-shrink: 0;
}
	

		

	
}


 /*--------------------------------------
フォント設定
---------------------------------------*/




.pink_oshi {
font-size: 150%;
color: #ffffff;
background-color: #e4007f;
padding: 10px 0;
font-weight: bold;
width: 100%;
max-width: 100%;
border-radius: 90px;
}






.big_RD {
font-size: 150%;
color: #a10000;
padding: 0 0 10px;
font-weight: bold;
line-height: 1;

}





.serif_font {
	font-family: serif;
	font-size: 180%;
   letter-spacing: 0.1em;
    line-height: 2;
}

.serif_font_ {

	font-size: 180%;
   letter-spacing: 0.1em;
    line-height: 1.5;
}

.kimetsu_font_f {
	font-family: serif;
	font-size: 180%;
   letter-spacing: 0.1em;
    line-height: 1.5;
}


.food_font {
	padding: 30px 0 0 0;
 }

.food_font p{
    line-height: 1.5;
 }

.food_price {
	font-size: 180%;
    line-height: 1.1;
}



@media screen and (max-width:767px){
	
	

.pink_oshi {
font-size: 120%;
color: #ffffff;
background-color: #e4007f;
padding: 10px 0;
font-weight: bold;
width: 100%;
max-width: 100%;
border-radius: 90px;
}

	
	
.big_RD {
font-size: 110%;
color: #a10000;
padding: 0 0 10px;
font-weight: bold;
line-height: 1;

}
	
.serif_font {
	font-family: serif;
	font-size: 90%;
   letter-spacing: 0.1em;
}
	
.serif_font_ {
	font-size: 110%;
   letter-spacing: 0.1em;
}
	
.kimetsu_font_f {
	font-family: serif;
	font-size: 110%;
   letter-spacing: 0.1em;
}
	
}




 /*--------------------------------------
スマホの時だけ改行
---------------------------------------*/
.sma{
    display: none;
}

@media screen and (max-width:768px) {
    .sma{
        display: block;
    }
}



 /*--------------------------------------
固定スライダー設定
---------------------------------------*/

.kimetsu_slider {
	margin: 0 auto;
	width: 100%;
  margin: 0 10%;
}

.slider-img {
  margin: 30px 00px 60px;
}

.slider-pd {
  padding: 0 20px;
}


.slider-img img {
  height: auto;
  width: 100%;
  transform: scale(.8);
  transition: opacity .5s, transform .5s;	
}


/* 中央のスライド */
.slick-center img {
  transform: scale(1); 
	
}

.bg_slider {
	background-image: url("../img/top/bg_slider.png");
	background-size:80% ;
	z-index: 0;
	background-repeat: no-repeat;
	background-position: center;
}


@media screen and (max-width:768px) {
	
.slider-pd {
  padding: 0 15px;
}
	
.slider-img img {
  height: auto;
  width: 100%;
  transform: scale(.9);
  transition: opacity .5s, transform .5s;	
}
	
.slick-center img {
  transform: scale(1.2); 
	
}

}


 /*--------------------------------------
線CSS
---------------------------------------*/
.hr_kimestu hr{
    border-top: solid 7px;
	border-bottom: none;
	border-color:#dcc369;
}

@media screen and (max-width:768px) {
.hr_kimestu hr{
    border-top: solid 4px;
	border-bottom: none;
	border-color:#dcc369;
    }
}

.hr01 hr{
    border-top: 3px dotted;
	padding: 20px 0;
	border-bottom: none;
	border-color:#302C2C;
}













 /*--------------------------------------
飲食用CSS
---------------------------------------*/

.food_take {
    background-color: #baaf56;
	color: #302C2C;
	padding: 8 15px;
	width: 30%;
    border-radius: 50px;
	float: left;
}

.food_take p {
    text-align: center
	
}

@media screen and (max-width:768px) {
.food_take {
    background-color: #baaf56;
	color: #302C2C;
	padding: 3px 10px;
	width: 70%;
    border-radius: 25px;
	float: left;
	}
	}


 /*--------------------------------------
youtbeCSS
---------------------------------------*/
.movie {
	width: 100%; /* 横幅変更 */
	padding: 0;
	box-sizing: border-box;
}

.movie-wrap {
	width: 100%;
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100% ;
}


 /*--------------------------------------
TOP用menuボタン
---------------------------------------*/
/*MENU用 文字囲み*/
.menu_border{
	border: solid 3px #d6b87f;
	padding: 15px;
	background-color: #ffffff;
}

.menu_border a{
  color: #383838;
}


@media screen and (max-width: 767px){
	
.menu_border{
	border: solid 2px #d6b87f;
}
}

/* ボタンのスタイル */
.btn a {
  position: relative;
  display: block;
  text-decoration: none;
  text-align: center;
}

/* アイコンのスタイル */
.btn-circle-right a::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  width: 22px;
  height: 22px;
  margin: auto;
  border-radius: 20px;
  background-color: #d6b87f;
}
.btn-circle-right a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 25px;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 6px solid transparent;
  border-right: 0 solid transparent;
  border-left: 9px solid #ffffff;
  border-bottom: 6px solid transparent;
  box-sizing: border-box;
}


@media screen and (max-width: 767px){
/* アイコンのスタイル */
.btn-circle-right a::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0px;
  width: 22px;
  height: 22px;
  margin: auto;
  border-radius: 20px;
  background-color: #d6b87f;
}
.btn-circle-right a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 5px;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 6px solid transparent;
  border-right: 0 solid transparent;
  border-left: 9px solid #ffffff;
  border-bottom: 6px solid transparent;
  box-sizing: border-box;
}
	}



 /*--------------------------------------
画像文字中央揃え
---------------------------------------*/

.sample {
	width: 100%; 
	display: table;
	text-align: left;
	float: left;
}

.sample p { 
	margin: 0;
	padding: 0;
}

.image_center,
.text_center{
	display: table-cell;
	vertical-align: middle;
	margin: 0;
	/display: inline;
	/zoom: 1;
}



 /*--------------------------------------
チケット購入ボタン
---------------------------------------*/



.btn_v {
 
margin: 0 auto;
  width: 100%;
  max-width:800px;
  display: block;
text-align: center;
  line-height: 1;
  font-size: 140%;
  border-radius: 60px;
   padding: 2%;
  font-weight: bold;
  transition: 0.3s;
  background-color: #a183db;
}

.btn_v a{
   text-decoration: none!important;
    color: #ffffff;
    display: block;
}


.btn_v:hover {
  opacity: 0.7;
  
}


@media screen and (max-width:768px) {
.btn_v {
  font-size: 100%;
}
	}





.hr02 hr{
   border-bottom: solid 2px #383838;
	border-top: none
}