@charset "UTF-8";

:root {
  --font-lp_base: "objektiv-mk1","yu-gothic-pr6n",YuGothic,'Yu Gothic',"ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN,HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
  --color-lp_bg: #fff;
  --color-lp_font: #595959;
  --color-lp_primary: #9EB9D8;
  --color-lp_secondary: #C4A768;
  --color-lp_gray: #E1E1E1;
  --color-lp_btn: transparent linear-gradient(90deg, #9EB9D8 50%, #EDE3DE 100%) 0% 0% no-repeat padding-box;
}

/*--------------------------------
            CSS Animation
 --------------------------------*/

/* zoom
==================================*/

#lp_contents .zoom {
  opacity: 0;
  -ms-filter: blur(30px);
  filter: blur(30px);
  transform: scale(1.1);

  transition: all 2s;
}

#lp_contents .zoom.is-show{
  opacity: 1;
  -ms-filter: blur(0);
  filter: blur(0);
  transform: scale(1);
}

#lp_contents .delay1{
  transition-delay: 0.3s;
}
#lp_contents .delay2{
  transition-delay: 0.6s;
}
#lp_contents .delay3{
  transition-delay: 0.9s;
}


/* Fade In
==================================*/

#lp_contents .fadeIn {
  opacity: 0;
  transition: 2s;
}

#lp_contents .fadeIn.is-show {
  opacity: 1;
}

#lp_contents .fadeInUp {
  opacity: 0;
  transform: translate(0, 5rem);
  transition: 2s;
}

#lp_contents .fadeInUp.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

@keyframes imgmask {
  0% {
    opacity: 0;
    -webkit-filter: blur(4px);
            filter: blur(4px);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}

#lp_contents .imgmask {
  opacity: 0;
  -webkit-animation: imgmask 1s cubic-bezier(0.51, 0.21, 0.41, 1) 0s 1 forwards;
  animation: imgmask 1s cubic-bezier(0.51, 0.21, 0.41, 1) 0s 1 forwards;
  -webkit-mask-image: -webkit-gradient(linear, left bottom, left top, from(transparent), color-stop(39.6666666667%, transparent), color-stop(43.3333333333%, rgba(0, 0, 0, 0.02)), color-stop(45%, rgba(0, 0, 0, 0.08)), color-stop(46.6666666667%, rgba(0, 0, 0, 0.18)), color-stop(48.3333333333%, rgba(0, 0, 0, 0.32)), color-stop(50%, rgba(0, 0, 0, 0.5)), color-stop(51.6666666667%, rgba(0, 0, 0, 0.68)), color-stop(53.3333333333%, rgba(0, 0, 0, 0.82)), color-stop(55%, rgba(0, 0, 0, 0.92)), color-stop(56.6666666667%, rgba(0, 0, 0, 0.98)), color-stop(58.3333333333%, #000), to(#000));
  -webkit-mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, #000 58.3333333333%, #000);
  mask-image: -webkit-gradient(linear, left bottom, left top, from(transparent), color-stop(39.6666666667%, transparent), color-stop(43.3333333333%, rgba(0, 0, 0, 0.02)), color-stop(45%, rgba(0, 0, 0, 0.08)), color-stop(46.6666666667%, rgba(0, 0, 0, 0.18)), color-stop(48.3333333333%, rgba(0, 0, 0, 0.32)), color-stop(50%, rgba(0, 0, 0, 0.5)), color-stop(51.6666666667%, rgba(0, 0, 0, 0.68)), color-stop(53.3333333333%, rgba(0, 0, 0, 0.82)), color-stop(55%, rgba(0, 0, 0, 0.92)), color-stop(56.6666666667%, rgba(0, 0, 0, 0.98)), color-stop(58.3333333333%, #000), to(#000));
  mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, #000 58.3333333333%, #000);
  -webkit-mask-size: 100% max(300%, 100vh);
  mask-size: 100% max(300%, 100vh);
  -webkit-mask-position: center 100%;
  mask-position: center 100%;
  -webkit-mask-repeat: none;
  mask-repeat: none;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  transition: -webkit-mask-position 1.4s linear;
  -webkit-transition: -webkit-mask-position 1.4s linear;
  transition: mask-position 1.4s linear;
  transition: mask-position 1.4s linear, -webkit-mask-position 1.4s linear;
}

#lp_contents .imgmask.is-show {
  -webkit-mask-position: center 0;
  mask-position: center 0;
}


/* slider
==================================*/

#lp_contents .slick-dots{
  position: static;
  margin: auto;
  line-height: 0;
}

#lp_contents .slick-dotted.slick-slider{
  margin: 0;
}

#lp_contents .item_slider .slick-dots {
  bottom: 0px;
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin: 2.5rem auto 0;
}

#lp_contents .item_slider .slick-dots li {
  position: relative;
  display: inline-block;
  width: 6rem;
  height: 0.3rem;
  margin: 0;
  padding: 0;
  cursor: pointer;
  background: var(--color-lp_gray);
}
#lp_contents .item_slider .slick-dots li button{
  width: 0;
  height: 100%;
  padding: 0;
}
#lp_contents .item_slider .slick-dots li.slick-active button {
  background-color: var(--color-lp_primary);
}
#lp_contents .item_slider .slick-dots li button:before {
  content: none;
}

@media (max-width: 767px) {
  #lp_contents .item_slider .slick-dots {
    margin-top: 2rem;
  }
}


/* accordion
==================================*/

#lp_contents .accordion.is-hide{
  position: relative;
  overflow: hidden;
  height: 21rem;
}

#lp_contents .trigger {
  display: none;
  width: fit-content;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  line-height: 1;
  letter-spacing: 0.175em;
  margin: 3rem auto 0;
  cursor: pointer;
  transition: .2s ease;
  transition: 0.5s opacity;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--color-lp_primary);
}

#lp_contents .trigger.is-show{
  display: block;
}

#lp_contents .accordion.is-hide + .trigger{
  display: flex;
}

#lp_contents .accordion.is-hide + .trigger::before {
  content: "VIEW MORE +";
}

#lp_contents .accordion + .trigger.is-show::before {
  content: "CLOSE -";
}


/* accordion
==================================*/

#lp_contents .tab_list {
  cursor: pointer;/* カーソルポインターに */
}
#lp_contents .tab{
  position: relative;
  padding-bottom: 2rem;
}
#lp_contents .tab.active:before{
  content: '';
  display: block;
  width: 1rem;
  height: 1rem;
  border-right: 1px solid var(--color-lp_primary);
  border-bottom: 1px solid var(--color-lp_primary);
  transform: rotate(45deg);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
#lp_contents .panel,
#lp_contents .item_panel {
  display: none;
}
#lp_contents .panel.active,
#lp_contents .item_panel.active {
  display: block;
}


/* follow
==================================*/

#lp_contents .follow{
  position: fixed;
  top: 6.5rem;
  z-index: 100;
  transition: all 0.5s;
  opacity: 0;
  box-shadow: 3px 2px 7px 0px rgba(0,0,0,0.06);
}

#lp_contents .follow.fixed{
  opacity: 1;
}

#lp_contents .follow.none{
  opacity: 0;
}


/*--------------------------------
                共 通
 --------------------------------*/

main,#Wrap,.wrapBottom,.wrapTop{
  width: 100%;
  max-width: 100%;
}

#header.scroll, #header.top.scroll{
  box-shadow: initial;
}

#header .header_inner{
  border-width: 0;
}

#FooterWrap{
  position: relative;
  z-index: 100;
  background-color: #fff;
}

#lp_contents *{
  box-sizing: border-box;
}

#lp_contents{
  font-family: var(--font-lp_base);
  font-feature-settings: "palt";
  font-size: 1.5rem;
  font-weight: 300;
  letter-spacing: 0.075em;
  line-height: 2;
  text-align: center;
  padding-bottom: 12rem;

  display: flex;
  align-items: center;
  justify-content: center;

  color: var(--color-lp_font);
  background-color: var(--color-lp_bg);
  position: relative;
  /*overflow: hidden;*/
}
#lp_contents .sp_only{display: none;}
#lp_contents img{width: 100%;display: block;height: auto;}
#lp_contents a{display: block;width: 100%;cursor: pointer;transition: all 0.5s;color: inherit;}
#lp_contents a:hover{opacity: .8}
#lp_contents ul li,#lp_contents ol li{list-style: none;}
#lp_contents h1,#lp_contents h2,#lp_contents h3{padding: 0;float: none;font-weight: normal;}
#lp_contents p {
  display: block;
  margin: 0;
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 2;
}
#lp_contents sup{
  font-size: 50%;
  margin-top: -0.6rem;
}
#lp_contents small.note{
  display: inline-block;
  margin-top: 2rem;
  font-size: 1.1rem;
  line-height: 1.5;
}
#lp_contents p small.note{
  margin-top: 1rem;
}
#lp_contents section{
  position: relative;
}
#lp_contents .lp_inner{
  display: grid;
  gap: 12rem;
}
#lp_contents .flex_inner{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

/*------------ text ------------*/
#lp_contents .ttl{
  font-size: 1.8rem;
  letter-spacing: 0.175em;
  line-height: 1;
  font-weight: 700;
  color: var(--color-lp_primary);
  margin-bottom: 2.5rem;
}
#lp_contents .main_ttl{
  font-size: 3.4rem;
  font-weight: 300;
  letter-spacing: 0.175em;
  line-height: 1;
  margin-bottom: 5rem;
}
#lp_contents .sub_ttl{
  margin: 0 auto 5rem;
}
#lp_contents .sub_ttl_txt{
  font-size: 3rem;
  line-height: 1;
  width: fit-content;
  border-bottom: 1px solid var(--color-lp_secondary);
  padding-bottom: 0.8rem;
  margin: auto;
}
#lp_contents .lead{
  font-size: 1.8rem;
  margin-bottom: 5rem;
}
#lp_contents .item_name{
  font-size: 1.3rem;
  line-height: 1.5;
}
#lp_contents .item_price{
  font-size: 1.4rem;
  line-height: 1;
  margin-top: 1rem;
}
#lp_contents .item_txt{
  text-align: justify;
  font-size: 1.4rem;
  margin-top: 2rem;
}

/*------------ btn ------------*/
#lp_contents .link_btn{
  width: 35rem;
  height: 5.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 0.175em;
  color: #fff;
  background: var(--color-lp_btn);
  margin: 2rem auto 0;
}

#lp_contents .all_btn{
  margin: 8rem auto 0;
}

#lp_contents .all_btn a{
  width: 60rem;
  height: 8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  font-size: 1.8rem;
  font-weight: 500;
  background: #F8F8F8;
  margin: auto;
}

#lp_contents .all_btn img{
  width: 16rem;
}

/*------------ cmpn_area ------------*/
#lp_contents .cmpn_area{
  display: grid;
  gap: 1.5rem;
  width: 50rem;
  padding: 3rem;
  border: 1px solid var(--color-lp_secondary);
  color: var(--color-lp_secondary);
  margin: 6rem auto 0;
}

#lp_contents .cmpn_area .cmpn_ttl{
  margin-bottom: 0;
  color: var(--color-lp_secondary);
}

#lp_contents .cmpn_area .cmpn_txt{
  font-size: 1.8rem;
  line-height: 1.75;
}

#lp_contents .cmpn_area .cmpn_day{
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.175em;
  line-height: 1;
}

#lp_contents .cmpn_area .cmpn_day big{
  font-size: 2.1rem;
}

#lp_contents .cmpn_area .cmpn_day small{
  font-size: 1.2rem;
}

/*------------ nav ------------*/
#lp_contents .nav_area{
  width: 100%;
  background-color: #fff;
}

#lp_contents .nav_area .nav_ttl{
  color: var(--color-lp_secondary);
}

#lp_contents .nav_area ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap:3rem;
}

#lp_contents .nav_area a{
  position: relative;
  padding: 0 1rem 0.8rem 0;
  min-width: 24rem;
  border-bottom: 1px solid var(--color-lp_secondary);
  font-size: 1.7rem;
}

#lp_contents .nav_area a:hover{
  opacity: 1;
  color: var(--color-lp_secondary);
}

#lp_contents .nav_area a:before{
  content: '';
  width: 1rem;
  height: 0.8rem;
  background-image: url(../img/arrow_1.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

#lp_contents .follow.nav_area{
  padding-top: 1rem;
  overflow-x: scroll;
  /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
  -ms-overflow-style: none;
  /*Firefoxへの対応*/
  scrollbar-width: none;
}

#lp_contents .follow.nav_area::-webkit-scrollbar{
  display: none;
}

#lp_contents .follow.nav_area ul{
  width: max-content;
  gap: 0;
  margin: auto;
}

#lp_contents .follow.nav_area a{
  padding-right: 0;
  font-size: 1.4rem;
  min-width: 20rem;
  border-width: 0;
}

#lp_contents .follow.nav_area a:before{
  content: none;
}

#lp_contents .nav_img{
  width: 12rem;
  height: fit-content;
  top: auto;
  right: 2rem;
  bottom: 2rem;
  border-radius: 100%;
}

#lp_contents .follow[data-color=sec_1] ul li:nth-child(1) a,
#lp_contents .follow[data-color=sec_2] ul li:nth-child(2) a,
#lp_contents .follow[data-color=sec_3] ul li:nth-child(3) a,
#lp_contents .follow[data-color=sec_4] ul li:nth-child(4) a{
  border-width: 1px;
  color: var(--color-lp_secondary);
}


/* sec_mv
==================================*/

#lp_contents .sec_mv .mv_wrap{
  position: relative;
  overflow: hidden;
}

#lp_contents .sec_mv .mv_wrap .img{
  position: absolute;
  top: 0;
  left: 0;
}

#lp_contents .sec_mv .mv_wrap .img_1{
  z-index: 2;
}

#lp_contents .sec_mv .mv_wrap .img_2{
  z-index: 3;
}

#lp_contents .sec_mv .mv_wrap .img_3{
  z-index: 4;
}

#lp_contents .sec_mv .lead{
  margin-top: 8rem;
}

#lp_contents .sec_mv .nav_area{
  margin: 8rem auto 0;
}


/* sec_about
==================================*/

#lp_contents .sec_about .img_wrap{
  max-width: 110rem;
  width: 50%;
  position: absolute;
  left: 0;
  top: 15rem;
  overflow: hidden;
}

#lp_contents .sec_about .txt_wrap{
  width: calc(950 *(100vw  / 1600));
  background-image: url(../img/brand_bg_pc.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 8rem;
  margin-left: auto;
}

#lp_contents .sec_about .txt_wrap .about_lead{
  font-size: 2.9rem;
  line-height: 1;
  margin-bottom: 3.6rem;
}


/* sec_item
==================================*/

/*------------ item_wrap ------------*/
#lp_contents .sec_item .item_wrap{
  position: relative;
}

/*img_blk*/
#lp_contents .sec_item .item_wrap .img_blk{
  width: 60rem;
}

/*item_blk*/
#lp_contents .sec_item .item_wrap .item_blk{
  width: 60rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

#lp_contents .sec_item .item_wrap .item_blk_inner{
  display: grid;
  gap: 4rem;
}

#lp_contents .sec_item .item_wrap .item_ttl_txt{
  display: grid;
  gap: 1.5rem;
  font-size: 2.7rem;
  line-height: 1;
}

#lp_contents .sec_item .item_wrap .item_ttl_txt small{
  font-size: 1.2rem;
  color: var(--color-lp_primary);
  letter-spacing: 0.175em;
}

#lp_contents .sec_item .item_wrap .tag_list{
  display: flex;
  justify-content: center;
  gap: 1rem;
  font-size: 1.2rem;
  line-height: 1;
  margin: 2.5rem auto 0;
}

#lp_contents .sec_item .item_wrap .tag_list span{
  display: block;
  padding: 0.6rem 1rem;
  border: 1px solid var(--color-lp_gray);
}

#lp_contents .sec_item .item_wrap .color_list ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}

#lp_contents .sec_item .item_wrap .color_list li{
  width: 14rem;
  font-size: 1.2rem;
  line-height: 1.5;
  display: grid;
  gap:1.5rem;
}

#lp_contents .sec_item .item_wrap .color_list img{
  width: 10rem;
  margin: auto;
}

/*------------ detail_wrap ------------*/
#lp_contents .sec_item .detail_wrap{
  width: 100rem;
  border: 1px solid var(--color-lp_primary);
  padding: 4rem 5rem;
  margin: 6rem auto 0;
}

/*point_blk*/
#lp_contents .sec_item .detail_wrap .point_blk{
  width: 40rem;
  padding-right: 5rem;
  margin-right: 5rem;
  background-image : linear-gradient(to bottom, var(--color-lp_gray) 2px, transparent 2px);
  background-size: 1px 4px;
  background-repeat: repeat-y;
  background-position: right top;
}
#lp_contents .sec_item .detail_wrap .point_blk ul{
  display: grid;
  gap: 2rem;
}

#lp_contents .sec_item .detail_wrap .point_blk li{
  text-align: left;
  padding-left: 3rem;
  background-image: url(../img/check.svg);
  background-size: 1.7rem;
  background-repeat: no-repeat;
  background-position: top 0.5rem left;
  line-height: 1.75;
}

/*key_blk*/
#lp_contents .sec_item .detail_wrap .key_blk .key_lead{
  font-size: 1.6rem;
  line-height: 1.5;
}

#lp_contents .sec_item .detail_wrap .key_blk ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem;
  margin: 2rem auto 0;
}

#lp_contents .sec_item .detail_wrap .key_blk li{
  width: 10rem;
  display: grid;
  gap: 1.2rem;
  font-size: 1.4rem;
  line-height: 1.5;
}

#lp_contents .sec_item .detail_wrap .key_blk figure{
  display: grid;
  gap: 1rem;
  width: 9rem;
  font-size: 1.1rem;
  line-height: 1;
  margin: auto;
}

/*------------ rcmd_item_wrap ------------*/
#lp_contents .sec_item .rcmd_item_container{
  margin: 10rem auto 0;
}

#lp_contents .sec_item .rcmd_item_wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 6rem 4rem;
}

#lp_contents .sec_item .rcmd_item_wrap .item_blk{
  display: grid;
  gap: 2rem;
  width: 48rem;
}

#lp_contents .sec_item .rcmd_item_wrap .img_blk{
  display: flex;
  justify-content: center;
  align-items: center;
}

#lp_contents .sec_item .rcmd_item_wrap figure{
  width: 24rem;
  margin: auto;
}

/*------------ bnr_blk ------------*/
#lp_contents .sec_item .bnr_blk{
  width: 80rem;
  margin: 8rem auto 0;
}


/* sec_staff
==================================*/

#lp_contents .sec_staff{
  background: transparent linear-gradient(180deg, #FFF5F0 0%, #F0F4FA 61%, #EDF4FC 100%) 0% 0% no-repeat padding-box;;
  padding: 12rem 0;
}

/*------------ staff_prof ------------*/
#lp_contents .sec_staff .staff_prof{
  width: 40rem;
  padding: 1rem 0;
  margin: auto;
  border-top: 1px solid var(--color-lp_gray);
  border-bottom: 1px solid var(--color-lp_gray);
  display: flex;
  align-items: center;
  gap: 1.5rem;
  text-align: left;
}

#lp_contents .sec_staff .staff_prof .img_blk{
  width: 12rem;
}

#lp_contents .sec_staff .staff_prof .prof_blk{
  display: grid;
  gap: 1rem;
}

#lp_contents .sec_staff .staff_prof .staff_name{
  font-size: 1.3rem;
  line-height: 1;
}

#lp_contents .sec_staff .staff_prof .nayami{
  font-size: 1.4rem;
  line-height: 1;
  background-color: #fff;
  padding: 0.4rem 0.6rem;
  width: fit-content;
}

#lp_contents .sec_staff .staff_prof .nayami_txt{
  font-size: 1.4rem;
  line-height: 1.75;
}

/*------------ use_item_wrap ------------*/
#lp_contents .sec_staff .use_item_wrap{
  width: 100rem;
  background-color: #fff;
  padding: 3rem 0 1rem 1rem;
  margin: 5rem auto 0;
}

#lp_contents .sec_staff .use_item_wrap .item_ttl{
  font-size: 1.8rem;
  line-height: 1;
  margin-bottom: 2rem;
}

#lp_contents .sec_staff .use_item_wrap ul{
  display: flex;
  flex-wrap: wrap;
  gap: 4rem;
}

#lp_contents .sec_staff .use_item_wrap li{
  display: flex;
  align-items: center;
}

#lp_contents .sec_staff .use_item_wrap .img_blk{
  width: 22rem;
}

#lp_contents .sec_staff .use_item_wrap .link_btn{
  width: 22rem;
  height: 4rem;
  font-size: 1.3rem;
}

/*------------ befoaf_wrap ------------*/
#lp_contents .sec_staff .befoaf_wrap{
  margin: 8rem auto 0;
}

#lp_contents .sec_staff .befoaf_wrap ul{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 2rem 4.5rem;
  margin: 5rem auto 0;
}

#lp_contents .sec_staff .befoaf_wrap .img{
  width: 30rem;
  position: relative;
}

#lp_contents .sec_staff .befoaf_wrap .img p{
  width: 9.2rem;
  height: 2.8rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  letter-spacing: 0.175em;
  color: var(--color-lp_secondary);
  position: absolute;
  top: 0;
  right: 0;
}

#lp_contents .sec_staff .befoaf_wrap .time_txt{
  position: relative;
  font-size: 1.9rem;
  line-height: 1;
  color: var(--color-lp_secondary);
  padding-right: 4rem;
}

#lp_contents .sec_staff .befoaf_wrap .time_txt:before{
  content: '';
  display: block;
  width: 3rem;
  height: 1.5rem;
  background-image: url(../img/arrow_2.svg);
  background-size: 3rem 1.5rem;
  background-repeat: no-repeat;
  transform: rotate(-90deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

/*------------ pick_wrap ------------*/
#lp_contents .sec_staff .pick_wrap{
  margin: 12rem auto 0;
}

#lp_contents .sec_staff .pick_wrap .flex_inner{
  gap: 8rem;
  margin: 5rem auto 0;
}

#lp_contents .sec_staff .pick_wrap .img_blk{
  width: 46rem;
}

#lp_contents .sec_staff .pick_wrap .item_blk{
  width: 46rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

#lp_contents .sec_staff .pick_wrap .item_blk figure{
  width: 22rem;
  margin: 0 auto 2rem;
}


/* sec_limited
==================================*/

#lp_contents .sec_limited .lead{
  margin: 3rem auto 0;
}

#lp_contents .sec_limited .limited_wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8rem;
}

#lp_contents .sec_limited .limited_wrap .item_container{
  margin-top: 4rem;
}

#lp_contents .sec_limited .limited_wrap .item_detail{
  display: grid;
  gap: 1rem;
}

#lp_contents .sec_limited .limited_wrap .item_detail .limited{
  font-size: 1.1rem;
  color: var(--color-lp_primary);
  letter-spacing: 0.175em;
}

#lp_contents .sec_limited .limited_wrap .item_detail .item_name{
  font-size: 1.8rem;
}

#lp_contents .sec_limited .limited_wrap .item_detail .item_price{
  font-size: 1.4rem;
  margin-top: 0;
}

#lp_contents .sec_limited .limited_wrap .item_list{
  display: flex;
  margin: 2rem auto 0;
}

#lp_contents .sec_limited .limited_wrap .item_list .img{
  width: 30rem;
  height: 35rem;
  margin: auto;
}

#lp_contents .sec_limited .limited_wrap .item_list .item_10 .img{
  width: 36rem;
}

#lp_contents .sec_limited .limited_wrap .item_list .item_name{
  margin-top: 2rem;
}

#lp_contents .sec_limited .limited_wrap .item_list .item_11 .link_btn,
#lp_contents .sec_limited .limited_wrap .item_list .item_12 .link_btn{
  width: 25rem;
}

#lp_contents .sec_limited .cmpn_area{
  margin-top: 12rem;
}

#lp_contents .sec_limited .all_btn{
  display: grid;
  gap: 2rem;
  margin-top: 6rem;
}


/*--------------------------------
            Responsive
 --------------------------------*/

@media screen and (max-width: 1600px){
  html {
    font-size: calc(10 * (100vw / 1600));
  }
}

/*--------------------------------
            Layout  SP
 --------------------------------*/
@media (max-width: 767px) {

  html {
    font-size: calc(10 * (100vw / 430));
  }

  #share{
    left: 5% !important;
    right: auto !important;
  }

  #FooterWrap {
    margin-top: -3rem;
  }

  #lp_contents{
    font-size: 1.4rem;
  }
  #lp_contents .sp_only{display: block;}
  #lp_contents .pc_only{display: none;}

  #lp_contents p {
    font-size: 1.4rem;
  }
  #lp_contents small.note{
    margin-top: 1.5rem;
    font-size: 1rem;
  }
  #lp_contents .lp_inner{
    gap: 8rem;
  }

  /*------------ text ------------*/
  #lp_contents .ttl{
    font-size: 1.5rem;
    margin-bottom: 2rem;
  }
  #lp_contents .main_ttl{
    font-size: 2.4rem;
    margin-bottom: 4rem;
  }
  #lp_contents .sub_ttl{
    margin: 0 auto 3rem;
  }
  #lp_contents .sub_ttl_txt{
    font-size: 2.2rem;
  }
  #lp_contents .lead{
    font-size: 1.6rem;
  }
  #lp_contents .item_txt{
    font-size: 1.3rem;
  }

  /*------------ btn ------------*/
  #lp_contents .link_btn{
    width: 30rem;
    height: 4.6rem;
  }

  #lp_contents .all_btn{
    margin: 6rem auto 0;
  }

  #lp_contents .all_btn a{
    width: 39rem;
    height: 6rem;
    gap: 1rem;
    font-size: 1.5rem;
  }

  #lp_contents .all_btn img{
    width: 10.5rem;
  }

  /*------------ cmpn_area ------------*/
  #lp_contents .cmpn_area{
    width: 33rem;
    padding: 2rem;
    margin: 5rem auto 0;
  }

  #lp_contents .cmpn_area .cmpn_txt{
    font-size: 1.5rem;
  }

  #lp_contents .cmpn_area .cmpn_day{
    font-size: 1.4rem;
  }

  #lp_contents .cmpn_area .cmpn_day big{
    font-size: 1.8rem;
  }

  #lp_contents .cmpn_area .cmpn_day small{
    font-size: 1rem;
  }

  /*------------ nav_area ------------*/
  #lp_contents .nav_area ul{
    gap:1.5rem 2rem;
  }

  #lp_contents .nav_area a{
    min-width: 18.5rem;
    font-size: 1.4rem;
  }

  #lp_contents .nav_area a:before{
    width: 0.8rem;
    height: 0.64rem;
  }

  #lp_contents .follow.nav_area ul{
    flex-wrap: nowrap;
  }

  #lp_contents .follow.nav_area a{
    padding: 0 1.5rem 1rem;
    font-size: 1.3rem;
    min-width: fit-content;
  }

  #lp_contents .nav_img{
    width: 9rem;
    right: 1rem;
    bottom: 1rem;
  }


  /* sec_mv
  ==================================*/

  #lp_contents .sec_mv .lead{
    margin-top: 5rem;
  }

  #lp_contents .sec_mv .nav_area{
    margin: 6rem auto 0;
  }


  /* sec_about
  ==================================*/

  #lp_contents .sec_about .img_wrap{
    width: 100%;
    position: static;
  }

  #lp_contents .sec_about .txt_wrap{
    width: 100%;
    background-image: url(../img/brand_bg_sp.jpg);
    padding: 6rem 2rem;
  }

  #lp_contents .sec_about .txt_wrap .about_lead{
    font-size: 2.2rem;
    margin-bottom: 3rem;
  }

  #lp_contents .sec_about .txt_wrap .about_txt{
    font-size: 1.3rem;
  }


  /* sec_item
  ==================================*/

  /*------------ item_wrap ------------*/
  #lp_contents .sec_item .item_wrap{
    padding-top: 12rem;
  }

  #lp_contents .sec_item .item_wrap .flex_inner{
    gap: 3rem;
  }

  /*img_blk*/
  #lp_contents .sec_item .item_wrap .img_blk{
    width: 30rem;
  }

  /*item_blk*/
  #lp_contents .sec_item .item_wrap .item_blk{
    width: 100%;
  }

  #lp_contents .sec_item .item_wrap .item_blk_inner{
    gap: 3rem;
  }

  #lp_contents .sec_item .item_wrap .item_ttl{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
  }

  #lp_contents .sec_item .item_wrap .item_ttl_txt{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    font-size: 1.8rem;
  }

  #lp_contents .sec_item .item_wrap .item_ttl_txt small{
    font-size: 1rem;
  }

  #lp_contents .sec_item .item_wrap .tag_list{
    margin: 2rem auto 0;
  }

  #lp_contents .sec_item .item_wrap .color_list ul{
    gap: 3rem;
  }

  #lp_contents .sec_item .item_wrap .color_list li{
    width: 6rem;
    font-size: 1rem;
    gap:1rem;
  }

  #lp_contents .sec_item .item_wrap .color_list img{
    width: 100%;
  }

  /*------------ detail_wrap ------------*/
  #lp_contents .sec_item .detail_wrap{
    width: 39rem;
    padding: 3rem;
    margin: 4rem auto 0;
  }

  /*point_blk*/
  #lp_contents .sec_item .detail_wrap .point_blk{
    width: 100%;
    padding-right: 0;
    padding-bottom: 2.5rem;
    margin-right: 0;
    margin-bottom: 3rem;
    background-image : linear-gradient(to right, var(--color-lp_gray) 2px, transparent 2px);
    background-size: 4px 1px;
    background-repeat: repeat-x;
    background-position: left bottom
  }

  #lp_contents .sec_item .detail_wrap .point_blk ul{
    gap: 1rem;
  }

  #lp_contents .sec_item .detail_wrap .point_blk li{
    background-size: 1.5rem;
    background-position: top 0.5rem left;
    font-size: 1.3rem;
  }

  /*key_blk*/
  #lp_contents .sec_item .detail_wrap .key_blk .key_lead{
    font-size: 1.3rem;
  }

  #lp_contents .sec_item .detail_wrap .key_blk ul{
    gap: 1rem;
  }

  #lp_contents .sec_item .detail_wrap .key_blk li{
    font-size: 1.3rem;
  }

  #lp_contents .sec_item .detail_wrap .key_blk figure{
    width: 8rem;
    font-size: 1rem;
  }

  /*------------ rcmd_item_wrap ------------*/
  #lp_contents .sec_item .rcmd_item_container{
    margin: 8rem auto 0;
  }

  #lp_contents .sec_item .rcmd_item_wrap .item_blk{
    width: 39rem;
  }

  #lp_contents .sec_item .rcmd_item_wrap figure{
    width: 18.5rem;
  }

  /*------------ bnr_blk ------------*/
  #lp_contents .sec_item .bnr_blk{
    width: 39rem;
    margin: 6rem auto 0;
  }


  /* sec_staff
  ==================================*/

  #lp_contents .sec_staff{
    padding: 8rem 0;
  }

  /*------------ staff_prof ------------*/
  #lp_contents .sec_staff .staff_prof{
    width: 33rem;
  }

  #lp_contents .sec_staff .staff_prof .img_blk{
    width: 9rem;
  }

  #lp_contents .sec_staff .staff_prof .staff_name{
    font-size: 1.1rem;
  }

  #lp_contents .sec_staff .staff_prof .nayami{
    font-size: 1.2rem;
  }

  #lp_contents .sec_staff .staff_prof .nayami_txt{
    font-size: 1.2rem;
  }

  /*------------ use_item_wrap ------------*/
  #lp_contents .sec_staff .use_item_wrap{
    width: 39rem;
    padding: 3rem 1rem;
    margin: 4rem auto 0;
  }

  #lp_contents .sec_staff .use_item_wrap .item_ttl{
    font-size: 1.5rem;
  }

  #lp_contents .sec_staff .use_item_wrap ul{
    gap: 0;
  }

  #lp_contents .sec_staff .use_item_wrap li{
    width: 18.5rem;
    flex-wrap: wrap;
  }

  #lp_contents .sec_staff .use_item_wrap .img_blk{
    width: 18.5rem;
  }

  #lp_contents .sec_staff .use_item_wrap .txt_blk{
    margin: auto;
  }

  #lp_contents .sec_staff .use_item_wrap .link_btn{
    width: 15rem;
    height: 3.6rem;
  }

  /*------------ befoaf_wrap ------------*/
  #lp_contents .sec_staff .befoaf_wrap{
    margin: 6rem auto 0;
  }

  #lp_contents .sec_staff .befoaf_wrap ul{
    margin: 4rem auto 0;
  }

  #lp_contents .sec_staff .befoaf_wrap li{
    width: 100%;
  }

  #lp_contents .sec_staff .befoaf_wrap .img{
    width: 27rem;
    margin: auto;
  }

  #lp_contents .sec_staff .befoaf_wrap .time_txt{
    padding-right: 0;
    padding-bottom: 3rem;
  }

  #lp_contents .sec_staff .befoaf_wrap .time_txt:before{
    transform: rotate(0);
    top: auto;
    bottom: 0;
    left: 0;
  }

  /*------------ pick_wrap ------------*/
  #lp_contents .sec_staff .pick_wrap{
    margin: 7rem auto 0;
  }

  #lp_contents .sec_staff .pick_wrap .main_ttl{
    margin-bottom: 3rem;
  }

  #lp_contents .sec_staff .pick_wrap .flex_inner{
    gap: 4rem;
    margin: 3rem auto 0;
  }

  #lp_contents .sec_staff .pick_wrap .img_blk{
    width: 27rem;
  }

  #lp_contents .sec_staff .pick_wrap .item_blk{
    width: 39rem;
    padding: 3rem;
  }


  /* sec_limited
  ==================================*/

  #lp_contents .sec_limited .lead{
    margin: 2rem auto 0;
  }

  #lp_contents .sec_limited .limited_wrap{
    gap: 6rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_container{
    margin-top: 3rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_detail .limited{
    font-size: 1rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_list{
    gap: 2rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_list .img{
    width: 18.5rem;
    height: auto;
  }

  #lp_contents .sec_limited .limited_wrap .item_list .item_10 .img{
    width: 22rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_list .item_name{
    margin-top: 1rem;
  }

  #lp_contents .sec_limited .limited_wrap .item_list .item_11 .link_btn,
  #lp_contents .sec_limited .limited_wrap .item_list .item_12 .link_btn{
    width: 18.5rem;
  }

  #lp_contents .sec_limited .cmpn_area{
    margin-top: 8rem;
  }

  #lp_contents .sec_limited .all_btn{
    gap: 1.5rem;
    margin-top: 4rem;
  }
}