@charset "UTF-8";

/* ==================================================
共通
================================================== */
/*font*/
:root {
  --XsTxt: 1.88vw;
  --STxt: 2.19vw;
  --MTxt: 2.81vw;
  --LTxt: 3.75vw;
  --XsTitle: 4.4vw;
  --STitle: 4.69vw;
  --MTitle: 7.19vw;
  --LTitle: 9.38vw;
  --XlTitle: 8.75vw;
}
@media screen and (min-width: 641px) {
  :root {
    --XsTxt: 1.2vw;
    --STxt: 1.4vw;
    --MTxt: 1.6vw;
    --LTxt: 1.8vw;
    --XsTitle: 2vw;
    --STitle: 2.41vw;
    --MTitle: 4vw;
    --LTitle: 5vw;
    --XlTitle: 5.6vw;
  }
}
@media screen and (min-width: 961px) {
  :root {
    --XsTxt: 1.25vw;
    --STxt: 1.46vw;
    --MTxt: 1.88vw;
    --LTxt: 2.5vw;
    --XsTitle: 2.85vw;
    --STitle: 3.13vw;
    --MTitle: 4.79vw;
    --LTitle: 6.25vw;
    --XlTitle: 5.63vw;
  }
}
.XsTxt {
  font-size: clamp(6px, var(--XsTxt), 12px);
}
.STxt {
  font-size: clamp(7px, var(--STxt), 14px);
}
.MTxt {
  font-size: clamp(9px, var(--MTxt), 18px);
}
.LTxt {
  font-size: clamp(12px, var(--LTxt), 24px);
}
.XsTitle {
  font-size: clamp(15px, var(--XsTitle), 24px);
}
.STitle {
  font-size: clamp(15px, var(--STitle), 30px);
}
.MTitle {
  font-size: clamp(23px, var(--MTitle), 46px);
}
.LTitle {
  font-size: clamp(30px, var(--LTitle), 60px);
}
.XlTitle {
  font-size: clamp(36px, var(--XlTitle), 72px);
}

.areaBlk {
  position: relative;
}

.topConts {
  background: none !important;
}

.slideBlk {
  overflow: hidden;
}

.itemsBlk {
  overflow: hidden;
}

.boardTxt {
  display: inline-block;
  padding: 0.4em 0.81em;
}

.areaBlk.advBlk {
  margin-top: 80px;
}

@media screen and (min-width: 641px) {
  .areaBlk.advBlk {
    margin-top: 80px;
  }
}

@media screen and (min-width: 961px) {
  .areaBlk.advBlk {
    margin-top: 100px;
  }
}

@media screen and (min-width: 1281px) {
  .areaBlk.advBlk {
    margin-top: 100px;
  }
}
.w60 {
  width: 60% !important;
}

.w70 {
  width: 70% !important;
}

.w80 {
  width: 80% !important;
}

.w90 {
  width: 90% !important;
}

@media screen and (min-width: 961px) {
  .pcw60 {
    width: 60% !important;
  }
  .pcw70 {
    width: 70% !important;
  }
  .pcw80 {
    width: 80% !important;
  }
  .pcw90 {
    width: 90% !important;
  }
}

/* ==================================================
各カラー設定
================================================== */
:root {
  --bgClr: #999;
  --txtClr: #666;
}
.fw .bgClr {
  --bgClr: var(--clrFw-bg);
}
.lashup .bgClr,
.lashup .mainArea::before {
  background-color: var(--clrlashup-bg);
}
.lashup .boardTxt {
  background-color: var(--clrlashup-txt);
}
.lashup .txtClr {
  color: var(--clrlashup-txt);
}
.lashup .svgClr {
  fill: var(--clrlashup-txt);
}
.fw .bgClr,
.fw .mainArea::before {
  background-color: var(--clrfw-bg);
}
.fw .boardTxt {
  background-color: var(--clrfw-txt);
}
.fw .txtClr {
  color: var(--clrfw-txt);
}
.fw .svgClr {
  fill: var(--clrfw-txt);
}
.keep .bgClr,
.keep .mainArea::before {
  background-color: var(--clrkeep-bg);
}
.keep .boardTxt {
  background-color: var(--clrkeep-txt);
}
.keep .txtClr {
  color: var(--clrkeep-txt);
}
.keep .svgClr {
  fill: var(--clrkeep-txt);
}
.lash .bgClr,
.lash .mainArea::before {
  background-color: var(--clrlash-bg);
}
.lash .boardTxt {
  background-color: var(--clrlash-txt);
}
.lash .txtClr {
  color: var(--clrlash-txt);
}
.lash .svgClr {
  fill: var(--clrlash-txt);
}
.lasting01 .bgClr,
.lasting01 .mainArea::before {
  background-color: var(--clrlasting01-bg);
}
.lasting01 .boardTxt {
  background-color: var(--clrlasting01-txt);
}
.lasting01 .txtClr {
  color: var(--clrlasting01-txt);
}
.lasting01 .svgClr {
  fill: var(--clrlasting01-txt);
}
.lasting03 .bgClr,
.lasting03 .mainArea::before {
  background-color: var(--clrlasting03-bg);
}
.lasting03 .boardTxt {
  background-color: var(--clrlasting03-txt);
}
.lasting03 .txtClr {
  color: var(--clrlasting03-txt);
}
.lasting03 .svgClr {
  fill: var(--clrlasting03-txt);
}
.lasting04 .bgClr,
.lasting04 .mainArea::before {
  background-color: var(--clrlasting04-bg);
}
.lasting04 .boardTxt {
  background-color: var(--clrlasting04-txt);
}
.lasting04 .txtClr {
  color: var(--clrlasting04-txt);
}
.lasting04 .svgClr {
  fill: var(--clrlasting04-txt);
}
.gcp .bgClr,
.gcp .mainArea::before {
  background-color: var(--clrgcp-bg);
}
.gcp .boardTxt {
  background-color: var(--clrgcp-txt);
}
.gcp .txtClr {
  color: var(--clrgcp-txt);
}
.gcp .svgClr {
  fill: var(--clrgcp-txt);
}
.short .bgClr,
.short .mainArea::before {
  background-color: var(--clrshort-bg);
}
.short .boardTxt {
  background-color: var(--clrshort-txt);
}
.short .txtClr {
  color: var(--clrshort-txt);
}
.short .svgClr {
  fill: var(--clrshort-txt);
}
.stay .bgClr,
.stay .mainArea::before {
  background-color: var(--clrstay-bg);
}
.stay .boardTxt {
  background-color: var(--clrstay-txt);
}
.stay .txtClr {
  color: var(--clrstay-txt);
}
.stay .svgClr {
  fill: var(--clrstay-txt);
}
.ebc .bgClr,
.ebc .mainArea::before {
  background-color: var(--clrebc-bg);
}
.ebc .boardTxt {
  background-color: var(--clrebc-txt);
}
.ebc .txtClr {
  color: var(--clrebc-txt);
}
.ebc .svgClr {
  fill: var(--clrebc-txt);
}

/* ==================================================
mainTitle
================================================== */
.mainArea {
  position: relative;
}
.mainArea::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 98%;
  left: 0;
  top: 0;
  clip-path: polygon(0 0, 100% 0%, 100% 95%, 0% 100%);
}
.mainTitSet {
  /* padding: 0 0 0; */
  position: relative;
}
.mainTitSet .mainImg {
  position: absolute;
  width: 100%;
  top: -29%;
  left: -18%;
  transition: 0s;
}

.mainTitSet .mainImg + .mainImg {
  position: absolute;
  top: -12%;
  left: 12%;
  width: 90%;
}

.mainTtl {
  text-align: left;
  width: 100%;
  margin: 0 auto;
  padding: 23% 0 0 5%;
}

.mainTtl p {
  margin: 0 0 0.2em;
}

@media screen and (min-width: 641px) {
  .mainArea {
  }
  .mainTitSet {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
  }
  .mainArea::before {
  }
  .mainTitSet .mainImg {
  }

  .mainTitSet .mainImg + .mainImg {
  }

  .mainTtl {
    padding: 5% 0 0 2.5%;
  }

  .mainTtl p {
  }
}
@media screen and (min-width: 961px) {
  .mainArea {
    padding: 0 0 50px;
  }
  .mainArea::before {
    clip-path: polygon(0 0, 100% 0%, 100% 90%, 0% 100%);
  }
  .mainTitSet {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    left: 0;
  }
  .mainTitSet .mainImg {
  }

  .mainTitSet .mainImg + .mainImg {
  }

  .mainTtl {
  }

  .mainTtl p {
    margin: 0 0 0.4em;
  }
}
@media screen and (min-width: 1281px) {
  .mainArea {
  }
  .mainArea::before {
  }
  .mainTitSet .mainImg {
  }

  .mainTitSet .mainImg + .mainImg {
  }

  .mainTtl {
    padding: 5.5% 0 0 7%;
    padding-top: min(4.5vw, 120px);
    max-width: 1300px;
    margin: 0 auto;
  }

  .mainTtl p {
  }
}
/* ==================================================
itemList
================================================== */

.itemSet {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 6% auto 0;
}

/*pkgSet*/
.itemSet .pkgSet {
  width: 100%;
  flex-flow: wrap;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
}
.itemSet .pkgSet .imgList {
  position: relative;
  width: 35%;
  margin: 0 auto auto;
  padding: 0;
}
.itemSet .pkgSet .imgList li {
  width: 100%;
  opacity: 0;
  position: absolute;
  margin: 0 auto;
}
.itemSet .pkgSet .imgList li.activeImg {
  opacity: 1;
  transition: transform ease-out 0.6s;
  animation: mainProductFade 0.5s forwards;
  position: relative;
}
@keyframes mainProductFade {
  0% {
    opacity: 0;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0));
  }
  100% {
    opacity: 1;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.2));
  }
}

.itemSet .prdPointBlk {
  width: 55%;
  margin: 0;
  display: flex;
  flex-flow: wrap;
  align-items: center;
}
.itemSet .prdPointBlk .awardGlp {
  /* position: relative; */
  display: flex;
  flex-flow: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 12% auto 12%;
  width: 100%;
}
.itemSet .prdPointBlk .awardGlp .awLeftBlk {
  margin: 0 6% 0 0;
  width: 42%;
}
.itemSet .prdPointBlk .awardGlp .awLeftBlk.noIcon {
  display: none;
}
.itemSet .prdPointBlk .awardGlp .awRightBlk {
  margin: 0;
  width: 42%;
}
.itemSet .prdPointBlk .awardGlp .awLeftBlk p:not(:last-of-type) {
  margin: 0 0 1em;
}

.itemSet .prdPointBlk .awardGlp .awRightBlk > p {
  margin: 0 auto 1em;
}
.itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn a {
  width: 100%;
  text-decoration: underline;
  margin: 0em 0 0;
}
.itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn p {
  margin: 0 auto 23px 0;
}

.itemSet .prdPointBlk .pkgPointLists {
  width: 100%;
  margin: auto;
}
.itemSet .prdPointBlk .pkgPointLists .pkgPointList {
  text-align: left;
  padding: 0 0 0 2em;
  position: relative;
  margin: 0 0 0.51em;
}
.itemSet .prdPointBlk .pkgPointLists .pkgPointList .icon {
  width: 1.4em;
  display: block;
  position: absolute;
  left: 1%;
  top: 3%;
}

.itemSet .txtBlk {
  margin: 3% 0 0;
  width: 100%;
}

.itemSet .txtBlk .infoTxt {
  line-height: 1.5;
  margin: 0 auto 0.5em;
}
.itemSet .txtBlk p.credit {
  margin: 1.05rem auto 1.05rem;
}

.itemSet .prdNameBlk {
  width: 100%;
  margin: 5% auto 0;
}
.itemSet .prdNameBlk .prdName {
}
.itemSet .prdNameBlk .prdPrice {
  padding: 0.2em 0 0;
}

.itemSet .txtBlk .btnBlk {
}
.itemSet .txtBlk .btnBlk .btnBuy {
  width: 84%;
  margin: 0 auto;
}
.itemSet .txtBlk .btnBlk .btnBuy a {
  padding: 3em 0;
  line-height: 1;
}
.itemSet .txtBlk .btnBlk .btnBuy p {
  position: relative;
  padding: 0 1em 0 0;
}
.itemSet .txtBlk .btnBlk .btnBuy p::after {
  content: "";
  position: absolute;
  width: 0.45em;
  height: 0.45em;
  border-right: 2px solid;
  border-bottom: 2px solid;
  transform: translate(0, -50%) rotate(45deg);
  top: 30%;
  right: -0.2em;
}
.itemSet .txtBlk .btnBlk .btnShop {
  margin: 1.8em auto 0;
}
.itemSet .txtBlk .btnBlk .btnShop a {
  text-decoration: underline;
}
.itemSet .txtBlk .btnList .lightBtn a {
  text-decoration: underline;
}

.itemSet .campaignTtlBlk {
  margin: 8% auto 0;
}

.itemSet .campaignTtlBlk .campaignTtl {
  position: relative;
  display: inline-block;
  padding: 0 1.6em;
  margin: 0 0 0.75em;
}

.itemSet .campaignTtlBlk .campaignTtl::before,
.itemSet .campaignTtlBlk .campaignTtl::after {
  content: "";
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  width: 0.95em;
  height: 1.8em;
}

.itemSet .campaignTtlBlk .campaignTtl::before {
  background: url("/items/asset/img/left.png") no-repeat;
  background-size: cover;
  left: 0;
}

.itemSet .campaignTtlBlk .campaignTtl::after {
  background: url("/items/asset/img/right.png") no-repeat;
  background-size: cover;
  right: 0;
}
.itemSet .naviArea {
  display: flex;
  width: 90%;
  border: 1px solid #d1d1d1;
  border-radius: 10em;
  margin: 8% auto 0;
  filter: drop-shadow(0 0px 3px rgba(0, 0, 0, 0.1));
  background: #fff;
}
.itemSet .naviArea .navLists {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 4% 5%;
}
.itemSet .naviArea .navLists .navList {
  width: calc(100% / 4);
  position: relative;
}
.itemSet .naviArea .navLists.noMov .navList {
  width: calc(100% / 3);
  position: relative;
}
.itemSet .naviArea .navLists .navList.noCnt {
  pointer-events: none;
  opacity: 0.2;
}
.itemSet .naviArea .navLists .navList a {
  color: #000;
}
.itemSet .naviArea .navLists .navList + .navList {
  border-left: 1px solid #d1d1d1;
}

.itemSet .naviArea .navLists .navList .icon {
  background: #c41948;
  width: 1.1em;
  height: 1.1em;
  display: block;
  border-radius: 100%;
  margin: 15% auto 0;
  position: relative;
}
.itemSet .naviArea .navLists .navList .icon::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: rotate(45deg) translate(-50%, -50%);
  width: 25%;
  height: 25%;
  margin: auto;
  top: 50%;
}

@media screen and (min-width: 641px) {
  .itemSet {
    align-items: flex-start;
    padding: 23% 2% 0;
    margin: 0 auto;
    justify-content: center;
    max-width: 1300px;
  }
  .itemSet .campaignTtlBlk {
    margin: 4% auto 0;
    width: 100%;
  }
  .itemSet .imgBlk {
    width: 50%;
    margin: 3.5% auto 0 0;
    justify-content: center;
    align-items: flex-start;
    position: relative;
  }
  .itemSet .imgBlk .imgList {
    width: 43%;
    margin: 0 auto;
  }

  .itemSet .prdPointBlk {
    position: absolute;
    width: 100%;
  }
  .itemSet .prdPointBlk .awardGlp {
    display: block;
    margin: 0;
    width: 100%;
  }
  .itemSet .prdPointBlk .awardGlp .awLeftBlk {
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk {
  }
  .itemSet .prdPointBlk .awardGlp .awLeftBlk p:not(:last-of-type) {
  }

  .itemSet .prdPointBlk .awardGlp .awRightBlk > p {
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn a {
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn p {
  }

  .itemSet .prdPointBlk .pkgPointLists {
    display: none;
  }
  .itemSet .prdPointBlk .pkgPointLists .pkgPointList {
  }
  .itemSet .prdPointBlk .pkgPointLists .pkgPointList .icon {
  }

  .itemSet .txtBlk {
    width: 50%;
    margin: 0;
    padding: 0 0 0 3%;
  }
  .itemSet .txtBlk .infoTxt {
    line-height: 1.2;
  }

  .itemSet .txtBlk p.credit {
    margin: 2.05rem auto;
  }
  .itemSet .txtBlk .btnList {
    width: 100%;
  }
  .itemSet .txtBlk .btnList li {
    margin: 10px 0 0;
  }
  .itemSet .prdPointBlk .awardGlp .awLeftBlk {
    width: 26%;
    margin: 0 0 5%;
    position: absolute;
    left: 0;
    top: 0;
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk {
    width: 26%;
    position: absolute;
    right: 0;
    top: 0;
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn::after {
    top: 35px;
  }

  .itemSet .prdNameBlk {
    margin: 5% auto 0;
    width: 100%;
  }
  .itemSet .prdNameBlk .prdName {
  }
  .itemSet .prdNameBlk .prdPrice {
  }

  .itemSet .txtBlk .btnBlk {
    width: 92%;
    margin: 6% auto 0;
  }
  .itemSet .txtBlk .btnBlk .btnBuy {
    margin: 3% auto 0;
    width: 100%;
  }
  .itemSet .txtBlk .btnBlk .btnBuy a {
    padding: 2.5em 0;
  }
  .itemSet .txtBlk .btnBlk .btnShop {
  }
  .itemSet .txtBlk .btnBlk .btnShop a {
  }
  .itemSet .naviArea {
    margin: 5% auto 0;
    width: 61%;
  }
  .itemSet .naviArea .navLists {
    padding: 3% 11%;
  }
  .itemSet .naviArea .navLists .navList {
    width: calc(100% / 3);
  }
  .itemSet .naviArea .navLists.noMov .navList {
    width: calc(100% / 2);
  }
  .itemSet .naviArea .navLists.noMov .navList + .navList {
    border: none;
  }
  .itemSet .naviArea .navLists.noMov .navList:last-of-type {
    border-left: 1px solid #d1d1d1;
  }
  .itemSet .naviArea .navLists .navList.noCnt {
  }
  .itemSet .naviArea .navLists .navList a {
  }
  .itemSet .naviArea .navLists .navList + .navList {
  }

  .itemSet .naviArea .navLists .navList .icon {
    width: 1em;
    height: 1em;
  }
  .itemSet .naviArea .navLists .navList .icon::after {
  }
}

@media screen and (min-width: 1024px) {
  .itemSet {
    padding: 21% 7% 0;
    padding-top: min(23%, 260px);
  }
  .itemSet .txtBlk {
  }
  .itemSet .featureBg {
    top: -50%;
    height: 160%;
    z-index: -3;
  }
  .itemSet .campaignTtlBlk {
    margin: 7% auto 0;
    width: 100%;
  }
  .itemSet .campaignTtlBlk .campaignTtl {
    padding: 0 1.8em;
    font-size: 4.5rem;
  }
  .itemSet .naviArea {
  }
  .itemSet .naviArea .navLists {
  }
  .itemSet .naviArea .navLists .navList {
  }
  .itemSet .naviArea .navLists .navList.noCnt {
  }
  .itemSet .naviArea .navLists .navList a {
  }
  .itemSet .naviArea .navLists .navList + .navList {
  }

  .itemSet .naviArea .navLists .navList .icon {
  }
  .itemSet .naviArea .navLists .navList .icon::after {
  }
  .itemSet .imgBlk {
    width: 48%;
    margin: 3.5% auto 0 0;
  }
  .itemSet .imgBlk .imgList {
    width: 41%;
  }

  .itemSet .prdPointBlk {
    margin: 0 0 0 auto;
    /* width: 30%; */
  }
  .itemSet .prdPointBlk .awardGlp {
    display: block;
    margin: 0;
    width: 100%;
  }
  .itemSet .prdPointBlk .awardGlp .awLeftBlk {
    width: 25%;
    margin: 4% 0 0;
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk {
    width: 23%;
    margin: 4% 0 0;
  }
  .itemSet .prdPointBlk .awardGlp .awLeftBlk p:not(:last-of-type) {
  }

  .itemSet .prdPointBlk .awardGlp .awRightBlk > p {
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn a {
  }
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn p {
  }

  .itemSet .prdPointBlk .pkgPointLists {
    display: none;
  }
  .itemSet .prdPointBlk .pkgPointLists .pkgPointList {
  }
  .itemSet .prdPointBlk .pkgPointLists .pkgPointList .icon {
  }

  .itemSet .txtBlk {
    width: 52%;
    margin: 0;
    padding: 0 0 0 2%;
  }
}

/* @media screen and (min-width: 1281px) {
  .itemSet .prdPointBlk .awardGlp .awRightBlk .awardBtn::after {
    top: 50px;
  }
} */

/* ==================================================
movieArea
================================================== */
.movieArea {
  /* margin: 8% auto 0; */
  padding: 15% 0 20%;
}
.movieArea::before {
  content: "";
  background: #f8f8f8;
  position: absolute;
  left: 0;
  top: -20%;
  width: 100%;
  height: 120%;
  z-index: -1;
  clip-path: polygon(0 0%, 100% 0%, 100% 95%, 0% 100%);
}
.movieArea .ttlObj {
}
.movieArea .movieBlk {
  width: 90%;
  margin: 3% auto 0;
}
.movieArea .movieBlk iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.movieArea .movieBlk + .movieBlk {
}
.movieArea .movieBlk .txtBlk {
}
.movieArea .movieBlk .txtBlk .txtObj {
}
.movieArea .movieLists {
  width: 100%;
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  margin: 8% auto 0;
}
.movieArea .movieLists .movieList {
  display: flex;
  flex-flow: wrap;
  align-items: center;
  width: min(80%, 540px);
}
.movieArea .movieLists .movieList .imgObj {
  width: min(35%, 160px);
  border: 2px solid #c41948;
  line-height: 1;
}

.movieArea .movieLists .movieList.showVideo {
  width: min(90%, 640px);
}
.movieArea .movieLists .movieList.showVideo .imgObj {
  width: 100%;
  border: none;
  margin: 0 auto;
}
.movieArea .movieLists .movieList.showVideo .txtGlp {
  padding: 0;
  text-align: center;
  width: 100%;
  margin: 1em auto 0;
}
.movieArea .movieLists .movieList.showVideo .imgObj iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.movieArea .movieLists .movieList .txtGlp {
  width: 65%;
  padding: 0 0 0 5em;
  text-align: left;
}
.movieArea .movieLists .movieList .txtGlp .ttlObj {
}
.movieArea .movieLists .movieList .txtGlp .link {
  margin: 3.5em 0 0;
  position: relative;
  padding: 0;
}
.movieArea .movieLists .movieList .txtGlp .link p {
  padding: 0 0 0 2em;
  cursor: pointer;
  transition: 0.2s ease;
}
.movieArea .movieLists .movieList .txtGlp .link p:hover {
  opacity: 0.5;
  transition: 0.2s ease;
}
.movieArea .movieLists .movieList .txtGlp .link p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  background: url(../asset/img/arrow.png);
  width: 1.4em;
  height: 1.4em;
  background-size: cover;
  background-position: center;
  transform: translate(0, -50%);
}
.movieArea .movieLists .movieList .txtGlp .link a {
  width: 100%;
  display: flex;
}
.movieArea .movieLists .movieList .txtGlp .link a .txtObj {
  position: relative;
  padding: 0 0 0 2.2em;
  line-height: 1;
}
@media screen and (min-width: 641px) {
  .movieArea {
    /* margin: 0% auto 0; */
    padding: 5% 0 8%;
  }
  .movieArea::before {
    content: "";
    height: 140%;
    clip-path: polygon(0 0, 100% 0%, 100% 83%, 0% 100%);
    top: -30%;
  }
  .movieArea .ttlObj {
  }
  .movieArea .movieBlk {
    margin: 2% auto 0;
    width: min(60%, 640px);
  }
  .movieArea .movieBlk + .movieBlk {
  }
  .movieArea .movieBlk .txtBlk {
    margin: 0.5em auto 0;
  }
  .movieArea .movieBlk .txtBlk .txtObj {
  }

  .movieArea .movieLists {
    margin: 4% auto 2%;
  }
  .movieArea .movieLists .movieList {
  }
  .movieArea .movieLists .movieList .imgObj {
  }
  .movieArea .movieLists .movieList .txtGlp {
    padding: 0 0 0 3em;
  }
  .movieArea .movieLists .movieList .txtGlp .ttlObj {
  }
  .movieArea .movieLists .movieList .txtGlp .link {
    margin: 2em 0 0;
  }
  .movieArea .movieLists .movieList .txtGlp .link a {
  }
  .movieArea .movieLists .movieList .txtGlp .link a .txtObj {
  }
}
@media screen and (min-width: 961px) {
  .movieArea {
    padding: 3% 0 8%;
  }
  .movieArea::before {
    content: "";
  }
  .movieArea .ttlObj {
  }
  .movieArea .movieBlk {
  }
  .movieArea .movieBlk + .movieBlk {
  }
  .movieArea .movieBlk .txtBlk {
  }
  .movieArea .movieBlk .txtBlk .txtObj {
  }

  .movieArea .movieLists {
  }
  .movieArea .movieLists .movieList {
    /* width: 100%; */
  }
  .movieArea .movieLists .movieList .imgObj {
  }
  .movieArea .movieLists .movieList .txtGlp {
  }
  .movieArea .movieLists .movieList .txtGlp .ttlObj {
  }
  .movieArea .movieLists .movieList .txtGlp .link {
  }
  .movieArea .movieLists .movieList .txtGlp .link a {
  }
  .movieArea .movieLists .movieList .txtGlp .link a .txtObj {
  }
}
/* ==================================================
ColorVariation
================================================== */
.cvArea {
  margin: 17% auto 0;
}
.cvArea .ttlObj {
}

.cvSet {
  margin: 6% auto 0;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0;
  box-sizing: border-box;
  width: 92%;
}

.cvSet .clrList {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  flex-flow: wrap;
}
.cvSet li {
  position: relative;
  margin: 0 1rem 2rem;
  cursor: pointer;
  width: 38px;
}
.cvSet li:before {
  content: "";
  position: relative;
  display: block;
  background: #f0f0f0;
  width: 38px;
  height: 38px;
  border-radius: 30px;
  margin: 0 auto;
}
.cvSet li:after {
  content: "";
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 27px;
  top: 4px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}

.cvSet li.limitedClr p {
  position: relative;
}

.cvSet li.selected:before {
  background: #ffffff;
  border: 2px solid #c41847;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.cvSet li p {
  line-height: 1.1;
  margin: 1rem 0 0;
}
.cvSet .infoTxtSet {
  text-align: left;
  width: 90%;
  margin: 1.5rem auto 4rem;
}

.cvSet .infoTxtSet p {
  text-align: left;
  line-height: 1.5;
  /* display: inline; */
}
.cvSet .infoTxtSet p + p {
  padding: 0;
}

.cvSet .titSet {
  margin: 0 auto 4rem;
}

.cvSet .slideBlk .cvSlide .cvsSet .cvsTxt h4 {
  margin: 0 auto 0.3rem;
  position: relative;
  z-index: 1;
}

.cvSet .swiper-button-next,
.cvSet .swiper-button-prev {
  margin: 0;
  opacity: 1;
  pointer-events: auto;
  display: block;
}

.cvSet .swiper-button-next {
  right: 0;
}

.cvSet .swiper-button-prev {
  left: 0;
}

.cvSet .swiper-button-prev::before {
  top: 32%;
  border-left: 2px solid #c41948;
  border-bottom: 2px solid #c41948;
  width: 30px;
  height: 30px;
}
.cvSet .swiper-button-next::before {
  top: 32%;
  border-right: 2px solid #c41948;
  border-bottom: 2px solid #c41948;
  width: 30px;
  height: 30px;
}
.cvSet .slideBlk {
  max-width: 1260px;
  margin: 0 auto;
  /* overflow: hidden; */
  position: relative;
}

.cvSlide {
  width: 95%;
  margin: 0 auto;
  overflow: hidden;
  padding: 0 0 8%;
}

.cvSlide .cvsSet {
  width: 100%;
  margin: 0 auto;
  position: relative;
  /* opacity: 0; */
}
.cvSlide .cvsSet .cvsImg {
  position: relative;
}
.cvSlide .cvsSet .cvsImg.limited::before {
  content: "限定色";
  background: #c41847;
  border-radius: 4px;
  color: #fff;
  position: absolute;
  right: 5%;
  top: 3%;
  font-size: clamp(9px, var(--MTxt), 18px);
  padding: 0.3em 0.5em 0.3em;
  line-height: 1;
  text-align: center;
}
.cvSlide .cvsSet .cvsImg.newClr::before {
  content: "新色";
  background: #c41847;
  border-radius: 4px;
  color: #fff;
  position: absolute;
  right: 5%;
  top: 3%;
  font-size: clamp(9px, var(--MTxt), 18px);
  padding: 0.3em 0.5em 0.3em;
  line-height: 1;
  text-align: center;
}
.cvSlide .cvsSet .cvsImg > img {
  width: 95%;
}
.cvSlide .cvsSet.swiper-slide-active {
  opacity: 1;
}
.cvSlide .swiperOne .cvsSet {
  margin: 0 auto !important;
}
.cvSlide .cvsTxt {
  text-align: left;
  margin: 4rem auto 0;
  width: 95%;
}
.cvSlide .clrImg {
  position: absolute;
  width: 58%;
  right: 0;
  margin: 0;
  transform: translate(0, 10px);
}

.slideNone.slideBlk .cv-next,
.slideNone.slideBlk .cv-prev {
  display: none;
}
.slideNone .cvsSet {
  width: 100%;
}
@media screen and (min-width: 641px) {
  .cvArea {
    display: none;
  }
  .cvArea .ttlObj {
  }

  .cvSet {
    width: 100%;
  }

  .cvSet .clrList {
  }
  .cvSet li {
    margin: 0 1rem 0;
  }
  .cvSet li:before {
  }
  .cvSet li:after {
  }

  .cvSet li.limitedClr p {
  }

  .cvSet li.selected:before {
  }

  .cvSet li p {
  }
  .cvSet .infoTxtSet {
    width: 100%;
    margin: 2em 0 0;
  }

  .cvSet .infoTxtSet p {
  }
  .cvSet .infoTxtSet p + p {
  }

  .cvSet .titSet {
  }

  .cvSet .slideBlk .cvSlide .cvsSet .cvsTxt h4 {
  }

  .cvSet .swiper-button-next,
  .cvSet .swiper-button-prev {
  }

  .cvSet .swiper-button-next {
    width: 50px;
    right: 2%;
  }

  .cvSet .swiper-button-prev {
    width: 50px;
    left: 2%;
  }

  .cvSet .swiper-button-prev::before {
    width: 50px;
    height: 50px;
  }
  .cvSet .swiper-button-next::before {
    width: 50px;
    height: 50px;
  }
  .cvSet .slideBlk {
  }
  .cvSet .slideBlk.slideNone {
    margin: 0 auto 10%;
  }

  .cvSlide {
    width: 92%;
    padding: 0 0 4%;
  }
  .cvSlide .cvsSet {
  }
  .cvSlide .cvsSet .cvsImg > img {
  }
  .cvSlide .cvsSet.swiper-slide-active {
  }
  .cvSlide .swiperOne .cvsSet {
  }
  .cvSlide .cvsTxt {
    margin: 2em auto 0;
  }
  .cvSlide .clrImg {
    transform: translate(0, 13%);
    width: 62%;
  }

  .slideNone.slideBlk .cv-next,
  .slideNone.slideBlk .cv-prev {
  }
  .slideNone .cvsSet {
  }
}

@media screen and (min-width: 961px) {
  .cvArea {
  }
  .cvArea .ttlObj {
  }

  .cvSet {
  }

  .cvSet .clrList {
  }
  .cvSet li {
  }
  .cvSet li:before {
  }
  .cvSet li:after {
  }

  .cvSet li.limitedClr p {
  }

  .cvSet li.selected:before {
  }

  .cvSet li p {
  }
  .cvSet .infoTxtSet {
    width: 92%;
    margin: 2em auto 0;
  }

  .cvSet .infoTxtSet p {
  }
  .cvSet .infoTxtSet p + p {
  }

  .cvSet .titSet {
  }

  .cvSet .slideBlk .cvSlide .cvsSet .cvsTxt h4 {
  }

  .cvSet .swiper-button-next,
  .cvSet .swiper-button-prev {
  }

  .cvSet .swiper-button-next {
    right: 5%;
  }

  .cvSet .swiper-button-prev {
    left: 5%;
  }

  .cvSet .swiper-button-prev::before {
  }
  .cvSet .swiper-button-next::before {
  }
  .cvSet .slideBlk {
  }

  .cvSlide {
    width: 88%;
  }
  .cvSlide .cvsSet {
  }
  .cvSlide .cvsSet .cvsImg > img {
  }
  .cvSlide .cvsSet.swiper-slide-active {
  }
  .cvSlide .swiperOne .cvsSet {
  }
  .cvSlide .cvsTxt {
  }
  .cvSlide .clrImg {
  }

  .slideNone.slideBlk .cv-next,
  .slideNone.slideBlk .cv-prev {
  }
  .slideNone .cvsSet {
  }
}

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

/*各カラー設定*/

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

/* ==================================================
Feature
================================================== */

.ftBg {
  background: #ffffff;
  width: 100%;
  height: 120%;
  -webkit-transform: skewY(-10deg);
  -ms-transform: skewY(-10deg);
  transform: skewY(-10deg);
  top: -15%;
}

.ftBg::before {
  content: "";
  background: #f8f8f8;
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  left: 0;
  -webkit-transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
  -o-transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
  transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
}

.appeared.ftBg::before {
  left: 100%;
}

.clrChart {
  max-width: 400px;
  margin: 0 auto 4rem;
  width: 80%;
}

.featureBlk .titSet {
  margin: 0 auto 2.5rem;
}

.featureBlk .titSet p {
  margin: 2rem auto 0;
}

.featureBlk .featureSet {
  width: 90%;
  margin: 0 auto 80px;
}

.featureBlk .featureSet .txtR {
  text-align: right;
}

.featureBlk .featureSet h2 {
  margin: 0 auto 4rem;
}

.featureBlk .featureSet .movieBlk {
  margin: 4em auto 0;
  position: relative;
  width: 100%;
  max-width: 720px;
}

.featureBlk .featureSet .movieBlk::before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 56.25%;
}
.featureBlk .featureSet .caption {
  text-align: left;
  max-width: 720px;
  margin: 10px auto;
}
.featureBlk .featureSet .movieBlk video,
.featureBlk .featureSet .movieBlk iframe,
.featureBlk .featureSet .movieBlk object,
.featureBlk .featureSet .movieBlk embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*ebc*/

.modalBlk {
  margin: 12rem auto 28rem;
  width: 90%;
  max-width: 1200px;
}

.movieModalBlk {
  position: relative;
  padding: 10rem 0 10rem;
}

.movieModalBlk::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3px;
  background: #e63c36;
  -webkit-transform: skew(0, -10deg);
  -ms-transform: skew(0, -10deg);
  transform: skew(0, -10deg);
}

.movieModalBlk::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #e63c36;
  -webkit-transform: skew(0, -10deg);
  -ms-transform: skew(0, -10deg);
  transform: skew(0, -10deg);
}

.movieModalBlk + .movieModalBlk::before {
  content: none;
}

.movieModalBlk + .movieModalBlk::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #e63c36;
  -webkit-transform: skew(0, -10deg);
  -ms-transform: skew(0, -10deg);
  transform: skew(0, -10deg);
}

.movieModalBlk + .movieModalBlk {
  margin: 0rem auto;
  padding: 10rem 0;
}

.movieModalBlk h3 {
}

.movieModalBlk h3 + p {
  margin: 1.5rem auto 0;
}

.movieModalBlk .movieLists {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  margin: 5rem auto 0;
  width: 96%;
}

.movieModalBlk .movieLists .movieList {
  width: 46%;
  margin: 0 2% 6%;
}

.movieModalBlk .movieLists .movieList + .movieList {
}

.movieModalBlk .movieLists .movieList figcaption {
  margin: 2rem auto 0;
}

@media screen and (min-width: 641px) {
  .movieModalBlk::before,
  .movieModalBlk::after {
    height: 6px;
  }
  .movieModalBlk + .movieModalBlk::after {
    height: 6px;
  }
  .movieModalBlk + .movieModalBlk {
    /* padding: 10rem 0; */
    /* margin: 8rem auto; */
  }
  .movieModalBlk .movieLists {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    margin: 5rem auto 0;
    width: 96%;
  }
  .movieModalBlk .movieLists .movieList {
    width: 28%;
    margin: 0 2% 2%;
  }
  .movieModalBlk .movieLists .movieList + .movieList {
  }
  .movieModalBlk .movieLists .movieList figcaption {
    margin: 1rem auto 0;
  }
}

@media screen and (min-width: 961px) {
  .movieModalBlk .movieLists .movieList figcaption {
    font-size: 2rem;
  }
}

/* ==================================================
Point
================================================== */

.psBlk {
  padding: 10% 0 4rem;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: center;
  position: relative;
}

.psBlk .pointBlk {
  margin: 9.5% auto 0;
  width: 100%;
}
.pointSet {
  position: relative;
  width: 86%;
  margin: 0 auto;
}
.pointSet + .pointSet {
}
.psBgSet {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.psTile {
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding: 0rem 0 0;
  text-align: left;
  z-index: 10;
}
.psTile .ttlGlp {
  width: 100%;
  display: block;
}
.psTile .txtGlp {
}
.psTile .accObj {
  display: flex;
  justify-content: flex-end;
}
.psTile .accObj .icon {
  position: relative;
  width: 1em;
  display: block;
  margin: 0 0.51em 0 0;
}
.psTile .accObj .icon::before,
.psTile .accObj .icon::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  width: 1em;
  height: 0.09em;
  background: #000;
}
.psTile .accObj .icon::after {
  transform: rotate(90deg) translate(0, -50%);
  top: calc(50% - 0.045em);
}

.pointSet + .pointSet {
  margin-top: 5rem;
}

.pointSet .psPoint {
  position: relative;
}

.pointSet p.boardTxt {
  padding: 0 5px;
  margin: 4rem 4rem 0;
}

.pointSet h3 {
  margin: 0.2em auto 0.7em;
  line-height: 1.2;
}
.pointSet h3 span {
  vertical-align: super;
}

.pointSet h4 {
  margin: 4rem 0 1rem;
}

.pointSet span.super {
  vertical-align: super;
}

.pointSet p.psTxt {
  margin: 0 auto 1.4em;
  line-height: 1.65;
}

.pointSet .psImg {
  margin: 3% auto;
}
.pointSet .psImg + h3 {
  margin: 8% auto 0;
}

.pointSet .psImg.wFit {
  margin: 0;
}

.pointSet figure figcaption {
  text-align: right;
  margin: 1em 0 0;
}

.pointSet p.psImg + .psImg {
  margin-top: 4rem;
}

.psHosokuR {
  width: 86%;
  text-align: left;
  margin: 4rem auto 0;
}

.psHosokuL {
  width: 90%;
  text-align: left;
  margin: 4rem auto 0 6rem;
}

.psHosokuR p.boardTxt,
.psHosokuL p.boardTxt {
  margin: 0 auto 2rem;
}

.psBlk .pkgBlk {
}
.psBlk .pkgBlk .imgObj {
  width: 100%;
  line-height: 1;
  position: relative;
  filter: drop-shadow(20px 30px 3px rgba(0, 0, 0, 0.3));
}
.psBlk .pkgBlk .imgObj.blush {
  width: 100%;
  margin: 0 0 0 8%;
  transform-origin: top;
}
.psBlk .pkgBlk .imgObj.bottle {
  margin: 4.5% 0 0 32%;
  width: 105%;
}

.psBlk > .ttlGlp {
  margin: 13% auto 0;
  width: 86%;
}
.psBlk .ttlGlp .ttlObj {
}
.psBlk .ttlGlp .sTtlObj {
  text-align: left;
  margin: 0.75em 0 0;
  letter-spacing: 0;
  line-height: 1.2;
}

@media screen and (min-width: 641px) {
  .psBlk {
    padding: 10rem 0 4rem;
  }
  .pointSet {
    width: 100%;
  }
  .pointSet + .pointSet {
    margin-top: 16%;
  }
  .leftPs,
  .rightPs {
    width: 45%;
    max-width: 580px;
    margin: 0 2.5%;
  }
  .psBlk .pointBlk {
    display: flex;
    margin: 0 auto;
    flex-flow: wrap;
    align-items: flex-start;
  }
  .leftPs {
    margin-top: 4em;
    margin: 0 0 0 auto;
    /* width: 40%; */
    padding: 0 2% 0 0;
  }
  .rightPs {
    margin-top: -10em;
    margin: 0 auto 0 0;
    padding: 0 0 0 2%;
  }
  .psTile {
    width: 100%;
    padding: 0 0 6rem;
  }

  .psTile {
  }
  .psTile .ttlGlp {
  }
  .psTile .txtGlp {
    display: block !important;
  }
  .psTile .accObj {
    display: none;
  }
  .psTile .accObj .icon {
  }
  .psTile .accObj .icon::before,
  .psTile .accObj .icon::after {
  }
  .psTile .accObj .icon::after {
  }

  .psBlk .pkgBlk {
  }
  .psBlk .pkgBlk .imgObj {
    filter: drop-shadow(-40px 30px 6px rgba(0, 0, 0, 0.3));
  }
  .psBlk .pkgBlk .imgObj.blush {
    width: 49%;
    margin: 0 0 0 40.2%;
  }
  .psBlk .pkgBlk .imgObj.bottle {
    width: 52%;
    margin: 2% 0 0 51.8%;
  }

  .psBlk > .ttlGlp {
    margin: 4% auto 3%;
    width: 90%;
    max-width: 1000px;
  }
  .psBlk .ttlGlp .ttlObj {
  }
  .psBlk .ttlGlp .sTtlObj {
  }
  .psHosokuR {
    width: 100%;
  }
}

@media screen and (min-width: 961px) {
  .psBlk {
  }
  .psBlk {
  }
  .leftPs,
  .rightPs {
    /* width: 45%; */
    max-width: 500px;
    /* margin: 0 2.5%; */
  }
  .leftPs {
    /* margin-top: 4em; */
  }
  .rightPs {
    /* margin-top: -8em; */
  }
  .pointSet .psBg {
    display: none;
  }
  .pointSet .psPoint {
    /* top: -3rem; */
  }
  .pointSet p.boardTxt {
    padding: 0 15px;
  }
  .psBlk h2 {
    text-align: left;
    margin: 0 auto 14rem;
  }
  .psTile {
    width: 100%;
    padding: 0;
  }

  .psTile .ttlGlp {
  }
  .psTile .txtGlp {
  }
  .psTile .accObj {
  }
  .psTile .accObj .icon {
  }
  .psTile .accObj .icon::before,
  .psTile .accObj .icon::after {
  }
  .psTile .accObj .icon::after {
  }
  .psHosokuR p.boardTxt,
  .psHosokuL p.boardTxt {
    padding: 0 15px;
  }
  .psBlk .pkgBlk {
  }
  .psBlk .pkgBlk .imgObj {
  }
  .psBlk .pkgBlk .imgObj.blush {
  }
  .psBlk .pkgBlk .imgObj.bottle {
  }

  .psBlk > .ttlGlp {
  }
  .psBlk .ttlGlp .ttlObj {
  }
  .psBlk .ttlGlp .sTtlObj {
  }
}
/* ==================================================
conceptArea
================================================== */
.conceptArea {
  width: 86%;
  background: #e8e8e8;
  margin: 0 auto;
  padding: 9% 0;
}
.conceptArea .ttlObj {
}
.conceptArea .txtObj {
  margin: 1em 0 0;
}

@media screen and (min-width: 641px) {
  .conceptArea {
    /* width: 60%; */
    max-width: 1000px;
    margin: 3% auto 0;
    padding: 5% 0;
  }
  .conceptArea .ttlObj {
  }
  .conceptArea .txtObj {
  }
}
@media screen and (min-width: 961px) {
  .conceptArea {
  }
  .conceptArea .ttlObj {
  }
  .conceptArea .txtObj {
  }
}
/* ==================================================
Howto
================================================== */

.howtoSet {
  position: relative;
  padding: 0 0;
  margin: 80px auto 0;
}

.howtoSet .titSet {
}
.howtoSet h2 {
  margin: 0 auto 5rem;
}
.howtoSet .htBlk {
  width: min(90%, 800px);
  margin: 0 auto;
  border-top: 1px solid #c6c6c6;
}
.howtoSet .htSet {
  text-align: left;
}
.howtoSet .htSet + .htSet {
}
.howtoSet .htSet .howTit {
  border-bottom: 1px solid #c6c6c6;
  padding: 0.85em 0.8em;
  line-height: 1;
  position: relative;
}
.howtoSet .htSet .howTit::before,
.howtoSet .htSet .howTit::after {
  content: "";
  width: 1.2em;
  height: 2px;
  display: block;
  position: absolute;
  right: 0.6em;
  top: 50%;
  background: #000;
  transform: translate(0, -50%) rotate(00deg);
  transition: 0.1s ease transform;
}
.howtoSet .htSet .howTit::after {
  transform: translate(0, -50%) rotate(90deg);
  transition: 0.1s ease transform;
}
.howtoSet .htSet .howTit.clicked::after {
  transform: translate(0, -50%) rotate(00deg);
  transition: 0.1s ease transform;
}
.howtoSet .htSet .howTxt {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.2s ease-out;
}
.howtoSet .htSet .howTxt.openAcc {
  grid-template-rows: 1fr;
  border-bottom: 1px solid #c6c6c6;
  padding: 1em;
}

.howtoSet .htSet .howTxt span {
  overflow: hidden;
}
.howtoSet .htSet .accObj {
  display: none;
  padding: 2em;
}
.howtoSet .htSet .accObj p {
}
.howtoSet .htSet .accObj .imgObj {
  width: min(100%, 500px);
}
.howtoSet .htSet .howTit.clicked + .accObj {
  border-bottom: 1px solid #c6c6c6;
}

.howtoSet .movieBlk {
  margin: 4em auto 0;
  width: 90%;
  max-width: 720px;
}

.howtoSet .movieBlk .movSet {
  margin: 0 auto 10px;
  position: relative;
}

.howtoSet .movieBlk .movSet::before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 56.25%;
}

.howtoSet .movieBlk p {
  text-align: left;
}

.howtoSet .movieBlk iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 641px) {
  .howtoSet {
    position: relative;
    padding: 100px 0 0;
    margin: 0 auto;
    max-width: 1080px;
  }
  .howtoSet .slideBlk .howTxtSlide .howTxt {
    text-align: center;
  }
}

@media screen and (min-width: 1281px) {
  .howtoSet {
    padding: 100px 0 80px;
  }
}

/* ==================================================
bottomItem
================================================== */

.ibsBg {
  background: #ffffff;
  width: 100%;
  height: 100%;
  -webkit-transform: skewY(-10deg);
  -ms-transform: skewY(-10deg);
  transform: skewY(-10deg);
  height: 115%;
  top: -10%;
  left: 0;
}

.ibsBg::before {
  content: "";
  background: #f0f0f0;
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  left: 0;
  -webkit-transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
  -o-transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
  transition: 1s all cubic-bezier(0.57, 0.02, 0.4, 0.92);
}

.appeared.ibsBg::before {
  left: 100%;
}
.itemBSet {
}

.itemBSet .imgTxtBlk {
  width: 100%;
  margin: 0 auto 18%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-flow: wrap;
  position: relative;
}
.itemBSet .imgTxtBlk::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 67%;
  background: #f8f8f8;
  left: 0;
  top: 42%;
  clip-path: polygon(0% 15%, 100% 0, 100% 100%, 0% 85%);
  transform: translate(0, -50%);
  z-index: -1;
}
.itemBSet .imgBlk {
  width: 100%;
  margin: 5% auto 0;
  padding: 0 10%;
}

.itemBSet .imgBlk img {
  width: 100%;
}

.itemBSet .txtBlk {
  width: 85%;
  text-align: center;
  margin: 3% auto 0;
}

.itemBSet .btnList {
  width: 100%;
  margin: 3.5% auto 0;
}

.itemBSet .btnList li {
  margin: 0 auto 2%;
}
.itemBSet .btnList .btnEc {
}
.itemBSet .btnList .BtnCenter {
}
.itemBSet .btnList .BtnCenter a {
  padding: 2.5em 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.itemBSet .btnList .ecBtn .icon {
  width: 8.5%;
  height: 8.5%;
  display: flex;
  padding: 0 0 0.51em;
}
.itemBSet .btnList .ecBtn svg {
  width: 100%;
  height: 100%;
}
.itemBSet .btnList .btnShop {
}

.itemBSet .btnList li.lightBtn {
  display: inline-block;
  margin: 2rem 2rem 0;
}

.itemBSet .btnList li.lightBtn a {
  text-decoration: underline;
}

.itemBSet .snsBlk {
}
.itemBSet .snsBlk .snsLists {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 5% auto 0;
}
.itemBSet .snsBlk .snsLists .snsList {
  width: auto;
  margin: 0 2em;
}
.itemBSet .snsBlk .snsLists .snsList svg {
  width: 6em;
  height: 6em;
}
.itemBSet .snsBlk .snsLists .snsList.iconX {
}
.itemBSet .snsBlk .snsLists .snsList.iconIg {
}
.itemBSet .snsBlk .snsLists .snsList.iconTi {
}

@media screen and (min-width: 641px) {
  .itemBSet {
  }
  .itemBSet .imgTxtBlk {
  }
  .itemBSet .imgTxtBlk::before {
    clip-path: polygon(0% 25%, 100% 0, 100% 100%, 0% 75%);
    top: 50%;
    height: 100%;
  }

  .itemBSet .imgBlk {
  }

  .itemBSet .imgBlk img {
  }

  .itemBSet .txtBlk {
  }

  .itemBSet .btnList {
  }

  .itemBSet .btnList li {
  }
  .itemBSet .btnList .btnEc {
  }
  .itemBSet .btnList .BtnCenter {
  }
  .itemBSet .btnList .BtnCenter a {
  }
  .itemBSet .btnList .ecBtn .icon {
  }
  .itemBSet .btnList .ecBtn svg {
  }
  .itemBSet .btnList .btnShop {
  }

  .itemBSet .btnList li.lightBtn {
  }

  .itemBSet .btnList li.lightBtn a {
  }

  .itemBSet .snsBlk {
  }
  .itemBSet .snsBlk .snsLists {
  }
  .itemBSet .snsBlk .snsLists .snsList {
    margin: 0 1em;
  }
  .itemBSet .snsBlk .snsLists .snsList svg {
    width: 2.8em;
    height: 2.8em;
  }
  .itemBSet .snsBlk .snsLists .snsList.iconX {
  }
  .itemBSet .snsBlk .snsLists .snsList.iconIg {
  }
  .itemBSet .snsBlk .snsLists .snsList.iconTi {
  }
}

@media screen and (min-width: 641px) {
  .ibsBg {
    height: 130%;
    top: -15%;
  }
  .areaBlk + .areaBlk.itemBSet {
    margin-top: 8%;
  }
  .itemBSet .imgTxtBlk {
    align-items: center;
    margin: 0 0 120px;
    position: relative;
    padding: 5% 0;
  }
  .itemBSet .titSet {
    width: 100%;
    margin: 0 auto 0%;
  }
  .itemBSet .imgBlk {
    width: 45%;
    max-width: 520px;
    margin: 0 0 0 auto;
    padding: 0;
  }
  .itemBSet .imgBlk img {
    width: 100%;
  }
  .itemBSet .txtBlk {
    width: 45%;
    max-width: 560px;
    margin: 0 auto 0 0;
  }

  .itemBSet .imgBlk {
  }

  .itemBSet .imgBlk img {
  }

  .itemBSet .txtBlk {
  }

  .itemBSet .btnList {
  }

  .itemBSet .btnList li {
  }
  .itemBSet .btnList .btnEc {
  }
  .itemBSet .btnList .BtnCenter {
  }
  .itemBSet .btnList .BtnCenter a {
  }
  .itemBSet .btnList .ecBtn .icon {
  }
  .itemBSet .btnList .ecBtn svg {
  }
  .itemBSet .btnList .btnShop {
  }

  .itemBSet .btnList li.lightBtn {
  }

  .itemBSet .btnList li.lightBtn a {
  }

  .itemBSet .snsBlk {
  }
  .itemBSet .snsBlk .snsLists {
  }
  .itemBSet .snsBlk .snsLists .snsList {
  }
  .itemBSet .snsBlk .snsLists .snsList svg {
  }
  .itemBSet .snsBlk .snsLists .snsList.iconX {
  }
  .itemBSet .snsBlk .snsLists .snsList.iconIg {
  }
  .itemBSet .snsBlk .snsLists .snsList.iconTi {
  }
}

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

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

/* ==================================================
pickup
================================================== */
.puBlk .slideBlk .pickupSlide .efBtn {
  display: none !important;
}

/* ==================================================
POP UP
================================================== */

.popupSet {
  max-width: 720px;
  overflow: hidden;
}

.popupSet dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: 100%;
  margin: 0;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  max-height: 60vh;
  overflow: scroll;
  padding: 0 0 40px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  overflow-x: hidden;
}

/*Award*/

dl.awardSet dt {
  width: 15%;
  margin: 0 5% 0 0;
  max-width: 60px;
}

dl.awardSet dd {
  width: 80%;
  text-align: left;
  padding: 0 5% 0 0;
}

dl.awardSet dt:not(:last-of-type) {
  margin: 0 5% 20px 0;
}

dl.awardSet dd:not(:last-of-type) {
  margin: 0 0 20px 0;
}

dl.awardSet dt h4 {
  margin: 0 0 10px;
}

/*成分表*/

dl.componentSet {
  padding: 0 2rem 0 0;
  text-align: left;
}

dl.componentSet dt {
  margin: 0;
}

dl.componentSet dd:not(:last-of-type) {
  margin: 0 0 3rem;
}

@media screen and (min-width: 961px) {
  dl.awardSet dt:not(:last-of-type) {
    margin: 0 5% 30px 0;
  }
  dl.awardSet dd:not(:last-of-type) {
    margin: 0 0 30px 0;
  }
}

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

/* --- カードセクション --- */

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

.Card {
  margin-top: 24px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.Card-Item {
  width: calc((100% - 56px) / 3);
  background: #eee;
  cursor: pointer;
}

.Card-Item:not(:nth-child(3n-2)) {
  margin-left: 28px;
}

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

/* --- ModalSection --- */

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

.ModalLayer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  -webkit-transition: opacity 0.65s;
  -o-transition: opacity 0.65s;
  transition: opacity 0.65s;
  pointer-events: none;
  opacity: 0;
  z-index: 10000;
}

.ModalLayer.isShow {
  -webkit-transition: opacity 0.65s;
  -o-transition: opacity 0.65s;
  transition: opacity 0.65s;
  pointer-events: auto;
  opacity: 1;
}

.ModalLayer-Mask {
  position: absolute;
  background: rgba(233, 233, 233, 9.5);
  width: 100%;
  height: 100vh;
}

.ModalLayer-Inner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: 600px;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.Modal-Inner-Btn {
  position: absolute;
  top: 6%;
  right: 3%;
  width: 40px;
  color: #000;
  z-index: 10;
  cursor: pointer;
  height: 40px;
  font-size: 0;
}

.Modal-Inner-Btn::before,
.Modal-Inner-Btn::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: #000;
  top: 50%;
  left: 0;
}

.Modal-Inner-Btn::before {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.Modal-Inner-Btn::after {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.Modal-Inner-Card {
  width: 100%;
}

.Modal-Inner-Card-Wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.Modal-Inner-Card-Wrapper-Slide {
  height: auto;
}

.Modal-Inner-Card-Wrapper-Slide-Item {
  padding-top: 50px;
  padding-bottom: 50px;
  width: 100%;
  height: 100%;
}

.ModalInnerSet {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

.ModalInnerSet .modalSubTtl {
  border-bottom: 1px solid;
  display: inline-block;
  padding: 0 0 2px;
  margin: 0 auto 3rem;
}

.ModalInnerSet video {
}

.ModalInnerSet .txtSet {
}

.ModalInnerSet .txtSet .modalTtl {
  text-align: center;
  margin: 1rem auto 0;
}

.ModalInnerSet .txtSet .modalTxt {
  text-align: left;
  margin: 1rem auto;
}

.Modal-Inner-Card-Wrapper-Slide-Item-Box-Text {
  color: #fff;
}

.Modal-Inner .swiper-button-prev::before {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  border-bottom: 2px solid #000000;
  border-left: 2px solid #000000;
  -webkit-transform-origin: left bottom;
  -ms-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-transform: translate(0, -100%) rotate(45deg);
  -ms-transform: translate(0, -100%) rotate(45deg);
  transform: translate(0, -100%) rotate(45deg);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.Modal-Inner .swiper-button-next::before {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  border-bottom: 2px solid #000000;
  border-right: 2px solid #000000;
  -webkit-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  transform-origin: right bottom;
  -webkit-transform: translate(0, -100%) rotate(-45deg);
  -ms-transform: translate(0, -100%) rotate(-45deg);
  transform: translate(0, -100%) rotate(-45deg);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
}

@media screen and (min-width: 641px) {
  .ModalLayer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    -webkit-transition: opacity 0.65s;
    -o-transition: opacity 0.65s;
    transition: opacity 0.65s;
    pointer-events: none;
    opacity: 0;
    z-index: 10000;
  }
  .ModalLayer.isShow {
    -webkit-transition: opacity 0.65s;
    -o-transition: opacity 0.65s;
    transition: opacity 0.65s;
    pointer-events: auto;
    opacity: 1;
  }
  .ModalLayer-Mask {
    position: absolute;
    background: rgba(233, 233, 233, 9.5);
    width: 100%;
    height: 100vh;
  }
  .ModalLayer-Inner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 1000px;
  }
  .Modal-Inner-Btn {
    position: absolute;
    top: 6%;
    right: 0;
    width: 40px;
    color: #000;
    z-index: 10;
    cursor: pointer;
    height: 40px;
    font-size: 0;
  }
  .Modal-Inner-Btn::before,
  .Modal-Inner-Btn::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background: #000;
    top: 50%;
    left: 0;
  }
  .Modal-Inner-Btn::before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .Modal-Inner-Btn::after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  .Modal-Inner-Card {
    width: 100%;
  }
  .Modal-Inner-Card-Wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
  }
  .Modal-Inner-Card-Wrapper-Slide {
    /* width: 100% !important; */
    margin: 0 auto;
    height: auto;
  }
  .Modal-Inner-Card-Wrapper-Slide-Item {
    padding-top: 50px;
    padding-bottom: 50px;
    width: 100%;
    height: 100%;
  }
  .ModalInnerSet {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
  }
  .ModalInnerSet .modalSubTtl {
    border-bottom: 1px solid;
    display: inline-block;
    padding: 0 0 2px;
    margin: 0 auto 3rem;
  }
  .ModalInnerSet video {
    width: 100%;
    max-width: 450px;
    margin: 0 auto;
  }
  .ModalInnerSet .txtSet {
    margin: 1.5rem auto 0;
  }
  .ModalInnerSet .txtSet .modalTtl {
    text-align: center;
    margin: 0 auto;
  }
  .ModalInnerSet .txtSet .modalTxt {
    text-align: left;
    margin: 1rem auto 0;
    width: 70%;
  }
  .Modal-Inner-Card-Wrapper-Slide-Item-Box-Text {
    color: #fff;
  }
  .Modal-Inner .swiper-button-prev::before {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    border-bottom: 2px solid #000000;
    border-left: 2px solid #000000;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate(0, -100%) rotate(45deg);
    -ms-transform: translate(0, -100%) rotate(45deg);
    transform: translate(0, -100%) rotate(45deg);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
  .Modal-Inner .swiper-button-next::before {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    border-bottom: 2px solid #000000;
    border-right: 2px solid #000000;
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate(0, -100%) rotate(-45deg);
    -ms-transform: translate(0, -100%) rotate(-45deg);
    transform: translate(0, -100%) rotate(-45deg);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}

.modaloff {
  z-index: -100;
  height: 0;
  pointer-events: none;
  opacity: 0;
}

.campaignTxtArea {
  margin: 40px auto 80px;
  position: relative;
}

@media screen and (min-width: 961px) {
  .campaignTxtArea {
    margin: 20px auto 140px;
  }
}

.featureBlk .featureSet.campaignBnr {
  /* max-width: 720px; */
  margin: 0 auto 60px;
}

.prevImg {
  position: absolute;
  z-index: 10000;
  top: 0;
  pointer-events: none;
  opacity: 0.2;
  /* filter: grayscale(1); */
  left: 0;
  right: 0;
  margin: 0 auto;
  max-width: 1300px;
}

/*==================================================
shoplist
================================================== */

.itemTable .titleLists {
  display: flex;
  flex-flow: column;
  width: 100%;
  align-items: flex-start;
  margin: 0 auto 20px;
}
.itemTable .titleLists li {
  width: 100%;
  margin: 0 15px 0 0;
  height: auto;
  text-align: left;
  position: relative;
  padding: 0 0 0 18px;
  line-height: 1.8;
}
.itemTable .titleLists li::before {
  content: "";
  width: 12px;
  height: 12px;
  display: block;
  background: #000;
  border-radius: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}
.itemTable .titleLists .icon1::before {
  background: #666;
}
.itemTable .titleLists .icon2::before {
  border: 1px solid #666;
  background: #fff;
  box-sizing: border-box;
}
.itemTable .titleLists .icon3::before {
  background: #ee1a7a;
}
.itemTable tr td {
  position: relative;
  font-size: 0;
  padding: 0;
  width: auto;
}
.itemTable tr td::before {
  content: "";
  width: 12px;
  height: 12px;
  display: block;
  background: #000;
  border-radius: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  right: 0;
  margin: auto;
}
.itemTable tr td.noM::before {
  content: none;
}
.itemTable tr td:nth-child(1)::before {
}
.itemTable tr td:nth-child(2)::before {
  background: #666;
}
.itemTable tr td:nth-child(3)::before {
  border: 1px solid #666;
  background: #fff;
  box-sizing: border-box;
}
.itemTable tr td:nth-child(4)::before {
  background: #ee1a7a;
}

.itemTable tr td.txt {
  font-size: inherit;
  padding: 0 1em;
  font-size: 1.25rem;
}
.itemTable tr td.txt::before {
  content: none;
}

.itemTable {
  margin: 0 auto;
}

.itemTable table {
  border-collapse: collapse;
  table-layout: fixed;
  background: #ffffff;
  width: 100%;
  padding: 10px;
}
table th {
  background: #f0f0f0;
}
table th,
table td {
  width: calc((72% - 8px) / 2);
  border: 2px solid #f8f8f8;
  padding: 10px;
}
table th.leftCell {
  width: 40%;
  text-align: left;
}
.itemTable p {
  text-align: left;
  margin: 3px 0 0;
}
@media screen and (min-width: 641px) {
  .itemDetail {
    width: 50%;
  }
  .itemTable {
    /* width: 50%; */
    margin: 0 auto;
  }
}
@media screen and (min-width: 961px) {
  table th.leftCell {
    padding: 12px 8px 12px 15px;
  }
  .itemDetail {
    width: 50%;
  }
  .itemTable {
    /* width: 50%; */
    /* margin: 30px 0 0 auto; */
  }
}

/*==================================================
 Item Settings
================================================== */
/*lashup*/
.lashup .mainTitSet .mainImg {
  width: 11.3%;
  top: 0;
  left: 34%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-30px 30px 3px rgba(0, 0, 0, 0.3));
}
.lashup .mainTitSet .mainImg + .mainImg {
  top: 9%;
  left: 10%;
  width: 11.5%;
}
.lashup .mainTitSet .mainTtl {
  padding: 33% 0 0 5%;
}
.lashup .psBlk .pkgBlk .imgObj.bottle {
}
.lashup .psBlk .pkgBlk .imgObj.blush {
}
@media screen and (min-width: 641px) {
  .lashup .mainTitSet .mainImg {
    top: 5%;
    left: 60.5%;
    filter: drop-shadow(-45px -35px 6px rgba(0, 0, 0, 0.3));
    width: min(11.3%, 6.3vw, 90px);
  }
  .lashup .mainTitSet .mainImg + .mainImg {
    top: 24.6%;
    left: 47.5%;
    width: min(11.5%, 6.25vw, 100px);
  }
  .lashup .mainTitSet .mainTtl {
    padding: 4.8% 0 0 5%;
    padding-top: min(2.5vw, 120px);
  }
  .lashup .psBlk .pkgBlk .imgObj.bottle {
  }
  .lashup .psBlk .pkgBlk .imgObj.blush {
  }
}
@media screen and (min-width: 1024px) {
  .lashup .mainTitSet .mainImg {
    top: 3.8%;
    left: 60.5%;
  }
  .lashup .mainTitSet .mainImg + .mainImg {
    top: 24.6%;
    left: 47.8%;
  }
  .lashup .mainTitSet .mainTtl {
  }
  .lashup .psBlk .pkgBlk .imgObj.bottle {
  }
  .lashup .psBlk .pkgBlk .imgObj.blush {
  }
}
/*fw*/
.fw .mainTitSet .mainImg {
  width: 13%;
  top: 2.5%;
  left: 28.2%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-20px 20px 3px rgba(0, 0, 0, 0.3));
}
.fw .mainTitSet .mainImg + .mainImg {
  top: 15%;
  left: 4%;
  width: 13%;
}
.fw .mainTitSet .mainTtl {
  /* padding: 25.8% 0 0 5%; */
  padding: 28% 0 0 5%;
}
.fw .psBlk .pkgBlk .imgObj.bottle {
  width: 96%;
  margin: 2.8% 0 0 36%;
}
.fw .psBlk .pkgBlk .imgObj.blush {
  width: 90%;
}

@media screen and (min-width: 641px) {
  .fw .mainTitSet .mainImg {
    top: 2%;
    left: 60.2%;
    filter: drop-shadow(-45px -35px 6px rgba(0, 0, 0, 0.3));
    width: 6.5%;
  }
  .fw .mainTitSet .mainImg + .mainImg {
    top: 19.2%;
    left: 47%;
    width: 6.7%;
  }
  .fw .mainTitSet .mainTtl {
    padding: 4.8% 0 0 5%;
    padding-top: min(2.5vw, 120px);
  }
  .fw .psBlk .pkgBlk .imgObj.bottle {
    width: 48%;
    margin: 1% 0 0 57%;
    filter: drop-shadow(-25px 20px 4px rgba(0, 0, 0, 0.3));
  }
  .fw .psBlk .pkgBlk .imgObj.blush {
    width: 44.2%;
    margin: 0 0 0 43.2%;
    filter: drop-shadow(-25px 20px 4px rgba(0, 0, 0, 0.3));
  }
}
@media screen and (min-width: 1024px) {
  .fw .mainTitSet .mainImg {
    top: 0%;
    left: 59.8%;
    width: min(6.6%, 85px);
  }
  .fw .mainTitSet .mainImg + .mainImg {
    top: 21%;
    left: 47.4%;
    width: min(6.65%, 89px);
  }
  .fw .mainTitSet .mainTtl {
  }
  .fw .psBlk .pkgBlk .imgObj.bottle {
  }
  .fw .psBlk .pkgBlk .imgObj.blush {
  }
}
/*keep*/
.keep .mainTitSet .mainImg {
  width: 14.3%;
  top: 0;
  left: 32%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-25px 25px 3px rgba(0, 0, 0, 0.3));
}
.keep .mainTitSet .mainImg + .mainImg {
  top: 12%;
  left: 2%;
  width: 14.5%;
}
.keep .mainTitSet .mainTtl {
  padding: 30% 0 0 5%;
}
.keep .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 36%;
  width: 98%;
}
.keep .psBlk .pkgBlk .imgObj.blush {
  width: 93%;
}
@media screen and (min-width: 641px) {
  .keep .mainTitSet .mainImg {
    top: 0%;
    left: 61.5%;
    filter: drop-shadow(-45px -35px 6px rgba(0, 0, 0, 0.3));
    width: min(7.32%, 90px);
  }
  .keep .mainTitSet .mainImg + .mainImg {
    top: 19%;
    left: 45.5%;
    width: min(7.5%, 90px);
  }
  .keep .mainTitSet .mainTtl {
    padding: 4.8% 0 0 5%;
    padding-top: min(2.5vw, 120px);
  }
  .keep .psBlk .pkgBlk .imgObj.bottle {
    width: 49%;
    margin: 2% 0 0 55%;
  }
  .keep .psBlk .pkgBlk .imgObj.blush {
    width: 46%;
    margin: 0 0 0 41.5%;
  }
}
@media screen and (min-width: 1024px) {
  .keep .mainTitSet .mainImg {
    top: 0.8%;
    left: 61%;
    /* width: min(7.52%, 110px); */
  }
  .keep .mainTitSet .mainImg + .mainImg {
    top: 21.6%;
    left: 47.8%;
  }
  .keep .mainTitSet .mainTtl {
  }
  .keep .psBlk .pkgBlk .imgObj.bottle {
    width: min(50%, 700px);
  }
  .keep .psBlk .pkgBlk .imgObj.blush {
    width: min(46%, 660px);
  }
}
/*lash*/
.lash .mainTitSet .mainImg {
  width: 14.3%;
  top: 0;
  left: 31%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-30px 30px 3px rgba(0, 0, 0, 0.3));
}
.lash .mainTitSet .mainImg + .mainImg {
  top: 13.8%;
  left: 5.8%;
  width: 14.9%;
}
.lash .mainTitSet .mainTtl {
  padding: 28% 0 0 5%;
}
.lash .psBlk .pkgBlk .imgObj.bottle {
  width: 88%;
  margin: 3.8% 0 0 34%;
}
.lash .psBlk .pkgBlk .imgObj.blush {
  width: 85%;
}
@media screen and (min-width: 641px) {
  .lash .mainTitSet .mainImg {
    top: 2%;
    left: 62%;
    filter: drop-shadow(-45px -35px 6px rgba(0, 0, 0, 0.3));
    width: 7%;
  }
  .lash .mainTitSet .mainImg + .mainImg {
    top: 24%;
    left: 49.5%;
    width: 7.3%;
  }
  .lash .mainTitSet .mainTtl {
    padding: 5% 0 0 5%;
    padding-top: min(2.5vw, 120px);
  }
  .lash .psBlk .pkgBlk .imgObj.bottle {
    width: 43.5%;
    margin: 1.8% 0 0 60.4%;
  }
  .lash .psBlk .pkgBlk .imgObj.blush {
    width: 42%;
    margin: 0 0 0 47.2%;
  }
}
@media screen and (min-width: 1024px) {
  .lash .mainTitSet .mainImg {
    top: 0.8%;
    left: 61.5%;
    width: min(8%, 90px);
  }
  .lash .mainTitSet .mainImg + .mainImg {
    top: 32.6%;
    left: 53.8%;
    width: min(7%, 92px);
  }
  .lash .mainTitSet .mainTtl {
  }
  .lash .psBlk .pkgBlk .imgObj.bottle {
  }
  .lash .psBlk .pkgBlk .imgObj.blush {
  }
}
/*lasting04*/
.lasting04 .mainTitSet .mainImg {
  width: 8%;
  top: 2%;
  left: 42.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-23px 20px 3px rgba(0, 0, 0, 0.3));
}
.lasting04 .mainTitSet .mainImg + .mainImg {
  top: 5%;
  left: 10.4%;
  width: 8%;
}
.lasting04 .mainTitSet .mainTtl {
}
.lasting04 .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 28%;
  width: 118%;
}
.lasting04 .psBlk .pkgBlk .imgObj.blush {
  width: 118%;
  margin: 0 0 0 7.8%;
}
@media screen and (min-width: 641px) {
  .lasting04 .mainTitSet .mainImg {
    top: 4%;
    left: 58.8%;
    filter: drop-shadow(-25px -25px 3px rgba(0, 0, 0, 0.3));
    width: 4.3%;
  }
  .lasting04 .mainTitSet .mainImg + .mainImg {
    top: 9%;
    left: 41.6%;
    width: 4.35%;
  }
  .lasting04 .mainTitSet .mainTtl {
    padding-top: min(2.8vw, 44px);
  }
  .lasting04 .psBlk .pkgBlk .imgObj.bottle {
    width: min(59.4%, 740px);
    margin: 1.5% 0 0 45.2%;
  }
  .lasting04 .psBlk .pkgBlk .imgObj.blush {
    width: min(56%, 710px);
    margin: 0 0 0 35.6%;
  }
}
@media screen and (min-width: 1024px) {
  .lasting04 .mainTitSet .mainImg {
    width: min(4.3%, 60px);
    filter: drop-shadow(-35px -25px 3px rgba(0, 0, 0, 0.3));
  }
  .lasting04 .mainTitSet .mainImg + .mainImg {
    width: min(4.35%, 58px);
  }
  .lasting04 .mainTitSet .mainTtl {
  }
  .lasting04 .psBlk .pkgBlk .imgObj.bottle {
  }
  .lasting04 .psBlk .pkgBlk .imgObj.blush {
  }
}
/*lasting01*/
.lasting01 .mainTitSet .mainImg {
  width: 8%;
  top: 2%;
  left: 42.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-23px 20px 3px rgba(0, 0, 0, 0.3));
}
.lasting01 .mainTitSet .mainImg + .mainImg {
  top: 5%;
  left: 10.4%;
  width: 8%;
}
.lasting01 .mainTitSet .mainTtl {
}
.lasting01 .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 28%;
  width: 118%;
}
.lasting01 .psBlk .pkgBlk .imgObj.blush {
  width: 118%;
  margin: 0 0 0 7.8%;
}
@media screen and (min-width: 641px) {
  .lasting01 .mainTitSet .mainImg {
    top: 4%;
    left: 58.8%;
    filter: drop-shadow(-25px -25px 3px rgba(0, 0, 0, 0.3));
    width: 4.3%;
  }
  .lasting01 .mainTitSet .mainImg + .mainImg {
    top: 9%;
    left: 41.6%;
    width: 4.35%;
  }
  .lasting01 .mainTitSet .mainTtl {
    padding-top: min(2.8vw, 44px);
  }
  .lasting01 .psBlk .pkgBlk .imgObj.bottle {
    width: min(59.4%, 740px);
    margin: 1.5% 0 0 45.2%;
  }
  .lasting01 .psBlk .pkgBlk .imgObj.blush {
    width: min(56%, 710px);
    margin: 0 0 0 35.6%;
  }
}
@media screen and (min-width: 1024px) {
  .lasting01 .mainTitSet .mainImg {
    width: min(4.3%, 60px);
    filter: drop-shadow(-35px -25px 3px rgba(0, 0, 0, 0.3));
  }
  .lasting01 .mainTitSet .mainImg + .mainImg {
    width: min(4.35%, 58px);
  }
  .lasting01 .mainTitSet .mainTtl {
  }
  .lasting01 .psBlk .pkgBlk .imgObj.bottle {
  }
  .lasting01 .psBlk .pkgBlk .imgObj.blush {
  }
}
/*short*/
.short .mainTitSet .mainImg {
  width: 8%;
  top: 2%;
  left: 42.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-23px 20px 3px rgba(0, 0, 0, 0.3));
}
.short .mainTitSet .mainImg + .mainImg {
  top: 5%;
  left: 10.4%;
  width: 8%;
}
.short .mainTitSet .mainTtl {
}
.short .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 28%;
  width: 118%;
}
.short .psBlk .pkgBlk .imgObj.blush {
  width: 118%;
  margin: 0 0 0 7.8%;
}
@media screen and (min-width: 641px) {
  .short .mainTitSet .mainImg {
    top: 4%;
    left: 58.8%;
    filter: drop-shadow(-25px -25px 3px rgba(0, 0, 0, 0.3));
    width: 4.3%;
  }
  .short .mainTitSet .mainImg + .mainImg {
    top: 9%;
    left: 41.6%;
    width: 4.35%;
  }
  .short .mainTitSet .mainTtl {
    padding-top: min(2.8vw, 44px);
  }
  .short .psBlk .pkgBlk .imgObj.bottle {
    width: min(59.4%, 740px);
    margin: 1.5% 0 0 45.2%;
  }
  .short .psBlk .pkgBlk .imgObj.blush {
    width: min(56%, 710px);
    margin: 0 0 0 35.6%;
  }
}
@media screen and (min-width: 1024px) {
  .short .mainTitSet .mainImg {
    width: min(4.3%, 60px);
    filter: drop-shadow(-35px -25px 3px rgba(0, 0, 0, 0.3));
  }
  .short .mainTitSet .mainImg + .mainImg {
    width: min(4.35%, 58px);
  }
  .short .mainTitSet .mainTtl {
  }
  .short .psBlk .pkgBlk .imgObj.bottle {
  }
  .short .psBlk .pkgBlk .imgObj.blush {
  }
}
/*gcp*/
.gcp .mainTitSet .mainImg {
  width: 8%;
  top: 2%;
  left: 42.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-23px 20px 3px rgba(0, 0, 0, 0.3));
}
.gcp .mainTitSet .mainImg + .mainImg {
  top: 5%;
  left: 10.4%;
  width: 8%;
}
.gcp .mainTitSet .mainTtl {
}
.gcp .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 28%;
  width: 118%;
}
.gcp .psBlk .pkgBlk .imgObj.blush {
  width: 118%;
  margin: 0 0 0 7.8%;
}
@media screen and (min-width: 641px) {
  .gcp .mainTitSet .mainImg {
    top: 4%;
    left: 58.8%;
    filter: drop-shadow(-25px -25px 3px rgba(0, 0, 0, 0.3));
    width: 4.3%;
  }
  .gcp .mainTitSet .mainImg + .mainImg {
    top: 9%;
    left: 41.6%;
    width: 4.35%;
  }
  .gcp .mainTitSet .mainTtl {
    padding-top: min(2.8vw, 44px);
  }
  .gcp .psBlk .pkgBlk .imgObj.bottle {
    width: min(59.4%, 740px);
    margin: 1.5% 0 0 45.2%;
  }
  .gcp .psBlk .pkgBlk .imgObj.blush {
    width: min(56%, 710px);
    margin: 0 0 0 35.6%;
  }
}
@media screen and (min-width: 1024px) {
  .gcp .mainTitSet .mainImg {
    width: min(4.3%, 60px);
    filter: drop-shadow(-35px -25px 3px rgba(0, 0, 0, 0.3));
  }
  .gcp .mainTitSet .mainImg + .mainImg {
    width: min(4.35%, 58px);
  }
  .gcp .mainTitSet .mainTtl {
  }
  .gcp .psBlk .pkgBlk .imgObj.bottle {
  }
  .gcp .psBlk .pkgBlk .imgObj.blush {
  }
}
/*ebc*/
.ebc .mainTitSet .mainImg {
  width: 12.8%;
  top: 0;
  left: 33.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-20px 30px 2px rgba(0, 0, 0, 0.3));
}
.ebc .mainTitSet .mainImg + .mainImg {
  top: 9.5%;
  left: 6%;
  width: 13%;
}
.ebc .mainTitSet .mainTtl {
}
.ebc .psBlk .pkgBlk .imgObj.bottle {
  width: 88%;
  margin: 2.5% 0 0 33%;
}
.ebc .psBlk .pkgBlk .imgObj.blush {
  width: 83%;
}
@media screen and (min-width: 641px) {
  .ebc .mainTitSet .mainImg {
    top: 0%;
    left: 59.2%;
    filter: drop-shadow(-45px -35px 6px rgba(0, 0, 0, 0.3));
    width: 5.8%;
    opacity: 1;
  }
  .ebc .mainTitSet .mainImg + .mainImg {
    top: 18.2%;
    left: 46.8%;
    width: 5.85%;
  }
  .ebc .mainTitSet .mainTtl {
    padding-top: min(2.5vw, 120px);
  }
  .ebc .psBlk .pkgBlk .imgObj.bottle {
    width: 45.5%;
    margin: 1.5% 0 0 59.5%;
  }
  .ebc .psBlk .pkgBlk .imgObj.blush {
    width: 43.3%;
    margin: 0 0 0 47%;
  }
}
@media screen and (min-width: 1024px) {
  .ebc .mainTitSet .mainImg {
    /* top: 4.8%; */
    /* left: 60.5%; */
  }
  .ebc .mainTitSet .mainImg + .mainImg {
    /* top: 26.6%; */
    /* left: 47.8%; */
  }
  .ebc .mainTitSet .mainTtl {
  }
  .ebc .psBlk .pkgBlk .imgObj.bottle {
  }
  .ebc .psBlk .pkgBlk .imgObj.blush {
  }
}

/*stay*/
.stay .mainTitSet .mainImg {
  width: 8%;
  top: 5%;
  left: 46.5%;
  transform: rotate(-72deg);
  transform-origin: top right;
  filter: drop-shadow(-23px 20px 3px rgba(0, 0, 0, 0.3));
}
.stay .mainTitSet .mainImg + .mainImg {
  top: 9%;
  left: 14.8%;
  width: 8%;
}
.stay .mainTitSet .mainTtl {
}
.stay .psBlk .pkgBlk .imgObj.bottle {
  margin: 3.5% 0 0 33%;
  width: 118%;
}
.stay .psBlk .pkgBlk .imgObj.blush {
  width: 114%;
  margin: 0 0 0 7.8%;
}
@media screen and (min-width: 641px) {
  .stay .mainTitSet .mainImg {
    top: 7%;
    left: 58.8%;
    filter: drop-shadow(-25px -25px 3px rgba(0, 0, 0, 0.3));
    width: 4.3%;
  }
  .stay .mainTitSet .mainImg + .mainImg {
    top: 11%;
    left: 42%;
    width: 4.5%;
  }
  .stay .mainTitSet .mainTtl {
    padding-top: min(2.8vw, 44px);
  }
  .stay .psBlk .pkgBlk .imgObj.bottle {
    width: min(60.4%, 770px);
    margin: 2% 0 0 45.2%;
  }
  .stay .psBlk .pkgBlk .imgObj.blush {
    width: min(57%, 723px);
    margin: 0 0 0 32.6%;
  }
}
@media screen and (min-width: 1024px) {
  .stay .mainTitSet .mainImg {
    width: min(4.3%, 60px);
    filter: drop-shadow(-35px -25px 3px rgba(0, 0, 0, 0.3));
  }
  .stay .mainTitSet .mainImg + .mainImg {
    width: min(4.5%, 58px);
  }
  .stay .mainTitSet .mainTtl {
  }
  .stay .psBlk .pkgBlk .imgObj.bottle {
  }
  .stay .psBlk .pkgBlk .imgObj.blush {
  }
}

.setBnrBlk {
  width: min(90%, 580px);
  margin: 10% auto 5%;
}
.setBnrBlk.bnrBottom {
  margin: 0 auto 20%;
}
.setBnrBlk .bnrObj {
}
.setBnrBlk .bnrObj a {
}

@media screen and (min-width: 641px) {
  .setBnrBlk.bnrBottom {
  }
  .setBnrBlk .bnrObj {
  }
  .setBnrBlk .bnrObj a {
    transition: 0.5s ease;
  }
  .setBnrBlk .bnrObj a:hover {
    opacity: 0.7;
    transition: 0.5s ease;
  }
}