.mv {
  position: relative;
  overflow: hidden;
}
.mv-title {
  position: absolute;
  top: 30px;
  left: 20px;
}
.mv-title__ear {
  position: absolute;
  left: 151px;
  bottom: 31px;
  -webkit-animation: ear 1.2s 0.5s ease-in-out infinite alternate;
          animation: ear 1.2s 0.5s ease-in-out infinite alternate;
}
.mv__product01 {
  position: absolute;
  bottom: 72px;
  left: 90px;
  z-index: 2;
}
.mv__product02 {
  position: absolute;
  bottom: 80px;
  right: 90px;
  z-index: 2;
}
.mv__matsuge {
  position: absolute;
  left: -10px;
  bottom: 264px;
  -webkit-animation: matsuge 0.8s steps(2, end) infinite alternate;
          animation: matsuge 0.8s steps(2, end) infinite alternate;
}
.mv__eye {
  position: absolute;
  right: -26px;
  bottom: 190px;
  -webkit-animation: eye01 1.4s ease-in-out infinite alternate;
          animation: eye01 1.4s ease-in-out infinite alternate;
}
.mv .momimomi {
  position: absolute;
  right: 0;
  top: 0;
}
.mv .momimomi__heart {
  position: absolute;
  left: 0px;
  bottom: 28px;
  -webkit-animation: heart01 1.2s 0.5s ease-in-out infinite alternate;
          animation: heart01 1.2s 0.5s ease-in-out infinite alternate;
}
.mv .momimomi__pulce01 {
  position: absolute;
  top: 37px;
  left: -13px;
  -webkit-animation: pulce01 1.2s 0.5s ease-in-out infinite alternate;
          animation: pulce01 1.2s 0.5s ease-in-out infinite alternate;
}
.mv .momimomi__pulce02 {
  position: absolute;
  bottom: 35px;
  left: -20px;
  -webkit-animation: pulce01 1.2s 0.5s ease-in-out infinite alternate;
          animation: pulce01 1.2s 0.5s ease-in-out infinite alternate;
}
.mv .momimomi__label {
  position: absolute;
  bottom: -33px;
  right: 10px;
}
.outline {
  padding-block: 60px;
  padding-inline: 30px;
  background-color: #FFFAC6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 60px;
}
.outline .announce {
  width: 600px;
  border-radius: 20px;
  border: 4px solid var(--c-main);
  background: #FFF;
  padding-block: 40px;
  padding-inline: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 30px;
}
.outline .announce__title {
  font-weight: 700;
  color: var(--c-main);
  text-align: center;
}
body[data-viewport="660"][data-device=pc] .outline .announce__title {
  font-size: 30px;
}
.outline .announce__lead {
  text-align: center;
}
body[data-viewport="660"][data-device=pc] .outline .announce__lead {
  font-size: 16px;
}
.outline .announce-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 30px;
  -webkit-padding-after: 30px;
          padding-block-end: 30px;
  border-bottom: 3px solid #333;
}
.outline .announce-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 30px;
}
.outline .announce-bottom__lead {
  font-weight: 700;
}
body[data-viewport="660"][data-device=pc] .outline .announce-bottom__lead {
  font-size: 27px;
}
.outline .announce .date {
  width: 400px;
  border-radius: 5px;
  border: 3px solid #333;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-inline: 15px;
  -webkit-padding-before: 16px;
          padding-block-start: 16px;
  -webkit-padding-after: 12px;
          padding-block-end: 12px;
}
.outline .announce .date span {
  color: #E40683;
  font-weight: 700;
}
body[data-viewport="660"][data-device=pc] .outline .announce .date span {
  font-size: 24px;
}
body[data-viewport="660"][data-device=pc] .outline .announce__comment {
  font-size: 16px;
}
.outline .knowlege {
  width: 600px;
  border-radius: 20px;
  border: 4px solid var(--c-main);
  background: #FFF;
  padding-block: 40px;
  -webkit-padding-before: 90px;
          padding-block-start: 90px;
  padding-inline: 30px;
  position: relative;
}
.outline .knowlege-title {
  width: 528px;
  -webkit-padding-before: 13px;
          padding-block-start: 13px;
  -webkit-padding-after: 11px;
          padding-block-end: 11px;
  background-color: var(--c-pink);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: -30px;
}
.outline .knowlege-title__parts01 {
  -webkit-margin-end: 11px;
          margin-inline-end: 11px;
  -webkit-animation: ear02 1s ease infinite alternate;
          animation: ear02 1s ease infinite alternate;
}
.outline .knowlege-title__parts02 {
  -webkit-margin-end: 11px;
          margin-inline-end: 11px;
  -webkit-margin-before: 8px;
          margin-block-start: 8px;
}
.outline .knowlege-textbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 30px;
}
.outline .knowlege-textbox p span {
  color: var(--c-pink);
  font-weight: 700;
}
.outline .knowlege-textbox p:nth-child(2) {
  width: 370px;
}
.outline .knowlege-icon {
  width: 200px;
  height: 200px;
  border-radius: 100px;
  background-color: var(--c-pink);
  position: absolute;
  bottom: 86px;
  right: -20px;
}
body[data-viewport="660"][data-device=pc] .outline .knowlege-icon {
  right: 50px;
  bottom: -15px;
}
.outline .knowlege-icon__main {
  position: absolute;
  top: 38px;
  left: 15px;
  -webkit-animation: yubi 0.4s ease-in infinite alternate;
          animation: yubi 0.4s ease-in infinite alternate;
}
.outline .knowlege-icon__pulse {
  position: absolute;
  top: 23px;
  right: 25px;
  -webkit-animation: pulce02 0.4s ease-in infinite alternate;
          animation: pulce02 0.4s ease-in infinite alternate;
}
.outline .knowlege-icon__label {
  position: absolute;
  bottom: 28px;
  right: 44px;
  -webkit-animation: label01 0.4s ease-in infinite alternate;
          animation: label01 0.4s ease-in infinite alternate;
}

.boost {
  background-color: var(--c-boost);
  -webkit-padding-after: 50px;
          padding-block-end: 50px;
}
.boost__title {
  width: 100%;
  -webkit-padding-before: 60px;
          padding-block-start: 60px;
  -webkit-margin-after: 114px;
          margin-block-end: 114px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
}
body[data-viewport="660"][data-device=pc] .boost__title {
  -webkit-padding-before: 40px;
          padding-block-start: 40px;
}
body[data-viewport="660"][data-device=pc] .boost__title h2 {
  width: 65%;
}
body[data-viewport="660"][data-device=pc] .boost__title h2 img {
  width: 100%;
  height: auto;
}
.boost__title::after {
  content: "";
  display: block;
  background-image: url("/ear-pad/images/index/boost-title-bg.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  height: 84px;
  position: absolute;
  bottom: -84px;
}
.boost__lead {
  width: 600px;
  margin-inline: auto;
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
  padding: 30px;
  border-radius: 20px;
  background-color: #fff;
}
.boost__lead span {
  font-weight: 700;
}
.boost-product {
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
}
.boost-product__left {
  width: 273px;
  height: 438px;
  position: relative;
}
.boost-product__left .seal01 {
  position: absolute;
  top: 21px;
  left: 9px;
}
.boost-product__left .seal02 {
  width: 210px;
  height: 210px;
  border-radius: 105px;
  -webkit-padding-before: 46px;
          padding-block-start: 46px;
  -webkit-padding-after: 31px;
          padding-block-end: 31px;
  padding-inline: 30px;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.boost-product__left .seal02::before {
  content: "";
  display: block;
  width: 210px;
  height: 210px;
  border-radius: 105px;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -webkit-animation: seal01 1s ease-in infinite alternate;
          animation: seal01 1s ease-in infinite alternate;
}
.boost-product__left .seal02::after {
  content: "";
  display: block;
  width: 210px;
  height: 210px;
  border-radius: 105px;
  background-color: #fff;
  opacity: 0.2;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.boost-product__right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.boost-product__right .product-fragrance {
  padding-inline: 10px;
  padding-block: 4px;
  background-color: var(--c-main);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.boost-product__right .product-fragrance span {
  font-size: 27px;
  color: #FFF;
  font-weight: 700;
  text-box: trim-both text;
}
.boost-detail {
  text-align: center;
  position: relative;
}
.boost-detail::before {
  content: "";
  display: block;
  width: 251px;
  height: 72px;
  background-image: url("/ear-pad/images/index/boost-bg01.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: -9px;
  left: -86px;
}
.boost-detail::after {
  content: "";
  display: block;
  width: 251px;
  height: 72px;
  background-image: url("/ear-pad/images/index/boost-bg02.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: -116px;
}
.boost-detail .logo {
  -webkit-margin-after: 16px;
          margin-block-end: 16px;
}
.boost-detail .textbox p {
  color: #fff;
  font-weight: 700;
}

.sleep {
  background-color: var(--c-sleep);
  -webkit-padding-after: 50px;
          padding-block-end: 50px;
}
.sleep__title {
  width: 100%;
  -webkit-padding-before: 60px;
          padding-block-start: 60px;
  -webkit-margin-after: 114px;
          margin-block-end: 114px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
}
body[data-viewport="660"][data-device=pc] .sleep__title {
  -webkit-padding-before: 40px;
          padding-block-start: 40px;
}
body[data-viewport="660"][data-device=pc] .sleep__title h2 {
  width: 65%;
}
body[data-viewport="660"][data-device=pc] .sleep__title h2 img {
  width: 100%;
  height: auto;
}
.sleep__title::after {
  content: "";
  display: block;
  background-image: url("/ear-pad/images/index/sleep-title-bg.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  height: 84px;
  position: absolute;
  bottom: -84px;
}
.sleep__lead {
  width: 600px;
  margin-inline: auto;
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
  padding: 30px;
  border-radius: 20px;
  background-color: #fff;
}
.sleep__lead span {
  font-weight: 700;
}
.sleep-product {
  -webkit-margin-after: 30px;
          margin-block-end: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
}
.sleep-product__right {
  width: 270px;
  height: 438px;
  position: relative;
}
.sleep-product__right .seal01 {
  position: absolute;
  right: 0;
  top: 0;
}
.sleep-product__right .seal02 {
  width: 211px;
  height: 211px;
  border-radius: 105px;
  -webkit-padding-before: 46px;
          padding-block-start: 46px;
  -webkit-padding-after: 31px;
          padding-block-end: 31px;
  padding-inline: 30px;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.sleep-product__right .seal02::before {
  content: "";
  display: block;
  width: 221px;
  height: 221px;
  border-radius: 50%;
  background-image: url("/ear-pad/images/index/sleep-seal02-bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: -1;
  -webkit-animation: seal02 1s ease-in infinite alternate;
          animation: seal02 1s ease-in infinite alternate;
}
.sleep-product__left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.sleep-product__left .product-fragrance {
  padding-inline: 10px;
  padding-block: 4px;
  background-color: var(--c-pink);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.sleep-product__left .product-fragrance span {
  font-size: 27px;
  color: #FFF;
  font-weight: 700;
  text-box: trim-both text;
}
.sleep-detail {
  text-align: center;
  position: relative;
}
.sleep-detail::before {
  content: "";
  display: block;
  width: 338px;
  height: 72px;
  background-image: url("/ear-pad/images/index/sleep-bg.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  left: -219px;
}
.sleep-detail::after {
  content: "";
  display: block;
  width: 338px;
  height: 72px;
  background-image: url("/ear-pad/images/index/sleep-bg.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 13px;
  right: -169px;
}
.sleep-detail .logo {
  -webkit-margin-after: 16px;
          margin-block-end: 16px;
}
.sleep-detail .textbox p {
  color: #fff;
  font-weight: 700;
}

@-webkit-keyframes ear {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}

@keyframes ear {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@-webkit-keyframes ear02 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  80% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@keyframes ear02 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  80% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@-webkit-keyframes pulce01 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
}
@keyframes pulce01 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
}
@-webkit-keyframes pulce02 {
  100% {
    -webkit-transform: translate(4px, -9px) scale(1.1);
            transform: translate(4px, -9px) scale(1.1);
  }
}
@keyframes pulce02 {
  100% {
    -webkit-transform: translate(4px, -9px) scale(1.1);
            transform: translate(4px, -9px) scale(1.1);
  }
}
@-webkit-keyframes heart01 {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
}
@keyframes heart01 {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
}
@-webkit-keyframes matsuge {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
}
@keyframes matsuge {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
}
@-webkit-keyframes eye01 {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  30% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  70% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
  100% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
}
@keyframes eye01 {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  30% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  70% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
  100% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
}
@-webkit-keyframes yubi {
  100% {
    -webkit-transform: translateY(-6px);
            transform: translateY(-6px);
  }
}
@keyframes yubi {
  100% {
    -webkit-transform: translateY(-6px);
            transform: translateY(-6px);
  }
}
@-webkit-keyframes label01 {
  100% {
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
  }
}
@keyframes label01 {
  100% {
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
  }
}
@-webkit-keyframes seal01 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  70% {
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
  100% {
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
}
@keyframes seal01 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  70% {
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
  100% {
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
}
@-webkit-keyframes seal02 {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  30% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  70% {
    -webkit-transform: translate(-50%, -50%) scale(0.85);
            transform: translate(-50%, -50%) scale(0.85);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(0.85);
            transform: translate(-50%, -50%) scale(0.85);
  }
}
@keyframes seal02 {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  30% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  70% {
    -webkit-transform: translate(-50%, -50%) scale(0.85);
            transform: translate(-50%, -50%) scale(0.85);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(0.85);
            transform: translate(-50%, -50%) scale(0.85);
  }
}
/*# sourceMappingURL=index.css.map */