@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap");
.mod-beams-en {
  font-family: "Roboto Condensed";
}

.mod-beams-en2 {
  font-family: "Inter";
}

.mod-beams-en-min {
  font-family: "Amiri";
}

.mod-beams-en-min2 {
  font-family: "Libre Baskerville";
}

@media print, screen and (min-width: 1024px) {
  .block-beams-shop {
    position: relative;
    border-top: 0.1388888889vw solid #000;
    padding: 4.1666666667vw 4.1666666667vw 7.9861111111vw 4.1666666667vw;
  }
  .block-beams-shop img {
    width: 100%;
  }
  .block-beams-shop a {
    text-decoration: none;
  }
  .block-beams-shop:before {
    content: "";
    display: block;
    position: absolute;
    top: 0.3472222222vw;
    left: 0;
    right: 0;
    height: 1.3888888889vw;
    border-top: 0.1388888889vw solid #000;
  }
  .block-beams-shop ._cols {
    display: flex;
    gap: 2.7777777778vw;
    align-items: flex-end;
  }
  .block-beams-shop ._cols ._col-image {
    width: 27.0833333333vw;
  }
  .block-beams-shop ._cols ._col-texts {
    flex: 1;
  }
  .block-beams-shop ._cols ._col-texts ._add {
    margin-top: 0.3472222222vw;
    font-size: 0.9722222222vw;
    font-weight: 300;
    line-height: 1.57;
    letter-spacing: 0.08em;
    color: #252525;
  }
  .block-beams-shop ._cols ._col-texts ._dl {
    margin-top: 0.3472222222vw;
  }
  .block-beams-shop ._cols ._col-texts ._btns {
    margin-top: 0.2083333333vw;
  }
  .block-beams-shop h2 {
    font-size: 2.5vw;
    font-style: italic;
    letter-spacing: 0.04em;
    line-height: 1.2;
  }
  .block-beams-shop ._name h3 {
    font-size: 1.6666666667vw;
    font-style: italic;
    letter-spacing: 0.06em;
    line-height: 1.2;
    margin-bottom: 1.0416666667vw;
  }
  .block-beams-shop ._body {
    margin-top: 0.6944444444vw;
    margin-left: 17.7083333333vw;
  }
  .block-beams-life_style {
    position: relative;
    padding: 5.4166666667vw 0 8.8194444444vw 0;
    background-image: url(/starbucks-stand-by-beams/common/images/life_style/bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
  }
  .block-beams-life_style img {
    width: 100%;
  }
  .block-beams-life_style a {
    text-decoration: none;
  }
  .block-beams-life_style ._logo {
    width: 16.6666666667vw;
    margin: 0 auto;
  }
  .block-beams-life_style ._lead {
    width: 36.8055555556vw;
    margin: 0 auto;
    margin-top: 4.3055555556vw;
  }
  .block-beams-life_style ._texts {
    margin-top: 3.125vw;
    display: flex;
    gap: 2.0833333333vw;
    flex-direction: column;
  }
  .block-beams-life_style ._texts p {
    text-align: center;
    font-size: 1.0416666667vw;
    color: #ffffff;
    line-height: 1.8;
    letter-spacing: 0.01em;
  }
  .block-beams-life_style ._btns {
    margin-top: 2.7777777778vw;
    text-align: center;
  }
  .block-beams-pagetop {
    position: relative;
    padding: 2.7777777778vw 0 3.125vw 0;
    margin-right: 4.8611111111vw;
    text-align: right;
  }
  .block-beams-pagetop img {
    width: 100%;
  }
  .block-beams-pagetop a {
    text-decoration: none;
  }
  .mod-beams-shop-dl {
    display: flex;
  }
  .mod-beams-shop-dl dt {
    width: 3.125vw;
    font-size: 0.9722222222vw;
    font-weight: 300;
    letter-spacing: 0.08em;
  }
  .mod-beams-shop-dl dd {
    font-size: 0.9722222222vw;
    font-weight: 300;
    letter-spacing: 0.08em;
  }
  .mod-beams-btn-map {
    display: inline-block;
    border: 1px solid #003E28;
    background-color: #003E28;
    border-radius: 3.4722222222vw;
    padding: 0.2083333333vw 0.9722222222vw 0.1388888889vw 0.9722222222vw;
    font-size: 0.9722222222vw;
    line-height: 1;
    text-align: center;
    letter-spacing: 0.1em;
    color: #fff;
    position: relative;
    cursor: pointer;
    transition-duration: 0.2s;
    transition-property: background-color, color;
  }
  .mod-beams-btn-map:hover {
    background-color: #fff;
    color: #003E28;
  }
  .mod-beams-btn-top {
    display: inline-block;
    border: 1px solid #fff;
    border-radius: 3.4722222222vw;
    width: 12.5vw;
    padding: 0.4861111111vw 0;
    box-sizing: border-box;
    font-size: 0.9027777778vw;
    text-align: center;
    letter-spacing: 0.1em;
    color: #fff;
    position: relative;
    cursor: pointer;
    transition-duration: 0.2s;
    transition-property: background-color, color;
  }
  .mod-beams-btn-top:hover {
    background-color: #fff;
    color: #003E28;
  }
  .mod-beams-btn-top:hover:before {
    border-color: #003E28;
  }
  .mod-beams-btn-top:before {
    position: absolute;
    top: 50%;
    right: 0.6944444444vw;
    display: block;
    content: "";
    height: 0.2083333333vw;
    width: 0.2083333333vw;
    border: 1px solid #fff;
    border-left-width: 0;
    border-top-width: 0;
    transform: translate(0, -50%) rotate(-45deg);
  }
  .mod-beams-btn-pagetop {
    display: inline-block;
    font-size: 0.9722222222vw;
    text-align: right;
    line-height: 1.07;
    letter-spacing: 0.08em;
    color: #003e28;
    padding-right: 1.0416666667vw;
    position: relative;
    cursor: pointer;
    transition-duration: 0.2s;
    transition-property: opacity;
  }
  .mod-beams-btn-pagetop:before {
    position: absolute;
    top: 55%;
    right: 0;
    display: block;
    content: "";
    height: 0.2083333333vw;
    width: 0.2083333333vw;
    border: 1px solid #003e28;
    border-left-width: 0;
    border-bottom-width: 0;
    transform: translate(0, -50%) rotate(-45deg);
  }
  .mod-beams-btn-pagetop:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 1023px) {
  .block-beams-shop {
    position: relative;
    border-top: 0.2666666667vw solid #000;
    padding: 12vw 2.6666666667vw 29.3333333333vw 2.6666666667vw;
  }
  .block-beams-shop:before {
    content: "";
    display: block;
    position: absolute;
    top: 0.5333333333vw;
    left: 0;
    right: 0;
    height: 5.3333333333vw;
    border-top: 0.2666666667vw solid #000;
  }
  .block-beams-shop ._cols ._col-texts {
    margin-top: 6.6666666667vw;
  }
  .block-beams-shop ._cols ._col-texts ._add {
    margin-top: 2.6666666667vw;
    font-size: 3.7333333333vw;
    font-weight: 300;
    line-height: 1.57;
    letter-spacing: 0.08em;
    color: #252525;
  }
  .block-beams-shop ._cols ._col-texts ._dl {
    margin-top: 1.3333333333vw;
  }
  .block-beams-shop ._cols ._col-texts ._btns {
    margin-top: 3.2vw;
  }
  .block-beams-shop h2 {
    font-size: 6.9333333333vw;
    font-style: italic;
    letter-spacing: 0.04em;
    line-height: 1.2;
  }
  .block-beams-shop ._name h3 {
    font-size: 5.0666666667vw;
    font-style: italic;
    letter-spacing: 0.04em;
    line-height: 1.2;
  }
  .block-beams-shop ._body {
    margin-top: 2.6666666667vw;
  }
  .block-beams-life_style {
    padding: 15.4666666667vw 0 18.6666666667vw 0;
    background-image: url(/starbucks-stand-by-beams/common/images/life_style/sp/bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
  }
  .block-beams-life_style ._logo {
    width: 58.6666666667vw;
    margin: 0 auto;
  }
  .block-beams-life_style ._lead {
    width: 64vw;
    margin: 0 auto;
    margin-top: 13.3333333333vw;
  }
  .block-beams-life_style ._texts {
    margin-top: 9.3333333333vw;
    display: flex;
    gap: 4vw;
    flex-direction: column;
  }
  .block-beams-life_style ._texts p {
    text-align: center;
    font-size: 3.7333333333vw;
    color: #ffffff;
    letter-spacing: 0.01em;
    line-height: 1.86;
  }
  .block-beams-life_style ._btns {
    margin-top: 5.3333333333vw;
    text-align: center;
  }
  .block-beams-pagetop {
    padding: 12vw 0 12vw 0;
    text-align: center;
  }
  .mod-beams-shop-dl {
    display: flex;
  }
  .mod-beams-shop-dl dt {
    width: 12vw;
    font-size: 3.7333333333vw;
    font-weight: 300;
    letter-spacing: 0.08em;
  }
  .mod-beams-shop-dl dd {
    font-size: 3.7333333333vw;
    font-weight: 300;
    letter-spacing: 0.08em;
  }
  .mod-beams-btn-map {
    display: inline-block;
    background-color: #003E28;
    border-radius: 13.3333333333vw;
    padding: 0.8vw 3.7333333333vw 0.5333333333vw 3.7333333333vw;
    font-size: 3.4666666667vw;
    text-align: center;
    letter-spacing: 0.1em;
    color: #fff;
    position: relative;
  }
  .mod-beams-btn-top {
    display: inline-block;
    border: 1px solid #fff;
    border-radius: 13.3333333333vw;
    width: 48vw;
    padding: 1.8666666667vw 0;
    box-sizing: border-box;
    font-size: 3.4666666667vw;
    text-align: center;
    letter-spacing: 0.1em;
    color: #fff;
    position: relative;
    cursor: pointer;
    transition-duration: 0.2s;
    transition-property: background-color, color;
  }
  .mod-beams-btn-top:hover {
    background-color: #fff;
    color: #003E28;
  }
  .mod-beams-btn-top:hover:before {
    border-color: #003E28;
  }
  .mod-beams-btn-top:before {
    position: absolute;
    top: 50%;
    right: 2.6666666667vw;
    display: block;
    content: "";
    height: 0.8vw;
    width: 0.8vw;
    border: 1px solid #fff;
    border-left-width: 0;
    border-top-width: 0;
    transform: translate(0, -50%) rotate(-45deg);
  }
  .mod-beams-btn-pagetop {
    display: inline-block;
    font-size: 3.7333333333vw;
    text-align: right;
    line-height: 1.07;
    letter-spacing: 0.08em;
    color: #003e28;
    padding-right: 4vw;
    position: relative;
  }
  .mod-beams-btn-pagetop:before {
    position: absolute;
    top: 55%;
    right: 0;
    display: block;
    content: "";
    height: 0.8vw;
    width: 0.8vw;
    border: 1px solid #003e28;
    border-left-width: 0;
    border-bottom-width: 0;
    transform: translate(0, -50%) rotate(-45deg);
  }
}