@charset "utf-8";

body{
	-webkit-text-size-adjust: 100%;
	color: #222;
	font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
img{
	display: block;
	max-width: 100%;
	height: auto;
}
table{
	border-collapse: collapse;
}
hr{
	height: 0;
	margin: 40px 0;
	padding: 0;
	border: 0;
	border-bottom: 1px solid #CCC;
}
.container{
	margin: 0 auto;
	max-width: 1400px;
}
header{
	background: url(/img/bg_top.jpg) center 0 no-repeat;
	aspect-ratio: 3/1;
}
@media(max-width: 767.98px){
header{
	aspect-ratio: auto;
}
}
#cf-top{
	padding: 5px 15px;
	text-align: center;
	background-color: #4E9E29;
}
#cf-top img{
	margin: 0 auto;
}
#logo{
	padding: 5px 0;
}
#vd-top{
	display: flex;
	flex-wrap: wrap;
	max-width: 1200px;
	margin: 0 auto;
	padding: 15px;
}
#vd-top div img{
	margin: 0 auto;
}
#package{
	padding: 15px;
	width: 40%;
	text-align: center;
}
#theme{
	display: flex;
	padding: 15px;
	width: 60%;
	text-align: center;
	align-items: center;
}
@media(max-width: 767.98px){
#package,
#theme{
	width: 100%;
}
}
#grow{
	padding: 20px 15px;
	background-color: #F3F5B7;
}
#grow h3{
	padding: 0.5em 0.5em;
	font-size: 1.8rem;
	text-align: center;
}
@media(max-width: 575.98px){
#grow h3{
	font-size: 1.5rem;
}
}
@media(max-width: 479.98px){
#grow h3{
	font-size: 1.25rem;
}
}
#grow p{
	padding: 0.25em;
	text-align: center;
}
@media(max-width: 991.98px){
#grow p{
	text-align: left;
}
}
.wrap-photo{
	padding: 15px 0 0;
	display: flex;
	flex-wrap: wrap;
}
.wrap-photo div{
	width: 25%;
	padding: 5px;
	text-align: center;
}
@media(max-width: 767.98px){
.wrap-photo div{
	width: 50%;
}
}
#summary{
	padding: 20px 0;
	background-color: #DAE000;
}
#summary h2{
	padding: 0.75em 0.5em 0.5em;
	font-size: 1.8rem;
	text-align: center;
}
@media(max-width: 575.98px){
#summary h2{
	font-size: 1.5rem;
}
}
@media(max-width: 479.98px){
#summary h2{
	font-size: 1.25rem;
}
}
#innr-summary{
	display: flex;
	flex-wrap: wrap;
	padding: 15px;
}
#spraying{
	width: 50%;
}
#spraying img{
	margin: 0 auto;
}
#txt-summary{
	width: 50%;
	padding: 0 10px 250px;
	background: url(/img/tomato.png) center bottom no-repeat;
}
@media(max-width: 991.98px){
#spraying,
#txt-summary{
	width: 100%;
}
}
#voice{
	padding: 30px 15px 20px;
	background: url(/img/sky.jpg) center 0 repeat-x;
}
.wrap-voice{
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
	padding: 25px;
	background-color: #FFF9E2;
	box-shadow: 3px 3px 6px rgba(0,0,0,0.3);
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}
.c-fce{
	width: 35%;
	padding: 3px;
	text-align: center;
}
.c-txt{
	width: 65%;
	padding: 0.5em 1em;
}
.c-fce img{
	margin: 0 auto;
}
@media(max-width: 991.98px){
.c-fce{
	width: 45%;
}
.c-txt{
	width: 55%;
}
}
@media(max-width: 767.98px){
.c-fce,
.c-txt{
	width: 100%;
	padding: 0;
}
}
#voice h3{
	padding: 0.5em 0.5em 0.25em;
	font-size: 1.8rem;
	text-align: center;
}
@media(max-width: 575.98px){
#voice h3{
	font-size: 1.5rem;
}
}
@media(max-width: 479.98px){
#voice h3{
	font-size: 1.4rem;
}
}
.impre{
	padding: 0.5em 0;
	text-align: center;
	font-size: 1.4rem;
	font-weight: bold;
}
@media(max-width: 575.98px){
.impre{
	font-size: 1.3rem;
}
}
@media(max-width: 479.98px){
.impre{
	font-size: 1.2rem;
}
}
.c-nme{
	padding: 0.25em 0 0.5em;
	text-align: right;
	font-size: 1.2rem;
	font-weight: bold;
}
.wrap-exp{
	width: 100%;
	padding: 20px 0 0;
	display: flex;
	flex-wrap: wrap;
}
.wrap-exp div{
	width: 16.66%;
	padding: 3px;
	text-align: center;
}
.wrap-exp div img{
	margin: 0 auto;
}
@media(max-width: 767.98px){
.wrap-exp div{
	width: 33.33%;
}
}
@media(max-width: 575.98px){
.wrap-exp div{
	width: 50%;
}
}
#bottle{
	padding: 45px 15px 15px;
	text-align: center;
}
#bottle h3{
	font-size: 1.8rem;
	color: #4E9E29;
}
#bottle h4{
	font-size: 1.2rem;
	font-weight: normal;
}
@media(max-width: 575.98px){
#bottle h3{
	font-size: 1.5rem;
}
#bottle h4{
	font-size: 1.1rem;
}
}
@media(max-width: 479.98px){
#bottle h3{
	font-size: 1.4rem;
}
#bottle h4{
	font-size: 1rem;
}
}
#bottle img{
	margin: 0 auto;
}
#bottle table{
	width: 100%;
	max-width: 500px;
	margin: 0.5em auto;
	font-size: 1.5rem;
	border: 2px solid #BBB;
	background-color: #FFF;
}
@media(max-width: 575.98px){
#bottle table{
	font-size: 1.25rem;
}
}
#bottle table th,
#bottle table td{
	padding: 0.5em 0.75em;
	border: 1px solid #BBB;
}
#bottle table th{
	background-color: #EBFAE5;
}
.tax{
	font-size: 80%;
}
#solution{
	padding: 10px 15px;
	background-image: linear-gradient(0deg, #FFF7E3, #FFF);
}
#solution h3{
	text-align: center;
	font-size: 1.75rem;
}
@media(max-width: 575.98px){
#solution h3{
	font-size: 1.45rem;
}
}
@media(max-width: 479.98px){
#solution h3{
	font-size: 1.25rem;
}
}
#solution h4{
	padding: 0 0 15px;
	text-align: center;
	font-size: 1.25rem;
}
#solution h4 img{
	margin: 0 auto;
}
#solution p{
	padding: 0 0.5em;
	text-align: center;
}
@media(max-width: 767.98px){
#solution p{
	text-align: left;
}
}
#illust{
	display: flex;
	flex-wrap: wrap;
	padding: 20px 0 30px;
}
#illust div{
	width: 25%;
	padding: 5px;
	text-align: center;
}
@media(max-width: 767.98px){
#illust div{
	width: 50%;
}
}
#illust div img{
	border: 5px solid #B3B3B3;
}
#legal{
	padding: 40px 15px;
	background-color: #FFD8C0;
}
#legal h3{
	text-align: center;
	font-size: 1.75rem;
}
@media(max-width: 575.98px){
#legal h3{
	font-size: 1.45rem;
}
}
@media(max-width: 479.98px){
#legal h3{
	font-size: 1.25rem;
}
}
#legal p{
	padding: 1em 0.25em 1.25em;
	font-size: 0.9em;
	text-align: center;
}
@media(max-width: 991.98px){
#legal p{
	text-align: left;
}
}
#legal table{
	width: 100%;
	max-width: 1000px;
	margin: 0.25em auto;
	font-size: 0.9rem;
	border: 2px solid #BBB;
	background-color: #FFF;
}
@media(max-width: 575.98px){
#legal table{
	font-size: 0.75rem;
}
}
#legal table th,
#legal table td{
	padding: 0.5em 0.75em;
	border: 1px solid #BBB;
	vertical-align: top;
}
#legal table th{
	background-color: #FFF78C;
}
#legal table.ingredient td{
	text-align: center;
}
footer{
	margin: 20px 0 0;
	padding: 30px 15px 80px;
	min-height: 500px;
	background-image: linear-gradient(0deg, #D2DD83, #FFF);
}
footer h3{
	padding: 0.5em 0.5em 1em;
	font-size: 1.75rem;
	text-align: center;
	background: url(/img/arrow.png) center bottom no-repeat;
}
@media(max-width: 575.98px){
footer h3{
	font-size: 1.5rem;
}
}
@media(max-width: 479.98px){
footer h3{
	font-size: 1.25rem;
}
}
#mpp{
	margin: 0 auto;
}
#company{
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
	padding: 0 15px;
}
#c-photo{
	width: 55%;
	text-align: center;
}
#c-photo img{
	margin: 0 auto;
}
#c-info{
	display: flex;
	width: 45%;
	padding-top: 20px;
	text-align: center;
	align-items: center;
}
#c-info img{
	margin: 0 auto;
}
@media(max-width: 767.98px){
#c-photo,
#c-info{
	display: block;
	width: 100%;
}
}
address{
	font-style: normal;
}
#c-name{
	font-size: 1.25em;
	font-weight: bold;
}
#copyright{
	margin-top: 2em;
	font-size: 0.75em;
	text-align: center;
}
#totop{
	position: fixed;
	bottom: 15px;
	right: 15px;
	z-index: 2;
}