@charset "utf-8";
/*
Theme Name: marumatsu builder
Theme URL: marumatsu-builder.com
Description: マルマツ工務店用テーマ
Author: k.toma
Version: 1.0.0
Licnecnse: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Global */
@import url('https://use.fontawesome.com/releases/v5.6.1/css/all.css');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap');

html { background: #fff; }
html,
html * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 62.5%;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
body, p, a {
	color: #333;
	font-family: -apple-system-body, BlinkMacSystemFont, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 1.6rem;
	line-height: 2;
	-webkit-font-smoothing: antialiased;
	animation: fadeIn 2s ease 0s 1 normal;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
	-webkit-text-size-adjust: 100%;
	transition: .2s;
}
dl dt a:hover,
dl dd a:hover,
ul li a:hover {
	color: #044574 !important;
}
.active {
	color: #044473;
}
.cate-active {
	background: #044574;
	color: #fff;
}
.cate-active:hover {
	color: #fff !important;
}
input, button, textarea, select {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
.inner {
	width: 72%;
	margin: 0 auto;
	max-width: 1067px;
	padding-left: 1%;
}
.flex {
	display: flex;
}
.flex-row2 > * {
	width: calc(100%/2);
}
/* テーマ共通コンポーネント */

/* テーマレイアウト */
header {
	padding-top: 82px;
	padding-bottom: 42px;
}
.wrapper {
	position: relative;
	min-height: 100vh;
	height: 100%;
	padding-bottom: 240px;
}
main {
	height: 100%;
	margin-bottom: 125px;
}
footer {
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 240px;
	padding-top: .5%;
}
.footer-logo {
	width: 54%;
	min-width: 380px;
}
.footer-address {
	width: 95%;
}
.footer-logo,
.footer-address {
	margin: 0 auto 30px;
}
footer p {
	text-align: center;
}
.footer-address p {
	line-height: 2.6rem;
	font-size: 1.4rem;
	white-space: nowrap;
}
.footer-copyright {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	height: 40px;
	line-height: 40px;
	color: #fff;
	background: #044473;
	font-size: 1.3rem;
}
article {
	margin: 0 auto 8%;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	object-fit: cover;
}
.header-inner {
	justify-content: space-between;
	min-width: 800px;
}
.header-logo-link {
	margin-right: 9%;
	width: 45%;
}
.navigation {
	display: block;
}
nav ul {
	display: flex;
	justify-content: space-between;
}
nav ul li {
	transition: .2s;
}
nav ul li a {
	font-size: 1.6rem;
	line-height: 4.2rem;
	letter-spacing: 2px;
}
/* hover 用　アレンジ */
nav ul li {
	width: calc(100%/3);
}
nav ul li a {
	width: 100%;
	text-align: center;
}

/* メニュー */
.sp-menu {
	display: none;
}
.page-title {
	background: #b5b6b6;
	margin-bottom: 8%;
}
.page-title h1 {
	color: #fff;
	font-size: 1.8rem;
	font-weight: normal;
	height: 70px;
	line-height: 70px;
}
#breadcrumbs {
	margin-bottom: 4%;
}
#breadcrumbs a {
	font-size: 1.2rem;
	font-weight: normal;
	line-height: 1.4;
	padding: 0 1%;
	color: #727171;
}
#breadcrumbs span {
	font-size: 1.4rem;
	color: #727171;
}
.breadcrumb_last {
	font-size: 1.4rem;
	font-weight: bold;
	padding-left: 1%;
}

/* point block design */
.point-block-column {
	padding: 0 0 2%;
	display: flex;
}
.point-block-column .wp-block-column:first-child {
	width: 100%;
	height: 100%;
}
.point-block-column .wp-block-column:nth-child(2n) {
	margin-left: 32px !important;
	padding-top: 2%;
	flex-basis: unset;
}
.point-block-column .wp-block-column h3 {
	font-size: 22px;
	text-align: center;
	border: 1px solid #727171;
	height: 100%;
}
.point-block-column .wp-block-column p {
	font-size: 16px;
}

/* PC レスポンシブ */
@media (min-width: 941px) {
	/* point block design */
	.point-block-column .wp-block-column:first-child {
		max-width: 140px;
		max-height: 140px;
		line-height: 140px;
	}
}
@media (min-width: 782px) {
	.point-block-column .wp-block-column {
		flex-basis: calc(50% - 16px);
	}

}

/* 940px 以下 (PCレスポンシブ最小 & タブレットの幅) */
@media (max-width: 940px) {
	.flex {
		display: block;
	}
	.inner {
		width: 95%;
		padding-left: 0;
	}
	header {
		padding: 0;
		width: 100%;
		height: 55px;
		line-height: 55px;
	}
	.header-logo-link {
		width: 32%;
		margin-right: 0;
		margin-left: 1%;
		min-width: 210px;
	}
	.header-inner {
		min-width: auto;
		width: 100%;
	}
	.navigation {
		display: none;
		position: absolute;
		content: "";
		top: 55px;
		right: 0;
		width: 72%;
		max-width: 400px;
		height: auto;
		background: rgba(6, 69, 116, .7);
		z-index: 1;
	}
	nav ul {
		display: block;
	}
	nav ul li a {
		display: inline-block;
		font-size: 1.6rem;
		text-align: center;
		width: 100%;
		color: #fff;
	}
	/* hover 用　アレンジ */
	nav ul li {
		width: 100%;
	}
	nav ul li a {
		line-height: inherit;
	}
	/* sp用メニュー */
	.sp-menu {
		display: block;
		position: absolute;
		width: 55px;
		height: 55px;
		right: 0;
		top: 0;
		padding: 18px 15px;
		background: rgba(6, 69, 116, .7);
	}
	.menu-trigger {
		position: relative;
		width: 100%;
		height: 100%;
	}
	.menu-trigger,
	.menu-trigger span {
		display: inline-block;
		transition: all .2s;
		box-sizing: border-box;
	}
	.menu-trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #fff;
		border-radius: 4px;
	}
	.menu-trigger span:nth-of-type(1) {
		top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
		top: 8px;
	}
	.menu-trigger span:nth-of-type(3) {
		bottom: 0;
	}
	.menu-trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(8px) rotate(-45deg);
		transform: translateY(8px) rotate(-45deg);

	}
	.menu-trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-7.5px) rotate(45deg);
		transform: translateY(-7.5px) rotate(45deg);
	}
	.page-title {
		margin-top: 0;
	}
	.page-title h1 {
		font-size: 1.6rem;
		height: 50px;
		line-height: 50px;
	}
	footer {
		padding-top: 25px;
	}
	.footer-address p {
		font-size: 1.2rem;
	}
	.footer-copyright {
		font-size: 1rem;
		height: 25px;
		line-height: 25px;
	}
	/* point block design */
	.point-block-column {
		display: block !important;
	}
	.point-block-column .wp-block-column:nth-child(2n) {
		margin-left: 0 !important;
	}
}
/* 460px 以下 (スマホレスポンシブ)*/
@media (max-width: 460px) {
	header {
		padding-top: 0;
	}
	.footer-logo {
		min-width: auto;
		width: 80%;
		margin-bottom: 24px;
	}
	#breadcrumbs {
		margin-bottom: 12%;
	}
	#breadcrumbs span {
		font-size: 1.4rem;
	}
	main {
		margin-bottom: 40px;
	}
	.page-title {
		margin-bottom: 16%;
	}
	/* point block design */
	.point-block-column .wp-block-column p {
		font-size: 14px;
	}
}
.gallery-flex {
	display: flex;
	flex-wrap: wrap;
}
@media(max-width: 940px) {
	.gallery-flex > figure.wp-block-image {
		width: 100% !important;
	}
}