@charset "UTF-8";

/*ﾟ･*:.｡. .｡.:*･゜ﾟ･*:.｡. .｡.:*･゜ﾟ･*:.｡. .｡.:*･゜

目次

・トップページ
・個別ページ共通class
・自己紹介
・施工実績
・お客様の声
・ブログ
・お問い合わせ

ﾟ･*:.｡. .｡.:*･゜ﾟ･*:.｡. .｡.:*･゜ﾟ･*:.｡. .｡.:*･゜*/


/*==========================================================

　トップページ

==========================================================*/

/*　共通
===================================*/
.design1 main.top section {
	font-family: serif;
	padding:2rem 0;
}

.design1 main.top section h2 {
	margin-bottom:1rem;
	text-align:center;
}

.design1 main.top section h4 {
	font-family: san-serif;
	font-weight:normal;
	text-align:center;
}

.design1 main.top section > p {
	margin:1rem 2rem;
	font-weight:bold;
}

/* お客様の声 */
.design1 main.top section.voice {
	background-color:#E7E7D9;
}

/* 施工実績 */
.design1 main.top ul.works li a {
	text-decoration:none;
	color:#373D27;
}

.design1 main.top ul.works li img {
	width:100%;
	max-height:300px;
	object-fit:cover;
}

@media only screen and (min-width:750px) {
.design1 main.top ul.works li img {
	max-height:170px;
}
}

/* ブログ */
.design1 main.top ul.blog {
	margin-bottom:2rem;	
}

@media only screen and (min-width:750px) {
.design1 main.top section > p {
	text-align:center;
	margin:2rem auto;
}

/* 施工実績 */
.design1 main.top ul.works {
	display:flex;
	justify-content:space-between;
}

.design1 main.top ul.works li {
	width:calc((100% - 3rem) / 3);
}
}

/*　アイコン
=======================================*/
.design1 div.topicon {
	font-family: serif;
	margin-bottom:1rem;
	text-align:center;
}

.design1 div.topicon img {
	width:60px;
}

.design1 div.topicon h3 {
	font-size:1.4rem;
}

.design1 div.topicon p {
	font-size:0.8rem;
	font-family:serif;
}

/*　moreボタンのデザイン
=======================================*/

.design1 button.more {
	border:solid 1px #373D27;
	width:70%;
	margin:1rem auto;
	background:transparent;
	display:block;
}

.design1 button.more a {
	text-decoration:none;
	display:block;
	font-size:1rem;
	padding:0.5rem 0;
	font-family: serif;
	color:#373D27;
	text-align:center;
}

@media only screen and (min-width:750px) {
.design1 button.more {
	width:240px;
}
}

/*==========================================================

　個別ページ共通class

==========================================================*/

/* アイコンの上下マージン */
.design1 .page .topicon {
  margin:2rem 0;
}

.design1 .page .topicon h1 {
	font-size:1.4rem;
}


/*==========================================================

　自己紹介

==========================================================*/

.design1 article.about > div {
	margin-bottom:3rem;	
}

.design1 article.about section img {
	margin-bottom:1rem;
}

.design1 article.about h2 {
	font-family:serif;
	margin-bottom:1rem;
}

.design1 article.about h2 span {
	font-size:0.8rem;
}

.design1 article.about section div {
	background-color:#E7E7D9;
	padding:1rem;
	margin-top:1rem;
}

.design1 article.about section {
	padding-bottom:3rem;
}

.design1 article.about div h3 {
	margin-bottom:1rem;
	font-family:serif;
}

.design1 article.about section h3 {
	margin-bottom:1rem;
	font-family:serif;
}

.design1 article.about table {
	border-collapse:collapse;
	border-bottom:solid 1px #373D27;
}

.design1 article.about table tr th {
	width:30%;
	border-top:solid 1px #373D27;
	font-weight:normal;
}

.design1 article.about table tr td {
	border-top:solid 1px #373D27;
	padding:1rem;
}

@media only screen and (min-width:750px) {
.design1 article.about section ul {
	display:flex;
	justify-content:space-between;
}

.design1 article.about section ul li {
	width:calc(50% - 1rem);
}

.design1 article.about section ul.reverse {
	flex-direction:row-reverse;
}

.design1 article.about table tr td {
	padding:2rem 1rem;
}
}

/*==========================================================

　施工実績

==========================================================*/
.design1 ul.works h3 {
	font-size:1rem;
	margin-bottom:2rem;
}

.design1 .works ul li {
	margin-bottom:3rem;
}

.design1 .works ul li a {
	color:#373D27;
	text-decoration:none;
}

.design1 .works ul li h3 {
	font-weight:normal;
}

.design1 .works ul li img {
	object-fit:cover;
	max-height:300px;
}

.design1 p.cate {
	font-size:0.8rem;
	border-radius:10px;
	padding:0 1.5rem;
	display:inline-block;
	margin:0.5rem 0;
}
	
.design1 p.reform {
	background-color:#AB2126;
	color:#FFF;
}
	
.design1 p.furniture {
	background-color:#373D27;
	color:#FFF;
}

@media only screen and (min-width:750px) {
.design1 .works ul {
	display:flex;
	justify-content:space-between;
}

.design1 .works ul li {
	width:calc((100% - 4rem) / 3);
}

.design1 .works ul li img {
	max-height:170px;
}
}

/*　施工実績の個別記事ページ
=======================================*/
.design1 .s-works img {
	margin-bottom:1rem;
	height:auto;
}

.design1 .s-works section {
	margin-bottom:3rem;
}

.design1 .s-works section h1 {
	margin:1rem 0 0.5rem;
}

/*==========================================================

　お客様の声

==========================================================*/

.design1 .voices ul li {
	margin-bottom:3rem;
}

.design1 .voices ul li a {
	color:#373D27;
	text-decoration:none;
}

.design1 .voices ul li h3 {
	margin:0.5rem 0;
	font-weight:normal;
}

@media only screen and (min-width:750px) {
.design1 .voices ul {
	display:flex;
	justify-content:space-between;
}

.design1 .voices ul li {
	width:calc((100% - 2rem) / 2);
}
}

/*　お客様の声singleページ
=======================================*/
.design1 .s-voices h1 {
	margin:1rem 0;
	font-weight:normal;
}

/*==========================================================

　ブログ

==========================================================*/


.design1 .blog ul.blog li {
	border-bottom:dashed 2px #373D27;
	padding:1rem 0;
}
	
.design1 .blog ul.blog li a {
	display:flex;
	text-decoration:none;
	color:#373D27;
}

.design1 .blog ul.blog li a img {
	margin-right:1rem;
	width:120px;
	height:100px;
	object-fit:cover;
}

/*　ブログ個別記事
=======================================*/

.design1 .single img {
	display:block;
	margin:1rem 0;
}

/* 記事タイトル */
.design1 .single article h1 {
	font-size:1.4rem;
}

/* キャプション */
.design1 .single article p.caption {
	margin-bottom:2rem;
}

/* カテゴリ */
.design1 .single article p.caption #date {
	margin-right:1rem;
}

/* ページネーション */
.design1 .single .pagination {
	margin-top:3rem;
}

/*　ブログ個別記事-コメントフォーム
=======================================*/
.design1 .single #respond {
	margin-top:3rem;
}

.design1 .single #respond h3 {
	font-weight:normal;
	margin:1rem 0;
}

.design1 .single #respond form input[type="text"],
.design1 .single #respond form textarea {
	padding:0.5rem;
	width:100%;
	margin-bottom:1rem;
}

.design1 .single #respond form input[type="submit"] {
	padding:0.5rem 2rem;
	margin:1rem auto;
	display:block;
	font-size:1rem;
}

/*==========================================================

　お問い合わせ

==========================================================*/

.design1 main.contact {
	color:#373D27;
}

/* お電話でのお問い合わせ */
.design1 main.contact section.tel {
	background-color:#E7E7D9;
	border-radius:8px;
	padding:1rem;
	margin-bottom:4rem;
}

.design1 main.contact section h2 {
	font-size:1rem;
	border-bottom:solid 1px #373D27;
	font-weight:normal;
}

.design1 main.contact section.tel address {
	margin:1rem 0;
	font-size:2rem;
	font-weight:bold;
	font-family:serif;
}

.design1 main.contact section.tel p {
	font-size:0.9rem;
}

/* メールでのお問い合わせ */
.design1 main.contact section.mail .ul1 {
	background-color:#E7E7D9;
	border-radius:8px;
	padding:1rem 1rem 1rem 2rem;
	font-size:0.9rem;
	margin:1rem 0 2rem;
	list-style:disc;
	list-style-position:outside;
}

.design1 main.contact section.mail .ul2 li:nth-of-type(odd) {
	font-size:1rem;
	margin-top:1.5rem;
}

/* 必須 */
.design1 main.contact section.mail .ul2 li label span.required {
	background-color:#373D27;
	color:#FFF;	
	padding:0.2rem 0.4rem;
	margin-left:0.5rem;
	margin-right:1rem;
	border-radius:3px;
}

.design1 main.contact section.mail .ul2 li label span.red {
	color:#F00;
}

.design1 main.contact section.mail .ul2 input[type="text"],
.design1 main.contact section.mail .ul2 input[type="email"] {
	padding:1rem 0.5rem;
	margin-top:0.5rem;
	border-radius:5px;
	background-color:#FFF;
	width:100%;
}

.design1 main.contact section.mail .ul2 input[type="tel"] {
	padding:1rem 0.5rem;
	margin-top:0.5rem;
	border-radius:5px;
	background-color:#FFF;
	width:calc((100% - 2rem - 6px) / 3);
}

.design1 main.contact section.mail .ul2 textarea {
	padding:0.5rem;
	margin-top:0.5rem;
	border-radius:5px;
	background-color:#FFF;
	width:100%;
	min-height:12rem;
}

.design1 main.contact section.mail input[type="submit"] {
	background-color:#373D27;
	border:0;
	border-radius:5px;
	font-weight:bold;
	font-size:1rem;
	color:#FFF;
	padding:0.8rem 3.4rem;
	margin:2rem auto 5rem;
	display:block;
}