@charset "UTF-8";
/*  renewal-uril-parts により .ybs-rn に overflow: hidden が付与されるが、
    yebisubeer-kv の position:sticky を機能させるため overflow: clip で上書き
========================================================================= */
body.lineup-yebisubeer .ybs-rn {
  overflow: clip;
}

/*  yebisubeer
========================================================================== */
.yebisubeer-kv {
  background: no-repeat 50% 100%;
  background-size: cover;
  inset: 0;
  position: -webkit-sticky;
  position: sticky;
  z-index: -1;
}
@media (min-width: 769px) {
  .yebisubeer-kv {
    aspect-ratio: 32/15;
    background-image: url(/yebisu/product/yebisubeer/images/kv_bg01_pc.webp);
  }
}
@media (max-width: 768px) {
  .yebisubeer-kv {
    aspect-ratio: 96/125;
    background-image: url(/yebisu/product/yebisubeer/images/kv_bg01_sp.webp);
  }
}
.yebisubeer-kv__title {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.yebisubeer-kv__scroll {
  inset-block-end: 1.2857142857vw;
  inset-inline-end: 2.1428571429vw;
  position: absolute;
  width: 0.8571428571vw;
}
@media (max-width: 768px) {
  .yebisubeer-kv__scroll {
    inset-block-end: 2.34375vw;
    inset-inline-end: 3.90625vw;
    width: 1.8229166667vw;
  }
}
.yebisubeer-concept {
  display: grid;
}
@media (min-width: 769px) {
  .yebisubeer-concept {
    background: url(/yebisu/product/yebisubeer/images/concept_bg01_pc.webp) no-repeat 50% 50%;
    background-size: cover;
    grid-template-areas: ". body .";
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    min-height: 48.5416666667vw;
  }
}
@media (max-width: 768px) {
  .yebisubeer-concept {
    background: url(/yebisu/product/yebisubeer/images/concept_bg01_sp.webp) no-repeat 100% 100%;
    background-size: cover;
    grid-template-areas: ". . ." ". body ." ". . .";
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 48px auto 510px;
  }
}
.yebisubeer-concept__body {
  color: #601c1c;
  font-family: var(--ybs-serif);
  grid-area: body;
  max-width: 660px;
  padding-block: 9.7142857143vw;
  width: 47.1428571429vw;
  z-index: 1;
}
@media (max-width: 768px) {
  .yebisubeer-concept__body {
    -webkit-margin-before: 0;
            margin-block-start: 0;
    max-width: initial;
    padding-block: 0;
    width: auto;
  }
}
.yebisubeer-concept__title {
  font-size: 3.2rem;
  line-height: 1.7;
  -webkit-margin-after: 20px;
          margin-block-end: 20px;
}
@media (max-width: 768px) {
  .yebisubeer-concept__title {
    font-size: 1.9rem;
    line-height: 1.6904761905;
    -webkit-margin-after: 14px;
            margin-block-end: 14px;
  }
}
.yebisubeer-concept__sub {
  font-size: 3.4rem;
  line-height: 1.7941176471;
  -webkit-margin-after: 26px;
          margin-block-end: 26px;
}
@media (min-width: 769px) and (max-width: 1264px) {
  .yebisubeer-concept__sub br {
    display: none;
  }
}
@media (max-width: 768px) {
  .yebisubeer-concept__sub {
    font-size: 1.9rem;
    line-height: 1.7105263158;
    -webkit-margin-after: 15px;
            margin-block-end: 15px;
  }
}
.yebisubeer-concept__text {
  font-size: 2rem;
  line-height: 1.7;
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
@media (max-width: 768px) {
  .yebisubeer-concept__text {
    font-size: 1.7rem;
    line-height: 1.7058823529;
  }
}
.yebisubeer-concept__text + .yebisubeer-concept__text {
  -webkit-margin-before: 16px;
          margin-block-start: 16px;
}
@media (max-width: 768px) {
  .yebisubeer-concept__text + .yebisubeer-concept__text {
    -webkit-margin-before: 16px;
            margin-block-start: 16px;
  }
}
.yebisubeer-commitment {
  position: relative;
}
.yebisubeer-commitment__head {
  background-color: #411917;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-block: 138px 154px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__head {
    padding-block: 19.7916666667vw 22.1354166667vw;
  }
}
.yebisubeer-commitment__head .label {
  font-size: 7rem;
  color: #fff;
  font-family: var(--ybs-serif);
}
@media (max-width: 768px) {
  .yebisubeer-commitment__head .label {
    font-size: 6.7708333333vw;
  }
}
.yebisubeer-commitment__head .label span {
  color: #e0bb58;
}
.yebisubeer-commitment__head .label img {
  -webkit-margin-after: -0.3rem;
          margin-block-end: -0.3rem;
  -webkit-margin-start: 0.6rem;
          margin-inline-start: 0.6rem;
  vertical-align: baseline;
  width: 6.6rem;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__head .label img {
    -webkit-margin-after: -0.1302083333vw;
            margin-block-end: -0.1302083333vw;
    -webkit-margin-start: 1.0416666667vw;
            margin-inline-start: 1.0416666667vw;
    width: 7.2916666667vw;
  }
}
.yebisubeer-commitment__article {
  display: grid;
  grid-template-areas: ". no ." ". head ." ". body ." ". . .";
}
@media (min-width: 769px) {
  .yebisubeer-commitment__article {
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    grid-template-rows: 222px repeat(2, -webkit-min-content) auto;
    grid-template-rows: 222px repeat(2, min-content) auto;
  }
}
@media (max-width: 768px) {
  .yebisubeer-commitment__article {
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 113px repeat(2, -webkit-min-content) auto;
    grid-template-rows: 113px repeat(2, min-content) auto;
  }
}
.yebisubeer-commitment__article.article01 {
  background: url(/yebisu/product/yebisubeer/images/commitment_bg01_pc.webp) no-repeat 50% 100%;
  background-size: cover;
  color: #fff;
  grid-template-rows: 222px repeat(2, -webkit-min-content) minmax(40px, auto);
  grid-template-rows: 222px repeat(2, min-content) minmax(40px, auto);
  min-height: 1280px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__article.article01 {
    background: url(/yebisu/product/yebisubeer/images/commitment_bg01_sp.webp) no-repeat 0 0;
    background-size: cover;
    grid-template-rows: 113px repeat(2, -webkit-min-content) minmax(50px, auto);
    grid-template-rows: 113px repeat(2, min-content) minmax(50px, auto);
    min-height: auto;
  }
}
.yebisubeer-commitment__article.article02 {
  background: #f3f6f9 url(/yebisu/product/yebisubeer/images/commitment_bg03_pc.webp) no-repeat 50% 100%;
  background-size: contain;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__article.article02 {
    background-image: url(/yebisu/product/yebisubeer/images/commitment_bg03_sp.webp);
  }
}
.yebisubeer-commitment__article.article03 {
  background: url(/yebisu/product/yebisubeer/images/commitment_bg04_pc.webp) no-repeat 50% 100%;
  background-size: cover;
  min-height: 1300px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__article.article03 {
    background-color: #b49951;
    background-image: url(/yebisu/product/yebisubeer/images/commitment_bg04_sp.webp);
    background-size: 100% auto;
    grid-template-rows: 113px repeat(2, -webkit-min-content) 138.5416666667vw;
    grid-template-rows: 113px repeat(2, min-content) 138.5416666667vw;
    min-height: auto;
  }
}
.yebisubeer-commitment__no {
  grid-area: no;
  position: relative;
}
.yebisubeer-commitment__no .no {
  inset-block-end: 0;
  inset-inline-start: 16px;
  position: absolute;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__no .no {
    inset-inline-start: 2.0833333333vw;
  }
}
.article01 .yebisubeer-commitment__no .no {
  width: 372px;
}
@media (max-width: 768px) {
  .article01 .yebisubeer-commitment__no .no {
    width: 48.4375vw;
  }
}
.article02 .yebisubeer-commitment__no .no {
  width: 502px;
}
@media (max-width: 768px) {
  .article02 .yebisubeer-commitment__no .no {
    width: 65.3645833333vw;
  }
}
.article03 .yebisubeer-commitment__no .no {
  width: 476px;
}
@media (max-width: 768px) {
  .article03 .yebisubeer-commitment__no .no {
    width: 61.9791666667vw;
  }
}
.yebisubeer-commitment__preface {
  grid-area: head;
  -webkit-margin-before: 78px;
          margin-block-start: 78px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__preface {
    -webkit-margin-before: 39px;
            margin-block-start: 39px;
  }
}
.yebisubeer-commitment__preface .label {
  font-size: 4rem;
  font-family: var(--ybs-serif);
  line-height: 1.525;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__preface .label {
    font-size: 2.1rem;
    line-height: 1.6904761905;
  }
}
.yebisubeer-commitment__preface .text {
  font-size: 2rem;
  line-height: 1.7;
  -webkit-margin-before: 26px;
          margin-block-start: 26px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__preface .text {
    font-size: 1.7rem;
    line-height: 1.7058823529;
    -webkit-margin-before: 13px;
            margin-block-start: 13px;
  }
}
.yebisubeer-commitment__body {
  grid-area: body;
}
.article01 .yebisubeer-commitment__body {
  -webkit-margin-before: 118px;
          margin-block-start: 118px;
}
@media (max-width: 768px) {
  .article01 .yebisubeer-commitment__body {
    -webkit-margin-before: 59px;
            margin-block-start: 59px;
  }
}
.article02 .yebisubeer-commitment__body {
  -webkit-padding-after: 212px;
          padding-block-end: 212px;
}
@media (max-width: 768px) {
  .article02 .yebisubeer-commitment__body {
    -webkit-padding-after: 115px;
            padding-block-end: 115px;
  }
}
@media (min-width: 769px) {
  .yebisubeer-commitment__feature {
    display: grid;
    grid-template-areas: "pict . body";
    grid-template-columns: minmax(auto, 766px) 60px 574px;
    -webkit-margin-before: 100px;
            margin-block-start: 100px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature {
    -webkit-margin-before: 48px;
            margin-block-start: 48px;
  }
}
.yebisubeer-commitment__feature .image {
  grid-area: pict;
}
.yebisubeer-commitment__feature .body {
  grid-area: body;
}
@media (min-width: 769px) {
  .yebisubeer-commitment__feature .body {
    -webkit-padding-before: 6px;
            padding-block-start: 6px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body {
    -webkit-margin-before: 50px;
            margin-block-start: 50px;
  }
}
.yebisubeer-commitment__feature .body .label {
  font-size: 2.8rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: grid;
  font-family: var(--ybs-serif);
  gap: 34px;
  grid-template-columns: -webkit-min-content auto;
  grid-template-columns: min-content auto;
  line-height: 1;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .label {
    font-size: 2.1rem;
    gap: 0.6666666667em;
  }
}
.yebisubeer-commitment__feature .body .label::after {
  background-color: #340008;
  content: "";
  height: 1px;
}
.yebisubeer-commitment__feature .body .definition {
  -webkit-margin-before: 38px;
          margin-block-start: 38px;
}
.yebisubeer-commitment__feature .body .definition:first-of-type {
  -webkit-margin-before: 26px;
          margin-block-start: 26px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .definition {
    -webkit-margin-before: 21px;
            margin-block-start: 21px;
  }
  .yebisubeer-commitment__feature .body .definition:first-of-type {
    -webkit-margin-before: 28px;
            margin-block-start: 28px;
  }
}
.yebisubeer-commitment__feature .body .definition dt {
  font-size: 2rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #b68b47;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: normal;
  min-height: 1.5em;
  width: 146px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .definition dt {
    font-size: 1.5rem;
    width: 90px;
  }
}
.yebisubeer-commitment__feature .body .definition dd {
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.7;
  -webkit-margin-before: 18px;
          margin-block-start: 18px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .definition dd {
    font-size: 1.5rem;
    line-height: 1.7;
    -webkit-margin-before: 19px;
            margin-block-start: 19px;
  }
}
.yebisubeer-commitment__feature .body .text {
  line-height: 1.6875;
  -webkit-margin-before: 12px;
          margin-block-start: 12px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .text {
    font-size: 1.5rem;
    line-height: 1.7;
    -webkit-margin-before: 12px;
            margin-block-start: 12px;
  }
}
.yebisubeer-commitment__feature .body .note {
  font-size: 1.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-margin-before: 28px;
          margin-block-start: 28px;
}
@media (max-width: 768px) {
  .yebisubeer-commitment__feature .body .note {
    font-size: 1.4rem;
    -webkit-margin-before: 25px;
            margin-block-start: 25px;
  }
}
.yebisubeer-commitment__feature .body .note::before {
  content: "※";
}
@media (min-width: 769px) {
  .yebisubeer-commitment__image {
    aspect-ratio: 64/23;
    background: url(/yebisu/product/yebisubeer/images/commitment_bg02_pc.webp) no-repeat 50% 50%;
    background-attachment: fixed;
    background-size: cover;
  }
}
@media (max-width: 768px) {
  .yebisubeer-commitment__image {
    aspect-ratio: 384/275;
    position: -webkit-sticky;
    position: sticky;
    inset: 0;
    z-index: -1;
  }
  .yebisubeer-commitment__image::after {
    background: url(/yebisu/product/yebisubeer/images/commitment_bg02_pc.webp) no-repeat 50% 50%;
    background-size: cover;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
  }
}
.yebisubeer-history {
  background: url(/yebisu/product/yebisubeer/images/history_bg01_pc.webp) no-repeat 50% 50%;
  background-size: cover;
  color: #fff;
  display: grid;
  grid-template-areas: ". . ." ". head ." ". body ." ". more ." ". . .";
}
@media (min-width: 769px) {
  .yebisubeer-history {
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    grid-template-rows: 112px repeat(3, auto) 76px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-history {
    background-image: url(/yebisu/product/yebisubeer/images/history_bg01_sp.webp);
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 82px repeat(3, auto) 71px;
  }
}
.yebisubeer-history__label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-area: head;
}
@media (min-width: 769px) {
  .yebisubeer-history__label {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-padding-start: 18px;
            padding-inline-start: 18px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-history__label {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-margin-after: 0;
            margin-block-end: 0;
  }
}
.yebisubeer-history__label img {
  -webkit-margin-end: 46px;
          margin-inline-end: 46px;
  width: 294px;
}
@media (max-width: 768px) {
  .yebisubeer-history__label img {
    width: 38.28125vw;
    margin-inline: 2.0833333333vw 0;
  }
}
.yebisubeer-history__label span {
  font-size: 5rem;
  font-family: var(--ybs-serif);
  line-height: 1.36;
}
@media (max-width: 768px) {
  .yebisubeer-history__label span {
    font-size: 2.5rem;
    -webkit-margin-before: 38px;
            margin-block-start: 38px;
    line-height: 1.36;
  }
}
.yebisubeer-history__text {
  font-size: 2rem;
  grid-area: body;
  line-height: 2.1;
  -webkit-margin-before: 50px;
          margin-block-start: 50px;
}
@media (max-width: 768px) {
  .yebisubeer-history__text {
    font-size: 1.5rem;
    line-height: 1.7;
    -webkit-margin-before: 15px;
            margin-block-start: 15px;
  }
}
.yebisubeer-history__more {
  grid-area: more;
  -webkit-margin-before: 80px;
          margin-block-start: 80px;
  text-align: right;
}
@media (max-width: 768px) {
  .yebisubeer-history__more {
    -webkit-margin-before: 43px;
            margin-block-start: 43px;
  }
}
.yebisubeer-ingredients {
  background-color: #fff;
  display: grid;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients {
    grid-template-areas: ". . ." ". body ." ". note ." ". more ." ". . .";
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    grid-template-rows: 160px repeat(4, auto) 80px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients {
    grid-template-areas: "." "body" "note" "more" ".";
    grid-template-rows: 47px repeat(3, auto) 47px;
    justify-items: center;
  }
}
.yebisubeer-ingredients__body {
  grid-area: body;
  position: relative;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__body {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__body {
    -webkit-padding-before: 4px;
            padding-block-start: 4px;
    width: 100%;
  }
}
.yebisubeer-ingredients__label {
  font-size: 5.2rem;
  font-family: var(--ybs-serif);
  position: absolute;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__label {
    inset-block-start: -4px;
    inset-inline-start: 0;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__label {
    font-size: 2.6rem;
    inset-block-start: 0px;
    inset-inline-start: 15px;
  }
}
.yebisubeer-ingredients__image {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__image {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    position: relative;
    width: 64.2857142857%;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__image {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}
.yebisubeer-ingredients__image .package {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__image .package {
    inset-inline-end: -28px;
    position: relative;
    width: 42.2222222222%;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__image .package {
    -webkit-margin-start: 3.6458333333vw;
            margin-inline-start: 3.6458333333vw;
    width: 36.4583333333vw;
  }
}
.yebisubeer-ingredients__image .chart {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__image .chart {
    -webkit-margin-after: 38px;
            margin-block-end: 38px;
    width: 56.6666666667%;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__image .chart {
    width: 55.9895833333vw;
  }
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__table {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -webkit-margin-after: 80px;
            margin-block-end: 80px;
    width: 35.2857142857%;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__table {
    -webkit-margin-before: 29px;
            margin-block-start: 29px;
    margin-inline: auto;
    width: 92.1875vw;
  }
}
.yebisubeer-ingredients__table .caption {
  font-size: 2.6rem;
  font-family: var(--ybs-serif);
  font-weight: bold;
  line-height: normal;
  -webkit-margin-after: 28px;
          margin-block-end: 28px;
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__table .caption {
    font-size: 1.7rem;
    -webkit-margin-after: 0;
            margin-block-end: 0;
  }
}
.yebisubeer-ingredients__table .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (min-width: 769px) {
  .yebisubeer-ingredients__table .item:not(:first-child) {
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__table .item {
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
  }
  .yebisubeer-ingredients__table .item:first-child {
    -webkit-margin-before: 15px;
            margin-block-start: 15px;
  }
}
.yebisubeer-ingredients__table .item > * {
  font-size: 1.8rem;
  line-height: 1.6666666667;
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__table .item > * {
    font-size: 1.2rem;
    line-height: 1.5;
  }
}
.yebisubeer-ingredients__table .item th {
  -webkit-border-end: 1px solid #340008;
          border-inline-end: 1px solid #340008;
  font-weight: normal;
  -webkit-margin-end: 1em;
          margin-inline-end: 1em;
  -webkit-padding-end: 1em;
          padding-inline-end: 1em;
  white-space: nowrap;
}
.yebisubeer-ingredients__note {
  grid-area: note;
  -webkit-margin-before: 48px;
          margin-block-start: 48px;
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__note {
    -webkit-margin-before: 25px;
            margin-block-start: 25px;
    width: 92.1875vw;
  }
}
.yebisubeer-ingredients__note li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.6875;
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__note li {
    font-size: 1.2rem;
    line-height: 1.5;
  }
}
.yebisubeer-ingredients__note li::before {
  content: "※";
}
.yebisubeer-ingredients__more {
  grid-area: more;
  -webkit-margin-before: 46px;
          margin-block-start: 46px;
  text-align: right;
}
@media (max-width: 768px) {
  .yebisubeer-ingredients__more {
    font-size: 1.2rem;
    -webkit-margin-before: 21px;
            margin-block-start: 21px;
    width: 92.1875vw;
  }
  .yebisubeer-ingredients__more .link-text::after {
    aspect-ratio: 1/1;
    height: auto !important;
    width: 1.125em !important;
  }
}
.yebisubeer-products {
  background: radial-gradient(#fcfdf2 0%, #f3f5db 54.68%, #f4ecc1 100%);
  display: grid;
  grid-template-areas: ". . ." ". head ." ". body ." ". . .";
  justify-items: center;
}
@media (min-width: 769px) {
  .yebisubeer-products {
    grid-template-columns: auto minmax(auto, 906px) auto;
    grid-template-rows: 86px repeat(2, auto) 100px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-products {
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 45px repeat(2, auto) 62px;
  }
}
.yebisubeer-products__title {
  font-size: 7.2rem;
  font-family: var(--ybs-eng);
  font-weight: normal;
  grid-area: head;
}
@media (max-width: 768px) {
  .yebisubeer-products__title {
    font-size: 3.1rem;
  }
}
.yebisubeer-products__lineup {
  grid-area: body;
  -webkit-margin-before: 16px;
          margin-block-start: 16px;
}
@media (max-width: 768px) {
  .yebisubeer-products__lineup {
    -webkit-margin-before: 8px;
            margin-block-start: 8px;
  }
}
.yebisubeer-qa {
  background-color: #fff;
}
@media (min-width: 769px) {
  .yebisubeer-qa {
    display: grid;
    grid-template-areas: "head head . body .";
    grid-template-columns: minmax(40px, auto) minmax(40px, 182px) 108px minmax(auto, 1110px) minmax(40px, auto);
  }
}
.yebisubeer-qa__title {
  background-color: #340008;
  overflow: hidden;
}
@media (min-width: 769px) {
  .yebisubeer-qa__title {
    grid-area: head;
    -webkit-padding-before: 7.1875vw;
            padding-block-start: 7.1875vw;
    text-align: center;
  }
}
@media (max-width: 768px) {
  .yebisubeer-qa__title {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    aspect-ratio: 192/65;
    padding-inline: 3.90625vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.yebisubeer-qa__title img {
  width: 10.1041666667vw;
}
@media (max-width: 768px) {
  .yebisubeer-qa__title img {
    width: 25.2604166667vw;
  }
}
.yebisubeer-qa__list {
  padding-block: 174px;
}
@media (min-width: 769px) {
  .yebisubeer-qa__list {
    grid-area: body;
  }
}
@media (max-width: 768px) {
  .yebisubeer-qa__list {
    margin-inline: auto;
    padding-block: 25px 50px;
    width: 92.1875vw;
  }
}
.yebisubeer-qa__question {
  -webkit-border-before: 1px solid #b68b47;
          border-block-start: 1px solid #b68b47;
  padding-block: 30px 26px;
}
.yebisubeer-qa__question:last-child {
  -webkit-border-after: 1px solid #b68b47;
          border-block-end: 1px solid #b68b47;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question {
    padding-block: 9px;
  }
}
.yebisubeer-qa__question dt {
  font-size: 3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: var(--ybs-serif);
  font-weight: bold;
  line-height: 1.3333333333;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dt {
    font-size: 1.7rem;
    line-height: 1.7058823529;
  }
}
.yebisubeer-qa__question dt span {
  display: inline-block;
  -webkit-margin-end: 20px;
          margin-inline-end: 20px;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dt span {
    -webkit-margin-end: 2.6041666667vw;
            margin-inline-end: 2.6041666667vw;
  }
}
.yebisubeer-qa__question dt::before {
  content: "Q.";
  font-family: var(--ybs-eng);
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dt::before {
    -webkit-margin-end: 1.3020833333vw;
            margin-inline-end: 1.3020833333vw;
  }
}
.yebisubeer-qa__question dt::after {
  aspect-ratio: 1/1;
  background: url(/yebisu/product/yebisubeer/images/qa_ico01.svg) no-repeat 50% 50%;
  background-size: contain;
  content: "";
  display: none;
  margin-inline: auto 20px;
  width: 20px;
  -ms-flex-item-align: center;
      align-self: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dt::after {
    margin-inline: auto 2.6041666667vw;
    width: 2.6041666667vw;
  }
}
.yebisubeer-qa__question dd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.6875;
  -webkit-margin-before: 22px;
          margin-block-start: 22px;
  -webkit-padding-before: 10px;
          padding-block-start: 10px;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dd {
    font-size: 1.5rem;
    line-height: 1.7;
    -webkit-margin-before: 1.8229166667vw;
            margin-block-start: 1.8229166667vw;
    -webkit-padding-before: 0;
            padding-block-start: 0;
  }
}
.yebisubeer-qa__question dd::before {
  font-size: 3rem;
  color: #b68b47;
  content: "A.";
  font-family: var(--ybs-eng);
  line-height: normal;
  -webkit-margin-before: -10px;
          margin-block-start: -10px;
  -webkit-margin-end: 16px;
          margin-inline-end: 16px;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dd::before {
    font-size: 1.7rem;
    -webkit-margin-before: 0;
            margin-block-start: 0;
    -webkit-margin-end: 1.3020833333vw;
            margin-inline-end: 1.3020833333vw;
  }
}
.yebisubeer-qa__question dd.more {
  -webkit-margin-before: 10px;
          margin-block-start: 10px;
}
@media (max-width: 768px) {
  .yebisubeer-qa__question dd.more {
    -webkit-margin-before: 2.34375vw;
            margin-block-start: 2.34375vw;
  }
}
.yebisubeer-qa__question dd.more::before {
  visibility: hidden;
}
.yebisubeer-qa__question dd.more .link-text {
  line-height: 1.7;
}
.yebisubeer-qa__question dd.more .link-text::after {
  aspect-ratio: 1/1;
  height: auto !important;
  width: 1.125em !important;
}
.init-qanda .yebisubeer-qa__question dt {
  cursor: pointer;
}
@media (hover: hover) {
  .init-qanda .yebisubeer-qa__question dt:hover {
    opacity: 0.5;
  }
}
.init-qanda .yebisubeer-qa__question dt::after {
  display: block;
}
.init-qanda .yebisubeer-qa__question dt.is-open::after {
  background-image: url(/yebisu/product/yebisubeer/images/qa_ico02.svg);
}
.yebisubeer-reading {
  background-color: #f5f6f9;
  display: grid;
  grid-template-areas: ". . ." ". head ." ". body ." ". . .";
  justify-items: center;
}
@media (min-width: 769px) {
  .yebisubeer-reading {
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    grid-template-rows: 70px repeat(2, auto) 130px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-reading {
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 46px repeat(2, auto) 51px;
  }
}
.yebisubeer-reading__title {
  font-size: 5.2rem;
  font-family: var(--ybs-serif);
  grid-area: head;
  text-align: center;
}
@media (max-width: 768px) {
  .yebisubeer-reading__title {
    font-size: 2.6rem;
  }
}
.yebisubeer-reading__content {
  gap: 40px 80px;
  grid-area: body;
}
@media (min-width: 769px) {
  .yebisubeer-reading__content {
    margin-block: 20px 0;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media (min-width: 769px) and (max-width: 1400px) {
  .yebisubeer-reading__content {
    gap: 40px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-reading__content {
    margin-block: 28px 0;
  }
}
.yebisubeer-reading__content .content-mini {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.yebisubeer-reading__content .content-mini__article {
  background-color: #fff;
}
@media (min-width: 769px) {
  .yebisubeer-reading__content .content-mini__article {
    width: calc((100% - 80px) / 2);
  }
}
@media (min-width: 769px) and (max-width: 1400px) {
  .yebisubeer-reading__content .content-mini__article {
    width: calc((100% - 40px) / 2);
  }
}
@media (max-width: 768px) {
  .yebisubeer-reading__content .content-mini__article {
    -webkit-margin-before: 45px;
            margin-block-start: 45px;
  }
  .yebisubeer-reading__content .content-mini__article:first-child {
    -webkit-margin-before: 0;
            margin-block-start: 0;
  }
}
@media (min-width: 769px) {
  .yebisubeer-reading__content .content-mini__link {
    -webkit-column-gap: 25px;
       -moz-column-gap: 25px;
            column-gap: 25px;
    padding: 32px 38px;
  }
}
.yebisubeer-point {
  position: relative;
}
.yebisubeer-point__head {
  display: grid;
  grid-template-areas: ". . ." ". title ." ". . .";
}
@media (min-width: 769px) {
  .yebisubeer-point__head {
    grid-template-columns: auto minmax(auto, 990px) auto;
    grid-template-rows: 25px auto 0;
    background: url(/yebisu/product/yebisubeer/images/point_bg.webp) no-repeat 50% 50%;
    background-size: cover;
  }
}
@media (max-width: 768px) {
  .yebisubeer-point__head {
    grid-template-columns: auto 89.0625vw auto;
    grid-template-rows: 13px repeat(2, auto) 24px;
    background: url(/yebisu/product/yebisubeer/images/point_bg_sp.webp) no-repeat 100% 100%;
    background-size: cover;
  }
}
.yebisubeer-point__title {
  grid-area: title;
}
@media (min-width: 769px) {
  .yebisubeer-point__title {
    -webkit-transform: translateX(55px);
            transform: translateX(55px);
  }
}
@media (max-width: 768px) {
  .yebisubeer-point__title {
    -webkit-transform: translateX(3.90625vw);
            transform: translateX(3.90625vw);
  }
}
.yebisubeer-point__title img {
  width: 100%;
}
.yebisubeer-point .taste {
  display: grid;
  grid-template-areas: ". . ." ". head ." ". img ." ". list ." ". . .";
  justify-items: center;
}
@media (min-width: 769px) {
  .yebisubeer-point .taste {
    background: url(/yebisu/product/yebisubeer/images/taste_bg.webp) no-repeat;
    background-size: cover;
    grid-template-columns: auto minmax(auto, 975px) auto;
    grid-template-rows: 50px repeat(3, auto) 80px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-point .taste {
    background: url(/yebisu/product/yebisubeer/images/taste_bg_sp.webp) no-repeat;
    background-size: cover;
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 40px repeat(3, auto) 40px;
    overflow: hidden;
    width: 100%;
  }
}
.yebisubeer-point .taste__title {
  grid-area: head;
  width: 448px;
}
@media (max-width: 768px) {
  .yebisubeer-point .taste__title {
    width: 100%;
    max-width: 69.53125vw;
    margin-inline: 0;
  }
}
.yebisubeer-point .taste__img {
  grid-area: img;
  -webkit-margin-before: 20px;
          margin-block-start: 20px;
}
@media (max-width: 768px) {
  .yebisubeer-point .taste__img {
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
  }
}
.yebisubeer-point .taste__img img, .yebisubeer-point .taste__img picture, .yebisubeer-point .taste__img video, .yebisubeer-point .taste__img svg {
  max-width: 100%;
  height: auto;
  display: block;
}
.yebisubeer-point .taste__list {
  grid-area: list;
  -webkit-margin-before: 40px;
          margin-block-start: 40px;
}
@media (max-width: 768px) {
  .yebisubeer-point .taste__list {
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
    width: 100%;
    max-width: 92.1875vw;
    padding-inline: 2.6041666667vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.yebisubeer-point .taste__list li {
  font-size: 1.4rem;
}
@media (max-width: 768px) {
  .yebisubeer-point .taste__list li {
    font-size: 1.2rem;
  }
}
.yebisubeer-point .movie {
  background-color: #490305;
  display: grid;
  grid-template-areas: ". . ." ". content ." ". . .";
}
@media (min-width: 769px) {
  .yebisubeer-point .movie {
    grid-template-columns: auto minmax(auto, 1000px) auto;
    grid-template-rows: 80px auto 80px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-point .movie {
    grid-template-columns: auto 88.5416666667vw auto;
    grid-template-rows: 40px repeat(2, auto) 40px;
  }
}
.yebisubeer-point .movie__content {
  grid-area: content;
  display: grid;
  grid-template-areas: ". . ." ". head ." ". body ." ". . .";
  justify-items: center;
  background-size: 100%;
}
@media (min-width: 769px) {
  .yebisubeer-point .movie__content {
    background-image: url(/yebisu/product/yebisubeer/images/movie_bg.webp);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 100%;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: 60px repeat(2, auto) 60px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-point .movie__content {
    background-image: url(/yebisu/product/yebisubeer/images/movie_bg_sp.webp);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 100%;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: 20px repeat(2, auto) 20px;
  }
}
.yebisubeer-point .movie__title {
  font-size: 4rem;
  font-family: var(--ybs-eng);
  font-weight: bold;
  grid-area: head;
  color: #E2BD5A;
  text-align: center;
  line-height: 1.5;
}
@media (max-width: 768px) {
  .yebisubeer-point .movie__title {
    font-size: 1.6rem;
  }
}
.yebisubeer-point .movie__title span {
  font-size: 3.2rem;
}
@media (max-width: 768px) {
  .yebisubeer-point .movie__title span {
    font-size: 1.3rem;
  }
}
.yebisubeer-point .movie__body {
  grid-area: body;
  -webkit-margin-before: 20px;
          margin-block-start: 20px;
  aspect-ratio: 16/9;
  width: 700px;
  position: relative;
}
@media (max-width: 768px) {
  .yebisubeer-point .movie__body {
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
    width: 78.125vw;
  }
}
.yebisubeer-point .movie__body iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.yebisubeer-special {
  background: linear-gradient(103deg, #FEFFFA 1.41%, #F7F1D5 50.7%, #F0E4B0 100%);
  display: grid;
  grid-template-areas: ". . ." ". head ." ". body ." ". . .";
  justify-items: center;
}
@media (min-width: 769px) {
  .yebisubeer-special {
    grid-template-columns: minmax(40px, auto) minmax(auto, 1400px) minmax(40px, auto);
    grid-template-rows: 90px repeat(2, auto) 120px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-special {
    grid-template-columns: auto 92.1875vw auto;
    grid-template-rows: 46px repeat(2, auto) 80px;
  }
}
.yebisubeer-special__title {
  font-size: 7.2rem;
  font-family: var(--ybs-eng);
  font-weight: normal;
  grid-area: head;
  text-align: center;
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
}
@media (max-width: 768px) {
  .yebisubeer-special__title {
    font-size: 3.1rem;
    -webkit-margin-after: 15px;
            margin-block-end: 15px;
  }
}
.yebisubeer-special__body {
  grid-area: body;
  width: 100%;
}
@media (max-width: 768px) {
  .yebisubeer-special__body {
    width: 92.1875vw;
  }
}
@media (min-width: 769px) {
  .yebisubeer-special .media {
    display: grid;
    grid-template-columns: minmax(0, 540px) 1fr;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    gap: 80px;
  }
  .yebisubeer-special .media + .media {
    -webkit-margin-before: 80px;
            margin-block-start: 80px;
  }
}
@media (max-width: 768px) {
  .yebisubeer-special .media {
    display: block;
  }
  .yebisubeer-special .media + .media {
    -webkit-margin-before: 50px;
            margin-block-start: 50px;
  }
}
.yebisubeer-special .media figure, .yebisubeer-special .media .mwdia {
  margin: 0;
}
.yebisubeer-special .media figure img, .yebisubeer-special .media .mwdia img {
  display: block;
  height: auto;
  width: 100%;
}
@media (min-width: 769px) {
  .yebisubeer-special .media__body {
    -ms-flex-item-align: end;
        align-self: end;
  }
}
@media (max-width: 768px) {
  .yebisubeer-special .media__body {
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
  }
}
.yebisubeer-special .media__heading {
  font-size: 2.4rem;
  font-family: var(--ybs-serif);
}
@media (max-width: 768px) {
  .yebisubeer-special .media__heading {
    font-size: 2.1rem;
  }
}
.yebisubeer-special .media__text {
  font-size: 1.6rem;
  -webkit-margin-before: 20px;
          margin-block-start: 20px;
  line-height: 1.6875;
}
@media (max-width: 768px) {
  .yebisubeer-special .media__text {
    font-size: 1.5rem;
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
    line-height: 1.7;
  }
}
.yebisubeer-special .media__btn {
  -webkit-margin-before: 40px;
          margin-block-start: 40px;
  text-align: right;
}
@media (max-width: 768px) {
  .yebisubeer-special .media__btn {
    -webkit-margin-before: 30px;
            margin-block-start: 30px;
    text-align: center;
  }
}
.yebisubeer-special .media__btn .ybs-btn {
  background-color: transparent;
  border-color: var(--ybs-fnt-dflt);
}
@media (hover: hover) {
  .yebisubeer-special .media__btn .ybs-btn:hover {
    color: #FFF;
    background-color: var(--ybs-fnt-dflt);
  }
}
@media (max-width: 768px) {
  .yebisubeer-special .media__btn .ybs-btn {
    min-width: 280px;
  }
}
/*# sourceMappingURL=index.css.map */