@charset "utf-8";

@media (max-width: 960px) {
  main {
    width: 100%;
  }

  .page_top {
    width: 100%;
  }

  .introduction_name {
    font-size: 1.5rem;
    line-height: 1.5rem;
  }
  .tel_rate,
  .mail_rate {
    font-size: 1rem;
    line-height: 1rem;
  }
  .tel_rate::before,
  .mail_rate::before {
    width: 1rem;
    height: 1rem;
    background-size: cover;
  }
  .satisfaction_level {
    font-size: 1rem;
    line-height: 1rem;
  }
}

@media (max-width: 768px) {
  .page_top {
    width: auto;
    margin: 0;
  }
  .cuddle_top_slides {
    margin-top: 0;
  }
  main {
    width: 100%;
  }
  .img_part {
    width: 100%;
  }
  .slide_common_bgimg {
    width: 100%;
    height: auto;
  }
  .section_title {
    font-size: 4.5rem;
    line-height: 4.5rem;
    padding: 0.5rem;
  }
  .telop_wrapper {
    font-size: 3rem;
    line-height: 3rem;
  }
  .telop {
    text-wrap: nowrap;
  }
  .topic_item {
    height: auto;
    padding: 10px 0;
  }
  .topic_date,
  .topic_msg {
    font-size: 3rem;
    line-height: 3rem;
    height: auto;
  }
  .and_more_link {
    font-size: 3rem;
    line-height: 3rem;
    height: auto;
    padding-top: 10px;
  }
  .search_keyword {
    height: 5rem;
  }
  .search_button {
    height: 5rem;
  }
  .diviner_search_button {
    height: 5rem;
  }
  .search_btn_img {
    height: 5rem;
    width: 5rem;
  }
  .submit_genre {
    font-size: 3rem;
    margin-top: 10px;
  }
  .submit_diviner_genre {
    font-size: 3rem;
  }
  .introduction_card {
    padding: 18px 0;
    margin-bottom: 10px;
  }
  .introduction_img {
    width: 100%;
  }
  .introduction_name {
    font-size: 3rem;
    line-height: 3rem;
  }
  .tel_rate,
  .mail_rate {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }
  .tel_rate::before,
  .mail_rate::before {
    width: 2.5rem;
    height: 2.5rem;
    background-size: cover;
  }
  .satisfaction_level {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }
  .intro_link_common,
  .diviner_intro_link_common {
    font-size: 3rem;
  }
  .intro_link_common::before,
  .diviner_intro_link_common::before {
    width: 3rem;
    height: 3rem;
  }
  .intro_link_common_white {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }

  .intro_link_common_white:nth-of-type(n + 2) {
    margin-top: 8px;
  }

  .intro_link_common_sp_window {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }

  .intro_link_common_sp_window:nth-of-type(n + 2) {
    margin-top: 8px;
  }
  .intro_link_common_white::before {
    width: 2.5rem;
    height: 2.5rem;
  }
  .intro_link_common_sp_window::before {
    width: 2.5rem;
    height: 2.5rem;
  }
  .pagination {
    margin: 2.5rem 0;
    font-size: 3.5rem;
    line-height: 3.5rem;
    letter-spacing: 2rem;
  }
  .pagenate {
    font-size: 3rem;
  }
  .step_title {
    font-size: 2.5rem;
    line-height: 2.5rem;
    margin-top: 2rem;
  }
  .step_message {
    font-size: 2rem;
    line-height: 2.5rem;
    margin-top: 1rem;
  }
  .question {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }
  .answer {
    font-size: 2rem;
    line-height: 2rem;
  }
  .about_title {
    margin-top: 2rem;
    font-size: 2.75rem;
    line-height: 2.75rem;
  }
  .about_message {
    font-size: 2rem;
    line-height: 2.5rem;
  }
  .cuddle_youtube {
    width: 100%;
  }
  .introduction_link:hover,
  .tel_link:hover,
  .mail_link:hover {
    border-bottom: none;
  }

  .counselor_genre:active {
    color: #ffffff;
    border: 1px solid #ffffff;
    background-color: #3cd5af;
  }
  .diviner_genre:active {
    color: #ffffff;
    border: 1px solid #ffffff;
    background-color: #c59ee2;
  }

  .font-size_1dot25rem {
    font-size: 2.5rem;
  }
  .margin-top_1dot5vw {
    margin-top: 2vw;
    margin-bottom: 2vw;
  }

  .genre_wrapper {
    padding: 2vw 5% 2vw 5%;
  }
  .star_img {
    width: 12.5px;
    height: 12.5px;
    transform: translateY(-1.2px);
  }
}