@charset "utf-8";

@media (max-width: 768px) {
  /* ----------------
common
------------------*/
  .all_wrap {
    min-width: 320px;
  }

  .sp_content {
    display: block;
  }

  .sp_none {
    display: none;
  }

  .btn01 {
    width: 100%;
    max-width: 315px;
    padding: 2rem 1rem;
  }

  .container {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .pc-order-01,
  .pc-order-02 {
    order: unset;
  }

  /* ----------------
header
------------------*/
  header.main-header {
    padding: 0 1.5rem;
  }

  header h1 {
    width: calc(221 / 375 * 100vw);
  }

  /* btn */
  .openbtn {
    width: 50px;
    height: 50px;
  }

  .openbtn span {
    left: 13px;
  }

  .openbtn span:nth-of-type(1) {
    top: 17.5px;
  }
  .openbtn span:nth-of-type(2) {
    top: 24.5px;
  }
  .openbtn span:nth-of-type(3) {
    top: 31.5px;
  }

  .openbtn.active span:nth-of-type(1) {
    top: 17.5px;
    transform: translateY(6px) rotate(-135deg);
    width: 25px;
  }

  .openbtn.active span:nth-of-type(3) {
    top: 29.5px;
    transform: translateY(-6px) rotate(135deg);
    width: 25px;
  }

  #facility .facility_link {
    width: 48%;
  }

  /* ----------------
top
------------------*/
  .mv_inner {
    margin-left: calc(37 / 375 * 100vw);
  }

  .title {
    top: calc(19 / 375 * 100vw);
    left: calc(14.6 / 375 * 100vw);
    width: calc(98.35 / 375 * 100vw);
  }

  .mv_inner .pagination {
    left: calc(-32 / 375 * 100vw);
  }

  .mv_inner .pagination span {
    font-size: 10px;
  }

  #scrollDown {
    left: calc(-26 / 375 * 100vw);
  }

  /* ----------------
about
------------------*/
  section.about_wrap {
    padding-top: max(calc(88 / 375 * 100vw), 88px);
  }

  .about_title h2 img {
    width: calc(86 / 375 * 100vw);
  }

  .about_title h2::after {
    width: calc(171.68 / 375 * 100vw);
    height: calc(103 / 375 * 100vw);
    background-size: 100%;
    bottom: 0;
    right: 53%;
  }

  .about_summary {
    padding: 1.2rem 0 3rem;
  }

  /* ----------------
model_course
------------------*/
  .mc_sendai .mc_heading h3 {
    width: calc(320 / 375 * 100vw);
  }

  .mc_heading {
    padding: 3rem 0 1.5rem;
  }

  .mc_heading .mc_read p {
    font-size: 1.6rem;
  }

  .course_detail {
    border-radius: 1rem;
    margin: 0 1rem;
    padding: 1.6rem 1.6rem;
  }

  body.home .splide__arrow--prev {
    left: 1rem !important;
    top: 20% !important;
  }

  body.home .splide__arrow--next {
    right: 1rem !important;
    top: 20% !important;
  }

  .mc_slider .splide__pagination {
    bottom: unset;
    top: 0.5rem;
  }

  #model_course .mc_slider .splide:not(.is-active) .splide__slide {
    width: 100%;
  }

  .course_detail .course_ttl {
    font-size: 2rem;
  }

  .course_detail .course_summary {
    font-size: 1.4rem;
    line-height: 1.6;
  }

  #model_course .course_image_wrap {
    height: 22rem;
  }

  #model_course .course_image {
    border-radius: 1rem;
  }

  .mc_tohoku .mc_heading02 {
    flex-direction: column;
    gap: 1.5rem;
  }

  .mc_tohoku .mc_heading02 .heading_left {
    width: 100%;
  }

  .mc_tohoku .mc_heading02 .heading_left h3 img {
    width: calc(158 / 375 * 100vw);
    display: inline-block;
    padding-top: 2rem;
  }

  .mc_tohoku .mc_heading02 .heading_left h3 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .mc_tohoku .mc_heading02 .heading_left h3::before {
    background-size: 100%;
    height: calc(60 / 375 * 100vw);
  }

  .mc_tohoku .mc_heading02 .heading_right {
    padding-bottom: 2rem;
    width: 100%;
  }

  .mc_tohoku .mc_heading02 .heading_right img {
    width: 100%;
  }

  /* ----------------
feature
------------------*/

  #feature {
    margin: 5rem 0 7.3rem;
  }

  #feature .container {
    padding: 0 calc(15 / 375 * 100vw);
  }

  .feature_inner {
    padding: 5.6rem 0 2.37rem calc(15 / 375 * 100vw);
  }

  .feature_head h3 img {
    width: calc(154 / 375 * 100vw);
  }

  .feature_head h3::after {
    width: calc(83 / 375 * 100vw);
    height: calc(83 / 375 * 100vw);
    background-size: 100%;
    bottom: -2.5rem;
    right: 24%;
  }

  .content_bg_right {
    position: absolute;
    width: calc(360 / 375 * 100vw);
  }

  .feature_container {
    margin: 2.8rem auto 0;
  }

  .feature_container ul.feature_list li {
    gap: 1.3rem;
    margin-bottom: 2rem;
  }

  .feature_container ul.feature_list li .feature_img {
    width: 100%;
    height: calc(100 / 240 * 100vw);
    flex-shrink: 0;
  }

  .feature_container ul.feature_list li .feature_content .date {
    font-size: 1.8rem;
  }

  .feature_container ul.feature_list li .feature_content .feature_ttl a {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  /* ----------------
topics
------------------*/

  #topics {
    margin: 5rem 0 7.3rem;
  }

  #topics .container {
    padding: 0 calc(15 / 375 * 100vw);
  }

  .topics_inner {
    padding: 5.6rem 0 2.37rem;
  }

  .topics_head h3 img {
    width: calc(154 / 375 * 100vw);
  }

  .topics_head h3::after {
    width: calc(83 / 375 * 100vw);
    height: calc(83 / 375 * 100vw);
    background-size: 100%;
    bottom: -2.5rem;
    right: 24%;
  }

  .topics_pu {
    background: #d5e6e2;
    padding: 2rem calc(15 / 375 * 100vw) 0;
  }

  .topics_list {
    gap: 1.5rem;
  }

  ul.topics_list li {
    margin-bottom: 3rem;
    width: 47.5%;
  }

  ul.topics_list li .cat_label {
    font-size: 1.2rem;
  }
  ul.topics_list li .topics_content .date {
    font-size: 1rem;
  }
  ul.topics_list li .topics_content .topics_ttl {
    font-size: 1.4rem;
    margin-bottom: 1rem;
  }
  .topics_main {
    padding: 1rem 0 4rem;
  }
  .category_wrap ul {
    gap: 1.5rem;
  }
  .category_wrap ul li a {
    font-size: 1rem;
  }

  .archive-wrap .topics_list {
    padding-top: 1rem;
  }

  /* ----------------
gourmet
------------------*/

  .gourmet_head {
    top: calc(-42 / 1366 * 100vw);
  }

  .gourmet02_ttl img {
    display: inline-block;
    width: calc(268 / 375 * 100vw);
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .gourmet02_head p {
    font-size: 1.2rem;
    line-height: 1.6;
  }

  /* ----------------
related
------------------*/
  #related {
    margin: 0 0 8rem;
  }

  #related .container {
    padding: 0 1.5rem;
  }

  .related_inner {
    position: relative;
    padding: 8rem 1.5rem 4rem 0;
  }

  .related_inner .related_head {
    position: absolute;
    top: -1.5rem;
    left: 50%;
    transform: translateX(-50%);
  }

  .related_inner h3 img {
    width: calc(154 / 375 * 100vw);
  }

  .related_inner h3::after {
    width: calc(115.8 / 375 * 100vw);
    height: calc(109 / 375 * 100vw);
    background-size: 100%;
    bottom: 0;
    left: 0;
  }

  .related_content .left,
  .related_content .right {
    max-width: unset;
  }

  .related_content {
    flex-direction: column;
    gap: 1.7rem;
    margin-bottom: 8rem;
  }

  .related_content.--02 {
    margin-bottom: 0;
  }

  .related_ttl {
    font-size: 2.6rem;
  }

  .related_content .btn01 {
    display: flex;
    justify-content: center;
  }

  .related_content.--02 .btn01 {
    font-size: 1.5rem;
  }

  .related_img_box img {
    width: 100%;
  }

  .content_bg_left {
    width: calc(360 / 375 * 100vw);
  }

  /* ----------------
information
------------------*/

  #information .information_head h3 img {
    width: calc(268 / 375 * 100vw);
  }

  .information_container {
    border-radius: 1rem;
    padding: 3rem 3rem 2rem 3rem;
    box-shadow: 0.6rem 0.8rem 0px 0 #eeeeee;
  }

  .information_content {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .information_container
    ul.information_list
    li
    .information_content
    .tag_information {
    order: 2;
  }

  .information_container ul.information_list li .information_content .date {
    order: 1;
    margin-right: 1rem;
  }

  .information_container
    ul.information_list
    li
    .information_content
    .information_ttl {
    order: 3;
    width: 100%;
    padding-bottom: 2.6rem;
  }

  /* ----------------
footer
------------------*/
  .footer_ttl {
    font-size: 1.6rem;
  }

  .footer_ttl a {
    color: #fbf6ea;
  }

  .footer_ttl_box p:not(.footer_ttl) {
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .footer_info {
    font-size: 1.2rem;
    line-height: 1.67;
  }

  /* ----------------
固定ページ共通 
------------------- */

  .page-wrap .page-inner {
    margin: 0;
  }

  .administrate-box {
    flex-direction: column;
    gap: 2rem;
    margin-bottom: 0rem;
  }

  /* ----------------
モデルコース詳細
------------------*/

  .model-course-header {
    display: block;
    padding: 0 1.5rem;
    margin-bottom: 3rem;
  }

  .course-cover-img {
    border-radius: 10px;
    width: 100%;
    max-height: min(55vw, 30vh);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .course-cover-img .splide__pagination {
    bottom: 1.5em;
  }

  .model-course-header .course_detail {
    max-width: 100%;
    padding: 0;
    margin: 1.5rem 0;
  }

  .course_detail .tags li {
    line-height: 1;
  }

  .course_detail .tags li span {
    padding: 3px 0;
  }

  .model-course-header .course_detail .course_ttl {
    font-size: 2.6rem;
  }

  .model-course-header .sub-info {
    font-size: 1.6rem;
    padding-top: 2rem;
  }

  .course-anchor-area {
    padding: 0 1.5rem;
  }

  .course-anchor-area .anchor-inner {
    padding: 1.5rem 2rem 2rem 2rem;
    border-radius: 10px;
  }

  .course-anchor-area .anchor-inner h3 {
    font-size: 1.8rem;
    margin-bottom: 2rem;
  }

  .course-anchor-area .anchor-inner .anchor-list li a {
    font-size: 1.4rem;
  }

  .course-anchor-area .anchor-inner .course-map {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    padding: 1.5rem;
    border-radius: 10px;
  }

  .course-anchor-area .anchor-inner .course-map h4 {
    margin-bottom: 1.5rem;
  }

  .course-anchor-area .anchor-inner .course-map h4 img {
    width: 10rem;
  }

  .course-wrap {
    padding-top: 5rem;
  }

  .course-wrap .parallelo h3 img {
    width: 7rem;
  }

  section.itinerary {
    gap: 4rem;
  }

  .timeline-item {
    font-size: 1.6rem;
    line-height: 1.6em;
    min-width: 21.5rem;
  }

  .itinerary .spot {
    border-radius: 20px;
    padding: 1.5rem;
  }

  .spot-heading .heading-time {
    font-size: 1.8rem;
  }

  .spot-heading .spot-ttl {
    font-size: 2rem;
    padding-bottom: 1rem;
  }

  .spot-mainImg {
    border-radius: 10px;
  }

  .spot-txt {
    font-size: 1.6rem;
    margin: 2rem 0 3.5rem;
  }

  .spot-txt a {
    word-break: break-word;
  }

  .spot-subImg-area {
    gap: 1.5rem;
  }

  .spot-subImg {
    border-radius: 1rem;
    height: 115px;
  }

  span.credit {
    bottom: 0.5em;
    right: 1rem;
    font-size: 6px;
  }

  .spot-info {
    flex-direction: column;
    padding-top: 3rem;
    gap: 3rem;
  }

  .spot-table .table {
    font-size: 1rem;
  }

  .spot-table .table th {
    padding-left: 0.5rem;
    width: 9em;
  }

  .spot-table .table td {
    padding-left: 1rem;
  }

  .spot-btns a {
    margin-bottom: 2rem;
  }

  .spot-btns a.btn01 {
    max-width: unset;
  }

  .show_more {
    padding-top: 8rem;
  }

  .related-list-head h4 span {
    font-size: 2.3rem;
  }

  .related-site {
    gap: 0;
  }

  .related-items {
    flex-basis: 100%;
    margin-bottom: 2rem;
    padding: 5%;
  }

  /* ----------------
モデルコース一覧
------------------*/

  .archive-wrap-inner {
    margin: 0;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .archive-wrap-inner .pickUp-ttl {
    margin-bottom: 2.5rem;
  }

  .archive-wrap-inner .pickUp-ttl img {
    width: min(65vw, 80%);
  }

  .archive-wrap-inner .pickUp-container {
    margin-bottom: 2rem;
  }

  .pickUp-container h4 {
    font-size: 2.2rem;
  }

  .pickUp-container .course_image_wrap {
    height: 22rem;
  }

  .pickUp-container .course_image {
    display: inline-block;
    border-radius: 10px;
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  .spot_list_item {
    flex-direction: column;
  }

  .spot_list_item .spot_thumb {
    width: 100%;
    height: 200px;
    border-radius: 10px;
  }

  .spot_txt .read_more {
    text-align: right;
  }

  ul.feature_list li {
    flex-direction: column;
  }

  ul.feature_list li .feature_img {
    width: 100%;
    height: 200px;
    border-radius: 10px;
  }

  .spot-cover-img .splide__arrow--prev {
    top: 50%;
  }

  .spot-cover-img .splide__arrow--next {
    top: 50%;
  }

  .archive-wrap .course_list,
  .course_list_wrap .course_list {
    flex-direction: column;
  }

  .archive-wrap .course_list a,
  .course_list_wrap .course_list a {
    width: 100%;
  }

  .archive-wrap .course_list .course_image_wrap,
  .course_list_wrap .course_list .course_image_wrap {
    height: 22rem;
  }

  .archive-wrap .course_list .course_image,
  .course_list_wrap .course_list .course_image {
    display: inline-block;
    border-radius: 10px;
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  /* 検索UI */
  .search_area {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  body.home .search_area {
    margin-top: 0;
  }

  .search_area_inner {
    margin: 0;
    padding: 2rem 2rem 3rem 2rem;
  }

  .search_area_inner .d-flex {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3.6rem;
  }
  .search_ui {
    width: 100%;
  }
  .dropdown {
    flex-direction: column;
    gap: 2.7rem;
    margin-bottom: 1.8rem;
  }

  .select {
    flex-basis: 100%;
  }

  .postform {
    width: 100%;
    font-size: 18px;
    padding: 0.5rem 4rem 0.5rem 2rem;
  }

  .form_other {
    flex-direction: column;
    align-items: start;
    gap: 2.7rem;
  }
  .keyword {
    width: 100%;
  }

  .form_other > * {
    width: 100%;
  }
  button.view_all {
    width: auto;
  }

  .spot_list_item.search_result .spot_thumb {
    width: 100%;
    height: 200px;
    border-radius: 10px;
  }

  .spot_list_item.search_result .spot_ttl {
    font-size: 100%;
  }

  .spot_list_item.course_detail.search_result .tags li span {
    padding: 3px 1.2em;
  }
  .spot_list_item.search_result .spot_excerpt {
    font-size: 1.3rem;
  }
}

@media (max-width: 500px) {
  /* ----------------
top
------------------*/
  .title {
    top: calc(19 / 375 * 100vw);
    left: calc(14.6 / 375 * 100vw);
    width: calc(98.35 / 375 * 100vw);
  }

  /* ----------------
gourmet
------------------*/
  .gourmet_inner {
    padding: 10rem 0 3.4rem;
    margin-bottom: 10.2rem;
  }

  .gourmet_head {
    top: calc(-11 / 375 * 100vw);
  }

  .gourmet_head img {
    width: calc(288 / 375 * 100vw);
  }

  /* ----------------
information
------------------*/
  #information {
    padding-block: 0;
    padding-bottom: 4rem;
  }

  #information .information_head h3 {
    margin-bottom: 1rem;
    text-align: left;
  }

  /*--------------------------------------------------------------
>>> 仙山観光
--------------------------------------------------------------*/
  .senzan-tourism img {
    image-rendering: auto;
  }

  .senzan-tourism .lead {
    font-size: 2.1rem;
    margin: 4rem 0;
  }

  .senzan-tourism .course-anchor-area {
    padding: 0;
  }

  #senzan01 .d-flex > div,
  #senzan02 .d-flex > div,
  #senzan03 .d-flex > div {
    width: 100%;
  }

  #senzan01 .d-flex,
  #senzan02 .d-flex {
    flex-direction: column;
  }

  #senzan01 .main-text {
    padding: 0;
  }

  #senzan01 .right-side {
    padding-left: 0;
    margin-top: 20px;
  }

  #senzan02 h4 span {
    padding: 1.5rem 1.5rem 2.5rem;
  }

  #senzan02 .d-flex > div {
    padding: 0 15px;
  }

  .senzan-tourism .bg-yellow {
    padding-bottom: 20px;
  }

  #senzan02 h5 {
    font-size: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
  }

  #senzan02 h5 img {
    margin-right: 0;
  }

  #senzan02 .main-text p {
    margin-top: 1.3em;
    font-size: 1.5rem;
  }

  #senzan02 .main-images {
    margin-top: 20px;
  }

  #senzan02 .main-text a {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 10px;
  }

  #senzan03 h4 {
    padding: 0 30px;
  }

  #senzan03 .course_list_wrap .course_list .course_ttl {
    font-size: 2.2rem;
    padding: 0;
  }

  .senzan-tourism .bg-green {
    background: #d5e6e2;
    border-radius: 15px;
    padding: 20px 20px;
  }

  #senzan04 h4 span,
  #senzan05 h4 span {
    font-size: 2.2rem;
    line-height: 1.8em;
  }

  .senzan-tourism .information_container {
    border-radius: 10px;
    padding: 1.7rem 1.7rem 2rem 1.7rem;
  }

  #senzan04 h4 + p img,
  #senzan05 h4 + p img {
    height: 10px;
  }

  .senzan-tourism .related-site {
    gap: 1rem;
    padding: 4rem 0 0;
  }

  .senzan-tourism .related-items {
    flex-basis: 100%;
    margin-bottom: 2rem;
    padding: 5%;
  }
}
