@charset "utf-8";
/* CSS Document */
/*********** 基本設定 ***********/
html{
	height:100%;
}
body{
	height:100%;
	width:100%;
	font-size:100%;
	line-height:1;
	color:#333;
	font-family: "Zen Maru Gothic", sans-serif;
	font-style: normal;
	font-weight: 700;
	/*Light 300,Regular 400,Medium 500,Bold 700,Black 900*/
}
input,
textarea{
	font-family: "Zen Maru Gothic", sans-serif;
	font-style: normal;
	font-weight: 700;
}

*{
	outline:none;
}
a{
	/*\*/
	overflow:hidden;
	/**/
}

/*iphoneボタン調整*/
input[type="submit"],
input[type="button"] {
	-webkit-appearance: none;
	-webkit-appearance: none;
}

.clear{
	clear:both;
}
.clearfix{
	zoom:100%;
}
.clearfix:after{
	content:"";
	clear:both;
	height:0;
	display:block;
	visibility:hidden;
}


.ta_c{
	text-align:center;
}
.ta_r{
	text-align:right;
}
.ta_l{
	text-align:left;
}


.normal{
	font-weight:normal;
}
.bold{
	font-weight:bold;
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;
}

/*********** 透過設定 ***********/
.opac,
.bright{
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
.opac:hover{
  opacity: 0.9;
  filter: alpha(opacity=90);
}
.bright:hover{
	filter: brightness(80%);
}


/*********** box設定 ***********/
#wrap{
	min-height: 100vh;
    display: flex;
    flex-direction: column;
    max-width: 100vw;
    overflow: hidden;
}
#contents{
	padding-top:120px;
}
.wrap1{
	padding:100px 20px;
	max-width:1072px;
	margin:0 auto;
}
.wrap2{
	padding:60px 20px;
	max-width:1072px;
	margin:0 auto;
}
.bc_beige{
	background-color:#F4ECE5; 
}
.bc_green{
	background-color:#A9D046; 
}


/*********** TEXT設定 ***********/
#page_ttl {
    text-align: center;
    padding: 70px 20px;
    background: url(/img/form_bg.webp) center center / cover no-repeat;
    font-size:clamp(28px,5vw,40px);
    font-weight: 900;
    color:#59ba53;
    line-height: 0.8;
	position: relative;
}
#page_ttl span {
    font-size:clamp(16px,2.5vw,20px);
}

.ttl1{
	color:#59BA53;
	font-size:clamp(28px,4.5vw,45px);
	line-height:1.2;
	text-align: center;
	margin-bottom:56px;
}
.ttl1 span{
	display: inline-block;
	border-bottom:6px solid #59BA53;
	padding-bottom:0.4em;
}

.slash{
	text-align: center;	
	color:#59BA53;
	font-size:clamp(20px,3vw,30px);
	margin-bottom:0.5em;
}
.slash span{
	display:flex;
	justify-content: center;
	align-items: center;
	gap:0.5em;
}
.slash span:before,
.slash span:after{
	content:'';
	display: inline-block;
	width:0.13em;
	height:1.5em;
	background: #59BA53;
	border-radius: 10px;
	transform: rotate(-25deg);
	position: relative;
	top:0.15em;
}
.slash span:after{
	transform: rotate(25deg);
}

.text1{
	line-height:1.5;
}

.cl_green{
	color: #59BA53;
}

.a1{
	color:#59BA53;
}
.a1:hover{
	color:#A9D046;
}



/*********** パンクズ設定 ***********/
#pankuzu {
    display: flex;
    padding: 20px 20px 0;
    list-style: none;
    font-size: 14px;
    color: #999;
}
#pankuzu a {
    color: #59ba53;
    margin-right: 5px;
    text-decoration: none;
}
#pankuzu a:hover {
    color:#A9D046;
}
#pankuzu i {
    margin-right: 5px;
}
.visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}



/*********** FORM設定 ***********/
#form_wrap{
	border-radius: 20px;
	background: #F4ECE5;
	padding:60px;
}
#form_table{
	table-layout: fixed;
	width:100%;
	line-height:1.2;
	margin-bottom:40px;
}
#form_table th{
	text-align: left;
	padding:1em;
	vertical-align: middle;
	width:250px;
}
#form_table td{
	padding:1em 1em 1em 0;
	vertical-align: middle;
}
.req{
	display: inline-block;
	background: #d33333;
	color:#fff;
	font-size:90%;
	margin-left:1em;
	padding:0 5px 2px;
}
.input1,
textarea{
	border:1px solid #fff;
	border-radius: 10px;
	padding:1em;
	box-sizing: border-box;
	width:100%;
}
.input1:focus,
textarea:focus{
	border:1px solid #A9D046;
}
textarea{
	min-width:100%;
	min-height:100px;
}
input[type="radio"] {
	display: none;
}
.radio_label {
	display: inline-block;
	cursor: pointer;
	padding-left: 30px;
	position: relative;
	font-size: 16px;
	user-select: none;
	margin-bottom:10px;
}
p:last-of-type .radio_label{
	margin-bottom:0;	
}
.radio_label::before {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	height: 20px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: #fff;
	box-sizing: border-box;
}
input[type="radio"]:checked + .radio_label::after {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	height: 20px;
	border: 5px solid #fff;
	border-radius: 50%;
	background:#A9D046;
	box-sizing: border-box;
}

.form_btn_wrap{
	display: flex;
	justify-content: center;
	gap:10px;
	position: relative;
}
.form_btn{
    display: inline-block;
    background: #fff;
    color: #59BA53;
    padding: 1em;
    box-sizing: border-box;
    font-size: clamp(16px, 4vw, 20px);
    text-decoration: none;
    max-width: 356px;
    border-radius: 100px;
    width: calc(50% - 5px);
    text-align: center;
    border: 3px solid #59BA53;
	cursor: pointer;
    -webkit-transition: 0.1s ease-in-out;
    -moz-transition: 0.1s ease-in-out;
    -o-transition: 0.1s ease-in-out;
    transition: 0.1s ease-in-out;
}
.form_btn:hover{
	background: #59BA53;
	color:#fff;
}
.error_wrap{
	padding:60px 0;
	text-align: center;
}
.error_messe{
	color:#d33333;
	line-height:1.5;
}

.dl1{
	border-bottom:2px dotted #fff;
	margin-bottom:1em;
}
.dl1 dt{
	color:#59BA53;
}
.dl1 dd{
	padding:0.5em 0;
}


/*********** 悩み設定 ***********/
#nayami_ul{
	list-style: none;
	display: flex;
	gap:15px;
	justify-content: center;
}
#nayami_ul li{
	background: #fff;
	flex:1;
	padding:10px 25px 25px;
	border-radius:10px;
	color:#59BA53;
}
.nayami_img{
	max-width:253px;
	margin:0 auto 20px;
}
.nayami_ttl{
	text-align: center;
	font-size: 24px;
	margin-bottom:1em;
	line-height: 1.2;
}
.nayami_text{
	line-height: 1.5;
}
.arrow-down {
  height: 0;
  border-left: 50vw solid transparent;
  border-right: 50vw solid transparent;
  border-top: 100px solid #F4ECE5;
}


/*********** 特徴設定 ***********/
#feature_ul{
	list-style: none;
	display: flex;
	gap:15px;
	justify-content: center;
}
#feature_ul li{
	flex:1;
}
.feature_img{
	max-width:266px;
	margin:0 auto;
}
.feature_dl{
	background:#A9D046;
	border-radius: 10px;
	color:#fff;
	padding:25px;
}
.feature_dl dt{
	text-align: center;
	font-size: 24px;
	margin-bottom:1em;
	line-height: 1.2;
}
.feature_dl dd{
	line-height: 1.5;
}

.cap_slider{
	margin-bottom:100px;
}
.cap_slider .slick-slide {
  margin: 0 20px; /* ← 左右のマージン10px */
}
.cap_slider .slick-list {
  margin: 0 -20px; /* ← 上のmargin分を相殺して全体の幅を保つ */
}
.cap_fgr{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap:1em;
}
.cap_fgr img{
	box-shadow: 3px 4px 7px -2px rgba(10,10,10,0.1);
	border-radius: 10px;
}
.cap_prev,
.cap_next {
	font-size: 26px;
	background: #A9D046;
	width:60px;
	height:60px;
	line-height: 60px;
	text-align: center;
	color:#fff;
	border-radius: 100px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	cursor: pointer;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
.cap_prev:hover,
.cap_next:hover {
	background: #59BA53;
}
.cap_prev{
	left:calc(27.5% - 50px);
}
.cap_next{
	right:calc(27.5% - 50px);
}



/*********** 機能設定 ***********/
#kinou_ul{
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap:30px;
	max-width: 548px;
	padding:60px 0 60px;
	margin:0 auto;
	justify-content: center;
}
#kinou_ul li{
	flex: 0 0 calc((100% - 60px) / 3);
	box-sizing: border-box;
	text-align: center;
	color:#59BA53;
	font-size: 18px;
}
.kinou_fgr img{
	margin-bottom:8px;
}



/*********** プラン設定 ***********/
#plan_wrap{
	display: flex;
	gap:15px;
	padding:60px 0;
}
.plan_dl{
	border:1px solid #E6C337;
	border-radius: 20px;
	flex:1;
	overflow: hidden;
}
.plan_dl:nth-of-type(2){
	border:1px solid #A9D046;	
}
.plan_dl:nth-of-type(3){
	border:1px solid #59BA53;	
}
.plan_dl dt{
	background:#E6C337;
	color:#fff;
	line-height:1.2;
	padding:30px 20px;
	text-align: center;
}
.plan_dl:nth-of-type(2) dt{
	background:#A9D046;
}
.plan_dl:nth-of-type(3) dt{
	background:#59BA53;
}
.plan_name{
	font-size:clamp(20px,2vw,24px);
	margin-bottom:0.5em;
}
.plan_info{
	font-size:clamp(17px,1.3vw,20px);
	margin-bottom:0.2em;	
}
.plan_ul{
	padding:30px 1em;
	list-style: none;
	line-height:1.2;
}
.plan_ul li{
	margin-bottom: 1em;
}
.plan_ul li:last-of-type{
	margin-bottom: 0;
}
.plan_ul li:before{
	content:'\f00c';
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	color:#59BA53;
	margin-right:5px;
}
.plan_ul .old:before{
	color:#8d8d8d;
}

#plan_btn_wrap{
	text-align: center;
	position: relative;
}
#plan_btn_wrap .slash{
	font-size: 20px;
	position: relative;
}
.plan_btn{
	display:inline-block;
	position: relative;
}
.plan_btn:before{
	content:'';
	display: block;
	width:136px;
	height:250px;
	background: url(/img/plan.webp) 0 0/contain no-repeat;
	position: absolute;
	left:-136px;
	top:-50px;
}



/*********** 有効な場面設定 ***********/
#scean_fgr{
	background: #fff;
	padding:60px 20px;
	text-align: center;
	border-radius:20px;
	margin-bottom:60px;
}



/*********** FAQ設定 ***********/
.ac_dl{
	background: #F4ECE5;
	margin-bottom:20px;
	line-height: 1.5;
	position: relative;
	border-radius: 10px;
}
.ac_dl:last-of-type{
	margin-bottom:0;
}
.ac_title{
	cursor: pointer;
	padding:20px 50px 20px 50px;
	border-radius: 10px;	
}
.ac_title:before {
    content: 'Q';
    position: absolute;
	top:10px;
    left: 20px;
	color:#59BA53;
	font-size:28px;
}
.ac_title:after {
    content: '\f078';
    font-family: 'Font Awesome 6 Free';
    position: absolute;
    font-weight: 900;
    right: 20px;
	color:#59BA53;
}
.ac_title.active:after {
    content: '\f077';
}
.ac_child{
	display: none;
	padding:0 20px 20px;
}
.faq_a{
	padding:20px 20px 20px 50px;
	background: #fff;
	position: relative;
}
.faq_a:before {
    content: 'A';
    position: absolute;
	top:10px;
    left: 20px;
	color:#59BA53;
	font-size:28px;
}
.faq_a_ttl{
	font-size: 110%;
	color:#59BA53;
	margin-bottom:5px;
}




/*********** ボタン設定 ***********/
.btn1_wrap{
	display: flex;
	gap:20px;
	justify-content: center;
}
.btn1,
.btn2{
	display: inline-block;
	background: #fff;
	color:#59BA53;
	padding:1.3em;
	box-sizing: border-box;
	font-size:clamp(16px,4vw,26px);
	text-decoration: none;
	max-width:356px;
	border-radius: 100px;
	width:calc(50% - 10px);
	text-align: center;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
.btn1:hover{
	background:#59ba53;
	color:#fff;
}
.btn2{
	border:3px solid #59BA53;
	width:356px;
}
.btn2:hover{
	background:#59BA53;
	color:#fff;
}


/*********** header設定 ***********/
header{
	display: flex;
	height:120px;
	justify-content: space-between;
	align-items: center;
	padding:0 20px;
	background: #fff;
	position: fixed;
	top:0;
	left:0;
	z-index: 10000;
	width:100%;
	box-sizing: border-box;
}
#h_logo{
	max-width:254px;
	width:24%;
}
#h_nav_ul{
	display: flex;
	gap:10px;
	align-items: center;
	font-size:clamp(10px,1.6vw,18px);
}
#h_nav_ul a{
	color:#59BA53;
	text-decoration: none;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
	margin-right:10px;
}
#h_nav_ul a:hover{
	color:#A9D046;
}
#h_nav_ul .h_nav_btn{
	display:block;
	background:#59BA53;
	color:#fff;
	padding:1em 1.5em;
	border-radius: 100px;
	margin-right:0;
}
#h_nav_ul .h_nav_btn:hover{
	background:#A9D046;
	color:#fff;
}



/*********** MV設定 ***********/
#mv{
	background: linear-gradient(to bottom,  #ffffff 0%,#edffd8 100%);
}
.mv_text{
	font-family: "Zen Kaku Gothic Antique", sans-serif;
	font-weight: 900;
	font-style: normal;
	color:#59BA53;
	font-size:clamp(24px,6.6vw,92px);
	padding:0 20px 20px;
	text-align: center;
	position: relative;
}
.mv_text_s{
	font-size:65%;
}
.mv_text_ss{
	font-size:50%;
	position: absolute;
	top:100%;
	left:calc(50% - 7em);
}
#mv_flex{
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding:0 10px;
}
.mv_btn_wrap{
	padding:10px 0 15px;
	display: flex;
	gap:10px;
	justify-content: center;
}
.mv_btn{
	display: block;
	background: #fff;
	color:#59BA53;
	border:3px solid #59BA53;
	padding:1em 1.5em;
	text-decoration: none;
	width:calc(34% - 5px);
	font-size:clamp(16px,2vw,23px);
	text-align: center;
	border-radius: 100px;
	position: relative;
}
.mv_btn:after{
	content:"\f35a";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;  /* solid用 */
	color: #a9d046;
	position:absolute;
	right:0.5em;
}
#badge{
	background: #59BA53;
	display: flex;
	justify-content: center;
	padding:10px;
	gap:3%;
}
#badge img{
	max-width:198px;
	width:calc(94% / 3);
}



/*********** footer設定 ***********/
footer{
    margin-top: auto;
	background:#A9D046;
}
#f_wrap{
	padding:40px 20px;
	max-width:1112px;
	margin:0 auto;	
}
#f_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom:30px;
}
#f_logo{
	max-width: 276px;
}
#f_btn_ul{
	display: flex;
	justify-content: flex-end;
	gap:10px;
	list-style: none;
}
.f_btn{
	font-size:clamp(16px,3vw,20px);
	display:block;
	background:#fff;
	color:#59BA53;
	padding:1em 1.5em;
	border-radius: 100px;
	margin-right:0;
	text-decoration: none;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
.f_btn:hover{
	background:#59BA53;
	color:#fff;
}
#f_nav{
	display: flex;
	gap:60px;
}
.f_nav_ul li{
	list-style: none;
	line-height: 1.2;
	margin-bottom:0.5em;
}
.f_nav_ul a{
	text-decoration: none;
	color:#fff;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
.f_nav_ul a:hover{
	color:#59BA53;
}
.f_nav_ul a:before{
	content:'\f105';
	font-family: "Font Awesome 6 Free";
	font-weight: 900;  /* solid用 */
	margin-right:5px;
}
#copy{
	text-align: center;
	padding:2em 20px;
	color:#fff;
}
#page_top{
	position: fixed;
	right:0;
	bottom:50px;
}
#page_top a{
	display: block;
	width:50px;
	height:50px;
	line-height: 50px;
	border-radius:25px 0 0 25px;
	background:#59BA53;
	color:#fff;
	text-align: center;
	font-size:20px;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	-o-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}
#page_top a:hover{
	padding-right:10px;
}


/*********** アニメーション設定 ***********/
.fadein {
    opacity: 0;
    transform: translate(0,0);
    transition: all 1.5s;
}
.fadein.fadein-left{
    transform: translate(-30px,0);
}
.fadein.fadein-right{
    transform: translate(30px,0);
}
.fadein.fadein-up{
    transform: translate(0,-30px);
}
.fadein.fadein-bottom{
    transform: translate(0,30px);
}
.fadein.scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}


/*********** 余白設定 ***********/
.mb40{
	margin-bottom: 40px;
}
.mb60{
	margin-bottom: 60px;
}

















