@charset "utf-8";
/* -----------------------------------------------------------------------

drink.css

----------------------------------------------------------------------- */


/*----------------------------------------------------------

	mainimg
	
----------------------------------------------------------*/

#drink header {
	width:100%;
	height:428px;
	position:relative;
}
#drink header #mainimg {
	min-width:1060px;
	width:100%;
	height:428px;
	background:url(../img/drink/mainimg.jpg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-color:#000000;	
	background-size:cover;
	position:relative;
}
#drink header #mainimg::before{
	width:100%;
	height:120px;
	content: '';
	position: absolute;
	left:0;
	top:0;
	z-index:1;
	display: block;
	background: linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#drink header {
	height:240px;
}
#drink header #mainimg {
	min-width:320px;
	height:240px;
}
#drink header #mainimg::before{
	height:50px;
}

}



/*----------------------------------------------------------

	ttlBox
	
----------------------------------------------------------*/

.ttlBox {
	padding:40px 0 60px;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

.ttlBox {
	padding:30px 0 ;
}

}



/*----------------------------------------------------------

	drinkBox
	
----------------------------------------------------------*/

.drinkBox {
	width:100%;
	max-width:1020px;
	margin:0 auto;
	padding:0 10px;
	overflow:hidden;
	box-sizing:border-box;
}

.drinkBox h3{
	text-align:center;
	font-family:'SourceHanSerifJP';
}
.drinkBox h3 .eng{
	margin-right:12px;
	font-family: 'EB Garamond', serif;
}

.drinkBox .boxL {
	width:100%;
	padding:50px 10px 40px;
	border-top:1px solid #000000;
	box-sizing:border-box;
	overflow:hidden;
}
.drinkBox .boxL .box {
	padding:30px 10px 0 0;
	box-sizing:border-box;
}
.drinkBox > .boxS {
	padding:50px 10px 40px;
	border-top:1px solid #000000;
	box-sizing:border-box;
}
.drinkBox .boxIn {
	width:100%;
	padding:0;
	border:none;
}
.drinkBox .boxIn .boxS {
	width:100%;
	padding:50px 10px 40px;
	border-top:1px solid #000000;
	box-sizing:border-box;
}
.drinkBox .kttl{
	font-size:2.0rem;
	line-height:1.8em;
	letter-spacing:0.1em;
	color:#a58357;
	font-family: 'EB Garamond', serif;
}

.drinkBox .boxS .drinkList{
	padding-top:20px;
}
.drinkBox .drinkList > li{
	margin:18px 0;
	padding-left:1em;
	text-indent:-1em;
	font-size:1.4rem;
	line-height:1.8em;
	letter-spacing:0.02em;
	font-family:'SourceHanSerifJP';
	position:relative;
}
.drinkBox .drinkList li .price{
	padding:0;
	font-size:1.6rem;
	line-height:1.8em;
	letter-spacing:0.05em;
	text-indent:0;
	display:block;
}
.drinkBox .drinkList li .price .fsS{
	margin:0 3px 0 8px;
	font-size:1.0rem;
	display:inline-block;
}
.drinkBox .drinkList .inlist {
	padding-left:0;
	text-indent:0;
}
.drinkBox .drinkList .inlist ul {
	overflow:hidden;
}


/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width: 769px) {

.drinkBox {
	width:100%;
	max-width:1020px;
	margin:0 auto;
	padding:0 10px;
	overflow:hidden;
}

.drinkBox h3{
	font-size:1.6rem;
	line-height:2em;
	letter-spacing:0.1em;
}
.drinkBox h3 .eng{
	font-size:3.2rem;
}

.drinkBox .boxL {
	padding:50px 10px 40px;
}
.drinkBox .boxL .box {
	width:47.5%;
	float:left;
}
.drinkBox .boxL .box:nth-child(even){
	margin-right:5%;
}
.drinkBox > .boxS {
	width:47.5%;
	padding:50px 10px 40px;
	float:left;
}
.drinkBox >.boxS:nth-child(even){
	margin-right:5%;
}
.drinkBox .boxIn {
	padding:0;
	width:47.5%;
	float:left;
}
.drinkBox .boxIn .boxS {
	padding:50px 10px 40px;
}
.drinkBox .drinkList .inlist li{
	width:42.5%;
	float:left;
}
.drinkBox .drinkList li .price{
	text-align:right;
	position:absolute;
	top:0;
	right:0;
}

}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

.ttlBox {
	padding:40px 0 ;
}

.drinkBox h3{
	font-size:1.4rem;
	line-height:2em;
	letter-spacing:0.05em;
}
.drinkBox h3 .eng{
	font-size:2.6rem;
}
.drinkBox .kttl{
	margin-top:20px;
}

.drinkBox .boxL {
	padding:40px 10px 20px;
}
.drinkBox .boxL .box {
	padding:0px 10px 0 0;
}
.drinkBox .boxL .box .drinkList{
	padding-top:0px;
}
.drinkBox > .boxS {
	padding:40px 10px 20px;
}
.drinkBox .boxIn .boxS {
	padding:40px 10px 20px;
}
.drinkBox .boxS .drinkList{
	padding-top:10px;
}
.drinkBox .drinkList > li{
	margin:12px 0;
}

}