@charset "UTF-8";
/*
Author: Cueβs Co., Ltd.
Author URI: https://www.cuebs.co.jp/
*/
:root {
  --deep-blue: #024696;
  --light-blue: #C4F3FF;
  --white: #ffffff;
  --black: #000000;
  --deep-blue-rgb: 2, 70, 150;
  --black-rgb: 0, 0, 0;
  --brand-primary: var(--deep-blue);
  --brand-secondary: var(--light-blue);
}

.selection-modal {
  --dialog-size: 90%;
  --dialog-padding: 3rem 1rem;
  --dialog-gap: 2.5rem;
  --icon-size: 100px;
  --btns-gap: 1rem;
  width: 100%;
  z-index: 9999;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  pointer-events: none;
  /* ボタン */
}
@media (min-width: 769px) {
  .selection-modal {
    --dialog-size: min(62%, 1190px);
    --dialog-padding: 6rem 1rem;
    --dialog-gap: 5rem;
    --icon-size: 203px;
    --btns-gap: 3rem;
  }
}
.selection-modal.is-show {
  opacity: 1;
}
.selection-modal-dialog {
  width: var(--dialog-size);
  background: var(--white);
  padding: var(--dialog-padding);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);
  gap: var(--dialog-gap);
  max-height: 90vh;
  overflow-y: auto;
  overflow-x: hidden;
}
@media (min-width: 769px) {
  .selection-modal-dialog p {
    text-align: center;
  }
}
.selection-modal, .selection-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
}
.selection-modal-backdrop {
  width: 100vw;
  background: var(--black);
  height: 100vh;
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.selection-modal-backdrop.is-show {
  opacity: 0.8;
}
.selection-modal-title {
  font-size: clamp(1.25rem, 0.654rem + 2.98vw, 2.5rem);
  font-weight: bold;
}
.selection-modal-title::before {
  width: var(--icon-size);
  background-color: var(--brand-secondary);
  margin-inline: auto;
  -webkit-mask-image: url("data:image/svg+xml,<svg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M94.587 85.064 52.833 11.79A3.25 3.25 0 0 0 50 10.156a3.26 3.26 0 0 0-2.832 1.634L5.42 85.064a3.16 3.16 0 0 0 .027 3.191 3.25 3.25 0 0 0 2.802 1.588h83.506a3.26 3.26 0 0 0 2.805-1.588 3.2 3.2 0 0 0 .027-3.191m-38.903-4.599H44.315v-9.371h11.369zm0-16.406H44.315V35.934h11.369z' clip-rule='evenodd'/></svg>");
          mask-image: url("data:image/svg+xml,<svg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M94.587 85.064 52.833 11.79A3.25 3.25 0 0 0 50 10.156a3.26 3.26 0 0 0-2.832 1.634L5.42 85.064a3.16 3.16 0 0 0 .027 3.191 3.25 3.25 0 0 0 2.802 1.588h83.506a3.26 3.26 0 0 0 2.805-1.588 3.2 3.2 0 0 0 .027-3.191m-38.903-4.599H44.315v-9.371h11.369zm0-16.406H44.315V35.934h11.369z' clip-rule='evenodd'/></svg>");
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: 100%;
          mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  content: "";
  display: block;
  height: var(--icon-size);
}
.selection-modal-btn-wrap {
  width: min(90%, 720px);
  margin-inline: auto;
  -webkit-column-gap: var(--btns-gap);
     -moz-column-gap: var(--btns-gap);
          column-gap: var(--btns-gap);
}
.selection-modal-btn {
  color: var(--brand-primary);
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 0;
      -ms-flex: 1 0 0px;
          flex: 1 0 0;
}
.selection-modal-btn > a {
  padding: 0.75rem 2rem;
}
.selection-modal-btn > a:hover {
  background-color: var(--brand-secondary);
}

.is-show:where(.selection-modal, .selection-modal-backdrop) {
  visibility: visible;
  pointer-events: auto;
}/*# sourceMappingURL=modal.css.map */