@charset "utf-8";

body{
font-size: 1.25rem;
line-height: 2em;
}
figure{margin: 0}
a{transition: 0.2s;}
a:hover{opacity: 0.5;}


#mainvis .mf-frame{
max-width: 1830px;
width: 95%;
margin: 0 0 0 auto;
height: 410px;
display: flex;
align-items: center;
background: #43DFB1;
background: linear-gradient(90deg, rgba(67, 223, 177, 0.3) 0%, rgba(255, 167, 15, 0.3) 100%);
}
#mainvis .mf-inner{
padding: 0 0 0 30px;
}
#mainvis p{
display: table;
background: #000;
color: #fff;
padding: 0 5px ;
}
#mainvis h1{
font-size: 2.4em;
font-weight: bold;
}

#mf1{
margin: 100px 0;
}
#mf1 .mf-frame{
width: 100%;
max-width: 1200px;
margin: 0 auto;
background: #F0FCF9;
}
#mf1 .mf-inner{
padding: 90px 100px;
}

#mf1 .his{
display: inline-block;
font-size: 0.8em;
font-weight: bold;
background: #1DB687;
color: #fff;
padding: 5px;
margin: 0 0.3em 0 0;
line-height: 1em;
}
#mf1 .nin{
display: inline-block;
font-size: 0.8em;
font-weight: bold;
background: #CECECE;
padding: 5px;
margin: 0 0.3em 0 0;
line-height: 1em;
}

#step{
margin: 0 0 30px 0;
}
#step ul{
margin: 0 0 60px 0;
display: flex;
justify-content: space-between;
position: relative;
z-index: 0;
}
#step ul:before{
content: "";
width: 100%;
height: 2px;
background: #1DB687;
position: absolute;
top: 50%;
left: 0;
transform: translate(0,-50%);
z-index: -1;
}
#step ul li{
max-width: 300px;
width: 30%;
text-align: center;
font-size: 1.2em;
font-weight: bold;
background: #fff;
border-radius: 10px;
line-height: 1.3em;
padding: 10px;
}
#step ul li.now{
background: #000;
color: #fff;
}
#step ul li span{
font-size: 0.83em;
font-weight: normal;
}
#step p{
font-weight: bold;
}

#entry p{
color: #777;
}
.wpcf7{
margin: 100px 0 0 0 ;
}
#entry dl{
display: flex;
margin: 0 0 40px 0;
}
#entry dl dt{
width: 300px;
flex-shrink: 0;
padding: 0.3em 0;
}
#entry dl dd{
display: flex;
flex-wrap: wrap;
align-items: center;
}


input[type="text"],
input[type="tel"],
input[type="email"],
input[type="date"],
textarea{
width: 100%;
background: #fff;
border: #ccc solid 1px;
padding: 0.3em 0.5em;
border-radius: 10px;
}
::placeholder {
  color: #999;  /* グレーに統一 */
}
.wpcf7-list-item{margin: 0;}

select{
background: #fff;
border: #ccc solid 1px;
padding: 0.3em 0.5em;
border-radius: 10px;
}

input[type="radio"]{
display: none;
}
input[type="radio"] + .wpcf7-list-item-label{
display: flex;
align-items: center;
margin: 0 1em 0 0;
position: relative;
}
input[type="radio"] + .wpcf7-list-item-label:before,
input[type="radio"]:checked + .wpcf7-list-item-label:after{
content: "";
display: inline-block;
border-radius: 100%;
width: 26px;
height: 26px;
background: #fff;
border: #ccc solid 1px;
flex-shrink: 0;
}
input[type="radio"] + .wpcf7-list-item-label:before{
margin: 0 0.3em 0  0;
}
input[type="radio"]:checked + .wpcf7-list-item-label:after{
border: none;
background: #1DB687;
transform: translate(-50%,-50%) scale(0.6);
position: absolute;
top: 50%;
left: 13px;
}

input[type="checkbox"]{
display: none;
}
input[type="checkbox"] + .wpcf7-list-item-label{
font-weight: bold;
display: flex;
align-items: center;
margin: 0;
cursor: pointer;
position: relative;
}
input[type="checkbox"] + .wpcf7-list-item-label:before{
content: "";
display: inline-block;
border-radius: 5px;
width: 30px;
height: 30px;
background: #fff;
border: #ccc solid 1px;
margin: 0 0.5em 0 0 ;
flex-shrink: 0;
}
input[type="checkbox"]:checked + .wpcf7-list-item-label:after{
content: "";
width: 30px;
height: 30px;
background: url("../images/ic02.png")center center /cover no-repeat;
position: absolute;
top: 50%;
left: 0;
transform: translate(0,-50%);
}

#agree{
text-align: center;
}
#agree .wpcf7-form-control-wrap{
display: table;
margin: 0 auto;
}
#agree a{
color: #1DB687;
text-decoration: underline;
}
#agree a[target="_blank"]:after{
content: "";
display: inline-block;
width: 14px;
height: 13px;
background: url("../images/ic01.png") center center /cover no-repeat;
}
input[type="button"],
input[type="submit"]{
width: 100%;
padding: 30px;
text-align: center;
background: #1DB687;
color: #fff;
border-radius: 10px;
}
input[type="submit"]:disabled{
opacity: 0.5;
}
.sbtn{
width: 80vw;
max-width: 480px;
margin: 50px auto;
position: relative;
font-weight: bold;
cursor: pointer;
}
.sbtn:before{
content: "→";
color: #fff;
position: absolute;
right: 30px;
top: 50%;
transform: translate(0,-50%);
}

.sbtn .wpcf7-spinner{
display: none;
}


.wpcf7 + p{
text-align: center;
}
.wpcf7 + p a{
color: #1DB687;
text-decoration: underline;
}



#thanks{
text-align: center;
}




@media screen and (max-width: 1024px) {

#mainvis .mf-frame{
height: 180px;
}
#mainvis .mf-inner{
padding: 0 0 0 5vw;
}
#mainvis h1{
font-size: 1.5em;
}

#mf1 .mf-inner{
padding: 5vw;
}


#step{
margin: 0 0 5vw 0;
}
#step ul{
margin: 0 0 5vw 0;
}
#step ul li{
font-size: 1em;
padding: 2vw 1vw;
}

.wpcf7{
margin: 7vw 0 0 0 ;
}
#entry dl{
display: block;
margin: 0 0 5vw 0;
}
#entry dl dt{
width: auto;
font-weight: bold;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="date"],
textarea{
padding: 2vw;
}

select{
padding: 2vw;
}



input[type="radio"] + .wpcf7-list-item-label:before,
input[type="radio"]:checked + .wpcf7-list-item-label:after{
width: 26px;
height: 26px;
}

input[type="checkbox"] + .wpcf7-list-item-label:before{
width: 30px;
height: 30px;
}
input[type="checkbox"]:checked + .wpcf7-list-item-label:after{
width: 30px;
height: 30px;
}

#agree a[target="_blank"]:after{
width: 14px;
height: 13px;
}
input[type="button"],
input[type="submit"]{
padding: 3vw;
}
.sbtn{
margin: 5vw auto;
}
.sbtn:before{
right: 3vw;
}

}

@media screen and (max-width: 750px) {
body{
font-size: 1rem;
}
input[type="date"],
select{
min-width: 7em;
}

#thanks br{
display: none;
}



}