@charset "UTF-8";

/* ==================
p span.color h3
================== */

.section p {
	text-align: justify;
	margin: 0;
}

span.color {
	color: #fdecb3;
	padding: 8px;
}

h3 {
	font-size: 16px;
	margin: 10px 0 6px;
}

/* ==================
.top
================== */

.top {
	background-image: url("../../images/spec/spec_top.png");
	background-repeat: repeat;
	background-size: 100%;
	background-position: center;
	text-align: center;
	margin: 0;
	padding: 0;
}

/* ==================
.sec-top
================== */

.sec-top h2 {
	padding: 20px;
}

.sec-top ul {
	overflow: hidden;
	margin: 0;
	padding: 0 0 30px;
}

.sec-top li {
	float: left;
	background: #a53f00;
	color: #fff;
	line-height: 1.3em;
	box-sizing: border-box;
	width: 30.333%;
	box-shadow: 2px 2px 6px rgba( 0, 0, 0, .5);
	margin: 0 1.5%;
	padding: 20px 0;
}

.sec-top li:first-child {
	background: #c4892d;
}

.sec-top li:last-child {
	background: #6f8b22;
}

.sec-top a {
	color: #fff;
	text-decoration: none;
}

/* ==================
.sec-index 共通
================== */

.sec-index {
	background-image: url("../../images/spec/spec_catch.png");
	background-repeat: repeat;
	background-size: 100%;
	background-position: center;
	text-align: center;
	margin: 0;
	padding: 0;
}

.sec-index p {
	text-shadow:
		#fff 1px 1px 3px, #fff -1px 1px 3px,
		#fff 1px -1px 3px, #fff -1px -1px 3px;
}

.sec-index p.catch {
	color: #fff;
	font-size: 14px;
	text-align: center;
	text-shadow: 2px 2px 6px rgba( 0, 0, 0, .5);
	margin: 0;
	padding-top: 16px;
}

.sec-index h1 {
	color: #fff;
	margin: 0 30% 20px;
	padding: 2px;
}

.sec1-1 h1 {
	background: #c4892d;
}

.sec2-1 h1 {
	background: #a53f00;
}

.sec3-1 h1 {
	background: #6f8b22;
}

@media screen and (max-width:374px) {
	.sec-index h1 {
		font-size: 20px;
	}
}

/* === .sec-1 h1色 ==== */

h1.sec1-title {
	color: #c4892d;
	font-size: 20px;
	line-height: 1.8em;
	background: #fffbed;
	border-top: 1px solid #c4892d;
	border-bottom: 1px solid #c4892d;
	margin-bottom: 20px;
}

/* === .sec-2 h1色 ==== */

h1.sec2-title {
	color: #a53f00;
	font-size: 20px;
	line-height: 1.8em;
	background: #fffbed;
	border-top: 1px solid #a53f00;
	border-bottom: 1px solid #a53f00;
	margin-bottom: 20px;
}

/* === .sec-3 h1色 ==== */

h1.sec3-title {
	color: #6f8b22;
	font-size: 20px;
	line-height: 1.8em;
	background: #fffbed;
	border-top: 1px solid #6f8b22;
	border-bottom: 1px solid #6f8b22;
	margin-bottom: 20px;
}

/* ==================
.sec1
================== */

.sec-column {
	box-sizing: border-box;
	width: 100%;
	text-align: center;
	border: 1px solid #fdecb3;
	border-radius: 5px;
	margin: 20px auto 0;
	padding: 0.2em 1em;
}

.sec-column p.img-center {
	box-sizing: border-box;
	width: 80%;
	margin: 15px auto;
	padding: 0;
}

.triangle {
	box-sizing: border-box;
	width: 40%;
	margin: 0 auto;
}

.house p.img-right {
	overflow: hidden;
	box-sizing: border-box;
	width: 30%;
	text-align: right;
	margin: 0 65%;
	padding: 0;
}

.house p.img-right img {
	float: right;
}

.sec1-list {
	background: #fffbed;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
	border: 1px solid #fdecb3;
	border-radius: 5px;
	margin: 0 auto;
	padding: 10px 20px 10px 0;
}

.sec1-footer p {
	color: #c4892d;
	font-size: 16px;
	text-align: center;
	padding: 10px 0 0;
}


/* ==================
.sec2・3
================== */

p.img2-2a {
	box-sizing: border-box;
	width: 70%;
	text-align: center;
	margin: 0 auto;
}

.sec-line {
	background: #fffbed;
	margin-top: 20px;
}

.sec-line h4 {
	padding-top: 10px;
}

.row1 ul {
	overflow: hidden;
	margin: 0 0 30px 0;
	padding: 0 0 10px;
}

.row1 ul:last-child {
	margin: 0 0 10px 0;
}

.row1 li {
	float: left;
	box-sizing: border-box;
	width: 30%;
	margin: 0 35%;
	padding: 5px 0;
}

.row2 ul {
	overflow: hidden;
	margin: 0 0 30px 15%;
	padding: 10px 0;
}

.row2 li {
	float: left;
	box-sizing: border-box;
	width: 36%;
	margin: 0 1.5%;
	padding: 0 0 5px;
}

.row3 ul {
	overflow: hidden;
	margin: 0 0 30px 0;
	padding: 0 0 10px;
}

.row3 li {
	float: left;
	box-sizing: border-box;
	width: 30.333%;
	margin: 0 1.5%;
	padding: 5px 0;
}

.row3 ul:last-child {
	margin: 0;
}

.sec3-3 p.img-center {
	text-align: center;
}

.sec3-3 p.img-center img {
	box-sizing: border-box;
	width: 70%;
	margin: 20px auto 0;
}

h3.erstar-x span.color {
	padding: 2px;
}