/* main

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



.lpSmsBdCoupon {

  position: relative;

  color: #000;

  font-family: "Noto Sans JP", sans-serif;

  font-weight: 400;

  font-feature-settings: "palt";

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  -webkit-print-color-adjust: exact;

}



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

  .lpSmsBdCoupon {

    flex: 0 0 450px;

    margin: 0;

    width: 450px;

  }

}





/* mask

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



.lpSmsBdCoupon__mask {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 10;

  transform: translateX(-150%);

}

.lpSmsBdCoupon__mask:before,

.lpSmsBdCoupon__mask:after {

  display: block;

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 1;

  transform: skewX(-45deg);

}

.lpSmsBdCoupon__mask:before {

  right: 0;

  background: linear-gradient(to left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 50%);

}

.lpSmsBdCoupon__mask:after {

  left: 100%;

  right: -300%;

  background-color: rgba(255,255,255,1);

}



/* close */



.js-mask-close {

  pointer-events: none;

  transform: translateX(100%);

  transition-property: transform;

  transition-duration: 1.5s;

  transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);

}





/* button

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



.lpSmsBdCoupon__button {

  margin: 12px auto 0;

}

.lpSmsBdCoupon__buttonLink {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  height: 54px;

  color: #fff;

  font-size: 14px;

  font-weight: 500;

  letter-spacing: 0.04em;

  text-decoration: none;

  background-color: #009be5;

  border-radius: 999px;

  box-shadow: 0 6px 0 #1566a9;

  box-sizing: border-box;

}

.lpSmsBdCoupon__buttonLink:after {

  display: block;

  content: "";

  position: absolute;

  top: 50%;

  right: 19px;

  width: 9px;

  height: 9px;

  border-right: 1.5px solid #fff;

  border-bottom: 1.5px solid #fff;

  transform: translateY(-50%) rotate(-45deg);

}





/* visual

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



.lpSmsBdCoupon__visual {

  position: relative;

  padding: 60px 0 0;

}

.lpSmsBdCoupon__visualImage {

  margin: 0;

  font-size: 0;

}

.lpSmsBdCoupon__visualImageItem {

  width: 100%;

  height: auto;

}





/* indicate

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



.js-indicate-ready.js-indicate-fadein {

  opacity: 0;

  transform: translateY(80px);

}



/* start */



.js-indicate-start.js-indicate-fadein {

  opacity: 1;

  transform: translateY(0);

  transition-property: opacity, transform;

  transition-duration: 3s, 1.5s;

  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

}





/* common

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



.lpSmsBdCoupon__howToTitleEn {

  max-width: 100%;

  height: auto;

}



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

}





/* button

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



.lpSmsBdCoupon__button {

  margin: 26px auto 0;

  max-width: 294px;

}

.lpSmsBdCoupon__buttonLink {

  height: 54px;

  font-size: 15px;

  letter-spacing: 0.05em;

}



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

  .lpSmsBdCoupon__buttonLink {

    height: 67px;

    font-size: 18px;

  }

  .lpSmsBdCoupon__buttonLink:after {

    right: 23px;

    width: 13px;

    height: 13px;

    border-right: 2px solid #fff;

    border-bottom: 2px solid #fff;

  }

}





/* visual

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



.lpSmsBdCoupon__visual {

  padding: 0;

}





/* howTo

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



.lpSmsBdCoupon__howTo {

  margin: -1px auto 0;

  padding: 54px 0 60px;

  background-color: #f7f8f8;

}

.lpSmsBdCoupon__howToTitle {

  max-width: 248.5px;

  margin-inline: auto;

  font-size: unset;

}

.lpSmsBdCoupon__howToTitleSub {

  margin-top: 9px;

  font-size: 20px;

  font-weight: 500;

  letter-spacing: 0.05em;

  text-align: center;

  display: block;

}



.lpSmsBdCoupon__howToNav {

  margin: 17px auto 0;

  padding-inline: 25px;

}

.lpSmsBdCoupon__howToNavItems {

  display: flex;

  justify-content: center;

  align-items: stretch;

  gap: 25px;

  margin: 0;

  padding: 0;

  list-style: none;

}

.lpSmsBdCoupon__howToNavItem {

  flex: 1 1 0;

  max-width: 160px;

}

.lpSmsBdCoupon__howToNavLink {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  position: relative;

  height: 100%;

  padding: 30px 10px 39px;

  background-color: #009be5;

  border-radius: 10px;

  box-shadow: 0 6px 0 #1566a9;

  color: #fff;

  text-decoration: none;

  box-sizing: border-box;

}

.lpSmsBdCoupon__howToNavLabel {

  font-size: 25px;

  font-weight: 500;

  letter-spacing: 0.025em;

  line-height: 1.25;

  text-align: center;

}

.lpSmsBdCoupon__howToNavLabel--online {

  font-size: 23px;

  letter-spacing: 0;

}

.lpSmsBdCoupon__howToNavLabelSub {

  display: block;

  margin-top: 4px;

  font-size: 15px;

  font-weight: 500;

  letter-spacing: 0.025em;

}

.lpSmsBdCoupon__howToNavLink:after {

  display: block;

  content: "";

  position: absolute;

  left: 50%;

  bottom: 13px;

  margin-left: -7px;

  width: 12px;

  height: 12px;

  border-right: 1px solid #fff;

  border-bottom: 1px solid #fff;

  transform: rotate(45deg);

}



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

  .lpSmsBdCoupon__howTo {

    padding: 64px 0 72px;

  }

  .lpSmsBdCoupon__howToTitle {

    max-width: 302px;

  }

  .lpSmsBdCoupon__howToTitleSub {

    margin-top: 12px;

    font-size: 24px;

  }

  .lpSmsBdCoupon__howToNavItem {

    max-width: 180px;

  }

  .lpSmsBdCoupon__howToNavLink {

    padding: 36px 10px 46px;

  }

  .lpSmsBdCoupon__howToNavLink:after {

    bottom: 20px;

    width: 14px;

    height: 14px;

  }

  .lpSmsBdCoupon__howToNavLabel {

    font-size: 30px;

    letter-spacing: 0.025em;

  }

  .lpSmsBdCoupon__howToNavLabel--online {

    font-size: 27.6px;

  }

  .lpSmsBdCoupon__howToNavLabelSub {

    font-size: 18px;

  }

}





/* shop

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



.lpSmsBdCoupon__shop {

  position: relative;

  margin: -1px auto 0;

  padding: 71px 0 65px;

  background:

    url(../img/bg_01.png) no-repeat center top / 100% 67px,

    linear-gradient(#e2f2ff, #e2f2ff) no-repeat center 66px / 100% calc(100% - 66px) #f7f8f8;

}

.lpSmsBdCoupon__shopTitle {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  margin: 0;

  height: 87px;

  font-size: unset;

}

.lpSmsBdCoupon__shopTitleEn {

  position: absolute;

  top: 0;

  left: 50%;

  margin-left: -168px;

  width: 336px;

  height: auto;

}

.lpSmsBdCoupon__shopTitleText {

  display: block;

  position: relative;

  color: #009be5;

  font-size: 30px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-align: center;

}

.lpSmsBdCoupon__shopText {

  font-size: 14px;

  font-weight: 500;

  letter-spacing: 0.025em;

  line-height: 1.9;

  text-align: center;

}

.lpSmsBdCoupon__shopNote {

  margin: 2px 0 0;

  font-size: 10px;

  letter-spacing: 0;

  text-align: center;

}

.lpSmsBdCoupon__shopImage {

  display: block;

  margin: 21px auto 0;

  width: 229px;

  height: auto;

}



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

  .lpSmsBdCoupon__shop {

    padding: 84px 0 76px;

  }

  .lpSmsBdCoupon__shopTitleText {

    font-size: 36px;

    margin-top: 10px;

  }

  .lpSmsBdCoupon__shopTitleEn {

    margin-left: -200px;

    width: 402px;

  }

  .lpSmsBdCoupon__shopText {

    font-size: 16.8px;

    margin-top: 17px;

  }

  .lpSmsBdCoupon__shopNote {

    font-size: 12px;

  }

  .lpSmsBdCoupon__shopImage {

    width: 283px;

  }

  .lpSmsBdCoupon__button {

    margin: 31px auto 0;

    max-width: 355px;

  }

}





/* online

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



.lpSmsBdCoupon__online {

  position: relative;

  margin: 0 auto;

  padding: 67px 0 60px;

  background:

    url(../img/bg_02.png) no-repeat center top / 100% 67px,

    linear-gradient(#1dadf2, #1dadf2) no-repeat center 66px / 100% calc(100% - 66px) #e2f2ff;

}

.lpSmsBdCoupon__onlineTitle {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  margin: 0;

  height: 146px;

  font-size: unset;

}

.lpSmsBdCoupon__onlineTitleEn {

  position: absolute;

  top: 0;

  left: 50%;

  margin-left: -160.5px;

  width: 321px;

  height: auto;

}

.lpSmsBdCoupon__onlineTitleText {

  display: block;

  position: relative;

  color: #fff;

  font-size: 30px;

  font-weight: 700;

  letter-spacing: 0.05em;

  line-height: 1.3;

  text-align: center;

}



/* step */



.lpSmsBdCoupon__steps {

  margin: 40px auto 0;

  max-width: 325px;

}

.lpSmsBdCoupon__step {

  position: relative;

  padding: 68px 15px 46px;

  background-color: #fff;

  border-radius: 20px;

}

.lpSmsBdCoupon__step + .lpSmsBdCoupon__step {

  margin-top: 66px;

}



/* 02 */



.lpSmsBdCoupon__step--02 {

  padding: 68px 15px 17px;

}

.lpSmsBdCoupon__stepNo {

  display: block;

  position: absolute;

  top: -27px;

  left: 50%;

  margin-left: -43px;

  width: 86px;

  height: auto;

}

.lpSmsBdCoupon__stepBlock + .lpSmsBdCoupon__stepBlock {

  margin-top: 48px;

}

.lpSmsBdCoupon__stepBalloon {

  position: relative;

  margin: 0 auto;

  max-width: 294px;

  padding: 10px;

  background-color: #c9e9f7;

  border-radius: 999px;

  font-size: 15px;

  font-weight: 500;

  letter-spacing: 0.05em;

  line-height: 1.4;

  text-align: center;

}

.lpSmsBdCoupon__stepBalloon:after {

  display: block;

  content: "";

  position: absolute;

  top: 100%;

  left: 50%;

  margin-left: -7px;

  width: 0;

  height: 0;

  border-style: solid;

  border-width: 15px 8px 0;

  border-color: #c9e9f7 transparent transparent;

}

.lpSmsBdCoupon__stepLead {

  margin: 22px 0 0;

  font-size: 14px;

  letter-spacing: 0.05em;

  text-align: center;

}

.lpSmsBdCoupon__stepMarker {

  font-size: 17px;

  font-style: normal;

  font-weight: 700;

  background: linear-gradient(transparent 55%, #fff5a0 55%);

}

.lpSmsBdCoupon__button--step {

  margin: 15px auto 0;

}

.lpSmsBdCoupon__button--step .lpSmsBdCoupon__buttonLink {

  height: 58px;

  font-size: 16px;

}

.lpSmsBdCoupon__stepText {

  margin: 0;

  font-size: 14px;

  font-weight: 500;

  letter-spacing: 0.05em;

  line-height: 1.8;

  text-align: center;

}

.lpSmsBdCoupon__stepTitle {

  margin: 2px 0 0;

  color: #009be5;

  font-size: 17px;

  font-weight: 700;

  letter-spacing: 0.05em;

  text-align: center;

}

.lpSmsBdCoupon__stepImage {

  display: block;

  margin: 18px auto 0;

  width: 100%;

  height: auto;

}

.lpSmsBdCoupon__stepArrow {

  margin: 33px auto 0;

  width: 0;

  height: 0;

  border-style: solid;

  border-width: 25px 24px 0;

  border-color: #c9e9f7 transparent transparent;

}

.lpSmsBdCoupon__stepArrow + .lpSmsBdCoupon__stepTitle {

  margin-top: 27px;

}

.lpSmsBdCoupon__stepNote {

  margin: 12px 0 0;

  font-size: 9px;

  color: #63666a;

}

.lpSmsBdCoupon__stepNote + .lpSmsBdCoupon__button {

  margin-top: 13px;

}

.lpSmsBdCoupon__step--03 .lpSmsBdCoupon__stepNote {

  margin-top: 7px;

}



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

  .lpSmsBdCoupon__online {

    padding: 81px 0 68px

  }

  .lpSmsBdCoupon__onlineTitleEn {

    margin-left: -192.5px;

    width: 385px;

  }

  .lpSmsBdCoupon__onlineTitleText {

    font-size: 36px;

    margin-top: 22px;

  }

  .lpSmsBdCoupon__steps {

    margin: 77px 30px 0;

    max-width: none;

  }

  .lpSmsBdCoupon__step {

    padding: 82px 17px 54px;

  }

  .lpSmsBdCoupon__stepNo {

    top: -32px;

    margin-left: -50px;

    width: 100px;

  }

  .lpSmsBdCoupon__stepBalloon {

    max-width: 353px;

    font-size: 18px;

    padding: 11px;

  }

  .lpSmsBdCoupon__stepLead {

    margin: 30px 0 0;

    font-size: 16.8px;

  }

  .lpSmsBdCoupon__stepMarker {

    font-size: 20px;

  }

  .lpSmsBdCoupon__button--step {

    margin: 18px auto 0;

  }

  .lpSmsBdCoupon__button--step .lpSmsBdCoupon__buttonLink {

    height: 67px;

    font-size: 18px;

  }

  .lpSmsBdCoupon__stepBlock + .lpSmsBdCoupon__stepBlock {

    margin-top: 58px;

  }

  .lpSmsBdCoupon__step + .lpSmsBdCoupon__step {

    margin-top: 80px;

  }

  .lpSmsBdCoupon__stepText {

    font-size: 16.8px;

  }

  .lpSmsBdCoupon__stepTitle {

    font-size: 20.4px;

  }

  .lpSmsBdCoupon__stepArrow {

    margin: 41px auto 0;

    border-width: 27px 28px 0;

  }

  .lpSmsBdCoupon__stepArrow + .lpSmsBdCoupon__stepTitle {

    margin-top: 36px;

  }

  .lpSmsBdCoupon__stepNote {

    margin: 14px 0 0;

    font-size: 10.8px;

  }

  .lpSmsBdCoupon__step--02 {

    padding: 79px 15px 19px;

  }

  .lpSmsBdCoupon__stepNote + .lpSmsBdCoupon__button {

    margin-top: 18px;

  }

}





/* pickup

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



.lpSmsBdCoupon__pickup {

  position: relative;

  margin: -1px 0 0;

  padding: 95px 0 59px;

  background:

    url(../img/bg_01.png) no-repeat center top / 100% 67px,

    linear-gradient(#e2f2ff, #e2f2ff) no-repeat center 66px / 100% calc(100% - 64px) #1dadf2;

}

.lpSmsBdCoupon__pickupTitle {

  position: absolute;

  top: 49px;

  left: 50%;

  margin: 0 0 0 -136px;

  width: 272.5px;

  font-size: unset;

}

.lpSmsBdCoupon__pickupTitleEn {

  display: block;

  width: 100%;

  height: auto;

}

.lpSmsBdCoupon__pickupText {

  position: relative;

  margin: 0;

  font-size: 16px;

  font-weight: 500;

  letter-spacing: 0.05em;

  line-height: 1.75;

  text-align: center;

}

.lpSmsBdCoupon__pickupItems {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  gap: 18px 26px;

  position: relative;

  margin: 41px auto 0;

  max-width: 325px;

  padding: 0;

  list-style: none;

}

.lpSmsBdCoupon__pickupItem {

  width: calc(50% - 14px);

}

.lpSmsBdCoupon__pickupLink {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  position: relative;

  height: 100%;

  padding: 27px 8px 40px;

  background-color: #fff;

  border: 1px solid #009be5;

  border-radius: 8px;

  box-shadow: 0 7px 0 #009be5;

  text-decoration: none;

  box-sizing: border-box;

}



.lpSmsBdCoupon__pickupLink--04 {

  padding: 19px 8px 37px;

}

.lpSmsBdCoupon__pickupLink--03 {

  padding: 32px 8px 37px;

}

.lpSmsBdCoupon__pickupLink--03 .lpSmsBdCoupon__pickupCopy {

  margin-top: 24px;

}



.lpSmsBdCoupon__pickupLabel {

  color: #009be5;

  font-size: 15px;

  font-weight: 700;

  letter-spacing: 0.025em;

  line-height: 1.4;

  text-align: center;

}

.lpSmsBdCoupon__pickupCopy {

  margin-top: 16px;

  color: #000;

  font-size: 12px;

  letter-spacing: 0.05em;

  line-height: 1.4;

  text-align: center;

}

.lpSmsBdCoupon__pickupLink:after {

  display: block;

  content: "";

  position: absolute;

  left: 50%;

  bottom: 17px;

  margin-left: -7px;

  width: 9px;

  height: 9px;

  border-right: 1px solid #009be5;

  border-bottom: 1px solid #009be5;

  transform: rotate(-45deg);

}

.lpSmsBdCoupon__pickupItems + .lpSmsBdCoupon__button {

  margin-top: 44px;

  max-width: 324px;

}

.lpSmsBdCoupon__pickupItems + .lpSmsBdCoupon__button .lpSmsBdCoupon__buttonLink {

  letter-spacing: 0.075em;

}



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

  .lpSmsBdCoupon__pickup {

    padding: 95px 0 66px;

  }

  .lpSmsBdCoupon__pickupTitle {

    top: 60px;

    margin-left: -166px;

    width: 331.5px;

  }

  .lpSmsBdCoupon__pickupText {

    font-size: 19.2px;

    margin-top: 20px;

  }

  .lpSmsBdCoupon__pickupItems {

    margin: 50px 30px 0;

    max-width: none;

    gap: 23px 27px;

  }

  .lpSmsBdCoupon__pickupLink {

    padding: 34px 8px 47px;

  }

  .lpSmsBdCoupon__pickupLink:after {

    margin-left: -10px;

    width: 13px;

    height: 13px;

    border-right: 2px solid #009be5;

    border-bottom: 2px solid #009be5;

  }

  .lpSmsBdCoupon__pickupLabel {

    font-size: 18px;

  }

  .lpSmsBdCoupon__pickupCopy {

    font-size: 14.4px;

  }

  .lpSmsBdCoupon__pickupLink--03 {

    padding: 34px 8px 47px;

  }

  .lpSmsBdCoupon__pickupLink--04 {

    padding: 24px 8px 45px;

  }

  .lpSmsBdCoupon__pickupItems + .lpSmsBdCoupon__button {

    margin-top: 55px;

    max-width: 389px;

  }

}



/* announcement

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



.lpSmsBdCoupon__announcement {

  margin: -1px auto 0;

  padding: 44px 25px 92px;

  background-color: #fff;

  box-sizing: border-box;

}

.lpSmsBdCoupon__announcementTitle {

  margin: 0;

  font-size: 15px;

  font-weight: 500;

  letter-spacing: 0.1em;

  text-align: center;

}

.lpSmsBdCoupon__announcementSubTitle {

  margin-top: 10px;

  padding: 10px;

  background-color: #e2f2ff;

  font-size: 13px;

  font-weight: 500;

  letter-spacing: 0.1em;

  text-align: center;

}

.lpSmsBdCoupon__announcementLists {

  margin: 14px 0 0;

  padding: 0;

  list-style: none;

}

.lpSmsBdCoupon__announcementList {

  font-size: 12px;

  letter-spacing: 0.07em;

  line-height: 2;

  text-align: justify;

}

.lpSmsBdCoupon__announcementStrong {

  color: #e60012;

}

.lpSmsBdCoupon__announcementLink {

  color: #009be5;

  text-decoration: underline;

}



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

  .lpSmsBdCoupon__announcement {

    padding: 54px 31px 92px;

  }

  .lpSmsBdCoupon__announcementTitle {

    font-size: 18px;

  }

  .lpSmsBdCoupon__announcementSubTitle {

    font-size: 15.6px;

    margin-top: 15px;

    padding: 12px;

  }

  .lpSmsBdCoupon__announcementList {

    font-size: 15.6px;

    letter-spacing: 0;

    line-height: 1.85;

  }

}



/* pcLayout

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



.lpSmsBdCoupon__pcLogo,

.lpSmsBdCoupon__pcNav {

  display: none;

}



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

  .lpSmsBdCoupon__pcLayout {

    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    padding: 0 0 0 40px;

    background-color: #e5f4ff;

    background-image:

      url(../img/deco_01_pc.svg),

      url(../img/bg_03.png);

    background-repeat: no-repeat, no-repeat;

    background-position: left top, center center;

    background-size: auto 100vh, cover;

    background-attachment: fixed, fixed;

  }

  .lpSmsBdCoupon__pcLogo {

    display: block;

    margin: 44px 0 0;

    width: 151px;

  }

  .lpSmsBdCoupon__pcLogoItem {

    display: block;

    width: 100%;

    height: auto;

  }

}



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

  .lpSmsBdCoupon__pcLayout {

    justify-content: center;

    padding: 0 10px 60px;

    background-image:

      url(../img/deco_01_pc.svg),

      url(../img/deco_02_pc.svg),

      url(../img/bg_03.png);

    background-repeat: no-repeat, no-repeat, no-repeat;

    background-position: left top, right top, center center;

    background-size: auto 100vh, auto 100vh, cover;

    background-attachment: fixed, fixed, fixed;

  }

  .lpSmsBdCoupon__pcLogo {

    margin: 44px 50px 0 0;

  }

  .lpSmsBdCoupon__pcNav {

    display: flex;

    margin: 0 0 0 16px;

    width: 300px;

    height: 100vh;

  }

  .lpSmsBdCoupon__pcNavItems {

    display: flex;

    flex-direction: column;

    justify-content: center;

    position: fixed;

    top: 0;

    left: 50%;

    margin: 0 0 0 183.5px;

    padding: 0;

    width: 300px;

    height: 100vh;

    list-style: none;

    overflow-y: auto;

    box-sizing: border-box;

  }

  .lpSmsBdCoupon__pcNavItem + .lpSmsBdCoupon__pcNavItem {

    margin-top: 20px;

  }

  .lpSmsBdCoupon__pcNavLink {

    display: flex;

    align-items: center;

    position: relative;

    padding: 0 34px 0 30px;

    height: 50px;

    background-color: #fff;

    border-radius: 999px;

    color: #009be5;

    font-size: 16px;

    font-weight: 500;

    letter-spacing: 0;

    text-decoration: none;

    box-sizing: border-box;

  }

  .lpSmsBdCoupon__pcNavLink:after {

    display: block;

    content: "";

    position: absolute;

    top: 50%;

    right: 20px;

    width: 7px;

    height: 7px;

    border-right: 1.5px solid #009be5;

    border-bottom: 1.5px solid #009be5;

    transform: translateY(-50%) rotate(-45deg);

  }



}





/* fixedNav

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



.lpSmsBdCoupon__fixedNav {

  position: fixed;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 9;

  padding: 0 90px 1px 1px;

  opacity: 0;

  visibility: hidden;

  transform: translateY(20px);

  transition-property: opacity, visibility, transform;

  transition-duration: 0.4s;

  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

}

.lpSmsBdCoupon__fixedNavItems {

  display: flex;

  justify-content: flex-start;

  align-items: stretch;

  gap: 8px;

  margin: 0 auto;

  padding: 0;

  max-width: 540px;

  list-style: none;

}

.lpSmsBdCoupon__fixedNavItem {

  flex: 1 1 0;

  max-width: 125px;

}

.lpSmsBdCoupon__fixedNavLink {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  position: relative;

  height: 100%;

  padding: 13px 4px 24px;

  background-color: #009be5;

  border-radius: 8px;

  color: #fff;

  font-size: 13px;

  font-weight: 500;

  letter-spacing: 0.025em;

  line-height: 1.4;

  text-align: center;

  text-decoration: none;

  box-sizing: border-box;

}

.lpSmsBdCoupon__fixedNavLink--light {

  background-color: #40bcf7;

}

.lpSmsBdCoupon__fixedNavLink:after {

  display: block;

  content: "";

  position: absolute;

  left: 50%;

  bottom: 10px;

  margin-left: -5px;

  width: 9px;

  height: 9px;

  border-right: 1px solid #fff;

  border-bottom: 1px solid #fff;

  transform: rotate(45deg);

}



/* show */



.lpSmsBdCoupon__fixedNav.js-fixedNav-show {

  opacity: 1;

  visibility: visible;

  transform: translateY(0);

  transition-duration: 0.5s;

  transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);

}



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

  .lpSmsBdCoupon__fixedNav {

    padding: 0 1px 1px;

  }

  .lpSmsBdCoupon__fixedNavItems {

    justify-content: center;

  }

}



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

  .lpSmsBdCoupon__fixedNav {

    display: none;

  }

}



/* hover

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



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

  .lpSmsBdCoupon__buttonLink,

  .lpSmsBdCoupon__howToNavLink,

  .lpSmsBdCoupon__pickupLink,

  .lpSmsBdCoupon__pcNavLink,

  .lpSmsBdCoupon__pcLogoItem,

  .lpSmsBdCoupon__announcementLink {

    transition-property: opacity;

    transition-duration: 0.25s;

    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);

  }

  .lpSmsBdCoupon__buttonLink:hover,

  .lpSmsBdCoupon__howToNavLink:hover,

  .lpSmsBdCoupon__pickupLink:hover,

  .lpSmsBdCoupon__pcNavLink:hover,

  .lpSmsBdCoupon__pcLogoItem:hover,

  .lpSmsBdCoupon__announcementLink:hover {

    opacity: 0.7;

  }

}