@charset "UTF-8";

/*******************************
 
丸量が選ばれる理由ページCss
 
*******************************/
.page .lead{
	width: 60%;
	max-width: 660px;
	margin: 50px auto;
	font-size: 112.5%;
	line-height: 2;
}

section{
	margin: -90px 0 90px;
	padding-top: 100px;
}

section .wrap-common{
	justify-content: space-between;
	align-items: center;
}
section .img,
section .txt{
	width: 48%;
}
section .img{
	padding: 50px 0;
}
section .txt{
	text-align: left;
	padding: 35px 0 20px;
}

section h3{
	font-size: 400%;
	letter-spacing: .15em;
	line-height: 1;
	color: #e4e9ec;
}
section h3 span{
	display: block;
	text-align: left;
	margin-bottom: -10px;
}
section .head{
	font-size: 180%;
    font-weight: 600;
	margin-bottom: 10px;
}
section .label{
	display: inline-block;
    background: #313131;
    color: #fff;
    padding: 5px 30px;
    border-radius: 40px;
    font-size: 112.5%;
}
section .comment{
	margin: 50px 0 0;
}

section:nth-of-type(odd) .img{
	order: 2;
}
section:nth-of-type(even) .inner{
	background: #e4e9ec;
}
section:nth-of-type(even) h3 span{
	padding-left: 53%;
}

/*==== mobile スマフォ横〜用css ===*/
@media screen and (max-width: 896px){
	section {
		margin: -90px 0 50px;
	}
	section h3 {
		font-size: 320%;
	}
	section h3 span {
		margin-bottom: -5px;
	}
}
/*==== mobile スマフォ縦用css ===*/
@media screen and (max-width: 480px){
	.page .lead {
		width: 90%;
		margin: 30px auto;
	}
	.page .mainimg h2 .top {
		font-size: 180%;
	}
	.page .mainimg h2 .bottom {
		font-size: 100%;
	}
	
	section {
		margin: -70px 0 20px;
		padding-top: 80px;
	}
	section .img, section .txt {
		width: 100%;
	}
	section h3 {
		font-size: 220%;
	}
	section h3 span {
		margin-bottom: -3px;
	}
	section .img {
		order: 1;
		padding: 10px 30px 0;
	}
	section .txt {
		order: 2;
		text-align: center;
		padding: 20px 0;
	}
	section .head {
		font-size: 140%;
	}
	section .comment {
		margin: 30px 0 0;
	}
	
	section .inner {
		padding-top: 20px;
	}
	section:nth-of-type(even) h3 span {
		padding: 0;
	}
	
}