body {
    background-color: #e7f6ff !important;
}

#wrapper {
    width: 100vw;
    max-width: 600px;
    margin: 0 auto;
    background: #e7f6ff;
}

#wrapper img {
    display: block;
    object-fit: cover;
    height: auto;
}

#wrapper a {
    display: block;
    cursor: pointer;
}
  
main {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    }

main p, dt, dd{
    font-size: 1.2em;
}

main .fv {
    width: 100%;
}

main .ranking {
    position: relative;
    width: 100%;
    aspect-ratio: 1125/1612;
    background: url("../img/ranking.png") center/cover;
}
_::-webkit-full-page-media, _:future, :root main .ranking {
    padding-top: 143.3%;
    aspect-ratio: unset;
}

main .ranking .r_btn_1 {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    width: 90%;
    aspect-ratio: 243/20;
}
_::-webkit-full-page-media, _:future, :root main .ranking .r_btn_1 {
    padding-top: 8.2%;
    aspect-ratio: unset;
}

main .ranking .r_btn_willbe {
    bottom: calc(560/860*100%);
}

main .ranking .r_btn_rize {
    bottom: calc(430/860*100%);
}

main .ranking .r_btn_frey {
    bottom: calc(300/860*100%);
}

main .ranking .r_btn_2 {
    position: absolute;
    right: 5%;
    width: 16%;
    aspect-ratio: 91/54;
}

main .ranking .r_btn_jenny {
    bottom: calc(215/860*100%);
}

main .ranking .r_btn_eminal {
    bottom: calc(130/860*100%);
}

main .ranking .r_btn_regina {
    bottom: calc(40/860*100%);
}

main .point {
    width: 100%;
    margin-bottom: 20px;
}

main .point h2 {
    margin: 20px 0px;
}

main .point .point_common {
    margin-bottom: 50px;
}

main .point .point_common p {
    margin: 0px auto;
    width: 90%;
}

main .point .point_box {
    border: solid 1px #FF4D7F;
    border-radius: 10px;
    margin: 0 auto 40px;
    width: 95%;
}
main .point .point_box:last-child {
    margin: 0 auto;
}

main .point .point_box .pb_title {
    background-color: #FF4D7F;
    border-radius: 10px 10px 0 0;
    max-height: 56px;
    padding: 10px 0;
}

main .point .point_box .pb_title h4 {
    font-size: 1.3em;
    color: #fff;
    text-align: center;
}

#wrapper main .point .point_box .pb_title h4 img {
  display: inline-block;
  height: 30px;
  object-fit: contain;
  margin: 0 auto;
  vertical-align: top;
}

main .point .point_box .point_float {
  background-color: #fff;
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  padding: calc(20/600*100%);
}

main .point .point_box .point_float .space {
    float: right;
}

main .point .point_box .point_float .space_1 {
    height: 4.0em
}

main .point .point_box .point_float .space_2 {
    height: 4.0em
}

main .point .point_box .point_float .space_3 {
    height: 4.0em
}

main .point .point_box .point_float img {
    width: 24%;
    float: right;
    clear: both;
}

@media screen and (min-width:1160px) {
    main .point .point_box .point_float .space_1 {
      height: 5.5em
    }
    main .point .point_box .point_float .space_2 {
      height: 3.5em
    }
    main .point .point_box .point_float .space_3 {
      height: 7em
    }
}

main .ranking_table {
    position: relative;
    width: 100%;
    aspect-ratio: 375/778;
    background: url("../img/ranking_table.png") center/cover;
    margin-bottom: 25px;
}
_::-webkit-full-page-media, _:future, :root main .ranking_table {
    padding-top: 207.5%;
    aspect-ratio: unset;
}

main .ranking_table .rt_icon {
    position: absolute;
    top: 23%;
    width: 20%;
    aspect-ratio: 227/218;
}
_::-webkit-full-page-media, _:future, :root main .ranking_table .rt_icon {
  /*
    padding-top: 96%;
    aspect-ratio: unset;
   */
}

main .ranking_table .rt_icon_willbe {
    background: url("../img/rt_icon_willbe.png") center/contain no-repeat;
    left: 27.5%;
}

main .ranking_table .rt_icon_rize {
    background: url("../img/rt_icon_rize.png") center/contain no-repeat; 
    left: 50.5%;
}

main .ranking_table .rt_icon_frey {
    background: url("../img/rt_icon_frey.png") center/contain no-repeat;
    left: 73.5%;
}

main .ranking_table .rt_btn {
    position: absolute;
    bottom: 3.5%;
    width: 20%;
    aspect-ratio: 13/5;
}
_::-webkit-full-page-media, _:future, :root main .ranking_table .rt_btn {
  /*
    padding-top: 38.5%;
    aspect-ratio: unset;
   */
}

main .ranking_table .rt_btn_willbe {
    background: url("../img/rt_btn_willbe.png") center/contain no-repeat;
    left: 27.0%;
}

main .ranking_table .rt_btn_rize {
    background: url("../img/rt_btn_rize.png") center/contain no-repeat;
    left: 50.2%;
}

main .ranking_table .rt_btn_frey {
    background: url("../img/rt_btn_frey.png") center/contain no-repeat;
    left: 73.5%;
}

main .ranking_top6 {
  width: 100%;
}

main .ranking_top6 h2 {
  margin-bottom: 25px;
}

main .ranking_top6 .ranking-wrap {
  margin-bottom: 80px;
}

main .ranking_top6 .ranking-wrap.first .layout-adjust {
  margin-top: -28px;
}
main .ranking_top6 .ranking-wrap.second .layout-adjust {
  margin-top: -15px;
}
main .ranking_top6 .ranking-wrap.third .layout-adjust {
  margin-top: -30px;
}


.btn_official {
    text-align: center;
    aspect-ratio: 685/146;
    margin: -18rem auto 2rem;
    position: relative;
}
_::-webkit-full-page-media, _:future, :root .btn_official {
    padding-top: 19.2%;
    aspect-ratio: unset;
}
.btn_willbe {
    background: url("../img/no1_btn_240823.png") center/contain no-repeat;
}
.btn_rize {
    background: url("../img/no2_btn.png") center/contain no-repeat;
}
.btn_frey {
    background: url("../img/no3_btn.png") center/contain no-repeat;
}
.btn_jenny {
    background: url("../img/no4_btn.png") center/contain no-repeat;
}
.btn_eminal{
    background: url("../img/no5_btn.png") center/contain no-repeat;
}
.btn_regina{
    background: url("../img/no6_btn.png") center/contain no-repeat;
}

.animate {
  animation-iteration-count: infinite;
animation-name: dokidoki;
animation-fill-mode: both;
animation-duration: 1s;
}
@keyframes dokidoki {
  0% {
      transform: scale3d(1, 1, 1)
  }
  50% {
      transform: scale3d(1.05, 1.05, 1.05)
  }
  100% {
      transform: scale3d(1, 1, 1)
  }
}
/* ↑↑↑ 東京の高評価医療脱毛ランキングTOP7 ↑↑↑ */

/* ↓↓↓ カテゴリー別おすすめランキング ↓↓↓ */
main .category_rank {
  margin-bottom: 25px;
  width: 100%;
}

main .category_rank h2 {
  margin: 0 auto;
  width: 90%;
}

main .category_rank .ranking_wrap{
    margin: calc(50/600*100%) 0;
}
main .category_rank .ranking_wrap img{
    padding: 0 calc(50/600*100%);
   margin: 0 auto;
}
main .category_rank .ranking_flex{
    display: flex;
    justify-content: center;
    width: 15%;
    margin: 10px auto 0;
    gap: 100px;
    position: relative;
}
@media screen and (min-width: 1160px) {
  main .category_rank .ranking_flex {
    gap: 80px;
  }
}
.icon {
    text-align: center;
    width: 28.5%;
    aspect-ratio: 208/137;
}
_::-webkit-full-page-media, _:future, :root .icon {
    padding-top: 18.8%;
    aspect-ratio: unset;
}
.icon_willbe {
    background: url("../img/rr_icon_willbe.png") center/contain no-repeat;
}
.icon_rize {
    background: url("../img/rr_icon_rize.png") center/contain no-repeat;
}
.icon_frey {
    background: url("../img/rr_icon_frey.png") center/contain no-repeat;
}
.icon_jenny {
    background: url("../img/rr_icon_jenny.png") center/contain no-repeat;
}
.icon_eminal {
    background: url("../img/rr_icon_eminal.png") center/contain no-repeat;
}
.icon_regina {
    background: url("../img/rr_icon_regina.png") center/contain no-repeat;
}
main .category_rank .flex_icon{
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: -10px;
}
/* ↑↑↑ カテゴリー別おすすめランキング ↑↑↑ */

footer {
  margin: 80px auto 160px;
  width: 100%;
}

footer .request {
  aspect-ratio: 680/63;
  background: url("../img/btn_request.png") center/contain no-repeat;
  margin: 1rem auto;
  text-align: center;
  width: 95%;
}
_::-webkit-full-page-media, _:future, :root footer .request {
padding-top: 9.3%;
aspect-ratio: unset;
}


@media screen and (max-width: 600px) {
  main .point .point_box .pb_title {
    max-height: 40px;
  }
  #wrapper main .point .point_box .pb_title h4 img {
    height: 20px;
  }
  main .point .point_box .point_float .space_1,
  main .point .point_box .point_float .space_2,
  main .point .point_box .point_float .space_3 {
  }
  main .point .point_box .point_float img {
    width: 30%;
  }
  main .ranking_top6 .ranking-wrap.first .layout-adjust {
      margin-top: -18px;
  }
  main .ranking_top6 .ranking-wrap.second .layout-adjust {
      margin-top: -10px;
  }
  main .ranking_top6 .ranking-wrap.third .layout-adjust {
      margin-top: -18px;
  }
  .btn_official {
    margin: -12rem auto 2rem;
  }
  main .category_rank .ranking_flex {
    gap: 60px;
  }
  footer {
      margin: 80px auto 80px;
  }
}
