@charset "utf-8";
/* CSS Document */


body{
	background-image: url("../img/page_bg.png");
	background-repeat: repeat-y;
	background-size: 100%;
}


.content{
	padding-top: 50px;
	padding-bottom: 100px;
	font-size: 1.5rem;
}

@media(max-width:599px) {
	.content{
		padding-top: 20px;
    	padding-bottom: 40px;
	}
}

.content p img.aligncenter{
	margin: 0 auto;
}


.content p img.alignright{
	margin: 0 0 0 auto;
}

.content h2{
	display: inline-block;
	width: 100%;
	font-weight: 700;
	font-size: 3rem;
	padding-bottom: 0.5em;
	border-bottom: 1px solid var(--sub-theme-color);
	text-align: center;
	margin: 1em 0;
	line-height: 1.5;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content h2{
		font-size: 2.3rem;
	}
}

@media(max-width:599px) {
}


.content h3{
	width: 100%;
	font-weight: 700;
	font-size: 2.7rem;
	text-align: left;
	margin: 1em 0;
	color: var(--main-theme-font-color);
	line-height: 1.5;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content h3{
		font-size: 2.1rem;
	}
	
	.content .flow h3{
		margin-top: 0;
	}
}

@media(max-width:599px) {
}


.content h4{
	width: 100%;
	font-weight: 700;
	font-size: 2.3rem;
	text-align: left;
	margin: 1em 0;
	padding-left: 0.5em;
	border-left: 5px solid var(--sub-theme-color);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content h4{
		font-size: 2rem;
	}
}

@media(max-width:599px) {
}


.content h5{
	display: block;
	width: min(980px, 100%);
	font-weight: 700;
	font-size: 2rem;
	text-align: center;
	margin: 1em auto;
	background-color: #fff;
	border-bottom: 1px solid var(--main-theme-color);
	padding-bottom: 0.5em;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content h5{
		font-size: 1.8rem;
	}
}

@media(max-width:599px) {
}


.content h6{
	width: 100%;
	font-weight: 700;
	font-size: 1.8rem;
	text-align: left;
	margin: 1em 0;
	color: var(--main-theme-font-color);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content h6{
		font-size: 1.5rem;
	}
}

@media(max-width:599px) {
}



.content p{
	margin: 1.5em 0;
/*	line-height: 1.5;*/
	line-height: 1.7;
}

.content ul li,
.content ol li{
	margin-left: 2em;
}

.contact_area{
	background-image: url("../img/contact_area_bg.webp");
	background-position: center top;
	background-size: cover;
}

.contact_area .content{
	padding-bottom: 0;
}

.contact_area .button_wrapper{
	margin: 30px 0;
}

.contact_area .button_wrapper .button .number{
	color: var(--sub-theme-font-color);
	font-size: 4rem;
}

.contact_area .button_wrapper .button:nth-of-type(2) .number{
	font-size: 3.5rem;
}

@media(max-width:1080px) {
	.contact_area .button_wrapper .button .number{
		font-size: 3rem;
	}

	.contact_area .button_wrapper .button:nth-of-type(2) .number{
/*		font-size: 2.8rem;*/
		font-size: 2.3rem;
	}
}

@media(max-width:768px) {
}

@media(max-width:599px) {
}


/*フリーコールアイコン用css*/
.contact_area .button_wrapper .button{
	width: min(530px, 47%);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.contact_area .button_wrapper .button{
		width: min(530px, 100%)!important;
	}
}

@media(max-width:599px) {
}


.contact_area .button_wrapper .button a{
	border-radius: 60px;
	min-height: 105px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.contact_area .button_wrapper .button a{
		min-height: 80px;
		padding: 0.5em;
	}
}


.contact_area .button_wrapper .button a:hover .number{
	color: var(--main-font-black);
}

.contact_area .button_wrapper .button .number img{
	width: min(47px, 100%);
	display: inline-block;
}

.staffes{
	width:min(1080px, 100%);
}


h1{
	display: inline-block;
	color: var(--main-theme-font-color);
	font-size: 3.2rem;
	text-align: center;
	width: 100%;
	margin-top: 2em;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	h1{
		margin-top: 1.5em;
	}
}

@media(max-width:599px) {
	h1{
		font-size: 2.3rem;
	}
}



h2.single_title{
	text-align: left;
	color: var(--main-font-black);
	border-bottom: none;
}

.relatedlinks{
	margin: 20px auto 50px;
	text-align: center;
}

.relatedlinks a {
	display: inline-block;
	width: min(150px, 100%);
	font-size: 1.7rem;
	padding: 0.5em 1em;
	text-decoration: none;
	color: var(--main-theme-font-color);
	border: 2px solid var(--main-theme-color);
	border-radius: 35px;
	text-align: center;
	margin-right: 20px;
	transition: .3s;
}

.relatedlinks a:hover{
	opacity: .7;
	transition: .3s;
}

.relatedlinks a:last-of-type{
	margin-right: 0;
}

.content ul.news_archive{
	font-size: 1.5rem;
	list-style: none;
}

.content ul.news_archive li{
	border-bottom: 1px solid var(--main-theme-color);
	margin-left: 0;
}

.content ul.news_archive li a{
	display: block;
	text-decoration: none;
	color: var(--main-font-black);
	transition: .3s;
	padding: 1.5em 1em;
	font-weight: 700;
}

.content ul.news_archive li a:hover{
	background-color: rgba(0,104,181,.3);
	transition: .3s;
}

.content h2.screen-reader-text{
	display: none;
}

.day{
	display: inline-block;
	font-weight: 700;
	margin-bottom: 1em;
	color: #666666;
	font-size: 90%;
}

.news_category{
	font-size: 1rem;
    padding: 0.2em 1em;
    border-radius: 20px;
    background-color: var(--sub-theme-color);
    display: inline-block;
    margin-bottom: 0.5em;
	font-weight: 700;
}

.column_category{
	font-size: 1rem;
    padding: 0.2em 1em;
    border-radius: 20px;
    background-color: #26BF8C;
    display: inline-block;
    margin-bottom: 0.5em;
	font-weight: 700;
}

.blog_category{
	font-size: 1rem;
    padding: 0.2em 1em;
    border-radius: 20px;
    background-color: none;
    display: inline-block;
    margin-bottom: 0.5em;
	font-weight: 700;
	border: 1px solid var(--main-font-black);
}

.content .oyakudachi_category{
	font-size: 1rem;
    padding: 0.2em 1em;
    border-radius: 20px;
	color: #fff;
    background-color: var(--advance-color);
    display: inline-block;
    margin-bottom: 0.5em;
	font-weight: 700;
}


/*ページネーション　ここから*/

.pagination{
	margin: 40px auto 20px;
	text-align: center;
    width: 100%;
}

.page-numbers{
	font-weight: 700;
	font-size: 1.7rem;
	aspect-ratio: 1 / 1;
	width: 45px;
	display: inline-block;
	text-align: center;
	padding-top: 10px;
}

.pagination a{
	border: 1px solid var(--main-theme-color);
	background-color: var(--main-theme-color);
	color: #fff;
	text-decoration: none;
}

.pagination a:hover{
	border: 1px solid var(--main-theme-color);
	background-color: #fff;
	color: var(--main-theme-color);
	transition: .3s;
	text-decoration: none;
}

.pagination span{
	border: 1px solid #fff;
	color: var(--main-theme-color);
}

.pagination .nav-links{
	width: 100%;
}

.next.page-numbers,
.prev.page-numbers{
	position: relative;
	transform: translateY(16px);
}

.next.page-numbers:hover,
.prev.page-numbers:hover{
	background-color: var(--main-theme-color);
}

.next.page-numbers::after,
.prev.page-numbers::before{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 13px;
	height: 21px;
	background-size: contain;
}

.next.page-numbers::after{
	background-image: url("../img/next.png");
}

.prev.page-numbers::before{
	background-image: url("../img/prev.png");
}

/*ページネーション　ここまで*/


.content table{
	width: 100%;
}

.content table tr{
	border-bottom: 1px solid #fff;
}


.content table th, 
.content table td{
	padding: 1.2em;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content table th,
	.content table td{
/*		padding: 1.2em 0.2em;*/
		padding: 1.2em 0.5em;
	}
}

@media(max-width:599px) {
}

.content table th{
	background-color: var(--main-theme-color);
	color: #fff;
	width: 185px;
    min-width: 17%;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content table th{
		width: 25%;
		font-size: 1.4rem;
	}
}

@media(max-width:599px) {
}


.content table td{
	background-color: #d5e7ef;
	width: calc(100% - min(185px, 17%));
}

ul.history {
	list-style: none;
	margin-top: 120px;
}

ul.history li{
	position: relative;
	border-left: 1px solid var(--main-theme-color);
	padding: 1em 1em 1em 2em;
	margin-right: 10px;
}

ul.history li::before{
	content: '';
	width: 15px;
	height: 15px;
	position: absolute;
	top: 1.8em;
	left:-8px;
	display: inline-block;
	background-color: var(--main-theme-color);
	border-radius: 10px;
}

p.history_year{
	font-size: 3rem;
	margin-top: 0;
	margin-bottom: 0.5em;
}

ul.history dl{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

ul.history dl dt{
	width: min(100px, 20%);
	text-align: center;
}

ul.history dl dd{
	width: calc(100% - min(100px, 20%));
}

.history_about{
	margin-bottom: 1.5em;
}


/*商品ページのスタイル　ここから*/

.product_intro{
	display: flex;
	justify-content: space-between;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.product_intro{
		flex-direction: column;
	}
}


.product_intro-img{
	width: min(500px, 47%);
	aspect-ratio: 4 / 3;
	margin-bottom: 30px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.product_intro-img{
		width: 100%;
	}
}

.product_intro-img img{
	width: 100%;
}

.product_intro-text{
	width: min(500px, 47%);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.product_intro-text{
		width: 100%;
	}
}

.product_intro-teika,
.product_intro-product_price,
.product_intro-construct_price{
	text-align: right;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.product_intro-teika,
	.product_intro-product_price,
	.product_intro-construct_price{
/*		text-align: left;*/
	}
}

.content p.product_intro-teika{
	font-size: 1.4rem;
	color: #666666;
	margin-bottom: 20px;
	margin-top: 40px;
}

.product_intro-teika > span{
	margin-left: 0.3em;
}

.product_intro-teika span{
/*	font-weight: 700;*/
	font-size: 150%;
/*	margin-left: 1rem;*/
}

.product_intro-teika span span{
	font-size: 0.6em;
}

.content p.product_intro-product_price{
	margin-top: 10px;
	margin-bottom: 5px;
}

.product_intro-product_price,
.product_intro-construct_price{
	font-size: 1.7rem;
}

.content p.product_intro-construct_price{
	margin-bottom: 10px;
	margin-top: 0;
}

.product_intro-product_price span,
.product_intro-construct_price span{
	font-weight: 700;
	font-size: 3.4rem;
/*	margin-left: 0.3em;*/
	letter-spacing: 0.01em;
}

@media(max-width:599px) {
	.product_intro-product_price span,
	.product_intro-construct_price span{
		font-size: 3rem;
	}
}

.product_intro-product_price span{
/*	color: #be1e00;*/
	color: #d60000;
/*	font-weight: 800;*/
	font-weight: 700;
	letter-spacing: 0.01em;
}

.product_intro-product_price > span,
.product_intro-construct_price > span{
	margin-left: 0.3em;
}

.price_plus{
	text-align: right;
}

.price_plus span{
	display: inline-block;
	position: relative;
	width: 16px;
	height: 16px;
	right: 85px;
}

.price_plus span::before{
	display: inline-block;
	position: absolute;
	content: '';
	width: 16px;
	height: 2px;
	background-color: #e50000;
/*	top: -5px;*/
	top: 50%;
/*	bottom: 105%;*/
/*	right: 55%;*/
	right: 50%;
}

.price_plus span::after{
	display: inline-block;
	position: absolute;
	content: '';
	width: 16px;
	height: 2px;
	background-color: #e50000;
/*	top: -5px;*/
	top: 50%;
/*	bottom: 105%;*/
/*	right: 55%;*/
	right: 50%;
	transform: rotate(90deg);
}

.product_intro-product_price span span{
	color: var(--main-font-black);
	font-weight: 700;
}

.product_intro-product_price span span,
.product_intro-construct_price span span{
/*	font-size: 0.6em;*/
	text-align: center;
    display: inline-block;
    line-height: 0.8;
    font-size: 1.5rem;
	color: #666666;
}

.product_archive .product_intro-product_price span,
.product_archive .product_intro-construct_price span{
/*	font-size: 2.5rem;*/
	font-size: 3rem;
}

@media(max-width:599px) {
	.product_archive .product_intro-product_price span,
	.product_archive .product_intro-construct_price span{
		font-size: 2.4rem;
	}
}

.product_archive .product_intro-product_price > span > span{
/*	font-size: 0.6em;*/
/*	font-size: 0.5em;*/
/*    line-height: 0.6;*/
	font-size: 1.2rem;
}

.inner_construct_price{
	background-color: #f4f4f4;
	border-radius: 10px;
/*
	margin-top: 80px;
	margin-bottom: 80px;
*/
/*	padding: 10px 10px 40px;*/
	padding: 10px 10px 20px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
/*
	.inner_construct_price{
		margin-top: 30px;
		margin-bottom: 30px;
	}
*/
}

@media(max-width:599px) {
}


.inner_construct_price h3{
	text-align: center;
}

.inner_construct_price-wrapper{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.inner_construct_price-wrapper div{
	display: inline-block;
	padding: 0.5em 1.5em;
	border-radius: 35px;
	background-color: #fff;
	margin: 8px 5px;
}

.func{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}


.func > div{
	width: 32%;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.func > div{
		width: 48%;
	}
}


.func-img{
	width: 100%;
	aspect-ratio: 4 / 3;
}

.func-img img{
	width: 100%;
	object-fit: cover;
}

.content .func h6 {
	margin: 1em 0 0;
}

.example_content-other.forproduct,
.example_content-other.forexample,
.example_content-other.fortwcolumn{
	width: 100%;
}

.example_content-other.forproduct > a{
	width: 32%;
	margin-bottom: 40px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.example_content-other.forproduct > a{
		width: 48%;
	}
}

.example_content-other.forexample > a{
	width: 24%;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.example_content-other.forexample > a{
		width: 48%;
	}
}

.example_content-other.forproduct h4,
.example_content-other.forexample h4,
.example_content-other.fortwcolumn h4{
	font-size: 1.8rem;
	border-left: none;
	padding: 0 0 0.5em 0;
	margin: 0;
}

@media(max-width:820px) {
	.example_content-other.forproduct h4,
	.example_content-other.forexample h4,
	.example_content-other.fortwcolumn h4{
		font-size: 1.5rem;
	}
}


/*商品ページのスタイル　ここまで*/




/*商品ページカテゴリー一覧のスタイル　ここから*/

.product_archive .product_intro-text{
	font-size: 1.2rem;
	width: 100%;
	margin-top: 0.7em;
	color: #666;
}

.example_content-other.product_archive .example_info h4{
	border-bottom: none;
	margin-top: 0.5em;
	padding-bottom: 0;
}

@media(max-width:599px) {
	.example_content-other.product_archive .example_info h4{
		font-size: 1.6rem;
		margin-bottom: 0.5em;
	}
}

.example_content-other.product_archive .product_intro-product_price{
	margin-top: 0;
	margin-bottom: 0.5em;
}

.product_title_sup{
	position: relative;
	font-size: 2rem;
	text-align: center;
	font-weight: 700;
	margin-top: 3em;
}

@media(max-width:820px) {
	.product_title_sup{
		font-size: 1.6rem;
	}
}

.product_title_sup::after{
	content: '';
	position: absolute;
	top: 105%;
	left: 50%;
	transform: translateX(-50%);
	background-image: url("../img/h1title_sup.png");
	background-repeat: no-repeat;
	aspect-ratio:240 / 35;
/*	width: min(240px, 100%);*/
	width: min(240px, 80%);
	background-size: contain;
}

@media(max-width:820px) {
	.product_title_sup::after{
		width: min(180px, 80%);
	}
}

.product_title_sup + h1{
	margin-top: 1.5em;
}

/*商品ページカテゴリー一覧のスタイル　ここまで*/



/*施工事例ページのスタイル　ここから*/


h2.example_title{
	background-color: var(--main-theme-color);
	color: #fff;
	border-bottom: none;
	padding: 0.7em 1em;
	border-radius: 20px;
	line-height: 1.5;
	position: relative;
	margin-top: 0;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	h2.example_title{
		font-size: 2rem;
	}
}

@media(max-width:599px) {
}


h2.example_title::after{
	content: '';
	display: inline-block;
	background-image: url("../img/example_title_after.png");
	aspect-ratio: 45 / 33;
	width: 45px;
	position: absolute;
	right: 0;
	left: 0;
	margin: 0 auto;
	bottom: -20px;
	background-size: contain;
}


.example_img-main_slide .slide-media{
	aspect-ratio: 4 / 3;
	width: 100%;
}

.example_img-sub_slide{
	margin-top: 10px;
}

.example_img-sub_slide .swiper-slide{
	aspect-ratio: 4 / 3;
}

.example_img-main_slide .slide-media img,
.example_img-sub_slide img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.example_areaprice{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top: 30px;
}

.example_areaprice > div{
	border-right: 1px solid var(--main-font-black);
	padding: 0.5em 1em;
}

.example_areaprice > div:last-of-type{
	border-right: none;
}

.example_area{
	font-size: 2em;
}

.content .example_category{
	font-size: 1rem;
	padding: 0.2em 1em;
	border-radius: 20px;
	background-color: var(--main-theme-color);
	color: #fff;
	display: inline-block;
	margin-bottom: 0.5em;
}

p.example_price{
	margin: 0;
	font-size: 1.8rem;
	font-weight: 700;
}

.example_price span{
	font-size: 60%;
	font-weight: 400;
}

.example_before_img{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
/*	margin-bottom: 60px;*/
}

.example_before_img div{
	width: min(240px, 24%);
	aspect-ratio: 4 / 3;
	margin-bottom: 10px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.example_before_img div{
		width: min(240px, 49%);	
	}
}

@media(max-width:599px) {
}


.example_before_img div img{
	width: 100%;
	height: 100%;
}

.content_separator{
	margin-top: 80px;
	margin-bottom: 80px;
}

.content_separator:last-of-type{
	margin-bottom:0;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.content_separator{
		margin-top: 30px;
		margin-bottom: 30px;
	}
}

@media(max-width:599px) {
}


/*施工事例ページのスタイル　ここまで*/



/*スタッフ・職人紹介ページのスタイル　ここから*/

.changer-area{
	list-style: none;
	display: flex;
	justify-content: space-between;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.changer-area{
		flex-direction: column;
	}
}

.content ul li.changer{
	position: relative;
	aspect-ratio: 540 / 100;
	width: 49%;
	margin-left: 0;
	color: #fff;
	font-weight: 700;
	overflow: hidden;
	background-color: var(--main-theme-color);
	transition: .3s;
	border-radius: 10px;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.content ul li.changer{
		width: 100%;
	}
}

.content ul li.changer:hover{
	opacity: .7;
	transition: .3s;
}

.content ul li.changer a{
	display: block;
	width: 100%;
	height: 100%;
}

.changer picture{
	position: absolute;
    left: 0;
    aspect-ratio: 1 / 1;
    width: 30%;
    top: 50%;
    transform: translateY(-50%);
}

.changer img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.content ul li.changer:hover img{
	transform:scale(1.05,1.05);
	transition: .3s;
}


.content ul li.changer::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    background-image: url(../img/next.png);
    aspect-ratio: 10 / 17;
    width: 10px;
    background-size: contain;
	background-repeat: no-repeat;
}


.changer div{    
	position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    z-index: 10;
    width: 70%;
    text-align: center;
	color: #fff;
}

.content h2.yushikai_title{
	border-bottom: 0;
	padding: 0;
	margin-top: 2em;
}

.content h2.yushikai_title img{
	width: min(592px, 100%);
	margin: 0 auto;
}

.introduces {
/*	display: none;*/
}

.introduces.active {
	display: block;
}

.introduce_wrapper{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 80px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.introduce_wrapper{
		margin-top: 30px;
	}
}

.introduce{
	width: 49%;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.introduce{
		width: 100%;
	}
}


.comment{
	background-color: var(--sub-theme-color);
	font-weight: 700;
	padding: 1.5em 1em;
	border-radius: 10px;
	position: relative;
	width: 100%;
    height: auto;
	display: block!important;
}

.comment::after{
	content: '';
	position: absolute;
	background-image: url("../img/comment_fukidashi.png");
	aspect-ratio: 26 / 20;
	width: 26px;
	left: 50%;
	transform: translateX(-50%);
	bottom: -17px;
	background-size: contain;
}


.comment p{
	margin: 0;
}

.personal{
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
}

.personal_info{
	padding-left: 2em;
	width: calc(100% - min(240px, 45%));
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.personal_info{
		padding-left: 1em;
	}
}


.personal_info p{
	margin: 0.5em 0;
}

.personal_info .name{
	color: #000;
	font-weight: 700;
	font-size: 2.3rem;
	margin-bottom: 1em;
}

.personal_info .name span{
	font-weight: 400;
	font-size: 52%;
	display: block;
}

.personal_img{
	width: min(240px, 45%);
	transform: translateY(calc( -1.5em - 10px ));
}

.personal.syokunin .personal_img{
	width: min(120px, 45%);
	transform: translate(-20px, 0);
	aspect-ratio: 12 / 16;
}

.personal.syokunin .personal_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.personal.syokunin .role{
	display: inline-block;
	background-color: var(--advance-color);
	padding: 0.5em 1em;
	color: #fff;
	font-weight: 700;
	margin-bottom: 1.5em;
	max-width: 206px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.personal.syokunin .role{
		padding: 0.5em 0.8em;
		font-size: 1.3rem;
	}
}


.syokunincat{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.syokunincat > div{
	width: min(200px, 19%);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.syokunincat > div{
		width: min(200px, 32%);
	}
}


.syokunincat div a{
	display: block;
	color: var(--main-font-black);
	text-decoration: none;
	font-weight: 700;
}

.syokunincat_img{
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	overflow: hidden;
}

.syokunincat_img img{
	width: 100%;
	height: 100%;
	filter: grayscale(100%);
	transition: .3s;
	object-fit: cover;
}

.syokunincat div:hover img{
	filter:grayscale(0);
	transition: .3s;
	transform:scale(1.05,1.05);
}

.syokunincat div p{
	display: block;
	text-align: center;
	margin-top: 0.5em;
}



/*スタッフ・職人紹介ページのスタイル　ここまで*/




/*お役立ち情報集ページのスタイル　ここから*/

.twocolumn{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.oyakudachi_thumbnail{
	width: 100%;
	aspect-ratio: 4 / 3;
	margin-bottom: 50px;
}

.oyakudachi_thumbnail img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main_content{
	width: calc(100% - min(300px, 30%));
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.main_content{
		width: 100%;
	}
}


.twocolumn .main_content p{
	margin: 0.8em 0;
}


.side_content{
	width: min(260px, 25%);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.side_content{
		width: 100%;
		margin-top: 50px;
	}
}

.relatedlinks_rich{
	display: flex;
	justify-content: space-between;
	margin-top: 50px;
}

.relatedlinks_thumbnail{
	aspect-ratio: 1 / 1;
	width: 80px;
	margin-right: 1em;
}

.relatedlinks_thumbnail img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.relatedlinks_rich > a{
	display: flex;
	flex-direction: row;
	align-items: center;
	width: min(250px, 47%);
	text-decoration: none;
	color:var(--main-font-black);
}

.relatedlinks_rich > a:hover{
	color:var(--main-theme-font-color);
}

.content .relatedlinks_rich p{
	margin: 0.5em 0;
}

.relatedlinks_thumbnail + div{
	width: calc(100% - 80px);
}

.relatedlinks_title{
	font-weight: 700;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.relatedlinks_thumbnail + div p{
		font-size: 1.2rem;
	}
}

.side_archives{
	margin-bottom: 50px;
}

.side_archives > a{
	display: block;
	text-decoration: none;
	color: var(--main-font-black);
    transition: .3s;
}

.side_archives > a:hover{
	background-color: rgba(0,104,181,.3);
    transition: .3s;
}

.archive_content{
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid var(--main-font-black);
	padding: 1em 0.2em;
}

.content .archive_content p{
	margin: 0.5em 0;
}

.oyakudachi_side_archive_img{
	aspect-ratio: 1 / 1;
	width: min(80px, 30%);
	margin-right: 1em;
}

.oyakudachi_side_archive_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.oyakudachi_side_archive_img + div{
	width: calc(100% - min(80px, 30%));
}


.archive_content_title{
	font-weight: 700;
}


.archive_content_title + p{
	font-size: 80%;
}

.side_categories > a{
	display: block;
	color: var(--main-font-black);
	text-decoration: none;
    transition: .3s;
}

.side_categories > a:hover{
	background-color: rgba(0,104,181,.3);
    transition: .3s;
}

.category_content{
	border-bottom: 1px solid var(--main-font-black);
	padding: 1em 4em 1em 0.2em;
	position: relative;
}

.category_content span{
	display: block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0.2em;
	background-color: var(--sub-theme-color);
	padding: 0.2em 0.6em;
	border-radius: 30px;
}

.example_content-other.fortwcolumn > a{
	width: 48%;
}

.oncat{
	position:relative;
}

.oyakudachi_cats{
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--advance-color);
	font-weight: bold;
	padding: 0.2em 0.5em;
	color: #fff;
}


/*お役立ち情報集ページのスタイル　ここまで*/



/*固定ページのスタイル　ここから*/


/*２カラム、３カラムの汎用スタイル*/
.sep2,
.sep3{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.sep2 > div {
	width: 47%;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.sep2 > div {
		width: 100%!important;
	}
}

@media(max-width:599px) {
}


.sep3 > div{
	width: 30%;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.sep3 > div {
		width: 45%!important;
	}
}

@media(max-width:599px) {
	.sep3 > div {
		width: 100%!important;
	}
}

.content .sep3 h6{
	font-size: 2.2rem;
	text-align: center;
}

@media(max-width:820px) {
	.content .sep3 h6{
		font-size: 1.8rem;
	}
}

.sep2 img,
.sep3 img{
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.sep2.contain img,
.sep3.contain img{
	aspect-ratio: inherit;
	object-fit: contain;
	margin-bottom: 20px;
}

.button + img{
	margin: 1em 0;
}



/*--ダイキョーとはページのスタイル　ここから*/

.sep3.seijitsu_main img{
	aspect-ratio: 16 / 9;
}

.sep2.syachocomment{
	justify-content: space-between;
	align-items: flex-start;
}

.sep2.syachocomment > div:first-of-type{
	width: min(300px,28%);
    margin: 1.5em auto 0;
}

.sep2.syachocomment h6{
	font-size: 2rem;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.sep2.syachocomment > div:first-of-type{
		width: 50%;
	}
}

@media(max-width:599px) {
}


/*社長顔写真*/
.sep2.syachocomment > div img{
	aspect-ratio: 3 / 4;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.sep2.syachocomment > div img{
		aspect-ratio: 1 / 1;
		width: min(350px, 70%);
		margin: 0 auto;
	}
}



.sep2.syachocomment > div:nth-of-type(2){
	width: calc(96% - min(300px,28%));
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.sep2.syachocomment > div:nth-of-type(2){
		width: 100%;
	}
}

@media(max-width:599px) {
}


.seijitsu > ol.sep3{
	justify-content: center;
}


.seijitsu > ol.sep3 li{
	counter-increment: counter01; 
	position: relative;
	width: min(261px, 25%);
	list-style: none;
	margin: 5px;
	padding-top: 2em;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.seijitsu > ol.sep3 li{
		
	}
}

@media(max-width:599px) {
	.seijitsu > ol.sep3 li{
		width: 47%;
		padding-left: 5px;
		padding-bottom: 5px;
		padding-right: 5px;
	}
}



.seijitsu > ol.sep3 li::before{
	content: counter(counter01);
	position: absolute;
	top: 1em;
	left: 50%;
	transform: translateX(-50%);
	font-size: 2rem;
	font-weight: bold;
	color: var(--main-theme-font-color);
}


.seijitsu > ol.sep3 li::after{
	content: 'more >';
	position: absolute;
	display: inline-block;
	font-weight: 700;
	bottom: 0;
	right: 10px;
	color: var(--main-theme-font-color);
}


.seijitsu > ol.sep3 li a{
	padding-top: 20px;
	display: block;
	text-decoration: none;
	color: var(--main-font-black);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.seijitsu > ol.sep3 li a{
		padding-top: 0;
		margin-top: -10px;
	}
}



.seijitsu > ol.sep3 li img{
	width: min(100px, 60%);
	aspect-ratio: 1 / 1;
	margin: 0 auto 20px;
}

.sep3 img.sunlife {
	aspect-ratio: inherit; 
    object-fit: contain;
}


/*リフォーム工事の流れ　ここから*/

.sep2.flow div:first-of-type{
	width: min(600px, 68%);
}

.sep2.flow div:nth-of-type(2){
	width: min(340px, 30%);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	.sep2.flow{
		flex-direction: column-reverse;
		margin-bottom: 30px;
	}
}

@media(max-width:599px) {
}


.sep2.flow img,
.sep3.flow img{
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.plusone_wrapper{
	width: min(720px, 100%);
	margin: 0 auto;
}

.plusone_imgs{
	margin: 0 auto;
}

.plusone_imgs > div:nth-of-type(2){
	display: flex;
	flex-direction: column;
}

.plusone_imgs img{
	width: min(150px,100%);
	margin: 0 auto 10px;
}


/*リフォーム体験館ページのスタイル　ここまで*/


.taikenkan_title{
	width: min(753px, 100%);
	margin: 0 auto;
	margin-bottom: 100px;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.taikenkan_title{
		margin-top: 20px;
		margin-bottom: 20px;
	}
}


.taikenkan_title img{
	width: 100%;
	aspect-ratio:753 / 200;
}

.showroomslide .swiper-slide img{
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.showroom_slides .swiper_button{
	width: min(45px, 100%);
	display: inline-block;
	margin-left: 10px;
	margin-top: 10px;
	float: right;
}

.showroomslidetitle{
	width: min(620px, 100%);
	margin: 0 auto 30px;
}

.showroomslidetitle img{
	width: 100%;
	aspect-ratio: 620 / 187;
	object-fit: contain;
}


/*下水工事ページのスタイル　ここから*/


.gesui_title{
	width: min(726px, 100%);
	margin: 0 auto;
}

.gesui_title img{
	aspect-ratio:726 / 148;
	width: 100%;
	object-fit: contain;
}

.gesui_muryo{
	width: min(420px, 100%);
	margin: 0 auto;
}

.gesui_muryo img{
	aspect-ratio:420 / 92;
	width: 100%;
	object-fit: contain;
}

.gesui_tamemasu{
	width: min(667px, 100%);
	margin: 0 auto;
}

.gesui_tamemasu img{
	aspect-ratio:667 / 45;
	width: 100%;
	object-fit: contain;
}



@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.sep3 img.voicesimg{
		width: 80%;
		margin: 0 auto;
	}
}


.content p.voice{
	margin: 1em 0;
}




/*不動産紹介ページのスタイル　ここから*/

.toriatsukai_banner{
	width: min(780px, 100%);
	margin: 50px auto 0;
}

.toriatsukai_banner img{
	aspect-ratio:780 / 200;
	width: 100%;
	object-fit: contain;
}


/*よくある質問ページのスタイル*/

.question{
	width: 100%;
	padding: 1.5em 70px;
	position: relative;
	background-color: var(--main-theme-color);
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	cursor: pointer;
	margin-top: 10px;
}

@media(max-width:820px) {
	.question{
		font-size: 1.5rem;
	}
	
}

@media(max-width:599px) {
	.question{
/*		padding: 1.5em 50px;*/
		padding: 1.2em 40px;
	}
}


.question::before{
	content: 'Q.';
	display: inline-block;
	position: absolute;
	top: 1.5em;
	left: 30px;
	color: #fff;
	font-weight: 700;
}

@media(max-width:599px) {
	.question::before{
		left: 15px;
		top: 1.2em;
	}
}

.question::after{
	content: '';
	position: absolute;
	display: inline-block;
	background-image: url("../img/faq_arrow.png");
	aspect-ratio: 30 / 15;
	width: 30px;
	top: 33px;
	right: 30px;
	background-size: contain;
	transform:rotateZ(0deg);
	transition: .3s;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.question::after{
		right: 15px;
		width: 20px;
	}
}


.question.active::after{
	transform:rotateZ(180deg);
	transition: .3s;
}


.answer{
	width: 100%;
	display: none;
	padding: 1.5em 70px;
	position: relative;
	background-color: #e6f9ff;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.answer{
		padding: 1.5em 50px;
	}
}

.answer::before{
	content: 'A.';
	display: inline-block;
	position: absolute;
	top: 1.2em;
	left: 30px;
	font-size: 1.8rem;
	font-weight: 700;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.answer::before{
		left: 15px;
	}
}


.answer > p{
	margin: 0.5em 0;
}


.answer > p:first-of-type,
.answer > p:last-of-type{
	margin-top: 0;
}



/*フォーム類のスタイル　ここから*/


.contact_area.no_bg{
	background-image: none;
}

.contact_area.no_bg .button_wrapper .button:nth-of-type(2) .number.middle{
	transform: translateY(50%);
}

@media(max-width:599px) {
	.contact_area.no_bg .button_wrapper .button:nth-of-type(2) .number.middle{
		transform: translateY(70%);
	}
}

@media(max-width:599px) {
	.content table.form_table tr{
		flex-direction: column;
	}
}


.content table.form_table th,
.content table.form_table td{
	background: none;
	border-bottom: 1px solid var(--main-theme-color);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.content table.form_table th,
	.content table.form_table td{
		width: 100%;
		display: block;
	}
}


.content table.form_table th{
	color: var(--main-font-black);
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.content table.form_table th{
		border-bottom: none;
		padding-bottom: 0;
	}
}


.content table.form_table td{
	transform: translateX(-3px);
}

@media(max-width:599px) {
	.content table.form_table td {
		 transform: translateX(0);
	}
}

.required{
	display: inline-block;
	width: 40px;
	text-align: center;
	color: #fff;
	background-color: var(--advance-color);
/*	padding: 0.2em 0.5em;*/
	padding: 0.1em 0.5em;
    transform: translateY(-3px);
	border-radius: 5px;
	font-size: 1rem;
}

.content table.form_table th .required{
	display: block;
	margin: 1em auto 0;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
}

@media(max-width:599px) {
	.content table.form_table th .required{
		display: inline-block;
		margin-left: 10px;
	}
}

.content table.form_table input[type="text"],
.content table.form_table input[type="email"],
.content table.form_table input[type="tel"],
.content table.form_table input[type="text"],
.content table.form_table textarea,
select{
	border: 1px solid #d8d8d8;
	border-radius: 10px;
	padding: 1em;
	width: 100%;
/*
	width: calc(100% - 20px);
    margin: 0 auto;
    display: block;
*/
}

.content table.form_table label{
	margin-right: 2em;
}

@media(max-width:1080px) {
}

@media(max-width:768px) {
	
}

@media(max-width:599px) {
	.content table.form_table label{
		margin-right: 0;
	}
}

.mwform-checkbox-field horizontal-item{
	margin-bottom: 1em;
}

.mw_wp_form_input .addarea{
	display: none;
}


/*フォームのスタイル ここまで*/



/*固定ページのスタイル　ここまで*/


/*ブログのスタイル　ここから*/

.blog_header{
	margin-bottom: 30px;
}

.side_montharchive ul{
	list-style: none;
}

.side_montharchive ul li{
	position: relative;
	border-bottom: 1px solid var(--main-font-black);
	margin-left: 0;
	padding: 1em 1em 1em 2em;
}

.side_montharchive ul li::before{
	content: '';
	position: absolute;
	display: inline-block;
	aspect-ratio: 20 / 16;
	width: 20px;
	background-image: url("../img/montharc_icon.png");
	background-size: contain;
	top: 50%;
	transform: translateY(-50%);
	left:0;
}

.side_montharchive ul li a{
	display: inline-block;
	text-decoration: none;
	color: var(--main-font-black);
}

.side_montharchive ul li a:hover{
	color: var(--sub-theme-font-color);
}

.content .side_content h4:first-of-type{
	margin-top: 0;
}

.side_categories{
	margin-bottom: 50px;
}

/*アーカイブ用*/

.latest_blog .card .sep > div:first-of-type{
	width: calc(100% - min(200px, 30%));
}

.latest_blog .card .sep > div:nth-of-type(2){
	width: min(200px, 30%);
}


.latest_blog_img img{
	width: 100%;
	object-fit: cover;
}

.latest_blog .card{
	padding: 10px 20px;
}

.latest_blog p{
	margin: 1em 0;
}

.latest_blog .day{
	margin-top: 1em;
}

.latest_blog p.blog_title{
	margin-top: 0;
}

.blog_header a{
	transition: .3s;
}

.blog_header a:hover{
	opacity: .7;
	transition: .3s;
}

.forblogall{
	margin-top: 50px;
}


/*ブログのスタイル　ここまで*/




/*サイト内検索関連のスタイル　ここから*/

.search_post_type{
	display: inline-block;
	font-size: 1.3rem;
	padding: 0.2em 1em;
	border: 1px solid var(--main-theme-color);
	color: var(--main-theme-font-color);
	margin-bottom: 0.5em;
}

.form_wrapper{
	text-align: center;
}


/*サイト内検索関連のスタイル　ここまで*/

.content .flow .button{
	margin: 1.5em auto;
}


.freerental > div{
	margin-bottom: 1.5em;
}


.product_intro-teika span.openprice{
	display: block;
	text-align: right;
	margin-left: 0;
}


/* 特設ページ「気になる！トイレ特集」用CSS */

.hikaku{
	background-color: #bae3f9;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 50px;
    padding-bottom: 100px;
	background-image: url(https://www.daikyo-reform.com/daikyo_wp/wp-content/uploads/2023/07/topic01-bg.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: 0 -6%;
}

@media(max-width:768px) {
	.hikaku .content{
		background-position: inherit;
	}
}

.hikaku table{
	width: auto;
}

.hikaku table th,
.hikaku table td{
	white-space: nowrap;
	text-align: center;
}

.hikaku table p{
	margin: 0;
	text-align: center;
}

.hikaku table td,
.qabox table td{
	background-color: #fff;
}

.topic01-image{
	width: min(180px, 100%);
	margin: 0 auto 10px;
}

.icon-maker{
	height: 15px;
	text-align: center;
	margin-bottom: 10px;
}

.icon-maker img{
	display: inline;
/*	height: 100%;*/
}

.val{
	font-size: 3rem;
}

.hikaku tr .button a{
	font-size: 1.4rem;
}

.content h2.image_title{
	border-bottom: none;
	text-align: center;
	display: block;
	margin: 0 auto;
}

.hikaku h2{
	width: min(620px, 100%);
}

.hikaku img{
	margin: 0 auto;
}

.setsudenqa{
	background-color: #f39800;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 50px;
    padding-bottom: 100px;
}

.setsudenqa h2{
	width: min(688px, 100%);
}

.qabox{
	background-color: #fff;
	padding: 50px 20px;
	border-radius: 10px;
	position: relative;
/*	margin-top: 80px;*/
	margin-top: 50px;
}

.qabox::before{
	content: '';
	position: absolute;
	display: inline-block;
	background-image: url(https://www.daikyo-reform.com/daikyo_wp/wp-content/uploads/2023/07/topic02-image01.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 95px;
	height: 100px;
	top: -60px;
    right: 20px;
}

.qabox::after{
	content: '';
	position: absolute;
	display: inline-block;
	background-image: url(https://www.daikyo-reform.com/daikyo_wp/wp-content/uploads/2023/07/topic02-image02.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 160px;
	height: 65px;
	bottom: 10px;
    left: 20px;
}

.qbox{
	background-color: #ddd9ec;
	border-radius: 10px;
	padding: 30px 10px;
	margin-bottom: 10px;
	position: relative;
}
@media(max-width:768px) {
	.qbox{
		padding: 20px 10px;
	}
}

.qbox::before{
	content: 'Q';
	display: inline-block;
	position: absolute;
	text-align: center;
	font-size: 3rem;
	font-weight: 700;
	color: #fff;
	background-color: #1d2088;
	width: 50px;
	height: 50px;
/*	top: 50%;*/
	top: 17px;
/*	transform: translateY(-50%);*/
	border-radius: 50%;
	margin-right: 20px;
    line-height: 1.5;
}

@media(max-width:768px) {
	.qbox::before{
		font-size: 2.3rem;
		width: 40px;
		height: 40px;
	}
}

.qbox p{
	margin: 0;
	padding-left: 60px;
}

@media(max-width:768px) {
	.qbox p{
		padding-left: 50px;
	}
}

.abox{
	background-color: #f6d4d3;
	border-radius: 10px;
	padding: 30px 10px;
	margin-bottom: 50px;
	position: relative;
}

@media(max-width:768px) {
	.abox{
		padding: 20px 10px;
	}
}

.abox::before{
	content: 'A';
	display: inline-block;
	position: absolute;
	text-align: center;
	font-size: 3rem;
	font-weight: 700;
	color: #fff;
	background-color: #d70051;
	width: 50px;
	height: 50px;
/*	top: 50%;*/
	top: 17px;
/*	transform: translateY(-50%);*/
	border-radius: 50%;
	margin-right: 20px;
    line-height: 1.5;
}

@media(max-width:768px) {
	.abox::before{
		font-size: 2.3rem;
		width: 40px;
		height: 40px;
	}
}

.abox p{
	margin: 0;
	padding-left: 60px;
}

@media(max-width:768px) {
	.abox p{
		padding-left: 50px;
	}
}

.abox table{
	padding-left: 60px;
	margin-top: 20px;
}

@media(max-width:768px) {
	.abox table{
		padding-left: 0;
	}
}

/*スタッフブログ一覧ページ　最新記事表示欄*/

.blogall .wrighter{
	flex-direction: column;
	width: 100px;
	margin-right: 20px;
	margin-top: 0;
}

@media(max-width:768px) {
	.blogall .wrighter{
		width: 80px;
	}
}

.blogall .wrighter + div{
	width: calc(100% - 120px);
}

@media(max-width:768px) {
	.blogall .wrighter + div{
		width: calc(100% - 100px);
	}
}

.blogall .writer_img{
	width: 100%;
	margin-right: 0;
}

.blogall .writer_img + p{
	margin: 0.3em 0;
	font-size: 1.3rem;
}

.content ul.news_archive.blogall{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

@media(max-width:768px) {
	.content ul.news_archive.blogall{
		display: inherit;
	}
}

.content ul.news_archive.blogall li{
	width: 48%;
}

@media(max-width:768px) {
	.content ul.news_archive.blogall li{
		width: 100%;
	}
}

.content ul.news_archive.blogall li a{
	display: flex;
	align-items: center;
	padding: 1em 1em 0.5em;
	font-size: 1.8rem;
}

.blogall p.date{
	font-size: 1.5rem;
	margin: 0 0 0.7em 0;
}

.blogall p.date .new{
	font-size: 1.2rem;
}

.star_count td strong{
	transform: translateY(-5px);
    display: inline-block;
    font-size: 120%;
}

.hikaku .star_count td strong + img{
	display: inline-block;
	width: min(105px, 70%);
}


/*　230824_ミラブルプレゼント特設ページ用css ここから　*/

.iframe_wrapper{
	position: relative;
	width: 100%;
	overflow: hidden;
}

.iframe_wrapper::before {
	content: "";
	display: block;
	padding-top: 56%;
}

.iframe_wrapper iframe {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.introduce_box{
	border: 2px solid #4ab0a9;
	border-radius: 15px;
	width: min(675px, 100%);
	margin: 0 auto;
	background-color: #fff;
	padding-bottom: 20px;
}

.introduce_box > div{
	margin: 1em 1.5em;
}

.introduce_box h6{
	width: 100%;
	background-color: #4ab0a9;
	color: #fff;
	margin-top: 0;
	border-radius: 10px 10px 0 0;
	padding: 1em;
	text-align: center;
}

.bg_blue{
	background-color: #bae3f9;
	text-align: center;
	font-size: 1.8rem!important;
	margin-top: 40px;
	margin-bottom: 40px;
	padding-right: 10px;
	padding-left: 10px;
	border-radius: 10px;
}

.bg_blue .content p {
	font-size: 1.8rem;
}

.bg_blue .content{
	padding-bottom: 30px;
}

.bg_blue img{
	margin: 0 auto;
}

/*　230824_ミラブルプレゼント特設ページ用css ここまで　*/


/*　230922_外壁塗装ページ用css ここから　*/

.gaiheki-fv{
	width: 100%;
	background-image: url("../img/gaiheki-fv-main.jpg");
	background-size: cover;
	background-position: center;
}

.gaiheki-fv div.law{
	position: relative;
}

.gaiheki-fv div.law::before{
	position: absolute;
	content: '';
	display: inline-block;
	background-image: url("../img/gaiheki-fv-point01.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	width: min(320px, 25%);
	height: 533px;
	bottom: -150px;
	left: 0;
	z-index: 50;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-fv div.law::before{
		bottom: inherit;
		top: 30px;
		background-position: top;
		width: min(320px, 30%);
		left: 15px;
	}
}


.gaiheki-fv div.law::after{
	position: absolute;
	content: '';
	display: inline-block;
	background-image: url("../img/gaiheki-fv-point02.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: top;
	width: min(319px, 25%);
	height: 302px;
	top: 50px;
	right: 0;
	z-index: 50;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-fv div.law::after{
		right: 15px;
	}
}

.gaiheki-title{
	width: min(533px, 50%);
	margin: 0 auto;
	transform: translateY(150px);
	position: relative;
	z-index: 100;
	display: block;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-title{
		width: min(533px, 75%);
	}
}

.gaiheki-intro{
	background-color: var(--main-theme-color);
	font-weight: 700;
	color: #fff;
	font-size: 2.7rem;
	padding-top: 170px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
	.gaiheki-intro{
		font-size: 2.3rem;
	}
}

@media(max-width:599px) {
	.gaiheki-intro{
		font-size: 1.7rem;
		padding-top: 150px;
	}
}

.gaiheki-intro > div.law{
	display: flex;
	justify-content: center;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-intro > div.law{
		display: block;
		position: relative;
	}
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-intro > div.law > div:first-of-type{
		padding-bottom: 60px;
	}
	
	.gaiheki-intro > div.law > div:nth-of-type(2){
		position: absolute;
		bottom: 0;
		right: 15px;
   		width: min(218px, 30%);
	}
}

.gaiheki-intro p{
	margin: 0.5em 0;
	line-height: 1.8;
}

.gaiheki-intro p span{
	font-size: 170%;
}

.gaiheki-intro p strong{
	font-weight: 900;
	border-bottom: 1px solid #fff;
}

.fukidashi{
	font-weight: 700;
	color: var(--main-font-black);
	padding: 1em 1.5em;
	background-color: #fff;
	display: inline-block;
	border-radius: 25px;
	font-size: 1.7rem;
	position: relative;
	line-height: 1.5;
}

.fukidashi::after{
	position: absolute;
	content: '';
	width: 25px;
	height: 10px;
	background-image: url("../img/gaiheki-check-fukidashi.png");
	background-repeat: no-repeat;
	top: -5px;
	right: -3px;
	background-size: contain;
	transform: rotate(-45deg)
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.fukidashi{
		font-size: 1.4rem;
	}
	
	.gaiheki-intro .fukidashi{
		width: 60%;
	}
}

.gaiheki-graph{
	width: min(410px, 100%);
	margin: 0 auto;
}


.bg-point > div.law,
.hband > div.law{
	position: relative;
}

.bg-point > div.law::before,
.hband > div.law::before{
	position: absolute;
	content: '';
	bottom: 20px;
	left: 0;
	display: inline-block;
	width: 52px;
	height: 79px;
	background-image: url("../img/gaiheki-bg-point01.png");
	background-repeat: no-repeat;
	background-size: contain;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.bg-point > div.law::before,
	.hband > div.law::before{
		bottom: 0;
		width: 32px;
		height: 54px;
		left: 15px;
	}
}

.bg-point > div.law::after,
.hband > div.law::after{
	position: absolute;
	content: '';
	top: 0;
	right: 0;
	display: inline-block;
	width: 73px;
	height: 83px;
	background-image: url("../img/gaiheki-bg-point02.png");
	background-repeat: no-repeat;
	background-size: contain;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.bg-point > div.law::after,
	.hband > div.law::after{
		width: 44px;
    	height: 50px;
		top: -30px;
		right: 15px;
	}
}

.content.gaiheki-aging{
	padding-bottom: 30px;
	position: relative;
}

.content.gaiheki-aging::after{
	position: absolute;
	content: '';
	right: 0;
	left: 0;
	margin: 0 auto;
	bottom: -25px;
	width: 0;
	height: 0;
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
	border-top: 30px solid #fff;
}

.gaiheki-aging h2{
	border-bottom: none;
}

.gaiheki-graph img{
	object-fit: contain;
	object-position: top;
}

.gaiheki-aging .sep2 > div{
	font-size: 1.6rem;
	line-height: 2;
}

.gaiheki-aging .sep2 > div strong{
	background: linear-gradient(transparent 60%, var(--sub-theme-color) 0%);
}

.gaiheki-aging .sep2 > div:first-of-type{
	width: calc(100% - 460px);
}

.gaiheki-aging .sep2 > div:last-of-type{
	width: min(410px, 100%);
}

.meyasu{
	text-align: center;
}

.meyasu p:first-of-type{
	font-size: 2rem;
}

.meyasu p strong{
	background: linear-gradient(transparent 60%, var(--sub-theme-color) 0%);
	font-size: 180%;
}

.gaiheki-sign{
	background-image: url("../img/gaiheki-check-bg.jpg");
	background-size: cover;
	background-color:rgba(255,255,255,0.7);
	background-blend-mode:lighten;
}

.gaiheki-checkes{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.gaiheki-checkes > div{
	background-color: #fff;
	border-radius: 10px;
	padding: 17px;
	width: min(342px, 32%);
	font-weight: 700;
	font-size: 1.7rem;
	text-align: center;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-checkes > div{
		width: 49%;
	}
}


.gaiheki-check{
	width: min(28px, 100%);
	margin: 10px auto 0;
}

.gaiheki-check img{
	object-fit: contain;
}

.gaiheki-check + p{
	margin-top: 0.5em;
	margin-bottom: 0;
}

@media(max-width:820px) {
	.gaiheki-check + p{
		height: 70px;
	}
}

.gaiheki-check + p span{
	font-size: 1rem;
	display: inline-block;
    transform: translateY(-0.7em);
}

.gaiheki-checkes .sep2 img{
	aspect-ratio: inherit;
}

.gaiheki-checkes .sep2 > div{
	width: 50%;
	margin-bottom: 0;
}

.gaiheki-sign-staff{
	display: flex;
	justify-content: center;
	align-items: center;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-sign-staff{
		justify-content: space-between;
	}
}


.gaiheki-sign-staff > div:first-of-type{
	width: 65%;
}

.gaiheki-sign-staff > div:last-of-type{
	width: min(225px, 32%);
}

@media(max-width:599px) {
	.gaiheki-sign-staff .fukidashi::after{
		transform: inherit;
		top: 20%;
		right: -20px;
	}
}

.sep2 .gaiheki-staff02 img{
	aspect-ratio: inherit;
}

.gaiheki-popup{
	text-align: center;
}

.gaiheki-popup p{
	font-size: 1.6rem;
	font-weight: 600;
	display: inline-block;
	text-align: center;
	position: relative;
	margin-bottom: 0;
}

.gaiheki-popup p::before{
	content: '';
	position: absolute;
	bottom: 10px;
    left: -25px;
	width: 23px;
	height: 3px;
	background-color: var(--sub-theme-color);
	transform: rotate(-120deg);
}

.gaiheki-popup p::after{
	content: '';
	position: absolute;
	bottom: 10px;
    right: -25px;
	width: 23px;
	height: 3px;
	background-color: var(--sub-theme-color);
	transform: rotate(120deg);
}

h2.exb{
	font-weight: 900;
	line-height: 1.5;
	font-size: 4rem;
	margin-top: 0.2em;
	border-bottom: inherit;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	h2.exb{
		font-size: 2.6rem;
	}
}

h2.exb span{
	border-bottom: 2px solid var(--main-font-black);
}

.gaiheki-reason{
	background-color: #fff;
	position: relative;
}

.gaiheki-reason::before{
	content: '';
	position: absolute;
	display: inline-block;
	z-index: 30;
	bottom: 97%;
	width: 100%;
	height: 160px;
	background-image: url("../img/gaiheki-reason-bg.png");
	background-size: contain;
	background-repeat: repeat-x;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-reason::before{
/*		height: 120px;*/
		height: 100px;
	}
}


.gaiheki-reason p{
	line-height: 2;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-reason p{
		line-height: 1.7;
		margin-top: 10px;
	}
}

.gaiheki-reason .sep2{
	margin-bottom: 50px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-reason .sep2{
		margin-bottom: 30px;
	}
}


.gaiheki-reason .sep2 img{
	aspect-ratio: inherit;
}

.gaiheki-reason h3{
	position:relative;
	padding-left: 130px;
	font-size: 2.3rem;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-reason h3{
		padding-left: 0;
		margin: 0;
	}
}


.gaiheki-reason h3 span{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	font-size: 4rem;
	color: var(--main-font-black);
	background-image: url("../img/gaiheki-reason-numbg.png");
	background-position: 5px center;
	width: 113px;
	height: 70px;
	background-size: contain;
	text-align: center;
	padding-top: 10px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-reason h3 span{
		position: inherit;
		width: 84px;
		height: 52px;
		font-size: 3rem;
		padding-top: 5px;
		margin: 0 auto 10px;
	}
}


.hband{
	background-color: var(--main-theme-color);
	padding: 60px 0 160px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.hband{
		    padding: 40px 0 120px;
	}
}

.hband h2{
	color: #fff;
	border-bottom: inherit;
	font-size: 4rem;
	line-height: 1.5;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.hband h2{
		font-size: 2.6rem;
		padding-bottom: 1.2em;
	}
}


.hband + div{
	margin-top: -120px;
}

.gaiheki-menu-wrapper > div{
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 15px -5px #777777;
	padding: 30px;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-menu-wrapper > div{
		padding: 15px;
	}
}


.gaiheki-menu-wrapper .sep2 img{
	aspect-ratio: inherit;
}

.gaiheki-menu-wrapper .sep2 > div:first-of-type{
	width: min(336px, 33%);
}

.gaiheki-menu-wrapper .sep2 > div:last-of-type{
	width: 63%;
}

.gaiheki-menu-wrapper h3{
	margin-top: 0;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-menu-wrapper h3{
		font-size: 1.9rem;
		margin-top: 0.4em;
	}
}

.gaiheki-menu-wrapper h3 span{
	display: inline-block;
	background-color: var(--main-theme-color);
	width: 37px;
	height: 37px;
	color: #fff;
	text-align: center;
	margin-right: 0.5em;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-menu-wrapper h3 span{
		padding-top: 5px;
	}
}


.gaiheki-menu-wrapper p{
	line-height: 2;
	margin-bottom: 0;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-menu-wrapper p{
		line-height: 1.7;
		margin-top: 0;
	}
}

.gaiheki-menu-staff{
	display: flex;
	justify-content:center;
	align-items: center;
	margin-top: 15px;
}

.gaiheki-menu-staff > div:first-of-type{
	width: min(182px, 32%);
}

.gaiheki-menu-staff > div:last-of-type{
	width: min(350px, 65%);
}

.gaiheki-menu-staff .fukidashi{
	background-color: var(--main-theme-color);
	color: #fff;
}

.gaiheki-menu-staff .fukidashi::after{
	background-image: url("../img/gaiheki-check-fukidashi-b.png");
	top: -5px;
	left: -3px;
	transform: rotate(-135deg)
}

.gaiheki-steps h2{
	text-align: center;
}

.gaiheki-steps h2 > span{
	position: relative;
	padding-left: 160px;
	line-height: 1.5;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
	.gaiheki-steps h2 > span{
		padding-left: 4em;
	}
}

@media(max-width:599px) {
	.gaiheki-steps h2 > span{
/*		padding-left: 100px;*/
		padding-left: 4.5em;
	}
}

.gaiheki-steps h2 span{
	display: inline-block;
	text-align: left;
}

.gaiheki-steps h2 span.steptitle-num{
	position: absolute;
	font-size: 12rem;
	left: 0;
/*	top: 0;*/
	top: -6px;
	letter-spacing: 0;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-steps h2 span.steptitle-num{
		font-size: 8rem;
	}
}


.gaiheki-steps-wrapper{
	width: min(780px, 100%);
	position: relative;
}



.gaiheki-open-button,
.gaiheki-close-button{
	display: none;
}


@media(max-width:599px) {
	
	.gaiheki-steps-wrapper.is_closed::after{
		background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 50%, rgba(255,255,255,.9) 50%, #fff 100%);
		background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 50%, rgba(255,255,255,.9) 50%, #fff 100%);
		bottom: 0;
		content: "";
		height: 120px;
		position: absolute;
		width: 100%;
		z-index: 30;
	}


	.gaiheki-steps-wrapper.is_closed{
		height: 400px;
		overflow: hidden;
	}

	.gaiheki-open-button,
	.gaiheki-close-button{
		color: #fff;
		background-color: var(--main-theme-color);
		border-radius: 25px;
		padding: 1em 1.5em;
		text-align: center;
		width: min(230px, 100%);
		transition: all .2s;
		display: block;
	}

	.gaiheki-open-button{
		position: absolute;
		display: none;
		z-index: 40;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
	}

	.gaiheki-close-button{
		margin: 30px auto 0;
	}

	.is_closed .gaiheki-open-button{
		display: block;
	}
}

.gaiheki-step{
	padding-top: 50px;
	padding-bottom: 15px;
	position: relative;
	padding-right: 15px;
	padding-left: 15px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-step{
		padding-top: 30px;
		padding-bottom: 1px;
	}
}

.gaiheki-step:first-of-type{
	background-color: #e9eff3;
	padding-top: 40px;
}

@media(max-width:599px) {
	.gaiheki-step:first-of-type{
		padding-top: 15px;
	}
}

.gaiheki-step:nth-of-type(9),
.gaiheki-step:nth-of-type(10){
	color: #fff;
}

.gaiheki-step::after{
	content: '';
	position: absolute;
	width: 100%;
	background-size: contain;
	height: 45px;
	background-repeat: no-repeat;
	top: 100%;
	z-index: 20;
	right: 0;
}

.gaiheki-step:first-of-type::after{
	background-image: url("../img/gaiheki-step-point01.png");
}

.gaiheki-step:nth-of-type(2){
	background-color: #dee9f0;
}

.gaiheki-step:nth-of-type(2)::after{
	background-image: url("../img/gaiheki-step-point02.png");
}


.gaiheki-step:nth-of-type(3){
	background-color: #cfe0eb;
}

.gaiheki-step:nth-of-type(3)::after{
	background-image: url("../img/gaiheki-step-point03.png");
}


.gaiheki-step:nth-of-type(4){
	background-color: #bed6e6;
}

.gaiheki-step:nth-of-type(4)::after{
	background-image: url("../img/gaiheki-step-point04.png");
}


.gaiheki-step:nth-of-type(5){
	background-color: #afcde1;
}

.gaiheki-step:nth-of-type(5)::after{
	background-image: url("../img/gaiheki-step-point05.png");
}


.gaiheki-step:nth-of-type(6){
	background-color: #9ec3dc;
}

.gaiheki-step:nth-of-type(6)::after{
	background-image: url("../img/gaiheki-step-point06.png");
}


.gaiheki-step:nth-of-type(7){
	background-color: #92bcd8;
}

.gaiheki-step:nth-of-type(7)::after{
	background-image: url("../img/gaiheki-step-point07.png");
}


.gaiheki-step:nth-of-type(8){
	background-color: #81b2d3;
}

.gaiheki-step:nth-of-type(8)::after{
	background-image: url("../img/gaiheki-step-point08.png");
}


.gaiheki-step:nth-of-type(9){
	background-color: #7dabcf;
}

.gaiheki-step:nth-of-type(9)::after{
	background-image: url("../img/gaiheki-step-point09.png");
}


.gaiheki-step:nth-of-type(10){
	background-color: #73a5cc;
}

.gaiheki-step:nth-of-type(10)::after{
	background-image: url("../img/gaiheki-step-point10.png");
}


.gaiheki-step:last-of-type{
	background-color: var(--main-theme-color);
	color: #fff;
	text-align: center;
}


.gaiheki-step:last-of-type h4{
	font-size: 3.3rem;
	font-weight: 700;
	text-align: center;
}

.gaiheki-step:last-of-type h4 span{
	display: inline-block;
	position: relative;
}

.gaiheki-step:last-of-type h4 span::before{
	position: absolute;
	content: '';
	background-image: url("../img/gaiheki-finished.png");
	width: 200px;
	height: 35px;
	background-size: contain;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


.gaiheki-step:last-of-type > div > div{
	padding: 0.8em 0;
}





.gaiheki-step > div{
	width: min(630px, 100%);
	margin: 0 auto;
	position: relative;
}

.gaiheki-step h4{
	padding-left: 0;
	border-left: none;
}

@media(max-width:599px) {
	.gaiheki-step h4 + p{
		margin: 0.7em 0;
	}
}

.gaiheki-stepnum{
	font-size: 4.5rem;
/*	font-weight: 900;*/
	font-weight: 700;
	color: var(--main-theme-color);
	width: 88px;
	height: 88px;
	text-align: center;
	background-color: #fff;
	border-radius: 45px;
	box-shadow: 0px 0px 15px -5px #777777;
	padding-top: 17px;
	position: absolute;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-stepnum{
		font-size: 3.5rem;
		width: 60px;
		height: 60px;
		padding-top: 9px;
	}
}


.gaiheki-stepnum + div{
	padding-left: 115px;
}

@media(max-width:1080px) {
}

@media(max-width:820px) {
}

@media(max-width:599px) {
	.gaiheki-stepnum + div{
		padding-left: 75px;
	}
}


.inner_construct_price .sep2 img{
	aspect-ratio: inherit;
	width: auto;
}

.inner_construct_price .sep2 > div{
	background-color: #fff;
	border-radius: 10px;
	padding: 15px;
}

.inner_construct_price .sep2 p{
	line-height: 2;
}

@media(max-width:599px) {
	.inner_construct_price .sep2 p{
		line-height: 1.7;
	}
}

.gaiheki-ex-ppl{
	display: inline-block;
	width: 50px;
	height: 50px;
	margin-bottom: 10px;
}

.gaiheki-ex-ppl + p{
	display: inline-block;
	font-weight: 700;
	transform: translateY(-2em);
	padding-left: 0.5em;
	margin: 0;
}

.gaiheki-voices h3{
	margin: 2em 0;
}

@media(max-width:599px) {
	.content.gaiheki-steps,
	.content.gaiheki-menues,
	.content.gaiheki-reason,
	.content.gaiheki-voices{
		padding-bottom: 50px;
	}
}



/*　230922_外壁塗装ページ用css ここまで　*/



/*　231005_キッチン比較ページ用css ここから　*/

.kitchen_type{
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 10px;
}

.example_category-large{
	font-size: 1.2rem;
	padding: 0.2em 1em;
	border-radius: 20px;
	background-color: var(--main-theme-color);
	color: #fff;
	display: inline-block;
	margin-bottom: 10px;
}

.hikaku.kitchen{
	background-image: none;
	padding: 15px;
	margin-bottom: 50px;
}

.hikaku.kitchen table td{
	text-align: left;
	padding-left: 1.2em;
	padding-right: 1.2em;
	width: 25%;
/*	white-space: wrap;*/
	vertical-align: top;
}

.hikaku.kitchen table p{
	text-align: left;
}

.hikaku.kitchen table img{
	margin-bottom: 10px;
}

.kitchen_point.flex{
	flex-wrap: wrap;
}

.kitchen_point > div{
	width: 48%;
	border-radius: 10px;
	padding: 20px 15px;
	margin-bottom: 30px;
	background-color: #fff;
}

@media(max-width:599px) {
	.kitchen_point > div{
		width: 100%;
	}
}

.kitchen_point-wrapper{
	width: 52%;
	display: inline-block;
}

@media(max-width:599px) {
	.kitchen_point-wrapper{
		width: 60%;
	}
}

.kitchen_point .kitchen_point-wrapper + div{
	float: right;
	width: 47%;
}

@media(max-width:599px) {
	.kitchen_point .kitchen_point-wrapper + div{
		width: 38%;
	}
}

.kitchen_point > div:first-of-type{
	box-shadow: 0px 0px 15px -5px #ef4e16;
}

.kitchen_point > div:nth-of-type(2){
	box-shadow: 0px 0px 15px -5px #4b7754;
}

.kitchen_point > div:nth-of-type(3){
	box-shadow: 0px 0px 15px -5px #3071b9;
}

.kitchen_point > div:last-of-type{
	box-shadow: 0px 0px 15px -5px #6a3906;
}

/*　231005_キッチン比較ページ用css ここまで　*/



/*　240327_お風呂比較ページ用css ここから　*/

.bathcomp-subtitle img{
	margin: 0 auto 70px;
	width: min(404px, 75%);
}

.bathcomp-person > div{
	width: 55%;
}

.bathcomp-fukidashi{
	background-color: #cfe9f7;
	padding: .5em;
	font-size: 1.3rem;
	color: #4d4d4d;
	position: relative;
	border-radius: 5px;
	z-index: 10;
	margin-bottom: 15px;
}

@media(max-width:599px) {
	.bathcomp-fukidashi{
		font-size: 1.2rem;
	}
}

.bathcomp-fukidashi:last-of-type{
	margin-bottom: 0;
}

.bathcomp-fukidashi::before{
	position: absolute;
	content: '';
	display: inline-block;
	clip-path: polygon(0 50%, 100% 0, 100% 100%);
	width: 20px;
	height: 20px;
	left: -10px;
	top: 50%;
	transform: translateY(-50%);
	background-color: #cfe9f7;
	z-index: -1;
}

.bathcomp-intro:nth-of-type(2) .bathcomp-fukidashi{
	background-color: #f9e3bb;
}

.bathcomp-intro:nth-of-type(2) .bathcomp-fukidashi::before{
	left: inherit;
	right: -10px;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	background-color: #f9e3bb;
}

.bathcomp-intro p{
	margin: 0;
}

.bathcomp-fukidashi p b{
	background: linear-gradient(transparent 60%, var(--sub-theme-color) 0%);
}

.bathcomp-intro h3{
	font-size: 2.5rem;
	text-align: center;
}

.bathcomp-intro h6{
	font-size: 1.5rem;
	letter-spacing: 0;
}

.bathcomp-intro h6 + p{
	font-size: 1.4rem;
	letter-spacing: 0;
}

@media(max-width:599px) {
	.bathcomp-intro h6 + p{
		font-size: 1.3rem;
	}
}

.bathcomp-intro-wrapper{
	display: flex;
	justify-content: space-between;
	margin-bottom: 60px;
}

@media(max-width:599px) {
	.bathcomp-intro-wrapper{
		flex-direction: column;
	}
}

.bathcomp-intro{
	width: 49%;
	border-radius: 10px;
	border: 4px solid #e0e0e0;
/*	overflow: hidden;*/
	position: relative;
/*	padding: 20px;*/
	background-color: #fff;
	padding-bottom: 30px;
}


@media(max-width:599px) {
	.bathcomp-intro{
		width: 100%;
		margin-bottom: 60px;
	}
	
	.bathcomp-intro:last-of-type{
		margin-bottom: 0;
	}
}

.bathcomp-rank{
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(-40%);
}

.bathcomp-person{
	padding: 0 20px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-top: -29%;
}

@media(max-width:599px) {
	.bathcomp-person{
		padding: 0 10px;
	}
}

.bathcomp-intro:nth-of-type(2) .bathcomp-person{
	flex-direction: row-reverse;
}


.bathcomp-person > img{
	width: 40%;
}

.bathcomp-img > img{
	width: 100%;
	border-radius: 10px 10px 0 0;
}

.bathcomp-cimg{
	display: flex;
	justify-content: space-between;
	padding: 0 20px;
}

@media(max-width:599px) {
	.bathcomp-cimg{
		padding: 0 10px;
	}
}

.bathcomp-cimg > div{
	width: 49%;
}

.content .bathcomp-h2{
	font-size: 3rem;
	border-bottom: none;
	color: var(--main-theme-color);
}

@media(max-width:599px) {
	.content .bathcomp-h2{
		font-size: 2.3rem;
	}
}

.bathcomp-h2 span{
	font-size: 70%;
}

p.bathcomp-combefore{
	position: relative;
	display: inline-block;
	font-weight: 700;
	margin: 0 0 0.2em 0
}

.bathcomp-combefore::before,
.bathcomp-combefore::after{
	position: absolute;
	display: inline-block;
	content: '';
	width: 1px;
	height: 10px;
	background-color: #666666;
	bottom: 4px;
}

.bathcomp-combefore::before{
	right: 103%;
	transform: rotate(-30deg);
}

.bathcomp-combefore::after{
	left: 103%;
	transform: rotate(30deg);
}

.bathcomp-com{
	font-size: 1.6rem;
	font-weight: 700;
	padding: 1em;
	width: 100%;
	text-align: center;/*←後でラッパーに移動*/
	position: relative;
	border-radius: 45px;
	color: #fff;
	margin-bottom: 20px;
}

.sazana .bathcomp-com{
	background-color: #1d2087;
}

.every .bathcomp-com{
	background-color: #e7380d;
}

.bathcomp-com::before{
	content: '';
	position: absolute;
	clip-path: polygon(0 50%, 100% 0, 100% 100%);
	width: 20px;
	height: 20px;
	left: -10px;
	top: 50%;
	transform: translateY(-50%);
}

.sazana .bathcomp-com::before{
	background-color: #1d2087;
}

.every .bathcomp-com::before{
	background-color: #e7380d;
}

.bathcomp-vote{
	text-align: center;
	display: flex;
	align-items: flex-start;
	margin-bottom: 30px;
}

.bathcomp-vote > div{
	margin-left: 20px;
}

.bathcomp-vote ul{
	text-align: left;
	list-style: none;
}

.content .bathcomp-vote ul li{
	margin-left: 0
}

.sazana ul li::before{
	content: '・';
	font-weight: 700;
}

.sazana ul li::before{
	color: #6c9ad1;
}

.sazana ul li b{
	color: #6c9ad1;
}

.every ul li::before{
	content: '・';
	font-weight: 700;
}

.every ul li::before{
	color: #ed8599;
}

.every ul li b{
	color: #ed8599;
}

.bathcomp-vote-box{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	max-width: 930px;
	padding: 30px 15px;
	margin: 0 auto;
	border-bottom: 1px solid #939393;
}

.bathcomp-vote-box:last-of-type{
	border-bottom: none;
}

@media(max-width:599px) {
	.bathcomp-vote-box{
		flex-direction: column;
	}
}

.bathcomp-vote-box > img{
	width: 40%;
}

@media(max-width:599px) {
	.bathcomp-vote-box > img{
		width: 70%;
		max-width: 320px;
		margin: 0 auto;
	}
}

.bathcomp-vote-wrapper{
	margin-bottom: 70px;
}

p.bathcomp-result-detail{
	font-weight: 700;
	text-align: left;
	width: min(310px, 100%);
	margin-left: auto;
	margin-right: auto;
}

.bathcomp-result-detail span{
	background: linear-gradient(transparent 60%, var(--sub-theme-color) 0%);
}


.bathcomp-result .bathcomp-com{
	margin-bottom: 0;
	transform: translateY(-40px);
	width: calc(100% - 20px);
	margin-right: auto;
	margin-left: auto;
}

.bathcomp-result .bathcomp-combefore{
	transform: translateY(-40px);
}

.bathcomp-result .bathcomp-com::before{
	left: 50%;
	top: 94%;
	transform: translateX(-50%) rotate(-90deg);
}

.bathcomp-result > img{
	margin: 0 auto;
}

.bathcomp-result{
	border-radius: 10px;
	text-align: center;
	padding: 0 10px 20px;
	width: 48%;
}

@media(max-width:599px) {
	.bathcomp-result{
		width: 100%;
		margin-bottom: 60px;
	}
	.bathcomp-result:last-of-type{
		margin-bottom: 0;
	}
}

.bathcomp-result.sazana{
	background-color: #c5e7f6;
}

.bathcomp-result.every{
	background-color: #f8dcae;
}

.bathcomp-result-wrapper{
	display: flex;
	justify-content: space-between;
	max-width: 930px;
	padding: 30px 15px;
	margin: 0 auto;
}

@media(max-width:599px) {
	.bathcomp-result-wrapper{
		flex-direction: column;
	}
}

.bathcomp-com span{
	font-size: 80%;
}

/*　240327_お風呂比較ページ用css ここまで　*/

/*コミコミ価格追加*/

.product-comi{
	margin-top: 0;
	text-align: right;
}

.product-comi h6{
	font-size: 1.6rem;
	font-weight: 700;
	background-color: #e50000;
	display: inline-block;
	padding: 0.7em;
	text-align: center;
	color: #fff;
	width: 300px;
	margin-bottom: 0;
}

@media(max-width:599px) {
	.product-comi h6{
		width: 100%;
	}
}

.product-comi p{
	font-size: 4.7rem;
	font-weight: 700;
	text-align: right;
	color: #d60000;
	margin: 5px 0;
}

@media(max-width:599px) {
	.product-comi p{
		text-align: center;
		transform: translateX(10px);
	}
}

.product-comi p span{
	display: inline-block;
	font-size: 1.8rem;
	line-height: 1;
	text-align: center;
	color: #666666;
}

p span span.prodact-tax{
	font-size: 60%!important;
	color: #666666;
	font-weight: 700;
}

.func-text p{
	font-size: 1.3rem;
}

.product_intro-product_price > span{
	text-align: center;
}

.product_intro-product_price > span > span{
	display: inline-block;
	line-height: 0.8;
}

.product_intro-construct_price > span{
	text-align: center;
}

.product_intro-construct_price > span > span{
	display: inline-block;
	line-height: 0.8;
}

/*240522_マイカーローンフォーム画面外はみ出し防止*/
.mw_wp_form input[type="file"]{
	width: 100%;
}

/*250214_EV・PHEVコンセント用CSS ここから*/

.ev_fv{
	width: 100%;
	background-color: #e9f3f7;
	border-radius: 20px;
	padding: 40px 20px;
	text-align: center
}

@media(max-width:599px) {
	.ev_fv{
		padding: 30px 15px 10px;
	}
}

.ev_fv img{
	display: inline-block;
}

.ev_fv p{
	line-height: 2;
	font-weight: 700;
	font-size: 1.7rem;
}

@media(max-width:820px) {
	.ev_fv p{
		font-size: 1.5rem;
		line-height: 1.5;
	}
}

.ev_feature{
	padding-top: 60px;
}

.ev_feature_title{
	text-align: center;
}

.ev_fukidashi span{
	font-weight: 700;
	color: #0068b2;
	font-size: 1.5rem;
	position: relative;
}

.ev_fukidashi span::before{
	content: '';
	display: inline-block;
	position: absolute;
	width: 9px;
	height: 2px;
	background-color: #006698;
	left: -1em;
    bottom: 0.5em;
    transform: rotate(45deg);
}

.ev_fukidashi span::after{
	content: '';
	display: inline-block;
	position: absolute;
	width: 9px;
	height: 2px;
	background-color: #006698;
	right: -1em;
    bottom: 0.5em;
    transform: rotate(-45deg);
}

.ev_feature h3{
	display: inline-block;
	font-weight: 700;
	color: #fff;
	font-size: 2.8rem;
	padding: 0.5em 2.3em;
	background-color: #0068b2;
	width: auto;
	border-radius: 40px;
	margin-top: 10px;
}

@media(max-width:820px) {
	.ev_feature h3{
		font-size: 2rem;
	}
}

.ev_flow{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 50px;
}

@media(max-width:599px) {
	.ev_flow{
		flex-direction: column;
		gap: 20px;
	}
	
	.ev_flow > img,	
	.ev_flowimg{
		transform: rotate(90deg);
	}
}

.ev_flow > div{
	text-align: center;
}

.ev_flow > div img{
	display: inline-block;
}

.ev_flow h4{
	border-left: none;
	font-size: 2rem;
	padding-left: 0;
	text-align: center;
}

.ev_type h2,
.ev_ex h2,
.ev_faq h2,
.ev_form h2{
	display: inline-block;
    color: var(--main-theme-font-color);
    font-size: 2.8rem;
    text-align: center;
    width: 100%;
    margin-top: 2em;
	border-bottom: none;
}

.ev_type h3{
	text-align: center;
	color: #fff;
	background-color: #00a242;
	font-size: 2.3rem;
	padding: 0.5em;
	border-radius: 50px;
}

@media(max-width:820px) {
	.ev_type h3{
		font-size: 1.8rem;
	}
}

.ev_type h3 span{
	font-size: 80%;
}

.content table th.ev_content{
	background-color: #dedede;
	color: var(--main-font-black);
}

.content table th.ev_content span{
	font-size: 1.2rem;
	font-weight: 400;
	letter-spacing: 0em;
}

.content .ev_type table{
	border-spacing: 0;
	border-collapse: collapse;
/*	margin-bottom: 60px;*/
}

.content .ev_type table th,
.content .ev_type table td{
	border: 1px solid #ababab;
}

.content .ev_type table td{
	text-align: center;
	background-color: #fff;
}

.content .ev_type table td img{
	display: inline-block;
}

.content table .ev_cat td{
	font-weight: 700;
	white-space: nowrap;
}

.content .sccrollguide table th,
.content .sccrollguide table td{
	white-space: nowrap;
}

.content .ev_type table td ul{
	text-align: left;
}

.price{
	font-weight: 700;
}

.price span{
	background: linear-gradient(transparent 60%, var(--sub-theme-color) 0%);
}

.content .ev_type table.ev_option{
	width: min(780px, 100%);
	margin-right: auto;
	margin-left: auto;
}

.ev_lineup .sccrollguide{
	margin-bottom: 60px;
}

/*.content .ev_type table.ev_option .ev_content{*/
/*
.content .ev_type table .ev_content{
	white-space: nowrap;
}
*/

.ev_att{
	background-color: #e9f3f7;
	border-radius: 10px;
	padding: 25px 25px 15px 25px;
}

.ev_att p{
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 1.4rem;
}

.ev_ex img{
	margin-right: auto;
	margin-left: auto;
}


/*250214_EV・PHEVコンセント用CSS ここまで*/




/*250430_商品価格表記 税別・税込に変更　ここから*/

.reformprice{
	display: flex;
	justify-content: flex-end;
	margin-bottom: 10px;
}

.reformprice dt{
	width: 75px;
	height: 75px;
	background-color: #eaeaea;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}

@media(max-width:820px) {
	.reformprice dt{
		width: 65px;
		height: 65px;
		font-size: 1.3rem;
	}
}

.reformprice dd{
/*	width: calc(100% - 75px);*/
	background-color: #f4f4f4;
	padding: 8px 15px;
}

@media(max-width:599px) {
	.reformprice dd{
		padding: 8px 10px;
	}
}

.zeibetu{
	font-size: 3.5rem;
	font-weight: 700;
	text-align: right;
	color: #d60000;
}

@media(max-width:820px) {
	.zeibetu{
/*		font-size: 2.5rem;*/
		font-size: 2.2rem;
	}
}

.zeibetu span{
	font-size: 40%;
	letter-spacing: 0;
	color: var(--main-font-black);
	margin-left: 0.2em;
}

.zeikomi{
	font-size: 1.2rem;
	text-align: right;
}

.reformprice.total{
	position: relative;
	margin-top: 30px;
}

.reformprice.total::before{
	content: '';
	display: inline-block;
	width: 100%;
	height: 1px;
	background-color: var(--main-font-black);
	position: absolute;
	top: -15px;
	left: 0;
}

.reformprice.total dt{
	background-color: #e50000;
	font-weight: 700;
	color: #fff;
	width: 88px;
	height: 88px;
}

@media(max-width:820px) {
	.reformprice.total dt{
		width: 78px;
		height: 78px;
	}
}

.reformprice.total .zeibetu{
	font-size: 4.8rem;
}

@media(max-width:820px) {
	.reformprice.total .zeibetu{
		font-size: 3.4rem;
	}
}

/*250430_商品価格表記 税別・税込に変更　ここまで*/




/*250501_工事期間のめやす追加　ここから*/

.title_koujimeyasu{
	margin-bottom: 20px;
	margin-top: 30px;
}

.title_koujimeyasu img{
	margin: 0 auto;
}

.content table.table_koujimeyasu{
	width: min(585px, 100%);
	margin: 0 auto;
	border: 1px solid #cccccc;
	border-collapse: collapse;
}

.content table.table_koujimeyasu tr{
	border-bottom: inherit;
}

.content table.table_koujimeyasu th{
	display: flex;
	align-items: center;
	font-size: 1.8rem;
	color: var(--main-font-black);;
}

@media(max-width:820px) {
	.content table.table_koujimeyasu th{
		font-size: 1.4rem;
	}
}

.table_koujimeyasu th img{
	margin-right: 0.7em;
}

@media(max-width:599px) {
	.table_koujimeyasu th img{
		width: 20px;
		height: 20px;
	}
}

.content table.table_koujimeyasu tr th,
.content table.table_koujimeyasu tr td{
	background-color: #fff;
	width: auto;
	padding: 0.7em 1em;
}

.content table.table_koujimeyasu tr:nth-of-type(2n + 1) th,
.content table.table_koujimeyasu tr:nth-of-type(2n + 1) td{
	background-color: #d7f0ff;
}

.content table.table_koujimeyasu tr td{
	font-weight: 700;
	font-size: 1.2rem;
	text-align: center;
	letter-spacing: 0.1em;
}

@media(max-width:820px) {
	.content table.table_koujimeyasu tr td{
		font-size: 1rem;
	}
}

.content table.table_koujimeyasu tr td span{
	font-size: 1.8rem;
	background: linear-gradient(transparent 70%, #ffff00 0%);
}

@media(max-width:820px) {
	.content table.table_koujimeyasu tr td span{
		font-size: 1.5rem;
	}
}

.table_koujimeyasu a.link{
	margin: 0 auto;
	display: block;
	color: #fff;
	padding: 0.5em 1.5em;
	text-align: center;
	background-color: var(--main-theme-color);
	text-decoration: none;
	width: min(120px, 100%);
	border-radius: 30px;
	transition: .3s;
}

@media(min-width:821px) {
	.table_koujimeyasu a.link:hover{
		opacity: .7;
		transition: .3s;
	}
}

.table_koujimeyasu_att{
	width: min(585px, 100%);
	margin: 10px auto 0;
	font-size: 1.2rem;
}

.table_koujimeyasu br{
	display: none;
}

@media(max-width:599px) {
	.table_koujimeyasu br{
		display: block;
	}
}

/*250501_工事期間のめやす追加　ここまで*/




/* ■□250620_TAM ■□*/

.sep3 > .box-40 {
	width: 40%;
	margin-bottom: 20px;
}

@media(max-width:1080px) {
	.sep3 > .box-40 {
		
	}
}

@media(max-width:768px) {
	.sep3 > .box-40 {
		width: 45%!important;
	}
}

@media(max-width:599px) {
	.sep3 > .box-40 {
		width: 100%!important;
	}
}




	.form-front-caution-box {
		position: relative;
    width: 100%;
		margin: 0 auto;
	}

	@media(max-width:1080px){
		.form-front-caution-box {
		}
	}

	@media(max-width:768px){
		.form-front-caution-box {
		}
	}

	@media(max-width:599px){
		.form-front-caution-box {
		}
	}