/* =========================================================
   供花 Web注文ページ  p-order
   既存 base.css / common.css / page.css の後に読み込む
   ========================================================= */
.p-order .bg-violet::before { top: -8%; right: -150%; }
/* 注文系ページではフッターの「資料請求」ボックスと「事前相談」バナーを出さない。
   既存フッターはそのボックスがある前提の固定高さ・マイナス余白なので、ここで打ち消す */
.p-order { padding-bottom: 120px; }
.p-order + .c-footer .c-footer__top { height: auto; min-height: 0; padding-top: 100px; padding-bottom: 0; }
.p-order + .c-footer .c-footer__logo { margin-top: 0; }

/* ---- 注文ステップ ---- */
.p-order__steps { display: flex; justify-content: center; max-width: 620px; margin: 0 auto; }
.p-order__step { flex: 1; text-align: center; position: relative; font-size: 14px; color: #999; }
.p-order__step span { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px;
  margin: 0 auto 8px; border-radius: 50%; background: #fff; border: 2px solid #ccc; color: #999;
  font-family: YuMincho; font-size: 20px; line-height: 1; position: relative; z-index: 1; }
.p-order__step + .p-order__step::before { content: ""; position: absolute; top: 24px; left: -50%; width: 100%; height: 2px; background: #ccc; }
.p-order__step.is-current { color: #5D5FAC; }
.p-order__step.is-current span { background: #5D5FAC; border-color: #5D5FAC; color: #fff; }

/* ---- 締切アラート ---- */
.p-order__deadline { display: inline-flex; align-items: center; gap: 10px; padding: 14px 36px;
  border: 2px solid #B55C62; color: #B55C62; border-radius: 60px; font-size: 16px; background: #fff; }
.p-order__deadline::before { content: "!"; width: 22px; height: 22px; border-radius: 50%; background: #B55C62; color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-family: YuMincho; font-size: 15px; flex-shrink: 0; }

/* ---- フォーム ---- */
.p-order__form { max-width: 1000px; margin: 0 auto; }
.p-order__table { width: 100%; border-collapse: collapse; }
.p-order__table tr { border-bottom: 1px solid #ccc; }
.p-order__table tr:first-child { border-top: 1px solid #ccc; }
.p-order__table th { width: 30%; padding: 28px 20px 24px 90px; text-align: left; vertical-align: top;
  font-size: 15px; letter-spacing: 1px; position: relative; line-height: 1.6; }
.p-order__table td { padding: 25px 0 22px 20px; font-size: 15px; }
.p-order__req, .p-order__opt { position: absolute; left: 20px; top: 27px; width: 46px; font-size: 11px; line-height: 26px;
  text-align: center; border-radius: 10px; color: #fff; background: #DF1B1B; letter-spacing: 1px; }
.p-order__opt { background: #ccc; }

.p-order__input { width: 100%; max-width: 500px; padding: 17px 20px; background: #f8f8f8; border: 2px solid #f8f8f8;
  border-radius: 10px; font: inherit; font-size: 14px; font-weight: bold; letter-spacing: 1px; color: #111; transition: all .2s ease; }
.p-order__input::placeholder { color: #aaa; font-weight: normal; }
.p-order__input:focus { outline: none; border-color: #5D5FAC; background: #fff; }
.p-order__input--xs { max-width: 120px; }
.p-order__input--s  { max-width: 200px; }
.p-order__input--m  { max-width: 360px; }
.p-order__input--l  { max-width: 680px; }
.p-order__input--full { max-width: 100%; }
select.p-order__input { appearance: none; -webkit-appearance: none; padding-right: 44px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'><path d='M1 1l6 6 6-6' fill='none' stroke='%235D5FAC' stroke-width='2'/></svg>");
  background-repeat: no-repeat; background-position: right 18px center; cursor: pointer; }
textarea.p-order__input { max-width: 680px; height: 160px; resize: vertical; }
.p-order__inline { display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center; }
.p-order__inline label { font-size: 14px; }
.p-order__unit { font-size: 14px; }
.p-order__note { font-size: 13px; color: #666; margin-top: 8px; line-height: 1.7; }
.p-order__note--error { color: #DF1B1B; }
.p-order__note--lg { font-size: 15px; color: #111; margin-top: 12px; }
.p-order__fixed { font-family: YuMincho; font-size: 18px; }
.p-order__fixed small { display: block; font-family: "Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; font-size: 13px; color: #666; }

/* 通夜・告別式 */
.p-order__lead { font-size: 14px; color: #111; margin-bottom: 4px; }
.p-order__dtRow { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.p-order__dtLabel { width: 56px; flex-shrink: 0; font-size: 14px; }
.p-order__dt.is-disabled { opacity: .4; }
.p-order__dtRow .p-order__inline { flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; }
.p-order__inline .p-order__input--s  { width: 200px; }
.p-order__inline .p-order__input--xs { width: 120px; }

/* ラジオ / チェック */
.p-order__choices { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.p-order__choices--col { flex-direction: column; gap: 14px; }
.p-order__radio, .p-order__check { position: relative; }
.p-order__radio input, .p-order__check input { position: absolute; opacity: 0; width: 0; height: 0; }
.p-order__radio label, .p-order__check label { position: relative; display: inline-block; padding-left: 32px; line-height: 22px; cursor: pointer; font-size: 15px; }
.p-order__radio label::before, .p-order__check label::before { content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px;
  border-radius: 50%; background: #f8f8f8; border: 1px solid #ccc; transition: all .2s ease; }
.p-order__check label::before { border-radius: 5px; }
.p-order__radio input:checked + label::before, .p-order__check input:checked + label::before { border-color: #5D5FAC; background: #fff; }
.p-order__radio input:checked + label::after { content: ""; position: absolute; left: 5px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: #5D5FAC; }
.p-order__check input:checked + label::after { content: ""; position: absolute; left: 7px; top: 4px; width: 5px; height: 10px;
  border: solid #5D5FAC; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.p-order__radio input:focus-visible + label::before, .p-order__check input:focus-visible + label::before { outline: 2px solid #5D5FAC; outline-offset: 2px; }
.p-order__choiceNote { display: block; padding-left: 32px; font-size: 13px; color: #666; margin-top: 4px; }

/* ---- 商品選択カード ---- */
.p-order__products { display: flex; flex-wrap: wrap; gap: 30px 3%; max-width: 1000px; margin: 0 auto; }
.p-order__product { width: 31.33%; background: #fff; border-radius: 30px; box-shadow: 0 3px 6px rgba(0,0,0,.16);
  overflow: hidden; border: 2px solid #fff; transition: all .4s ease; }
.p-order__product.is-selected { border-color: #5D5FAC; }
.p-order__productImg { aspect-ratio: 360 / 240; }
.p-order__productImg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.p-order__productBody { padding: 22px 20px 26px; text-align: center; }
.p-order__productName { font-size: 18px; line-height: 1.4; }
.p-order__productUnit { font-size: 13px; color: #666; margin-top: 2px; }
.p-order__productPrice { font-family: YuMincho; font-size: 26px; color: #5D5FAC; line-height: 1.2; margin-top: 8px; }
.p-order__productPrice small { font-size: 12px; font-family: "Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; color: #666; margin-left: 4px; }
.p-order__qty { display: inline-flex; align-items: center; margin-top: 16px; border: 1px solid #ccc; border-radius: 60px; overflow: hidden; background: #fff; }
.p-order__qty button { width: 44px; height: 44px; border: 0; background: #f5f5fa; color: #5D5FAC; font-size: 22px; line-height: 1; cursor: pointer; font-family: inherit; transition: all .2s ease; }
.p-order__qty button:hover { background: #5D5FAC; color: #fff; }
.p-order__qty input { width: 56px; height: 44px; text-align: center; border: 0; font: inherit; font-size: 16px; font-weight: bold; color: #111; -moz-appearance: textfield; }
.p-order__qty input::-webkit-outer-spin-button, .p-order__qty input::-webkit-inner-spin-button { -webkit-appearance: none; }
.p-order__qtyLabel { font-size: 12px; color: #666; margin-top: 6px; }

/* ---- 名札 ---- */
.p-order__plates { max-width: 1000px; margin: 0 auto; }
.p-order__plate { display: flex; flex-wrap: wrap; gap: 10px 15px; align-items: center; background: #fff; border-radius: 30px;
  box-shadow: 0 3px 6px rgba(0,0,0,.16); padding: 20px 25px; }
.p-order__plate + .p-order__plate { margin-top: 15px; }
.p-order__plateNo { width: 36px; height: 36px; border-radius: 50%; background: #5D5FAC; color: #fff; font-family: YuMincho; font-size: 16px;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.p-order__plate .p-order__input { flex: 1; min-width: 200px; max-width: none; }
.p-order__plateRemove { border: 0; background: none; color: #999; font-size: 13px; cursor: pointer; font-family: inherit; text-decoration: underline; }
.p-order__plateRemove:hover { color: #B55C62; }
.p-order__addRow { display: inline-flex; align-items: center; gap: 8px; padding: 12px 28px; border: 1px solid #5D5FAC; color: #5D5FAC; background: #fff;
  border-radius: 60px; font: inherit; font-size: 14px; font-weight: bold; cursor: pointer; transition: all .4s ease; }
.p-order__addRow::before { content: "+"; font-size: 18px; line-height: 1; }
.p-order__addRow:hover { background: #5D5FAC; color: #fff; }

/* ---- 合計 ---- */
.p-order__total { max-width: 1000px; margin: 30px auto 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px 20px;
  background: rgba(93,95,172,.1); border-radius: 100px; padding: 22px 50px; }
.p-order__totalLabel { font-size: 16px; }
.p-order__totalLabel small { display: block; font-size: 12px; color: #666; }
.p-order__totalPrice { font-family: YuMincho; font-size: 36px; color: #5D5FAC; line-height: 1; }
.p-order__totalPrice small { font-size: 14px; font-family: "Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; color: #666; margin-left: 6px; }

/* ---- 支払方法ボックス ---- */
.p-order__payNotes { margin-top: 10px; padding: 16px 20px; background: #f5f5fa; border-radius: 20px; font-size: 13px; color: #666; line-height: 1.8; }
.p-order__payNotes li::before { content: "・"; }

/* ---- 同意 / 送信 ---- */
.p-order__consent { text-align: center; }
.p-order__consent a, .p-order__consentLink { color: #5D5FAC; text-decoration: underline; text-underline-offset: 3px; }
.p-order__consentLink:hover { opacity: 1; color: #8082D5; }
.p-order__submitWrap { text-align: center; }
.p-order__submit { display: block; width: 800px; max-width: 100%; margin: 0 auto; padding: 30px 10px; background: #5D5FAC; color: #fff;
  font: inherit; font-size: 26px; font-weight: bold; border: 0; border-radius: 100px; cursor: pointer; box-shadow: 0 3px 6px rgba(0,0,0,.16); transition: all .4s ease; letter-spacing: 1px; }
.p-order__submit:hover { background: #8082D5; }
.p-order__submit[disabled] { background: #ccc; cursor: not-allowed; box-shadow: none; }
.p-order__back { display: inline-block; margin-top: 20px; font-size: 14px; color: #666; text-decoration: underline; }

/* ---- FAX 代替ボックス ---- */
.p-order__alt { max-width: 1000px; margin: 0 auto; background: #fff; border-radius: 30px; box-shadow: 0 3px 6px rgba(0,0,0,.16); padding: 45px 40px; text-align: center; }
.p-order__alt h3 { font-family: YuMincho; font-size: 22px; }
.p-order__altBtns { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px 30px; margin-top: 25px; }
.p-order__altBtn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 360px; max-width: 100%; height: 62px;
  border-radius: 60px; background: #fff; border: 1px solid #ccc; font-size: 15px; font-weight: 600; transition: all .4s ease; }
.p-order__altBtn:hover { opacity: 1; border-color: #5D5FAC; color: #5D5FAC; }
.p-order__altBtn img { width: 18px; height: 18px; }
.p-order__altBtn--pdf::before { content: "PDF"; font-size: 10px; color: #fff; background: #B55C62; border-radius: 4px; padding: 2px 5px; line-height: 1; }

/* ---- 確認画面（ダミー表示） ---- */
.p-order__confirm dl { display: flex; gap: 0; background: rgba(93,95,172,.1); border-radius: 100px; padding: 18px 0; }
.p-order__confirm dl + dl { margin-top: 15px; }
.p-order__confirm dt { width: 240px; text-align: center; font-size: 15px; padding: 0 20px; flex-shrink: 0; }
.p-order__confirm dd { font-size: 15px; padding: 0 20px 0 0; }

/* ---- Responsive ---- */
@media (max-width: 1024px) {
  .p-order__product { width: 48%; }
  .p-order__table th { padding-left: 80px; }
}
@media (max-width: 768px) {
  .p-order__steps { max-width: 320px; }
  .p-order__step { font-size: 12px; }
  .p-order__step span { width: 36px; height: 36px; font-size: 16px; }
  .p-order__step + .p-order__step::before { top: 18px; }
  .p-order__deadline { font-size: 13px; padding: 10px 18px; border-radius: 30px; text-align: left; line-height: 1.6; }
  .p-order__table, .p-order__table tbody, .p-order__table tr, .p-order__table th, .p-order__table td { display: block; width: 100%; }
  .p-order__table th { padding: 18px 0 8px; font-size: 14px; }
  .p-order__note--lg { font-size: 13px; }
  .p-order__table td { padding: 0 0 18px; font-size: 13px; }
  .p-order__req, .p-order__opt { position: static; display: inline-block; margin-right: 10px; vertical-align: middle; width: 40px; line-height: 22px; font-size: 10px; }
  .p-order__input { max-width: 100%; padding: 14px 16px; font-size: 13px; }
  .p-order__input--xs { max-width: 100px; } .p-order__input--s { max-width: 160px; }
  .p-order__inline { gap: 8px 10px; }
  .p-order__dtRow { flex-direction: column; align-items: flex-start; gap: 6px; }
  .p-order__dtRow .p-order__inline { width: 100%; flex-wrap: wrap; }
  #zipStatus { flex-basis: 100%; }
  .p-order__inline .p-order__input { flex: 1 1 0; width: auto; min-width: 0; }
  .p-order__inline .p-order__input--s  { flex: 1 1 140px; max-width: none; }
  .p-order__inline .p-order__input--xs { flex: 1 1 90px; max-width: none; }
  .p-order__inline .p-order__input--m  { flex: 1 1 200px; max-width: none; }
  .p-order__products { gap: 20px 4%; }
  .p-order__product { width: 48%; border-radius: 20px; }
  .p-order__productBody { padding: 14px 10px 18px; }
  .p-order__productName { font-size: 14px; }
  .p-order__productPrice { font-size: 20px; }
  .p-order__qty button { width: 34px; height: 36px; font-size: 18px; } .p-order__qty input { width: 40px; height: 36px; font-size: 14px; }
  .p-order__plate { padding: 15px; border-radius: 20px; }
  .p-order__plate .p-order__input { min-width: 100%; }
  .p-order__total { border-radius: 30px; padding: 18px 25px; }
  .p-order__totalPrice { font-size: 28px; }
  .p-order__submit { font-size: 18px; padding: 20px 10px; }
  .p-order__alt { padding: 30px 20px; border-radius: 20px; }
  .p-order__alt h3 { font-size: 17px; }
  .p-order__altBtn { width: 100%; height: 50px; font-size: 13px; }
  .p-order__confirm dl { border-radius: 16px; padding: 10px 12px; flex-direction: column; gap: 4px; }
  .p-order__confirm dt { width: auto; text-align: left; padding: 0; font-size: 12px; color: #5D5FAC; }
  .p-order__confirm dd { font-size: 13px; padding: 0; }
  .p-order { padding-bottom: 60px; }
  /* 事前相談の下部固定帯を出さないので、Scrollボタンを下端に寄せる（既存は帯を避けて bottom:90px） */
  .p-order + .c-footer .c-scrolldown { bottom: 20px; }
  .p-order + .c-footer .c-footer__top { padding-top: 50px; padding-bottom: 40px; }
}

/* 名札: 未選択時の無効状態 */
.p-order__input:disabled, .p-order__addRow:disabled { opacity: .45; cursor: not-allowed; }
.p-order__plates select option:disabled { color: #bbb; }
.p-order__addRow:disabled:hover { background: #fff; color: #5D5FAC; }

/* ---- 規約ページ ---- */
.p-policy__draft { max-width: 1000px; margin-left: auto; margin-right: auto; border: 2px solid #B55C62; color: #B55C62; border-radius: 20px; padding: 12px 20px; font-size: 13px; text-align: center; background: #fff; }
.p-policy__toc { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 20px; }
.p-policy__toc a { display: inline-flex; align-items: center; padding: 10px 24px; border: 1px solid #5D5FAC; color: #5D5FAC; border-radius: 60px; font-size: 14px; background: #fff; transition: all .4s ease; }
.p-policy__toc a:hover { opacity: 1; background: #5D5FAC; color: #fff; }
.p-policy__body { max-width: 1000px; margin-left: auto; margin-right: auto; background: #fff; border-radius: 30px; box-shadow: 0 3px 6px rgba(0,0,0,.16); padding: 40px 50px; font-size: 15px; line-height: 1.9; font-weight: normal; }
.p-policy__body p { margin: 0 0 12px; }
.p-policy__body h4 { font-family: YuMincho; font-size: 18px; color: #5D5FAC; margin: 28px 0 8px; padding-left: 14px; border-left: 3px solid #5D5FAC; line-height: 1.4; }
.p-policy__body ul { margin: 0 0 12px; padding-left: 0; }
.p-policy__body li { position: relative; padding-left: 20px; margin-bottom: 6px; }
.p-policy__body li::before { content: ""; position: absolute; left: 4px; top: 11px; width: 7px; height: 7px; border-radius: 50%; background: #5D5FAC; }
.p-policy__check { display: inline-block; margin-left: 8px; padding: 1px 10px; border-radius: 10px; background: #DF1B1B; color: #fff; font-size: 11px; vertical-align: middle; line-height: 20px; }
.p-policy__contact { background: #f5f5fa; border-radius: 20px; padding: 16px 24px; font-size: 14px; line-height: 1.8; }
.p-policy__date { margin-top: 16px; font-size: 13px; color: #666; }
.p-policy__highlight { display: flex; flex-direction: column; gap: 4px; background: rgba(93,95,172,.1); border-radius: 100px; padding: 18px 40px; margin: 16px 0 24px; text-align: center; }
.p-policy__highlight strong { font-family: YuMincho; font-size: 20px; color: #5D5FAC; }
.p-policy__highlight span { font-size: 14px; }
@media (max-width: 768px) {
  .p-policy__body { padding: 24px 18px; border-radius: 20px; font-size: 13px; }
  .p-policy__body h4 { font-size: 15px; }
  .p-policy__highlight { border-radius: 20px; padding: 14px 16px; }
  .p-policy__highlight strong { font-size: 16px; }
  .p-policy__toc a { font-size: 12px; padding: 8px 14px; }
  .p-policy__check { display: block; width: max-content; margin: 4px 0 0; }
}
