@charset "UTF-8";

.FV-mock{
	background: #f4f4f4;
	padding: 2rem 0;
}

.FV-text-img{
display: flex;
justify-content: space-between;
align-items: center;
}
.FV-text{
	width: 75%;
}
.FV-text h1{
	width: 95%;
	margin-left: -2.5rem;
}
.FV-text p{
	padding:0  1rem 0  0;
	font-weight:500;
}
.fv_img{
	text-align: right;
}
.keyword{

}
.keyword p{
	display: inline-block;
    padding: 0.5rem 1rem;
    margin: 1rem 1.5rem 0 0;
    background: #00b90024;
    color: #00b900;
}
#sec-01,#sec-05{
	padding:5rem 0;
}
h2{
	font-weight: 700;
	font-size: 40px;
}
h2 hr{
	width: 50px;
    border: 4px solid #00b900;
}
.sec01-flex{
	display: flex;
	justify-content: space-evenly;
	padding-top: 8%;
}
.sec-list{
	width: 50%;
	padding-top: 1rem;
}
.sec-list p{
	font-size: 24px;
	font-weight: 500;
}
.sec-list p span{
	display: block;
	padding-left: 1.9rem;
	font-size: 16px;
	font-weight: 400;
}
.sec01-img img{
	padding: 0 1rem;
	width: 90%;
}

.sec02-bg{
	background: #e1f2ff;
	padding: 5rem 0;
}
#sec-02 .sec02-contents{
	display: flex;
	justify-content: space-between;
	padding-top: 8%
}
.sec02-contents .contents_box{
	width: 32%;
	background: #fff;
	padding: 1.5rem 1.5rem 2rem;
	border-radius: 10px;
	position: relative;
}
.sec02-contents .contents_box img{
	max-width:153px ;
	margin: 0 auto;
	display: block;
	padding: 1rem;
}
.sec02-contents h3{
	font-size: 23px;
	font-weight: 700;
	text-align: center;
}
.sec02-No{
	position: absolute;
    font-size: 52px;
    font-family: "Karla";
    color: #00b900;
    top: -38px;
    font-weight: bold;
}
.contents_box small{
	display: block;
	font-size: 12px;
	padding-top: 1rem;
}
#sec-03{
	padding: 5rem 0 1rem;
}
#sec-03 .container-fluid{
background: rgb(255,255,255);
background: linear-gradient(270deg, rgba(255,255,255,1) 48%, rgba(244,244,244,1) 55%);
}
#sec-03 .sec03-contents{
	display: flex;
	justify-content: space-between;
    align-items: center;
}
#sec-03 .sec03-contents .contents_box{
	background: #f4f4f4;
    padding: 3rem 3rem 3rem 0;
    border-radius: 0px 25px 25px 0px;
    margin-right: 2.5rem;
}
#sec-03 .sec03-contents .contents_box h3{
	font-size: 30px;
	font-weight: 700;
	margin-bottom: 1.5rem;
}

#sec-03-2{
	padding: 1rem 0 5rem;
}
#sec-03-2 .container-fluid{
background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(255,255,255,1) 48%, rgba(244,244,244,1) 55%);
}
#sec-03-2 .sec03-contents{
	display: flex;
	justify-content: space-between;
    align-items: center;
}
#sec-03-2 .sec03-contents .contents_box{
	background: #f4f4f4;
    padding: 3rem 0rem 3rem 3rem;
    border-radius: 25px 0px 0px 25px;
    margin-left: 2.5rem;
}
#sec-03-2 .sec03-contents .contents_box h3{
	font-size: 30px;
	font-weight: 700;
	margin-bottom: 1.5rem;
}
#sec-03 .pc_view img,#sec-03-2 .pc_view img{
	width: 250px;
}

.sec04-bg{
	background: #e1f2ff;
	padding: 5rem 0;
}
.contents_step{
	display: flex;
    justify-content: center;
    align-items: baseline;
    margin: 3rem 0 0;

}
.contents_step-box{
	display: flex;
    padding: 2rem 2rem 2rem 2rem;
    background: #fff;
    border-radius: 0 15px 15px 0px;
    border-left: 8px solid #00b900;
}
.step-icon img{
	width: 160px;
}
.sec04-contents h3{
	font-weight: 700;
}
p.step-No{
	font-size: 72px;
    font-family: "Karla";
    color: #00b900;
    font-weight: bold;
    line-height: .85;;
    text-align: center;
    margin-right: 2rem;
    width: 100px;
}
p.step-No span{
	font-size: 40%;
	display: block;
}
.contents_step-in{
	font-weight: 500;
	max-width: 600px;
	padding-right: 1rem;
}
.contents_step-in a{
	text-decoration: underline;
	color: #3f71eb;
}

#sec-05 .price{
	display: flex;
	justify-content:space-around;
	align-items: stretch;
	margin-top: 5rem;
	margin-bottom: 2rem;
}
.contents_winutprice,.contents_officialprice{
	width: 35%;
	text-align: center;
}
#sec-05 .price p{
	font-size: 24px;
	font-weight: 500;

}
.initial_cost span{
	font-size: 60px;
	display: block;
	font-weight: 700;
	line-height: 1;
	padding-bottom: 0.5rem;
}
.price p b{
	font-weight: 700;
}
p.initial_cost{
	padding: 1rem;
    background: #00b900;
    border-radius: 10px;
    color: #fff;
    margin-bottom: 0.5rem;
}
p.monthly{
	padding: 1rem;
    background: #00b900;
    border-radius: 10px;
    color: #fff;
}
.contents_officialprice{
	background: #b5b5b5;
    border-radius: 10px;
    justify-content: center;
    background: #b5b5b5;
    border-radius: 10px;
    display: flex;
    align-items: center;
}
p.line_cost{
	padding: 1rem;
    background: #b5b5b5;
    border-radius: 10px;
    color: #fff;
}
.contents_plus{
	display: flex;
	align-items: center;
}
#sec-05 small{
	padding-left: 3rem;
	padding-top: .5rem;
	display: block;
}

#cta p{
	display: block;
	color: #fff;
	margin: 0 auto;
	font-weight: 500;
	font-size: 28px;
	text-align: center;
}
#cta p a{
	display: inline-block;
    background: #0068b7;
    padding: 2rem 10rem;
    border-radius: 100px;
    box-shadow: 0px 4px 6px #adb5bd;
}
#sec-06{
	background: #f4f4f4;
    border-radius: 120px 120px 0px 0px;
    padding: 5rem 3rem;
    margin-top: 5rem;
}
.contents_fap{
	padding: 3rem;
}
.contents_fap h5 button{
	display: flex;
	justify-content: space-between;
    align-items: center;
    padding: 0;
}
.contents_fap h5 button p{
	font-size: 26px;
	font-weight: 700;
	color: #000;
	text-align: left;
}
.card{
	background-color: #fff0;
	border: none;
	margin-bottom: 1.5rem;
}
.contents_fap h5{
	border-bottom: 1px solid #00b900;
}
.card-header{
	background-color:#fff0;
	padding: 0;
}
.btn-link:hover{
	text-decoration: none;
}
.btn-link p:hover {
    color: #00b900;
}
.contents_fap .btn-link:focus {
    text-decoration: none;
}

/****ここからレスポンシブcss*****/
@media screen and (max-width:1200px){
	.FV-text h1{
	width: 95%;
	margin-left: -1.8rem;
}
}
@media screen and (max-width:970px){
	.FV-text{
		padding-left: 1.5rem;
	}
	.sec-list p{
	font-size: 19px;
	font-weight: 700;
	margin-bottom: 2rem!important;
}
}
@media screen and (max-width: 768px){
.FV-text-img{
display: block;
	}
.FV-text h1{
	width: 100%;
	margin: 0 0 0.5rem;
	padding-right: 1.5rem;
}
.FV-text{
	width: 100%;
	padding: 0;
}
.FV-text p.lead-text{
	padding-left: 2.5rem;
}
.keyword{
	padding-left: 2.5rem;
	padding-top: 1rem;
}
.FV-text .keyword p{
	font-size: 14px;
	margin: 5px 5px 0px 0;
	padding: 0.2rem 1rem;
}
.sec01-flex{
	display: block;
}
.sec-list{
	width: 100%;
	padding-top: 1rem;
}
.sec01-img img{
	width: 50%;
	padding-bottom: 2rem;
}
h2{
	font-size: 30px;
}
#sec-02 .sec02-contents{
	display: block;
}
.sec02-contents .contents_box {
    width: 100%;
    margin: 40px 0 20px;
}
#sec-03 img.sp_view{
	width: 70%;
	margin: 0 auto;
	padding-top: 2rem;
}
#sec-03 .sec03-contents .contents_box{
	padding: 2rem 2rem 2rem 1rem;
}
#sec-03-2 img.sp_view{
	width: 70%;
	margin: 0 auto;
	padding-top: 2rem;
}
#sec-03-2 .sec03-contents .contents_box{
	padding: 2rem 1rem 2rem 2rem;
}
.sec02-bg{
	padding-bottom: 3rem;
}
p.step-No{
	padding-bottom: .5rem;
}
#sec-05 .price{
	display: block;
}

.contents_winutprice,.contents_officialprice{
	width: 100%;
}
.contents_plus{
	width: 70px;
    padding: 1rem;
    margin: 0 auto;
}
#sec-05 small{
	padding-left: 0rem;
}
#cta p a{
	display: block;
	padding: 1rem 2rem;
}
#sec-06 {
    background: #f4f4f4;
    border-radius: 80px 80px 0px 0px;
    padding: 5rem 3rem;
    margin-top: 3rem;
}
.contents_fap{
	padding: 2rem 0;
}

}
@media screen and (max-width: 640px){
#sec-03 .sec03-contents .contents_box h3,#sec-03-2 .sec03-contents .contents_box h3 {
    font-size: 24px;
}
.FV-text p.lead-text {
    padding-left: 1rem;
}
.keyword {
    padding-left: 1rem;
}
.fv_img {
    margin: 1rem auto 0;
    width: 70%;
}
.contents_step{
	display: block;
	}
	.contents_step-box{
	display: block;
}
.step-icon{
	text-align: center;
	padding-top: 1rem;
}
#sec-06 {
    padding: 4rem 1.5rem;
}
.contents_fap h5 button p {
    font-size: 18px;
}
#cta p{
	font-size: 24px;
}
}
@media screen and (max-width: 330px){
}