@charset "utf-8";

.beer-header{align-items:center;padding:0 3%;background:rgba(255,255,255,.86);}
.beer-header figure.logo{position:static;margin:0;width:30%;max-width:320px;}
.beer-nav{display:flex;align-items:center;gap:1.5rem;margin-right:1rem;}
.beer-nav a{font-size:.95rem;white-space:nowrap;}
.beer-nav li:last-child a{padding:.65rem 1.2rem;border:1px solid #8d6a21;color:#8d6a21;}

.beer-page-title{margin-top:70px;padding:7rem 5% 2rem;text-align:center;}
.beer-page-title h1{margin-bottom:2rem;font-family:"honoka",serif;font-size:2.4rem;line-height:1.4;}
.beer-page-title p{max-width:760px;margin:0 auto;line-height:2;}
.beer-breadcrumb{margin:1.5rem auto 3rem;}

.beer-main-image{width:80%;max-width:760px;margin:0 auto 6rem;}
.beer-main-image picture,.beer-main-image img{display:block;width:100%;height:auto;}

.beer-overview{width:80%;max-width:760px;margin:0 auto 7rem;text-align:center;}
.beer-overview h2{margin-bottom:2.5rem;font-family:"honoka",serif;font-size:2rem;line-height:1.4;}
.beer-overview dl{margin-bottom:3rem;text-align:left;border-top:1px solid #d6d0c3;}
.beer-overview dl div{display:grid;grid-template-columns:9rem 1fr;border-bottom:1px solid #d6d0c3;}
.beer-overview dt,.beer-overview dd{padding:1.2rem 1rem;line-height:1.8;}
.beer-overview dt{font-family:"honoka",serif;background:#f4f0e8;}

.beer-reserve{padding:3rem 2rem;background:#f7f4ed;text-align:center;}
.beer-reserve p{margin-bottom:1rem;line-height:1.8;}
.beer-reserve p:first-child{font-family:"honoka",serif;font-size:1.4rem;}
.beer-reserve a{margin:1rem auto;font-family:'Centaur',serif;font-size:3rem;line-height:1.2;color:#183027;}

@media screen and (max-width:1024px){
	.beer-nav{display:none;}
	.beer-header figure.logo{width:55%;}
}

@media screen and (max-width:640px){
	.beer-header figure.logo{width:76%;}
	.beer-page-title{padding:5rem 5% 1.5rem;}
	.beer-page-title h1{font-size:2rem;}
	.beer-main-image,.beer-overview{width:90%;}
	.beer-overview dl div{display:block;}
	.beer-overview dt,.beer-overview dd{display:block;width:100%;}
	.beer-reserve{padding:2.5rem 1rem;}
	.beer-reserve a{font-size:2.2rem;}
}