@charset "utf-8";

section{
	max-width: 1160px;
	width:90%;
	margin: 120px auto;
	text-align: left;
}

/*見出し*/

section h1{
	margin: auto;
	text-align: left;
}
section h1 span{
	font-size: 2.4rem;
	color: #fff;
	background: #7f7f7f;
	display: inline-block;
	margin: auto;
	padding: 0 14px ;
	line-height: 1.4;
	font-weight: 400;	
}
section h2{
	margin: 50px auto;
	text-align: left;
}
section h2 span{
	font-size: 2.4rem;
	display: inline-block;
	line-height: 1.4;
	font-weight: 400;
}
section h2 b{
	border-bottom: #000 1px solid;
	padding: 0 114px;
	position: relative;
	top: -12px;
	margin-left: 20px;
}

section h3{
	margin: auto auto 10px;
	text-align: left;
	font-size: 9.0rem;
	display: block;
	line-height: 1;
	font-weight: 400;
	letter-spacing: 0.1rem;
}
section h4{
	margin: auto;
	text-align: left;
	font-size: 2.0rem;
	display: block;
	line-height: 1.8;
	font-weight: bold;
}
section .ttl{
	font-size: 20px;
}
section p{
	font-size: 1.4rem;
	line-height: 2.4;
}

@media screen and (max-width: 750px) {
#wrap{
		width: 100%;
	}
section{
	width:100%;
	margin: 60px auto;
}
/*幅*/

section h1,
section h2,
section ul,
section .ttl,
section p,
section.line_up li{
		width: 90%;
	margin-left: auto;
	margin-right: auto;
	}
section.line_up ul,
section .winery_pic{
		width: 100%;
	}
	
/*見出し*/

section h1{
	margin: auto;
	text-align: center;
}
section h1 span{
	font-size: 1.8rem;
	color: #fff;
	background: #7f7f7f;
	display: block;
	margin: auto;
	padding: 0 14px ;
	line-height: 1.4;
}
section h2{
	margin: 20px auto 10px;
	text-align: center;
	line-height: 1;
}
section h2 span{
	font-size: 1.8rem;
	display: inline-block;
	line-height: 1;
	background: #fff;
	position: relative;
	z-index: 1;
	padding: 0 4px;
}
section h2 b{
	display: block;
	border-bottom: #000 1px solid;
	padding: 0;
	position: relative;
	z-index: 0;
	top: -10px;
	margin: auto;
}

section h3{
	margin: auto auto 10px;
	text-align: center;
	font-size: 8.0rem;
	display: block;
	line-height: 1;
}
section h4{
	margin: auto;
	text-align: center;
	font-size: 1.6rem;
	display: block;
	line-height: 1.8;
}
section .ttl{
	font-size: 1.8rem;
	line-height: 1.6;
}
section p{
	font-size: 1.4rem;
	line-height: 2.4;
}
}


/***producer***/
.producer{
	margin-top: 250px;
	
}
.producer ul{
	margin: 50px auto;
	display: flex;
	justify-content: space-between;
}
.producer ul li{
	width: 50%;
	margin:auto;
	align-items: center;
}
.producer ul li:first-child{
	border-right: #000 1px solid;
	box-sizing: border-box;
}
.producer ul li:nth-child(2){
	display: flex;
	justify-content: center;
	align-content: center;
}

.producer ul li:nth-child(2) img{
	display: block;
	margin: auto;
	width: 95%;
	max-width: 300px;
	height: auto;
}

.winery_pic{
	width: 90%;
	margin: 80px auto;
	display: flex;
	justify-content: center;	
}
.winery_pic li{
	position: relative;
	overflow: hidden;
	padding-top: 30%; /* 比率 */
}
.winery_pic img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
font-family: 'object-fit: cover;'; /*IE対策*/
}

.winery_pic li.pic_1{
	flex-basis: 10%;
}
.winery_pic li.pic_2{
	flex-basis: 20%;
}
.winery_pic li.pic_3{
	flex-basis: 30%;
}
.winery_pic li.pic_4{
	flex-basis: 40%;
}
.winery_pic li.pic_5{
	flex-basis: 50%;
}
.winery_pic li.pic_6{
	flex-basis: 60%;
}
.winery_pic li.pic_7{
	flex-basis: 70%;
}
.winery_pic li.pic_8{
	flex-basis: 80%;
}
.winery_pic li.pic_9{
	flex-basis: 90%;
}
.winery_pic li.pic_10{
	flex-basis: 100%;
}

@media screen and (max-width: 750px) {
.producer{
	margin-top: 140px;
	
}
.producer ul{
	margin: auto;
	display: block;
}
.producer ul li{
	width: 100%;
	border:none;
	margin: auto auto 30px;
}
.producer ul li:first-child{
	border:none;
}
	
.winery_pic{
	width: 100%;
	margin: 40px auto;
}
.winery_pic li{
	padding-top: 50%; /* 比率 */
}
	
}


/***LINE UP***/

.line_up li{
	width: 90%;
	margin: 80px auto;
	display: flex;
}
.line_up li div{
	margin:auto;
}
.line_up li div:first-child{
	width: 18%;
}
.line_up li div:first-child img{
	width: 55%;
	margin:auto;
}
.line_up li div:first-child img.w_94{
	width: 94%;
}
.line_up li div:nth-child(4){
	width: 82%;
}
.line_up li h5{
	margin:auto;
	font-size: 4.5rem;
	font-weight: normal;
	line-height: 1;
	padding-bottom: 15px;
	letter-spacing: 0.1rem;
}
.line_up li h6{
	margin:auto;
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 1;
	padding: 15px 0;
}
.line_up li h7{
	margin:auto;
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1;
}
.line_up li p{
	margin:20px auto auto;
	padding-top: 20px;
	border-top: 1px solid #000;
}
.line_up li em{
	font-size: 1.4rem;
	font-style: normal;
	line-height: 2.4;
	padding-top: 20px;
	display: block;

}
.line_up li a{
	font-size: 1.4rem;
	font-style: normal;
	line-height: 1;
	margin-top: 20px;
	padding: 10px 20px;
	display: inline-block;
	border: 1px solid #000;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";

}

@media screen and (max-width: 750px) {
/***LINE UP***/

.line_up li{
	margin: 40px auto;
	flex-wrap: wrap;
}
.line_up li div:first-child{
	width: 22%;
}
.line_up li div:first-child img{
	width: 83%;
	margin:auto;
}
.line_up li div:nth-child(2){
	width: 78%;
}
.line_up li div:nth-child(3){
	width: 100%;
}
.line_up li h5{
	font-size: 3.0rem;
}
.line_up li h6{
	font-size: 1.4rem;
}
.line_up li h7{
	font-size: 1.2rem;
}
.line_up li p,
.line_up li em{
	width: 100%;
	font-size: 1.2rem;
}
.line_up li a{
	    width: 40%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
	.line_up li p{
		border: none;
		margin-top: auto;
		padding-top: 0;
	}

}