/* -------------------------------------------------------- */

/* @group @m-comfirm */

[class*="m-comfirm"] {
box-sizing: border-box;
display: grid;
grid-auto-flow: row;
align-content: start;
align-items: start;
gap: 1.125rem;
width: 90vw;
height: fit-content;
max-width: 40rem;
max-height: calc(100vh - 1.5rem);
margin: auto;
padding: 1.125rem;
background-color: var(--color-white);
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
transform: translate(-50%, -50%);
transition: opacity var(--transition-time) 0s var(--transition-cubic-bezier), visibility 0s var(--transition-time) var(--transition-cubic-bezier);
}

@supports (min-height: 100dvh) {

[class*="m-comfirm"] {
max-height: calc(100dvh - 1.5rem);
}

}

[class*="a-comfirm-overlay"] {
position: fixed;
z-index: 100;
visibility: var(--comfirm-visibility);
inset: 0;
opacity: var(--comfirm-opacity);
background-color: hsl(220deg 20% 20% / 50%);
pointer-events: var(--comfirm-pointer-events);
-webkit-backdrop-filter: blur(.125rem);
backdrop-filter: blur(.125rem);
}

:where([class*="is-fit-sticky"]) [class*="a-comfirm-overlay"] {
transition: opacity var(--transition-time) 0s var(--transition-cubic-bezier), visibility 0s var(--transition-time) var(--transition-cubic-bezier);
}

/* @end @m-comfirm */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-confermare-headline"] {
--head-2-margin-bottom: 0;
--head-2-font-size: 1.5rem;
--head-2-line-height: 1.5;
--head-2-font-family: var(--font-family-heading);
--head-2-font-weight: 600;
--head-2-word-break: keep-all;
--head-2-overflow-wrap: anywhere;
--word-break: keep-all;
--overflow-wrap: anywhere;
--text-align: center;
}

/* @end @variables */

/* @group @a-confermare-headline */

[class*="a-confermare-headline"] {
position: relative;
z-index: 3;
display: grid;
grid-auto-flow: row;
gap: .375rem;
}

/* @end @a-confermare-headline */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-comfirm-particular"] {
--head-4-font-size: .875rem;
--head-4-line-height: 1.71428571;
--head-2-font-family: var(--font-family-heading);
--head-4-font-weight: 600;
--head-4-word-break: keep-all;
--head-4-overflow-wrap: anywhere;
--font-size: .875rem;
--line-height: 1.71428571;
}

@media (width >= 48em) { /* 768px -> * */

[class*="a-comfirm-particular"] {
--info-particular-grid-template-columns: 9rem 1fr;
}

[class*="a-comfirm-particular-secondary"] {
--info-particular-grid-template-columns: 15rem 1fr;
}

}

/* @end @variables */

/* @group @a-comfirm-particular */

[class*="a-comfirm-particular"] {
display: grid;
align-content: start;
grid-template-columns: var(--info-particular-grid-template-columns);
gap: .375rem 1.125rem;
padding: .75rem;
box-shadow: 0 1px 0 0 var(--border-color), inset 0 1px 0 0 var(--border-color);
}

/* @end @a-comfirm-particular */

/* @group @a-comfirm-message */

[class*="a-comfirm-message"] {
margin-bottom: .75rem;
text-align: center;
}

/* @end @a-comfirm-message */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-confirm-section"] {
--head-3-margin-bottom: .75rem;
--head-2-word-break: keep-all;
--head-2-overflow-wrap: anywhere;
}

/* @end @variables */

/* @group @m-confirm-section */

[class*="m-confirm-section"] {
display: grid;
gap: 1.5rem;
}

:where([class*="m-confirm-section"]) h3 {
position: relative;
padding-left: .75rem;
}

:where([class*="m-confirm-section"]) h3:before {
content: '';
position: absolute;
top: .125rem;
bottom: .125rem;
left: 0;
width: .25rem;
background-color: var(--color-primary);
border-radius: .25rem;
}

/* @end @m-confirm-section */

/* @group @a-confirm-section */

[class*="a-confirm-section"] {
display: grid;
}

/* @end @a-confirm-section */

/* @group @m-confermare-footer */

/* --------------------------------------------------------*/

/*[class*="m-confermare-footer"] {
display: grid;
justify-content: center;
grid-auto-flow: row;
gap: .75rem;
}*/

/* @end @m-confermare-footer */

/* --------------------------------------------------------*/

[class*="m-turnstile-widget"] {
margin-block: -2.25rem;
text-align: center !important;
}

/* @end @m-confermare-footer */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-confermare-footer"] {
--confermare-footer-grid-template-columns: repeat(1, 1fr);
--confermare-footer-gap: .75rem;
}

@media (width >= 48em) { /* 768px -> * */

[class*="a-confermare-footer"] {
--confermare-footer-grid-template-columns: repeat(2, 1fr);
}

}

/* @end @variables */

/* @group @a-confermare-footer */

[class*="a-confermare-footer"] {
box-sizing: border-box;
display: grid;
grid-template-columns: var(--confermare-footer-grid-template-columns);
gap: var(--confermare-footer-gap);
width: 100%;
margin-top: .75rem;
}

/* @end @a-confermare-footer */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-form-billing-info"] {
--form-billing-info-display: none;
}

[class*="a-form-billing-info"][class*="is-active"] {
--form-billing-info-display: grid;
}

[class*="a-form-billing-info"]>p {
--font-weight: 500;
}

/* @end @variables */

/* @group @a-form-billing-info */

[class*="a-form-billing-info"] {
display: var(--form-billing-info-display);
gap: 1.125rem;
margin-top: -.75rem;
padding-top: 1.5rem;
box-shadow: 0 -1px 0 0 var(--border-color);
}

[class*="a-form-billing-info"]>p {
position: relative;
padding-left: .75rem;
}

[class*="a-form-billing-info"]>p:before {
content: '';
position: absolute;
top: .125rem;
bottom: .125rem;
left: 0;
width: .25rem;
background-color: var(--color-primary);
border-radius: .25rem;
}

/* @end @a-form-billing-info */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-form-receipt-info"] {
--form-receipt-info-display: none;
}

[class*="a-form-receipt-info"][class*="is-active"] {
--form-receipt-info-display: grid;
}

[class*="a-form-receipt-info"]>p {
--font-weight: 500;
}

/* @end @variables */

/* @group @a-form-receipt-info */

[class*="a-form-receipt-info"] {
display: var(--form-receipt-info-display);
gap: 1.125rem;
margin-top: -.75rem;
padding-top: 1.5rem;
box-shadow: 0 -1px 0 0 var(--border-color);
}

[class*="a-form-receipt-info"]>p {
position: relative;
padding-left: .75rem;
}

[class*="a-form-receipt-info"]>p:before {
content: '';
position: absolute;
top: .125rem;
bottom: .125rem;
left: 0;
width: .25rem;
background-color: var(--color-primary);
border-radius: .25rem;
}

/* @end @a-form-receipt-info */

/* --------------------------------------------------------*/

/* @group @variables - transition */

:root {
/* background-color & border-color & color */
--form-input-transition: background-color var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75), border-color var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75), box-shadow var(--transition-time) 0s var(--transition-cubic-bezier), color var(--transition-time) 0s var(--transition-cubic-bezier);
--form-check-block-transition: background-color var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75), border-color var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75), box-shadow var(--transition-time) 0s var(--transition-cubic-bezier), color var(--transition-time) 0s var(--transition-cubic-bezier);
--form-check-icon-transition: background-image var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75),background-color var(--transition-time) 0s cubic-bezier(.6, .5, .5, .75), color var(--transition-time) 0s var(--transition-cubic-bezier);
}

/* @end @variables - transition */

/* @group @variables - form color */

:root {
--color-input-disabled: hsl(220deg 5% 60% .5);
--color-form-checked: hsl(198deg 75% 47.5%);
--color-form-error: hsl(0deg 75% 47.5%);
--color-form-success: hsl(150deg 75% 47.5%);
--color-form-icon: hsl(242.5deg 5% 85%);
--color-autofill-primary: hsl(52deg 64% 45%);
--color-autofill-secondary: hsl(52deg 64% 97.5%);
--color-success-primary: hsl(120deg 55% 45%);
--color-success-secondary: hsl(120deg 60% 97.5%);
--color-error-primary: hsl(355deg 55% 55%);
--color-error-secondary: hsl(355deg 60% 97.5%);
--color-warning-primary: hsl(50deg 97.5% 47.5%);
--color-warning-secondary:hsl(50deg 100% 97.5%);
--color-focus-primary: hsl(205deg 55% 55%);
--color-focus-secondary: hsl(205deg 90% 97.5%);
--color-focus-tertiary: hsl(205deg 55% 75%);
}

/* @end @variables - form color */

/* -------------------------------------------------------- */

/* @group @form-btn-submit */

#form-btn-submit:disabled {
opacity: .5; /* 無効な入力がある場合、送信ボタンを半透明に */
pointer-events: none; /* 無効な場合、送信ボタンをクリック不可に */
}

/* @end @form-btn-submit */

/* @group @a-form-btn-close */

[class*="a-form-btn-close"] {
display: grid;
place-content: center;
}

/* @end @a-form-btn-close */

/* -------------------------------------------------------- */

/* @group @m-form-list */

[class*="m-form-list"] {
display: grid;
align-content: start;
grid-auto-flow: row;
grid-auto-columns: 1fr;
gap: 1.875rem;
}

/* @end @m-form-list */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-validate-message"] {
--validate-message-background-color: var(--color-error-secondary);
--validate-message-color: var(--color-error-primary);
--font-weight: 500;
--word-break: keep-all;
--overflow-wrap: anywhere;
}

[class*="has-validation-valid"] {
--validate-message-background-color: var(--background-color);
--validate-message-color: var(--color-form-checked);
}

/* @end @variables */

/* @group @a-validate-message */

[class*="a-validate-message"] {
min-height: 1.5rem;
padding: .75rem;
background-color: var(--validate-message-background-color);
color: var(--validate-message-color);
text-align: center;
}

/* @end @a-validate-message */

/* -------------------------------------------------------- */

/* @group @m-form-footer */

[class*="m-form-footer"] {
box-sizing: border-box;
display: grid;
grid-auto-columns: 1fr;
gap: 1.5rem;
}

/* @end @m-form-footer */

/* -------------------------------------------------------- */

/* @group @cf-turnstile */

[class*="cf-turnstile"] {
text-align: center;
}

/* @end @cf-turnstile */

/* -------------------------------------------------------- */

/* @group @loading */

[class*="a-btn-link"]>span[class*="a-icon-loading"] {
box-sizing: border-box;
position: absolute;
z-index: 3;
top: 50%;
left: 50%;
grid-column: 1 / span 3;
grid-row: 1 / span 3;
display: none;
width: 1.5rem;
height: 1.5rem;
transform: translate(-50%, -50%);
}

[class*="a-btn-link"]>span[class*="a-icon-loading"]:before {
box-sizing: border-box;
content: '';
display: grid;
width: 1.5rem;
height: 1.5rem;
border: .25rem solid hsl(0deg 0% 100%);
border-top: .25rem solid var(--color-primary);
border-radius: 50%;
animation: spin 1s linear infinite;
}

[class*="is-sender-push"] [class*="a-btn-link"] {
pointer-events: none;
}

[class*="is-sender-push"] [class*="a-btn-link"]>span[class*="a-icon-loading"] {
display: block;
}

[class*="is-sender-push"] [class*="a-btn-link"]>span:not([class*="a-icon-loading"]) {
display: none;
}

[class*="is-sender-error"] [class*="a-btn-link"] {
display: none;
pointer-events: none;
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

/* @end @loading */

/* -------------------------------------------------------- */

/* @group @a-sender-error */

[class*="a-sender-message"] {
--font-weight: 500;
--word-break: keep-all;
--overflow-wrap: anywhere;
}

/* @end @a-sender-error */

/* @group @a-validate-message */

[class*="a-sender-error"] {
display: none;
}

[class*="is-sender-error"] [class*="a-sender-error"] {
display: block;
}

[class*="a-sender-message"] {
min-height: 1.5rem;
padding: .75rem;
background-color: var(--background-color);
color: var(--color-form-checked);
text-align: center;
}

/* @end @a-validate-message */