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

/* header */
.header .navigation .navigation__list {
  justify-content: flex-start;
}
.header .navigation .navigation__list li:hover {
    color: #114D8B;
}
.header .navigation .navigation__list li:first-child:after {
  content: "";
  display: block;
  width: 1px;
  height: 15px;
  border-right: 1px dashed #aaaaaa;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-40%);
}
.header .navigation .navigation__list li:hover a::after {
    border-bottom: 3px solid #114D8B;
}
.header .navigation .navigation__list li a:after {
    background: #114D8B;
}

/* 背景エリア（横幅100%で薄い灰色） */
.anchor-links{
  background:#f2f2f2;          /* 薄いグレー */
  padding:12px 16px;            /* 適度な余白 */
  display:flex;
  gap:12px;                     /* ボタン間のすき間 */
  flex-wrap:wrap;               /* 狭い画面では折り返す */
  box-sizing:border-box;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

/* 個別リンク（シンプルなピル型 + 右端にV） */
.anchor-link{
  position:relative;
  display:inline-block;
  padding:10px 34px 10px 12px;  /* 右側はV分を少し広めに */
  border:1px solid #ddd;
  border-radius:9999px;         /* 角丸でやわらかく */
  background:#fff;
  color:#333;
  text-decoration:none;
  line-height:1.2;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}

/* Vマーク（テキストの一番右）*/
.anchor-link::after{
  content:"▽";                  /* 指定どおり V を使用 */
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  font-weight:700;
}

/* ちょっとしたホバー&フォーカス */
.anchor-link:hover{ background:#fafafa; border-color:#ccc; }
.anchor-link:focus-visible{ outline:2px solid #4d90fe; outline-offset:2px; }

.order-card_po_r {
  display: flex;
  justify-content: flex-end;
}
.order-card_po_r_btn {
  min-width: 140px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
  border: 1px solid #aaaaaa;
}


.order-card_po_r2 {
  display: flex;
  justify-content: flex-end;
}
.order-card_po_r2_btn {
min-width: 80px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
  background-color: #fff;
  border: 1px solid #aaaaaa;
}


.my-page_items_table{
  width:100%;
  border-collapse: collapse;
  font-family: system-ui, "Segoe UI", Roboto, "Noto Sans JP", sans-serif;
  font-size:14px;
  color:#222;
  margin-top: 20px;margin-bottom: 20px;
  
}
.my-page_items_table th,
.my-page_items_table td{ padding:12px 16px; border-bottom:1px solid #e6e9ee;text-align: center; }
.my-page_items_table thead th{ background:#48AACD; font-weight:600; font-size:12px; color: #fff; text-transform:uppercase; }
.my-page_items_table tbody tr:nth-child(even){ background:#fbfcfe; }
.my-page_items_table tbody tr:hover{ background:#f1f7ff; }
.my-page_items_table td.num, .my-page_items_table th.num{ text-align:right; white-space:nowrap; }


.radio-select .radio-label {
    display: block;
    height: 40px;
    line-height: 40px;
    border: 1px solid #aaaaaa;
    border-radius: 5px;
    text-align: center;
}


.radio-select input[type="radio"] {
  display: none;
}
.radio-select input[type="radio"]:checked + .radio-label {
  border: 1px solid var(--cleaning_op);
  background: var(--cleaning_op);
  color: #333 !important;
}
.select50 .radio-select {
  width: 48% !important;
}
.radio-select .radio-label {
  display: block;
  height: 40px;
  line-height: 40px;
  border: 1px solid #aaaaaa;
  border-radius: 5px;
  text-align: center;
}

.work-evaluation-box input[type="checkbox"]:checked + .work-evaluation-checkbox {
    background-color: var(--cleaning_op);
    border: 1px solid var(--cleaning_op);
    font-weight: bold;
}
.work-evaluation-box input[type="checkbox"]:checked + .work-evaluation-checkbox::after {
    border: 1px solid var(--cleaning_op);
    background-color: var(--cleaning_op);
}



.member-page .step_section .step_list .step_item .item_heading:before {
    counter-increment: mail-step;
    content: '0' counter(mail-step);
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background: var(--cleaning) !important;
    display: flex
;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 13px;
    font-family: "Heebo", "Century Gothic";
    font-weight: normal;
    margin: 0 10px 0 0;
    padding: 4px 0 0;
    flex-shrink: 0;
}

/*注文履歴詳細*/
.order_history_detail_btn {
      display: inline-block;
      padding: 8px 16px;
      background: #fff;              
      color: #000;                  
      border: 1px solid #aaa;       
      border-radius: 4px;           
      cursor: pointer;
      font-size: 14px;
    }
    .order_history_detail_btn:hover {
      background: #f5f5f5;
    }

    /* モーダル全体 */
    .order_history_detail_modal {
      display: none; /* 初期は完全非表示 */
      position: fixed;
      z-index: 9999;
      inset: 0;
      background: rgba(0,0,0,0.7);

      /* flexはJSで表示するときに追加 */
      justify-content: center;
      align-items: center;
    }

    /* モーダルの内容 */
    .order_history_detail_modal_content {
      position: relative;
      background: #fff;
      padding: 10px;
      border-radius: 8px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.3);
      max-width: 90%;
      max-height: 90%;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    /* 表示する画像 */
    .order_history_detail_modal_content img {
      max-width: 80vw;
      max-height: 80vh;
      border-radius: 4px;
      display: block;
    }

    /* 閉じるボタン */
    .order_history_detail_close {
      position: absolute;
      top: 8px;
      right: 12px;
      font-size: 24px;
      color: #333;
      cursor: pointer;
      font-weight: bold;
    }
    .order_history_detail_close:hover {
      color: #ff0000;
    }

@media screen and (min-width: 481px) {
.cancel_cont .question__box {
    width: 940px !important;
}
}

.cancel_cont .question__txt {
    padding: 0px !important;
}

.cancel_cont .question__answer {
    padding-left: 0px !important;
}

.w-100 {
  width: 100%;
}


 
.area_contents {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  gap: 30px;
}
.area_contents .area_detail {
  flex: 1 1;
}
.area_contents .img {
  flex: 0 1 213px;
  text-align: center;
}
.area_contents .img img {
  width:213px;
}
.img h3 {
  width: 300px !important;
}
.area_contents .ttl {
  width: fit-content;
  position: relative;
  z-index: 0;
  margin: 0 0 40px;
  padding: 0 0 7px;
}
.area_contents .ttl:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background:
  repeating-linear-gradient(90deg, #114D8B 0 2px, #fff 2px 8px);
  background-size: 100% 100%;
}
@media screen and (max-width: 480px) {
  .area_contents {
    gap: 20px;
  }
  .area_contents .img {
    order: -1;
    flex: 0 1 180px;
    margin: 0 auto;
  }
  .area_contents .area_detail {
    flex: 0 0 100%;
    order: 1;
  }
  .area_contents .ttl {
    margin: 0 auto 20px;
  }
}

.schedule-table tbody tr .table-padding:first-child {
    padding: 15px;
    background: #f3f3f3 !important;
}
@media screen and (max-width: 480px) {
    .schedule-table tbody tr th {
        width: auto !important;
    }
}

/* title */
.linkttl._cleaning:before {
  background: #114D8B;
}

.procedure__item:nth-of-type(-n + 6) {
    margin-bottom: 50px;
}

.guide_table {
  width:100%;
  border-collapse: collapse;
  font-size:12px;
  color:#222;
  margin-top: 20px;margin-bottom: 20px;
}
.guide_table th,
.guide_table td{
  padding:8px;
  border:1px solid #e6e9ee;
  text-align: center;
  font-size: 15px;
}
@media screen and (max-width: 480px) {
.guide_table th,
.guide_table td{
  font-size: 13px;
}
}

.guide_table th {
  text-align: center;
  vertical-align: middle;
  background-color: #4472C4;
  white-space: nowrap;
  color: #fff;
}

.guide_table td {
  text-align: left;
}



.service_panel_group {
  border-top: 2px solid #114D8B;
}
.service_tab_btn {
  border: solid 2px #114D8B;
  background: #114D8B;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: left;
}
.service_tab_btn .ico {
  flex: 0 0 auto;
  aspect-ratio: 31 / 29;
  width: 31px;
}
.service_tab_btn .ico._irui {
  background: url(../img/cleaning/ico-irui-blue.svg) no-repeat center / contain;
}
.service_tab_btn .ico._futon {
  background: url(../img/cleaning/ico-futon-blue.svg) no-repeat center / contain;
}
.service_tab_btn.is-active, .service_tab_btn.is-active {
  border: solid 2px #114D8B;
  border-bottom: solid 1px #fff;
  background: #fff;
  color: #114D8B;
}
.service_tab_btn.is-active .ico._irui {
  background: url(../img/cleaning/ico-irui-white.svg) no-repeat center / contain;
}
.service_tab_btn.is-active .ico._futon {
  background: url(../img/cleaning/ico-futon-white.svg) no-repeat center / contain;
}
.service_panel_group .panel_inr {
  background: #FFF7E6;
}
.service_panel_group .panel_inr .point__box {
  display: flex;
  max-width: 630px;
  margin: 0 auto;
  gap: 15px 10px;
}
.service_panel_group .panel_inr .point__item {
  margin: 0;
}
@media screen and (max-width: 480px) {
  .sec_border {
    padding-bottom: 40px;
  }
  .service_panel_group .panel_inr .point__item {
    width: 100%;
  }

}

@media screen and (min-width: 481px) {
    .cleaningmenunav {
    padding: 20px 20px 30px;
    background: #F3F3F3;
  }
  .cleaningmenunav_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 30px;
  }
  .cleaningmenunav_list li {
    width: 150px;
    max-width: 30%;
  }
}
@media screen and (max-width: 480px) {
  .cleaningmenunav {
    padding: 30px 20px 30px;
    background: #F3F3F3;
  }
    .cleaningmenunav_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 2%;
  }
  .cleaningmenunav_list li {
    width: 32%;
  }

}
@media screen and (min-width: 480px) {
  .mypage_footer_container {
      width: 720px;
      display: flex;
      margin: 0 auto;
      gap:12px;
    margin-top: 30px !important;
    }
    .mypage_footer_container a {
      width: 350px;
    }
}

@media screen and (max-width: 480px) {
  .mypage_footer_container {
      width: 340px;
      margin-left: auto;
    margin-right: auto;
    margin-top: 30px !important;
    }
}
    .service-card {
      display: flex;
      align-items: center;
      padding: 10px 14px;
      border-radius: 16px;
      margin-bottom: 16px;
      text-decoration: none;
      transition: opacity 0.2s;
    }

    .service-card:hover {
      opacity: 0.8;
    }

    /* ハウスクリーニング - ピンク */
    .service-card.house {
      background-color: #fce4e4;
    }

    /* 宅配クリーニング - 水色 */
    .service-card.delivery {
      background-color: #d4f0f0;
    }

    .icon-wrapper {
      width: 56px;
      height: 56px;
      background-color: rgba(255, 255, 255, 0.8);
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .icon-wrapper img {
      width: 36px;
      height: 36px;
      object-fit: contain;
    }

    /* ダミー用 */
    .icon-dummy {
      width: 36px;
      height: 36px;
      background-color: #ccc;
      border-radius: 4px;
    }

    .service-name {
      flex: 1;
      font-size: 18px;
      font-weight: 500;
      margin-left: 16px;
    }

    .service-card.house .service-name {
      color: #c94a4a;
    }

    .service-card.delivery .service-name {
      color: #3a8a8a;
    }

    .arrow-icon {
      width: 24px;
      height: 24px;
      border: 1px solid #333;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .arrow-icon::after {
      content: "";
      width: 5px;
      height: 5px;
      border-top: 1px solid #333;
      border-right: 1px solid #333;
      transform: rotate(45deg);
      margin-left: -2px;
    }

.t_center {
  text-align: center;
}



.cleaning_option_h3 {
padding: 0 0 10px;
        line-height: 1.2;
        font-size: 15px;
        color: var(--cleaning);
        font-weight: bold;
}

input.payment-card-input[type="radio"]:checked + .payment-card-label::after {
    background: #114d8b;
    border: 1px solid #114d8b;
}

/*input[type="checkbox"]:checked + .checkbox-p::before {
    background: #114d8b;
    border: 1px solid #114d8b;
}*/

input[type="checkbox"]:checked + .checkbox-p.cb-blue::before {
    background: #114d8b;
    border: 1px solid #114d8b;
}

.item-list__box {
  width: 100% !important;
}

    /* =================================
       カラー設定（後で変更用）
       ================================= */
    :root {
      /* メインカラー */
      --payment_confirm_popup-color-primary: #114d8b;        /* 青系（見出し・テーブルヘッダー背景） */
      --payment_confirm_popup-color-primary-text: #fff;      /* ラベルテキスト色（白） */
      
      /* テキストカラー */
      --payment_confirm_popup-color-text: #333;              /* 本文テキスト */
      --payment_confirm_popup-color-heading: #114d8b;        /* 見出しテキスト */
      --payment_confirm_popup-color-link: #0066cc;           /* リンク色 */
      --payment_confirm_popup-color-alert: #ff0000;          /* 警告・強調（赤） */
      
      /* 背景・ボーダー */
      --payment_confirm_popup-color-border: #ccc;            /* テーブルボーダー */
      --payment_confirm_popup-color-bg-white: #fff;          /* 白背景 */
    }

    /* =================================
       ベーススタイル
       ================================= */
    .payment_confirm_popup_content {
      width: 100%;
      max-width: 680px;               /* PC幅 */
      margin: 0 auto;
      padding: 24px;
      font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
      font-size: 14px;
      line-height: 1.6;
      color: var(--payment_confirm_popup-color-text);
      box-sizing: border-box;
    }

    .payment_confirm_popup_content *,
    .payment_confirm_popup_content *::before,
    .payment_confirm_popup_content *::after {
      box-sizing: border-box;
    }

    /* =================================
       セクション
       ================================= */
    .payment_confirm_popup_section {
      margin-bottom: 32px;
    }

    .payment_confirm_popup_section:last-child {
      margin-bottom: 0;
    }

    .payment_confirm_popup_section_title {
      font-size: 16px;
      font-weight: bold;
      color: var(--payment_confirm_popup-color-heading);
      margin-bottom: 16px;
      padding-left: 12px;
      border-left: 4px solid var(--payment_confirm_popup-color-primary);
    }

    .payment_confirm_popup_subsection {
      margin-bottom: 20px;
    }

    .payment_confirm_popup_subsection_title {
      font-size: 14px;
      font-weight: bold;
      color: var(--payment_confirm_popup-color-heading);
      margin-bottom: 8px;
    }

    /* =================================
       テキスト・段落
       ================================= */
    .payment_confirm_popup_text {
      margin-bottom: 8px;
    }

    .payment_confirm_popup_text_note {
      font-size: 13px;
      color: var(--payment_confirm_popup-color-text);
      margin-top: 12px;
    }

    .payment_confirm_popup_text_warning {
      font-size: 13px;
      color: var(--payment_confirm_popup-color-text);
      margin-bottom: 16px;
    }

    /* =================================
       リンク
       ================================= */
    .payment_confirm_popup_link {
      color: var(--payment_confirm_popup-color-link);
      text-decoration: underline;
    }

    .payment_confirm_popup_link:hover {
      text-decoration: none;
    }

    /* =================================
       テーブル共通
       ================================= */
    .payment_confirm_popup_table_wrapper {
      overflow-x: auto;
      margin-bottom: 12px;
    }

    .payment_confirm_popup_table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    .payment_confirm_popup_table th,
    .payment_confirm_popup_table td {
      border: 1px solid var(--payment_confirm_popup-color-border);
      padding: 12px;
      text-align: left;
      vertical-align: middle;
    }

    .payment_confirm_popup_table th {
      background-color: var(--payment_confirm_popup-color-primary);
      color: var(--payment_confirm_popup-color-primary-text);
      font-weight: bold;
      white-space: nowrap;
    }

    .payment_confirm_popup_table td {
      background-color: var(--payment_confirm_popup-color-bg-white);
    }

    /* ラベルセル（左側の列） */
    .payment_confirm_popup_table .payment_confirm_popup_label_cell {
      background-color: var(--payment_confirm_popup-color-primary);
      color: var(--payment_confirm_popup-color-primary-text);
      font-weight: bold;
      width: 140px;
      text-align: center;
    }

    /* 金額セル */
    .payment_confirm_popup_table .payment_confirm_popup_fee_cell {
      width: 200px;
    }

    /* 赤太字（警告金額） */
    .payment_confirm_popup_text_alert {
      color: var(--payment_confirm_popup-color-alert);
      font-weight: bold;
    }

    /* =================================
       サブタイトル（テーブル上）
       ================================= */
    .payment_confirm_popup_table_title {
      font-size: 14px;
      font-weight: bold;
      color: var(--payment_confirm_popup-color-heading);
      margin-top: 20px;
      margin-bottom: 8px;
    }

    /* =================================
       その他セクション
       ================================= */
    .payment_confirm_popup_other_title {
      font-weight: normal;
      margin-top: 16px;
      margin-bottom: 8px;
    }

    .payment_confirm_popup_other_list {
      margin-left: 0;
      list-style: none;
      padding-left: 0;
    }

    .payment_confirm_popup_other_list li {
      margin-bottom: 4px;
      padding-left: 1em;
      text-indent: -1em;
    }

    /* =================================
       レスポンシブ（SP対応）
       ================================= */
    @media screen and (max-width: 768px) {
      .payment_confirm_popup_content {
        padding: 16px;
        font-size: 13px;
      }

      .payment_confirm_popup_section_title {
        font-size: 15px;
      }

      .payment_confirm_popup_table {
        font-size: 12px;
      }

      .payment_confirm_popup_table th,
      .payment_confirm_popup_table td {
        padding: 8px;
      }

      .payment_confirm_popup_table .payment_confirm_popup_label_cell {
        width: 100px;
      }

      .payment_confirm_popup_table .payment_confirm_popup_fee_cell {
        width: auto;
      }
    }

/* 赤文字（金額強調用） */
.payment_confirm_popup_price_alert {
  color: var(--payment_confirm_popup-color-alert);
  font-weight: bold;
}


/* ヘッダーの高さ分だけずらす */
:target {
  scroll-margin-top: 200px !important;
}
html {
  scroll-margin-top: 200px !important;
}

.review-radio input[type="radio"]:checked + .radio-label:after {
    background-color: #114d8b;
    box-shadow: inset 0 0 0 2px #f4f4f4;
    border-color: #114d8b;
}

@media screen and (max-width: 480px) {
    .cleaning_ttl1 .in {
        border-left: 5px solid var(--cleaning2);
        padding-left: 10px;
    }
}

@media screen and (max-width: 480px) {
    .cleaning_ttl1 {
        font-size: 18px;
        font-weight: bold;
        border-bottom: 1px solid var(--cleaning2);
        padding-bottom: 7px;
        margin-bottom: 20px;
    }
}

@media screen and (min-width: 481px) {
    .cleaning_ttl1 .in {
        border-left: 5px solid var(--cleaning2);
        padding-left: 10px;
    }
}

@media screen and (min-width: 481px) {
    .cleaning_ttl1 {
        font-size: 18px;
        font-weight: bold;
        border-bottom: 1px solid var(--cleaning2);
        padding-bottom: 7px;
        margin-bottom: 20px;
    }
}

.cart-header__btn a {
        border: 0px !important;
      }

      .cart_btn1 {
        background: #e56d8d !important;
        font-size: 15px !important;
        color: #fff;
      }

      .cart_btm_btn a {
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
      }

      @media screen and (max-width: 480px) {
        .cart_btm_btn a {
          width: 100% !important;
        }
      }



/* labelをflex化して上下中央揃え */
.option__desc._border {
  display: flex;
  align-items: center;
}

/* ラジオボタン風の丸 */
.option__desc._border::before {
  content: '';
  width: 20px;
  height: 20px;
  min-width: 20px;
  border: 2px solid #ccc;
  border-radius: 50%;
  margin-right: 12px;
  box-sizing: border-box;
}

/* 選択時の内側塗り */
.option_choice:checked + label.option__desc::before {
  border-color: var(--cleaning);
  box-shadow: inset 0 0 0 5px var(--cleaning);
}

.option_nooption {
  flex: 1;
  display: flex;
  align-items: center;
  height: 30px;
  justify-content: flex-start; /* 左寄せを明示 */
}

.w80 {width: 70px;}

@media screen and (max-width: 480px) {
  .top_sp_cont {
    margin-top: 0px !important;
  }
  .sp_cont {
    margin-top: 70px !important;
  }
  
  .top-slick .slick-dots li.slick-active button {
    background: #114D8B;
  }
}

.input-submit input {
    background: var(--cleaning)!important;
}