@charset "Shift_JIS";

body {color: #333;}

#baby-support-member {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  text-align: center;
}
#baby-support-member .smp{display: none;}

#baby-support-member .bg_left{
  position: fixed;
 mix-blend-mode: overlay;
  top: 5vh;left: -5%;
  max-width: 683px;width: 30%}
#baby-support-member .bg_right{
  position: fixed;
 mix-blend-mode: overlay;
  top: 5vh;right: -5%;
  background-size: cover;
  max-width: 683px;width: 30%;}

  #baby-support-member img {width: 100%;}

  #baby-support-member a:hover,
  #baby-support-member a:hover img {opacity: 0.8;}
  
  #baby-support-member .flex{display: flex;justify-content: center;}
  #baby-support-member .flex_c{display: flex;flex-direction: column;}
  #baby-support-member .clm1{
    padding-top: 20px;
    width: 100%;margin: auto;    display: flex;justify-content: center;}
  #baby-support-member .wrap_12{    margin: auto;width: 100%;max-width: 980px;position: relative;}
  
  main#wrapper{padding: 0 !important;max-width: 100% !important;}

/*------------------------------------------
decolation
------------------------------------------*/
#baby-support-member #nav_area{ 
  /* background-image: url(../IMAGE/baby-support-member/border.jpg); */
  background-position: bottom;
  background-repeat: repeat-x;
}
#baby-support-member #cate1{ 
background-color: #e5b4c7;
background: linear-gradient(to top, #e9ced8, #e5b4c7);
& .c_text > p:first-of-type{color:#e5b4c7!important;}
}
#baby-support-member #cate2{ 
background-color: #c4d5d2;
background: linear-gradient(to top, #d3d9d8, #c4d5d2);
& .c_text > p:first-of-type{color:#c4d5d2!important;}
}
#baby-support-member #cate3{ 
  background-color: #e5b4c7;
  background: linear-gradient(to top, #e9ced8, #e5b4c7);
  & .c_text > p:first-of-type{color:#e5b4c7!important;}
}


/*------------------------------------------
text_deco
------------------------------------------*/
#baby-support-member .hot{    
  font-size: 1.6em;
  font-weight: 900;}
#baby-support-member .mini{font-size: 0.8em;}

#baby-support-member .bg_tex{position: absolute;color: #ffffff8a;}

/*-----*/
#baby-support-member .pkn {
  color: #dd95ad;
	display: flex;
	justify-content: center;
	align-items: center;
}

#baby-support-member .pkn::before,
#baby-support-member .pkn::after {
	content: '';
	width: 2px;
	height: 1em;
	background-color:  #dd95ad;;
}

#baby-support-member .pkn::before {
	margin-right: 1em;
	transform: rotate(-35deg)
}
#baby-support-member .pkn::after {
	margin-left: 1em;
	transform: rotate(35deg)
}



/*------------------------------------------
info
------------------------------------------*/
#baby-support-member .info{    
  display: flex;
  flex-direction: column;
  align-items: center; 
   & .pkn{color: #222 !important;margin-top: 3em;}
   & .pkn::before{background-color: #222;}
   & .pkn::after{    background-color: #222;}
  
  }

  #baby-support-member #title .info{      
    /*position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 147px;*/
    z-index: 100;}

#baby-support-member .btn_area {
  position: relative;
  display: inline-block;
  font-weight: bold; 
  line-height: 1.5;
  padding: 10px 60px 10px 70px;
  transition: 0.3s;
  text-decoration: none;
  color: #fff; 
  border-radius: 60px;
  background: #ef6e99; 
  box-shadow: 0 5px 0 #b33760;
  margin-left: 10px;
  margin-top: 20px;
}

#baby-support-member .btn_area .entry {
  font-size: 23px;
}

#baby-support-member .btn_area:hover {
  transform: translate(0, 3px);
  background: #e5759b; 
  box-shadow: 0 2px 0 #b33760;
}


/*------------------------------------------
info>fixed
---------------------------------

#baby-support-member .fixed .btn_area2:hover {
  transform: translate(0, 3px);
  background: #dd95ad; 
  box-shadow: 0 2px 0 #be303b;
}
---------*/
/*------------------------------------------
title
------------------------------------------*/
#baby-support-member #title{
  & h1{        
    width: 80%;
    margin: 0.5em auto 0;
    max-width: 776px;
    position: relative;
  z-index: 99;}
  
  }
  

/*------------------------------------------
main>nav
------------------------------------------*/
#baby-support-member #nav_area{      
  padding: 3em 0 5em;
  & p {font-size: 1.2em;        line-height: 1.2em;}
  & h2{margin-bottom: 0.5em;}}
#baby-support-member nav ul
{    justify-content: center;
  gap: 3em;
  width:70%;
  margin: auto;
  & p{ padding: 0.5em 0;}}


/*------------------------------------------
main > catebox
------------------------------------------*/

#baby-support-member .cate_box .wrap_12{     padding: 3em 0;}
#baby-support-member .cate_box .wrap_12 > div 
{    display: flex;
      justify-content: space-evenly;
      align-items: center;}

#baby-support-member .cate_box .c_image{
  width: calc(100% - 60%);    
  box-sizing: border-box;
  & img{  
    width: 90%;
    max-width: 350px;
    border-radius: 5px;
    overflow: hidden;
  }
}

#baby-support-member .cate_box .c_text{
  width: calc(100% - 40%);
    display: flex;
    flex-direction: column;
      & .pkn{color: white;}
      & > p:first-of-type{ font-size: 5em;font-weight: 900;        text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;}
      & h2{    color: white;  font-size: 2.6em; margin-bottom: 0.5em;        line-height: 1.2em;}

}

/*--cate3---*/
#baby-support-member #cate3{
  & .c_image{   animation: float 3s ease-in-out infinite;}
  
  & ul{width: 100%;gap: 1em;}
  & li{    border-radius: 90px;
    border: 4px solid white;
    display: flex;
    height: 184px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 1em;
    width: 13em;
    box-sizing: border-box;
    color: white;}
    .c2_2{max-width: 554px;
      width: 80%;
      margin: auto;}
}

@keyframes float {
  0% {
    transform: translateY(0) rotate(353deg);
  }
  50% {
    transform: translateY(-20px) rotate(353deg);
  }
  100% {
    transform: translateY(0) rotate(353deg);
  }
}

/*--cate2---*/
#baby-support-member #cate2 .clm1{
  & ul{gap: 1em;display: flex;  width: 100%;}
  & li{
        background-color: #ef6b8f;
        width: calc((100% - 2em) / 3);
        display: flex;
        flex-wrap: wrap;
      }
}
#baby-support-member #cate2 .c2_day{
  width: 100%;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; 
  & .hot{font-size: 2em !important; line-height: 1em;
    & span{font-size: 0.5em;}}
  }
#baby-support-member #cate2 .c2_text{
  /* width: 100%; */
  background-color: white;
  display: flex;
      flex-direction: column;
      justify-content: center;
      padding: .5em;
    & .hot{color: #dd95ad;line-height: 1em;font-size: 2em !important; }
}

/*------------------------------------------
.others
------------------------------------------*/
#baby-support-member .others {
  display: flex;
      flex-direction: column;
      align-items: center;
      gap: 20px;
      padding: 3em 0;
  & ul {
    display: flex;
    gap: 10px;
  }
  & .pkn{color: #222 !important;margin-top: 3em;}
  & .pkn::before{background-color: #222;}
  & .pkn::after{    background-color: #222;}
}
/* 250324 add toshima sta */
.header-info-red {
  display: none;
}
/*------------------------------------------
.confirm
------------------------------------------*/
#baby-support-member .confirm {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: -10px;
  .btn_area {
    margin-top: 5px;
    margin-left: 0;
  }
}
/*------------------------------------------
.stamp-card
------------------------------------------*/
#baby-support-member .stamp-card {
  width: 100%;
  box-sizing: border-box;
  margin-top: 3em;
  max-width: 460px;

  .title {
    color: #FFF;
    margin-bottom: 2%;
  }
  .stamp-card__inner {
    width: 100%;
    margin: 0 auto;
    .card-img {
      width: 100%;
      margin: 0 auto 3%;
      border-radius: 5px;
      overflow: hidden;
    }
    ul{
      display: flex;
      margin: 0 auto 1%;
      gap: 2px;
      li{        
        width: calc(100% / 3);
        padding: 10px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: #fbeb64;
        border-radius: 8px;
        .hot {
          margin-top: -10px;
          margin-bottom: 0;
      }
      }
    }
    & small {
      display: none;
      font-size: .8em;
    }
  }
  
}

.c_text small {
  display: block;
  font-size: .8em;
}

#baby-support-member .cate_box .wrap_12 > div.target-product {
  background: #FFF;
  border-radius: 5px;
  margin: 1.5em 0 .3em;
  flex-wrap: wrap;
  padding: 1.5em 1em 2.5em;
  box-sizing: border-box;

  .target-product__title {
    color: #d588a1;
    font-size: 1.5em;
    font-weight: 600;
    text-align: center;
    margin-bottom: .5em;
    display: block;
    width: 100%;
  }
  .target-product__content {
    display: block;
    width: 50%;

    .target-product__text {
      max-width: max-content;
      margin: 0 auto 2%;
      padding: 0 .3em .4em;
      display: flex;
      align-items: center;
      text-align: start;
    }
    .target-product__link {
      display: block;
      width: 90%;
      margin: 0 auto;
    }
    .target-product__linktext {
      color: #717171;
    }
    .target-product__btn {
      position: relative;
      background-color: #eb0012;
      color: #FFF;
      display: block;
      margin: .8em auto 0;
      padding: .8em 0;
      width: 90%;
      max-width: 500px;
      border-radius: 100vw;
      display: flex;
      justify-content: center;
      align-items: center;

      &:hover {
        color: #FFF !important;
        opacity: 1 !important;
        transform: scale(1.015);
      }

      .plazaicon-yajirusi {
        position: absolute;
        right: 3%;
        font-size: 1.5em;
        margin-top: .1em;
        background: #FFF;
        border-radius: 100vw;
        width: 1.1em;
        height: 1.1em;
        color: #eb0012;
        display: flex;
        justify-content: center;
        align-items: center;

        &:before {
          font-size: .8em;
          margin-left: .1em;
          margin-top: .1em;
        }
      }
    }
    .batch {
      display: block;
      width: 7rem;
      margin-right: .3rem;
    }
  }
  .target-product__content-1 {
    width: 30%;
    margin-top: 1rem;
  }
  .target-product__content-2 {
    width: 60%;
  } 
}
#baby-support-member .flex li {
  flex: 1;
}
/* 250324 add toshima end */

/* 250626�lj� */
#baby-support-member .item_area{
  margin-top: 1em;
}
#baby-support-member .item_area .kome{
  color: #eb0012;
  margin-bottom: 1em;
  font-size: .8em;
}
#baby-support-member .item_area ul{
  display: flex;
  gap: 18px;
}
#baby-support-member .item_area .list{
  border: solid 2px #e377a0;
  box-sizing: border-box;
  border-radius: 15px;
  padding: 1%;
  width: 100%;
  background-color: #fff;
}

#baby-support-member .item_area .flex{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1%;
}
#baby-support-member .item_area .btn{
  position: relative;
  /* background: #1051c9; */
  box-sizing: border-box;
  border-radius: 5px;
  /* color: #fff; */
  border-radius: 5px;
  color: #1051c9;
  border: 1px solid #1051c9;
  width: 100%;
}
#baby-support-member .item_area .btn a{
  display: block;
  width: 100%;
  padding: .5em 0;
}
#baby-support-member .item_area .btn a:hover{
  color: #FFF !important;
  opacity: 1;
  background-color: #1051c9;
}
#baby-support-member .item_area .btn::after{
position: absolute;
right: 2rem;
bottom: 0;
top: 0;
display: block;
content: "";
width: .4em;
height: .4em;
margin: auto;
transform: rotate(45deg);
border-top: 3px solid #1051c9;
border-right: 3px solid #1051c9;
transition: .2s;
}
#baby-support-member .item_area .btn:hover::after{
  border-top: 3px solid #FFF;
  border-right: 3px solid #FFF;
}
#baby-support-member .item_area .sokyu{
  background: #eb0012;
  align-items: center;
  padding: 0 4%;
  color: #fff;
}
#baby-support-member .item_area .price{
  color: #eb0012;
  font-weight: 700;
  font-size: 1.5rem;
}

/* �ŝ��ݝ흜 */
#baby-support-member .intax{
  display: none;
}
#baby-support-member .buy_price>ol .spesicalprice, .buy_price>ul .spesicalprice {
  display: none;
}