body {
/* font-family: "Noto Sans JP"; */
font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
margin: 0;
    padding: 0;
}
h3 {
  text-align: center;
  /* font-family:  "Noto Sans JP"; */
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
    font-size: medium;
}
img {
    width: 100%;
    margin: 0;
    padding: 0;
}
.pc-display {display: none;}
.sp-diplay {display: block;}

.coupon {
  text-align: center;
}

.coupon p {
  font-size: 12px;
}

#sec01_cam2023 .coupon img {
  width: 80%;
}

#main_visual_cam2023 {
    width: 100%;
    margin: 0;
    padding: 0;
}
.tokuten {
    max-width: 350px;
    margin: 0 auto 1em;
    display: block;
}
.tokuten05 {
  max-width: 82px;
  margin: 0 auto 1em;
  display: block;
}
.img05_round_cam2023 {
  border-radius: 10px;
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .2);
}
.main_visual_img_cam2023 {
    width: 100%;
    margin: 0;
    padding: 0;
}
.wrap_cam2023 {
    width: 96%;
    margin: 3em auto;
    padding: 2em 1em;
    box-sizing: border-box;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .2);
}
.wrap_cam2023 img {
    width: 100%;
}
.img_box01_cam2023 {
  width: 100%;
}
.img_box01_cam2023 img {
  width: 90%;
  display: block;
  margin: 0 auto 0 0;
}

.img_box03_cam2023 {
  margin: 3em auto 0;
}
.img_box03_cam2023 img {
  width: 80%;
  display: block;
  margin: 0 auto 0 0;
}

.img_box02_cam2023 {
  margin: 3em auto 0;
}
.img_box02_cam2023 img {
  width: 80%;
  display: block;
  margin:0 0 0 auto;
}
.img_text01_cam2023 {
  position: relative;

}
.title_product_cam2023 {
    margin-bottom: 1em;
    font-family: 'Noto Serif Display', serif;
    color: darkgray;
    margin: 0 auto 1em;
}
.title_product_cam2024 {
  margin-bottom: 1em;
  text-align: center;
  font-family: 'Noto Serif Display', serif;
    color: darkgray;
    margin: 0 auto;
}
.large_cam2023 {
    font-size: 16pt;
}
.small_cam2023 {
    font-size: 12pt;
}
.extra_large_cam2023 {
    font-size: 3rem;
}
.explain_product_cam2023 {
    margin-top: 1em;
    font-size: 11pt;
}
.explain_product_cam2024 {
    margin-top: 1em;
    font-size: 11pt;
}


.wrap_list_cam2023 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 96%;
    gap:1%;
    flex-wrap: wrap;
    margin: 3em auto;
    text-align: center;
    font-size: 10pt;
}
.btn_cam2023 img:hover {
  transition: 0.5s ;
  opacity: 0.8 ;
}
.list_box_cam2023,
.list_box_cam2023_3col {
    width: 48%;
}
.list_box_cam2023 img,
.list_box_cam2023_3col img {
    width: 98%;
}

.btn_odougu_cam2023 {
    width: 100%;
    position: relative;
    display: inline-block;
    margin: 1em 0 3em;
    padding: 1em;
    text-decoration: none;
    text-align: center;
    color: #FFF;
    background: #03A9F4;
    border: solid 1px #0f9ada;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
    text-shadow: 0 1px 0 rgba(0,0,0,0.2);
    box-sizing: border-box;
}

.btn_set_cam2023 {
    width: 100%;
    position: relative;
    display: inline-block;
    margin: 1em 0;
    padding: 1em;
    text-decoration: none;
    text-align: center;
    color: #FFF;
    background: #03A9F4;
    border: solid 1px #0f9ada;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
    text-shadow: 0 1px 0 rgba(0,0,0,0.2);
    box-sizing: border-box;
}

.btn_odougu_cam2023:active {
  border: solid 1px #03A9F4;
  box-shadow: none;
  text-shadow: none;
}
.wrap_sec05_cam2023 {
    width: 96%;
    margin: 3em auto;
    padding: 0;
    border-radius: 10px;
}
.odougu_midashi_cam2023 {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1%;
  margin: 2em auto 4em;
}
.odougu_midashi_cam2023 img {
  width: 30%;
  display: block;
  margin: 1em auto 0;
}
.howto_cam2023 dl {
  width: 100%;
  margin: 2em auto 0;
  padding: o;
}
.howto_cam2023 dt {
  width: 100%;
  margin: 0 auto;
  padding: .3rem 0;
  text-align: center;
  position: relative;

}
.howto_cam2023 dt:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  /*border-radius: 3px;*/
  background: #ececec;
}
.howto_cam2023 dd {
  width: 100%;
  margin: 2em auto;
  padding: 0;
  text-align: center;
}


.sakura {
  position: absolute;
  padding: 0;
  margin: 0;
  width: 96%;
  height: 200%;
  display: flex;
  justify-content: center;
  align-items: center;
    overflow: hidden;
}

.sakura li{
  position: absolute;
  list-style: none;
  top: -50px;
  background: #ffdbed;
  border-radius: 0% 70%;  
  animation: fall 4s linear infinite, sway 2s ease-in-out infinite alternate;
}


@keyframes fall {
  to {
    top: 120%;
  }
}

@keyframes sway1 {
  from {
    transform: translateX(0px) rotate(0deg);
  }
  to {
    transform: translateX(200px) rotate(-45deg);
  }
}

@keyframes sway2 {
  from {
    transform: translateX(200px) rotate(-45deg);
  }
  to {
    transform: translateX(0px) rotate(0deg);
  }
}

.sakura li:nth-child(1){
  left: 0%;
  width: 24px;
  height: 15px;
  animation: fall 10s linear infinite,
             sway1 3s ease-in-out infinite alternate;
  animation-delay: 2s;
}

.sakura li:nth-child(2){
  left: 5%;
  width: 13px;
  height: 9px;
  animation: fall 15s linear infinite,
             sway1 2s ease-in-out infinite alternate;
  animation-delay: 8s;
}

.sakura li:nth-child(3){
  left: 15%;
  width: 16px;
  height: 10px;
  animation: fall 9s linear infinite,
             sway1 3.5s ease-in-out infinite alternate;
  animation-delay: 13s;
}

.sakura li:nth-child(4){
  left: 30%;
  width: 16px;
  height: 10px;
  animation: fall 8s linear infinite,
             sway2 4s ease-in-out infinite alternate;
  animation-delay: 7s;
}
.sakura li:nth-child(5){
  left: 40%;
  width: 16px;
  height: 10px;
  animation: fall 10s linear infinite,
             sway1 4s ease-in-out infinite alternate;
  animation-delay: 0s;
}
.sakura li:nth-child(6){
  left: 55%;
  width: 24px;
  height: 15px;
  animation: fall 11s linear infinite,
             sway2 3s ease-in-out infinite alternate;
  animation-delay: 3s;
}
.sakura li:nth-child(7){
  left: 65%;
  width: 16px;
  height: 10px;
  animation: fall 7s linear infinite,
             sway2 3.5s ease-in-out infinite alternate;
  animation-delay: 7s;
}
.sakura li:nth-child(8){
  left: 50%;
  width: 13px;
  height: 9px;
  animation: fall 7s linear infinite,
             sway1 3s ease-in-out infinite alternate;
  animation-delay: 3s;
}
.sakura li:nth-child(9){
  left: 80%;
  width: 16px;
  height: 10px;
  animation: fall 10s linear infinite,
             sway2 4s ease-in-out infinite alternate;
  animation-delay: 4s;
}

.btn_cam2023 {
    width: 100%;
    display: block;
    padding: .5em 0;
    text-align: center;
    font-size: small;
    /*background-color: #f6f6f6;*/
}

.cam_end {
    background-color: #ccc;
}
.cam_end img {
  opacity: 0.5;
}








@media only screen and (min-width: 768px){
    
    .pc-display {display:block;}
    .sp-display {display:none;}
    h3 {
  text-align: center;
  font-family:  "Noto Sans JP";
    font-size: 20pt;
    }
    
    .wrap_cam2023,.wrap_sec05_cam2023 {
        width: 65%;
        margin: 2em auto;
    }
    .wrap_cam2023 img {
        width: 100%;
    }
    .wrap_cam2023 .img_content_cam2023 {
      width: 75%;
      max-width: 850px;
      display: block;
      margin: 0 auto;
    }

    .coupon p {
      font-size: 20px;
    }

    .img_box01_cam2023 {
      width: 100%;
      display: block;
      margin: 0 auto 0 0;
    }
    .img_box03_cam2023 {
      width: 100%;
    }

    .img_box02_cam2023 {
      width: 100%;
    }
    .title_product_cam2023 {
     
    }
    .img_box02_cam2023 img {
        width: 65%;
        display: block;
        margin: 0 0 0 auto;
        
    }
    .img_text02_cam2023 {
      width: 70%;
      margin: 0 0 0 auto;
    }
    .img_box01_cam2023 {
      width: 100%;
    
  }
  .img_box01_cam2023 img {
      width: 85%;
      display: block;
      margin: 0 auto 0 0;
  }

  .img_box03_cam2023 {
    width: 100%;
  
}
.img_box03_cam2023 img {
    width: 65%;
    display: block;
    margin: 0 auto 0 0;
}

  .img_text01_cam2023 {
  
  }
  .explain_product_cam2023 {
    width: 80%;
    margin-top: 1em;
    font-size: normal;
  }
  .explain_product_cam2024 {
    width: 100%;
    max-width: 1300px;
    text-align: center;
    margin-top: 1em;
    font-size: normal;
  }
  .large_cam2023 {
    font-size: 3rem;
}
.small_cam2023 {
    font-size: 14pt;
}
.extra_large_cam2023 {
    font-size: 4rem;
}

    .btn_odougu_cam2023 {
        width: 60%;
        display: block;
        margin: 1em auto;
    }
    .btn_odougu_cam2023 {
        width: 60%;
        display: block;
        margin: 1em auto;
    }
    .box_dogu_cam2023 {
      width: 80%;
      margin: 2em auto 4em;
    }
    .box_set_cam2023 {
      width: 90%;
      margin: 2em auto 4em auto;
    }

    .btn_set_cam2023 {
        width: 90%;
        display: block;
        margin: 1em auto;
    }
    .btn_set_cam2023 {
        width: 90%;
        display: block;
        margin: 1em auto;
    }
    .wrap_list_cam2023 {
        margin: 3em auto;
        display: flex;
        justify-content: center;
        align-items: center;
        gap:2%;
    }
    .list_box_cam2023 {
        width: 23%;
    }
    .list_box_cam2023_3col {
        width: 30%;
    }
    .list_box_cam2023 img,
    .list_box_cam2023_3col img  {
      width: 100%;
    }
    .howto_cam2023 {
      width: 60%;
      margin: 0 auto;
    }
    .odougu_midashi_cam2023 img {
      width: 30%;

    }
    .sakura {
      width: 100%;
    }
  
    
}