/* FV */

main{
	position: relative;
	
	
	
}

#fv-top{
	position: sticky;
    height: 100vh;
    width: 100%;
    display: block;
    top: 0;
	z-index: -1;
}

.fv-top{
	position: relative;
	overflow: hidden;
}

.slider{
	z-index: 1;
}

.fv-center{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.fv-text{
	display: flex;
	flex-direction: row-reverse;
	color: #704800;
	gap: 20px;
}

.fv-text h2{
	text-indent: -9999px;
    display: block;
    aspect-ratio: 45 / 485;
    width: 2.5vw;
    max-width: 40px;
}

.fv-text h2:first-child{
	background: url("../img/top/fv/text-01.png") no-repeat;
	background-size: cover;
}

.fv-text h2:nth-child(2){
	background: url("../img/top/fv/text-02.png") no-repeat;
	background-size: cover;
}

.fv-text h2:last-child{
	background: url("../img/top/fv/text-03.png") no-repeat;
	background-size: cover;
}

.jam-can{
	display: flex;
	background: url("../img/top/fv/jam-can.png") no-repeat;
	background-size: cover;
	aspect-ratio: 15/20;
	width: 11vw;
    max-width: 180px;
}


/* svg */

.fv-svg{
	max-width:520px;
	width: 25vw;
	position:absolute;
	right:0;
	bottom:0;
	margin:auto;
	z-index: 2;
}


.fv-svg-l{
	max-width:620px;
	width:30vw;
	position:absolute;
	left:0;
	bottom:0;
	margin:auto;
	z-index: 2;
}

/* svg ///*/

/* FV ///*/


@media(max-width: 1466px){
	
	.fv-svg {
		max-width: 420px;
	}
	
	.fv-svg-l {
		max-width: 520px;
	}
	
}


@media(max-width: 1200px){
	
	
	.fv-text h2 {
		min-width: 26px;
	}
	
	.jam-can {
    	width: 8vw;
	}
	
	.fv-center {
		gap: 10px;
		padding-bottom: 20px;
	}
	
}

@media (max-width: 1000px) {
	
	.fv-center {
		gap: 15px;
	}
	
	.fv-text {
		gap: 3.75vw;
	}
	
    .fv-text h2 {
        max-width: 36px;
        width: 6.75vw;
		min-width: 27px;
    }
	
	.jam-can {
        width: 16vw;
        max-width: 120px;
		min-width: 100px;
    }
	
	
    .fv-svg {
        bottom: 30px;
        width: 60vw;
        transform: rotate(-5deg);
        right: -8vw;
    }
	
	.fv-svg-l {
		bottom: 50px;
        width: 60vw;
    }
	
	
}


/* 私たちについて*/

#about{
	position: relative;
	z-index: 4;
	background: #fff; 
	width: 100%; 
}

#about::before{
	content: '';
	display: block;
	position: absolute;
	height: 100px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
	top: -100px;
	width: 100%;
}

.section-box .main-area{
	padding-bottom: 0;
}

.about{
	position: relative;
	overflow: hidden;
}

.papaya{
	position: absolute;
	right: 0;
	top: 30%;
	transform: translateY(-50%);
	display: block;
	background: url("../img/dec/papaya-etc.png") no-repeat;
	background-size: cover;
	width: 40vw;
	max-width: 650px;
	aspect-ratio: 52/40;
	z-index: 1;
}


.about .main-area {
	position: relative;
	z-index: 2;
}

@media(max-width: 1200px){

	.papaya {
		top: 40%;
    	width: 50vw;
	}
	
}


@media(max-width: 800px){
	.about .section-photo span {
    	background: url(../img/top/about-photo-sp.jpg) no-repeat;
    	background-size: cover;
    	aspect-ratio: 1/1;
	}
	
	.papaya {
		top: 40%;
    	width: 70vw;
	}
	
}


@media(max-width: 600px){
	
	.papaya {
		top: auto;
		bottom: 20%;
	}

}


/* 私たちについて　//*/


/*　Jammelierについて　*/

#jammelier{
	position: relative;
	z-index: 4;
	background: #fff;
}




#jammelier .section-box::before {
    background: url("../img/title/jammelier.png");
    background-size: cover;
    aspect-ratio: 200 / 31;
    width: calc(70vw * calc(200 / 120));
	max-width: 95vw;
	top: 50px;
}

#jammelier .main-area{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	position: relative;
	gap:50px;
	align-items: center;
}


.jam-dec{
	position: absolute;
	bottom: 0;
	right: 20px;
	width: 18vw;
	max-width: 300px;
	background: url("../img/dec/jam.png") no-repeat;
	background-size: cover;
	aspect-ratio: 35/20;
	display: block;
}

.jam-photo span{
	display: block;
	min-width: 25vw;
	background: url("../img/top/jammelier.png") no-repeat;
	background-size: cover;
	aspect-ratio:7/8;
}


@media(max-width:1200px){
	
	#jammelier .main-area {
    	justify-content: flex-start;
	}
	
}

@media(max-width: 1000px){
	
	#jammelier .main-area {
        justify-content: flex-start;
        flex-direction: column-reverse;
        align-items: flex-start;
    }
	
	.jam-photo{
		width: 100%;
	    min-width: 100%;
	}
	
	#jammelier .main-area {
    	gap: 0;
	}
	
	.jam-dec{
		display: none;
	}
	

}


/*　Jammelierについて　///*/





/*　農園について　*/

#farm{
	background: #fff;
	position: relative;
	z-index: 4;
	padding-bottom: 100px;
}

#farm .section-box::before {
    background: url("../img/title/farm.png") no-repeat;
    background-size: cover;
	aspect-ratio: 160/26;
}

#farm .section-photo span {
	background: url("../img/top/farm-photo.jpg") no-repeat;
	background-size: cover;
}


@media(max-width: 1200px){
	
	#farm {
		padding-bottom: 80px;
	}
	
}

@media(max-width: 1000px){
	
	#farm {
		padding-bottom: 50px;
	}
	
}


@media(max-width: 800px){
	#farm .section-photo span {
		background: url(../img/top/farm-photo-sp.jpg) no-repeat;
		background-size: cover;
		aspect-ratio: 1/1;
	}
}

/*　農園について　///*/


/* link-box */

#products{
	position: relative;
}


#products::before{
	position: absolute;
	content: '';
	display: block;
	background: url("../img/dec/brand.png") no-repeat;
	background-size: cover;
	width: 25vw;
	aspect-ratio: 5/3;
	top: -100px;
	right: 0;
}


.link-box{
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	aspect-ratio: 2/1;
	z-index: 4;
	position: relative;
}

.link-box-photo{
	width: 100%;
	aspect-ratio: 1/1;
}

.link-box-photo span{
	display: block;
	background: url("../img/top/products-lineup.jpg") no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
}

.link-box-content {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: url("../img/bk/paper-bk.jpg") repeat;
	background-size: contain;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	text-align: center;
}

.link-box-content .title{
	margin-bottom: 30px;
}

.link-box-content .title h3{
	position: relative;
}

.link-box-content .title h3::before{
	display: block;
	position: absolute;
	content: '';
	background: url("../img/dec/herb.png") no-repeat;
	background-size: cover;
	aspect-ratio: 3 / 4;
    width: 40px;
	top: 50%;
	left: -60px;
	transform: translateY(-50%);
}

.link-box-content .title h3::after{
	display: block;
	position: absolute;
	content: '';
	background: url("../img/dec/herb.png") no-repeat;
	background-size: cover;
	aspect-ratio: 3 / 4;
    width: 40px;
	top: 50%;
	right: -60px;
	transform: translateY(-50%) scale(-1,1);
}

#oem-service{
	position: relative;
	flex-direction: row-reverse;
	padding-bottom: 100px;
	background: #fff;
}

#oem-service .link-box-photo span{
	background: url("../img/top/oem-image.jpg") no-repeat;
	background-size: cover;
}

#oem-service::before{
	content: '';
	display: block;
	position: absolute;
	background: url("../img/dec/brand.png") no-repeat;
	background-size: cover;
	width: 25vw;
	aspect-ratio: 5/3;
	left: 0;
	bottom: 0;
	transform: scale(-1,1);
}


@media(max-width: 1000px){
	
	.link-box-content .title {
		margin-top: 30px;
	}
	
	.link-box {
    	flex-direction: column-reverse!important;
	}
	
	.link-box {
		aspect-ratio: inherit;
		height: auto;
	}
	
	.link-box-content {
		aspect-ratio: inherit;
		height: auto;
		padding: 50px 10vw;
	}
	
	.link-box-content .main-text p span{
		display: inline-block;
	}
	
	.link-box-photo span {
		background-position: center;
	}
	
	
	
}

@media(max-width: 800px){
	
	#products::before {
		width: 30vw;
	}
	
	
	#oem-service::before {
    	width: 30vw;
	}
}


@media (max-width: 600px) {
	
	.link-box-content {
        padding: 50px 20px;
    }
	
	.link-box-content .main-text p {
		text-align: left;	
	}
	
    .link-box-content .main-text p span {
        display: inline;
    }
	
	#products::before {
        width: 35vw;
        top: -60px;
		min-width: 170px;
	}
	
	
	#oem-service::before {
    	width: 35vw;
		bottom: 20px;
		min-width: 170px;
	}
	
	
}
/* link-box ///*/


/*　お知らせ　*/

#home-news{
	background: #fff;
	position: relative;
	z-index: 4;
}

.home-news{
	position: relative;
	padding-bottom: 100px;
}

#home-news .section-box::before {
    position: absolute;
    content: '';
    display: block;
    background: url(../img/title/news.png);
    background-size: cover;
}

#home-news .main-area{
	display: flex;
	align-items: center;
	flex-direction: column;
}

#home-news .main-title{
	margin-bottom: 50px;
	display: inline-block;
}

/*　お知らせ　///*/



/* 大きいギャラリー */

#home-gallery{
	background: #fff;
	position: relative;
	z-index: 4;
	display: flex;
	flex-direction: row;
	overflow: hidden;
}

.gallery-left {
	width: 100%;
	aspect-ratio: 1/1;
	display: block;
}

.gallery-left span{
	display: block;
	background: url("../img/top/gallery-01.jpg") no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
}

.gallery-right {
	width: 100%;
	aspect-ratio: 1/1;
	display: block;
}

.gallery-rt span{
	display: block;
	background: url("../img/top/gallery-02.jpg") no-repeat;
	background-size: cover;
	width: 100%;
	aspect-ratio: 2/1;
}

.gallery-rb span{
	display: block;
	background: url("../img/top/gallery-03.jpg") no-repeat;
	background-size: cover;
	width: 100%;
	aspect-ratio: 2/1;
}


@media(max-width: 800px){
	
	#home-gallery {
    	flex-direction: column;
	}
	
}


/* 大きいギャラリー ///*/