@charset "utf-8";

/* CSS Document */
@media all{
	
html{font-size: 13px;}
body{margin: 0;
	font-family: 'Noto Serif JP', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;}
p,ul,ol,li,dl,dt,dd{margin: 0; padding: 0;}
li{list-style: none;}
	*{
		box-sizing: border-box;
	}

/* cleatfix */
.clearfix {zoom:1;}
.clearfix:after {
	content : ""    ;
	display : block ;
	clear   : both  ;
}

/*ヘッダー*/
#event {background-color: #f0f0f0;}

#event header{width: 100%; text-align: left; background-color: #3A0B00; position: fixed; top: 0; z-index: 2;}
#event header #mainlogo {height: 50px; display: table-cell;}
#event header #mainlogo img{height: 100%; margin: 5px 10px 5px 5px;}
#event header p{display: table-cell; vertical-align: middle; color: #A57A43;}
#event header p a{text-decoration: none; color: #A57A43;}
main #headarea {margin: 0; padding: 0; height: 65px;}

.listindent{display: block; padding-left: 1em; text-indent: -1em;}

.title_j{font-size: 2em; border-bottom: solid 2px #333; padding-bottom: 5px; margin: 0 auto; width: 10em;}
.title_e{font-size: 1.5em; padding: 5px 0; margin-bottom: 30px;}


	#flier{padding: 10px; text-align: center; box-sizing: border-box;}
	#flier img{width: 100%; max-width: 600px; vertical-align: bottom;}

#reserve{padding: 30px 10px; text-align: center; box-sizing: border-box; background-color: #fff; color: #333;}
#reserve p{margin-bottom: 20px;}
#reserve .title{font-size: 1.5em;}
#reserve .exmpl{font-size: 0.8em; color: #FF8500;}
#reserve .exmpl span{word-break: keep-all;}
.line{margin: 10px auto 30px; width: 250px;}
.line a{background-color: #1dcd00; color: #fff; text-align: center; font-size: 1.2em; text-decoration: none; display: block; padding: 20px; box-sizing: border-box; border-radius: 10px;}
.line a:hover{opacity: 0.6}
.reserveform{margin: 10px auto 30px; width: 250px; display: inline-block;}
.reserveform a{background-color: #1A3715; color: #fff; text-align: center; font-size: 1.2em; text-decoration: none; display: block; padding: 20px; box-sizing: border-box; border-radius: 10px;}
.reserveform a:hover{opacity: 0.6}
.icon_phone:before {content: url( ../images/icon_phone_L.png) ; position : relative ; margin-right : 0.1em;}
.icon_phone{font-size: 2.2em;}
.icon_phone a{text-decoration: none; color: #000;}
#reserve hr{width: 100%; max-width: 680px; margin-bottom: 20px;}

#accss{text-align: center; font-family: 'Noto Serif JP', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;}
#accss .title_e {font-size: 2em; margin: 0 0 0.3em;}
	#accss{background-color: #111; color: #f8f8f8; padding: 2em 0 0; font-size: 1.3em;}
	#accss p{margin-bottom: 1em; font-size: 1.1em; line-height: 1.5em;}
	#accss p span{font-weight: 600;}
	#accss iframe{vertical-align: bottom;}

/*マップ*/
#maparea{position: relative; width: 100%;}
#maparea .hiraku{position: absolute; bottom: 40px; left: calc(50% - 50px); background-color: #f0f0f0; padding: 5px; width: 100px; border-radius: 10px; font-size: 16px;}
#maparea .hiraku a{text-decoration: none; color: #000;}
#maparea .hiraku a:hover{text-decoration: underline;}
#maparea .gch_icon{position: absolute; bottom: 150px; left: calc(50% - 36px); width: 72px;}
#maparea .gch_icon img{width: 100%;}
#maparea iframe,#hotel_room iframe{  
  -webkit-filter: brightness(65%) contrast(150%) saturate(10%);
  -moz-filter: brightness(65%) contrast(150%) saturate(10%);
  -ms-filter: brightness(65%) contrast(150%) saturate(10%);
  -o-filter: brightness(65%) contrast(150%) saturate(10%);
  filter: brightness(65%) contrast(150%) saturate(10%);
}
.accssmap{width: 150px; margin: 0 auto 1em;}
.accssmap img{width: 100%;}
.accssmap p{font-size: 0.9em !important;}

/*フッター*/


/*バナー*/
#hata{background-color: #f8f8f8; text-align: center;}
#hata img{width: 100%; vertical-align: bottom;}

/*live配信*/
#livecamera{border-top: 1px solid #000; position: relative; margin-bottom: 1em; transition: .3s;}
.lcbox{width: 90%; max-width: 1000px; margin: 0 auto 1em;}
.lcttl{position: absolute; padding: 0.5em 0 1em; box-sizing: border-box; top: 0; left: 0; width: 100%; height: 100%; text-align: center; font-size: 1.5em; text-decoration: none; color: #000;}
.lctxt{margin-top: 3em;}
.lctxt span{display: block; font-size: 1.3em; color: #0900EF;}

#ytmovie{border-top: 1px solid #000; position: relative;}
.ytmoviebox{width: 90%; max-width: 1000px; margin: 0 auto;}
#instalink{position: relative; padding: 1em 0; box-sizing: border-box;}
	.ytbox{background: #fff;}
.instabox{width: 90%; max-width: 1000px; margin: 0 auto;}
#ytinsta{margin-bottom: 1em;}

.presslist{width: 14em; height: 3em; margin: 2em auto 0; font-size: 1.3rem; border: solid 1px #777; border-radius: 1em;}
.presslist a{display: flex; width: 100%; height: calc(100% - 2px); color: #333; text-decoration: none; justify-content: center; align-items: center; background: #fff; border-radius: 1em;}
.presslist a:hover{opacity: 0.7;}

/*ワードプレス*/
#eventwrap{width: calc(100% - 40px); max-width: 1000px; margin: 0 auto; padding: 60px 0 80px; box-sizing: border-box;}
#eventwrap .article-info{margin-bottom: 0.5em;}
#eventwrap .cat-data{color: #A57A43;}
#eventwrap h1{position: relative; padding-left: 0.7em; box-sizing: border-box; margin: 0 0 2em 0;}
#eventwrap h1::before{content: ""; width: 0.5em; height: 100%; position: absolute; top: 0; left: 0; background: #3A0B00;}
#eventwrap figure{margin: 1em 0 2em;}
#eventwrap figure img{width: 100%; height: auto;}
#eventwrap p{margin-bottom: 1em;}
#eventwrap a{text-decoration: underline; color: #000;}
	.wp-element-button{
		display: block;
		width: fit-content;
		background-color: #333;
		padding: 0.5em 1em;
		border-radius: 1.5em;
		overflow: hidden;
	}

#formttl h1{width: 90%; max-width: 580px; margin: 0 auto; border-bottom: solid 1px #000; font-size: 1.5rem; text-align: center; margin-bottom: 1em;}
	
	#hata .hataami .ig-pagebox #ig-page #gallery{
		margin: 0 auto 30px;
	}
	#hata .hataami .ig-pagebox #ig-page .morebutton{
		width: fit-content;
	}
	.db{
		display: inline-block;
	}
}

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

#contents{width: 100%; padding: 60px 20px 40px; box-sizing: border-box; text-align: center;}
	.eventbox{background: #fff; border-bottom: solid 1px #000;}
	.eventbox li{display: block; width: 100%; padding: 10px; box-sizing: border-box; border-top: solid 1px #000; position: relative;}
	.eventbox li a{color: #000;}
	.eventthumb{width: 100%; padding: 10px; box-sizing: border-box;}
	.eventtxt{width: 100%; padding: 10px; box-sizing: border-box; font-size: 13px;}
	.eventthumb img{width: 50vw; height: calc(50vw * 1.42)}
	.eventttl{font-size: 1.5em; line-height: 1.3em; margin-bottom: 1em;}
	.line2{padding-bottom: 2em; box-sizing: border-box;}
	.eventdscrpt{line-height: 1.5em; text-align: left;}
.eventbox li .eventttl a{text-decoration: none; color: #000; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; padding-top: calc(50vw * 1.42 + 30px); box-sizing: border-box;}
	.eventbox li.link-off{display: none;}
	
#reserve{font-size: 16px;}

	#hata .hataami{padding: 40px 20px;}
	#hata .fb-pagebox,
	#hata .ig-pagebox{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}

	.pconly{display: none;}
	.pdonly{display: none;}	

#promotionMv{
    position:relative;
    width:100%;
    height:0;
    padding-top:75%;
}
#promotionMv iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

	#flyer{
		width: 90%;
		margin: 0 auto 20px;
	}
	.flyer_a{
		margin-bottom: 20px;
	}
	.flyer_a img,.flyer_b img{
		width: 100%;
		height: auto;
	}

}

@media screen and (min-width: 800px), print{

#contents{width: 100%; padding: 80px 40px 80px; box-sizing: border-box; text-align: center;}
	.eventbox{background: #fff; border-bottom: solid 1px #000;}
	.eventbox ul{font-size: 0; text-align: left;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	}
	.eventbox li{width: 50%; padding: 10px; box-sizing: border-box; border-top: solid 1px #000; position: relative; transition: .3s;}
	.eventbox li a{color: #000;}
	.eventthumb{display: inline-block; width: 40%; padding: 20px; box-sizing: border-box; text-align: center;}
	.eventtxt{display: inline-block; width: 60%; padding: 20px; box-sizing: border-box; font-size: 13px; vertical-align: top;}
	.eventthumb img{width: 15vw; height: calc(15vw * 1.42)}
	.eventttl{font-size: 1.5em; line-height: 1.3em; margin-bottom: 1em;}
	.line2{padding-bottom: 2em; box-sizing: border-box;}
	.eventdscrpt{line-height: 1.5em;}
	.eventdscrpt p{
		margin-bottom: 1em;
	}
.eventbox li .eventttl a{text-decoration: none; color: #000; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; padding-top: 20px; padding-left: calc(40% + 20px); box-sizing: border-box;}
	.eventbox li:hover{background: rgba(128,128,128,.2);}
	.eventbox li.link-off:hover{background: none;}
.eventbox li:nth-child(2n):nth-last-child(2) {border-bottom: solid 1px #000}
	
#reserve{font-size: 20px;}

#hata{background: url(/event/images/FB_bg.jpg) no-repeat top center; background-size: cover;}
	#hata .hataami{background-color: rgba(255,255,255,.5); padding: 40px 0;}
	#hata .fb-pagebox,
	#hata .ig-pagebox{
		width: 500px;
		margin-left: auto;
		margin-right: 10%;
	}
	#hata .ig-page{
		width: 100%;
	}

	.sponly{display: none;}

#promotionMv{
width: 560px;
	margin: 20px auto;
}
#promotionMv iframe{

}

/*live配信*/
#livecamera:hover{background: rgba(128,128,128,.2);}
#ytmovie:hover{background: rgba(128,128,128,.2);}
#instalink:hover{background: rgba(128,128,128,.2);}
	
	#flyer{width: 90%; max-width: 1000px; margin: 0 auto 20px; display: table;}
	.flyer_a,.flyer_b{display: table-cell;}
	.flyer_a img,.flyer_b img{
		width: 100%;
		height: auto;
	}

}

@media screen and (min-width: 1280px){
	.pdonly{display: none;}	
}