*{
box-sizing: border-box;
overflow-wrap: break-word;
line-height: normal;
}

html{
	font-family: 'Noto Sans Japanese', sans-serif;
	font-size: 14px;
    font-weight:300;
	letter-spacing: 0.03rem;
	line-height: normal;
	color:#000000;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

img{
	max-width: 100%;
}

body{
background-color: #5fd9c2;
}

#wrap{
position: relative;
overflow: hidden;
}

.inner{
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.relative{
position: relative!important;
}
.absolute{
position: absolute!important;
}






#header{
background-color: #FFFFFF;
padding: 10px 0;
}

#header img.logo{
width: 36%;
margin-left: 5%
}
#header img.cv_head{
width: 45%;
right: 2%;
}


#mainimage img.mainmessage_sp{
left: 5%;
top:2.2%;
}

#mainimage img.main_cv{
    left: 0;
    bottom: 3%;
}

#mainunder{
background-image: url('../img/mainunder_bg.png?');
background-size: 100% auto;
background-repeat: repeat-y;
padding-top: 7vw;
text-align: center;
}

#mainunder img.mainunder_01_sp{
margin-left: auto;
margin-right: auto;
}
#mainunder img.mainunder_01_illust_01{
    right: -13%;
    top: 0%;
}
#mainunder img.mainunder_01_illust_02{
    left: -6%;
    bottom: 3%;
}


#mainunder img.mainunder_02_sp{
margin-top: 10px;
}
#mainunder img.mainunder_03{
margin-top: 20px;
}

#mainunder img.mainunder_star{
	width: 40%;
    left: 5%;
    bottom: 0.5%;
}

#system{
padding-top: 20px;
text-align: center;
}

#system .message{
background-color: #FFFFFF;
color:#000000;
font-weight: bold;
padding: 3vw 3vw;
font-size:4.1vw;
}

#system .message+.message{
margin-top: 20px;
}

#system .message em{
background-color: #5fd9c2;
font-style:normal;
padding: 0 5px;
}

#system .message.left{
text-align: left;
}

#system .message .title{
margin-bottom: 15px;
font-size:6.9vw;
}

#system .message .title span{
font-size:4.1vw;
display: block;
}

#system img.system_01{
margin:5vw 0 2vw;
}

#system img.system_voice_01{
	left: 4%;
    top: 58%;
    width: 36%;
}

#system img.system_voice_02{
	right: 4%;
	    top: 65%;
	    width: 36%;
}


#reason{
background-color: #FFFFFF;
background-image: url('../img/reason_bg_sp.png');
background-size: 100% auto;
background-repeat: no-repeat;
padding-top: 1vw;
padding-bottom: 1vw;
}

#reason .reasonBox{
margin-bottom: 1.0vw;
}

#reason .reasonBox{
}

#reason .reasonBox p{
left: 30%;
top:17%;
color:#464e53;
font-size: 4.0vw;
font-weight: bold;
line-height: 7.0vw;
}

#point{
background-color: #FFFFFF;
text-align: center;
padding-top: 5vw;
}
#point .text{
width: 100%;
}

#point .text p{
	font-size: 3.2vw;
	font-weight: bold;
	color:#464e53;
}

#point .text p.title{
	font-size: 4.7vw;
	font-weight: bold;
	color:#000000;
}


#point .box01{
top:24%;
}

#point .box02{
top:38%;
}

#point .box03{
top:54%;
}


#point img.sheet_sp{
	margin-top: -7vw;
    position: relative;
	margin-left: auto;
	margin-right: auto;
}

#campaign{
	background: rgb(255,255,255);
	background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 59.5%, rgba(255,255,255,0) 59.5%, rgba(255,255,255,0) 100%);
}

#campaign img.campaign{
width: 120%;
max-width: 120%;
margin-left: -10%;
display: block;
}

#campaign img.campaign_score{
	width: 82%;
    left: 9%;
    top: 10%;
}
#campaign img.campaign_man{
	width: 90%;
	    left: 4%;
	    top: 34.6%;
}

#voice{
	background-color: #FFFFFF;
	padding-top: 8vw;
	padding-bottom: 8vw;
}

#voice p{
font-weight: bold;
font-size: 3.2vw;
width: 100%;
}

#voice p.title {
color:#FFFFFF;
text-align: center;

}
#voice p.detail {
color:#464e53;
padding-left: 10%
}
#voice p.dot{
    padding-left: 13%;
}
#voice p.dot:before{
content:"\0030fb";
margin-left: -4%;
}

#voice .voice01{
margin-bottom: 5vw;
}

#voice .voice01 p.title01{
	top: 18.5%;
    width: 100%;
}
#voice .voice01 p.title02{
	top: 40%;
	    width: 100%;
}
#voice .voice01 p.title03{
	    top: 58.6%;
    width: 100%;
}
#voice .voice01 p.detail01 {
    top: 24%;
}
#voice .voice01 p.detail02 {
    top: 46%;
}
#voice .voice01 p.detail03 {
    top: 64%;

}
#voice .voice01 p.detail04 {
    top: 70.5%;
}
#voice .voice01 p.detail05 {
    top: 80%;
}

#voice .voice02{
margin-bottom: 5vw
}

#voice .voice02 p.detail01 {
    top: 24%;
}
#voice .voice03{
margin-bottom: 5vw
}
#voice .voice03 p.detail01 {
    top: 24%;
}
#voice .voice04 p.detail01 {
    top: 24%;
}

#faq{
	background-color: #FFFFFF;
	text-align: center;
	padding-bottom: 3vw;
}


#faq .box{
text-align: left;
position: relative;
margin-bottom: 5vw;
}

#faq .box:nth-last-of-type(1){
margin-bottom: 0;
}

#faq .box .question{
position: relative;
background-image: url('../img/question_bg.png');
background-size: 100% auto;
background-repeat: no-repeat;
padding-bottom: 29.72%;
}

#faq .box .question p{
	color:#FFFFFF;
	font-weight: bold;
	font-size: 4.7vw;
	top:52%;
	transform: translate(0%,-50%);
	-webkit-transform: translate(0%,-50%);
	left: 28%;
	width: 60%;
}


#faq .box .answer{
width: 88.88888888%;
background-color: #99f0e6;
font-weight: bold;
text-align: left;
padding: 5vw;
margin: auto;
position: relative;
}

#faq .box .answer p{
font-size: 3.8vw;
color:#464e53;
}

#faq .box .answer:before{
	content: "";
    width: 3px;
    height: 105%;
    position: absolute;
    left: -3%;
    top: -2%;
    background-color: #99f0e6;
}

#faq .box .answer:after{
	content: "";
    height: 3px;
    width: 105%;
    position: absolute;
    left: -3%;
    bottom: -3%;
    background-color: #99f0e6;
}

#winwin{
	background-color: #FFFFFF;
	position: relative;
	background-image: url('../img/winwin_bg_wave.png?'),url('../img/winwin_bg_sp.png');
	background-size: 100% auto,100% auto;
    background-position: center bottom -1px,center top;
    background-repeat: no-repeat,no-repeat;
    padding-top: 6vw;
    padding-bottom: 11vw;
}

#winwin img.winwin_title{
display: block;
margin: auto;
}

#winwin p.catch{
font-weight: bold;
font-size: 3.75vw;
width: 92%;
margin:5vw auto;
}

#winwin .staff{
background-color: #f2f2f2;
padding: 5.2vw 2.77vw;
width: 92%;
margin: auto;
}
#winwin .staff p{
	font-size: 2.5vw;
}
#winwin .staff .name{
	font-weight: bold;
	font-size: 3.75vw;
	margin-bottom: 3vw;
	position: relative;
}

#winwin .staff .name:after{
	content: "";
    width: 49%;
    height: 1px;
    position: absolute;
    left: 48%;
    top: 50%;
    margin-top: -0.5px;
    background-color: #000000;
}

#cta{
background-color: #00d9c1;
padding: 5vw 0;
}

#form{
background-color: #FFFFFF;
padding: 8vw 0 10vw;
}

#footer{
background-color: #47a392;
color:#FFFFFF;
padding: 2vw 0;
text-align: center;
}

#footer a{
	color:#FFFFFF;
    font-size: 3vw;
	font-weight: bold;
	padding-left: 2vw;
	padding-right: 2vw;
	border-left: solid 1px #FFFFFF;
	border-right: solid 1px #FFFFFF;
}



#footer p.copy{
	width: 90%;
    padding: 3vw 0;
    font-size: 3.3vw;
    text-align: center;
    border-top: solid 1px #FFFFFF;
    text-align: center;
    margin:3vw auto 0;
}

#form .formWrap{
position: relative;
width: 100%;
margin:10vw auto;
padding: 0 2.77vw;
}

#form .formWrap .formBlock{
margin-bottom: 7vw;
}
#form .formWrap p.item{
font-weight: bold;
color:#464e53;
padding-bottom: 2vw;
}

#form .formWrap p.item span{
	color: #FFFFFF;
    background-color: #3072ac;
    padding: 0 2vw;
    margin-right: 2vw;
}
#form .formWrap p.item span.must{
background-color: #d9534d;
}

#form .formWrap input{
appearance:none;
padding:4vw 3vw;
border: none;
background-color: #e6e6e6;
display: block;
width: 100%;
}


#form .formWrap input[type="submit"],
#form .formWrap input[type="button"]{
color:#FFFFFF;
margin: 10vw auto 0;
background-color: #00a99d;
font-size: 1.2rem;
font-weight: bold;
padding: 3vw 0;
width: 61vw;
border-radius: 1vw;
}

.forPc{
display: none;
}


.forSp{
display: block;
}



@media screen and (max-width: 750px) {
    img.w10{
    width:10%;
    }
    img.w20{
    width:20%;
    }
    img.w30{
    width:30%;
    }
    img.w40{
    width:40%;
    }
    img.w50{
    width:50%;
    }
    img.w60{
    width:60%;
    }
    img.w70{
    width:70%;
    }
    img.w80{
    width:80%;
    }
    img.w90{
    width:90%;
    }
    img.w100{
    width:100%;
    }

}



/*for PC*/
@media screen and (min-width: 751px) {

.inner{
max-width: 1100px;
margin: auto;
}

#header img.logo{
margin-left: 0;
width: 250px;
}

#header img.cv_head{
	width: 255px;
    right: 0;
    margin-top: 10px;
}


#mainimage{
background: rgb(66,217,217);
background: linear-gradient(180deg, rgba(66,217,217,1) 0%, rgba(68,218,196,1) 100%);
position: relative;
}

#mainimage .background{
	width: 100%;
	height: 600px;
	position: relative;
	background-image: url('../img/main_bg_x.png'), url('../img/main_bg_x.png'),url('../img/main_bg_01.png'),url('../img/main_bg_02.png');
	background-size:100% auto,100% auto,auto 70%,auto 48%;
	background-position:left top,left bottom, left top ,right bottom;
	background-repeat:repeat-x,repeat-x, no-repeat,no-repeat;
}


#mainimage:before{
content:"";
display: block;
position: absolute;
left: 0;
top:20px;
height: 560px;
width: 18px;
background-image: url('../img/main_bg_y.png');
z-index: 1;
}

#mainimage:after{
content:"";
display: block;
position: absolute;
right: 0;
top:20px;
height: 560px;
width: 18px;
background-image: url('../img/main_bg_y.png');
}

#mainimage .inner{
padding-top: 80px;
}

#mainimage img.main_pc{
	margin: auto;
}

#mainimage img.main_cv{
	width: 49%;
        left: -2.7%;
    bottom: -19px;
}

#mainunder {
    background-size: 500px auto;
    background-repeat: repeat;
    padding-top: 50px;
	border-bottom:solid 6px #464e53;
}

#mainunder .inner{
padding-bottom: 275px
}

#mainunder .relative{
display: inline-block;
}

#mainunder img.mainunder_01_illust_01 {
	    left: 50%;
	    top: 10%;
	    width: 24%;
	    margin-left: 24%;
}

#mainunder img.mainunder_01_illust_02 {
	left: 50%;
    bottom: 30%;
    width: 23%;
    margin-left: -49%;
}

#mainunder img.mainunder_01_pc,
#mainunder img.mainunder_02_pc{
margin: auto;
}

#mainunder img.mainunder_02_pc{
margin-top: 20px;
}

#mainunder img.mainunder_03_pc{
	left: 50%;
    margin-left: -275px;
    bottom: -175px;
}

#mainunder img.mainunder_star{
	width: 20%;
    left: 50%;
    bottom: -15%;
    margin-left: -260px;
}

#system{
	padding-top: 200px;
}
#system .message{
	width: 940px;
    margin-left: auto;
    margin-right: auto;
    font-size: 24px;
    padding: 30px 210px;
	max-width: 100%
}
#system .message .title{
font-size: 40px;
}

#system .message .title span{
font-size: 21px;
}
#system .message em{
padding: 0;
}

#system img.system_01{
width: 760px;
margin:60px auto;
display: block;
}


#system img.system_voice_01{
	left: 50%;
    top: 57%;
    width: 278px;
    margin-left: -361px;
}

#system img.system_voice_02{
	right: 50%;
    top: 64%;
    width: 278px;
    margin-right: -355px;
}


#system img.system_02{
width: 695px;
margin:30px auto 0;
display: block;
}


#reason{
background-image: url('../img/reason_bg_pc.png');
background-size: 1070px auto;
background-position: center top;
background-repeat: no-repeat;
padding-top: 0;
padding-bottom: 1vw;
}

#reason img.reason_01{
display: block;
margin: auto;
width: 590px;
}

#reason .reasonBox{
display: block;
width: 940px;
margin:10px auto 20px;
max-width: 100%;
}

#reason .reasonBox p{
	font-size: 19px;
	line-height: normal;
	transform: translate(0%,-50%);
	-webkit-transform: translate(0%,-50%);
	top: 50%;
	    left: 19%;
}

#point{
	padding-top: 50px;
}
#point img.point_bg{
width: 540px;
margin: auto;
}
#point .text p {
    font-size:19px;
    font-weight: bold;
    color: #464e53;
}

#point .text p.title {
    font-size: 27px;
    font-weight: bold;
    color: #000000;
}

#point img.sheet_pc{
	margin-top: -40px;
    position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 950px;
}

#campaign{
padding-top: 20px;
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 60.5%, rgba(255,255,255,0) 60.5%, rgba(255,255,255,0) 100%);
}

#campaign img.campaign{
	width: 540px;
	margin:0 auto;
}

#campaign img.campaign_score{
	width: 367px;
    left: 50%;
    margin-left: -185px;
    top: 79px;
}
#campaign img.campaign_man{
	width: 415px;
    left: 50%;
    margin-left: -213px;
    top: 274px;
}

#voice{
padding: 70px 0;
}

#voice .inner:after{
content:"";
display: block;
width: 100%;
height: 0;
clear: both;
}


#voice p{
font-size: 16px;
}

#voice .voice01{
margin-bottom: 20px;
}


#voice .voice01 p.title01{
	top: 26%;
    width: 30%;
    left: 2%;
}
#voice .voice01 p.title02{
	top: 26%;
    width: 36.5%;
    left: 32%;
}
#voice .voice01 p.title03{
	top: 26%;
    width: 30%;
    left: 68%;
}

#voice p.detail{
padding-left: 0;
}

#voice .voice01 p.dot{
border-bottom:dotted 1px #464e53;
padding-bottom: 10px;
}

#voice .voice01 p.detail01 {
	top: 56%;
    width: 30%;
    left: 4%;
}
#voice .voice01 p.detail02 {
	top: 56%;
    width: 30%;
    left: 36%;
}
#voice .voice01 p.detail03 {
	top: 56%;
    width: 28%;
    left: 70%;

}
#voice .voice01 p.detail04 {
    top: 64.5%;
	left: 70%;
	width: 28%;
}
#voice .voice01 p.detail05 {
    top: 73%;
	left: 70%;
	width: 28%;
}

#voice .voice02{
margin-bottom: 5vw
}

#voice .voice02 p.detail01 {
    top: 24%;
}
#voice .voice03{
margin-bottom: 5vw
}
#voice .voice03 p.detail01 {
    top: 24%;
}
#voice .voice04 p.detail01 {
    top: 24%;
}

#voice .voice02,
#voice .voice03,
#voice .voice04{
width: 31.8%;
float: left;
margin-bottom: 0;
}


#voice .voice02,
#voice .voice03{
margin-right:2.3%;
}

#voice .voice02 p.detail01,
#voice .voice03 p.detail01,
#voice .voice04 p.detail01{
top: 51%;
width: 90%;
margin-left: 5%;
}

#faq {
padding-bottom: 0px;
}

#faq img.faq_title{
display: block;
width: 360px;
margin: auto;
}


#faq .boxwrap{
	display: flex;
    flex-wrap: wrap;
}

#faq .boxwrap .box{
    width: 31.8%;
    margin-right: 2.3%;
margin-bottom: 35px;
}

#faq .boxwrap .box:nth-last-of-type(3n){
	margin-right: 0;

}
#faq .box .question p{
font-size: 18px;
line-height: 20px;
}

#faq .box .answer{
padding: 20px 25px;
}

#faq .box .answer p{
font-size: 15px;
}

#winwin{
	background-image: url('../img/winwin_bg_wave.png?'),url('../img/winwin_bg_pc.png');
	background-size: 630px auto,940px auto;
    background-position: center bottom -1px ,center top;
    background-repeat: repeat-x,no-repeat;
	padding-top: 60px;
    padding-bottom: 70px;
}

#winwin .inner:after{
clear:both;
content:"";
display: block;
height: 0;
width: 100%
}

#winwin .pcLeft{
width: 38.1%;
float: left;
margin-right: 1.9%;
}

#winwin img.winwin_title{
width: 80%;
}

#winwin .staff{
	width: 60%;
    float: left;
    padding: 25px 20px;
    margin-top: 35px;
}

#winwin p.catch{
margin-top: 20px
}

#winwin p.catch{
font-size: 16px;
width: 100%;
margin:20px 0 0;
}

#winwin .staff p {
    font-size:12px;
}

#winwin .staff p.name{
font-size: 16px;
margin-bottom: 20px;
}

#winwin .staff .name:after{
	content: "";
	    width: 65%;
	    left: 33%;
	    background-color: #000000;
}

#cta{
    padding: 40px 0 100px;
}

#cta img.main_cv{
	width: 41%;
    left: 0;
    bottom: -30px;
    position: absolute;
}

#form img.form_ttl{
display: block;
width:455px;
margin: auto;
}

#footer{
padding: 0;
}

#footer .inner{
max-width: 95%;
color:#FFFFFF;
padding: 0;
text-align: center;
}

#footer a{
	color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    border-left: solid 1px #FFFFFF;
    border-right: solid 1px #FFFFFF;
    padding: 10px 20px;
    display: inline-block;
}



#footer p.copy{
	width: 100%;
    padding: 10px 0;
	font-size: 16px;
    text-align: center;
    border-top: solid 1px #FFFFFF;
    text-align: center;
    margin: 0 auto;
}

	#form .formWrap{
	max-width: 680px;
	margin:20px auto;
	}

	#form .formWrap .formBlock{
	margin-bottom: 20px;
	}
	#form .formWrap p.item{
	padding-bottom: 10px;
	}

	#form .formWrap p.item span{
	    padding: 0 5px;
	    margin-right: 7px;
	}

	#form .formWrap input{
	appearance:none;
	padding:15px 10px;
	}


	#form .formWrap input[type="submit"],
    #form .formWrap input[type="button"]{
	margin: 35px auto 0;
	padding: 20px 0;
	width: 357px;
	border-radius: 5px;
	}


	#form .formWrap input[type="submit"]:hover,
    #form .formWrap input[type="button"]:hover{
	cursor: pointer;
	opacity: 0.8;
	}

	.forPc{
		display: block;
	}
	.forSp{
		display: none;
	}
}

label.error {
    color: #d9534d;
    display: block;
    margin-top: 5px;
}

.submitBlock {
    margin-top: 10vw;
}

.submitBlock input {
    margin-bottom: 15px !important;
    margin-top: 0 !important;
}

.submitBlock input:last-child {
    margin-bottom: 0 !important;
}

@media screen and (min-width: 751px) {
    .submitBlock {
        display: flex;
        justify-content: center;
        margin-top: 35px;
    }

    .submitBlock input {
        margin-right: 15px !important;
        margin-bottom: 0 !important;
    }
    
    .submitBlock input:last-child {
        margin-right: 0 !important;
    }

    .formComplete {
        font-size: 15px;
    }
}