@charset "utf-8";
/* CSS Document */

#ffviirig_cp_2602 {
  max-width: 500px;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
}
/* prettier-ignore */
#ffviirig_cp_2602 h1, h2, h3, h4, p {
    margin: 0;
    padding: 0;
  }
/* prettier-ignore */
#ffviirig_cp_2602 dl, dt, dd, ul, li {
    margin: 0;
    list-style: none;
    padding: 0;
  }
#ffviirig_cp_2602 img {
  max-width: 100%;
  display: block;
  height: auto;
}
#ffviirig_cp_2602 .top_bg {
  background: url(../images/top_bg.webp) no-repeat;
  background-size: 100%;
  background-position: top;
  width: 100%;
  height: 100%;
  padding: 0 0 2rem;
}
#ffviirig_cp_2602 .a-btn {
  padding: 2.5rem 0.8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
#ffviirig_cp_2602 .a-btn .abtn img {
  filter: drop-shadow(0px 0px 25px rgba(255, 255, 255, 0.7));
  will-change: filter, transform;
}

#ffviirig_cp_2602 .btn {
  background: #fff;
}
div#contents {
  background: url('../images/bg.webp');
  width: 100%;
  min-height: 100%;
  background-attachment: fixed;
  background-size: cover;
  background-position: center center;
}

#ffviirig_cp_2602 .txt-grp {
  position: relative;
}
#ffviirig_cp_2602 .txt-grp .kome.rt {
  position: absolute;
  bottom: 28%;
  right: 0;
  color: #fff;
  padding: 0 1rem;
  font-weight: 500;
  font-size: clamp(0.8rem, 1.3vw, 0.95rem);
  text-shadow: 0 0 4px black;
}

#ffviirig_cp_2602 .txt-grp .kome.cen,
#ffviirig_cp_2602 .txt-grp .cen {
  color: #000;
  position: absolute;
  top: 94%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(0.8rem, 1.3vw, 0.95rem);
  font-weight: 500;
  width: max-content;
}
#ffviirig_cp_2602 .txt-grp .cen {
  top: 92%;
}

#ffviirig_cp_2602 .txt-grp .kome::before {
  content: '\203b';
}
#ffviirig_cp_2602 .top-btn {
  background: url(../images/jelly/top_btn-bg.webp) no-repeat;
  background-size: 100%;
  background-position: center;
  width: 100%;
  height: 100%;
}
#ffviirig_cp_2602 .top-btn p {
  width: 100%;
  margin: 0 auto;
  padding: 2rem;
  box-sizing: border-box;
}
#ffviirig_cp_2602 .top-btn p img {
  will-change: filter, transform;
}
/*===============================================
●pc.css 画面の横幅が737px以上
===============================================*/
@media screen and (min-width: 737px) {
  /*common*/
  #ffviirig_cp_2602 .pc-none {
    display: none;
  }
  #ffviirig_cp_2602 .bnr_area .btn img,
  #ffviirig_cp_2602 .btn_area .btn img,
  #ffviirig_cp_2602 .top-btn img,
  #ffviirig_cp_2602 .a-btn .abtn img {
    transition: all 0.3s ease-in-out;
  }
  #ffviirig_cp_2602 .btn_area .btn img:hover,
  #ffviirig_cp_2602 .top-btn img:hover,
  #ffviirig_cp_2602 .a-btn .abtn img:hover {
    transform: scale(1.02);
    opacity: 1;
    filter: drop-shadow(0px 0px 25px rgba(255, 255, 255, 0.7));
    will-change: filter, transform;
  }
  #ffviirig_cp_2602 .bnr_area .btn img:hover {
    opacity: 0.7;
  }

  #ffviirig_cp_2602 .pin {
    background-color: #fff;
    padding: 20px 20px 5%;
  }
  .ly-contents-area {
    padding: 10px 0 0;
  }
}
/*===============================================
●sp.css  画面の横幅が736pxまで
===============================================*/
@media screen and (max-width: 736px) {
  /*common*/
  #ffviirig_cp_2602 .sp-none {
    display: none;
  }
  #ffviirig_cp_2602 .top-btn p {
    padding: 1.5rem;
  }
  #ffviirig_cp_2602 .pin {
    background-color: #fff;
    padding: 1rem;
  }
}
