@charset "utf-8";

.err{
	font-weight:bold;
	color:red;
}
#mf1{
	padding:80px 0;
	position: relative;
}

p.dl{
    position: absolute;
    top: 0px;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 2em;
}

#mf1 .clist{
justify-content: space-around;
}
#mf1 .cbox{
width: 550px;
}

#cbox1 h2{
font-size: 1.5em;
font-weight: bold;
text-align: center;
margin: 0 0 20px 0;
}
#cbox1 p{
text-align: center;
margin: 0 0 20px 0;
}
#cbox1 dl{
position: relative;
}
#cbox1 dl:before{
content: "";
max-width: 200px;
max-height: 230px;
width: 26.67vw;
height: 30.67vw;
background: url("../img/document/i2.png") center center /cover no-repeat;
position: absolute;
top: -40px;
right: 0;
}
#cbox1 dl dt{
display: table;
font-size: 1.25em;
font-weight: bold;
padding: 20px;
margin: 0 0 20px 0;
line-height: 1em;
position: relative;
}
#cbox1 dl dt:before,
#cbox1 dl dt:after{
content: "";
display: block;
height: 1.5em;
position: absolute;
left: 0;
right: 0;
}
#cbox1 dl dt:before{
border: #FB3B7A solid;
border-width: 4px 4px 0 0;
top: 0;
left: 0.5em;
}
#cbox1 dl dt:after{
border: #F59C00 solid;
border-width: 0 0 4px 4px;
bottom: 0;
right: 0.5em;
}

#cfbox1{
display: none;
}

#cbox2{
background: #E5E5E5;
border-radius: 15px;
}
#cbox2 .cbox-inner{
padding: 30px;
}
#cbox2 dl{
margin: 0 0 20px 0;
}
#cbox2 dt{
margin: 0 0 5px 0;
display: flex;
align-items: center;
}
#cbox2 dt span{
color: #fff;
background: #F49C00;
padding: 5px;
border-radius: 5px;
margin: 0 0 0 1em;
line-height: 1em;
}
#cbox2 #sbtn p{
display: block;
margin: 20px auto;
position: relative;
}
#cbox2 #sbtn input{
display: block;
width: 100%;
background: rgb(17,185,226);
background: linear-gradient(90deg, rgba(17,185,226,1) 0%, rgba(81,150,230,1) 100%);
padding: 20px;
color: #fff;
font-weight: bold;
text-align: center;
border-radius: 100px;
cursor: pointer;
}

#form input[type="text"],
#form input[type="tel"],
#form input[type="email"],
#form textarea{
background: #fff;
width: 100%;
padding: 10px;
}
#form input[type="radio"],
#form input[type="checkbox"]{
display: none;
}
#form label{
display: inline-flex;
align-items: center;
margin: 0 0.5em 0.5em 0;
position: relative;
}
#form label:before{
content: "";
display: block;
width: 1.5em;
height: 1.5em;
background: #fff;
border: #fff solid 5px;
margin: 0 0.5em 0 0;
box-sizing: border-box;
}
#form  input:checked + label:after{
content: "";
width: 1em;
height: 0.5em;
border: #FB3B7A solid;
border-width: 0 0 5px 5px;
position: absolute;
top: 50%;
transform: translate(0,-50%) rotate(-45deg);
}

#form .option label:before{
border-radius: 100%;
}
#form .option input:checked + label:before{
background: #FB3B7A;
}
#form .option input:checked + label:after{
display: none;
}
#done{
text-align: center;
}





@media screen and (max-width: 1024px) {
#mf1{
	padding:15vw 5vw;
}

p.dl{
font-size: 1em;
}

#mf1 .clist{
justify-content: center;
}
#mf1 .cbox{
width: auto;
margin: 0 0 10vw 0;
}

#cbox1 h2{
margin: 0 0 3vw 0;
}
#cbox1 p{
margin: 0 0 3vw 0;
}

#cbox1 dl:before{
top: -5vw;
}
#cbox1 dl dt{
padding: 2vw;
margin: 0 0 3vw 0;
}

#cbox1 dl dt:before{
border-width: 0.63vw 0.63vw 0 0;
}
#cbox1 dl dt:after{
border-width: 0 0 0.63vw 0.63vw;
}

#cbox2 .cbox-inner{
padding: 3vw;
}
#cbox2 dl{
margin: 0 0 2vw 0;
}
#cbox2 dt{
margin: 0 0 0.78vw 0;
}
#cbox2 dt span{
padding: 0.78vw;
}
#cbox2 #sbtn p{
margin: 3vw auto;
}
#cbox2 #sbtn input{
padding: 3vw;
}

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

#form label:before{
border: #fff solid 1vw;
}




}