@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@200..700&display=swap');

body{
-webkit-print-color-adjust: exact;
color:#232584;
font-family: "Noto Sans JP", sans-serif,YuGothic, "Yu Gothic Medium", "Yu Gothic", 游ゴシック, "Hiragino Kaku Gothic ProN", メイリオ, meiryo, sans-serif;
-webkit-text-size-adjust: 100%;
line-height:1.8em;
text-align:center;
}
html{
  -webkit-font-smoothing: antialiased;
}

/* リンク */
a:link{
color:#232584;
text-decoration:none;
}
a:visited{
color:#232584;
text-decoration:none;
}
a:hover {
color:#232584;
text-decoration:none;
}
a:active {
color:#232584;
text-decoration:none;
}
a.link-fade,.link-fade a{
  opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
  transition-property: opacity,filter;
  transition: 0.2s linear;
}
a.link-fade:hover,.link-fade a:hover{
  opacity:.6;filter: alpha(opacity=60);-ms-filter: "alpha(opacity=60)";
}
a.link-underline,.link-underline a{
  text-decoration: underline;
}
a.link-underline:hover,.link-underline a:hover{
text-decoration:none;
}

.wrapper{
  width:100%;
  overflow-x: hidden;
  font-weight: bold;
  background-color: #F69DAF;
}

.image{
  font-size: 0;
  line-height: 0;
}
.image img{
  max-width: 100%;
  height: auto;
}
.txt-image{
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0;
  line-height: 0;
}

/* font
----------------------- */
.font-en{
  font-family: "Oswald", sans-serif;
  letter-spacing: 0.05em;
}
.en-Up{
  text-transform: uppercase;
}
.dot-text{
  position: relative;
}
.dot-text::before{
    position: absolute;
    top: -0.2em;
    left: 0;
    right: 0;
    margin: auto;
    content: "";
    padding-top: 0.2em;
    background: -webkit-radial-gradient(circle 0.2em,#FFFF00 50%,transparent 50%);
    background: radial-gradient(circle 0.2em,#FFFF00 50%,transparent 50%);
    background: -moz-radial-gradient(circle 0.2em,#FFFF00 50%,transparent 50%);
  }

/* color
----------------------- */
.color-blue,.color-blue a,a .color-blue{color: #097ACD}
.color-green,.color-green a,a .color-green{color: #72CE72}
.color-orange,.color-orange a,a .color-orange{color: #F7A90B}
.color-pink,.color-pink a,a .color-pink{color: #FF5888}
.color-white,.color-white a,a .color-white{color: #fff}
.color-yellow,.color-yellow a,a .color-yellow{color: #FFFF00}

/* .image-e
----------------------- */
.image-e img{
  opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
  transition-property: opacity,filter;
  transition: 0.2s linear;
}
.image-e:hover img{
  opacity:.6;filter: alpha(opacity=60);-ms-filter: "alpha(opacity=60)";
}
/* .image-z
----------------------- */
.image-z {
  font-size: 0;
  line-height: 0;
  text-align: center;
}
.image-z img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}
.image-z__hover {
  transform: scale(1);
  transition-property: transform,-webkit-transform;
  transition: 0.3s ease;
}
a:hover .image-z__hover {
  transform: scale(1.04);
  transform-origin: 50% 50%;
}

.show{display: block !important;}
.hide{display: none !important;}

/* ========================================================
animation
======================================================== */
/* .move-slide-up
----------------------- */
.fameIn-slide-up{
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
}
.move-slide-up{
  animation: slide-up 0.8s ease-in-out 1 alternate;
  opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
}
@keyframes slide-up {
  0% {
    transform:translate(0, 5%);
    opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
  }
  100% {
    transform:translate(0, 0);
    opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
  }
}
/* .move-float
----------------------- */
.move-float{
  animation: float 3s ease-in-out infinite alternate;
}
@keyframes float {
  0% {
    transform:translate(0, 0);
  }
  50% {
    transform:translate(0, -2%);
  }
  100% {
    transform:translate(0, 0);
  }
}
/* .move-pop
----------------------- */
.move-pop{
  animation: pop 0.4s ease-out 1;
  transform-origin: 50% 50%;
}
@keyframes pop {
  0%,100% {
    transform: scale(1.0);
  }
  50% {
    transform: scale(1.1);
  }
}

@media print, screen and (min-width:768px){
body{
 min-width:1000px;
}
.spVer{
  display: none !important;
}
.caption{
  line-height: 1.6em;
  font-size: 12px;
}
}

@media screen and (max-width: 767px){
body{
 font-size:4vw;
  line-height: 1.6em;
}
.pcVer{
  display: none !important;
}
.caption{
  line-height: 1.6em;
  font-size: 3vw;
}
.wrapper{
  overflow-x: hidden;
}
}
/* ========================================================
.header-area
======================================================== */
.header-area{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
    z-index: 200;
}
.modalFlag .header-area{
  z-index:auto;
}
.header-inner{
  width: 100%;
  position: relative;
}
/*  .sp-menu-bt
----------------------- */
.sp-menu-bt{
  position: absolute;
  right: 0;
  top: 0;
    z-index: 3;
}
.sp-menu-bt .sp-menu__trigger,
.sp-menu-bt .sp-menu__trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.sp-menu-bt .sp-menu__trigger {
  position: relative;
  width: 10.75vw;
  height: 13.3vw;
  text-decoration: none;
  text-align: left;
  background-color: #FF5888;
}
.sp-menu-bt.active .sp-menu__trigger{
  background-color: #fff;
}
.sp-menu-bt .sp-menu__trigger span {
  position: absolute;
  right: 2vw;
  width: 6.75vw;
  height: 1vw;
  background-color: #fff;
}
.sp-menu-bt.active  .sp-menu__trigger span {
  background-color: #FF5888;
}
.sp-menu-bt .sp-menu__trigger span:nth-of-type(1) { top: 3vw;}
.sp-menu-bt .sp-menu__trigger span:nth-of-type(2) { top: 5vw;}
.sp-menu-bt .sp-menu__trigger span:nth-of-type(3) { top: 7vw;}
.sp-menu-bt.active .sp-menu__trigger span:nth-of-type(1) {
  transform: translateY(2.1vw) rotate(-45deg);
}
.sp-menu-bt.active .sp-menu__trigger span:nth-of-type(2) {
  opacity: 0;
}
.sp-menu-bt.active .sp-menu__trigger span:nth-of-type(3) {
  transform: translateY(-2.1vw) rotate(45deg);
}
.sp-menu-bt .sp-menu__trigger:after{
  font-family: "Oswald", sans-serif;
  content: "MENU";
  color: #fff;
  font-size: 2.5vw;
  line-height: 1em;
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 3.8em;
}
.sp-menu-bt.active .sp-menu__trigger:after{
  content: "CLOSE";
  color: #FF5888;
}
@media screen and (min-width: 768px){
  .sp-menu-bt{
    display: none;
  }
}
.header-navi-wrap{
  height: 100vh;
  background: url("../image/menu_bg.gif") no-repeat;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
      display:flex;
    justify-content: center;
    align-items: center;
    opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
    position: relative;
    z-index: 2;
}
.header-navi-wrap.start{
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
}
.header-navi-image{
  max-width: 92%;
  margin: 0 auto;
}
.header-navi-box{
  background-color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 2em 2.5em 3em;
  border-radius: 1.5em;
  margin: 3em auto 0;
}
.header-navi-box__ttl{
  font-size: 25px;
}
.header-navi-box__list{
  text-align: left;
  margin-top: 2em;
}
.header-navi-box__list li{
  border-bottom: solid 1px #FF5888;
}
.header-navi-box__list li a{
  display: block;
  padding: 1em 0.2em;
}
@media print, screen and (min-width:1200px){
  .header-navi-wrap{
    width: calc((100% - 400px)/2);
  }
}
@media print, screen and (max-width:1199px){
  .header-navi-wrap{
    width: calc(100% - 480px);
  }
}
@media print, screen and (min-width:768px){
  .header-navi-wrap{
    position: absolute;
    display: flex!important;
    left: 0;
    top: 0;
  }
  .header-navi-box{
    font-size: 14px;
    max-width: 320px;
  }
  .header-entry a{
    width: 80%;
    max-width: 400px;
    margin: 30px auto 0;
    display: block;
  }
}
@media screen and (max-width: 767px){
  .header-navi-wrap{
    width: 100vw;
    background: rgba(255,88,136,0.9);
    padding: 15vw 10vw 0;
    font-size: 3.5vw;
    line-height: 1.4em;
    display: block;
  }
  .header-navi-box{
    margin-top: 0;
  }
  .header-navi-box__list li a{
    padding: 0.8em 0;
  }
  .header-entry{
    position: fixed;
    display: none;
    width: 90%;
    bottom: 0;
    left: 5vw;
  }
}
/* ========================================================
.content-area
======================================================== */
.content-inner{
  text-align: left;
}
@media print, screen and (min-width:768px){
  .content-area{
    width: 400px;
    margin: 0 auto;
  }
}
@media print, screen and (max-width:1199px){
  .content-area{
    margin: 0 80px 0 auto;
  }
}
@media screen and (max-width: 767px){
  .content-area{
    width: 100%;
  }
}
/* .quadrice-list
----------------------- */
.quadrice-list{
  margin-top: 0.8em;
  font-size: 14px;
}
.quadrice-list li{
  text-indent: -1.2em;
  padding-left: 1.2em;
}
.quadrice-list li::before{
  content: "■";
  display: inline-block;
  width: 1.2em;
  text-indent: 0;
}
@media screen and (max-width: 767px){
  .quadrice-list{
    font-size: 3.5vw;
  }
}
/* ========================================================
.mv-area
======================================================== */
.mv-area{
  padding-top: 18%;
  position: relative;
}
.modalFlag .mv-area{
  overflow: hidden;
}
.mv-area .mv-area__mainttl{
  background: url("../image/mv_ttl.png") center top no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  padding-bottom: 24%;
  transform:translate(-100%, 0);
}
.mv-area .mv-area__mainttl.start{
  animation: move__mv-area__mainttl 1s ease-in-out 1 alternate;
  transform:translate(0, 0);
}
@keyframes move__mv-area__mainttl {
  0% {transform:translate(-100%, 0);}
  100% {transform:translate(0, 0);}
}
#mvAnimation-1,#mvAnimation-2{
  position: absolute;
}
.mv-slide-up{
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
}
#mvAnimation-1-3,#mvAnimation-2-4{
  position: absolute;
  z-index: 2;
  width: 296px;
  left: 140px;
  top: 240px;
}
#mvAnimation-3-1{
  position: absolute;
  left: 0;
  bottom: -136px;
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
  transition-property: opacity,bottom;
  transition: 0.8s linear;
}
#mvAnimation-3-1.start{
  opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
  bottom: 0;
}
#mvAnimation-3-2{
  position: absolute;
  left: 0;
  bottom: -136px;
}
.mv-entry{
  width: 96.25%;
  margin: 0 auto;
  position: relative;
  z-index: 5;
  height: 135px;
}
@media screen and (max-width: 767px){
  #mvAnimation-1-3,#mvAnimation-2-4{
    width: 74vw;
    left: 35vw;
    top: 60vw;
  }
  #mvAnimation-3-1{
    bottom: -33.75vw;
  }
  .mv-entry{
    height: 33.75vw;
  }
}
/* ========================================================
campaign
======================================================== */
.campaign-area .content-inner{
  background-color: #FFFF00;
  width: 97%;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 2em 0.7em 1em;
  border-radius: 1.8em;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 767px){
}
/* .campaign-list
----------------------- */
.campaign-list{
  margin-top: 10%;
}
.campaign-list .campaign-list__detail{
  display: block;
  position: relative;
  margin-top: 3%;
}
.campaign-list .campaign-list__detail::before,.campaign-list .campaign-list__detail::after{
  content: "";
  display: block;
  background-color: #fff;
  height: 1px;
  width: 1.08em;
  position: absolute;
  right: 0.6em;
  top: 1.3em;
  pointer-events: none;
}
.campaign-list .campaign-list__detail::after{
  transform: rotate(90deg);
  transition-property: transform;
  transition: 0.2s linear;
}
.campaign-list .campaign-list__detail.open::after{
  transform: rotate(0deg);
}
.campaign-list__headline a{
  display: block;
  color: #fff;
  background-color: #232584;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0.5em 1.3em;
  cursor: pointer;
  font-size: 16px;
}
.campaign-list__headline a strong{
  text-decoration: underline;
  color: #FFFF00;
}
.campaign-list__answer{
  background-color: #fff;
  position: relative;
  line-height: 1.6em;
  padding: 1em 1.4em;
  word-break:break-all;
  color: #333333;
  font-size: 12px;
}
.campaign-list__answer p:not(:first-of-type){
  margin-top: 1.2em;
}
.campaign-list__close{
  text-align: center;
  margin-top: 1em;
}
.campaign-list__close a{
  color: #fff;
  background-color: #232584;
  position: relative;
  border-radius: 9999px;
  display: block;
  padding: 0.7em;
  font-size: 16px;
}
.campaign-list__close a::before,
.campaign-list__close a::after{
  content: "";
  display: block;
  background-color: #fff;
  width: 1.08em;
  height: 1px;
  position: absolute;
  left: calc(50% - 3.5em);
  top: 1.3em;
}
.campaign-list__close a::before{
  transform: rotate(45deg);
}
.campaign-list__close a::after{
  transform: rotate(-45deg);
}
@media screen and (max-width: 767px){
  .campaign-list__headline a{
    font-size: 4vw;
  }
  .campaign-list__answer{
    font-size: 3vw;
  }
  .campaign-list__close a{
    font-size: 4vw;
  }
}
.campaign-caption{
  margin: 1em 1em 0;
}
/* .campaign-entry
----------------------- */
.campaign-entry{
  text-align: center;
}
.campaign-entry a{
  color: #fff;
  background-color: #ff5888; /*#96DCD2*/
  position: relative;
  border-radius: 9999px;
  display: block;
  padding: 0.7em;
  margin: 1em;
  font-size: 15px;
}
.campaign-entry a::after{
  content: "";
  background: url("../image/ic_arrow.png") center center no-repeat;
  -moz-background-size: 60% auto;
  background-size: 60% auto;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 1em;
  top: calc(50% - 15px);
  transition-property: right;
  transition: 0.2s linear;
}
.campaign-entry a:hover::after{
  right: 0.5em;
}
@media screen and (max-width: 767px){
  .campaign-entry li::after{
    width: 7.3vw;
    height: 7.3vw;
    top: calc(50% - 3.65vw);
  }
}
/* ========================================================
.pickup-area
======================================================== */
.pickup-area{
  padding: 30% 0 20%;
  position: relative;
}
.pickup-area .content-inner{
  width: 90%;
  margin: 0 auto;
}
.pickup-area::after{
  content: "";
  display: block;
  z-index: 2;
  background: url("../image/pickup_foot.png") top center no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  height: 0;
  padding-bottom: 18.25%;
  position: absolute;
  left: 0;
  bottom: -70px;
}
.pickup-area .pickup-area__mainttl{
  background: url("../image/pickup_ttl.png") center top no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  padding-bottom: 38.2%;
}
.pickup-list{
  border-top:solid 1px #fff;
  list-style: none;
  counter-reset: chapter;
  margin-top: 35px;
}
.pickup-list li{
  border-bottom:solid 1px #fff;
  position: relative;
}
.pickup-list li::before{
  counter-increment: chapter;
  content: counter(chapter, decimal-leading-zero);
  color: #fff;
  text-decoration: underline;
  font-family: "Oswald", sans-serif;
  letter-spacing: 0.05em;
  pointer-events: none;
  position: absolute;
  left: 10px;
  top: 25px;
  font-size: 22px;
}
.pickup-list li::after{
  pointer-events: none;
  content: "";
  display: block;
  background: url("../image/ic_arrow.png") center center no-repeat;
  -moz-background-size: 60% auto;
  background-size: 60% auto;
  border-radius: 9999px;
  border: solid 1px #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0;
  top: calc(50% - 15px);
  animation: pickup-float 0.5s ease-in-out infinite alternate;
}
@keyframes pickup-float {
  0% {
    transform:translate(0, 0);
  }
  100% {
    transform:translate(-20%, 0);
  }
}
.pickup-list li:nth-of-type(1){
  background: url("../image/pickup_img_01.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 13.8% auto;
  background-size: 13.8% auto;
}
.pickup-list li:nth-of-type(2){
  background: url("../image/pickup_img_02.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 13.8% auto;
  background-size: 13.8% auto;
}
.pickup-list li:nth-of-type(3){
  background: url("../image/pickup_img_03.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 13.8% auto;
  background-size: 13.8% auto;
}
.pickup-list li a{
  display: block;
  text-align: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 65px 0 27px 10px;
}
.bt-life{
  margin-top: 16%;
}
.bt-life a{
  display: block;
}
@media screen and (max-width: 767px){
  .pickup-area::after{
    bottom: -17.5vw;
  }
  .pickup-list li::before{
    font-size: 5.8vw;
    left: 2.5vw;
    top: 4.8vw;
  }
  .pickup-list li::after{
    width: 7.3vw;
    height: 7.3vw;
    top: calc(50% - 3.65vw);
  }
  .pickup-list li a{
    padding: 14vw 0 6.7vw 2.5vw;
  }
}
/* ========================================================
.point-area
======================================================== */
.point-area{
  position: relative;
}
.point-area .content-inner{
  width: 80%;
  margin: 0 auto;
}
.point-kv{
  margin: 8% 0 5%;
}
.point-kv__caption{
  margin-top: 1em;
  font-size: 14px;
  line-height: 1.8em;
}
.point-shop{
  position: relative;
}
.point-shop__image{
  position: absolute;
  right: -3%;
  bottom: 0;
  width: 31.25%;
}
.point-lead{
  text-align: center;
  border-radius: 9999px;
  border: solid 1px #232584;
  margin-top: 4.5em;
  font-size: 15px;
}
.point-lead + *{
  margin-top: 1em;
}
.point-borderheadline{
  display: inline-block;
  border: solid 1px #fff;
  border-radius: 9999px;
  padding: 0.2em 1em;
  font-size: 15px;
}
.point-material{
  text-align: center;
  margin: 1em 0;
}
.point-area .content-inner .caption{
  margin-top: 1em;
}
@media screen and (max-width: 767px){
  .point-kv__caption{
    font-size: 3.5vw;
  }
  .point-lead{
    font-size: 3.75vw;
  }
}
/* point-01
----------------------- */
.point-01{
  background-color: #59D390;
  color: #fff;
  padding: 40% 0 30%;
}
.point-01::after{
  content: "";
  display: block;
  z-index: 2;
  background: url("../image/point_01_foot.png") top center no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  height: 0;
  padding-bottom: 21%;
  position: absolute;
  left: 0;
  bottom: -70px;
}
.point-01 .point-lead{
  background-color: #FFFF00;
  color: #232584
}
.point-01-decision{
  margin-top: 3em;
}
.point-01-decision__text{
  margin: 2em 0 1.5em;
}
.point-01-decision__text strong{
  display: inline-block;
  line-height: 1.2em;
  background-color: #fff;
  color: #59D390;
}
.point-01__place{
  margin: 0 -12.5%;
}
@media screen and (max-width: 767px){
  .point-01::after{
    bottom: -17.5vw;
  }
}
/* point-02
----------------------- */
.point-02{
  background-color: #FFD200;
  padding: 35% 0 20%;
}
.point-02::after{
  content: "";
  display: block;
  z-index: 2;
  background: url("../image/point_02_foot.png") top center no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  height: 0;
  padding-bottom: 18.875%;
  position: absolute;
  left: 0;
  bottom: -60px;
}
.point-02 .point-lead{
  background-color: #32A5E6;
  color: #fff
}
@media screen and (max-width: 767px){
  .point-02::after{
    bottom: -17.5vw;
  }
}
/* point-03
----------------------- */
.point-03{
  background-color: #63BFFC;
  padding: 40% 0 20%;
  color: #fff;
}
.point-03::after{
  content: "";
  display: block;
  z-index: 2;
  background: url("../image/point_03_foot.png") top center no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  height: 0;
  padding-bottom: 18.875%;
  position: absolute;
  left: 0;
  bottom: -60px;
}
.point-03 .point-lead{
  background-color: #FFFF00;
  color: #232584
}
.point-03-borderbox{
  border: solid 1px #fff;
  margin-top: 3em;
  padding: 0.8em;
  line-height: 1.6em;
  font-size: 14px;
}
.point-03-borderbox strong{
  font-size: 16px;
}
.point-03-borderbox .caption{
  margin-top: 0.5em;
}
@media screen and (max-width: 767px){
  .point-03::after{
    bottom: -17.5vw;
  }
  .point-03-borderbox{
    font-size: 3.5vw;
  }
  .point-03-borderbox strong{
    font-size: 4vw;
  }
}
/* ========================================================
life-area
======================================================== */
.life-area{
  background: url("../image/life_bg.png") #FF5888;
  padding: 35% 0;
}
.life-area .content-inner{
  width: 90%;
  margin: 0 auto;
}
/* .life-point-list
----------------------- */
.life-point-list{
  margin-top: 10%;
}
.life-point-list li{
  position: relative;
  background-color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 1.3em;
      display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 1em;
    border: solid 0.26em #232584;
    border-bottom: solid 0.52em #232584;
  margin-top: 4%;
  color: #FF5888;
  font-size: 15px;
  height: 204px;
}
.life-point-list li .image{
  position: absolute;
  width: 71%;
  top: -1%;
  right: -5%;
}
.life-point-list__price{
  line-height: 1.4em;
  position: relative;
}
.life-point-list__price strong{
  display: block;
  margin-top: 0.2em;
  font-size: 18px;
}
.life-point-list__price strong small{
  display: inline-block;
  vertical-align: top;
  transform: scale(0.45,0.6);
  transform-origin: 0% 50%;
}
.life-point-list__price strong small.em4{
  margin-right: -2em;
}
.life-point-list__price strong small.em3{
  margin-right: -1.5em;
}
.life-point-list__price::after{
  content: "";
  display: block;
  background: url("../image/life_ic_arrow.png") no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 1.1em;
  height: 1.1em;
  position: absolute;
  left: 2em;
  bottom: -1.8em;
}
.life-point-list__point{
  font-weight: bold;
  display: inline-block;
  width: 50%;
}
.life-point-list__point strong{
  display: inline-block;
  line-height: 1.3em;
  font-size: 25px;
}
.life-point-list__point strong .font-en{
  font-size: 40px;
}
.life-point-list__point strong .point{
display: inline-block;
  transform: scale(0.8,1);
  transform-origin: 0% 50%;
  margin-right: -0.8em;
}
.life-point-list__point .underline{
  border-bottom: solid 2px #FF5888;
}
@media screen and (max-width: 767px){
  .life-point-list li{
    font-size: 3.75vw;
    height: 51vw;
  }
  .life-point-list__price strong{
    font-size: 4.5vw;
  }
  .life-point-list__point strong{
    font-size: 6.2vw;
  }
  .life-point-list__point strong .font-en{
    font-size: 10vw;
  }
}
/* .life-point-formula__box
----------------------- */
.life-point-formula{
  margin-top: 12.5%;
}
.life-point-formula__box{
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #fff;
  text-align: center;
  position: relative;
  border-radius: 1em;
  padding: 1em 0;
  margin-top: 35px;
}
.life-point-formula__box + .life-point-formula__box{
  margin-top: 140px;
}
.life-point-formula__box + .life-point-formula__box::before{
  content: "";
  display: block;
  background: url("../image/life_ic_plus.png") center center no-repeat;
  -moz-background-size: auto 42.8%;
  background-size: auto 42.8%;
  width: 100%;
  position: absolute;
  left: 0;
  top: -140px;
  height: 140px;
}
.life-point-formula__unit{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
}
.life-point-formula__unit li{
  width: 33.3%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right:solid 2px #FF5888;
}
.life-point-formula__unit li:last-child{
  border-right:none;
}
.life-point-formula__unit li p{
  font-size: 17px;
  line-height: 1.4em;
  height: 2.8em;
      display:flex;
    justify-content: center;
    align-items: center;
}
.life-point-formula__unit li .image{
  width: 86px;
  margin: 10px auto 0;
}
.life-point-formula__point{
  margin-top: 10%;
}
.life-point-formula__lead{
  font-size: 17px;
  line-height: 1.4em;
  margin-bottom: 1.5em;
}
@media screen and (max-width: 767px){
  .life-point-formula__box{
    margin-top: 8.7vw;
  }
  .life-point-formula__box + .life-point-formula__box{
    margin-top: 35vw;
  }
  .life-point-formula__box + .life-point-formula__box::before{
    top: -35vw;
    height: 35vw;
  }
  .life-point-formula__unit li p{
    font-size: 4.25vw;
    line-height: 1.4em;
  }
  .life-point-formula__unit li .image{
    width: 21.5vw;
  }
  .life-point-formula__lead{
    font-size: 4.25vw;
    line-height: 1.4em;
  }
}
/* .life-point-get
----------------------- */
.life-point-get{
  background: url("../image/point_get_img.png") center bottom no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
}
.life-point-get::before{
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 15.125%;
  background: url("../image/life_ic_equal.png") center top no-repeat;
  -moz-background-size: auto 100%;
  background-size: auto 100%;
  margin: 8% 0;
}
.life-point-get__detail{
  background-color: rgba(244,244,244,0.9);
  line-height: 1.8em;
  padding: 2em 0;
  margin: 82% 0 0;
  font-size: 14px;
}
.life-point-get .caption{
  text-align: left;
  width: 80%;
  margin: 20% auto 0;
}
@media screen and (max-width: 767px){
  .life-point-get__detail{
    font-size: 3.5vw;
  }
}
/* ========================================================
.application-area
======================================================== */
.application-area{
  background-color: #FFFFC8;
  padding: 25% 0;
  position: relative;
}
.application-area::before{
  content: "";
  display: block;
  z-index: 2;
  background:url("../image/application_head.png") center bottom no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  height: 0;
  width: 100%;
  padding-bottom: 18.75%;
  position: absolute;
  left: 0;
  top: -60px;
}
.application-area .content-inner{
  width: 80%;
  margin: 0 auto;
}
.application-material{
  font-size: 18px;
  margin-top: 0.85em;
  text-align: center;
}
.application-bt{
  margin-top: 1em;
}
.application-bt a{
  display: block;
  background-color: #FF5888;
  color: #fff;
  border-radius: 9999px;
  text-align: center;
  position: relative;
  padding: 0.6em 0;
  font-size: 15px;
}
.application-bt a::after{
  content: "";
  display: block;
  position: absolute;
  background: url("../image/ic_arrow.png") center center no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 1.4em;
  height: 1.4em;
  right: 1em;
  top: calc(50% - 0.7em);
  transition-property: right;
  transition: 0.2s linear;
}
.application-bt a:hover::after{
  right: 0.5em;
}
.application-area .caption{
  margin-top: 1em;
}
@media screen and (max-width: 767px){
  .application-area::before{
    top: -17.5vw;
  }
  .application-material{
    font-size: 4.5vw;
  }
  .application-bt a{
    font-size: 3.7vw;
  }
}
/* ========================================================
.qaa-area
======================================================== */
.qaa-area{
  padding: 25% 0;
}
.qaa-area .content-inner{
  width: 90%;
  margin: 0 auto;
}
.qaa-ttl{
  text-align: center;
  color: #fff;
  font-size: 24px;
}
@media screen and (max-width: 767px){
  .qaa-ttl{
    font-size: 6vw;
  }
}
/* .qaa-list
----------------------- */
.qaa-list{
  margin-top: 10%;
}
.qaa-list .qaa-list__detail{
  display: block;
  position: relative;
  margin-top: 3%;
}
.qaa-list .qaa-list__detail::before,.qaa-list .qaa-list__detail::after{
  content: "";
  display: block;
  background-color: #fff;
  height: 1px;
  width: 1.08em;
  position: absolute;
  right: 0.6em;
  top: 1.3em;
  pointer-events: none;
}
.qaa-list .qaa-list__detail::after{
  transform: rotate(90deg);
  transition-property: transform;
  transition: 0.2s linear;
}
.qaa-list .qaa-list__detail.open::after{
  transform: rotate(0deg);
}
.qaa-list__headline a{
  display: block;
  color: #fff;
  background-color: #FF5888;
  text-indent: -1.3em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0.5em 2.5em;
  cursor: pointer;
  font-size: 16px;
}
.qaa-list__headline a::before{
  content: "Q.";
  width: 1.3em;
  display: inline-block;
  text-indent: 0;
}
.qaa-list__answer{
  background-color: #fff;
  position: relative;
  line-height: 1.6em;
  padding: 0.6em 1em 0.6em 2.8em;
  word-break:break-all;
  font-size: 14px;
}
.qaa-list__answer::before{
  content: "A.";
  width: 1.3em;
  display: block;
  text-indent: 0;
  position: absolute;
  left: 1.5em;
  top: 0.6em;
}
.qaa-list__answer p:not(:first-of-type){
  margin-top: 1.2em;
}
@media screen and (max-width: 767px){
  .qaa-list__headline a{
    font-size: 4vw;
  }
  .qaa-list__answer{
    font-size: 3.5vw;
  }
}
/* ========================================================
.notes-area
======================================================== */
.notes-area{
  padding: 25% 0;
  background-color: #fff;
}
.notes-ttl{
  text-align: center;
  font-size: 28px;
}
.notes-area .content-inner{
  width: 80%;
  margin: 0 auto;
}
.notes-list{
  margin-top: 2em;
  line-height: 1.9em;
  padding-left: 1.5em;
  font-size: 12px;
}
@media screen and (max-width: 767px){
  .notes-ttl{
    font-size: 7vw;
  }
  .notes-list{
    font-size: 3vw;
  }
}
/* ========================================================
.pc-pickup
======================================================== */
.pc-pickup.pickup-area{
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  padding: 0;
  width: calc((100% - 400px) / 2);
      display:flex;
    justify-content: center;
    align-items: center;
}
.pc-pickup.pickup-area .pc-pickup__inner{
  position: relative;
}
.pc-pickup.pickup-area .pc-pickup__inner::before,
.pc-pickup.pickup-area .pc-pickup__inner::after{
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
}
.pc-pickup.pickup-area .pc-pickup__inner::before{
  background: url("../image/point_02_kv.png") no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 135px;
  height: 95px;
  left: -75px;
  top: -95px;
}
.pc-pickup.pickup-area .pc-pickup__inner::after{
  background: url("../image/point_01_kv.png") no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 220px;
  height: 190px;
  right: -155px;
  top: -85px;
}
.pc-pickup.pickup-area::after{display: none;}
.pc-pickup.pickup-area .pickup-list{
  max-width: 336px;
  margin: 24px auto 0;
}
.pc-pickup.pickup-area .pickup-list li::before{
  top: calc(50% - 0.8em);
  left: 10px;
  font-size: 20px;
}
.pc-pickup.pickup-area .pickup-list li::after{
  width: 24px;
  height: 24px;
  top: calc(50% - 12px);
}
.pc-pickup.pickup-area .pickup-list li a{
  padding: 24px 0 24px 40px;
}
.pc-pickup.pickup-area .pickup-list li:nth-of-type(1){
  background: url("../image/pickup_img_01.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 10.8% auto;
  background-size: 10.8% auto;
}
.pc-pickup.pickup-area li:nth-of-type(2){
  background: url("../image/pickup_img_02.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 10.8% auto;
  background-size: 10.8% auto;
}
.pc-pickup.pickup-area li:nth-of-type(3){
  background: url("../image/pickup_img_03.png") calc(100% - 10%) center no-repeat;
  -moz-background-size: 10.8% auto;
  background-size: 10.8% auto;
}
.pc-pickup.pickup-area .bt-life{
  max-width: 336px;
  text-align: right;
  position: relative;
  margin: 10% auto 0;
}
.pc-pickup.pickup-area .bt-life::before,
.pc-pickup.pickup-area .bt-life::after{
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
}
.pc-pickup.pickup-area .bt-life::before{
  background: url("../image/pickup_pc_img_leftbottom.png") no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 100px;
  height: 97px;
  left: -55px;
  top: 0;
}
.pc-pickup.pickup-area .bt-life::after{
  background: url("../image/life_point_img_04.png") no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 250px;
  height: 200px;
  right: -195px;
  top: -170px;
}
.pc-pickup.pickup-area .bt-life a{
  max-width: 290px;
  margin-left: auto;
}
@media screen and (max-width: 1349px){
  .pc-pickup.pickup-area .bt-life{
    text-align: center;
  }
  .pc-pickup.pickup-area .bt-life a{margin: 0 auto;}
  .pc-pickup.pickup-area .pc-pickup__inner::before,
  .pc-pickup.pickup-area .pc-pickup__inner::after,
  .pc-pickup.pickup-area .bt-life::before,
  .pc-pickup.pickup-area .bt-life::after{
    display: none;
  }
}
@media screen and (max-width: 1199px){
  .pc-pickup.pickup-area{display: none;}
}
/* ========================================================
footer
======================================================== */
.footer-logo{
  background-color: #fff;
  border-top:solid 1px #232584;
  text-align: center;
  padding: 10%;
}
.footer-logo div{
  margin-top: 5%;
}
.footer-logo div:first-child{margin-top: 0;}
.footer-logo a{
  display: inline-block;
}
.footer-logo a img{
  height: 29px;
  width: auto;
}
@media screen and (max-width: 767px){
  .footer-gotop{display: none;}
  .footer-gotop a{
    position: fixed;
    right: 5vw;
    bottom: 27vw;
    width: 10.5vw;
    height: 10.5vw;
  }
  .footer-logo a img{
    height: 7.25vw;
    width: auto;
  }
}

/* ================================================================================================================ */
/* ================================================================================================================ */
/* ================================================================================================================ */
.footer__nav {
  background-color: #eaeaf1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 8vw;
}
@media (min-width: 1000px) {
  .footer__nav {
    padding: 30px 30px 0
  }
}

.footer__nav li {
  display: block;
  width: 100%;
  text-align: left;
}
.footer__nav li:first-child{margin-top: 0;}


.footer__nav a {
  text-decoration: none;
  display: block;
  color: #000;
  font-size: 3.2vw;
  padding-left: 1em;
  position: relative
}

@media (min-width: 1000px) {
  .footer__nav a {
    font-size: 12px;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s
  }
  .footer__nav a:hover {
    opacity: 0.8
  }
}
.footer__nav a::before {
  content: '';
  display: block;
  width: 0.5em;
  height: 0.5em;
  border-top: 1px solid #00b7bd;
  border-right: 1px solid #00b7bd;
  position: absolute;
  top: calc(50% - 0.25em);
  left: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.footer__copy {
  font-size: 2.8vw;
  line-height: 1.6em;
  text-align: left;
  background-color: #eaeaf1;
  padding:1em 1.5em 30vw 1.5em;
  color: #000;
}

@media (min-width: 1000px) {
  .footer__copy {
    font-size: 11px;
    padding:10px 15px;
  }
}