/**
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base themez? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

table, td, th{
	border: none;
}

.customer-voice-title,
.customer-voice-title p,
.customer-voice-title p strong{
	display: inline-block;
}
a{
	text-decoration: none;
	color: var(--ast-global-color-3);
}
a:hover{
	opacity: 0.8;
	cursor: pointer;
	transition: all 0.3s;
}
footer a{
	color:#ffffff;
}
footer a:hover{
	color:#ffffff;
	opacity:0.8;
	transition:all 0.3s;
}
.pc{
	display: inline-block;
}
.pc-tb{
	display: inline-block;
}
.sp{
	display: none;
}

@media (max-width: 1080px){
	.pc{
		display: none;
	}
	.pc-tb{
		display: inline-block;
	}
}

@media (max-width: 767px){
	.ast-builder-layout-element .ast-site-identity{
		margin: 0;
	}
	.pc{
		display: none;
	}
	.sp{
		display: inline-block;
	}
}

/* TOPページ */
.top-fv-paragraph{
	width: 600px;
}

@media (max-width: 767px){
	.top-header-img{
		min-height: 67vw !important;
	}
}


/* WASHLETのグリッド */
.washlet-grid>.uagb-container-inner-blocks-wrap{
	display: grid !important;
	grid-template-columns: 460px 510px;
	grid-template-rows: 1fr 230px 230px;
	grid-template-areas:
		"a d"
		"b d"
		"c d";
}

.washlet-grid .image,
.washlet-grid .image>figure,
.washlet-grid .image>figure>a,
.washlet-grid .image>figure.wp-block-uagb-image__figure >a>img{
	height: 100%;
}

@media (max-width: 1080px){
	.washlet-grid>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 46% 51%;
		grid-template-rows: repeat(3, auto);
	}
}

@media (max-width: 767px){
	.washlet-grid>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 52% 46%;
		grid-template-areas:
			"a a"
			"b d"
			"c d";
	}
}

.washlet-grid img{
	display: block;
}

.washlet-grid .heading{
	grid-area: a;
}

.washlet-grid .image-1{
	grid-area: b;
}

.washlet-grid .image-2{
	grid-area: c;
}

.washlet-grid .image-3{
	grid-area: d;
}

/* 小畑水工所バナー */
.top-middle-banner{
	height: min(270px, 18.75vw);
}

/* TOILETのグリッド */
.toilet-grid>.uagb-container-inner-blocks-wrap{
	display: grid !important;
	grid-template-columns: 510px 460px;
	grid-template-rows: 1fr 230px 230px;
	grid-template-areas:
		"b a"
		"b c"
		"b d";
}

.toilet-grid .image,
.toilet-grid .image>figure,
.toilet-grid .image>figure>a,
.toilet-grid .image>figure.wp-block-uagb-image__figure >a>img{
	height: 100%;
}

@media (max-width: 1080px){
	.toilet-grid>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 51% 46%;
		grid-template-rows: repeat(3, auto);
	}
}

@media (max-width: 767px){
	.toilet-grid>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 46% 52%;
		grid-template-areas:
			"a a"
			"b c"
			"b d";
	}
}

.toilet-grid img{
	display: block;
}

.toilet-grid .heading{
	grid-area: a;
}

.toilet-grid .image-1{
	grid-area: b;
}

.toilet-grid .image-2{
	grid-area: c;
}

.toilet-grid .image-3{
	grid-area: d;
}

/* Q&A */
.accordion{
    margin: 0 auto 40px;
}

.accordion-item {
    margin-bottom: 10px;
}

.accordion-item p{
	margin-bottom: 0;
}

.accordion-header {
	padding: 16px 25px;
	background: #E4E0DF;
	cursor: pointer;
	display: grid;
	grid-template-columns: 50px 1fr 20px;
	grid-template-rows: 1fr;
	grid-row-gap: 0px;
	justify-content: space-between;
}

.accordion-answer{
	cursor: pointer;
	display: grid;
	grid-template-columns: 50px 1fr;
	grid-template-rows: 1fr;
	justify-content: space-between;
}

.accordion-toggle {
    font-weight: bold;
	font-size: 30px;
	line-height: 48px;
	color: #1B2141;
}

.accordion-content {
    display: none;
    padding: 16px 25px;
	border: 1px solid #EEEFEF;
}

.accordion-qa{
	display: inline-block;
	font-size: 30px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	width: 48px;
	height: 48px;
	line-height: 48px;
	background: #1B2141;
  	border-radius: 50%;
}

.accordion-text{
	padding-left: 20px;
	padding-right: 60px;
}

.accordion-answer .accordion-text{
	padding-right: 0px;
}

.accordion-icon{
	display: inline-block;
	line-height: 48px;
}

@media (max-width: 767px){
	.accordion{
		margin-bottom: 0;
	}
	.accordion-item{
		margin-bottom: 5%;
	}
	.accordion,
	.accordion-header,
	.accordion-answer{
		display: block;
	}
	.accordion-item p.accordion-qa,
	.accordion-text{
		margin-bottom: 5%;
	}
	.accordion-item{
		text-align: center;
	}
	.accordion-text{
		text-align: left;
		padding-left: 0;
		padding-right: 0;
	}
}

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;700&display=swap');

p, .text, th, td,
header.entry-header .entry-title{
	font-family: 'Shippori Mincho', serif;
}
h2, h3{
	font-family: "Fira Sans Condensed";
}
.product-link>p{
	text-align: center;
}
.product-link>p>a{
	text-decoration:none !important;
	color: #fff;
	display: inline-block;
	padding:8px 24px;
	border-radius:25px;
	background-color: #192143;
	width: 160px;
	font-size: 12px;
	text-align: center;
}
.product-link>p>a:hover{
	opacity:0.8;
	transition:all 0.3s;
}
.single .wp-block-table thead{
	border-bottom:none;
}
.single .wp-block-table thead th{
	font-weight: normal;
	border-bottom: none;
	background-color: #DFE0DA;
}
.single .wp-block-table tbody td{
	border-top: none;
}

@media (max-width: 1080px){
	.product-link>p>a{
		width: 140px;
	}
}

@media (max-width: 767px){
	.product-link>p>a{
		width: 100px;
		font-size: 10px;
		padding: 4px 8px;
	}
}

/* 単一商品の表 */
.single-product-table table{
	border:none;
}
.single-product-table td{
	width:88px;
	min-width:88px;
	font-size: 12px;
}
.function-table .single-product-table a{
	display: inline-block;
	padding-bottom: 10px;
	border-bottom: 2px solid #fff;
	margin-bottom: 10px;
	height: 60px;
}
.function-table .single-product-table a,
.ast-single-post .entry-content .single-product-table a{
	text-decoration: none;
	display: flex;
   align-items: center;
	justify-content: center;
	width: 90%;
	margin: 0 auto 10px;
}
/* .ast-single-post .entry-content .single-product-table a.single{ */
.single-product-table a.single{
	line-height: 32px;
}
.single-product-table tbody:last-child td:last-child{
	width:89px;
	min-width:89px;
}
.single-product-table tr:first-child td,
.single-product-table tr:last-child td{
	padding:0;
	line-height:1.3;
}
.single-product-table tbody:first-child tr:first-child td{
	border-top:1px solid #4C4A4A;
}
.single-product-table tbody tr td{
	border-left:1px solid #4C4A4A;
	height: 60px;
}
.single-product-table tbody tr:first-child td:last-child,
.single-product-table tbody tr:last-child td:last-child{
	border-right:1px solid #4C4A4A;
}
.single-product-table tbody:last-child tr:last-child td{
	border-bottom:1px solid #4C4A4A;
}
.single-product-table tr:first-child td{
	background-color: #E4E0DF;
	border-bottom:none;
}
.single-product-table tr:last-child td{
	border-top:none;
}
.single-product-table-S tbody:first-child tr:first-child td:first-child{
	width:125px;
	min-width:125px;
	border:none;
	background-color: #E4E0DF;
}
.single-product-table-S tbody:first-child tr:first-child td:nth-child(2){
	width:40px;
	min-width:40px;
	border:none;
	font-size:32px;
	font-weight:bold;
	background-color:transparent;
}
.function-table,
.single-product-table table,
.multi-product-table table{
	border: none;
}
.ast-single-post .entry-content .multi-product-table a{
	text-decoration: none;
}

@media (max-width: 1080px){
	.single-product-table td{
		width:75px;
		min-width:75px;
	}
	.single-product-table tbody:last-child td:last-child{
		width:76px;
		min-width:76px;
	}
	.single-product-table-S tbody:first-child tr:first-child td:first-child{
		width:115px;
		min-width:115px;
	}
	.single-product-table-S tbody:first-child tr:first-child td:nth-child(2){
		width:35px;
		min-width:35px;
	}
	
	.single-product-table tbody.first-row tr:last-child td:last-child{
		border-bottom: 1px solid #4C4A4A;
	}
	.single-product-table tbody.second-row tr:first-child td:last-child,
	.single-product-table tbody.second-row tr:last-child td:last-child{
		background-color: #fff;
		border-right: none;
		border-bottom: none;
	}
}


@media (max-width: 767px){
	.single-product-table td{
		width:48px;
		min-width:48px;
		font-size: min(9px, 2.2vmin);
	}
	.single-product-table tbody:last-child td:last-child{
		width:54px;
		min-width:54px;
	}
	.single-product-table-S tbody:first-child tr:first-child td:first-child{
		width:70px;
		min-width:70px;
	}
	.single-product-table-S tbody:first-child tr:first-child td:nth-child(2){
		width:27px;
		min-width:27px;
	}
	.single-product-table tr:first-child td{
		height:40px;
	}
	.single-product-table tr:last-child td{
		height:40px;
	}
	.single-product-table a{
		padding-bottom: 4px;
		line-height: 12px;
	}
	.single-product-table a.single{
		line-height: 26px;
		padding-bottom: 4px;
	}
	.single-product-table,
	.single-product-table table,
	.single-product-table table tbody{
		 align-self: center;
	}
}


/* 複数商品の表 */
.multi-product-table th{
	font-weight: normal;
}
.multi-product-table td{
	height: 60px;
}
.multi-product-table td,
.multi-product-table th{
	border-bottom:1px solid #4C4A4A;
}
.multi-product-table .grade{
	display:inline-block;
	font-size:20px;
	font-weight:bold;
	padding-top:8px;
}
.multi-product-table .price{
	font-size:20px;
	padding:20px 0 35px;
}
.multi-product-table th,
.multi-product-table tr:last-child td{
	border-bottom:none;
}
.multi-product-table .functions{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 10px;
}
.multi-product-table .functions .item{
	background-color: #e4e0df;
	width: 120px;
	padding: 2px 0;
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.multi-product-table .functions .item p{
	margin-bottom:0;
	font-size: 14px;
	width: 90%;
}
.option{
	font-size: 13px;
}

/* TOILETページ、WASHLETページ複数商品の表共通 */
.multi-product-table.toilet td:first-child,
.multi-product-table.toilet th:first-child,
.multi-product-table.washlet td:first-child,
.multi-product-table.washlet th:first-child{
	left: 0;
	background-color: #fff;
	text-align: center;
	position: relative;	
	width:140px;
	min-width:140px;
}
.multi-product-table.washlet tr:not(:last-child) td:first-child::before,
.multi-product-table.toilet tr:not(:last-child) td:first-child::before{
	content: '';
	position: absolute;
	top: 20px;
	left: 8px; /* 縦線の位置を調整 */
	height: 20px;
	border-left: 2px solid #E4E0DF; /* 縦線のスタイルを設定 */
}
.multi-product-table.washlet  tr:not(:last-child) td:first-child::after,
.multi-product-table.toilet tr:not(:last-child) td:first-child::after{
	content: '';
	position: absolute;
	top: 20px;
	right: 8px; /* 縦線の位置を調整 */
	height: 20px;
	border-left: 2px solid #E4E0DF; /* 縦線のスタイルを設定 */
}
.multi-product-table.washlet th,
.multi-product-table.washlet td,
.multi-product-table.toilet th,
.multi-product-table.toilet td{
	font-size:12px;
	line-height: 1.4;
}

/* TOILETページ複数商品の表専用 */
.multi-product-table.toilet td:not(:first-child),
.multi-product-table.toilet th:not(:first-child){
	width:260px;
	min-width:260px;
}
.multi-product-table.toilet tr.others td:first-child::before,
.multi-product-table.toilet tr.others td:first-child::after{
	top: 46%;
}
.multi-product-table.toilet tr.others td:last-child{
	padding: 1.4em 1em;
}

/* WASHLETページ複数商品の表専用 */
.multi-product-table.washlet td,
.multi-product-table.washlet th{
	width:210px;
	min-width:210px;
	padding: 10px 0;
}

/* カテゴリページのアイテムグレード */
p.item-grade{
	font-size:14px;
}
.item-grade img{
	display: inline-block;
}

.item-grade img.full{
	margin-right: 6px;
}
.item-grade img.full-last{
	margin-right: 13px;
}
.item-grade img.half{
	margin-right: 24px;
}
.item-grade img.none{
	margin-right: 20px;
}

td.item-grade img.full{
	margin-right: 4px;
}
td.item-grade img.full-last{
	margin-right: 9px;
}
td.item-grade img.half{
	margin-right: 15px;
}
td.item-grade img.none{
	margin-right: 14px;
}

/* タイトル名 */
.option-title span{
	display: inline-block;
	line-height: 42px;
	vertical-align: middle;
}

.option-title span.option-num{
	font-size: 35px;
	font-weight: bold;
	font-family: "Fira Sans Condensed";
}

.option-title span.option-name{
	font-size: 18px;
	padding-left: 1rem;
	font-family: 'Shippori Mincho', serif;
}


/* ABOUT TOTO */
.sp-br{
	display: none;
}
@media (max-width: 767px){
	.header-img{
		height: 60vw;
		min-height: 60vw !important;
	}
	.size-9,
	.size-9 p,
	.size-9 a{
		font-size: 2.28vw !important;
	}
	.size-10,
	.size-10 p,
	.size-10 a{
		font-size: 2.54vw !important;
	}
	.size-11,
	.size-11 p,
	.size-11 a{
		font-size: 2.80vw !important;
	}
	.size-12,
	.size-12 p,
	.size-12 a{
		font-size: 3.05vw !important;
	}
	.size-13,
	.size-13 p,
	.size-13 a{
		font-size: 3.31vw !important;
	}
	.size-14,
	.size-14 p,
	.size-14 a{
		font-size: 3.56vw !important;
	}
	.size-15,
	.size-15 p,
	.size-15 a,
	.size-15 h2{
		font-size: 3.82vw !important;
	}
	.size-16,
	.size-16 p,
	.size-16 a{
		font-size: 4.07vw !important;
	}
	.size-17,
	.size-17 p,
	.size-17 a{
		font-size: 4.33vw !important;
	}
	.size-18,
	.size-18 p,
	.size-18 a{
		font-size: 4.58vw !important;
	}
	.size-19,
	.size-19 p,
	.size-19 a{
		font-size: 4.83vw !important;
	}
	.size-20,
	.size-20 p,
	.size-20 a,
	.size-20 h2{
		font-size: 5.09vw !important;
	}
	.size-25,
	.size-25 p,
	.size-25 a,
	.size-25 h2{
		font-size: 6.38vw !important;
	}
	.size-45 h2{
		font-size: 11.45vw !important;
	}
	.sp-br{
		display: block;
	}
}

#next-btn{
	background: #E4E0DF;
	padding: 5px 10px;
	font-size: 15px;
}
#next-btn:hover{
	cursor: pointer;
	opacity: 0.8;
	transition: all 0.8s;
}

/* フッター */
.ast-builder-grid-row-container.ast-builder-grid-row-tablet-4-equal .ast-builder-grid-row,
.ast-builder-grid-row-4-rheavy .ast-builder-grid-row {
    grid-template-columns: 300px 200px 200px 1fr;
	gap: 0;
}
.site-footer-primary-section-2,
.site-footer-primary-section-3{
	padding-left: 20px;
	border-left: 1px solid #fff;
	font-size: 12px;
}
.site-footer-primary-section-3 li{
	margin-bottom: 20px;
}
@media (max-width: 767px){
	.ast-builder-grid-row-container.ast-builder-grid-row-tablet-4-equal .ast-builder-grid-row,
	.ast-builder-grid-row-4-rheavy .ast-builder-grid-row{
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto 1fr;
		padding: 0 5%;
	}
	.site-footer-primary-section-1{
		grid-column: 1/3;
		grid-row: 1/2;
	}
	.site-footer-primary-section-2{
		grid-column: 1/2;
		grid-row: 2/3;
	}
	.site-footer-primary-section-3{
		grid-column: 2/3;
		grid-row: 2/3;
	}
	.site-footer-primary-section-3 li{
		text-align: left;
	}
	.site-footer-primary-section-3 li{
		margin-bottom: 10px;
	}
}

/* ブログページ */
body .ast-container .wp-block-uagb-container>.uagb-container-inner-blocks-wrap>ul.article-list{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	gap: 20px;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.article-item{
	border: 1px solid #000;
}

.ast-single-post .entry-content .article-list a{
	text-decoration: none;
	color: #000;
	display: block;
}
.article-thumbnail,
.article-title,
.entry-content p.article-date{
	margin-bottom: 20px;
}
.article-thumbnail img{
	aspect-ratio: 20 / 17;
	object-fit: cover;
}
.article-contents{
	padding: 0 15px 30px;
}
.entry-content h3.article-title{
	font-size: 15px;
	font-weight: normal;
}
.entry-content .article-contents p{
	font-family: 'Zen Kaku Gothic New',sans-serif;
}
.article-date{
	font-size: 10px;
}
.article-description{
	font-size: 13px;
}

@media (max-width: 767px){
	body .ast-container .wp-block-uagb-container>.uagb-container-inner-blocks-wrap>ul.article-list{
		grid-template-columns: 1fr 1fr;
	}
}

.woocommerce-product-gallery__trigger{
	display: none;
}

/* ABOUT TOTOページ */

/* 機能のグリッド */
.about-grid>.uagb-container-inner-blocks-wrap,
.about-grid>.uagb-container-inner-blocks-wrap .heading,
.other-reason-grid{
	display: grid !important;
}

.about-grid.odd>.uagb-container-inner-blocks-wrap{
	grid-template-columns: 440px 510px;
	grid-template-rows: 120px 1fr;
	grid-template-areas:
		"a c"
		"b c";
}

.about-grid.even>.uagb-container-inner-blocks-wrap{
	grid-template-columns: 510px 440px;
	grid-template-rows: 120px 1fr;
	grid-template-areas:
		"c a"
		"c b";
}

.about-grid>.uagb-container-inner-blocks-wrap .heading{
	grid-template-columns: 70px 1fr;
	grid-template-areas:
		"a b";
}

.other-reason-grid{
	grid-template-columns: 190px 190px 190px;
	grid-template-rows: 190px 190px;
}

.about-grid .image,
.about-grid .image>figure,
.about-grid .image>figure.wp-block-uagb-image__figure >img{
	height: 100%;
}

@media (max-width: 1080px){
	.about-grid.odd>.uagb-container-inner-blocks-wrap,
	.about-grid.even>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 48% 48%;
		grid-template-rows: repeat(2, auto);
	}
	
	.about-grid>.uagb-container-inner-blocks-wrap .heading{
		grid-template-columns: 55px 1fr;
	}
}

@media (max-width: 767px){
	.about-grid.odd>.uagb-container-inner-blocks-wrap,
	.about-grid.even>.uagb-container-inner-blocks-wrap{
		grid-template-columns: 1fr;
		grid-template-rows: repeat(3, auto);
		grid-template-areas:
			"a"
			"b"
			"c";
	}
	
	.other-reason-grid{
/* 		grid-template-columns:110px 110px 110px; */
/* 		grid-template-rows: 110px 110px; */
		display: flex !important;
	}
}

.about-grid img{
	display: block;
}

.about-grid .heading{
	grid-area: a;
}

.about-grid .text{
	grid-area: b;
}

.about-grid .image{
	grid-area: c;
}

.other-reason{
	aspect-ratio: 1 / 1;
}

/* WASHLETぺージ */


/* reCAPTCHA非表示 */
.grecaptcha-badge { visibility: hidden; }

/* プライバシポリシーページ等のタイトル */
header.entry-header .entry-title{
	max-width: 1080px;
	margin: 0 auto;
	margin-bottom: 72px;
}

@media (max-width: 1080px){
	header.entry-header .entry-title{
		max-width: 100%;
		margin-bottom: 40px;
	}
}

@media (max-width: 767px){
	header.entry-header .entry-title{
		margin-bottom: 32px;
	}
}