@charset "UTF-8";



/*all----------------------------*/

html {

  font-size: 62.5%;

}



body {

  -webkit-tap-highlight-color: transparent;

}



#Wrap {

  width: auto;

}



#Contents {

  width: auto;

  max-width: unset;

}



#footer {

  margin-top: 0;

}



footer {

  position: relative;

  z-index: 10;

}



.nav-top {

  display: none;

  z-index: 5;

}



:root {

  --font_regular: "yu-gothic-pr6n", sans-serif;

  --font_eng: "gopher", sans-serif;

  --color_regular: #000;

  --color_accent_01: #F14C4C;

  --color_accent_02: #1C6BB4;

  --color_accent_03: #E47F85;

  --color_accent_04: #D9463F;

  --color_pale_01: #F0BBBB;

  --color_pale_02: #C7D7E4;

  --color_pale_03: #F9D5CB;

  --color_ribbon_01: #F9D3C9;

  --color_ribbon_02: #F36363;

  --color_bg_01: #F9EFE7;

  --color_bg_02: #FAE7DE;

  --color_bg_03: #FAE9EB;

}



.LP_page * {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  line-height: 1;

  letter-spacing: .02em;

}



.LP_page {

  background: var(--color_bg_01);

  font-family: var(--font_regular);

  color: var(--color_regular);

  overflow-x: clip;

  opacity: 0;

  transition: opacity 1s;

}



.LP_page.active {

  opacity: 1;

}



.LP_page picture {

  display: block;

  font-size: 0;

}



.LP_page a {

  display: block;

  color: inherit;

}



.LP_page a:hover {

  opacity: 1 !important;

}



.LP_page img {

  width: 100%;

  height: auto;

  vertical-align: bottom;

}



.LP_page .activePoint,

.LP_page .activeDelay {

  opacity: 0;

  transition: opacity 1s;

}



.LP_page .activeDelay.delay1 {

  transition-delay: .15s;

}



.LP_page .activeDelay.delay2 {

  transition-delay: .3s;

}



.LP_page .activeDelay.delay3 {

  transition-delay: .45s;

}



.LP_page .activeDelay.delay4 {

  transition-delay: .6s;

}



.LP_page .activePoint.active,

.LP_page .activePoint.active > .activeDelay {

  opacity: 1;

}

/*----------------------------all*/



/*mv lead------------------------*/

.mv_area {

  position: relative;

  z-index: 2;

  padding-bottom: calc(190 * (100vw / 1140));

}



.mv_wrap {

  position: relative;

  margin-bottom: calc(140 * (100vw / 1140));

}



.main_ttl {

  position: absolute;

  top: 0;

  right: 0;

  width: calc(440 * (100vw / 1140));

  height: 100%;

}



.main_ttl span {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  display: block;

  width: calc(330 * (100vw / 1140));

}



.accordion_wrap {

  display: grid;

  grid-template-rows: 0fr;

  transition: grid-template-rows .6s;

}



.open > .accordion_wrap {

  grid-template-rows: 1fr;

}



.main_lead {

  font-size: calc(15 * (100vw / 1140));

  line-height: 2.625;

  text-align: center;

}



.accordion_inner {

  position: relative;

  padding-bottom: calc(50 * (100vw / 1140));

  min-height: calc(465 * (100vw / 1140));

  overflow: hidden;

}



.accordion_inner::before {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: calc(200 * (100vw / 1140));

  background: linear-gradient(transparent, var(--color_bg_01));

  content: "";

}



.open .accordion_inner::before {

  display: none;

}



.accordion_btn {

  position: relative;

  width: calc(100 * (100vw / 1140));

  margin: 0 auto;

  padding-bottom: calc(28 * (100vw / 1140));

  font-size: calc(15 * (100vw / 1140));

  text-align: center;

  cursor: pointer;

}



.accordion_btn::before {

  position: absolute;

  bottom: 0;

  left: 50%;

  translate: -50% 0;

  width: 100%;

  height: calc(40 * (100vw / 1140));

  background: url(../img/arrow_001.svg) center center / cover no-repeat;

  content: "";

}



.open .accordion_btn::before {

  display: none;

}



.accordion_btn .to_close {

  text-decoration: underline;

}



.accordion_btn .to_open,

.open .accordion_btn .to_close {

  display: block;

}



.accordion_btn .to_close,

.open .accordion_btn .to_open {

  display: none;

}



.txt_schedule {

  margin-top: calc(110 * (100vw / 1140));

  font-size: calc(15 * (100vw / 1140));

  text-align: center;

  color: var(--color_accent_01);

  text-stroke: calc(0.5 * (100vw / 1140)) var(--color_accent_01);

  -webkit-text-stroke: calc(0.5 * (100vw / 1140)) var(--color_accent_01);

}

/*------------------------mv lead*/



/*EyeDesigner--------------------*/

#EyeDesigner {

  background: var(--color_bg_02);

}



#EyeDesigner::before {

  position: absolute;

  z-index: -1;

  bottom: 100%;

  left: 0;

  width: 100%;

  height: calc(350 * (100vw / 1140));

  margin-bottom: calc(-4 * (100vw / 1140));

  background: url(../img/bg_001.svg) top center / cover no-repeat;

  content: "";

}



.decoration {

  pointer-events: none;

}

  

.ribbon_001 {

  position: absolute;

  bottom: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(1200 * (100vw / 1140));

  margin-bottom: calc(3 * (100vw / 1140));

}



.decoration svg {

  overflow: visible;

}



.decoration path {

  stroke-dasharray: 1700;

  stroke-dashoffset: 1700;

  stroke-width: calc(16 * (100vw / 1140));

  fill: none;

}



.decoration.active path {

  animation: ribbon-stroke 1.5s linear forwards;

}



@keyframes ribbon-stroke {

  0% {

    stroke-dashoffset: 1700;

  }

  100% {

    stroke-dashoffset: 0;

  }

}



.decoration path.color_pink {

  stroke: var(--color_ribbon_01);

}



.decoration path.color_red {

  stroke: var(--color_ribbon_02);

}



.each_collection {

  position: relative;

  z-index: 1;

}



#EyeDesigner {

  padding-top: calc(103 * (100vw / 1140));

}



.each_collection .sec_ttl {

  margin-bottom: calc(33 * (100vw / 1140));

  font-family: var(--font_eng);

  font-size: calc(29 * (100vw / 1140));

  font-weight: 400;

  letter-spacing: 0;

  text-align: center;

}



.each_collection .sec_lead {

  font-size: calc(15 * (100vw / 1140));

  line-height: 2.1875;

  text-align: center;

  text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

  -webkit-text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

}



#EX13 {

  padding: calc(217 * (100vw / 1140)) 0 calc(360 * (100vw / 1140)); 

}



.itm_wrap {

  position: relative;

  z-index: 1;

  display: flex;

  align-items: center;

  gap: calc(100 * (100vw / 1140));

  width: calc(940 * (100vw / 1140));

  margin: 0 auto;

}



.itm_img {

  width: calc(500 * (100vw / 1140));

}



.itm_wrap .txt_wrap {

  flex: 1;

}



.itm_name {

  margin-bottom: calc(16 * (100vw / 1140));

  font-family: var(--font_eng);

  font-size: calc(24 * (100vw / 1140));

  font-weight: 400;

  letter-spacing: 0;

}



#EX13 .itm_name {

  color: var(--color_accent_02);

}



#EX14 .itm_name {

  color: var(--color_accent_01);

}



.itm_price {

  margin-bottom: calc(65 * (100vw / 1140));

  font-size: calc(14 * (100vw / 1140));

}



.itm_link {

  width: fit-content;

  margin-bottom: calc(30 * (100vw / 1140));

}



.itm_link a {

  display: grid;

  place-items: center;

  width: calc(198 * (100vw / 1140));

  height: calc(37 * (100vw / 1140));

}



#EX13 .itm_link a {

  background: var(--color_pale_02);

}



#EX14 .itm_link a {

  background: var(--color_pale_01);

}



.itm_link a span {

  position: relative;

  padding-right: calc(25 * (100vw / 1140));

  font-family: var(--font_eng);

  font-size: calc(21 * (100vw / 1140));

  letter-spacing: 0;

}



#EX13 .itm_link a span {

  color: var(--color_accent_02);

}



#EX14 .itm_link a span {

  color: var(--color_accent_01);

}



.itm_link a span::before {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  margin-right: calc(-3 * (100vw / 1140));

  border-left: solid calc(14 * (100vw / 1140));

  border-top: solid transparent calc(8 * (100vw / 1140));

  border-bottom: solid transparent calc(8 * (100vw / 1140));

  content: "";

}



#EX13 .itm_link a span::before {

  border-left-color: var(--color_accent_02);

}



#EX14 .itm_link a span::before {

  border-left-color: var(--color_accent_01);

}



.itm_caption {

  font-size: calc(12 * (100vw / 1140));

  line-height: 2.4;

}



.collection_img_L_wrap {

  position: relative;

  width: calc(600 * (100vw / 1140));

  margin: calc(200 * (100vw / 1140)) auto calc(152 * (100vw / 1140));

}



.collection_img_L {

  position: relative;

  z-index: 1;

}



.img_wrap {

  position: relative;

  display: flex;

  gap: calc(18 * (100vw / 1140));

  width: fit-content;

  margin: 0 auto;

}



.ribbon_002 {

  position: absolute;

  bottom: 100%;

  left: 0;

  width: calc(826 * (100vw / 1140));

  margin: 0 0 calc(-170 * (100vw / 1140)) calc(200 * (100vw / 1140));

}



.img_wrap .collection_img {

  position: relative;

  z-index: 1;

  width: calc(435 * (100vw / 1140));

  height: fit-content;

}



.img_wrap .collection_img::before {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(600 * (100vw / 1140));

  content: "";

  pointer-events: none;

}



#EX13 .img_wrap .collection_img::before {

  height: calc(900 * (100vw / 1140));

}



#EX14 .img_wrap .collection_img::before {

  height: calc(1200 * (100vw / 1140));

}



#EX13 .img_wrap .collection_img.img01::before {

  background: url(../img/deco_101.svg) center center / cover no-repeat;

}



#EX13 .img_wrap .collection_img.img02::before {

  background: url(../img/deco_102.svg) center center / cover no-repeat;

}



#EX14 .img_wrap .collection_img.img01::before {

  background: url(../img/deco_201.svg) center center / cover no-repeat;

}



#EX14 .img_wrap .collection_img.img02::before {

  background: url(../img/deco_202.svg) center center / cover no-repeat;

}



.img_wrap .collection_img.img02 {

  width: calc(402 * (100vw / 1140));

  margin-top: calc(230 * (100vw / 1140));

}



#EX14 .img_wrap .collection_img.img01 {

  order: 2;

}



#EX14 {

  position: relative;

  z-index: 1;

  padding: calc(55 * (100vw / 1140)) 0 calc(130 * (100vw / 1140));

  background: var(--color_bg_03);

}



#EX14::before {

  position: absolute;

  z-index: -1;

  bottom: 100%;

  left: 0;

  width: 100%;

  height: calc(350 * (100vw / 1140));

  margin-bottom: calc(-4 * (100vw / 1140));

  background: url(../img/bg_002.svg) top center / cover no-repeat;

  content: "";

}



#EX14::after {

  position: absolute;

  z-index: -1;

  top: 100%;

  left: 0;

  width: 100%;

  height: calc(350 * (100vw / 1140));

  margin-top: calc(-150 * (100vw / 1140));

  background: url(../img/bg_003.svg) bottom center / cover no-repeat;

  content: "";

}



.ribbon_003 {

  position: absolute;

  bottom: 100%;

  left: 0;

  width: calc(1230 * (100vw / 1140));

  margin: 0 0 calc(45 * (100vw / 1140)) calc(-60 * (100vw / 1140));

}



.ribbon_004 {

  position: absolute;

  top: 0;

  left: 100%;

  width: calc(540 * (100vw / 1140));

  margin: calc(320 * (100vw / 1140)) 0 0 calc(-70 * (100vw / 1140));

}



.ribbon_005 {

  position: absolute;

  top: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(1234 * (100vw / 1140));

  margin-top: calc(5 * (100vw / 1140));

}

/*--------------------EyeDesigner*/



/*RougeSnidel--------------------*/

#RougeSnidel {

  z-index: 2;

  padding: calc(225 * (100vw / 1140)) 0  calc(300 * (100vw / 1140));

}



#RougeSnidel .sec_ttl {

  margin-bottom: calc(13 * (100vw / 1140));

}



#RougeSnidel .itm_price {

  margin-bottom: calc(95 * (100vw / 1140));

  text-align: center;

}



#RougeSnidel .itm_wrap {

  margin-bottom: calc(180 * (100vw / 1140));

}



#RougeSnidel .itm_link a {

  background: var(--color_pale_03);

}



#RougeSnidel .itm_link a span {

  color: var(--color_accent_03);

}



.rouge_wrap {

  position: relative;

  display: flex;

}



.each_rouge {

  position: relative;

  width: 50%;

}



.rouge_img {

  margin-bottom: calc(165 * (100vw / 1140));

}



.rouge_blue .variation_wrap {

  margin-left: calc(145 * (100vw / 1140));

}



.rouge_red .variation_wrap {

  margin-left: calc(75 * (100vw / 1140));

}



.variation_list {

  display: flex;

  gap: calc(140 * (100vw / 1140));

  margin-bottom: calc(33 * (100vw / 1140));

}



.variation_list li {

  width: calc(70 * (100vw / 1140));

}



.variation_img {

  position: relative;

  z-index: 1;

  margin-bottom: calc(18 * (100vw / 1140));

}



.variation_img::before {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 100%;

  width: calc(100 * (100vw / 1140));

  height: calc(80 * (100vw / 1140));

  margin: calc(-10 * (100vw / 1140)) 0 0 calc(-10 * (100vw / 1140));

  content: "";

}



.rouge_blue .variation_list li:nth-of-type(1) .variation_img::before {

  background: url(../img/texture_001.png) center center / cover no-repeat;

}



.rouge_blue .variation_list li:nth-of-type(2) .variation_img::before {

  background: url(../img/texture_002.png) center center / cover no-repeat;

}



.rouge_red .variation_list li:nth-of-type(1) .variation_img::before {

  background: url(../img/texture_003.png) center center / cover no-repeat;

}



.rouge_red .variation_list li:nth-of-type(2) .variation_img::before {

  background: url(../img/texture_004.png) center center / cover no-repeat;

}



.variation_name {

  font-family: var(--font_eng);

  font-size: calc(21 * (100vw / 1140));

  letter-spacing: 0;

  text-align: center;

}



.rouge_blue .variation_name {

  color: var(--color_accent_02);

}



.rouge_red .variation_name {

  color: var(--color_accent_04);

}



.rouge_caption {

  font-size: calc(12 * (100vw / 1140));

  line-height: 2.6;

}



.ribbon_006 {

  position: absolute;

  top: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(1220 * (100vw / 1140));

  margin-top: calc(-200 * (100vw / 1140));

}

/*--------------------RougeSnidel*/



/*Gift---------------------------*/

#Gift {

  padding: calc(170 * (100vw / 1140)) 0 calc(300 * (100vw / 1140));

  background: linear-gradient(var(--color_bg_01), #F8E2E5);

  text-align: center;

}



#Gift .sec_ttl {

  position: relative;

  z-index: 1;

  margin-bottom: calc(40 * (100vw / 1140));

}



#Gift .sec_ttl::before {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(120 * (100vw / 1140));

  height: calc(92 * (100vw / 1140));

  background: url(../img/deco_401.svg) center center / cover no-repeat;

  content: "";

}



#Gift .itm_name {

  margin-bottom: calc(12 * (100vw / 1140));

  font-family: var(--color_regular);

  font-size: calc(15 * (100vw / 1140));

  text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

  -webkit-text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

}



#Gift .itm_price {

  margin-bottom: calc(55 * (100vw / 1140));

}



#Gift .itm_img {

  margin: 0 auto calc(55 * (100vw / 1140));

}



#Gift .itm_caption {

  margin-bottom: calc(18 * (100vw / 1140));

  font-size: calc(15 * (100vw / 1140));

  line-height: 2.2;

  text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

  -webkit-text-stroke: calc(0.25 * (100vw / 1140)) var(--color_regular);

}



#Gift .notes {

  font-size: calc(12 * (100vw / 1140));

  line-height: 2.3;

  color: #3C3C3C;

}



.btn_wrapup {

  position: relative;

  z-index: 1;

  width: fit-content;

  margin: calc(145 * (100vw / 1140)) auto 0;

}



.btn_wrapup a {

  display: grid;

  place-items: center;

  width: calc(303 * (100vw / 1140));

  height: calc(40 * (100vw / 1140));

  background: var(--color_pale_03);

  font-family: var(--font_eng);

  font-size: calc(29 * (100vw / 1140));

  letter-spacing: 0;

  color: var(--color_accent_03);



}

/*---------------------------Gift*/



/*navigation---------------------*/

.navigation_area {

  position: fixed;

  z-index: 5;

  bottom: 0;

  width: 100%;

  background: #fff;

  opacity: 0;

  translate: 0 100%;

  transition: opacity .5s, translate .3s;

}



.navigation_area.active {

  opacity: 1;

  translate: 0 0;

}



.navigation_list {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

}



.navigation_list li {

  position: relative;

}



.navigation_list li:nth-of-type(n+2)::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: .1rem;

  height: 4rem;

  background: #3C3C3C;

  content: "";

}



.navigation_list li a {

  display: grid;

  place-items: center;

  height: 10rem;

  font-family: var(--font_eng);

  font-size: 2.3rem;

  letter-spacing: 0;

  color: #3C3C3C;

}

/*---------------------navigation*/





/*Smart phone---------------------------------------------*/

@media screen and  (max-width:768px) {

/*all----------------------------*/

.LP_page .only_pc {

  display: none;

}



#share {

  right: auto !important;

  left: 5%;

  z-index: 5 !important;

  transition: translate .3s;

}



#share.move {

  translate: 0 calc(-50 * (100vw / 750));

}



.share-txt {

  display: none !important;

}



/*----------------------------all*/



/*mv lead------------------------*/

.mv_area {

  padding-bottom: calc(150 * (100vw / 750));

}



.mv_wrap {

  margin-bottom: calc(120 * (100vw / 750));

}



.main_ttl {

  right: auto;

  left: 50%;

  translate: -50% 0;

  width: fit-content;

  height: auto;

  margin-top: calc(90 * (100vw / 750));

}



.main_ttl span {

  position: static;

  translate: 0 0;

  width: calc(500 * (100vw / 750));

}



.main_lead {

  font-size: calc(22 * (100vw / 750));

  line-height: 2.727;

}



.accordion_inner {

  padding-bottom: calc(50 * (100vw / 750));

  min-height: calc(625 * (100vw / 750));

}



.accordion_inner::before {

  height: calc(200 * (100vw / 750));

}



.accordion_btn {

  width: calc(110 * (100vw / 750));

  padding-bottom: calc(30 * (100vw / 750));

  font-size: calc(20 * (100vw / 750));

}



.accordion_btn::before {

  height: calc(44 * (100vw / 750));

}



.txt_schedule {

  margin-top: calc(140 * (100vw / 750));

  font-size: calc(22 * (100vw / 750));

  line-height: 1.5;

  text-stroke: calc(0.5 * (100vw / 750)) var(--color_accent_01);

  -webkit-text-stroke: calc(0.5 * (100vw / 750)) var(--color_accent_01);

}

/*------------------------mv lead*/



/*EyeDesigner--------------------*/

#EyeDesigner::before {

  height: calc(350 * (100vw / 750));

  margin-bottom: calc(-220 * (100vw / 750));

  background: url(../img/bg_001_sp.svg) top center / cover no-repeat;

}

  

.ribbon_001 {

  width: calc(954 * (100vw / 750));

  margin-bottom: calc(-110 * (100vw / 750));

}



.decoration path {

  stroke-dasharray: 1800;

  stroke-dashoffset: 1800;

  stroke-width: calc(30 * (100vw / 750));

}



@keyframes ribbon-stroke {

  0% {

    stroke-dashoffset: 1500;

  }

  100% {

    stroke-dashoffset: 0;

  }

}



#EyeDesigner {

  padding-top: calc(120 * (100vw / 750));

}



.each_collection .sec_ttl {

  margin-bottom: calc(50 * (100vw / 750));

  font-size: calc(32 * (100vw / 750));

}



.each_collection .sec_lead {

  font-size: calc(22 * (100vw / 750));

  line-height: 2.1;

  text-stroke: calc(0.25 * (100vw / 750)) var(--color_regular);

  -webkit-text-stroke: calc(0.25 * (100vw / 750)) var(--color_regular);

}



#EX13 {

  padding: calc(155 * (100vw / 750)) 0 calc(460 * (100vw / 750)); 

}



.itm_wrap {

  display: block;

  width: auto;

}



.itm_img {

  width: calc(560 * (100vw / 750));

  margin: 0 auto calc(90 * (100vw / 750));

}



.itm_wrap .txt_wrap {

  text-align: center;

}



.itm_name {

  margin-bottom: calc(16 * (100vw / 750));

  font-size: calc(32 * (100vw / 750));

}



.itm_price {

  margin-bottom: calc(55 * (100vw / 750));

  font-size: calc(20 * (100vw / 750));

}



.itm_link {

  margin: 0 auto calc(60 * (100vw / 750));

}



.itm_link a {

  width: calc(220 * (100vw / 750));

  height: calc(40 * (100vw / 750));

}



.itm_link a span {

  padding-right: calc(25 * (100vw / 750));

  font-size: calc(25 * (100vw / 750));

}



.itm_link a span::before {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  margin-right: calc(-3 * (100vw / 750));

  border-left: solid calc(16 * (100vw / 750));

  border-top: solid transparent calc(8 * (100vw / 750));

  border-bottom: solid transparent calc(8 * (100vw / 750));

  content: "";

}



.itm_caption {

  font-size: calc(20 * (100vw / 750));

  line-height: 1.9;

}



.collection_img_L_wrap {

  width: auto;

  margin: calc(150 * (100vw / 750)) auto calc(120 * (100vw / 750));

}



#EX14 .collection_img_L_wrap {

  margin-bottom: calc(240 * (100vw / 750));

}



.img_wrap {

  display: block;

  width: calc(600 * (100vw / 750));

}



#EX14 .img_wrap .collection_img.img02 {

  margin-top: calc(90 * (100vw / 750));

}



.ribbon_002 {

  position: absolute;

  bottom: 0;

  left: 0;

  width: calc(826 * (100vw / 750));

  margin: 0 0 calc(580 * (100vw / 750)) calc(70 * (100vw / 750));

}



.img_wrap .collection_img {

  width: auto;

}



.img_wrap .collection_img::before {

  width: calc(750 * (100vw / 750));

}



#EX13 .img_wrap .collection_img::before {

  height: calc(1110 * (100vw / 750));

}



#EX14 .img_wrap .collection_img::before {

  height: calc(1110 * (100vw / 750));

}



#EX13 .img_wrap .collection_img.img01::before {

  background: url(../img/deco_101_sp.svg) center center / cover no-repeat;

}



#EX13 .img_wrap .collection_img.img02::before {

  background: url(../img/deco_102_sp.svg) center center / cover no-repeat;

}



#EX14 .img_wrap .collection_img.img01::before {

  background: url(../img/deco_201_sp.svg) center center / cover no-repeat;

}



#EX14 .img_wrap .collection_img.img02::before {

  background: url(../img/deco_202_sp.svg) center center / cover no-repeat;

}



.img_wrap .collection_img.img02 {

  width: auto;

  margin-top: calc(42 * (100vw / 750));

}



#EX14 {

  position: relative;

  z-index: 1;

  padding: calc(65 * (100vw / 750)) 0 calc(30 * (100vw / 750));

  background: var(--color_bg_03);

}



#EX14::before {

  height: calc(350 * (100vw / 750));

  margin-bottom: calc(-100 * (100vw / 750));

  background: url(../img/bg_002_sp.svg) top center / cover no-repeat;

}



#EX14::after {

  margin-top: calc(-30 * (100vw / 750));

  background: url(../img/bg_003_sp.svg) bottom center / cover no-repeat;

}



.ribbon_003 {

  left: 50%;

  translate: -50% 0;

  width: calc(1015 * (100vw / 750));

  margin: 0 0 calc(-200 * (100vw / 1140)) 0;

}



.ribbon_004 {

  top: 100%;

  left: auto;

  right: 100%;

  width: calc(920 * (100vw / 750));

  margin: calc(-30 * (100vw / 750)) calc(-210 * (100vw / 750)) 0 0;

}



.ribbon_005 {

  left: auto;

  right: 0;

  translate: 0 0;

  width: calc(1230 * (100vw / 750));

  margin: calc(-5 * (100vw / 750)) calc(-5 * (100vw / 750)) 0 0;

}

/*--------------------EyeDesigner*/



/*RougeSnidel--------------------*/

#RougeSnidel {

  z-index: 2;

  padding: calc(325 * (100vw / 750)) 0  calc(100 * (100vw / 750));

}



#RougeSnidel .sec_ttl {

  margin-bottom: calc(13 * (100vw / 750));

}



#RougeSnidel .itm_price {

  margin-bottom: calc(95 * (100vw / 750));

  text-align: center;

}



#RougeSnidel .itm_wrap {

  margin-bottom: calc(120 * (100vw / 750));

}



#RougeSnidel .itm_img {

  margin-bottom: calc(60 * (100vw / 750));

}



#RougeSnidel .itm_link a {

  background: var(--color_pale_03);

}



#RougeSnidel .itm_link a span {

  color: var(--color_accent_03);

}



#RougeSnidel .itm_caption {

  font-size: calc(22 * (100vw / 750));

}



.rouge_wrap {

  display: block;

}



.each_rouge {

  width: 100%;

}



.rouge_blue {

  margin-bottom: calc(125 * (100vw / 750));

}



.rouge_img {

  margin-bottom: calc(90 * (100vw / 750));

}



.rouge_blue .variation_wrap {

  margin-left: 0;

}



.rouge_red .variation_wrap {

  margin-left: 0;

}



.variation_list {

  justify-content: center;

  gap: calc(190 * (100vw / 750));

  margin-bottom: calc(80 * (100vw / 750));

}



.variation_list li {

  width: calc(95 * (100vw / 750));

  padding: 0 !important;

}



.variation_img {

  position: relative;

  z-index: 1;

  margin-bottom: calc(35 * (100vw / 750));

}



.variation_list li img {

  border: none !important;

}



.variation_img::before {

  left: 50%;

  translate: -50% 0;

  width: calc(240 * (100vw / 750));

  height: calc(192 * (100vw / 750));

  margin: calc(30 * (100vw / 750)) 0 0 0;

}



.variation_name {

  font-size: calc(32 * (100vw / 750));

}



.rouge_caption {

  font-size: calc(20 * (100vw / 750));

  text-align: center;

}



.ribbon_007 {

  position: absolute;

  bottom: 0;

  left: 50%;

  translate: -50% 0;

  width: calc(816 * (100vw / 750));

  margin-bottom: calc(-120 * (100vw / 750));

}



.ribbon_006 {

  top: auto;

  bottom: 0;

  left: 0;

  translate: 0 0;

  width: calc(1040 * (100vw / 750));

  margin: 0 0 calc(-150 * (100vw / 750)) calc(-20 * (100vw / 750));

}

/*--------------------RougeSnidel*/



/*Gift---------------------------*/

#Gift {

  padding: calc(230 * (100vw / 750)) 0 calc(170 * (100vw / 750));

}



.ribbon_008 {

  position: absolute;

  bottom: 0;

  left: 0;

  width: calc(1052 * (100vw / 750));

  margin: 0 0 calc(-90 * (100vw / 750)) calc(-90 * (100vw / 750));

}



#Gift .sec_ttl {

  margin-bottom: calc(70 * (100vw / 750));

}



#Gift .sec_ttl::before {

  width: calc(160 * (100vw / 750));

  height: calc(122 * (100vw / 750));

}



#Gift .itm_name {

  margin-bottom: calc(30 * (100vw / 750));

  font-size: calc(22 * (100vw / 750));

  text-stroke: calc(0.25 * (100vw / 750)) var(--color_regular);

  -webkit-text-stroke: calc(0.25 * (100vw / 750)) var(--color_regular);

}



#Gift .itm_price {

  margin-bottom: calc(35 * (100vw / 750));

  font-size: calc(22 * (100vw / 750));

}



#Gift .itm_img {

  width: 100%;

  margin: 0 auto calc(45 * (100vw / 750));

}



#Gift .itm_caption {

  margin-bottom: calc(30 * (100vw / 750));

  font-size: calc(19 * (100vw / 750));

  line-height: 2;

  text-stroke: unset;

  -webkit-text-stroke: unset;

}



#Gift .notes {

  font-size: calc(16 * (100vw / 750));

  line-height: 2;

}



.btn_wrapup {

  margin: calc(165 * (100vw / 750)) auto 0;

}



.btn_wrapup a {

  width: calc(303 * (100vw / 750));

  height: calc(40 * (100vw / 750));

  font-size: calc(32 * (100vw / 750));

}

/*---------------------------Gift*/



/*navigation---------------------*/

.navigation_list li:nth-of-type(n+2)::before {

  width: calc(1 * (100vw / 750));

  height: calc(40 * (100vw / 750));

}



.navigation_list li a {

  height: calc(100 * (100vw / 750));

  font-size: calc(25 * (100vw / 750));

}

/*---------------------navigation*/





}



/*---------------------------------------------Smart phone*/



/*PC------------------------------------------------------*/

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

  .only_sp {

    display: none;

  }



  #header_bottom .inner {

    width: 100%;

  }

}

/*------------------------------------------------------PC*/



/*レスポンシブ＆タブレット対応-------------------------------

@media screen and (max-width: 1400px){

  html {

    font-size: calc(10 * (100vw / 1400));

  }

}

-------------------------------レスポンシブ＆タブレット対応*/