@charset "utf-8";
/* CSS Document */

body {
	font-size: 16px;
	color: #222;
}
header {
    padding: 40px 30px;
}
img {
	vertical-align: bottom;
}
a:hover img {
	opacity: 0.8;
}
.main_image {
    max-width: 2300px;
    margin: 0 auto 100px;
}

.main_image .pcNone img {
    width: 100%;
}

h3,h4 {
	font-family: 'Zen Maru Gothic', sans-serif;
	letter-spacing: 0.1em;
	margin-bottom: 40px;
}
.webFont {
	font-family: 'Zen Maru Gothic', sans-serif;
}
.tC {
	text-align: center;
}
.mbNone {
	margin-bottom: 0 !important;
}
.s34 {
	font-size: 212.5%;
	line-height: 1.47;
}
.s28 {
	font-size: 175%;
	line-height: 1.5;
}
.s24 {
	font-size: 150%;
	line-height: 1.5;
}
.s20 {
	font-size: 125%;
	line-height: 1.5;
}
.s18 {
	font-size: 112.5%;
	line-height: 1.5;
}
.s14 {
	font-size: 87.5%;
	line-height: 1.8;
}
.txt_green {
	color: #14920f;
}
.txt_white {
	color: #fff;
}
.txt_blue {
	color: #095466;
}
.txt_lightblue {
	color: #499ce3;
}
.vertical {
	display: flex;
	flex-direction: column;
}
.head_leaf::before {
    content: url("../images/leaf.png");
    display: block;
	height: 51px;
}
.bottom_border > span {
	padding: 0 10px;
}
.bottom_border.border_green > span {
	background: linear-gradient(transparent 0,transparent 65%,#f1f1da 65%,#f1f1da 100%);
}
.bottom_border.border_blue > span {
	background: linear-gradient(transparent 0,transparent 65%,#d8edff 65%,#d8edff 100%);
}
.tablize {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.common_content {
    max-width: 1200px;
    margin: 0 auto 100px;
}
.bg_orange {
	background: url("../images/bg_orange.jpg") no-repeat center center / cover;
}
.sub_box h4 {
	background: #14920f;
	margin-bottom: 0;
	text-align: center;
	color: #fff;
	padding: 20px;
}
.sub_box.blue_box h4 {
	background: #499ce3;
}
.sub_box.orange_box h4 {
	background: #f38500;
	padding: 10px 20px;
}
.sub_box_inner {
	border: 2px solid #14920f;
	padding: 40px 50px;
	background: #fff;
}
.blue_box .sub_box_inner {
	border: 2px solid #499ce3;
}
.orange_box .sub_box_inner {
	border: 2px solid #f38500;
	padding: 20px;
}


#intro {
	padding: 0 20px;
}
#intro h3 {
	background: url("../images/intro_head_bg.png") no-repeat left bottom;
	padding: 0 150px 40px;
}

#intro .intro_list li {
	display: flex;
	align-items: center;
	padding: 10px 25px 8px;
	background: #eef8d9;
	border-radius: 10px;
}
#intro .intro_list li::before {
	content: url("../images/check.png");
	height: 33px;
	margin-right: 15px;
}
#contact h3 {
	background: url("../images/bg_stripe.jpg");
	padding: 20px;
}
#contact .common_content {
	padding: 40px 0;
}
.contact_list li {
    width: 48.74%;
    display: flex;
    align-items: center;
}
.contact_list {
	margin-bottom: 2px;
}
.contact_list li {
	background: #fff;
	border-radius: 10px;
	padding: 15px 25px;
}
.contact_list li::before {
    width: 46px;
    text-align: center;
    margin-right: 10px;	
}
.contact_list li.icon_calculator::before {
    content: url("../images/icon_calculator.png");
	height: 42px;
}
.contact_list li.icon_scissors::before {
    content: url("../images/icon_scissors.png");
	height: 46px;
}
.contact_list li.icon_leaf::before {
    content: url("../images/icon_leaf.png");
	height: 42px;
}
.contact_list li.icon_medal::before {
    content: url("../images/icon_medal.png");
	height: 44px;
}
.contact_txt {
	background: #fff;
	text-align: center;
	padding: 5px 20px;
	margin-top: 10px;
}
#service .common_content {
	background: #e9f5e9;
	padding: 40px 50px 80px;
}
.price_inner h4 {
	background: #14920f;
	padding: 10px;
}
.price_list {
	margin-top: 1px;
}
.price_list dt,
.price_list dd {
	text-align: center;
	padding: 15px;
}
.price_list dt {
    font-weight: bold;
    background: #cce68e;
    width: 42%;
}
.price_list dd {
    background: #fff;
    width: 58%;
}
.price_list > *:nth-child(n + 3) {
	margin-top: 1px;
}
.price_list + h4 {
	margin-top: 30px;
}
.price_inner .s14 {
	margin-top: 10px;
}
#beforeafter {
	margin-top: 80px;
}
#tree_type {
	margin-top: 50px;
}
#tree_type h4 {
	display: flex;
	align-items: center;
	justify-content: center;
}
#tree_type .sub_box_inner {
	padding-bottom: 55px;
	position: relative;
}
#tree_type .sub_box_inner::before,
#tree_type .sub_box_inner::after {
	content: "";
	width: 198px;
	height: 151px;
	background: url("../images/tree.png") no-repeat;
	position: absolute;
	bottom: -46px;
}
#tree_type .sub_box_inner::before {
	left: -20px;
}
#tree_type .sub_box_inner::after {
	right: -20px;
	transform: scale(-1,1);
}
#tree_type h4 span + span {
	margin-left: 20px;
}
#tree_type .sub_box_inner p + p {
	margin-top: 30px;
}
#payment {
	background: #fff;
	padding: 30px 40px 10px;
	margin-top: 80px;
}
#payment h4 {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 30px;
}
#payment h4 .s24 {
	background: #499ce3;
	border-radius: 5px;
	color: #fff;
	padding: 0 10px;
	margin: 0 5px;
}
#campaign .common_content {
	background: url("../images/campaign_bg.jpg") no-repeat center center / cover;
	padding: 40px 50px;
}
#campaign h3::before {
	content: url("../images/campaign_head.png");
	height: 93px;
	display: block;
}
#anno .txt_box {
	padding-bottom: 40px;
}
#anno .anno_list {
	background: #f3f3f3;
	border-radius: 10px;
	padding: 30px 80px;
}
.anno_list li {
	padding: 10px 0;
}
.anno_list li span {
	border-bottom: 2px solid #222;
}
#feature {
	background: url("../images/bg_blue.jpg") no-repeat center top / contain;
	padding-top: 80px;
}
#feature_head .txt_box p {
	background: #fff;
	padding: 40px;
}
.feature_box {
	background: #fff;
	border: 4px solid #d5d5d5;
	padding: 20px 220px 20px 20px;
	position: relative;
}
.feature_box::before {
	content: "";
	width: 182px;
	height: 100%;
	position: absolute;
	top:0;
	right: 0;
}
.feature_box:nth-child(1)::before {
	background: url("../images/feature_01.jpg") no-repeat center center / cover;
}
.feature_box:nth-child(2)::before {
	background: url("../images/feature_02.jpg") no-repeat center center / cover;
}
.feature_box:nth-child(3)::before {
	background: url("../images/feature_03.jpg") no-repeat center center / cover;
}
.feature_box:nth-child(4)::before {
	background: url("../images/feature_04.jpg") no-repeat center center / cover;
}
.feature_box h4 {
	margin-bottom: 30px;
}
.feature_box .txt_lightblue {
	display: flex;
	align-items: center;
	line-height: 1;
	margin-bottom: 5px;
}
.feature_box .txt_lightblue::before {
	border-right: 2px solid #499ce3;
	margin-right: 10px;
	padding-right: 10px;
}
.feature_box:nth-child(1) .txt_lightblue::before {
  	content: "01";
}
.feature_box:nth-child(2) .txt_lightblue::before {
  	content: "02";
}
.feature_box:nth-child(3) .txt_lightblue::before {
  	content: "03";
}
.feature_box:nth-child(4) .txt_lightblue::before {
  	content: "04";
}
.faq_list dt {
	font-family: 'Zen Maru Gothic', sans-serif;
	margin-bottom: 10px;
}
.faq_list dt::before {
	content: "Q";
	margin-right: 5px;
}
.faq_list dd + dt {
	margin-top: 30px;
}
.faq_list table {
	width: 100%;
	margin-bottom: 10px;
}
.faq_list th,
.faq_list td {
	border: 1px solid #bcbcbc;
	text-align: center;
	padding: 4px 20px;
}
.faq_list th {
	width: 40%;
}
.faq_list td {
	width: 60%;
}
#endcontent .common_content {
	padding: 40px 0;
}
#endcontent h3 {
	background: url("../images/bg_stripe.jpg");
	padding: 20px;
}
#endcontent .sub_box {
	margin-top: 30px;
}
#endcontent .sub_box_inner {
	padding: 20px;
	margin-top: 30px;
}

@media screen and (min-width: 768px) {

	.spNone {
		display: none;
	}	
	#intro .intro_list li {
		width: 49.13%;
	}
	#intro .intro_list li:nth-child(n + 3) {
		margin-top: 10px;
	}
	#contact .contact_list li:nth-child(n + 3) {
		margin-top: 10px;
	}
	#contact .img_box {
		width: 29.1%;
		max-width: 349px;
	}
	#contact .txt_box {
		width: 66.4%;
		max-width: 796px;
	}
	.price_inner,
	.beforeafter li,
	#campaign li {
		width: 47.3%;
		max-width: 520px;
	}
	#anno .txt_box {
		width: 69.16%;
	}
	#anno .img_box {
		width: 28.25%;
		align-self: flex-end;
	}
	.anno_list li {
		width: 47%;
	}
	.area_list li {
		width: 47.3%;
		max-width: 520px;
	}
	#feature_head .img_box {
		width: 30.41%;
	}
	#feature_head .txt_box {
		width: 64.08%;
	}
	.feature_box {
		width: 47.5%;
	}
	#feature_list .feature_box:nth-child(n + 3) {
		margin-top: 30px;
	}
	.faq_list {
		width: 46.81%;
	}
	#endcontent .contact_list li:nth-child(n + 3) {
		margin-top: 10px;
	}
	#endcontent .img_box {
		width: 29.1%;
		max-width: 349px;
	}
	#endcontent .txt_box {
		width: 66.4%;
		max-width: 796px;
	}
	#endcontent .bnr_list li {
		width: 46.3%;
		max-width: 350px;
	}

}
@media screen and (max-width: 767px) {
	.pcNone {
		display: none;
	}
	
	header .common_content p + p,
	#intro .intro_list li + li,
	.contact_list li + li,
	#beforeafter li + li,
	#campaign li + li,
	.area_list li + li,
	.feature_box + .feature_box,
	.bnr_list li + li {
		margin-top: 15px;
	}
	.price_inner + .price_inner,
	.faq_list + .faq_list {
		margin-top: 30px;
	}
	#intro h3 {
		padding: 0 0 120px;
	}
	.contact_list li {
		width: 100%;
	}
	#tree_type .sub_box_inner {
		padding-bottom: 100px;
	}
	#payment h4 {
		flex-wrap: wrap;
	}
	#payment h4 span + span {
		margin-top: 10px !important;
	}
	#anno .anno_list {
		padding: 30px 40px;
	}
	.feature_box {
		padding: 200px 20px 20px;
	}
	.feature_box::before {
		width: 100%;
		height: 180px;
	}
	
	
}
@media screen and (max-width: 1200px) {
	.common_content {
		padding-right: 30px !important;
		padding-left: 30px !important;
	}
	
}

