/* ho-log の案内ページに合わせた、掲載修正・削除とお問い合わせの共通表示。 */
.page-information { background: var(--c-cream); color: var(--c-text); }
.page-information main [id] { scroll-margin-top: calc(var(--header-h) + 24px); }
.page-information .breadcrumb { background: var(--c-cream); }
.ip-hero { padding: 40px 0 37px; text-align: center; border-bottom: 1px solid var(--c-primary-bg); }
.ip-hero > .container { max-width: var(--container); }
.ip-eyebrow { display: block; font-size: 10px; font-weight: 600; letter-spacing: .13em; color: var(--theme-pink-ink); margin-bottom: 14px; }
.ip-hero h1 { font: 600 clamp(25px,3vw,35px)/1.75 var(--tl-serif); color: var(--c-text); margin: 0; overflow-wrap: anywhere; }
.ip-hero p { margin: 15px auto 0; font-size: 13px; line-height: 1.95; color: var(--c-text-sub); max-width: 720px; }
.ip-container { max-width: 1120px; padding-top: 36px; padding-bottom: 70px; }
.ip-panel { background: #fff; border: 1px solid var(--c-border); border-radius: 12px; padding: 34px; min-width: 0; }
.ip-intro { font-size: 14px; color: var(--c-text-sub); line-height: 2; margin-bottom: 30px; }
.ip-choice-area { padding: 26px; background: var(--c-primary-bg); border: 1px solid var(--c-primary-bg); border-radius: 8px; margin-bottom: 30px; }
.ip-choice-area h2 { color: var(--c-text); font-size: 17px; font-weight: 600; text-align: center; margin: 0 0 22px; line-height: 1.8; }
.ip-method-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.ip-method-choice { display: flex; flex-direction: column; gap: 12px; padding: 22px; border: 2px solid var(--c-border); border-radius: 7px; background: #fff; color: var(--c-text); text-decoration: none !important; }
.ip-method-choice:hover, .ip-method-choice[aria-expanded="true"] { border-color: #a56936; background: #fffdf7; color: var(--c-text); }
.ip-method-choice strong { display: flex; align-items: baseline; gap: 9px; font-size: 15px; line-height: 1.9; }
.ip-method-choice strong > span { color: var(--theme-pink-ink); font-size: 12px; }
.ip-method-choice > span { display: block; font-size: 12px; line-height: 1.9; color: var(--c-text-sub); }
.ip-method-choice small { align-self: flex-start; font-size: 10px; font-weight: 500; border-radius: 4px; background: var(--c-primary-bg); color: var(--theme-pink-ink); padding: 4px 8px; margin-top: auto; }
.ip-method-choice:last-child small { background: #f7eee2; color: #9b612c; }
.ip-method-content { padding: 25px; border: 1px solid var(--c-primary-bg); background: #fbfcf8; border-radius: 8px; margin-top: 24px; }
.ip-method-content[hidden] { display: none; }
.ip-method-content h2 { display: flex; align-items: center; gap: 12px; font: 600 21px/1.8 var(--tl-serif); color: var(--c-text); margin: 0 0 16px; }
.ip-number { display: inline-grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--c-text); color: #fff; font: 500 11px/1 var(--font); }
.ip-method-content > p { font-size: 13px; line-height: 1.95; color: var(--c-text-sub); }
.ip-method-layout { display: grid; grid-template-columns: 1.2fr 1fr; align-items: start; gap: 26px; margin-top: 25px; }
.ip-steps { list-style: none; padding: 0; margin: 0; counter-reset: info-step; }
.ip-steps li { position: relative; padding: 0 0 22px 41px; margin: 0; min-height: 40px; }
.ip-steps li:last-child { padding-bottom: 0; }
.ip-steps li::before { content: counter(info-step,decimal-leading-zero); counter-increment: info-step; display: grid; place-items: center; position: absolute; left: 0; top: 1px; width: 26px; height: 26px; border: 1px solid #d6e1cb; border-radius: 50%; background: var(--theme-yellow-wash); color: var(--theme-pink-ink); font-size: 10px; }
.ip-steps h3 { font: 600 14px/1.8 var(--font); color: var(--c-text); margin: 0 0 5px; }
.ip-steps p { color: var(--c-text-sub); font-size: 12px; line-height: 1.9; margin: 0; }
.ip-example { margin: 0; padding: 23px; border: 1px solid var(--c-border); background: #fff; border-radius: 9px; }
.ip-example > small { display: block; color: #829078; font-size: 10px; margin-bottom: 16px; }
.ip-example strong { display: block; color: var(--c-text); font-size: 15px; font-weight: 600; }
.ip-example p { font-size: 12px; line-height: 1.9; color: var(--c-text-sub); margin: 12px 0 20px; }
.ip-example-button { display: flex; justify-content: center; align-items: center; gap: 8px; min-height: 45px; background: #c83c38; color: #fff; border-radius: 6px; padding: 10px; font-size: 12px; font-weight: 600; box-shadow: 0 2px 0 #9d2926; }
.ip-example-button .icon { width: 16px; height: 16px; }
.ip-example-caption { display: block; margin-top: 14px; color: var(--c-text-mute); font-size: 10px; text-align: center; }
.ip-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 12px 21px; border: 1px solid #bdc9c7; border-radius: 6px; background: #fff; font: 600 13px/1.7 var(--font); color: var(--c-text); text-decoration: none !important; }
.ip-button .icon { width: 17px; height: 17px; }
.ip-button:hover { background: var(--theme-yellow-wash); color: var(--c-text); }
.ip-button-primary, .ip-button-primary:hover { background: var(--c-primary); border-color: var(--c-primary); color: #fff; box-shadow: 0 2px 0 var(--c-primary-deep); }
.ip-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 22px; margin-top: 26px; }
.ip-actions p { font-size: 11px; color: var(--c-text-mute); margin: 0; }
.ip-bottom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; }
.ip-bottom-grid h2 { font: 600 21px/1.8 var(--tl-serif); color: var(--c-text); margin-bottom: 15px; }
.ip-bottom-grid p, .ip-bottom-grid li { font-size: 13px; color: var(--c-text-sub); line-height: 1.95; }
.ip-bottom-grid ul { padding-left: 18px; margin: 0; }
.ip-bottom-grid li + li { margin-top: 8px; }
.ip-bottom-grid a:not(.ip-button) { color: var(--c-text); text-decoration: underline; text-underline-offset: 3px; }
.ip-request { max-width: 700px; padding-top: 30px; padding-bottom: 60px; }
.ip-contact { max-width: 840px; padding-top: 30px; padding-bottom: 65px; }
.ip-contact .form-steps { margin-bottom: 25px; }
.ip-contact .notice { background: var(--theme-yellow-wash); border-color: var(--c-border); color: var(--c-text-sub); padding: 20px 23px; border-radius: 8px; font-size: 12px; line-height: 1.95; margin-bottom: 26px; }
.ip-contact .notice a { color: var(--c-text); text-decoration: underline; }
.ip-contact .contact-form { padding: 32px; box-shadow: none; border: 1px solid var(--c-border); border-radius: 11px; gap: 25px; }
.ip-contact .field > label, .ip-contact legend { font-size: 13px; color: var(--c-text); }
.ip-contact .input, .ip-contact .select, .ip-contact .textarea { font-size: 16px; border-radius: 5px; border-color: #cbd6c7; }
.ip-contact .choice { border-radius: 5px; background: var(--c-primary-bg); font-size: 12px; }
.ip-contact .form-help, .ip-contact .field-hint, .ip-contact .agree-check { font-size: 11px; line-height: 1.9; }
.ip-contact .form-actions .btn-primary, .ip-contact .empty-state .btn-primary { background: var(--c-primary); border-color: var(--c-primary); color: #fff; border-radius: 6px; font-size: 13px; }
.ip-contact .info-table { font-size: 13px; }
.ip-contact .info-table th { background: var(--theme-yellow-wash); color: var(--c-text); }
.ip-contact .info-table th, .ip-contact .info-table td { padding: 18px; border-color: var(--c-border); }
.ip-contact .empty-state { padding: 35px; background: #fff; border: 1px solid var(--c-border); border-radius: 12px; }
.ip-contact .empty-state h1 { font: 600 27px/1.8 var(--tl-serif); color: var(--c-text); }
.ip-contact .empty-state p { font-size: 13px; line-height: 1.95; color: var(--c-text-sub); }
.page-information :is(a,button,input,textarea,select):focus-visible { outline: 3px solid #dca267; outline-offset: 3px; }
@media(max-width:850px) { .ip-method-layout { grid-template-columns: 1fr; } .ip-example { max-width: 420px; width: 100%; } }
@media(max-width:640px) {
 .ip-hero { padding: 27px 0; }
 .ip-hero h1 { font-size: 25px; }
 .ip-hero p { font-size: 12px; margin-top: 12px; }
 .ip-container { padding-top: 22px; padding-bottom: 42px; }
 .ip-panel { padding: 21px; }
 .ip-intro { font-size: 13px; margin-bottom: 23px; }
 .ip-choice-area { padding: 18px; margin-bottom: 22px; }
 .ip-choice-area h2 { font-size: 15px; text-align: left; margin-bottom: 16px; }
 .ip-method-choices, .ip-bottom-grid { grid-template-columns: 1fr; gap: 15px; }
 .ip-method-choice { padding: 18px; gap: 9px; }
 .ip-method-choice strong { font-size: 14px; }
 .ip-method-choice > span { font-size: 11px; }
 .ip-method-content { padding: 19px; }
 .ip-method-content h2 { font-size: 19px; gap: 9px; align-items: flex-start; }
 .ip-number { width: 27px; height: 27px; margin-top: 3px; }
 .ip-method-content > p { font-size: 12px; }
 .ip-method-layout { gap: 20px; margin-top: 21px; }
 .ip-steps h3 { font-size: 13px; }
 .ip-steps p { font-size: 11px; }
 .ip-bottom-grid h2 { font-size: 20px; }
 .ip-bottom-grid p, .ip-bottom-grid li { font-size: 12px; }
 .ip-actions { align-items: stretch; flex-direction: column; gap: 13px; margin-top: 21px; }
 .ip-request, .ip-contact { padding-top: 23px; padding-bottom: 42px; }
 .ip-contact .notice { padding: 17px; font-size: 11px; }
 .ip-contact .contact-form { padding: 21px; gap: 23px; }
 .ip-contact .empty-state { padding: 26px 19px; }
 .ip-contact .empty-state h1 { font-size: 23px; }
}
