
/*トップページブログ*/

.message{
	margin: 5% auto 10%;
	position: relative;
	z-index: 10;
	position: relative;
}
.message .backphoto{
	position: relative;
	width: 100%;
}
.message .backphoto img{
	width: 100%;
}
.message .message_btn{
	width: 70%;
	position: absolute;
	left: 0;
	bottom: -8%;
	background: #fff;
	padding: 20px 10%;
}

.message .message_btn a{
	color: #16181e;
}
.message .message_btn h2{
	text-align: left;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 4.0rem;
}
.message .message_btn p{
	font-size: 2.0rem;
}
.message .message_btn .btn{
	text-align: right;
	margin: 0 0 0 auto;
}

.profile{
	margin: 5% auto 10%;
	position: relative;
	z-index: 10;
	position: relative;
}
.profile .backphoto{
	position: relative;
	width: 100%;
}
.profile .backphoto img{
	width: 100%;
}
.profile .profile_btn{
	width: 70%;
	position: absolute;
	right: 0;
	top: -8%;
	background: #fff;
	padding: 20px 10%;
}

.profile .profile_btn a{
	color: #16181e;
}
.profile .profile_btn h2{
	text-align: left;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 4.0rem;
}
.profile .profile_btn p{
	font-size: 2.0rem;
}
.profile .profile_btn .btn{
	text-align: right;
	margin: 0 0 0 auto;
}
.works{
	margin: 5% auto;
	position: relative;
}
.works h2{
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 4.5rem;
	color: #fff;
}
.works p{
	font-size: 2.0rem;
	text-align: center;
	color: #fff;
	margin-bottom: 3%;
}
.works .works_btn{
	margin: 0 auto 3%;
}
.works .works_btn .wwaku{
	background: #fff;
	width: 80%;
	margin: -5% auto 0;
	padding: 20px 5%;
	z-index: 10;
	position: relative;
}
.works .works_btn p{
	color: #111;
	text-align: center;
	font-size: 1.6rem;
}

.works .works_btn .btn{
	text-align: center;
	margin: 0 auto;
	color: #111;
}
.contact{
	margin: 5% auto;
	position: relative;
}
.contact h2{
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 4.5rem;
	color: #fff;
}
.contact p{
	font-size: 2.0rem;
	text-align: center;
	color: #fff;
	margin-bottom: 3%;
}
.contact .tel{
	width: 50%;
	padding: 20px;
}
.contact .form{
	width: 50%;
	padding: 20px;
}
@media only screen and (min-width:1px) and (max-width: 960px) {

.message .message_btn h2,
.profile .profile_btn h2,
.works h2,
.contact h2{
	font-size: 3.0rem;
}
.message .message_btn p,
.profile .profile_btn p,
.works p,
.contact p{
	font-size: 1.8rem;
}
	
	
}
@media only screen and (min-width:1px) and (max-width: 768px) {
.message .message_btn h2,
.profile .profile_btn h2,
.works h2,
.contact h2{
	font-size: 2.8rem;
}
.message .message_btn p,
.profile .profile_btn p,
.works p,
.contact p{
	font-size: 1.6rem;
}
.message .message_btn,
.profile .profile_btn{
	padding: 10px 8%;
}
.message .message_btn .btn,
.profile .profile_btn .btn,
.works .btn{
	font-size: 1.3rem;
}
.works .works_btn p{
	font-size: 1.5rem;
}

}
@media only screen and (min-width:1px) and (max-width: 480px) {
.message .message_btn h2,
.profile .profile_btn h2,
.works h2,
.contact h2{
	font-size: 2.2rem;
}
.message .message_btn p,
.profile .profile_btn p,
.works p,
.contact p{
	font-size: 1.4rem;
}
.works .works_btn p{
	font-size: 1.4rem;
}
	
.contact .tel{
	width: 80%;
	padding: 10px;
	margin: 0 10%;
}
.contact .form{
	width: 80%;
	padding: 10px;
	margin: 0 10%;
}
}

