/*
* concept.css
*
*/
/* --------------------------------
  common
-------------------------------- */
.module-banner-magazine {
  position: relative;
  margin-top: 10.13333vw;
}

@media (min-width: 768px) {
  .module-banner-magazine {
    margin-top: 10.10249vw;
  }
}

.module-banner-magazine.-about {
  margin-top: 0;
  padding-bottom: 36vw;
}

@media (min-width: 768px) {
  .module-banner-magazine.-about {
    padding-bottom: 21.74231vw;
  }
}

.banner-magazine_head {
  margin-bottom: 7.2vw;
  text-align: center;
  letter-spacing: 0.12em;
  font-size: 3.46667vw;
}

@media (min-width: 768px) {
  .banner-magazine_head {
    margin-bottom: 2.48902vw;
    font-size: 1.31772vw;
  }
}

.banner-magazine_link {
  display: block;
  overflow: hidden;
  position: relative;
  margin: auto;
  width: 80.8vw;
}

@media (min-width: 768px) {
  .banner-magazine_link {
    border: 2px solid #f4e6ea;
    width: 70.27818vw;
  }
}

@media (min-width: 768px) {
  .banner-magazine_link:hover .banner-magazine_image:nth-of-type(1)::before {
    background-color: rgba(252, 240, 243, 0.7);
  }
  .banner-magazine_link:hover .banner-magazine_image:nth-of-type(3) {
    -webkit-transform: scale(1.03);
            transform: scale(1.03);
  }
}

.banner-magazine_image {
  display: block;
}

.banner-magazine_image:nth-of-type(1) {
  position: relative;
}

.banner-magazine_image:nth-of-type(1)::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  transition: background-color 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
  background-color: transparent;
}

@media (min-width: 768px) {
  .banner-magazine_image:nth-of-type(2),
  .banner-magazine_image:nth-of-type(3) {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
  }
}

@media (min-width: 768px) {
  .banner-magazine_image:nth-of-type(3) {
    transition: -webkit-transform 0.58s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 0.58s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 0.58s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.58s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}

.banner-magazine_text {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: absolute;
  top: 0;
  right: 2.66667vw;
  bottom: 0;
  padding-top: 7.2vw;

  gap: 0;
}

@media (max-width: 767.98px) {
  .banner-magazine_text {
    flex-direction: column-reverse;
  }
}

@media (min-width: 768px) {
  .banner-magazine_text {
    align-items: flex-start;
    justify-content: center;
    right: 6.22255vw;
    padding-top: 3.87994vw;

    gap: 4.02635vw;
  }
}

.banner-magazine_message {
  padding-top: 3.2vw;
  letter-spacing: 0.1em;
  font-size: 2.66667vw;
  font-weight: 500;
  line-height: 1.6;
}

@media (min-width: 768px) {
  .banner-magazine_message {
    padding-top: 0;
    font-size: 1.1713vw;
    line-height: 2;
  }
}

.banner-magazine_title {
  display: grid;
  text-align: center;
  letter-spacing: 0.6em;
  font-size: 4.53333vw;
  font-weight: 500;
  line-height: 1.41176;

  gap: 2.4vw;
}

@media (min-width: 768px) {
  .banner-magazine_title {
    padding-top: 0.29283vw;
    font-size: 2.56223vw;
    line-height: 1.37143;

    gap: 0.73206vw;
  }
}

.banner-magazine_title .sub-title {
  width: 43.46667vw;
  line-height: 0;
}

@media (max-width: 767.98px) {
  .banner-magazine_title .sub-title {
    margin-right: 2.93333vw;
  }
}

@media (min-width: 768px) {
  .banner-magazine_title .sub-title {
    width: 19.03367vw;
  }
}

@-webkit-keyframes anim-line {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.38);
            transform: scaleX(0.38);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.38);
            transform: scaleX(0.38);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-guide {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.6);
            transform: scaleX(0.6);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-guide {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.6);
            transform: scaleX(0.6);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-top-sakurae {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.48);
            transform: scaleX(0.48);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-top-sakurae {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.48);
            transform: scaleX(0.48);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-top-guide {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.62);
            transform: scaleX(0.62);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-top-guide {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.62);
            transform: scaleX(0.62);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-top-product {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.48);
            transform: scaleX(0.48);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-top-product {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.48);
            transform: scaleX(0.48);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-buy {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.6);
            transform: scaleX(0.6);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-buy {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.6);
            transform: scaleX(0.6);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-question {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.75);
            transform: scaleX(0.75);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-question {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.75);
            transform: scaleX(0.75);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-line-attention {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.75);
            transform: scaleX(0.75);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@keyframes anim-line-attention {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  50% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  51% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  100% {
    -webkit-transform: scaleX(0.75);
            transform: scaleX(0.75);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
}

@-webkit-keyframes anim-circle-loop {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  20% {
    -webkit-transform: scale(1.1, 1.08) translate(0%, -0.5%);
            transform: scale(1.1, 1.08) translate(0%, -0.5%);
  }
  40% {
    -webkit-transform: scale(1, 1.05) translate(0.5%, 0%);
            transform: scale(1, 1.05) translate(0.5%, 0%);
  }
  60% {
    -webkit-transform: scale(0.95, 1) translate(0%, 0.5%);
            transform: scale(0.95, 1) translate(0%, 0.5%);
  }
  80% {
    -webkit-transform: scale(1.1, 0.9) translate(-0.5%, 0.3%);
            transform: scale(1.1, 0.9) translate(-0.5%, 0.3%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}

@keyframes anim-circle-loop {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  20% {
    -webkit-transform: scale(1.1, 1.08) translate(0%, -0.5%);
            transform: scale(1.1, 1.08) translate(0%, -0.5%);
  }
  40% {
    -webkit-transform: scale(1, 1.05) translate(0.5%, 0%);
            transform: scale(1, 1.05) translate(0.5%, 0%);
  }
  60% {
    -webkit-transform: scale(0.95, 1) translate(0%, 0.5%);
            transform: scale(0.95, 1) translate(0%, 0.5%);
  }
  80% {
    -webkit-transform: scale(1.1, 0.9) translate(-0.5%, 0.3%);
            transform: scale(1.1, 0.9) translate(-0.5%, 0.3%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}

.module-line {
  position: relative;
}

.module-line::before {
  content: "";
  position: absolute;
  bottom: -0.53333vw;
  border-bottom: 0.26667vw solid #bfbfbf;
  width: 100%;
  height: 1.33333vw;
  -webkit-transform-origin: left;
          transform-origin: left;
}

@media (min-width: 768px) {
  .module-line::before {
    bottom: -0.65886vw;
    border-bottom: 0.07321vw solid #bfbfbf;
    height: 0.73206vw;
  }
}

.module-line.-blur::before {
  content: "";
  position: absolute;
  bottom: 1.6vw;
  border-bottom: 0.26667vw solid #d36978;
  width: 100%;
  transition: 0.6s -webkit-transform cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: 0.6s transform cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: 0.6s transform cubic-bezier(0.455, 0.03, 0.515, 0.955), 0.6s -webkit-transform cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-transform: scaleX(0);
          transform: scaleX(0);

  -webkit-filter: blur(0.26667vw);

          filter: blur(0.26667vw);
}

@media (min-width: 768px) {
  .module-line.-blur::before {
    bottom: 0;
    border-bottom: 0.14641vw solid #d36978;

    -webkit-filter: blur(0.14641vw);

            filter: blur(0.14641vw);
  }
}

.module-line.-active::before {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}

.module-sakura {
  position: absolute;
  width: 0;
  height: 0;
  pointer-events: none;
}

.module-sakura > .petal {
  display: inline-block;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;

  will-change: transform;
}

.module-sakura > .petal.-img_01 {
  width: 5.46667vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_01 {
    width: 1.50073vw;
  }
}

.module-sakura > .petal.-img_02 {
  width: 8.4vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_02 {
    width: 2.306vw;
  }
}

.module-sakura > .petal.-img_03 {
  width: 10.26667vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_03 {
    width: 2.81845vw;
  }
}

.module-sakura > .petal.-img_04 {
  width: 9.6vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_04 {
    width: 2.63543vw;
  }
}

.module-sakura > .petal.-img_05 {
  width: 5.06667vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_05 {
    width: 1.39092vw;
  }
}

.module-sakura > .petal.-img_06 {
  width: 8.26667vw;
}

@media (min-width: 768px) {
  .module-sakura > .petal.-img_06 {
    width: 2.2694vw;
  }
}

.module-wave {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 100%;
}

.module-wave.-circle {
  top: 0vw;
}

@media (min-width: 768px) {
  .module-wave.-circle {
    top: 5.85652vw;
  }
}

.module-wave > .svg-box {
  position: absolute;
  width: 100%;
  height: 26.66667vw;
}

@media (min-width: 768px) {
  .module-wave > .svg-box {
    height: 14.64129vw;
  }
}

.module-wave > .svg-box .path {
  fill: none;
  stroke: #eddee2;
  stroke-width: 0.07321vw;
}

.bg-container {
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
  width: 90.4vw;
  height: 100%;
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

@media (min-width: 768px) {
  .bg-container {
    top: 6.14934vw;
    width: 93.55783vw;
    height: 47.7306vw;
  }
}

.bg-container > .video {
  width: 100%;
  height: 100%;

  -o-object-fit: cover;

     object-fit: cover;
}

.bg-container.-active {
  opacity: 0.5;
  width: 100%;
  height: 100%;
}

@media (min-width: 768px) {
  .bg-container.-active {
    top: 0;
  }
}

.contact-container {
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin: auto;
  padding: 0;
  padding: 0 0 20.8vw 0;
  font-weight: 500;
  line-height: 1;
}

@media (min-width: 768px) {
  .contact-container {
    padding: 0 0 10.54173vw 0;
    width: 93.55783vw;
  }
}

.contact-container h1 {
  font-weight: 600;
}

.contact-container h2 {
  font-weight: 400;
}

.contact-container h3 {
  font-weight: 500;
}

.contact-container h4 {
  font-weight: 500;
}

.contact-container > .heading {
  position: absolute;
  z-index: 2;
  top: 2.66667vw;
  right: 5.33333vw;
  letter-spacing: 0.46em;
  color: #4d4d4d;
  font-size: 3.2vw;
}

@media (min-width: 768px) {
  .contact-container > .heading {
    top: 10.98097vw;
    right: 7.17423vw;
    font-size: 1.24451vw;
  }
}

.contact-container > .heading::after {
  content: "";
  display: inline-block;
  position: relative;
  margin-top: 2.8vw;
  width: 1px;
  height: 8vw;
  background-color: #878787;
}

@media (min-width: 768px) {
  .contact-container > .heading::after {
    margin-top: 1.53734vw;
    width: 1px;
    height: 4.39239vw;
  }
}

.contact-container > .detail-box {
  margin: 29.2vw auto 0;
}

@media (min-width: 768px) {
  .contact-container > .detail-box {
    margin: 10.98097vw auto 0;
  }
}

.contact-container .btn-text {
  margin-top: 12vw;
  margin-bottom: 16vw;
  font-size: 3.2vw;
}

@media (min-width: 768px) {
  .contact-container .btn-text {
    margin-top: 2.19619vw;
    margin-bottom: 4.39239vw;
    font-size: 1.02489vw;
  }
}

/* --------------------------------
  product
-------------------------------- */
main {
  /* opacity: 0; */
  padding-top: 16.53333vw;
}

@media (min-width: 768px) {
  main {
    padding-top: 6.14934vw;
  }
  .main-container{
    overflow: visible;
  }
}

main.-active {
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
}

main > .bg-container .mask-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

main > .bg-container .mask-box #ellipse-mask {
  position: absolute;
  height: 100%;

  will-change: contents;
}

main > .bg-container .mask-box #ellipse-mask .ellipse {
  transition: fill 1s;

  rx: 100%;
  ry: 100%;
  cy: 50%;
}

main > .bg-container .mask-box #ellipse-mask.-layout01 .ellipse {
  transition: fill 1s;

  fill: #fff;
}

main > .bg-container .mask-box #ellipse-mask.-layout02 .ellipse {
  transition: fill 1s, rx 1s cubic-bezier(0.55, 0.085, 0.68, 0.53), ry 1s cubic-bezier(0.55, 0.085, 0.68, 0.53), cy 1s cubic-bezier(0.55, 0.085, 0.68, 0.53);

  rx: 10%;
  ry: 20%;
  cy: 27%;
  fill: #fff;
}

@media (min-width: 768px) {
  main > .bg-container .mask-box #ellipse-mask.-layout02 .ellipse {
    cy: 50%;
  }
}

main > .bg-container .mask-box #ellipse-mask.-layout02 .rect {
  height: 100.001%;
}

main > .bg-container .mask-box #ellipse-mask.-layout03 .ellipse {
  transition: fill 0.5s, rx 1s cubic-bezier(0.175, 0.885, 0.32, 1.275), ry 0.9s cubic-bezier(0.175, 0.885, 0.32, 1.275), cy 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);

  rx: 56vw;
  ry: 76.26667vw;
  cy: 50%;
  fill: #666;
}

@media (min-width: 768px) {
  main > .bg-container .mask-box #ellipse-mask.-layout03 .ellipse {
    rx: 34.84627vw;
    ry: 47.51098vw;
    cy: 50%;
  }
}

main > .bg-container .mask-box #ellipse-mask.-layout03 .rect {
  height: 100%;
}

main > .bg-container .mask-box #ellipse-mask.-layout04 .ellipse {
  transition: fill 1s, rx 1s cubic-bezier(0.455, 0.03, 0.515, 0.955), ry 1s cubic-bezier(0.455, 0.03, 0.515, 0.955), cy 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);

  rx: 56vw;
  ry: 76.26667vw;
  cy: 50%;
  fill: #666;
}

@media (min-width: 768px) {
  main > .bg-container .mask-box #ellipse-mask.-layout04 .ellipse {
    rx: 28.4041vw;
    ry: 38.72621vw;
    cy: 50%;
  }
}

main > .bg-container .mask-box #ellipse-mask.-layout05 .ellipse {
  transition: fill 1s, rx 1s cubic-bezier(0.55, 0.085, 0.68, 0.53), ry 1s cubic-bezier(0.55, 0.085, 0.68, 0.53), cy 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);

  rx: 100%;
  ry: 100%;
  cy: 50%;
  fill: #999;
}

main > .contact-container .detail-box {
  position: relative;
  text-align: center;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box {
    width: 70.27818vw;
  }
}

main > .contact-container .detail-box > .catch {
  margin: 0 auto;
  letter-spacing: 0.46em;
  font-size: 5.33333vw;

  will-change: transform;
}

main > .contact-container .detail-box > .catch span {
  display: inline-block;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .catch {
    position: absolute;
    top: 0vw;
    right: 0vw;
    letter-spacing: 0.46em;
    font-size: 1.83016vw;
  }
}

main > .contact-container .detail-box > .title {
  margin: 13.33333vw 0 0;
  letter-spacing: 0.16em;
  color: #4d4d4d;
  font-size: 4.8vw;
  line-height: 1.88889;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .title {
    margin: 0;
    letter-spacing: 0.119em;
    font-size: 1.39092vw;
    line-height: 1;
  }
}

main > .contact-container .detail-box > .tel {
  display: block;
  margin: 4.53333vw 0 0;
  letter-spacing: 0.16em;
  color: #4d4d4d;
  font-size: 10.4vw;
  font-weight: 400;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .tel {
    margin: 1.75695vw 0 0 0.58565vw;
    letter-spacing: 0.19em;
    font-size: 4.39239vw;
  }
  main > .contact-container .detail-box > .tel a[href^="tel:"] {
    pointer-events: none;
  }
}

main > .contact-container .detail-box > .tel > .hyphen {
  position: relative;
  top: 0.26667vw;
  font-family: "Shippori Mincho B1", serif;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .tel > .hyphen {
    top: 0.14641vw;
  }
}

main > .contact-container .detail-box > .time {
  margin: 5.6vw 0 0;
  letter-spacing: 0.12em;
  color: #4d4d4d;
  font-size: 3.46667vw;
  line-height: 1.53846;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .time {
    margin: 1.75695vw 0 0 0.58565vw;
    letter-spacing: 0.12em;
    font-size: 1.1713vw;
    line-height: 1;
  }
}

main > .contact-container .detail-box > .module-btn {
  margin: 9.06667vw auto 0;
}

@media (min-width: 768px) {
  main > .contact-container .detail-box > .module-btn {
    margin: 2.78184vw auto 0;
  }
}

.product {
  margin-bottom: 0;
  padding-bottom: 14.667vw;
}

@media (min-width: 768px) {
  .product {
    margin-bottom: 0;
    padding-bottom: 6.44217vw;
  }
}

.product_inner {
  position: relative;
  margin: auto;
  padding: 0 9.6vw;
}

@media (min-width: 768px) {
  .product_inner {
    padding: 16.32504vw 3.22108vw 0;
    max-width: 100vw;
  }
}


/* --------------------------------
main visual
-------------------------------- */

.lineup_mv {
  background-color: #fff;
}
.lineup_title {
  display: flex;
  align-items: flex-start;
  position: absolute;
  z-index: 2;
  padding-top: 0;
  pointer-events: none;
  top: 8.66667vw;
  left: 7.73333vw;
  font-size: 2.53333vw;
  letter-spacing: 0.4em;
  font-weight: normal;
  line-height: 2.5;
}

@media (min-width: 768px) {
  .lineup_title {
    position: absolute;
    top: 7.32064vw;
    left: 9.29722vw;
    margin-left: 0;
    padding-top: 0;
    font-size: 1.24451vw;
    line-height: 2.7;
  }
}

.lineup_title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1.6vw;
  left: 0;
  margin: auto;
  width: 1px;
  height: 8vw;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  background-color: #878787;
}

.lineup_nav_catch {
  margin-top: 2.66666vw;
  font-size: 3.46666vw;
  line-height: calc(38 / 26);
  color: #c97182;
  text-align: center;
}
.lineup_nav_ttl {
  margin-top: 1.2vw;
  font-size: 4.8vw;
  letter-spacing: 0.05em;
  line-height: calc(56 / 36);
  text-align: center;
}

@media (min-width: 768px) {
  .lineup_title::after {
    bottom: -1.24451vw;
    height: 4.4vw;
  }
  .lineup_nav_catch {
    margin-top: -4.68521vw;
    font-size: 1.39092vw;
    line-height: normal;
    color: #c97182;
    text-align: center;
  }
  .lineup_nav_ttl {
    margin-top: 0.73206vw;
    font-size: 1.90337vw;
    letter-spacing: 0.05em;
    line-height: calc(44 / 28);
    text-align: center;
  }
}




/* --------------------------------
lineup nav
-------------------------------- */
.lineup_nav-wrap {
  padding-top: 12vw;
  padding-bottom: 13.33333vw;
  background-color: #fff;
}
.lineup_nav ul {
  width: 56vw;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5.33333vw;
}
.lineup_nav_item {
  position: relative;
  width: 25.33333vw;
}
.lineup_nav_item.new::after {
  content: 'NEW';
  display: block;
  /* background: url("/sakurae/assets/img/product/lineup/tab_new.png") no-repeat center center/cover; */
  position: absolute;
  top: 0;
  left: 0;
  width: 6.66666vw;
  height: 6.66666vw;
  border-radius: calc((20 / var(--media_pc)) * 100vw);
  box-sizing: border-box;
  color: #fff;
  background-color: #e7b2bd;
  border-radius: 100vmax;
  font-size: 1.67066vw;
  letter-spacing: 0.15em;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Roboto", sans-serif;
}
.lineup_nav_item a .lineup_nav_item_img {
  scale: 1;
  transition: scale .3s;
  transform-origin: center center;
}
.lineup_nav_item a:hover .lineup_nav_item_img {
  scale: 1.1;
}
.lineup_nav_item_name {
  margin-top: 1.90336vw;
  font-size: 2.93333vw;
  line-height: calc(26 / 22);
  text-align: center;
}
.lineup_nav_item_arrow {
  margin-top: 2.8vw;
  margin-inline: auto;
  width: 2.8vw;
  height: fit-content;
  line-height: 0;
}
@media (min-width:768px) {
  .lineup_nav-wrap {
    padding-top: 5.41727vw;
    padding-bottom: 7.35294vw;
    background-color: #fff;
  }
  .lineup_nav ul {
    width: auto;
    display: flex;
    justify-content: center;
    gap: 2.04978vw;
  }
  .lineup_nav_item {
    width: 10.98096vw;
  }
  .lineup_nav_item.new::after {
    width: 2.92825vw;
    height: 2.92825vw;
    font-size: 0.73206vw;
  }
  .lineup_nav_item a .lineup_nav_item_img {
    scale: 1;
    transition: scale .3s;
    transform-origin: center center;
  }
  .lineup_nav_item a:hover .lineup_nav_item_img {
    scale: 1.1;
  }
  .lineup_nav_item_name {
    margin-top: 1.90336vw;
    font-size: 1.02489vw;
    line-height: calc(18 / 14);
    text-align: center;
  }
  .lineup_nav_item_arrow {
    margin-top: 1.46412vw;
    margin-inline: auto;
    width: 1.46412vw;
    height: fit-content;
    line-height: 0;
  }
}
/* --------------------------------
item section
-------------------------------- */
.lineup_item_section {
  padding: 104px 0 104px;
  background: url("/sakurae/assets/img/product/lineup/bg_product_sp.webp") no-repeat center center/cover;
}
.lineup_item_sec-inner {
  /* width: 76.13469vw; */
  display: grid;
  grid-template-columns: 1fr auto 1fr;
}
.lineup_item_sec_title-wrap {
  grid-column: 1 / 2;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 3.46666vw;
}
.lineup_item_sec_title-wrap .desc {
  font-size: 3.2vw;
  letter-spacing: 0.05em;
  line-height: 1;
}
.lineup_item_sec_title-wrap .title {
  margin-top: -0.15em;
  font-size: 5.06666vw;
  letter-spacing: 0.05em;
  line-height: 1;
  font-weight: normal;
}
.lineup_item_sec_title-wrap .title-en {
  font-size: 2.00266vw;
  line-height: 1;
  color: #c8c8c8;
  writing-mode: vertical-rl;
}
.lineup_item_sec_img {
  margin-inline: auto;
}
#m_b_wash .lineup_item_sec_img {width: 24.8vw;}
#c_c_loation .lineup_item_sec_img {width: 18.133vw;}
#c_c_milk .lineup_item_sec_img {width: 16.66666vw;}
#c_oil .lineup_item_sec_img {width: 24.4vw;}
/* #d_a_serum .lineup_item_sec_img {}
#d_a_serum_refill .lineup_item_sec_img {} */
@media (max-width:767px) {
  .lineup_item_sec_txt-wrap {
    margin-top: 9.6vw;
    grid-row: 2 / 3;
    grid-column: 1 / 4;
    text-align: center;
  }
}
.lineup_item_sec_txt-wrap .catch {
  font-size: 5.06666vw;
  line-height: 1;
}
.lineup_item_sec_txt-wrap .body {
  margin-top: 5.73333vw;
  font-size: 3.2vw;
  line-height: calc(48 / 24);
  letter-spacing: 0.05em;
}
.lineup_item_sec_txt-wrap .notes {
  margin-top: 1.46666vw;
  font-size: 2.66666vw;
}
.lineup_item_section .module-btn {
  margin-top: 5.86666vw;
  margin-inline: auto;
  width: 78.66666vw;
}
@media (max-width:767px) {
  .lineup_item_section .module-btn {
    height: 13.33333vw;
  }
}
.lineup_item_sec_txt-wrap .lnk-wrap {
  margin-top: 8vw;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 4vw 5.73333vw;
}
@media (max-width:767px) {
  .lineup_item_sec_txt-wrap .lnk-wrap {
    width: 78.66666vw;
  }
}
.lineup_item_sec_txt-wrap .lnk-wrap a {
  display: flex;
  align-items: start;
  justify-content: center;
  gap: 1.06666vw;
}
.lineup_item_sec_txt-wrap .lnk-wrap a span.arrow {
  width: 3.756vw;
  aspect-ratio: 1 / 1;
  border-radius: 100vmax;
  display: grid;
  place-items: center;
  background-color: #e9a0b5;
  line-height: 0;
}
.lineup_item_sec_txt-wrap .lnk-wrap a span.arrow img {
  width: 1.6vw;
}
.lineup_item_sec_txt-wrap .lnk-wrap a span.txt {
  font-size: 3.73333vw;
  line-height: 1;
}

.da-lineup_item-wrap {
  background-color: #fff;
  padding: 7.32064vw 0 6.66666vw;
}
.da-lineup_item-inner {
  margin-inline: auto;
  width: 78.66666vw;
  display: block;
}
.da-lineup_item_section .lineup_item_sec_title-wrap {
  display: block;
  margin-top: 6.66666vw;
}
.da-lineup_item_section .lineup_item_sec_title-wrap .desc {
  font-size: 3.2vw;
}
.da-lineup_item_section .lineup_item_sec_title-wrap .title {
  margin-top: 2.66666vw;
  font-size: 5.06666vw;
}
.da-lineup_item_section .lineup_item_sec_title-wrap .title-en {
  margin-top: 2.66666vw;
  font-size: 2vw;
  writing-mode: horizontal-tb;
}
.da-lineup_item_section .lineup_item_sec_txt-wrap .body {
  text-align: left;
}
@media (max-width:767px) {
  .da-lineup_item_section .lineup_item_sec_txt-wrap .body  {
    margin-top: 0;
  }
}
.da-lineup_item_sec_btn-wrap {
  margin-top: 5.33333vw;
  display: block;
}
.da-lineup_item_section .lineup_item_sec_txt-wrap .module-btn {
  width: 78.66666vw;
}
.da-lineup_item_sec_btn-wrap .lnk_btn {
  position: relative;
  margin: 0;
  width: 78.66666vw;
  height: 4.34597vw;
  display: block;
  border: solid 1px #e6bcc9;
  background-color: #fff;
  display: grid;
  flex-wrap: nowrap;
  place-content: center;
  cursor: pointer;
}
@media (max-width:767px) {
  .da-lineup_item-inner > * + * {
    margin-top: 13.33333vw;
  }
  .da-lineup_item_section .lineup_item_sec_txt-wrap {
    margin-top: 4.26666vw;
  }
  .da-lineup_item_section .lineup_item_sec_txt-wrap .module-btn,
  .da-lineup_item_sec_btn-wrap .lnk_btn {
    height: 13.33333vw;
  }
  .da-lineup_item_sec_btn-wrap .lnk_btn {
    margin-top: 2.66666vw;
  }
}
.da-lineup_item_sec_btn-wrap .lnk_btn span.txt {
  right: 0.58565vw;
  position: relative;
  font-size: 4.26666vw;
  text-align: left;
  color: #3c3c3c;
}
.da-lineup_item_sec_btn-wrap .lnk_btn span.arrow {
  position: absolute;
  top: 50%;
  right: 10vw;
  transform: translate(100%, -50%);
  background: url(/sakurae/assets/img/common/arrow_r_w.svg) no-repeat center / cover;
  background-size: 100%;
  width: 5.38666vw;
  height: 5.38666vw;
  background-color: #e6bcc9;
  border-radius: 100vmax;
}
.da-lineup_item_notes {
  margin-top: 12.533333vw;
  margin-inline: auto;
  padding-left: 2.5em;
  width: 78.66666vw;
  font-size: 2.66666vw;
  line-height: calc(30 / 20);
}
.da-lineup_item_notes span {
  margin-left: -2.5em;
  text-indent: -2.5em;
}
@media (min-width:768px) {
  .lineup_item_section {
    margin-inline: auto;
    padding: 10.98096vw 11.71303vw;
    background: url("/sakurae/assets/img/product/lineup/bg_product_pc.webp") no-repeat center center/cover;
  }
  .lineup_item_sec-inner {
    width: 76.13469vw;
    display: grid;
    grid-template-columns: 95fr 375fr 570fr;
  }
  .lineup_item_sec_title-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0;
  }
  .lineup_item_sec_title-wrap .desc {
    font-size: 1.09809vw;
    letter-spacing: 0.05em;
    line-height: 1;
  }
  .lineup_item_sec_title-wrap .title {
    margin-top: -0.15em;
    font-size: 1.90336vw;
    letter-spacing: 0.05em;
    line-height: 1;
  }

  .lineup_item_sec_title-wrap .title-en {
    font-size: 0.89311vw;
    line-height: 1;
    color: #c8c8c8;
    writing-mode: vertical-rl;
  }
  .lineup_item_sec_img {
    margin-inline: auto;
  }
  #m_b_wash .lineup_item_sec_img {width: 10.76134vw;}
  #c_c_loation .lineup_item_sec_img {width: 7.54026vw;}
  #c_c_milk .lineup_item_sec_img {width: 7.24743vw;}
  #c_oil .lineup_item_sec_img {width: 10.32210vw;}
  /* #d_a_serum .lineup_item_sec_img {}
  #d_a_serum_refill .lineup_item_sec_img {} */
  .lineup_item_sec_txt-wrap .catch {
    font-size: 1.90336vw;
    line-height: 1;
  }
  .lineup_item_sec_txt-wrap .body {
    margin-top: 2.19619vw;
    font-size: 1.09809vw;
    line-height: calc(35 / 15);
    letter-spacing: 0.05em;
  }
  .lineup_item_sec_txt-wrap .notes {
    margin-top: 1.83016vw;
    font-size: 0.80527vw;
  }
  .lineup_item_section .module-btn {
    margin-top: 2.63543vw;
    margin-inline: 0;
    width: 23.79209vw;
  }
  .lineup_item_sec_txt-wrap .lnk-wrap {
    margin-top: 2.78184vw;
    margin-left: 0;
    display: flex;
    gap: 2.92826vw;
  }
  .lineup_item_sec_txt-wrap .lnk-wrap a {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 0.73206vw;
  }
  .lineup_item_sec_txt-wrap .lnk-wrap a span.arrow {
    width: 1.78623vw;
    aspect-ratio: 1 / 1;
    border-radius: 100vmax;
    display: grid;
    place-items: center;
    background-color: #e9a0b5;
    line-height: 0;
  }
  .lineup_item_sec_txt-wrap .lnk-wrap a span.arrow img {
    width: 0.73206vw;
  }
  .lineup_item_sec_txt-wrap .lnk-wrap a span.txt {
    font-size: 1.17130vw;
    line-height: 1;
  }

  .da-lineup_item-wrap {
    background-color: #fff;
    padding: 7.32064vw 0 3.36749vw;
  }
  .da-lineup_item-inner {
    margin-inline: auto;
    width: 76.13469vw;
    display: flex;
    gap: 7.32064vw;
  }
  .da-lineup_item_section .lineup_item_sec_title-wrap {
    display: block;
    margin-top: 2.92825vw;
  }
  .da-lineup_item_section .lineup_item_sec_title-wrap .desc {
    font-size: 1.09809vw;
  }
  .da-lineup_item_section .lineup_item_sec_title-wrap .title {
    margin-top: 1.09809vw;
    font-size: 1.68374vw;
  }
  .da-lineup_item_section .lineup_item_sec_title-wrap .title-en {
    margin-top: 1.31771vw;
    writing-mode: horizontal-tb;
    font-size: 0.89311vw;
  }
  .da-lineup_item_section .lineup_item_sec_txt-wrap .body {
    min-height: calc(3em * (35 / 15));
  }
  .da-lineup_item_sec_btn-wrap {
    margin-top: 2.19619vw;
    display: flex;
    gap: 0.732064vw;
  }
  .da-lineup_item_section .lineup_item_sec_txt-wrap .module-btn {
    width: 16.83745vw;
  }
  .da-lineup_item_sec_btn-wrap .lnk_btn {
    position: relative;
    margin: 0;
    width: 16.83745vw;
    height: 4.34597vw;
    display: block;
    border: solid 1px #e6bcc9;
    background-color: #fff;
    display: grid;
    flex-wrap: nowrap;
    place-content: center;
    cursor: pointer;
  }
  .da-lineup_item_sec_btn-wrap .lnk_btn span.txt {
    right: 0.58565vw;
    position: relative;
    font-size: 1.171vw;
    text-align: left;
  }
  .da-lineup_item_sec_btn-wrap .lnk_btn span.arrow {
    position: absolute;
    top: 50%;
    right: 3.00146vw;
    transform: translate(100%, -50%);
    background: url(/sakurae/assets/img/common/arrow_r_w.svg) no-repeat center / cover;
    background-size: 100%;
    width: 1.75695vw;
    height: 1.75695vw;
    background-color: #e6bcc9;
    border-radius: 100vmax;
  }
  .da-lineup_item_notes {
    margin-top: 7.02781vw;
    margin-inline: auto;
    width: 76.13469vw;
    font-size: 0.80527vw;
    line-height: calc(14 / 11);
  }
}

/* --------------------------------
btn
-------------------------------- */
.module-btn {
  width:88.0597%;
  margin:0 auto 0 0;
  height:16vw;
  display: block;
  position: relative;
  width: 100%;
  border: solid 1px #e6bcc9;
  width: 100%;
  background-color: #e6bcc9;
  display: grid;
  flex-wrap: nowrap;
  place-content: center;
  cursor: pointer;
}
.module-btn.rev_btn {
  background-color: #fff;
  color: #1a1a1a;
}
.module-btn a{
  cursor: pointer;
  display:block;
  text-align: center;
  line-height:16vw;
  height:100%;
  background-color:#e6bcc9;
  color: #fff !important;
  width: 100%;
  font-size:4vw;
  position: relative;
}
.module-btn.text_center .text {
  right: initial;
}
.module-btn .text {
  line-height: 1.4;
  right: 1.06vw;
  position: relative;
  font-size: 4vw;
  text-align: center;
/*   color: #fff; */
  letter-spacing: 0.00em;
}
.module-btn .text {
  color: #fff;
}
.module-btn.rev_btn .text {
  color: #1a1a1a;
}
.module-btn a:hover{
  opacity:.7;
  transition-duration: .5s;
}
.module-btn span.arrow{
  position: absolute;
  top:50%;
  right:10vw;
  transform: translate(100%,-50%);
  background: url("/sakurae/assets/img/common/arrow_r.svg") no-repeat center/cover;
  background-size: 100%;
  width: 5.46667vw;
  height: 5.46667vw;
}
.module-btn.rev_btn span.arrow {
  background: url("/sakurae/assets/img/common/arrow_r_w.svg") no-repeat center/cover;
}
.lineup_item_sec_btn-wrap .module-btn{
  height:18.667vw;
}
.lineup_item_sec_btn-wrap .module-btn:nth-child(n+2){
  margin-top: 2.667vw;
}

@media (min-width: 768px) {
  .module-btn.rev_btn .text {
    color: #1a1a1a;
    font-size: 1.171vw;
  }
  .module-btn {
    width:96.5%;
    height:4.246vw;
  }
  .module-btn a{
    line-height:4.24597vw;
    font-size:1.1713vw;
  }
  .module-btn .text {
    right: 8px;
    position: relative;
    font-size: 1.171vw;
    text-align: center;
  }
  .module-btn span.arrow{
    position: absolute;
    top:50%;
    right:3.00146vw;
    transform: translate(100%,-50%);
    background: url("/sakurae/assets/img/common/arrow_r.svg") no-repeat center/cover;
    background-size: 100%;
    width: 1.75695vw;
    height: 1.75695vw;
  }
  .module-btn.rev_btn span.arrow {
    background: url("/sakurae/assets/img/common/arrow_r_w.svg") no-repeat center/cover;
  }
  .lineup_item_sec_btn-wrap{
    display: flex;
    gap: 3.488%;
  }
  .lineup_item_sec_btn-wrap .module-btn{
    width:48.276%;
    height:5.71vw;
  }
  .lineup_item_sec_btn-wrap .module-btn .text.ml15{
    margin-left:-1.5vw;
  }
}


.product_about_link {
  margin-top: 16.32vw;
}
.product_about_link > * + * {
  margin-top: 3.89vw;
}
@media (min-width: 768px) {
  .product_about_link {
    margin-top: 3.32vw;
  }
  .product_about_link > * + * {
    margin-top: 0.89vw;
  }
}

/* accodion inner content */
.accodion_inner_content {
  padding: 0;
  overflow: hidden;
  transition: .5s;

  margin: 0;
  transition: height 0.3s linear;
  margin-bottom: 6.2vw;
  height: 0;
}

.explanation_detail_title .accordion_toggle {
  position: relative;
  width: 5vw;
  height: 13px;
  display: inline-block;
  right: 7px;
}

.explanation_detail_title .accordion_toggle::before,
.explanation_detail_title .accordion_toggle::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  display: inline-block;
  width: 100%;
  height: 1px;
  border-top: 1px solid #878787;
  transform: translate(-50%, -50%);
  transition: .5s;
}
.explanation_detail_title .accordion_toggle::after  {
  top: 50%;
  left: 0%;
  transform: rotate(90deg);
}
.active .explanation_detail_title .accordion_toggle::after  {
  transform: rotate(0deg);  
}
@media (min-width: 768px) {
  .accodion_inner_content {
    margin-bottom: 3.611vw;
  }
  .explanation_detail_title .accordion_toggle {
    position: relative;
    width: 19px;
    height: 13px;
    display: inline-block;
    right: 14px;
  }
}


/* bg-img */



html {
  --bg-img-duration: 24s;
  --bg-img-duration-num: 24;
}

.sp {
  display: block;
}
@media (min-width: 768px) {
  .sp {
    display: none;
  }
}

main a {
  opacity: 1;
  transition: all 0.5s;
}

main a:hover {
  opacity: 0.7;
  transition: all 0.5s;
}
