@charset "UTF-8";


/* ===================================
共通項目
 =================================== */
/* .Form-Item__items {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
} */

/* ===================================

 =================================== */
.audition .pageBody {
    margin-top: 0;
    /* padding-top: 94px; */
}
.auditionEntry {
    padding-top: 94px;
    padding-bottom: 56px;
    background: #F6F6F6;
    position: relative;
}
.auditionEntry::before {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 100%;
    left: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 1440 / 215;
    background: url(../../img/audition__bg_circle.png) no-repeat center center / cover;
}

 .auditionEntry__description {
    line-height: 2;
}
.auditionEntry__form {
    margin-top: 80px;
}

.auditionEntry .Form-Item {
    padding-right: 0 !important;
}

/* オーディションフォームの必須項目スタイル */
.auditionEntry .Form-Item-Label-Required {
    background: #EF7F27;
}

/* フォーカス時のスタイル */
.auditionEntry input[type="text"]:focus,
.auditionEntry input[type="tel"]:focus,
.auditionEntry input[type="email"]:focus,
.auditionEntry input[type="url"]:focus,
.auditionEntry textarea:focus {
    outline: 1px solid #333333;
    border: none;
    background: #fff;
    box-shadow: 0px 0px 10px rgba(239, 127, 39, 0.5);
}

/* ===================================
性別
=================================== */


/* ===================================
住所のスタイル
 =================================== */
.address-items {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.Form-Item.--address .zip-code,
.Form-Item.--address .address1 {
    max-width: 200px;
}
/* 郵便番号 */
.zip-code {
    position: relative;
    /* padding-left: 41px; */
    margin-left: 41px;
}
.zip-code::before {
    content: "\03012";
    position: absolute;
    top: 50%;
    left: -42px;
    transform: translateY(-50%);
    font-size: 20px;
}
/* address1 都道府県 */
.Form-Item .address-items.--address .address1 select {
    width: 200px;
    max-width: 100%;
}

/* address2 */
.Form-Item.--address .address2 input {
    max-width: 100%;
}


/* ===================================
生年月日
 =================================== */
.birthday-items {
    width: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}
.birthday-item {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 15px;
}
.birthday-item .wpcf7-form-control-wrap {
    display: block;
}

/* 「年」のセレクトスタイル */
.birthday-item.year select,
.birthday-item.year .select-wrap input {
    width: 150px;
    max-width: 100%;
}
/* 「月」のセレクトスタイル */
.birthday-item.month select,
.birthday-item.month .select-wrap input {
    width: 100px;
    max-width: 100%;
}
/* 「日」のセレクトスタイル */
.birthday-item.day select,
.birthday-item.day .select-wrap input {
    width: 100px;
    max-width: 100%;
}

/* ===================================
血液型
 =================================== */
.Form-Item.--blood-type .wpcf7-form-control-wrap input {
    max-width: 150px;
}


/* ===================================
体組成
=================================== */
.Form-Item .--bodyComposition  {

}
.bodyComposition-items {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px 50px;
    /* display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 50px; */
}
.bodyComposition-item {
    /* max-width: 267px; */
    max-width: 280px;
    display: grid;
    /* grid-template-columns: 1fr auto auto; */
    /* grid-template-columns: minmax(62px, 1fr) auto auto; */
        grid-template-columns: minmax(80px, 1fr) auto auto;
    align-items: center;
    gap: 0;
    /* gap: 15px; */
}
.bodyComposition-item .wpcf7-form-control-wrap {
    width: min(150px, 100%);
    max-width: 100%;
    margin-inline: 15px;
}
.bodyComposition-item .title,
.bodyComposition-item .unit {
    display: inline-block;
    width: fit-content;
    flex-shrink: 0;
    font-size: 20px;
}
.bodyComposition-item .title {
    /* flex-shrink: 0; */
    /* white-space: nowrap; */
}

/* ===================================
職業
=================================== */
.Form-Item.--job select {
    width: 200px;
}

/* ===================================
最終学歴
 =================================== */
.Form-Item.--academic-background select {
    width: 200px;
}

/* ===================================
応募写真
 =================================== */
.file-items {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.file-item {
    display: flex;
    gap: 15px;
}
.file-item.--attention {
    flex-direction: column;
    gap: 0;
}
.file-item__title {
    margin-top: 10px;
}

.Form-Item.--photo .file-item__title {
    width: 70px;
}

/* ファイル添付のリアルタイム容量表示 Auditionフォーム */
.form-wrapper[data-form="audition"] .file-size-info {
    margin-top: 0;
    background-color: #fff;
}

/* ------確認画面------- */
.auditionEntry__form .confirm_area .file-item__title {
    margin-top: 0;
}

/* ===================================
趣味
 =================================== */
.Form-Item.--hobby input {
    max-width: 100%;
}


/* ===================================
特技
 =================================== */
.Form-Item.--special-skill  input {
    max-width: 100%;
}


/* ===================================
資格
=================================== */
.Form-Item.--qualification input {
    max-width: 100%;
}

/* ===================================
URL
=================================== */
.url-items {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.url-item {
    display: grid;
    grid-template-columns: 170px auto;
    gap: 28px;
    align-items: center;
}
.url-item input {
    max-width: 100%;
}

/* ===================================
他薦の場合
=================================== */
.Form-Item.--recommendation input[type="text"],
.Form-Item.--recommendation input[type="tel"] {
    max-width: 100%;
}
.recommendation-items {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.recommendation-item {
    display: grid;
    grid-template-columns: 170px auto;
    align-items: center;
}

/* 推薦者メールアドレス */
.recommendation-item.--mail {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 16px;
}
.recommendation-item__mail {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 15px;
}
.recommendation-item__mail .wpcf7-form-control-wrap {
    display: inline-block;
}

/* ===================================
セレクトボックス
=================================== */

/* .contact__select-wrap {
  position: relative;
}
.contact__select-wrap svg {
    position: absolute;
    top: calc(50% + 2px);
    translate: 0 -50%;
    right: 10.69px;
    width: 17.313px;
    height: auto;
    pointer-events: none;
  } */

