@charset "UTF-8";
/* Scss Document */
#contents .title01.top {
  z-index: 998;
  position: relative; }

#main02 {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  overflow: hidden;
  /*=== common for #main02 ===*/
  /*=== sec_kv ===*/
  /*=== sec_gift ===*/
  /*=== sec_anc ===*/
  /*=== sec_check ===*/
  /*=== sec_other ===*/
  /*=== sec_previousItems ===*/
  /*=== sec_notice ===*/
  /* itemList */
  /* item */
  /* itemSingle */ }
  #main02 .inner {
    padding-left: calc(100vw / ( 750 / 40 ));
    padding-right: calc(100vw / ( 750 / 40 )); }
  #main02 img {
    width: 100%;
    height: auto; }
  #main02 p {
    margin: 0; }
  #main02 #sec_kv {
    position: relative; }
    #main02 #sec_kv .p-nav {
      position: absolute;
      right: 0;
      top: 0;
      z-index: 302; }
      #main02 #sec_kv .p-nav.m_fixed {
        position: fixed; }
        #main02 #sec_kv .p-nav.m_fixed .burger--wrap {
          top: calc(100vw / ( 750 / 40 )); }
      #main02 #sec_kv .p-nav .burger--wrap {
        height: 10.66667vw;
        width: 10.66667vw;
        position: absolute;
        top: calc(100vw / ( 750 / 790 ));
        right: calc(100vw / ( 750 / 40 ));
        border: 1px solid #000;
        border-radius: 50%; }
        #main02 #sec_kv .p-nav .burger--wrap-active {
          top: calc(100vw / ( 750 / 40 )); }
        #main02 #sec_kv .p-nav .burger--wrap .burger {
          width: 60%;
          height: 20%;
          position: absolute;
          display: flex;
          align-items: center;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          z-index: 301;
          cursor: pointer; }
          #main02 #sec_kv .p-nav .burger--wrap .burger:before {
            content: "";
            position: absolute;
            width: 100%;
            height: 1px;
            top: 0;
            right: 0;
            background: #000;
            transition: 0.6s; }
          #main02 #sec_kv .p-nav .burger--wrap .burger-active:before {
            transform: rotate(135deg);
            top: 0;
            bottom: 0;
            margin: auto;
            background-color: #fff; }
          #main02 #sec_kv .p-nav .burger--wrap .burger:after {
            content: "";
            position: absolute;
            width: 100%;
            height: 1px;
            bottom: 0;
            right: 0;
            background: #000;
            transition: 0.6s; }
          #main02 #sec_kv .p-nav .burger--wrap .burger-active:after {
            transform: rotate(-135deg);
            top: 0;
            bottom: 0;
            margin: auto;
            background-color: #fff; }
      #main02 #sec_kv .p-nav .navigation {
        top: 0;
        z-index: 300;
        width: 100vw;
        height: 100vh;
        position: absolute;
        right: -100vw;
        transition: 0.6s;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        background-color: #000; }
        #main02 #sec_kv .p-nav .navigation.nav-active {
          right: 0; }
        #main02 #sec_kv .p-nav .navigation--content {
          padding: 20vw 10vw; }
          #main02 #sec_kv .p-nav .navigation--content ul {
            /*position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);*/ }
            #main02 #sec_kv .p-nav .navigation--content ul li {
              line-height: 1.7;
              margin-bottom: 2em; }
              #main02 #sec_kv .p-nav .navigation--content ul li:last-child {
                margin-bottom: 0; }
              #main02 #sec_kv .p-nav .navigation--content ul li a {
                display: block;
                color: #fff;
                font-size: calc(100vw / ( 750 / 34 ));
                padding-right: 5em;
                white-space: nowrap;
                background: url(../img/arw_wh.svg) right center no-repeat;
                background-size: calc(100vw / ( 750 / 55 )) auto; }
  #main02 #sec_gift {
    padding: calc(100vw / ( 750 / 57 )) calc(100vw / ( 750 / 80 )) calc(100vw / ( 750 / 100 ));
    font-size: calc(100vw / ( 750 / 26 ));
    overflow: hidden; }
    #main02 #sec_gift .inner {
      padding-left: 0;
      padding-right: 0;
      border: 1px solid #000;
      border-top: none;
      border-bottom: none;
      text-align: center;
      position: relative;
      box-sizing: border-box;
      margin-bottom: calc(100vw / ( 750 / 75 )); }
      #main02 #sec_gift .inner:before {
        content: "";
        display: block;
        background-color: #fff;
        height: 15vw;
        width: 5px;
        position: absolute;
        right: -2px;
        bottom: 0; }
      #main02 #sec_gift .inner:after {
        content: "";
        display: block;
        background-color: #fff;
        height: 15vw;
        width: 5px;
        position: absolute;
        left: -2px;
        bottom: 0; }
    #main02 #sec_gift .catch {
      margin: 0 calc(-100vw / ( 750 / 80 )) calc(100vw / ( 750 / 120 )); }
    #main02 #sec_gift .ttl {
      display: block;
      position: relative;
      transform: translateY(-50%);
      margin-bottom: calc(100vw / ( 750 / 10 )); }
      #main02 #sec_gift .ttl span:before, #main02 #sec_gift .ttl span:after {
        content: "";
        display: block;
        width: 15vw;
        height: 1px;
        background-color: #000;
        position: absolute;
        top: 50%;
        transform: translateY(-50%); }
      #main02 #sec_gift .ttl span:before {
        left: 0; }
      #main02 #sec_gift .ttl span:after {
        right: 0; }
      #main02 #sec_gift .ttl span img {
        display: block;
        width: calc(100vw / ( 750 / 312 ));
        margin: auto; }
    #main02 #sec_gift .ttl_present {
      display: block;
      width: calc(100vw / ( 750 / 177 ));
      margin: 0 auto calc(100vw / ( 750 / 30 )); }
    #main02 #sec_gift .lead {
      z-index: 3;
      position: relative;
			padding: 0 5vw;
 			}
    #main02 #sec_gift .gifts {
      margin-top: -5vw; }
      #main02 #sec_gift .gifts .gift .obj {
        margin: 0 calc(-100vw / ( 750 / 80 )); }
      #main02 #sec_gift .gifts .gift .info {
        display: block;
        width: calc(100vw / ( 750 / 320 ));
        text-align: left;
        margin-bottom: calc(100vw / ( 750 / 130 )); }
        #main02 #sec_gift .gifts .gift .info dt {
          margin-bottom: 0.7em; }
        #main02 #sec_gift .gifts .gift .info .price {
          display: block;
          background-color: #000;
          color: #fff;
          padding: 1px 0.5em;
          font-size: calc(100vw / ( 750 / 32 )); }
          #main02 #sec_gift .gifts .gift .info .price .tax {
            font-size: calc(100vw / ( 750 / 20 )); }
      #main02 #sec_gift .gifts .gift:nth-child(1) {
        z-index: 2;
        position: relative; }
        #main02 #sec_gift .gifts .gift:nth-child(1) .info {
          margin-left: calc(100vw / ( 750 / 350 )); }
      #main02 #sec_gift .gifts .gift:nth-child(2) {
        margin-top: -43vw;
        z-index: 1; }
        #main02 #sec_gift .gifts .gift:nth-child(2) .info {
          margin-left: calc(-100vw / ( 750 / 80 ));
          margin-top: -38vw;
          text-align: right;
          z-index: 3;
          position: relative; }
    #main02 #sec_gift .novelty {
      position: relative;
      z-index: 1; }
      #main02 #sec_gift .novelty img {
        display: block;
        width: calc(100vw / ( 750 / 300 ));
				padding: 0 0 0 5vw;
        margin: 0 auto; }
      #main02 #sec_gift .novelty:after {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #000;
        position: absolute;
        left: 0;
        bottom: 15vw;
        z-index: -1; }
    #main02 #sec_gift .coupon {
      display: block;
      border: 1px solid #000; }
      #main02 #sec_gift .coupon img {
        vertical-align: bottom; }
    #main02 #sec_gift .note {
      font-size: calc(100vw / ( 750 / 20 ));
      padding-top: 1em; }
  #main02 #sec_anc {
    padding: 0 calc(100vw / ( 750 / 40 )) calc(100vw / ( 750 / 190 )); }
    #main02 #sec_anc .ttl {
      border-radius: 50%;
      background-color: #000;
      text-align: center;
      display: block;
      margin: 0 auto calc(100vw / ( 750 / 55 ));
      width: calc(100vw / ( 750 / 280 ));
      height: calc(100vw / ( 750 / 280 ));
      position: relative; }
      #main02 #sec_anc .ttl span {
        font-size: calc(100vw / ( 750 / 30 ));
        color: #fff;
        position: absolute;
        left: 50%;
        top: 52.5%;
        transform: translate(-50%, -50%);
        width: 100%;
        font-weight: normal; }
    #main02 #sec_anc .nacNav li {
      margin-bottom: calc(100vw / ( 750 / 80 ));
      position: relative; }
      #main02 #sec_anc .nacNav li a {
        display: block; }
        #main02 #sec_anc .nacNav li a span {
          display: inline-block;
          background-color: #000;
          color: #fff;
          padding: 0.5em 1em 0.5em 2em;
          min-width: calc(100vw / ( 750 / 570 ));
          position: absolute;
          bottom: 0;
          transform: translateY(50%);
          text-align: left;
          box-sizing: border-box;
          font-size: calc(100vw / ( 750 / 27 )); }
          #main02 #sec_anc .nacNav li a span:after {
            content: "";
            display: inline-block;
            vertical-align: middle;
            margin-left: 1.5em;
            width: calc(100vw / ( 750 / 55 ));
            height: calc(100vw / ( 750 / 10 ));
            background: url(../img/arw_wh.svg) center no-repeat;
            background-size: cover; }
      #main02 #sec_anc .nacNav li:nth-child(even) a span {
        right: calc(-100vw / ( 750 / 40 )); }
      #main02 #sec_anc .nacNav li:nth-child(odd) a span {
        left: calc(-100vw / ( 750 / 40 )); }
  #main02 #sec_check {
    background-color: rgba(0, 0, 0, 0.3);
    padding: calc(100vw / ( 750 / 40 )); }
    #main02 #sec_check .inner {
      background-color: #fff; }
    #main02 #sec_check .ttl {
      display: block;
      margin: 0 auto calc(100vw / ( 750 / 50 ));
      background-color: #000;
      color: #fff;
      border-radius: 50%;
      width: calc(100vw / ( 750 / 415 ));
      height: calc(100vw / ( 750 / 415 ));
      text-align: center;
      font-size: calc(100vw / ( 750 / 48 ));
      line-height: 1.2;
      position: relative; }
      #main02 #sec_check .ttlArea {
        margin: 0 calc(-100vw / ( 750 / 80 )) calc(100vw / ( 750 / 70 ));
        background: url(../img/sec_chech_bg.png) center 3vw no-repeat;
        background-size: 100% auto;
        padding-top: calc(100vw / ( 750 / 70 )); }
      #main02 #sec_check .ttl__inner {
        position: absolute;
        width: 100%;
        top: 50%;
        left: 0;
        transform: translateY(-50%); }
      #main02 #sec_check .ttl .catch {
        font-size: calc(100vw / ( 750 / 20 ));
        display: block;
        margin-bottom: 1em; }
    #main02 #sec_check .lead {
      text-align: center;
      font-size: calc(100vw / ( 750 / 27 ));
      line-height: 2;
      font-weight: bold; }
  #main02 #sec_other {
    background-color: #000;
    padding: calc(100vw / ( 750 / 100 )) 0; }
    #main02 #sec_other .bordersection {
      background-color: #fff; }
    #main02 #sec_other .bordersectionHead {
      cursor: pointer;
      padding: calc(100vw / ( 750 / 40 ));
      position: relative;
      text-align: center; }
      #main02 #sec_other .bordersectionHead .ttl {
        display: block;
        margin: 0 auto calc(100vw / ( 750 / 20 )); }
        #main02 #sec_other .bordersectionHead .ttl:after {
          content: "";
          display: block;
          background: url(../img/arrow_open.svg) center no-repeat;
          background-size: cover;
          width: calc(100vw / ( 750 / 24 ));
          height: calc(100vw / ( 750 / 15 ));
          transition: all .25s ease;
          transform: rotate(0deg);
          position: absolute;
          left: 50%;
          bottom: calc(100vw / ( 750 / 20 ));
          transform: translateX(-50%); }
      #main02 #sec_other .bordersectionHead.open .ttl:after {
        /*transform:rotate(180deg);*/
        display: none; }
    #main02 #sec_other .bordersectionBody {
      display: block;
      height: 0;
      /* overflow-y: hidden; */
			overflow: hidden;
      padding: 0; }
    #main02 #sec_other .bordersectionHead.open + .bordersectionBody {
      display: block;
      height: auto;
      padding: 0 calc(100vw / ( 750 / 40 )) calc(100vw / ( 750 / 20 )); }
    #main02 #sec_other .bordersectionClose {
      background: url(../img/arrow_open.svg) center no-repeat;
      background-size: auto 100%;
      height: calc(100vw / ( 750 / 15 ));
      transform: rotate(180deg);
      text-indent: -9999px; }
    #main02 #sec_other #sec_instagram {
      margin-bottom: calc(100vw / ( 750 / 50 )); }
      #main02 #sec_other #sec_instagram .bordersectionHead .ttl {
        width: calc(100vw / ( 750 / 481 )); }
    #main02 #sec_other #sec_present {
      font-size: calc(100vw / ( 750 / 26 )); }
      #main02 #sec_other #sec_present .bordersectionHead .ttl {
        width: calc(100vw / ( 750 / 177 )); }
			#main02 #sec_other #sec_present .bordersectionHead .obj01 {	width: 50%;	margin: 2.5vw auto;	padding: 0 0 0 2.5vw	}
      #main02 #sec_other #sec_present .bordersectionBody {
        padding-left: calc(100vw / ( 750 / 40 ));
        padding-right: calc(100vw / ( 750 / 40 )); }
        #main02 #sec_other #sec_present .bordersectionBody .obj01 {
          width: 70%;
          margin: auto; }
        #main02 #sec_other #sec_present .bordersectionBody .obj02 {
          margin-top: calc(100vw / ( 750 / 30 )); }
          #main02 #sec_other #sec_present .bordersectionBody .obj02 li {
            margin-bottom: calc(100vw / ( 750 / 30 )); }
        #main02 #sec_other #sec_present .bordersectionBody .txt01 span {
          font-size: calc(100vw / ( 750 / 26 )); }
        #main02 #sec_other #sec_present .bordersectionBody .spec {
          line-height: 1.7;
          margin-bottom: calc(100vw / ( 750 / 30 )); }
  #main02 #sec_previousItems {
    padding: calc(100vw / ( 750 / 100 )) 0 calc(100vw / ( 750 / 150 )); }
    #main02 #sec_previousItems .items .item .btn_01 {
      padding: calc(100vw / ( 750 / 70 )) 0 calc(100vw / ( 750 / 70 )) calc(100vw / ( 750 / 270 ));
      display: table;
      width: 100%;
      border: 1px solid #000;
      text-decoration: none;
      color: #000;
      background: url(../img/previous_btn01.png) left center no-repeat;
      background-size: auto 100%;
      box-sizing: border-box; }
      #main02 #sec_previousItems .items .item .btn_01 span {
        display: table-cell;
        vertical-align: middle;
        font-size: calc(100vw / ( 750 / 26 ));
        text-align: left; }
        #main02 #sec_previousItems .items .item .btn_01 span:after {
          content: "";
          display: block;
          height: calc(100vw / ( 750 / 10 ));
          width: calc(100vw / ( 750 / 55 ));
          background: url(../img/arw_bk.svg) center no-repeat;
          background-size: cover;
          margin-top: calc(100vw / ( 750 / 20 )); }
  #main02 #sec_notice {
    margin-bottom: calc(100vw / ( 750 / 100 )); }
    #main02 #sec_notice .ttl {
      font-size: calc(100vw / ( 750 / 26 ));
      margin-bottom: 0.5em; }
    #main02 #sec_notice .about {
      font-size: calc(100vw / ( 750 / 20 ));
      margin-bottom: 3em; }
      #main02 #sec_notice .about ul li {
        margin-bottom: 0.7em; }
  #main02 .itemList .ttl {
    position: relative;
    z-index: 0;
    margin: 0 0 calc(100vw / ( 750 / 140 )); }
    #main02 .itemList .ttl span {
      position: absolute;
      display: block;
      background-color: #000;
      left: 50%;
      bottom: 0;
      transform: translate(-50%, 50%);
      z-index: 1;
      color: #fff;
      font-size: calc(100vw / ( 750 / 27 ));
      white-space: nowrap;
      font-weight: normal;
      height: calc(100vw / ( 750 / 60 ));
      line-height: calc(100vw / ( 750 / 60 ));
      width: calc(100vw / ( 750 / 490 ));
      text-align: center; }
  #main02 .itemList .item {
    margin-bottom: calc(100vw / ( 750 / 130 )); }
  #main02 .item {
    text-align: center; }
    #main02 .item_ph {
      margin-bottom: calc(100vw / ( 750 / 20 )); }
    #main02 .item_catch {
      /*font-size: calc(100vw / ( 750 / 40 ));
      display: inline-block;
      font-weight: bold;
      position: relative;
      margin-bottom: 1em;*/
      margin-bottom: calc(100vw / ( 750 / 35 ));
      /*&:before, &:after {
      	content: "";
      	display: block;
      	width: calc(100vw / ( 750 / 26 ));
      	height: calc(100vw / ( 750 / 22 ));
      	background: url(../img/catch_before.png) center no-repeat;
      	background-size: cover;
      	position: absolute;
      }
      &:before {
      	left: -1em;
      	top: 0;
      }
      &:after {
      	background-image: url(../img/catch_after.png);
      	right: -1em;
      	bottom: 0;
      }*/ }
    #main02 .item_type {
      display: block;
      width: calc(100vw / ( 750 / 407 ));
      margin: 0 auto; }
    #main02 .item_creator {
      font-size: calc(100vw / ( 750 / 26 ));
      margin: 0.5em 0 1.5em; }
    #main02 .item_price {
      display: inline-block;
      background-color: #000;
      color: #fff;
      padding: 0 0.5em;
      font-size: calc(100vw / ( 750 / 32 ));
      margin-bottom: calc(100vw / ( 750 / 80 )); }
      #main02 .item_price .tax {
        font-size: calc(100vw / ( 750 / 20 ));
        color: #fff; }
    #main02 .item_btn {
      display: flex; }
      #main02 .item_btn li {
        display: block;
        position: relative;
        width: 50%;
        text-align: left;
        font-size: calc(100vw / ( 750 / 24 )); }
        #main02 .item_btn li.forDetail {
          margin-right: calc(100vw / ( 750 / 20 )); }
          #main02 .item_btn li.forDetail a {
            display: block;
            height: calc(100vw / ( 750 / 100 ));
            line-height: calc(100vw / ( 750 / 100 ));
            background-color: #fff;
            border: 1px solid #000;
            padding-left: 1.5em; }
          #main02 .item_btn li.forDetail:after {
            content: "";
            display: block;
            position: absolute;
            top: 50%;
            right: calc(100vw / ( 750 / 20 ));
            transform: translateY(-50%);
            height: calc(100vw / ( 750 / 10 ));
            width: calc(100vw / ( 750 / 55 ));
            background: url(../img/arw_bk.svg) center no-repeat;
            background-size: cover; }
        #main02 .item_btn li.forCart .cartBox {
          position: relative; }
          #main02 .item_btn li.forCart .cartBox .lp_button_cart_1 {
            height: calc(100vw / ( 750 / 100 ));
            line-height: calc(100vw / ( 750 / 100 ));
            display: block;
            border: 1px solid #000;
            background-color: #000;
            color: #fff;
            padding-left: 1.5em; }
            #main02 .item_btn li.forCart .cartBox .lp_button_cart_1.is_2 {
              line-height: 1.4;
              position: relative; }
              #main02 .item_btn li.forCart .cartBox .lp_button_cart_1.is_2 .btn_inner {
                position: absolute;
                top: 50%;
                transform: translateY(-50%); }
              #main02 .item_btn li.forCart .cartBox .lp_button_cart_1.is_2 .few {
                font-size: calc(100vw / ( 750 / 20 )); }
            #main02 .item_btn li.forCart .cartBox .lp_button_cart_1.is_0, #main02 .item_btn li.forCart .cartBox .lp_button_cart_1.is_9 {
              background-color: #aaaaaa;
              border: 1px solid #aaaaaa;
              padding-left: 0;
              text-align: center; }
          #main02 .item_btn li.forCart .cartBox a {
            display: block;
            color: #fff;
            text-decoration: none; }
            #main02 .item_btn li.forCart .cartBox a:after {
              content: "";
              display: block;
              position: absolute;
              top: 50%;
              right: calc(100vw / ( 750 / 20 ));
              transform: translateY(-50%);
              height: calc(100vw / ( 750 / 10 ));
              width: calc(100vw / ( 750 / 55 ));
              background: url(../img/arw_wh.svg) center no-repeat;
              background-size: cover; }
  #main02 .itemSingle .introArea {
    padding: calc(100vw / ( 750 / 80 )); }

#main02 .itemSingle .introArea .inner
{
	/* border: 1px solid #000; */
	min-height: calc(100vw / ( 750 / 590 ));
	position: relative;
	margin: 0 auto 5vw;
	/* margin-bottom: calc(100vw / ( 750 / 80 )); */
}
#main02 #sec_lip.itemSingle .introArea .inner
{
	min-height: calc(100vw / ( 750 / 590 ));
	margin: 0 auto;
}

#main02 .itemSingle .introArea .inner .obj
{
	width: 100vw;
	height: calc(100vw / 750 * 680 );
	background: url(../img/sec_powder_bg.png) no-repeat center;
	background-size: 100% auto;
	position: absolute;
	left: calc(-100vw / ( 750 / 80 ));
	transform : translate(0,-6vw);
}
#main02 .itemSingle .introArea .inner .obj.forLip
{
	height: calc(100vw / 750 * 640 );
	background: url(../img/sec_lip_bg.png) no-repeat center;
	background-size: 100% auto;
	transform : translate(0,-6vw);
}
#main02 .itemSingle .introArea .inner .txtBox
{
	position: absolute;
	right: calc(-100vw / ( 750 / 80 ));
	top: 50%;
	width: calc(100vw / ( 750 / 440 ));
	transform: translateY(-50%);
	font-size: calc(100vw / ( 750 / 26 ));
}
#main02 #sec_lip.itemSingle .introArea .inner .txtBox
{
	top: 40%;
}


        #main02 .itemSingle .introArea .inner .txtBox:after {
          content: "";
          display: block;
          background-color: #fff;
          position: absolute;
          right: 0;
          top: 45%;
          width: calc(100vw / ( 750 / 440 ));
          transform: translateY(-50%);
          width: 30vw;
          height: 30%;
          z-index: -1; }
        #main02 .itemSingle .introArea .inner .txtBox.forLip {
          right: inherit;
          left: calc(-100vw / ( 750 / 40 )); }
          #main02 .itemSingle .introArea .inner .txtBox.forLip:after {
            right: inherit;
            left: 0;
            top: 50%;
            height: 110%; }
        #main02 .itemSingle .introArea .inner .txtBox .ttl {
          display: inline-block;
          width: calc(100vw / ( 750 / 305 ));
          margin-bottom: calc(100vw / ( 750 / 30 )); }
        #main02 .itemSingle .introArea .inner .txtBox .kinds {
          margin-bottom: calc(100vw / ( 750 / 40 ));
          line-height: 1.8; }
          #main02 .itemSingle .introArea .inner .txtBox .kinds dt {
            font-weight: bold;
            margin-bottom: calc(100vw / ( 750 / 10 )); }
          #main02 .itemSingle .introArea .inner .txtBox .kinds dd {
            width: calc(100vw / ( 750 / 394 ));
            display: inline-block; }
        #main02 .itemSingle .introArea .inner .txtBox .about {
          margin-bottom: 1em; }
        #main02 .itemSingle .introArea .inner .txtBox .price {
          display: inline-block;
          background-color: #000;
          color: #fff;
          padding: 0 0.5em;
          font-size: calc(100vw / ( 750 / 32 )); }
          #main02 .itemSingle .introArea .inner .txtBox .price span {
            font-size: calc(100vw / ( 750 / 20 ));
            color: #fff; }
    #main02 .itemSingle .introArea .btn_detail {
      display: block;
      font-size: calc(100vw / ( 750 / 24 ));
      height: calc(100vw / ( 750 / 100 ));
      line-height: calc(100vw / ( 750 / 100 ));
      background-color: #000;
      color: #fff;
      position: relative;
      padding-left: 1.5em; }
      #main02 .itemSingle .introArea .btn_detail:after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: calc(100vw / ( 750 / 20 ));
        transform: translateY(-50%);
        height: calc(100vw / ( 750 / 10 ));
        width: calc(100vw / ( 750 / 55 ));
        background: url(../img/arw_wh.svg) center no-repeat;
        background-size: cover; }
  #main02 .itemSingle .col2List {
    display: flex;
    flex-wrap: wrap;
    margin: 0 4vw; }
    #main02 .itemSingle .col2List li {
      position: relative;
      margin-bottom: calc(100vw / ( 750 / 60 )); }
      #main02 .itemSingle .col2List li a {
        display: block;
        outline: none;
        padding-bottom: calc(100vw / ( 750 / 40 )); }
        #main02 .itemSingle .col2List li a:after {
          content: "+";
          background-color: #000;
          border-radius: 50%;
          color: #fff;
          position: absolute;
          right: calc(100vw / ( 750 / 10 ));
          bottom: 0;
          width: calc(100vw / ( 750 / 78 ));
          height: calc(100vw / ( 750 / 78 ));
          line-height: calc(100vw / ( 750 / 78 ));
          text-align: center;
          font-size: calc(100vw / ( 750 / 40 )); }
    #main02 .itemSingle .col2List.forPowder li {
      width: 48.5%; }
      #main02 .itemSingle .col2List.forPowder li:nth-child(odd) {
        margin-right: 3%; }
    #main02 .itemSingle .col2List.forLip li {
      width: 32%;
      margin-right: 2%; }
      #main02 .itemSingle .col2List.forLip li:nth-child(3n) {
        margin-right: 0; }
      #main02 .itemSingle .col2List.forLip li a {
        padding-bottom: calc(100vw / ( 750 / 75 )); }
        #main02 .itemSingle .col2List.forLip li a img {
          width: 90%;
          display: block;
          margin: auto; }

.modalBox {
  display: none; }

/*=== modaal ===*/
.modaal {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  width: 100vw;
  text-align: center;
  /* detail */
  /* gift */
  /* know */ }
  .modaal .inner {
    padding: calc(100vw / ( 750 / 40 )); }
  .modaal img {
    width: 100%;
    height: auto; }
  .modaal p {
    margin: 0; }
  .modaal .slider {
    margin-top: 5vw;
    width: 100%; }
    .modaal .slider img {
      width: 65%;
      height: auto;
      margin: auto; }
  .modaal .detail_ph {
    margin-bottom: calc(100vw / ( 750 / 20 )); }
    .modaal .detail_ph img {
      width: 65%; }
  .modaal .detail_catch {
    /*font-size: calc(100vw / ( 750 / 40 ));
    display: inline-block;
    font-weight: bold;
    position: relative;
    margin: 1em 0;*/
    padding: calc(100vw / ( 750 / 30 )) 0;
    /*&:before, &:after {
    	content: "";
    	display: block;
    	width: calc(100vw / ( 750 / 26 ));
    	height: calc(100vw / ( 750 / 22 ));
    	background: url(../img/catch_before.png) center no-repeat;
    	background-size: cover;
    	position: absolute;
    }
    &:before {
    	left: -1em;
    	top: 0;
    }
    &:after {
    	background-image: url(../img/catch_after.png);
    	right: -1em;
    	bottom: 0;
    }*/ }
  .modaal .detail_lead {
    font-size: calc(100vw / ( 750 / 26 ));
    margin: 0 0 1.5em; }
  .modaal .detail_pd {
    font-size: calc(100vw / ( 750 / 34 ));
    margin: 0 0 1em; }
    .modaal .detail_pd:before {
      content: "";
      display: block;
      width: calc(100vw / ( 750 / 50 ));
      height: 1px;
      background-color: #000;
      margin: 0 auto 1.5em; }
  .modaal .detail_item {
    font-size: calc(100vw / ( 750 / 26 ));
    margin-bottom: 1em; }
  .modaal .detail_price {
    display: inline-block;
    background-color: #000;
    color: #fff;
    padding: 0 0.5em;
    font-size: calc(100vw / ( 750 / 32 ));
    margin-bottom: calc(100vw / ( 750 / 80 )); }
    .modaal .detail_price .tax {
      font-size: calc(100vw / ( 750 / 20 ));
      color: #fff; }
  .modaal .detail_btn {
    margin-bottom: calc(100vw / ( 750 / 150 )); }
    .modaal .detail_btn li {
      display: block;
      font-size: calc(100vw / ( 750 / 24 ));
      margin: 0 calc(100vw / ( 750 / 40 )); }
      .modaal .detail_btn li .cartBox {
        position: relative; }
        .modaal .detail_btn li .cartBox .lp_button_cart_1 {
          height: calc(100vw / ( 750 / 100 ));
          line-height: calc(100vw / ( 750 / 100 ));
          display: block;
          border: 1px solid #000;
          background-color: #000;
          color: #fff;
          text-align: center;
          padding-left: 1.5em; }
          .modaal .detail_btn li .cartBox .lp_button_cart_1.is_2 br {
            display: none; }
          .modaal .detail_btn li .cartBox .lp_button_cart_1.is_2 .few {
            font-size: calc(100vw / ( 750 / 20 ));
            padding-right: 1em; }
          .modaal .detail_btn li .cartBox .lp_button_cart_1.is_0, .modaal .detail_btn li .cartBox .lp_button_cart_1.is_9 {
            padding-left: 0;
            background-color: #aaaaaa;
            border: 1px solid #aaaaaa;
            padding-left: 0; }
        .modaal .detail_btn li .cartBox a {
          display: block;
          text-decoration: none; }
          .modaal .detail_btn li .cartBox a:after {
            content: "";
            display: block;
            position: absolute;
            top: 50%;
            right: calc(100vw / ( 750 / 20 ));
            transform: translateY(-50%);
            height: calc(100vw / ( 750 / 10 ));
            width: calc(100vw / ( 750 / 55 ));
            background: url(../img/arw_wh.svg) center no-repeat;
            background-size: cover; }
.modaal .detail_feature
{
	border: calc(100vw / ( 750 / 40 )) solid rgba(0, 0, 0, 0.3);
	padding: calc(100vw / ( 750 / 80 )) calc(100vw / ( 750 / 40 )) calc(100vw / ( 750 / 40 ));
	margin: 0 auto 10vw;
}
    .modaal .detail_feature img {
      width: 100%;
      height: auto; }
    .modaal .detail_feature p {
      margin: 0 0 1em;
      text-align: left; }
    .modaal .detail_feature dt {
      display: block;
      width: calc(100vw / ( 750 / 182 ));
      margin: 0 auto; }
      .modaal .detail_feature dt:after {
        content: "";
        display: block;
        width: calc(100vw / ( 750 / 50 ));
        height: 1px;
        background-color: #000;
        margin: calc(100vw / ( 750 / 40 )) auto; }
    .modaal .detail_feature dd {
      font-size: calc(100vw / ( 750 / 26 ));
      margin-bottom: calc(100vw / ( 750 / 70 )); }
      .modaal .detail_feature dd:last-child {
        margin-bottom: 0; }
      .modaal .detail_feature dd .ttl {
        margin: 0 calc(-100vw / ( 750 / 10 )) calc(100vw / ( 750 / 30 )); }
        .modaal .detail_feature dd .ttl.name {
          text-align: center; }
      .modaal .detail_feature dd .note {
        text-align: left;
        font-size: calc(100vw / ( 750 / 20 ));
        margin: 0; }
      .modaal .detail_feature dd .point {
        text-align: left; }
        .modaal .detail_feature dd .point li {
          margin-bottom: 0.5em; }
          .modaal .detail_feature dd .point li.colors {
            padding-top: 0.5em; }
      .modaal .detail_feature dd .ph {
        margin-bottom: calc(100vw / ( 750 / 30 )); }
  .modaal .giftSet {
    padding-top: calc(100vw / ( 750 / 100 )); }
    .modaal .giftSet_ttl {
      display: inline-block;
      background-color: #000;
      color: #fff;
      font-size: calc(100vw / ( 750 / 27 ));
      margin-bottom: calc(100vw / ( 750 / 50 ));
      padding: 0.5em 2em; }
    .modaal .giftSet_img {
      margin-bottom: calc(100vw / ( 750 / 20 )); }
      .modaal .giftSet_img img {
        width: 100%; }
    .modaal .giftSet_type {
      display: block;
      width: calc(100vw / ( 750 / 407 ));
      margin: 0 auto; }
    .modaal .giftSet_pd {
      font-size: calc(100vw / ( 750 / 26 ));
      margin: 0.5em 0 1em; }
    .modaal .giftSet_price {
      display: inline-block;
      background-color: #000;
      color: #fff;
      padding: 0 0.5em;
      font-size: calc(100vw / ( 750 / 32 ));
      margin-bottom: calc(100vw / ( 750 / 80 )); }
      .modaal .giftSet_price .tax {
        font-size: calc(100vw / ( 750 / 20 ));
        color: #fff; }
    .modaal .giftSet_btn {
      display: flex; }
      .modaal .giftSet_btn li {
        display: block;
        position: relative;
        width: 50%;
        text-align: left;
        font-size: calc(100vw / ( 750 / 24 )); }
        .modaal .giftSet_btn li.forDetail {
          margin-right: calc(100vw / ( 750 / 20 )); }
          .modaal .giftSet_btn li.forDetail a {
            display: block;
            /*padding: 1.25em 1em;*/
            height: calc(100vw / ( 750 / 100 ));
            line-height: calc(100vw / ( 750 / 100 ));
            background: url(../img/btn_detail.png) center no-repeat #fff;
            background-size: calc(100vw / ( 750 / 326 )) auto;
            border: 1px solid #000;
            padding-left: 1.5em; }
          .modaal .giftSet_btn li.forDetail:after {
            content: "";
            display: block;
            position: absolute;
            top: 50%;
            right: calc(100vw / ( 750 / 20 ));
            transform: translateY(-50%);
            height: calc(100vw / ( 750 / 10 ));
            width: calc(100vw / ( 750 / 55 ));
            background: url(../img/arw_bk.svg) center no-repeat;
            background-size: cover; }
        .modaal .giftSet_btn li.forCart .cartBox {
          position: relative; }
          .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1 {
            height: calc(100vw / ( 750 / 100 ));
            line-height: calc(100vw / ( 750 / 100 ));
            display: block;
            border: 1px solid #000;
            background-color: #000;
            color: #fff;
            padding-left: 1.5em; }
            .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1.is_2 {
              line-height: 1.4;
              position: relative; }
              .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1.is_2 .btn_inner {
                position: absolute;
                top: 50%;
                transform: translateY(-50%); }
              .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1.is_2 .few {
                font-size: calc(100vw / ( 750 / 20 )); }
            .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1.is_0, .modaal .giftSet_btn li.forCart .cartBox .lp_button_cart_1.is_9 {
              background-color: #aaaaaa;
              border: 1px solid #aaaaaa;
              text-align: center;
              padding-left: 0; }
          .modaal .giftSet_btn li.forCart .cartBox a {
            display: block;
            color: #fff;
            text-decoration: none; }
            .modaal .giftSet_btn li.forCart .cartBox a:after {
              content: "";
              display: block;
              position: absolute;
              top: 50%;
              right: calc(100vw / ( 750 / 20 ));
              transform: translateY(-50%);
              height: calc(100vw / ( 750 / 10 ));
              width: calc(100vw / ( 750 / 55 ));
              background: url(../img/arw_wh.svg) center no-repeat;
              background-size: cover; }
  .modaal .know {
    text-align: left;
    font-size: calc(100vw / ( 750 / 26 ));
    padding: 0 calc(100vw / ( 750 / 45 )); }
    .modaal .know.forPowder {
      margin-top: calc(-100vw / ( 750 / 100 )); }
    .modaal .know_ph {
      margin: calc(-100vw / ( 750 / 40 )) calc(-100vw / ( 750 / 40 )) 0; }
    .modaal .know_ttl {
      display: block;
      width: calc(100vw / ( 750 / 164 ));
      margin: 0 auto; }
    .modaal .know_lead {
      margin: 0 calc(-100vw / ( 750 / 5 ));
      text-align: center; }
      .modaal .know_lead:before, .modaal .know_lead:after {
        content: "";
        display: block;
        height: 1px;
        width: calc(100vw / ( 750 / 49 ));
        margin: 1.2em auto 1.5em;
        background-color: #000; }
    .modaal .know_def {
      margin-bottom: 2em;
      text-align: center; }
      .modaal .know_def dt {
        display: inline-block;
        line-height: 1;
        border: 2px solid #bfbfbf;
        margin-bottom: 1em;
        padding: 0.3em 0.5em; }
        .modaal .know_def dt.long {
          letter-spacing: -0.08em;
          display: block; }
      .modaal .know_def dd .txt03 {
        margin-bottom: 2em; }
      .modaal .know_def dd .note {
        font-size: calc(100vw / ( 750 / 20 )); }
      .modaal .know_def dd .colors {
        text-align: left;
        margin: 0 calc(-100vw / ( 750 / 10 )); }
        .modaal .know_def dd .colors li {
          text-align: left;
          position: relative;
          padding-left: calc(100vw / ( 750 / 100 )); }
          .modaal .know_def dd .colors li:before {
            content: "";
            display: block;
            width: calc(100vw / ( 750 / 75 ));
            height: calc(100vw / ( 750 / 75 ));
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%); }
          .modaal .know_def dd .colors li.forCL:before {
            background-image: url(../img/color_cl.png); }
          .modaal .know_def dd .colors li.forPK:before {
            background-image: url(../img/color_pk.png); }
          .modaal .know_def dd .colors li.forRD:before {
            background-image: url(../img/color_rd.png); }
    .modaal .know_feature {
      margin-bottom: 2em;
      text-align: left; }
    .modaal .know_txt01 {
      margin-bottom: 2em; }
    .modaal .know_txt02 {
      margin-bottom: 1em; }
    .modaal .know_name {
      font-weight: normal; }
    .modaal .know_price {
      display: inline-block;
      background-color: #000;
      color: #fff;
      margin-bottom: calc(100vw / ( 750 / 100 ));
      font-size: calc(100vw / ( 750 / 32 ));
      padding: 2px;
      line-height: 1; }
      .modaal .know_price span {
        font-size: calc(100vw / ( 750 / 20 ));
        color: #fff; }


.modaal .review
{
	width: 18vw;
	padding: 0.3em 0.5em;
	margin: 0 auto 5vw;
	border: 2px solid rgba(191, 191, 191, 1.0);

	font-size: calc(100vw / ( 750 / 26 ));
	line-height: 1.0;
	text-align: center;
}

.modaal .know_obj li
{
	margin: 0 calc(-100vw / ( 750 / 45 )) calc(100vw / ( 750 / 50 ));
	padding-bottom: calc(100vw / ( 750 / 50 ));
	border-bottom: 1px solid rgba(191, 191, 191, 1.0);
}
.modaal .know_obj li:last-child{	border: none;	}

/* custom modaal parts */
.modaal-wrapper .modaal-close:before,
.modaal-wrapper .modaal-close:after {
  background: #333333; }

.modaal-wrapper .modaal-close:focus:before,
.modaal-wrapper .modaal-close:focus:after,
.modaal-wrapper .modaal-close:hover:before,
.modaal-wrapper .modaal-close:hover:after {
  background: rgba(51, 51, 51, 0.6); }

.modaal-wrapper .modaal-close:focus,
.modaal-wrapper .modaal-close:hover {
  background: rgba(0, 0, 0, 0); }

/* custom slick parts */
.modaal .slick-next,
.modaal .slick-prev {
  width: calc(100vw / ( 750 / 100 ));
  height: 100%; }

.modaal .slick-next {
  right: 0; }

.modaal .slick-prev {
  left: 0; }

.modaal .slick-next:before {
  background: url(../img/arrow_next.svg) right center no-repeat;
  background-size: calc(100vw / ( 750 / 29 )) auto; }

.modaal .slick-prev:before {
  background: url(../img/arrow_prev.svg) left center no-repeat;
  background-size: calc(100vw / ( 750 / 29 )) auto; }

.modaal .slick-prev:before,
.modaal .slick-next:before {
  /*color: rgba(51, 51, 51, 1.0);
  font-size: calc(100vw / ( 750 / 40 ));*/
  content: "";
  display: block;
  width: 100%;
  height: calc(100vw / ( 750 / 52 )); }

.modaal .slick-dots li button:before {
  font-size: 7vw; }