/*==================================
			Top image
====================================*/

#topimage ul li {
	width: 100%;
	line-height: 0;
}
#topimage ul li img {
	width: 100%;
}

#topimage ul.pc {
	display: none;
}

/*==================================
			Main_inner
====================================*/

/*-- h 見出し --*/

#main h2 {
	color: #222;
	font-family: 'Roboto Slab', serif;
	text-align: center;
	line-height: 110%;
}
#main h2 span {
	font-family: 'Noto Sans Japanese', serif;
}
#main h2 span.sub {
	font-size: 12px;
	margin: 4px 0 0 0;
	display: block;
}

/*-- h 個別見出し --*/

.concept h2,
.instagram h2 {
	font-size: 26px;
	padding: 20px 0 0 0;
	margin: 10px 0;
}

/*-- News --*/

.news h2 {
	font-size: 19px;
	padding: 10px 0;
	background-color: #CC3333;

}
.news h2:hover {
	background-color: #99ddff;
}
.news ul {
	padding: 20px;
	background: #eee url(img/back_shasen.png);
	-moz-background-size: 50px auto;
	background-size: 50px auto;
}
.news ul li {
	padding: 0 0 10px 0;
}
.news ul li span {
	color: #666;
	font-family: 'Roboto Slab', serif;
	display: block;
}

/*-- Button --*/

.concept p.button,
.instagram p.button {
	font-size: 18px;
	text-align: center;
	margin: 10px auto;
}
.concept p.button a,
.instagram p.button a {
	padding: 16px 10px;
	margin: 20px 0;
	background-color: #CC3333;
	display: block;
}
.concept p.button a:hover,
.instagram p.button a:hover {
	background-color: #444;
}
.concept p.button a {
	color: #ffffff;
}
.instagram p.button a {
	color: #ffffff;
	margin: 20px 20px;
}

/*-- Concept --*/

.concept {
	padding: 22% 20px 10px 20px;
	background: url(img/back_star_sm.png) 50% 24px no-repeat;
	-moz-background-size: 100% auto;
	background-size: 100% auto;
}

.concept p {
	margin: 20px 0;
}

/*-- Instagram --*/

#gallery {
	padding: 0 20px;
	box-sizing: border-box;
}
#gallery ul {
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}
#gallery ul li {
	position: relative;
	width: 50%;
	height: auto;
	padding: 10px;
	box-sizing: border-box;
}
#gallery ul li .waku {
	position: relative;
	width: 100%;
	padding-top: 100%;
	overflow: hidden;
	margin: 0 auto;
}
#gallery ul li .waku:hover {
	opacity: .8;
	filter: alpha(opacity=80);
}
#gallery ul li .waku img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	max-width: 150%;
	max-height: 150%;
}

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

	/*==================================
				Top image
	====================================*/

	#topimage ul.pc {
		display: block;
	}
	#topimage ul.sm {
		display: none;
	}

	/*==================================
				Main_inner
	====================================*/

	/*-- h 個別見出し --*/

	.concept h2,
	.instagram h2 {
		font-size: 30px;
		padding: 30px 0 0 0;
		margin: 20px 0;
	}

	/*-- News --*/

	.news ul li {
		font-size: 18px;
	}
	.news ul li span {
		margin: 0 1em 0 0;
		display: inline;
	}
	.news ul li a:hover {
		text-decoration: underline;
	}

	/*-- Button --*/

	.concept p.button,
	.instagram p.button {
		width: 300px;
	}
	.concept p.button a,
	.instagram p.button a {
		margin: 50px 0;
	}

	/*-- Concept --*/

	.concept {
		padding: 10% 20px 20px 20px;
		background: url(img/back_star_sm.png) 50% 20px no-repeat;
		-moz-background-size: 60% auto;
		background-size: 60% auto;
	}

	/*-- Instagram --*/

	#gallery ul li {
		width: 25%;
		padding: 16px;
	}

}

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


	/*==================================
				Main_inner
	====================================*/

	/*-- h 個別見出し --*/

	.concept h2,
	.instagram h2 {
		font-size: 36px;
		padding: 60px 0 20px 0;
		margin: 20px 0;
	}

	/*-- News --*/

	.news {
		display: -webkit-flex;
		display: flex;
		align-items: stretch;
		width: 100%;
		background-color: #fff;
	}
	.news h2 {
		width: 400px;
		margin: 0;
		padding: 30px 20px;
	}
	.news ul {
		width: 100%;
	}
	.news ul li {
		padding: 5px 0;
	}

	/*-- Concept --*/

	.concept {
		padding: 60px 0 10px 0;
		background: url(img/back_star_pc.png) 0 100px no-repeat;
		-moz-background-size: 100% auto;
		background-size: 100% auto;
	}

	.concept p {
		width: 68%;
		text-align: center;
		margin: 20px auto;
		display: block;
	}


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

	/*==================================
				Main_inner
	====================================*/

	/*-- Concept --*/

	.concept {
		background: url(img/back_star_pc.png) 50% 70px no-repeat;
		-moz-background-size: 86% auto;
		background-size: 86% auto;
	}
	.concept p {
		width: 60%;
	}

	/*-- Instagram --*/

	#gallery {
		width: 78%;
		padding: 0;
		margin: 0 auto;
		display: block;
	}
	#gallery ul li {
		padding: 20px;
	}

}


	/*==================================
				google cal
	====================================*/

.cal_wrapper {
max-width: 960px;
min-width: 300px;
margin: 2.0833% auto;
}

.googlecal {
position: relative;
padding-bottom: 100%;
height: 0;
}

.googlecal iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}

@media only screen and (min-width: 768px) {
.googlecal { padding-bottom: 75%; }
}