@charset "UTF-8";
/* ==========================================================
   トイレリフォーム（/toilet/reform/）専用CSS
   元デザイン：01_統括/隆雅/トイレリフォームデザイン/index-toilet.html
   読み込み：page-toilet-reform.php のみ
   ========================================================== */

/* 元デザインの html/body 指定は、既存ページに影響しないよう #toilet-reform 内に限定 */
#toilet-reform ul,#toilet-reform ol{ list-style:none; margin:0; padding:0;}
#toilet-reform p,#toilet-reform h1,#toilet-reform h2,#toilet-reform h3,#toilet-reform h4,#toilet-reform dl,#toilet-reform dt,#toilet-reform dd{ margin-top:0;}
#toilet-reform{ color:#0D2940; font-family:"Noto Sans JP",sans-serif; overflow:hidden;}
#toilet-reform *{ box-sizing:border-box;}
#toilet-reform img{ width:100%; height:auto; vertical-align:bottom;}
#toilet-reform a{ transition:.3s;}
#toilet-reform a:hover{ opacity:.75;}
#toilet-reform>.tr-section>.inner{ width:1100px; margin:auto;}

#tr-mv{ background:linear-gradient(90deg,#fff 0%,#fff 48%,#EDF8FD 100%);}
#tr-mv .inner{ width:1200px; min-height:520px; margin:auto; display:flex; align-items:stretch; position:relative;}
#tr-mv .tb{ width:55%; padding:70px 25px 55px 20px; position:relative; z-index:2;}
#tr-mv .en{ color:#00A3DF; font-size:14px; font-weight:bold; letter-spacing:.18em; margin:0 0 10px;}
#tr-mv h1{ font-size:52px; line-height:1.2em; letter-spacing:.04em; margin:0 0 18px;}
#tr-mv .lead{ font-size:24px; font-weight:bold; line-height:1.65em; margin:0 0 25px;}
#tr-mv .photo{ width:53%; position:absolute; top:0; right:0; bottom:0; clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);}
#tr-mv .photo img{ width:100%; height:100%; object-fit:cover;}
#tr-mv .point-list{ width:650px; display:flex; gap:8px; position:relative; z-index:3;}
#tr-mv .point-list li{ width:calc((100% - 16px)/3); min-height:92px; padding:15px 12px 12px 52px; background:rgba(255,255,255,.96); border:1px solid #D8E9F2; border-radius:8px; box-shadow:0 5px 18px rgba(0,86,128,.08); position:relative;}
#tr-mv .point-list .icon{ width:31px; height:31px; color:#fff; background:#00A3DF; border-radius:50%; display:grid; place-content:center; position:absolute; top:17px; left:12px; font-size:10px;}
#tr-mv .point-list .icon.line{ background:#06C755; font-size:8px;}
#tr-mv .point-list .icon svg{ width:17px; height:17px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; display:block;}
#tr-mv .point-list strong{ color:#008BC5; font-size:14px; line-height:1.45em; display:block;}
#tr-mv .point-list small{ color:#526675; font-size:11px; line-height:1.5em; display:block; margin-top:5px;}

#toilet-reform .tr-section{ padding:75px 0 80px;}
#toilet-reform .tr-heading{ text-align:center; margin-bottom:35px;}
#toilet-reform .tr-heading .en{ color:#00A3DF; font-size:13px; font-weight:bold; letter-spacing:.18em; margin-bottom:5px;}
#toilet-reform .tr-heading h2{ font-size:34px; line-height:1.4em; margin:0 0 12px;}
#toilet-reform .tr-heading h2::after{ content:""; width:42px; height:3px; background:#00A3DF; border-radius:10px; display:block; margin:14px auto 0;}
#toilet-reform .tr-heading>p:last-child{ color:#526675; font-size:15px; margin-top:18px;}
#toilet-reform .tr-heading.left{ text-align:left;}
#toilet-reform .tr-heading.left h2::after{ margin-left:0;}

#tr-products{ background:#fff;}
#toilet-reform .product-category .product-list{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:stretch;}
#toilet-reform .product-category .product-card{ min-width:0; height:100%; background:#fff; border:1px solid #D9E9F1; border-radius:10px; overflow:hidden; box-shadow:0 8px 25px rgba(0,64,96,.08); display:flex; flex-direction:column;}
#toilet-reform .product-category .product-card .img{ height:235px; position:relative; overflow:hidden; flex-shrink:0;}
#toilet-reform .product-category .product-card .img img{ width:100%; height:100%; object-fit:cover;}
#toilet-reform .product-category .recommend{ width:68px; height:68px; color:#0D2940; background:#fff; border-radius:50%; display:grid; place-content:center; text-align:center; font-size:12px; font-weight:bold; line-height:1.35em; position:absolute; top:12px; left:12px; z-index:2; box-shadow:0 3px 12px rgba(0,0,0,.12);}
#toilet-reform .product-category .card-body{ min-width:0; padding:20px 18px 22px; display:flex; flex:1; flex-direction:column;}
#toilet-reform .product-category h3{ min-height:64px; overflow-wrap:anywhere; font-size:23px; line-height:1.4em; margin:0 0 8px;}
#toilet-reform .product-category .description{ min-height:75px; color:#4E606D; font-size:14px; line-height:1.75em; margin-bottom:0; overflow-wrap:anywhere;}
#toilet-reform .product-category .tag-list{ min-height:31px; display:flex; gap:6px; margin:13px 0 15px;}
#toilet-reform .product-category .tag-list li{ min-width:0; flex:1; color:#2379A0; background:#F0FAFE; border:1px solid #CBE7F3; border-radius:3px; text-align:center; font-size:11px; line-height:1.45em; padding:5px 3px; overflow-wrap:anywhere;}
#toilet-reform .price-label{ width:max-content; max-width:100%; color:#fff; background:#00A3DF; border-radius:3px; font-size:11px; font-weight:bold; line-height:1.5em; padding:4px 9px; margin:auto 0 3px; white-space:normal;}
#toilet-reform .price{ color:#0D2940; font-size:17px; margin:0 0 15px;}
#toilet-reform .price strong{ font-family:Arial,sans-serif; font-size:36px; line-height:1.2em; letter-spacing:-.03em;}
#toilet-reform .price small{ color:#607582; font-size:10px;}
#toilet-reform .price.estimate{ font-size:26px; font-weight:bold; padding:7px 0;}
#toilet-reform .detail{ color:#fff; background:#00A3DF; border:2px solid #00A3DF; border-radius:5px; text-align:center; text-decoration:none; font-size:14px; font-weight:bold; padding:11px 15px; display:block; box-shadow:0 4px 10px rgba(0,163,223,.18);}
#toilet-reform .detail:hover{ color:#fff; background:#087DB7; border-color:#087DB7; opacity:1;}
#toilet-reform .detail::after{ content:"›"; margin-left:14px;}
#toilet-reform .price-note{ color:#687B86; font-size:11px; line-height:1.7em; margin:18px 0 0;}


#tr-contact{ padding:45px 0; background:#fff;}
#tr-contact .inner{ width:1100px; margin:auto; display:flex; align-items:center; gap:45px;}
#tr-contact .staff-photo{ width:340px; height:190px; border-radius:8px; overflow:hidden;}
#tr-contact .staff-photo img{ width:100%; height:100%; object-fit:cover;}
#tr-contact .tb{ flex:1;}
#tr-contact h2{ font-size:28px; line-height:1.5em; margin:0 0 9px;}
#tr-contact p{ color:#4E606D; font-size:14px; line-height:1.8em; margin-bottom:18px;}
#tr-contact .buttons{ display:flex; gap:16px;}
#tr-contact .buttons a{ width:50%; min-height:62px; border-radius:6px; display:flex; align-items:center; justify-content:center; text-decoration:none;}
#tr-contact .line-btn{ color:#fff; background:#06C755; font-size:16px; font-weight:bold;}
#tr-contact .tel-btn{ color:#008FCB; background:#fff; border:2px solid #00A3DF; flex-direction:column;}
#tr-contact .tel-btn strong{ font-family:Arial,sans-serif; font-size:23px; line-height:1.1em;}
#tr-contact .tel-btn small{ color:#607582; font-size:9px; margin-top:3px;}


/* 2026-09-24 トイレ商品一覧・カテゴリ・FAQ調整 */
#tr-type{ background:#fff;}
#tr-included{ background:linear-gradient(90deg,#EAF8FF 0%,#F4FBFF 100%); border-top:1px solid #D9EFF9; border-bottom:1px solid #D9EFF9; padding:26px 0;}
#tr-included .inner{ width:1100px; margin:auto; display:flex; align-items:center; gap:34px;}
#tr-included .character{ width:120px; height:120px; background:#D8F1FC; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; position:relative;}
#tr-included .character .tr-art{ width:104px; height:104px;}
#tr-included .character::after{ content:"隆雅におまかせください"; color:#087DB7; background:#fff; border:1px solid #B9E2F3; border-radius:30px; font-size:10px; font-weight:bold; padding:5px 10px; position:absolute; left:50%; bottom:-12px; transform:translateX(-50%); white-space:nowrap;}
#tr-included .contents{ flex:1; text-align:center;}
#tr-included .eyebrow{ color:#526675; font-size:13px; font-weight:bold; margin:0 0 2px;}
#tr-included h2{ color:#086BA8; font-size:28px; line-height:1.35em; margin:0 0 4px;}
#tr-included h2 span{ background:linear-gradient(transparent 68%,#FFF19C 68%);}
#tr-included .lead{ color:#365568; font-size:13px; line-height:1.6em; margin:0 0 12px;}
#tr-included .included-list{ display:flex; align-items:center; justify-content:center; gap:12px;}
#tr-included .included-item{ display:flex; align-items:center; gap:8px; background:#fff; border-radius:40px; box-shadow:0 3px 10px rgba(0,91,133,.07); padding:5px 16px 5px 5px;}
#tr-included .included-item .icon{ width:42px; height:42px; color:#00A3DF; background:#EAF7FD; border-radius:50%; display:grid; place-content:center; margin:0; flex-shrink:0;}
#tr-included .included-item .tr-art{ width:34px; height:34px;}
#tr-included .included-item strong{ color:#0D2940; font-size:14px; display:block; white-space:nowrap;}
#tr-included .plus{ color:#00A3DF; font-family:Arial,sans-serif; font-size:22px; font-weight:bold;}
#tr-included .note{ color:#607582; font-size:11px; line-height:1.7em; margin:10px 0 0;}
#tr-type .type-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
#tr-type .type-card{ min-height:118px; color:#0D2940; background:#fff; border:1px solid #D9E9F1; border-radius:10px; box-shadow:0 5px 18px rgba(0,64,96,.06); display:flex; align-items:stretch; text-decoration:none; overflow:hidden; position:relative;}
#tr-type .type-card .visual{ width:140px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
#tr-type .type-card .visual .tr-art{ width:108px; height:102px;}
#tr-type .type-card .text{ padding:23px 48px 20px 24px; display:flex; justify-content:center; flex-direction:column;}
#tr-type .type-card h3{ color:#087DB7; font-size:20px; line-height:1.4em; margin:0 0 6px;}
#tr-type .type-card p{ color:#526675; font-size:13px; line-height:1.65em; margin:0;}
#tr-type .type-card::after{ content:"›"; width:28px; height:28px; color:#fff; background:#00A3DF; border-radius:50%; display:grid; place-content:center; position:absolute; top:50%; right:16px; transform:translateY(-50%);}
#tr-type .type-card.type-standard .visual{ background:#EAF7FD;}
#tr-type .type-card.type-lowprice .visual{ background:#FFF0F2;}
#tr-type .type-card.type-remote .visual{ background:#EAFBF7;}
#tr-type .type-card.type-space .visual{ background:#EEF7FF;}
#tr-type .type-card.type-cabinet .visual{ background:#FFF7E7;}
#tr-type .type-card.type-wall .visual{ background:#F3F0FF;}

#toilet-reform .product-category{ background:#fff; padding:35px 0 75px;}
#toilet-reform .category-head{ min-height:68px; background:#EAF7FD; border-radius:8px; padding:12px 25px; margin-bottom:26px; display:flex; align-items:center; gap:18px;}
#toilet-reform .category-head .category-icon{ width:48px; height:48px; color:#168DC2; background:rgba(255,255,255,.78); border-radius:50%; display:grid; place-content:center; flex-shrink:0;}
#toilet-reform .category-head .category-icon .tr-art{ width:42px; height:42px;}
#toilet-reform .category-head h2{ font-size:25px; line-height:1.4em; margin:0; white-space:nowrap;}
#toilet-reform .category-head p{ color:#526675; font-size:13px; line-height:1.65em; margin:0 0 0 12px;}
#toilet-reform .product-category.lowprice .category-head{ background:#FFF0F2;}
#toilet-reform .product-category.remote .category-head{ background:#EAFBF7;}
#toilet-reform .product-category.space .category-head{ background:#EEF7FF;}
#toilet-reform .product-category.cabinet .category-head{ background:#FFF7E7;}
#toilet-reform .product-category.wall .category-head{ background:#F3F0FF;}
#toilet-reform .product-category .product-list{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:stretch;}
#toilet-reform .product-category .product-card{ min-width:0; height:100%; background:#fff; border:1px solid #D9E9F1; border-radius:10px; overflow:hidden; box-shadow:0 8px 25px rgba(0,64,96,.08); display:flex; flex-direction:column;}
#toilet-reform .product-category .card-body{ display:flex; flex:1; flex-direction:column;}
#toilet-reform .product-category h3{ min-height:64px; overflow-wrap:anywhere;}
#toilet-reform .product-card .brand{ width:max-content; max-width:100%; color:#fff; background:#E60012; border-radius:3px; font-family:Arial,sans-serif; font-size:11px; font-weight:bold; letter-spacing:.04em; padding:4px 8px; margin:0 0 7px; display:inline-block; align-self:flex-start;}
#toilet-reform .product-card .price.pending strong{ color:#526775; font-size:25px;}
/* イラスト：1つずつの画像（2026-09-30。以前は10個の絵を1枚にまとめた tr-art.webp から切り出していて、となりの絵が映り込んでいた） */
.tr-art{ background-repeat:no-repeat; background-size:contain; background-position:center; display:block;}
.tr-art--worker{ background-image:url('../images/toilet-reform/illust-worker.webp');}
.tr-art--product{ background-image:url('../images/toilet-reform/illust-product.webp');}
.tr-art--wrench{ background-image:url('../images/toilet-reform/illust-wrench.webp');}
.tr-art--truck{ background-image:url('../images/toilet-reform/illust-truck.webp');}
.tr-art--toilet{ background-image:url('../images/toilet-reform/illust-toilet.webp');}
.tr-art--pig{ background-image:url('../images/toilet-reform/illust-pig.webp');}
.tr-art--remote{ background-image:url('../images/toilet-reform/illust-remote.webp');}
.tr-art--space{ background-image:url('../images/toilet-reform/illust-space.webp');}
.tr-art--cabinet{ background-image:url('../images/toilet-reform/illust-cabinet.webp');}
.tr-art--pipe{ background-image:url('../images/toilet-reform/illust-pipe.webp');}

@media screen and (max-width:760px){
#toilet-reform>.tr-section>.inner,#tr-included .inner,#tr-contact .inner{ width:calc(100% - 32px);}
#tr-mv .inner{ width:100%; min-height:0; display:block;}
#tr-mv .tb{ width:100%; padding:42px 16px 24px;}
#tr-mv .en{ font-size:11px; margin-bottom:8px;}
#tr-mv h1{ font-size:31px; line-height:1.3em; margin-bottom:13px;}
#tr-mv .lead{ font-size:16px; line-height:1.7em; margin-bottom:18px;}
#tr-mv .photo{ width:100%; height:230px; position:relative; clip-path:none;}
#tr-mv .point-list{ width:100%; gap:6px; padding:0 16px 20px;}
#tr-mv .point-list li{ min-height:104px; padding:45px 7px 10px; text-align:center;}
#tr-mv .point-list .icon{ top:10px; left:50%; transform:translateX(-50%);}
#tr-mv .point-list strong{ font-size:11px;}
#tr-mv .point-list small{ font-size:9px;}
#toilet-reform .tr-section{ padding:52px 0 55px;}
#toilet-reform .tr-heading{ margin-bottom:26px;}
#toilet-reform .tr-heading .en{ font-size:10px;}
#toilet-reform .tr-heading h2{ font-size:24px;}
#toilet-reform .tr-heading>p:last-child{ font-size:13px; line-height:1.7em; margin:14px 4px 0;}
#tr-included{ padding:24px 0;}
#tr-included .inner{ display:block;}
#tr-included .character{ width:92px; height:92px; margin:0 auto 20px;}
#tr-included .character .tr-art{ width:80px; height:80px;}
#tr-included .character::after{ font-size:9px; padding:4px 8px;}
#tr-included h2{ font-size:22px;}
#tr-included .lead{ font-size:12px;}
#tr-included .included-list{ gap:4px; align-items:center;}
#tr-included .included-item{ flex-direction:column; gap:3px; width:calc((100% - 32px)/3); border-radius:10px; padding:7px 4px;}
#tr-included .included-item .icon{ width:36px; height:36px;}
#tr-included .included-item .tr-art{ width:28px; height:28px;}
#tr-included .included-item strong{ font-size:10px; line-height:1.4em; white-space:normal; text-align:center;}
#tr-included .plus{ font-size:16px; margin-top:0;}
#tr-type .type-list{ grid-template-columns:1fr; gap:10px;}
#tr-type .type-card{ min-height:100px;}
#tr-type .type-card .visual{ width:104px;}
#tr-type .type-card .visual .tr-art{ width:82px; height:78px;}
#tr-type .type-card .text{ padding:18px 40px 16px 16px;}
#tr-type .type-card h3{ font-size:17px;}
#tr-type .type-card p{ font-size:11px;}
#toilet-reform .product-category{ padding:25px 0 50px;}
#toilet-reform .category-head{ min-height:0; padding:13px 14px; margin-bottom:16px; align-items:flex-start; flex-wrap:wrap; gap:8px 10px;}
#toilet-reform .category-head .category-icon{ width:38px; height:38px;}
#toilet-reform .category-head .category-icon .tr-art{ width:34px; height:34px;}
#toilet-reform .category-head h2{ font-size:19px; line-height:38px; white-space:normal;}
#toilet-reform .category-head p{ width:100%; font-size:12px; margin:0;}
#toilet-reform .product-category .product-list{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px;}
#toilet-reform .product-category .product-card .img{ height:132px;}
#toilet-reform .product-category .recommend{ width:48px; height:48px; font-size:9px; top:8px; left:8px;}
#toilet-reform .product-category .card-body{ padding:13px 11px 14px;}
#toilet-reform .product-category h3{ min-height:50px; font-size:16px; line-height:1.45em; margin-bottom:6px;}
#toilet-reform .product-category .description{ min-height:72px; font-size:11px; line-height:1.65em;}
#toilet-reform .product-category .tag-list{ gap:3px; margin:10px 0 12px;}
#toilet-reform .product-category .tag-list li{ font-size:9px; padding:4px 2px;}
#toilet-reform .product-card .brand{ font-size:9px; padding:3px 5px; margin-bottom:5px;}
#toilet-reform .price-label{ font-size:9px; padding:3px 5px;}
#toilet-reform .price{ font-size:12px; margin-bottom:11px;}
#toilet-reform .price strong{ font-size:25px;}
#toilet-reform .detail{ font-size:12px; padding:10px 6px;}
#toilet-reform .detail::after{ margin-left:6px;}
#toilet-reform .price-note{ font-size:10px; margin-top:13px;}
#tr-contact{ padding:38px 0;}
#tr-contact .inner{ display:block;}
#tr-contact .staff-photo{ width:100%; height:180px; margin-bottom:22px;}
#tr-contact h2{ font-size:23px;}
#tr-contact p{ font-size:13px;}
#tr-contact .buttons{ display:block;}
#tr-contact .buttons a{ width:100%; min-height:56px; margin-top:10px;}
}

/* 追加：タブレット幅（761〜1279px）で横にはみ出さないように */
@media screen and (min-width:761px){
#toilet-reform>.tr-section>.inner,#tr-mv .inner,#tr-included .inner,#tr-contact .inner{ max-width:calc(100% - 40px);}
}

/* 追加：WordPress化で増えた表示（デザインにないもの） */
#toilet-reform .more-link{ text-align:right; margin:18px 0 0;}
#toilet-reform .more-link a{ color:#087DB7; font-size:14px; font-weight:bold; text-decoration:none;}
#toilet-reform .more-link a::after{ content:"›"; margin-left:8px;}
#toilet-reform .empty-note{ color:#526675; background:#F8FBFD; border:1px dashed #CBE7F3; border-radius:8px; font-size:14px; line-height:1.8em; text-align:center; padding:28px 20px; margin:0;}
@media screen and (max-width:760px){
#toilet-reform .more-link a{ font-size:12px;}
#toilet-reform .empty-note{ font-size:12px; padding:20px 14px;}
}

/* 品番（2026-09-30 追加） */
#toilet-reform .product-category .hinban{ color:#6A7F8C; font-size:11px; line-height:1.6em; margin:-2px 0 8px; overflow-wrap:anywhere;}
#toilet-reform .product-category .hinban span{ white-space:nowrap;}
@media screen and (max-width:760px){ #toilet-reform .product-category .hinban{ font-size:9px;} }

/* MVの3つのポイント：アイコンを上、その下に文章（2026-09-30） */
#tr-mv .point-list li{ padding:16px 10px 14px; text-align:center; display:flex; flex-direction:column; align-items:center;}
#tr-mv .point-list .icon{ position:static; width:38px; height:38px; margin:0 0 8px; transform:none;}
#tr-mv .point-list .icon svg{ width:20px; height:20px;}
#tr-mv .point-list small{ margin-top:4px;}
@media screen and (max-width:760px){
#tr-mv .point-list li{ min-height:0; padding:12px 6px 10px;}
#tr-mv .point-list .icon{ width:32px; height:32px; margin-bottom:6px;}
#tr-mv .point-list .icon svg{ width:17px; height:17px;}
}

/* MVの写真を画面の右端まで伸ばす（2026-09-30）
   写真の左端は従来どおり「中央1200px枠の左から47%」の位置＝ calc(50% - 36px) */
#tr-mv{ position:relative; overflow:hidden;}
#tr-mv .inner{ position:static;}
#tr-mv .tb{ position:relative;}
#tr-mv .photo{ width:auto; left:calc(50% - 36px); right:0;}
@media screen and (max-width:1279px){ #tr-mv .photo{ left:47%;} }

/* 「〇〇をすべて見る」をボタンに（2026-09-30） */
#toilet-reform .more-link{ text-align:center; margin:30px 0 0;}
#toilet-reform .more-link a{ min-width:360px; color:#00A3DF; background:#fff; border:2px solid #00A3DF; border-radius:50px; font-size:15px; font-weight:bold; text-decoration:none; padding:15px 40px; display:inline-block; box-shadow:0 4px 12px rgba(0,163,223,.12);}
#toilet-reform .more-link a::after{ content:"›"; margin-left:12px; font-size:18px;}
#toilet-reform .more-link a:hover{ color:#fff; background:#00A3DF; opacity:1;}

@media screen and (max-width:760px){
#tr-mv{ overflow:visible;}
#tr-mv .inner{ position:relative;}
#tr-mv .photo{ width:100%; left:auto; right:auto;}
#toilet-reform .more-link{ margin-top:20px;}
#toilet-reform .more-link a{ min-width:0; width:100%; font-size:13px; padding:14px 16px;}
}

/* ==========================================================
   よくある質問（2026-09-30）：サービスページと同じ見た目
   style-pc.css / style-sp.css の「.service #box-faq」を、このページ用に書き写したもの（body に .service が付かないため）
   ※ .accordion の見た目そのものは、サイト共通のCSS（style-pc.css / style-sp.css）がそのまま効く
   ※ 以前のこのページ独自のよくある質問（#tr-faq）と、表示していない目的別セット（#tr-sets）の指定は削除した
   ========================================================== */
#toilet-reform #box-faq{ padding:30px 0 80px;}
#toilet-reform #box-faq .h2-01{ font-size:36px; font-weight:bold; text-align:center; line-height:1.8em;}
#toilet-reform #box-faq .h2-01>span{ display:block; color:#00A3DF; font-size:16px; letter-spacing:3px;}
#toilet-reform #box-faq .area-01{ width:1100px; margin:auto;}
@media screen and (max-width:430px){ /* サイト共通の style-sp.css が効く幅に合わせる */
#toilet-reform #box-faq{ padding:0 20px 55px;}
#toilet-reform #box-faq .h2-01{ font-size:25px; line-height:1.7em;}
#toilet-reform #box-faq .h2-01>span{ display:block; color:#00A3DF; font-size:12px; letter-spacing:2px;}
#toilet-reform #box-faq .area-01{ width:100%; margin:auto;}
#toilet-reform #box-faq .accordion dt{ font-size:15px; padding:20px 45px 20px 62px;}
#toilet-reform #box-faq .accordion dt::before{ left:15px; width:32px; height:32px; line-height:29px; font-size:18px;}
#toilet-reform #box-faq .accordion dt span::before{ right:17px; width:18px;}
#toilet-reform #box-faq .accordion dt span::after{ right:17px; width:18px;}
#toilet-reform #box-faq .accordion dd{ font-size:14px; padding:10px 18px 25px 62px;}
#toilet-reform #box-faq .accordion dd::before{ left:15px; width:32px; height:32px; line-height:27px; font-size:18px;}
}