@charset “utf-8”;

/* top
--------------------------------------------------------- */
.top_wrap {
	overflow: hidden;
	width: 100%;
	height: 90vh;
	max-height: 900px;
	margin-bottom: 40px;
}

.top_wrap a:hover {
	opacity:	0.7;
	-moz-opacity:	0.7;
	filter: alpha(opacity=70);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}


.top_content_crepe,.top_content_galette {
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50%;
	height: 100%;
}

.top_content_crepe {
	float: left;
	background: url(../img/top_bg1_crepe_top.jpg) no-repeat top;
}

.top_content_galette {
	float: right;
	background: url(../img/top_bg2_galette_top.jpg) no-repeat bottom;
}

.top_content_crepe h1,.top_content_galette h1 {
	overflow: hidden;
	width: 300px;
	height: 0;
	padding: 300px 0 0 0;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}

.top_content_crepe h1 {
	background: url(../img/logo1_crepe.jpg) 50% no-repeat;
	background-size: 100%;
}

.top_content_galette h1 {
	background: url(../img/logo2_galette.jpg) 50% no-repeat;
	background-size: 100%;
}

.ecbaner img {
    max-width: 500px;
    text-align: center;
    margin: 0 auto;
}


/* =========================================================
	tablet
========================================================= */
@media screen and (max-width: 1024px) {

/* top
--------------------------------------------------------- */
.top_content_crepe,.top_content_galette {
	background-size: cover;
}
.top_content_crepe h1,.top_content_galette h1 {
	width: 250px;
	padding: 250px 0 0 0;
}

}





/* =========================================================
	smartphone
========================================================= */
@media screen and (max-width: 599px) {

/* top
--------------------------------------------------------- */
.top_wrap a:hover {
	opacity:	1.0;
	-moz-opacity:	1.0;
	filter: alpha(opacity=100);
}
.top_content_crepe,.top_content_galette {
	width: 100%;
	height: 45vh;
}

.top_content_crepe h1,.top_content_galette h1 {
	width: 175px;
	padding: 175px 0 0 0;
}

/* footer
--------------------------------------------------------- */
footer p {
	font-size: 1.2rem;
}

}