@media screen and (min-width: 931px) {
	
	
	/*---------------------------------------
	 * Main
	---------------------------------------*/ 
	
	.main{
		/*margin: 114px 0 0;*/
	}
	
	
	
	/*---------------------------------------
	 * Mainvisual
	---------------------------------------*/ 
	
	.mainvisual{
		background: url(../img/bg_mainvisual_pc.svg) center 40% repeat-x;
		background-size: 1680px;
	}
	.mainvisual .inner{
		width: calc(100% - 80px);
		max-width: 1260px;
		margin: 0 auto;
	}
	.mainvisual .box{
		display: flex;
		justify-content: space-between;
	}
	.mainvisual .text{
		width: 54.5%;
		margin: 170px 0 0;
	}
	.mainvisual .photo{
		width: 45.5%;
	}
	.mainvisual .site-title{
		width: 100%;
	}
	.mainvisual .copy{
		font-size: 2.9rem;
		line-height: 2;
		letter-spacing: 1px;
		color: #1da53a;
	}
	.mainvisual .copy .underline{
		background: linear-gradient(transparent 98%, #1da53a 2%);
		padding-bottom: 10px;
	}
	
	
	/*---------------------------------------
	 * About
	---------------------------------------*/ 
	
	.about{
		padding: 0 0 80px;
		margin: -40px 0 0;
	}
	.about .inner{
		width: calc(100% - 80px);
		max-width: 1260px;
		margin: 0 auto;
	}
	.about .section-title{
		font-size: 5rem;
		color: #089132;
		font-weight: 700;
		letter-spacing: 5px;
		margin: 0 0 55px;
	}
	.about .section-title .ja{
		display: inline-block;
		margin-left: 40px;
		font-size: 2rem;
		letter-spacing: 2px;
		font-weight: 400;
	}
	.about .read{
		line-height: 2;
		margin: 0 0 40px;
	}
	.about .order-type{
		background: url(../img/check_icon.svg) 30px center no-repeat #FFFFFF;
		background-size: 56px;
		padding: 8px 140px;
		margin: 0 0 20px;
		border-radius: 5px;
	}
	.about .order-type dl{
		display: table;
		width: 100%;
		padding: 20px 0;
	}
	.about .order-type dl dt{
		display: table-cell;
		vertical-align: middle;
		width: 35%;
		color: #089132;
		font-size: 2.4rem;
	}
	.about .order-type dl dd{
		display: table-cell;
		vertical-align: middle;
		width: 65%;
	}
	
	
	/*---------------------------------------
	 * Slide
	---------------------------------------*/ 
	
	.slide-sec{
		margin: 0 0 120px;
	}
	
	.slide-sec .slide{
		margin: 0 17px;
	}
	
	
	/*---------------------------------------
	 * Points
	---------------------------------------*/ 
	
	.points{
		padding: 100px 0 130px;
	}
	
	.points .inner{
		width: calc(100% - 80px);
		max-width: 1260px;
		margin: 0 auto;
	}
	
	
	/* Point共通
	---------------------------------------*/ 
	
	.points .point .num{
		color: #089132;
		font-weight: 500;
		letter-spacing: 1px;
		margin: 0 0 40px;
	}
	.points .point .komidashi{
		display: inline-block;
		font-size: 3.55rem;
		line-height: 1.4;
		border-bottom: 2px solid #556174;
		padding: 0 0 10px;
		margin: 0 0 50px;
	}
	
	
	/* Point1
	---------------------------------------*/ 
	
	.points .point1{
		background: rgb(253,253,254);
		background: linear-gradient(90deg, rgba(253,253,254,1) 0%, rgba(241,244,247,1) 100%);
		margin: 0 0 100px;
	}
	.points .point .box{
		display: flex;
		justify-content: space-between;
		flex-flow: row-reverse;
	}
	.points .point1 .text{
		padding: 76px 95px ;
		width: 50%;
		background: url(../img/point01.svg) right 75px top 76px no-repeat;
		background-size: 220px;
	}
	/*
	.points .point1 .text .num{
		color: #089132;
		margin: 0 0 40px;
	}
	*/
	/*
	.points .point1 .text .komidashi{
		display: inline-block;
		font-size: 3.55rem;
		border-bottom: 2px solid #556174;
		padding: 0 0 10px;
		margin: 0 0 50px;
	}
	*/
	.points .point1 .text .read{
		line-height: 2;
	}
	.points .point1 .photo{
		width: 50%;
		min-width: 450px;
		margin: -30px 0 0;
	}
	
	
	/* Point2
	---------------------------------------*/ 
	
	.points .point2{
		margin: 0 0 120px;
	}
	
	.points .point2 .komidashi-box{
		text-align: center;
		background: url(../img/point02.svg) center no-repeat;
		background-size: 220px;
		margin: 0 0 20px;
	}
	.points .point2 .tab{
		text-align: right;
		margin: 0 0 50px;
	}
	.points .point2 .tab li{
		display: inline-block;
		text-align: center;
		padding: 25px 0px;
		width: 19%;
		background: #FFFFFF;
		border-radius: 5px;
		margin-left: 10px;
		box-shadow: 0 2px 8px 2px #E0E0E0;
		cursor: pointer;
	}
	.points .point2 .tab li.active{
		background: rgb(11,113,42);
		background: linear-gradient(90deg, rgba(11,113,42,1) 0%, rgba(12,143,51,1) 100%);
		color: #FFFFFF;
	}
	.points .point2 .tab-content li{
		
		display: flex;
		justify-content: space-between;
		background: rgb(253,253,254);
		background: linear-gradient(90deg, rgba(241,244,247,1) 0%, rgba(253,253,254,1) 100%);
	}
	.points .point2 .tab-content li:nth-child(2),
	.points .point2 .tab-content li:nth-child(3){
		display: none;
	}
	.points .point2 .tab-content li .text{
		width: 42%;
		padding: 90px 4% 140px;
	}
	
	.points .point2 .tab-content li.content2 .text{
		padding-top: 55px;
		padding-bottom: 30px;
	}
	.points .point2 .tab-content li.content3 .text{
		padding-bottom: 90px;
	}
	
	.points .point2 .tab-content li .text .catch{
		color :#089132;
		font-size: 2.6rem;
		border-bottom: 1px solid #089132;
		padding: 0 0 35px;
		margin: 0 0 50px;
	}
	.points .point2 .tab-content li .text .read{
		line-height: 2;
	}
	.points .point2 .tab-content li .photo{
		width: 51%;
		min-width: 450px;
		margin:-70px 0 0 7%;
		
	}
	
	
	/* Point3
	---------------------------------------*/ 
	
	.points .point3 .komidashi-box{
		text-align: center;
		background: url(../img/point03.svg) center no-repeat;
		background-size: 220px;
		margin: 0 0 20px;
	}
	
	
	
	
	/*---------------------------------------
	 * Feature
	---------------------------------------*/ 
	
	.feature{
		padding: 100px 0 130px;
		background: #e3e9ef;
	}
	.feature .inner{
		width: calc(100% - 80px);
		max-width: 1260px;
		margin: 0 auto;
	}
	.feature .midashi-box{
		margin: 0 0 40px;
	}
	.feature .intro{
		margin-top: -60px;
		text-align: center;
		font-size: 2.2rem;
		line-height: 1.4;
		margin: 0 0 40px;
	}
	.feature .feature-list li{
		background: #FFFFFF;
		width: 100%;
		max-width: 868px;
		border-radius: 5px;
		padding: 42px;
		box-shadow: 0 2px 8px 2px #E0E0E0;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;		
		margin: 0 36px 8px;
		opacity: .5;
	}
	.feature .feature-list .slick-active{
		opacity: 1;
	}
	.feature .feature-list li .text{
		width: calc(100% - 308px);
	}
	.feature .feature-list li .text .num{
		color: #089132;
		font-weight: 500;
		letter-spacing: 1px;
		margin: 0 0 25px;
	}
	.feature .feature-list li .text .catch{
		font-size: 3rem;
		line-height: 1.4;
		margin: 0 0 37px;
	}
	.feature .feature-list li .text .catch::after{
		content:"";
		display: block;
		width: 48px;
		height: 4px;
		background: #089132;
		margin: 38px 0;
	}
	.feature .feature-list li .text .read{
		line-height: 2;
	}
	.feature .feature-list li .photo{
		width: 258px;
	}
	
	
	
	/*---------------------------------------
	 * HowToOrder
	---------------------------------------*/ 
	
	.howtoorder{
		padding: 100px 0 130px;
	}
	.howtoorder .inner{
		width: calc(100% - 80px);
		max-width: 1260px;
		margin: 0 auto;
	}
	.howtoorder .inner .midashi-box{
		margin: 0 0 60px;
	}
	.howtoorder .flow{
		display: flex;
		justify-content: space-between;
		margin: 0 0 60px;
	}
	.howtoorder .flow .left,
	.howtoorder .flow .right{
		width: 47%;
	}
	.howtoorder dl{
		display: table;
		width: 100%;
		padding: 0 0 30px;
		position: relative;
	}
	.howtoorder dl::after{
		content: "";
		display:  block;
		width: 10px;
		height: 100%;
		position: absolute;
		top:0;
		left:30px;
		background: #e9edf1;
		z-index: 0;
	}
	.howtoorder .left dl:last-child{
		padding: 0;
	}
	.howtoorder .right dl:last-child::after{
		content: none;
	}
	.howtoorder dl dt{
		display: table-cell;
		width: 50px;
		position: relative;
		z-index: 1;
		
	}
	.howtoorder dl dd{
		display: table-cell;
		padding-left: 40px;
	}
	.howtoorder dl dt .num{
		display: inline-block;
		width: 30px;
		height: 30px;
		font-size: 3rem;
		padding: 20px;
		border-radius: 50%;
		background: #d8e5dc;
		color: #089132;
		text-align: center;
	}
	.howtoorder dl dd .komidashi{
		font-size: 3rem;
		font-weight: 500;
		margin-bottom: 30px;
	}
	.howtoorder dl dd .read{
		line-height: 1.6;
		font-size: 1.4rem;
	}
	.howtoorder dl dd .read a{
		color: #089132;
		text-decoration: underline;
	}
	.howtoorder .message{
		color: #089132;
		font-size: 2.2rem;
		text-align: center;
		line-height: 1.4;
	}
}


@media screen and (max-width: 930px) {
	
	/*---------------------------------------
	 * Mainvisual
	---------------------------------------*/ 
	
	.mainvisual{
		background: url(../img/bg_mainvisual_sp.svg) 0 100% repeat-x;
		background-size: 134%;
	}
	
	.mainvisual .inner{
		width: calc(100% - 26px);
		max-width: 500px;
		margin: 0 auto;
		
	}
	.mainvisual .box{
		position: relative;
	}
	.mainvisual .text{
		width: 47%;
		margin: 0 0 20vh 0px;
		padding: 7vh 0 0;
		position: relative;
		z-index: 1;
	}
	.mainvisual .photo{
		width: 75%;
		position: absolute;
		top:0;
		right:-50px;
		z-index: 0
	}
	.mainvisual .site-title{
		margin: 0 0 20px;
		width: 100%;
	}
	.mainvisual .copy{
		width: 90%
	}
	.mainvisual .copy .underline{
		background: linear-gradient(transparent 98%, #1da53a 2%);
		padding-bottom: 10px;
	}
	
	
	/*---------------------------------------
	 * About
	---------------------------------------*/ 
	
	.about{
		padding: 0 0 40px;
		margin: -40px 0 0;
	}
	
	.about .inner{
		width: calc(100% - 40px);
		max-width: 500px;
		margin: 0 auto;
	}
	.about .section-title{
		font-size: 2.6rem;
		color: #089132;
		font-weight: 700;
		letter-spacing: 1px;
		margin: 0 0 25px;
	}
	.about .section-title .ja{
		display: block;
		font-size: 1.3rem;
		font-weight: 400;
		margin: 10px 0 0;
	}
	.about .read{
		line-height: 1.8;
		margin: 0 0 40px;
	}
	.about .order-type{
		background: url(../img/check_icon.svg) 10px 20px no-repeat #FFFFFF;
		background-size: 40px;
		padding: 8px 30px;
		margin: 0 0 20px;
		border-radius: 5px;
	}
	.about .order-type dl{
		width: 100%;
		padding: 10px 0 10px 30px;
	}
	.about .order-type dl dt{
		color: #089132;
		font-size: 2rem;
		margin: 0 0 10px;
	}
	.about .order-type dl dd{
		line-height: 1.6;	
	}
	
	
	
	/*---------------------------------------
	 * Slide
	---------------------------------------*/ 
	
	.slide-sec{
		margin: 0 0 90px;
	}
	
	.slide-sec .slide{
		width: 100px;
		margin: 0 10px;
	}
	
	
	/*---------------------------------------
	 * Points
	---------------------------------------*/ 
	
	.points{
		padding: 100px 0 130px;
	}
	
	.points .inner{
		width: calc(100% - 40px);
		max-width: 500px;
		margin: 0 auto;
	}
	
	
	/* Point共通
	---------------------------------------*/ 
	
	.points .point .num{
		color: #089132;
		font-weight: 500;
		letter-spacing: 1px;
		margin: 0 0 20px;
	}
	.points .point .komidashi{
		display: inline-block;
		font-size: 1.7rem;
		line-height: 1.4;
		border-bottom: 2px solid #556174;
		padding: 0 0 10px;
		margin: 0 0 25px;
	}
	
	/* Point1
	---------------------------------------*/ 
	
	.points .point1{
		background: rgb(253,253,254);
		background: linear-gradient(90deg, rgba(253,253,254,1) 0%, rgba(241,244,247,1) 100%);
		margin: 0 0 50px;
	}
	.points .point1 .text{
		padding: 25px;
		width: 100%;
		background: url(../img/point01.svg) right 30px top 38px no-repeat;
		background-size: 110px;
		box-sizing: border-box;
	}
	/*
	.points .point1 .text .num{
		color: #089132;
		margin: 0 0 40px;
	}
	*/
	/*
	.points .point1 .text .komidashi{
		display: inline-block;
		font-size: 3.55rem;
		border-bottom: 2px solid #556174;
		padding: 0 0 10px;
		margin: 0 0 50px;
	}
	*/
	.points .point1 .text .read{
		line-height: 2;
		text-align: justify;
	}
	.points .point1 .photo{
		width: 100%;
	
	}
	
	
	/* Point2
	---------------------------------------*/ 
	
	.points .point2{
		margin: 0 0 50px;
	}
	
	.points .point2 .komidashi-box{
		text-align: center;
		background: url(../img/point02.svg) center no-repeat;
		background-size: 110px;
		margin: 0 0 20px;
	}
	.points .point2 .tab{
		text-align: center;
		margin: 0 0 70px;
		display: flex;
		justify-content: space-between;
	}
	.points .point2 .tab li{
	
		text-align: center;
		padding: 15px 0px;
		width: 32%;
		background: #FFFFFF;
		border-radius: 3px;
		box-shadow: 0 2px 8px 2px #E0E0E0;
		cursor: pointer;
		font-size: 1.1rem;
	}
	.points .point2 .tab li.active{
		background: rgb(11,113,42);
		background: linear-gradient(90deg, rgba(11,113,42,1) 0%, rgba(12,143,51,1) 100%);
		color: #FFFFFF;
	}
	.points .point2 .tab-content li{
		
		width: calc(100% + 20px);
		background: rgb(253,253,254);
		background: linear-gradient(90deg, rgba(241,244,247,1) 0%, rgba(253,253,254,1) 100%);
	}
	.points .point2 .tab-content li:nth-child(2),
	.points .point2 .tab-content li:nth-child(3){
		display: none;
	}
	.points .point2 .tab-content li .text{
		width: calc(100% - 20px);
		padding: 0 0 50px;
		margin: -70px 0 0;
	}
	
	.points .point2 .tab-content li.content2 .text{
		padding-bottom: 30px;
	}	
	.points .point2 .tab-content li .text .catch{
		display: inline-block;
		color :#089132;
		font-size: 1.7rem;
		border-bottom: 1px solid #089132;
		padding: 0 0 15px;
		margin: 0px 0 20px;
	}
	.points .point2 .tab-content li .text .read{
		line-height: 2;
	}
	.points .point2 .tab-content li .photo{
		width: calc(100% - 20px);
		position: relative;
		top:-40px;
	}
	
	
	/* Point3
	---------------------------------------*/ 
	
	.points .point3 .komidashi-box{
		text-align: center;
		background: url(../img/point03.svg) center no-repeat;
		background-size: 110px;
		margin: 0 0 20px;
	}

	
	
	/*---------------------------------------
	 * Feature
	---------------------------------------*/ 
	
	.feature{
		padding: 50px 0 50px;
		background: #e3e9ef;
	}
	.feature .inner{
		width: calc(100% - 40px);
		max-width: 500px;
		margin: 0 auto;
	}
	.feature .midashi-box{
		margin: 0 0 40px;
	}
	.feature .intro{
		margin-top: -60px;
		text-align: center;
		font-size: 1.6rem;
		line-height: 1.8;
		margin: 0 0 20px;
	}
	.feature .feature-list li{
		background: #FFFFFF;
		width: 100%;
		border-radius: 5px;
		padding: 20px 30px;
		
		margin: 0 4px ;
		opacity: .5;
		box-sizing: border-box;
	}
	
	.feature .feature-list .slick-active{
		opacity: 1;
	}
	.feature .feature-list li .text{
		width: 100%;
	}
	.feature .feature-list li .text .num{
		font-size: 1rem;
		color: #089132;
		font-weight: 500;
		letter-spacing: 1px;
		margin: 0 0 10px;
	}
	.feature .feature-list li .text .catch{
		font-size: 1.7rem;
		line-height: 1.4;
		margin: 0 0px;
	}
	.feature .feature-list li .text .catch::after{
		content:"";
		display: block;
		width: 24px;
		height: 2px;
		background: #089132;
		margin: 20px 0;
	}
	.feature .feature-list li .text .read{
		line-height: 2;
		text-align: justify;
	}
	.feature .feature-list li .text .read.add-margin{
		margin: 0 0 26px;
	}
	.feature .feature-list li .photo{
		width: 45%;
		margin-left: 5%;
		float: right;
	}					
	.feature .slick-prev {
    	left: 5px;
		z-index: 100;
		width: 30px;
		margin: 0;
	}
	.feature .slick-next {
    	right: 5px;
		z-index: 100;
		width: 30px;
		margin: 0;
		
	}



	/*---------------------------------------
	 * HowToOrder
	---------------------------------------*/ 
	
	.howtoorder{
		padding: 50px 0 100px;
	}
	.howtoorder .inner{
		width: calc(100% - 40px);
		max-width: 500px;
		margin: 0 auto;
	}
	.howtoorder .inner .midashi-box{
		margin: 0 0 60px;
	}
	.howtoorder .flow{
		
		
	}
	.howtoorder .flow .left,
	.howtoorder .flow .right{
		width: 100%;
	}
	.howtoorder dl{
		display: table;
		width: 100%;
		padding: 0 0 30px;
		position: relative;
	}
	.howtoorder dl::after{
		content: "";
		display:  block;
		width: 6px;
		height: 100%;
		position: absolute;
		top:5px;
		left:15px;
		background: #e9edf1;
		z-index: 0;
	}
	.howtoorder .right dl:last-child::after{
		content: none;
	}
	.howtoorder dl dt{
		display: table-cell;
		width: 50px;
		position: relative;
		z-index: 1;
		
	}
	.howtoorder dl dd{
		display: table-cell;
		padding-left: 0px;
	}
	.howtoorder dl dt .num{
		display: inline-block;
		width: 15px;
		height: 15px;
		font-size: 1.5rem;
		padding: 10px;
		border-radius: 50%;
		background: #d8e5dc;
		color: #089132;
		text-align: center;
	}
	.howtoorder dl dd .komidashi{
		font-size: 1.5rem;
		font-weight: 500;
		margin-bottom: 15px;
	}
	.howtoorder dl dd .read{
		line-height: 1.6;
		font-size: 1.2rem;
	}
	.howtoorder dl dd .read a{
		color: #089132;
		text-decoration: underline;
	}
	.howtoorder .message{
		color: #089132;
		font-size: 1.4rem;
		text-align: center;
		line-height: 1.6;
	}	
	
	
}