@charset "UTF-8";
@import url(./reset.css);
@import url(./mascaralineup.css);
@font-face {
  font-family: "Hiragino Sans GB W3";
  src: url("../fonts/Hiragino_Sans_GB_W3.otf");
}
:root {
  --bg_dark: #1a1a1a;
  --bg_white: #fff;
  --bg_pink: #e40075;
  --bg_pink_2: #e10170;
  --bg_purple: #8f3896;
  --text_dark: #1a1a1a;
  --text_pink: #e40075;
  --text_purple: #8f3896;
  --text_white: #fff;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  color: var(--text_dark);
  line-height: 1.4;
  font-size: 16px;
  min-width: 360px;
  opacity: 0;
  transition: opacity 0.6s ease;
  scroll-behavior: smooth;
}
body._unscroll {
  overflow: hidden;
}
body._loaded {
  opacity: 1;
}

img {
  max-width: 100%;
  height: auto;
  backface-visibility: hidden;
  image-rendering: auto;
}

.container {
  padding: 0 24px;
}

._mb0 {
  margin-bottom: 0 !important;
}

.c_primary_btn {
  width: 100%;
  background-color: var(--bg_pink);
  border-radius: 20px 0 20px 0;
  text-align: center;
  position: relative;
  transition: all 0.3s ease;
  margin: 0 auto;
}
.c_primary_btn:hover {
  opacity: 0.8;
}
.c_primary_btn._color2 {
  background-color: var(--bg_purple);
}
.c_primary_btn::after {
  content: url(../images/icon_arrow_02.png);
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
.c_primary_btn a {
  display: inline-block;
  padding: 11px;
  font-size: 20px;
  color: #fff;
  font-weight: 400;
  font-family: "Forum", serif;
  line-height: 1.6;
  text-transform: uppercase;
}

ul.main_menu > li {
  margin-bottom: 8px;
  position: relative;
}
ul.main_menu > li.menu_item {
  cursor: pointer;
}
ul.main_menu > li.menu_item._open::after {
  transform: rotate(0);
  transition: all 0.3s ease;
}
ul.main_menu > li.menu_item::after, ul.main_menu > li.menu_item::before {
  position: absolute;
  top: 18px;
  right: 0;
  width: 20px;
  height: 1px;
  background-color: var(--bg_white);
  display: inline-block;
  content: "";
  cursor: pointer;
}
ul.main_menu > li.menu_item::after {
  transform: rotate(90deg);
  transition: all 0.3s ease;
}
ul.main_menu > li > a, ul.main_menu > li > span {
  padding: 5px 0px;
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  font-family: "Forum", serif;
  display: block;
}
ul.main_menu > li ul.sub_menu {
  overflow: hidden;
  height: 0;
  transition: height 0.3s ease;
}
ul.main_menu > li ul.sub_menu > li > a {
  padding: 8.5px 0px;
  color: #cecece;
  font-size: 16px;
  font-weight: 400;
  font-family: "Forum", serif;
  display: block;
}

.c_note_group._black .c_note {
  color: var(--bg_dark);
}
.c_note_group .c_note {
  display: flex;
  column-gap: 3px;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--text_white);
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.5;
  letter-spacing: 0.1px;
}
.c_note_group .c_note .icon {
  letter-spacing: normal;
}
.c_note_group .c_note:last-child {
  margin-bottom: 0;
}

.c_social_link {
  padding-bottom: 40px;
  border-bottom: 1px solid #fff;
}
.c_social_link .c_social_link_follow p.star,
.c_social_link .c_social_link_review p.star {
  font-size: 16px;
  line-height: 2.4;
  color: #fff;
  font-family: "Forum", serif;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.c_social_link .c_social_link_follow p.star::before,
.c_social_link .c_social_link_review p.star::before {
  content: "";
  background: url(../images/icon_star.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 15px;
  height: 20px;
  display: inline-block;
  margin-right: 3px;
}
.c_social_link .c_social_link_follow {
  margin-bottom: 20px;
}
.c_social_link .c_social_link_follow .social_icons {
  display: flex;
  column-gap: 24px;
}
.c_social_link .c_social_link_follow .social_icons a {
  width: 24px;
  height: 24px;
  display: block;
}

.c-title {
  font-size: 40px;
  font-family: "Forum", serif;
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
}
.c-title._white {
  color: var(--text_white);
}
.c-title span {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
  display: block;
  margin-top: 2px;
}

.c-sub-title {
  position: relative;
  padding: 14px 11px 14px 11px;
  background: linear-gradient(to left, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.3) 64%, rgb(255, 255, 255) 100%);
}
.c-sub-title span {
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  font-family: "Instrument Serif", serif;
  text-transform: uppercase;
}
.c-sub-title h3 {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  color: #1a1a1a;
  font-family: "Noto Serif JP", serif;
  text-align: center;
  letter-spacing: -0.5px;
}
.c-sub-title::after, .c-sub-title::before {
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  background: url(../images/img_line.png);
  width: 100%;
  height: 2px;
}
.c-sub-title::after {
  bottom: 2px;
}
.c-sub-title::before {
  top: 2px;
}

header {
  position: fixed;
  z-index: 10;
  inset: 0 0 auto 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 44px;
  height: 80px;
  border-radius: 0 0 32px 0;
  transition: all 0.3s ease;
}
@media only screen and (max-width: 1200px) {
  header {
    padding: 0 24px;
  }
}
@media only screen and (max-width: 991px) {
  header {
    height: 68px;
  }
}
header._active {
  background-color: #ff3982;
  transition: all 0.3s ease;
}
header .header_logo,
header .header_nav,
header .header_social {
  display: flex;
  align-items: center;
}
header .header_logo {
  width: 25%;
}
@media only screen and (max-width: 768px) {
  header .header_logo {
    width: 125px;
  }
}
header .header_logo a {
  display: flex;
  align-items: center;
}
header .header_logo a img {
  width: 160px;
}
@media only screen and (max-width: 768px) {
  header .header_logo a img {
    width: 100%;
  }
}
header .header_nav {
  width: 50%;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  transition: all 0.3s ease;
}
@media only screen and (max-width: 991px) {
  header .header_nav {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    margin-top: 68px;
  }
}
header .header_nav._active {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s ease;
  height: 93.5vh;
}
header .header_nav._active nav {
  display: block;
  width: 100%;
  margin: 0 auto;
  background-color: #ff3982;
  padding: 88px 50px 0;
  transition: all 0.3s ease;
  border-radius: 0 0 64px 0;
  overflow: auto;
}
header .header_nav._active nav a {
  color: #fff;
  font-size: 20px;
  height: auto;
  display: block;
  width: 100%;
  padding: 20px 0;
  transition: all 0.3s ease;
}
header .header_nav nav {
  display: flex;
  column-gap: 32px;
  height: 100%;
  align-items: center;
  transition: all 1s ease;
}
@media only screen and (max-width: 1200px) {
  header .header_nav nav {
    column-gap: 15px;
  }
}
header .header_nav nav a {
  font-size: 18px;
  color: #fff;
  font-family: "Forum", serif;
  display: flex;
  height: 100%;
  align-items: center;
}
header .header_nav nav a:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}
header .header_nav nav ul.main_menu li.menu_item > span {
  padding: 5px 0px;
  color: var(--text_white);
  font-size: 20px;
  font-weight: 400;
  font-family: "Forum", serif;
  display: block;
  margin-bottom: 12px;
}
header .header_nav nav ul.main_menu li.menu_item::after, header .header_nav nav ul.main_menu li.menu_item::before {
  display: none;
}
@media only screen and (max-width: 991px) {
  header .header_nav nav ul.main_menu li.menu_item::after, header .header_nav nav ul.main_menu li.menu_item::before {
    display: block;
  }
}
header .header_nav nav ul.main_menu li.menu_item ul.sub_menu li {
  margin-bottom: 12px;
}
header .header_nav nav ul.main_menu li.menu_item ul.sub_menu li:last-child {
  margin-bottom: 0;
}
header .header_nav nav ul.main_menu li.menu_item ul.sub_menu li a {
  font-size: 16px;
  color: var(--text_white);
}
header .header_nav nav .social_sp {
  display: none;
}
@media only screen and (max-width: 991px) {
  header .header_nav nav .social_sp {
    display: block;
  }
}
header .header_nav nav .social_sp .social_sp_online_store {
  position: relative;
  margin-left: 0;
  color: var(--text_white);
  font-size: 20px;
  font-family: "Forum", serif;
  width: fit-content;
  padding: 8px 0px 8px 26px;
  background: none;
}
@media only screen and (max-width: 1200px) {
  header .header_nav nav .social_sp .social_sp_online_store {
    margin-left: 0px;
    padding: 15px 0px 15px 40px;
    margin-top: 40px;
    width: 80%;
  }
}
header .header_nav nav .social_sp .social_sp_online_store::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--text_white);
  transition: all 0.3s ease;
}
header .header_nav nav .social_sp .social_sp_online_store .icon-shop {
  background: url(../images/icon_shop.png) center/contain no-repeat;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 25px;
  height: 25px;
}
header .header_nav ._is_sp {
  display: none;
}
@media only screen and (max-width: 991px) {
  header .header_nav ._is_sp {
    display: block !important;
  }
}
header .header_nav ._is_pc {
  display: block;
}
@media only screen and (max-width: 991px) {
  header .header_nav ._is_pc {
    display: none !important;
  }
}
header .header_social {
  width: 25%;
  column-gap: 16px;
  justify-content: flex-end;
}
@media only screen and (max-width: 1100px) {
  header .header_social {
    column-gap: 10px;
  }
}
@media only screen and (max-width: 991px) {
  header .header_social {
    display: none;
  }
}
header .header_social a {
  width: 16px;
  height: 16px;
  display: block;
  transition: all 0.3s ease;
}
header .header_social a:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}
header .header_social .online_store {
  position: relative;
  margin-left: 16px;
  color: var(--text_white);
  font-size: 14px;
  font-family: "Forum", serif;
  width: fit-content;
  padding: 8px 0px 8px 26px;
  background: none;
}
@media only screen and (max-width: 1200px) {
  header .header_social .online_store {
    margin-left: 0px;
    padding: 8px 0px 8px 20px;
  }
}
header .header_social .online_store:hover {
  opacity: 0.8;
}
header .header_social .online_store:hover::after {
  transform: scaleX(0);
  transition: all 0.3s ease;
}
header .header_social .online_store::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--text_white);
  transition: all 0.3s ease;
  transform: scaleX(1);
  transform-origin: right;
  /* QUAN TRỌNG */
}
header .header_social .online_store .icon-shop {
  background: url(../images/icon_shop.png) center/contain no-repeat;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
}
header .header_burger {
  display: none;
  z-index: 999;
  cursor: pointer;
}
header .header_burger .line1,
header .header_burger .line2,
header .header_burger .line3 {
  display: block;
  width: 40px;
  height: 1px;
  margin: 8px 0;
  background-color: #fff;
  transition: all 0.3s;
}
header .header_burger._active .line2 {
  opacity: 0;
}
header .header_burger._active .line1 {
  transform: translateY(10px) rotate(-45deg);
}
header .header_burger._active .line3 {
  transform: translateY(-10px) rotate(45deg);
}
@media only screen and (max-width: 991px) {
  header .header_burger {
    display: block;
  }
}

.main_background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
}
@media only screen and (max-width: 768px) {
  .main_background {
    display: none;
  }
}
.main_background .bg_left {
  height: calc(100vh - 80px);
  margin-top: 80px;
  background: url(../images/bg_left.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 991px) {
  .main_background .bg_left {
    width: 100%;
    height: calc(100vh - 45px);
    margin-top: 45px;
    justify-content: flex-start;
  }
}
.main_background .bg_left .anchor_inner {
  transform: translateY(-100px);
}
@media only screen and (max-width: 991px) {
  .main_background .bg_left .anchor_inner {
    transform: translateY(-40px);
  }
}
@media only screen and (max-width: 991px) {
  .main_background .bg_left .anchor_inner {
    display: none;
  }
}
.main_background .bg_left .anchor_inner ul.anchor_link {
  display: block;
  margin-bottom: 25px;
}
.main_background .bg_left .anchor_inner ul.anchor_link li {
  padding: 7px 10px 7px 10px;
  position: relative;
  width: 240px;
}
@media only screen and (max-width: 1200px) {
  .main_background .bg_left .anchor_inner ul.anchor_link li {
    width: 200px;
  }
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_left .anchor_inner ul.anchor_link li {
    width: 160px;
  }
}
.main_background .bg_left .anchor_inner ul.anchor_link li a {
  font-size: 22px;
  color: var(--text_dark);
  font-family: "Forum", serif;
  display: block;
  text-transform: uppercase;
  transition: all 0.3s ease;
}
@media only screen and (max-width: 1300px) {
  .main_background .bg_left .anchor_inner ul.anchor_link li a {
    font-size: 18px;
  }
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_left .anchor_inner ul.anchor_link li a {
    font-size: 16px;
  }
}
.main_background .bg_left .anchor_inner ul.anchor_link li a:hover {
  opacity: 0.8;
}
.main_background .bg_left .anchor_inner ul.anchor_link li::after {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  content: "";
  display: inline-block;
  width: 13px;
  height: 11px;
  background: url(../images/icon_arrow_04.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_left .anchor_inner ul.anchor_link li::after {
    width: 11px;
    height: 9px;
  }
}
.main_background .bg_left .anchor_inner .c_primary_btn {
  max-width: 240px;
}
@media only screen and (max-width: 1200px) {
  .main_background .bg_left .anchor_inner .c_primary_btn a {
    font-size: 16px;
  }
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_left .anchor_inner .c_primary_btn a {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1200px) {
  .main_background .bg_left .anchor_inner .c_primary_btn::after {
    top: 43%;
    right: 9px;
  }
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_left .anchor_inner .c_primary_btn::after {
    right: 6px;
  }
}
.main_background .bg_right {
  height: 100vh;
  margin-top: 65px;
  background: url(../images/bg_3.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .main_background .bg_right {
    display: none;
  }
}
.main_background .bg_right .layer {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  object-fit: cover;
}
.main_background .bg_right .char {
  height: inherit;
  z-index: 1;
  object-fit: contain;
  top: 15px;
  top: -60px;
}
.main_background .bg_right .opacity {
  height: auto;
  z-index: 2;
  width: 100%;
}
@media only screen and (min-width: 1440px) {
  .main_background .bg_right .opacity {
    width: 100%;
    transform: translate(-50%, 50px);
  }
}
@media only screen and (max-width: 1024px) {
  .main_background .bg_right .opacity {
    transform: scale(2);
    bottom: 30px;
  }
}
.main_background .bg_right .product {
  bottom: 75px;
  left: 50%;
  transform: translateX(-50%);
  height: auto;
  z-index: 3;
  width: 58%;
}
@media only screen and (max-width: 1440px) {
  .main_background .bg_right .product {
    width: 80%;
  }
}

.main_inner {
  display: flex;
  justify-content: space-between;
}

.main_kv {
  position: relative;
  z-index: 1;
  background: url(../images/img_kv_01.jpg) top center/cover;
  height: 100vh;
  background: unset;
  height: auto;
}
@media only screen and (max-width: 1500px) {
  .main_kv {
    background: url(../images/img_kv_08.jpg) top center/cover;
  }
}
@media only screen and (max-width: 1024px) {
  .main_kv {
    height: auto;
    background: none;
  }
}
@media only screen and (max-width: 991px) {
  .main_kv {
    height: auto;
    background: none;
  }
}
.main_kv img.kv {
  position: absolute;
}
.main_kv img.kv._kv_01 {
  bottom: 80px;
  z-index: 2;
  left: 50px;
}
@media only screen and (max-width: 1920px) {
  .main_kv img.kv._kv_01 {
    width: 180px;
  }
}
@media only screen and (max-width: 1600px) {
  .main_kv img.kv._kv_01 {
    left: 30px;
  }
}
@media only screen and (max-width: 1500px) {
  .main_kv img.kv._kv_01 {
    width: 150px;
  }
}
@media only screen and (max-width: 1300px) {
  .main_kv img.kv._kv_01 {
    width: 120px;
    left: 20px;
  }
}
@media only screen and (max-width: 1240px) {
  .main_kv img.kv._kv_01 {
    display: none;
  }
}
.main_kv img.kv._kv_02 {
  bottom: 80px;
  right: 30px;
  z-index: 2;
}
@media only screen and (max-width: 1920px) {
  .main_kv img.kv._kv_02 {
    width: 300px;
  }
}
@media only screen and (max-width: 1600px) {
  .main_kv img.kv._kv_02 {
    right: 0px;
  }
}
@media only screen and (max-width: 1500px) {
  .main_kv img.kv._kv_02 {
    width: 240px;
  }
}
@media only screen and (max-width: 1300px) {
  .main_kv img.kv._kv_02 {
    width: 200px;
  }
}
@media only screen and (max-width: 1240px) {
  .main_kv img.kv._kv_02 {
    display: none;
  }
}
.main_kv img.kv_sp {
  width: 100%;
  height: auto;
  display: none;
}
@media only screen and (max-width: 768px) {
  .main_kv img.kv_sp {
    display: block;
  }
}
@media only screen and (max-width: 376px) {
  .main_kv img.kv_sp {
    height: 98vh;
    object-fit: cover;
    margin-top: -50px;
  }
}

.main_content {
  width: 390px;
  position: relative;
  z-index: 1;
  background-color: #fff;
  padding-top: 80px;
  box-shadow: rgba(228, 50, 117, 0.25) 0px 13px 27px -5px, rgba(228, 50, 117, 0.3) 0px 8px 16px -8px;
}
@media only screen and (max-width: 991px) {
  .main_content {
    padding-top: 60px;
  }
}
@media only screen and (max-width: 768px) {
  .main_content {
    width: auto;
    margin: 0 !important;
    padding-top: 0;
  }
}
.main_content .renewal {
  position: relative;
  padding: 28px 0 40px 0;
  background-color: var(--bg_dark);
}
@media only screen and (max-width: 991px) {
  .main_content .renewal {
    padding: 60px 0 80px 0;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .renewal {
    padding: 170px 0 40px 0;
  }
}
@media only screen and (max-width: 480px) {
  .main_content .renewal {
    padding: 150px 0 40px 0;
  }
}
@media only screen and (max-width: 450px) {
  .main_content .renewal {
    padding: 125px 0 40px 0;
  }
}
@media only screen and (max-width: 391px) {
  .main_content .renewal {
    padding: 120px 0 40px 0;
  }
}
@media only screen and (max-width: 376px) {
  .main_content .renewal {
    padding: 110px 0 40px 0;
  }
}
.main_content .renewal h2 img {
  max-width: 102%;
}
.main_content .renewal::before {
  content: "";
  position: absolute;
  top: -198px;
  right: 0;
  width: 105%;
  height: 200px;
  clip-path: polygon(100% 64%, 0% 100%, 100% 100%);
  background: var(--bg_dark);
  display: none;
}
@media only screen and (max-width: 768px) {
  .main_content .renewal::before {
    display: block;
  }
}
.main_content .renewal figure.renewal_main_img {
  text-align: center;
}
.main_content .renewal figure.renewal_main_img img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.main_content .renewal img.renewal_product_sp {
  position: absolute;
  top: -300px;
  right: 10px;
  width: auto;
  height: 350px;
  object-fit: contain;
  display: none;
}
@media only screen and (max-width: 768px) {
  .main_content .renewal img.renewal_product_sp {
    display: block;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .renewal img.renewal_product_sp {
    top: -23%;
    right: 0;
    height: auto;
    width: 100%;
  }
}
@media only screen and (max-width: 391px) {
  .main_content .renewal img.renewal_product_sp {
    top: -17%;
    height: 260px;
  }
}
@media only screen and (max-width: 376px) {
  .main_content .renewal img.renewal_product_sp {
    right: 0;
    width: 91%;
  }
}
@media only screen and (max-width: 350px) {
  .main_content .renewal img.renewal_product_sp {
    right: 0;
    top: -20%;
  }
}
.main_content .special_movie {
  background: url(../images/bg_special_movie.jpg) top center/cover;
  height: auto;
  padding: 50px 0 145px 0;
}
.main_content .special_movie .c-title {
  margin-bottom: 11px;
}
.main_content .special_movie .special_movie_video {
  overflow: hidden;
  position: relative;
  margin: 0 13.5px 54px;
  cursor: pointer;
}
.main_content .special_movie .special_movie_video .play_btn {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
  transition: all 0.3s ease;
}
.main_content .special_movie .special_movie_video .play_btn:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}
.main_content .special_movie .special_movie_video img.movie_bg {
  transition: all 0.3s ease;
  width: 100%;
}
.main_content .special_movie .special_movie_video:hover img.movie_bg {
  transform: scale(1.1);
  transition: all 0.3s ease;
}
.main_content .special_movie .c-sub-title {
  margin-bottom: 14px;
}
.main_content .special_movie .special_movie_character .character_avatar {
  text-align: right;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .main_content .special_movie .special_movie_character .character_avatar {
    text-align: center;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .special_movie .special_movie_character .character_avatar {
    text-align: right;
  }
}
.main_content .special_movie .special_movie_character .character_avatar img {
  width: 232px;
  margin-left: auto;
}
@media only screen and (max-width: 768px) {
  .main_content .special_movie .special_movie_character .character_avatar img {
    margin-left: 200px;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .special_movie .special_movie_character .character_avatar img {
    margin-left: auto;
  }
}
.main_content .special_movie .special_movie_character .character_avatar .name {
  position: absolute;
  top: 80px;
  left: 0;
  font-size: 16px;
  color: #fff;
}
@media only screen and (max-width: 768px) {
  .main_content .special_movie .special_movie_character .character_avatar .name {
    margin-left: 120px;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .special_movie .special_movie_character .character_avatar .name {
    margin-left: 0;
  }
}
.main_content .special_movie .special_movie_character .character_avatar .name span {
  display: block;
  color: var(--bg_dark);
  text-align: left;
}
.main_content .special_movie .special_movie_character .character_avatar .name span:nth-child(1) {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 14px;
  letter-spacing: -0.1px;
}
.main_content .special_movie .special_movie_character .character_avatar .name span:nth-child(2) {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 15px;
}
.main_content .special_movie .special_movie_character .character_avatar .name span:nth-child(3) {
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
}
.main_content .special_movie .special_movie_character .character_content {
  position: relative;
  margin-top: -45px;
  padding: 22px 24px 24px 22px;
  position: relative;
  margin-top: -68px;
  letter-spacing: -0.5px;
  border: 1px solid transparent;
  border-radius: 30px 0 30px 0;
  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #f0cc7e 0%, #f4db8c 19%, #f9f3e5 41%, #c78a03 73%, #e3b75e 89%, #efca84 95%) border-box;
}
.main_content .special_movie .special_movie_character .character_content p {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  color: #1a1a1a;
  line-height: 2;
}
.main_content .special_movie .special_movie_character .character_content img {
  position: absolute;
}
.main_content .special_movie .special_movie_character .character_content img.tag {
  top: -137px;
  left: 72px;
  width: 124px;
}
@media only screen and (max-width: 768px) {
  .main_content .special_movie .special_movie_character .character_content img.tag {
    margin-left: 120px;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .special_movie .special_movie_character .character_content img.tag {
    margin-left: 0;
    left: 67px;
  }
}
.main_content .special_movie .special_movie_character .character_content img.phone {
  top: -142px;
  left: 0;
  width: 29%;
  filter: drop-shadow(0px 7px 29px rgba(228, 50, 117, 0.2));
  image-rendering: -webkit-optimize-contrast;
}
@media only screen and (max-width: 768px) {
  .main_content .special_movie .special_movie_character .character_content img.phone {
    top: -130px;
    width: 90px;
    margin-left: 125px;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .special_movie .special_movie_character .character_content img.phone {
    margin-left: 0;
  }
}
.main_content .mascara .mascara_title {
  margin-top: -89px;
  border-radius: 0 56px 0 0;
  background: var(--bg_dark);
  padding: 18px 24px 21px;
}
.main_content .mascara .mascara_title .c_note_group {
  margin-top: -6px;
}
.main_content .mascara .mascara_product {
  display: flex;
  margin-top: -10px;
}
.main_content .mascara .mascara_product .product_item {
  border-radius: 10px 10px 0 0;
  padding: 12px 12px 14px 21px;
  width: 50%;
  background-color: var(--bg_pink);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  overflow: hidden;
}
.main_content .mascara .mascara_product .product_item._color2 {
  background-color: var(--bg_purple);
  padding: 9px 15px 14px 12px;
}
.main_content .mascara .mascara_product .product_item span {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 16px;
  color: var(--text_white);
  line-height: 1;
  margin-top: 1px;
}
.main_content .mascara .mascara_info {
  display: flex;
}
.main_content .mascara .mascara_info .info_item {
  padding: 18px 12px 24px 24px;
  width: 50%;
  background-color: #ffe2f1;
}
.main_content .mascara .mascara_info .info_item._color2 {
  background-color: #ead6ec;
}
.main_content .mascara .mascara_info .info_item._padding_left {
  padding: 18px 24px 24px 12px;
}
.main_content .mascara .mascara_info .info_item img.sample {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 8px;
  display: inline-block;
  margin-bottom: 10px;
}
@media only screen and (max-width: 575px) {
  .main_content .mascara .mascara_info .info_item img.sample {
    height: 120px;
  }
}
.main_content .mascara .mascara_info .info_item h4 {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 18px;
  color: var(--text_dark);
  line-height: 1.4;
  text-align: center;
  margin-bottom: 7px;
  letter-spacing: 0.1px;
}
.main_content .mascara .mascara_info .info_item p.text_01 {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 23px;
  letter-spacing: 0px;
}
.main_content .mascara .mascara_info .info_item .brush_sample {
  padding: 19px 8px 20px 8px;
  background-color: var(--text_white);
  position: relative;
  letter-spacing: -0.5px;
}
.main_content .mascara .mascara_info .info_item .brush_sample span {
  position: absolute;
  top: -12px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  color: var(--text_pink);
  text-transform: uppercase;
  font-size: 14px;
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  padding: 5px 16px;
  border-radius: 38px;
  background-color: var(--bg_white);
  letter-spacing: -0.5px;
}
.main_content .mascara .mascara_info .info_item .brush_sample span._color2 {
  color: var(--text_purple);
}
.main_content .mascara .mascara_info .info_item .brush_sample h5 {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 13px;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 8px;
}
.main_content .mascara .mascara_info .info_item .brush_sample p.text_02 {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 16px;
}
.main_content .mascara .mascara_info .info_item .brush_sample img {
  width: 100%;
  margin-left: -8px;
}
.main_content .mascara .mascara_cards {
  padding: 10px 0 56px;
  background: url(../images/bg_mascara.jpg) top center/cover;
  height: auto;
  min-height: 500px;
  padding: 10px 0 36px 0;
}
.main_content .mascara .mascara_cards .note {
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
  padding-bottom: 54px;
}
.main_content .mascara .mascara_cards .mascara_cards_item {
  padding: 40px 20px 32px;
  background-color: #fff;
  overflow: hidden;
  border-radius: 30px 0 30px 0;
  border: 1px solid var(--bg_pink);
  position: relative;
  margin-bottom: 24px;
}
.main_content .mascara .mascara_cards .mascara_cards_item .order {
  position: absolute;
  top: 0;
  left: 0;
  color: var(--text_white);
  background-color: var(--bg_pink);
  border-radius: 0 0 30px 0;
  font-family: "Instrument Serif", serif;
  font-size: 20px;
  font-weight: 400;
  padding: 3px 25px 2px 23px;
  letter-spacing: -0.3px;
}
.main_content .mascara .mascara_cards .mascara_cards_item .order .num {
  font-size: 32px;
  margin-left: 6px;
}
.main_content .mascara .mascara_cards .mascara_cards_item img.tag {
  position: absolute;
  top: 10px;
  right: 9px;
  width: 90px;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  letter-spacing: -1.5px;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4._custom_title {
  margin-top: 23px;
  margin-bottom: 18px;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4._custom_title span {
  font-size: 24px;
  line-height: 1.5;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4._custom_title span._custom_title {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  display: inline-block;
  margin-top: 7px;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4 img {
  width: 111px;
  margin-bottom: 12px;
  display: inline-block;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4 span {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 32px;
  line-height: 1.3;
  text-align: center;
}
.main_content .mascara .mascara_cards .mascara_cards_item h4 span._color2 {
  color: var(--text_pink);
}
.main_content .mascara .mascara_cards .mascara_cards_item h4 span sup {
  font-family: "Noto Serif JP", serif;
  font-size: 10px;
}
.main_content .mascara .mascara_cards .mascara_cards_item .subtitle {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 11px;
  text-align: center;
  letter-spacing: -0.5px;
  margin-top: 10px;
}
.main_content .mascara .mascara_cards .mascara_cards_item .subtitle sup {
  font-family: "Noto Serif JP", serif;
  font-size: 10px;
}
.main_content .mascara .mascara_cards .mascara_cards_item .content {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 16px;
  letter-spacing: 0px;
}
.main_content .mascara .mascara_cards figure {
  margin-bottom: 16px;
}
.main_content .mascara .mascara_cards figure img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 10px;
}
.main_content .mascara .mascara_cards figure figcaption {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-size: 12px;
  color: #1a1a1a;
  line-height: 1.5;
  text-align: center;
  margin-top: 5px;
}
.main_content .mascara .mascara_cards .mascara_cards_col2 {
  display: flex;
  column-gap: 25px;
  justify-content: center;
  margin-bottom: 21px;
}
.main_content .mascara .mascara_cards .mascara_cards_col2 .card_col2_item img {
  width: 90px;
  height: 90px;
  object-fit: cover;
  border-radius: 50%;
}
.main_content .mascara .mascara_cards .mascara_cards_col2 .card_col2_item p {
  margin-top: 5px;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}
.main_content .mascara .mascara_cards .mascara_cards_col3 {
  display: flex;
  column-gap: 12px;
  justify-content: space-between;
  margin: 0 auto 17px;
}
@media only screen and (max-width: 768px) {
  .main_content .mascara .mascara_cards .mascara_cards_col3 {
    width: 70%;
    margin: 0 auto 12px;
  }
}
@media only screen and (max-width: 575px) {
  .main_content .mascara .mascara_cards .mascara_cards_col3 {
    width: 100%;
  }
}
.main_content .mascara .mascara_cards .mascara_cards_col3 .card_col3_item {
  text-align: center;
}
.main_content .mascara .mascara_cards .mascara_cards_col3 .card_col3_item img {
  width: 90px;
  height: 90px;
  object-fit: cover;
  border-radius: 50%;
}
.main_content .mascara .mascara_cards .mascara_cards_col3 .card_col3_item p {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
  letter-spacing: -0.5px;
  margin-top: 5px;
}
.main_content .mascara .mascara_cards .mascara_cards_col3 .card_col3_item p sup {
  font-family: "Noto Sans JP", serif;
  font-size: 8px;
}
.main_content .colorlineup._bg_pink {
  background: #ffe2f1;
}
.main_content .colorlineup._bg_purple {
  background: #ead6ec;
}
.main_content .colorlineup .colorlineup_option {
  display: flex;
  transform: translateY(-22px);
}
.main_content .colorlineup .colorlineup_option .option_left,
.main_content .colorlineup .colorlineup_option .option_right {
  border-radius: 10px 10px 0 0;
}
.main_content .colorlineup .colorlineup_option .option_left p,
.main_content .colorlineup .colorlineup_option .option_right p {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 16px;
  color: var(--text_white);
  line-height: 1.3;
  text-align: center;
  letter-spacing: -0.3px;
  margin-bottom: 14px;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list,
.main_content .colorlineup .colorlineup_option .option_right .options_list {
  display: flex;
  justify-content: center;
  column-gap: 20px;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item {
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-size: 24px;
  color: #fff;
  line-height: 1.4;
  text-align: center;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item span,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item span {
  display: block;
  width: 60px;
  height: 60px;
  background-color: #000000;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  transition: all 0.3s ease;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item span::after,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: 1px solid;
  border-color: transparent;
  transition: all 0.2s ease-in-out;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item span._active::after,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item span._active::after {
  border-color: var(--bg_white);
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item span._color2,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item span._color2 {
  background-color: #843c0c;
}
.main_content .colorlineup .colorlineup_option .option_left .options_list li.option_item span._color3,
.main_content .colorlineup .colorlineup_option .option_right .options_list li.option_item span._color3 {
  background-color: #504239;
}
.main_content .colorlineup .colorlineup_option .option_left {
  flex: 2;
  background-color: var(--bg_pink_2);
  padding: 15px 20px 23px 29px;
}
@media only screen and (max-width: 391px) {
  .main_content .colorlineup .colorlineup_option .option_left {
    flex: unset;
    width: 70%;
    margin: 0 auto !important;
  }
}
.main_content .colorlineup .colorlineup_option .option_right {
  flex: 1;
  padding: 15px 20px 23px 16px;
  background-color: var(--bg_purple);
}
@media only screen and (max-width: 391px) {
  .main_content .colorlineup .colorlineup_option .option_right {
    flex: unset;
    width: -webkit-fill-available;
    margin: 0 auto !important;
  }
}
.main_content .colorlineup .colorlineup_slider {
  padding: 31px 0 32px;
  position: relative;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder {
  display: none;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item {
  width: 72%;
  margin: 0 auto;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_img {
  position: relative;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_img img.main_img {
  border-radius: 10px;
  height: auto;
  margin-right: 360px;
  width: 100%;
  object-fit: cover;
}
@media only screen and (max-width: 575px) {
  .main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_img img.main_img {
    height: 187px;
  }
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_img img.sub_img {
  position: absolute;
  bottom: -53px;
  right: -35px;
  object-fit: cover;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info {
  margin-top: 19px;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info span.tag {
  padding: 5px 13px;
  background-color: var(--bg_pink_2);
  border-radius: 80px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 14px;
  color: #fff;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info span.tag._color2 {
  background-color: var(--bg_purple);
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info h3 {
  margin: 12px 0 5px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 20px;
  line-height: 1.4;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info h3 span.no {
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-size: 24px;
  margin-right: 3px;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder .colorlineup_product .colorlineup_product_item .product_info p {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.4;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_slider_innder._active {
  display: block;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_arrow {
  position: absolute;
  top: 30%;
  width: 56px;
  height: 56px;
  border-radius: 100%;
  border: 1px solid #ffbed6;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_arrow._left {
  left: 25px;
  transform: rotate(180deg);
}
.main_content .colorlineup .colorlineup_slider .colorlineup_arrow._right {
  right: 25px;
}
.main_content .colorlineup .colorlineup_slider .colorlineup_arrow._disable {
  opacity: 0.3;
  pointer-events: none;
}
.main_content .colorlineup .colorlineup_notice p {
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-size: 12px;
  text-align: right;
  padding-bottom: 66px;
}
.main_content .how_to_use {
  margin-top: -56px;
  padding: 50px 0 55px;
  background-color: var(--bg_dark);
  border-radius: 56px 0 0 0;
}
.main_content .how_to_use .c-title {
  margin-bottom: 20px;
}
.main_content .how_to_use .how_to_use_steps {
  margin-bottom: 36px;
}
.main_content .how_to_use .how_to_use_steps .steps_item {
  display: flex;
  column-gap: 5px;
  margin-bottom: 24px;
  align-items: center;
}
.main_content .how_to_use .how_to_use_steps .steps_item:last-child {
  margin-bottom: 0;
}
.main_content .how_to_use .how_to_use_steps .steps_item .steps_item_img {
  width: 100%;
}
.main_content .how_to_use .how_to_use_steps .steps_item .steps_item_info {
  width: -webkit-fill-available;
}
.main_content .how_to_use .how_to_use_steps .steps_item .steps_item_info .label {
  font-family: "Instrument Serif", serif;
  display: inline-block;
  position: relative;
  margin-bottom: 9px;
  letter-spacing: -0.5px;
  background: linear-gradient(to bottom, #f7f7e4, #e7d2b2);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 22px;
}
.main_content .how_to_use .how_to_use_steps .steps_item .steps_item_info .label::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: inline-block;
  height: 1px;
  line-height: 0;
  width: 100%;
  background: linear-gradient(to bottom, #f7f7e4, #e7d2b2);
}
.main_content .how_to_use .how_to_use_steps .steps_item .steps_item_info .desc {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  color: var(--text_white);
}
.main_content .how_to_use .how_to_use_point {
  margin-bottom: 39px;
  padding: 16px 18px 22px 23px;
  border: 1px solid transparent;
  position: relative;
  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #f0cc7e 0%, #f4db8c 19%, #f9f3e5 41%, #c78a03 73%, #e3b75e 89%, #efca84 95%) border-box;
}
.main_content .how_to_use .how_to_use_point h3 {
  font-family: "Instrument Serif", serif;
  font-weight: 500;
  font-size: 32px;
  margin-bottom: 7px;
  text-align: center;
  letter-spacing: -0.5px;
}
.main_content .how_to_use .how_to_use_point ul li {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  display: flex;
  column-gap: 5px;
  margin-bottom: 9px;
  letter-spacing: -0.5px;
}
.main_content .how_to_use .how_to_use_point ul li::before {
  margin-top: 11px;
  content: "・";
  display: inline-block;
  line-height: 0;
}
.main_content .how_to_use .how_to_use_point .corner {
  position: absolute;
}
.main_content .how_to_use .how_to_use_point .tl {
  top: 6px;
  left: 6px;
}
.main_content .how_to_use .how_to_use_point .tr {
  top: 6px;
  right: 6px;
}
.main_content .how_to_use .how_to_use_point .bl {
  bottom: 6px;
  left: 6px;
}
.main_content .how_to_use .how_to_use_point .br {
  bottom: 6px;
  right: 6px;
}
.main_content .how_to_use .how_to_use_off .how_to_use_off_title {
  text-align: center;
  margin-bottom: 18px;
}
.main_content .how_to_use .how_to_use_off .how_to_use_off_title p.tag {
  position: relative;
  display: inline-flex;
  margin-bottom: 12px;
}
.main_content .how_to_use .how_to_use_off .how_to_use_off_title p.tag span.bg {
  position: absolute;
  height: 33px;
  width: 99px;
  padding: 4px 20px;
  border: 1px solid transparent;
  border-radius: 30px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 14px;
  z-index: 1;
  background: linear-gradient(#003c82, #003c82) padding-box, linear-gradient(to left, #f0cc7e 0%, #f4db8c 19%, #f9f3e5 41%, #c78a03 73%, #e3b75e 89%, #efca84 95%) border-box;
}
.main_content .how_to_use .how_to_use_off .how_to_use_off_title p.tag span.text {
  padding: 6px 20px 6px;
  border: 1px solid transparent;
  border-radius: 30px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 14px;
  z-index: 1;
  position: relative;
  background: linear-gradient(to bottom, #f7f7e4, #e7d2b2);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.main_content .how_to_use .how_to_use_off .how_to_use_off_title h3 {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 24px;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  color: var(--text_white);
}
.main_content .how_to_use .how_to_use_off p.content {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 16px;
  color: var(--text_white);
}
.main_content .how_to_use .how_to_use_off p.content a {
  color: var(--text_white);
  text-decoration: underline;
}
.main_content .how_to_use .how_to_use_off img {
  width: 100%;
}
.main_content .how_to_use .products {
  padding: 56px 0;
}
.main_content .products {
  background: url(../images/bg_products.jpg) top center/cover;
  height: auto;
  min-height: 500px;
  padding: 51px 0 70px 0;
}
.main_content .products .c-title {
  margin-bottom: 10px;
}
.main_content .products .prodcut_cards {
  margin-bottom: 48px;
}
.main_content .products .prodcut_cards .card_item {
  padding: 24px 19px 24px 18px;
  border: 1px solid var(--bg_pink);
  background-color: var(--bg_white);
  margin-bottom: 24px;
}
.main_content .products .prodcut_cards .card_item h3 {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 20px;
  color: var(--text_pink);
  line-height: 1.6;
  text-align: center;
}
.main_content .products .prodcut_cards .card_item h3._color2 {
  color: var(--text_purple);
}
.main_content .products .prodcut_cards .card_item figure {
  width: 77%;
  margin: 0 auto;
  margin-bottom: 12px;
  position: relative;
  display: flex;
  justify-content: center;
}
.main_content .products .prodcut_cards .card_item figure img {
  aspect-ratio: 220/275;
  object-fit: contain;
}
.main_content .products .prodcut_cards .card_item .card_item_option {
  margin-bottom: 12px;
  position: relative;
  padding-top: 24px;
}
.main_content .products .prodcut_cards .card_item .card_item_option::before {
  content: "";
  position: absolute;
  display: block;
  left: -19px;
  right: -19px;
  top: 0;
  height: 1px;
  background: var(--bg_pink);
}
.main_content .products .prodcut_cards .card_item .card_item_option p {
  font-size: 14px;
  color: #5e5e5e;
  font-family: "Forum", serif;
  line-height: 1.6;
  margin-bottom: 8px;
}
.main_content .products .prodcut_cards .card_item .card_item_option p span {
  margin-left: 2px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 15px;
  color: #000;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul {
  display: flex;
  align-items: center;
  column-gap: 20px;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul li {
  display: block;
  width: 24px;
  height: 24px;
  background-color: #000000;
  border-radius: 50%;
  position: relative;
  transition: all 0.3s ease;
  cursor: pointer;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul li._active {
  transition: all 0.3s ease;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul li._active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #afafaf;
  transition: all 0.3s ease;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul li._color2 {
  background-color: #843c0c;
}
.main_content .products .prodcut_cards .card_item .card_item_option ul li._color3 {
  background-color: #504239;
}
.main_content .products .prodcut_cards .card_item .card_item_title {
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text_pink);
  letter-spacing: -0.3px;
  margin-bottom: 10px;
}
.main_content .products .prodcut_cards .card_item .card_item_title._color2 {
  color: var(--text_purple);
}
.main_content .products .prodcut_cards .card_item .card_item_date {
  font-family: "Hiragino Sans GB W3";
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 8px;
}
.main_content .products .prodcut_cards .card_item .card_item_price {
  font-family: "Hiragino Sans GB W3";
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  color: #1a1a1a;
  margin-bottom: 20px;
}
.main_content .products .prodcut_cards .card_item .card_item_price .bold {
  font-weight: bold;
}
.main_content .products .prodcut_cards .card_item .card_item_price .small {
  font-size: 11px;
}

footer {
  background-color: #000000;
  border-radius: 0 56px 0 0;
  padding: 76px 0;
  width: 390px;
  margin: -44px auto 0;
}
@media only screen and (max-width: 768px) {
  footer {
    width: 100%;
  }
}
footer .footer_logo {
  margin-bottom: 36px;
}
footer .footer_logo img {
  width: 43%;
}
footer .footer_social {
  padding-bottom: 40px;
  border-bottom: 1px solid #fff;
}
footer .footer_social .footer_social_follow p.star,
footer .footer_social .footer_social_review p.star {
  font-size: 16px;
  line-height: 2.4;
  color: #fff;
  font-family: "Forum", serif;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
footer .footer_social .footer_social_follow p.star::before,
footer .footer_social .footer_social_review p.star::before {
  content: "";
  background: url(../images/icon_star.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 15px;
  height: 20px;
  display: inline-block;
  margin-right: 3px;
}
footer .footer_social .footer_social_follow {
  margin-bottom: 20px;
}
footer .footer_social .footer_social_follow .social_icons {
  display: flex;
  column-gap: 24px;
}
footer .footer_social .footer_social_follow .social_icons a {
  width: 24px;
  height: 24px;
  display: block;
}
footer .footer_nav {
  padding: 30px 0 0;
}
footer .footer_nav ul.main_menu > li {
  margin-bottom: 8px;
  position: relative;
}
footer .footer_nav ul.main_menu > li.menu_item {
  cursor: pointer;
}
footer .footer_nav ul.main_menu > li.menu_item._open::after {
  transform: rotate(0);
  transition: all 0.3s ease;
}
footer .footer_nav ul.main_menu > li.menu_item::after, footer .footer_nav ul.main_menu > li.menu_item::before {
  position: absolute;
  top: 18px;
  right: 0;
  width: 20px;
  height: 2px;
  background-color: var(--bg_white);
  display: inline-block;
  content: "";
  cursor: pointer;
}
footer .footer_nav ul.main_menu > li.menu_item::after {
  transform: rotate(90deg);
  transition: all 0.3s ease;
}
footer .footer_nav ul.main_menu > li > a, footer .footer_nav ul.main_menu > li > span {
  padding: 5px 0px;
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  font-family: "Forum", serif;
  display: block;
}
footer .footer_nav ul.main_menu > li ul.sub_menu {
  overflow: hidden;
  height: 0;
  transition: height 0.3s ease;
}
footer .footer_nav ul.main_menu > li ul.sub_menu > li > a {
  padding: 8.5px 0px;
  color: #cecece;
  font-size: 16px;
  font-weight: 400;
  font-family: "Forum", serif;
  display: block;
}
footer .footer_backtotop {
  padding: 4px 0 0px;
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  align-items: end;
  position: relative;
}
footer .footer_backtotop figure {
  text-align: center;
  cursor: pointer;
  margin-bottom: 20px;
}
footer .footer_backtotop figure img {
  width: 60%;
}
footer .footer_backtotop figure figcaption {
  font-size: 11px;
  color: #fff;
  line-height: 1.4;
  font-family: "Forum", serif;
}
footer .footer_link {
  margin-bottom: 64px;
  padding-left: 24px;
  padding-right: 24px;
  padding-top: 24px;
  border-top: 1px solid #fff;
}
footer .footer_link ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
footer .footer_link ul li {
  font-size: 13px;
  color: var(--text_white);
  border-right: 1px solid hsla(0, 0%, 100%, 0.5);
  line-height: 1;
  padding-right: 1em;
  position: relative;
}
footer .footer_link ul li:nth-child(n+4) {
  margin-top: 30px;
}
footer .footer_link ul li:nth-child(n+2) {
  margin-left: 1em;
}
footer .footer_link ul li:nth-child(3) {
  border-right: none;
  padding-right: 0;
}
footer .footer_copyright {
  padding: 0 24px;
}
footer .footer_copyright img {
  width: 86px;
  display: inline-block;
  margin-bottom: 15px;
}
footer .footer_copyright p {
  font-size: 12px;
  font-weight: 400;
  line-height: 2.4;
  font-family: "Forum", serif;
  color: var(--text_white);
}

.modal_special_movie {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  display: none;
  align-items: center;
  height: 100vh;
  width: 100vw;
  background-color: rgba(0, 0, 0, 0.9);
  cursor: pointer;
  z-index: 1000000;
}
.modal_special_movie._active {
  display: flex;
}
.modal_special_movie .modal_body {
  width: 100%;
  max-width: 1314px;
  margin: 0 auto;
  padding: 1rem 15rem;
}
.modal_special_movie .modal_body .modal_wrapper {
  padding-top: 56.25%;
  position: relative;
  width: 100%;
  height: 100%;
}
@media (max-width: 768px) {
  .modal_special_movie .modal_body .modal_wrapper {
    height: 50.625vw;
    left: 50%;
    padding-top: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 90vw;
  }
}
.modal_special_movie .modal_body .modal_wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.modal_special_movie .modal_body .modal_wrapper .bnt_close {
  background: none;
  border: none;
  cursor: pointer;
  height: 6rem;
  padding: 0;
  position: absolute;
  right: -12.4rem;
  top: -4rem;
  transition: opacity 0.3s ease;
  width: 6rem;
  z-index: 2;
}
@media (max-width: 768px) {
  .modal_special_movie .modal_body .modal_wrapper .bnt_close {
    top: -100px;
    right: 0;
  }
}

.modal_notice {
  position: fixed;
  bottom: 29px;
  left: -100%;
  transition: all 1s ease;
  z-index: 100;
  max-width: 268px;
}
@media (max-width: 1280px) {
  .modal_notice {
    width: 19vw;
  }
}
@media (max-width: 768px) {
  .modal_notice {
    max-width: unset;
    width: 298px;
    left: unset;
    right: -100%;
  }
}
.modal_notice._active {
  left: 24px;
  transition: all 1s ease;
}
@media (max-width: 768px) {
  .modal_notice._active {
    z-index: 100;
    right: 24px;
    left: unset;
  }
}
.modal_notice .modal_inner {
  position: relative;
  width: 100%;
}
.modal_notice .modal_inner button {
  position: absolute;
  top: -22px;
  right: -15px;
  z-index: 10;
}
.modal_notice .modal_inner figure img {
  width: 100%;
  position: relative;
  z-index: 1;
}/*# sourceMappingURL=style.css.map */