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

/* @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);
border-radius: .5rem;
-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% / 87.5%);
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: 10.375rem 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-header"] {
--head-3-font-size: 1.125rem;
--head-3-line-height: 1.33333333;
--head-3-font-weight: 500;
--font-size: .875rem;
}

/* @end @variables */

/* @group @a-confirm-header */

[class*="a-confirm-header"] {
display: grid;
gap: .375rem;
text-align: center;
}

/* @end @a-confirm-header */

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

/* @group @a-confirm-detail */

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

/* @end @a-confirm-detail */

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

/* @group @variables */

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

[class*="a-confirm-section-secondary"] {
--head-3-overflow-wrap: anywhere;
}

/* @end @variables */

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

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

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

:where([class*="m-confirm-section-primary"]) 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-turnstile-widget */

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

/* @end @m-turnstile-widget */

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

/* @group @variables */

[class*="m-form-contents"] {
--form-contents-grid-template-columns: 1fr;
}

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

[class*="m-form-contents"] {
--form-contents-grid-template-columns: 2fr 1fr;
--form-body-grid-column: 1;
--form-body-grid-row: 1;
--form-sidebar-grid-column: 2;
--form-sidebar-grid-row: 1;
}

}

@media (width < 48em) { /* 0 -> 767px */

}

/* @end @variables */

/* @group @m-form-contents */

[class*="m-form-contents"] {
position: relative;
display: grid;
align-items: start;
gap: 3rem;
grid-template-columns: var(--form-contents-grid-template-columns);
}

[class*="m-form-body"] {
grid-column: var(--form-body-grid-column);
grid-row: var(--form-body-grid-row);
}

[class*="m-form-sidebar"] {
grid-column: var(--form-sidebar-grid-column);
grid-row: var(--form-sidebar-grid-row);
}

/* @end @m-form-contents */

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

/* @group @variables */

[class*="m-form-sidebar"] {
--form-contents-grid-template-columns: 2fr 1fr;
}

@media (width < 48em) { /* 0 -> 767px */

[class*="m-form-sidebar"] {
}

}

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

[class*="m-form-sidebar"] {
--form-sidebar-position: sticky;
--form-sidebar-top: 1.5rem;
}

}

/* @end @variables */

/* @group @m-form-sidebar */

[class*="m-form-sidebar"] {
position: var(--form-sidebar-position);
z-index: 11;
top: var(--form-sidebar-top);
display: grid;
gap: .75rem;
padding: .75rem;
background-color: var(--background-color);
border-radius: .75rem;
}

/* @end @m-form-sidebar */

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

/* @group @variables */

:where([class*="m-form-sidebar"]) {
--font-size: .875rem;
--line-height: 1.71428571;
}

:where([class*="m-form-sidebar"]) dt {
--font-weight: 500;
}

/* @end @variables */

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

[class*="a-form-sidebar-info"] {
display: grid;
justify-content: start;
grid-template-columns: auto 1fr;
gap: .375rem .75rem;
align-items: start;
}

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

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

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

[class*="a-form-receipt-info"] {
display: var(--form-receipt-info-display);
gap: .75rem;
}

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

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

/* @group @variables */

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

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

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

}

/* @end @variables */

/* @group @a-confirm-footer */

[class*="a-confirm-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-confirm-footer */

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

/* @group @variables */

[class*="a-form-participant-member"] {
--head-4-font-size: 1rem;
--head-4-line-height: 1.5;
--head-4-font-weight: 500;
--font-size: .875rem;
}

/* @end @variables */

/* @group @a-form-participant-member */

[class*="a-form-participant-member"] {
display: grid;
gap: .75rem;
padding: 1.125rem;
background-color: var(--background-color);
border-radius: .5rem;
}

/* @end @a-form-participant-member */

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

/* @group @m-form-participant */

[class*="m-form-participant"] {
display: grid;
gap: 1.125rem;
counter-reset: li-entry;
}

[class*="m-form-participant"]>section {
counter-increment: li-entry;
}

:where([class*="m-form-participant"] h4) span:after {
content: counter(li-entry);
}

/* @end @m-form-participant */

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

/* @group @a-form-participant-header */

[class*="a-form-participant-header"] {
position: relative;
display: grid;
align-items: center;
grid-template-columns: 1fr auto;
gap: .75rem;
margin-bottom: .375rem;
padding-left: .75rem;
}

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

/* @end @a-form-participant-header */

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

/* @group @variables */

[class*="a-form-participant-close"] {
--form-participant-close-background-image: url('../img/sprite-form-svg.svg#icon-close-white');
--button-color: var(--color-white);
--button-action-color: var(--color-white);
--button-active-color: var(--color-white);
--button-disabled-color: var(--color-white-disabled);
}

[class*="a-form-participant-close"]:disabled {
--form-participant-close-background-image: url('../img/sprite-form-svg.svg#icon-close-white-disabled');
}

/* @end @variables */

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

[class*="a-form-participant-close"] {
display: grid;
align-items: center;
height: 1.5rem;
padding-inline: 1.5rem .375rem;
background-image: var(--form-participant-close-background-image);
background-position:.375rem center ;
background-size: .75rem auto;
background-repeat: no-repeat;
background-color: var(--color-primary);
border-radius: .375rem;
transition: var(--background-color-transition);
}


[class*="a-form-participant-close"]:hover,
[class*="a-form-participant-close"]:focus {
background-color: var(--color-primary-action);
}

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

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

/* @group @variables */

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

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

/* @end @variables */

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

[class*="a-form-billing-info"] {
display: var(--form-billing-info-display);
gap: .75rem;
}

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

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

/* @group @variables */

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


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

/* @end @variables */

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

[class*="a-form-receipt-info"] {
display: var(--form-receipt-info-display);
gap: .75rem;
}

/* @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.125rem;
}

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

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

/* @group @variables */

[class*="a-validate-message"] {
--margin-bottom: .75rem;
--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 @variables */

:root {
--sending-overlay-display: none;
}

[class*="is-form-sending"] {
--sending-overlay-display: grid;
--text-align: center;
}

/* @end @variables */

/* @group @a-sending-overlay */

[class*="a-sending-overlay"] {
position: fixed;
z-index: 1001;
inset: 0;
display: var(--sending-overlay-display);
justify-content: center;
align-items: center;
background-color: hsl(220deg 5% 100% / 95%);
backface-visibility: hidden;
-webkit-backdrop-filter: blur(.125rem);
backdrop-filter: blur(.125rem);
}

:where([class*="a-sending-overlay"]) dl {
display: grid;
justify-content: center;
gap: .75rem;
}

/* @end @a-sending-overlay */

/* @group @loading */

[class*="a-icon-loading"] {
box-sizing: border-box;
display: grid;
z-index: 3;
width: 3rem;
height: 3rem;
margin: auto;
}

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

@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 */