@charset 'UTF-8';

/* 
	mv
*/
.mv-container {
	max-width: 1920px;
	margin: 0 auto;
}
.mv-img-div {
	position: relative;
}

.mv-msg {
	text-align: center;
	position: absolute;
	top: 34%;
	right:0;
	left:0;
	margin: 0 auto;
}

.mv-msg img {
	width: 1000px;
	max-width: 46%;
	animation: fadein 3s forwards;
}

.mv-grape-img {
	position: absolute;
	width: auto;
	top: 11%;
	right:0;
	height: 22%;
}

.mv-wine-img {
	position: absolute;
	top: 39%;
	width: auto;
	height: 38%;
	left:-3.5%;
}

.mv-img {
	width: 90%;
	display: block;
	margin: 0 auto;
}

@media screen and (max-width: 750px) {
	.mv-img {
		width: 100%;
	}
	.mv-msg img {
		max-width: 77%;
	}

	.mv-grape-img {
		top: -4.5%;
		right:0;
	}
	
	.mv-wine-img {
		top: auto;
		left:-3.5%;
		bottom: -5.5%;
	}
}

/* 
	our story
*/

.our-story-container {
	display: flex;
	position: relative;
	justify-content: space-between;
	width: 80%;
	max-width: 2000px;
	margin: 0 auto 110px;
}

.our-story-container h2 {
	margin-top: 40px;
	color: #673E16;
	font-size: 5rem;
	font-weight: 700;
	letter-spacing: .25rem;
}

.our-story-container h3 {
	color: #673E16;
	font-size: 1.25rem;
	font-weight: 700;
}

.our-story-container p {
	margin: 26px 0 32px;
	line-height: 32px;
}

.os-img {
	position: absolute;
	width: 620px;
	bottom: -7px;
	left: -24px;
}

.our-story-container > div {
	width: 45%;
}

@media screen and (max-width: 1500px) {
	.our-story-container {
		flex-wrap: wrap;
		flex-direction: column-reverse;
		margin: 0 auto 90px;
	}

	.our-story-container > div {
		width: 100%;
	}

	.os-img {
		position: inherit;
		bottom: auto;
		margin: 60px auto;
		display: none;
		/* width: 70%; */
		/* max-width: 560px; */
	}

	.our-story-container p {
		margin: 26px 5% 32px 0;
	}


}

@media screen and (max-width: 750px) {
	.our-story-container {
		margin: 0 auto;
	}
	.our-story-container h2 {
		font-size: 3rem;
	}
	
	.our-story-container p {
		margin: 26px 0 32px;
		line-height: 24px;
	}

	.os-img {
		width: 90%;
		margin: 50px auto 45px;
		display: block;
	}
}

/* 
	news
*/
.news-container {
	background-image: url(../img/common/bg-tree.png);
	width: 90%;
	max-width: 1600px;
	padding: 100px;
	margin: 140px auto 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.news-container h2 {
	color: #FFF;
	font-size: 3.75rem;
	font-weight: 700;
	letter-spacing: .18rem;
}
.news-container h3 {
	color: #FFF;
	font-size: 1.5rem;
	font-weight: 700;
}

.news-container > div:first-child {
	width: 30%;
}

.news-container > div:last-child {
	width: 70%;
}



@media screen and (max-width: 1700px) {
	.news-container {
		margin: 100px auto 0;
	}
}

@media screen and (max-width: 1300px) {
	.news-container {
		width: 100%;
		padding: 50px;
	}
	
	.news-container h2 {
		font-size: 2.5rem;
		letter-spacing: .18rem;
	}
	.news-container h3 {
		font-size: 1.2rem;
		line-height: 50px;
		margin-left: 15px;
	}

	.news-container .read-more-btn {
		display: none;
	}

	.news-container > div:first-child {
		width: 100%;
	}
	
	.news-container > div:last-child {
		width: 100%;
	}

	.news-h-div {
		display: flex;
		margin-bottom: 20px;
	}

}

@media screen and (max-width: 750px) {
	.news-container {
		padding: 40px 25px;
	}
	.news-container h2 {
		font-size: 2rem;
	}
	.news-container h3 {
		font-size: 1.1rem;
		line-height: 35px;
	}
	.news-container {
		margin: 60px auto 0;
		width: 100%;
	}
}

/* 
	製品
*/
.products-container {
	background-image: url(../img/home/bg-scenery.png);
	background-position: bottom;
	background-repeat: no-repeat;
	width: 100%;
	padding: 110px 5% 130px;
	background-size: 100% auto;
}

.products-container .flex {
	display: flex;
}

.products-container .flex > div {
	width: 50%;
}

.products-container .flex .product-img {
	width: 100%;
}

.products-container h2 .body {
	font-size: 3.75rem;
	font-weight: 700;
	letter-spacing: 3px;
	text-shadow:
	1px 1px 0px #673E16, -1px -1px 0px #673E16,
   -1px 1px 0px #673E16,  1px -1px 0px #673E16,
	1px 0px 0px #673E16, -1px  0px 0px #673E16,
	0px 1px 0px #673E16,  0px -1px 0px #673E16;

	color:#F7F2EE;
}

.products-container h2 .initial {
	color: #673E16;
	font-size: 6.25rem;
	font-weight: 700;
	letter-spacing: 5px;
}

.flex-contents {
	display: inline-flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}

.products-container .contents-div {
	width: 430px;
}

.products-container .contents-div p {
	margin: 10px 0 50px;
	line-height: 32px; 
}

.max-width-1600 {
	max-width: 1600px;
	margin: 0 auto;
}

@media screen and (max-width: 1100px) {
	.products-container {
		padding: 90px 5% 60px;
	}
	.products-container .flex > div {
		width: 100%;
	}
	.products-container .flex {
		flex-direction: column;
	}
	.products-container .flex:first-child {
		flex-direction: column-reverse;
	}

	.products-container .contents-div {
		width: 530px;
		margin: 180px auto;
	}
	
}

@media screen and (max-width: 750px) {

	.products-container {
		background-image: url(../img/home/bg-scenery_sp.png);
	}

	.products-container {
		padding: 50px 0;
	}

	.products-container .contents-div {
		width: 75%;
		margin: 35px auto 75px;
	}

	.products-container h2 .body {
		font-size: 3.75rem;
		letter-spacing: 2px;
	}
	
	.products-container h2 .initial {
		font-size: 5rem;
		letter-spacing: 3.2px;
	}
}

/* 
	about
*/
.about-container {
	width: 78%;
	margin: 130px auto;
	max-width: 1600px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.about-container .about-link {
	display: block;
	position: relative;
	width: 48%;
	overflow: hidden;
	margin-bottom: 60px;
}

.about-container .about-link .wrapper {
	border-radius: 10px;
	display:flex;
	gap:0 40px;
	overflow: hidden;
	background-color: #000;
}
.about-container .banner-text-div {
	position: absolute;
	width: 100%;
	top: 50%;
    left: 10%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.about-container .banner-img {
	width: 100%;
	border-radius: 10px;
	transition: .8s;
}


.about-container .en {
	color: #FFF;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 1.2px;
}

.about-container .title {
	color: #FFF;
	font-size: 3rem;
	font-weight: 700;
}

.about-container .banner-text-div > img {
	position: absolute;
	width: 74px;
	top: 50%;
    right: 15%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	transition: .5s;
}

/* pcのみ */
@media screen and (min-width: 751px) {
	.about-container .about-link:hover .banner-img {
		transform:scale(1.1);
		opacity: 0.5;
	}
	.about-container .about-link:hover .banner-text-div img {
		right: 14%;
	}
}

@media screen and (max-width: 1350px) {
	.about-container .en {
		font-size: 1.2rem;
	}
	
	.about-container .title {
		font-size: 2.5rem;
	}

	.about-container .banner-text-div > img {
		width: 60px;
	}
}

@media screen and (max-width: 1100px) {
	.about-container {
		margin: 90px auto;
	}
	.about-container .about-link {
		width: 100%;
		margin-bottom: 35px;
	}

}

@media screen and (max-width: 750px) {
	.about-container .about-link {
		margin-bottom: 20px;
	}
	.about-container {
		width: 90%;
		margin: 60px auto;
	}
	.about-container .about-link {
		width: 100%;
	}
	.about-container .en {
		font-size: 1.1rem;
	}
	
	.about-container .title {
		font-size: 2rem;
	}

	.about-container .banner-text-div > img {
		width: 45px;
	}
}

/* 
	blog
*/
.blog-container {
	width: 78%;
	margin: 130px auto;
	max-width: 1600px;
}

.blog-container .h-div {
	display: flex;
}

.blog-container .blog-contents-div .flex {
	display: flex;
	justify-content: space-between;
	/* gap: 0 30px; */
}

.blog-contents-div .flex > article {
    width: 32%;
}

.blog-container h2 {
	color: #673E16;
	font-size: 5rem;
	font-weight: 700;
	letter-spacing: 4px;
	margin-right: 50px;
	margin-bottom: 40px;
}

.blog-container .read-more-btn {
	margin-top: 24px;
	border-bottom: 2px solid #673E16;
}

.blog-contents-div .tag {
	display: inline-block;
	color: #413030;
	font-weight: 700;
	line-height: 32px;
	margin: 7px 7px 10px 0;
}

.blog-contents-div .title {
	margin: 15px 0 7px;
	padding: 0 3%;
	color: #413030;
	line-height: 28px;
}

.blog-contents-div .date {
	color: #413030;
	line-height: 32px;
	padding: 0 3%;
	height: 32px;
}

.blog-container .sp-btn {
	display: none;
}

.msg-slide-container .title-container {
	max-width: 2000px;
	width: 72%;
	margin: 0 auto;
}
.msg-slide-container .title-container .flex {
	display: flex;
	align-items: baseline;
	gap: 30px;

}
.msg-slide-container .title-container .title{
	font-size: 3rem;
    letter-spacing: 1.6px;
    margin-bottom: 0;
	color: #673E16;
}
/* .msg-slide-container .flex p {
	color: #673E16;
    font-size: 1.25rem;
    font-weight: 700;
} */
.msg-slide-container .title-container .text {
	margin: 12px 0 36px;
	font-size: 1.25rem;
}

@media screen and (max-width: 1500px) {
	.msg-slide-container .title-container {
		max-width: 2000px;
		width: 80%;
		margin: 0 auto;
	}
}

@media screen and (max-width: 1100px) {
	.blog-container .read-more-btn {
		display: none;
	}
	.blog-container .blog-contents-div .flex {
		gap: 0;
	}
	.card02 {
		overflow: hidden;
	}
	.swiper {
		overflow: visible;
	}
	.swiper-controller {
		display: flex;
		gap: 1.6rem;
		align-items: center;
		justify-content: flex-end;
		margin-top: 3.2rem;
	}
	.swiper-pagination {
		margin-right: auto;
	}
	.swiper-slide {
		width: 32rem;
	}

	.swiper-pagination {
		display: flex;
	}

	.swiper-pagination-bullet {
		background-color: #673E16!important;
		width: 20px!important;
		height: 4px!important;
		border-radius: 0%!important;
	}

	.swiper-pagination-bullet-active {
		width: 38px!important;
	}
	
	.blog-container {
		width: 100%;
		padding-left: 24px;
		margin: 60px auto;
	}

	.blog-container h2 {
		font-size: 2.4rem;
		letter-spacing: 1.6px;
		margin-bottom: 0;
	}

	.blog-contents-div .tag {
		display: inline-block;
		color: #413030;
		font-weight: 700;
		line-height: 32px;
		margin: 7px 7px 10px 0;
	}
	.blog-card-div {
		background-color: #fff;
		padding-bottom: 10px;
	}
	
	.blog-contents-div .title {
		margin: 7px 0 3px;
		/* padding: 0 3%; */
		line-height: 16.7px;
	}
	
	.blog-contents-div .date {
		color: #413030;
		line-height: 20px;
		height: 20px;
	}

	.blog-container .sp-btn {
		display: block;
		margin: 11px auto;
		width: 130px;
	}

	.blog-contents-div .flex > article {
		width: 100%;
	}
	.msg-slide-container .title-container .flex {
		gap: 20px;
	}
	.msg-slide-container .title-container .title{
		letter-spacing: 1.4px;
	}
}

/* 
	insta
*/
.insta-container {
	border-radius: 200px 200px 0px 0px;
	background: #FFF;
	width: 100%;
}

.insta-wrapper {
	width: 78%;
	margin: 0 auto;
	padding: 80px 0;
	max-width: 1600px;
}

.insta-container .en {
	color: #673E16;
	text-align: center;
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 51px;
	letter-spacing: 1.4px;
}
.insta-container h2 img {
	width: 282px;
	margin: 0 auto 27px;
	display: block;
}
.insta-container ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.insta-container li {
	width: 19%;
	margin-bottom: 7px;
}


.msg-slide-container .sp {
	display: none;
}
.insta-container .btnLink {
	margin: 60px auto 0;
}

@media screen and (max-width: 500px) {
	.msg-slide-container .sp {
		display: block;
	}
}

@media screen and (max-width: 750px) {
	.insta-container {
		border-radius: 60px 60px 0px 0px;
	}
	.insta-wrapper {
		width: 90%;
		/* margin: 0 auto; */
		padding: 52px 0;
	}

	.insta-container li:last-child {
		display: none;
	}
	.insta-container li {
		width: 32%;
		margin-bottom: 5px;
	}
	.insta-container .en {
		font-size: 1.1rem;
		line-height: 29px;
		letter-spacing: 0.8px;
	}
	.insta-container h2 img {
		width: 160px;
		margin: 0 auto 23px;
	}
	.insta-container .btnLink {
		margin: 35px auto 0;
	}
	.msg-slide-container .title-container .flex {
		align-items: inherit;
		gap: 0px;
		flex-direction: column;
	
	}
	.msg-slide-container .title-container .title{
		font-size: 2rem;
		letter-spacing: 1px;
		line-height: 1.5;
	}
	.msg-slide-container .flex p {
		font-size: 1rem;
	}
	.msg-slide-container .title-container .text{
		margin: 12px 0 28px;
	}
}


/* 
	ショップ
*/
.shop-container {
	background-image: url(../img/common/bg-tree.png);
	background-size:cover;
}

.shop-wrapper {
	width: 85%;
	margin: 0 auto;
	padding: 8.12% 0;
	max-width: 1600px;
	display: flex;
}

@media screen and (max-width: 750px) {
	.shop-wrapper {
		width: 88%;
		padding: 68px 0;
		flex-direction: column;
	}
	.shop-wrapper > a:first-child {
		margin-bottom: 20px;
	}
}

/* 
	slide
*/
/*
右から左へ
----------------------------*/
@keyframes infinity-scroll-left {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(-100%);
	}
}

@keyframes infinity-scroll-right {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0);
	}
}
  
/*
IE11対策
----------------------------*/
_:-ms-lang(x)::-ms-backdrop,
.d-slide {
	display: -ms-grid;
	overflow: hidden;
}
/*----------------------------*/
.d-slide {
	/* margin : 40px 0; */
}
.d-slide__wrap {
	display: flex;
	overflow: hidden;
}
  
.d-slide__list {
	display: flex;
	list-style: none;
}

.d-slide__list--left{
	animation :infinity-scroll-left 95s infinite linear 0.5s both;
}

.d-slide__list--right{
	animation :infinity-scroll-right 95s infinite linear 0.5s both;
	}

.slide__wrap:hover .d-slide__list--left{
	animation-play-state: paused;
}
.slide__wrap:hover .d-slide__list--right{
	animation-play-state: paused;
}
.d-slide_msg_item img {
	width: auto;
	height: 309px;
}

@media screen and (max-width: 1700px) {

	.d-slide_msg_item img {
		height: 220px;
	}
}

@media screen and (max-width: 750px) {

	.d-slide_msg_item img {
		height: 170px;
	}
}