@charset "utf-8";
/*
	Last Update:2022/12/17
	Auther: iw
*/

#main_image_wrap { position:relative; text-align:center; }
#main1 { position:relative; padding:10px 0; overflow:hidden; }
#main1 > div { display:inline-block; white-space:nowrap; position:absolute; left:0; top:50%; padding-top:5px; transform:translateX(0) translateY(-50%); }
#main1 img { max-width:inherit; }
#main2 { position:relative; }
#main2:before { content:""; background:#F26F00; position:absolute; bottom:0; left:0; width:100%; height:30vw; max-height:180px; }
#main2.fv2{background: url(../image/top/fv2_bg.jpg) top center no-repeat; background-size: cover;}
#main2.fv2:before { background: #22904A;}
#main2 > * { position:relative; }
	@media (max-width: 575px){
		#main1 { padding:5px; }
	}
	@media (min-width: 576px){
		#main2 { padding:30px 0 0; }
	}
	@media (max-width: 767px){
		#main1 { height:calc(9vw + 20px); }
		#main1 img { width:90vw; }
		#main1 .l1 { padding-left:5vw; padding-right:105vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:105vw; padding-right:5vw; }
		#main1 .l1 { animation:loop1 1 linear 16s both; }
		#main1 .l2 { animation:loop1 infinite linear 16s both; }
		#main1 .l3 { animation:loop1 infinite linear 16s 8s both; }
	}
	@media (min-width: 768px) and (max-width: 991px){
		#main1 { height:calc(7vw + 20px); }
		#main1 img { width:80vw; }
		#main1 .l1 { padding-left:10vw; padding-right:110vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:110vw; padding-right:10vw; }
		#main1 .l1 { animation:loop1 1 linear 16s both; }
		#main1 .l2 { animation:loop1 infinite linear 16s both; }
		#main1 .l3 { animation:loop1 infinite linear 16s 8s both; }
	}
	@media (min-width: 992px) and (max-width:1199px){
		#main1 { height:calc(6vw + 20px); }
		#main1 img { width:70vw; }
		#main1 .l1 { padding-left:15vw; padding-right:115vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:115vw; padding-right:15vw; }
		#main1 .l1 { animation:loop1 1 linear 18s both; }
		#main1 .l2 { animation:loop1 infinite linear 18s both; }
		#main1 .l3 { animation:loop1 infinite linear 18s 9s both; }
	}
	@media (min-width:1200px) and (max-width:1399px){
		#main1 { height:calc(5.5vw + 20px); }
		#main1 img { width:60vw; }
		#main1 .l1 { padding-left:20vw; padding-right:120vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:120vw; padding-right:20vw; }
		#main1 .l1 { animation:loop1 1 linear 18s both; }
		#main1 .l2 { animation:loop1 infinite linear 18s both; }
		#main1 .l3 { animation:loop1 infinite linear 18s 9s both; }
	}
	@media (min-width:1400px) and (max-width:1699px){
		#main1 { height:calc(5.5vw + 20px); }
		#main1 img { width:50vw; }
		#main1 .l1 { padding-left:25vw; padding-right:125vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:125vw; padding-right:25vw; }
		#main1 .l1 { animation:loop1 1 linear 18s both; }
		#main1 .l2 { animation:loop1 infinite linear 18s both; }
		#main1 .l3 { animation:loop1 infinite linear 18s 9s both; }
	}
	@media (min-width:1700px) and (max-width:1999px){
		#main1 { height:calc(4vw + 20px); }
		#main1 img { width:44vw; }
		#main1 .l1 { padding-left:28vw; padding-right:128vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:128vw; padding-right:28vw; }
		#main1 .l1 { animation:loop1 1 linear 20s both; }
		#main1 .l2 { animation:loop1 infinite linear 20s both; }
		#main1 .l3 { animation:loop1 infinite linear 20s 10s both; }
	}
	@media (min-width:2000px){
		#main1 { height:calc(3vw + 20px); }
		#main1 img { width:36vw; }
		#main1 .l1 { padding-left:32vw; padding-right:132vw; }
		#main1 .l2,
		#main1 .l3 { padding-left:132vw; padding-right:32vw; }
		#main1 .l1 { animation:loop1 1 linear 20s both; }
		#main1 .l2 { animation:loop1 infinite linear 20s both; }
		#main1 .l3 { animation:loop1 infinite linear 20s 10s both; }
	}

@keyframes loop1 { from { transform:translateX(0) translateY(-50%); } to { transform:translateX(-100%) translateY(-50%); } }


.card_unit { background:#fff; border-radius:9px; margin-bottom:20px; }
.card_unit .image { text-align:center; }
.card_unit .text { font-weight:bold; }
	@media (max-width: 575px){
		.card_unit .text { padding:15px; }
	}
	@media (min-width: 576px){
		.card_unit .text { padding:25px; }
		.card_unit .text { font-size:1.25em; }
	}

	#nayami { background:#f2fff8; }

	#about{ 
		background:#22904a;
	}
	
	#about:before { 
		content:""; 
		position:absolute; 
		top:-1px;
		left:0; 
		width:100%; 
		height:100.111%;
		background:#FFF7DB;
	}
		@media (max-width: 575px){
			#about { padding-bottom:100px; }
			#about:before { clip-path: polygon(0 0, 100% 0%, 100% calc(100% - 100px), 50% 100%, 0 calc(100% - 100px)); }
		}
		@media (min-width: 576px){
			#about { padding-bottom:200px; }
			#about:before { clip-path: polygon(0 0, 100% 0%, 100% calc(100% - 200px), 50% 100%, 0 calc(100% - 200px)); }
		}
	.voice_area .toggle_hidden{ display: none; }
	.voice_area .toggle_click { margin-top:40px; }
	.voice_area .toggle_click .button { background:#fff; max-width:100%; border:1px solid #22904A; border-radius:40px; font-size:1.25em; padding:20px; }
	.voice_area .toggle_click .button > span { width:100%; background:url(../image/layout/arrow1-dg.png) no-repeat right center / 15px auto; }
	.voice_area.active .toggle_click .button > span { background:url(../image/layout/arrow1-ug.png) no-repeat right center / 15px auto; }
	.voice_unit .title { position:relative; color:#fff; margin-bottom:30px; }
	.voice_unit .title .user { position:absolute; bottom:0; }
	.voice_detail { position:relative; }
	.voice_detail .detail_title { font-size:1.25em; }
	.voice_detail .user { position:absolute; left:20px; top:0; }
	.voice_detail .text { border:1px solid #22904A; background:#fff; padding:30px; }
		@media (max-width: 575px){
			.toggle_hidden .voice_unit { margin-top:50px; }
			.voice_unit .title { padding:15px 70px 15px 15px; }
			.voice_unit .title h3 { font-size:1.15em; }
			.voice_unit .title .user { width:61px; right:10px; }
			.voice_area .toggle_click .button { width:264px; }
			.voice_detail .detail_title { padding:20px 0 20px 120px; }
		}
		@media (min-width: 576px){
			.toggle_hidden .voice_unit { margin-top:120px; }
			.voice_unit .title { padding:20px 180px 20px 20px; }
			.voice_unit .title h3 { font-size:1.75em; }
			.voice_unit .title .user { right:20px; }
			.voice_area .toggle_click .button { width:712px; }
			.voice_detail .detail_title { padding:20px 0 20px 140px; }
		}
		@media (min-width: 576px) and (max-width: 767px){
			.voice_unit .title .user { width:100px; }
		}
		@media (max-width: 767px){
			.voice_unit .voice_detail { margin-top:30px; }
		}
		@media (min-width: 768px){
			.voice_unit .contents { padding-top:30px; }
		}
	
	.needs_contents ul { list-style: none;margin-left:0; }
	.needs_contents li { margin-bottom:20px; background:url(../image/layout/check-cg.png) no-repeat left 8px / 30px auto; padding:0 0 0 45px; }
	.needs_contents li strong { font-size:1.25em; }
		@media (max-width: 991px){
			.needs_contents { font-size:1.15em; padding-bottom:40vw; background:url(../image/top/needs_back.png) no-repeat right bottom / 70vw auto; }
		}
		@media (min-width: 992px){
			.needs_contents { font-size:1.25em; background:url(../image/top/needs_back.png) no-repeat calc(100% - 20px) center / 400px auto; padding-bottom:80px; }
		}
	
	#about h2:before { content:""; position:absolute; background:url(../image/top/about1.png) no-repeat center center / contain; z-index:2; }
		@media (max-width: 767px){
			#about h2 { padding-left:110px; text-align:left; }
			#about h2:before { width:87px; height:146px; top:-15px; left:10px; }
		}
		@media (min-width: 768px) and (max-width: 991px){
			#about h2:before { width:115px; height:255px; top:-55px; left:30px; }
		
		}
		@media (min-width: 992px){
			#about h2:before { width:153px; height:255px; top:-55px; left:70px; }
		}
	
	
	.flow_box { position:relative; margin-top:50px; }
	.flow_box .flow_title { color:#fff; font-weight:bold; text-align:center; position:absolute; top:-35px; left:0; width:100%; border-radius:40px; line-height:150%; min-height:70px; z-index:2; }
	.flow_box .flow_title .number { position:absolute; }
	.flow_box .text_wrap { background:#22904A; padding:2px; }
	.flow_box .text { background:#fff; }
		@media (max-width: 767px){
			.flow_box .flow_title { font-size:1.4em; padding:5px 0 5px 20px; }
			.flow_box .flow_title .number { left:15px; font-size:1.5em; }
			.flow_box._flow2 .flow_title { line-height:60px; }
			.flow_box .text { padding:50px 20px 40px; }
			.flow_box._flow3 .text { padding:50px 20px 20px; }
			.flow_box:not(._flow3) .text_wrap { clip-path:polygon(100% 0, 100% calc(100% - 15px), calc(50% + 15px) calc(100% - 15px), 50% 100%, calc(50% - 15px) calc(100% - 15px), 0 calc(100% - 15px), 0 0); }
			.flow_box:not(._flow3) .text { clip-path:polygon(100% 0, 100% calc(100% - 15px), calc(50% + 15px) calc(100% - 15px), 50% 100%, calc(50% - 15px) calc(100% - 15px), 0 calc(100% - 15px), 0 0); }
		}
		@media (min-width: 768px){
			.flow_box .flow_title { padding:10px 0 10px 20px; }
			.flow_box .text { padding:50px 30px 20px; min-height:155px; }
			.flow_box._flow2 .flow_title { line-height:50px; }
			.flow_box._flow1 { width:360px; }
			.flow_box._flow2 { width:360px; }
			.flow_box._flow3 { width:340px; }
			.flow_box:not(._flow3) { margin-right:10px; }
			.flow_box:not(._flow3) .flow_title { width:calc(100% - 15px); }
			.flow_box:not(._flow3) .text_wrap { clip-path:polygon(calc(100% - 15px) 0, calc(100% - 15px) calc(50% - 15px), 100% 50%, calc(100% - 15px) calc(50% + 15px), calc(100% - 15px) 100%, 0 100%, 0 0); }
			.flow_box:not(._flow3) .text { clip-path:polygon(calc(100% - 15px) 0, calc(100% - 15px) calc(50% - 15px), 100% 50%, calc(100% - 15px) calc(50% + 15px), calc(100% - 15px) 100%, 0 100%, 0 0); }
		}
		@media (min-width: 768px) and (max-width: 991px){
			.flow_box .flow_title .number { left:15px; }
		}
		@media (min-width: 992px){
			.flow_box .flow_title { font-size:1.15em; }
			.flow_box .flow_title .number { left:30px; }
		}
		@media (min-width: 992px) and (max-width:1199px){
			.flow_box .flow_title .number { left:15px; }
		}
	
	#faq { background:#F2F8F5; }
	.faq { position:relative; margin-bottom:20px; padding:26px 0 0; }
	.faq:before { content:"Question"; color:#FFEF34; border-radius:5px 5px 0 0; background:#22904A; line-height:100%; position:absolute; top:0; left:0; padding:5px; font-weight:bold; height:27px; }
	.faq .title { position:relative; border:2px solid #22904A; background:#fff; font-weight:bold; font-size:1.25em; color:#22904A; border-radius:0 5px 5px 5px; }
	.faq .title:before { content:""; position:absolute; background:url(../image/layout/plus-g.png) no-repeat center center / contain; }
	.faq[open] .title:before { background:url(../image/layout/minus-g.png) no-repeat center center / contain; }
	.faq .contents { font-size:1.15em; padding:20px 0 20px; color:#22904A; }
		@media (max-width: 575px){
			.faq .title { padding:15px 40px 15px 15px; }
			.faq .title:before { top:calc(50% - 7px); right:15px; width:15px; height:15px; }
		}
		@media (min-width: 576px){
			.faq .title { padding:15px 50px 15px 15px; }
			.faq .title:before { top:calc(50% - 10px); right:20px; width:20px; height:20px; }
		}
	
	#top_column .button._type3 { width:360px; }
	
	/* 追記 20230418*/
	
	/***************
	*common
	****************/
	.c-btn{
		max-width: 540px;
		width:100%;
		margin:1em auto;
	}
	
	.c-btn_link{
		display: block;
		width: 100%;
		height:100%;
		text-align: center;
		background-color: #D84242;
		padding:.5em 2em;
		border-radius: 30px;
		box-shadow: 0 4px 0 #A03232;
		position: relative;
		transition:opacity .2s;
	}
	
	.c-btn.btn_red .c-btn_link{
		background-color: #D84242;
		box-shadow: 0 4px 0 #A03232;
	}
	.c-btn.btn_green .c-btn_link{
		background-color: #167438;
		box-shadow: 0 4px 0 #06210F;
	}
	.c-btn.btn_blue .c-btn_link{
		background-color: #2361B5;
		box-shadow: 0 4px 0 #0E294D;
	}
	
	.c-btn_link:hover{
		opacity: 0.8;
	}
	
	.c-btn_link::before{
		position: absolute;
		content: "";
		top:50%;
		right:20px;
		transform: translateY(-50%);
		width:0;
		height:0;
		border-style: solid;
		border-width: 6.5px 0 6.5px 8px;
		border-color: transparent transparent transparent #fff;
	}
	
	.c-btn_txt{
		color:#fff;
		font-size: 21px;
		font-weight: bold;
	}
	
	@media screen and (max-width: 767px){
		.c-btn_txt{
			font-size: 18px;
		}
	}
	
	/***************
	*toppage
	****************/
	.p-problem_cont{
		position: relative;
		display: flex;
		justify-content: space-between;
		background-color: #fff;
		padding:2em 2em 1em;
		border-radius: 12px;
	}
	
	ul.p-problem_list{
		width: 48%;
		list-style: none;
		margin-left: 0;
	}
	
	.p-problem_item{
		list-style: none;
		font-size: 20px;
		font-weight: bold;
		padding-left: 40px;
		color: #22904A;
		position: relative;
		margin-bottom:1em;
	}
	
	.p-problem_item::before{
		position: absolute;
		top:15px;
		left:2px;
		content:"";
		width:30px;
		height:30px;
		background: url(../image/top/icon_check_green.svg) center no-repeat;
		background-size: contain;
	}
	
	@media screen and (max-width: 767px){
		.p-problem_cont{
			flex-wrap: wrap;
			padding:2em 1em 1em;
		}
		
		ul.p-problem_list{
			width: 100%;
		}
	
		.p-problem_item{
			font-size: 14px;
			padding-left: 25px;
		}
	
		.p-problem_item::before{
			top:20px;
			width: 16px;
			height:16px;
		}
	}
	
	.p-about_cont{
		position: relative;
	}
	
	.p-solution_cont{
		position: relative;
		background-color: #fff;
		padding:2em 2em 1em;
		border-radius: 12px;
	}
	
	ul.p-solution_list{
		list-style: none;
		margin-left: 0;
		width: 80%;
	}
	
	.p-solution_item{
		list-style: none;
		font-size: 25px;
		font-weight: bold;
		padding-left: 40px;
		color: #22904A;
		position: relative;
		margin-bottom: 1em;
	}
	
	.p-solution_item::before{
		position: absolute;
		top:8px;
		left:0;
		content:"";
		width:30px;
		height:30px;
		background: url(../image/top/icon_check_orange.svg) center no-repeat;
		background-size: contain;
	}
	
	.p-solution_img{
		position: absolute;
		right:2em;
		bottom:2em;
		width: 20%;
		text-align: right;
	}
	
	@media (max-width: 991px){
		ul.p-solution_list{
			width: 100%;
		}
	
		.p-solution_img{
			display: none;
		}
	}
	
	@media screen and (max-width: 767px){
		.p-solution_cont{
			flex-wrap: wrap;
			padding:2em 1em 1em;
		}
	
		.p-solution_item{
			font-size: 14px;
			padding-left: 25px;
		}
	
		.p-solution_item::before{
			top:5px;
			width: 16px;
			height:16px;
		}
	}
	
	ul.p-column_popular_list{
		display: flex;
		justify-content: space-between;
		list-style: none;
		margin:3em 0;
	}
	
	.p-column_popular_item{
		list-style: none;
		max-width: 340px;
		width:32%;
	}
	
	.p-column_popular_link{
		display: block;
		padding:1em;
		background-color: #fff;
		border-radius: 17px;
		box-shadow: 0 5px 0 #22904A;
		transition: opacity 0.2s;
	}
	
	.p-column_popular_link:hover{
		opacity: 0.8;
	}
	
	.p-column_popular_img{
		max-width:300px;
		width: 100%;
		padding-top: 66.66666666%;
		margin:0 auto .5em;
		position: relative;
		overflow: hidden;
	}
	
	.p-column_popular_img img{
		position: absolute;
		top:50%;
		left:50%;
		transform: translate(-50%, -50%);
		width:100%;
		height:100%;
		object-fit: cover;
	}
	
	.p-column_popular_ttl{
		font-size: 15px;
		font-weight: bold;
		color:#22904A;
		margin-bottom:.5em;
	}
	
	.p-column_popular_date{
		display: inline-block;
		color:#767676;
		font-size: 14px;
		padding-right:10px;
	}
	
	.editor-styles-wrapper p.p-column_popular_cat{
		display: inline-block;
		background-color: #22904A;
		border-radius: 3px;
		padding:0 .5em;
		color:#fff;
		font-size: 14px;
		margin:0;
	}
	
	@media screen and (max-width: 767px){
		ul.p-column_popular_list{
			display: block;
			margin:1em 0;
		}
		
		.p-column_popular_item{
			width: 100%;
			max-width: none;
			margin-bottom: 1em;
		}
		
		.p-column_popular_link{
			border-radius: 12px;
			box-shadow: 0 3px 0 #22904A;
		}
	
		.p-column_popular_inner{
			display: flex;
			align-items:flex-start;
		}
		
		.p-column_popular_img{
			width: 136px;
			height:90px;
			padding-top: 0;
			margin-right: 10px;
		}
	
		.p-column_popular_detail{
			width: calc(100% - 146px);
		}
		
		.p-column_popular_date{
			font-size: 12px;
			padding-right:5px;
		}
		
		.p-column_popular_cat{
			font-size: 10px;
		}
	}
	
	.p-column_popular_btn{
		margin:3em auto;
	}
	
	.p-column_popular_btn .c-btn_link{
		background-color: #22904A;
		box-shadow: 0 4px 0 #104122;
	}
	
	.p-column_popular_btn .c-btn_txt{
		font-size: 25px;
	}
	
	@media screen and (max-width: 767px){
		.p-column_popular_btn .c-btn_txt{
			font-size: 21px;
		}
	}

/* 追記 20230615 */
.p-top_nav{ 
	padding:5px 20px; 
}
.p-top_nav ul{
	display: flex;
	/* flex-wrap: wrap; */
	justify-content: center;
	align-items: center;
} 

.p-top_nav li{
	margin:.5vw;
}

.p-top_nav a {
	box-sizing: border-box;
	display: block;
	background: #fff;
	/* min-width: 13vw; */
    width: 13vw;
    border: 1px solid #22904A;
	text-align: center;
	height:3vw;
	line-height: 1.2;
	position: relative;
	border-radius: 40px;
	font-weight: bold;
	padding:0 .8vw;
	font-size: .8vw;
	color: #22904a;
}

.p-top_nav a span{
	white-space: nowrap;
	position: relative;
	display: block;
	width: 100%;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	padding:0 20px;
	background: url(../image/layout/arrow1-dg.png) no-repeat right center / .8vw auto;
}

.footer_btn_x {
	margin-bottom: 30px;
	text-decoration: underline;
	text-align: center;
}