@charset "UTF-8";

#greeting h2 {
	margin-bottom: -0.2em;
	font-size: 19px;
	letter-spacing: 0.08em;
}
#greeting p {
	margin-top: 1.1em;
	font-size: 16px;
	line-height: 1.14;
	letter-spacing: -0.01em;
}
#news h2 {
	margin-bottom:  0.7em;
	margin-left:-0.3em;
	font-size: 21px;
	letter-spacing: 0.08em;
}
#news p {		/*202011114 Yukari edit*/
	margin-top: 0.4em;
	font-size: 16px;
	line-height: 1.4em;
	letter-spacing: -0.01em;
}

#top-navi h2, .to-detail {font-weight: 700;}
#top-navi h2 {
	font-size: 20.4px;
	letter-spacing: 0.11em;
}
#top-navi a {text-decoration: none;}
.explanation {
	font-weight: 500;
	text-align: left;
}
.to-detail {
	text-align: right;
	letter-spacing: 0.08em;
}

@media only screen and (min-width: 639px) {
	main {padding-bottom: 39px;}
	
	#greeting {
		padding: 3.9% 4.5% 1.4%;
		margin-bottom: 4.7%;
	}
	#sns {		/*20201114 Yukari edit*/
	text-align: right;
	}
	#sns li.btn_blog {		/*20201212 Yukari edit*/
		display: inline-block;
		vertical-align: top;
		max-width:200px;
		width: 45%;		/*200px*/
		margin: 1.4% 0.5% 1.4%;
		
	}
	#sns li.btn_note {		/*20201219 Yukari edit*/
		display: inline-block;
		max-width:120px;
		width: 22%;		/*120px*/
		margin: 2.1% 0.5% 1.4% 1.8%;
		
	}
	#sns li.sns_icon {		/*20201114 Yukari edit*/
		display: inline-block;
		vertical-align: top;
		max-width:50px;
		width: 10%;
		margin: 1.4% 0.5% 1.4%;
		
	}

	#news {		/*20201114 Yukari edit*/
		width:93%;
		height:380px;	/*20201212 height:105px; 20211229 height:240px; 20220225edit 510*/
		overflow:auto;
		padding: 1.4% 3.5% 1.4%;
		margin-top: 1.7em;
		margin-bottom: 0;
		background-color:#f1dff6;
	}
	
	.news_text {/* 20220228edit*/
		margin-top:1.2%;/*12px*/
		margin-bottom:1.2%;/*12px*/
		font-size:94% !important;
		color:#000080;
		width:100%;
	}
	
	.news_text_s {/* 20220228edit*/
		margin-top:1.2%;/*12px*/
		margin-left:3.8%;
		font-size:83% !important;
		width:90%;
	}
	
	.news_booking {
		float:left;
		margin-top:2%;
		color:#ff0000;
		width:75%;
		text-align:right;
	}
	
	.news_mail_qr {/* 202200404edit*/
		width:20%;
		float:right;
		margin-top:-11%;
	}	
	
	.evposter {/* 20220225edit*/
		float:left;
		margin-left:60px;
		margin-top:-10px;
		width:20%;
	}
	
	#top-navi h2 {
		padding-bottom: 0.55em;
		text-align: center;
	}
	.explanation {
		padding-top: 1.2em;
		font-size: 13.3px;
		letter-spacing: 0.1em;
		line-height: 1.21;
	}
	.explanation p:not(:last-child) {margin-bottom: 1.2em;}
	.top-navi-img {text-align: center;}
	.to-detail {
		padding : 1.1em 1em 0 0;
		font-size: 14px;
	}
}
@media only screen and (max-width: 839px) {
	.evposter {/* 20220228edit*/
		display:none;
	}
}
@media only screen and (max-width: 638px) {
	main {padding-bottom: 6.5%;}
	
	#greeting {
		padding: 1.23em 4% 7.7%;
		margin-bottom: 3.7%;
	}
	#sns {		/*20201212 Yukari edit*/
	text-align: right;
	padding-top:3.0em;	/*20201212 padding-top:1.6em;*/
	}
	#sns li.btn_blog {		/*20201212 Yukari edit*/
		display: inline-block;
		vertical-align: bottom;
		width: 45%;
		margin: 1.4% 0.5% 1.4%;
		
	}
	#sns li.btn_note {		/*20201219 Yukari edit*/
		display: inline-block;
		vertical-align: top;
		width: 22%;
		margin: 6.0% 0.5% 1.4% 1.8%;
		
	}
	#sns li.sns_icon {		/*20201114 Yukari edit*/
		display: inline-block;
		vertical-align: bottom;
		width: 10%;			//*20201219 Yukari edit*/
		margin: 1.4% 0.5% 1.4%;
		
	}
	#news {/*20201114 Yukari edit*/
		width:90%;
		height:260px;	/*20201212 height:80px;*/
		overflow:auto;
		padding: 1.23em 4% 7.7%;
		margin-top: 1.7em;
		margin-bottom: 3.7%;
		margin-left:0.5em;
		background-color:#f1dff6;
	}
	#news h2 {
	margin-bottom:  0.7em;
	margin-left:-0.3em;
	font-size: 19px;
	letter-spacing: 0.08em;
	}
	
	.news_text {/* 20220228edit*/
		margin-top:1.2%;/*12px*/
		margin-bottom:1.2%;/*12px*/
		font-size:98% !important;
		color:#000080;
		width:100%;
	}
	
	.news_text_s {/* 20220228edit*/
		margin-top:1.2%;/*12px*/
		margin-left:3.8%;
		font-size:90% !important;
		width:90%;
	}
	
	.news_text_li {/* 20220228edit*/
		font-size:90% !important;
		margin-left:-4%;
	}
	
	.news_booking {
		float:left;
		margin-top:2%;
		color:#ff0000;
		width:70%;
		text-align:right;
	}
	
	.news_mail_qr {/* 202200404edit*/
		width:20%;
		float:right;
		margin-top:-3%;
		margin-right:-2%;
	}

	.evposter {/* 20220228edit*/
		display:none;
	}

	#top-navi section {font-size: 15.5px;}
	#top-navi li:not(:first-child) {margin-top: 2.5%;}
	#top-navi h2 {padding-bottom: 0.22em;}
	.explanation {
		letter-spacing: 0.08em;
		line-height: 1.16;
	}
	#haruhi-name {margin-top: 0.2em;}
	.explanation p:not(:first-child) {margin-top: 0.5em;}
	.to-detail {
		padding: 0.5em 0 0 0;
		margin-right: -0.5em;
		font-size: 16.3px;
	}
}


/*----- for old PC -----*/
@media only screen and (min-width: 639px) {
	#top-navi {text-align: center;}
	
	#top-navi li {
		display: inline-block;
		vertical-align: top;
		width: 21.1%;
		margin: 0 1.1%;
	}
	
	/*----- flex -----*/
	#top-navi {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: center;
		align-items: stretch;
	}
	#top-navi section {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: stretch;
		
		height: 100%;
	}
	#top-navi h2, .top-navi-img, .to-detail {flex: 0 1 auto;}
	.explanation {flex: 1 0 auto;}
}

/*----- for modern PC (grid & contents) -----*/
@supports( (display: contents) and (display: grid) ) {
	@media only screen and (min-width: 639px) {
		#top-navi {
			display: grid;
			grid-template: auto auto auto auto/1fr 1fr 1fr 1fr;
			grid-auto-flow: column;
			grid-gap: 0 2.417582%;
			grid-column-gap: calc(22 * 100% / 910);
			margin: 0 4.5%;
		}
		#top-navi li, #top-navi section {display: contents;}
	}
}

/*----- for old mobile -----*/
@media only screen and (max-width: 638px) {
	#top-navi section {
		position: relative;
		padding: 20.376175% 4% 0 41.84219%;
	}
	.top-navi-img {
		position: absolute;
		top: 0;
		left: 4%;
		width: 33.977455%;
	}
	#top-navi h2 {margin-top: -37.623706%;}
}

/*----- for modern mobile (grid) -----*/
@supports(display: grid) {
	@media only screen and (max-width: 638px) {
		#top-navi section {
			display: grid;
			grid-template: auto auto auto/35.947935% auto;
			grid-template-columns: calc( 211 * 100% / (638 * 0.92) ) auto;
			grid-auto-flow: column;
			grid-gap: 0 4.088864%;
			grid-column-gap: calc( 24 * 100% / (638 * 0.92) );
			padding: 0;
			margin: 0 4%;
		}
		.top-navi-img {
			position: static;
			width: auto;
			grid-area: 1/1/4/2;
		}
		#top-navi h2 {margin-top: 0;}
	}
}