.mbeer{
  --ink:#302821;
  --sub:#66625d;
  --line:#e9d9c3;
  --paper:#fff;
  --soft:#fff5e7;
  --beer:#ffd83d;
  --beer-deep:#b6470c;
  --navy:#9c2020;
  --navy2:#8b261d;
  --green:#b6470c;
  --max:1120px;
  color:var(--ink);
  background:var(--paper);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic",Meiryo,sans-serif;
  line-height:1.85;
  letter-spacing:.02em;
}
.mbeer *{box-sizing:border-box}
.mbeer a{text-decoration:none}
.mbeer__wrap{width:min(var(--max),calc(100% - 40px));margin:0 auto}
.mbeer__section{padding:76px 0}
.mbeer__section--soft{background:var(--soft)}
.mbeer__section--dark{background:var(--navy2);color:#fff}
.mbeer__eyebrow{
  margin:0 0 12px;
  color:var(--beer-deep);
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
}
.mbeer__section--dark .mbeer__eyebrow{color:#f1c75a}
.mbeer h1,.mbeer h2,.mbeer h3,.mbeer p{margin-top:0}
.mbeer h1{
  margin-bottom:20px;
  font-size:clamp(35px,5.2vw,62px);
  line-height:1.2;
  letter-spacing:-.025em;
}
.mbeer h2{
  margin-bottom:18px;
  font-size:clamp(28px,3.7vw,43px);
  line-height:1.35;
  letter-spacing:-.018em;
}
.mbeer h3{
  margin-bottom:9px;
  font-size:21px;
  line-height:1.5;
}
.mbeer__lead{
  max-width:790px;
  margin-bottom:0;
  color:#4f4b45;
  font-size:17px;
}
.mbeer__hero{
  overflow:hidden;
  padding:66px 0 58px;
  background:
    radial-gradient(circle at 85% 20%,rgba(236,175,48,.26),transparent 28%),
    linear-gradient(135deg,#fffaf0 0%,#fff 52%,#f7f1e4 100%);
}
.mbeer__hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);
  gap:56px;
  align-items:center;
}
.mbeer__hero strong{color:#9b6100} .mbeer__hero-photo{margin:40px 0 0;overflow:hidden;border:1px solid #d7c7a5;background:#ece6da;box-shadow:0 18px 50px rgba(43,34,15,.10)} .mbeer__hero-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center 58%}
.mbeer__pricebox{
  position:relative;
  padding:34px;
  border:1px solid #d7c7a5;
  background:rgba(255,255,255,.88);
  box-shadow:0 18px 50px rgba(43,34,15,.08);
}
.mbeer__pricebox:before{
  content:"SUPER DRY";
  display:block;
  margin-bottom:12px;
  color:var(--beer-deep);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
}
.mbeer__price-main{
  display:flex;
  gap:10px;
  align-items:flex-end;
  margin-bottom:9px;
}
.mbeer__price-main b{
  font-size:clamp(48px,7vw,78px);
  line-height:.95;
  letter-spacing:-.04em;
}
.mbeer__price-main span{
  padding-bottom:7px;
  font-size:17px;
  font-weight:800;
}
.mbeer__pricebox p{margin-bottom:0;color:#5c554a}
.mbeer__price-points{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:23px;
}
.mbeer__price-point{
  padding:11px 12px;
  background:#f8f3e8;
  font-size:13px;
  font-weight:800;
  text-align:center;
}
.mbeer__facts{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.mbeer__fact{
  padding:23px 15px;
  text-align:center;
  border-right:1px solid var(--line);
}
.mbeer__fact:last-child{border-right:0}
.mbeer__fact b{
  display:block;
  margin-bottom:2px;
  font-size:17px;
}
.mbeer__fact span{color:var(--sub);font-size:12px}
.mbeer__heading{
  display:flex;
  justify-content:space-between;
  gap:34px;
  align-items:flex-end;
  margin-bottom:34px;
}
.mbeer__heading p{
  max-width:570px;
  margin-bottom:4px;
  color:var(--sub);
}
.mbeer__set{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid var(--line);
}
.mbeer__set-item{
  padding:28px 23px;
  border-right:1px solid var(--line);
  background:#fff;
}
.mbeer__set-item:last-child{border-right:0}
.mbeer__set-num{
  display:inline-flex;
  width:30px;
  height:30px;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
  border-radius:50%;
  background:var(--navy);
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.mbeer__set-item p{margin:0;color:var(--sub);font-size:14px}
.mbeer__note{
  margin-top:20px;
  padding:18px 20px;
  border-left:3px solid var(--beer);
  background:#fffaf0;
  color:#5d574e;
  font-size:14px;
}
.mbeer__number{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:46px;
  align-items:center;
}
.mbeer__big{
  padding:34px;
  border:1px solid var(--line);
  background:#fff;
}
.mbeer__big-label{
  color:var(--beer-deep);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
}
.mbeer__big-num{
  display:block;
  margin:6px 0 8px;
  font-size:clamp(56px,8vw,94px);
  font-weight:900;
  line-height:1;
  letter-spacing:-.05em;
}
.mbeer__big p{margin-bottom:0;color:var(--sub)}
.mbeer__scene{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.mbeer__scene-card{
  min-height:178px;
  padding:25px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  border:1px solid #dccca9;
  background:linear-gradient(145deg,#fff8e5,#fff);
}
.mbeer__scene-card b{font-size:25px}
.mbeer__scene-card span{color:var(--sub);font-size:13px}
.mbeer__features{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.mbeer__feature{
  padding:27px 24px;
  border-top:3px solid var(--beer);
  background:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.035);
}
.mbeer__feature p{margin:0;color:var(--sub);font-size:14px}
.mbeer__feature strong{color:var(--navy)}
.mbeer__flow{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:34px;
  border:1px solid var(--line);
}
.mbeer__flow-item{
  position:relative;
  padding:27px 22px;
  border-right:1px solid var(--line);
  background:#fff;
}
.mbeer__flow-item:last-child{border-right:0}
.mbeer__flow-step{
  display:block;
  margin-bottom:8px;
  color:var(--beer-deep);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
}
.mbeer__flow-item p{margin:0;color:var(--sub);font-size:14px}
.mbeer__reserve{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:44px;
  align-items:start;
}
.mbeer__reserve-box{
  padding:28px;
  border:1px solid rgba(255,255,255,.22);
}
.mbeer__reserve-box ul{
  margin:0;
  padding-left:1.2em;
}
.mbeer__reserve-box li{margin:7px 0;color:#ddd7cf}
.mbeer__section--dark p{color:#ddd7cf}
.mbeer__cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px;
}
.mbeer__btn{
  display:inline-flex;
  min-height:58px;
  align-items:center;
  justify-content:center;
  padding:14px 21px;
  border:1px solid rgba(255,255,255,.32);
  color:#fff!important;
  font-weight:900;
  text-align:center;
}
.mbeer__btn--primary{
  border-color:#fff;
  background:#fff;
  color:var(--navy2)!important;
}
.mbeer__btn:hover{opacity:.88}
.mbeer__conditions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.mbeer__condition{
  padding:22px 23px;
  border:1px solid var(--line);
  background:#fff;
}
.mbeer__condition b{
  display:block;
  margin-bottom:5px;
  font-size:17px;
}
.mbeer__condition p{margin:0;color:var(--sub);font-size:14px}
.mbeer__faq{border-top:1px solid var(--line)}
.mbeer__faq details{border-bottom:1px solid var(--line)}
.mbeer__faq summary{
  position:relative;
  padding:22px 42px 22px 0;
  cursor:pointer;
  font-weight:900;
  list-style:none;
}
.mbeer__faq summary::-webkit-details-marker{display:none}
.mbeer__faq summary:after{
  content:"+";
  position:absolute;
  right:5px;
  top:17px;
  color:var(--beer-deep);
  font-size:27px;
  font-weight:400;
}
.mbeer__faq details[open] summary:after{content:"−"}
.mbeer__faq-answer{
  padding:0 42px 22px 0;
  color:var(--sub);
  font-size:14px;
}
.mbeer__shop{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.mbeer__shop-card{
  padding:25px;
  border:1px solid var(--line);
  background:#fff;
}
.mbeer__shop-card b{display:block;font-size:18px}
.mbeer__shop-card p{margin:5px 0 0;color:var(--sub);font-size:14px}
.mbeer__shop-card a{color:var(--navy)!important;font-weight:900}
.mbeer__fine{
  margin-top:20px;
  color:var(--sub);
  font-size:12px;
}
.mbeer__usage-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:30px;
}
.mbeer__usage-card{margin:0}
.mbeer__usage-card img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--line);
  background:#fff;
}
.mbeer__guide-download{
  margin-top:24px;
  padding:20px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border:1px solid var(--line);
  background:var(--soft);
}
.mbeer__guide-download strong{display:block;font-size:17px}
.mbeer__guide-download span{display:block;margin-top:3px;color:var(--sub);font-size:13px}
.mbeer__guide-download a{
  display:inline-flex;
  min-height:50px;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  background:var(--navy);
  color:#fff!important;
  font-weight:900;
  white-space:nowrap;
}
@media(max-width:900px){
  .mbeer__hero-grid,.mbeer__number,.mbeer__reserve{grid-template-columns:1fr}
  .mbeer__facts{grid-template-columns:1fr 1fr}
  .mbeer__fact:nth-child(2){border-right:0}
  .mbeer__fact:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .mbeer__set{grid-template-columns:1fr 1fr}
  .mbeer__set-item{border-bottom:1px solid var(--line)}
  .mbeer__set-item:nth-child(2){border-right:0}
  .mbeer__set-item:nth-child(n+3){border-bottom:0}
  .mbeer__features{grid-template-columns:1fr 1fr}
  .mbeer__feature:last-child{grid-column:1/-1}
  .mbeer__flow{grid-template-columns:1fr 1fr}
  .mbeer__flow-item{border-bottom:1px solid var(--line)}
  .mbeer__flow-item:nth-child(2){border-right:0}
  .mbeer__flow-item:nth-child(n+3){border-bottom:0}
}
@media(max-width:620px){
  .mbeer__wrap{width:min(100% - 28px,var(--max))}
  .mbeer__section{padding:54px 0}
  .mbeer__hero{padding:45px 0}
  .mbeer__hero-grid{gap:32px} .mbeer__hero-photo{margin-top:28px} .mbeer__hero-photo img{aspect-ratio:1/1;object-position:center}
  .mbeer__heading{display:block;margin-bottom:24px}
  .mbeer__facts{grid-template-columns:1fr 1fr}
  .mbeer__set,.mbeer__features,.mbeer__flow,.mbeer__conditions,.mbeer__shop,.mbeer__scene{grid-template-columns:1fr}
  .mbeer__set-item,.mbeer__flow-item{
    border-right:0;
    border-bottom:1px solid var(--line)!important;
  }
  .mbeer__set-item:last-child,.mbeer__flow-item:last-child{border-bottom:0!important}
  .mbeer__feature:last-child{grid-column:auto}
  .mbeer__price-points{grid-template-columns:1fr}
  .mbeer__cta{display:grid;grid-template-columns:1fr}
  .mbeer__usage-grid{grid-template-columns:1fr}
  .mbeer__guide-download{display:block}
  .mbeer__guide-download a{width:100%;margin-top:16px;white-space:normal;text-align:center}
}

.mbeer__title-unit{display:inline-block}
.mbeer__cta--hero{display:grid;grid-template-columns:1fr;gap:10px;margin-top:24px}
.mbeer__cta--hero .mbeer__btn{width:100%;white-space:normal;text-align:center}
.mbeer__cta--hero>br{display:none}
.mbeer .mbeer__cta--hero .mbeer__btn--primary{background:#c62828!important;color:#fff!important;border:1px solid #c62828!important}
.mbeer .mbeer__cta--hero .mbeer__btn:not(.mbeer__btn--primary){background:#fff!important;color:#9c2020!important;border:1px solid #c45313!important}
.mbeer__pricebox .mbeer__fine{margin:12px 0 0}