@charset "utf-8";

/* HEAD */
#HEAD {
background-color: #f0f0f0;
}
#HEAD .cont {
padding: 10px 10px 40px 10px;
}
#HEAD .back {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 20px 0;
font-size: 16px;
text-align: center;
}
#HEAD .back a {
display: flex;
position: relative;
justify-content: center;
align-items: center;
background-color: #009933;
border-radius: 99999px;
padding: 0 52px 0 26px;
height: 46px;
color: #fff;
}
#HEAD .back a::before {
transform: translateY(-50%);
content: '';
position: absolute;
right: 10px;
top: 50%;
background-color: #fff;
border-radius: 99999px;
width: 26px;
height: 26px;
color: #fff;
}
#HEAD .back a::after {
transform: rotate(45deg) translateY(-50%);
content: '';
position: absolute;
right: 22px;
top: 49%;
border-top: solid 2px #009933;
border-right: solid 2px #009933;
width: 5px;
height: 5px;
}
#HEAD .ctg {
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;
font-weight: 800;
font-style: normal;
font-size: 20px;
line-height: 1.3;
color: #009944;
}
#HEAD h1 {
margin-bottom: 20px;
font-size: 30px;
line-height: 1.3;
letter-spacing: 0.1em;
color: #009944;
}
#HEAD .lead {
background-color: #fff;
border-radius: 5px;
padding: 10px;
line-height: 1.8;
letter-spacing: 0.1em;
}
@media (min-width: 768px) {
	#HEAD .cont {
	box-sizing: border-box;
	margin: 0 auto;
	padding: 100px 60px 60px 60px;
	max-width: 1100px;
	}
	#HEAD .set {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	justify-content: space-between;
	margin-bottom: 35px;
	}
	#HEAD .back {
	justify-content: flex-end;
	padding: 10px 0 0 0;
	}
	#HEAD .title {
	flex: 1;
	}
	#HEAD .ctg {
	margin-bottom: 10px;
	font-size: 40px;
	}
	#HEAD h1 {
	margin-bottom: 0;
	font-size: 60px;
	}
	#HEAD .lead {
	border-radius: 10px;
	padding: 20px;
	font-size: 16px;
	}
}

/* PRODUCT */
#PRODUCT {
background-color: #f0f0f0;
}
#PRODUCT .cont {
padding: 0 10px 40px 10px;
}
#PRODUCT .set {
margin-bottom: 40px;
}
#PRODUCT .head {
margin-bottom: 20px;
}
#PRODUCT .head h2 {
margin-bottom: 10px;
font-size: 20px;
line-height: 1.3;
}
#PRODUCT .head p {
font-size: 14px;
line-height: 1.8;
}
#PRODUCT .block {
margin-bottom: 20px;
}
#PRODUCT .block:last-child {
margin-bottom: 0;
}
#PRODUCT .block img {
display: block;
border-radius: 5px;
width: 100%;
height: auto;
}
#PRODUCT .block p {
margin-top: 5px;
font-size: 14px;
line-height: 1.8;
}

#PRODUCT .list a {
color: green;
text-decoration: underline;
}

#PRODUCT .list a:hover{
color: green;
text-decoration: none;
}

#PRODUCT .contact .text {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.8;
}
#PRODUCT .contact .link {
font-weight: 700;
font-size: 16px;
line-height: 1.3;
text-align: center;
}
#PRODUCT .contact .link a {
display: flex;
position: relative;
justify-content: center;
align-items: center;
background-color: #009933;
border-radius: 5px;
padding: 0 52px 0 26px;
height: 56px;
color: #fff;
}
#PRODUCT .contact .link a::before {
transform: rotate(45deg);
content: '';
position: relative;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
margin-right: 20px;
width: 5px;
height: 5px;
}
@media (min-width: 768px) {
	#PRODUCT .cont {
	box-sizing: border-box;
	margin: 0 auto;
	padding: 0 60px 130px 60px;
	max-width: 1100px;
	}
	#PRODUCT .set {
	margin-bottom: 85px;
	}
	#PRODUCT .head {
	margin-bottom: 45px;
	}
	#PRODUCT .head h2 {
	margin-bottom: 10px;
	font-size: 26px;
	}
	#PRODUCT .head p {
	font-size: 16px;
	}
	#PRODUCT .block {
	margin-bottom: 65px;
	}
	#PRODUCT .block img {
	border-radius: 10px;
	}
	#PRODUCT .contact .text {
	margin-bottom: 25px;
	font-size: 20px;
	text-align: center;
	}
	#PRODUCT .contact .link {
	margin: 0 auto;
	max-width: 700px;
	font-size: 24px;
	line-height: 1.3;
	text-align: center;
	}
	#PRODUCT .contact .link a {
	border-radius: 10px;
	padding: 0 52px 0 26px;
	height: 80px;
	}
	#PRODUCT .contact .link a::before {
	margin-right: 20px;
	width: 10px;
	height: 10px;
	}
}