@charset "UTF-8";
/* CSS Document */

/*********************************************************
					　　　　初期設定
**********************************************************/

.pc{display: block;}

.sp{display: none;}

.sp2{display: none;}

.tb{display: none;}

.brpc{display: block;}

.brsp{display: none;}

.brtb{display: none;}

.eng{
	font-family: 'Montserrat', sans-serif;
}

/*********************************************************
*********************************************************
					TOPページ
*********************************************************
**********************************************************/

/*********************************************************
					フェードイン
**********************************************************/

.concept-p,
.flex,
.concept-image {
	transition: 1s ease-in-out;
	transform: translateY(30px);
	opacity: 0;
}

.concept-image.on,
.concept-p.on,
.flex.on,
.instasection.on,
.taiken.on,
.planprice.on,
.accesssection.on,
.overview.on,
.overview-info.on {
	transform: translateY(0);
	opacity: 1.0;
}

.instasection,
.taiken,
.planprice,
.accesssection,
.overview,
.overview-info {
	transition: 1s ease-in-out;
	transform: translateY(60px);
	opacity: 0;
}

/*********************************************************
					メインビジュアル_top_mv
**********************************************************/
.top_mv {
	background: #fff;
}

.main {
	width: 100%;
	max-width: 1366px;
	padding-bottom: 1px;
	margin: 0 auto;
}

.mainvisual {
	width: 100%;
}

/*********************************************************
					メイン
**********************************************************/

.sec2 {
	width: 100%;
	background: #fff;
}

.sec2_inner {
	width: 100%;
	background-image: url(../img/top_haikei_04.jpg);
	background-repeat: repeat-y ;
	background-position: center;
}

.concept_area {
	margin-bottom: min(40vw,400px);
}

.concept {
	z-index: 9998;
	width: 100%;
	max-width: 1366px;
	padding: 100px 0 200px;
	margin: 0 auto;
}

.concept-inner {
	width: 85%;
	margin: 0 auto;
}

.concept-h2 {
	width: 100%;
	text-align: center;
	font-size: min(3.46vw,5rem);
	line-height: 1.8em;
	letter-spacing: 0.05em;
	color: #8CAB6D;

}

.concept-image {
	width: 100%;
	padding: 150px 0 10px;
}

.concept-tagimg {
	top: -32px;
	width: 28%;
	max-width: 180px;
	min-width: 100px;
}

.farm-photo {
	display: flex;
	justify-content: center;
	align-items: center;
}

.concept-img1 {
	width: 50%;
}

.concept-img2 {
	width: 54%;
}

.concept-img3 {
	width: 54%;
}

.concept-text {
	display: block;
	padding: 20px 0 0;
	margin: 0 auto;
	text-align:center;
}

.concept-p {
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	text-align: left;
	font-size: 1.8rem;
	line-height: 3em;
}

.concept-img4 {
    position: fixed;
    top: 0;
    left: 0;
	z-index: -10;
	width: 100%;
    height: 100vh;
    background-size: cover;
	background-image: url(../img/concept-img4_01.webp);
}

.top_circle01_area {
	position: relative;
	overflow: hidden;
	z-index: 2;
	width: 100%;
	max-width: 1366px;
	height: 300px;
	margin: 0 auto;
}

.top_circle01 {
	position: absolute;
	top: 0px;
	right: -40px;
	z-index: 1;

}


.flex {
	width: 100%;
	aspect-ratio: 3/1.5;
	display: flex;
	justify-content: space-between;
}

.flex-wrap {
	width: 49%;
	display: flex;
	height: 100%;
	flex-wrap: wrap;
}


.img-box01 {
	width: 49%;
	height: 100%;
	background: url(../img/concept-img1.webp) no-repeat center / cover;

}

.webp .img-box02 {
	width: 100%;
	height: 49%;
	background: url(../img/concept-img2.webp) no-repeat center / cover;

}

.webp .img-box03 {
	width: 100%;
	height: 49%;
	margin-top: 2%;
	background: url(../img/concept-img3.webp) no-repeat center / cover;
}
/*********************************************************
					インスタ_section2
**********************************************************/

.wrapper {
	width: 100%;
	background: #fff;
}

.wrapper_inner {
	width: 100%;
	/* wrapper2_innerの背景はsec2からフッター上まで */
	background-image: url(../img/top_haikei_04.jpg);
	background-repeat: repeat-y ;
	background-position: center;
}

.insta_info {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
}

.insta_colorlogo {
	width: max(8vw,70px);
	max-width: 100px;
}

.insta_text {
	font-size: min(5.71vw,5rem);
	line-height: 1.2em;
}

.instasection {
	width: 100%;
	max-width: 1366px;
	padding: 200px 0 0;
	margin: 0 auto;
}

.instasection-inner {
	width: 85%;
	margin: 0 auto;
}

.instasection-h1 {
	width: 100%;
}
.instasectionlogo {
	display: block;
	width: 34%;
	padding: 20px;
	margin: 0 auto;
}

.post {
	padding-top: 20px;
}

/*********************************************************
					体験_section3
**********************************************************/

.job {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
}

.job-inner {
    width: 85%;
    margin: 0 auto;
}

.job-h2 {
	display: block;
	width: 100%;
    max-width: 700px;
	text-align: center;
    padding: 200px 0 3px;
	margin: 0 auto;
    border-bottom: 3px solid #8CAB6D;
	color: #8CAB6D;

}


.job-inner .job-wrap {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	gap: 5vw;
	margin: min(10vw, 140px) 0;
}

.job-wrap .job-content {
	width: calc(100% / 2 - 2.5vw);
}

.job-content img {
	width: 100%;
}

.job-content .job-titile {
	margin: 0.8em 0 0.2em 0;
	font-size: 24px;
}

.job-content .job-text {
	font-size: 18px;
	line-height: 1.7;
}

.job-content .overview_bunner01_info {
	display: inline;
}

.kaien-h4 {
	font-size: min(4.57vw,2rem);
}

.kaien-h3 {
	font-size: min(5.71vw,3rem);
} */


/*********************************************************
					プラン
**********************************************************/

.plan-info {
	padding-top: 10px;
	padding-bottom: 36px;
	color: #64391B;
}
.plan-info-text {
	text-align: right;
	font-size: min(4vw,1.6rem);
}

.kiyaku-text {
	border-bottom: 2px solid #8CAB6D;
	text-align: center;
	font-size: min(4vw,2rem);
	color: #8CAB6D;
}

.kiyaku {
	width: 100%;
	max-width: 400px;
	padding-bottom: 38px;
	margin: 0 auto;
}


/*********************************************************
					アクセス_section5
**********************************************************/

.accesssection {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	background-color: #F0F4EC;
}

.accesssection-inner {
	width: 85%;
	padding-top: 100px;
	margin: 0 auto;
}

.access-tagimg {
	width: 28%;
	max-width: 180px;
	min-width: 100px;

}

.access-text {
	width: 100%;
	padding-bottom: 80px;
	margin: 0 auto;
	font-size: 1.8rem;
	line-height: 1.8em;
}

.accessinfo {
	display: flex;
}

.accessmap {
	width: 100%;
	height: 360px;
	padding-bottom: 80px;

}

.address {
	padding-left: 100px;
}

.address-info {
	width: 320px;
	padding: 20px 20px 0;
	text-align: left;
	line-height: 34px;
	letter-spacing: 2px;
	border-top: 2px solid #8CAB6D;

}

.address2 {
	padding-top: 24px;
}

.period {
	border-bottom: 2px solid #8CAB6D;
	text-align: center;
}

.period-info {
	width: 320px;
	text-align: center;
	padding: 20px 20px 0;
}


.address3 {
	padding-top: 24px;
}

.time {
	text-align: center;
	border-bottom: 2px solid #8CAB6D;
}

.time-info {
	width: 320px;
	padding: 20px 20px 0;
	text-align: center;
	line-height: 24px;
}

/*********************************************************
					バナー_section6
**********************************************************/

.overview {
	width: 100%;
	max-width: 1366px;
	padding: 100px 0 0;
	margin: 0 auto;
}


.overview-inner {
	width: 85%;
	margin: 0 auto;
}
.overview_bunner01,.overview_bunner02 {
	width: 100%;
}

.overview_bunner01_info_wrapper {
	width: 70%;
	max-width: 240px;
}

.overview_bunner01_info {
	width: 100%;
	padding-top: 12px;
	font-size: min(4vw,1.8rem);
	letter-spacing: 4px;
	white-space: nowrap;
	color: #8CAB6D;
	border-bottom: 2px solid #8CAB6D;

}

.overview_bunner02 {
	margin-top: 100px;
}

/*********************************************************
					農園概要_section7
**********************************************************/

.overview-h2 {
	width: 100%;
	max-width: 700px;
	padding: 200px 0 3px;
	margin: 0 auto;
	text-align: center;
	color: #8CAB6D;
	border-bottom: 3px solid #8CAB6D;

}

.overview-info {
	width: 100%;
	max-width: 1366px;
	padding-bottom: 200px;
	margin: 0 auto;
}

.overview-info_inner {
	width: 85%;
	margin: 0 auto;
}
.top-table-wrapper {
	padding-left: 112px;
}

.ovewview-title {
	padding-bottom: 50px;
}

.top-table {
	width: 700px;
	margin: 0 auto;
	font-size: min(4vw,2.2rem);
}

.top-table td {
	padding: 10px 0 0 80px;
}

.top-table th {
	text-align: left;
}

/*********************************************************
					ループスライダー_slider
**********************************************************/
.sec6 {
	background: #fff;
}

.slider {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding-bottom: 36px;
}

.slider img {
	max-height: 275px;
	height: 20vw;
}

/*********************************************************
					フッター_footer
**********************************************************/

footer {
	background: #fff;
}

/****************************************************************************************************************************
			ここからメディアクエリ(タブレット）1000px
*****************************************************************************************************************************/

@media screen and (max-width: 1000px){
	.pc{display: none;}
	.sp{display: none;}
	.sp2{display: block;}
	.tb{display: block;}
	.brpc{display: none;}
	.brsp{display: none;}
	.brtb{display: block;}
	

/*********************************************************
					ページ上部は1000px以下ではフェードインなし
**********************************************************/

.fadein1 {
	transition: unset;
	transform: none;
	opacity: 1;
}

.fadein2 {
	transition: unset;
	transform: none;
	opacity: 1;
}
		
/*********************************************************
					コンセプト_section1_メディアクエリ(タブレット）1000px
**********************************************************/

.sec2_inner {
	background-image: url(../img/top_haikei_04_1000px.jpg);
}

/*********************************************************
					コンセプト_section2_メディアクエリ(タブレット）1000px
**********************************************************/

.wrapper_inner {
	/* wrapper2_innerの背景はsec2からフッター上まで */
	background-image: url(../img/top_haikei_04_1000px.jpg);
}

/*********************************************************
					アクセス_section5_メディアクエリ(タブレット）1000px
**********************************************************/

.accessinfo {
	display: block;
	text-align: center;
}

.address {
	width: 90%;
	padding-left: 0;
	margin: 0 auto;
}

.address-info {
	width: 100%;
	padding: 0;
	text-align: center; 
	font-size: min(4vw, 2.2rem);
}

.period-info,.time-info {
	width: 100%;
	padding: 20px 0px 0px;
	font-size: min(4vw, 2.2rem);

}

.accesssection-inner {
	padding: 50px 0 40px;
}

/*********************************************************
					農園概要_section7_メディアクエリ(タブレット）1000px
**********************************************************/

table td, table th {
	display: block;
	width: 100%;
	text-align: center;
	
}

.top-table td {
	padding: 0px 0px 10px 0;
}

.top-table th {
	text-align: center;
	padding: 20px 0 10px;
}

.top-table {
	width: 88%;
}

.top-table td {
	border-bottom: 2px solid #ccc;
}

.top-table-wrapper {
	padding-left: 0px;
}

.overview-info {
	padding-bottom: 140px;
}

/*********************************************************
					ループスライダー_slider_メディアクエリ(タブレット）1000px
**********************************************************/

.slider img {
	height: 20vw;
	max-height: 275px;
}

}







/************************************************************************************************************************
			ここからメディアクエリ(SP） 750px
*************************************************************************************************************************/

@media screen and (max-width: 750px){
	.pc{display: none;}
	.sp{display: block;}
	.brpc{display: none;}
	.brsp{display: block;}


/*********************************************************
					コンセプト_section1_メディアクエリ(SP）750px
**********************************************************/
/* wevpサポートがない場合 */
.no-webp .sec2_inner {
	background-image: url(../img/top_haikei_04_500px.jpg);
}
/* wevpサポートがある場合 */
.webp .sec2_inner {
	background-image: url(../img/top_haikei_04_500px.webp);
}

.concept {
	padding: 50px 0 100px;
}
.concept-h2 {
	display: inline-block;
	padding-left: 0.5em;
	text-align: left;
	font-size: min(6.85vw,4.4rem);
	line-height: 1.8em;
	font-weight: 500;
}

.instasection {
	padding: 100px 0 0;
}

.concept-p {
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	text-align: justify;
	line-height: 2em;
}

.concept-image {
	padding: 80px 0 10px;
}

.farm-photo_right {
	display: flex;
}

.farm-photo {
	display: block;
}

.concept-img1 {
	width: 100%;
}

.concept-img2, .concept-img3 {
	width: 50%;
}

.flex {
	flex-wrap: wrap;
	aspect-ratio: 1/1;
}
	
.webp .img-box01 {
	width: 100%;
	height: 60%;
}

.no-webp .img-box01 {
	width: 100%;
	height: 60%;
}
	
.flex-wrap {
	flex-wrap: nowrap;
	justify-content: space-between;
	width: 100%;
	height: 38%;
	margin-top: 2%;
}

.webp .img-box02 {
	width: 49%;
	height: 100%;
	margin-top: 0;
}

.no-webp .img-box02 {
	width: 49%;
	height: 100%;
	margin-top: 0;
}

.webp .img-box03 {
	width: 49%;
	height: 100%;
	margin-top: 0;
}

.no-webp .img-box03 {
	width: 49%;
	height: 100%;
	margin-top: 0;
}


.webp .concept-img4 {
	background: url(../img/concept-img4_01_sp.webp) no-repeat center / cover;
}	
/*********************************************************
					コンセプト_section2_メディアクエリ(SP）750px
**********************************************************/
/* wevpサポートがない場合 */
.no-webp .wrapper_inner {
	/* wrapper2_innerの背景はsec2からフッター上まで */
	background-image: url(../img/top_haikei_04_500px.jpg);
}

/* wevpサポートがない場合 */
.webp .wrapper_inner {
	/* wrapper2_innerの背景はsec2からフッター上まで */
	background-image: url(../img/top_haikei_04_500px.webp);
}
/*********************************************************
					体験_section3_メディアクエリ(SP）750px
**********************************************************/


.job-h2 {
	padding: 100px 0 3px;
	font-size: min(6.85vw,4.4rem);
}

.job-inner .job-wrap {
	display: block;
    flex-wrap: nowrap;
    width: 100%;
 }

 .job-wrap .job-content {
    width: 100%;
	margin-bottom: 10vw;
}

.job-content .job-titile {
	font-size: min(5vw, 22px);
}

.job-content .job-text {
	font-size: min(4.1vw, 18px);
}
 

.taiken-p {
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	text-align: justify;
	font-size: min(5.14vw,2.5rem);
	line-height: 2em;
}

.kaien_section {
	display: block;
	text-align: center;
}

.kaien {
	padding: 0;
}
.kaien-h3 {
	padding: 14px 0 10px;
}

.kaien-h4 {
	text-align: left;
}

.taiken-photo {
	display: block;
}

.taiken-photo_right {
	display: flex;
}

.taiken-img1 {
	width: 100%;
}

.taiken-img2, .taiken-img3 {
	width: 50%;
}

.yoyaku_section {
	display: block;
	text-align: center;
}

.yoyaku {
	padding: 0;
}

.taiken-image {
	padding: 6vw 0 14vw;
}
.yoyaku-h3 {
	padding: 14px 0 10px;
}
.yoyaku-h4 {
	text-align: center;
}

.taiken-info {
	margin-top: min(5.14vw,20px);
}

.taiken-info_p {
	padding: 1.2em 0.8em;
	font-size: min(5.14vw,1.8rem);
	line-height: 1.5em;

}

.taiken_flex {
	flex-wrap: wrap;
	aspect-ratio: 1/1;
}
	
.webp .taiken_img-box01 {
	width: 100%;
	height: 60%;
}

.no-webp .taiken_img-box01 {
	width: 100%;
	height: 60%;
}
	
.taiken_flex-wrap {
	flex-wrap: nowrap;
	justify-content: space-between;
	width: 100%;
	height: 38%;
	margin-top: 2%;
}


/*********************************************************
					プランと料金_section4_メディアクエリ(SP）750px
**********************************************************/

.planprice-h3 {
	padding-bottom: 30px;
}

.tab-reader-box1 {
	display: block;
	width: 90%;
	padding: 5px 0;
	margin: 0 auto;
	border-bottom: 1px dotted #ccc;
	font-size: min(4.57vw,2.4rem);
	color: #64391B;

}

.tab-reader-box3 {
	font-size: min(4.57vw,2.4rem);
	color: #64391B;
}

.planprice {
	padding: 100px 0 50px;
}

.planA_img, .planB_img, .planC_img {
	width: 10%;
}

.tab-reader-box2 {
	display: none;
}

.flex_A,.flex_B {
	display: block;
	padding: 12px 6px;
	margin-bottom: 5vw;
	border-radius: 3vw;
}

.flex_C {
	display: block;
	padding: 12px 6px;
	margin-bottom: 0;
	border-radius: 3vw;
}

.plan-info-text {
	text-align: left;
}

.planA_img, .planB_img, .planC_img {
	display: none;
}

.price_sp {
	display: flex;
	align-items: center;

}

.planA_img_sp,.planB_img_sp,.planC_img_sp {
	width: 6%;
	min-width: 48px;
}

.price_sp_text {
	font-size: min(4vw,2rem);
	color: #64391B;
}

.plan-info {
	padding-top: 0px;
	text-align: center;
}

/*********************************************************
					アクセス_section5_メディアクエリ(SP）750px
**********************************************************/

.access-text {
	text-align: justify;
	padding-bottom: 50px;
}

.accessmap {
	padding-bottom: 50px;
}

/*********************************************************
					バナー_section6_メディアクエリ(SP）750px
**********************************************************/

.overview-inner {
	width: 90%;
}

.overview {
	padding: 70px 0 0;
}

.overview_bunner02 {
	margin-top: 70px;
}

/*********************************************************
					農園概要_section7_メディアクエリ(SP）750px
**********************************************************/

.overview-info_inner {
	width: 90%;
}

.overview-h2 {
	padding: 100px 0 3px;
	font-size: min(6.85vw,4.4rem);
}

}