@charset "utf-8";

.sec_main_wra {
	max-width:1300px;
	margin:0 auto;
	position:relative;
	background-image:url(../../quality/img/main_bg.jpg);
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
}

.sec_main_wra .sec_main {
	max-width:960px;
	margin:0 auto;
	padding:50px 10px 10px 10px;
}
.sec_main_wra .sec_main .ttl {
	text-align:center;
	margin:0 0 60px 0;
}
.sec_main .main_btn {
	width:100%;
	letter-spacing:-0.4em;
	text-align:center;
}
.sec_main .main_btn li {
	letter-spacing:normal;
	vertical-align:top;
	display:inline-block;
	width:21.875%;
	margin:0 4.166% 10px 0;
}
.sec_main .main_btn li:nth-child(4n) {
	margin:0 0 10px 0;
}
.sec_main .main_btn li a {
	width:100%;
	display:block;
	position:relative;
}
.sec_main .main_btn li a img.on {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	transition:all 0.5s ease-in-out;
	opacity:0;
}
.sec_main .main_btn li a:hover img.on {
	opacity:1;
}
.sec_main .main_btn li a.on img.on {
	opacity:1;
}

.sec_conts {
	max-width:960px;
	margin:0 auto;
	padding:80px 0 40px;
}

.sec_conts .t1 {
	padding:0 0 10px;
	background:url(../../quality/img/line.jpg) center bottom no-repeat;
	text-align:center;
}
.sec_conts .t2 {
	padding:5px 10px 10px 20px;
	border-bottom:1px dotted #857450;
	box-sizing: border-box;
	background:url(../../quality/img/ver_line.png) left top no-repeat;
}

.sec1 .s_area {
	padding:15px;
	width:100%;
	background:url(../../quality/img/bg01.png) left top repeat-y;
	box-sizing: border-box;
	color:#817153;
	min-height:155px;
}

.sec1 .s_area .s_left{
	float:left;
	width:64.52%;	
}

.sec1 .s_area .s_right{
	float:right;
	text-align:center;
	width:32.48%;	
}


.sec1 .s_area .t_hr {
	background-image: -webkit-gradient(linear, left bottom, right bottom, from(#817253), color-stop(0.50, #E1D9C1), to(#FFFEFE));
	width:100%;
	height:2px;
}
.sec1 .s_area .txt1 {
	font-size:16px;
	padding:0 0 0 6%;
	width:100%;
	box-sizing: border-box;
}
.sec1 .txt_area {
	max-width:880px;
	margin:0 auto;
}
.sec1 .txt_area p {
	padding-left: 1em;
	text-indent: -1em;
	font-size:18px;
	line-height:1.6;
	color:#3B3B3B;
}
.sec1 .s_area2 {
	max-width:820px;
	margin:0 auto;
}


.sec_footer_btn {
	max-width:960px;
	margin:0 auto;
	letter-spacing:-0.4em;
	text-align:center;
	padding:0 10px 30px 10px;
}
.sec_footer_btn li {
	letter-spacing:normal;
	vertical-align:top;
	display:inline-block;
	width:21.875%;
	margin:0 4.166% 10px 0;
}
.sec_footer_btn li:nth-child(4n) {
	margin:0 0 10px 0;
}
.sec_footer_btn li a {
	width:100%;
	display:block;
	position:relative;
}
.sec_footer_btn li a img.on {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	transition:all 0.5s ease-in-out;
	opacity:0;
}
.sec_footer_btn li a:hover img.on {
	opacity:1;
}
.sec_footer_btn li a.on img.on {
	opacity:1;
}

.sec2 .s_col {
	width:100%;
}
.sec2 .s_col li.s1 {
	float:left;
	width:49.48%;
}
.sec2 .s_col li.s2 {
	float:right;
	width:47.4%;
}
.sec2 .s_area {
	max-width:884px;
	margin:0 auto;
	padding:28px 28px 10px 28px;
	box-sizing: border-box;
	background:#E5DFCB;
	color:#4D4D4D;
}
.sec2 .txt1 {
	font-size:16px;
	color:#817153;
}
.sec2 .s_col2 {
	width:100%;
}
.sec2 .s_col2 li {
	float:left;
	width:32.01%;
	margin:0 1.985% 0 0;
}
.sec2 .s_col2 li:last-child {
	margin:0 0 0 0;
}
.sec2 .s_line {
	border-top:1px solid #C3B99F;
	border-bottom:1px solid #C3B99F;
	padding:10px 0;
}
.sec2 .s_col3 {
	width:100%;
}
.sec2 .s_col3 li {
	float:left;
	width:33.333%;
	border-right:1px solid #817253;
	padding:0 10px;
	box-sizing: border-box;
}
.sec2 .s_col3 li:first-child {
	padding:0 10px 0 0;
}
.sec2 .s_col3 li:last-child {
	padding:0 0 0 10px;
	border-right:0px;
}
.sec2 .s_col3 li .txt1 {
	padding:0 0 0 4%;
	box-sizing: border-box;
}
.sec2 .t_link {
	text-align:right;
	color:#272727;
}
.sec2 .t_link a {
	text-decoration:underline;
}
.sec2 .t_link a:before {
	content:"▶";
	color:#CD0000;
}
.sec2 .s_area2 {
	max-width:884px;
	margin:0 auto;
}

.sec2 .s_area3 {
	max-width:872px;
	margin:0 6px;
	background:url(../../quality/img/bg01.png) left top repeat-y;
	box-sizing: border-box;
	padding:15px 0;
	position:relative;
	min-height:154px;
}
.sec2 .s_area3:before {
	content:"";
	position:absolute;
	top:-6px;
	left:-6px;
	width:-webkit-calc(100% + 6px);
	width:calc(100% + 6px);
	height:-webkit-calc(100% + 6px);
	height:calc(100% + 6px);
	box-sizing: border-box;
	border:1px solid #817253;
}
.sec2 .s_area3:after {
	content:"";
	position:absolute;
	bottom:-6px;
	right:-6px;
	width:-webkit-calc(100% + 6px);
	width:calc(100% + 6px);
	height:-webkit-calc(100% + 6px);
	height:calc(100% + 6px);
	box-sizing: border-box;
	border:1px solid #817253;
}


.sec2 .s_area3 .s_view {
	position:relative;
	z-index:2;
}
.sec2 .s_area3 .g1 {
	padding:0 0 0 2%;
	width:66%;
}
.sec2 .s_area3 .t_hr {
	background-image: -webkit-gradient(linear, left bottom, right bottom, from(#817253), color-stop(0.50, #E1D9C1), to(#FFFEFE));
	width:100%;
	height:1px;
}
.sec2 .s_area3 .g2 {
	position:absolute;
	top:-5px;
	right:1%;
	width:28.09%;
	text-align:right;
}
.sec2 .s_area3 .g3 {
	padding:0 3%;
	width:94%;
}
.sec2 .s_col4 {
	width:100%;
}
.sec2 .s_col4 li.s1 {
	float:left;
	width:48.65%;
}
.sec2 .s_col4 li.s2 {
	float:right;
	width:48.65%;
}
.sec2 .s_area4 {
	background:url(../../quality/img/bg02.png) left top repeat-y;
	min-height:145px;
}

.sec3 .s_col {
	width:100%;
}
.sec3 .s_col li.s1 {
	float:left;
	width:40.625%;
}
.sec3 .s_col li.s2 {
	float:right;
	width:56.25%;
}
.sec3 .s_col2 {
	width:100%;
}
.sec3 .s_col2 li.s1 {
	float:left;
	width:47.92%;
}
.sec3 .s_col2 li.s2 {
	float:right;
	width:47.92%;
}
.sec3 .s_area {
	background:url(../../quality/img/p3/bg01.png) left bottom repeat-x;
	padding:16px;
	box-sizing: border-box;
	color:#817153;
	font-size:14px;
}
.sec3 .s_area2 {
	background:url(../../quality/img/p3/bg02.png) left bottom repeat-x;
}
.sec3 .s_col2 li dl {
	width:100%;
}
.sec3 .s_col2 li dl dt {
	float:left;
	width:32.25%;
}
.sec3 .s_col2 li dl dd {
	float:right;
	width:64.59%;
}

.sec3 .g1 {
	border-bottom:1px solid #97886A;
	padding:0 0 10px;
	text-align:center;
}

.sec4 .s_area {
	max-width:930px;
	margin:0 auto;
}
.sec4 .txt1 {
	font-size:170%;
	color:#817153;
}
.sec4 .txt2 {
	font-size:16px;
	color:#817153;
}
.sec4 .s_col {
	width:100%;
}
.sec4 .s_col li.s1 {
	float:left;
	width:50%;
}
.sec4 .s_col li.s2 {
	float:right;
	width:47.75%;
}
.sec4 .g1 {
	width:100%;
	border-left:4px solid #9B8542;
	padding:10px 10px 10px 14px;
	box-sizing: border-box;
	background-image: -webkit-gradient(linear, left bottom, right bottom, from(#E0D8C0), color-stop(0.50, #F5F3EB), to(#FFFEFE));
}

.sec4 .s_area2 {
	max-width:900px;
	margin:0 auto;
}

.sec4 .s_area3 {
	max-width:884px;
	margin:0 6px;
	box-sizing: border-box;
	padding:15px 0;
	position:relative;
	min-height:160px;
}
.sec4 .s_area3:before {
	content:"";
	position:absolute;
	top:-6px;
	left:-6px;
	width:-webkit-calc(100% + 6px);
	width:calc(100% + 6px);
	height:-webkit-calc(100% + 6px);
	height:calc(100% + 6px);
	box-sizing: border-box;
	border:1px solid #817253;
	background-color: #fff;
}
.sec4 .s_area3:after {
	content:"";
	position:absolute;
	bottom:-6px;
	right:-6px;
	width:-webkit-calc(100% + 6px);
	width:calc(100% + 6px);
	height:-webkit-calc(100% + 6px);
	height:calc(100% + 6px);
	box-sizing: border-box;
	border:1px solid #817253;
	background-color: #fff;
}

.sec4 .s_area3 .g2 {
	padding:0 20px;
	box-sizing: border-box;
}

.sec4 .s_area3 .s_hr {
	width:100%;
	height:1px;
	box-sizing: border-box;
	background-image: -webkit-gradient(linear, left bottom, right bottom, from(#8B7D60), color-stop(0.50, #E2DAC3), to(#FEFEFE));
}
.sec4 .s_area3 .s_view {
	position:relative;
	z-index:2;
}
.sec4 .s_area3 .s_cap p {
	padding-left:2.5em;
	text-indent:-2.5em;
}

.sec4 .s_cap2 {
	max-width:840px;
	margin:0 auto;
	font-size: 12px;
}
.sec4 .s_cap2 p {
	padding-left:1em;
	text-indent:-1em;
}


@media screen and (max-width: 767px) {
	
	.sec_main_wra .sec_main {
		padding:8% 10px 2% 10px;
	}
	.sec_main_wra .sec_main .ttl {
		margin:0 0 8% 0;
	}

	.sec_main .main_btn {
		max-width:460px;
		margin:0 auto;
	}
	.sec_main .main_btn li {
		width:45.66%;
		margin:0 8.68% 10px 0;
	}
	.sec_main .main_btn li:nth-child(2n) {
		margin:0 0 10px 0;
	}
	.sec_conts {
		padding:10% 10px 10% 10px;
	}

	.sec_footer_btn {
		max-width:460px;
		margin:0 auto;
	}
	.sec_footer_btn li {
		width:45.66%;
		margin:0 8.68% 10px 0;
	}
	.sec_footer_btn li:nth-child(2n) {
		margin:0 0 10px 0;
	}

	.sec2 .s_col li.s1 {
		float:none;
		width:100%;
		text-align:center;
		margin:0 0 4%;
	}
	.sec2 .s_col li.s2 {
		float:none;
		width:100%;
		text-align:center;
	}
	.sec2 .s_area3 .g1 {
		padding:0 2% 0 2%;
		width:96%;
		margin:0 0 20px;
	}
	.sec2 .s_area3 .g2 {
		position:static;
		padding:0 2% 0 2%;
		width:96%;
		text-align:center;
	}
	.sec2 .s_col4 li.s1 {
		float:none;
		width:100%;
		margin:0 0 6%;
	}
	.sec2 .s_col4 li.s2 {
		float:none;
		width:100%;
	}

	.sec3 .s_col li.s1 {
		float:none;
		width:100%;
		text-align:center;
		margin:0 0 20px;
	}
	.sec3 .s_col li.s2 {
		float:none;
		width:100%;
		text-align:center;
	}

	.sec3 .s_col2 li.s1 {
		float:none;
		width:100%;
		margin:0 0 6%;
	}
	.sec3 .s_col2 li.s2 {
		float:none;
		width:100%;
	}

	.sec3 .s_col2 li dl dt {
		float:none;
		width:100%;
		text-align:center;
		margin:0 0 10px;
	}
	.sec3 .s_col2 li dl dd {
		float:none;
		width:100%;
	}


	.sec4 .s_col li.s1 {
		float:none;
		width:100%;
		margin:0 0 30px;
	}
	.sec4 .s_col li.s2 {
		float:none;
		width:100%;
	}

}

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

	.sec1 .s_area .s_left{
		float:none;
		width:auto;
		margin-bottom:5%;	
	}
	
	.sec1 .s_area .s_right{
		float:none;
		width:auto;	
	}
	

	.sec2 .s_col2 {
		max-width:265px;
		margin:0 auto;
	}
	.sec2 .s_col2 li {
		float:none;
		width:100%;
		margin:0 0 10px 0;
	}
	.sec2 .s_col2 li:last-child {
		margin:0 0 0 0;
	}

	.sec_conts .t2{
		background: url(../../quality/img/ver_line.png) left top repeat-y;	
	}


	.sec2 .s_col3 li {
		float:none;
		width:100%;
		border-right:0px;
		border-bottom:1px solid #817253;
		padding:0 0 10px;
		margin:0 0 10px;

	}
	.sec2 .s_col3 li:first-child {
		padding:0 0 10px;
	}
	.sec2 .s_col3 li:last-child {
		padding:0 0 0 0;
		border-right:0px;
		border-bottom:0px;
	}
}

@media screen and (max-width: 480px) {

}