@charset "utf-8";

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
 共通設定スタイル
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

.form1 {
 padding: 20px calc(40 / 750 * 100vw);
}

.submit {
 padding: 0 calc(40 / 750 * 100vw);
}


.form1 label {
 font-size: 13px;
 display: flex;
 justify-content: center;
 align-items: center;
 cursor: pointer;
}

.form2 {
 padding: 20px 0;
}

/*リセット */
.form1 input[type="checkbox"] {
 margin: 0;
 padding: 0;
 background: none;
 border: none;
 border-radius: 0;
 outline: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
}

/* チェックボックスデザイン */
.form1 input[type="checkbox"] {
 cursor: pointer;
 padding-left: 30px;
 vertical-align: middle;
 position: relative;
}

.form1 input[type="checkbox"]::before,
.form1 input[type="checkbox"]::after {
 content: "";
 display: block;
 position: absolute;
}

.form1 input[type="checkbox"]::before {
 background-color: #e2e2e2;
 border-radius: 0%;
 border: 1px solid #666464;
 width: 20px;
 height: 20px;
 transform: translateY(-50%);
 top: 50%;
 left: 5px;
 border-radius: 5px;
}

.form1 input[type="checkbox"]::after {
 border-bottom: 4px solid #e60011;
 border-left: 4px solid #e60011;
 opacity: 0;
 height: 12px;
 width: 18px;
 transform: rotate(-45deg);
 top: -10px;
 left: 5px;
}

.form1 input[type="checkbox"]:checked::after {
 opacity: 1;
}


p.kome {
 margin-left: 1.2em;
 text-indent: -1.2em;
 margin-top: 1em;
 margin-bottom: 1em;
 line-height: 1.6;
 font-feature-settings: "palt";
}

p.kome a,
.innerWrap a {
 color: var(--active-color);
 text-decoration: underline;
}

.innerWrap ul li {
 font-size: var(--primary-font-size);
 line-height: 1.5;
}

.mb30 {
 margin-bottom: 30px;
}


span.star {
 margin-left: 0.2em;
 color: #c1272d;
 font-size: 0.8em;
 vertical-align: super;
}

.red {
 color: #c1272d;
}

.wsWrap dl {
 display: flex;
 justify-content: flex-start;
 width: 100%;
 border-top: 1px solid #cecece;
 border-right: 1px solid #cecece;
}

.wsSpace dl {
 margin-bottom: 0.3rem;
 border-bottom: 1px solid #cecece;
}

.wsWrap dl:last-child {
 border-bottom: 1px solid #cecece;
}

.wsWrap p {
 padding: 0;
 font-feature-settings: "palt";
 color: #6d6d6d;
 line-height: 1.5;
 font-weight: 300;
}

.wsWrap p.ex2 {
 font-size: 13px;
}

.wsWrap dl dt {
 width: 25%;
 text-align: center;
 font-size: 12px;
 font-weight: 300;
 line-height: 1.5;
 background-color: #eef7ff;
 border-left: 1px solid #cecece;
 padding: 0.5em;
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 font-feature-settings: "palt";
}

.wsWrap dl dt.s {
 font-size: 11px;
}

.wsWrap dl dd {
 display: flex;
 flex-direction: column;
 justify-content: center;

 width: 75%;
 text-align: left;
 font-size: var(--primary-font-size);
 font-weight: 300;
 line-height: 1.5;
 border-left: 1px solid #cecece;
 padding: 0.5em;
 background-color: #f4f5f9;
}

.wsWrap input,
.wsWrap textarea {
 padding: 5px 10px;
 border: 1px solid rgb(205, 205, 205);
 font-size: 16px;
 font-weight: 400;
 background-color: #fff;
 border-radius: 5px;
}

.wsWrap dl dd input.l {
 width: 100%;
}

.wsWrap dl dd input.m {
 width: 98%;
}



form p.error {
 margin: 0.2em 0 0;
 color: #c1272d;
 font-size: 0.8em;
}

form p.all-error {
 margin-top: var(--main-mt);
 text-align: center;
}

form .input-wrap+p.error,
form .all-error,
.success .all-error {
 display: none;
}

.validation .all-error {
 display: block;
}

.validation form .invalid+p.error {
 display: block;
}



.form3 {
 padding: 10px 0 20px;
}

.form3 dl dt span.nini,
.form3 dl dt span.req {
 text-align: center;
 font-size: var(--primary-font-size);
 font-weight: 300;
 font-size: 11px;
 color: #fff;
 background-color: #799ac9;
 padding: 0.1em 0.8em;
 border-radius: 10px;
 margin-top: 0.4em;
}

.form3 dl dt span.req {
 background-color: #bc0044;
}


/* ! ウィンドウ表示 */
.inputForm01 .formWrap02,
.inputForm02 .formWrap01 {
 display: none;
}

.validation .formWrap01,
.success .formWrap01 {
 display: block;
}



.validation .formWrap01 #code01,
.success .formWrap01 #code01 {
 display: none;
}

.validation .formWrap02,
.success .formWrap02 {
 margin-top: 10px;
}

.form3 .wsWrap dl dd .input-wrap {
 display: flex;
 justify-content: space-between;
 align-items: center;
 flex-direction: row;
}

.form3 .wsWrap dl dd label {
 width: 49%;
 font-weight: 300;
}

.form3 .wsWrap dl dd.row label {
 font-size: 13px;
 display: flex;
 justify-content: center;
 align-items: center;
 cursor: pointer;
 width: 100%;
}

.form3 .wsWrap dl dd.row label div.select-wrap {
 flex-grow: 1;
}

.form3 .wsWrap dl dd.row label:not(:first-child) {
 width: calc(4 / 6 * 100%);
 margin-left: 0.5em;
}

.form3 .wsWrap dl dd.row label select {
 margin-right: 0.2em;
 border-radius: 5px;
 background-color: #fff;
 appearance: none;
 padding: 5px 20px 5px 10px;
 border: 1px solid rgb(205, 205, 205);
 font-size: 16px;
 font-weight: 400;
 text-align: center;
}

.form3 .wsWrap dl dd.row label:first-child select {
 padding: 5px 25px 5px 10px;

}


.form3 .wsWrap dl dd.row div.select-wrap {
 position: relative;
}

.form3 .wsWrap dl dd.row div.select-wrap::after {
 pointer-events: none;
 /*矢印部分をクリックを可能にする*/
 position: absolute;
 color: #777777;
 top: 50%;
 right: 12px;
 transform: translateY(-50%);
 /*▼を上に移動*/
 content: "▼";
 font-size: 8px;
}

.form3 .wsWrap dl dd.tel-row input {
 width: 30%;
}

input::placeholder {
 color: #cfcfcf;
}


.form4 {
 padding: 10px 0 20px;
}

.form4 dl dd {
 color: black;
 font-weight: 400;
}

/* 登録手続き（mail送信） */
/* バリデーション */
/* NGなら赤くする */
form input:not[type="checkbox"]:focus:valid {
 border: tomato 2px solid;
}

.validation form.form2 input:invalid+.error {
 display: block;
}

/* 操作中、入力値が正しい場合は、不正エラーを消す form.form2 input:valid+.error,*/
form.form2 input:invalid+.error {
 display: none;
}

form p.errormessage {
 margin: 0.2em 0 0;
 color: #c1272d;
 font-size: 0.8em;
 display: none;
}

.validation form p.errormessage {
 display: block;
}

/* safari mail対応 */
_::-webkit-full-page-media, _:future, :root .card-info{
    position: relative;
}

_::-webkit-full-page-media, _:future, :root .card-info-number{
 padding:0 0 0.4em !important;
}