

@charset "utf-8";

/* ############################################################
   index.css 区分ガイド（2026-07-15 追記／並び替えなし・コメントのみ）

   ★重要: このファイルは「トップ＋spotcooler」だけではありません。
     item328/780/781/782/783/785/789/795/867/923/962/969/971/972/
     1045/1076/1077/1121/1122/1125 など他20商品ページ、
     発電機・除湿機など他カテゴリのCSSも含む“ほぼサイト全体”です。

   区分タグ（各セクション冒頭のバナー [ ] を参照）:
     [トップ]     … index.html トップページ専用
     [商品共通]   … 商品個別ページ共通（spotcooler含む全商品で共有／product_of_individual系）
     [spotcooler] … spotcooler(item970)個別・今回の再現で追加した商品ページ調整
     [共通ベース] … 全ページ共通（リセット/プロパティ別ベース）
     [他商品]     … 他商品/他カテゴリ固有（除湿機・発電機・item789等）

   ※spotcooler“専用”はitem970スコープの約73行のみ。見た目の大半は[商品共通]。
   ※各ルールの詳細はインラインの 【商品ページ】【トップページ】【SP】等のコメント参照。
   ※CSSは後勝ち（同詳細度なら後方が優先）。順序を変えると勝敗が変わり崩れるため、
     区分は物理移動せず“コメントのみ”で表現しています。
   ############################################################ */

/* ------------------------------------------------------------
   [他商品] item番号 索引（区分の細分化 / 2026-07-15）

   index.css は item別スコープCSS（.itemXXX）を約45種の item番号ぶん含むが、
   このフォルダの実ページが実際に“クラスとして”使う item は下記のみ（実測）:
     ● item970  … spotcooler 本体（当テンプレの対象。[spotcooler]）
     ● item973  … spotcooler モーダル内商品（.spot item973 / 延長冷風系）
     ● item974  … spotcooler モーダル内商品（延長排熱ダクト。※価格はPHP）
     ● item784  … index.html と spotcooler 両方の共有ボックス（.m_w_item784）→ [商品共通/トップ]
     ● item1130 … index.html の商品カード（.mein_item_region item1130）→ [トップ]

   ▼ 下記の item別CSS は未使用(デッド)だったため 2026-07-15 に削除済み
     （対応 itemXXX クラスが index.html・spotcooler のどちらにも無く、どの
       ページからも当たらないため。item970 と子孫結合していた複合セレクタも、
       item925 等の死んだ祖先を含み実質デッドのため該当分のみ除去）:
     296,328,336,490,491,518,780,781,782,783,785,789,790,791,792,794,795,796,797,
     801,867,895,923,924,925,927,933,962,969,971,972,987,1012,1029,1041,1045,
     1076,1077,1084,1094,1095,1121,1122,1125
   （文脈ヒント: 969=ミスト系 / 1121・1122・789・867・1045=冷風/スポット系 / 780-783=スポット系）

   ※削除は「デッドセレクタのみ」を対象に、生存セレクタ(970/784/973/974/1130 等)は
     全保持したことを実測検証済み（波括弧整合・live970セレクタ57件全存続）。
   ※正確な商品名は「item番号→商品」対応表（ユーザー保有）が必要（索引は番号ベース）。
   ------------------------------------------------------------ */

/* ==================== [トップ/商品 混在] デザインリニューアル追加分（料金表=トップ / 1816行〜=商品共通） ==================== */
/*　デザインリニューアルで追加したCSS　*/
.calendar {
    width: 50%;
    margin: 0 auto;
}
.calendar table {
    width: 100%;
    height: 185px;
  }

.another_tab img {
    height: 20px;
    width: 20px !important;
    margin: 0px;
}
.event.sp .comment {
    height: 70px;
}

@media screen and (min-width: 641px){
    .pc_none {
		display: none;
	}
.cm__site_map1 .cm__site_link_ul {
    display: flex;
    flex-wrap: wrap;
}
.spot_chart {
    margin-right: 5%;
}
.spot_chart {
    width: 45%;
}
.cm__site_map_main.cm__accbox .cm__site_map1 {
    width: 70%;
}
.cm__site_map_main.cm__accbox .cm__site_map3 {
    width: 30%;
}


}
/* .select_cold_air.item_guide_area .spot.sentence .w_0626 {
    width: 222px;
    height: auto;
}

.select_spot.item_guide_area .f_0629 .box img,
.select_spot.item_guide_area .box .pc img{
    height: auto;
    width: 100%;
} */

.rental_30seconds,
.top_p.media_area,
.cinc__inquiry form,
.top_p.media_area {
    background-color: #f6f6f6;
}
.subject.mein_item_region h5:nth-child(2) {
    background-color: #ffffcc;
} 
.cm__jb_greeting .cm__connecting_smiles.cm__rental_site_mode {
    /* 【変更】スポットクーラーの淡い水色 #E1E0C1 → カラーコードのベージュ */
    background-color: #E1E0C1;
}
.cv_top.layout,
.top.generator_beginning_area{
    background-color: #f6f6f6;
    padding: 15px 0;
    }
.question_area .qut.block .accshow,
.question_area .qut.block .accshow .label.box {
    background-color: #FDE9D9;
}

/* 【FAQ(question)】カテゴリ見出し。本番(mogiten index.css)を正確に再現:
   「.subpage h3, .question_area h3 { background:#b7b7b7; padding:20px }」。
   背景とpaddingのみ設定し、margin は一般h3ルール(PC mt0/mb20・SP mt20/mb20)に、
   text-align:left はベースのグループ(下部)に委ねる（本番と同じ挙動）。
   .head で包まれない h3(NP掛払い等)も含め全カテゴリ見出しに適用。 */
.subpage h3,
.question_area h3 {
    background-color: #b7b7b7;
    padding: 20px;
}

.subpage.guarantee_s4 .block.no6 h3 {
    background-color: transparent;
}
.last_item_area .od_merit_zone {
    border: dotted #000;
}
.cm__site_map_main.cm__accbox .under_line {
   border-bottom: solid 1px #595959;
}
.product_of_individual .content_block.sentence h3,
.product_of_individual .p_item.zone h3,
.product_of_individual .zone.tittle h3,
.spot_bazooka_q_and_a .tittle h3{
	border-left: 6px solid #494824;
}
.subject.mein_item_region .parts:nth-child(2) {
    border-style: dotted;
}
.first_view .rental_30seconds .box,
.popular_reason_area .cm__poplar_block,
.cm__site_link.cm__items_link_list,
.cm__site_link.cm__relevant_link_list,
.cm__site_link.cm__items_material_list,
.cm__site_link.cm__voice_link_list,
.cm__site_link.cm__information_link_list,
.cm__site_link.cm__question_link_list,
.cm__site_link.cm__about_jb,
.cm__site_link.cm__request_link_list,
.itm.link_area .block,
.last_item_area .modal__content .od_merit_zone,
.guarantee_area .cm__guarantee_block,
.subpage .cw,
/* large_order: 本番同様 .r_f_ver.block も枠線なし。位置は本番と同じ border-style グループ内
   (末尾に置くと後続の .cm__cw .block{border-bottom:...} を打ち消してしまうため) */
.subpage .r_f_ver.block {
    border-style: none;
}
.subject.mein_item_region .parts:nth-child(2),
.last_item_area .od_merit_zone {
    border-width: 2px;
}
.event.pc .conditions p {
    color: #ffffff;
}
.top.item_guide_area .top_links.block .block .zone .p,
.blue,
.question_area h4,
.subpage h5,
.subpage.cinc__estimate h1,
.cinc__inquiry h3 {
    /* 【統一】文字に使う茶色はラフのカラーコードどおり #31320E（#494824 は塗り用） */
    color: #31320E;
}

.top.item_guide_area .subject.mein_item_region .parts,
.top.item_guide_area .subject.mein_item_region .cm__d_r .price-box .price-box_content,
.black,
.question_area .link_list li a,
.migiyori span.fs_0624 {
    color: #000;
}

.subject.mein_item_region h5::before {
    content: "★";
}

.cm__fv_staff.cm__cw,
.top.item_guide_area .another_page_link .hk_freeshipping,
.cm__site_map1 .cm__site_link_ul.option,
.select_blower.item_guide_area .hk_freeshipping,
.first_view .top_img_box .spot_attention .hk_freeshipping,
.product_of_individual .cm__product_item_area.item970 .block.features_item .zone.peculiarity.two-three .segment.features_moisture_down .range {
    display: block;
}

.subject.mein_guide_phrase.normal_spot_cooler .spot.sentence,
.another_tab,
.first_view .spot_attention.break .font_weight_500,
.first_view .spot_attention.break .tel_box .p,
.last_item_area .cm__d_r_2,
.cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block,
.cm__johnson_box .johnson_box.items,
.subpage .cm__anchor_link,
.subpage.staffintroduction .parody,
.subpage.staffintroduction .center,
.select_mist_fan.item_guide_area .spot.sentence.f_0629,
.select_spot.item_guide_area .spot.sentence.f_0629,
header .cm__header_right.pc .header_parts,
.select_spot.item_guide_area .spot.sentence.f_0629,
.select_mist_fan.item_guide_area .spot.sentence {
    display: flex;
/* 
.select_cold_air.item_guide_area .spot.sentence,
.select_blower.item_guide_area .spot.sentence */

}
.block_zone.six_merit_zone.sp,
.cm__site_link.cm__items_link_list .sp {
    display: none;
}
.font11,
.top.item_guide_area .another_page_link .hk_freeshipping,
.top.item_guide_area .select_cold_air.item_guide_area .hk_freeshipping {
    font-size: 11px;
}

.first_view .spot_attention.break .tel_box p:nth-child(2),
.delivery_box .hk_shipping,
.font12,
.cm__finale_zone .parts.no3 p:nth-child(3),
.cm__finale_zone .parts.no3 p:nth-child(4) {
    font-size: 12px;
} 
.font14,
.cm__responsive_device.sagawa_ver .cm__rd_form.r_d_block .segment:nth-child(2) .r_p.cm__business_p,
.calendar .style13:nth-child(2),
.calendar .style13:nth-child(3),
.cm__site_map_main.cm__accbox .cm__site_link_li.cm__site_link_item,
.cm__site_map3 .cm__site_link_li,
.cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2) .segment p {
    font-size: 14px;
}
.cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(2),
.cm__johnson_box .johnson_box.items .segment:nth-child(2) .range:nth-child(2) p,
.cm__responsive_device.ending .segment.cm__jb_cs_ph p,
.spot_attention .hk_freeshipping,
#breadcrumb {
    font-size: 15px;
}
.font16,
.subject.mein_item_region .cm__d_r p,
.customer_voice_area.item .block.no1 p,
.popular_reason_area .cm__poplar_block p,
.guarantee_area p,
.top.last_item_area .option_zone.drain_hose .segmnent p {
    font-size: 16px;
}
.font18,
.event.pc .comment .event_p2,
.top.last_item_area .od_merit_zone h4,
.question_area .qut.block .question_p_tag {
    font-size: 18px;
}
.font20,
.top.item_guide_area .top_links.block .block .zone .p {
    font-size: 20px;
}
.subject.mein_item_region h5,
.spot_link.use a,
.calendar .style13:nth-child(1) {
    font-size: 20px;
}
.font22,
.cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(1),
.item_guide_area .s4_items_using.zone .segment:nth-child(1) p:nth-child(1),
.customer_voice_area.item .zenkoku p:nth-child(2) {
    font-size: 22px;
}
.cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block .r_p:nth-child(1) {
    font-size: 23px;
}
.top.last_item_area .top.last_banners_zone h4,
.top_img_box.cw .migiyori,
.cm__johnson_box.site_s4.product_list .summarize,
.cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(1) p:nth-child(1) {
    font-size: 24px;
}

.event.pc .sameday,
.cm__fv_staff.cm__cw .center.bold,
.cm__responsive_device.ending .r_d_block.ending_sentence p {
    font-size: 25px;
}
.select_spot.item_guide_area .block.spot_cooler .subheadingh4,
.select_blower.item_guide_area .subheadingh4,
.top.cm__transport_area.back_transport h3 {
    font-size: 28px;
}
.subheadingh4_small_catch {
    display: block;
    font-size: 0.62em;
    font-weight: normal;
}
.font28,
header .cm__header_right.pc .header_div.tel_on .header_tel.display,
.itm.link_area h3,
.guarantee_area h3 {
    font-size: 28px;
}
.spot_attention.break .tel_box p,
.subject.mein_guide_phrase.normal_spot_cooler h4 {
    font-size: 30px;
}
.font32,
.cm__johnson_box.site_s4.product_list h2 {
    font-size: 32px;
}
.spot_attention.break .tel_box a p {
    font-size: 35px;
}

.cm__johnson_box .johnson_box.items .tel_box p {
    font-size: 45px;
}
.font48,
.rental_30seconds h2,
.customer_voice_area.item h2,
.popular_reason_area h2,
.top_p.media_area h2,
.top.cm__transport_area.back_transport h2,
.before_delivery.delivery_paragraph.p_top h2,
.guarantee_area h2,
.top.last_item_area h2,
.question_area h2,
.subpage.cinc__estimate h1,
.cinc__inquiry h3 {
    font-size: 48px;
}

.cm__fv_staff.cm__cw .span1 {
    font-size: 65px;
}
.top.item_guide_area .top_links.block .block .zone .p,

.event.pc .red.sameday {
    font-weight: bold;
}
.font_weight_500,
.parts.speaking_staff_line p,
.spot.sentence p,
.required_number,
.item_guide_area .additional_hukuyama_style p,
.cm__responsive_device.sagawa_ver .cm__rd_photo.r_d_block .segment p:nth-child(2),
.cm__responsive_device.sagawa_ver .cm__rd_photo.r_d_block .segment p:nth-child(3),
.cm__rd_form.r_d_block .r_p.cm__business_p,
.customer_voice_area.item .scope p,
.customer_voice_area.item .block.no1 p,
.popular_reason_area .cm__poplar_block p,
.itm.link_area p,
.top_p.media_area p,
.top.cm__transport_area.back_transport p,
.before_delivery.delivery_paragraph.p_top p,
.guarantee_area p,
.top.last_item_area p,
.cm__responsive_device.ending .r_d_block.ending_sentence p,
.cm__site_map_main.cm__accbox .cm__site_link_li.cm__site_link_item,
.top.item_guide_area .another_page_link .parts .hk_freeshipping,
.top_kashituki_rental_img .zone p,
.event.pc .comment p,
.cm__johnson_box .johnson_box .segment:nth-child(3) p,
.segment.cm__jb_cs_ph .r_p.cm__business_p,
.migiyori span.fs_0624 {
    font-weight: 500;
}
.subpage.staffintroduction .center {
    flex-wrap: wrap;
  }
.question_area .qut.block .acc_check.del_area {
    height: 40px;
}

.spot_attention.break .tel_box img {
    height: 30px;
}
.event.pc .comment {
    height: 45%;
}
.top.last_item_area .block.array .od_merit_zone,
.itm.link_area .block.no3 .content.slider_item {
    height: 100%;
}
.event.pc .conditions,
.event.pc .another_tab,
.first_view .spot_attention.break .tel_box p,
.cm__responsive_device.ending .r_d_block .cm__rd_list.pc,
.cm__responsive_device.ending .r_d_block:nth-child(3) ul  {
    justify-content: center;
}


.spot_attention.break .tel_box p {
    line-height: 18px;
}
.cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(2) {
    line-height: 22px;
}
.top.item_guide_area .s4_items_using.zone p {
    line-height: 25px;
}
.johnson_box .segment:nth-child(1) p:nth-child(2),
.rental_30seconds .center,
.block.spot_cooler .spot.sentence p,
.subpage p {
    line-height: 28px;
}

.spot_attention.break div p:nth-child(1) {
    line-height: 30px;
}

  .cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block .r_p:nth-child(1) {
    line-height: 33px;
  }
.cm__fv_staff.cm__cw .center.bold {
    line-height: 35px;
}
.top_img_box.cw .migiyori {
    line-height: 36px;
}
.cm__johnson_box.site_s4 .johnson_box div:nth-child(1) p:nth-child(1) {
    line-height: 40px;
}
.cm__johnson_box.site_s4.product_list h2 {
    line-height: 46px;
}

.cm__johnson_box.site_s4 h2 {
    line-height: 1.3;
}

.top.last_item_area .block_zone.six_merit_zone.pc li {
    line-height: 60px;
}
/* 【統一】h2 の行間は 1.3 に揃える（44px/58px/70px が混在していた） */
.popular_reason_area h2,
.before_delivery.delivery_paragraph.p_top h2,
.guarantee_area h2,
.top.last_item_area h2 {
    line-height: 1.3;
}
.top.last_item_area .od_merit_zone p {
    margin: 0px;
}
.question_area .qut.block .accshow .zone {
    margin: 20px 20px 0px 20px;
}

.calendar table {
    margin: 0 auto;
}
.event.pc .comment,
.subject.mein_item_region h5 {
    margin: 3px auto;
}
.cm__site_map_main.cm__accbox .cm__site_link_li.cm__site_link_item,
.cm__site_map3 .cm__site_link_li {
    margin: 5px 0px 5px 5px;
} 

.rental_30seconds .center {
    margin: 29px 0px 40px 0;
}
.johnson_box .segment:nth-child(1) p:nth-child(2) {
    margin: 25px 0 16px 0;
}
.subject.mein_guide_phrase.mobile_air_conditioner:nth-child(1) .spot.sentence,
.subject.mein_guide_phrase.business_spot_cooler .spot.sentence,
.subject.mein_guide_phrase.install_big_spot_cooler .spot.sentence {
    margin: 45px 0px 57px 0px;
}
.select_cold_air.item_guide_area .spot.sentence,
.select_mist_fan.item_guide_area .spot.sentence,
.select_blower.item_guide_area .spot.sentence {
    margin: 50px 0px 58px 0px;
}

.first_view .cm__fv_staff {
    margin: 0px auto 40px auto;
}
.cm__finale_zone .parts.no2 .cm__goto_form {
    margin: 10px auto 30px auto;
  }
.subject.mein_item_region h4 {
    margin: 10px 0px 15px 0px;
}
.subject.mein_guide_phrase.normal_spot_cooler .spot.sentence {
    margin: 45px 0px 10px 0px;
}
.product_of_individual .appeal.zone .p_item.zone h3{
    margin: 75px 0px 10px 0px;
}
.cm__johnson_box.site_s4.product_list .johnson_box .segment:nth-child(2) .range:nth-child(2),
.question_plus .accbox.q_plus .accshow,
.subpage  .cm__cw.cinc__estimate_area.ptmt0,
.subpage  .cm__cw.cinc__estimate_area.ptmt0 .ptmt0{
    margin-top: 0px;
}
.product_of_individual .zone.peculiarity .mt_0522{
    margin-top:5px;
}
.product_of_individual .spot.border-primary.box-shadow-none.mt_0522{
    margin-top: 70px;
}
.subpage.cinc__estimate .cm__anchor_link,
.top.generator_beginning_area .block.pb0 .ul.segment
 {
    margin-top: 0px;
}
.event.pc .conditions p,
header .cm__header_right.pc .header_parts:nth-child(1) {
    margin-top: 5px;
}
header .cm__header_right.pc .header_parts:nth-child(2),
.spot_attention .hk_freeshipping,
.johnson_box .segment:nth-child(2) .range:nth-child(2) {
    margin-top: 10px;
}
.cm__responsive_device .cm__rd_photo.r_d_block,
.before_delivery.delivery_paragraph.p_top .rental_of_flow p:nth-child(12),
.first_view .top_img_box .migiyori,
.select_spot.item_guide_area .box.w_100 {
    margin-top: 20px;
}

.event.pc .conditions,
.cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2) {
    margin-top: 25px;
}

.cm__fv_staff.cm__cw h2,
.subpage .cm__anchor_link {
    margin-top: 60px;
}
.top_links.block .usechoose {
    margin-top: 95px;
}

.spot_attention.break .tel_box {
    margin-left: 29px;
}
.event.pc .conditions p,
.top.item_guide_area .another_page_link .hk_freeshipping,
.subpage.guarantee_s4 .cw .block.no6,
.select_blower.item_guide_area .hk_freeshipping,
.subject.mein_item_region .parts h5:nth-child(2),
.sagawa-container p {
    margin-bottom: 0px;
}
.r_p.tel_pm3_parts {
    margin-bottom: 5px;
}
.top.item_guide_area .top_links.block .center,
.subject.mein_guide_phrase .item_guide_p,
.top.item_guide_area .select_cold_air.item_guide_area .item_guide_p,
.select_mist_fan.item_guide_area .subject.mein_guide_phrase .item_guide_p {
    margin-bottom: 9px;
}

.top.item_guide_area .another_page_link .parts,
.top.item_guide_area .od_mein_item_state .parts {
    margin-bottom: 10px;
}
.top.last_item_area .od_merit_zone h4 {
    margin-bottom: 10px;
}
.top.cm__transport_area.back_transport .zisya_container,
.s4_cw .subject.mein_guide_phrase.normal_spot_cooler div p:nth-child(1) {
    margin-bottom: 20px;
}
.top.cm__transport_area.back_transport .transport .mbottom28 {
    margin-bottom: 28px;
}
.top.last_item_area .cm__finale_zone .parts.no0 {
    margin-bottom: 38px;
}
.cm__site_map1 .cm__accshow.cm__site_map.top {
    margin-bottom: 40px;
}

.subpage.guarantee_s4 .cw .block {
    margin-bottom: 50px;
}
.before_delivery.delivery_paragraph.p_top .cm__cw {
    margin-bottom: 60px;
}
.cm__customer_support.site_994 {
    max-width: 100%;
    font-size: 14px;
    font-weight: 500;
    width: 1100px;
    margin: 0px auto;
}
.first_view .top_img_box.cw,
.select_spot.item_guide_area .another_page_link,
.select_mist_fan.item_guide_area .another_page_link,
.select_blower.item_guide_area .another_page_link,
.spot_attention.break .tel_box p,
.cinc__inquiry .cm__cw.cinc__inquiry_area,
.before_delivery.delivery_paragraph.p_top .cm__cw,
.subpage.staffintroduction .end_roll.cw,
.subpage.staffintroduction .cw.staff_introduction {
    padding: 0px;
}
.top.item_guide_area .spot_link.use p,
.top.last_item_area .block.array .od_merit_zone {
    padding: 10px;
}
.spot_attention {
    padding: 25px 10px;
}
.spot_attention.break {
    padding: 35px 50px;
  }
.cm__johnson_box.site_s4 .cm__cw.cm__tel_number_default,
.top.item_guide_area .cm__cw,
.subpage .cm__cw,
.subpage.staffintroduction .cw,
.relevant_area .cm__cw,
.subpage.guarantee_s4 .cw,
.question_area .cm__cw,
.guarantee_area .cm__cw {
    padding: 50px 0px;
}
.cm__responsive_device {
    padding: 60px 0px;
}
.cm__site_map_main.cm__accbox .under_line {
    padding: 0px 0px 10px 0px;
}
.rental_30seconds {
    padding: 18px 0px 40px 0px;
}
.cm__johnson_box .johnson_box {
    padding: 40px 0px;
}
.cm__johnson_box .johnson_box.items {
    padding: 40px;
}
.event.pc .comment {
    padding: 20px 30px 0px 30px;
}
.cm__johnson_box.site_s4.product_list .johnson_box.items {
    padding: 20px 40px 3px 40px;
}

.cm__responsive_device.sagawa_ver .cm__cw {
    padding: 30px 80px;
}

.top.generator_beginning_area .cm__cw{
    padding: 0px 0px;
}

.subpage .cm__cw.cinc__estimate_area.ptmt0,
.subpage .cm__cw.cinc__estimate_area.ptmt0 .ptmt0,
.top.generator_beginning_area .cm__cw{
    padding-top: 0;
}

.top.last_item_area .block.array .option_zone {
    padding-top: 25px;
}
.top.last_item_area .block.array {
    padding-top: 40px;
}

.item_guide_area .additional_hukuyama_style p {
    padding-left: 10px;
}
.cm__responsive_device .cm__rd_form.r_d_block .segment.cm__jb_cs_ph {
    padding-left: 40px;
}
.item_guide_area .additional_hukuyama_style p {
    padding-right: 0px;
}
.guarantee_area .segment.no02 {
	padding-right: 20px;
}
.event.pc .comment .event_p2 {
    padding-bottom: 10px;
}

.top.item_guide_area .top_links.block .block .zone .p,
.s4_items_using.zone .segment p,
.event.pc .comment,
.first_view .spot_attention.break .tel_box p,
.last_item_area .cm__finale_zone .parts.no1 p,
.last_item_area .cm__finale_zone .parts.no3 p,
.end_banner,
.calendar,
.subpage.staffintroduction .cm__anchor_link div,
.subpage.cinc__estimate .cm__anchor_link div,
.relevant_area .cm__finale_zone .parts.no1 p,
.relevant_area .cm__finale_zone .parts.no3 p,
.sagawa-container h4,
.select_cold_air.item_guide_area .box  {
    text-align: center;
}
.cm__responsive_device .cm__rd_photo.r_d_block.pc .segment:nth-child(1) p,
.top.item_guide_area .another_page_link .region_h4,
.top.item_guide_area .another_page_link .parts,
.cm__johnson_box .johnson_box.items .segment:nth-child(1) p,
.subpage h3,
.segment.ul.try_pic p,
.delivery_box .hk_shipping,
.top.last_item_area .cm__item_amount_area .item_individual_link,
.question_area h3,
.select_cold_air.item_guide_area .spot.sentence .box {
    text-align: left;
}
.top.item_guide_area .another_page_link .parts .hk_freeshipping,
.top.item_guide_area .select_cold_air.item_guide_area .hk_freeshipping {
    text-align: right;
}
.event.pc .red.sameday {
    text-shadow: 
    -1px -1px 0 #fff, /* 左上 */
     1px -1px 0 #fff, /* 右上 */
    -1px  1px 0 #fff, /* 左下 */
     1px  1px 0 #fff; /* 右下 */
}
/* クエン酸コンテンツ */
.product_of_individual .content_block.sentence .kuen h3{
    border-left: none;
}
.product_of_individual .content_block.sentence .kuen h3 {
    text-align: center;
}
.product_of_individual .content_block.sentence .kuen p.small {
    font-size: 15px;
}
.product_of_individual .kuen_flex .div_left,
.select_spot.item_guide_area .spot.sentence .fx_0629
{
    flex: 1;
}

.select_spot.item_guide_area .spot.sentence .fx2_0629{
    flex: 2.5;
}
@media screen and (max-width: 640px){
.product_of_individual .content_block.sentence .kuen .kuen_flex{
    display: block;
}
}

.end_banner h4 img {
    width: 3%;
}
.cm__guarantee_block .segment.no00 {
    width: 5%;
}
/* .select_mist_fan.item_guide_area .spot.sentence div:nth-child(1) {
    width: 30%;
} */

header .cm__header_area .cm__header_right.pc,
.sell_spot img {
    width: 34%;
}
.cm__responsive_device.ending .cm__cw.cm__site_ids4.cm__tel_number_display .r_d_block .cm__rd_list li {
    width: 35%;
}
.subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph,
.cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2) {
    width: 40%;
}

.top.item_guide_area .another_page_link {
    width: 49%;
}
.cm__responsive_device .r_d_block.pc .segment:nth-child(2),
.end_banner .end_header img {
    width: 50%;
}
header .cm__header_area .cm__header_left {
    width: 65%;
}
.cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(1) {
    width: 67%;
}
.select_mist_fan.item_guide_area .spot.sentence div:nth-child(2) {
    width: 68%;
}

.spot_link.use .coldair_list.vaporization1,
.spot_link.use .mistfan_list,
.subpage.cinc__estimate .red_box .cm__goto_form {
    width: 75%;
}
.top.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) {
    width: 85%;
}
.select_spot.item_guide_area .subject.mein_guide_phrase.normal_spot_cooler .spot.sentence div:nth-child(2) {
    width: 93%;
}

.event.pc,
.first_view .cm__fv_staff.cm__cw,
.top.last_item_area .cm__item_amount_area .cm__d_r,
.top.item_guide_area .items_area.alignment_block .cm__d_r,
.subpage.cinc__estimate .cinc__input_estimate .cinc__p1 {
    width: 100%;
}
.block_zone li {
    width: 335px;
}
.event.pc .comment {
    width: 670px;
}
.cm__johnson_box .johnson_box,
.top.item_guide_area .s4_cw {
    width: 1100px;
}
header #pc_navi .flex.cw,
header .cm__header_img.cm__cw.sites4.display_page_top,
#breadcrumb {
    width: 1280px;
}

.subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph .r_p.pc {
    font-size: 45px;
  font-weight: bold;
  color: red;
}
.subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph .r_p.pc img {
    width: 7%;
}
.subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph .scope p,
.red_box .block .cinc__p1 {
    font-size: 15px;
}
.subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph .r_p.pc,
.top.generator_beginning_area .block.pb0 h2{
    margin-bottom: 0px;
}
.cm__johnson_box.site_s4 .summarize {
    text-align: center;
  font-size: 30px;
  margin-bottom: 30px;
  font-weight: bold;
}
header .cm__header_area .header_parts .header_div:nth-child(2) p {
    text-align: left;
  font-size: 10px;
  line-height: 16px;
}
.subpage.cinc__estimate .red_box .r_p.cm__business_p {
    font-size: 12px;
  padding: 5px 0px;
}
.subpage.cinc__estimate .cinc__estimate_form.cinc__border_form .cm__goto_form {
    border-color: red;
    border-radius: 1px;
    border-width: 0px;
  }

/* ==================== [トップ] index.html トップページ専用（上部/下部 料金表ほか） ==================== */
/* トップページ上部料金表のCSS */
.another_link_area .price-box {
	/* 全体を囲うボックス（必要に応じて幅や高さを指定） */

	border: 1px solid #ccc;
	text-align: center;
	margin: 0;
	padding: 0;
  }
  
.another_link_area .price-box_title {
	/* タイトル部分の背景や文字色、余白などを指定 */
	background-color: #666;
	color: #fff;
	margin: 0;
	padding: 5px 0px;
  }
  
  .another_link_area .price-box_content {
	/* 下の行を左右に分けて配置 */
	display: flex;
	justify-content: space-between;
	border-bottom: gray;
	border-bottom-style: solid;
	border-bottom-width: 1px;
    font-weight: 500;
  }

  .another_link_area .price-box_duration {
	width: 40%;
	padding: 5px;
	text-align: left;
  }
	.another_link_area .price-box_amount {
	width: 55%;
	padding: 5px;
	text-align: right;
	color: red;
  }
	.another_link_area .border-right {
	border-right-style: solid;
	border-right-width: 1px;
	}
    .top.item_guide_area .cm__d_l {
        width: 58%;
    }
    .top.item_guide_area .cm__d_r {
        width: 42%;
    }

    .select_spot.item_guide_area .subject.mein_item_region h5 {
        width: 90%;
        padding-left: 0px;
    }
    .cm__johnson_box .johnson_box .segment:nth-child(3) {
        justify-content: center;
        align-items: center;
        gap: 50px;
    }


    /* トップページ下部料金表のCSS */
.last_item_area .price-box {
	/* 全体を囲うボックス（必要に応じて幅や高さを指定） */
	width: 330px; 
	border: 1px solid #ccc;
	font-family: 'Noto Sans JP';
	text-align: center;
	margin: 0;
	padding: 0;
  }
  
.last_item_area .price-box_title {
	/* タイトル部分の背景や文字色、余白などを指定 */
	background-color: #666;
	color: #fff;
	margin: 0;
	padding: 5px 0px;
  }
  
  .last_item_area .price-box_content {
	/* 下の行を左右に分けて配置 */
	display: flex;
	justify-content: space-between;
	border-bottom: gray;
	border-bottom-style: solid;
	border-bottom-width: 1px;
  }

  .last_item_area .price-box_duration {
	width: 50%;
	padding: 5px;
	text-align: left;
  }
	.last_item_area .price-box_amount {
	width: 50%;
	padding: 5px;
	text-align: left;
	color: red;
  }
	.last_item_area .border-right {
	border-right-style: solid;
	border-right-width: 1px;
	}

    .transport img {
        width: 25%;
        max-width: 600px;
    }
    /* 自社便での配送の場合はコンテンツ */
.zisya_container {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr; /* 4列レイアウト */
	gap: 20px;
  }
  
  /* ボックス */
  .zisya_container .box {
	background-color: #fff;
	border: 1px solid #494824;
	border-radius: 6px;
	padding: 5px;
  }
  
  .zisya_container .box p {
	font-size: 16px;
	line-height: 1.5;
  }

  /* 佐川急便で配送・返却コンテンツ */
  .sagawa-container {
	display: grid;
	grid-template-columns: 1fr 1fr; /* 2列レイアウト */
	gap: 24px;                      /* ボックス間の余白 */
  }
  .sagawa-container .box {
	background-color: #fff;
	border: 2px solid #ffa76f;     
	border-radius: 8px;
	padding: 20px;
  }
  .sagawa-container .box p {
	font-size: 16px;

  }
  .sagawa-container img {
	  width: 30%;
	margin: 0 auto;
	display: block;
  }

  .select_spot.item_guide_area .waste.heat .accordion_switch::after {
    content: "+";
    position: absolute;
    right: 10px; /* 右からの余白 */
    top: 50%;
    transform: translateY(-50%); /* 垂直方向の中央揃え */
    font-size: 30px; /* サイズを大きくする */
}
.select_spot.item_guide_area .waste.heat .accordion_switch {
    background: #f6f6f6;
    padding: 15px 25px;
    position: relative; /* 疑似要素の位置指定のために必要 */
}
.select_spot.item_guide_area .waste.heat .waste2.acPerformanceContents {
    display: none;
}

/* 大浦さん吹き出しコンツ追加案 */
.cv_top.layout .pc.mb1 img,
.bgc .cv_top img{
    margin: 0 auto;
    display: block;
}
.generator_beginning_area .block:nth-child(2) ul
{
    margin-top: 25px;
    }
.cv_top.layout .pc.mb1,
.bgc .cv_top img{
    margin-top: 40px;
}
.generator_beginning_area .block:nth-child(2) ul{
    display: flex;
    justify-content: space-between;
}
.generator_beginning_area .block:nth-child(2) ul li{
    background-color: #494824;
} 
 .top.generator_beginning_area .block1219{
    padding: 0em 0em 0px 0em;
    border: none;
    margin-top: 32px;
    margin-bottom: 40px;
 }
 .top.generator_beginning_area .block:nth-child(2) .segment:nth-child(1) {
    padding: 15px;
}

.generator_beginning_area .block:nth-child(2) .segment p{
    margin: 0px 0px 13px 0px;
}
.cm__cw .block.pb0{
    border-bottom-width:0px;
    border-bottom-style: none;
    padding: 0;
    margin: 0px auto 5px auto;
}
.top.generator_beginning_area .accordion_switch{
    color: #31320E;
    cursor: pointer;
}
.close_accordion{
    color: #31320E;
}
.top.generator_beginning_area .segment p.red{
    font-weight: bold;
}

@media screen and (min-width: 641px){
.top.generator_beginning_area .acPerformanceContents,
.top.generator_beginning_area .accordion_switch{
    display: none;
 }
}
@media screen and (max-width: 640px) {
    .cv_top.layout .pc.mb1{
    width: 95%;
    }
     .top .block .dp0_1215
     {
        display: none;
    }
     .generator_beginning_area .block:nth-child(2) ul{
        display: block;
     }
     .generator_beginning_area .block:nth-child(2) ul li {
        width: calc(32% - 0.33em);
        display: inline-block;
    }
    .generator_beginning_area .block:nth-child(2) ul li{
        margin: 0em 0em 0.5em 0em;
    }
    .top.generator_beginning_area h2{
        margin-top: 0;
    }
    .rental_30seconds{
        margin-top: 0;
    }
}

  @media screen and (max-width: 640px){

    /* 小項目：初期状態では非表示 */
.sub-content {
    display: none;
  }
  
  /* チェックされると表示 */
  .acc-sub-check:checked ~ .sub-content {
    display: block;
  }

  .cm__sp.cham__drawer_menu.cham__hamburger_switch {
    max-height: 60px;
  }
  .cham__drawer_area .cham__drawer_li.cham__drawer_tell,
  .cham__drawer_area .cham__drawer_li.cham__drawer_info {
    margin: 0px;
    padding: 0px;
    height: 100%;
  }
  .cham__drawer_area .cham__drawer_li.cham__drawer_tell img,
  .cham__drawer_area .cham__drawer_li.cham__drawer_info img {
    width: 100%;
    height: 100%;
    padding: 0px;
  }
  .cham__drawer_area .cham__drawer_li.cham__hamburger_menu.cham__drawer_button {
    margin: 0px;
    height: 50px;
  }

    .conditions .p1 {
        margin: 0 3px;
        width: 145px;
        padding: 0;
        color: #fff;

        font-size: 14px;
        line-height: 15px;
        } 
          .subpage.cinc__estimate .cm__goto_form .cm__p2
           {
            width: 100%;
          }
          .calendar table {
            width: 97%;
            height: 160px;
          }

    /* 【変更】ラフのスマホ用シートでは、この電話バナーの帯が #FF0000 で塗られている
       （吹き出し「電話バナー背景色」が指している 282x96pt の四角）。
       中の白いボックス（.segment.cm__jb_cs_ph）はそのまま */
    .cm__first_rd.cm__responsive_device.sp {
        background-color: #FF0000;
        background-image: none;
    }
    /* スタッフ写真（666x666）が枠の幅だけ縮んで高さが原寸のまま残り、
       顔が縦に伸びて表示されることがあるため、高さを明示して比率を固定する */
    .cm__first_rd .segment.cm__jb_cs_ph .box.sp .cm__into_img {
        height: auto;
    }
    .cm__site_map_main.cm__accbox .cm__site_link {
        border-bottom: solid 1px #b7b7b7 ;
    }
    .cham__drawer_zone .cham__drawer_li.cham__hamburger_menu.cham__drawer_button p {
        color: white;
    }

    .subject.mein_guide_phrase.normal_spot_cooler .spot.sentence,
    .cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block,
    .top.cm__transport_area.back_transport .zisya_container,
    .top.cm__transport_area.back_transport .sagawa-container,
    .last_item_area .cm__d_r_2,
    .cm__johnson_box .johnson_box.items,
	.subpage.staffintroduction .center,
	.subpage.staffintroduction .parody,
    .itm.link_area .block.no3 .cm__price_area,
    .select_mist_fan.item_guide_area .spot.sentence,
    .top_p.media_area .flex_layout,
    .cm__site_link.cm__items_link_list .sp,
    /* large_order: SPで5番目ブロックの segment を縦積みに(本番同一) */
    .cm__flow_page .r_f_ver.block:nth-child(5) .segment,
    .top.last_item_area .option_zone .cm__d_r .cm__price_area {
        display: block;
    }
    .top.item_guide_area .cm__d_r .cm__price_area,
    .top.cm__transport_area.back_transport .box.cm__sp p,
    .segment.cm__jb_cs_ph.sp .r_p.sp a,
    .top.last_item_area .block_zone.six_merit_zone,
    .cm__johnson_box.site_s4 .johnson_box.items .segment:nth-child(2) .segment,
    .subpage.staffintroduction .parody .sp,
    .top.cm__transport_area.back_transport .sagawa-container .flex {
        display: flex;
    }
    .popular_reason_area .segment.no02 img,
    .cm__responsive_device.ending.site_w1200 .cm__inq_tel {
		display: none;
	}
    .cm__customer_support.site_994 p {
        font-size: 9px;
    }
    .spot_attention .hk_freeshipping,
    .cm__johnson_box .johnson_box.items .segment:nth-child(2) .range:nth-child(2) p {
        font-size: 10px;
    }

    .cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(2) {
        font-size: 12px;        
    }
    .cinc__estimate_form .cm__input_reserve .cm__p2 {
        font-size: 5.9vw;
    }
    .cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_other.r_d_block p,
    .cm__responsive_device.ending .cm__rd_list li p,
    .parts.speaking_staff_line.sp .modal_button_box.link_t,
    .content.modal_item .modal_button_box,
    .select_cold_air.item_guide_area .subject.od_func_region.cold_air_conditioner .modal_button_box.link_t,
    .subject.od_func_region.mist_fan .parts.speaking_staff_line.sp .modal_button_box.link_t,
    .subject.od_func_region.blower .parts.speaking_staff_line.sp .modal_button_box.link_t,
    .cm__responsive_device.sagawa_ver .cm__cw.cm__site_ids4.cm__tel_number_display .cm__rd_form.r_d_block .r_p.cm__business_p,
    .segment.cm__jb_cs_ph .range.sp p,
    .cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2) .segment p,

    .cm__johnson_box.site_s4.product_list .summarize,
    .cm__johnson_box.site_s4.product_list .segment .tel_box p:nth-child(1){
        font-size: 12px;
    }
    .cm__johnson_box.site_s4 .johnson_box.items .segment:nth-child(2) .segment p,
    .johnson_box .segment:nth-child(2) .range:nth-child(2) p,
    #breadcrumb,
    .subject.mein_guide_phrase.business_spot_cooler .item_guide_p,


    .cm__rd_photo.r_d_block .segment p:nth-child(2),
    .cm__rd_photo.r_d_block .segment p:nth-child(3),
    .segment.scroll_box .spot_link.use p,
    .additional_hukuyama_style p,
    .cm__service_ticket_parts p,
    .top.cm__transport_area.back_transport p {
        font-size: 13px;
    }
    .cm__responsive_device.ending .segment.cm__jb_cs_ph p,
    .top.item_guide_area .s4_items_using.zone .segment.ul.try_pic div p,
    .event_p2,
    .event.sp .another_tab,
    .spot_attention div p:nth-child(1),
    .rental_30seconds .center,
    .johnson_box .segment:nth-child(1) p:nth-child(2),
    .top_links.block .block .zone p,
    .top.item_guide_area .top_links.block .s4_items_using.zone .segment p,
    .spot.sentence p,
    .subject.mein_item_region .cm__d_r p,
    .parts.speaking_staff_line.sp p,
    .subject.mein_item_region .required_number,
    .customer_voice_area.item .zenkoku p:nth-child(2),
    .customer_voice_area.item .block.no0 h4,
    .itm.link_area p,
    .top_p.media_area p,
    .select_spot.item_guide_area .subject.mein_guide_phrase.install_big_spot_cooler .item_guide_p,
    .select_cold_air.item_guide_area .subject.mein_guide_phrase .item_guide_p,
    .select_blower.item_guide_area .item_guide_p,
    .select_mist_fan.item_guide_area .item_guide_p,
    .before_delivery.delivery_paragraph.p_top p,
    .top.last_item_area .cm__price_area p,
    .top.last_item_area .discount_parts p,
    .top.last_item_area .cm__finale_zone .parts.no0 p,
    .top.last_item_area .option_zone .segmnent .spot .optz.parts .div p,
    .top.last_item_area .option_zone.drain_hose .segmnent p,
    .segment.cm__jb_cs_ph .scope p,
    .cm__johnson_box.site_s4.product_list h2,
    .question_area .qut.block .question_p_tag,
    .select_spot.item_guide_area .item_guide_p.blue,
    .parts.speaking_staff_line p,
    .top.last_item_area .block_zone.six_merit_zone.sp .block1.mini_text.micro_t {
        font-size: 14px;
    }
    .cm__fv_staff.cm__cw .center.bold,
    .top_img_box.cw .migiyori,
    .customer_voice_area.item .block.no1 p {
        font-size: 15px;
    }

    .cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(1),
    .top.item_guide_area .s4_items_using.zone .segment p:nth-child(1),
    .cm__johnson_box.site_s4 .summarize,
    .spot_link.use a,
    .subject.mein_item_region h5,
    .popular_reason_area .cm__poplar_block.anchor_down h3,
    .top.cm__transport_area.back_transport h3,
    .before_delivery.delivery_paragraph.p_top h4,
    .cm__guarantee_block.anchor_down h3,
    .cm__service_ticket_parts h3,
    .top.last_item_area .od_merit_zone h4,
    .cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(1) p:nth-child(1) {
        font-size: 16px;
    }
    .cm__responsive_device .cm__rd_front.r_d_block p,
    .cm__johnson_box.site_s4 .segment .tel_box p:nth-child(1) {
        font-size: 17px;
    }
    .cm__responsive_device.ending .r_d_block.ending_sentence p,
    .cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block .r_p:nth-child(1),
    .subject.mein_item_region h4,
    .itm.link_area .content.slider_item h4,
    .itm.link_area .cm__for_ones_smile h3,
    .top.last_item_area .block.array h3 {
        font-size: 18px;
    }
    .customer_voice_area.item .zenkoku p {
        font-size: 19px;
    }
    .subject.mein_guide_phrase.normal_spot_cooler h4,
    .select_spot.item_guide_area .block.spot_cooler .subheadingh4,
    .top.last_item_area .top.last_banners_zone h4 {
        font-size: 20px;
    }
    .top.item_guide_area .cm__cw .s4_items_anchor.zone.top h4 {
        font-size: 21px;
    }
    .select_spot.item_guide_area .block.spot_cooler .subheadingh4,
    .select_blower.item_guide_area .subheadingh4,
    .itm.link_area h3 {
        font-size: 22px;
    }

    .rental_30seconds h2,
    .top.item_guide_area .top_p.media_area h2,
    .top.cm__transport_area.back_transport h2,
    .before_delivery.delivery_paragraph.p_top h2,
    .top.item_guide_area .guarantee_area h2,
    .customer_voice_area.item h2,
    .top.last_item_area .zone h2,
    .subpage.cinc__estimate h1,
    .cinc__inquiry h3 {
       font-size: 24px;
    }
    .top.item_guide_area .popular_reason_area .block.no1 h2 {
        font-size: 25px;
    }
    .comment .event_p3,
    .top_links.block h2,
    .question_area h2,
    .select_spot.item_guide_area h3,
    .select_cold_air.item_guide_area h3,
    .select_blower.item_guide_area h3 {
        font-size: 28px;
    }
    .cm__first_rd.cm__responsive_device.sp .segment.cm__jb_cs_ph .parts .r_p.sp a {
        font-size: 32px;
    }

    .cm__johnson_box .johnson_box.items .tel_box p {
        font-size: 34px;
    }
    .cm__fv_staff.cm__cw .span1 {
        font-size: 40px;
    }
    .subject.mein_item_region .cm__d_r p {
        font-weight: bold;
    }
    .top.last_item_area .block_zone.six_merit_zone,
    .subpage.staffintroduction .cm__anchor_link {
        flex-wrap: wrap;
    }
    .cm__responsive_device.sagawa_ver .cm__rd_other.r_d_block ul img {
        height: 30px;
    }
    .top_p.media_area .flex_layout .media_item.thumbnail {
        height: 100%;
    }
    .cm__responsive_device.ending .r_d_block:nth-child(3) ul {
        justify-content: center;
    }
    .cm__johnson_box .johnson_box.items .segment:nth-child(1) p:nth-child(2) {
        line-height: 16px;
    }

    .cm__fv_staff.cm__cw .center.bold {
        line-height: 20px;
    }
    .cm__johnson_box.site_s4 .johnson_box .segment:nth-child(1) p,
    .top_img_box.cw .migiyori,
    .rental_30seconds .center,
    .block.spot_cooler .spot.sentence p,
    .cm__johnson_box.site_s4.product_list h2,
    .subpage p {
        line-height: 22px;
    }
    .cm__johnson_box.site_s4.product_list .johnson_box div:nth-child(1) p:nth-child(1) {
        line-height: 24px;
    }
    .cm__responsive_device.sagawa_ver.site_w1200 .cm__rd_photo.r_d_block .r_p:nth-child(1),
    .cm__johnson_box.site_s4 .johnson_box div:nth-child(1) p:nth-child(1),
    .cm__johnson_box.site_s4 h2 {
        line-height: 28px;
      }
    .popular_reason_area h2 {
        line-height: 35px;
    }
    .before_delivery.delivery_paragraph.p_top h2,
    .guarantee_area h2,
    .top.last_item_area .zone h2 {
        line-height: 36px;
    }
    .cm__fv_staff.cm__cw .span1 {
        line-height: 40px;
    }
    .cm__responsive_device .cm__rd_front.r_d_block p,
    .cm__responsive_device .cm__rd_front.r_d_block p::before,
    .event.sp,
    .cm__first_rd.cm__responsive_device.sp,
    .subpage .cm__anchor_link div {
        margin: 0px;
    }
    .subpage.cinc__estimate .red_box .cm__goto_form {
        margin: 0px auto;
    }
    .zisya_container h4,
    .sagawa-container h4 {
        margin: 10px 0px;
    }
    .top.item_guide_area .sell_spot {
        margin: 15px 0px;
    }
    .top.item_guide_area .select_spot.item_guide_area .another_page_link,
    .top.item_guide_area .select_mist_fan.item_guide_area .another_page_link,
    .top.item_guide_area .select_blower.item_guide_area .another_page_link {
        margin: 20px auto;
    }
    .before_delivery.delivery_paragraph.p_top h4 {
        margin: 30px 0px;
    }
      .subject.mein_guide_phrase .subheadingh4 {
        margin: 50px 0px 25px 0px;
      }
      .parts.speaking_staff_line.sp .content.modal_item,
      .top.last_banners_zone h4 {
        margin: 0px 0px 10px 0px;
      }
      .rental_30seconds h2 {
        margin: 0px 0px 21px 0px;
      }
    
      .rental_30seconds .center {
        margin:  0px 10px 30px 10px ;
      }
      .top_img_box.cw .spot_attention {
        margin: 13px auto 10px auto;
      }
      .event_div_sp .conditions .p1 {
        margin: 10px 0px 0px 0px;
      }
      .question_area .qut.block .accshow .zone {
        margin: 10px 10px 0px 10px;
    }
    .top.generator_beginning_area .block1219{
        margin-top: 16px;
    }
      .johnson_box .segment:nth-child(1) p:nth-child(2) {
        margin: 15px 0px 16px 0px;
      }
      .first_view .cm__fv_staff {
        margin: 0px auto 30px auto;
      }
      .top.item_guide_area h2 {
        margin: 0px 0px 30px 0px;
      }
    .cm__responsive_device.sagawa_ver .cm__rd_other.r_d_block ul img {
        margin: 0px 0px 10px 0px;
    }
    .cm__johnson_box.site_s4 h2 {
        margin: 0px 0px 15px 0px;
    }
    .cm__d_r .od_merit_zone,
    .cm__d_r .discount_parts {
        margin: 0px 0px 20px 0px;
    }
    .block.dehumidifier h3 {
        margin: -55px 0 -14px 0;
    } 
    .cm__johnson_box.site_s4 .cm__cw.cm__tel_number_default h2,
    .select_spot.item_guide_area #spot_border2 .parts.speaking_staff_line img,
    .subject.od_func_region.cold_air_conditioner .parts.speaking_staff_line.sp img,
    .select_mist_fan.item_guide_area #block_mist_fan01 .subject.od_func_region.mist_fan .parts.speaking_staff_line.sp,
    .subpage .r_f_ver.block h3,
    .subpage .cm__flow_page .r_f_ver.block h2,
    .cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2),
    .question_area h2 {
        margin-top: 0px;
    }
    .first_view .top_img_box .migiyori {
        margin-top: 10px;
    }
    .select_spot.item_guide_area .block.spot_cooler.normal_spot_cooler {
        margin-top: 15px;
    }
    .question_area .qut.block .question_p_tag {
        margin-top: 18px;
    }
    .segment.cm__jb_cs_ph .box.sp img {
        margin-top: 25px;
    }

    .top.item_guide_area .cm__cw .s4_items_anchor.zone.top h4{
        margin-top: 30px;
    }
    .cv_top.layout .sp.mb1{
        margin-top: 25px;
    }
    .top.generator_beginning_area .block1219{
        margin-top: 5px;
    }
    .top.generator_beginning_area .block1219{
        margin-bottom: 30px;
    } 
       .cm__fv_staff.cm__cw h2 {
        margin-top: 32px;
    }
    .top_links.block .usechoose {
        margin-top: 70px;
    }

    .select_blower.item_guide_area .subheadingh4,
    .cm__responsive_device.sagawa_ver .segment.cm__jb_cs_ph .box .parts {
        margin-left: 0px;
    }

    .segment.ul.try_pic li div:nth-child(2) {
        margin-left: 10px;
    }
    .segment.cm__jb_cs_ph .box .parts {
        margin-left: 30px;
    }
    .cm__first_rd.cm__responsive_device.sp .segment.cm__jb_cs_ph .box .scope {
        margin-left: 35px;
    }

    .select_blower.item_guide_area .subheadingh4 {
        margin-right: 0px;
    }
    .cm__responsive_device.ending .r_d_block:nth-child(3) ul img {
        margin-right: 5px;
    }
    .cm__price_area .price-box:nth-child(1) {
        margin-right: 10px;
    }
    .top.cm__transport_area.back_transport .sagawa-container .flex div:nth-child(1) {
        margin-right: 10px;
    }
    .r_p.tel_pm3_parts,
    .top.item_guide_area .top_links.block .center {
        margin-bottom: 0px;
    }
    .cm__johnson_box.site_s4.product_list h2 {
        margin-bottom: 5px;
    }
    .top.item_guide_area .top_links.block .center,
.subject.mein_guide_phrase .item_guide_p,
.top.item_guide_area .select_cold_air.item_guide_area .item_guide_p,
.select_mist_fan.item_guide_area .subject.mein_guide_phrase .item_guide_p {
    margin-bottom: 4px;
}
    .top.cm__transport_area.back_transport .zisya_container .box,
    .top.cm__transport_area.back_transport .sagawa-container .box,
    .s4_items_using.zone .segment.ul.try_pic li {
        margin-bottom: 10px;
    }
    .cm__johnson_box.site_s4 .summarize,
    .cm__johnson_box.site_s4 .segment:nth-child(3) .range:nth-child(1),
    .customer_voice_area.item .zone.voice_id_0 p:nth-child(1),
    .customer_voice_area.item .zone.voice_id_0 p:nth-child(2) br,
    .customer_voice_area.item .zone.voice_id_0 p:nth-child(3) br,
    .customer_voice_area.item .zone.voice_id_0 p:nth-child(5),
    .customer_voice_area.item .zone.voice_id_0 p:nth-child(5) br,
    .customer_voice_area.item .zone.voice_id_1 p:nth-child(1),
    .customer_voice_area.item .zone.voice_id_1 p:nth-child(3),
    .customer_voice_area.item .zone.voice_id_3 p:nth-child(1),
    .customer_voice_area.item .zone.voice_id_3 p:nth-child(3) {
        margin-bottom: 15px;
    }
    .before_delivery.delivery_paragraph.p_top .cm__cw {
        margin-bottom: 40px;
    }
    .segment.scroll_box {
        overflow-x: auto;
    }
    .cm__jb_greeting .cm__connecting_smiles.cm__rental_site_mode,
    .segment.cm__jb_cs_ph.sp .scope .sp,
    .segment.cm__jb_cs_ph.sp .range .r_p.sp,
    .subpage.staffintroduction .cw.c_tour,
    .subpage.staffintroduction .cw.staff_introduction,
    .subpage.staffintroduction .cw.company_p,
    .relevant_area .cm__finale_zone .cm__input_reserve,
    .subpage.guarantee_s4 .block.no6 .cgu__sp,
    .parts.speaking_staff_line.sp .content.modal_item,
    .select_cold_air.item_guide_area .spot.sentence .box div:nth-child(1) {
        padding: 0px;
    }
    .top.last_item_area .block.array .od_merit_zone {
        padding: 8px;
    }

    .event.sp .comment {
        padding: 10px;
    }
    .sagawa-container .box {
        padding: 12px;
    }
    .cm__site_map1 .cm__site_link_ul .spot_chart label {
        padding: 13px 0px 13px 23px;
    }

    .event.sp {
        padding: 10px 0px;
    }
    .cm__responsive_device.sagawa_ver .cm__cw.cm__site_ids4.cm__tel_number_display {
        padding: 21px 5px;
    }
    .cm__responsive_device.sagawa_ver {
        padding: 40px 0px;
    }
    .top.item_guide_area .popular_reason_area .cm__cw {
        padding: 35px 0px;
    }
    .cm__responsive_device.ending .cm__cw.cm__tel_number_display {
        padding: 30px 10px;
    }
    .spot_attention.break {
        padding: 10px 5px;
      }
    .spot_attention {
        padding: 10px 10px;
      }

    .spot_attention div p:nth-child(1) {
        padding: 0px 5px 0px 10px;
    }
    .spot_attention div p:nth-child(2) {
        padding: 0px 0px 0px 10px;
    }
    .top.last_item_area .od_merit_zone h4 {
        padding: 0 0 0 16px;
    }
    .cm__first_rd.cm__responsive_device.sp .segment.cm__jb_cs_ph.sp .box .parts {
        padding: 0px 0px 0px 35px;
    }
    .cm__johnson_box .johnson_box {
        padding: 15px 0px 20px 0px;
    }
    .cm__johnson_box.site_s4.product_list .cm__cw.cm__tel_number_default {
        padding: 30px 0 15px 0;
    }

    .cm__johnson_box.site_s4.product_list .johnson_box.items {
        padding: 20px 10px 3px 10px;
    }
    
    .cm__responsive_device.sagawa_ver .cm__cw {
        padding: 5px;
      } 
    .cm__johnson_box .johnson_box.items {
        padding: 15px;
    }
    .rental_30seconds {
        padding-top: 0px;
    }
    .select_spot.item_guide_area .subject.mein_guide_phrase.mobile_air_conditioner,
    .select_spot.item_guide_area .subject.mein_guide_phrase.business_spot_cooler,
    .select_spot.item_guide_area .subject.mein_guide_phrase.install_big_spot_cooler {
        padding-top: 25px;
    }

    .cm__responsive_device .cm__rd_form.r_d_block .segment.cm__jb_cs_ph {
        padding-left: 0px;
    }
    .popular_reason_area .cm__poplar_block.anchor_down.rfp6,
    .itm.link_area .block.no3 {
        padding-bottom: 0px;
    }
    .select_spot.item_guide_area .subject.od_func_region.install_big_spot_cooler {
        padding-bottom: 20px;
    }
    .cm__johnson_box .johnson_box.items .segment:nth-child(1) p,
    .cm__responsive_device.ending .r_d_block.ending_sentence .cm__inq_tel p,
    .segment.cm__jb_cs_ph.sp .scope .sp,
    .segment.cm__jb_cs_ph.sp .range:nth-child(2) p,
    .segment.cm__jb_cs_ph .range.sp p,
    .cinc__input_estimate.f_0623 .cinc__p1    {
        text-align: center;
    }
    .cm__jb_greeting .cm__connecting_smiles.cm__rental_site_mode p,
    .cm__responsive_device.ending .r_d_block.ending_sentence p,
    .rental_30seconds .center,
    .top.item_guide_area .top_links.block .s4_items_using.zone .segment p,
    .itm.link_area .cm__for_ones_smile h3,
    .sagawa-container h4,
    .top.last_item_area .block.array h3,
    .top.last_item_area .cm__finale_zone .parts.no1 p,
    .subpage.cinc__estimate .cinc__estimate_paragraph p {
        text-align: left;
    }
    .cm__responsive_device.ending .cm__rd_list img {
        width: 15%;
    }
    .spot_attention .spot_img {
        width: 25%;
    }
    .top.cm__transport_area.back_transport .sagawa-container .flex div:nth-child(1) {
        width: 25%;
    }

    .top.last_item_area .block_zone.six_merit_zone li {
        width: 43%;
    }
    .top.cm__transport_area.back_transport .sagawa-container .flex div:nth-child(2) {
        width: 75%;
    }
    .cw.company_p .cm__anchor_link p {
        width: 95%;
    }

    .top.item_guide_area .cm__d_r .price-box,
    .cm__responsive_device.sagawa_ver .cm__rd_other.r_d_block ul li,
    .top.item_guide_area .s4_items_using.zone .segment.ul.try_pic div,
    .cm__responsive_device.ending .cm__cw.cm__site_ids4.cm__tel_number_display .r_d_block .cm__rd_list li,
    .cw.company_p .cm__anchor_link div {
        width: 50%;
    }
    .last_item_area .price-box_duration {
        width: 60%;
    }
    .top_img_box.cw .spot_attention .bold {
        width: 90%;
    }
    .top.item_guide_area .another_page_link,
    .end_banner .end_header,
    .top.item_guide_area .sell_spot img,
    #breadcrumb {
        width: 95%;
    }
    .subpage.cinc__estimate .red_box .cm__goto_form {
        width: 97%;
    }
    .cm__johnson_box .johnson_box,
    .top.item_guide_area .s4_cw,
    .top.item_guide_area .cm__d_l,
    .top.item_guide_area .cm__d_r,
    .another_page_link .goto_form.y_form .p2,
    .cm__guarantee_block .segment.no00,
    .top.cm__transport_area.back_transport .top-banner img,
	.top.cm__transport_area.back_transport .transport img,
    .top.cm__transport_area.back_transport .box.cm__sp img,
    .top.item_guide_area .cm__d_r .price-box,
    .event.sp,
    .cm__jb_cs_ph .range:nth-child(1) .box:nth-child(1),
    .subject.od_func_region.normal_spot_cooler img,
    .select_spot.item_guide_area .subject.od_func_region.mobile_air_conditioner .parts.speaking_staff_line,
    .select_spot.item_guide_area .subject.od_func_region.business_spot_cooler .parts.speaking_staff_line,
    .select_cold_air.item_guide_area .subject.od_func_region.cold_air_conditioner .parts.speaking_staff_line,
    .subject.od_func_region.mist_fan .parts.speaking_staff_line.sp,
    .subject.od_func_region.blower .parts.speaking_staff_line.sp,
    .block.dehumidifier .subject.od_func_region.dehumidifier .parts.speaking_staff_line,
    .subpage.staffintroduction .ancer img,
    .subpage.cinc__estimate .red_box .cinc__estimate_form.cinc__border_form,
    .subpage.cinc__estimate .red_box .segment.cm__jb_cs_ph,
    .cinc__inquiry .cinc__input_button input,
    header .cm__header_img.cm__cw.sites4.display_page_top,
    header .cm__header_area .cm__header_left,
    .spot_attention .spot_img img,
    .select_spot.item_guide_area .subject.mein_guide_phrase.normal_spot_cooler .spot.sentence div:nth-child(2),
    .select_cold_air.item_guide_area .spot.sentence .box div:nth-child(1),
    .select_mist_fan.item_guide_area .subject.mein_guide_phrase .spot.sentence div,
    .baton_passing_of_smile img,
    .calendar,
    .end_banner .end_header img,
    .cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(1),
    .cm__johnson_box.site_s4.product_list .johnson_box.items .segment:nth-child(2) {
        width: 100%;
    }

    .cm__responsive_device.sagawa_ver .cm__rd_other.r_d_block ul img {
        width: 30px;
    }
    .spot_use.zone,
    .spot_link.use {
        width: 900px;
    }
    .spot_link.use a,
    .segment.scroll_box .spot_link.use p {
        -webkit-text-size-adjust: 100%;
      }
      .cham__drawer_zone .cham__drawer_li.cham__drawer_banner img {
        width: 90%;
        margin: 6px 10px 0 0;
      }
  }



/* ==================== [商品共通] 商品個別ページ共通（spotcooler含む全商品ページで共有） ==================== */
    /*　商品ページで使用するCSS　*/
.product_of_individual .spot.border-primary .productpage_tel {
    color: #31320E;
  font-size: 20px;
  font-weight: 500;
}
.product_of_individual .spot.border-primary .productpage_tel2 {
    font-size: 54px;
  color: red;
  font-weight: bold;
}
.product_of_individual .spot.border-primary .productpage_tel3 {
    width: 3%;
    margin-right: 15px;
}
.product_of_individual .cm__product_item_area .spot.border-primary .zone p {
    margin-bottom: 15px;
}

.product_of_individual .acPerformanceContents .li.no0.subject {
    background-color: #5d5d5d;
}
.product_of_individual .acPerformanceContents .li.no0.subject p {
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
}
.product_of_individual .p_item.zone .sameproduct p::before {
    content: none;
}
.product_of_individual .spot.border-primary .productpage_tel2 a,
.top.generator_beginning_area .dp0_1215 .red{
    color: red;
}

.product_of_individual .intro_item.zone,
.product_of_individual .content_segment,
.product_of_individual .p_item.zone .segment_item.productspec_header {
    display: flex;
}
.product_of_individual .another_tab {
    display: initial;
}

.product_of_individual .spot.border-primary .small {
    font-size: 12px;
}
.product_of_individual .content_segment p,
.product_of_individual .segment_item.productspec_header .div.assistance p,
.product_of_individual .acPerformanceContents p {
    font-size: 18px;
}
.product_of_individual .intro_item.zone .segment2 p {
    font-size: 20px;
}

.product_of_individual .content_block.sentence p,
.product_of_individual .segment_item.productspec_header .div.assistance p,
.product_of_individual .acPerformanceContents p,
.product_of_individual .block.features_item .zone.peculiarity p,
.product_of_individual .spot.border-primary .small {
    font-weight: 500;
}

.first_view .font{
    font-weight: bold;
    font-size: larger;
}

.product_of_individual .spot.border-primary .parts.no2 .cm__goto_form {
    margin: 0px auto 15px auto;;
}
.product_of_individual .intro_item.zone .segment1 .segment2 {
    margin-top: 60px;
}
.product_of_individual .spot.border-primary .parts.no3 p {
    margin-bottom: 0px;
}
.product_of_individual .p_item.zone .sameproduct p {
    padding: 10px 15px;
}
.product_of_individual .p_item.zone .sameproduct p {
    text-indent: 0px;
}

.product_of_individual .spot.border-primary .zone{
    text-align: center;
}
.product_of_individual .cm__cw,
.top.last_item_area .cm__cw {
  padding: 50px 0px;
}

.product_of_individual .content_block.sentence h3,
.product_of_individual .p_item.zone h3,
.product_of_individual .intro_item.zone h2,
.product_of_individual .block.features_item h3,
.product_of_individual .appeal.zone h3,
.spot_bazooka_q_and_a .tittle h3,
.cm__item_amount_area .tal{
    text-align: left;
}
.product_of_individual .content_block.sentence .content_segment .overview {
    width: 76%;
}
.product_of_individual .content_block.sentence .content_segment .content_cell {
    width: 23%;
}
.product_of_individual .option_zone.gard .spot {
    width: 42%;
}
.product_of_individual .p_item.zone .intro_ul_list.parts.seino img {
    width: 72%;
}
.product_of_individual .align_area .align_img,
.product_of_individual .segment.features_.preset_temperature.haisui_flex2 {
    width: 100%
}
.product_of_individual .block.features_item .parts.d-unset div:nth-child(2) p {
    margin: 0px;
    text-align: center;
}

.product_of_individual .spot.border-primary {
    border: 2px solid #494824;
    padding: 2rem 1rem;
    margin-bottom: 1em;
}

.product_of_individual .under_line,
.div_spot_bazooka_q_and_a .spot_bazooka_q_and_a .under_line{
    margin-bottom: 40px;
    padding: 0px;
    border: solid 0.5px #b7b7b7;
}
  .product_of_individual .cm__product_item_area h3,
  .product_of_individual .cm__product_item_area .appeal.zone h3,
  .spot_bazooka_q_and_a .tittle h3{
    padding-left: 20px; /* 文字の左に隙間を開ける */
    margin-bottom: 20px;
  }
  .product_of_individual .cm__product_item_area .appeal.zone .option_zone h3 {
    font-size: 28px;
    padding-left: 0px;
    margin-bottom: 20px;
  }
  .product_of_individual .block.features_item .segment.features_telescopic .parts.parts-single.d-sm-block  {
    display: block;
    margin: 0 auto;
}






.product_of_individual .zone.peculiarity {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 60px;
    grid-row-gap: 0px;
    text-align: center;
}

.product_of_individual .features_item .zone .segment .range .parts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
    text-align: center;
  }

.zone.peculiarity.three-two {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.three-two .segment:first-child {
    grid-area: 1 / 1 / 2 / 4;
  }
  .zone.peculiarity.three-two .segment:last-child {
    grid-area: 1 / 4 / 2 / 6;
  }
  .zone.peculiarity.threebox {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.threebox .segment:first-child {
    grid-area: 1 / 1 / 2 / 2;
  }
  .zone.peculiarity.threebox .segment:nth-child(2) {
    grid-area: 1 / 2 / 2 / 3;
  }
  .zone.peculiarity.threebox .segment:last-child {
    grid-area: 1 / 3 / 2 / 4;
  }
  .zone.peculiarity.two-one {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.two-one .segment:first-child {
    grid-area: 1 / 1 / 2 / 3;
  }
  .zone.peculiarity.two-one .segment:last-child {
    grid-area: 1 / 3 / 2 / 4;
  }
  .zone.peculiarity.two-three {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.one-two {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.one-two .segment:first-child {
    grid-area: 1 / 1 / 2 / 2;
  }
  .zone.peculiarity.one-two .segment:last-child {
    grid-area: 1 / 2 / 2 / 4;
  }

  .product_of_individual .cm__into_img,
  .product_of_individual .zone.peculiarity.d-md-grid.four-one .segment img{
    width: 100%;
    max-width: none;
    height: auto;
    display: block;
  }
  .zone.peculiarity.two-three .segment:first-child {
    grid-area: 1 / 1 / 2 / 3;
  }
  .zone.peculiarity.two-three .segment:last-child {
    grid-area: 1 / 3 / 2 / 6;
  }

 .product_of_individual .appeal.zone .box-border-blk {
    padding: 15px;
    border-width: 1px;
    border-style: solid;
    border-color: #595959;
    overflow: hidden;
    margin: 1rem 0;
}
.product_of_individual .appeal.zone .box-border-blk .eline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .product_of_individual .appeal.zone .box-border-blk .eline .content_elementparts {
    grid-area: 1 / 1 / 2 / 2;
  }
  .product_of_individual .appeal.zone .box-border-blk .eline .content_elementparts2 {
    grid-area: 1 / 2 / 2 / 5;
  }
  .zone.peculiarity.one-one-two {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 0px;
  }
  .zone.peculiarity.one-one-two div:first-child {
    grid-area: 1 / 1 / 2 / 2;
  }
  .zone.peculiarity.one-one-two div:last-child {
    grid-area: 1 / 3 / 2 / 5;
  }
 #maintenance_flow_zone .zone.no0.maintenance_flow.peculiarity.four .scope {
    display: inline-block;
  }

.cm__product_item_area .zone:nth-child(2) .segment:first-child {
    width: 100%;
}
.cm__product_item_area .zone:nth-child(2) .segment:last-child {
    width: 100%;
}

.product_of_individual .range{
    display: flex;
}

.product_of_individual .cm__product_item_area .cm__cw h4 {
    font-size: 20px;
    line-height: 120%;
    margin: 20px auto 15px auto;
    padding-left: 0px;
  }

.product_of_individual .zone.peculiarity p {
    text-align: left;
    margin-top: 25px;
}

.product_of_individual .cm__product_item_area .zone:nth-child(4) .parts:first-child,
 .product_of_individual .cm__product_item_area .appeal.zone .option_zone h3.mg0319 {
    margin-top: 0px;   
}

.product_of_individual .block.features_item .zone .parts.d-unset {
    display: block;
}
.product_of_individual .appeal.zone .range.voltage_200v_style {
    display: block;
}

.product_of_individual .intro_item.zone .segment2 .content_block {
    display: flex;
}

.product_of_individual .intro_item.zone .segment2 h5 {
    background-color: #c00000;
  color: white;
  font-weight: bold;
  font-size: 16px;
  height: 80px;
  padding:5px 10px;
  line-height: 25px;
  margin:0px;
}



.top.last_item_area .cm__item_amount_area .cm__d_l {
    width: 58%;
}
.top.last_item_area .cm__item_amount_area .cm__d_r .od_merit_zone {
    width: 46%;
}


@media screen and (max-width: 640px){

    .product_of_individual .spot.border-primary .productpage_tel {
        color: #31320E;
      font-size: 13px;
      font-weight: 500;
    }
    .product_of_individual .spot.border-primary .productpage_tel2 {
        font-size: 36px;
      color: red;
      font-weight: 500;
    }
    .product_of_individual .spot.border-primary .productpage_tel3 {
        width: 6%;
        margin-right: 15px;
    }
    .product_of_individual .cm__product_item_area .spot.border-primary .parts.no3 .small {
        font-size: 12px;
    }
    .product_of_individual .intro_item.zone,
    .product_of_individual .content_segment,
    .product_of_individual .p_item.zone .segment_item.productspec_header,
    .product_of_individual .block.features_item .zone.peculiarity{
        display: block;
    }
    .product_of_individual .content_block.sentence .content_cell p,
    .product_of_individual .spot.border-primary .small {
        font-size: 12px;
    }
    .product_of_individual .p_item.zone .segment_item.productspec_header p,
    .product_of_individual .p_item.zone .acPerformanceContents p,
    .product_of_individual .block.features_item .zone.peculiarity p {
        font-size: 14px;
    }

    .product_of_individual .content_segment p,
    .product_of_individual .spot.border-primary .parts.no3 p:nth-child(1),
    .product_of_individual .spot.border-primary .parts.no3 p:nth-child(2),
    .product_of_individual .appeal.zone .option_zone h4 {
        font-size: 16px;
    }
    .product_of_individual .block.features_item .zone.peculiarity h4,
    .product_of_individual .cm__product_item_area .appeal.zone .option_zone h3 {
        font-size: 18px;
    }

    .product_of_individual .content_block.sentence h3,
    .product_of_individual .p_item.zone h3,
    .product_of_individual .appeal.zone h3,
    
    .product_of_individual .block.features_item h3 {
        font-size: 20px;
    }

    .product_of_individual .intro_item.zone h2 {
        font-size: 24px;
    }
    .product_of_individual .content_block.sentence .content_cell p {
        text-align: center;
    }

    .product_of_individual .intro_item.zone .content_block p,
    .product_of_individual .content_block.sentence .overview p {
        line-height: 26px;
    }
    .product_of_individual .content_block.sentence,
    .product_of_individual .appeal.zone h3 {
        margin-top: 0px;
    }
    .product_of_individual .block.features_item .under_line {
        margin-bottom: 0px;
    }


    .product_of_individual .spot.border-primary {
        padding: 25px 7px;
    }
    .product_of_individual .content_block.sentence h3,
    .product_of_individual .p_item.zone h3,
    .product_of_individual .appeal.zone .p_item.zone h3,
    .product_of_individual .block.features_item h3 {
        padding: 5px 0px 5px 17px;
    }



    .product_of_individual .intro_item.zone img {
        width: 60%;
        margin: 0px auto;
    }
    .product_of_individual .content_block.sentence img {
        width: 80%;
        margin: 0px auto;
    }

    .product_of_individual .content_block.sentence .content_segment .content_cell,
    .product_of_individual .content_block.sentence .content_segment .overview,
    .product_of_individual .segment_item.productspec_header div:nth-child(1),
    .product_of_individual .segment_item.productspec_header div:nth-child(2),
    .product_of_individual .appeal.zone .dehumidifier_segmrnt div,
    .product_of_individual .features,
    .product_of_individual .segment1,
    .product_of_individual .option_zone.gard .spot{
        width: 100%;
    }
    .top.last_item_area .cm__item_amount_area .cm__d_l {
        width: 100%;
    }
    .top.last_item_area .cm__item_amount_area .cm__d_r .od_merit_zone {
        width: 94%;
    }

    .product_of_individual .intro_item.zone .segment3 h5 {
        background-color: rgb(192, 0, 0);
        color: white;
        font-weight: bold;
        font-size: 16px;
        text-align: center;
        padding: 5px;
        line-height: 25px;
        margin: 10px 0px;
    }
}

@media screen and (min-width: 641px) {
    .cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block {
        display: flex;
    }

.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_form.r_d_block .segment:nth-child(1) {
    width: 0%;
}
.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_form.r_d_block {
    width: 60%;
}
.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_form.r_d_block .segment.cm__jb_cs_ph {
    width: 100%;
    padding-left: 0px;
}
.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_other.r_d_block  {
    width: 40%;
}
.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_other.r_d_block li {
    width: 100%;
}
.cm__responsive_device.sagawa_ver.site_w1200.seino .seino_block .cm__rd_other.r_d_block .cm__rd_list {
    padding-top: 20px;
}


}


  /*　商品ページで使用するCSS END　*/
  

/*　デザインリニューアルで追加したCSS　END　*/

/* ==================== [共通ベース] 全ページ共通（プロパティ別ベース: 身分証/共通幅/見出し/背景/border/display/font-size 等） ==================== */


/* 【 身分証明書コンテンツ 】 **********************************************************************************************/
.id_required_space.block .zone:nth-child(4),
.id_required_space.block .zone:nth-child(5) {
    border-bottom-color: #595959;
}
.id_required_space.block .zone:nth-child(4),
.id_required_space.block .zone:nth-child(5) {
    border-bottom-style: solid;
}
.id_required_space.block .zone:nth-child(4),
.id_required_space.block .zone:nth-child(5) {
    border-bottom-width: 1px;
}
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(4) p:nth-child(1) {
    color: red;
}
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(2) p:nth-child(1):before,
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(2) p:nth-child(1):before {
    content: "①";
}
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(3) p:nth-child(1):before,
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(3) p:nth-child(1):before {
    content: "②";
}
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(4) p:nth-child(1)::before,
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(4) p:nth-child(1)::before {
    content: "※";
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(2)::before,
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(3)::before,
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(4)::before,
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(5)::before {
    content: "●";
}
.id_required_space.block .zone:nth-child(2) {
    display: flex;
}
.id_required_space.block h5 {
    font-size: 1.1em;
}
.id_required_space.block h4  {
    font-size: 1.2em;
}
.id_required_space.block .zone:nth-child(2) {
    justify-content: space-between;
}
.id_required_space.block .zone:nth-child(3) p,
.id_required_space.block .zone:nth-child(4) .ul p,
.id_required_space.block .zone:nth-child(5) .ul p,
.id_required_space.block .zone:nth-child(6) p {
    margin: 0px 0px 0px 0px;
}
.id_required_space.block h5 {
    margin: 0em 0em 0.5em 0em;
}
.id_required_space.block .zone:nth-child(3),
.id_required_space.block .zone:nth-child(4),
.id_required_space.block .zone:nth-child(4) .ul,
.id_required_space.block .zone:nth-child(5),
.id_required_space.block .zone:nth-child(5) .ul {
    margin: 0em 0em 2em 0em;
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(1) {
    margin: 0em 1em 0em 0em;
}
.id_required_space.block p {
    padding: 0em 0em 0em 0em;
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(2),
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(3),
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(4),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(2) p:nth-child(1),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(3) p:nth-child(1),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(4) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(2) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(3) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(4) p:nth-child(1),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(3) p:nth-child(2),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(2) p,
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(3) p:nth-child(2),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(2) p {
    padding: 0em 0em 0em 1em;
}
.id_required_space.block h4 {
    text-align: center;
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(2),
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(3),
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) p:nth-child(4),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(2) p:nth-child(1),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(3) p:nth-child(1),
.id_required_space.block .zone:nth-child(4) .ul li:nth-child(4) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(2) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(3) p:nth-child(1),
.id_required_space.block .zone:nth-child(5) .ul li:nth-child(4) p:nth-child(1) {
    text-indent: -1em;
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(1) {
    width: 20%;
}
.id_required_space.block .zone:nth-child(2) .segment:nth-child(2) {
    width: 80%;
}

.block:nth-child(2) .ul .li .ul_ul,.appeal_area .block:nth-child(2) ul ul {
	display: flex;
}
.scope.voice_id_7 .div.no0 p {
    font-size: 15px;
}
.customer_voice_area.item .zenkoku {
    font-size: 25px;
    font-weight: bold;
    text-align: center;
}



/* 【 COMMON_WIDTH 】 **********************************************************************************************/
.cw,
.cm__cw,
.cm__attention_cw,
.cm__product_page_cw,
.select_top_item.zone {
    width: 1100px;
}
#jb_link .cw {
    padding: 50px 0px;
}
.cm__hukuyama_tel_sentence .cm__cw {
    padding: 0px 50px 0px 50px;
}
#jb_link .cw .footer_link li {
    width: 130px;
}

h2 {
    margin: 0px 0px 30px 0px;
    padding: 0px 0px 0px 0px;
}
h3 {
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
}
.appeal.zone h3{
    margin: 45px 0px 10px 0px;
}
h4 {
    margin: 25px 0px 15px 0px;
    padding: 0px 0px 0px 0px;
}
.migiyori span{
    color:red;
    font-weight: bold;
}

.migiyori{
    text-align: center;
    font-size: 125%;
}


ul, li {
    list-style: none;
}


.first_view .event.pc{
    height: 185px;
}

.first_view .event.pc .otday,
.top.generator_beginning_area .block1219 .segment{
    background-color: white;
}

.first_view .event.pc .otday img{
margin: 0;
height: 20px;
width: 20px !important;
margin-left: 6px;
display:inline-block;
}
.top_img_box.cw h2 p {
    color: black;
    font-size: 23px;
    text-align: center;
    line-height: 135%;
    margin-top: 10px;
}
.cm__cw .block{
    padding: 0em 0em 50px 0em;
    margin: 20em auto 50px auto;
    border-bottom-style: solid;
    border-width: 1px;
    border-color: #595959;
}
.oup.block:nth-child(1) .zone .segment:nth-child(3) p{
    text-align: right;
    margin: 0px 0px 0px 0px;
}
.cm__cw .block:last-child{
    padding: 0em 0em 0em 0em;
    margin: 0px 0px 0px 0px;
    border: none;
}
.oup.block .oup_table.generator:nth-child(3){
    margin: 0em 0em 2em 0em;
}
.oup_table.generator .li_Y_box:nth-child(1) .ul_x_box .div:nth-child(2) {
    width: calc(100% - 50px);
}
.pwc.block:nth-child(1) .zone{
    margin: 0em 0em 1em 0em;
}
.generator50_60hz_area .pwc.block .zone{
    justify-content: space-between;
    display: flex;
}
.generator50_60hz_area .pwc.block .zone .segment:nth-child(1) {
    width: calc(30% - 0.5em);
}
.generator50_60hz_area .pwc.block .zone .segment:nth-child(1) .p{
    text-indent: -1em;
    padding: 0em 0em 0em 1em;
    color: red;
    font-size: 1rem;
}
.pwc.block:nth-child(1) .zone p:nth-child(2){
    margin: 0em 0em 1em 0em;
}
.generator50_60hz_area .pwc.block .zone .segment:nth-child(2) {
    width: calc(70% - 0.5em);
}
.generator50_60hz_area ul.segment li{
    margin: 0em 0em 1em 0em;
}
/* 【 h1,h2,h3,h4 】見出し *********************/
.top_img_box.cw h5{
    color: #31320E;
    font-weight: bold;
    margin-top: 2px;
    font-size: 17px;
}
/* 【 align-items: flex-baseline 】背景色 ****************/
.segment.features_A ,.segment.features_B {
    align-items: baseline;
}

/* 【 background-color 】背景色 ****************/
footer,
.first_point li {
    background-color: #fff;
}
img.first_bar {
    background-color: #b7b7b7;
}
.first_point li,
.customer_voice_area .scroll_box .scope,
.customer_voice_area .scroll_box {
    background-color: #fff;
}
.footer2,.cm__jb_greeting {
    background-color: #E1E0C1;
}
header,
.customer_voice_area,
.cm__johnson_box,
.red_box_s {
    background-color: #E1E0C1;
}
.ul.s4_icon_unison li:nth-child(1) {
    background-color: red;
}
#page_top,
#page_menu,
#pc_navi,
img.first_bar,
.block_zone li,
.cm__round_arrow,
.cm__responsive_device,
.cm__responsive_device.hukuyama_ver,
.cs_support_s,
.cm__johnson_box .under_rd_area,
.event,
.f_p_area,
.format_item p,
.left_relevant.relevant_item .cmp_format_type_box,
.modal__content .item_box .item_d_icon,
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell,
.od_func_filter_box .od_block:nth-child(1) .item_d_icon,
.ul.s4_icon_unison li {
    background-color: #494824;
}
.item_page_jb .cm__johnson_box {
    background-color: #fff;
}
.spot_attention{
    background-color: #ffc !important;
}
/* 【 background-image 】　*********************/
/* 【 background-repeat 】　********************/
/* 【 background-size 】　*********************/
/* 【 border 】線　****************************/
.spot_attention {
    border: 2px solid;
    border-color: #ff6000;
}
.spot_attention {
    border-radius: 20px;
}
.product_of_individual .option_zone.dehumidifier .segmnent .spot,
.cm__cw .question_area .qut.block,
.cm__cw .block:last-of-type,
.customer_voice_area .block:nth-child(2) .zone:last-child,
.question_area .qut.block .question_plus:last-child,
.reason_box.ex:last-of-type {
    border: none;
}
.cm__anchor_banners {
    border-color: #494824;
}
.customer_voice_area .scroll_box .scope,
.last_item_area .option_zone .segmnent .spot,
.product_of_individual .option_zone .segmnent .spot {
    border-color: #595959;
}
.customer_voice_area .scroll_box .scope,
.last_item_area .option_zone .segmnent .spot,
.product_of_individual .option_zone .segmnent .spot {
    border-style: solid;
}
.customer_voice_area .scroll_box .scope,
.last_item_area .option_zone .segmnent .spot,
.product_of_individual .option_zone .segmnent .spot {
    border-width: 1px;
}
.block.spot_cooler .od_func_region.mobile_air_conditioner:nth-child(2),
.item_guide_area .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner,
.customer_voice_area .block:nth-child(2) .zone,
.cm__cw .block {
    border-bottom-color: #595959;
}
.item_guide_area .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner,
.customer_voice_area .block:nth-child(2) .zone,
.cm__cw .block,
.voltage.parts .voltage100,
.voltage.parts .voltage200 {
    border-bottom-style: solid;
}
.item_guide_area .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner,
.customer_voice_area .block:nth-child(2) .zone,
.cm__cw .block,
.voltage.parts .voltage100,
.voltage.parts .voltage200 {
    border-bottom-width: 1px;
}
.select_spot.item_guide_area{
    margin-top: 3em;
    background-color: white;
    margin-bottom: 3em;
}
.select_cold_air.item_guide_area{
    margin-top: 3em;
    background-color: white;
    margin-bottom: 3em;
}
.select_mist_fan.item_guide_area {
    margin-top: 3em;
    background-color: white;
    margin-bottom: 3em;
}
.select_blower.item_guide_area {
    margin-top: 3em;
    background-color: white;
    margin-bottom: 3em;
}
#popular_reason_area,

.cm__transport_area.p_top,
.guarantee_area,
.top.last_item_area,
.itm.link_area{
    background-color: white;
}
/* 【 box-shadow 】*****************************/
.customer_voice_area .scroll_box .scope,
.item_guide_area .banner_category li img {
    box-shadow: 3px 3px 6px 1px #595959;
}
/* 【 box-sizing 】*****************************/
.customer_voice_area .scroll_box .scope,
.last_item_area .option_zone .segmnent .spot,
.product_of_individual .option_zone .segmnent .spot,
.product_of_individual .cm__product_item_area {
    box-sizing: border-box;
}
h2,
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) p span,
.first_point li p {
    color: #31320E;
}
.product_of_individual span.list_right.no1 span.red1112,
.customer_voice_area .block p span,
.s4_cw .subject.mein_guide_phrase p span,
.s4_cw .mein_list .detail .cluster .parts:nth-child(3) p span,
.s4_cw .mein_list .detail .cluster .parts:nth-child(4) p span,
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p span,
.item_guide_area .additional_hukuyama_style p span,
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p span,
.e_200v_air_c_area.detail p span,
.product_of_individual .cm__product_item_area .assistance .three_phase_200v_need.parts,
.product_of_individual .intro_item.zone h3 span,
.product_of_individual .intro_item.zone .segment:nth-child(1) h3 span,
.product_of_individual .content_segment p span,
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) p span,
.howtouse h5 span,
.div.assistance span,
.offseason_p span {
    color: red;
}
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell,
.od_func_filter_box .od_block:nth-child(1) .item_d_icon,
.product_of_individual .content_segment.hukuyama_style h5 {
    color: #fff;
}
.item_guide_area .od_func_region .additional_sentence p,
.required_number {
    color: #000;
}
/* 【 content 】 *****************************/
.item_guide_area .mein_guide_phrase.normal_spot_cooler .sentence p:nth-child(4)::before,
.item_guide_area .od_func_region .additional_sentence p::before,
.e_200v_air_c_area.detail:nth-child(3) ul li:nth-child(5) p::before,
.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(2) p::before,
.cm__johnson_box.site_s4 .cm__jb_site994_div p:before,
.product_of_individual .intro_ul_list.parts p,
.product_of_individual .cm__product_item_area .assistance .three_phase_200v_need.parts p::before,
.product_of_individual.item970 .features_item .peculiarity .features_tank .range:nth-child(3) p:nth-child(3)::before,
.product_of_individual.item970 .features_item .peculiarity .features_cold .range:nth-child(3) p:last-child::before,
.product_of_individual.item970 .features_item .peculiarity .features_far_space .range:nth-child(3) p:last-child::before{
    content: "※";
}

.cm__no_compensation_style .p:before{
    content: '・'!important;
}
.question_area .qut.block .question_plus.question_parts0015 ul li h4::before,
.product_of_individual .intro_ul_list.parts p::before {
    content: "・";
}
.s4_cw .mein_list .detail .cluster .parts:nth-child(1) h5::before {
    content: "★";
}

/* 【 display 】 *****************************/
.spot_attention,
.customer_voice_area .scroll_box,
.s4_cw .mein_list .detail,
.item_guide_area .banner_category,
.item_guide_area .try_pic,
.last_item_area .option_zone.duct .segmnent:nth-child(2),
.last_item_area .option_zone.duct .segmnent:nth-child(3),
.last_item_area .option_zone.deodorize .segmnent:nth-child(2),
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent .spot .parts:nth-child(2),
.last_item_area .option_zone.deodorize .segmnent .spot .parts:nth-child(2),
.option_zone .optz.parts:nth-child(1),
.od_func_filter_box,
.post_list .latest-box,
.post_list .list,
.ul.s4_icon_unison,
.product_of_individual .option_zone.duct .segmnent:nth-child(2),
.product_of_individual .option_zone.duct .segmnent:nth-child(3),
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2),
.product_of_individual .option_zone.deodorize .segmnent .spot .parts:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent .spot .parts:nth-child(2),
.product_of_individual.item970 .features_item .peculiarity,
.product_of_individual.item970 .features_item .peculiarity .segment .range:nth-child(2),
.product_of_individual.item970 .features_item .peculiarity .segment .range:nth-child(2),
.product_of_individual.item970 .features_item .peculiarity .features_other .range:nth-child(1),
.top.item_guide_area .icon_block, .top.item_guide_area .icon_block .d1, .top.item_guide_area .icon_block .d2,
.itm.item_guide_area .icon_block, .itm.item_guide_area .icon_block .d1, .itm.item_guide_area .icon_block .d2,
.spot.sentence .box,

.items_area.alignment_block,
.gokuzyou,
.content_cell_mist{
    display: flex;
}


.card.cw.sp{
    display: block;
}
.f_p_area,
.item_328.material_relevant_area .block:nth-child(1),
.item_801.material_relevant_area .block:nth-child(1),
.item_790.material_relevant_area .block:nth-child(1),
.item_962.material_relevant_area .block:nth-child(1),
.item_791.material_relevant_area .block:nth-child(1),
.item_792.material_relevant_area .block:nth-child(1),
.item_969.material_relevant_area .block:nth-child(1),
.item_972.material_relevant_area .block:nth-child(1),
.item_789.material_relevant_area .block:nth-child(1),
.cm__site_link_area.page_328 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_801 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_790 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_962 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_791 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_792 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_969 .cm__site_link.cm__items_material_list,
.cm__site_link_area.page_972 .cm__site_link.cm__items_material_list,
.item_box.flex.identification784 .shopping_cart_form_action,
.item_box.flex.identification1034 .shopping_cart_form_action,
.item_box.flex.identification1035 .shopping_cart_form_action,
.cm__material_box.item_box.flex.identification784 .cm__goto_form,
.cm__material_box.item_box.flex.identification784 .font_right.p1,
.cm__material_box.item_box.flex.identification784 .font_right.p2,
.cm__material_box.item_box.flex.identification784 .font_right.p3,
.cm__material_box.item_box.flex.identification784 .font_right.p4,
.cm__material_box.item_box.flex.identification1034 .cm__goto_form,
.cm__material_box.item_box.flex.identification1034 .font_right.p1,
.cm__material_box.item_box.flex.identification1034 .font_right.p2,
.cm__material_box.item_box.flex.identification1034 .font_right.p3,
.shopping_cart_form_sentence.m_item1034 .sell_material_sentence,
.cm__material_box.item_box.flex.identification1035 .cm__goto_form,
.cm__material_box.item_box.flex.identification1035 .font_right.p1,
.cm__material_box.item_box.flex.identification1035 .font_right.p2,
.cm__material_box.item_box.flex.identification1035 .font_right.p3,
.shopping_cart_form_sentence.m_item1035 .sell_material_sentence,
.identification784 .shopping_cart_form_action,
.identification1034 .shopping_cart_form_action,
.identification1035 .shopping_cart_form_action,
.item_box.flex.identification798 .shopping_cart_form_action,
.cm__material_box.item_box.flex.identification798 .cm__goto_form,
.cm__material_box.item_box.flex.identification798 .font_right.p1,
.cm__material_box.item_box.flex.identification798 .font_right.p2,
.cm__material_box.item_box.flex.identification798 .font_right.p3,
.cm__material_box.item_box.flex.identification798 .font_right.p4,
.identification798 .shopping_cart_form_action,
.item_box.flex.identification866 .shopping_cart_form_action,
.cm__material_box.item_box.flex.identification866 .cm__goto_form,
.cm__material_box.item_box.flex.identification866 .font_right.p1,
.cm__material_box.item_box.flex.identification866 .font_right.p2,
.cm__material_box.item_box.flex.identification866 .font_right.p3,
.cm__material_box.item_box.flex.identification866 .font_right.p4,
.identification866 .shopping_cart_form_action,
.identification895 .shopping_cart_form_action,
.item_box.flex.m_w_item798 .goto_form.y_form.button,
.item_box.flex.m_w_item798 .div4 .font_right.p1,.item_box.flex.m_w_item798 .div4 .font_right.p2,.item_box.flex.m_w_item798 .div4 .font_right.p3,.item_box.flex.m_w_item798 .div4 .font_right.p4,
.item_box.flex.m_w_item784 .goto_form.y_form.button,
.item_box.flex.m_w_item784 .div4 .font_right.p1,.item_box.flex.m_w_item798 .div4 .font_right.p2,.item_box.flex.m_w_item798 .div4 .font_right.p3,.item_box.flex.m_w_item798 .div4 .font_right.p4,
.item_box.flex.m_w_item1034 .goto_form.y_form.button,
.item_box.flex.m_w_item1034 .div4 .font_right.p1,
.item_box.flex.m_w_item1035 .goto_form.y_form.button,
.item_box.flex.m_w_item1035 .div4 .font_right.p1,
.item_box.flex.m_w_item866 .goto_form.y_form.button,
.item_box.flex.m_w_item866 .div4 .font_right.p1,.item_box.flex.m_w_item866 .div4 .font_right.p2,.item_box.flex.m_w_item866 .div4 .font_right.p3,.item_box.flex.m_w_item866 .div4 .font_right.p4,
.cm__material_box.item_box.flex.identification868 .div4 .font_right.p1,.cm__material_box.item_box.flex.identification868 .div4 .font_right.p2,.cm__material_box.item_box.flex.identification868 .div4 .font_right.p3,.cm__material_box.item_box.flex.identification868 .div4 .font_right.p4,
.cm__material_box.item_box.flex.identification868 .div4 .cm__goto_form,
.cm__material_box.item_box.flex.identification900 .div4 .font_right.p1,.cm__material_box.item_box.flex.identification900 .div4 .font_right.p2,.cm__material_box.item_box.flex.identification900 .div4 .font_right.p3,.cm__material_box.item_box.flex.identification900 .div4 .font_right.p4,
.cm__material_box.item_box.flex.identification900 .div4 .cm__goto_form,
.item_box.flex.identification895 .shopping_cart_form_action,
.m_w_item784 .shopping_cart_form_action,
.m_w_item1034 .shopping_cart_form_action,
.m_w_item1035 .shopping_cart_form_action,
.m_w_item798 .shopping_cart_form_action,
.m_w_item866 .shopping_cart_form_action,
.parameter_area,
.acPerformanceContents .p0.dn785,
.product_of_individual .hukuyama_sp,
.item_page_jb .cm__cw.cm__tel_number_default .s4_ver_box,
.item_page_jb .cm__cw.cm__tel_number_default .customer_support_house,
.cm__material_box.item_box.flex.identification1040 .shopping_cart_form_action.m_item1040,
.cm__material_box.item_box.flex.identification1040 .cm__goto_form,
.cm__material_box.item_box.flex.identification1040 .sell_material_sentence,
.item_box.flex.identification1039 .shopping_cart_form_action.m_item1039,
.item_box.flex.identification1039 .cm__goto_form,
.item_box.flex.identification1039 .shopping_cart_form_sentence.m_item1039 .sell_material_sentence,
.sell_material_sentence,
.top.last_item_area .option_zone.dehumidifier .dehumidifier_segmrnt,
.last_item_area .option_zone.dehumidifier, .top.last_item_area .block.array .accessories,
.johnson_box .jb_hk,
.r_d_block_hk {
    display: none;
}

/* 【 display 】※北海道・九州沖縄を除くを表示 *****************************/
.od_mein_item_state .cluster .parts .hk_freeshipping,
.cm__johnson_box .cm__tel_number_default .s4_ver_box .hk_shipping,
.cm__transport_area .hk_shipping,
.last_item .under_line_zone .od_merit_zone .p_hs,
.first_view .top_img_box .spot_attention .bold .hk_freeshipping  {
  display: block;
}

/* 【 font-size 】文字の大きさ
.cm__input_reserve p:nth-child(1), .cm__input_reserve p:nth-child(2) {
    font-size: 35px;
}***************/
.item_guide_area .od_tax.pc
 {
    font-size: 13px;
}
.item_guide_area .od_func_region .additional_sentence p,
.last_item_area .option_zone .spot .parts:nth-child(2) .div:nth-child(2) p,
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell,
.product_of_individual .option_zone .spot .parts:nth-child(2) .div:nth-child(2) p,
.item_guide_area .try_pic li p,
.required_number,
.cm__johnson_box.site_s4.product_list .segment1029 .pc.cm__jb_cs_ph_part2 {
    font-size: 16px;
}
.spot.item973 .modal_button_box.link_t {
    font-size: 17.5px;
}
.card.cw.sp p,
.od_func_filter_box .od_block:nth-child(2) .od_segment.price p,
.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(2) p,
.cm__johnson_box .customer_support_house .div:nth-child(1) p,
.cm__input_reserve p:nth-child(3),
.s4_cw .mein_list .detail .cluster .parts:nth-child(1) h5,
.subject.mein_guide_phrase .deodorize.sentence {
    font-size: 20px;
}

.subject.od_func_region.cold_air_conditioner .modal_button_box.link_t,
.subject.od_func_region.mist_fan .parts.speaking_staff_line .modal_button_box.link_t,
.subject.od_func_region.blower .parts.speaking_staff_line .modal_button_box.link_t {
    font-size: 17px;
}
.spot_attention p,
.fs_0624 {
    font-size: 18px;
}

.card.cw.sp p:nth-child(1),
.card.cw.sp p:nth-child(2),
.customer_voice_area .block:nth-child(1) h4,

.product_of_individual .cm__product_item_area .assistance .three_phase_200v_need.parts,
.s4_cw .item_guide_p{
    font-size: 22px;
}


#mobile_air_conditioner_list span,
.s4_cw .subject.mein_list h4 {
    font-size: 27px;
}
.product_of_individual .features_item .howtouse h4,
.item_guide_area .zone:nth-child(4) h4,
.cs_support_s.od_response_device .cs_staff p,
.migiyori span.fb_0624{
    font-size: 30px;
}
.s4_cw h3 {
    font-size: 48px;
}
.product_of_individual .intro_ul_list.parts p,
.product_of_individual .intro_item.zone .content_cell p,
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) p,
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) p{
    font-size: 1rem;
}
.last_item_area .block.array .cm__input_reserve p:nth-child(2), section.block.array .cm__input_reserve p:nth-child(2) {
    font-size: 25.5px;
}
/* 【 全国往復送料無料の※の装飾 】 ************************/
.item_guide_area .cluster .parts:nth-child(1) h5:nth-child(2) .hk_cc,
.first_view .spot_attention .bold p .hk_cc,
.select_spot.item_guide_area .another_page_link .hk_cc {
    font-size: 10px;
    vertical-align: text-top;
}
.first_view .spot_attention .bold p .hk_cc,
.cm__johnson_box.site_s4 .s4_ver_box .hk_cc {
    font-size: 15px;

}
/* ※北海道・九州沖縄を除くの装飾 ************************/
.item_guide_area .detail .cluster:nth-child(2) .hk_freeshipping,
.first_view .top_img_box .spot_attention .bold .hk_freeshipping  {
    font-size: 10px 
}
.first_view .top_img_box .spot_attention .bold .hk_freeshipping,
.cm__johnson_box.site_s4 .s4_ver_box .hk_shipping {
    font-size: 14px;
}
/* 【 font-weight 】 ************************/
.card.cw.sp p:nth-child(1),
.card.cw.sp p:nth-child(2),
.top.item_guide_area .s4_items_anchor.zone.top h4,
.item_guide_area .s4_items_using.zone .segment:nth-child(1) p:nth-child(1),
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell,
.od_func_filter_box .od_block:nth-child(1) .item_d_icon,
.od_func_filter_box .od_block:nth-child(2) .od_segment.price p,
.s4_cw .mein_list .detail .cluster .parts:nth-child(3) p,
.s4_cw .mein_list .detail .cluster .parts:nth-child(4) p,
.e_200v_air_c_area.detail p span, span span,
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) p:nth-child(1),
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) p:nth-child(1){
    font-weight: bold;
}
.product_of_individual span.list_right.no1 span.red1112{
    font-weight: normal;
}
/* 【 flex-shrink 】 ************************/
.customer_voice_area .scroll_box .scope{
    flex-shrink: 0;
}
.product_of_individual.item970 .intro_item.zone .content_cell{
    float: right;
}
.spot.sentence .float_layout{

    margin-right: 25px;
}
/* 【 height 】高さ *************************/
.customer_voice_area .scroll_box {
    height: 100%;
}
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell {
    height: 24px;
}
.item_guide_area .od_func_region .additional_sentence.item970,
.item_guide_area .od_func_region .additional_sentence.item1130 {
    height: 21px;
}

.block_zone li{
    height: 55px;
}
.cs_support_s.od_response_device .goto_form,
.cs_support_s.od_response_device .goto_form a,
.product_of_individual .content_segment.hukuyama_style {
    height: 110px;
}
.media_area .media_item.thumbnail {
    height: 222px;
}
.s4_cw .subject .another_page_link .page_link {
    height: initial;
}
.cs_support_s.od_response_device .cm__into_img,
.select_spot.item_guide_area .float_layout .box .cm__into_img,
.select_spot.item_guide_area .float_layout{
    height: auto;
}
.product_of_individual.item970 .features_item .peculiarity .features_other .range:nth-child(1){
    justify-content: space-around;
}

.s4_cw .mein_list .detail,
.item_guide_area .banner_category,
.item_guide_area .try_pic,
.last_item_area .option_zone.duct .segmnent:nth-child(2),
.last_item_area .option_zone.duct .segmnent:nth-child(3),
.last_item_area .option_zone.deodorize .segmnent:nth-child(2),
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent .spot .parts:nth-child(2),
.od_func_filter_box,
.post_list .latest-box,
.ul.s4_icon_unison,
.product_of_individual .option_zone.duct .segmnent:nth-child(2),
.product_of_individual .option_zone.duct .segmnent:nth-child(3),
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent .spot .parts:nth-child(2),
.product_of_individual.item970 .features_item .peculiarity .segment .range:nth-child(2),
.top.item_guide_area .icon_block,
.segment .scope:nth-child(2) .div_1 {
    justify-content: space-between;
}


/* 【 line-height 】 ************************/
.item_guide_area .od_func_region .additional_sentence p{
    line-height: 110%;
}
.customer_voice_area .side_scroll_area .scope .div:nth-child(1) p,
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p,
.last_item_area .option_zone.duct .segmnent .modal_button_box.link_t,
.last_item_area .option_zone.drain_hose .modal_button_box.link_t,
.item_guide_area .zone:nth-child(4) h4,
.item_guide_area .try_pic li p,
.question_area .qut.block .question_plus .zone p,
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p,
.product_of_individual .option_zone.duct .segmnent .modal_button_box.link_t,
.product_of_individual .option_zone.drain_hose .modal_button_box.link_t,
.product_of_individual .features_item p,
.product_of_individual.item970 .features_item p{
    line-height: 115%;
}
.cw ul,.cw li,
.s4_cw ul,.s4_cw li,
.item_guide_area .banner_category,
.item_guide_area .banner_category,
.item_guide_area .try_pic,
.ul.s4_icon_unison {
    list-style: none;
}/* 【 left 】 ******************************/
/* 【 margin 】 ***************************/
.spot_attention {
    margin: 40px auto 10px auto;
  }
.s4_items_anchor.zone.top h4{
    margin: 30px 0px 25px 0px;
}

.card.cw.sp p:nth-child(1),.card.cw.sp p:nth-child(3),.card.cw.sp p:nth-child(4),
.customer_voice_area .block:nth-child(2) .zone p,
.form_tel,
.last_item_area .option_zone .segmnent .spot .modal_button_box.link_t,
.cm__cw .block:last-child,
.cm__johnson_box.site_s4 .cm__jb_site994_h3,
.item_guide_area .cm__cw .block:last-child,
.anchor_link p,
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p:last-child,
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p:last-child,
.last_item_area .option_zone .spot.item973 .parts:nth-child(2) .div:nth-child(2) p:nth-child(1),
.item_guide_area .zone:nth-child(1) p:nth-child(1),
.item_guide_area .zone:nth-child(4) h4:nth-child(1),
.item_guide_area .mein_guide_phrase.normal_spot_cooler .sentence p:nth-child(1),
.item_guide_area .mein_guide_phrase.mobile_air_conditioner .sentence p:nth-child(2),
.item_guide_area .mein_guide_phrase.mobile_air_conditioner .sentence p:nth-child(3),
.e_200v_air_c_area.detail:nth-child(1) p:nth-child(1),
.e_200v_air_c_area.detail:nth-child(3) ul li p,
.item_guide_area .subject.mein_guide_phrase.business_spot_cooler .spot.sentence p:nth-child(1),.item_guide_area .subject.mein_guide_phrase.business_spot_cooler .spot.sentence p:nth-child(3),
.item_guide_area .cold_air_conditioner .mein_guide_phrase p:nth-child(1),.item_guide_area .cold_air_conditioner .mein_guide_phrase p:nth-child(4),.item_guide_area .cold_air_conditioner .mein_guide_phrase p:nth-child(5),.item_guide_area .cold_air_conditioner .mein_guide_phrase p:nth-child(6),
.item_guide_area .mist_fan .mein_guide_phrase p:nth-child(1),
.itm.item_guide_area .block .zone p:nth-child(1),
.s4_cw .mein_list .detail .cluster .parts:nth-child(1) h5,
.s4_cw .block .subject.mein_list:last-child,
.s4_cw .item_guide_p,
.s4_cw .subject .another_page_link .page_link,
.s4_cw .mein_list .detail .cluster .parts:nth-child(3) p:nth-child(1),
.s4_cw .mein_list .detail .cluster .parts:nth-child(4) p:nth-child(1),
.question_area .qut.block .question_plus .zone p,
.product_of_individual .option_zone .segmnent .spot .modal_button_box.link_t,
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p:last-child,
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p:last-child,
.product_of_individual .option_zone .spot.item973 .parts:nth-child(2) .div:nth-child(2) p:nth-child(1),
.product_of_individual .content_segment.hukuyama_style h5,
.product_of_individual.item970 .intro_item.zone .content_block.sentence .content_segment:nth-child(1) p:nth-child(2),
.product_of_individual.item970 .intro_item.zone .content_block.sentence .content_segment:nth-child(1) p:nth-child(4),
.product_of_individual.item970 .intro_item.zone .content_block.sentence .content_segment:nth-child(1) p:nth-child(6),
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) p,
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) p{
    margin: 0em 0em 0em 0em;
}
.cm__johnson_box.site_s4 .cm__jb_site994_div .p1,
.top.item_guide_area .subject.mein_guide_phrase.install_big_spot_cooler .spot.sentence .p1,
.top.item_guide_area .subject.mein_guide_phrase.install_big_spot_cooler .spot.sentence .p2{
    margin: 0;
}
.cs_support_s.od_response_device .goto_form {
    margin: 0em 0em 10px 0em;
}
.item_guide_area .mein_guide_phrase .sentence {
    margin: 0em 0em 0em 0em;
}
.item_guide_area .banner_category li {
    margin: 0px 0px 20px 0px;
}



.s4_cw .block {
    margin: 0em 0em 0em 0em;
}
.subject.od_func_region.cold_air_conditioner .content.modal_item.si_2004 .modal_button_box.link_t img {
    margin-top: 0px;
}
.cm__product_item_area .zone:nth-child(4) .parts:first-child{
    margin-top: 2em;
}
.range.voltage_200v_style {
    margin-top: 45px;
}
.s4_cw,
.cm__johnson_box.site_s4 .cm__jb_site994_div,
.item_guide_area .additional_hukuyama_style p,
.customer_voice_area .voice_id_5 .div:nth-child(2),
.product_of_individual .features_item h4,
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) div:nth-child(1),
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) div:nth-child(1),
.product_of_individual.item970 .features_item .peculiarity .segment.features_telescopic .range:nth-child(2) .parts,
.product_of_individual.item970 .features_item .peculiarity .features_caster .range:nth-child(3) p:nth-child(2),
.product_of_individual.item970 .features_item .peculiarity .features_tank .range:nth-child(3) p:nth-child(2){
    margin: 0em auto 0em auto;
}
.volt200 p:nth-child(2),
.parts.speaking_staff_line .box p,
.np_faq p,
.subject.mein_guide_phrase.install_big_spot_cooler .spot.sentence .parts.speaking_staff_line p:nth-child(1),
.required_number {
    margin-bottom: 0px;
}
.itm.item_guide_area .parts.speaking_staff_line .box,
.top.item_guide_area .parts.speaking_staff_line .box{
    margin-bottom: 3em;
}
#block_mist_fan01 .subject.od_func_region.blower .box:nth-child(1){
    margin-top: 26px;
}
#block_mist_fan01 .subject.od_func_region.mist_fan .parts.speaking_staff_line {
    margin-top: 74px;
}
#speaking_staff01 .box{
    margin-bottom: -1em ;
}
.item_guide_area h2 {
    margin: 0px 0px 50px 0px;
}
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell {
    margin: 0em 0.5em 0em 0em;
}
.item_guide_area .od_func_region .additional_sentence p{
    margin: 0em 0em 0.5em 0em;
}
.cm__johnson_box.site_s4 .cm__jb_site994_div p,
.cm__material_box.item_box.flex.identification798 .right_relevant .it__space,
.last_item_area .option_zone .segmnent .spot h4,
.last_item_area .option_zone .segmnent .spot,
.item_guide_area .mein_guide_phrase .sentence p:nth-child(1),
.product_of_individual .option_zone .segmnent .spot h4,
.product_of_individual .option_zone .segmnent .spot,
.customer_voice_area .block:nth-child(2) .voice_id_2 p:nth-child(2),
.customer_voice_area .block:nth-child(2) .voice_id_0 p:nth-child(2),.customer_voice_area .block:nth-child(2) .voice_id_0 p:nth-child(4),
.customer_voice_area .block:nth-child(2) .voice_id_1 p:nth-child(2),
.customer_voice_area .block:nth-child(2) .voice_id_3 p:nth-child(2),.customer_voice_area .block:nth-child(2) .voice_id_3 p:nth-child(5),
.e_200v_air_c_area.detail:nth-child(3) ul li,
.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(1),.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(2),
.question_area .qut.block .question_plus.question_parts0010 .zone .parts:nth-child(3),
.question_area .qut.block .question_plus.question_parts0010 .zone .parts:nth-child(1),.question_area .qut.block .question_plus.question_parts0010 .zone .parts:nth-child(1) p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0011 .zone p:nth-child(1),
.question_area .qut.block .question_plus.question_parts0014 .zone p:nth-child(1),
.question_area .qut.block .question_plus.question_parts0015 ul li,
.question_area .qut.block .question_plus.question_parts0016 .zone p:nth-child(1),.question_area .qut.block .question_plus.question_parts0016 .zone p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0020 .zone p:nth-child(1),.question_area .qut.block .question_plus.question_parts0020 .zone p:nth-child(3),.question_area .qut.block .question_plus.question_parts0020 .zone p:nth-child(6),
.question_area .qut.block .question_plus.question_parts0018 .zone .parts:nth-child(1) p:nth-child(1),.question_area .qut.block .question_plus.question_parts0018 .zone .parts:nth-child(1) p:nth-child(2),
.question_area .qut.block .question_plus.question_parts0019 .zone .parts:nth-child(1) p:nth-child(1),.question_area .qut.block .question_plus.question_parts0018 .zone .parts:nth-child(1) p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0022 .zone p:nth-child(2),
.question_area .qut.block .question_plus.question_parts0023 .zone p:nth-child(1),.question_area .qut.block .question_plus.question_parts0023 .zone p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0025 .zone p:nth-child(1),
.question_area .qut.block .question_plus.question_parts0027 .zone p:nth-child(1),.question_area .qut.block .question_plus.question_parts0027 .zone p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0028 .zone p:nth-child(3),
.question_area .qut.block .question_plus.question_parts0029 .zone p:nth-child(2),
.question_area .qut.block .question_plus.question_parts0030 .zone .parts:nth-child(1) p:nth-child(1),.question_area .qut.block .question_plus.question_parts0030 .zone .parts:nth-child(1) p:nth-child(3),
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items328,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items924,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items925,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items962,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items780,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items781,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items782,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items783,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items791,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items926,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items975,
.cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items933,
.s4_items_anchor.zone,.s4_cw .mein_list .another_page_link,
.s4_cw .mein_list .detail .cluster .parts:nth-child(1) {
    margin: 0em 0em 1em 0em;
}
.last_item_area .option_zone .segmnent .spot .modal_button_box.link_t,
.product_of_individual .option_zone .segmnent .spot .modal_button_box.link_t {
    margin: 0.5em 0em 0em 0em;
}
.last_item_area .cm__finale_zone,
.item_guide_area .try_pic,
.s4_cw .subject.mein_list,
.question_area .qut.block .link_list .cm__anchor_link,
.customer_voice_area .block:nth-child(1) .zone:nth-child(2){
    margin: 0em 0em 2em 0em;
}
.item_guide_area .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner,
.e_200v_air_c_area.detail {
    margin: 0em 0em 2.5em 0em;
}
.product_of_individual.item970 .features_item .peculiarity{
    margin: 0em 0em 3em 0em; 
}
.product_of_individual.item970 .intro_item.zone .content_cell{
    margin: 0em 0em 0em 1em;
}
.event .p1 {
    margin: 0.5em 0px 0px 18px;
}
.customer_voice_area .block:nth-child(2) .zone p:last-child {
    margin: 1em 0em 0em 0em;
}
.question_area .cm__tel_hours_holid_parts,
.question_area .qut.block .question_plus.question_parts0015 ul li{
    margin: 1em 0em 1em 0em;
}
.customer_voice_area .scroll_box .scope {
    margin: 1rem 1rem 1rem 1rem;
}
.product_of_individual .zone.peculiarity.d-md-grid.four-one.m_0525_02{
    margin:80px 0 80px 0;
}
.product_of_individual .intro_item.zone .content_cell p {
    margin: -6px auto 1em auto;
}
.cm__cw .block.features_item.m_0522{
    margin:43px auto -40px auto;
}
.option_zone .spot .content.modal_item {
    margin: 5px 0;
}
.product_of_individual.item970 .features_item .peculiarity h4{
    margin: 0 auto 1em 0;
}

.cm__cw .block {
    margin-bottom: 50px;
}
.subject.od_func_region.cold_air_conditioner .parts.speaking_staff_line img,
#spot_border2 .parts.speaking_staff_line img,
.parts.speaking_staff_line.lx .box img {
    margin-top: 74px;
}

#block_mist_fan01_item06 .box img {
    margin-bottom: 2em;
    margin-top: -10px;
}
.parts.speaking_staff_line .box01 {
    margin-bottom: 3em;
    margin-top: -10px;
}
.top.item_guide_area .icon_block .d1 .di1, .top.item_guide_area .icon_block .d1 .di2, .top.item_guide_area .icon_block .d1 .di3, .top.item_guide_area .icon_block .d2 .di1,
.itm.item_guide_area .icon_block .d1 .di1, .itm.item_guide_area .icon_block .d1 .di2, .itm.item_guide_area .icon_block .d1 .di3, .itm.item_guide_area .icon_block .d2 .di1 {
    margin-right: 25px;
}

.select_cold_air.item_guide_area .subject.mein_guide_phrase {
    margin-bottom: 20px;
}
.howtouse,
.top.item_guide_area .icon_block,
.itm.item_guide_area .icon_block{
    margin-bottom: 35px;
}
.list_right.no1 .p0{
    margin-bottom: 6px;
}/* 【 max-height 】 *************************//* 【 max-width 】 **************************/
/* 【 opacity 】 ****************************/
/* 【 overflow 】 ***************************/
.item_guide_area div,
.s4_cw .mein_list .detail .cluster:nth-child(1){
    overflow: initial;
}
.div.assistance .parts .modal__content {
    overflow: visible;
}
.items_area.alignment_block,
.customer_voice_area .scroll_box {
    overflow-x: auto;
}
.top.last_item_area ul li .cm__anchor_banners{
    overflow: hidden;
}
.modal__content {
    overflow: scroll !important;
}

/* 【 padding 】 ****************************/

.first_view .top_img_box .spot_attention .bold .hk_freeshipping {
    padding: 1px 14px;
}

.s4_cw .block:nth-child(2){
    padding-bottom: 10px;
}
.card.cw.sp p,
.customer_voice_area .block:nth-child(2) .zone p,
.customer_voice_area .side_scroll_area .scope .div:nth-child(1) p,
.cs_support_s.od_response_device .cs_tel p,
.cs_support_s.od_response_device .cs_staff .parts:nth-child(1) p,
.item_guide_area .try_pic li p,
.e_200v_air_c_area.detail p span,
.last_item_area .option_zone .segmnent .spot .modal_button_box.link_t,
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2),
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p,
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p,
.product_of_individual .intro_item.zone .content_block.sentence p,
.s4_cw .subject.mein_guide_phrase p,
.s4_cw .subject.mein_list h4,
.s4_cw .item_guide_p,
.s4_cw .mein_list .detail .cluster p,
.s4_cw .mein_list .detail .cluster .parts:nth-child(1) h5,
.cw.spot_blog,
.question_area .qut.block .question_plus .zone p,
.product_of_individual .option_zone .segmnent .spot .modal_button_box.link_t,
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p,
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p,
.product_of_individual .intro_item.zone .segment:nth-child(2) .content_block h3,
.product_of_individual .features_item h4,
.product_of_individual .features_item p,
.product_of_individual.item970 .features_item .peculiarity h4,
.product_of_individual.item970 .features_item p,
.item_guide_area .subject.od_func_region.cold_air_conditioner{
    padding: 0em 0em 0em 0em;
}
.item_guide_area .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner {
    padding: 0em 0em 2.5em 0em;
}
.top.item_guide_area .subject.od_func_region.business_spot_cooler,
.top.item_guide_area .subject.od_func_region.mobile_air_conditioner,li .list_right.no1{
    padding: 0;
}
.od_func_filter_box .od_block:nth-child(1) .item_d_icon,
.ul.s4_icon_unison li {
    padding: 0em 0.5em 0em 0.5em;
}
.item_guide_area h2 {
    padding: 10px 0px 0px 0px;
}
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell {
    padding: 0.25em 0.25em 0.25em 0.25em;
}
.list_right.no1 p,
.product_specifications .li:last-child span {
    padding: 0.25em 0.5em;
}
.product_of_individual .content_segment.hukuyama_style h5 {
    padding: 0.5em 0.5em;
}
.customer_voice_area .block:nth-child(2) .zone {
    padding: 1em 0em 1em 0em;
}
.option_zone .spot .content.modal_item {
    padding: 5px 0 5px 0;
}
.customer_voice_area .scroll_box .scope {
    padding: 1rem 1rem 1rem 1rem;
}
.last_item_area .option_zone .segmnent .spot,
.product_of_individual .option_zone .segmnent .spot {
    padding: 1em 1em 1em 1em;
}
.product_of_individual .option_zone.dehumidifier .segmnent .spot{
    padding: 0;
}
.s4_cw .block {
    padding: 50px 40px;
}
.cm__cw .block:last-of-type {
    padding-bottom: 0px;
}
.cm__cw .block {
    padding-bottom: 50px;
}
.item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(1) h5,
.cm__johnson_box.site_s4 .cm__jb_site994_div p,
.item_guide_area .mein_guide_phrase.normal_spot_cooler .sentence p:nth-child(4),
.item_guide_area .od_func_region .additional_sentence p,
.e_200v_air_c_area.detail:nth-child(3) ul p,
.question_area .qut.block .question_plus.question_parts0015 ul li h4,
.question_area .cm__cw .qut.block .question_plus.question_parts0015 .zone ul li p,
.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(2) p,
.product_of_individual .intro_ul_list.parts p,

.product_of_individual .cm__product_item_area .assistance .three_phase_200v_need.parts p,
.product_of_individual.item970 .features_item .peculiarity .features_tank .range:nth-child(3) p:nth-child(3),
.product_of_individual.item970 .features_item .peculiarity .features_cold .range:nth-child(3) p:last-child,
.product_of_individual.item970 .features_item .peculiarity .features_far_space .range:nth-child(3) p:last-child{
    padding: 0em 0em 0em 1em;
}
.spot.sentence .box div:nth-child(1){
    padding: 0 15px;
}
/* 【 position 】************************** */
.side_scroll_area {
    position: relative;
}
/* 【 text-align 】 *************************/
.card.cw.sp p,
.customer_voice_area .block:nth-child(1) h4,
.item_guide_area .zone:nth-child(4) h4,
.item_guide_area .s4_items_using.zone .segment:nth-child(1) p:nth-child(1),
.s4_cw .item_guide_p,
.s4_cw .subject.mein_list h4,
.product_of_individual .content_segment.hukuyama_style h5,
.product_of_individual .intro_item.zone .content_cell p,
.product_of_individual .features_item .peculiarity h4,
.product_of_individual.item970 .features_item .peculiarity h4,
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) p,
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) p,
.top.item_guide_area .s4_items_anchor.zone.top h4,
.segment.features_storehouse .range{
    text-align: center;
}
.cm__johnson_box.site_s4 .cm__jb_site994_div p,
.customer_voice_area .block:nth-child(2) .zone:last-child p,
.customer_voice_area .block:nth-child(2) .zone p:last-child,
.last_item_area .option_zone .segmnent .spot .modal_button_box.link_t,
.product_of_individual .option_zone .segmnent .spot .modal_button_box.link_t,
.question_area .qut.block .question_plus.question_parts0010 .zone .parts:nth-child(3) p,
.accbox.sp_ver.original_accordion785 .shipping_li:nth-child(3) .ul_li.span_right,
.accbox.sp_ver.original_accordion785 .shipping_li:nth-child(4) .ul_li.span_right,
.accbox.sp_ver.original_accordion785 .shipping_li:nth-child(5) .ul_li.span_right,
.accbox.sp_ver.original_accordion785 .shipping_li:nth-child(6) .ul_li.span_right,
.accbox.sp_ver.original_accordion1125 .shipping_li:nth-child(3) .ul_li.span_right,
.accbox.sp_ver.original_accordion1125 .shipping_li:nth-child(4) .ul_li.span_right,
.accbox.sp_ver.original_accordion1125 .shipping_li:nth-child(5) .ul_li.span_right,
.accbox.sp_ver.original_accordion1125 .shipping_li:nth-child(6) .ul_li.span_right {
    text-align: right;
}
.spot_attention p{
    text-align: left ;
}
/* 【 text-indent 】 ************************/
.anchor_link p,
.item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(1) h5,
.item_guide_area .od_func_region .additional_sentence p,
.e_200v_air_c_area.detail:nth-child(3) ul li p:nth-child(1),
.question_area .qut.block .question_plus.question_parts0015 ul li h4,
.od_func_filter_box .od_block:nth-child(2) .od_segment:nth-child(2) p,
.cm__johnson_box.site_s4 .cm__jb_site994_div p,
.item_guide_area .additional_hukuyama_style p,
.product_of_individual .intro_ul_list.parts p,
.product_of_individual .cm__product_item_area .assistance .three_phase_200v_need.parts p,
.product_of_individual.item970 .features_item .peculiarity .features_tank .range:nth-child(3) p:nth-child(3),
.product_of_individual.item970 .features_item .peculiarity .features_cold .range:nth-child(3) p:last-child,
.product_of_individual.item970 .features_item .peculiarity .features_far_space .range:nth-child(3) p:last-child{
    text-indent: -1em;
}
.cm__banners_img,
.ul.s4_icon_unison li {
    width: 13%;
}
.last_item_area .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1),
.product_of_individual .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1){
    width: 20%;
}
.product_of_individual.item970 .intro_item.zone .content_cell{
    width: 25%;
}
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1),
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(1),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1),
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(1){
    width: 30%;
}
.cs_support_s.od_response_device.sagawa .cs_staff .parts:nth-child(2),
.item_guide_area .try_pic li,
.post_list .latest-box a,
.s4_cw .mein_list .detail .cluster:nth-child(1){ 
    width: 32%;
}
.customer_voice_area .scroll_box .scope {
    width: 35%;
}
.od_func_filter_box .od_block:nth-child(1){
    width: 40%;
}


.item_guide_area .od_mein_item_state {
    width: 49%;
}
.content_parts_mist,
.content_parts2_mist,
.subject.od_func_region.mobile_air_conditioner .parts.speaking_staff_line,
.subject.od_func_region.business_spot_cooler .parts.speaking_staff_line,
.subject.od_func_region.cold_air_conditioner .parts.speaking_staff_line,
.subject.od_func_region.mist_fan .parts.speaking_staff_line,
.subject.od_func_region.blower .parts.speaking_staff_line,
.subject.od_func_region.dehumidifier .parts.speaking_staff_line{
    width: 50%;
}
.cs_support_s.od_response_device.sagawa .cs_staff .parts:nth-child(1) {
    width: 67%;
}
.customer_voice_area .voice_id_5 .div:nth-child(2){
    width: 70%;
}
.product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) div:nth-child(1),
.product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) div:nth-child(1){
    width: 75%;
}
.option_zone .optz.parts h4,
.last_item_area .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2),
.product_of_individual .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) {
    width: 78%;
}
.spot_link.use .box .spot_list {
    margin: 0px 0px 8px 0px;
}


.last_item_area .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot,
.product_of_individual .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot,
.cs_support_s.od_response_device .cm__into_img,
.top.item_guide_area .icon_block img,
.gokuzyou,
.gokuzyou1 img,
.gokuzyou1,
.gokuzyou2 img,
.gokuzyou2,
.howtouse img,
.content_parts2_mist img, 
.spot_link.use div,
.subject.od_func_region.mist_fan,
.select_spot.item_guide_area .subject.mein_guide_phrase.normal_spot_cooler .spot.sentence div.box.w_100
{
    width: 100%;
}

.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot,
.last_item_area .option_zone.duct .segmnent:nth-child(2) .spot,
.last_item_area .option_zone.duct .segmnent:nth-child(3) .spot,
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot,
.last_item_area .option_zone .segmnent .spot.item784,
.item_guide_area .banner_category li,
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot,
.product_of_individual .option_zone.duct .segmnent:nth-child(1) .spot,
.product_of_individual .option_zone.duct .segmnent:nth-child(2) .spot,
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot,
.product_of_individual .option_zone .segmnent .spot.item784 {
    width: calc(50% - 10px);
}
.product_of_individual.item970 .features_item .peculiarity .segment,
.product_of_individual.item970 .features_item .peculiarity .segment .range:nth-child(2) .parts{
    width: calc(50% - 1rem);
}
.last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2),
.last_item_area .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2),
.product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2),
.product_of_individual .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) {
    width: calc(70% - 1em);
}
.s4_cw .mein_list .detail .cluster:nth-child(2) {
    width: calc(68% - 1em);
}
.option_zone .optz.parts .optz_sell {
    width: 35px;
}
.option_zone .optz.parts .optz_rental {
    width: 70px;
}
.cs_support_s.od_response_device .goto_form{
    width: 450px;
}
.cm__johnson_box.site_s4 .cm__jb_site994_div,
.card.cw.sp,
.red_box.cw {
    width: 865px;
}

.s4_cw {
    width: 1200px;
}
    .select_spot.item_guide_area .spot.sentence.sp .fx2_0629 span {
        color: red;
    }
/* ==================== [spotcooler/商品共通] 商品ページの復元CSS（仕様表/item970/モーダル中身） ==================== */
/* ============================================================
   【商品ページ】仕様表(product_specifications)のレイアウト復活（整理で消えた分）。
   値(dl.sub_dl>dt.sub_dt)の横並び・セル幅・罫線。※既存の width:50%(2値行)より前に置き
   参照どおり「25%→50%」の順にして始動電流等の2値行を50/50にする。
   ============================================================ */
.product_specifications.items_no1181 .list_right .w50p { width: 50%; } .product_specifications.items_no970 .list_right .sub_dl{ display: flex; } .product_specifications.items_no970 li:nth-child(3) .list_right, .product_specifications.items_no970 li:nth-child(4) .list_right, .product_specifications.items_no970 li:nth-child(5) .list_right, .product_specifications.items_no970 li:nth-child(6) .list_right, .product_specifications.items_no970 li:nth-child(7) .list_right, .product_specifications.items_no970 li:nth-child(8) .list_right, .product_specifications.items_no970 li:nth-child(9) .list_right{ padding: 0em; } .product_specifications.items_no970 li:nth-child(3) .sub_dl dt:nth-child(2), .product_specifications.items_no970 li:nth-child(6) .sub_dl dt:nth-child(2){ border-left-color: #595959; border-left-style: solid; border-left-width: 1px; } .product_specifications.items_no970 li:nth-child(4) .sub_dl dt, .product_specifications.items_no970 li:nth-child(5) .sub_dl dt, .product_specifications.items_no970 li:nth-child(7) .sub_dl dt, .product_specifications.items_no970 li:nth-child(8) .sub_dl dt, .product_specifications.items_no970 li:nth-child(9) .sub_dl dt, .product_specifications.items_no970 li:nth-child(10) .sub_dl dt{ border-right-color: #595959; border-right-style: solid; border-right-width: 1px; } .product_specifications.items_no970 li:nth-child(4) .sub_dl dt:last-child, .product_specifications.items_no970 li:nth-child(5) .sub_dl dt:last-child, .product_specifications.items_no970 li:nth-child(7) .sub_dl dt:last-child, .product_specifications.items_no970 li:nth-child(8) .sub_dl dt:last-child{ border: none; } .product_specifications.items_no970 li .sub_dl dt:nth-child(2){ height: 29px; } .product_specifications.items_no970 li .sub_dl dt p{ text-align: center; } .product_specifications.items_no970 li:nth-child(4) .sub_dl dt, .product_specifications.items_no970 li:nth-child(5) .sub_dl dt, .product_specifications.items_no970 li:nth-child(7) .sub_dl dt, .product_specifications.items_no970 li:nth-child(8) .sub_dl dt, .product_specifications.items_no970 li:nth-child(9) .sub_dl dt, .product_specifications.items_no970 li:nth-child(10) .sub_dl dt{ width: 25%; }
/* item970: 4値行の最終セル右罫線を全行で除去し、縦線を揃え右端の二重線をなくす（参照は行により有無が不統一）。 */
.product_specifications.items_no970 li:nth-child(9) .sub_dl dt:last-child,
.product_specifications.items_no970 li:nth-child(10) .sub_dl dt:last-child { border-right: none; }
@media screen and (max-width: 640px) {
    .product_specifications .list_left { width: 25%; }
    .product_specifications .list_right { width: 75%; }
}
    .product_specifications.items_no970 li:nth-child(3) .sub_dl dt,
    .product_specifications.items_no970 li:nth-child(6) .sub_dl dt,
    .product_specifications.items_no970 li:nth-child(7) .sub_dl dt,
    .select_spot.item_guide_area .float_layout .box .cm__into_img{
        width: 50%;
    }
    /* 【 試し CSS 】 ******/
        .item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(1) h5::before {
            content:"★";
        }
        .item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(1) h5 {
            font-size: 19px;
            line-height: 115%;
        }
        .item_guide_area .mein_item_region .cluster:nth-child(2) p .cm__highlight .od_day {
            font-size: 14px;
        }
        .item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(3) h5 {
            font-size: 19px;
        }
        .item_guide_area .mein_item_region .goto_form.y_form p {
            font-size: 20px;
        }
        .item_guide_area .mein_item_region .goto_form .input_yoyaku img {
            width: 20px;
        }

        .item_guide_area .mein_item_region .goto_form {
            height: 45px;
            padding: 0.25em 0em;
            margin: 0em auto 0em auto;
        }
        .item_guide_area .mein_item_region .cluster:nth-child(2) .parts:nth-child(1) {
            margin: 0em 0em 1em 0em;
        }
        .item_guide_area .mein_item_region .another_page_link {
            border: none;
            background-color: initial;
        }
        .item_guide_area .mein_item_region .another_page_link,
        .item_guide_area .mein_item_region .goto_form.y_form.button.another_page_item {
            box-shadow: initial;
        }
        .item_guide_area .mein_item_region .detail {
            display: flex;
            justify-content: space-between;
        }
        .item_guide_area .mein_item_region {
            background-color: #fff;
            padding: 0.5em;
            box-sizing: border-box;
            box-shadow: 3px 3px 6px 1px #595959;
        }
        .item_guide_area .mein_item_region .cluster:nth-child(2) p,
        .item_guide_area .mein_item_region .cluster:nth-child(2) h5 {
            color: black;
            padding: 0em;
            margin: 0em;
        }
        .item_guide_area .mein_item_region a:hover {
            opacity: 0.52;
            text-decoration: none;
        }
        .item_guide_area .subject.od_func_region {
            display: flex;
            justify-content: space-between;
            margin: 0em 0em 1em 0em;
        }
        .item_guide_area .mein_item_region .detail .cluster:nth-child(2) {
            width: 44%;
        }
        .item_guide_area .mein_item_region .detail .cluster:nth-child(1) {
            width: 56%;
        }
    /* 【 other or special CSS 】 ******/
.side_scroll_area::after {
    background-color: #ffffffd6;
    background-image: url(https://joshubussan.heteml.net/common/img/slider_arrow_image.png);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 150px;
    margin: auto 0;
    padding: 5px;
    position: absolute;
    right: 0;
    top: 30%;
    width: 75px;
}
    .appeal.zone .accbox.pc_ver .close_accordion.right.mt-4.mb-0.small1.d-block.d-lg-none {
        width: 700px;
        margin: 0 auto;
        text-align: left;
    }
    #modal2004 .modal__content{
        overflow: scroll;
    }
    #modal2004 .modal__content h3{
        color: #31320E;
        font-size: 28px;
        line-height: 120%;
        margin: 0px 0px 20px 0px;
        padding: 10px 0;
    }
    #modal2004 .modal__content .voltage100,
    #modal2004 .modal__content .voltage200,
    #modal2004 .modal__content .voltage300{
        display: flex;
    }
    #modal2004 .modal__content .voltage100 .sp100,
    #modal2004 .modal__content .voltage200 .sp200,
    #modal2004 .modal__content .voltage300 .sp300{
        display: flex;
    }
    .cm__johnson_box.site_s4 .pc.red.font_weight_500 img,
    .parts.speaking_staff_line.pc img,
    .modal__content img,
    .parts.speaking_staff_line img{
        display: revert;
    }
    #modal2004 .modal__content .voltage100 .sp100,
    #modal2004 .modal__content .voltage200 .sp200,
    #modal2004 .modal__content .voltage300 .sp300{
        margin: 10px;
        width: 70%;
    }
    #modal2004 .modal__content .voltage100 .sp100 .volt100,
    #modal2004 .modal__content .voltage200 .sp200 .volt200,
    #modal2004 .modal__content .voltage300 .sp300 .volt300{
        margin: 10px;
        width: 50%;
    }
    #modal2004 .modal__content .voltage100 .sp100 .img100,
    #modal2004 .modal__content .voltage200 .sp200 .img200,
    #modal2004 .modal__content .voltage300 .sp300 .img300{
        margin: 10px;
        width: 50%;
    }
    #modal2004 .modal__content .voltage100 .volt100_1,
    #modal2004 .modal__content .voltage200 .volt200_1,
    #modal2004 .modal__content .voltage300 .volt300_1{
        margin-top: 50px;
        width: 30%;
        margin: 10px;
    }
    #modal2004 .modal__content .voltage100 .volt100_1 .itemlist2 p::before,
    #modal2004 .modal__content .voltage200 .volt200_1 .itemlist2 p::before,
    #modal2004 .modal__content .voltage300 .volt300_1 .itemlist2 p::before{
        content: "●";
    }
    #modal2004 .modal__content .voltage100 .volt100_1 .itemlist2 p,
    #modal2004 .modal__content .voltage200 .volt200_1 .itemlist2 p,
    #modal2004 .modal__content .voltage300 .volt300_1 .itemlist2 p{
        text-indent: -1em;
        padding: 0em 0em 0em 1em;
        margin: 0px;
        font-size: 15px;
    }
    .content.modal_item.si_2004{
        text-align: right;
    }
    .item_guide_area .subject.mein_guide_phrase.normal_spot_cooler .spot.sentence .waste.heat p.waste2 {
        text-indent: -1em;
        padding-left: 1em;
    }
    @media screen and (max-width: 640px){
        .div1right, .div1left,
        .select_blower.item_guide_area .spot.sentence .box div:nth-child(1),
        .select_blower.item_guide_area .spot.sentence .box div:nth-child(1) img{
            width: 100%;
        }       
            #modal2004 .modal__content .voltage100,
            #modal2004 .modal__content .voltage200,
            #modal2004 .modal__content .voltage300{
                display: block;
            }
            #modal2004 .modal__content .voltage100 .sp100,
            #modal2004 .modal__content .voltage200 .sp200,
            #modal2004 .modal__content .voltage300 .sp300{
                margin: 10px;
                width: 100%;
            }
            #modal2004 .modal__content .voltage100 .sp100 .volt100,
            #modal2004 .modal__content .voltage200 .sp200 .volt200,
            #modal2004 .modal__content .voltage300 .sp300 .volt300{
                margin: 10px;
                width: 50%;
            }
            #modal2004 .modal__content .voltage100 .sp100 .img100,
            #modal2004 .modal__content .voltage200 .sp200 .img200,
            #modal2004 .modal__content .voltage300 .sp300 .img300{
                margin: 10px;
                width: 50%;
            }
            #modal2004 .modal__content .voltage100 .volt100_1,
            #modal2004 .modal__content .voltage200 .volt200_1,
            #modal2004 .modal__content .voltage300 .volt300_1{
                width: 100%;
                margin: 10px;
            }   
    }
.format_item p,
.cs_support_s,
.cm__cheerful_area.ul.segment .li{
    background-color: #494824;
}
.before_delivery.delivery_paragraph,
.cm__transport_area.back_transport,
.popular_reason_area {
    background-color: white;
}
.cm__cw .block{
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #595959;
}
.cm__cw .block:last-of-type{
    border: none;
}
/* ============================================================
   【整理】index.html に散っていたインラインstyleをクラスへ移した分
   （相談窓口ブロック5箇所 ×2種／商品一覧の入れ物／モーダル画像／代替品の段落）
   ============================================================ */
/* 相談窓口の「当店なら全国往復送料￥0〜」のリード文 */
.cm__rd_photo .segment .r_p_lead {
  font-weight: bold;
}
/* 相談窓口の「※北海道・九州は送料別途」 */
.r_d_block_hk.smile_left {
  display: block;
  padding: 0 1em 0 0;
  position: relative;
  top: 1em;
  text-align: right;
}
/* 商品一覧の入れ物。共通クラス側が flex のため、ここだけ縦積みに戻す */
.subject.od_func_region.stack_block {
  display: block;
}
/* メディア掲載のモーダル内の紙面画像 */
.media_img .jq_modal_content .modal_thumbnail {
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
/* 代替品の説明段落 */
.ccha__p16 {
  margin-bottom: 1em;
}
/* 共通CSSの h2{line-height:44px} がそのまま残っていた最後の1箇所 */
.cm__jb_greeting .cm__connecting_smiles h2 {
  line-height: 1.3;
}

/* 【統一】共通CSSの line-height:44px は font-size:48px に対して足りず、
   文字の下が見切れる原因になる。個別に直した見出しと同じ 1.3 に揃える */
.rental_30seconds h2,
.customer_voice_area.item h2,
.top.cm__transport_area.back_transport h2 {
  line-height: 1.3;
}
/* 【変更】ラフの吹き出し指示「h2色、サイト名と同じ茶色に #31320E」に従う。
   #494824 はラフのカラーコード表では『塗りに使う茶色』で、文字用は #31320E。
   アイコン群（6つの保証ボックス等）の塗りは #494824 のままでよい、との指示 */
h2{
    color: #31320E;
}

/* 【修正】ヘッダーのロゴ画像とグローバルナビの間に隙間（10px）が出ていた。
   入れ物 .cm__header_img に height:140px の固定指定があるのに、
   中のロゴ画像は 130px しかなく、さらに画像が inline のため
   下にベースライン分の余白も付いていた。
   高さを中身なりにして、インラインの余白も消す */
.cm__header_img.sites4 {
  height: auto;
}
.cm__header_img.sites4 > a {
  display: block;
  line-height: 0;
}
/* CHANGED: #pc_navi (the top nav bar: トップページ/商品一覧/独自の保証体制/...) is defined in
   common_style.css as a gray bar (#b7b7b7) with white text — that's the spot-cooler original.
   The Excel raf (image93.png, トップページ_キャプチャ) shows this nav as a white bar with dark
   brown text and thin gray dividers, so overriding it here (style.css loads after common_style.css,
   so this wins at equal specificity without needing !important). This nav component is shared
   across the other ~20 pages using this same template, so this should be a net improvement there too. */
/* 【修正】グローバルナビの配色を現行サイト（mochitsuki-rental.com）に合わせる。
   現行は背景画像 image/g_menu1.jpg で作られており、そこから実測した値：
   背景 #d8d4d5 ／ 下端の太いライン #3b3738（6px）
   下線は nav 全幅ではなくメニュー項目の並ぶ範囲（.cw）に付けて、
   左右のボタンが無い余白部分には線が出ないようにしている */
.cm__cw .corona_product.block .zone_1 .segment:nth-child(1),
.segment .segment.current3phase200v .scope,
.segment .scope:nth-child(2) .div_1{
    display: flex;
}
.product_p ul p,

.cm__cw .block:last-of-type,
.block.no0 .zone.no2 p:nth-child(1),
.block.no0 .zone.no2 p:nth-child(2),
.block.no1 .zone.no0 p,
.cm__cw .corona_product.block .zone p,
.cm__cw .corona_product.block .zone_1 .segment .div p,
.cm__cw .corona_product.block .zone_1 .segment.prosopopoeia_machine_phrase .box p:nth-child(1),
.cm__cw .corona_product.block .zone_1 .segment.prosopopoeia_machine_phrase .box p:nth-child(3),
.cm__cw .corona_product.block .zone_1 .segment.prosopopoeia_machine_phrase .spot p:nth-child(1),
.cm__cw .corona_product.block .zone_1 .segment.prosopopoeia_machine_phrase .spot p:nth-child(2),
.cm__cw .corona_product.block .zone_1 .segment.prosopopoeia_machine_phrase .spot p:nth-child(7){
    margin: 0;
}
.cm__cw .block{
    margin: 20px auto 15px auto;
}
.spot.border-primary.box-shadow-none.m_0525{
    margin: 100px 0 100px 0;
}

.block.no1 .zone.no1 img{
    margin-top: 1em;
}
.product_of_individual .p_item.zone.m_0525{
    margin-top: 50px;
}
.product_of_individual .zone.peculiarity.d-md-grid.four-one.m_0525{
    margin-top: 91px;
}
.cm__cw .corona_product.block .zone{
    margin-bottom: 2em;
}
h4,
.product_p ul p{
    padding: 0;
}
/* 入れ子(.top.item_guide_area)を外した結果、cm__cw が common の四辺50pxに戻り
   テキスト幅が1000pxに狭まって改行位置が参照とズレる。参照どおり左右0(内容1100px)へ戻す。 */
.popular_reason_area .cm__cw {
    padding: 50px 0px;
}
.itm.link_area .cm__cw {
    padding: 50px 0px;
}
/* [削除] .top.cm__transport_area.back_transport .cm__cw{padding:50px} は本番に無い独自ルール。
   common_style が PC=幅1100/padding50px・SP=幅95%/padding0 を既に付与しており、この行はSPで
   padding:0 を潰してコンテンツ幅を 407→307px に狭めていた（sagawa等のSP幅縮小の原因）。→削除で本番一致。 */
.customer_voice_area .cm__cw {
    padding: 50px 0px;
}
.top_p.media_area .cm__cw {
    padding: 50px 0px;
}


.block.no0 .zone.no0 .segment.no0,
.block.no0 .zone.no2 p:nth-child(1),
.block.no0 .zone.no2 p:nth-child(2),
.block.no0 .zone.no2 p:nth-child(3),
.cm__cw .corona_product.block .zone{
    text-align: left;
}
.block.no1 .zone.no2,
.block.no0 .zone.no2 p:nth-child(4){
    text-align: right;
}
.maintenance_flow .scope{
    vertical-align: top;
}
.maintenance_flow .scope {
    width: calc(25% - 1em);
}
.block.no1 .zone.no1 img{
    width: 75%;
}
/*************** modal　中身 ******************************/
.jq_modal_content .right_flex .od_merit_zone h4 {
    margin: 0 !important;
}
.jq_modal_content .right_flex .od_merit_zone .p_hs {
    margin-right: 0;
}
.jq_modal_content .right_flex .cm__finale_zone .parts:nth-child(2){
    display: block !important;
}

.jq_modal_content .right_flex .od_merit_zone{
    width: 100% !important;
}

.jq_modal_content h3{
    text-align: center !important;
}
.voltage_200v_style .spot:nth-child(1) {
        display: flex;
        justify-content: space-between;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) {
        width: 83%;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) h4 {
        font-size: 1.3em;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) p:nth-child(3) {
        color: red;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(2) {
    width: 15%;
    }



@media screen and (min-width: 641px) {
    .spot_use.zone .cm__into_img_sp,
    .parts.speaking_staff_line .cm__into_img.sp {
        display: none;
    }
    
}
/*　▽▽▽▽▽▽ レスポンシブ CSS (画面サイズが(max-width: XXXpx) XXX以下で下記効果を適用します。)　▽▽▽▽▽▽▽▽▽▽▽▽▽▽▽▽▽▽　*/
@media screen and (max-width: 1024px){
    .cm__cw, .cw, .cm__site_map_main, .cm__abo_company_outline, .cm__all_item_list_banner, .cm__abo_company_outline .li span:first-child p {
        margin: 25px auto 0px auto;
    }
    .cs_support_s .cw,
    .h1 .cm__cw,
    .header_img.cw,
    .cs_support_s.sp .cs_support.cw {
        margin: 0px auto 0px auto;
    }
    #jb_link .cw {
        padding: 0;
        margin: 0 auto;
    }
    #jb_link .cw .footer_link li {
        width: 30%;
    }
}
@media screen and (max-width: 640px){


    .first_view .event.sp .otday{
        background-color: white;
    }

    .first_view .event.sp .otday p{
        margin-block-end: 0em;
        font-size: 14px;
        margin-top: 2px;
    }


    .first_view .event.sp .otday p img{
        width: 20px !important;
        height: 20px;
        display: inline-block;
        margin-left: 8px;
    }

    #modal2004 .modal__content h3 {
        width: 100%;
        margin: 32px 0 0 0;
    }
   

/* 【 ［SP］/ h1,h2,h3,h4 】 ****************/
/* 【 ［SP］/ background-color 】背景色  ****/
/* 【 ［SP］/ background-image 】　*********/
/* 【 ［SP］/ background-repeat 】　********/
/* 【 ［SP］/ background-size 】　**********/
/* 【 ［SP］/ border 】線　*****************/
/* 【 ［SP］/ color 】色 ******************/
/* 【 ［SP］/ display 】 ******************/
    .item_guide_area .mein_item_region .detail,
    .item_guide_area .banner_category,
    .item_guide_area .subject.od_func_region,
    .item_guide_area .try_pic,
    .od_func_filter_box,
    .post_list .latest-box,
    .last_item_area .option_zone.duct .segmnent:nth-child(2),
    .last_item_area .option_zone.duct .segmnent:nth-child(3),
    .last_item_area .option_zone.deodorize .segmnent:nth-child(2),
    .last_item_area .option_zone.drain_hose .segmnent:nth-child(2),
    .product_of_individual .option_zone.drain_hose .segmnent:nth-child(2),
    .product_of_individual .option_zone.duct .segmnent:nth-child(2),
    .product_of_individual .option_zone.duct .segmnent:nth-child(3),
    .product_of_individual.item970 .features_item .peculiarity,
    .top.item_guide_area .icon_block,
    .itm.item_guide_area .icon_block,
    .spot.sentence .box,
    .dehumidifier_segmrnt,
    .voltage_200v_style .spot:nth-child(1),
    .select_mist_fan.item_guide_area .spot.sentence.f_0629 {
        display: block;
    }
    .item_guide_area .try_pic li,
    .item_guide_area .mein_item_region .detail .cluster:nth-child(2) .parts:nth-child(2),
    .select_spot.item_guide_area .box.w_100 {
        display: flex;
    }

    .item_page_jb .cm__johnson_box .under_rd_area .segment.cm__jb_cs_ph {
        display: none;
    }
/* 【 ［SP］/ font-size 】文字の大きさ *****/

    .top_img_box.cw h5,
    .first_view .top_img_box .spot_attention .bold .hk_freeshipping {
        font-size: 11px;
    }
    .cm__anchor_banners .cm__p1 {
        font-size: 3.42vw;
    }
    .last_item_area .block.array .modal__content .cm__input_reserve p:nth-child(1), section.block.array .modal__content .cm__input_reserve p:nth-child(1) {
        font-size: 3.5vw;
    }
    .last_item_area .block.array .jq_modal_content .right_flex .cm__finale_zone .cm__input_reserve .cm__p2, section.block.array .jq_modal_content .right_flex .cm__finale_zone .cm__input_reserve .cm__p2 {
        font-size: 5.5vw !important;
    }
    .top_img_box.cw h2 p {
        font-size: 15px;
    }
    .last_item_area .block.array .modal__content .cm__input_reserve p:nth-child(2), section.block.array .modal__content .cm__input_reserve p:nth-child(2) {
        font-size: 5.5vw;
    }
    .s4_cw h3 {
        font-size: 7vw;
    }
    .cm__johnson_box .customer_support_house .div:nth-child(1) p {
        font-size: 1.15rem;
    }
    .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner .accordionTop_switch_item2000.accordion_switch.right.mb-0.small1.d-block.d-lg-none {
        font-size: 0.975em;
    }
    .cm__johnson_box.site_s4 .cm__jb_site994_div p{
        font-size: 10px;
    }
    .cm__site_link_li.cm__site_link_item.list_items785,
    .cm__site_link_li.cm__site_link_item.list_items1125 {
        font-size: 15px;
    }
        .top.item_guide_area .icon_block{
        font-size: 16px;
    }
    .cm__jb_site994_h2 {
        font-size: 18px;
    }
    .spot_attention p,
    .first_view .spot_attention .bold p .hk_cc {
        font-size: 12px;
    }
/* 【 ［SP］/ font-weight 】 **************/
/* 【 ［SP］/ height 】高さ ***************/
    .product_of_individual .content_segment.hukuyama_style,
    .select_cold_air.item_guide_area .spot.sentence .w_0626 {
        height: auto;
    }
    .media_area .media_item.thumbnail {
        height: 90px;
    }

/* 【 ［SP］/ justify-content 】 **********/
    .post_list .list,
    .item_guide_area .try_pic li{
        justify-content: space-between;
    }
    .item_guide_area .mein_item_region .detail .cluster:nth-child(2) .parts:nth-child(2){
        justify-content: center;
    }
    .cs_support_s.od_response_device .goto_form,
    .cs_support_s.od_response_device .goto_form a,
    .img_0630 {
        height: auto;
    }
    .item_guide_area .od_func_region .additional_sentence.item970{
        height: 0px;
    }
    .option_zone .optz.parts .optz_rental,
    .option_zone .optz.parts .optz_sell {
        height: 20px;
    }
    .cm__anchor_banners .cm__p1 {
        line-height: 110%;
    }/* 【 ［SP］/ left 】 ********************//* 【 ［SP］/ margin 】 ******************/
    .cs_support_s.od_response_device .cs_tel,
    .product_of_individual .intro_item.zone .segment:nth-child(2) .content_block h3,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items328,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items924,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items925,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items962,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items791,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items926,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items975,
    .cm__site_link_area .cm__site_map1 .cm__site_link_li.cm__site_link_item.list_items933,
    .product_of_individual.item970 .features_item .peculiarity{
        margin: 0em 0em 0em 0em;
    }
    .item_guide_area .banner_category li {
        margin: 0px 0px 10px 0px;
    }
    .item_guide_area .mein_guide_phrase {
        margin: 0px 8px 0px 8px;
    }
    .cm__cw,
    .cw,
    .voltage_200v_style .spot:nth-child(1) .detail:nth-child(2) {
        margin: 0em auto 0em auto;
    }
    .item_guide_area .od_mein_item_state,
    .product_of_individual .content_segment.hukuyama_style {
        margin: 0 auto 1em auto;
    }
    .last_banners_zone .li.banners {
        margin: 0em 0em 2em 0em;
    }
    .s4_cw .block {
        margin: 0em auto 0em auto;
    }
    .cm__cw .block.features_item.m_0522 {
    margin: 0px auto -5px auto;
    }   
    .od_func_filter_box .od_block:nth-child(1),
    .product_of_individual.item970 .features_item .peculiarity .segment{
        margin: 0em 0em 2em 0em;
    }
    .spot.border-primary.box-shadow-none.m_0525{
        margin: 70px 0 70px 0;
    }

    .cs_support_s.od_response_device.sagawa .goto_form.y_form div {
        margin: 5px 0;
    }
    .top.item_guide_area .icon_block .d2,
    .itm.item_guide_area .icon_block .d2{
        margin: auto;
    }
    .product_of_individual .zone.peculiarity.d-md-grid.four-one.m_0525_02{
    margin:100px 0 100px 0;
    }

    .top.item_guide_area .icon_block,
    .itm.item_guide_area .icon_block,
    .red_box .block .cinc__p1
    {
        margin-top: 15px;
    }

    .cluster .parts .spot:nth-child(1) .cm__price_area{
        margin-top: 21px;
    }

    .parts.speaking_staff_line.lx .box img,
    .select_cold_air.mt_0 #speaking_staff01 p:nth-child(1) {
        margin-top: 0;
    }
    .product_of_individual .p_item.zone.m_0525,
    .product_of_individual .appeal.zone.m_0525{
        margin-top: 40px;
    }
    .product_of_individual .zone.peculiarity.d-md-grid.four-one.m_0525{
        margin-top: 100px;
    }

    .range.features_waste_heat .parts img ,.range.features_tornado .parts img ,.range.features_eyebolt .parts img
    ,.segment.features_stop .range img ,.segment.features_others .range img {
        margin: 60px 0 0px 0;
    }

/* 【 ［SP］/ max-height 】 **************/
/* 【 ［SP］/ max-width 】 ***************/
/* 【 ［SP］/ opacity 】 *****************/
/* 【 ［SP］/ overflow 】 ****************/
/* 【 ［SP］/ padding 】 *****************/
    .cm__hukuyama_tel_sentence .cm__cw,
    .cs_support_s.od_response_device.sagawa .goto_form.y_form div {
        padding: 0em 0em 0em 0em;
    }
    .subject.mein_guide_img.mac_200v_area.mobile_air_conditioner .acPerformanceContents {
        padding: 0px 10px 0px 10px;
    }
    .s4_cw .block,
    .select_blower.item_guide_area .spot.sentence .box div:nth-child(1),
    .select_spot.item_guide_area .spot.sentence .box div:nth-child(1) {
        padding: 0em 0em 0em 0em;
    }
    .item_guide_area .cold_air_conditioner .mein_guide_phrase,
    .item_guide_area .blower .mein_guide_phrase {
        padding: 30px 0px 0px 0px;
    }
    .spot_img img,
    .spot.sentence .box div:nth-child(1).pd0_0630 {
        padding: 0;
    }
    .spot_attention p {
        padding: 10px;
    }
    .rental_30seconds{
        padding-bottom: 25px;
    }
/* 【 ［SP］/ text-indent 】 *************/
/* 【 ［SP］/ top 】 *********************/
/* 【 ［SP］/ vertical-align 】 **********/
/* 【 ［SP］/ width 】横幅 ***************/
    .cs_support_s.od_response_device .goto_form {
        width: auto;
    }
    .spot.sentence .box div:nth-child(1) {
        width: 55%;
        padding: 0 80px;
    }
    .spot.sentence .float_layout{
        margin-right: 10px;
        width: 100%;
    }
    .option_zone .optz.parts .optz_sell {
        width: 10%;
    }
    .product_of_individual.item970 .zone.peculiarity .features_cold .range:nth-child(2) .parts:nth-child(1) div:nth-child(1),
    .product_of_individual.item970 .zone.peculiarity .features_far_space .range:nth-child(2) .parts:nth-child(1) div:nth-child(1){
        width: 45%;
    }
    .select_spot.item_guide_area .box.w_100 .cm__into_img {
        width: 50%;
    }
    .voltage_200v_style .spot:nth-child(1) .detail:nth-child(2) {
        width: 53%;
    }
    .option_zone .optz.parts h4 {
        width: 78%;
    }
    .cw,
    .cm__cw,
    .cm__attention_cw,
    .cm__banners_img img,
    .cm__product_page_cw,
    .item_guide_area .od_mein_item_state,

    .red_box.cw {
        width: 95%;
    }
    .cm__johnson_box .card p:last-child img{
        width: 95%;
    }
    .s4_cw .block {
        width: 98%;
    }
    .howtouse img,
    .s4_cw,
    .cm__anchor_banners,
    .cm__johnson_box.site_s4 .cm__jb_site994_div,
    .item_guide_area .try_pic li,
    .post_list .latest-box a,
    .last_item_area .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1),
    .product_of_individual .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1),
    .last_item_area .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2),
    .product_of_individual .option_zone.duct.designated_ver .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2),
    .item_guide_area .mein_item_region,
    .item_guide_area .mein_item_region .detail .cluster:nth-child(1),
    .item_guide_area .mein_item_region .detail .cluster:nth-child(2),
    .item_guide_area .banner_category li,
    .itm.item_guide_area .icon_block img,
    .last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot,
    .last_item_area .option_zone.duct .segmnent:nth-child(2) .spot,
    .last_item_area .option_zone.duct .segmnent:nth-child(3) .spot,
    .last_item_area .option_zone.deodorize .segmnent:nth-child(2) .spot,
    .last_item_area .option_zone.drain_hose .segmnent:nth-child(2) .spot,
    .od_func_filter_box .od_block:nth-child(1),.od_func_filter_box .od_block:nth-child(2),
    .product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot,
    .product_of_individual .option_zone.duct .segmnent:nth-child(2) .spot,
    .product_of_individual .option_zone.duct .segmnent:nth-child(3) .spot,
    .product_of_individual .option_zone.drain_hose .segmnent:nth-child(2) .spot,
    .product_of_individual.item970 .features_item .peculiarity .segment,
    .product_of_individual .option_zone .segmnent .spot.item784,
    .content_segment img,
    .spot_use.zone .cm__into_img_sp,
    .voltage_200v_style .spot:nth-child(1) .detail:nth-child(1),   
    .select_cold_air.item_guide_area .spot.sentence .w_0626,
    .select_spot.item_guide_area .spot.sentence .box div:nth-child(1) {
        width: 100%;
    }
    .customer_voice_area .scroll_box .scope {
        width: 90%;
    }
    .item_guide_area .try_pic li div:nth-child(1) {
        width: calc(35% - 0.5em);
    }
    .item_guide_area .try_pic li div:nth-child(2) {
        width: calc(65% - 0.5em);
    }

    .top.item_guide_area .icon_block .d2,
    .itm.item_guide_area .icon_block .d2{
        width: 65%;
    }
    
/* 【 ［SP］other or special CSS 】 ******/
	.side_scroll_area,.sp_side_scroll_area {
		position: relative;
	}
    .item_guide_area .mein_item_region .detail .cluster:nth-child(2) .parts:nth-child(2) .spot:nth-child(2) {
        border-left-color: #595959;
        border-left-style: solid;
        border-left-width: 1px;
        padding: 0 0 0 5px;
        margin: 0 0 0 5px;
    }
    .item_guide_area .mein_item_region .detail .cluster:nth-child(2) .parts:nth-child(2) p {
        letter-spacing: -0.15px;
    }

/*************** レスポンシブ E ******************************/

/* ==================== [他商品] 除湿機ほか他商品/他カテゴリ固有 ==================== */
    /*************** 除湿機追加用レスポンシブ　***********************************/

    .appeal_area .block:nth-child(2) ul ul,
    .segment .segment.current3phase200v .scope,
    .segment.no0.maintenance_flow .scope,
    .cm__cw .corona_product.block .zone_1 .segment:nth-child(1),
    .segment .scope:nth-child(2) .div_1{
        display: block;
    }
    h4{
        margin: 1em;
    }
    h2 {
        margin-top: 2em;
    }
    h3 {
        margin: 20px 0px 20px 0px;
        font-size: 4.5vw;
    }

    .popular_reason_area .cm__cw {
        padding: 0;
    }
    .maintenance_flow .scope {
        width: auto;
    }
};

.range {
    margin-bottom: 10px;
}

.sentence {
    margin-top: 30px;
}

@media screen and (min-width: 641px) {
    .sp,
    .select_spot.item_guide_area .sp,
   .select_spot.item_guide_area .spot.sentence.sp
     {
        display: none;
    }
}

@media screen and (max-width: 640px) {
    .pc,
         {
        display: none;
    }
}

/* ==================== [トップ] index.html トップページ専用（料金表カット/バナー/割引誘導） ==================== */
/* 20250714大浦さん打ち合わせ TOPページ料金表カット　ボタン追加*/

    .ooura250714 .cm__anchor_banners{
        height: auto;
    }

    .ooura250714 .cm__banners_names{
        width: 87%;
    }

    .ooura250714 .button_flex{
        display: flex;
        max-height: 52px;
    }

    .ooura250714 .button_flex p{
        margin: 0;
        padding: 0.5em 0 0.5em 0;
        font-weight: bold;
    }
    
    .ooura250714 .button_design{
        display: flex;
        width: 40%;
        border-radius: 20px;
        text-align: center;
        font-size: 24px;
        margin: 10px auto 0;
        box-shadow: 4px 5px 12px -6px #000;
        max-height: 45px;
    }

    .ooura250714 .button_design a:hover{
        opacity: 0.5;
    }

    .ooura250714 .goto_itempage{
        background-color: #fff;
        border: solid #494824 3px;
        margin-right: 10px;
        margin-top: 0;
    }

    .ooura250714 .goto_itempage .flex_layout p{
        color: #494824;
    }
    /* 商品詳細/料金表 ボタン内テキストの padding 調整 */
    .ooura250714 .goto_itempage .flex_layout p,
    .ooura250714 .goto_rentalprice .flex_layout p{
        padding: 0.5em 0 0.5em 0;
    }

    .ooura250714 .goto_itempage .flex_layout .input_reserve,
    .ooura250714 .goto_rentalprice .flex_layout .input_reserve{
        width: 170%;
    }

    .ooura250714 .goto_rentalprice{
        background-color: #494824;
        border: solid #494824 3px;
        margin-left: 10px;
        margin-top: 0;
    }
    
    .ooura250714 .goto_itempage a,
    .ooura250714 .goto_rentalprice a{
        color: #fff;
        text-decoration: none;
        height: auto;
        width: 100%;
        display: flex;
        justify-content: center;
        flex-direction: column;
    }

    .ooura250714 .button_design{
        overflow: initial;
    }
    /* 商品詳細/料金表ボタン内側も clip 解除（common の div{overflow:hidden} で
       flex_layout/input_reserve が45pxに潰れ、右矢印が下にズレるため。参照の描画に一致） */
    .ooura250714 .button_design .flex_layout,
    .ooura250714 .button_design .input_reserve,
    .ooura250714 .button_design .link_img{
        overflow: visible;
    }

    .ooura250714 .link_img{
        padding-right: 5px;
        margin-left: 5px;
        width: 25%;
        position: relative;
        right: 15px;
    }

    .ooura250714 .link_img img{
        width:100%;
    }
    @media screen and (max-width: 640px){
        .ooura250714 .cm__anchor_banners{
            max-height: 115px;
        }
        .ooura250714 .button_design{
            height: 40px;
        }
        .ooura250714 .button_design .flex_layout{
            width: 100%;
        }
        .ooura250714 .goto_itempage .flex_layout p,
        .ooura250714 .goto_rentalprice .flex_layout p{
            font-size: 17px;
            font-weight: bold;
            padding: 14px 0 14px 6px;
        }
        .ooura250714 .goto_itempage .flex_layout .padding_top_sp,
        .ooura250714 .goto_rentalprice .flex_layout .padding_top_sp{
            padding-top: 16px;
        }
    }
.voltage_200v_style .spot:nth-child(1) {
        display: flex;
        justify-content: space-between;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) {
        width: 83%;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) h4 {
        font-size: 1.3em;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(1) p:nth-child(3) {
        color: red;
    }
.voltage_200v_style .spot:nth-child(1) .detail:nth-child(2) {
    width: 15%;
    }

 .louver .louver_flex .right{
    width: 25%;
    position: relative;
    left: -2em;
 }

 .louver .louver_flex .right img{
    width: 72%;
 }

 @media screen and (max-width: 640px){
    .louver .louver_flex .right{
        left: -1em;
    }
 }

/* ※を移動 */

.kome_relative{
    position: relative;
    right: 3em;
}

@media screen and (max-width: 640px){
    .kome_relative{
    position: relative;
    right: 2em;
    bottom: 0.5em;
    }
}

.kome_relative2{
    position: relative;
    right: 2em;
    bottom: 0.5em;
    font-size: 10px;
    vertical-align: text-top;
}

@media screen and (max-width: 640px){
    .kome_relative2{
    position: relative;
    right: 2em;
    bottom: 0.5em;
    }
}

.smile_left{
    left: 4em;
}

@media screen and (max-width: 640px){
    .smile_left{
    left: 0;
    }
}

/* おまとめ割引のご案内（large_order.html 専用。2026-07-20 に本番 index.css から欠落分を復元）
   ※ .omatome / .zaiko / .lastp は .large_order スコープが無いが、これらのクラスを使うのは
     large_order.html のみ（全*.htmlをgrepして確認済み）なので他ページへの影響はない。 */
.large_order .sp{
    display: none;
}
@media screen and (max-width: 640px){
    .large_order .sp{
        display: block;
    }
}

.large_order .font_bold{
    font-weight: bold;
}
.large_order .font_normal{
    font-weight: normal;
    font-size: 18px;
}
.large_order .for_cus{
    font-size: 25px;
}
.large_order .fs22{
    font-size: 22px;
}
@media screen and (max-width: 640px){
    .large_order .for_cus{
        font-size: 18px;
    }
    .omatome{
        font-size: 25px;
    }
    .large_order .fs22{
        font-size: 20px;
    }
    .large_order .font_normal{
        font-size: 16px;
    }
}
.large_order .over20{
    color: red;
}
.large_order .border{
    border: solid 4px #494824;
    padding: 1rem;
}
@media screen and (max-width: 640px){
    .large_order .border{
        padding: 1rem;
    }
}
.large_order .pad0{
    padding-left: 0;
}
.large_order .pad15{
    padding-left: 15px;
}
.large_order .pad30{
    padding-left: 30px;
}
@media screen and (max-width: 640px){
    .lastp{
        margin-bottom: 0;
    }
    .large_order .pad15,
    .large_order .pad30{
        padding-left: 0;
    }
}
.zaiko{
    text-align: center;
    font-size: 25px;
    font-weight: bold;
}
.large_order .right{
    text-align: right;
}
.large_order .mb0{
    margin-bottom: 0;
}
.large_order .mb1{
    margin-bottom: 1rem;
}
.large_order .mb2{
    margin-bottom: 2rem;
}
.large_order .cm__cw .block{
    padding-bottom: 50px;
    border-bottom: solid 1px #595959;
}

/* トップページ　大口割引誘導リンク */

.large_order_link .font_weight_500{
    width: 95%;
    margin: 0 auto;
}
@media screen and (max-width: 640px){
    .large_order_link .font_weight_500,
    .img_0630{
        width: 100%;
    }
    .subpage.cinc__estimate .segment.cm__jb_cs_ph .parts{
    margin: 0 auto;
    }
}

/* トップページ　エアコン故障*/

@media screen and (min-width: 640px){
.spot_attention.break{
  pointer-events: none; /* クリックを無効化 */
}
}

/* ==================== [トップ] index.html トップページ専用（トップエリア補完） ==================== */
/* ==================================================================
   index.HTML 追記: トップエリアを参照レイアウトに合わせる補完CSS
   背景: 現HTMLはトップ要素が first_view の外の兄弟で、reference の
        .first_view .○○ / 入れ子前提ルールが効かない。各要素を自クラスで直接指定して補完。
   参照: https://www.mogiten-rentaru.com/spotcooler/  (PC + SP)
   ================================================================== */

/* ---- 即日出荷OKバナー / CSスタッフ枠（first_view依存の高さ・余白を補完）---- */
.cm__fv_staff.cm__cw { width: 100%; margin: 0 auto 40px auto; }
.event.pc { height: 185px; }

/* ---- 20台以上のご案内ボックス（黄色地・オレンジ枠・赤見出し）---- */
.spot_attention.large_order_link {
    max-width: 1100px; margin: 24px auto; padding: 25px 10px;
    background-color: #fffde7; border: 3px solid #f5a623; border-radius: 14px;
    box-sizing: border-box;
}
.spot_attention.large_order_link p { margin: 0; color: #333333; }
.spot_attention.large_order_link .font { color: #333333; font-weight: bold; font-size: larger; }
.spot_attention.large_order_link .red.bold { color: #FF0000; font-weight: bold; }
.spot_attention.large_order_link a { color: #31320E; text-decoration: underline; }

/* ---- 商品ずらり写真（参照どおり 幅1100px・左右余白0。first_viewの padding:0 相当を補完）---- */
.top_img_box.cw { max-width: 1100px; margin: 0 auto; padding: 0; text-align: center; }
.top_img_box.cw .align_area .align_img { display: block; width: 100%; height: auto; margin: 0 auto; }

/* ---- migiyori（4,367台以上）---- */
.migiyori.font_weight_500 {
    display: block; text-align: center; max-width: 1120px; margin: 20px auto 0;
    font-size: 24px; line-height: 1.5; color: #333333; font-weight: 500;
}
.migiyori.font_weight_500 .fb_0624 { color: #FF0000; font-weight: bold; font-size: 30px; }
.migiyori.font_weight_500 .fs_0624 { color: #000000; font-size: 18px; font-weight: normal; }
/* 【追加】ラフの「木臼より軽くて〜」ブロック用。
   ※印は本文よりかなり小さく、送料の注記は右下に小さく添える指定。
   ※の縦位置はラフに合わせてベースライン揃え（上付きにしない） */
.migiyori.font_weight_500 .hk_cc { font-size: 12px; vertical-align: baseline; }

/* 【修正】注記の米印（.hk_cc）が本文と同じ大きさで表示されていた箇所。
   相談窓口ブロックの「全国往復送料￥0※」は 23px、ファーストビューは 26px と、
   本文と同サイズのため注記マークに見えず目立ちすぎていた。
   同じ文言でも .p.font32 側や .red 側は 10px/text-top で表示されており、
   そちらがサイトの既定。同じ値に揃える */
.cm__responsive_device .r_p .hk_cc,
.mochi_fv_copy .hk_cc {
  font-size: 10px;
  vertical-align: text-top;
}
/* 【変更】ラフでは注記の右端が「！！！」の右端に揃っている。
   .migiyori_line2 を inline-block にすると箱の幅がその行の幅ちょうどになるため、
   中で右寄せするだけで画面幅が変わっても常に揃う
   （section 直下で text-align:right にすると画面の右端まで離れてしまっていた） */
.migiyori.font_weight_500 .migiyori_line2 {
  display: inline-block;
  max-width: 100%;
  /* 【修正】このセクションには「.migiyori span { color: red }」という広い指定があり、
     右端を揃えるために足したこの入れ物の span まで赤くなってしまうので本文色に戻す。
     中の <span class="red"> は個別指定なので赤のまま残る */
  color: inherit;
}
.migiyori.font_weight_500 .migiyori_hk {
  display: block;
  margin: 4px 0 0;
  font-size: 11px;
  font-weight: normal;
  text-align: right;
  color: inherit;
}

/* 【変更】ファーストビュー直下「15時までのご注文で即日出荷OK」の上余白。
   共通ルール（.event.pc .conditions）の 25px は他ブロックでも使うため、
   ここだけ 8px に詰める */
.cm__fv_staff .event.pc .conditions {
  margin-top: 8px;
}
/* 白いボックスの下に残る木目の帯も詰める。
   .event.pc は height:185px の固定高さで、上を詰めた分そのまま下に木目が余ってしまうため、
   高さを内容なりにして padding-bottom で下の余白を作り直す */
.cm__fv_staff .event.pc {
  height: auto;
  padding-bottom: 12px;
}
.cm__fv_staff .event.pc .comment {
  margin-bottom: 0;
}
/* 次のセクション（おかげさまでレンタル実績）との間隔も詰める。
   隣り合うマージンは大きいほうが採用される（相殺）ので、両方下げないと効かない */
.cm__fv_staff.cm__cw {
  margin-bottom: 20px;
}
/* ---- おかげさまでレンタル実績 210,632件以上 ---- */
/* 【変更】ファーストビュー直下の余白を詰めた分、こちらの上余白も同じだけ詰める（40px→20px） */
.cm__rental_achievement { text-align: center; max-width: 1120px; margin: 20px auto 8px; }
.cm__rental_achievement h2 { text-align: center; margin: 0 0 18px; line-height: 1.3; }
.cm__rental_achievement h2 .font_weight_500 { color: #31320E; font-size: 40px; font-weight: bold; }
.cm__rental_achievement h2 .red { color: #FF0000; }
/* 【変更】赤をラフのカラーコード（#FF0000）に統一。
   共通CSSに .tel_box a:link { color:#f30000 } が残っており、
   スマホの電話番号だけ少しくすんだ赤（#F30000）になっていた */
.tel_box a:link,
.tel_box a:visited,
.tel_box a:hover,
.tel_box a:active {
  color: #FF0000;
}
.cm__rental_achievement h2 .span1 { color: #FF0000; font-size: 65px; }
.cm__rental_achievement .center.bold { text-align: center; color: #333333; font-size: 25px; line-height: 35px; font-weight: bold; }

/* ---- CSスタッフ画像＋キャプション ---- */
.cm__customer_support .cm__jb_cs img { max-width: 100%; height: auto; }
.cm__customer_support > .font_weight_500 { text-align: right; font-size: 18px; font-weight: 500; color: #333333; margin: 0px 0 40px 0; }

/* ---- 30秒でわかるレンタル（5ステップ横並び。番号は画像item_XXs.webpに焼き込み済のためCSSでは付けない）---- */
/* 【変更】ラフ指示「h2色、サイト名と同じ茶色に #31320E」。ここだけ個別指定で
   #494824（塗り用の茶）が残っていた */
.rental_30seconds h2 { font-size: 48px; font-weight: bold; color: #31320E; text-align: center; }
.rental_30seconds .center { text-align: center; color: #333333; font-size: 16px; line-height: 28px; }
.rental_30seconds .top_kashituki_rental_img {
    display: flex; justify-content: center; flex-wrap: wrap;
    max-width: 1120px; margin: 22px auto 0;
}
.rental_30seconds .top_kashituki_rental_img .box {
    width: 184px; margin: 5px; box-sizing: border-box; text-align: center;
}
.rental_30seconds .top_kashituki_rental_img .box .zone img { display: block; width: 100%; height: auto; }
.rental_30seconds .top_kashituki_rental_img .box .zone p { margin: 6px 0; padding: 0 6px; text-align: left; color: #333333; font-size: 15px; line-height: 1.6; }

/* johnson_box の「※１早期返却…こちら」注意書きを参照どおり 1em 下げる
   （HTMLインラインの取り残し分をCSSで確実に補完。johnson_box内のr_d_block_hkはこの注意書きのみ）*/
.cm__johnson_box .r_d_block_hk { position: relative; top: 1em; }
/* SP: 早期返却注記(r_d_block_hk.early_items)が上の top:1em で下にずれ、親の .segment(overflow:hidden)で
   下端が数px見切れる(items.html等)。本番は @media640{.early_items{top:0}} で解消しているが、その打ち消し
   ルールがローカルではpurgeで消えていたため、同等詳細度(.cm__johnson_box .early_items)で復元。static な
   他の r_d_block_hk(北海道注記等)には top:0 は無効なので影響しない。 */
@media screen and (max-width: 640px) {
  .cm__johnson_box .early_items { top: 0; }
}

/* 大見出し(font48グループ)の上余白を参照どおりに統一（余分な margin-top を消し padding-top:10px）
   対象: お客様の喜びの声 / 大人気の理由 / メディア掲載 / 配送 / イベント確実 / 保証体制 / 破損・中止
   ※ rental_30seconds は参照が padding-top 0 のため対象外 */
.customer_voice_area.item h2,
.popular_reason_area h2,
.top_p.media_area h2,
.before_delivery.delivery_paragraph.p_top h2,
.guarantee_area h2,
.top.last_item_area h2 {
    margin-top: 0;
    padding-top: 10px;
    margin-bottom: 50px;
}
/* transport(sagawa等) h2 は本番どおり一般h2(pt0/mb30)。上のpt10/mb50グループから除外し余白を本番一致に。 */
/* .cm__jb_greeting h2（会社挨拶「笑顔をつなぐ」）は本番では一般 h2(mb30/pt0)。
   上のpt10/mb50グループから外し、本番一致に。商品ページは別途 .product_of_individual ~ で pt0/mb30 済。 */

/* last_item_area: メリット説明文(適用になります)と商品リストの間の余白を参照どおり(46→30px)に。
   現行は div/zone の overflow:hidden(common由来)で p の margin(16px)が閉じ込められ余分。
   参照は overflow:visible で margin が抜けるので、同様に visible にして相殺させる。 */
.top.last_item_area .block > .zone,
.top.last_item_area .block > .zone > div { overflow: visible; }

/* 【商品ページ】.cm__product_item_area の枠線（common で4辺1px solid #595959）を全消し */
.cm__product_item_area { border: none; }

/* 【商品ページ】商品仕様の箇条書き(intro_ul_list.parts)の行間を参照どおり詰める。
   参照は ul に .exp_line が付き .intro_ul_list.parts.exp_line{line-height:1} が効くが、
   実ファイルの ul は .exp_line 無し（HTML変更は環境に反映されないためCSSで補完）。 */
.product_of_individual .segment_item.productspec_header .intro_ul_list.parts { line-height: 1; }

/* 【商品ページ】intro/概要ブロックの下余白と、intro説明文の行間（整理で消えた分の復活）。 */
.content_block { margin-bottom: 30px; }
.product_of_individual .segment2 p { line-height: 32px; }

/* 【商品ページ】商品仕様(productspec_header)の下余白（整理で消えたルールの復活。参照は全幅で40px） */
.product_of_individual .segment_item.productspec_header { margin-bottom: 40px; }

/* 【商品ページ】整理で消えたPC用レイアウト幅の復活。
   ※SP用(max-width:640)の width:100% ルールより後ろに置くと、ベース指定だとSPを上書きして崩すため、
     必ずPC限定メディア(min-width:641)で包む。 */
@media screen and (min-width: 641px) {
    /* intro_item の左カラム(segment1)を72%固定。画像枠(segment3)が縮まず自然サイズ(300px)を確保し、
       「＜単相100V＞…の紹介・仕様」見出しの折り返し位置が参照と一致する。 */
    .product_of_individual .segment1 { width: 72%; }

    /* 商品仕様(productspec_header)のカラム幅。左画像70%、右リストに margin-left:4%。 */
    .product_of_individual .segment_item.productspec_header div:nth-child(1) { width: 70%; }
    .product_of_individual .segment_item.productspec_header div:nth-child(2) { margin-left: 4%; }

    /* item970(ひんやり君)のみ: 商品仕様の6番目の長い箇条書きが右カラムのmax-contentを広げ、
       画像カラムを余計に縮める(415px)。参照(5項目)と同じ画像サイズ(約512px)に固定して合わせる。 */
    .cm__product_item_area.item970 .p_item.zone .segment_item.productspec_header div:nth-child(1) {
        width: 46.5%;
        flex-shrink: 0;
    }
}

/* ================= SP（〜640px）================= */
@media screen and (max-width: 640px) {
    .cm__fv_staff.cm__cw { margin: 0 auto 30px auto; }
    .spot_attention.large_order_link { padding: 10px; margin: 13px 9.375px 10px; }
    .migiyori.font_weight_500 { font-size: 15px; line-height: 22px; margin: 10px 9.375px 0; }
    .migiyori.font_weight_500 .fb_0624 { font-size: 30px; }
    .cm__rental_achievement h2 .span1 { font-size: 44px; }
    .cm__rental_achievement h2 .font_weight_500 { font-size: 21px; }
    .cm__rental_achievement .center.bold { font-size: 15px; line-height: 20px; }
    .cm__customer_support > .font_weight_500 { text-align: right; }
    .rental_30seconds h2 { font-size: 24px; }
    .popular_reason_area h2 { font-size: 25px; }
    .popular_reason_area .cm__cw { padding: 35px 0px; }
    .top_p.media_area h2 { font-size: 24px; }
    .guarantee_area h2 { font-size: 24px; }
    .id_required_space.block h4 { font-size: 30px; line-height: 34.5px; margin: 0; }
    .rental_30seconds .center { font-size: 14px; text-align: left; line-height: 22px; }
    .rental_30seconds .top_kashituki_rental_img .box .zone p { font-size: 14px; line-height: 21.6px; font-weight: 500; padding: 5px 5px 0; }
    .rental_30seconds .top_kashituki_rental_img {
        flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto;
        margin: 16px auto 0; padding-bottom: 10px; -webkit-overflow-scrolling: touch;
    }
    .rental_30seconds .top_kashituki_rental_img .box { width: 150px; flex: 0 0 auto; }
}
/* ---- 相談窓口の注意書き「※１早期返却…こちら」の見切れ＆右寄せ（実測で確定）----
   参照CSSの .smile_left{left:4em}(7789行) は、右揃えの注意書きを列右端(=約1103px)から
   さらに右へ約72px(4em)ナッジして「白box寄り(≒コンテンツ幅1100pxの右端)」に置く意図。
   だが親 .cm__rd_other が div の overflow:hidden を持つため、右へはみ出した「こちら」が横に、
   インライン top:1em 分が下に、それぞれクリップされて見切れていた。
   対策: 親のクリップ(overflow)だけ解除。これで参照どおり right≒1175px に右寄せされ、
        右も下も切れない（次セクションとの重なりも無し・!important不使用）。
        注意書きのインライン(position:relative/top/left:4em)は一切触らない。 */
.cm__responsive_device .cm__rd_other.r_d_block { overflow: visible; }

/* ===== ここまで トップエリア補完CSS ===== */

/* ==================== [混在] 末尾ブロック: [共通]背景上書き → [トップ]recommend_flex/身分証SP → [spotcooler/商品]各種調整。個々の区分は各ルールの 【トップページ】/【商品ページ】/【SP】 タグを参照 ==================== */
/* 背景画像の上書き (common_style.css の ::before を index 側で差し替え) */
.cm__responsive_device .cm__rd_front.r_d_block p::before {
    background-image: url(../img/rogo.webp);
}
.media_item.thumbnail .modal_image_box::before {
    background-image: url(../img/magnifying_glass.webp);
}
.cm__connecting_smiles h2::before {
    background-image: url(../img/rogo.webp);
}

@media screen and (max-width: 640px) {
    .site_map_main.accbox label::after,
    .accbox.end_footer label::after,
    .cm__site_map_main.cm__accbox label::after,
    .cm__site_map_main.cm__sub_accbox label::after {
        content: url(../img/content_bottom_arrow.webp);
    }
}


/* ============================================================
   【トップページ】弊社への送り方(recommend_flex)の画像＋テキスト横並び。
   発電機ページ(style.css)の該当ルールを移植。整理でトップのindex.cssに無かった分。
   PC=flex(画像左/テキスト右)、SP(〜640px)=縦積み＋アコーディオン折りたたみ。
   ============================================================ */
.recommend_flex { display: flex; justify-content: space-between; }
.accbox .acPerformanceContents .img0123 img { width: 100%; }
.accbox .text0123 { width: 100%; }
.p_top .recommend_flex img { width: 280px; }
/* 箇条書き2項目の行間（参照は .p の margin-bottom:13px 由来）。テキストが詰まって
   画像より短くならないよう、この部分の p に下余白を付ける。 */
.id_required_space .acPerformanceContents.recommend_flex .text0123 .p { margin-bottom: 13px; }
/* 画像を参照(hatudenki)と同じ 266×170 で確実に表示（intrinsic 350×224 → width:266pxで高さ約170）。
   flexで縮んでブレないよう画像枠を固定。 */
.id_required_space .acPerformanceContents.recommend_flex .img0123 { flex-shrink: 0; }
.id_required_space .acPerformanceContents.recommend_flex .img0123 img { width: 266px; height: auto; }

@media screen and (max-width: 640px) {
    .recommend_flex { display: block; }
    .accbox .acPerformanceContents.dp_none.recommend_flex { display: none; }

    /* 【SP】身分証セクションのイントロ(zone2)：画像とテキストを横並び→縦積みに。
       画像枠(segment1)は50%幅で中央、テキスト(segment2)は全幅（参照 style.css と同じ）。 */
    .id_required_space.block .zone:nth-child(2) { display: block; }
    .id_required_space.block .zone:nth-child(2) .segment:nth-child(1) { width: 50%; margin: 0px auto; }
    .id_required_space.block .zone:nth-child(2) .segment:nth-child(2) { width: 100%; }

    /* 【SP・商品ページ】商品枠の外側パディングを0にして、.cm__cw を画面幅95%(≈356px)に。
       整理で消えていた本番のSP用ルール。これが無いと item_area の padding:1rem が残り cm__cw が326pxに縮む。 */
    .product_of_individual .cm__product_item_area { width: 100%; padding: 0; }

    /* 【SP】商品概要(content_block.sentence)はSPでは下余白0（本番と同じ。base の .content_block{mb:30}をSPで打ち消す） */
    .content_block.sentence { margin-bottom: 0; }
}


/* ============================================================
   【商品ページ】料金セクション(section.block.array)の復元。
   テンプレでは本番の last_item_area>cm__cw から price ブロックを
   独立 section.block.array に出したため、(1)cm__cw が無く全幅化、
   (2).last_item_area スコープの価格レイアウトflexが効かず縦積みに。
   → 幅を1100中央に制約し、価格レイアウト系ルールを .block.array にも適用。 */
.last_item_area .block.array, section.block.array { max-width: 1100px; margin-left: auto; margin-right: auto; }
.last_item_area .block.array .cm__d_r_2, section.block.array .cm__d_r_2 { display: flex; }
.last_item_area .block.array .cm__item_amount_area .cm__d_l, section.block.array .cm__item_amount_area .cm__d_l { width: 58%; }
.last_item_area .block.array .cm__item_amount_area .cm__d_r, section.block.array .cm__item_amount_area .cm__d_r { width: 100%; }
.last_item_area .block.array .cm__item_amount_area .cm__d_r .od_merit_zone, section.block.array .cm__item_amount_area .cm__d_r .od_merit_zone { width: 46%; }
.last_item_area .block.array .cm__item_amount_area .item_individual_link, section.block.array .cm__item_amount_area .item_individual_link { text-align: left; }
.last_item_area .block.array .price-box_amount, section.block.array .price-box_amount { width: 50%; padding: 5px; text-align: left; color: red; }
.last_item_area .block.array .price-box_content, section.block.array .price-box_content { display: flex; justify-content: space-between; border-bottom: gray; border-bottom-style: solid; border-bottom-width: 1px; }
.last_item_area .block.array .price-box_duration, section.block.array .price-box_duration { width: 50%; padding: 5px; text-align: left; }
.last_item_area .block.array .price-box_title, section.block.array .price-box_title { background-color: #666; color: #fff; margin: 0; padding: 5px 0px; }
/* トップページ下部料金表のCSS */ .block.array .price-box { width: 330px; border: 1px solid #ccc; font-family: 'Noto Sans JP'; text-align: center; margin: 0; padding: 0; }

@media screen and (max-width: 640px) {
    .last_item_area .block.array, section.block.array { max-width: 95%; }
    /* ただし .cm__cw の中に入っている block.array(campaign.html)は、親の .cm__cw が既に
       幅を制約しているため 95% が二重にかかり左右に約9.3pxずつ余分な余白が出る。
       main直下の section.block.array(商品ページ)は .cm__cw が無く 95% が必要なので、
       .cm__cw 配下の場合だけ 100% に戻す。 */
    .cm__cw .block.array { max-width: 100%; }
    .last_item_area .block.array .cm__d_r_2, section.block.array .cm__d_r_2 { display: block; }
    .last_item_area .block.array .cm__item_amount_area .cm__d_l, section.block.array .cm__item_amount_area .cm__d_l { width: 100%; }
    .last_item_area .block.array .cm__item_amount_area .cm__d_r .od_merit_zone, section.block.array .cm__item_amount_area .cm__d_r .od_merit_zone { width: auto; }
    .last_item_area .block.array .cm__price_area p, section.block.array .cm__price_area p { font-size: 14px; }
    .last_item_area .block.array .option_zone .cm__d_r .cm__price_area, section.block.array .option_zone .cm__d_r .cm__price_area { display: block; }
    .last_item_area .block.array .price-box_duration, section.block.array .price-box_duration { width: 60%; }
}


/* ============================================================
   【商品ページ】整理で消えた本番ルールのDOMマッチ復元（2026-07-14）。
   本番 index.css にあり・このページDOMに一致し・ours に無かった分。 */
.cm__product_item_area { margin: 0px; }
.product_of_individual .cm__product_item_area { padding-bottom: 0px; }
.product_of_individual .cm__product_item_area .cm__cw h4 { font-size: 20px; line-height: 120%; margin: 20px auto 12px auto; padding-left: 0px; }
.content_block h3 { margin-bottom: 10px; font-weight: bold; }
.content_block h4 { margin-top: 10px; font-size: 25px; font-weight: bold; text-align: center; }
.content_block span { color: red; }
#breadcrumb { margin: 15px auto; }

@media screen and (max-width: 640px) {
    .content_block h4 { margin: 10px 0 20px; font-size: 4.5vw; }
    .kome_relative2 { position: relative; right: 2em; bottom: 0.5em; }
    .smile_left { left: 0; }
}


/* ============================================================
   【商品ページ】料金セクション(block.array)配下の完全復元（2026-07-14）。
   本番は last_item_area 内にあるため .last_item_area スコープのルールが効くが、
   テンプレは独立 section.block.array のため全て失効していた。
   本番で block.array 内の要素に実際に効いている .last_item_area 系ルールを
   全収集し .block.array スコープへ変換して復元（オプション延長ダクト・
   ドレンホース・メリット枠・finale_zone を含む）。 */
.last_item_area .block.array, section.block.array { padding-top: 40px; }
.last_item_area .block.array p:not(.cm__p2), section.block.array p:not(.cm__p2) { font-weight: 500; }
.last_item_area .block.array .od_merit_zone, section.block.array .od_merit_zone { border: dotted rgb(0, 0, 0); border-width: 2px; height: 100%; padding: 10px; }
.last_item_area .block.array .modal__content .od_merit_zone, section.block.array .modal__content .od_merit_zone { border-style: none; }
.last_item_area .block.array .od_merit_zone h4, section.block.array .od_merit_zone h4 { font-size: 18px; margin-bottom: 10px; }
.last_item_area .block.array .od_merit_zone p, section.block.array .od_merit_zone p { margin: 0px; }
.last_item_area .block.array .cm__finale_zone, section.block.array .cm__finale_zone { margin: 0em 0em 2em; }
.last_item_area .block.array .cm__finale_zone .parts.no0, section.block.array .cm__finale_zone .parts.no0 { margin-bottom: 38px; }
.last_item_area .block.array .cm__finale_zone .parts.no1 p, section.block.array .cm__finale_zone .parts.no1 p { text-align: center; }
.last_item_area .block.array .cm__finale_zone .parts.no3 p, section.block.array .cm__finale_zone .parts.no3 p { text-align: center; }
.last_item_area .block.array .option_zone, section.block.array .option_zone { padding-top: 25px; }
.last_item_area .block.array .option_zone .segmnent .spot, section.block.array .option_zone .segmnent .spot { border-style: solid; border-width: 1px; box-sizing: border-box; margin: 0em 0em 1em; padding: 1em; }
.last_item_area .block.array .option_zone .segmnent .spot .modal_button_box.link_t, section.block.array .option_zone .segmnent .spot .modal_button_box.link_t { margin: 0.5em 0em 0em; padding: 0em; text-align: right; }
.last_item_area .block.array .option_zone .spot .parts:nth-child(2) .div:nth-child(2) p, section.block.array .option_zone .spot .parts:nth-child(2) .div:nth-child(2) p { font-size: 16px; }
.last_item_area .block.array .option_zone.drain_hose .segmnent p, section.block.array .option_zone.drain_hose .segmnent p { font-size: 16px; }
.last_item_area .block.array .option_zone.duct .segmnent:nth-child(2), section.block.array .option_zone.duct .segmnent:nth-child(2) { display: flex; justify-content: space-between; }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2), section.block.array .option_zone.drain_hose .segmnent:nth-child(2) { display: flex; justify-content: space-between; }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2), section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) { display: flex; justify-content: space-between; }
.last_item_area .block.array .option_zone.drain_hose .segmnent .spot .parts:nth-child(2), section.block.array .option_zone.drain_hose .segmnent .spot .parts:nth-child(2) { display: flex; justify-content: space-between; }
.last_item_area .block.array .option_zone.duct .segmnent:nth-child(2) .spot, section.block.array .option_zone.duct .segmnent:nth-child(2) .spot { width: calc(50% - 10px); }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot, section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot { width: calc(50% - 10px); }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(1), section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(1) { width: 30%; }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1), section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(1) { width: 30%; }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2), section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) { width: calc(70% - 1em); padding: 0em; line-height: 115%; }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2), section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) { width: calc(70% - 1em); }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p, section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p { padding: 0em; }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p:last-child, section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p:last-child { margin: 0em; }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p, section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p { line-height: 115%; padding: 0em; }
.last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p:last-child, section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot .parts:nth-child(2) .div:nth-child(2) p:last-child { margin: 0em; }
.last_item_area .block.array .option_zone .spot.item973 .parts:nth-child(2) .div:nth-child(2) p:nth-child(1), section.block.array .option_zone .spot.item973 .parts:nth-child(2) .div:nth-child(2) p:nth-child(1) { margin: 0em; }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p span, section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) p span { color: red; }
.last_item_area .block.array .option_zone.duct .segmnent .modal_button_box.link_t, section.block.array .option_zone.duct .segmnent .modal_button_box.link_t { line-height: 115%; }
.last_item_area .block.array .option_zone.drain_hose .modal_button_box.link_t, section.block.array .option_zone.drain_hose .modal_button_box.link_t { line-height: 115%; }
.last_item_area .block.array .border-right, section.block.array .border-right { border-right-style: solid; border-right-width: 1px; }
.last_item_area .block.array .option_zone .segmnent .spot h4, section.block.array .option_zone .segmnent .spot h4 { margin: 0em 0em 1em; }
.last_item_area .block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2), section.block.array .option_zone.duct .segmnent .spot .parts:nth-child(2) .div:nth-child(2) { width: 85%; }

@media screen and (max-width: 640px) {
    .last_item_area .block.array h3, section.block.array h3 { font-size: 18px; text-align: left; }
    .last_item_area .block.array .od_merit_zone, section.block.array .od_merit_zone { padding: 8px; }
    .last_item_area .block.array .od_merit_zone h4, section.block.array .od_merit_zone h4 { font-size: 16px; padding: 0px 0px 0px 16px; }
    .last_item_area .block.array .discount_parts p, section.block.array .discount_parts p { font-size: 14px; }
    .last_item_area .block.array .cm__finale_zone .parts.no0 p, section.block.array .cm__finale_zone .parts.no0 p { font-size: 14px; }
    .last_item_area .block.array .cm__finale_zone .parts.no1 p, section.block.array .cm__finale_zone .parts.no1 p { text-align: left; }
    .last_item_area .block.array .option_zone .segmnent .spot .optz.parts .div p, section.block.array .option_zone .segmnent .spot .optz.parts .div p { font-size: 14px; }
    .last_item_area .block.array .option_zone.drain_hose .segmnent p, section.block.array .option_zone.drain_hose .segmnent p { font-size: 14px; }
    .last_item_area .block.array .option_zone.duct .segmnent:nth-child(2), section.block.array .option_zone.duct .segmnent:nth-child(2) { display: block; }
    .last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2), section.block.array .option_zone.drain_hose .segmnent:nth-child(2) { display: block; }
    .last_item_area .block.array .option_zone.duct .segmnent:nth-child(2) .spot, section.block.array .option_zone.duct .segmnent:nth-child(2) .spot { width: 100%; }
    .last_item_area .block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot, section.block.array .option_zone.drain_hose .segmnent:nth-child(2) .spot { width: 100%; }
}

/* 【商品ページ限定の調整】トップページ用の全体修正が商品ページで本番と食い違う箇所を
   「.product_of_individual ~（商品ページにのみ存在する兄弟）」で商品ページに限って上書き。
   本番: トップは last_item_area/jb_greeting が item_guide_area 内(=h2 padding-top:10px が当たる)、
   商品ページでは外(=padding-top:0)。overflow も商品ページは common の hidden のまま。 */
.product_of_individual ~ .top.last_item_area h2 { padding-top: 0; margin-bottom: 30px; }
.product_of_individual ~ .cm__jb_greeting h2 { padding-top: 0; margin-bottom: 30px; }
.product_of_individual ~ .top.last_item_area .cm__cw > .block { margin-top: 20px; }
.product_of_individual ~ .top.last_item_area .block > .zone,
.product_of_individual ~ .top.last_item_area .block > .zone > div { overflow: hidden; }
/* 本番はメリット枠の後ろに block.array が続くため :last-child にならず pb50/mb15 が残る。
   テンプレは block.array を外出ししたため last-child 化して 0 に潰れる → 商品ページ限定で復元 */
.product_of_individual ~ .top.last_item_area .cm__cw > .block:last-child { padding-bottom: 50px; margin-bottom: 15px; border-bottom: 1px solid #595959; }
/* 【SP】item_guide_area系 h2 の下余白は本番SPで30px */
@media screen and (max-width: 640px) {
    .customer_voice_area.item h2, .popular_reason_area h2, .top_p.media_area h2,
    .top.cm__transport_area.back_transport h2, .before_delivery.delivery_paragraph.p_top h2,
    .guarantee_area h2, .top.last_item_area h2, .cm__jb_greeting h2 { margin-bottom: 30px; }
}
/* 本番の .item_guide_area div { overflow: initial; }（広域リセット）の復元。
   テンプレは item_guide_area の入れ子を解体したため、内側だった各セクションで
   common の div{overflow:hidden} が復活し、余白の逃げ/包含が本番とズレる。
   ※ last_item_area / jb_greeting は商品ページで本番も hidden のため対象外。 */
.customer_voice_area div, .popular_reason_area div, .link_area div,
.media_area div, .cm__transport_area div, .before_delivery div,
.guarantee_area div { overflow: initial; }
/* 本番の .top.item_guide_area .cm__d_l/.cm__d_r（関連商品・消耗品モーダル内の列幅）復元。
   解体後は link_area 配下にモーダルがあるため link_area スコープで同値を適用。 */
.link_area .cm__d_l { width: 58%; }
.link_area .cm__d_r { width: 42%; }
@media screen and (max-width: 640px) {
    .link_area .cm__d_l { width: 100%; }
    .link_area .cm__d_r { width: 100%; }
}
/* 予約案内ボックス(spot.border-primary)内の行間復元。
   common の位置依存セレクタ(.cm__product_item_area .zone:nth-child(4) .parts... {line-height:125%})が、
   テンプレのHTML削除による位置ズレで誤って命中し22.5pxに縮んでいた。本番は親から24.3px継承。 */
.spot.border-primary.box-shadow-none .zone .parts p { line-height: inherit; }
/* 本番は appeal.zone が p_item.zone 内にあり `.p_item.zone h3{border-left:6px solid darkblue}`
   （青い縦線）が延長ダクト等の見出しにも効くが、テンプレは appeal.zone を外出ししたため失効。
   → option_zone の見出しに縦線を復元（本番: border-left 6px 濃紺 / pl 0 / text は線の直後6px）。 */
.product_of_individual .appeal.zone .option_zone h3 { border-left: 6px solid #494824; }
/* 【SP】appeal.zone の見出し(延長ダクト等・モーダル内h3含む)は、本番では p_item.zone 内にあり
   `.p_item.zone h3{padding-top:5px}`(SP)が anchor_down の padding-top:100px を打ち消す。
   テンプレは appeal.zone を外出ししたため 100px が残り上余白が巨大化→同値で補正。 */
@media screen and (max-width: 640px) {
    .product_of_individual .appeal.zone .option_zone h3 { padding-top: 5px; }
}

/* ---- campaign.html 修正(2026-07-17): 発電機の身分証明書ブロックを中央寄せ ----
   .id_required_space.block は .cm__cw ラッパーに包まれず main 直下にあり、
   幅制限・中央寄せが無く全幅(1905px)化して画像が左端に外れていた。
   他セクションの .cm__cw と同じ 幅1100px・中央寄せ に揃える(SPは95%)。
   併せて、cm__cw 外のため .cm__cw .block{border-bottom:1px solid #595959} の区切り線が消えていた
   のを border-top で復活（本番は直前ブロックの border-bottom が線。位置=線の上50px/下15px相当）。 */
/* 上余白: 直前の block.array が既に padding-bottom:50px を持つため、ここで更に margin-top を
   足すと合計100pxになり空きすぎる。ユーザー指定により「延長ダクト枠の下端〜区切り線」を
   50px に統一（= margin-top:0 で block.array の 50px のみを効かせる）。 */
/* 下余白: 本番は親 .cm__cw が `padding:50px 0`(SP用の上書き無し=PC/SP共通)を持ち、
   最後の項目と次セクション(cm__jb_greeting)の間に50px空く。テンプレは .cm__cw が無いので
   このブロック自身の padding-bottom で同じ50pxを作る(PC/SP共通。背景は透明のため
   margin でも見た目は同じだが、本番と同じボックスモデルに揃えておく)。 */
/* 上余白(padding-top:15px): 本番は区切り線が「直前 .block.array の border-bottom」で、
   その margin-bottom:15px が線とタイトルの間を作る(線→h2ボックス15px / 線→文字25px)。
   テンプレは線がこのブロック自身の border-top なので、同じ15pxを padding-top で作る。
   ※ブロックの高さ実測値は本番より15px大きくなるが、それは本番だと同じ15pxが
     前要素の margin 側にあるだけで、線とタイトルの見た目の位置関係は一致する。 */
.id_required_space.block { width: 1100px; margin: 0 auto; padding: 15px 0 50px; box-sizing: border-box; border-top: 1px solid #595959; }
@media screen and (max-width: 640px) {
  /* 幅のみSP用に上書き。下余白は base の padding-bottom:50px をそのまま使う
     （本番の .cm__cw{padding:50px 0} と同値。SP用の上書きは本番にも無い）。 */
  .id_required_space.block { width: 95%; }
}
/* ---- campaign.html 修正(2026-07-20): 上記の続き・実測46px超過分の解消 ----
   実測(PC1920, live注入diff)で本番1321px・テンプレ1367pxと46px差があった。内訳は
   (a) accbox/acPerformanceContents/内側divが item_guide_area の広域reset(overflow:initial)を
       失い common の `div{overflow:hidden}` が復活→中のul margin-bottom:36pxがmargin-collapse
       できず親に閉じ込められ+36〜40px（後述の `.id_required_space.block div{overflow:initial}` で解消）、
   (b) 「延長排熱ダクト」h4が汎用h4{margin:25px auto 15px}を継承しmb15px余分（本番は0）、
   (c) 見出しh2の上余白を本番はh2自身のpadding-top:10pxで持つが、テンプレはコンテナのpadding-top:15pxで
       持っていたため微差。→ コンテナのpadding-topを廃し、h2側にpadding-top:10pxを移設。
   実測で本番1321px・テンプレ1322pxまで一致（残差1pxは丸め誤差）。 */

/* ==================== voice.html 専用（.voice_headline / .message_area は voice.html のみ） ==================== */
/* タイトル枠を本番(style.css)と同じ水色に。common_style の #59595959(グレー)を上書き。best_voice(#ececec)は据え置き。 */
.voice_headline { background: #FDE9D9; }
/* 上の実績ブロック(.top_img_box)の下余白を本番と同じ padding-bottom:30px に復活。
   ローカルは index.css の .top_img_box.cw{padding:0} が本番(common_style)の下余白を打ち消して
   導入文「…お客様の声をご紹介します。」が詰まっていた（visual gap 35→5px）。voice限定(.message_area配下)で復活。 */
.message_area .top_img_box.cw { padding-bottom: 30px; }

/* ---- campaign.html 修正(2026-07-17): 発電機の身分証明書ブロックのタイトルh2サイズ ----
   本番では .top.last_item_area h2 { font-size:48px; line-height:70px } が効いて48pxだが、
   テストの .id_required_space.block は .top.last_item_area に包まれず汎用h2(40px)のまま。
   本番と同じ48px(SPは24px)に補完する。SP下マージンは本番30px。 */
.id_required_space.block h2 { font-size: 48px; line-height: 70px; margin-bottom: 50px; padding-top: 10px; }
@media screen and (max-width: 640px) {
  /* margin-top:0 は SP の汎用 h2{margin-top:2em}(=24px×2=48px) の打ち消し。
     区切り線とタイトルの間が48px空いて広すぎたため。上余白は h2 自身の
     padding-top:10px(base) のみを残す。greeting 見出しと同じ対処。 */
  .id_required_space.block h2 { font-size: 24px; line-height: 36px; margin-top: 0; margin-bottom: 30px; }
}

/* ---- campaign.html 修正(2026-07-17): 「身分証明書として…」見出しh4サイズ ----
   本番では .item_guide_area .zone:nth-child(4) h4 { font-size:30px } で30pxだが、
   テストの .id_required_space.block は .item_guide_area ラッパーが無く汎用h4(1.2em=21.6px)。
   本番と同じ30px（SPも本番は30pxのまま）に補完する。 */
.id_required_space.block h4 { font-size: 30px; line-height: 34.5px; margin: 0; }
@media screen and (max-width: 640px) {
  .id_required_space.block h4 { font-size: 30px; }
}

/* ---- campaign.html 修正(2026-07-18): 身分証明書ブロックの本文太さ ----
   本番では .top.last_item_area p { font-weight:500 } で段落が中太になるが、
   テストの id_required は .top.last_item_area の外にあり効かず 400 のまま。
   本番と同じ 500 に補完する（段落のみ。見出しは別途700）。 */
.id_required_space.block p { font-weight: 500; }

/* ---- campaign.html 修正(2026-07-18): 身分証明書ブロックのSP画像+本文レイアウト ----
   本番は PC/SP とも zone:nth-child(2) が flex（画像seg1=20%+右margin1em / 本文seg2=80%）で横並び。
   しかし common_style は SP(≤640px) で zone2 を display:block・seg1 50%(中央)・seg2 100% に変える
   ため、テストでは画像と本文が縦積みになり本番と不一致だった。SPでも本番の flex 横並びに戻す
   （common_style は編集不可のため index.css で同一セレクタ・後勝ちで上書き）。 */
@media screen and (max-width: 640px) {
  .id_required_space.block .zone:nth-child(2) { display: flex; justify-content: space-between; }
  .id_required_space.block .zone:nth-child(2) .segment:nth-child(1) { width: 20%; margin: 0 1em 0 0; }
  .id_required_space.block .zone:nth-child(2) .segment:nth-child(2) { width: 80%; }
}

/* ---- campaign.html 修正(2026-07-20): 身分証明書ブロック内アコーディオンの余白詰まり ----
   本番は id_required_space が .item_guide_area の入れ子内にあり、広域リセット
   `.item_guide_area div{overflow:initial}` が効いて中の accbox/acPerformanceContents は
   overflow:visible。テンプレは main 直下に外出ししたため common の `div{overflow:hidden}`
   (common_style.css:30)が復活し、内部の ul{margin-bottom:36px} がmargin-collapseできず
   親の高さに閉じ込められて実測+36〜40px 余分に伸びていた。本番同様 initial に戻す。 */
.id_required_space.block div { overflow: initial; }

/* ---- campaign.html 修正(2026-07-20): 会社挨拶(cm__jb_greeting)ブロックの余白・overflow ----
   campaign.html では本番の cm__jb_greeting は id_required_space と同じ item_guide_area の
   広域リセットの恩恵を受けており、overflow:visible / h2 は pt10・mb50（他ページのjb_greeting
   は独立文脈でpt0・mb30のため、ここは campaign.html 限定で id_required_space の後続兄弟に
   スコープして上書きする）。 */
.p_top.id_required_space.block ~ .cm__jb_greeting,
.p_top.id_required_space.block ~ .cm__jb_greeting div { overflow: initial; }
.p_top.id_required_space.block ~ .cm__jb_greeting h2 { padding-top: 10px; margin-bottom: 50px; }
/* ---- 汎用(2026-07-27): 会社挨拶(jb_greeting)見出しの上padding ----
   本番では jb_greeting が .item_guide_area 内にあり `.item_guide_area h2{padding:10px 0 0}` で
   h2 に padding-top:10px が付く。テンプレ各ページ(items.html等)では jb_greeting が main 直下に
   外出しされ item_guide_area 外なので pt:0 になり、見出しが10px低くなる(PC/SP共通)。本番同様に。 */
.cm__jb_greeting h2 { padding-top: 10px; }

/* ---- campaign.html 修正(2026-07-20): 末尾の電話CTA(cm__responsive_device.ending)の左右余白 ----
   本番は index.css の `.top.item_guide_area .cm__cw{padding:50px 0}` が効いて
   ending の .cm__cw(=cm__site_ids4.cm__tel_number_display)も左右padding0(横幅1100フル)になるが、
   テンプレは item_guide_area の入れ子から外れたため common の
   `.cm__responsive_device .cm__cw{padding:25px 50px}` の左右50pxが残り、
   本文(.r_d_block.ending_sentence 等)が1000pxに縮んで中央寄りに詰まっていた。
   ※必ず PC 限定(min-width:641px)で当てること。このセレクタはクラス6個で詳細度が高く、
     メディアクエリ無しで書くと SP 用の
     `.cm__responsive_device.ending .cm__cw.cm__tel_number_display{padding:30px 10px}`(クラス4個)
     まで打ち負かして SP の左右余白が0になってしまう。 */
@media screen and (min-width: 641px) {
  .p_top.id_required_space.block ~ .cm__responsive_device.ending .cm__cw { padding: 50px 0px; }
}
/* ---- 汎用(2026-07-27): 末尾電話CTA(ending)内の div の overflow を本番と同じ visible に ----
   本番では ending は .item_guide_area の入れ子内にあり `.item_guide_area div{overflow:initial}`
   が効いて overflow:visible。テンプレ各ページ(items.html等)では ending が main 直下に外出し
   されているため common の `div{overflow:hidden}`(common_style.css:30)が残り、末尾段落の
   margin-bottom:18px がブロック内に内包されて高さが+18pxズレる(SPで顕著)。本番同様 initial に。
   ※ .ending は予約CTA専用クラス(sagawa_ver等とは別)なので他へ波及しない。campaign用の
     旧スコープ(.p_top.id_required_space.block ~)も内包する汎用ルール。 */
.cm__responsive_device.ending,
.cm__responsive_device.ending div { overflow: initial; }

/* ---- manual.html 修正(2026-07-18): 取扱説明書ブロック見出しの上余白 ----
   見出し(.manual_area01 > h3.anker_down)の上余白は .cw の padding-top 頼み。
   .cw は common_style で PC:padding 50px / SP(≤640px):padding 0px のため、
   ・SP では1つ目の見出し(970)が .top_content の下線に密着(余白0)
   ・PC/SP とも 2つ目以降(1130…)の項目間が余白0(実測-4px)
   になっていた(.manual_area01/.bousen/h3 自体は上マージン0)。
   manual.html 専用の .manual_area01 に上マージンを付与して余白を確保する。 */
.manual_area01 { margin-top: 0; }

/* ---- manual.html 修正(2026-07-18): 見出し/本文と区切り線の左右ズレ ----
   取扱説明書の各項目は section.cw の中で更に <div class="cw"> にネストされている。
   .cw は base で width:1100px 固定のため、親(section.cw の内容幅=1000px)から
   右へ 100px はみ出し、.manual_area01 の内容が 183〜1183 に広がっていた。
   結果、中央寄せ見出しの中心(683)が区切り線(.top_content 下線)の中心(633)より
   50px 右にズレ、折り返し位置も本来と変わっていた。
   .manual_area01 を内包する入れ子 .cw を親幅に収め、内容を 183〜1083 に戻す
   (導入文と左端が揃い、見出し中心が線の中心と一致)。※このセレクタは manual.html のみ該当。
   併せて padding-bottom を 0 に: この入れ子 .cw と外側 section.cw の padding-bottom(各50px)が
   重なり、最後の項目下に約100pxの過大な余白が出ていた。重複分(内側50px)を除去する
   (上余白は1つ目見出しに必要なので padding-top は残す)。 */
.cw:has(> .manual_area01) { width: 100%; padding: 0; }
/* 最初の取説項目のみ top_content との間に本番同等の余白。PC=100px, SPは基底の30pxに委ねる(本番一致)。 */
@media (min-width: 641px) {
    .cw:has(> .manual_area01) > .manual_area01:first-child { margin-top: 100px; }
}

/* ---- 「現在ページをサイトマップで淡色表示」機能は削除(2026-07-18 ユーザー要望) ----
   以前は body.page-* に応じて現在ページのカテゴリ見出しを opacity:0.4 で薄くしていたが、
   全ページ通常色に統一するため撤去。<body>の page-* クラスは残っていても無害（未使用）。 */

/* ---- greeting(笑顔をつなぐレンタル)見出しのSP上余白を圧縮 ----
   SPの汎用 h2{margin-top:2em}(≈43px) が、既に padding-top:50px のある枠(.cm__cw)内の
   greeting 見出しにも重ねて効き、タイトル上が広すぎた(計~93px)。greeting のみ上マージン0で
   ~50px(枠のpadding分)に。全ページの greeting 共通(=統一を維持)。※本番は 2em のまま。 */
@media screen and (max-width: 640px) {
  .cm__jb_greeting h2 { margin-top: 0; }
}

/* ---- relevant.html: 本番では jb_greeting / responsive_device.ending が item_guide_area の外
   (body直下)にあり、h2 は padding-top:0、.ending 系は common の overflow:hidden が効く。
   テンプレ共通の補完(.cm__jb_greeting h2{pt:10px} / .cm__responsive_device.ending{overflow:initial})が
   relevant では逆に逸脱するため、relevant_area の兄弟に限って本番値へ戻す(他ページは .relevant_area が
   無いので不変)。 */
.relevant_area ~ .cm__jb_greeting h2 { padding-top: 0; }
.relevant_area ~ .cm__responsive_device.ending,
.relevant_area ~ .cm__responsive_device.ending div { overflow: hidden; }
/* SP: campaign用の .cm__cw .block.array{max-width:100%} が relevant にも効き、本番の
   max-width:none と数値上ズレる(実効幅は同じ356px)。fp4完全一致のため relevant では none に。 */
@media screen and (max-width: 640px) {
  .relevant_area .block.array { max-width: none; }
}

/* relevant.html: 予約フォームボタン(赤四角)の中身「ご予約フォームはこちら」。
   以前ここでテキストを絶対配置で中央寄せしていたが（input_reserve を position:absolute;
   left:50%;transform で中央、矢印 margin-left:auto）、それにより input_reserve の使える幅が
   ボタンの右半分(約50%=160px)に制限され、テキストが本番より早く2行に折り返して崩れていた。
   本番は position 指定なしの通常 flex（input_reserve は内容幅258px・矢印は右）なので、
   絶対配置ブロックを撤去して本番の既定挙動に戻す（common_style の margin:auto がそのまま効く）。 */

/* relevant.html SP: 予約案内注記(parts.no1「ご予約の際は…延長コード○○をご選択ください」)が
   SPでテキスト2行に折り返すが、common の parts.no1{line-height:120%} による行ボックス高さより
   実際のグリフ描画が下にはみ出し、parts.no1 の overflow:hidden で下端が数px見切れる。
   テンプレのみ SP で overflow:visible にして全文表示(上下の parts.no0/no2 とは十分な余白があり重ならない)。 */
@media screen and (max-width: 640px) {
  .relevant_area .block.array .cm__finale_zone .parts.no1 { overflow: visible; }
}

/* ---- モーダル内 予約フォームボタン(赤四角)の文言を中央寄せ(SP) ----
   モーダル(.jq_modal_content)内の .cm__goto_form は、SP幅(iPhone 12 Pro等)ではテキストが左寄せで
   右端の矢印と合わせて枠幅を超え見切れていた(本番も同様)。
   ユーザー指定の参考(relevant.html の finale ボタン)と同じ挙動にする：
   input_reserve(テキスト枠)を flex で「矢印を除いた領域いっぱい」に広げ text-align:center で
   その中でテキストを中央に、矢印は右に隣接。これで「ご予約フォームはこちら」がテキスト枠の
   中央に来る（参考と同じ）。原寸フォント(23.4px)維持のまま1行で収めるため、狭いモーダルでは
   矢印画像だけ30pxに縮小(テキスト枠を256px以上確保するため)。
   ※.jq_modal_content スコープなのでモーダル外(相談窓口ボタン等)には影響しない。 */
@media screen and (max-width: 640px) {
  .jq_modal_content .cm__goto_form .cm__stable_flex { justify-content: normal; align-items: center; }
  .jq_modal_content .cm__goto_form .cm__stable_flex .cm__input_reserve { flex: 1 1 auto; min-width: 0; text-align: center; padding: 0; margin: 0; }
  .jq_modal_content .cm__goto_form .cm__stable_flex .cm__input_reserve .cm__p2 { white-space: nowrap; }
  .jq_modal_content .cm__goto_form .cm__stable_flex .cm__input_reservation { flex: 0 0 auto; margin: 0; padding: 0; }
  .jq_modal_content .cm__goto_form .cm__stable_flex .cm__input_reservation img { width: 30px; height: auto; }
}

/* ---- items.html/相談窓口見出しの「※1」マーカー位置(本番と同じに復元) ----
   .johnson_box の見出し内「…早期返却返金保証付き。<span class="hk_cc kome_relative_items">※1</span>」の
   ※1 は、本番では .kome_relative_items の位置指定で「早期返却返金保証付き」付近の上付きに配置される。
   テンプレの index.css にはこのルールが欠落しており、※1 が位置指定されず自然位置（見出し末尾が
   折り返した下の行）にポツンと浮いていた。本番と同一の値で復元する。
   PC: 見出し右側の上付き位置へ / SP: 直後の小さな上付き。 */
.kome_relative_items { position: relative; right: -60em; bottom: 5em; }
@media screen and (max-width: 640px) {
  .kome_relative_items { right: 1.5em; bottom: 0.5em; }
}

/* 【修正】#breadcrumb は style.css で width:1280px の固定幅が当たっており、
   ウィンドウ幅1280pxではスクロールバー分(15px)はみ出して横スクロールが発生していた。
   （テンプレート由来。パンくずがある下層ページ全てで発生）
   デザイン上の最大幅1280pxは保ったまま、狭い時は縮むようにする。 */
#breadcrumb {
  width: 100%;
  max-width: 1280px;
  box-sizing: border-box;
}

/* 【修正】上の right:-60em はスポットクーラー版の3行の文言に合わせた値で、
   餅つき用の文言（2行）に差し替えると右に25pxはみ出して横スクロールが発生した。
   ラフでも ※1 は文末の直後に付いているため、商品一覧系ページでは通常配置に戻す。 */
.johnson_box.items .kome_relative_items {
  position: static;
  right: auto;
  bottom: auto;
}


/* ============================================================
   餅つきサイト 1カラム化で追加したスタイル
   （list.html / items.html で使用。既存クラスは変更していません）
   ============================================================ */

/* 見出しバンド：Excel「カラーコード」シート準拠
   背景 #FDE9D9（肌色）／左罫 #FF0000（赤）／文字 #31320E（茶） */
.mochi_band,
.mochi_item_block > h2 {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background-color: #FDE9D9;
  border-left: 14px solid #FF0000;
  padding: 12px 20px;
  margin: 2.5em 0 1.2em;
  text-align: center;
  color: #31320E;
}
.mochi_band_sub {
  display: block;
  font-size: 0.6em;
  font-weight: normal;
}

/* 単品ボタンの3列グリッド。
   .banner_category は flex-wrap:nowrap で2件専用のため使わず、こちらを使用 */
.mochi_btn_grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  list-style: none;
  margin: 1em 0 2em;
  padding: 0;
}
.mochi_btn_grid > li { flex: 0 0 calc(33.333% - 8px); box-sizing: border-box; }
/* 【追加】以前は ul に style="justify-content:center" をインラインで書いていたものをクラス化 */
.mochi_btn_grid.center { justify-content: flex-start; }
/* トップページの「セットと一緒に」など2列で見せたいグループ用 */
.mochi_btn_grid > li.w50 { flex: 0 0 calc(50% - 6px); }
/* 【修正】以前はラフから切り出した btn_*.png を使っていたため、
   画像ごとに元サイズ（58〜69px高）がバラバラで、幅を揃えると
   ボタンの高さが不揃いになり、中の文字の大きさも画像ごとに違って
   詰まって見えていた。
   現行サイトの正規ボタン画像（すべて 210×57 で統一）に差し替えている。
   【変更】上限幅は元サイズを考慮して 280px にしていたが、ラフはもっと
   大きく（2列で1つ約450px）ボタンを見せる指定のため 450px に広げた。
   ※元画像が 210×57 しかないため約2.1倍の引き伸ばしになる。
     くっきり見せるには 450px 幅以上の画像を用意して差し替える必要がある。 */
/* ============================================================
   【変更】商品ボタンを「画像1枚」から HTML＋CSS に作り替えた。
   ・角丸／ベージュの地／枠線 … CSS
   ・商品名 … HTMLテキスト（拡大してもボケない・文言変更が容易）
   ・▶ … CSS（ラフ指示どおり赤background＋白の三角、右側へ）
   ・商品写真 … 画像のまま。等倍で置くので引き伸ばさない
   元の 210x57 のボタン画像は img/mochi/menu/ に残してある（差し戻し可）
   ============================================================ */
/* 【修正】同じ行のボタンの高さを揃える。
   li は flex アイテムなので伸びるが、中の <a> は伸びないため高さが不揃いだった */
.mochi_btn_grid > li {
  display: flex;
}
.mochi_btn_grid > li > .mochi_pbtn {
  height: 100%;
}.mochi_pbtn {
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  width: 100%;
  min-height: 57px;
  padding: 6px 8px 6px 14px;
  border: 1px solid #B8A175;
  border-radius: 12px;
  background: linear-gradient(#E6E7BD, #D9DAA3 55%, #CDCE92);
  text-decoration: none;
  color: #4A4B2E;
}
/* 【修正】サイト共通の a:visited（青・下線）が効いてしまい、
   一度開いたボタンだけ文字が青くなっていたので明示的に打ち消す */
.mochi_pbtn,
.mochi_pbtn:link,
.mochi_pbtn:visited,
.mochi_pbtn:hover,
.mochi_pbtn:active,
.mochi_pbtn:visited .mochi_pbtn_txt {
  color: #4A4B2E;
  text-decoration: none;
}
.mochi_pbtn:hover { filter: brightness(1.05); }

.mochi_pbtn_txt {
  flex: 1 1 auto;
  min-width: 0;
  font-family: "M PLUS Rounded 1c", "ヒラギノ丸ゴ ProN", "Hiragino Maru Gothic ProN", sans-serif;
  font-weight: 700;
  /* 【変更】文字がガビガビに見える主因は白い縁取りの太さだったため 3px→2px に。
     あわせて文字サイズも 20px→22px に上げて輪郭をなめらかにする */
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: .02em;
  /* 元の画像と同じく、白い縁取りで背景から浮かせる（文字は痩せない） */
  -webkit-text-stroke: 2px #ffffff;
  paint-order: stroke fill;
}
/* 【変更】ラフでは小ラベルが商品名の「上」に置かれている */
.mochi_pbtn_sub {
  display: block;
  /* 小ラベルは 12px に 2px の縁取りで潰れ気味だったため、13px／1px に */
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 1px;
  color: #7A5A18;
  -webkit-text-stroke: 1px #ffffff;
  paint-order: stroke fill;
}

/* 共通の .mochi_btn_grid img（幅100%・比率210:57・object-fit:fill）を打ち消して、
   写真は元のサイズのまま置く */
.mochi_btn_grid .mochi_pbtn_photo {
  flex: 0 0 auto;
  display: block;
  width: auto;
  max-width: 40%;
  height: 47px;
  aspect-ratio: auto;
  object-fit: contain;
  margin: 0;
}

/* ▶ ラフ指示「赤背景＋白にして右側へ」 */
.mochi_pbtn_arrow {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #FF0000;
  position: relative;
}
.mochi_pbtn_arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #ffffff;
}

@media screen and (max-width: 640px) {
  /* 【修正】スマホは2列なので1枠が約190pxしかなく、15pxの文字だと
     商品名が3行に折れてボタンの高さがバラバラになっていた。
     文字・写真・矢印をひと回り小さくし、2行に収まるようにする */
  .mochi_pbtn {
    min-height: 56px;
    padding: 5px 5px 5px 8px;
    gap: 4px;
  }
  .mochi_pbtn_txt {
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: 0;
    -webkit-text-stroke-width: 1.5px;
  }
  .mochi_pbtn_sub {
    font-size: 9px;
    line-height: 1.2;
    margin-bottom: 0;
    -webkit-text-stroke-width: 1px;
  }
  .mochi_btn_grid .mochi_pbtn_photo { height: 30px; max-width: 30%; }
  .mochi_pbtn_arrow { width: 20px; height: 20px; }
  .mochi_pbtn_arrow::before { border-width: 4px 0 4px 6px; }
  .mochi_btn_grid { gap: 8px; }
}
.mochi_btn_grid img {
  width: 100%;
  max-width: 450px;
  height: auto;
  /* link_bat だけ高解像度版で縦横比が 0.4px ずれるため、比率を固定して
     全ボタンの表示サイズを完全に揃える */
  aspect-ratio: 210 / 57;
  object-fit: fill;
  display: block;
  margin: 0 auto;
}

.mochi_to_list { text-align: right; margin: 1.5em 0 0; }

/* ページ内アンカーボタン（ラフ準拠：PCは2列／SPは1列） */
.mochi_anchor_grid {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 20px;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.mochi_anchor_grid > li { flex: 0 0 calc(50% - 10px); }

/* 商品ブロック：現行2カラムサイトの table レイアウトを
   そのまま流用しつつ、flex に変換して SP で縦積みにする。
   ※商品によって h2 と table の間に <div align="center"> が入るため、
     子セレクタではなく table 側に .mochi_layout を付けて指定している
     （内側の仕様表テーブルには影響させない） */
table.mochi_layout,
table.mochi_layout > tbody,
table.mochi_layout > tbody > tr { display: block; width: 100%; }
table.mochi_layout > tbody > tr {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
}
table.mochi_layout > tbody > tr > td {
  display: block;
  width: auto !important;
  max-width: 100%;
}
/* ラフ準拠：左＝商品写真と仕様（細め）／右＝料金表（広め） */
table.mochi_layout > tbody > tr > td:first-child { flex: 0 1 300px; }
table.mochi_layout > tbody > tr > td + td { flex: 1 1 480px; }
/* 中身が空のセル（現行サイトの余りセル）は場所を取らないように */
table.mochi_layout > tbody > tr > td:empty { display: none; }
.mochi_item_block img { max-width: 100%; height: auto; }
.mochi_item_block .txt_link { text-align: right; margin: 1em 0 2.5em; }

/* ファーストビュー：ラフ準拠。ナビ直下に写真3枚を横一列で全幅に敷き、
   中央に白いキャッチコピーボックスを重ねる（スポットクーラー版と同じ構成）。
   以前は 700px の top_image.png 1枚だったため、画面中央に小さく浮いていた。
   .try_fvi_base（1265x1265・object-fit:fill）は使わず、自前で組んでいる。 */
.mochi_fv {
  position: relative;
  max-width: none;
  margin: 0;
  /* 写真の合計幅が画面幅に届かない場合の下地。
     ラフ指示「現行サイトの木の背景を使いたい」に合わせて木目にしている */
  background-color: #E1E0C1;
  background-image: url("../img/mochi/wood_bg.jpg");
  background-repeat: repeat;
  background-size: 512px auto;
  overflow: hidden;
}
.mochi_fv_photos {
  display: flex;
  height: 360px;
}
/* 【変更】高さ360px固定だと、1コマが「画面幅÷3 × 360px」＝16:9よりずっと縦長の枠になり、
   1280x720の写真が object-fit:cover で左右3割以上も切り落とされていた（画面幅1265pxで34%カット）。
   3枚とも16:9なので、帯全体の比率を 48:9 に固定すると1コマがちょうど16:9になり、
   写真が左右に切れなくなる。
   ・下限240px … キャッチコピーの白ボックス（約200px）が収まる高さ
   ・上限360px … これ以上帯が高くならないように（従来の見た目の上限）
   SP（〜900px）は既存の vw 指定を活かすため、PC幅だけに限定している */
/* 全幅で適用。スマホでも 1コマ＝16:9 になり、写真が切れない */
.mochi_fv_photos {
  width: 100%;
  aspect-ratio: 48 / 9;
  height: auto;
  max-height: 440px;
}
.mochi_fv_photos img {
  object-position: center 40%;
}
@media screen and (min-width: 901px) {
  .mochi_fv_photos {
    /* 【重要】width を書かずに aspect-ratio ＋ max-height だけにすると、
       高さが上限に当たった時にブラウザは高さではなく「幅」を縮めてしまい、
       画面幅1920pxを超えたところで帯の右側に背景の木目が残ってしまう。
       width:100% を明示して幅を確定させ、制限は高さだけに効かせる */
    width: 100%;
    aspect-ratio: 48 / 9;
    height: auto;
    min-height: 240px;
    max-height: 440px;
  }
  .mochi_fv_photos img {
    /* 高さの上下限に当たる画面幅では多少のトリミングが発生するため、
       人物の顔が残るよう少し上寄りで見せる */
    object-position: center 40%;
  }
}
.mochi_fv_photos img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  object-fit: cover;
}
/* 【変更】3枚とも 1280x720（16:9）の同サイズ画像に差し替わったため、均等3分割にする。
   以前は 413x330／224x324／228x322 とサイズも比率もバラバラで、拡大率を揃えるために
   左だけ 1.4 倍幅に配分していた（.mochi_fv_photos img:nth-child(1) { flex: 1.4 1 0 }）。
   画面幅1920pxのとき1枚あたり 640x360＝ちょうど16:9になり、トリミングなしで収まる。
   それより狭い画面では object-fit:cover が左右を均等に切り落とす */
.mochi_fv_photos img { flex: 1 1 0; }

.mochi_fv_copy {
  position: absolute;
  /* 【重要】以前は max-height + overflow:hidden で押し込んでいたが、
     フォントやブラウザのズームが少し違うだけで文字が写真の上に重なったり
     末尾が切れたりする壊れやすい作りだった。
     白い背景を敷いて、伸びても写真に文字が重ならないようにしている。 */
  /* 【変更】ボックスの位置を中央（50%）から 65% へ下げる。
     ただし帯より下にはみ出すと overflow:hidden で切れてしまうため、
     min() で「帯の下端から余裕を残す位置」を上限にしている */
  top: min(65%, calc(100% - 108px));
  left: 50%;
  transform: translate(-50%, -50%);
  width: 760px;
  max-width: 88%;
  box-sizing: border-box;
  /* 【変更】白をすこし透過させて、後ろの写真がうっすら見えるようにする */
  background-color: rgba(255, 255, 255, 0.88);
  padding: 14px 18px;
  text-align: center;
  color: #31320E;
  line-height: 1.55;
}
.mochi_fv_copy p { margin: 0; font-size: 16px; }
.mochi_fv_copy .mochi_fv_hk { font-size: 11px; text-align: right; margin-top: .4em; }

/* 【修正】ファーストビューのキャッチを、ラフ（Excel）の実測値に合わせる。
   ラフのテキストボックスの設定値（Web換算は 1pt≒1.333px）：
     フォント 20pt・太字      → 26px／bold
     幅 654pt                 → 880px（ラフ冒頭の「点線内＝約880px」とも一致）
     行間 26pt（固定値指定）  → line-height 1.3（26px × 1.3 ≒ 34px）
     内部余白 上下3.6pt/左右7.2pt → padding 5px 10px
   余白と行間が広いままだと白ボックスが写真の7割を覆って背景がほぼ見えないため、
   ラフの値まで詰めている（ボックス高さ 251px → 198px）。
   SP は既存の 14px 指定を活かすため PC 幅に限定している */
@media screen and (min-width: 641px) {
  .mochi_fv_copy { width: 880px; padding: 5px 10px; }
  .mochi_fv_copy p { font-size: 26px; font-weight: bold; line-height: 1.3; }
}

/* 【変更】ラフのスマホ版でも写真帯は 282pt x 53pt（＝約5.3:1）で、
   1コマがちょうど16:9になる比率。PCと同じ 48:9 の指定でそのまま合うため、
   ここにあった height:40vw / 45vw の指定は不要になった */
@media screen and (max-width: 640px) {
  /* SPでは写真の上に文字を載せると収まらないため、写真の下にコピーを置く */
  .mochi_fv_copy {
    position: static;
    transform: none;
    width: 100%;
    max-width: none;
    padding: 14px 12px;
    background-color: #fff;
  }
  /* 【変更】ラフのスマホ版では、商品一覧まわりに肌色の外枠が無く、
     白がそのまま画面いっぱいに広がっている。
     PCの「肌色の地＋幅1100pxの白カラム」はスマホでは意味が薄いため外す */
  .top.item_guide_area.mochi_items_head { padding-top: 0; }
  .top.item_guide_area.mochi_faq { padding-bottom: 0; }
  .top.item_guide_area.mochi_items_head .cm__cw,
  .top.item_guide_area.mochi_faq .cm__cw {
    width: 100%;
    max-width: none;
    margin: 0;
  }
  /* ラフのスマホ版の見出しは「すぐに本格的な餅つきが始められます」だけで、
     「これだけ揃えれば、」が入っていない */
  .mochi_hide_sp { display: none; }
  /* 【追加】ラフのスマホ版は、キャッチコピーの上下に写真の帯が1本ずつ入る。
     ラフの帯は 282pt x 53pt（＝約5.3:1）なので、画面幅の 18.8% を高さにする。
     写真は「お客様の喜びの声」のストリップからの流用 */
  .mochi_fv_strip {
    display: flex;
    width: 100%;
    height: 18.8vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  .mochi_fv_strip img {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 40%;
  }
  /* PC用の3枚組はスマホでは使わない（上下の帯に置き換える） */
  .mochi_fv_photos { display: none; }
  /* 【変更】ラフのスマホ版の指定にそろえる。
     Excel の書式：13pt（≒17px）・太字・本文は黒・「※」だけ 8pt（≒10px）。
     赤字は「すぐに本格的な餅つきが始められるセット」「詳しいやり方説明書」の2箇所（#FF0000）。
     ※文字サイズだけは、ラフ換算の17pxだと1行が短く行数が増えるため、
       ご指定により特例で 16px にしている（太字・黒・赤字の位置はラフどおり） */
  .mochi_fv_copy p {
    font-size: 16px;
    font-weight: bold;
    color: #000000;
  }
  /* ラフのスマホ版は改行を入れず自然に折り返している。
     PC用に入れてある改行はスマホでは効かせない（class="pc" のものは元から非表示） */
  .mochi_fv_copy p br { display: none; }
  /* 「※北海道・九州は送料別途」は残す（ラフでも表示） */
  .mochi_fv_copy .mochi_fv_hk { display: block; }
}

/* 「30秒でわかる〜」の連番バッジ。
   ラフ指示「番号背景色 サイト名と同じ茶色に #494824」。
   番号は写真(item_0Xs.webp)に紺色の丸として焼き込まれており、
   webpを編集できる環境がないため、同位置に茶色の丸を重ねて上書きしている。
   ※元画像を茶色で作り直していただければ、この .mochi_step の指定は削除できます。 */
.mochi_step { position: relative; display: inline-block; line-height: 0; }
.mochi_step::before {
  content: attr(data-step);
  position: absolute;
  /* 元画像の紺色の丸は左上角(0,0)から25%の範囲を占めるため、同じ範囲を覆う */
  top: 0;
  left: 0;
  width: 25%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: #494824;
  color: #fff;
  font-size: 1.45em;
  font-weight: bold;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

/* 商品の仕様表。
   現行2カラムサイトの .table2 を新テンプレートのCSSが持っていなかったため移植。
   （items.html / relevant.html / sell_material.html の仕様表が罫線なしで
     崩れて見えていたのを修正）*/
.table2,
.mochi_spec {
  width: 100%;
  max-width: 340px;
  margin: 10px 0 16px;
  font-size: 13px;
  font-weight: normal;
  text-align: left;
  border-collapse: collapse;
  border-left: 1px solid #666;
  border-top: 1px solid #666;
}
.table2 tr th,
.mochi_spec tr th {
  background-color: #FAF7C8;
  vertical-align: top;
  padding: 5px;
  font-weight: normal;
  text-align: center;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  color: #020202;
}
.table2 tr td,
.mochi_spec tr td {
  vertical-align: top;
  padding: 5px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
}
.table2 p,
.mochi_spec p { font-size: 13px; margin: 0; }

/* 関連商品・消耗品ページの商品写真が原寸より拡大されないようにする */
.relevant_area .mein_item_img,
.relevant_area .relevantimg { max-width: 300px; width: 100%; height: auto; }

/* よくあるご質問（ラフ準拠：Q は赤系のアクセント） */
.mochi_faq { margin: 2em 0; }
.mochi_q {
  font-weight: bold;
  color: #FF0000;
  margin: 1.6em 0 .4em;
}
.mochi_q_mark { display: inline-block; margin-right: .8em; }
.mochi_a { margin: 0 0 .6em 2.2em; }

@media screen and (max-width: 640px) {
  /* SPで3列のままだとボタン画像が114pxまで縮んで文字が読めないため2列にする */
  .mochi_btn_grid > li,
  .mochi_btn_grid > li.w50 { flex: 0 0 calc(50% - 6px); }
  /* アンカーボタンはSPでは1列（2列だと文字が折り返してボタン高さがバラつくため） */
  .mochi_anchor_grid > li { flex: 0 0 100%; }
  .mochi_band { padding: 10px 12px; border-left-width: 8px; }
  table.mochi_layout > tbody > tr { gap: 16px; }
  table.mochi_layout > tbody > tr > td:first-child,
  table.mochi_layout > tbody > tr > td + td { flex: 1 1 100%; }
  .mochi_a { margin-left: 1.2em; }
}

/* ============================================================
   背景色の餅つきサイト化
   Excelラフ準拠。ラフの青吹き出し／橙吹き出しの指示：
     ・「スポットクーラーの水色背景部分を木の背景に置き換える」
     ・「現行サイトやスポットクーラーのキャプチャを貼っている箇所は
        背景色はエクセル（カラーコード シート）のほうを参照してください」
   カラーコード：#31320E茶(文字) / #494824茶(塗り) / #FDE9D9肌色 /
                 #E1E0C1ベージュ / #FF0000赤 / #FFFFCCクリーム
   ============================================================ */

/* ① 相談窓口・ジョンソンボックス＝木目背景（ラフ t03 / t07 / t23） */
.cm__responsive_device,
.cm__johnson_box {
  background-color: #E1E0C1;
  background-image: url("../img/mochi/wood_bg.jpg");
  background-repeat: repeat;
  background-size: 512px auto;
}

/* ② お客様の喜びの声＝ベージュ（ラフ t08） */
.customer_voice_area,
.customer_voice_area.item {
  background-color: #E1E0C1;
}
/* 【変更】「＼全国から続々届いています！／」の帯。もとはキャプチャ由来の水色を
   クリーム(#FFFFCC)に置き換えていたが、ラフでは帯そのものが無く、
   セクションのベージュ地に文字だけが乗る形なので背景を外す */
.customer_voice_area .zenkoku,
.customer_voice_area.item .zenkoku {
  background-color: transparent;
}
/* h2「お客様の喜びの声」に内包した小さい前置き。
   h3「本格石臼餅つきセット」の subheadingh4_small_catch と同じ考え方 */
.customer_voice_area h2 .mochi_voice_small_catch {
  display: block;
  font-size: 0.45em;
  font-weight: bold;
  margin-bottom: 0.2em;
}
/* 【変更】「＼全国から続々届いています！／」は色指定が無く既定の黒だった。
   ラフのテキストは #323214、カラーコード シートでは「文字に使う茶色＝#31320E」
   なのでサイト統一色の #31320E に合わせる */
.customer_voice_area .zenkoku p {
  color: #31320E;
}

/* 【変更】お客様の声（テキスト）の仕切り線。
   共有セレクタ群から 1px solid #595959（濃いグレーの実線）が当たっていたが、
   ラフのメモ「間の仕切り線は赤の点線で」に従い、カラーコード シートの
   赤（#FF0000）の点線にする。このセクション限定で上書きしている */
.customer_voice_area .block.no1 .zone[class*="voice_id_"] {
  border-bottom: 2px dotted #FF0000;
}

/* 【変更】横スクロール（キャッチコピー）ブロックの下の仕切り線。
   共通の .cm__cw .block から 1px solid #595959 が当たっており、ここだけ
   黒い実線が残っていた。上の zone と同じ赤の点線に揃える */
.customer_voice_area .cm__cw .block.no0 {
  border-bottom: 2px dotted #FF0000;
}

/* ③ 商品一覧・FAQのエリア＝肌色（ラフ t03 / t07） */
.top.item_guide_area {
  background-color: #FDE9D9;
}

/* ④ 「当店のレンタルは往復送料無料」「30秒でわかる」＝中立グレー（ラフ t02） */
.top.generator_beginning_area {
  background-color: #f6f6f6;
}

/* ⑤ 笑顔をつなぐレンタル＝ベージュ */
.cm__jb_greeting {
  background-color: #E1E0C1;
}

/* ⑥ 紺色(#494824/#494824)のままだった小要素を茶色(#494824)へ */
.f_p_area,
.event.sp,
.format_item p,
.cs_support_s,
.left_relevant.relevant_item .cmp_format_type_box,
.modal__content .item_box .item_d_icon,
.option_zone .optz.parts .optz_rental,
.option_zone .optz.parts .optz_sell,
.od_func_filter_box .od_block:nth-child(1) .item_d_icon,
.ul.s4_icon_unison li,
.cm__cheerful_area.ul.segment .li {
  background-color: #494824;
}

/* ジョンソンボックスの見出し。
   以前は「木目に直接載ると読みにくい」として肌色(#FDE9D9)の帯を敷いていたが、
   下の text-stroke で文字に白フチを付けて視認性を確保したため、帯は外して
   木目の上に直接載せる形にした */
.cm__johnson_box .cm__jb_site994_h2,
.cm__johnson_box h2.cm__jb_site994_h2 {
  padding: 14px 12px;
  box-sizing: border-box;
}

/* 【追加】ラフ指示「文字にも細い白枠線を入れる／文字自体が細くならないように」。
   -webkit-text-stroke だけだと輪郭が文字の内側に食い込んで本体が痩せるため、
   paint-order で「輪郭→塗り」の順に描かせ、縁が外側だけに付くようにしている */
.cm__jb_site994_h2 {
  -webkit-text-stroke: 3px #ffffff;
  paint-order: stroke fill;
}

/* 【追加】ジョンソンボックスの注記。共通ルール（style.css:2923 付近）で
   .johnson_box .jb_hk は display:none にされているが、見出しを「全国往復送料￥0※」に
   変えたことでこの送料注記が必要になったため、このブロックだけ表示する */
.cm__johnson_box .johnson_box .jb_hk {
  display: block;
  font-size: 14px;
  padding: 0 1em 0 0;
  text-align: right;
}

/* 【追加】ラフの背景は3層構造（スポットクーラーと同じ組み方）。
     1層目：セクション全幅に色地（ラフはカラーコードの肌色 #FDE9D9）
     2層目：その上に横幅を絞った白いカラム
     3層目：その上にコンテンツ
   「取り扱い商品一覧」ブロックは内側に白カラムを持つ入れ子が無いため、
   幅を決めている .cm__cw に白を敷いて2層目を作る。
   下の商品一覧ブロック(mochi_items_body)は .select_spot.item_guide_area が
   すでに白なので、セクション側に色地を敷くだけでよい */
.top.item_guide_area.mochi_items_head,
.top.item_guide_area.mochi_items_body {
  background-color: #FDE9D9;
}
/* ラフでは白カラムは1枚で、その中に h2「取り扱い商品一覧」から
   h3「本格石臼餅つきセット」以降までが続けて入る。
   白カラムの外周（左右と上下）にだけ色地が見える形なので、
   上端の色地はこの padding-top で作る */
.top.item_guide_area.mochi_items_head {
  padding-top: 54px;
}
.top.item_guide_area.mochi_items_head .cm__cw {
  background-color: #ffffff;
  /* 下は 12px。0 にすると h2 の文字が白カラムの下端をわずかに超えて
     色地の上に出てしまい、文字が見切れて見える */
  padding: 40px 20px 12px;
  box-sizing: border-box;
}

/* 【追加】Q&A ブロック。ラフでは上の商品一覧と同じ白いカラムの中に入るため、
   セクションに色地、内側の .cm__cw に白を敷いて地続きに見せる。
   このセクションは共通で margin:36px 0 を持っており、そのままだと
   上の白カラムとの間に 36px の色地の帯が出るので上マージンを消す */
.top.item_guide_area.mochi_faq {
  background-color: #FDE9D9;
  /* 共通の margin:36px 0 は上下とも消す。マージンには背景色が乗らないので、
     下に残すと白カラムと次のセクションの間に色の付かない帯ができてしまう。
     白カラム下の外余白は、上端(padding-top:54px)と対称になるよう
     セクション内の padding-bottom で作る */
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 54px;
}
.top.item_guide_area.mochi_faq .cm__cw {
  background-color: #ffffff;
  padding: 10px 20px 40px;
  box-sizing: border-box;
}
/* 【追加】ラフでは Q&A の文章が白いカラムいっぱいには広がらず、
   左右に余白をとって中央に置かれている（カラム1100pxに対して本文は約78%）。
   実装では 1060px と端まで伸びていたため、幅を絞って中央寄せする */
.top.item_guide_area.mochi_faq .cm__cw .block {
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}

/* 【変更】ラフに合わせて Q&A の質問行（Q記号＋質問文）をオレンジに統一する。
   Q記号には共通クラス .red（#FF0000）が付いており、.red は他セクションでも
   使うためここでは上書きせず、.mochi_faq の中の h4 だけに限定して色を当てている */
.top.item_guide_area.mochi_faq .zone h4,
.top.item_guide_area.mochi_faq .zone h4 .red {
  color: #EE7800;
}
/* 直前の商品一覧の白カラムは共通で margin-bottom:54px を持ち、
   そのままだと Q&A との間に色地の帯が入って白が途切れるため詰める */
.top.item_guide_area.mochi_items_body .select_spot.item_guide_area {
  margin-bottom: 0;
}
/* h2「取り扱い商品一覧」と、次の h3「本格石臼餅つきセット」の帯との間は、
   .cm__cw の padding-bottom(40px)＋.block.spot_cooler の padding-top(50px)
   ＋h3 のインライン margin-top(50px) が積み上がって 140px 空いていた。
   .cm__cw の下と h3 の margin-top(HTML側で削除)をなくし、間隔は
   .block.spot_cooler の padding-top(50px) だけで持たせる。
   h3 側を margin で取ると、白カラム(.select_spot)の外へ margin が抜けて
   （margin collapse）そこだけ色地の帯になってしまうため、
   間隔は必ず白カラムの内側の padding で作ること */
.top.item_guide_area.mochi_items_head h2 {
  margin-bottom: 0;
  /* 共通の .font48 は font-size:48px に対して line-height:44px しかなく、
     文字が行の高さをはみ出す。padding-bottom を詰めた結果そのはみ出しが
     白カラムの外に出て「文字の下が切れている」ように見えていたため、
     このブロックだけ行の高さを文字サイズより大きくする */
  line-height: 1.3;
}
/* 下に続く商品一覧の白カラムを、上の白カラムと地続きにする。
   .select_spot.item_guide_area は共通で margin:54px 0 を持つが、
   上側が入ると白が途切れて間に色地の帯が出てしまうため上だけ打ち消す
   （下の 54px はそのまま活かして、白カラム下端の外余白にする） */
.top.item_guide_area.mochi_items_body .select_spot.item_guide_area {
  margin-top: 0;
}

/* 【追加】ラフ準拠：h3「本格石臼餅つきセット」直下のリード文と道具リスト。
   ラフでは商品カードの外にこの2ブロックが置かれ、道具リストは
   ベージュ(#E1E0C1)の角丸ボックスになっている */
/* 【追加】「本格石臼餅つきセット」の見出し（ラフ：肌色地＋赤い縦帯、小見出しを内包）。
   これまで index.html にインラインstyleで書かれていたものをCSSへ移し、
   ページ上部の取り扱い商品一覧と、下部の保証ブロック配下の2箇所で共用する */
.mochi_set_head {
  display: block;
  width: auto;
  box-sizing: border-box;
  text-align: center;
  background-color: #FDE9D9;
  border-left: 6px solid #FF0000;
  padding: 10px 15px;
}
/* 【修正】この見出しの 40px 指定は
   「.select_spot.item_guide_area .block.spot_cooler .subheadingh4」という
   商品一覧の入れ子に依存していたため、同じ見出しでも下部（明朗価格の下）に
   置いたものだけ 30px と小さくなっていた。クラス側で 40px を持たせて揃える */
@media screen and (min-width: 641px) {
  .mochi_set_head {
    font-size: 40px;
  }
}
/* SP も同様に、入れ子に関係なく同じ大きさに揃える（上部22px／下部17.55px と割れていた）。
   22px だと最長の「一緒におすすめのレンタル商品」が折り返して
   「品」だけが2行目に落ちるため 20px にしている */
@media screen and (max-width: 640px) {
  /* 上部の見出しには .select_spot ... .subheadingh4（22px・詳細度0,4,0）が
     当たっているため、同じ詳細度の指定を並べて上書きする */
  .mochi_set_head,
  .select_spot.item_guide_area .block.spot_cooler .mochi_set_head {
    font-size: 20px;
  }
}
/* 見出しの上余白（商品一覧側の h4 で使用。以前はインラインstyleの margin-top:30px） */
.mochi_set_head_mt { margin-top: 30px; }
.top.last_item_area .mochi_set_head {
  max-width: 1100px;
  margin: 2.2em auto 0;
}

/* 【追加】ラフ：保証ボックスの下に入る「ご予約について」の注意書き。
   吹き出しの「ここと同じ色」の指示どおり、店主あいさつの注目ボックスと同じ #FFFFCC */
.mochi_order_note {
  max-width: 1100px;
  margin: 2.5em auto 0;
  padding: 1.6em 2em;
  box-sizing: border-box;
  background-color: #FFFFCC;
  color: #31320E;
  line-height: 1.9;
}
.mochi_order_note p { margin: 0 0 1.2em; }
.mochi_order_note p:last-child { margin-bottom: 0; }
@media screen and (max-width: 640px) {
  .mochi_order_note { padding: 1.2em; font-size: 15px; line-height: 1.7; }
}
.mochi_set_lead {
  max-width: 1100px;
  margin: 24px auto 0;
  padding: 0 10px;
  box-sizing: border-box;
  font-size: 18px;
  line-height: 1.8;
  color: #31320E;
}
.mochi_set_lead p { margin: 0; }
.mochi_set_lead .mochi_set_lead_p2 { margin-top: 1.6em; }
/* 【変更】道具リストの【　】の見出し部分だけ太字にする */
.mochi_set_tools .mochi_tools_label {
  font-weight: bold;
}
.mochi_set_lead .mochi_set_tools {
  margin-top: 1.6em;
  background-color: #E1E0C1;
  border-radius: 10px;
  padding: 1em 1.5em;
  box-sizing: border-box;
}
@media screen and (max-width: 640px) {
  /* 【追加】「本格石臼餅つきセット」の見出し（ラフ：肌色地＋赤い縦帯、小見出しを内包）。
   これまで index.html にインラインstyleで書かれていたものをCSSへ移し、
   ページ上部の取り扱い商品一覧と、下部の保証ブロック配下の2箇所で共用する */
.mochi_set_head {
  display: block;
  width: auto;
  box-sizing: border-box;
  text-align: center;
  background-color: #FDE9D9;
  border-left: 6px solid #FF0000;
  padding: 10px 15px;
}
/* 【修正】この見出しの 40px 指定は
   「.select_spot.item_guide_area .block.spot_cooler .subheadingh4」という
   商品一覧の入れ子に依存していたため、同じ見出しでも下部（明朗価格の下）に
   置いたものだけ 30px と小さくなっていた。クラス側で 40px を持たせて揃える */
@media screen and (min-width: 641px) {
  .mochi_set_head {
    font-size: 40px;
  }
}
/* SP も同様に、入れ子に関係なく同じ大きさに揃える（上部22px／下部17.55px と割れていた）。
   22px だと最長の「一緒におすすめのレンタル商品」が折り返して
   「品」だけが2行目に落ちるため 20px にしている */
@media screen and (max-width: 640px) {
  /* 上部の見出しには .select_spot ... .subheadingh4（22px・詳細度0,4,0）が
     当たっているため、同じ詳細度の指定を並べて上書きする */
  .mochi_set_head,
  .select_spot.item_guide_area .block.spot_cooler .mochi_set_head {
    font-size: 20px;
  }
}
/* 見出しの上余白（商品一覧側の h4 で使用。以前はインラインstyleの margin-top:30px） */
.mochi_set_head_mt { margin-top: 30px; }
.top.last_item_area .mochi_set_head {
  max-width: 1100px;
  margin: 2.2em auto 0;
}

/* 【追加】ラフ：保証ボックスの下に入る「ご予約について」の注意書き。
   吹き出しの「ここと同じ色」の指示どおり、店主あいさつの注目ボックスと同じ #FFFFCC */
.mochi_order_note {
  max-width: 1100px;
  margin: 2.5em auto 0;
  padding: 1.6em 2em;
  box-sizing: border-box;
  background-color: #FFFFCC;
  color: #31320E;
  line-height: 1.9;
}
.mochi_order_note p { margin: 0 0 1.2em; }
.mochi_order_note p:last-child { margin-bottom: 0; }
@media screen and (max-width: 640px) {
  .mochi_order_note { padding: 1.2em; font-size: 15px; line-height: 1.7; }
}
.mochi_set_lead { font-size: 15px; line-height: 1.7; }
  /* 【変更】道具リストの【　】の見出し部分だけ太字にする */
.mochi_set_tools .mochi_tools_label {
  font-weight: bold;
}
.mochi_set_lead .mochi_set_tools { padding: 0.8em 1em; }
}

/* 【追加】ラフ準拠：セット紹介の横長写真（基本セット＋簡易セット）と、
   その下の赤いCTAボタン。以前はここに商品カードが2枚横並びだった */
.mochi_set_visual {
  max-width: 1100px;
  margin: 30px auto 0;
  padding: 0 10px;
  box-sizing: border-box;
  text-align: center;
}
.mochi_set_visual .mochi_set_photo {
  display: block;
}
.mochi_set_visual .mochi_set_photo img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.mochi_set_visual .mochi_set_cta {
  display: block;
  max-width: 560px;
  margin: 26px auto 0;
  padding: 10px 20px 14px;
  background-color: #FF0000;
  border-radius: 4px;
  color: #ffffff;
  text-decoration: none;
  box-sizing: border-box;
}
.mochi_set_visual .mochi_set_cta_lead {
  display: block;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
}
.mochi_set_visual .mochi_set_cta_main {
  display: block;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.4;
}
.mochi_set_visual .mochi_set_cta_arrow {
  margin-left: 0.6em;
}
@media screen and (max-width: 640px) {
  .mochi_set_visual { margin-top: 20px; }
  .mochi_set_visual .mochi_set_cta { margin-top: 18px; padding: 8px 14px 12px; }
  .mochi_set_visual .mochi_set_cta_lead { font-size: 13px; }
  .mochi_set_visual .mochi_set_cta_main { font-size: 20px; }
}

/* ⑦ 上記で拾いきれなかった紺色(#494824 系)の残り。
   共有セレクタ群（style.css:2609 付近）で #494824 が当たっている要素のうち、
   ページ上に実際に描画されるものを茶色(#494824)へ。 */
#page_top,
#page_menu,
.f_p_area li,
.block_zone li,
.ul.s4_icon_unison li {
  background-color: #494824;
}
/* 「往復送料￥0」列の1つ目だけ赤にする既存指定は残す */
.ul.s4_icon_unison li:nth-child(1) {
  background-color: #FF0000;
}

/* ⑧ darkblue（濃紺）の罫線をブランドの茶色へ */
.product_of_individual .p_item.zone h3,
.product_of_individual .zone.tittle h3,
.product_of_individual .appeal.zone .option_zone h3,
.spot_bazooka_q_and_a .tittle h3 {
  border-left-color: #494824;
}
.zisya_container .box {
  border-color: #494824;
}

/* ⑨ メディア掲載＝ベージュ（ラフ t17） */
.top_p.media_area,
.media_area {
  background-color: #E1E0C1;
}

/* ⑩ 黄色バナー内のリンクがスポットクーラーの水色(#31320E)だったため、
   ブランドの茶色に。下線は残してリンクと分かるようにする */
.spot_attention.large_order_link a {
  color: #31320E;
  text-decoration: underline;
}

/* メディア掲載の新聞名＋説明文キャプション（ラフ t17） */
.mochi_media_cap {
  font-size: 13px;
  line-height: 1.6;
  color: #31320E;
  margin: 8px 0 0;
  text-align: left;
}

/* 【追加】メディア掲載はラフどおり「ぐんま経済新聞」1件のみになった。
   共通CSSは3枠を横並びにする前提で 330x222px の固定サイズなので、
   そのままだと1枚が左端に小さく寄り、さらに縦長の紙面画像(650x580)が
   高さ222pxの枠からはみ出す。1枚を中央に、原寸比のまま置き直す */
.top_p.media_area .flex_layout {
  justify-content: center;
}
.top_p.media_area .media_item.thumbnail {
  width: 100%;
  /* ラフでは紙面が原寸(650px)で大きく載っているのでそこまで許容する */
  max-width: 650px;
  height: auto;
}
/* 見出しは 48px に対し共通の行間が 44px しかなく行が重なるため広げる */
.top_p.media_area h2 {
  line-height: 1.3;
}
/* ラフの紙面には拡大アイコンが乗っていないので消す（クリックでの拡大は残る） */
.top_p.media_area .media_item.thumbnail .modal_image_box::before {
  content: none;
}
.top_p.media_area .media_item.thumbnail .modal_image_box {
  height: auto;
}
.top_p.media_area .media_item.thumbnail img.modal_thumbnail {
  width: 100%;
  height: auto;
  object-fit: contain;
}
/* ⑪ 商品ページに残っていた紺色。
   .blue（青文字ユーティリティ）と content_block の見出し罫線を
   ブランドの茶色へ。ラフでも青文字は使われていない。 */
.blue {
  color: #494824;
}
.content_block h3 {
  border-left-color: #494824;
}

/* 上の .content_block h3 では詳細度が足りず darkblue が勝っていたため、
   元ルールと同じセレクタで上書きする */
.product_of_individual .content_block.sentence h3,
.product_of_individual .p_item.zone h3,
.product_of_individual .zone.tittle h3,
.product_of_individual .intro_item.zone h2,
.product_of_individual .block.features_item h3,
.product_of_individual .appeal.zone h3,
.spot_bazooka_q_and_a .tittle h3 {
  border-left-color: #494824;
}

/* ⑫ アンカーバナーの丸い矢印（関連商品・消耗品ページ）も茶色へ */
.cm__round_arrow {
  background-color: #494824;
}

/* ⑬ SP表示でのみ現れていた青の残り
   ・「大人気の理由」内アコーディオン「▼詳しくはこちら」の純青(#0000ff)
   ・「30秒でわかる」上のメリット一覧 li の紺(#494824) */
.cm__poplar_block .accordion_switch,
.accbox .accordion_switch {
  color: #31320E;
}
.generator_beginning_area .block:nth-child(2) ul li {
  background-color: #494824;
}

/* common_style.css の
   `.accordion_switch.right.mb-0.small1.d-block.d-lg-none { color: blue }`
   が詳細度で勝っていたため、同じセレクタで上書きする */
.right.mt-4.mb-0.small1.d-block.d-lg-none,
.accordion_switch.right.mb-0.small1.d-block.d-lg-none {
  color: #31320E;
}

/* ⑭ 「15時までのご注文で即日出荷OK」帯（PC/SP両方）の背景。
   もとの紺色→茶色(#494824)としていたが、ラフ指示「現行サイトの木の背景を使いたい」に
   合わせて、他の木目ブロック（.cm__responsive_device / .cm__johnson_box）と同じ
   木目背景に統一する */
.event.pc,
.event.sp,
.event_div_sp,
section.event {
  background-color: #E1E0C1;
  background-image: url("../img/mochi/wood_bg.jpg");
  background-repeat: repeat;
  background-size: 512px auto;
}
/* 上の木目背景に変えると白文字が埋もれて読めなくなる。
   ラフのメモ「『15時までのご注文で』は、サイト名と同じ茶色に変更
   （白だと、背景の木に重ねると視認性低そうなので）」に従って茶色にする。
   PC は .conditions p、SP は .p1（「15時までのご注文で」「1泊2日～長期歓迎」）が白指定 */
.event.pc .conditions p,
.event .p1,
.event .conditions .p1 {
  color: #31320E;
}

/* 【修正】アンカーボタンは5件で2列。justify-content:center だと5件目が
   中央に浮いてしまい、ラフ（5件目も左列）と合わないため左寄せにする */
.mochi_anchor_grid { justify-content: flex-start; }

/* 【修正】list.html の見出しに色指定が無く既定の黒になっていたため、
   Excelカラーコードの茶色（文字色）を当てる */
.select_spot h3.anchor_down,
.select_spot h4.subheadingh4,
.select_spot h3.subheadingh4 {
  color: #31320E;
}

/* 【修正】ラフの指定に合わせて subheadingh4 の見出しを h4 から h3 に変更した際、
   素の h3 の既定（margin-bottom:20px）で下余白が 5px 増えるため、
   h4 のときと同じ 15px に揃える */
.select_spot h3.subheadingh4 {
  margin-bottom: 15px;
}

/* 【修正】PC表示時の商品グループ見出しを 40px にする。
   もとは h3「本格石臼餅つきセット」だけを対象にしていたが、ラフでは
   「一緒におすすめのレンタル商品」「その他の単品レンタル」なども同じ大きさなので、
   subheadingh4 全体（h3/h4 どちらでも）を対象にする。
   SP表示は max-width:640px 側の既存指定をそのまま活かすため、min-width:641px に限定 */
@media screen and (min-width: 641px) {
  .select_spot.item_guide_area .block.spot_cooler .subheadingh4 {
    font-size: 40px;
  }
}

/* 【修正】「レンタル開始日前日にお届け」セクションの背景。
   ラフでは肌色(#FDE9D9)だが、テンプレートで white 固定になっていた */
.before_delivery.delivery_paragraph {
  background-color: #FDE9D9;
}
/* 【変更】このセクションだけ本文が幅1100px・行間1.35倍で、餅つき用に作った他ブロック
   （幅1000px前後・行間1.9倍）と比べて1行が長いうえに行が詰まっており、
   文字が枠いっぱいに押し込まれて見えていた。他ブロックに合わせる */
/* 【再修正】見本サイト（mogiten-rentaru.com/spotcooler/）では、この見出しは
   幅1100px・48px・行間70px で2行に収まっている。
   ブロック全体を1000pxに絞ったせいで「ために、」だけが3行目に落ちていたため、
   見出しは見本と同じ全幅に戻し、本文だけを1000pxに保つ */
.before_delivery.delivery_paragraph .rental_of_flow > p,
.before_delivery.delivery_paragraph .rental_of_flow > h4 {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.before_delivery.delivery_paragraph .rental_of_flow p {
  line-height: 1.9;
}

/* 商品写真が原寸(282px)より拡大されてボケないようにする */
img[src$="denki_main.webp"] {
  max-width: 282px;
  width: 100%;
  height: auto;
}

/* 【修正】「笑顔をつなぐレンタル 上州物産」ブロックは、外側(.cm__jb_greeting)を
   ベージュにしても内側のこのdivが淡い水色(#E1E0C1)のままで覆っていた。
   ※以前の青検出は「青−緑>10」で判定しており、この色(差ちょうど10)を
     取りこぼしていた。色相(HSL)判定に変えて発見。 */
.cm__jb_greeting .cm__connecting_smiles,
.cm__connecting_smiles.cm__rental_site_mode {
  background-color: #E1E0C1;
}

/* ============================================================
   餅つきトップページ 追加セクション（ラフ準拠）
   ・お客様の声リード文／写真ストリップ
   ・店主あいさつ（注目ボックス）＋バナー2点
   ・餅つき道具の整備状況
   ・杵を壊してしまっても弁償不要
   ・わかりやすい餅つきのやり方（動画・章立て）
   色はエクセル「カラーコード」シートのパレットのみ使用
     #31320E 文字茶 / #494824 塗り茶 / #FDE9D9 肌色
     #E1E0C1 ベージュ / #FF0000 赤 / #FFFFCC クリーム
   ============================================================ */

/* --- お客様の声：リード文 ------------------------------------ */
.mochi_voice_lead {
	text-align: center;
	color: #31320E;
	margin: 0 auto 1.5em;
	max-width: 1000px;
	padding: 0 1em;
	box-sizing: border-box;
}
.mochi_voice_lead p {
	line-height: 1.9;
	margin: 0 0 .6em;
}
.mochi_voice_lead .mochi_voice_lead_st {
	font-weight: bold;
	font-size: 1.08em;
	margin-bottom: 0;
}

/* --- お客様の声：写真ストリップ9枚 ---------------------------- */
/* PCは9枚横並び。狭い画面では折り返すのではなく横スクロールさせて、
   ラフの「帯」に見える形をどの幅でも保つ。 */
.mochi_voice_strip {
	display: flex;
	list-style: none;
	margin: 0 auto 1.2em;
	padding: 0;
	max-width: 1200px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.mochi_voice_strip li {
	flex: 1 0 auto;
	margin: 0;
	padding: 0;
	line-height: 0;
}
.mochi_voice_strip img {
	display: block;
	width: 100%;
	min-width: 100px;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 1 / 1;
}

/* --- 【追加】ラフにあって未実装だった3ブロック ------------------ */

/* スタッフ写真の吹き出し（ラフ：商品選びのご相談、歓迎いたします！） */
.cm__customer_support .mochi_cs_balloon {
  max-width: 1100px;
  margin: 0 auto 6px;
  padding: 0 10px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.7;
  color: #31320E;
}

/* その下のリード文（ラフ：必要な道具をセットにしました！） */
.mochi_set_intro {
  max-width: 1100px;
  margin: 18px auto 0;
  padding: 0 10px;
  text-align: center;
  color: #31320E;
  line-height: 1.8;
}
.mochi_set_intro p { margin: 0; font-size: 18px; }
.mochi_set_intro .mochi_set_intro_lead {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: .3em;
}


@media screen and (max-width: 640px) {
  .cm__customer_support .mochi_cs_balloon { font-size: 15px; }
  .mochi_set_intro p { font-size: 15px; }
  .mochi_set_intro .mochi_set_intro_lead { font-size: 19px; }
}
/* --- 店主あいさつ（注目ボックス） ------------------------------ */
.mochi_attention_area {
	background-color: #fff;
	padding: 3em 1em;
}
.mochi_attention_box {
	max-width: 1000px;
	margin: 0 auto;
	padding: 1.6em 2em 2em;
	box-sizing: border-box;
	background-color: #FFFFCC;
	/* 【変更】ラフに合わせる。枠線はオレンジ(#E36C0A)ではなく黄色、
	   本文は太字・黒 */
	border: 3px solid #FFC000;
	color: #000000;
	font-weight: bold;
	/* 【変更】1.9 は行間が広く間延びしていたため詰める */
	line-height: 1.7;
}
.mochi_attention_box p {
	margin: 0 0 1.2em;
}
.mochi_attention_ttl {
	text-align: center;
	line-height: 0;
	margin-bottom: 1em !important;
}
.mochi_attention_ttl img {
	width: 150px;
	height: auto;
	max-width: 60%;
}
/* 写真まわりに本文を回り込ませる。overflow:hidden で回り込みを箱内で終わらせる */
.mochi_abe_wrap {
	overflow: hidden;
}
.mochi_abe_photo {
	float: left;
	margin: 0 1.4em 1em 0 !important;
	line-height: 0;
}
.mochi_abe_photo img {
	width: 191px;
	height: auto;
	max-width: 100%;
}

/* --- バナー2点 ------------------------------------------------ */
.mochi_banner_row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: 1.5em;
	max-width: 1000px;
	margin: 2em auto 0;
}
.mochi_banner_row > a {
	text-decoration: none;
	display: block;
}
.mochi_banner_photo {
	flex: 0 1 320px;
	line-height: 0;
}
.mochi_banner_photo img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 10px;
}
/* ノロウイルスのバナーは画像ではなくHTML＋CSSで作成している。
   文言差し替えやレスポンシブに強く、拡大しても文字がぼやけない。 */
.mochi_banner_note {
	flex: 0 1 380px;
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: .5em;
	background-color: #fff;
	/* 【変更】ラフに合わせて、左の画像バナー（banner_owner_video.png）と同じ青にする。
	   青は画像の枠線から採色（#0469CB / #0063CB）。文字も同じ青で、
	   赤の2行（em）だけ #FF0000 のまま残す */
	border: 3px solid #0066CC;
	border-radius: 12px;
	padding: .9em 1.1em;
	box-sizing: border-box;
	color: #0066CC;
	font-weight: bold;
	line-height: 1.6;
}
.mochi_banner_note_txt {
	font-size: 1.02em;
	/* ラフでは4行が中央揃え */
	text-align: center;
}
.mochi_banner_note em {
	font-style: normal;
	color: #FF0000;
}
.mochi_banner_note_arrow {
	font-size: 2.6em;
	line-height: 1;
	color: #0066CC;
	flex: 0 0 auto;
}

/* --- 餅つき道具の整備状況 -------------------------------------- */
.mochi_mainte_area {
	background-color: #FDE9D9;
	padding: 3em 1em;
}
.mochi_mainte_area h2 {
	text-align: center;
	color: #31320E;
	font-weight: bold;
	/* 【変更】他セクションの h2 は PC 48px／SP 24px で統一されているのに、
	   ここだけ 40px（SP 21.45px）だったので合わせる。
	   行間は共通の 44px だと 48px の文字に足りず下が見切れるため 1.3 にする */
	font-size: 48px;
	line-height: 1.3;
	margin: 0 0 1.2em;
}
.mochi_mainte_card {
	max-width: 1000px;
	margin: 0 auto;
	padding: 2em;
	box-sizing: border-box;
	background-color: #fff;
	color: #31320E;
	/* 【変更】ラフでは本文も太字。写真下のキャプションだけラフどおり通常の太さに戻す */
	font-weight: bold;
	line-height: 1.9;
}
.mochi_mainte_card > p {
	margin: 0 0 1.2em;
}
.mochi_mainte_lead {
	text-align: center;
	font-weight: bold;
	font-size: 1.1em;
}
.mochi_mainte_list {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
	gap: 1em;
}
.mochi_mainte_list li {
	flex: 1 1 0;
	min-width: 140px;
	margin: 0;
	padding: 0;
	font-size: .88em;
	font-weight: normal;
	line-height: 1.6;
}
.mochi_mainte_list img {
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: .4em;
}
.mochi_mainte_link {
	text-align: right;
	margin: 0;
	font-weight: bold;
}
.mochi_mainte_link a {
	/* 【変更】ラフどおり青のリンク。青はバナーと同じ #0066CC で統一 */
	color: #0066CC;
	text-decoration: underline;
}

/* --- 杵を壊しても弁償不要 -------------------------------------- */
.mochi_bensho_area {
	background-color: #fff;
	/* 【変更】下は次の「やり方」ボックスとの間隔を .mochi_howto_area 側で作るため 0 */
	padding: 3em 1em 0;
	color: #31320E;
}
/* 【変更】弁償不要 → やり方ボックスの間が 175px も空いていた。内訳は
   最後の p の margin-bottom 21.6px ＋ 共通 .cm__cw の padding-bottom 50px
   ＋ セクションの padding-bottom 54px ＋ 次の .cm__cw の padding-top 50px。
   ラフではこの間は 45px 程度なので、共通 .cm__cw の余白をこの2セクションだけ
   打ち消して作り直す */
.mochi_bensho_area .cm__cw {
	padding-bottom: 0;
}
.mochi_howto_area .cm__cw {
	padding-top: 24px;
}
/* 【変更】小見出し「餅つき道具レンタル専門店なら」は h2 の外の <p>（18px）だったため、
   「お客様の喜びの声」の h2 と同じく h2 の中の span にして 0.45em＝21.6px に揃える */
.mochi_bensho_area h2 .mochi_h2_small_catch,
.top_p.media_area h2 .mochi_h2_small_catch {
	display: block;
	font-size: 0.45em;
	font-weight: bold;
	margin-bottom: 0.2em;
}
.mochi_bensho_area h2 {
	text-align: center;
	color: #31320E;
	font-weight: bold;
	font-size: 48px;
	line-height: 1.3;
	margin: 0 0 1em;
}
.mochi_bensho_alert {
	max-width: 1000px;
	margin: 0 auto 1.2em;
	color: #FF0000;
	line-height: 1.9;
}
.mochi_bensho_photos {
	display: flex;
	flex-wrap: wrap;
	gap: 1.2em;
	max-width: 1000px;
	margin: 0 auto 1.2em;
}
.mochi_bensho_photos img {
	flex: 1 1 300px;
	width: 100%;
	max-width: 100%;
	height: auto;
	object-fit: cover;
	min-width: 0;
}
.mochi_bensho_body {
	max-width: 1000px;
	margin: 0 auto;
	line-height: 1.9;
}
.mochi_bensho_body p {
	margin: 0 0 1.2em;
}
.mochi_red {
	color: #FF0000;
}

/* --- わかりやすい餅つきのやり方 -------------------------------- */
.mochi_howto_area {
	background-color: #fff;
	padding: 0 1em 3em;
}
.mochi_howto_box {
	max-width: 1000px;
	margin: 0 auto;
	padding: 2em;
	box-sizing: border-box;
	background-color: #E1E0C1;
	border-radius: 30px;
	color: #31320E;
	line-height: 1.9;
}
.mochi_howto_box h4 {
	font-size: 1.35em;
	font-weight: bold;
	color: #31320E;
	margin: 0 0 1em;
	text-align: left;
}
.mochi_howto_box p {
	margin: 0 0 1.2em;
}
.mochi_howto_link {
	padding-left: 1em;
}
.mochi_howto_link a {
	/* 【変更】ラフではこのリンクだけ青・下線なし。青は他と同じ #0066CC */
	color: #0066CC;
	text-decoration: none;
}
.mochi_howto_video {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 1.5em;
}
.mochi_howto_movie {
	flex: 1 1 420px;
	min-width: 0;
}
/* 16:9 を保ったまま伸縮させる */
.mochi_howto_movie iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
	display: block;
}
.mochi_howto_chapter {
	flex: 1 1 220px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-weight: bold;
	min-width: 0;
}
.mochi_howto_chapter li {
	margin: 0 0 .45em;
	padding: 0;
	line-height: 1.5;
}
.mochi_howto_chapter span {
	display: inline-block;
	min-width: 5.2em;
}

/* --- SP（〜640px）調整 ---------------------------------------- */
@media screen and (max-width: 640px) {
	.mochi_attention_area,
	.mochi_mainte_area {
		padding: 2em .8em;
	}
	.mochi_bensho_area {
		padding: 2em .8em 0;
	}
	/* SP も他セクションの h2 と同じ 24px に揃える */
	.mochi_mainte_area h2,
	.mochi_bensho_area h2 {
		font-size: 24px;
	}
	.mochi_howto_area {
		padding: 0 .8em 2em;
	}
	.mochi_attention_box,
	.mochi_mainte_card,
	.mochi_howto_box {
		padding: 1.2em;
	}
	/* SPでは写真を回り込ませず、中央に置いて読みやすくする */
	.mochi_abe_photo {
		float: none;
		text-align: center;
		margin: 0 0 1em !important;
	}
	.mochi_mainte_list li {
		flex: 0 0 calc(50% - .5em);
		min-width: 0;
	}
	.mochi_banner_note {
		flex: 1 1 100%;
	}
	.mochi_banner_photo {
		flex: 1 1 100%;
	}
	.mochi_howto_box h4 {
		font-size: 1.12em;
	}
	/* SPでは横スクロールにせず3列×3段で折り返す。
	   スクロールに気づかず写真を見落とすのを防ぐため。 */
	.mochi_voice_strip {
		flex-wrap: wrap;
		overflow-x: visible;
	}
	.mochi_voice_strip li {
		flex: 0 0 33.3333%;
	}
	.mochi_voice_strip img {
		min-width: 0;
	}
}

/* --- もちつきCooker メリットバナー（denki.html） ----------------- */
.mochi_merit_banner_area {
	background-color: #fff;
	padding: 2.5em 1em;
	text-align: center;
}
.mochi_merit_banner_area img {
	display: block;
	width: 100%;
	max-width: 720px;
	height: auto;
	margin: 0 auto;
}
.mochi_merit_banner_area .asterisk {
	max-width: 720px;
	margin: .8em auto 0;
	text-align: left;
	color: #31320E;
}

/* --- 6つのメリットアイコン群（items.html） ----------------------- */
/* 画像ではなくHTML＋CSS。ラフの青吹き出し「サイト名深緑より少しだけ
   明るい色 #494824」に従った塗り。 */
/* flexのcalcだと端数で3列目が折り返してしまうため、grid で3列を確定させる */
.mochi_merit_icons {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	list-style: none;
	margin: 2em auto 1.2em;
	padding: 0;
	gap: 1em;
	max-width: 900px;
}
.mochi_merit_icons li {
	min-width: 0;
	margin: 0;
	padding: .9em .6em;
	box-sizing: border-box;
	background-color: #494824;
	color: #fff;
	text-align: center;
	font-size: .95em;
	line-height: 1.3;
	white-space: nowrap;
}
.mochi_merit_icons li strong {
	font-size: 1.35em;
	font-weight: bold;
	margin-left: .2em;
}
.mochi_merit_note {
	max-width: 900px;
	margin: 0 auto 2em;
	line-height: 1.9;
	color: #31320E;
}

@media screen and (max-width: 640px) {
	.mochi_merit_icons {
		gap: .5em;
	}
	.mochi_merit_icons {
		grid-template-columns: repeat(2, 1fr);
	}
	.mochi_merit_icons li {
		font-size: .78em;
		padding: .7em .3em;
	}
	/* SPは幅が足りないので折り返しを許可し、数値を改行して2段で見せる */
	.mochi_merit_icons li {
		white-space: normal;
	}
	.mochi_merit_icons li strong {
		font-size: 1.2em;
		display: block;
		margin-left: 0;
	}
}

/* --- 取り扱い商品一覧の2枚バナー --------------------------------- */
/* 【修正】以前は左が 414×137 のカテゴリバナー、右が 210×57 のボタン画像で、
   同じ枠に入れると右だけ2.5倍に引き伸ばされ、大きさも見た目もそろって
   いなかった。現行サイトの対になっている「価格と詳細はこちら」バナー
   （どちらも 320×70）に差し替え、上限幅を設けて等倍に近づけている。 */
.item_guide_area .banner_category .spot img {
	width: 100%;
	max-width: 400px;
	height: auto;
	aspect-ratio: 320 / 70;
	object-fit: fill;
	display: block;
	margin: 0 auto;
}

/* --- 商品ブロックの料金ウィジェット内 商品写真 -------------------- */
/* 【修正】以前は本番サーバーの絶対URL（joshubussan.heteml.net）を参照していて
   ローカルでは表示されず、表示できたものも縦横比がバラバラだった。
   プロジェクト内の商品写真に差し替えたうえで、枠のサイズを固定して
   どの商品でも同じ大きさで並ぶようにしている。
   object-fit:contain なので写真が切れたり歪んだりしない。 */
.mein_item img,
.mein_item_img {
	width: 100%;
	max-width: 450px;
	aspect-ratio: 6 / 5;
	object-fit: contain;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* --- 商品カード（1カラム版）の列幅の是正 ------------------------------
   style.css:921 の .top.item_guide_area .cm__d_l{width:58%} は、
   右列 .cm__d_r{width:42%} と対で使う本番テンプレートの指定。
   1カラム化した餅サイトの商品カードには .cm__d_r が存在しない
   （index.html 内に0件）ため、右42%が空きのまま内容だけが縮んでいた。
   .cm__d_r を持たないカード（子が .cm__d_l 1個だけ）に限って全幅へ戻す。
   SPは 1803行のグループ指定で既に width:100% なので影響しない。 */
.top.item_guide_area .cm__item_amount_area > .cm__d_l:only-child {
	width: 100%;
}

/* ============================================================
   【修正】スマホ：取り扱い商品一覧まわりの肌色の帯を消す
   ラフ（スマホ）では、木目の帯のすぐ下から「本格石臼餅つきセット」の
   肌色見出しまで、背景は白のまま途切れない。
   実装では下の3つが肌色（#FDE9D9）の帯として見えていたため打ち消す。
     1) h2 の上  … .mochi_items_head の padding-top:54px
     2) h2 の下  … .mochi_items_body の地色（白カラムの外側 15px 分）
     3) Q&A の下 … .mochi_faq の padding-bottom:54px
   ※SPの指定は 5953行目あたりにもあるが、後方の 6228行目の
     「.top.item_guide_area.mochi_items_head{padding-top:54px}」と
     詳細度が同じで、後に書かれている方が勝っていたため、
     ここ（ファイル末尾）にまとめて置いて確実に効かせている。
   ============================================================ */
@media screen and (max-width: 640px) {
  .top.item_guide_area.mochi_items_head {
    padding-top: 0;
  }
  /* ラフの h2 まわりの余白（上55px／下28px相当）に合わせて詰める */
  .top.item_guide_area.mochi_items_head .cm__cw {
    padding: 50px 20px 0;
  }
  .top.item_guide_area.mochi_items_body,
  .top.item_guide_area.mochi_faq {
    background-color: #ffffff;
  }
  .top.item_guide_area.mochi_faq {
    padding-bottom: 0;
  }
  /* 白カラムの外に出ていた 15px の上マージンを消す（ここが帯になっていた） */
  .top.item_guide_area.mochi_items_body .select_spot.item_guide_area .block.spot_cooler {
    margin-top: 0;
  }
  /* h2「取り扱い商品一覧」と肌色見出しの間。共通の
     「.subject.mein_guide_phrase .subheadingh4{margin:50px 0 25px}」を
     同じ詳細度で上書きし、間隔は .subject の padding-top(30px) だけにする */
  .subject.mein_guide_phrase .mochi_set_head {
    margin-top: 0;
  }
}


/* ============================================================
   Q&A アコーディオン（スマホ表示のみ）
   見本：https://www.mogiten-rentaru.com/spotcooler/question.html
   ・JavaScript は使わず、チェックボックス＋label だけで開閉している
   ・PC は従来どおり全問が開いたまま。開閉するのは @media (max-width:640px) の中だけ
   ・見本サイトの .accbox / .ocssacc をそのまま使うと、common_style.css の
     「スマホでは .accbox label を紺地＋白文字にする」等の指定を大量に引き継いで
     しまうため、同じ仕組みのまま専用クラスで作り直している
   ・値は見本サイトを実測して合わせている（375px時）
       質問文  14px / 太さ normal / 黒 / 行間110%
       区切り線 1px solid #A7A7A7（各項目の下）
       ＋／−   22px角の画像。項目の右端
       回答     padding 5px
   ============================================================ */
/* 開閉用チェックボックスは見せない（display:none だとキーボード操作で
   たどれなくなるため、透明にして位置だけ潰している） */
.mochi_acc_chk {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
}
/* label は既定でインラインのため、中の h4 が従来どおりブロックとして
   並ぶよう block にしておく（PCの見た目は変えない） */
.mochi_acc_head {
  display: block;
}

@media screen and (max-width: 640px) {
  /* 見本と同じく、区切りは各項目の下の細い横線 */
  .mochi_acc {
    border-bottom: 1px solid #A7A7A7;
    padding-bottom: 15px;
  }
  /* 質問行。右側に＋／−のスペースを空ける */
  .mochi_acc_head {
    position: relative;
    margin: 0;
    padding: 12px 34px 12px 0;
    cursor: pointer;
  }
  /* 【変更】質問文をラフ指定のオレンジ・太字（16.875px）から、
     見本サイトと同じ「黒・太さnormal・14px」に変更。
     .top.item_guide_area.mochi_faq .zone h4（#EE7800・詳細度0,5,0）に
     負けるため、同じ詳細度のセレクタで後から上書きしている。
     ※PCはこの media の外なのでオレンジのまま */
  .top.item_guide_area.mochi_faq .zone .mochi_acc_head h4,
  .top.item_guide_area.mochi_faq .zone .mochi_acc_head h4 .red {
    margin: 0;
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.1;
  }
  /* ＋／− は見本と同じ共通アセットを使う。
     /common/img/ にある全サイト共通の画像なのでアップロード不要
     （このCSSは /common/mochituki_test/css/ に置かれるため ../../img/ で届く）。
     原寸40x40を22pxに縮めて表示している */
  .mochi_acc_head::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 4px;
    width: 22px;
    height: 22px;
    margin-top: -11px;
    background-image: url("../../img/css_q_plus.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  .mochi_acc_chk:checked + .mochi_acc_head::after {
    background-image: url("../../img/css_q_minus.webp");
  }
  /* 回答。閉じているときは高さ0。max-height でアニメーションさせている */
  /* .item_guide_area div{overflow:initial} に負けて overflow:hidden が効かず、
     閉じている回答が下の質問に重なってタップの邪魔をしていたため、
     セクション名を足して詳細度を上げている */
  .top.item_guide_area .mochi_acc_body {
    max-height: 0;
    padding: 0 5px;
    overflow: hidden;
    opacity: 0;
    background-color: #FDE9D9;
    transition: max-height .35s ease, opacity .3s ease, padding .35s ease;
  }
  .mochi_acc_chk:checked ~ .mochi_acc_body {
    max-height: 200em;
    padding: 5px;
    opacity: 1;
  }
  .mochi_acc_body p:last-child {
    margin-bottom: 0;
  }
}

/* ============================================================
   ファーストビューのキャッチに
   「万一のイベント中止時も再レンタル保証で安心です。」を1行追加した分の調整
   （適用範囲：トップページのFVのみ／PC幅 641px以上。SPは変更なし）
   追加により行数が 5行 → 6行 になり、白ボックスが 204px → 233px に伸びて
   写真の帯（240px）からはみ出し、.mochi_fv の overflow:hidden で
   上下が切れていた（画面幅1280pxで上15px・下-9px）。
   ============================================================ */
@media screen and (min-width: 641px) {
  /* ラフの実測値 26px／行間1.3 のままだと6行が帯に収まらないため、
     1行増えた分を文字サイズと行間で吸収する
       font-size  : 26px → 24px
       line-height: 1.3  → 1.25
     ※最長行「全国往復送料無料※でご指定場所まで宅配便でお届けいたします。」で
       約700px。白ボックスの内寸860pxに対して余裕がある */
  .mochi_fv_copy p {
    font-size: 24px;
    line-height: 1.25;
  }
  /* ボックスの位置。下端の余白 108px → 120px（＝ボックス高さ211pxの半分＋約14px）。
     これで帯の上下に同じだけ写真が見える（画面幅1280px・900pxとも上下14px） */
  .mochi_fv_copy {
    top: min(65%, calc(100% - 120px));
  }
}
/* 【修正】PCレイアウトの最小幅は 1100px なので、画面幅 641〜900px でも
   帯の実寸は 1100 x 9/48 ＝ 206px にしかならず、min-height:240px が
   901px以上にしか掛かっていなかったためボックスが上下とも切れていた
   （画面幅900pxで上-18px・下-9px）。901px以上と同じ下限を掛けて揃える */
@media screen and (min-width: 641px) and (max-width: 900px) {
  .mochi_fv_photos {
    min-height: 240px;
  }
}

/* ============================================================
   スマホ：セット紹介の h3 見出し（肌色の帯）の文字サイズ
   見本サイト（mogiten-rentaru.com/spotcooler/）の同じ見出し
   .subheadingh4 を画面幅375pxで実測すると 22px／太字／行間1.2 だったので
   その値に合わせる。
     変更前：20px（6330行あたりの指定）→ 変更後：22px
   ※20px にしていたのは「一緒におすすめのレンタル商品」が折り返して
     「品」だけ2行目に落ちるのを避けるためだったが、原因は文字サイズでは
     なく見出しの左右マージン（22px）で、帯の内寸288pxに対して文字が308px
     必要だったこと。下のボタン列は左右マージンが無く帯だけが内側に入って
     いて、そもそも揃っていなかった。マージンを外して帯をボタンと同じ幅
     （368px）にすることで、22pxのまま1行に収まる
   ============================================================ */
@media screen and (max-width: 640px) {
  .mochi_set_head,
  .select_spot.item_guide_area .block.spot_cooler .mochi_set_head {
    font-size: 22px;
    line-height: 1.2;
  }
  /* 帯の左右を下のボタン列と揃える（左端 26px → 4px） */
  .select_spot.item_guide_area .block.spot_cooler .mochi_set_head {
    margin-left: 0;
    margin-right: 0;
  }
}

/* ============================================================
   お客様の声：写真ストリップ9枚
   見本＝現行餅つきサイト（mochitsuki-rental.com）のトップページ。
   実測すると 1枚 233x250（元画像 560x600）に margin:5px が付いていて、
   3枚ずつ・写真どうしに10pxの隙間が空いている。
   当ページは隙間ゼロ・正方形で詰めていて1枚の大きなコラージュに
   見えていたため、見本と同じ「隙間あり・やや縦長」に合わせる。
     変更前：gapなし／aspect-ratio 1/1
     変更後：写真の外に5px（＝間隔10px）／aspect-ratio 560/600
   ※PC（横スクロールの帯）は見た目が変わらないよう比率だけ合わせる
   ============================================================ */
.mochi_voice_strip img {
  aspect-ratio: 560 / 600;
}
@media screen and (max-width: 640px) {
  .mochi_voice_strip {
    padding: 0 5px;
    box-sizing: border-box;
  }
  .mochi_voice_strip li {
    flex: 0 0 calc(33.3333% - 10px);
    margin: 5px;
  }
}

/* ============================================================
   注目ボックス（店主あいさつ）の「▼続きを見る」
   見本＝現行スマホサイト mochitsuki-rental.com/sp/
   　・写真＋最初の2段落までを表示し、残りを隠す
   　・右寄せ・青(#4169E1)・13px のテキストで開閉
   見本は jQuery の slideToggle だが、こちらはQ&Aのアコーディオンと
   同じくチェックボックス＋labelのCSSだけで動かしている。
   開閉するのはスマホ（〜640px）だけで、PCは全文表示のまま。
   ============================================================ */
.mochi_more_chk {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
}
/* PCでは開閉ボタンを出さず、本文も常に表示 */
.mochi_more_btn {
  display: none;
}

@media screen and (max-width: 640px) {
  .mochi_more_btn {
    display: block;
    margin: 0 0 1.2em;
    color: #4169E1;
    font-size: 13px;
    font-weight: normal;
    text-align: right;
    cursor: pointer;
  }
  .mochi_more_btn::after {
    content: "▼続きを見る";
  }
  .mochi_more_chk:checked ~ .mochi_more_btn::after {
    content: "▲閉じる";
  }
  /* 閉じているときは高さ0。max-height でアニメーションさせている */
  .mochi_attention_box .mochi_more_body {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .4s ease, opacity .3s ease;
  }
  .mochi_more_chk:checked ~ .mochi_more_body {
    max-height: 400em;
    opacity: 1;
  }
}

/* 注目ボックスの店主写真（スマホ）
   見本（mochitsuki-rental.com/sp/）は写真を110pxに縮めて左に回り込ませ、
   本文を横に流している。当ページは中央寄せの191pxで、写真だけで
   画面の高さを大きく使っていたため見本に合わせる。
     変更前：float:none／中央寄せ／191px
     変更後：float:left／110px（余白は img 側の margin で作る。
             p 側の margin は既存指定に !important が付いているため触らない） */
@media screen and (max-width: 640px) {
  .mochi_attention_box .mochi_abe_photo {
    float: left;
    text-align: left;
  }
  .mochi_attention_box .mochi_abe_photo img {
    width: 110px;
    margin: 0 1em .6em 0;
  }
}

/* ============================================================
   保健所／ノロウイルスのバナー（スマホ）
   見本＝現行スマホサイト mochitsuki-rental.com/sp/ の
   images/goto_health.jpg（655x105 を342pxで表示・角丸8px・
   box-shadow 2px 2px 8px #7C7A85）。
   見本は2行・左寄せで、赤は「ノロウイルスの影響で「中止するように」」の
   ひと続き。当ページは4行・中央寄せで縦に高くなっていたため合わせる。
     変更前：4行／中央寄せ／角丸12px／影なし（高さ約130px）
     変更後：2行／左寄せ／角丸8px／影あり（高さ64px・横縦比5.2）
   ※PCはラフどおり4行・中央寄せのままにするため、改行は
     index.html 側で <br class="pc"> / <br class="sp"> に振り分けている
   ============================================================ */
@media screen and (max-width: 640px) {
  .mochi_banner_note {
    gap: .2em;
    padding: .7em .6em;
    border-radius: 8px;
    box-shadow: 2px 2px 8px 0 #7C7A85;
    line-height: 1.5;
  }
  .mochi_banner_note_txt {
    /* 見本は左寄せ。12pxで2行に収まる（必要幅287px／確保幅287px） */
    font-size: 12px;
    text-align: left;
  }
  .mochi_banner_note_arrow {
    font-size: 2.2em;
  }
}

/* ============================================================
   餅つき道具の整備状況：写真4枚（スマホ）
   見本＝現行スマホサイト mochitsuki-rental.com/sp/ は slick（jQuery）の
   横スライダーで、1コマ217px・写真の下に12pxのキャプション。
   当ページは2列で折り返して縦に伸びていたため、横スクロールにする。
   見本と同じ動きをJavaScript無しで出すため、overflow-x + scroll-snap で
   実装している（slick本体とjQueryプラグインの追加が不要）。
     変更前：flex-wrap:wrap の2列（縦に4枚ぶん積み上がる）
     変更後：横1列・スクロール。1コマは見本と同じ約210px（画面の62%）
   ※PCは4枚横並びのままで変更なし
   ============================================================ */
@media screen and (max-width: 640px) {
  .mochi_mainte_list {
    flex-wrap: nowrap;
    gap: .6em;
    padding-bottom: .4em;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .mochi_mainte_list li {
    /* 1.6コマぶんが見えるので、右に続きがあることが分かる */
    flex: 0 0 62%;
    min-width: 0;
    scroll-snap-align: start;
  }
}

/* ============================================================
   お客様の声：写真（1枚差し替え版）
   ご指示により、9枚のストリップ（.mochi_voice_strip）から
   1枚の画像 img/voice.webp（原寸 780x213）に変更。
   原寸より大きく表示するとぼやけるため 780px を上限にして中央寄せする。
   ※ .mochi_voice_strip の指定はHTML側から使われなくなったが、
     既存セレクタには手を入れない方針のため残してある
   ============================================================ */
.mochi_voice_photo {
  margin: 0 auto 1.2em;
  line-height: 0;
  text-align: center;
}
.mochi_voice_photo img {
  display: block;
  width: 100%;
  max-width: 780px;
  height: auto;
  margin: 0 auto;
}

/* ============================================================
   杵を壊してしまっても弁償不要（スマホ）
   ラフ（トップページ_スマホ）の指定は
     小見出し 11pt ≒ 14.7px ／ 主見出し 20pt ≒ 26.7px
   小見出しは .mochi_h2_small_catch の 0.45em 指定が
   スマホの h2（24px）に掛かると 10.8px になり、ラフより大幅に小さかった。
     変更前：10.8px → 変更後：14px
   写真2枚は flex-basis:300px を持っており、画面幅356pxでは
   2枚並べられず縦積みになっていたため、ラフどおり横並びにする。
   ※メディア掲載の h2 も同じ .mochi_h2_small_catch を使っており
     10.8px のままです（ご指示があれば揃えます）
   ============================================================ */
@media screen and (max-width: 640px) {
  .mochi_bensho_area h2 .mochi_h2_small_catch {
    font-size: 14px;
  }
  .mochi_bensho_photos {
    flex-wrap: nowrap;
    gap: .6em;
  }
  .mochi_bensho_photos img {
    flex: 1 1 0;
    min-width: 0;
  }
}

/* ============================================================
   わかりやすい餅つきのやり方：動画の目次
   見本＝現行スマホサイト mochitsuki-rental.com/sp/ では
     ・動画の下に「(この動画は１６分３７秒で終了します）」の注記
     ・目次は「▼動画の目次」で開閉し、開くと下端に「▲閉じる」
   という作りだったので合わせる。
   開閉の仕組みは注目ボックスと同じ（.mochi_more_chk / _body / _btn）で、
   ラベルの文言だけ .mochi_more_btn_toc で差し替えている。
   ※PCは開閉せず、従来どおり動画の右に全9項目を表示
   ============================================================ */
.mochi_howto_caption {
  margin: .5em 0 0;
  font-size: 12px;
  font-weight: normal;
}
/* 目次のかたまりを1つのフレックスアイテムにする
   （入力・本文・ラベルを直接並べると gap:1.5em が余分に入るため） */
.mochi_howto_toc {
  flex: 1 1 220px;
  min-width: 0;
}
.mochi_more_btn_toc::after {
  content: "▼動画の目次";
}
.mochi_more_chk:checked ~ .mochi_more_btn_toc::after {
  content: "▲閉じる";
}
@media screen and (max-width: 640px) {
  .mochi_howto_toc .mochi_more_body {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .4s ease, opacity .3s ease;
  }
  .mochi_howto_toc {
    flex: 1 1 100%;
  }
}

/* 【追加】ラフ（トップページ_スマホ）の吹き出し「追加」に対応した1行。
   ※の段落のすぐ下に置き、※の後ろの本文と左端を揃える。
   .asterisk は「※」をぶら下げるための text-indent:-16px を持っており、
   この行は「（」で始まるので使わず、専用クラスにしている。
   PC・SPの両方（大人気の理由5「弁償不要・お掃除不要」）に入れている */
.mochi_oyu_note {
  margin: .3em 0 0;
  padding-left: 1em;
}

/* ============================================================
   お客様の声の写真：PCとスマホで出し分け（ご指示による）
     PC   … 9枚のストリップ .mochi_voice_strip（差し替え前の表示に戻す）
     スマホ … 1枚の画像 .mochi_voice_photo（img/voice.webp）
   写真の縦横比も、9枚ストリップは元の 1:1 に戻す
   （7645行あたりで 560/600 に変えていたのは1枚画像に合わせたときの指定） */
.mochi_voice_strip img {
  aspect-ratio: 1 / 1;
}
.mochi_voice_photo {
  display: none;
}
@media screen and (max-width: 640px) {
  .mochi_voice_strip {
    display: none;
  }
  .mochi_voice_photo {
    display: block;
  }
}

/* 【修正】メディア掲載の枠が右にずれていた件。
   幅100%（親356px）に対して左右padding 5px と枠線2px が
   content-box で外側に足され、合計370pxと14pxはみ出していた。
   はみ出した分が margin-right:-14px として現れ、左右の余白が
   9px と -5px の非対称になっていた（＝右寄り）。
   box-sizing を border-box にして枠線・余白を幅の内側に収める。
     変更前：幅370px（左9px／右-5px）→ 変更後：幅356px（左右とも9px） */
.top_p.media_area .media_item.thumbnail {
  box-sizing: border-box;
}

/* 【変更】スマホの追っかけヘッダー（ハンバーガーの帯）の地色。
   common_style.css の「.cham__hamburger_switch{background-color:azure}」は
   スポットクーラー由来の水色。共通CSSは触れないので、
   サイトのベージュ #E1E0C1（header/.customer_voice_area 等と同じ色）で上書きする。
     変更前：azure（#F0FFFF）→ 変更後：#E1E0C1 */
@media screen and (max-width: 640px) {
  .cm__sp.cham__drawer_menu.cham__hamburger_switch {
    background-color: #E1E0C1;
  }
}

/* ============================================================
   お客様の喜びの声：リード文のバランス（スマホ）
   ラフ（トップページ_スマホ）は2段落とも4行で、行末が
   「〜の／〜ありません。／〜願い、／〜しています。」
   「〜お客様が、／〜について／〜います。／ぜひご覧ください！！！」
   と句読点で切れている。
   実装は自然折り返し任せで「す。」「さい！！！」「が、」が
   行頭・行末に取り残されていたため、index.html 側で
   <br class="sp"> を入れ、その改行位置で収まる文字サイズにする。
     1段落目：16px → 14px（最長行「お客様の模擬店イベントの…願い、」は
              16pxだと367px必要で、カラム324pxに入らなかった）
     2段落目：17.28px → 16px（最長行「実際に…お客様が、」が328px→304px）
   ※PCはラフどおりの行数のまま。<br class="sp"> はPCでは効かない
   ============================================================ */
@media screen and (max-width: 640px) {
  .mochi_voice_lead p {
    font-size: 14px;
  }
  .mochi_voice_lead .mochi_voice_lead_st {
    font-size: 16px;
  }
}

/* 【変更】杵の注意文は段落まるごと赤（#FF0000）だったが、
   ご指定により「」で示された4箇所だけを赤にする。
   段落の地色は、すぐ下の .mochi_bensho_body と同じ #31320E に戻す。
   赤の範囲は index.html 側の <span class="mochi_red"> で指定：
     ・臼の縁を叩いてしまうと
     ・簡単に割れてしまいます
     ・弊社なら弁償不要
     ・一般的なレンタル店では当然弁償請求されますのでご注意
     （2行目「慣れていない方が〜」は全文が黒） */
.mochi_bensho_alert {
  color: #31320E;
}

/* ============================================================
   PCフッターのサイトマップ：見本（mogiten-rentaru.com/spotcooler/#footer_menu）
   に合わせて3カラムにする。
   見本は .cm__site_map1 / 2 / 3 の3列で、1列あたり3カテゴリ。
   当サイトは2列（70% / 30%）のままカテゴリを詰め込んでいたため、
   左70%（約740px）の中で ul の flex-wrap が効いて
   「石臼3升　36cm寸胴鍋　2重鋳物コンロ…」と横に流れ、
   段落のように見えていた。
     変更前：map1 70% ＋ map3 30% の2列
     変更後：map1 / map2 / map3 を各1/3
   あわせて、項目が横に並ばないよう1行1項目に固定する
   （見本は各カテゴリの商品が1件ずつのため横並びが起きていなかった）
   ============================================================ */
@media screen and (min-width: 641px) {
  .cm__site_map_main.cm__accbox .cm__site_map1,
  .cm__site_map_main.cm__accbox .cm__site_map2,
  .cm__site_map_main.cm__accbox .cm__site_map3 {
    width: 33.3333%;
  }
  /* 見本の項目は 14px / 太さ500。当サイトは18px・太さ400で
     「連続運転可能な電動餅つき機のレンタル」などが2行に折れていた */
  .cm__site_map_main.cm__accbox .cm__site_link_ul > .cm__site_link_li {
    flex: 0 0 100%;
    max-width: 100%;
    font-size: 14px;
    font-weight: 500;
  }
}

/* 【変更】レンタル実績の下のリード文「私たちは、通販型で〜宅配レンタル専門店です」。
   #333333 のグレーで薄く見えていたため黒にする。
   （注目ボックスやFVキャッチと同じ #000000 に揃える）
     変更前：#333333 → 変更後：#000000 */
.cm__rental_achievement .center.bold {
  color: #000000;
}

/* ============================================================
   導入企業ロゴ（日本全国56,151社以上）のPC表示を大きくする
   common_style.css の指定で
     .ul.cm__results_work_pictures.zone { width:75%; margin-left:10em }
     .ul.cm__results_work_pictures.zone li { width:90px }
   となっており、幅1000pxのカラムの中で 750px・左に180pxずれた位置に
   小さく置かれていた（左180px／右20pxの非対称）。
   カラム幅いっぱいに広げ、ロゴ1枚を 90px → 125px にする。
   元画像は200x100なので125pxでも縮小表示のままで、ぼやけない。
   16枚なので 12.5%（8枚×2段）でちょうど割り切れる。
   ※inline-block のままだと要素間の空白で8枚目が落ちるため flex にしている
   ※スマホ（li:39px / 15%）は変更しないよう min-width:641px に限定
   ============================================================ */
@media screen and (min-width: 641px) {
  .ul.cm__results_work_pictures.zone {
    width: 100%;
    margin-left: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .ul.cm__results_work_pictures.zone li {
    width: 12.5%;
  }
}

/* 【変更】お客様の喜びの声のリード文の文字色。
   ラフ（r368）はこの2段落がひとつのテキストボックスで、
   文字色の指定が無い＝黒。実装は #31320E（サイトの茶）で
   ラフより沈んで見えていたため黒にする。
   ご指定は2段落目だけだったが、ラフ上は1ブロックなので
   1段落目だけ茶のままだと段落間で色が食い違う。両方を黒にしている。
     変更前：#31320E → 変更後：#000000 */
.mochi_voice_lead p {
  color: #000000;
}

/* ============================================================
   餅つき道具の整備状況：h2 の上下の余白を揃える
   PC幅で実測すると、h2の上が104px・下が58pxと2倍近く空いていた。
   上の104pxは セクションの padding-top(3em＝54px) と
   .cm__cw の padding-top(50px) の足し算。
   ページ内で唯一上下が揃っている「メディア掲載」が 50px/50px なので、
   それに合わせる。
     上：104px → 50px（セクションの padding-top を外し .cm__cw の50pxだけにする）
     下：57.6px → 50px
   ※スマホは padding:2em .8em の別指定なので min-width:641px に限定
   ============================================================ */
@media screen and (min-width: 641px) {
  .mochi_mainte_area {
    padding-top: 0;
  }
  .mochi_mainte_area h2 {
    margin-bottom: 50px;
  }
}

/* ============================================================
   お客様の声の仕切り線の色を、現行サイトの区切り画像に合わせる
   見本 mochitsuki-rental.com は image/dot_line.webp（730x6）という
   画像で区切っており、そのドットの色を実測すると
   最も濃い部分が #FF9BA8〜#FC919C のピンク寄りの赤だった
   （画像全体の平均は #E4B2C0 だが、これはドット間の白と
     アンチエイリアスが混ざった値なので、CSSの点線には使わない）。
     変更前：#FF0000（純赤）→ 変更後：#FF9BA8
   ============================================================ */
.customer_voice_area .block.no1 .zone[class*="voice_id_"] {
  border-bottom-color: #FF9BA8;
}
.customer_voice_area .cm__cw .block.no0 {
  border-bottom-color: #FF9BA8;
}

/* ============================================================
   インラインstyleのクラス化（全ページ・309箇所）
   HTML内の style="..." を廃止し、同じ宣言をクラスにしたもの。
   宣言の内容は1文字も変えていない（!important も元のまま）。
   除外：Googleタグマネージャのnoscriptタグとコメントアウト済みのお知らせ

   セレクタでクラス名を5回繰り返しているのは、詳細度を(0,5,0)に上げるため。
   インラインstyleは元々どのCSSより強く効いていたので、素直にクラス化すると
   共通CSS側の指定（最大で (0,4,1) の
   「.cm__responsive_device.sagawa_ver .cm__rd_other.r_d_block p」など）に負けて
   見た目が変わってしまう。新しい !important は書かない方針のため、
   詳細度で解決している。
   ============================================================ */
.mochi_bg_beige.mochi_bg_beige.mochi_bg_beige.mochi_bg_beige.mochi_bg_beige { background-color:#E1E0C1; }
.mochi_acc_close.mochi_acc_close.mochi_acc_close.mochi_acc_close.mochi_acc_close { display: block; padding: 0 1em 0 0; position: relative; top: 1em; text-align: right; }
.mochi_bg_hada.mochi_bg_hada.mochi_bg_hada.mochi_bg_hada.mochi_bg_hada { background-color:#FDE9D9; }
.mochi_bold.mochi_bold.mochi_bold.mochi_bold.mochi_bold { font-weight: bold; }
.mochi_table.mochi_table.mochi_table.mochi_table.mochi_table { width:100%;border-collapse:collapse;text-align:center; }
.mochi_cap12.mochi_cap12.mochi_cap12.mochi_cap12.mochi_cap12 { font-size:12px;margin-top:6px; }
.mochi_block.mochi_block.mochi_block.mochi_block.mochi_block { display:block; }
.mochi_nowrap.mochi_nowrap.mochi_nowrap.mochi_nowrap.mochi_nowrap { white-space:nowrap; }
.mochi_img_fit.mochi_img_fit.mochi_img_fit.mochi_img_fit.mochi_img_fit { width: 100% !important; max-width: 100% !important; height: auto !important; object-fit: contain !important; }
.mochi_img340.mochi_img340.mochi_img340.mochi_img340.mochi_img340 { width:100%;max-width:340px;height:auto; }
.mochi_xscroll.mochi_xscroll.mochi_xscroll.mochi_xscroll.mochi_xscroll { overflow-x:auto; }
.mochi_mb10.mochi_mb10.mochi_mb10.mochi_mb10.mochi_mb10 { margin-bottom:10px; }
.mochi_ta_left.mochi_ta_left.mochi_ta_left.mochi_ta_left.mochi_ta_left { text-align:left; }
.mochi_mt1em.mochi_mt1em.mochi_mt1em.mochi_mt1em.mochi_mt1em { margin-top:1em; }
.mochi_w310_mb10.mochi_w310_mb10.mochi_w310_mb10.mochi_w310_mb10.mochi_w310_mb10 { width:310px; margin-bottom:10px; }
.mochi_w100.mochi_w100.mochi_w100.mochi_w100.mochi_w100 { width:100%; }
.mochi_ta_center.mochi_ta_center.mochi_ta_center.mochi_ta_center.mochi_ta_center { text-align:center; }
.mochi_fs13.mochi_fs13.mochi_fs13.mochi_fs13.mochi_fs13 { font-size:13px; }
.mochi_circle_arrow.mochi_circle_arrow.mochi_circle_arrow.mochi_circle_arrow.mochi_circle_arrow { flex:0 0 auto;width:38px;height:38px;border-radius:50%;background-color:#FF0000;display:inline-flex;align-items:center;justify-content:center;margin-left:10px; }
.mochi_head_bar_link.mochi_head_bar_link.mochi_head_bar_link.mochi_head_bar_link.mochi_head_bar_link { display:flex;align-items:center;justify-content:space-between;background-color:#FDE9D9;border-left:14px solid #FF0000;padding:14px 20px;text-decoration:none;color:#31320E;font-weight:bold;font-size:22px; }
.mochi_head_bar.mochi_head_bar.mochi_head_bar.mochi_head_bar.mochi_head_bar { display:block;width:100%;box-sizing:border-box;background-color:#FDE9D9;border-left:14px solid #FF0000;padding:12px 20px;text-align:center; }
.mochi_tri_down.mochi_tri_down.mochi_tri_down.mochi_tri_down.mochi_tri_down { display:block;width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-top:12px solid #fff; }
.mochi_red_txt.mochi_red_txt.mochi_red_txt.mochi_red_txt.mochi_red_txt { color:red; }
.mochi_ta_center_m0.mochi_ta_center_m0.mochi_ta_center_m0.mochi_ta_center_m0.mochi_ta_center_m0 { text-align:center;margin:0; }
.mochi_mb1em.mochi_mb1em.mochi_mb1em.mochi_mb1em.mochi_mb1em { margin-bottom: 1em; }
.mochi_bold_center.mochi_bold_center.mochi_bold_center.mochi_bold_center.mochi_bold_center { font-weight:bold; text-align:center; }
.mochi_flex300_center.mochi_flex300_center.mochi_flex300_center.mochi_flex300_center.mochi_flex300_center { flex:1 1 300px;text-align:center; }
.mochi_flex300.mochi_flex300.mochi_flex300.mochi_flex300.mochi_flex300 { flex:1 1 300px; }
.mochi_flex_g24.mochi_flex_g24.mochi_flex_g24.mochi_flex_g24.mochi_flex_g24 { display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start; }
.mochi_block_full.mochi_block_full.mochi_block_full.mochi_block_full.mochi_block_full { display:block;width:100%;box-sizing:border-box; }
.mochi_left_fs13.mochi_left_fs13.mochi_left_fs13.mochi_left_fs13.mochi_left_fs13 { text-align:left; font-size:13px; }
.mochi_sep_dashed.mochi_sep_dashed.mochi_sep_dashed.mochi_sep_dashed.mochi_sep_dashed { padding-bottom:2em;border-bottom:2px dashed #FF0000;margin-bottom:2em; }
.mochi_img_auto.mochi_img_auto.mochi_img_auto.mochi_img_auto.mochi_img_auto { width:100%;height:auto; }
.mochi_valign_mid.mochi_valign_mid.mochi_valign_mid.mochi_valign_mid.mochi_valign_mid { vertical-align:middle; }
.mochi_mb04em.mochi_mb04em.mochi_mb04em.mochi_mb04em.mochi_mb04em { margin:0 0 .4em; }
.mochi_acc_close14.mochi_acc_close14.mochi_acc_close14.mochi_acc_close14.mochi_acc_close14 { font-size: 14px; display: block; padding: 0 1em 0 0; position: relative; text-align: right; }
.mochi_flex_half.mochi_flex_half.mochi_flex_half.mochi_flex_half.mochi_flex_half { flex:0 0 calc(50% - 8px);max-width:400px; }
.mochi_brown20.mochi_brown20.mochi_brown20.mochi_brown20.mochi_brown20 { color:#31320E;font-size:20px;margin-bottom:0; }
.mochi_brown.mochi_brown.mochi_brown.mochi_brown.mochi_brown { color:#31320E; }
.mochi_bg_hada_10.mochi_bg_hada_10.mochi_bg_hada_10.mochi_bg_hada_10.mochi_bg_hada_10 { background-color:#FDE9D91a; }
.mochi_w310.mochi_w310.mochi_w310.mochi_w310.mochi_w310 { width:310px; }
.mochi_img400.mochi_img400.mochi_img400.mochi_img400.mochi_img400 { width:100%;max-width:400px;height:auto; }
.mochi_center_m2em.mochi_center_m2em.mochi_center_m2em.mochi_center_m2em.mochi_center_m2em { text-align:center;margin:2em 0; }
.mochi_pr15.mochi_pr15.mochi_pr15.mochi_pr15.mochi_pr15 { padding-right:15px; }
.mochi_m0.mochi_m0.mochi_m0.mochi_m0.mochi_m0 { margin:0; }
.mochi_m0_top2.mochi_m0_top2.mochi_m0_top2.mochi_m0_top2.mochi_m0_top2 { margin: 0; position: relative; top: 2rem; }
.mochi_mt6.mochi_mt6.mochi_mt6.mochi_mt6.mochi_mt6 { margin-top:6px; }
.mochi_mt10.mochi_mt10.mochi_mt10.mochi_mt10.mochi_mt10 { margin-top:10px; }
.mochi_mb03em.mochi_mb03em.mochi_mb03em.mochi_mb03em.mochi_mb03em { margin-bottom:.3em; }
.mochi_ul_disc.mochi_ul_disc.mochi_ul_disc.mochi_ul_disc.mochi_ul_disc { list-style:disc;padding-left:1.3em;margin:0 0 1em; }
.mochi_fs15.mochi_fs15.mochi_fs15.mochi_fs15.mochi_fs15 { font-size:15px; }
.mochi_fs072_normal.mochi_fs072_normal.mochi_fs072_normal.mochi_fs072_normal.mochi_fs072_normal { font-size:0.72em;font-weight:normal; }
.mochi_hide.mochi_hide.mochi_hide.mochi_hide.mochi_hide { display:none; }
.mochi_flex_g16_center.mochi_flex_g16_center.mochi_flex_g16_center.mochi_flex_g16_center.mochi_flex_g16_center { display:flex;flex-wrap:wrap;gap:16px;justify-content:center; }
.mochi_credit_link.mochi_credit_link.mochi_credit_link.mochi_credit_link.mochi_credit_link { display:block;text-align:center;margin:15px 0;font-size:11px;color:#aaa;text-decoration:none; }
.mochi_black.mochi_black.mochi_black.mochi_black.mochi_black { color:#000000; }
.mochi_red_f3.mochi_red_f3.mochi_red_f3.mochi_red_f3.mochi_red_f3 { color: #f30000; }
.mochi_bg_yellow_a.mochi_bg_yellow_a.mochi_bg_yellow_a.mochi_bg_yellow_a.mochi_bg_yellow_a { background-color:#ffd7002b; }
.mochi_beige_box.mochi_beige_box.mochi_beige_box.mochi_beige_box.mochi_beige_box { background-color:#E1E0C1;padding:1em 1.2em;border-radius:6px;margin:1.5em 0; }
.mochi_bg_green_a.mochi_bg_green_a.mochi_bg_green_a.mochi_bg_green_a.mochi_bg_green_a { background-color:#059b2b21; }

/* ============================================================
   導入企業ロゴの下の余白（PC）
   ロゴの帯がセクション下端にぴったり付いていて（余白0）、
   次の灰色セクションに接していた。
   同じ白セクション内で、上の「20台以上〜」の黄色ボックスと
   「日本全国56,151社以上」の間は 74px 空いているので、
   ロゴの下にも同じ 74px を取って上下対称にする。
     変更前：0px → 変更後：74px
   ※スマホは上側の余白が10pxしかなく、揃える意味が薄いので変更しない
   ============================================================ */
@media screen and (min-width: 641px) {
  .cm__results_work_area {
    padding-bottom: 74px;
  }
}

/* 【変更】杵を壊しても弁償不要セクションの本文（p）を黒にする。
   セクションの地色 #31320E（サイトの茶）を継承していたが、ご指示により本文は #000000。
   赤字の span（.mochi_red）は自身の色指定を持つので影響なし。
   このセクションは index / set / denki の3ページ共通 */
.mochi_bensho_area p {
  color: #000000;
}

/* ============================================================
   セクション先頭の h2 の上余白を 50px に統一
   トップページの全セクションで「直前の内容の下端 → h2の上端」を実測すると、
   メディア掲載・保証体制・明朗価格・大人気の理由・宅配便など
   9セクションが 50px で揃っており、これがページの基準。
   ずれていた5セクションを 50px に合わせる。
   ------------------------------------------------------------
   【PC】
   ・イベントを確実に成功させて…  0px → 50px（h2がセクション上端に密着していた）
   ・30秒でわかる上州物産のレンタル 33px → 50px（section 15px + .rental_30seconds 18px）
   ・杵を壊しても弁償不要        104px → 50px（section 54px + .cm__cw 50px の二重）
   ・笑顔をつなぐレンタル（締め） 75px → 50px（.cm__cw 50px + .cm__connecting_smiles 25px）
   ・おかげさまでレンタル実績     20px → 50px（前ブロックとの margin）
   【スマホ】
   ・イベントを確実に成功させて…  0px → 50px
   ・30秒でわかる上州物産のレンタル 15px → 50px
   （整備状況・弁償不要 32px、大人気の理由 35px、宅配便 48px は
     スマホ用に詰めた値なので据え置き）
   ============================================================ */
@media screen and (min-width: 641px) {
  .before_delivery.delivery_paragraph.p_top .cm__cw {
    padding-top: 50px;
  }
  .top.generator_beginning_area {
    padding-top: 32px;   /* 15px → 32px。内側 .rental_30seconds の18pxと合わせて50px */
  }
  .mochi_bensho_area {
    padding-top: 0;      /* 54px → 0。.cm__cw の 50px だけにする */
  }
  .cm__jb_greeting .cm__connecting_smiles {
    padding-top: 0;      /* 25px → 0。.cm__cw の 50px だけにする */
  }
  .cm__rental_achievement {
    margin-top: 50px;    /* 20px → 50px */
  }
}
@media screen and (max-width: 640px) {
  .before_delivery.delivery_paragraph.p_top .cm__cw {
    padding-top: 50px;
  }
  .top.generator_beginning_area {
    padding-top: 50px;   /* 15px → 50px */
  }
}

/* 杵を壊しても弁償不要：h2 の下余白 48px → 50px。
   上は50pxに揃えたが、下だけ 1em（=48px）のままで他セクション（50px）と2pxずれていた */
@media screen and (min-width: 641px) {
  .mochi_bensho_area h2 {
    margin-bottom: 50px;
  }
}

/* 【変更】スマホのFV写真帯を、ラフどおり1枚の帯画像（640x128・5:1）に差し替えたのに合わせて
   高さを画像の比率に任せる。以前は写真4〜5枚を flex で並べて 18.8vw に切り揃えていたが、
   1枚画像では object-fit:cover の切り落としが不要なので height:auto にする
     変更前：height:18.8vw（帯）／height:100%（img）→ 変更後：どちらも auto（幅100%で5:1） */
@media screen and (max-width: 640px) {
  .mochi_fv_strip {
    height: auto;
  }
  .mochi_fv_strip img {
    height: auto;
  }
}


/* ===== 20-top.css ===== */
/* ===== 20-top.css : トップページ担当（index.html） =====
   ・このファイルの担当以外は書かない
   ・必ずページ限定（body.page-xxx ...）でスコープする
   ・!important とインライン style は禁止
   ・保存したら node build-css.js を流し、生成後の style.css を css/style.css として上げる
   ・共通レイヤーを変えたくなったら書かずに共通担当へ申告 */

/* ============================================================
   2026-09-14 伊勢さん指示：「本格石臼餅つきセット」見出しの小見出し
   「これだけ揃えれば、すぐに本格的な餅つきが始められます」を全部太字に。
   common_style の .subheadingh4_small_catch{font-weight:normal} を上書き
   ============================================================ */
body.page-top .mochi_set_head .subheadingh4_small_catch {
  font-weight: bold;
}

/* ============================================================
   2026-09-14 伊勢さん指示：SP のファーストビュー下「2016年5月撮影〜」「木臼より軽くて〜」の文字サイズ調整
   現状：写真キャプションが本文より大きい 16px、本文 15px/行間 22px、注記 11px、
         「※！！！」の inline-block が SP では単独行に落ちて読みにくい
   ============================================================ */
@media screen and (max-width: 640px) {
  /* 写真キャプション：本文より一段小さく（色は黒のまま：2026-09-14 伊勢さん指示） */
  body.page-top .seiretu_p02 {
    font-size: 11px;      /* 本番 SP と同じ 11px / 行間 1.3 / 右寄せ（2026-09-14 伊勢さん指示） */
    line-height: 1.3;
    text-align: right;
    margin: 6px 9.375px 0;
  }
  /* 本文：15px のまま行間だけ広げる */
  body.page-top .migiyori.font_weight_500 {
    font-size: 15px;
    line-height: 1.7;
    font-weight: bold;   /* 黒字も太字に（2026-09-14 伊勢さん指示。赤字は元から太字） */
  }
  /* 「場合が多いです。当店なら〜※！！！」を文として流す（PC の右端揃え用 inline-block を解除） */
  body.page-top .migiyori.font_weight_500 .migiyori_line2 {
    display: inline;
  }
  /* 注記は 1 行独立・右寄せ・12px */
  body.page-top .migiyori.font_weight_500 .migiyori_hk {
    display: block;
    font-size: 12px;
    margin-top: 6px;
  }
}

/* ============================================================
   2026-09-14 伊勢さん指示：SP で下部の商品ボタン（消耗品の販売）と
   「模擬店の成功〜」バナーの間が 152px 空いて不自然。
   内訳：ul の margin-bottom 32 + last_item_area の .cm__cw padding-bottom 50
        + link_area の .cm__cw padding-top 50 + h3 の margin-top 20
   → 両セクションの接する側の padding を詰めて 72px にする
   ============================================================ */
@media screen and (max-width: 640px) {
  body.page-top section.top.last_item_area > .cm__cw {
    padding-bottom: 20px;
  }
  body.page-top section.itm.link_area > .cm__cw {
    padding-top: 0;
  }
}

/* ============================================================
   2026-09-14 伊勢さん承認：SP のセクション間の空白を個別に詰める（目標 60〜80px）
   計測：scratchpad/gap_breakdown.js（内容と内容の間が 70px 超の 17 箇所と、その内訳）
   方針：色地の帯（ベージュ #E1E0C1・肌色 #FDE9D9・灰）は内側 padding 50→30、
         白地どうしの境界は大きい側だけ削る。増える箇所は作らない。PC は変更なし
   ============================================================ */
@media screen and (max-width: 640px) {
  /* #2 30秒でわかる（灰）→ ご予約は書類作成…（ベージュ） 111px */
  body.page-top section.top.generator_beginning_area { padding-bottom: 5px; }
  body.page-top section.top.generator_beginning_area .rental_30seconds { padding-bottom: 15px; }
  body.page-top section.cm__johnson_box.site_s4 > .cm__cw { padding-top: 30px; padding-bottom: 30px; }
  /* #3 ご予約は書類作成…（ベージュ）→ 取り扱い商品一覧（白カラム） 140px */
  body.page-top section.cm__johnson_box.site_s4 .johnson_box { padding-bottom: 10px; }
  body.page-top section.top.item_guide_area.mochi_items_head > .cm__cw { padding-top: 20px; }
  /* 相談窓口ブロック（8 箇所で隣接）：外側のベージュ 40 → 20 */
  body.page-top section.cm__responsive_device.sagawa_ver.site_w1200 { padding-top: 20px; padding-bottom: 20px; }
  /* #4 相談窓口 → お客様の声（ベージュ） 119px */
  body.page-top section.customer_voice_area.item > .cm__cw { padding-top: 30px; padding-bottom: 20px; }
  body.page-top section.customer_voice_area.item .block.no0 { margin-top: 10px; margin-bottom: 10px; padding-bottom: 10px; }
  /* #6 お客様の声 → ご注意（白） 121px */
  body.page-top section.mochi_attention_area { padding-top: 20px; }
  /* #7 整備状況（肌色）→ 弁償不要（白） 106px */
  body.page-top section.mochi_mainte_area { padding-bottom: 20px; }
  body.page-top section.mochi_mainte_area .mochi_mainte_card { padding-bottom: 10px; }
  body.page-top section.mochi_mainte_area .mochi_mainte_link { margin-bottom: 10px; }
  body.page-top section#break_mallet.mochi_bensho_area { padding-top: 20px; }
  /* #9 大人気の理由（白）→ 相談窓口 137px */
  body.page-top section.popular_reason_area > .cm__cw { padding-bottom: 15px; }
  body.page-top section.popular_reason_area .cm__poplar_block.rfp7 { padding-bottom: 15px; }
  /* #10 相談窓口 → メディア（ベージュ）／#11 メディア → 宅配便でお届け（白） 99 / 115px */
  body.page-top section.top_p.media_area > .cm__cw { padding-top: 30px; padding-bottom: 30px; }
  body.page-top section.top.cm__transport_area.back_transport h2.center { margin-top: 30px; }
  /* #12 宅配便（肌色）→ 相談窓口 105px */
  body.page-top section.before_delivery.delivery_paragraph > .cm__cw { margin-bottom: 20px; }
  /* #13 相談窓口 → 保証（白）／#14 保証 → 相談窓口 99 / 127px */
  body.page-top section.guarantee_area > .cm__cw { padding-top: 40px; padding-bottom: 20px; }
  /* #15 相談窓口 → 下部の商品一覧（白） 99px */
  body.page-top section.top.last_item_area > .cm__cw { padding-top: 40px; }
  /* #17 模擬店バナー（白）→ 笑顔をつなぐ（ベージュ） 116px */
  body.page-top section.itm.link_area > .cm__cw { padding-bottom: 25px; }
  body.page-top section.cm__jb_greeting > .cm__cw { padding-top: 30px; padding-bottom: 30px; }
  /* #18 笑顔をつなぐ → 締め（即日出荷） 107px */
  body.page-top section.cm__responsive_device.ending.site_w1200 { padding-top: 5px; }
  body.page-top section.cm__responsive_device.ending.site_w1200 > .cm__cw { padding-top: 20px; }
}

/* ============================================================
   2026-09-14：PC の宅配便ブロック（.cm__transport_area）で帯画像 sagawa_delivery1/2.webp（1100px）が
   .cm__cw の左右 padding 50px の内側 1000px から右に 100px はみ出していた。
   見本（index.css）は同ブロックだけ padding を 50px 0 にしている。00-existing で SP 対策のため
   同ルールを削除した際に PC 側も消えたので、PC だけ左右 0 に戻す
   ============================================================ */
@media screen and (min-width: 641px) {
  body.page-top .top.cm__transport_area.back_transport > .cm__cw {
    padding-left: 0;
    padding-right: 0;
  }
}

/* ============================================================
   2026-09-14：トップページのラフ照合（findings/index.md）で出た小さな差の修正
   ============================================================ */
/* No.11 明朗価格の下に再掲する帯見出し（.top.last_item_area .mochi_set_head）を上段と同じ見た目に：
   文字色 #31320E、上 30px／下 15px（上段は 2.2em 上・0 下で、文字も黒だった） */
body.page-top .top.last_item_area .mochi_set_head {
  color: #31320E;
  margin-top: 30px;
  margin-bottom: 15px;
}
/* No.48 お客様の声のリード文：ラフ 14pt→18px、2段落目（太字）16pt→21px */
body.page-top .mochi_voice_lead p {
  font-size: 18px;
}
body.page-top .mochi_voice_lead .mochi_voice_lead_st {
  font-size: 21px;
}
@media screen and (min-width: 641px) {
  /* No.50 PC の Q&A は常時展開。開閉用 checkbox が 0×0 でも既定 margin 3px を持ち、
     各 Q の上余白が他の見出しと揃わなかったので PC では出さない */
  body.page-top .mochi_faq .mochi_acc_chk {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  /* No.44 SP「模擬店の成功、お客さまと…」はラフ吹き出し「上の5行は左右中央揃えに」 */
  body.page-top .itm.link_area .cm__for_ones_smile h3,
  body.page-items .itm.link_area .cm__for_ones_smile h3 {
    text-align: center;
  }
  /* No.49 SP 商品ボタン内の写真：ラフはボタンの高さいっぱい（約50px）。30px→45px */
  body.page-top .mochi_btn_grid .mochi_pbtn_photo {
    height: 45px;
  }
}

/* ============================================================
   2026-09-14 夕方：トップページのラフ照合（findings/index.md）の残り。伊勢さん「明らかな差はそのまま直す」
   ============================================================ */
/* No.23 お客様の声の仕切り線：ラフ吹き出し「間の仕切り線は赤の点線で」。
   00-existing では本番の区切り画像の実測色 #FF9BA8 に合わせていたが、見た目はラフが正なので赤に */
body.page-top .customer_voice_area .block.no1 .zone[class*="voice_id_"],
body.page-top .customer_voice_area .cm__cw .block.no0 {
  border-bottom-color: #FF0000;
}
/* No.46 SP 整備状況の小見出し（HTML 側で h3.sp を追加） */
body.page-top .mochi_mainte_area .mochi_mainte_sub {
  font-size: 18px;
  color: #31320E;
  text-align: center;
  margin: 0 0 12px;
}
@media screen and (min-width: 641px) {
  /* No.40/41 PC 商品ボタン：ラフは 2 列 465×132（高さ/幅 0.28）、3 列 340×100（0.29）。
     実装は 504×61 / 332×61 と半分の高さで、文字も 22/13px（ラフ 32/21px）。トップだけ寸法をラフに合わせる */
  body.page-top .mochi_btn_grid > li > .mochi_pbtn {
    min-height: 96px;
    padding: 10px 12px 10px 18px;
  }
  body.page-top .mochi_btn_grid .mochi_pbtn_txt {
    font-size: 24px;
  }
  body.page-top .mochi_btn_grid .mochi_pbtn_photo {
    height: 64px;
  }
  body.page-top .mochi_btn_grid > li.w50 > .mochi_pbtn {
    min-height: 140px;
    padding: 12px 16px 12px 22px;
  }
  body.page-top .mochi_btn_grid > li.w50 .mochi_pbtn_txt {
    font-size: 32px;
  }
  body.page-top .mochi_btn_grid > li.w50 .mochi_pbtn_sub {
    font-size: 21px;
  }
  body.page-top .mochi_btn_grid > li.w50 .mochi_pbtn_photo {
    height: 96px;
  }
  /* No.42 赤ボタン「詳細と価格はこちら」：ラフ 580×113（実装 560×83）。矢印は HTML で ▶ に */
  body.page-top .mochi_set_visual .mochi_set_cta {
    max-width: 580px;
    padding: 20px 20px 24px;
  }
}
/* No.38 FV の写真帯をラフ比率（幅の 31%）にする指定は 2026-09-15 伊勢さん指示で取り下げ（元の 16:9 に戻す） */

/* 2026-09-15 夜：以下の共通ブロック向けルールは body.page-items（set/denki/items/list/relevant/sell_material）にも同じく効かせる（セレクタを並記） */
/* ============================================================
   2026-09-15：レビューシート（餅1カラム化・A列「やる」40 件）への対応。番号はシートの行
   ============================================================ */
/* 行14・16・37・40 PC：帯見出しの上の空きを 50px に統一
   （h2「取り扱い商品一覧」→帯 62px、赤ボタン→帯 30px、ボタン群→帯 36px、黄色枠→帯 30px だった） */
@media screen and (min-width: 641px) {
  body.page-top .top.item_guide_area.mochi_items_head .cm__cw ,
  body.page-items .top.item_guide_area.mochi_items_head .cm__cw  {
    padding-bottom: 0;
  }
  body.page-top .mochi_btn_grid ,
  body.page-items .mochi_btn_grid  {
    margin-bottom: 50px;
  }
  body.page-top .mochi_set_head.mochi_set_head_mt ,
  body.page-items .mochi_set_head.mochi_set_head_mt  {
    margin-top: 50px;
  }
  body.page-top .top.last_item_area .mochi_order_note + .mochi_set_head ,
  body.page-items .top.last_item_area .mochi_order_note + .mochi_set_head  {
    margin-top: 50px;
  }
  /* 行19 PC：Q&A の質問行は上 30px／下 10px（25/15 だった） */
  body.page-top .mochi_faq .mochi_acc_head h4 ,
  body.page-items .mochi_faq .mochi_acc_head h4  {
    margin: 30px 0 10px;
  }
}
/* 行24・25：「やり方」ボックスのリンクは上の文章に、「ぜひ、こちらも…」は下の動画にくっつける */
body.page-top .mochi_howto_box p.mochi_howto_p_before_link,
body.page-top .mochi_howto_box p.mochi_howto_p_before_video {
  margin-bottom: 0;
}
/* 行30：「（注1）」は小さく（本番 .text_11 相当。12px 未満は使わない方針なので 12px） */
body.page-top .mochi_note_s ,
body.page-items .mochi_note_s  {
  font-size: 12px;
}
/* 行58 SP：大人気の理由。本番スマホ同様、最初の段落を見せてから「▼詳しくはこちら」。理由4・6 は全文表示 */
body.page-top .popular_reason_area .mochi_acc_lead ,
body.page-items .popular_reason_area .mochi_acc_lead  {
  margin-bottom: 0;
}
body.page-top .popular_reason_area .mochi_acc_open ,
body.page-items .popular_reason_area .mochi_acc_open  {
  display: block;
}
@media screen and (max-width: 640px) {
  /* 行42・53 追っかけヘッダーの高さ収めは全ページ共通なので 90-common.css へ移動（2026-09-15） */
  /* 行45：写真帯のキャプション→本文、本文 1 段落目→2 段落目 の空きを揃える（10px と 25px だった） */
  body.page-top .migiyori.font_weight_500 {
    margin-top: 28px; /* 文字の上端で測ると 27px、段落間の空き行は 30px だったので 3px 足して揃える */
  }
  /* 行46：「日本全国56,151社以上」の上下の空きを揃える（上 10px／下 0 だった） */
  body.page-top .p_Array.cm__results_work_area {
    padding-top: 15px;
    padding-bottom: 16px; /* ロゴ 4 列化後、上（黄色枠→見出し文字）25px／下（ロゴ→次セクション）25px に揃う値 */
  }
  /* 行51：お客様の声のリード文。上 14px・下（太字）17px、行間は少し詰める */
  body.page-top .mochi_voice_lead p ,
  body.page-items .mochi_voice_lead p  {
    font-size: 14px;
    line-height: 1.6;
  }
  body.page-top .mochi_voice_lead .mochi_voice_lead_st ,
  body.page-items .mochi_voice_lead .mochi_voice_lead_st  {
    font-size: 17px;
  }
  /* 行52：お客様の声の本文はラフ（現行スマホ）どおり「文章の声 → 手書きのお手紙（横スクロール）」の順。
     .block.no0 を display:contents にして .cm__cw の flex で並べ替える */
  body.page-top .customer_voice_area .cm__cw ,
  body.page-items .customer_voice_area .cm__cw  {
    display: flex;
    flex-direction: column;
  }
  body.page-top .customer_voice_area .cm__cw .block.no0 ,
  body.page-items .customer_voice_area .cm__cw .block.no0  {
    display: contents;
  }
  body.page-top .customer_voice_area .cm__cw .block.no1 ,
  body.page-items .customer_voice_area .cm__cw .block.no1  {
    order: 5;
  }
  body.page-top .customer_voice_area .block.no0 h4 ,
  body.page-items .customer_voice_area .block.no0 h4  {
    order: 6;
    margin-top: 24px;
  }
  body.page-top .customer_voice_area .block.no0 .side_scroll_area ,
  body.page-items .customer_voice_area .block.no0 .side_scroll_area  {
    order: 7;
  }
  /* 手書きのお手紙は現行スマホと同じく写真だけを横に並べる（白カードとキャッチは無し） */
  body.page-top .customer_voice_area .side_scroll_area .scope .div:nth-child(1) ,
  body.page-items .customer_voice_area .side_scroll_area .scope .div:nth-child(1)  {
    display: none;
  }
  body.page-top .customer_voice_area .scroll_box .scope ,
  body.page-items .customer_voice_area .scroll_box .scope  {
    width: 62%;
    padding: 0;
    background-color: transparent;
  }
  /* 行54：注目ボックスの本文は太字にしない（PC はラフどおり太字のまま） */
  body.page-top .mochi_attention_box {
    font-weight: normal;
  }
  /* 行56：整備状況はラフ（現行スマホ）どおり本文段落なし */
  body.page-top .mochi_mainte_area .mochi_mainte_desc ,
  body.page-items .mochi_mainte_area .mochi_mainte_desc  {
    display: none;
  }
  /* 行57：杵を壊しても弁償不要の本文。ラフは 14px・行間 1.6 程度（16px・1.9 で間延びしていた） */
  body.page-top .mochi_bensho_area .mochi_bensho_alert,
  body.page-items .mochi_bensho_area .mochi_bensho_alert,
  body.page-top .mochi_bensho_area .mochi_bensho_body p ,
  body.page-items .mochi_bensho_area .mochi_bensho_body p  {
    font-size: 14px;
    line-height: 1.6;
  }
  /* 行63：商品ボタンの文字が小さい（13px → 14px） */
  body.page-top .mochi_btn_grid .mochi_pbtn_txt ,
  body.page-items .mochi_btn_grid .mochi_pbtn_txt  {
    font-size: 16px; /* 2026-09-16 伊勢さん指示：14→16px */
  }
}
/* 行52 続き（SP）：「»現在50件以上掲載中」のリンクはラフどおり手書きのお手紙の後ろへ */
@media screen and (max-width: 640px) {
  body.page-top .customer_voice_area .cm__cw .block.no1 ,
  body.page-items .customer_voice_area .cm__cw .block.no1  {
    display: contents;
  }
  body.page-top .customer_voice_area .block.no1 .zone[class*="voice_id_"] ,
  body.page-items .customer_voice_area .block.no1 .zone[class*="voice_id_"]  {
    order: 5;
  }
  body.page-top .customer_voice_area .block.no1 .zone:not([class*="voice_id_"]) ,
  body.page-items .customer_voice_area .block.no1 .zone:not([class*="voice_id_"])  {
    order: 8;
    margin-top: 16px;
  }
}
/* 行58 続き（SP）：全文表示にした理由4 の段落間（.n_l は余白 0 なので本番同様に空ける） */
@media screen and (max-width: 640px) {
  body.page-top .popular_reason_area .mochi_acc_open p.n_l:not(:last-child) ,
  body.page-items .popular_reason_area .mochi_acc_open p.n_l:not(:last-child)  {
    margin-bottom: 1em;
  }
  /* 行56 続き：整備状況の見出し文はラフの 3 行に（HTML 側で <br class="sp">、文字は 15px） */
  body.page-top .mochi_mainte_area .mochi_mainte_lead ,
  body.page-items .mochi_mainte_area .mochi_mainte_lead  {
    font-size: 15px;
  }
}
/* 行39 補足（PC）：下段の帯見出しは .top.last_item_area .mochi_set_head（詳細度 0,4,1）に負けるので同じ詳細度で */
@media screen and (min-width: 641px) {
  body.page-top .top.last_item_area .mochi_set_head.mochi_set_head_mt ,
  body.page-items .top.last_item_area .mochi_set_head.mochi_set_head_mt  {
    margin-top: 50px;
  }
  /* 行29 補足（PC）：理由4 の「※ただし」の前を本番同様に 1 行空ける */
  body.page-top .popular_reason_area .cm__jb_repayment .box p.asterisk ,
  body.page-items .popular_reason_area .cm__jb_repayment .box p.asterisk  {
    margin-top: 1em;
  }
}
/* 2026-09-15 伊勢さん指示：理由4 の「※ただし…」の下マージンは不要（直後の「（お湯は100℃…）」にくっつける）。PC/SP とも */
body.page-top .popular_reason_area p.asterisk:has(+ .mochi_oyu_note) ,
body.page-items .popular_reason_area p.asterisk:has(+ .mochi_oyu_note)  {
  margin-bottom: 0;
}
/* 同上：「（お湯は100℃…）」の上マージンもカット */
body.page-top .popular_reason_area .mochi_oyu_note ,
body.page-items .popular_reason_area .mochi_oyu_note  {
  margin-top: 0;
}
/* 2026-09-15 伊勢さん指示：下段の帯「本格石臼餅つきセット」→道具の箱、箱→写真 の空きを同じに（53px／30px → 30px／30px） */
body.page-top .top.last_item_area .mochi_set_lead ,
body.page-items .top.last_item_area .mochi_set_lead  {
  margin-top: 30px;
}
body.page-top .top.last_item_area .mochi_set_lead .mochi_set_tools ,
body.page-items .top.last_item_area .mochi_set_lead .mochi_set_tools  {
  margin-top: 0;
}
@media screen and (max-width: 640px) {
  body.page-top .top.last_item_area .mochi_set_lead ,
  body.page-items .top.last_item_area .mochi_set_lead  { margin-top: 20px; } /* SP は箱→写真が 20px なので同じ 20px に */
}
/* 2026-09-16 伊勢さん指示：商品一覧の帯見出し（一緒におすすめ／その他の単品／関連商品／消耗品）の下の余白は SP では 15px（上は 30px のまま）。この帯だけ */
@media screen and (max-width: 640px) {
  body.page-top h4.mochi_set_head.mochi_set_head_mt,
  body.page-items h4.mochi_set_head.mochi_set_head_mt {
    margin-bottom: 15px;
  }
}
/* 2026-09-16 伊勢さん指示：杵を壊しても弁償不要（SP）の文字サイズ・行間をラフに忠実に。
   ラフ実測（480px 幅のモックを 375px 換算）：文字 14px、行ピッチ 19.7px（＝行間 1.4）、段落の間 約33px（＝行 19.7＋余白 14px）。赤字はそのまま */
@media screen and (max-width: 640px) {
  body.page-top .mochi_bensho_area .mochi_bensho_alert,
  body.page-items .mochi_bensho_area .mochi_bensho_alert,
  body.page-top .mochi_bensho_area .mochi_bensho_body p,
  body.page-items .mochi_bensho_area .mochi_bensho_body p {
    font-size: 14px;
    line-height: 1.4;
    margin: 0 0 14px;
  }
}
/* 2026-09-16 伊勢さん指示：大人気の理由（SP）をラフ＝現行スマホに忠実に。
   ラフ実測（375px 換算）：h2 26px・行間 1.35・中央／各理由の見出し 16px 太字・中央・行間 1.5／本文 14px・行間 1.4／
   「▼続きを見る」青・右寄せ／理由の間に薄い罫線 */
@media screen and (max-width: 640px) {
  body.page-top .popular_reason_area h2,
  body.page-items .popular_reason_area h2 {
    font-size: 26px;
    line-height: 1.35;
    font-weight: normal;
    text-align: center;
  }
  body.page-top .popular_reason_area .cm__poplar_block .segment.no00 h3.cm__sp,
  body.page-items .popular_reason_area .cm__poplar_block .segment.no00 h3.cm__sp {
    font-size: 16px;
    line-height: 1.5;
    font-weight: bold;
    text-align: center;
    color: #000;
  }
  body.page-top .popular_reason_area .accbox.sp_ver p,
  body.page-items .popular_reason_area .accbox.sp_ver p {
    font-size: 14px;
    line-height: 1.4;
  }
  body.page-top .popular_reason_area .mochi_acc_lead,
  body.page-items .popular_reason_area .mochi_acc_lead {
    margin: 12px 0 14px;
  }
  body.page-top .popular_reason_area .accordion_switch,
  body.page-top .popular_reason_area .close_accordion,
  body.page-items .popular_reason_area .accordion_switch,
  body.page-items .popular_reason_area .close_accordion {
    color: #4169e1;
    text-decoration: none;
    font-size: 14px;
  }
  body.page-top .popular_reason_area .cm__poplar_block,
  body.page-items .popular_reason_area .cm__poplar_block {
    border-bottom: 1px solid #d5d5d5;
    padding-bottom: 14px;
    margin-bottom: 20px;
  }
  body.page-top .popular_reason_area .cm__poplar_block:last-of-type,
  body.page-items .popular_reason_area .cm__poplar_block:last-of-type {
    border-bottom: 0;
  }
}
/* 2026-09-16 伊勢さん指示：注目ボックスの本文は太字にしない（PC も）。昨日は SP だけ通常にしていた */
body.page-top .mochi_attention_box {
  font-weight: normal;
}
/* 2026-09-16 伊勢さん指示：弁償不要ブロックの写真 2 枚の下の空き 1.2em → 0.2em（DevTools で指定）。「やっぱ SP のみ」→ SP 限定 */
@media screen and (max-width: 640px) {
  body.page-top .mochi_bensho_photos,
  body.page-items .mochi_bensho_photos {
    margin: 0 auto .2em;
  }
}


/* ===== 30-items.css ===== */
/* ===== 30-items.css : 商品担当（items / set / denki / our_product / list） =====
   ・このファイルの担当以外は書かない
   ・必ずページ限定（body.page-xxx ...）でスコープする
   ・!important とインライン style は禁止
   ・保存したら node build-css.js を流し、生成後の style.css を css/style.css として上げる
   ・共通レイヤーを変えたくなったら書かずに共通担当へ申告 */

/* ============================================================
   items.html（餅つき道具単品のレンタル）
   ラフ「餅つき道具単品のレンタル」シート準拠。body.page-items は
   set/denki/list 等も持つため、items.html にしか無いクラス
   （.mochi_items_detail / .mochi_btn_grid_down / .johnson_box.items）で
   さらに絞っている
   ============================================================ */

/* --- ジョンソンボックス：送料注記は見本サイトと同じく右カラム下の
       .early_items に置いたので、index 用に表示している p.jb_hk は
       このページでは二重表示になるため消す。
       （p.jb_hk が3番目の flex 子になって右カラムを 306px に潰し、
         電話番号が「027-289-」「6080」で折れていた原因でもある） --- */
body.page-items .cm__johnson_box .johnson_box.items .jb_hk {
  display: none;
}

/* --- ページ内アンカーボタン：▼ を下向きに（ラフ「▼は下向きで」）。
       別ページへ飛ぶボタン（電動餅つき機）は共通の ▶ のまま --- */
body.page-items .mochi_btn_grid_down .mochi_pbtn_arrow_down::before {
  left: 50%;
  top: 56%;
  border-width: 9px 6px 0 6px;
  border-color: #ffffff transparent transparent transparent;
}

/* --- 見出しバンド h3（単品でレンタルできる餅つき道具 ほか）：
       トップページの .mochi_set_head と同じ大きさに揃える（ラフ sz34） --- */
@media screen and (min-width: 641px) {
  body.page-items .top.item_guide_area .mochi_band {
    font-size: 40px;
    line-height: 1.3;
  }
  body.page-items .top.item_guide_area .mochi_band .mochi_band_sub {
    font-size: 19px;
  }
}
@media screen and (max-width: 640px) {
  body.page-items .top.item_guide_area .mochi_band {
    font-size: 20px;
    line-height: 1.3;
  }
  body.page-items .top.item_guide_area .mochi_band .mochi_band_sub {
    font-size: 12px;
  }
}

/* --- 商品詳細セクション：肌色の地に白い1本のカラム（トップページの商品一覧と同じ組み方） --- */
body.page-items .mochi_items_detail {
  background-color: #FDE9D9;
  padding: 0 0 54px;
}
body.page-items .mochi_items_detail .cm__cw {
  background-color: #ffffff;
  box-sizing: border-box;
  padding: 50px 40px 30px;
}

/* グループ見出し h2（ラフ sz36・#323214≒#31320E・塗り無し） */
body.page-items .mochi_items_detail .mochi_group_head {
  margin: 0 0 30px;
  padding: 0;
  text-align: center;
  color: #31320E;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.3;
}
body.page-items .mochi_items_detail .mochi_group_head .mochi_group_sub {
  display: block;
  font-size: 19px;
  line-height: 1.3;
}
/* 2つ目のグループ見出しは商品ブロックの下に続くので、上に商品ブロックと同じ空きを取る */
body.page-items .mochi_items_detail .mochi_item_block + .mochi_group_head {
  margin-top: 60px;
}

/* 商品ブロック：上に点線の仕切り（お客様の声・商品一覧と同じピンク）。
   ラフ「点線仕切り線の上下の空きサイズを揃える」→ 上下とも 40px */
body.page-items .mochi_items_detail .mochi_item_block {
  border-top: 2px dashed #FF9BA8;
  padding: 40px 0;
  margin: 0;
}
body.page-items .mochi_items_detail .mochi_item_block:last-child {
  padding-bottom: 0;
}

/* 商品名 h2：既存の .mochi_item_block > h2（肌色帯・中央）を解除し、
   ラフどおり塗り無し・左寄せ・太字（ラフ sz24） */
body.page-items .mochi_items_detail .mochi_item_block > h2 {
  background-color: transparent;
  border-left: 0;
  padding: 0;
  margin: 0 0 20px;
  text-align: left;
  color: #31320E;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.3;
}
/* 共通料金テンプレの h3「○○レンタル」は商品名 h2 と同じ内容の二重見出しになるため見せない
   （ラフでは商品名は1つ。id="itemNNN" は他から参照されていない） */
body.page-items .mochi_items_detail .motituki_nomal > h3.func {
  display: none;
}
/* 「※単品でのレンタルはできません。」（本番にある商品のみ）：商品名の直下に */
body.page-items .mochi_items_detail .mochi_only_note {
  margin: -10px 0 16px;
  color: #FF0000;
  font-size: 14px;
  font-weight: bold;
}

/* 写真：共通の .cm__d_l img{width:100%} で 282px の元画像が 1.4〜1.6倍に
   引き伸ばされて粗くなるため、等倍を上限にする（.mein_item img{max-width:450px} も上書き） */
body.page-items .mochi_items_detail .cm__item_amount_area .cm__d_l img {
  width: auto;
  max-width: 100%;
  height: auto;
}
/* ↑の img ルール(0,4,2)に負けないよう同じ並びで書く（もち箱の 1380px 画像も 282px 止まり） */
body.page-items .mochi_items_detail .cm__item_amount_area .cm__d_l img.mein_item_img {
  max-width: 282px;
}

/* 仕様・セット内容（旧・左セルの中身）：写真の下に 13px で */
body.page-items .mochi_items_detail .mochi_spec_zone {
  margin-top: 15px;
  text-align: left;
  color: #31320E;
  font-size: 13px;
  line-height: 1.5;
}
body.page-items .mochi_items_detail .mochi_spec_zone p {
  margin: 0 0 .6em;
}
body.page-items .mochi_items_detail .mochi_spec_zone dl {
  margin: 0;
}
body.page-items .mochi_items_detail .mochi_spec_zone dt {
  font-weight: bold;
  margin-top: .6em;
}
body.page-items .mochi_items_detail .mochi_spec_zone dd {
  margin: 0 0 0 1em;
}
body.page-items .mochi_items_detail .mochi_spec_zone table {
  max-width: 100%;
}
body.page-items .mochi_items_detail .mochi_spec_zone .table2 {
  margin-bottom: 10px;
}

@media screen and (max-width: 640px) {
  body.page-items .mochi_items_detail {
    padding-bottom: 30px;
  }
  /* SP の .cm__cw は共通で幅95%（左右9px）なので、内側の左右余白は取らない */
  body.page-items .mochi_items_detail .cm__cw {
    padding: 30px 0 20px;
  }
  body.page-items .mochi_items_detail .mochi_group_head {
    font-size: 24px;
    margin-bottom: 20px;
    padding: 0 10px;
  }
  body.page-items .mochi_items_detail .mochi_group_head .mochi_group_sub {
    font-size: 13px;
  }
  body.page-items .mochi_items_detail .mochi_item_block + .mochi_group_head {
    margin-top: 40px;
  }
  body.page-items .mochi_items_detail .mochi_item_block {
    padding: 30px 0;
  }
  body.page-items .mochi_items_detail .mochi_item_block > h2 {
    font-size: 20px;
    margin: 0 0 14px;
  }
  body.page-items .mochi_items_detail .mochi_only_note {
    margin: -6px 0 12px;
  }
  /* 仕様表は 310px 固定（.mochi_w310_mb10・詳細度0,5,0）のままだと 375px では窮屈なので幅いっぱいに */
  body.page-items .mochi_items_detail .mochi_item_block .mochi_spec_zone table.table2.mochi_w310_mb10,
  body.page-items .mochi_items_detail .mochi_item_block .mochi_spec_zone table.table2.mochi_w310,
  body.page-items .mochi_items_detail .mochi_item_block .mochi_spec_zone table.table2.mochi_w100 {
    width: 100%;
  }
}

/* --- 「≫その他の取り扱い商品一覧はこちら」：ラフは青(#0000CC)・太字・16pt --- */
body.page-items .top.item_guide_area .mochi_to_list a {
  color: #0000CC;
  font-weight: bold;
  text-decoration: underline;
}

/* --- 仕様表の見出しセル：旧サイト色 #FAF7C8／#020202 をカラーコード（肌色・茶）に --- */
body.page-items .mochi_items_detail .mochi_spec_zone .table2 tr th,
body.page-items .mochi_items_detail .mochi_spec_zone .table2 tr td.mochi_ta_center {
  background-color: #FDE9D9;
  color: #31320E;
}

/* --- SP：ジョンソンボックスの見出しが items 専用ルールで 14px（index は 18px）になっていたので index に揃える --- */
@media screen and (max-width: 640px) {
  body.page-items .cm__johnson_box.site_s4.product_list .cm__jb_site994_h2 {
    font-size: 18px;
  }
  /* SP：共通の .cm__finale_zone{margin-right:1em} が、親に左右余白の無いこのページでは
     料金表(375px)との右端ずれ(16px)として露出するので消す */
  body.page-items .mochi_items_detail .cm__finale_zone {
    margin-right: 0;
  }
}

/* --- ジョンソンボックス（PC）：送料注記 .early_items が共通の top:1em（style.css 5041）で
       14px 下にずれ、親 .segment1029（overflow:hidden）の下端で切れて読めなかった。
       ずらす代わりに margin で同じ間隔を取り、親の高さに含める --- */
body.page-items .cm__johnson_box .johnson_box.items .segment1029 .early_items {
  top: 0;
  margin-top: 14px;
}

/* ============================================================
   list.html「一緒におすすめのレンタル商品」
   ラフ（セット・単品商品一覧シート）準拠：商品名は左寄せ、写真は左、説明は右、
   右カラムの下に赤い「詳細と価格はこちら ＞」ボタン、商品間はピンクの点線、
   点線の上下の空きは同じ 40px、見出し・点線・写真の左端を揃える
   ============================================================ */
body.page-items .mochi_reco_list .mochi_reco_item {
  padding: 40px 0;
  margin: 0;
}
body.page-items .mochi_reco_list .mochi_reco_item:not(:last-child) {
  border-bottom: 2px dashed #FF9BA8;
}
body.page-items .mochi_reco_list .mochi_reco_item:first-child {
  padding-top: 10px;
}
body.page-items .mochi_reco_list .mochi_reco_item:last-child {
  padding-bottom: 10px;
}
body.page-items .select_spot.item_guide_area .mochi_reco_list .mochi_reco_item h4 {
  margin: 0 0 20px;
  text-align: left;
  color: #31320E;
  font-size: 22px;
  line-height: 1.3;
}
body.page-items .mochi_reco_list .mochi_reco_photo {
  flex: 0 0 400px;
  text-align: left;
}
body.page-items .mochi_reco_list .mochi_reco_img {
  width: 100%;
  max-width: 400px;
  height: auto;
}
body.page-items .mochi_reco_list .mochi_reco_txt {
  flex: 1 1 300px;
  min-width: 0;
}
body.page-items .mochi_reco_list .mochi_goto {
  margin: 30px 0 0;
  padding: 0;
  text-align: right;
}
body.page-items .mochi_reco_list .mochi_goto_btn,
body.page-items .mochi_reco_list .mochi_goto_btn:link,
body.page-items .mochi_reco_list .mochi_goto_btn:visited {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 20px 48px 20px 24px;
  position: relative;
  background-color: #FF0000;
  color: #ffffff;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}
body.page-items .mochi_reco_list .mochi_goto_btn:hover {
  filter: brightness(1.08);
}
body.page-items .mochi_reco_list .mochi_goto_arrow {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_reco_list .mochi_reco_item {
    padding: 24px 0;
  }
  body.page-items .select_spot.item_guide_area .mochi_reco_list .mochi_reco_item h4 {
    font-size: 18px;
    margin-bottom: 12px;
  }
  body.page-items .mochi_reco_list .mochi_reco_photo {
    flex: 1 1 100%;
    text-align: center;
  }
  body.page-items .mochi_reco_list .mochi_reco_txt {
    flex: 1 1 100%;
  }
  body.page-items .mochi_reco_list .mochi_goto {
    margin-top: 16px;
  }
  body.page-items .mochi_reco_list .mochi_goto_btn,
  body.page-items .mochi_reco_list .mochi_goto_btn:link,
  body.page-items .mochi_reco_list .mochi_goto_btn:visited {
    font-size: 18px;
    padding: 14px 40px 14px 16px;
  }
  body.page-items .mochi_reco_list .mochi_goto_arrow {
    font-size: 18px;
    right: 14px;
  }
}

/* 写真の方が説明より背が高い商品（6点セット等）だと、ボタン下端→点線の空きが
   40px＋差分に広がっていた。右カラムを縦 flex にしてボタンを下端に寄せ、常に 40px にする */
body.page-items .mochi_reco_list .mochi_reco_txt {
  display: flex;
  flex-direction: column;
  align-self: stretch;
}
body.page-items .mochi_reco_list .mochi_goto {
  margin-top: auto;
  padding-top: 30px;
}

/* ============================================================
   list.html（取り扱い商品一覧）ラフ準拠の調整
   ============================================================ */
/* 帯見出し h3：.s4_cw h3{48px} に負けていたのを、トップの .mochi_set_head と同じ 40px に。
   小見出し（.mochi_band_sub）は帯の中の1段目 */
body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area h3.mochi_head_bar {
  font-size: 40px;
  line-height: 1.3;
  color: #31320E;
}
body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area h3.mochi_head_bar .mochi_band_sub {
  font-size: 19px;
  font-weight: bold;
}
/* ページ内リンクの帯（5つ）：上下の空きを h3 の上の空き（50px）と揃える。
   白カラム(.cm__cw)の下 padding 12px と合わせて 50px になるよう 38px */
body.page-items .top.item_guide_area.mochi_items_head .mochi_anchor_grid {
  margin: 50px 0 38px;
}
/* 各商品群（.block）の上の空き＝50px（帯の上の空き） */
body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area > .block {
  padding-top: 50px;
}
@media screen and (max-width: 640px) {
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area h3.mochi_head_bar {
    font-size: 20px;
  }
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area h3.mochi_head_bar .mochi_band_sub {
    font-size: 12px;
  }
  body.page-items .top.item_guide_area.mochi_items_head .mochi_anchor_grid {
    margin: 30px 0 30px;
  }
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area > .block {
    padding-top: 30px;
  }
}

/* --- list.html 本格石臼餅つきセットの「詳細と価格はこちら」：おすすめ商品と同じ赤ボタン。
       ラフは1段目に小さく「イベント成功にこだわった本格餅つきセット」、2段目に大きく「詳細と価格はこちら ＞」。
       カラム幅いっぱいだと大きすぎるので中央に最大 700px --- */
body.page-items .select_spot.item_guide_area .mochi_goto_set {
  margin: 30px auto 0;
  max-width: 700px;
  text-align: center;
}
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn,
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn:link,
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn:visited {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 16px 48px 16px 24px;
  position: relative;
  background-color: #FF0000;
  color: #ffffff;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn:hover {
  filter: brightness(1.08);
}
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_sub {
  display: block;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 4px;
}
body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_arrow {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
}
@media screen and (max-width: 640px) {
  body.page-items .select_spot.item_guide_area .mochi_goto_set {
    margin: 20px 10px 0;
  }
  body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn,
  body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn:link,
  body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_btn:visited {
    font-size: 20px;
    padding: 12px 40px 12px 16px;
  }
  body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_sub {
    font-size: 12px;
  }
  body.page-items .select_spot.item_guide_area .mochi_goto_set .mochi_goto_arrow {
    font-size: 20px;
    right: 14px;
  }
}

/* --- 【修正】おすすめ商品の赤ボタン：ラフ実測（幅はカラムの約38%・高さ70px・文字20px相当）に対して
       幅いっぱい(596px)・26px と大きすぎた。ラフどおり右寄せの自然幅（最小360px）にし、
       ボタン内の白い枠（商品名）も入れる。※前回「白い枠は注釈」と判断したのは誤り --- */
body.page-items .mochi_reco_list .mochi_goto_btn,
body.page-items .mochi_reco_list .mochi_goto_btn:link,
body.page-items .mochi_reco_list .mochi_goto_btn:visited {
  display: inline-block;
  width: auto;
  min-width: 360px;
  max-width: 100%;
  padding: 8px 48px 10px 18px;
  font-size: 20px;
  line-height: 1.3;
  text-align: center;
}
/* 商品名：白い枠は不要とのことなので、赤地に白文字の1段目にする */
body.page-items .mochi_reco_list .mochi_goto_name {
  display: block;
  color: #ffffff;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.4;
  padding: 0;
  margin: 0 0 2px;
  text-align: center;
}
body.page-items .mochi_reco_list .mochi_goto_arrow {
  font-size: 22px;
  right: 16px;
}
/* 【セット内容】の箇条書き：ラフは「●」付き。共通の li{list-style:none} で消えていた */
body.page-items .mochi_reco_list .mochi_ul_disc li {
  list-style: disc;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_reco_list .mochi_goto_btn,
  body.page-items .mochi_reco_list .mochi_goto_btn:link,
  body.page-items .mochi_reco_list .mochi_goto_btn:visited {
    display: block;
    width: 100%;
    min-width: 0;
    font-size: 17px;
    padding: 8px 40px 10px 14px;
  }
  body.page-items .mochi_reco_list .mochi_goto_name {
    font-size: 12px;
  }
  body.page-items .mochi_reco_list .mochi_goto_arrow {
    font-size: 18px;
    right: 14px;
  }
}

/* --- list.html：白カラムの中に移した「模擬店の成功…」バナーと、追加した Q&A ---
   ラフの吹き出し「h3上空きと同じ空きサイズ」→ 上の空きは他ブロックと同じ 50px（.block の padding-top） */
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_mogiten_block {
  background-color: transparent;
  padding: 50px 0 0;
  text-align: center;
}
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_mogiten_block h3 {
  font-size: 28px;
  margin: 0 0 20px;
}
/* Q&A：見出しの色はトップ・単品と同じ（PC は開いたまま、SP はアコーディオン） */
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_faq_block {
  padding: 50px 0 20px;
}
body.page-items .mochi_items_body .mochi_faq_block .zone {
  max-width: 860px;
  margin: 0 auto;
}
body.page-items .mochi_items_body .mochi_faq_block .mochi_acc_head h4,
body.page-items .mochi_items_body .mochi_faq_block .mochi_acc_head h4 .red {
  color: #EE7800;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_mogiten_block {
    padding-top: 30px;
  }
  body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_mogiten_block h3 {
    font-size: 18px;
  }
  body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_faq_block {
    padding: 30px 10px 10px;
  }
  body.page-items .mochi_items_body .mochi_faq_block .mochi_acc_head h4,
  body.page-items .mochi_items_body .mochi_faq_block .mochi_acc_head h4 .red {
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.1;
    margin: 0;
  }
}

/* --- list.html：白カラムの下端。中の余白（Q&A の下）を 50px にし、
       白カラムと次の「笑顔をつなぐ」の間に、上端と同じ 54px の肌色の地を出す --- */
body.page-items .top.item_guide_area.mochi_items_body {
  padding-bottom: 54px;
}
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_faq_block {
  padding-bottom: 50px;
}
@media screen and (max-width: 640px) {
  body.page-items .top.item_guide_area.mochi_items_body {
    padding-bottom: 30px;
  }
  body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_faq_block {
    padding-bottom: 30px;
  }
}

/* --- list.html SP：帯見出しに共通の .anchor_down{margin-top:-100px;padding-top:100px} が効き、
       padding だけ上書きされて margin -100px が残り、帯が上のブロックの裏に隠れて下 20px しか見えなかった。
       SP では固定ヘッダーが無いので逃がし自体が不要 --- */
@media screen and (max-width: 640px) {
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area h3.mochi_head_bar {
    margin-top: 0;
    padding-top: 10px;
  }
}

/* --- list.html おすすめ商品：ラフ（スマホ）準拠 ---
   PC：赤ボタン（.mochi_goto）／SP：「▼詳しくはこちら」のテキストリンク（.mochi_goto_sp）に切替。
   SP でも写真は左（約40%）・説明は右の2カラム。「※石臼と併用もおすすめです」は商品名の直下に小さく */
body.page-items .mochi_reco_list .mochi_goto_sp {
  display: none;
}
body.page-items .mochi_reco_list .mochi_reco_note {
  margin: -14px 0 12px;
  font-size: 14px;
  font-weight: bold;
  color: #31320E;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_reco_list .mochi_goto {
    display: none;
  }
  body.page-items .mochi_reco_list .mochi_goto_sp {
    display: block;
    margin: 12px 0 0;
    text-align: right;
    font-size: 14px;
  }
  body.page-items .mochi_reco_list .mochi_goto_sp a,
  body.page-items .mochi_reco_list .mochi_goto_sp a:link,
  body.page-items .mochi_reco_list .mochi_goto_sp a:visited {
    color: #0000CC;
    text-decoration: none;
  }
  body.page-items .mochi_reco_list .mochi_flex_g24.mochi_flex_g24.mochi_flex_g24.mochi_flex_g24.mochi_flex_g24 {
    gap: 12px;
    flex-wrap: nowrap;
  }
  body.page-items .mochi_reco_list .mochi_reco_photo {
    flex: 0 0 40%;
    text-align: left;
  }
  body.page-items .mochi_reco_list .mochi_reco_txt {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
  }
  body.page-items .mochi_reco_list .mochi_reco_txt p,
  body.page-items .mochi_reco_list .mochi_reco_txt li {
    font-size: 13px;
    line-height: 1.5;
  }
  body.page-items .mochi_reco_list .mochi_reco_note {
    margin: -8px 0 10px;
    font-size: 12px;
  }
}

/* --- list.html：帯見出しの上の空きを全ブロックで同じにする（ローカルプレビューで実測：46/30/62/44px とバラついていた）。
       原因は各ブロック末尾の margin-bottom（.mochi_block 16px・.mochi_btn_grid 36px）が
       次のブロックの padding-top に足されていたこと。ブロック末尾の下マージンを 0 にして padding-top だけで揃える --- */
body.page-items .mochi_items_body .select_spot.item_guide_area > .block > :last-child,
body.page-items .mochi_items_body .select_spot.item_guide_area > .block .mochi_btn_grid {
  margin-bottom: 0;
}
/* Q&A ブロック：共通の .block{width:98%}(content-box) に左右 padding が足されて 388px になり、
   SP で右に 13px はみ出していた。border-box にして親幅に収める */
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_faq_block {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
}
/* 模擬店バナーのブロック末尾（バナー下のリンク p）の margin も 0 にして、次の帯の上の空きを揃える */
body.page-items .mochi_items_body .select_spot.item_guide_area > .mochi_mogiten_block .cm__all_item_list_banner > :last-child {
  margin-bottom: 0;
}
/* 帯リンク群→最初の帯「本格石臼餅つきセット」の空き：白カラム上側の 50px（padding12＋margin38）に
   さらに .block の padding-top 50 が足されて 100px だったので、最初のブロックだけ 0 にして 50px に揃える */
/* ※上の padding-top:50px の指定（.top.item_guide_area 付き・詳細度(0,7,1)）に勝つよう同じ書き出しにする */
body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area > .block:first-child {
  padding-top: 0;
}

/* --- 2026-09-14 伊勢さん指摘：list.html SP で、帯リンク群の白カラムと最初の帯見出し「本格石臼餅つきセット」の間に
       肌色の帯（30px）が出て、帯見出し（肌色）とつながって見えた。
       原因：.mochi_anchor_grid の margin-bottom 30px が .cm__cw（padding-bottom 0）を突き抜けて
             セクションの肌色地が見える ＋ 次のセクションは白なのに帯見出しが上端ぴったりに乗る。
       対策：白カラムをつなげ（padding で受ける）、帯見出しの上に白の空き 30px を作る --- */
@media screen and (max-width: 640px) {
  body.page-items .top.item_guide_area.mochi_items_head > .cm__cw {
    padding-bottom: 30px;
  }
  body.page-items .top.item_guide_area.mochi_items_head .mochi_anchor_grid {
    margin-bottom: 0;
  }
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area > .block:first-child {
    padding-top: 30px;
  }
}
/* 同じ指摘の続き：帯リンク「餅つきセットと一緒におすすめ」が SP で「一緒におす／すめ」と途中で折れる。
   小さい「餅つきセットと」を SP では 1 行目に独立させ、大きい「一緒におすすめ」を 2 行目に収める。
   帯見出しの上の空きは 76px（.s4_items_anchor mb16 ＋ 白カラム pb30 ＋ block pt30）→ block 側を 15px にして 61px */
@media screen and (max-width: 640px) {
  body.page-items .mochi_anchor_grid .mochi_head_bar_link .mochi_fs072_normal {
    display: block;
    line-height: 1.2;
  }
  body.page-items .top.item_guide_area.mochi_items_body .select_spot.item_guide_area > .block:first-child {
    padding-top: 15px;
  }
}

/* ============================================================
   2026-09-15 set.html：ラフ（本格石臼餅つきセットのレンタル_キャプチャ image181/205）準拠の組み替え
   ・ラフの画像（scratchpad/raf_view/set_pc_NN.png・set_sp_NN.png）を見て合わせている
   ============================================================ */
/* --- ページ上部：キャッチ＋h1（中央）／リード／大きな一文／写真2枚／ベージュ角丸箱 --- */
body.page-items .mochi_set_top {
  text-align: center;
  max-width: 1000px;
  margin: 0 auto;
}
body.page-items .mochi_set_top .mochi_set_top_catch {
  font-size: 16px;
  font-weight: bold;
  color: #31320E;
  margin: 0 0 4px;
}
body.page-items .product_of_individual .mochi_set_top h2.mochi_set_top_h1 {
  font-size: 40px;
  line-height: 1.3;
  color: #31320E;
  text-align: center;
  margin: 0 0 36px;
}
body.page-items .mochi_set_top .mochi_set_top_lead,
body.page-items .mochi_set_compare .mochi_set_top_lead {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.8;
  margin: 0 0 28px;
}
body.page-items .mochi_set_top .mochi_set_top_big,
body.page-items .mochi_set_compare .mochi_set_top_big {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.5;
  color: #31320E;
  margin: 0 0 24px;
}
body.page-items .mochi_set_top .mochi_set_top_photos {
  display: flex;
  justify-content: center;
  gap: 4%;
  margin: 0 0 24px;
}
body.page-items .mochi_set_top .mochi_set_top_photos img {
  width: 42%;
  height: auto;
  display: block;
}
/* セット内容の角丸ベージュ箱（ラフ：h4 太字＋3行、幅 90%） */
body.page-items .mochi_set_top .mochi_set_box {
  text-align: left;
  background: #E1E0C1;
  border-radius: 16px;
  padding: 24px 32px;
  max-width: 90%;
  margin: 0 auto 32px;
  box-sizing: border-box;
}
body.page-items .mochi_set_top .mochi_set_box .mochi_set_box_h4 {
  font-size: 16px;
  font-weight: bold;
  color: #31320E;
  margin: 0 0 14px;
}
body.page-items .mochi_set_top .mochi_set_box p {
  font-size: 14px;
  line-height: 2;
  margin: 0;
}
body.page-items .mochi_set_top .mochi_set_box .mochi_set_box_label {
  font-weight: bold;
  margin-right: 1em;
}
body.page-items .mochi_set_top .mochi_set_top_text {
  text-align: left;
  font-size: 15px;
  line-height: 1.9;
}
body.page-items .mochi_set_top .mochi_set_top_text p {
  margin: 0 0 1.2em;
}
/* 大人気の理由：ラフは h2・中央・40px、下線なし */
body.page-items .product_of_individual .p_item.zone h2.mochi_set_reason_h2 {
  font-size: 40px;
  color: #31320E;
  text-align: center;
  border: 0;
  margin: 40px 0 28px;
}
body.page-items .mochi_set_reason_list li p {
  font-size: 15px;
  line-height: 1.8;
}
/* 各道具ブロック：h3 は赤の左バー（吹き出し「赤に」）、写真左 42%・仕様表右 31% */
body.page-items .product_of_individual .p_item.zone h3.mochi_tool_h3 {
  border-left: 6px solid #FF0000;
  font-size: 28px;
}
body.page-items .mochi_tool_row {
  display: flex;
  gap: 4%;
  align-items: flex-start;
  margin: 0 0 32px;
}
body.page-items .mochi_tool_row .mochi_tool_photo {
  flex: 0 0 42%;
}
body.page-items .mochi_tool_row .mochi_tool_photo img {
  width: 100%;
  height: auto;
  display: block;
}
body.page-items .mochi_tool_row .mochi_tool_spec {
  flex: 0 0 36%;
  font-size: 13px;
}
body.page-items .mochi_tool_row .mochi_tool_spec .overview p {
  font-size: 12px;
  line-height: 1.7;
}
body.page-items .product_of_individual .overview h4.mochi_tool_h4 {
  font-size: 18px;
  font-weight: bold;
  color: #31320E;
  margin: 28px 0 12px;
}
/* 比較表（料金ブロック直前へ移動）：ラフは中央 64%・罫線あり */
body.page-items .mochi_set_compare {
  max-width: 1000px;
  margin: 0 auto 40px;
  padding: 0 20px;
}
body.page-items .mochi_set_compare .mochi_set_compare_h3 {
  font-size: 28px;
  color: #31320E;
  border-left: 6px solid #FF0000;
  padding-left: 14px;
  margin: 0 0 20px;
}
body.page-items .mochi_set_compare .mochi_table th,
body.page-items .mochi_set_compare .mochi_table td {
  border: 1px solid #b7b7b7;
  text-align: center;
  padding: 6px 4px;
}
@media screen and (max-width: 640px) {
  body.page-items .product_of_individual .mochi_set_top h2.mochi_set_top_h1 { font-size: 24px; margin-bottom: 20px; }
  body.page-items .mochi_set_top .mochi_set_top_catch { font-size: 13px; }
  body.page-items .mochi_set_top .mochi_set_top_lead { font-size: 16px; margin-bottom: 16px; }
  body.page-items .mochi_set_top .mochi_set_top_big { font-size: 20px; margin-bottom: 16px; }
  body.page-items .mochi_set_top .mochi_set_top_photos { gap: 3%; }
  body.page-items .mochi_set_top .mochi_set_top_photos img { width: 48.5%; }
  body.page-items .mochi_set_top .mochi_set_box { max-width: 100%; padding: 16px 18px; border-radius: 12px; }
  body.page-items .mochi_set_top .mochi_set_box p { font-size: 13px; line-height: 1.8; }
  body.page-items .mochi_set_top .mochi_set_box .mochi_set_box_label { display: block; margin-right: 0; }
  body.page-items .mochi_set_top .mochi_set_top_text { font-size: 14px; }
  body.page-items .product_of_individual .p_item.zone h2.mochi_set_reason_h2 { font-size: 24px; margin: 30px 0 20px; }
  body.page-items .product_of_individual .p_item.zone h3.mochi_tool_h3 { font-size: 20px; }
  body.page-items .mochi_tool_row { display: block; }
  body.page-items .mochi_tool_row .mochi_tool_photo { margin: 0 auto 16px; max-width: 320px; }
  body.page-items .product_of_individual .overview h4.mochi_tool_h4 { font-size: 16px; }
  body.page-items .mochi_set_compare .mochi_set_compare_h3 { font-size: 20px; }
}
/* 大人気の理由の .p_item.zone は共通で display:flex（h3＋下線を横に並べる設計）なので、h2 と箇条書きが横に並んでしまう → 縦積みに */
body.page-items .product_of_individual .p_item.zone:has(> .mochi_set_reason_h2) {
  display: block;
}
body.page-items .product_of_individual .p_item.zone > .mochi_set_reason_h2 {
  width: 100%;
}
/* 各道具 h3 の下の細い罫線（ラフにある）。under_line の div を外したので border で */
body.page-items .product_of_individual .p_item.zone h3.mochi_tool_h3 {
  border-bottom: 1px solid #b7b7b7;
  padding-bottom: 8px;
  margin-bottom: 24px;
}

/* --- set.html 料金ブロック前（ラフ image181 7枚目）：黄色箱・赤注記・縦型比較表 --- */
body.page-items .mochi_yellow_box {
  background: #FFFFCC;
  padding: 24px 32px;
  margin: 0 auto 24px;
  max-width: 91%;
  text-align: left;
  font-size: 14px;
  line-height: 1.9;
  box-sizing: border-box;
}
body.page-items .mochi_yellow_box p { margin: 0 0 1em; }
body.page-items .mochi_yellow_box p:last-child { margin-bottom: 0; }
body.page-items .mochi_yellow_box .mochi_mb0 { margin-bottom: 0; }
body.page-items .mochi_yellow_box .mochi_yellow_list { margin: 0 0 1em 1.5em; padding: 0; font-weight: bold; }
body.page-items .mochi_yellow_box .mochi_yellow_list li { list-style: disc; }
body.page-items .mochi_set_compare .mochi_set_top_lead { text-align: center; }
body.page-items .mochi_set_compare .mochi_set_top_big { text-align: center; }
body.page-items .mochi_set_warn {
  color: #FF0000;
  font-size: 14px;
  line-height: 1.9;
  max-width: 91%;
  margin: 0 auto 32px;
}
body.page-items .mochi_set_warn .mochi_set_warn_note { color: #333; font-size: 12px; }
/* 縦型の比較表：中央 64%・罫線・カテゴリ列は薄色・基本／簡易の見出しは青バッジ（ラフ吹き出し：写真のアイコンと同じ青地白文字） */
body.page-items .mochi_set_compare .mochi_set_vtable {
  width: 64%;
  margin: 0 auto;
  border-collapse: collapse;
}
body.page-items .mochi_set_compare .mochi_set_vtable th,
body.page-items .mochi_set_compare .mochi_set_vtable td {
  border: 1px solid #b7b7b7;
  padding: 6px 8px;
  text-align: center;
  font-size: 14px;
  background: #fff;
}
body.page-items .mochi_set_compare .mochi_set_vtable tr:first-child th { border-top: 0; border-left: 0; background: transparent; }
body.page-items .mochi_set_compare .mochi_set_vtable tr:first-child th:nth-child(-n+2) { border: 0; }
body.page-items .mochi_set_compare .mochi_set_vtable .mochi_cat { font-weight: bold; }
body.page-items .mochi_set_compare .mochi_set_vtable .mochi_cat1 { background: #DCE6F1; }
body.page-items .mochi_set_compare .mochi_set_vtable .mochi_cat2 { background: #EBF1DE; }
body.page-items .mochi_set_compare .mochi_set_vtable .mochi_cat3 { background: #FDE9D9; }
body.page-items .mochi_set_compare .mochi_set_vtable .mochi_none { background: #ddd; }
body.page-items .mochi_set_compare .mochi_set_badge {
  display: inline-block;
  background: #1F5FBF;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.1;
  padding: 4px 8px 2px;
  border-radius: 4px;
}
body.page-items .mochi_set_compare .mochi_set_badge small { display: block; font-size: 10px; font-weight: normal; }
body.page-items .mochi_set_vtable_note { text-align: right; font-size: 12px; max-width: 82%; margin: 8px auto 0; }

/* --- 商品カード（基本／簡易）：写真／料金表／★点線枠、セット内容 2列／黄色箱 --- */
body.page-items .mochi_card .mochi_card_row1 {
  display: flex;
  gap: 2%;
  align-items: flex-start;
  margin: 0 0 20px;
}
body.page-items .mochi_card .mochi_card_photo { flex: 0 0 34%; }
body.page-items .mochi_card .mochi_card_photo img { width: 100%; max-width: 282px; height: auto; display: block; margin: 0 auto; }
body.page-items .mochi_card .mochi_card_price { flex: 0 0 31%; }
body.page-items .mochi_card .mochi_price_tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
body.page-items .mochi_card .mochi_price_tbl th { background: #7f7f7f; color: #fff; font-weight: bold; padding: 4px 6px; text-align: center; }
body.page-items .mochi_card .mochi_price_tbl td { border: 1px solid #ccc; padding: 6px 8px; background: #fff; vertical-align: middle; }
body.page-items .mochi_card .mochi_price_tbl td small { font-size: 11px; }
body.page-items .mochi_card .mochi_price_tbl .mochi_price_num { text-align: right; white-space: nowrap; font-weight: bold; }
body.page-items .mochi_card .mochi_card_otoku { font-size: 13px; line-height: 1.7; margin: 10px 0 0; }
body.page-items .mochi_card .mochi_card_merit {
  flex: 0 0 29%;
  border: 2px dashed #333;
  padding: 14px 16px;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.7;
  box-sizing: border-box;
}
body.page-items .mochi_card .mochi_card_merit p { margin: 0 0 6px; }
body.page-items .mochi_card .mochi_card_merit .mochi_card_merit_hk { font-weight: normal; font-size: 11px; text-align: right; margin: 6px 0 0; }
body.page-items .mochi_card .mochi_card_row2 {
  display: flex;
  gap: 4%;
  align-items: flex-start;
  margin: 0 0 24px;
}
body.page-items .mochi_card .mochi_card_contents { flex: 0 0 40%; font-size: 14px; }
body.page-items .mochi_card .mochi_card_contents ul { columns: 2; margin: 0 0 0 1.2em; padding: 0; }
body.page-items .mochi_card .mochi_card_contents li { list-style: disc; line-height: 1.8; break-inside: avoid; }
body.page-items .mochi_card .mochi_card_boxes { flex: 1 1 auto; }
body.page-items .mochi_card .mochi_yellow_box_s { max-width: none; padding: 14px 18px; margin: 0 0 12px; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_yellow_box { max-width: 100%; padding: 16px 16px; font-size: 13px; }
  body.page-items .mochi_set_warn { max-width: 100%; font-size: 13px; }
  body.page-items .mochi_set_compare .mochi_set_vtable { width: 100%; }
  body.page-items .mochi_set_compare .mochi_set_vtable th, body.page-items .mochi_set_compare .mochi_set_vtable td { font-size: 12px; padding: 5px 4px; }
  body.page-items .mochi_set_vtable_note { max-width: 100%; }
  body.page-items .mochi_card .mochi_card_row1 { display: block; }
  body.page-items .mochi_card .mochi_card_photo { margin: 0 auto 16px; max-width: 282px; }
  body.page-items .mochi_card .mochi_card_price { margin: 0 0 16px; }
  body.page-items .mochi_card .mochi_card_merit { margin: 0 0 16px; }
  body.page-items .mochi_card .mochi_card_row2 { display: block; }
  body.page-items .mochi_card .mochi_card_contents { margin: 0 0 16px; }
}
/* .cm__item_amount_area は共通で flex（cm__d_l／cm__d_r を横並び）なので、行1・行2 が横に並んでしまう → 縦積みに */
body.page-items .cm__item_amount_area.mochi_card {
  display: block;
}
body.page-items .mochi_card .mochi_price_tbl td:first-child { white-space: nowrap; }

/* --- set.html：説明書QRのベージュ角丸箱（ラフ h4）と、赤枠の予約 CTA --- */
body.page-items .mochi_qr_box {
  position: relative;
  background: #E1E0C1;
  border-radius: 20px;
  padding: 28px 200px 24px 32px;
  margin: 40px auto 32px;
  max-width: 90%;
  font-size: 14px;
  line-height: 1.9;
  box-sizing: border-box;
}
body.page-items .mochi_qr_box .mochi_qr_thumb {
  position: absolute;
  top: -20px;
  right: 20px;
  width: 150px;
  height: auto;
  transform: rotate(6deg);
}
body.page-items .mochi_qr_box .mochi_qr_h4 { font-size: 16px; font-weight: bold; color: #31320E; margin: 0 0 14px; }
body.page-items .mochi_qr_box p { margin: 0 0 1em; }
body.page-items .mochi_qr_box p:last-child { margin-bottom: 0; }
body.page-items .mochi_cta_box {
  border: 2px solid #FF0000;
  background: #fff;
  text-align: center;
  padding: 24px 20px 20px;
  margin: 32px auto 0;
  max-width: 1000px;
  box-sizing: border-box;
}
body.page-items .mochi_cta_box .mochi_cta_lead { font-size: 16px; font-weight: bold; line-height: 1.8; margin: 0 0 16px; }
body.page-items .mochi_cta_box .mochi_cta_btn { margin: 0 0 16px; }
body.page-items .mochi_cta_box .mochi_set_cta {
  display: inline-block;
  background: #FF0000;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-decoration: none;
  padding: 14px 40px;
  border-radius: 4px;
}
body.page-items .mochi_cta_box .mochi_set_cta_arrow { margin-left: 12px; }
body.page-items .mochi_cta_box .mochi_cta_tel { font-size: 14px; line-height: 1.8; margin: 0; }
body.page-items .mochi_cta_box .mochi_cta_tel .mochi_tel_link { color: #31320E; font-weight: bold; font-size: 16px; text-decoration: none; }
body.page-items .mochi_cta_box .mochi_cta_hours { font-size: 11px; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_qr_box { max-width: 100%; padding: 60px 18px 18px; border-radius: 14px; font-size: 13px; }
  body.page-items .mochi_qr_box .mochi_qr_thumb { width: 90px; top: -14px; right: 12px; }
  body.page-items .mochi_cta_box { padding: 18px 12px 14px; }
  body.page-items .mochi_cta_box .mochi_cta_lead { font-size: 14px; }
  body.page-items .mochi_cta_box .mochi_set_cta { font-size: 18px; padding: 12px 24px; }
}
body.page-items .product_of_individual .p_item.zone.mochi_howto_zone { display: block; }
body.page-items .mochi_cta_box { margin-bottom: 40px; }
/* 12px 未満の文字を無くす（自動チェック F）＋ SP では説明書サムネを箱の中に静止させる */
body.page-items .mochi_set_compare .mochi_set_badge small { font-size: 12px; }
body.page-items .mochi_card .mochi_price_tbl td small { font-size: 12px; }
body.page-items .mochi_cta_box .mochi_cta_hours { font-size: 12px; }
body.page-items .mochi_card .mochi_card_merit .mochi_card_merit_hk { font-size: 12px; }
body.page-items .mochi_set_warn .mochi_set_warn_note { font-size: 12px; }
body.page-items .mochi_set_vtable_note { font-size: 12px; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_qr_box { padding: 18px 18px 18px; }
  body.page-items .mochi_qr_box .mochi_qr_thumb { position: static; display: block; width: 110px; margin: 0 auto 12px; transform: rotate(0); }
}
@media screen and (max-width: 640px) {
  /* h1 の .anchor_down（padding-top:100px / margin-top:-100px）で、上のキャッチとの間が 100px 空く → SP は逃がし不要 */
  body.page-items .product_of_individual .mochi_set_top h2.mochi_set_top_h1 { padding-top: 0; margin-top: 0; }
}
/* 料金表の下の予約ボタン：トップの赤ボタン（.mochi_set_cta）と同じ見た目で中央に */
body.page-items .mochi_price_cta { text-align: center; margin: 24px 0 0; }
body.page-items .mochi_price_cta .mochi_set_cta {
  display: inline-block;
  background: #FF0000;
  color: #fff;
  text-decoration: none;
  padding: 12px 36px 14px;
  border-radius: 4px;
  min-width: 420px;
  box-sizing: border-box;
}
body.page-items .mochi_price_cta .mochi_set_cta_lead { display: block; font-size: 14px; font-weight: bold; color: #fff; }
body.page-items .mochi_price_cta .mochi_set_cta_main { display: block; font-size: 22px; font-weight: bold; color: #fff; }
body.page-items .mochi_price_cta .mochi_set_cta_arrow { margin-left: 10px; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_price_cta .mochi_set_cta { min-width: 0; width: 100%; padding: 10px 12px 12px; }
  body.page-items .mochi_price_cta .mochi_set_cta_main { font-size: 18px; }
}
/* set.html SP 末尾の「一緒におすすめ」帯（.sp なので PC では出ない） */
@media screen and (max-width: 640px) {
  body.page-items .mochi_set_reco > .cm__cw { padding: 20px 9.375px 30px; }
}
/* 2026-09-15 伊勢さん指示：上部の写真は 1 枚絵（img/set_all.webp 1478×704）。カラム幅いっぱい */
body.page-items .mochi_set_top .mochi_set_top_photos img {
  width: 100%;
  max-width: 900px;
}

/* --- denki.html（ラフ image211/219 準拠）--- */
body.page-items .mochi_denki_top .mochi_denki_row { text-align: left; margin: 0 0 32px; }
body.page-items .mochi_denki_top .mochi_denki_row .mochi_tool_photo { flex: 0 0 40%; }
body.page-items .mochi_denki_top .mochi_denki_row .mochi_tool_photo img { max-width: 360px; margin: 0 auto; }
body.page-items .mochi_denki_top .mochi_denki_row .mochi_tool_spec { flex: 0 0 40%; }
body.page-items .mochi_denki_top .mochi_denki_row .mochi_tool_spec .asterisk { font-size: 12px; margin-top: 8px; }
/* Q&A：ラフはオレンジの太字「Q 〜」、回答は 1 字下げ */
body.page-items .mochi_denki_qa { text-align: left; margin: 12px 0 0; }
body.page-items .mochi_denki_qa .mochi_denki_q {
  font-size: 16px;
  font-weight: bold;
  color: #E8641B;
  line-height: 1.6;
  margin: 24px 0 8px;
}
body.page-items .mochi_denki_qa .mochi_denki_a { padding-left: 2em; font-size: 15px; line-height: 1.9; }
body.page-items .mochi_denki_qa .mochi_denki_a p { margin: 0 0 0.8em; }
body.page-items .mochi_denki_qa .mochi_denki_a p.asterisk { font-size: 14px; }
/* 料金カード（黄色箱だけの 2 行目） */
body.page-items .mochi_card .mochi_card_row2_single .mochi_card_boxes { margin-left: 36%; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_denki_top .mochi_denki_row .mochi_tool_photo { max-width: 260px; margin: 0 auto 16px; }
  body.page-items .mochi_denki_qa .mochi_denki_q { font-size: 15px; }
  body.page-items .mochi_denki_qa .mochi_denki_a { padding-left: 1em; font-size: 14px; }
  body.page-items .mochi_card .mochi_card_row2_single .mochi_card_boxes { margin-left: 0; }
}
body.page-items .mochi_denki_top .mochi_denki_row .mochi_table th,
body.page-items .mochi_denki_top .mochi_denki_row .mochi_table td { text-align: left; padding: 4px 8px; font-size: 13px; }
/* denki SP：Q&A はラフどおり「＋」で開く折りたたみ（共通の accordion_switch／acPerformanceContents を利用。PC は常時表示） */
body.page-items .mochi_denki_qa .mochi_denki_q_sp { text-align: left; color: #E8641B; font-weight: bold; position: relative; padding-right: 28px; cursor: pointer; }
body.page-items .mochi_denki_qa .mochi_denki_q_sp .mochi_denki_plus { position: absolute; right: 4px; top: 0; font-size: 18px; color: #31320E; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_denki_qa .mochi_denki_a { padding-left: 0; }
}

/* ============================================================
   set.html 道具ブロックの仕様表（2026-09-15 伊勢さん指摘「表のデザインが違う」）
   ラフ＝本番 .table2 の見た目：罫線 1px #666、見出し行クリーム #FAF7C8 中央、
   ラベル列は白地・左寄せ、12px。注記は表の中の colspan 行
   ============================================================ */
body.page-items .mochi_tool_row .mochi_spec_table {
  font-size: 12px;
  line-height: 1.6;
  border-left: 1px solid #666;
  border-top: 1px solid #666;
}
body.page-items .mochi_tool_row .mochi_spec_table th,
body.page-items .mochi_tool_row .mochi_spec_table td {
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  vertical-align: top;
  text-align: left;
  padding: 4px 6px;
}
body.page-items .mochi_tool_row .mochi_spec_table th {
  background-color: #FAF7C8;
  text-align: center;
  font-weight: normal;
  padding: 5px;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_label {
  white-space: nowrap;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_center {
  text-align: center;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_center img {
  width: 94px;
  height: auto;
  display: inline-block;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_note {
  padding: 5px 6px;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_note p {
  font-size: 12px;
  line-height: 1.6;
  margin: 0 0 4px;
}
body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_note p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_tool_row .mochi_spec_table td.mochi_spec_label {
    white-space: normal;
  }
}
/* 説明写真は元画像（350px）より大きく出さない（I 判定：引き延ばし） */
body.page-items .mochi_tool_row .mochi_tool_photo img {
  max-width: 350px;
  margin: 0 auto;
}

/* ============================================================
   2026-09-15 set.html：Google ドキュメントの修正 5 件
   ============================================================ */
@media screen and (min-width: 641px) {
  /* 1) 左の横っ面を揃える：ベージュ箱の左端・本文の書き出し・箇条書きの「・」を同じ x に（列の左端＋50px） */
  body.page-items .mochi_set_top .mochi_set_box {
    margin-left: 0;
  }
  body.page-items .mochi_set_top .mochi_set_top_text p {
    padding-left: 0;
  }
  body.page-items .mochi_set_reason_list {
    margin-left: 50px;
  }
  /* 4) 説明書 QR の箱：PC は写真を float で右に置き、本文を回り込ませる（絶対配置をやめる） */
  body.page-items .mochi_qr_box {
    padding-right: 32px;
    overflow: hidden;
  }
  body.page-items .mochi_qr_box .mochi_qr_thumb {
    position: static;
    float: right;
    width: 170px;
    margin: -10px -6px 12px 28px;
  }
}
/* 2) 大人気の理由の箇条書きは太字（ラフ） */
body.page-items .mochi_set_reason_list li p {
  font-weight: bold;
}
/* 3) 本文の小見出し【…】はラフのサイズ感（本文 15px に対して 22px）。「ぶわぁっ!!!」は本番どおり大きく太く */
body.page-items .product_of_individual .overview h4.mochi_tool_h4 {
  font-size: 22px;
  margin: 32px 0 14px;
}
body.page-items .mochi_buwa {
  font-size: 1.3em;
  font-weight: bold;
}
@media screen and (max-width: 640px) {
  body.page-items .product_of_individual .overview h4.mochi_tool_h4 { font-size: 18px; }
}
/* 2026-09-15 check-page Q：道具ブロックの h3 の上の空きを揃える（1・2 つ目 18px／3 つ目 0px だった） */
body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) {
  margin-top: 40px;
}
@media screen and (max-width: 640px) {
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) { margin-top: 32px; }
}
/* 2026-09-15 check-page Q：写真＋仕様表の行の下（32px）と h4 の上（32px）が足されて、各ブロック最初の h4 だけ上の空きが 64px だった */
body.page-items .mochi_tool_row {
  margin-bottom: 0;
}
/* 2026-09-15 check-page Q：denki.html の Q&A（PC）は 1 つ目だけ上の空きが 36px、2 つ目以降 24px → 揃える */
body.page-items .mochi_denki_qa h3.mochi_denki_q.cm__pc {
  margin-top: 36px;
}
body.page-items .mochi_denki_qa h3.mochi_denki_q.cm__pc:first-child {
  margin-top: 24px; /* 親ブロックの上 12px と合わせて 36px（2 つ目以降と同じ） */
}
/* 2026-09-15 list.html ラフ照合：アンカーボタン群→帯「本格石臼餅つきセット」の空きは h3 の上の空き（50px）と同じに（38px だった） */
@media screen and (min-width: 641px) {
  body.page-items .top.item_guide_area.mochi_items_head .mochi_anchor_grid {
    margin-bottom: 50px;
  }
}
/* 2026-09-16 set.html 見直し：石臼を温める道具の説明文＋赤い注意書きは写真・仕様表の前（ラフ＝本番）。注意書きは赤・行間 1.9、（お湯は100℃…）は黒 12px */
body.page-items .product_of_individual .overview.mochi_tool_intro {
  margin: 0 0 24px;
}
body.page-items .product_of_individual .overview.mochi_tool_intro p.mochi_tool_warn {
  color: #FF0000;
  line-height: 1.9;
  margin-top: 1em;
}
/* 2026-09-16 set.html 見直し：「※3段目は単品レンタルで…」が共通 .asterisk の padding-left:2em で右に寄っていた（ラフは本文と同じ左端） */
body.page-items .product_of_individual .overview span.asterisk {
  padding-left: 0;
}
body.page-items .product_of_individual .overview.mochi_tool_intro p.mochi_tool_warn .mochi_set_warn_note {
  color: #333;
  font-size: 12px;
}

/* ============================================================
   2026-09-16 set.html 見直し：SP をラフ（image205）に合わせる
   ・h3 は「小さい分類」＋「大きい品名」の 2 行（PC は 1 行のまま）
   ・仕様表は「▼…の詳しい仕様」で開く／道具1 の h4 本文は最初の段落＋「▼続きを見る」
   ・道具3 は写真 → 説明文 → 赤い注意書き（100℃ の注記は枠囲み）→ 仕様リンク の並び
   ・道具2 SP はアルミのフタの理由を仕様リンクの後に赤い【見出し】で
   ・比較ブロックの黄色箱は最初の段落＋「▼詳しくはこちら」、比較表は「…内容比較表▼」で開く
   ============================================================ */
body.page-items .mochi_sp_only,
body.page-items .mochi_tool_cat_sp {
  display: none;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_sp_only { display: block; }
  body.page-items .mochi_tool_cat_sp { display: inline; }
  body.page-items .mochi_tool_cat_pc { display: none; }
  /* h3 2 行 */
  body.page-items .product_of_individual .p_item.zone h3.mochi_tool_h3 .mochi_tool_cat {
    display: block;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 2px;
  }
  /* 道具ブロックを縦 flex にして、ラフの並び（h3 → 写真 → 説明文 → 仕様リンク → 仕様表）に */
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) {
    display: flex;
    flex-direction: column;
  }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) > h3.mochi_tool_h3 { order: 0; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) .mochi_tool_row,
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) .mochi_tool_row .mochi_tool_spec { display: contents; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) .mochi_tool_row .mochi_tool_photo { order: 1; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) > .overview.mochi_tool_intro { order: 2; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) > .overview:not(.mochi_tool_intro) { order: 3; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) .mochi_spec_switch { order: 4; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) .mochi_spec_fold { order: 5; }
  body.page-items .product_of_individual .p_item.zone:has(> h3.mochi_tool_h3) > .mochi_tool_alumi { order: 7; }
  /* 折りたたみのリンク */
  body.page-items .product_of_individual .mochi_spec_switch,
  body.page-items .product_of_individual .mochi_more,
  body.page-items .product_of_individual .mochi_spec_close,
  body.page-items .product_of_individual .mochi_more_close,
  body.page-items .mochi_set_compare .mochi_ybox_more,
  body.page-items .mochi_set_compare .mochi_ybox_close,
  body.page-items .mochi_set_compare .mochi_vtable_close {
    text-align: right;
    color: #4169e1;
    font-size: 14px;
    line-height: 1.6;
    margin: 6px 0 14px;
    cursor: pointer;
  }
  body.page-items .product_of_individual .mochi_spec_switch { margin: 8px 0 20px; }
  body.page-items .product_of_individual .mochi_spec_fold { margin-bottom: 16px; }
  body.page-items .product_of_individual .mochi_spec_fold .mochi_spec_note p.asterisk { font-size: 12px; margin-top: 8px; }
  /* h4：ラフは点線の下線 */
  body.page-items .product_of_individual .overview h4.mochi_tool_h4 {
    border-bottom: 1px dotted #999;
    padding-bottom: 6px;
    margin: 20px 0 12px;
  }
  /* 道具1：見せる段落と「▼続きを見る」の間 */
  body.page-items .product_of_individual .overview .mochi_more { margin: 4px 0 6px; }
  body.page-items .product_of_individual .overview .mochi_more_fold { margin-bottom: 8px; }
  /* 道具2：アルミのフタ（SP は仕様リンクの後）。PC 用の本文内の段落は隠す */
  body.page-items .product_of_individual .overview p.mochi_tool_alumi_pc { display: none; }
  body.page-items .product_of_individual .mochi_tool_alumi { text-align: left; margin: 0 0 8px; }
  body.page-items .product_of_individual .mochi_tool_alumi p { font-size: 14px; line-height: 1.7; margin: 0; }
  body.page-items .product_of_individual .mochi_tool_alumi .mochi_tool_alumi_h { color: #FF0000; font-weight: bold; }
  /* 道具3：（お湯は100℃…）は枠囲み */
  body.page-items .product_of_individual .overview.mochi_tool_intro { margin-bottom: 8px; }
  body.page-items .product_of_individual .overview.mochi_tool_intro p.mochi_tool_warn { font-size: 14px; line-height: 1.6; }
  body.page-items .product_of_individual .overview.mochi_tool_intro p.mochi_tool_warn .mochi_set_warn_note {
    display: block;
    border: 1px solid #999;
    padding: 6px 10px;
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.6;
  }
  /* セット内容の箱：ラベルは本文と同じ行（ラフ） */
  body.page-items .mochi_set_top .mochi_set_box .mochi_set_box_label { display: inline; margin-right: 1em; }
  /* 比較ブロック */
  body.page-items .mochi_set_compare .mochi_set_top_big { font-size: 17px; }
  body.page-items .mochi_set_compare .mochi_ybox_more { margin: 8px 0 0; }
  body.page-items .mochi_set_compare .mochi_ybox_fold { margin-top: 12px; }
  body.page-items .mochi_set_compare .mochi_vtable_switch {
    text-align: right;
    color: #0000ff;
    text-decoration: underline;
    font-size: 14px;
    margin: 0 0 24px;
    cursor: pointer;
  }
}
@media screen and (max-width: 640px) {
  /* h3 の品名：「カマド・羽釜・セイロ2段・2重コンロ」が 20px だと 1 文字はみ出す → 19px（ラフは 1 行） */
  body.page-items .product_of_individual .p_item.zone h3.mochi_tool_h3 { font-size: 19px; }
  /* 料金カード：ラフ SP は「写真｜セット内容」を横並び → 料金表 → 点線の箱 → 黄色箱 の順 */
  body.page-items .cm__item_amount_area.mochi_card { display: flex; flex-wrap: wrap; align-items: flex-start; }
  body.page-items .mochi_card .mochi_card_row1,
  body.page-items .mochi_card .mochi_card_row2 { display: contents; }
  body.page-items .mochi_card .mochi_card_photo { order: 1; flex: 0 0 46%; max-width: 46%; margin: 0 0 16px; }
  body.page-items .mochi_card .mochi_card_contents { order: 2; flex: 0 0 52%; max-width: 52%; margin: 0 0 16px 2%; font-size: 13px; }
  body.page-items .mochi_card .mochi_card_contents ul { columns: 1; margin-left: 1.1em; }
  body.page-items .mochi_card .mochi_card_contents li { line-height: 1.7; }
  body.page-items .mochi_card .mochi_card_price { order: 3; flex: 0 0 100%; }
  body.page-items .mochi_card .mochi_card_merit { order: 4; flex: 0 0 100%; }
  body.page-items .mochi_card .mochi_card_boxes { order: 5; flex: 0 0 100%; }
}
/* 2026-09-16 伊勢さん指示：list.html のセット写真も 1 枚絵 img/set_all.webp（set.html 上部と同じ見え方） */
body.page-items .mochi_set_all_photo {
  text-align: center;
  margin: 0 0 24px;
}
body.page-items .mochi_set_all_photo img {
  width: 100%;
  max-width: 900px;
  height: auto;
  display: inline-block;
}

/* 2026-09-16 伊勢さん指示：料金カードを見本（スポットクーラー ひんやり君の商品カード）に寄せる
   見本の実測：写真 404px（列の 37%）／料金表 .price-box 330px・18px・赤い金額／点線枠 2px dotted 黒・18px 太字・padding 10px・左 18px 空き */
@media screen and (min-width: 641px) {
  body.page-items .mochi_card .mochi_card_row1 { gap: 0; }
  body.page-items .mochi_card .mochi_card_photo { flex: 0 0 37%; }
  body.page-items .mochi_card .mochi_card_photo img { max-width: none; }
  body.page-items .mochi_card .mochi_card_price { flex: 0 0 330px; margin-left: 1.5%; }
  body.page-items .mochi_card .mochi_card_merit {
    flex: 1 1 auto;
    margin-left: 18px;
    border: 2px dotted #000;
    padding: 10px;
    font-size: 18px;
    line-height: 1.2;
  }
  body.page-items .mochi_card .mochi_card_merit p { margin: 0 0 10px; }
  body.page-items .mochi_card .mochi_card_merit .mochi_card_merit_hk { font-size: 11px; margin: 0; }
  body.page-items .mochi_card .mochi_yellow_box_s { font-size: 16px; padding: 18px; }
}
body.page-items .mochi_card .cm__price_area { font-size: 18px; text-align: left; }
body.page-items .mochi_card .cm__price_area .price-box { max-width: 100%; box-sizing: border-box; }
body.page-items .mochi_card .cm__price_area .price-box .price-box { border: 0; }
body.page-items .mochi_card .cm__price_area .price-box_content:last-child { border-bottom: 0; }
body.page-items .mochi_card .cm__price_area .price-box_amount { white-space: nowrap; }
body.page-items .mochi_card .mochi_card_otoku { font-size: 14px; }
@media screen and (max-width: 640px) {
  body.page-items .mochi_card .cm__price_area { font-size: 15px; }
  body.page-items .mochi_card .cm__price_area .price-box { width: 100%; }
}
/* 2026-09-16 伊勢さん指示：セット内容のリストの「・」が【セット内容】より左に飛び出していた → ラフ（image181）の実測に合わせる：
   列の左端から 見出し 18px／「・」32px／リスト文字 45px（PC）。SP は見出しの文字位置に「・」を揃える */
body.page-items .mochi_card .mochi_card_contents ul {
  padding-left: 2em;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_card .mochi_card_contents ul { padding-left: 1.2em; }
}
/* 2026-09-16 伊勢さん指示（ラフの拡大を見て）：【セット内容】は写真の左端に揃え、「・」はその約10px右、リスト文字は約25px右（PC・SP） */
body.page-items .mochi_card .mochi_card_contents p {
  padding-left: 0;
}
body.page-items .mochi_card .mochi_card_contents ul {
  margin-left: 0;
  padding-left: 1.8em;
}
@media screen and (max-width: 640px) {
  body.page-items .mochi_card .mochi_card_contents ul { margin-left: 0; padding-left: 1.8em; }
}
/* 2026-09-16 伊勢さん指摘（list.html）：アンカーボタン群の margin-bottom 50px が白カラム（.cm__cw、padding-bottom 0）を
   突き抜けて、白カラムの下端が最後のボタンで切れ、次の帯までの 50px が色地の帯になっていた（items.html も 18px）。
   flow-root で margin を白カラムの内側に収める（空きの量は変えない） */
body.page-top .top.item_guide_area.mochi_items_head .cm__cw,
body.page-items .top.item_guide_area.mochi_items_head .cm__cw {
  display: flow-root;
}


/* ===== 40-info.css ===== */
/* ===== 40-info.css : 案内担当（charge / guarantee / rental_flow / standard_charge / sagawa ほか） =====
   ・このファイルの担当以外は書かない
   ・必ずページ限定（body.page-xxx ...）でスコープする
   ・!important とインライン style は禁止
   ・保存したら node build-css.js を流し、生成後の style.css を css/style.css として上げる
   ・共通レイヤーを変えたくなったら書かずに共通担当へ申告 */

/* ============================================================
   rental_flow.html（予約・返却方法）
   ============================================================ */
/* SP の流れ図ラベル：「商品の／発送・到着」が 64px 幅で「発送・到／着」と3行に折れていた
   （見本は2行）。少し小さくして折り返しを止める */
@media screen and (max-width: 640px) {
  body.page-info .cm__flow_page .flow p {
    white-space: nowrap;
  }
  body.page-info .cm__flow_page .flow p a {
    font-size: 13px;
    line-height: 1.3;
  }
}

/* ============================================================
   sagawa.html 後半3節（梱包資材／返却梱包／PPバンド）※本番から移植
   ============================================================ */
body.page-info .mochi_konpou_area .block {
  padding: 0 0 50px;
}
body.page-info .mochi_konpou_area h2 {
  margin: 0 0 20px;
}
body.page-info .mochi_konpou_area p {
  margin: 0 0 1em;
}
/* 写真3枚＋キャプション：横並び */
body.page-info .mochi_konpou_area .mochi_konpou_photos {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_photos li {
  flex: 1 1 216px;
  max-width: 300px;
  margin: 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_photos img {
  width: 100%;
  max-width: 300px;
  height: auto;
  display: block;
}
body.page-info .mochi_konpou_area .mochi_konpou_photos p {
  font-size: 14px;
  margin: 6px 0 0;
}
/* 梱包手順①〜⑤：写真左・説明右、間に ▼ */
body.page-info .mochi_konpou_area .mochi_konpou_steps {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_steps li {
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 0;
  padding: 12px 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_steps li + li::before {
  content: "";
}
body.page-info .mochi_konpou_area .mochi_konpou_steps li + li {
  position: relative;
  margin-top: 26px;
}
body.page-info .mochi_konpou_area .mochi_konpou_steps li + li::after {
  content: "▼";
  position: absolute;
  left: 70px;
  top: -30px;
  color: #FF0000;
  font-size: 20px;
  line-height: 1;
}
body.page-info .mochi_konpou_area .mochi_konpou_steps img {
  flex: 0 0 163px;
  width: 163px;
  height: auto;
}
body.page-info .mochi_konpou_area .mochi_konpou_steps p {
  margin: 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_band {
  text-align: center;
  margin: 20px 0;
}
body.page-info .mochi_konpou_area .mochi_konpou_band img {
  max-width: 600px;
  width: 100%;
  height: auto;
}
@media screen and (max-width: 640px) {
  body.page-info .mochi_konpou_area .block {
    padding: 0 10px 30px;
  }
  body.page-info .mochi_konpou_area .mochi_konpou_photos li {
    flex: 1 1 30%;
    max-width: none;
  }
  body.page-info .mochi_konpou_area .mochi_konpou_photos p {
    font-size: 12px;
  }
  body.page-info .mochi_konpou_area .mochi_konpou_steps li {
    gap: 12px;
  }
  body.page-info .mochi_konpou_area .mochi_konpou_steps img {
    flex: 0 0 120px;
    width: 120px;
  }
  body.page-info .mochi_konpou_area .mochi_konpou_steps li + li::after {
    left: 50px;
  }
}

/* ============================================================
   manual.html（取扱説明書）※本番の餅つき版に差し替え
   ============================================================ */
body.page-info .mochi_manual_area .mochi_manual_intro {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
body.page-info .mochi_manual_area .mochi_manual_intro img {
  flex: 0 0 auto;
  order: 2;
  max-width: 200px;
  height: auto;
}
body.page-info .mochi_manual_area .mochi_manual_intro p {
  flex: 1 1 auto;
  min-width: 0;
}
body.page-info .mochi_manual_area .mochi_manual_toc {
  list-style: decimal;
  margin: 0 0 1.5em;
  padding-left: 1.8em;
}
body.page-info .mochi_manual_area .mochi_manual_toc li {
  list-style: decimal;
  margin: 0 0 .2em;
}
body.page-info .mochi_manual_area .mochi_manual_note {
  text-align: center;
  margin: 0 0 10px;
}
/* 取説17ページのサムネイル：4列 */
body.page-info .mochi_manual_area .mochi_manual_pages {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 15px;
  list-style: none;
  margin: 0 0 2em;
  padding: 0;
  justify-content: center;
}
body.page-info .mochi_manual_area .mochi_manual_pages li {
  flex: 0 0 152px;
  margin: 0;
}
body.page-info .mochi_manual_area .mochi_manual_pages img {
  width: 152px;
  height: auto;
  display: block;
  border: 1px solid #ccc;
}
body.page-info .mochi_manual_area .mochi_manual_denki {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  margin: 0 0 1.5em;
}
body.page-info .mochi_manual_area .mochi_manual_denki img {
  flex: 0 0 360px;
  width: 360px;
  height: auto;
}
@media screen and (max-width: 640px) {
  body.page-info .mochi_manual_area .mochi_manual_intro {
    flex-wrap: wrap;
  }
  body.page-info .mochi_manual_area .mochi_manual_intro img {
    order: 0;
    max-width: 140px;
    margin: 0 auto;
  }
  body.page-info .mochi_manual_area .mochi_manual_intro p {
    flex: 1 1 100%;
  }
  body.page-info .mochi_manual_area .mochi_manual_pages {
    gap: 8px;
  }
  body.page-info .mochi_manual_area .mochi_manual_pages li {
    flex: 0 0 calc(33.333% - 6px);
  }
  body.page-info .mochi_manual_area .mochi_manual_pages img {
    width: 100%;
  }
  body.page-info .mochi_manual_area .mochi_manual_denki {
    flex-wrap: wrap;
  }
  body.page-info .mochi_manual_area .mochi_manual_denki img {
    flex: 1 1 100%;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }
}

/* ============================================================
   media.html（新聞で紹介されました）※本番の記事に差し替え
   ============================================================ */
body.page-info .media_area .mochi_media_pic {
  text-align: center;
  margin: 10px 0 30px;
}
body.page-info .media_area .mochi_media_pic img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  float: none;
}
body.page-info .media_area .mochi_media_pic img[src$="2018_chintai.webp"] {
  width: 60%;
}
@media screen and (max-width: 640px) {
  body.page-info .media_area .mochi_media_pic img[src$="2018_chintai.webp"] {
    width: 100%;
  }
}

/* ============================================================
   voice.html（お客様の声）
   ============================================================ */
/* 実績ブロック .top_img_box.cw が共通の .cw{width:1100px} で親（1000px）から右へ 100px はみ出していた */
body.page-voice .message_area .top_img_box.cw {
  width: 100%;
  max-width: 1000px;
  margin-left: 0;
  margin-right: 0;
}

/* ============================================================
   question.html（よくいただくご質問）※本番の44問に差し替え
   ============================================================ */
/* 本番の inline style をクラス化したもの */
body.page-question .question_area .mochi_ul_decimal {
  list-style: decimal;
  margin: 0 0 1em 20px;
  padding-left: 1.2em;
}
body.page-question .question_area .mochi_ul_decimal li {
  list-style: decimal;
}
/* LPガス・調整器・可とう管コックの写真（右に回り込む小さな3枚） */
body.page-question .question_area .mochi_q_gasphoto {
  float: right;
  margin: 0 23px 10px 20px;
  font-size: 11px;
  line-height: 1.1;
  text-align: center;
}
body.page-question .question_area .mochi_q_gasphoto img {
  display: block;
  margin: 0 auto;
  width: 88px;
  height: auto;
}
body.page-question .question_area .mochi_q_gasphoto img + br + img,
body.page-question .question_area .mochi_q_gasphoto img:not(:first-child) {
  margin-top: 20px;
}
body.page-question .question_area .accshow .zone::after {
  content: "";
  display: block;
  clear: both;
}
/* 外部リンク（ｉタウンページ・佐川急便HP） */
body.page-question .question_area .mochi_q_extlink {
  margin-top: 10px;
}
body.page-question .question_area .mochi_q_extlink img {
  vertical-align: middle;
  width: 20px;
  height: auto;
}
/* 回答内の写真（a.webp / b.webp）は列幅に収める */
body.page-question .question_area .accshow .zone img {
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 640px) {
  body.page-question .question_area .mochi_q_gasphoto {
    float: none;
    margin: 0 0 10px;
  }
}

/* ============================================================
   large_order.html：本番 2026.9.8 追加「お電話でのご相談案内」（見本 index.css 9103-9131 相当）
   ============================================================ */
body.page-info .large_order .large_order_announce_0 p.n_l.pad0 {
  margin: 0 55px 1rem 55px;
}
body.page-info .large_order .large_order_announce {
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 20px;
}
body.page-info .large_order .large_order_announce .header_tel.display span {
  color: #FF0000;
  font-weight: bold;
  font-size: 50px;
}
body.page-info .large_order .large_order_announce .cm__icon_phone {
  height: 40px;
  width: auto;
  vertical-align: middle;
}
body.page-info .large_order .large_order_announce .segment .div img {
  max-width: 320px;
  height: auto;
}
@media screen and (max-width: 640px) {
  body.page-info .large_order .large_order_announce {
    display: block;
  }
  body.page-info .large_order .large_order_announce_0 p.n_l.pad0 {
    margin: 0;
  }
  body.page-info .large_order .large_order_announce .header_tel.display {
    text-align: center;
  }
  body.page-info .large_order .large_order_announce .header_tel.display span {
    font-size: 10vw;
  }
  body.page-info .large_order .large_order_announce .segment .div {
    text-align: center;
    margin-top: 10px;
  }
}

/* ============================================================
   sagawa.html：吹き出し（画像 sagawa_delivery1/2.webp → HTML＋CSS）
   ============================================================ */
body.page-info .top-banner.mochi_bubble {
  position: relative;
  box-sizing: border-box;
  margin: 20px 0 34px;
  padding: 18px 24px;
  border-radius: 8px;
  text-align: center;
}
body.page-info .top-banner.mochi_bubble p {
  margin: 0;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.4;
  color: #31320E;
}
body.page-info .top-banner.mochi_bubble .mochi_bubble_icon {
  display: inline-block;
  margin-right: 8px;
  font-size: 28px;
  line-height: 1;
  vertical-align: -2px;
}
body.page-info .top-banner.mochi_bubble::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -14px;
  transform: translateX(-50%);
  border-style: solid;
  border-width: 14px 12px 0 12px;
}
/* 自社便（残念）：ベージュ */
body.page-info .top-banner.mochi_bubble_ng {
  background-color: #E1E0C1;
  border: 2px solid #494824;
}
body.page-info .top-banner.mochi_bubble_ng .mochi_bubble_icon {
  color: #494824;
}
body.page-info .top-banner.mochi_bubble_ng::after {
  border-color: #494824 transparent transparent transparent;
}
/* 佐川急便（安心）：肌色 */
body.page-info .top-banner.mochi_bubble_ok {
  background-color: #FDE9D9;
  border: 2px solid #FF0000;
}
body.page-info .top-banner.mochi_bubble_ok .mochi_bubble_icon {
  color: #FF0000;
}
body.page-info .top-banner.mochi_bubble_ok::after {
  border-color: #FF0000 transparent transparent transparent;
}
@media screen and (max-width: 640px) {
  body.page-info .top-banner.mochi_bubble {
    padding: 12px 14px;
    margin: 14px 0 26px;
  }
  body.page-info .top-banner.mochi_bubble p {
    font-size: 16px;
  }
  body.page-info .top-banner.mochi_bubble .mochi_bubble_icon {
    font-size: 18px;
  }
}

/* ============================================================
   about_company.html：代表者プロフィールの箱が水色（azure＝スポットクーラー配色）のまま → 肌色に
   ============================================================ */
body.page-about .ceo_profile {
  background-color: #FDE9D9;
}

/* 2026-09-15 check-page Q：about_company の「スタッフ紹介」だけ h3 の上の空きが無かった（他は 50px）。manual の 2 つ目の見出しも 1 つ目（上 100px）に揃える */
body.page-about .subpage.staffintroduction .cw.staff_introduction {
  padding-top: 50px; /* 既存 .subpage.staffintroduction .cw.staff_introduction{padding:0} より詳細度を上げる */
}
body.page-info .manual_area01.bousen + .manual_area01.bousen {
  margin-top: 100px;
}
@media screen and (max-width: 640px) {
  /* SP は h3 の margin-top 20px だけで揃える（profile と staff_introduction の padding-top 50px を外す） */
  body.page-about .subpage.staffintroduction .cw.staff_introduction,
  body.page-about .cw.profile {
    padding-top: 0;
  }
}


/* ===== 90-common.css ===== */
/* ===== 90-common.css : 共通担当のみ（ヘッダー・ナビ・フッター・見出しサイズ・共通ラッパー余白） =====
   ・このファイルの担当以外は書かない
   ・必ずページ限定（body.page-xxx ...）でスコープする
   ・!important とインライン style は禁止
   ・保存したら node build-css.js を流し、生成後の style.css を css/style.css として上げる
   ・共通レイヤーを変えたくなったら書かずに共通担当へ申告 */

/* --- フッターのサイトマップ：カテゴリ群の左に出る縦線（common_style.css の .cm__site_link{border-left:1px solid #292929}）を消す。
       ユーザー指示「縦棒いらない」（2026-09-11）。全ページ共通のフッターなので共通レイヤーで --- */
.cm__site_link_area .cm__site_map_main .cm__site_link {
  border-left: 0;
  padding-left: 0;
}

/* --- 電話番号を tel: リンクにした箇所（charter / inquiry_tel）：見た目は元のまま（色・下線なし） --- */
.mochi_tel_link,
.mochi_tel_link:link,
.mochi_tel_link:visited {
  color: inherit;
  text-decoration: none;
}
/* --- 「笑顔をつなぐレンタル」の文章版（inquiry_tel / thanks）が SP で 2.8vw＝10.5px と小さすぎる（common_style.css）。
       本文と同じ 15px に --- */
@media screen and (max-width: 640px) {
  .baton_passing_of_smile .baton_passing_paragraph,
  .baton_passing_of_smile p {
    font-size: 15px;
    line-height: 1.6;
  }
}
/* --- ページ内アンカーリンク（about_company / inquiry の「▼○○」）：a がインラインでタップ域が文字の高さしか無い --- */
@media screen and (max-width: 640px) {
  .cm__anchor_link a {
    display: block;
    padding: 12px 0;
  }
}
/* --- インライン style 置換で作った .mochi_red_f3 は #f30000（パレット外）。赤は #FF0000 に統一（既存ルールは触らず上書き） --- */
.mochi_red_f3.mochi_red_f3.mochi_red_f3.mochi_red_f3.mochi_red_f3.mochi_red_f3 {
  color: #FF0000;
}

/* --- PCグローバルナビの文字色 ---
   ページ専用CSS（about_company.css / inquiry.css / question.css / results.css / rental_flow.css）は
   古い設計「白い帯＋茶文字」のまま `#pc_navi{background:#fff} #pc_navi a{color:#31320E}` を持っている。
   これらのページに style.css を後読みさせたことで帯だけ現行の茶(#494824)になり、文字の茶が残って
   「茶の帯に茶の文字」で読めなくなった（2026-09-11 about_company で発覚）。
   文字色を style.css 側でも明示し、読み込み順に関係なく白にする */
header #pc_navi a,
header #pc_navi a:link,
header #pc_navi a:visited {
  color: #ffffff;
}

/* ============================================================
   2026-09-14 伊勢さん指示：ハンバーガーメニュー（SP）の商品リンクに、見本サイトと同じく商品写真を付ける。
   HTML は include/original_data.inc の $od_footer_sitemap_sp（商品 5 カテゴリ 30 件に .cm__site_link_item と .cm__img を追加）。
   見本の写真は 60×60 の正方形だが、餅の写真（img/mochi/menu/photo/*.png）は縦横がまちまちなので
   50×50 の枠に収めて行の高さを揃える
   ============================================================ */
.cm__site_link_item .cm__sp.cm__img img {
  width: 50px;
  height: 50px;
  object-fit: contain;
  object-position: center;
}

/* ============================================================
   2026-09-14：商品ボタン・帯リンク・帯の小見出しの行末 1〜2 文字残り対策（list.html SP の
   「一緒におす／すめ」「始められ／ます」と、自動チェック E で出た「…6点セッ／ト」「折りたたみパイプ椅／子」など）。
   text-wrap: balance は複数行になったとき各行の長さを揃えて折り返す（対応ブラウザのみ。未対応でも従来どおり）
   ============================================================ */
/* 2026-09-15 レビュー指摘（変な位置で改行 8 件）により text-wrap: balance は取り下げ。
   行末の 1〜2 文字残りは HTML 側の <br class="pc/sp"> や <wbr> で個別に対処する */
/* SP の商品ボタン：文字エリアが 86px しかなく「杵小（幼児用）」（7 文字）が 2 行に折れて「児用）」が残る。
   写真の最大幅 30%→24% にして文字エリアを広げる（写真は object-fit で縮むだけ） */
@media screen and (max-width: 640px) {
  .mochi_btn_grid .mochi_pbtn_photo {
    max-width: 24%;
  }
}
/* 見出し・Q&A の質問文も行末 1〜2 文字残りを避ける（トップの h4「…必ず作動確認をお願いします。」→「す。」など） */
/* 2026-09-15 見出しの text-wrap: balance も取り下げ（同上） */
/* 商品ボタンの小ラベル「せいろ二段・かまど・羽釜・ひしゃく」が「かま／ど」と語の途中で折れる。
   語の間に <wbr> を入れ、単語の途中では折らない（入り切らないときだけ任意の位置で折る） */
.mochi_pbtn_sub {
  word-break: keep-all;
  overflow-wrap: anywhere;
}
/* 2026-09-15 レビュー行63：商品名も語の途中で折らない（HTML 側の <wbr> でだけ折る。入り切らないときは任意の位置） */
.mochi_pbtn .mochi_pbtn_txt {
  word-break: keep-all;
  overflow-wrap: anywhere;
}
/* 2026-09-15 追っかけヘッダー（SP）：幅 430px で「お問合せご予約」の箱が帯（60px）から 4px はみ出す。行間を電話側と同じに */
@media screen and (max-width: 640px) {
  .cham__hamburger_switch .cham__drawer_li.cham__drawer_info p,
  .cham__hamburger_switch .cham__drawer_li.cham__drawer_tell p {
    line-height: 1.1;
  }
}
/* 2026-09-15 レビュー行42・53：追っかけヘッダーは帯の高さ 60px に収める（幅 400px 超で画像とボタンが下で切れていた）。全ページ共通 */
@media screen and (max-width: 640px) {
  .cham__hamburger_switch .cham__drawer_area_title img {
    max-height: 50px;
    width: auto;
  }
  .cham__hamburger_switch .cham__drawer_li.cham__drawer_tell img,
  .cham__hamburger_switch .cham__drawer_li.cham__drawer_info img {
    max-height: 58px;
    width: auto;
  }
}
/* 2026-09-15 伊勢さん指示：h4「イベントの成功率をさらに高めるために、届いたらすぐに…」の <br class="pc"> を外す。
   00-existing で h4 も本文と同じ 1000px に絞っていたため「…お願いしま／す。」と折れていた。見本（chocorental）は
   h4 が列いっぱい（1100px）で 1 行に収まるので、h4 だけ幅制限を外す（本文 p は 1000px のまま） */
.before_delivery.delivery_paragraph .rental_of_flow > h4 {
  max-width: none;
}
/* 2026-09-15 導入企業ロゴ（日本全国56,151社以上）の SP：ラフと見本（chocorental）は 4 列（ロゴ約 80px）。
   共通 CSS の li 39px（8 列×2 段で小さい）を、全ページ共通で 4 列に。上下の空きは 20-top で揃える */
@media screen and (max-width: 640px) {
  .ul.cm__results_work_pictures.zone {
    width: 100%;
    margin-left: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .ul.cm__results_work_pictures.zone li {
    width: 22%;
    margin: 4px 1.5%;
  }
  .ul.cm__results_work_pictures.zone li img {
    width: 100%;
    height: auto;
  }
}
/* 2026-09-15 check-page B：large_order.html の「ページの1番上へ」ボタンが .subpage p{line-height:22px} を継承して箱（65px）から 11px はみ出す。
   ボタンの行間はページの本文設定に左右されないよう固定 */
@media screen and (max-width: 640px) {
  #page_top p,
  #page_menu p {
    line-height: 16px; /* トップと同じ実測値（▲ 31px も含め 16px 行）。PC は元の行間のままにする（2026-09-16 ▲と文字が重なった） */
  }
}
/* 2026-09-16 商品ボタンの文字 16px（SP）に伴い、写真を 24%→20% にして文字エリアを広げる（「電動餅つき機」「せいろセット」6 文字が 1 行に入る幅） */
@media screen and (max-width: 640px) {
  .mochi_btn_grid .mochi_pbtn_photo {
    max-width: 20%;
  }
}
/* 2026-09-16 伊勢さん指示：set/denki のパンくず→キャッチの空きが 95px で空きすぎ → 商品枠の上 padding 30px（共通CSS）を 0 にして、list/items と同じ 65px に（SP は元から 0） */
body.page-items .product_of_individual .cm__product_item_area {
  padding-top: 0;
}
/* 2026-09-16 伊勢さん指示：比較ブロック（リード・黄色箱・赤注記）は横幅をもっと使う → 列いっぱい（1100px）に。黄色箱・注記も 91% → 100%。比較表（64% 中央）はそのまま */
@media screen and (min-width: 641px) {
  body.page-items .mochi_set_compare {
    max-width: 1100px; /* E�ohEjng none kY�h;bDcqDkj� */
    padding: 0;
  }
  body.page-items .mochi_set_compare .mochi_set_top_lead,
  body.page-items .mochi_set_compare .mochi_set_top_big {
    padding-left: 0;
    padding-right: 0;
  }
  body.page-items .mochi_set_compare .mochi_yellow_box,
  body.page-items .mochi_set_compare .mochi_set_warn {
    max-width: 100%;
  }
}
/* 2026-09-16 伊勢さん指示：基本／簡易の比較表はコンパクトに（幅 1100 → 560px 中央、セルの余白 6/8 → 3/8px）。
   .mochi_table.mochi_table…{width:100%} (0,5,0) に負けていたので、折りたたみ枠 .mochi_vtable_fold の幅で絞る */
@media screen and (min-width: 641px) {
  body.page-items .mochi_set_compare .mochi_vtable_fold {
    width: 560px;
    margin: 0 auto;
  }
  body.page-items .mochi_set_compare .mochi_set_vtable th,
  body.page-items .mochi_set_compare .mochi_set_vtable td {
    padding: 3px 8px;
  }
  body.page-items .mochi_set_compare .mochi_set_vtable th.mochi_cat { width: 22%; }
  body.page-items .mochi_set_compare .mochi_set_vtable_note { max-width: 100%; }
}
/* 2026-09-16 伊勢さん指示：比較ブロック全体の文字サイズを上げる（PC）。リード 16→18、大見出し 28→30、黄色箱・赤注記 14→16、100℃注記 12→13、表 14→15、表の注記 12→13 */
@media screen and (min-width: 641px) {
  body.page-items .mochi_set_top .mochi_set_top_lead { font-size: 18px; }
  body.page-items .mochi_set_compare .mochi_set_top_lead { font-size: 18px; }
  body.page-items .mochi_set_compare .mochi_set_top_big { font-size: 30px; }
  body.page-items .mochi_set_compare .mochi_yellow_box { font-size: 16px; line-height: 1.9; }
  body.page-items .mochi_set_compare .mochi_set_warn { font-size: 16px; }
  body.page-items .mochi_set_compare .mochi_set_warn .mochi_set_warn_note { font-size: 13px; }
  body.page-items .mochi_set_compare .mochi_set_vtable th,
  body.page-items .mochi_set_compare .mochi_set_vtable td { font-size: 15px; }
  body.page-items .mochi_set_compare .mochi_set_vtable_note { font-size: 13px; }
}

/* ============================================================
   2026-09-16 本番から移植した案内ページ 7 本（howto / howto_denki / howto_pack / maintenance / ec / health / about_license）
   骨格は manual.html。本番のテーブルレイアウトは .mochi_hstep（番号｜写真｜説明）に組み替え、style 属性は全部クラスに
   ============================================================ */
body.page-info .mochi_info_area {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 0 60px;
  font-size: 15px;
  line-height: 1.8;
  text-align: left;
}
body.page-info .mochi_info_area h2.mochi_info_title {
  font-size: 28px;
  line-height: 1.4;
  text-align: center;
  margin: 0 0 30px;
}
body.page-info .mochi_info_area h3 {
  font-size: 22px;
  line-height: 1.4;
  border-left: 6px solid #FF0000;
  border-bottom: 1px solid #b7b7b7;
  padding: 4px 0 6px 12px;
  margin: 48px 0 20px;
}
body.page-info .mochi_info_area h4 {
  font-size: 18px;
  line-height: 1.4;
  margin: 32px 0 12px;
}
body.page-info .mochi_info_area p { margin: 0 0 1em; }
body.page-info .mochi_info_area img { max-width: 100%; height: auto; }
body.page-info .mochi_info_area .center { text-align: center; }
body.page-info .mochi_info_area .font_right { text-align: right; }
body.page-info .mochi_info_area .mochi_ul { text-decoration: underline; }
body.page-info .mochi_info_area .mochi_small { font-size: 90%; }
body.page-info .mochi_info_area .mochi_fl { float: left; margin: 0 16px 12px 0; }
body.page-info .mochi_info_area .mochi_fr { float: right; margin: 0 0 12px 16px; }
body.page-info .mochi_info_area h3, body.page-info .mochi_info_area h4, body.page-info .mochi_info_area .mochi_hsteps, body.page-info .mochi_info_area .mochi_totop { clear: both; }
body.page-info .mochi_info_area .mochi_dot_hr { border: 0; border-top: 2px dotted #999; margin: 20px 0; clear: both; }
/* ▼ページ内リンクの一覧 */
body.page-info .mochi_info_area .mochi_anchor_list { margin: 0 0 32px 1.5em; line-height: 2; }
body.page-info .mochi_info_area .mochi_anchor_list a { color: #4169e1; }
/* 番号｜写真｜説明 */
body.page-info .mochi_info_area .mochi_hsteps { margin: 0 0 24px; }
body.page-info .mochi_info_area .mochi_hstep {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px dotted #b7b7b7;
}
body.page-info .mochi_info_area .mochi_hstep_no {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #FF0000;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 32px;
  text-align: center;
  margin: 0;
}
body.page-info .mochi_info_area .mochi_hstep_no:empty { background: transparent; }
body.page-info .mochi_info_area .mochi_hstep_img { flex: 0 0 300px; }
body.page-info .mochi_info_area .mochi_hstep_img img { width: 100%; height: auto; display: block; }
body.page-info .mochi_info_area .mochi_hstep_txt { flex: 1 1 auto; }
body.page-info .mochi_info_area .mochi_hstep_txt p { margin: 0 0 .6em; }
body.page-info .mochi_info_area .mochi_hstep_note { display: block; padding: 10px 0 6px 48px; border-bottom: 0; }
body.page-info .mochi_info_area .mochi_hstep_sub { display: flex; gap: 16px; margin-top: 10px; }
body.page-info .mochi_info_area .mochi_hstep_sub figure { margin: 0; text-align: center; font-size: 13px; }
body.page-info .mochi_info_area .mochi_hstep_sub figure img { width: 120px; }
/* 赤い点線の囲み・注意リスト */
body.page-info .mochi_info_area .mochi_dot_box { border: 1px dotted #FF0000; padding: 10px 12px; margin: 10px 0; font-size: 13px; line-height: 1.6; }
body.page-info .mochi_info_area ul.worning { list-style: disc; padding-left: 1.6em; margin: 0 0 16px; }
body.page-info .mochi_info_area ul.worning li { margin-bottom: 8px; }
body.page-info .mochi_info_area blockquote { margin: 0 0 20px; padding: 12px 16px; border-left: 4px solid #d5d5d5; background: #f7f7f2; }
/* 表（本番の表をそのまま持ってきた分） */
body.page-info .mochi_info_area .mochi_info_table { border-collapse: collapse; margin: 0 auto 16px; }
body.page-info .mochi_info_area .mochi_info_table td { border: 1px solid #ccc; padding: 6px 10px; vertical-align: top; }
body.page-info .mochi_info_area .mochi_info_table td.aligncenter, body.page-info .mochi_info_area .mochi_info_table td.center { text-align: center; }
/* ページ上部へ・一覧へ */
body.page-info .mochi_info_area .mochi_totop { text-align: right; font-size: 13px; margin: 8px 0 24px; }
body.page-info .mochi_info_area .mochi_totop a, body.page-info .mochi_info_area .mochi_tolist a { color: #4169e1; }
body.page-info .mochi_info_area .mochi_tolist { text-align: center; font-size: 16px; margin: 24px 0 0; }
/* YouTube */
body.page-info .mochi_info_area .mochi_video { position: relative; width: 100%; max-width: 640px; aspect-ratio: 16 / 9; margin: 0 auto 16px; }
body.page-info .mochi_info_area .mochi_video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media screen and (max-width: 640px) {
  body.page-info .mochi_info_area { padding: 24px 0 40px; font-size: 14px; }
  body.page-info .mochi_info_area h2.mochi_info_title { font-size: 22px; margin-bottom: 20px; }
  body.page-info .mochi_info_area h3 { font-size: 18px; margin: 32px 0 14px; }
  body.page-info .mochi_info_area h4 { font-size: 16px; }
  body.page-info .mochi_info_area .mochi_fl, body.page-info .mochi_info_area .mochi_fr { float: none; display: block; margin: 0 auto 12px; }
  body.page-info .mochi_info_area .mochi_hstep { flex-wrap: wrap; }
  body.page-info .mochi_info_area .mochi_hstep_img { flex: 1 1 calc(100% - 48px); }
  body.page-info .mochi_info_area .mochi_hstep_txt { flex: 1 1 100%; }
  body.page-info .mochi_info_area .mochi_hstep_note { padding-left: 0; }
  body.page-info .mochi_info_area .mochi_anchor_list { margin-left: .5em; }
}
/* 2026-09-16 移植ページ：h3 は左寄せ（共通の h3 中央寄せを打ち消す）、align="left" → .mochi_left、本番の小見出し .under_dot */
body.page-info .mochi_info_area h3 { text-align: left; }
body.page-info .mochi_info_area .mochi_left { text-align: left; }
body.page-info .mochi_info_area p.under_dot { font-size: 17px; font-weight: bold; border-bottom: 1px dotted #999; padding-bottom: 4px; margin: 32px 0 12px; clear: both; }
body.page-info .mochi_info_area .mochi_video + br, body.page-info .mochi_info_area .mochi_video + br + br { display: none; }
/* 2026-09-16 移植ページ：本番の黄色い囲み .box_yellow、表の文字は左寄せ */
body.page-info .mochi_info_area .box_yellow { background: #FFFFCC; border-radius: 10px; padding: 16px 20px; margin: 0 0 20px; }
body.page-info .mochi_info_area .mochi_info_table { width: 100%; }
body.page-info .mochi_info_area .mochi_info_table td { text-align: left; }
/* 2026-09-17 レビューシート行54（深澤さん）：注目ボックスは本文は通常のまま、冒頭の問いかけ「あなたは臼と杵を…」だけ太字（PC・SP） */
body.page-top .mochi_attention_box .mochi_attention_lead {
  font-weight: bold;
}
/* 2026-09-17 伊勢さん指示：保証4 の PC 見出し「イベントが中止になり使わなかった場合のイベント中止再レンタル保証。」は改行なしで 1 行に。
   28px だと文字幅 924px で枠 939px ぎりぎり（環境によって折れる）→ この見出しだけ 26px */
@media screen and (min-width: 641px) {
  body.page-top .guarantee_area h3.cm__pc:has(> .mochi_nowrap),
  body.page-items .guarantee_area h3.cm__pc:has(> .mochi_nowrap) {
    font-size: 26px;
    white-space: nowrap;
  }
}
/* 2026-09-17 レビューシート行63（深澤さん）→ 伊勢さん承認：SP の商品ボタンの文字 16 → 18px。はみ出し 0、3 行になるボタンは 4 → 13 個 */
@media screen and (max-width: 640px) {
  body.page-top .mochi_btn_grid .mochi_pbtn_txt,
  body.page-items .mochi_btn_grid .mochi_pbtn_txt {
    font-size: 18px;
  }
}
/* 2026-09-17 18px に伴い、文字エリアを 102 → 約114px に（6 文字「電動餅つき機」「せいろセット」が 1 行に収まる幅）：写真 20%→16%、左 padding 8→5、隙間 4→3 */
@media screen and (max-width: 640px) {
  body.page-top .mochi_btn_grid .mochi_pbtn,
  body.page-items .mochi_btn_grid .mochi_pbtn {
    padding-left: 5px;
    gap: 3px;
  }
  body.page-top .mochi_btn_grid .mochi_pbtn_photo,
  body.page-items .mochi_btn_grid .mochi_pbtn_photo {
    max-width: 16%;
  }
}
/* 2026-09-17 伊勢さん指示（ライブプレビュー タスク②）：set.html「当店の石臼餅つきセットが大人気の理由」h2 の文字色を黒に（#31320E → #000）。9/18 に一度赤にしたが取り消し依頼で黒に戻した */
body.page-items .product_of_individual .p_item.zone h2.mochi_set_reason_h2 { color: #000; }
/* 2026-09-18 伊勢さん指示：SP ヘッダー画像（640×185 の新画像）に height:auto。width/height 属性が付いても縦がつぶれないように */
header .cm__header_area .cm__header_left img.cm__into_img.sp { height: auto; }
/* 2026-09-18 伊勢さん指摘：大人気の理由 h2（SP）が太字でなくなっていた。9/16 の「ラフに忠実に」で font-weight:normal を入れたのが誤り（ラフの文字は b=1＝太字、現行スマホも 700）。太字に戻す */
@media screen and (max-width: 640px) {
  body.page-top .popular_reason_area h2,
  body.page-items .popular_reason_area h2 { font-weight: bold; }
}
