@charset "UTF-8";
/* common
================================================== */
/*
 * media query
**/
/**
 * フォントサイズの可変
 *
 * @param {number} $fontsize 基準となるフォントサイズ
 * @param {number} $basewidth 基準となる幅
 * @param {number} $maxwidth フォントサイズの拡大をとめる幅（未指定時は上限なし）
 * @param {number} $minwidth フォントサイズの縮小をとめる幅（未指定時は下限なし）
 */
@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

body {
  overscroll-behavior-y: none;
  overscroll-behavior: none;
}
body * {
  box-sizing: border-box;
}
body a {
  text-decoration: none;
  color: inherit;
}

/* melanoccplus専用: 960px～768pxで固定値のmixin */
#main .melanoccplus {
  color: #333;
}
#main .melanoccplus a:hover, #main .melanoccplus a:active, #main .melanoccplus a:focus {
  color: #333;
}
#main .melanoccplus img {
  width: 100%;
}
#main .melanoccplus .cart-btn a {
  font-size: 1.317715959vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    font-size: 12.6500732064px;
  }
}
#main .melanoccplus .cart-btn a {
  font-weight: 700;
  background: #EAE700;
  background: linear-gradient(90deg, rgb(234, 231, 0) 0%, rgb(255, 253, 89) 50%, rgb(234, 231, 0) 100%);
  border-radius: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    border-radius: 5.6222547584px;
  }
}
#main .melanoccplus .cart-btn a {
  width: 23.4260614934vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    width: 224.8901903367px;
  }
}
#main .melanoccplus .cart-btn a {
  height: 4.6852122987vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    height: 44.9780380673px;
  }
}
#main .melanoccplus .cart-btn a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  transition: opacity 0.3s ease;
  margin: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .cart-btn a {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
    border-radius: 1.0666666667vw;
    /* 960px～768pxの間で固定値 */
    width: 78.6666666667vw;
    /* 960px～768pxの間で固定値 */
    height: 13.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    font-size: 35.84px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    border-radius: 10.24px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    width: 755.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a {
    height: 128px;
  }
}
#main .melanoccplus .cart-btn a:hover {
  opacity: 0.7;
}
#main .melanoccplus .cart-btn a:before {
  content: "";
  display: block;
  width: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    width: 14.055636896px;
  }
}
#main .melanoccplus .cart-btn a:before {
  height: 1.6105417277vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    height: 15.4612005857px;
  }
}
#main .melanoccplus .cart-btn a:before {
  margin-right: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    margin-right: 7.027818448px;
  }
}
#main .melanoccplus .cart-btn a:before {
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/cart.png");
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .cart-btn a:before {
    width: 4.1333333333vw;
    /* 960px～768pxの間で固定値 */
    height: 4.2666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-right: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    width: 39.68px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    height: 40.96px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a:before {
    margin-right: 25.6px;
  }
}
#main .melanoccplus .cart-btn a::after {
  content: "";
  display: block;
  content: "";
  width: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    width: 5.6222547584px;
  }
}
#main .melanoccplus .cart-btn a::after {
  height: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    height: 5.6222547584px;
  }
}
#main .melanoccplus .cart-btn a::after {
  border-top: 3px solid currentColor;
  border-right: 3px solid currentColor;
  position: absolute;
  top: 50%;
  transform: rotate(45deg) translateY(-50%);
  right: 1.756954612vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    right: 16.8667642753px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .cart-btn a::after {
    width: 2.4vw;
    /* 960px～768pxの間で固定値 */
    height: 2.4vw;
    /* 960px～768pxの間で固定値 */
    right: 6.9333333333vw;
    /* 960px～768pxの間で固定値 */
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    width: 23.04px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    height: 23.04px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .cart-btn a::after {
    right: 66.56px;
  }
}
#main .melanoccplus .detail-btn a {
  font-size: 1.317715959vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    font-size: 12.6500732064px;
  }
}
#main .melanoccplus .detail-btn a {
  font-weight: 700;
  border-radius: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    border-radius: 5.6222547584px;
  }
}
#main .melanoccplus .detail-btn a {
  width: 23.4260614934vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    width: 224.8901903367px;
  }
}
#main .melanoccplus .detail-btn a {
  height: 4.6852122987vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    height: 44.9780380673px;
  }
}
#main .melanoccplus .detail-btn a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  border: 2px solid #777777;
  background-color: rgba(255, 255, 255, 0.3);
  transition: opacity 0.3s ease;
  margin: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .detail-btn a {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
    border-radius: 1.0666666667vw;
    /* 960px～768pxの間で固定値 */
    width: 78.6666666667vw;
    /* 960px～768pxの間で固定値 */
    height: 13.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    font-size: 35.84px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    border-radius: 10.24px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    width: 755.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a {
    height: 128px;
  }
}
#main .melanoccplus .detail-btn a:hover {
  opacity: 0.7;
}
#main .melanoccplus .detail-btn a::after {
  content: "";
  display: block;
  content: "";
  width: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    width: 5.6222547584px;
  }
}
#main .melanoccplus .detail-btn a::after {
  height: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    height: 5.6222547584px;
  }
}
#main .melanoccplus .detail-btn a::after {
  border-top: 3px solid currentColor;
  border-right: 3px solid currentColor;
  position: absolute;
  top: 50%;
  transform: rotate(45deg) translateY(-50%);
  right: 1.756954612vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    right: 16.8667642753px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .detail-btn a::after {
    width: 2.4vw;
    /* 960px～768pxの間で固定値 */
    height: 2.4vw;
    /* 960px～768pxの間で固定値 */
    right: 6.9333333333vw;
    /* 960px～768pxの間で固定値 */
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    width: 23.04px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    height: 23.04px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .detail-btn a::after {
    right: 66.56px;
  }
}
#main .melanoccplus .anchor {
  background: #EAE700;
  background: linear-gradient(90deg, rgb(234, 231, 0) 0%, rgb(255, 253, 89) 50%, rgb(234, 231, 0) 100%);
}
#main .melanoccplus .anchor ul {
  max-width: 940px;
  margin: auto;
  display: flex;
  padding-block: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul {
    padding-block: 14.055636896px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .anchor ul {
    padding-block: 3.2vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul {
    padding-block: 30.72px;
  }
}
#main .melanoccplus .anchor ul li {
  width: 33.3333%;
  font-weight: 600;
  font-size: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li {
    font-size: 14.055636896px;
  }
}
#main .melanoccplus .anchor ul li {
  padding-block: 0.8052708638vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li {
    padding-block: 7.7306002928px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .anchor ul li {
    border-left: 2px solid rgba(51, 51, 51, 0.5);
  }
  #main .melanoccplus .anchor ul li:last-child {
    border-right: 2px solid rgba(51, 51, 51, 0.5);
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .anchor ul li {
    padding-block: 2vw;
    /* 960px～768pxの間で固定値 */
    font-size: 3.4666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li {
    padding-block: 19.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li {
    font-size: 33.28px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .anchor ul li:not(:last-child) {
    border-right: 2px solid rgba(51, 51, 51, 0.5);
  }
}
#main .melanoccplus .anchor ul li a {
  display: flex;
  justify-content: center;
  gap: 0.8052708638vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a {
    gap: 7.7306002928px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .anchor ul li a {
    gap: 2vw;
    /* 960px～768pxの間で固定値 */
    flex-direction: column;
    align-items: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a {
    gap: 19.2px;
  }
}
#main .melanoccplus .anchor ul li a::after {
  content: "";
  display: block;
  content: "";
  width: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a::after {
    width: 7.027818448px;
  }
}
#main .melanoccplus .anchor ul li a::after {
  height: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a::after {
    height: 7.027818448px;
  }
}
#main .melanoccplus .anchor ul li a::after {
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(135deg);
  position: relative;
  top: 1px;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .anchor ul li a::after {
    width: 1.3333333333vw;
    /* 960px～768pxの間で固定値 */
    height: 1.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a::after {
    width: 12.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .anchor ul li a::after {
    height: 12.8px;
  }
}
#main .melanoccplus .product {
  padding-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product {
    padding-top: 35.1390922401px;
  }
}
#main .melanoccplus .product {
  padding-bottom: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product {
    padding-bottom: 7.027818448px;
  }
}
#main .melanoccplus .product {
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/product-bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/product-bg.sp.jpg");
    padding-top: 9.3333333333vw;
    /* 960px～768pxの間で固定値 */
    padding-bottom: 6vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product {
    padding-top: 89.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product {
    padding-bottom: 57.6px;
  }
}
#main .melanoccplus .product .product__block {
  display: flex;
  width: 68.8140556369vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block {
    width: 660.6149341142px;
  }
}
#main .melanoccplus .product .product__block {
  margin: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__block {
    width: 93.3333333333vw;
    /* 960px～768pxの間で固定値 */
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block {
    width: 896px;
  }
}
#main .melanoccplus .product .product__block-text {
  width: 35.944363104vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text {
    width: 345.065885798px;
  }
}
#main .melanoccplus .product .product__block-text {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text {
    margin-top: 28.1112737921px;
  }
}
#main .melanoccplus .product .product__block-text {
  margin-left: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text {
    margin-left: 14.055636896px;
  }
}
#main .melanoccplus .product .product__block-text {
  position: relative;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__block-text {
    width: 100%;
    margin-top: 0;
    margin-left: 2vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text {
    margin-left: 19.2px;
  }
}
#main .melanoccplus .product .product__block-text .product__block-text01 {
  width: 100%;
}
#main .melanoccplus .product .product__block-text .product__block-text02 {
  position: absolute;
  width: 20.4978038067vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    width: 196.7789165447px;
  }
}
#main .melanoccplus .product .product__block-text .product__block-text02 {
  top: 7.3206442167vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    top: 70.2781844802px;
  }
}
#main .melanoccplus .product .product__block-text .product__block-text02 {
  left: -1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    left: -14.055636896px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    width: 50.8vw;
    /* 960px～768pxの間で固定値 */
    top: 17.3333333333vw;
    /* 960px～768pxの間で固定値 */
    left: 0vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    width: 487.68px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    top: 166.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-text .product__block-text02 {
    left: 0px;
  }
}
#main .melanoccplus .product .product__block-text .product__block-text02 {
  overflow: hidden;
  /*---アニメーション---*/
}
#main .melanoccplus .product .product__block-text .product__block-text02 .product__block-text02-img {
  overflow: hidden;
  position: relative;
}
#main .melanoccplus .product .product__block-text .product__block-text02 .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/product-text-main.svg");
  mask-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/product-text-main.svg");
  -webkit-mask-size: 100% auto;
  mask-size: 100% auto;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: left top;
  mask-position: left top;
}
#main .melanoccplus .product .product__block-text .product__block-text02 .shine {
  position: absolute;
  top: -2%;
  left: -60%;
  width: 60%;
  padding-top: 60%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0) 90%);
  transform: skewX(30deg);
  pointer-events: none; /* クリックを妨げない */
  animation: shine 3s linear infinite;
}
@keyframes shine {
  0% {
    left: -60%;
    opacity: 0;
  }
  10% {
    opacity: 1; /* 光が出現 */
  }
  26.666% { /* 0.8秒で流れる */
    left: 100%;
    opacity: 0; /* 光が消える */
  }
  100% {
    left: 100%; /* 残りの時間は停止 */
    opacity: 0;
  }
}
#main .melanoccplus .product .product__block-img {
  width: 30.0878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-img {
    width: 288.8433382138px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__block-img {
    width: 88.5333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-inline: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-img {
    width: 849.92px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__block-img {
    margin-top: 25.6px;
  }
}
#main .melanoccplus .product .product__w {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__w {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .product .product__w {
  width: 51.2445095168vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__w {
    width: 491.9472913616px;
  }
}
#main .melanoccplus .product .product__w {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__w {
    width: 94.6666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__w {
    width: 908.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__w {
    margin-top: 64px;
  }
}
#main .melanoccplus .product .product__reco {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__reco {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .product .product__reco {
  width: 51.2445095168vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__reco {
    width: 491.9472913616px;
  }
}
#main .melanoccplus .product .product__reco {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product__reco {
    width: 94.6666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__reco {
    width: 908.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product__reco {
    margin-top: 64px;
  }
}
#main .melanoccplus .product .cart-btn {
  margin-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .cart-btn {
    margin-top: 35.1390922401px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .cart-btn {
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .cart-btn {
    margin-top: 64px;
  }
}
#main .melanoccplus .product .product-note {
  margin-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product-note {
    margin-top: 35.1390922401px;
  }
}
#main .melanoccplus .product .product-note {
  line-height: 1.8;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product-note {
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product-note {
    margin-top: 64px;
  }
}
#main .melanoccplus .product .product-note small {
  font-size: 0.878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product-note small {
    font-size: 8.4333821376px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .product .product-note small {
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .product .product-note small {
    font-size: 25.6px;
  }
}
#main .melanoccplus .about {
  position: relative;
  z-index: 4;
  margin-top: -1px;
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/about-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-inline: auto;
  height: 66.8374816984vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about {
    height: 641.6398243045px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .about {
    min-height: 642px;
  }
}
#main .melanoccplus .about {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/about-bg.sp.png");
    height: 180.1333333333vw;
    /* 960px～768pxの間で固定値 */
    padding-top: 8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about {
    height: 1729.28px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about {
    padding-top: 76.8px;
  }
}
#main .melanoccplus .about:after {
  content: "";
  display: block;
  width: 2px;
  height: 5.8565153734vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about:after {
    height: 56.2225475842px;
  }
}
#main .melanoccplus .about:after {
  bottom: -2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about:after {
    bottom: -28.1112737921px;
  }
}
#main .melanoccplus .about:after {
  left: 50%;
  transform: translateX(-50%);
  background-color: #fff;
  position: absolute;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about:after {
    width: 0.5333333333vw;
    /* 960px～768pxの間で固定値 */
    height: 16vw;
    /* 960px～768pxの間で固定値 */
    bottom: -8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about:after {
    width: 5.12px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about:after {
    height: 153.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about:after {
    bottom: -76.8px;
  }
}
#main .melanoccplus .about .about__title {
  text-align: center;
  color: #fff;
  font-family: "游明朝体", serif;
}
#main .melanoccplus .about .about__title h2 {
  font-size: 2.3426061493vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h2 {
    font-size: 22.4890190337px;
  }
}
#main .melanoccplus .about .about__title h2 {
  margin-top: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h2 {
    margin-top: 11.2445095168px;
  }
}
#main .melanoccplus .about .about__title h2 {
  font-weight: 800;
  text-shadow: 0px 0px 30px rgba(165, 50, 0, 0.6);
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__title h2 {
    margin-top: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    font-size: 5.8666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h2 {
    margin-top: 25.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h2 {
    font-size: 56.32px;
  }
}
#main .melanoccplus .about .about__title h3 {
  font-size: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h3 {
    font-size: 14.055636896px;
  }
}
#main .melanoccplus .about .about__title h3 {
  font-weight: 600;
  text-shadow: 0px 0px 30px rgba(165, 50, 0, 0.6);
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__title h3 {
    font-size: 4.2666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__title h3 {
    font-size: 40.96px;
  }
}
#main .melanoccplus .about .about__block {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    margin-top: 28.1112737921px;
  }
}
#main .melanoccplus .about .about__block {
  width: 51.9765739385vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    width: 498.9751098097px;
  }
}
#main .melanoccplus .about .about__block {
  border-radius: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    border-radius: 7.027818448px;
  }
}
#main .melanoccplus .about .about__block {
  padding-block: 5.1244509517vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    padding-block: 49.1947291362px;
  }
}
#main .melanoccplus .about .about__block {
  margin-inline: auto;
  border: 2px solid #fff;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__block {
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
    width: 94.6666666667vw;
    /* 960px～768pxの間で固定値 */
    border-radius: 1.3333333333vw;
    /* 960px～768pxの間で固定値 */
    padding-block: 9.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    margin-top: 64px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    width: 908.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    border-radius: 12.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block {
    padding-block: 89.6px;
  }
}
#main .melanoccplus .about .about__block h4 {
  color: #fff;
  font-family: "游明朝体", serif;
  font-weight: 600;
  font-size: 2.0497803807vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block h4 {
    font-size: 19.6778916545px;
  }
}
#main .melanoccplus .about .about__block h4 {
  text-shadow: 0px 0px 30px rgba(165, 50, 0, 0.6);
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__block h4 {
    font-size: 8vw;
    /* 960px～768pxの間で固定値 */
    line-height: 1.5;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block h4 {
    font-size: 76.8px;
  }
}
#main .melanoccplus .about .about__block p {
  color: #fff;
  line-height: 2;
  font-size: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p {
    font-size: 11.2445095168px;
  }
}
#main .melanoccplus .about .about__block p {
  font-weight: 700;
  text-shadow: 0px 0px 30px rgba(165, 50, 0, 0.6);
  letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__block p {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p {
    font-size: 35.84px;
  }
}
#main .melanoccplus .about .about__block p:nth-of-type(1) {
  margin-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p:nth-of-type(1) {
    margin-top: 35.1390922401px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__block p:nth-of-type(1) {
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p:nth-of-type(1) {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .about .about__block p:nth-of-type(2) {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p:nth-of-type(2) {
    margin-top: 28.1112737921px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .about .about__block p:nth-of-type(2) {
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .about .about__block p:nth-of-type(2) {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .point {
  position: relative;
  z-index: 3;
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: -14.6412884334vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point {
    margin-top: -140.5563689605px;
  }
}
#main .melanoccplus .point {
  height: 246.7057101025vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point {
    height: 2368.3748169839px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .point {
    min-height: 2368px;
    justify-content: center;
  }
}
#main .melanoccplus .point {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-bg.sp.png");
    height: 659.0666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: -19.0666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point {
    height: 6327.04px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point {
    margin-top: -183.04px;
  }
}
#main .melanoccplus .point .point__wrap {
  width: 100%;
}
#main .melanoccplus .point .point__block {
  position: relative;
  background-color: #fff;
  width: 51.9765739385vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block {
    width: 498.9751098097px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .point .point__block {
    border-radius: 0.7320644217vw;
    /* 960px～768pxの間で固定値 */
    margin: auto;
  }
}
@media screen and (min-width: 768px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block {
    border-radius: 7.027818448px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block {
    width: 97.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block {
    width: 934.4px;
  }
}
#main .melanoccplus .point .point__block .point__block-title {
  display: flex;
  gap: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title {
    gap: 14.055636896px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title {
    gap: 4.5333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title {
    gap: 43.52px;
  }
}
#main .melanoccplus .point .point__block .point__block-title picture {
  width: 7.027818448vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title picture {
    width: 67.467057101px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title picture {
    width: 16vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title picture {
    width: 153.6px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text {
  flex: 1;
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 {
  font-size: 1.756954612vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 {
    font-size: 16.8667642753px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 {
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 {
    font-size: 4.8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 {
    font-size: 46.08px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 sup {
  font-size: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 sup {
    font-size: 11.2445095168px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 sup {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 sup {
    font-size: 35.84px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 span {
  font-size: 2.4890190337vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 span {
    font-size: 23.8945827233px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 span {
    font-size: 5.6vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 span {
    font-size: 53.76px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker {
  position: relative;
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker span {
  position: relative;
  z-index: 2;
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker:after {
  content: "";
  display: block;
  width: 100%;
  height: 1.0248901903vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker:after {
    height: 9.8389458272px;
  }
}
#main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker:after {
  background: #FDF00A;
  background: linear-gradient(90deg, rgb(253, 240, 10) 0%, rgb(253, 240, 10) 20%, rgb(55, 208, 196) 100%);
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker:after {
    height: 2.9333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-title .point__block-title-text h3 .marker:after {
    height: 28.16px;
  }
}
#main .melanoccplus .point .point__block .point__block-lead {
  text-align: center;
  font-size: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-lead {
    font-size: 11.2445095168px;
  }
}
#main .melanoccplus .point .point__block .point__block-lead {
  line-height: 1.8;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block .point__block-lead {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block .point__block-lead {
    font-size: 35.84px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) {
  padding-inline: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-inline: 35.1390922401px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) {
  padding-block: 4.39238653vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-block: 42.1669106881px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-top: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-left: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-right: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-bottom: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    border-top-left-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    border-bottom-left-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-left: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-left: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-right: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    padding-bottom: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    border-top-left-radius: 51.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) {
    border-bottom-left-radius: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text h3 {
  line-height: 1.6;
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
  display: block;
  margin-top: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
    margin-top: 14.055636896px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
  font-size: 0.878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
    font-size: 8.4333821376px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 4vw;
    /* 960px～768pxの間で固定値 */
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
    font-size: 25.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-title-text small {
    margin-top: 38.4px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
  width: 29.2825768668vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
    width: 281.1127379209px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
    width: 100%;
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-img picture {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-frame.png");
  background-repeat: no-repeat;
  background-size: contain;
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
  padding-block: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    padding-block: 21.0834553441px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
  padding-inline: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    padding-inline: 14.055636896px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-frame.sp.png");
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-block: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-inline: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    gap: 16vw;
    /* 960px～768pxの間で固定値 */
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    font-size: 25.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    padding-block: 64px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    padding-inline: 51.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about {
    gap: 153.6px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list {
  width: 17.9355783309vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list {
    width: 172.1815519766px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list {
    width: 100%;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 {
  font-weight: 700;
  text-align: center;
  font-size: 1.5373352855vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 {
    font-size: 14.7584187408px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 {
    font-size: 4.8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 {
    font-size: 46.08px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 span {
  font-size: 1.317715959vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 span {
    font-size: 12.6500732064px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 span {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list h4 span {
    font-size: 35.84px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
  font-size: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
    font-size: 11.2445095168px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
  line-height: 1.8;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 4vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
    font-size: 35.84px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list p {
    margin-top: 38.4px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list:first-child {
  color: #e17000;
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-about .point__block-about-list:last-child {
  color: #02998b;
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
  position: absolute;
  right: 2.8550512445vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    right: 27.4084919473px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
  top: -3.3674963397vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    top: -32.3279648609px;
  }
}
#main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
  width: 15.3001464129vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    width: 146.8814055637px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    width: 39.2vw;
    /* 960px～768pxの間で固定値 */
    right: 4.9333333333vw;
    /* 960px～768pxの間で固定値 */
    top: -8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    width: 376.32px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    right: 47.36px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(1) .point__block-icon {
    top: -76.8px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) {
  margin-top: 4.39238653vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    margin-top: 42.1669106881px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) {
  padding-inline: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-inline: 35.1390922401px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) {
  padding-block: 4.39238653vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-block: 42.1669106881px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    margin-top: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-top: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-left: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-right: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-bottom: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    border-top-right-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    border-bottom-right-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    margin-top: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-left: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-right: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    padding-bottom: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    border-top-right-radius: 51.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) {
    border-bottom-right-radius: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-title {
  align-items: center;
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-title h3 {
  line-height: 1.6;
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
    margin-top: 21.0834553441px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
  width: 34.7730600293vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
    width: 333.8213762811px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
    margin-top: 4.6666666667vw;
    /* 960px～768pxの間で固定値 */
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:first-child {
    margin-top: 44.8px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
    margin-top: 28.1112737921px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
  width: 33.0893118594vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
    width: 317.6573938507px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-img picture:last-child {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-lead {
  margin-top: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead {
    margin-top: 21.0834553441px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead {
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-lead p {
  line-height: 1.8;
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
  font-size: 0.878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
    font-size: 8.4333821376px;
  }
}
#main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
  margin-top: 0.5856515373vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
    margin-top: 5.6222547584px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
    margin-top: 4vw;
    /* 960px～768pxの間で固定値 */
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
    margin-top: 38.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(2) .point__block-lead small {
    font-size: 25.6px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) {
  margin-top: 4.39238653vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    margin-top: 42.1669106881px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) {
  padding-inline: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-inline: 35.1390922401px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) {
  padding-bottom: 38.579795022vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-bottom: 370.3660322108px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) {
  padding-top: 4.39238653vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-top: 42.1669106881px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) {
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-img03.png");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center bottom;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    margin-top: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-top: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-left: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-right: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    padding-bottom: 93.3333333333vw;
    /* 960px～768pxの間で固定値 */
    border-top-left-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    border-bottom-left-radius: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-left: auto;
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-img03.sp.png");
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    margin-top: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-left: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-right: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    padding-bottom: 896px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    border-top-left-radius: 51.2px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) {
    border-bottom-left-radius: 51.2px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-title {
  align-items: center;
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
  position: relative;
  text-align: center;
  color: #e17000;
  font-weight: 700;
  font-size: 1.756954612vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    font-size: 16.8667642753px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
  padding-inline: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    padding-inline: 7.027818448px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
  margin-top: 2.7086383602vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    margin-top: 26.0029282577px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    margin-top: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-inline: 1.3333333333vw;
    /* 960px～768pxの間で固定値 */
    font-size: 4.8vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    margin-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    padding-inline: 12.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5 {
    font-size: 46.08px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
  content: "";
  display: block;
  width: 100%;
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-bubble.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 1.9033674963vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
    height: 18.2723279649px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
  position: absolute;
  left: 0;
  bottom: -2.5622254758vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
    bottom: -24.5973645681px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/point-bubble.sp.png");
    height: 4.5333333333vw;
    /* 960px～768pxの間で固定値 */
    bottom: -7.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
    height: 43.52px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead h5:after {
    bottom: -70.4px;
  }
}
#main .melanoccplus .point .point__block:nth-child(3) .point__block-lead p {
  margin-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead p {
    margin-top: 35.1390922401px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead p {
    margin-top: 8vw;
    /* 960px～768pxの間で固定値 */
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .point .point__block:nth-child(3) .point__block-lead p {
    margin-top: 76.8px;
  }
}
#main .melanoccplus .use {
  position: relative;
  z-index: 2;
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/use-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: -14.6412884334vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use {
    margin-top: -140.5563689605px;
  }
}
#main .melanoccplus .use {
  height: 101.8301610542vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use {
    height: 977.5695461201px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .use {
    min-height: 978px;
    justify-content: center;
  }
}
#main .melanoccplus .use {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/use-bg.sp.png");
    height: 279.7333333333vw;
    /* 960px～768pxの間で固定値 */
    margin-top: -26.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use {
    height: 2685.44px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use {
    margin-top: -256px;
  }
}
#main .melanoccplus .use:after {
  content: "";
  display: block;
  width: 2px;
  height: 5.8565153734vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use:after {
    height: 56.2225475842px;
  }
}
#main .melanoccplus .use:after {
  bottom: -0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use:after {
    bottom: -7.027818448px;
  }
}
#main .melanoccplus .use:after {
  left: 50%;
  transform: translateX(-50%);
  background-color: #fff;
  position: absolute;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use:after {
    width: 0.5333333333vw;
    /* 960px～768pxの間で固定値 */
    height: 16vw;
    /* 960px～768pxの間で固定値 */
    bottom: -4vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use:after {
    width: 5.12px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use:after {
    height: 153.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use:after {
    bottom: -38.4px;
  }
}
#main .melanoccplus .use .use__wrap {
  width: 100%;
}
#main .melanoccplus .use hgroup {
  text-align: center;
}
#main .melanoccplus .use hgroup h3 {
  font-size: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h3 {
    font-size: 14.055636896px;
  }
}
#main .melanoccplus .use hgroup h3 {
  color: #01d1b9;
  font-family: "游明朝体", serif;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use hgroup h3 {
    font-size: 4.2666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h3 {
    font-size: 40.96px;
  }
}
#main .melanoccplus .use hgroup h2 {
  font-size: 2.3426061493vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h2 {
    font-size: 22.4890190337px;
  }
}
#main .melanoccplus .use hgroup h2 {
  margin-top: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h2 {
    margin-top: 14.055636896px;
  }
}
#main .melanoccplus .use hgroup h2 {
  font-family: "游明朝体", serif;
  font-weight: 800;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use hgroup h2 {
    margin-top: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    font-size: 5.8666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h2 {
    margin-top: 25.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use hgroup h2 {
    font-size: 56.32px;
  }
}
#main .melanoccplus .use .use__block {
  width: 51.9765739385vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    width: 498.9751098097px;
  }
}
#main .melanoccplus .use .use__block {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    margin-top: 28.1112737921px;
  }
}
#main .melanoccplus .use .use__block {
  border-radius: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    border-radius: 7.027818448px;
  }
}
#main .melanoccplus .use .use__block {
  padding: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    padding: 35.1390922401px;
  }
}
#main .melanoccplus .use .use__block {
  gap: 4.9780380673vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    gap: 47.7891654466px;
  }
}
#main .melanoccplus .use .use__block {
  margin-inline: auto;
  background-color: #fff;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block {
    margin-top: 8vw;
    /* 960px～768pxの間で固定値 */
    width: 94.6666666667vw;
    /* 960px～768pxの間で固定値 */
    border-radius: 1.3333333333vw;
    /* 960px～768pxの間で固定値 */
    padding-top: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-inline: 8vw;
    /* 960px～768pxの間で固定値 */
    padding-bottom: 10.6666666667vw;
    /* 960px～768pxの間で固定値 */
    gap: 11.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    margin-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    width: 908.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    border-radius: 12.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    padding-top: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    padding-inline: 76.8px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    padding-bottom: 102.4px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block {
    gap: 112.64px;
  }
}
#main .melanoccplus .use .use__block-list {
  display: flex;
  align-items: center;
  gap: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list {
    gap: 14.055636896px;
  }
}
#main .melanoccplus .use .use__block-list {
  position: relative;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list {
    gap: 4vw;
    /* 960px～768pxの間で固定値 */
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list {
    gap: 38.4px;
  }
}
#main .melanoccplus .use .use__block-list:not(:last-child):after {
  content: "";
  display: inline-block;
  width: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    width: 21.0834553441px;
  }
}
#main .melanoccplus .use .use__block-list:not(:last-child):after {
  height: 1.0980966325vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    height: 10.541727672px;
  }
}
#main .melanoccplus .use .use__block-list:not(:last-child):after {
  bottom: -3.2942898975vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    bottom: -31.6251830161px;
  }
}
#main .melanoccplus .use .use__block-list:not(:last-child):after {
  background: #cccccc;
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    width: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
    height: 3.3333333333vw;
    /* 960px～768pxの間で固定値 */
    bottom: -7.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    width: 64px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    height: 32px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list:not(:last-child):after {
    bottom: -70.4px;
  }
}
#main .melanoccplus .use .use__block-list picture {
  width: 14.055636896vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list picture {
    width: 134.934114202px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list picture {
    width: 32vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list picture {
    width: 307.2px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text {
  flex: 1;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text {
    display: contents;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title {
  display: flex;
  align-items: center;
  gap: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title {
    gap: 14.055636896px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title {
    gap: 4vw;
    /* 960px～768pxの間で固定値 */
    flex-direction: column;
    align-items: flex-start;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title {
    gap: 38.4px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
  width: 7.3206442167vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    width: 70.2781844802px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
  height: 2.196193265vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    height: 21.0834553441px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
  border-radius: 0.2928257687vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    border-radius: 2.8111273792px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
  font-size: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    font-size: 14.055636896px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
  color: #fff;
  font-family: "游明朝体", serif;
  font-weight: 600;
  background: linear-gradient(90deg, rgb(253, 240, 10) 0%, rgb(253, 240, 10) 20%, rgb(55, 208, 196) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    width: 20vw;
    /* 960px～768pxの間で固定値 */
    height: 5.8666666667vw;
    /* 960px～768pxの間で固定値 */
    border-radius: 0.5333333333vw;
    /* 960px～768pxの間で固定値 */
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    width: 192px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    height: 56.32px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    border-radius: 5.12px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 {
    font-size: 35.84px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 span {
  text-shadow: 0px 0px 15px rgba(0, 64, 57, 0.7);
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h5 span {
    text-shadow: 0px 0px 8px rgba(0, 64, 57, 0.7);
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h4 {
  font-family: "游明朝体", serif;
  font-weight: 600;
  font-size: 2.0497803807vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h4 {
    font-size: 19.6778916545px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h4 {
    font-size: 5.8666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text .use__block-list-title h4 {
    font-size: 56.32px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text p {
  margin-top: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p {
    margin-top: 14.055636896px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text p {
  font-size: 1.1713030747vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p {
    font-size: 11.2445095168px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text p {
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p {
    margin-top: 0;
    font-size: 3.7333333333vw;
    /* 960px～768pxの間で固定値 */
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p {
    font-size: 35.84px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text p sup {
  font-size: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p sup {
    font-size: 7.027818448px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p sup {
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text p sup {
    font-size: 25.6px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text small {
  margin-top: 1.0980966325vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text small {
    margin-top: 10.541727672px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text small {
  font-size: 0.878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text small {
    font-size: 8.4333821376px;
  }
}
#main .melanoccplus .use .use__block-list .use__block-list-text small {
  display: block;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text small {
    font-size: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .use .use__block-list .use__block-list-text small {
    font-size: 25.6px;
  }
}
#main .melanoccplus .info {
  position: relative;
  z-index: 1;
  background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/info-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: -14.6412884334vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info {
    margin-top: -140.5563689605px;
  }
}
#main .melanoccplus .info {
  height: 82.7964860908vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info {
    height: 794.8462664714px;
  }
}
@media screen and (min-width: 768px) {
  #main .melanoccplus .info {
    min-height: 795px;
    justify-content: center;
  }
}
#main .melanoccplus .info {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info {
    background-image: url("/-/Media/com/melanocc/promotion/melanoccplus/20260127/info-bg.sp.png");
    height: 191.4666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: -20vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info {
    height: 1838.08px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info {
    margin-top: -192px;
  }
}
#main .melanoccplus .info .info__wrap {
  width: 100%;
  padding-top: 10.980966325vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .info__wrap {
    padding-top: 105.4172767204px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info .info__wrap {
    padding-top: 13.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .info__wrap {
    padding-top: 128px;
  }
}
#main .melanoccplus .info hgroup {
  text-align: center;
}
#main .melanoccplus .info hgroup h3 {
  font-size: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h3 {
    font-size: 14.055636896px;
  }
}
#main .melanoccplus .info hgroup h3 {
  color: #01d1b9;
  font-family: "游明朝体", serif;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info hgroup h3 {
    font-size: 4.2666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h3 {
    font-size: 40.96px;
  }
}
#main .melanoccplus .info hgroup h2 {
  font-size: 2.3426061493vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h2 {
    font-size: 22.4890190337px;
  }
}
#main .melanoccplus .info hgroup h2 {
  margin-top: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h2 {
    margin-top: 14.055636896px;
  }
}
#main .melanoccplus .info hgroup h2 {
  font-family: "游明朝体", serif;
  font-weight: 800;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info hgroup h2 {
    margin-top: 2.6666666667vw;
    /* 960px～768pxの間で固定値 */
    font-size: 5.8666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h2 {
    margin-top: 25.6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info hgroup h2 {
    font-size: 56.32px;
  }
}
#main .melanoccplus .info picture {
  margin-top: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info picture {
    margin-top: 28.1112737921px;
  }
}
#main .melanoccplus .info picture {
  width: 19.9121522694vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info picture {
    width: 191.1566617862px;
  }
}
#main .melanoccplus .info picture {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info picture {
    width: 47.2vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 6.6666666667vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info picture {
    width: 453.12px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info picture {
    margin-top: 64px;
  }
}
#main .melanoccplus .info small {
  text-align: center;
  margin-top: 0.7320644217vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info small {
    margin-top: 7.027818448px;
  }
}
#main .melanoccplus .info small {
  font-size: 0.878477306vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info small {
    font-size: 8.4333821376px;
  }
}
#main .melanoccplus .info small {
  display: block;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info small {
    font-size: 3.2vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 4vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info small {
    font-size: 30.72px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info small {
    margin-top: 38.4px;
  }
}
#main .melanoccplus .info h4 {
  font-family: "游明朝体", serif;
  text-align: center;
  margin-top: 2.7818448023vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info h4 {
    margin-top: 26.7057101025px;
  }
}
#main .melanoccplus .info h4 {
  font-size: 2.9282576867vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info h4 {
    font-size: 28.1112737921px;
  }
}
#main .melanoccplus .info h4 {
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info h4 {
    font-size: 7.4666666667vw;
    /* 960px～768pxの間で固定値 */
    margin-top: 7.7333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info h4 {
    font-size: 71.68px;
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info h4 {
    margin-top: 74.24px;
  }
}
#main .melanoccplus .info .detail-btn {
  margin-top: 3.6603221083vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .detail-btn {
    margin-top: 35.1390922401px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info .detail-btn {
    margin-top: 8.9333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .detail-btn {
    margin-top: 85.76px;
  }
}
#main .melanoccplus .info .cart-btn {
  margin-top: 1.4641288433vw;
  /* 960px～768pxの間で固定値 */
}
@media screen and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .cart-btn {
    margin-top: 14.055636896px;
  }
}
@media screen and (max-width: 767px) {
  #main .melanoccplus .info .cart-btn {
    margin-top: 5.3333333333vw;
    /* 960px～768pxの間で固定値 */
  }
}
@media screen and (max-width: 767px) and (max-width: 960px) and (min-width: 768px) {
  #main .melanoccplus .info .cart-btn {
    margin-top: 51.2px;
  }
}
#main .melanoccplus .info .cart-btn a {
  box-shadow: 0px 3px 18px 7px rgba(0, 0, 0, 0.1);
}