@charset "UTF-8";
/*******************************************************************/
/* PC */
/*******************************************************************/
@media print, screen and (min-width: 769px) {
  /*=================================================================*/
  /*	form-view */
  /*=================================================================*/
  .form-view {
    padding: 5%;
  }
  .form-view__head {
    text-align: center;
    font-size: clamp(2rem, 2vw + 1.2rem, 3.2rem);
    letter-spacing: 0.15em;
    margin-bottom: 2.5%;
  }
  .form-view__first-text {
    text-align: center;
    font-size: clamp(1.1rem, 1vw + 0.8rem, 1.8rem);
    margin-bottom: 2.5%;
  }
  .form-view__form-block {
    max-width: 800px;
    margin: 0 auto;
    background-color: #EDF6FF;
    box-sizing: border-box;
    padding: 2.5% 2.5% 2.5%;
  }
  .form-view__button-block {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    gap:2.5%;
    background-color: #EDF6FF;
  }
  .form-view__input {
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    padding: 1.2% 1%;
    border:1px solid rgba(0,88,168,0.2);
    border-radius: 4px;
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
  }
  .form-view__table-row {
    padding: 2.5% 0;
    border-bottom: 1px solid rgba(0,88,168,0.2);
  }
  .form-view__table-head {
    margin-bottom: 2%;
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
    font-weight: bold;
  }
  .form-view__form-text {
  font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__select {
    background: #fff url(../images/form/icn_arrow-down.svg) no-repeat center right 13px / 12px;
    width: 100%;
    box-sizing: border-box;
    padding: 1.2% 1%;
    border-radius: 4px;
    cursor: pointer;
    border:1px solid rgba(0,88,168,0.2);
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
    color: var(--sanno-color-blue);
  }
  .form-view__select option {
    font-size: 1.3rem;
    color: var(--sanno-color-blue);
  }
  .form-view__select:has(option[value=""]:checked) {
    color: #0058a8b5;
  }
  .form-view__table-caution {
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__file-label {
    display: inline-block;
    background: var(--sanno-color-blue);
    color: #fff;
    padding: 1.6875% 2.5%;
    border-radius: 4px;
    cursor: pointer;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
    transition: .2s;
  }
  .form-view__file-label:hover {
    background-color: #000;
  }
  .form-view__file-up {
    display: none;
  }
  .form-view__file-name {
    margin-left: 1em;
    font-size: 1.2rem;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__table-body:has(.form-view__file-label) {
    margin-bottom: 1.25%;
  }
  .form-view__external-link-block {
    display: flex;
    gap:8px;
  }
  .form-view__external-link-icon {
    flex-basis: 24px ;
    padding: 4px;
    box-sizing: border-box;
  }
  .form-view__external-link {
    flex:1;
  }
  .form-view__external-link a {
    color: var(--sanno-color-blue);
  }
  .form-view__table-body:has(.form-view__external-link-block) {
    margin-top: 2%;
  }
  .form-view__button-block {
    padding:0 0 3.75%;
    display: flex;
    justify-content: center;
    gap:2.5%; /* 20px/800px */
    text-align: center;
    margin-top: 3.75%;
  }
  .form-view__button {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
    padding: 1.8% 0;
    box-sizing: border-box;
    border: 1px solid var(--sanno-color-blue);
    transition: .2s;
    gap:10px;
    cursor: pointer;
    text-decoration: none !important;
  }
  .form-view__button:hover {
    color:#fff !important;
    background-color: #000;
    border:1px solid #000;
  }
  .form-view__button:hover img {
    filter: brightness(0) invert(1);
    transition: filter 0.2s;
  }
  .form-view__button--white {
    flex-basis: 20.125%;
    background-color: #fff;
    color:var(--sanno-color-blue);
  }
  .form-view__confilm .form-view__button--white {
    flex-basis: 26.5%;
  }
  .form-view__button--blue {
    flex-basis: 32.875%;
    background-color: var(--sanno-color-blue);
    color:#fff !important;
  }
  .secured-icon {
    flex-basis: 11.92625%;
  }
  .form-view__button-icon {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .form-view__confilm .form-view__button--blue {
    flex-basis: 40%;
  }
  .form-view__thanks .form-view__button--blue {
    flex-basis: 100%;
    max-width: 302px;
  }
  .form-view__thanks .form-view__button-block {
    background: none;
  }
  .form-view__confilm {
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
  }
  .form-view__table-error {
    color:var(--sanno-color-red);
    font-weight: bold;
    padding:1.2% 0 0 0;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__error {
    background-color: #e301181d;
  }
  .form-view__table-body.form-view__error {
    padding: 2%;
    border-radius: 4px;
  }
  .secured-icon {
    max-height: 55px;
  }
  .secured-icon img {
    max-height: 55px;
    width: auto !important;
  }
  .form-view__file-send-error {
    text-align: center;
    color: var(--sanno-color-red);
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
}
/*******************************************************************/
/* SP */
/*******************************************************************/
@media screen and (max-width: 768px) {
  /*=================================================================*/
  /*	form-view */
  /*=================================================================*/
  .form-view {
    padding: 10% 5% 5%;
  }
  .form-view__head {
    text-align: center;
    font-size: clamp(2rem, 2vw + 1.2rem, 3.2rem);
    letter-spacing: 0.15em;
    margin-bottom: 5%;
  }
  .form-view__first-text {
    text-align: center;
    font-size: clamp(1.4rem, 1vw + 0.8rem, 1.8rem);
    margin-bottom: 5%;
  }
  .form-view__form-block {
    margin: 0 auto;
    background-color: #EDF6FF;
    box-sizing: border-box;
    padding: 10% 5% 10%;
  }
  .form-view__input {
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    padding: 2.5% 2%;
    border:1px solid rgba(0,88,168,0.2);
    border-radius: 4px;
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
  }
  .form-view__table-row {
    padding: 5% 0;
    border-bottom: 1px solid rgba(0,88,168,0.2);
  }
  .form-view__table-head {
    margin-bottom: 3%;
    font-size: clamp(1.4rem, 0.25vw + 1.2rem, 1.6rem);
    font-weight: bold;
  }
  .form-view__form-text {
  font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__select {
    background: #fff url(../images/form/icn_arrow-down.svg) no-repeat center right 13px / 12px;
    width: 100%;
    box-sizing: border-box;
    padding: 2.5% 2%;
    border-radius: 4px;
    cursor: pointer;
    border:1px solid rgba(0,88,168,0.2);
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
  }
  .form-view__select option {
    font-size: 1.3rem;
    color: var(--sanno-color-blue);
  }
  .form-view__select:has(option[value=""]:checked) {
    color: #0058a8b5;
  }
  .form-view__table-caution {
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__file-label {
    display: inline-block;
    background: var(--sanno-color-blue);
    color: #fff;
    padding: 1.6875% 2.5%;
    border-radius: 4px;
    cursor: pointer;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
    transition: .2s;
  }
  .form-view__file-label:hover {
    background-color: #000;
  }
  .form-view__file-up {
    display: none;
  }
  .form-view__file-name {
    margin-left: 1em;
    font-size: 1.2rem;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__table-body:has(.form-view__file-label) {
    margin-bottom: 1.25%;
  }
  .form-view__external-link-block {
    display: flex;
    gap:8px;
  }
  .form-view__external-link-icon {
    flex-basis: 24px ;
    padding: 4px;
    box-sizing: border-box;
  }
  .form-view__external-link {
    flex:1;
  }
  .form-view__table-body:has(.form-view__external-link-block) {
    margin-top: 2%;
  }
  .form-view__button-block {
    text-align: center;
    background-color: #EDF6FF;
    padding:0 5% 15%;
    margin-top: 3.75%;
  }
  .form-view__button {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
    padding: 4.5% 0;
    box-sizing: border-box;
    border: 1px solid var(--sanno-color-blue);
    transition: .2s;
    gap:10px;
    text-decoration: none !important;
    width: 100%;
  }
  .form-view__button:hover img {
    filter: brightness(0) invert(1);
    transition: filter 0.2s;
  }
  .form-view__button--white {
    flex-basis: 20.125%;
    background-color: #fff;
    color:var(--sanno-color-blue);
    margin-bottom: 5%;
  }
  .form-view__button--blue {
    flex-basis: 32.875%;
    background-color: var(--sanno-color-blue);
    color:#fff !important;
  }
  .secured-icon {
    flex-basis: 11.92625%;
  }
  .form-view__button-icon {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .form-view__external-link a {
    color: var(--sanno-color-blue);
  }
  .form-view__br--pc {
    display: none;
  }
  .form-view__thanks .form-view__button-block {
    background: none;
  }
  .form-view__confilm {
    font-size: clamp(1.2rem, 0.25vw + 1.2rem, 1.6rem);
  }
  .form-view__table-error {
    color:var(--sanno-color-red);
    font-weight: bold;
    padding:1.2% 0 0 0;
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
  .form-view__error {
    background-color: #e301181d;
  }
  .form-view__table-body.form-view__error {
    padding: 2%;
    border-radius: 4px;
  }
  .secured-icon {
    max-height: 55px;
    margin-top: 20px;
  }
  .secured-icon img {
    max-height: 55px;
    width: auto !important;
  }
  .form-view__file-send-error {
    text-align: center;
    color: var(--sanno-color-red);
    font-size: clamp(1.1rem, 0.1875vw + 1.1rem, 1.4rem);
  }
}