@media (min-width:  992px) {}
@media (max-width: 1399px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media screen and (min-width: 1200px) {}
@media (max-width: 1199px) {}
@media (min-width: 992px) and (max-width: 1199px) {
  .row.scroll-md {
    height: 500px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .main-highlight .post-body, .main-province .post-body {
    padding: 0.75rem 1rem;
  }
  .main-highlight .post .post-title, .main-province .post .post-title {
    top: unset;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-highlight .grid1 .post .post-title {
    top: unset;
  }
  .main-highlight .post .post-body .post-text, .main-province .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .main-highlight .grid1 .post .post-body .post-text {
    height: 72px;
    -webkit-line-clamp: 4;
  }
  .blog-place .place-list .post {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 0 20px 0;  
  }
  .blog-place .place-list .post a {
    width: 100%;
  }
  .blog-place .place-list .post .post-tag a {
    width: auto;
  }
  .blog-place .place-list .post .post-body {
    width: 100%;
  }
  .blog-place .place-list .post .post-text {
    margin: 0;
    height: 36px;
    font-size: var(--text-12);
    line-height: 18px;
  }
  .sideblog.blog-place .place-list .post {
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0 0 15px 0;
  }
  .sideblog.blog-place .place-list .post a {
    width: 130px;
  }
  .sideblog.blog-place .place-list .post .post-tag a {
    margin-right: 0;
    width: auto;
  }
  .sideblog.blog-place .place-list .post .post-body {
    flex: unset;
    padding: 0 10px;
    width: 60%;
  }
  .sideblog.blog-place  .post .post-title {
    margin-bottom: 10px;
    height: 40px;
    font-size: var(--text-14);
    line-height: 20px;
  }


  .blog-season .season-list .post .post-img {
    padding-top: 67%;
  }
  .sideblog.blog-season .season-list .post .post-img {
    padding-top: 32%;
  }
  .form-search .form {
    flex-direction: column;
    justify-content: flex-start;
  }
  .form-search .form .column, .form-search .form .column:first-child {
    margin: 0;
  }
  .form-search .form .column .form-input label {
    width: 145px;
  }
  .form-search .form .column .form-input {
    flex: auto;
  }
  .form-search .form .column.button-area {
    margin: 0;
  }  
  .form-search-data .form .row-form {
    flex-direction: column;
  }
  .form-search-data .form .row-form .column, .form-search-data .form .row-form .column:first-child {
    margin: 0;
  }
  .form.form-new-mytrip .column.button-area {
    column-gap: 10px;
    margin-left: 10px;
  }
  .form.form-new-mytrip .column.button-area .button {
    padding: 8px;
    min-width: 120px;
  }
}
@media (max-width: 991px) {
  .row.scroll-md {
    height: 500px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  } 
  .center-div {
    height: 90px;
  }
  .center-div::before {
    height: 90px;
  }
  .carousel-slide .slideimg {
    height: 240px;
  }
  .carousel-slide .slideimg img {
    object-fit: cover;
  }
  .center-div .center-txt {
    padding-top: 0;
  }
  .center-div .center-txt h1 {
    margin: 0 0 5px 0;
    height: 38px;
    font-size: var(--text-24);
    line-height: 38px;
  }
  .center-div .center-txt h2 {
    height: 32px;
    font-size: var(--text-18);
    line-height: 32px;
  }
  .section-title {
    font-size: var(--text-20);
    line-height: 26px;
  }
  .section-title::before {
    top: 10px;
  }
  .title-content {
    font-size: var(--text-18);
    line-height: 24px;
  }
  .post-body {
    padding: 10px;
  }
  .main-highlight .post-body{
    padding: 0.75rem 1rem;
  }
  .main-highlight .post .post-title {
    top: unset;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-highlight .grid1 .post .post-title {
    top: unset;
  }
  .main-highlight .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .main-highlight .grid1 .post .post-body .post-text {
    height: 72px;
    -webkit-line-clamp: 4;
  }
  .blog-season .season-list .post .post-img {
    padding-top: 67%;
  }
  .blog-season .season-list .post .post-title {
    margin-bottom: 0;
    height: 26px;
    font-size: var(--text-16);
    line-height: 26px; 
  }
  .blog-season .season-list .post .post-body::before {
    height: calc(100% + 26px);
  }
  .blog-event .event-list .post a {
    width: 52%;
  }
  .blog-event .event-list .post .post-body {
    flex: unset;
    width: 48%;
  }
  .main-destination {
    padding: 20px 0;
  }
  .destination-list .post, .city-list .post {
    margin: 0 0 20px 0;
  }
  .destination-list .post .post-title, .city-list .post .post-title {
    margin-bottom: 7px;
    transform: translateY(0);
  }
  .destination-list .post .post-text, .city-list .post .post-text {
    opacity: 1;
  }
  .destination-list .post .post-img, .city-list .post .post-img {
    padding-top: 40%;
  }
  .destination-list.regions-list .post-img img, .destination-list.city-list .post-img img {
    width: 100%;
    height: unset;
  }
  .page-inside {
    padding: 20px 0;
  }
  .main-form {
    padding: 1rem;
  }
  .form-search .form {
    flex-direction: column;
    justify-content: flex-start;
  }
  .form-search .form .column, .form-search .form .column:first-child {
    margin: 0;
  }
  .form-search .form .column .form-input label {
    width: 145px;
  }
  .form-search .form .column .form-input {
    flex: auto;
  }
  .form-search .form .column.button-area {
    margin: 0;
  }
  .form-search-data .form .row-form {
    flex-direction: column;
  }
  .form-search-data .form .row-form .column, .form-search-data .form .row-form .column:first-child {
    margin: 0;
  }
  .alink-all {
    font-size: var(--text-11);
  }
  
}
@media (min-width: 768px) and (max-width: 991px) {
  .main-hilight .row.scroll-sp {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;    
    height: auto;
  }
  .main-hilight .row.scroll-sp .post {
    margin: 0 0 10px 0;
  }
  .blog-mypage .add-mytrip-list .button + .button {
    margin: 10px 0 0 0; 
  }
  .offcanvas.offcanvas-bottom {
    height: calc(100vh - 35%);
  }
  .offcanvas.offcanvas-bottom .sideblog.blog-place.blog-mypage-trip .place-list {
    max-height: unset;
  }  
  .section-subhead {
    flex-direction: column;
    margin: 0 0 15px 0;
  }
  .post-tag-date {
    flex-direction: column;
  }
  .post-tag-date .post-tag, .post-tag-date .post-date {
    margin-bottom: 15px;
  }
}
@media (max-width: 767px) {}
@media (min-width: 576px) and (max-width: 767px) {
  .page-outer-wrap {
    padding-top: 65px;
  }
}
@media (max-width: 575px) {
  .page-outer-wrap {
    padding-top: 65px;
  }
  .main-highlight {
    padding: 1rem 0;
  }
  .main-highlight .highlight-inside .highlight-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
    gap: 10px;
  }  
  .main-highlight .highlight-inside .grid1 {
    grid-area: 1 / 1 / 3 / 3; 
  }
  .main-highlight .highlight-inside .grid2 {
    grid-area: 3 / 1 / 4 / 2;
  }
  .main-highlight .highlight-inside .grid3 {
    grid-area: 3 / 2 / 4 / 3;
  }
  .main-highlight .highlight-inside .grid4 {
    grid-area: 4 / 1 / 5 / 2;
  }
  .main-highlight .highlight-inside .grid5 {
    grid-area: 4 / 2 / 5 / 3;
  }
  .main-highlight .post-body, .main-province .post-body {
    padding: 0.75rem 1rem;
  }
  .main-highlight .post .post-title {
    top: 20px;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-province .post .post-title {
    top: 30px;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-highlight .grid1 .post .post-title {
    top: unset;
  }
  .main-highlight .post .post-body .post-text, .main-province .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .main-highlight .grid1 .post .post-body .post-text {
    height: 72px;
    -webkit-line-clamp: 4;
  }
  .blog-banner img {
    margin-bottom: 1rem;
  }
  .row.scroll-sp {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    height: auto;
  }
  .blog-place .place-list .post, .blog-event .event-list .post, .blog-article .article-list .post, .blog-story .story-list .post {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 0 15px 0;  
  }
  .blog-place .place-list .post a, .blog-event .event-list .post a, .blog-article .article-list .post a, .blog-story .story-list .post a {
    width: 100%;
  }
  .blog-place .place-list .post .post-tag a, .blog-event .event-list .post .post-tag a, .blog-article .article-list .post .post-tag a, .blog-story .story-list .post .post-tag a {
    width: auto;
  }
  .blog-place .place-list .post .post-body, .blog-event .event-list .post .post-body, .blog-article .article-list .post .post-body, .blog-story .story-list .post .post-body {
    width: 100%;
  }
  .blog-place .place-list .post .post-text, .blog-event .event-list .post .post-text, .blog-article .article-list .post .post-text, .blog-story .story-list .post .post-text {
    margin: 0;
    height: 36px;
    font-size: var(--text-12);
    line-height: 18px;
  }
  .sideblog.blog-place .place-list .post, .sideblog.blog-event .event-list .post, .sideblog.blog-article .article-list .post, .sideblog.blog-story .story-list .post {
    flex-direction: row;
    margin: 0 0 10px 0;
  } 
  .sideblog.blog-place .place-list .post a, .sideblog.blog-event .event-list .post a, .sideblog.blog-article .article-list .post a, .sideblog.blog-story .story-list .post a {
    width: 130px;
  }
  .sideblog.blog-place .place-list .post .post-tag a, .sideblog.blog-event .event-list .post .post-tag a, .sideblog.blog-article .article-list .post .post-tag a, .sideblog.blog-story .story-list .post .post-tag a {
    width: auto;
  }
  .sideblog.blog-place .place-list .post .post-body, .sideblog.blog-event .event-list .post .post-body, .sideblog.blog-article .article-list .post .post-body, .sideblog.blog-story .story-list .post .post-body {
    flex: unset;
    padding: 0 10px;
    width: 60%;
  }
  .blog-region .post-body, .blog-province .post-body {
    padding: 0.75rem 1rem;
  }
  .blog-region .post .post-title, .blog-province .post .post-title {
    top: unset;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .blog-region .post .post-body .post-text, .blog-province .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .section-subhead {
    flex-direction: column;
    margin: 0 0 15px 0;
  }
  .post-tag-date {
    flex-direction: column;
  }
  .post-tag-date .post-tag, .post-tag-date .post-date {
    margin-bottom: 15px;
  }

  .form-new-mytrip {
    flex-direction: column;
  }
  .form.form-new-mytrip .column.button-area {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-left: 0;
    padding-top: 20px;
  }
  .offcanvas-body {
    padding: 0;
  }
  .offcanvas.offcanvas-bottom {
    height: calc(100vh - 45%);
  }
  .offcanvas.offcanvas-bottom .sideblog.blog-place.blog-mypage-trip .place-list {
    max-height: unset;
  }

}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .main-highlight {
    padding: 1rem 0;
  }
  .main-highlight .highlight-inside .highlight-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
    gap: 10px;
  }  
  .main-highlight .highlight-inside .grid1 {
    grid-area: 1 / 1 / 3 / 3; 
  }
  .main-highlight .highlight-inside .grid2 {
    grid-area: 3 / 1 / 4 / 2;
  }
  .main-highlight .highlight-inside .grid3 {
    grid-area: 3 / 2 / 4 / 3;
  }
  .main-highlight .highlight-inside .grid4 {
    grid-area: 4 / 1 / 5 / 2;
  }
  .main-highlight .highlight-inside .grid5 {
    grid-area: 4 / 2 / 5 / 3;
  }
  .main-highlight .post-body, .main-province .post-body {
    padding: 0.75rem 1rem;
  }
  .main-highlight .post .post-title {
    top: 20px;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-province .post .post-title {
    top: 30px;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .main-highlight .grid1 .post .post-title {
    top: 60px;
  }
  .main-highlight .post .post-body .post-text, .main-province .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .main-highlight .grid1 .post .post-body .post-text {
    height: 72px;
    -webkit-line-clamp: 4;
  }
  .blog-banner img {
    margin-bottom: 1rem;
  }
  .row.scroll-sp {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    height: auto;
  }
  .blog-place .place-list .post, .blog-event .event-list .post, .blog-article .article-list .post, .blog-story .story-list .post {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 0 15px 0;  
  }
  .blog-place .place-list .post a, .blog-event .event-list .post a, .blog-article .article-list .post a, .blog-story .story-list .post a {
    width: 100%;
  }
  .blog-place .place-list .post .post-tag a, .blog-event .event-list .post .post-tag a, .blog-article .article-list .post .post-tag a, .blog-story .story-list .post .post-tag a {
    width: auto;
  }
  .blog-place .place-list .post .post-body, .blog-event .event-list .post .post-body, .blog-article .article-list .post .post-body, .blog-story .story-list .post .post-body {
    width: 100%;
  }
  .blog-place .place-list .post .post-text, .blog-event .event-list .post .post-text, .blog-article .article-list .post .post-text, .blog-story .story-list .post .post-text {
    margin: 0;
    height: 36px;
    font-size: var(--text-12);
    line-height: 18px;
  }
  .sideblog.blog-place .place-list .post, .sideblog.blog-event .event-list .post, .sideblog.blog-article .article-list .post, .sideblog.blog-story .story-list .post {
    flex-direction: row;
    margin: 0 0 10px 0;
  } 
  .sideblog.blog-place .place-list .post a, .sideblog.blog-event .event-list .post a, .sideblog.blog-article .article-list .post a, .sideblog.blog-story .story-list .post a {
    width: 130px;
  }
  .sideblog.blog-place .place-list .post .post-tag a, .sideblog.blog-event .event-list .post .post-tag a, .sideblog.blog-article .article-list .post .post-tag a, .sideblog.blog-story .story-list .post .post-tag a {
    width: auto;
  }
  .sideblog.blog-place .place-list .post .post-body, .sideblog.blog-event .event-list .post .post-body, .sideblog.blog-article .article-list .post .post-body, .sideblog.blog-story .story-list .post .post-body {
    flex: unset;
    padding: 0 10px;
    width: 60%;
  }
  .blog-region .post-body, .blog-province .post-body {
    padding: 0.75rem 1rem;
  }
  .blog-region .post .post-title, .blog-province .post .post-title {
    top: 20px;
    height: 24px;
    font-size: var(--text-18);
    line-height: 24px;
  }
  .blog-region .post .post-body .post-text, .blog-province .post .post-body .post-text {
    margin: 32px 0 0 0;
    height: 54px;
    -webkit-line-clamp: 3;
    font-size: var(--text-12);
    line-height: 18px;
    transform: scale(1);
    opacity: 1;
  }
  .section-subhead {
    flex-direction: column;
    margin: 0 0 15px 0;
  }
  .post-tag-date {
    flex-direction: column;
  }
  .post-tag-date .post-tag, .post-tag-date .post-date {
    margin-bottom: 15px;
  }
  .vocabulary-all .vocabulary-text {
    flex-direction: column;
  }



}
@media screen and (max-width: 400px) {}