@charset "UTF-8";
/* ==========================================================
0～768px
========================================================== */
@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

  .ttl-base {
    font-size: 24px;
    font-size: 2.4rem;
  }
  .ttl-base span {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .btn a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 1.1em 0 1em;
  }

  .btn-round {
    width: 90%;
  }
  .btn-round a {
    font-size: 17px;
    font-size: 1.7rem;
    line-height: 60px;
    border-radius: 30px;
  }

  /* header
  ----------------------------------------------------------- */
  #sp-top-head {
    width: 100%;
    clear: both;
    height: 64px;
    margin: 0 auto 0;
    padding: 0;
    line-height: 1;
    position: fixed;
    z-index: 9999;
  }

  .sp-top-head-inner {
    width: 100%;
    clear: both;
  }

  #sp-logo-head {
    background: url(../image/common/bg_wood.jpg);
    height: 64px;
    padding: 10px 0 0 2%;
    position: relative;
    z-index: 999;
  }
  #sp-logo-head .logo a {
    width: 130px;
    display: block;
  }
  #sp-logo-head ul {
    *zoom: 1;
    position: absolute;
    right: 64px;
    top: 8px;
  }
  #sp-logo-head ul:after {
    content: "";
    display: table;
    clear: both;
  }
  #sp-logo-head li {
    display: block;
    float: left;
    background: #3d3222;
    width: 48px;
    height: 48px;
    text-align: center;
    margin-left: 8px;
    border-radius: 10px;
  }
  #sp-logo-head li a {
    display: block;
    color: #fff;
    width: 48px;
    outline: none;
    font-size: 11px;
    font-size: 1.1rem;
  }
  #sp-logo-head li a .fa-calendar, #sp-logo-head li a .fa-phone {
    display: block;
    line-height: 1;
    font-size: 18px;
    font-size: 1.8rem;
    padding: 8px 0 6px;
    margin: 0;
  }
  #sp-logo-head li a .fa-phone {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 8px 0 2px;
  }

  /* Toggle Button */
  #nav-toggle {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 48px;
    height: 48px;
    padding: 16px 16px;
    background: #079f66;
    cursor: pointer;
    z-index: 9999;
    border-radius: 10px;
  }

  #nav-toggle div {
    position: relative;
  }

  #nav-toggle span {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: #fff;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
  }

  #nav-toggle span:nth-child(1) {
    top: 0;
  }

  #nav-toggle span:nth-child(2) {
    top: 7px;
  }

  #nav-toggle span:nth-child(3) {
    top: 14px;
  }

  /* #nav-toggle animation */
  .open #nav-toggle span:nth-child(1) {
    top: 7px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
  }

  .open #nav-toggle span:nth-child(2) {
    width: 0;
    left: 50%;
  }

  .open #nav-toggle span:nth-child(3) {
    top: 7px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
  }

  /* #global-nav slide animation */
  .open #sp-global-nav {
    /* #global-nav top(64px) + #mobile-head height */
    -moz-transform: translateY(694px);
    -webkit-transform: translateY(694px);
    transform: translateY(694px);
  }

  #sp-global-nav {
    position: absolute;
    /*in*/
    top: -630px;
    width: 100%;
    background: #fff;
    text-align: center;
    padding: 0;
    -webkit-transition: .7s ease-in-out;
    -moz-transition: .7s ease-in-out;
    transition: .7s ease-in-out;
    z-index: 9999;
  }

  .sp-gnav {
    width: 100%;
    clear: both;
    position: static;
    right: 0;
    bottom: 0;
    font-size: 0px;
    font-size: 0rem;
  }
  .sp-gnav li {
    display: inline-block;
    position: static;
    width: 50%;
    border-bottom: 1px solid #cce6db;
    text-align: left;
  }
  .sp-gnav li:nth-child(2n) {
    border-left: 1px solid #cce6db;
  }
  .sp-gnav li a {
    color: #3d3222;
    font-size: 15px;
    font-size: 1.5rem;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "ＭＳ 明朝", serif;
    display: block;
    font-weight: 500;
    line-height: 50px;
    background: url(../image/common/icon_kuri@2x.png) no-repeat 3% 50%;
    background-size: 17px;
    padding-left: 30px;
  }

  .sp-main-btn {
    width: 100%;
    clear: both;
  }
  .sp-main-btn ul {
    display: flex;
    justify-content: space-between;
  }
  .sp-main-btn li {
    width: 50%;
  }
  .sp-main-btn li a {
    display: block;
    line-height: 56px;
    color: #fff;
    font-size: 16px;
    font-size: 1.6rem;
  }
  .sp-main-btn li a span {
    font-weight: bold;
    display: block;
  }
  .sp-main-btn li.cal {
    background: #079f66;
    padding-top: 15px;
  }
  .sp-main-btn li.cal span {
    background: url(../image/common/icon_cal.svg) no-repeat top center;
    padding-top: 22px;
  }
  .sp-main-btn li.plan {
    background: #bb9870;
    padding-top: 15px;
  }
  .sp-main-btn li.plan span {
    background: url(../image/common/icon_plan.svg) no-repeat top center;
    padding-top: 20px;
  }

  .sp-top-head-info {
    width: 100%;
    clear: both;
    background: url(../image/common/bg_wood.jpg);
    padding: 8px 0 32px;
  }

  .sp-head-info {
    width: 90%;
    margin: 0 auto;
  }
  .sp-head-info ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .sp-head-info li a {
    display: block;
    position: relative;
    padding-left: 1.2em;
    margin-left: 2em;
    margin-top: 12px;
    font-size: 13px;
    font-size: 1.3rem;
    transition: all .3s;
  }
  .sp-head-info li a::before {
    content: '';
    position: absolute;
    width: 10px;
    height: 1px;
    background: #3d3222;
    top: 50%;
    left: 0;
  }
  .sp-head-info li.h-contact a {
    background: #fff;
    display: block;
    border-radius: 50px;
    padding: 0.6em 1em;
  }
  .sp-head-info li.h-contact a::before {
    display: none;
  }
  .sp-head-info .h-tel {
    margin-top: 20px;
    border-top: 2px dotted #3d3222;
    padding-top: 25px;
  }
  .sp-head-info .h-tel .tel a {
    font-family: 'Capriola', sans-serif;
    font-size: 26px;
    font-size: 2.6rem;
    background: url(../image/common/icon_tel.svg) no-repeat 0 55%;
    padding-left: 1em;
    line-height: 1.2;
  }
  .sp-head-info .h-tel .time {
    font-size: 13px;
    font-size: 1.3rem;
  }

  /*fixed(option)*/
  #sp-top-head.fixed {
    height: 64px;
    width: 100%;
    z-index: 9999;
    /*background: rgba(#fff,0.8);*/
  }

  /* visual
  ----------------------------------------------------------- */
  #sp-tp-visual {
    width: 100%;
    clear: both;
    text-align: center;
    position: relative;
    padding: 100px 0 120px;
  }
  #sp-tp-visual::before {
    content: '';
    position: absolute;
    background: url(../image/common/img_green_l.png) no-repeat left top;
    background-size: 120px;
    top: 0;
    left: 0;
    width: 120px;
    height: 100%;
    z-index: 999;
  }
  #sp-tp-visual::after {
    content: '';
    position: absolute;
    background: url(../image/common/img_green_r.png) no-repeat right bottom;
    background-size: 100px;
    bottom: 0;
    right: 0;
    width: 100px;
    height: 100%;
    z-index: 999;
  }
  #sp-tp-visual .sp-tp-visual-inner {
    width: 92%;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    top: 0;
    left: 0;
    z-index: 0;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide {
    width: 100%;
    height: auto;
    text-align: center;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide .slide_ttl {
    text-align: center;
    position: absolute;
    top: 120px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 999;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide .slide_ttl img {
    width: 56%;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide .slide_ttl.first {
    top: 90px;
    left: -10%;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide .slide_ttl.last {
    top: 150px;
  }
  #sp-tp-visual .sp-tp-visual-inner .slide .slide_img img {
    width: 100%;
    transition: all .3s;
    border-radius: 80px;
  }

  .sp-tp-visual-inner .bx-wrapper,
  .sp-tp-visual-inner .bx-window {
    width: 100%;
  }

  /* #tp-yoyaku
  ----------------------------------------------------------- */
  #tp-yoyaku {
    padding: 20px 0 60px;
  }
  #tp-yoyaku::before {
    background: url(../image/img_illust.png) no-repeat top center;
    background-size: 80%;
    width: 100%;
    top: -40px;
  }

  .tp-yoyaku-inner {
    width: 100%;
    clear: both;
    padding-top: 50px;
  }

  .yoyaku-box {
    display: block;
    padding: 0 5%;
  }

  .yoyaku-ttl {
    width: 100%;
    height: auto;
    padding-bottom: 10px;
  }
  .yoyaku-ttl h2 {
    position: static;
    position: relative;
    text-align: center;
    top: -30px;
    left: 0;
  }
  .yoyaku-ttl h2 img {
    width: 80%;
    text-align: center;
  }

  .yoyaku-tokuten {
    padding: 20px 5%;
  }
  .yoyaku-tokuten ol li {
    font-size: 15px;
    font-size: 1.5rem;
  }

  .yoyaku-detail {
    margin-top: 32px;
    padding: 0 5%;
  }
  .yoyaku-detail .bold {
    text-align: left;
  }
  .yoyaku-detail .line-btn {
    margin-top: 24px;
  }
  .yoyaku-detail #toku {
    display: none;
  }
  .yoyaku-detail .answer {
    width: 100%;
    margin: 24px auto 0;
    padding: 24px 5%;
    text-align: left;
  }

  /* #tp-plan
  ----------------------------------------------------------- */
  #tp-plan {
    padding: 60px 5% 80px;
  }

  .tp-plan-inner {
    width: 100%;
    clear: both;
  }
  .tp-plan-inner .ttl-base {
    margin-bottom: 40px;
  }

  .tp-plan-inner #tab li {
    padding: 0.8em 1em 0.6em;
    margin-top: 8px;
  }

  .content_wrap {
    width: 100%;
    padding: 24px 0;
  }
  .content_wrap ul {
    *zoom: 1;
  }
  .content_wrap ul:after {
    content: "";
    display: table;
    clear: both;
  }
  .content_wrap li {
    width: 360px;
    height: auto;
    display: block;
    float: left;
    margin-right: 16px;
    margin-bottom: 0;
    transition: all .3s;
    flex: 0 0 75%;
  }
  .content_wrap li h3 {
    font-size: 16px;
    font-size: 1.6rem;
    margin-top: 1.2em;
    padding-right: 5%;
    padding-left: 5%;
  }
  .content_wrap li p {
    padding: 0 5%;
  }
  .content_wrap li dl {
    padding: 0 5%;
  }
  .content_wrap li dt {
    width: 20%;
    margin-bottom: 2px;
    padding: 8px 0.5em 6px;
  }
  .content_wrap li dd {
    margin: 0 0 2px 20%;
    padding: 8px 0.5em 6px;
  }

  .slide-wrap {
    overflow-y: hidden;
    overflow-x: scroll;
    display: flex;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }

  .tp-plan-btn {
    display: block;
  }

  .btn-yoyaku {
    display: block;
    margin-top: 40px;
  }
  .btn-yoyaku li {
    width: 100%;
    margin-right: 0;
  }
  .btn-yoyaku a {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 60px;
  }
  .btn-yoyaku .plan a span {
    background: url(../image/common/icon_plan.svg) no-repeat 0 50%;
    background-size: 16px;
    padding-left: 32px;
  }
  .btn-yoyaku .cal a {
    margin-top: 16px;
  }
  .btn-yoyaku .cal a span {
    background: url(../image/common/icon_cal.svg) no-repeat 0 50%;
    background-size: 18px;
    padding-left: 32px;
  }

  .btn-yoyaku-sub {
    width: 80%;
    margin: 30px auto 0;
  }
  .btn-yoyaku-sub a {
    width: 100%;
  }

  /* #tp-info
  ----------------------------------------------------------- */
  #tp-info {
    width: 100%;
    clear: both;
    position: relative;
    padding: 0;
  }

  .tp-info-inner {
    display: block;
  }
  .tp-info-inner .tp-info-ttl {
    width: 100%;
    padding: 40px 5%;
  }
  .tp-info-inner .tp-info-ttl .ttl-box {
    width: 100%;
    float: none;
  }
  .tp-info-inner .tp-info-ttl .ttl-box h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 0;
  }
  .tp-info-inner .tp-info-ttl .ttl-box h2 span {
    font-size: 12px;
    font-size: 1.2rem;
  }
  .tp-info-inner .tp-info-list {
    width: 100%;
    padding: 40px 5% 20px;
  }
  .tp-info-inner .tp-info-list li a {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
  }
  .tp-info-inner .tp-info-list figure {
    min-width: inherit;
    width: 35%;
  }
  .tp-info-inner .tp-info-list figure img {
    width: 100%;
  }
  .tp-info-inner .tp-info-list .info-about {
    width: 60%;
    padding: 0;
  }
  .tp-info-inner .tp-info-list .info-about .date {
    font-size: 12px;
    font-size: 1.2rem;
  }
  .tp-info-inner .tp-info-list .info-about h3 {
    font-size: 15px;
    font-size: 1.5rem;
  }
  .tp-info-inner .btn {
    width: 90%;
    padding-bottom: 60px;
  }

  /* #tp-message
  ----------------------------------------------------------- */
  #tp-message {
    background: url(../image/tp_message_bg_sp.jpg) no-repeat top center;
    background-size: contain;
  }
  #tp-message h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin: 0 auto;
    padding: 100px 50px;
  }
  #tp-message h2::before, #tp-message h2::after {
    top: 50%;
    width: 40px;
  }
  #tp-message h2::before {
    left: 0;
  }
  #tp-message h2::after {
    right: 0;
  }
  #tp-message h2 span {
    font-size: 30px;
    font-size: 3rem;
    font-weight: bold;
  }

  .tp-message-inner {
    width: 100%;
    clear: both;
    margin-top: 0;
    padding: 20px 5% 80px;
    border-radius: 0;
    display: block;
  }
  .tp-message-inner .message-img {
    width: 100%;
    margin-top: -40px;
  }
  .tp-message-inner .message-img img {
    width: 80%;
  }
  .tp-message-inner .message-txt {
    width: 100%;
    text-align: left;
    margin-top: 30px;
  }
  .tp-message-inner .message-txt ul {
    margin-top: 30px;
  }
  .tp-message-inner .message-txt .btn {
    margin: 30px 0 0 auto;
    width: 100%;
  }

  /* #tp-room
  ----------------------------------------------------------- */
  .tp-contents {
    padding-top: 40px;
    padding-bottom: 70px;
  }
  .tp-contents .tp-contents-inner {
    padding: 0 5%;
  }
  .tp-contents .ttl-base {
    font-size: 40px;
    font-size: 4rem;
    padding-top: 80px;
  }
  .tp-contents .contents-img ul {
    width: 100%;
    margin: 40px auto 0;
    display: block;
  }
  .tp-contents .contents-img li {
    width: 100%;
    margin-bottom: 60px;
  }
  .tp-contents .contents-img li .type {
    padding: 1em 2em;
    font-size: 18px;
    font-size: 1.8rem;
  }
  .tp-contents .contents-img li .btn {
    width: 70%;
    margin-top: 24px;
  }
  .tp-contents .btn-round {
    margin-top: 0;
  }

  #tp-room {
    background: url(../image/common/img_mount01.jpg) no-repeat top center #f4f3f0;
    background-size: 140% auto;
    padding-top: 80px;
  }
  #tp-room .ttl-base::before {
    background: url(../image/tp_room_copy@2x.png) no-repeat top center;
    background-size: 150px;
  }

  /* #tp-spa
  ----------------------------------------------------------- */
  #tp-spa .ttl-base::before {
    background: url(../image/tp_spa_copy@2x.png) no-repeat top center;
    background-size: 150px;
  }

  /* #tp-meal
  ----------------------------------------------------------- */
  #tp-meal .ttl-base::before {
    background: url(../image/tp_meal_copy@2x.png) no-repeat top center;
    background-size: 150px;
  }

  /* #tp-faci
  ----------------------------------------------------------- */
  #tp-faci .ttl-base::before {
    background: url(../image/tp_faci_copy@2x.png) no-repeat top center;
    background-size: 150px;
  }

  /* #tp-other
  ----------------------------------------------------------- */
  #tp-other {
    width: 100%;
    clear: both;
  }

  .tp-other-inner {
    padding: 40px 5%;
  }
  .tp-other-inner::before {
    width: 100%;
    height: 60%;
  }

  .other-box {
    width: 100%;
    clear: both;
    height: auto;
    display: block;
  }
  .other-box .other-img {
    width: 100%;
  }
  .other-box .other-txt {
    width: 100%;
    padding: 30px 5%;
  }
  .other-box .other-txt h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 20px;
  }
  .other-box .other-txt h2 span {
    font-size: 11px;
    font-size: 1.1rem;
  }
  .other-box .other-txt .btn-round {
    width: 80%;
    margin-top: 40px;
  }

  /* #tp-special
  ----------------------------------------------------------- */
  #tp-special {
    background: url(../image/common/img_mount02.jpg) no-repeat top center #f4f3f0;
    background-size: 140% auto;
    padding: 60px 0 40px;
  }
  #tp-special .tp-info-ttl h2 {
    padding-top: 40px;
    margin-top: -20px;
    margin-bottom: 0;
  }
  #tp-special .tp-info-list {
    background: #f4f3f0;
    padding: 0 5%;
  }

  /* #tp-blog
  ----------------------------------------------------------- */
  #tp-blog {
    padding: 20px 5% 30px;
  }

  /* #tp-banner
  ----------------------------------------------------------- */
  #tp-banner {
    padding: 40px 5% 60px;
  }

  .tp-banner-inner {
    width: 100%;
    clear: both;
    text-align: cetner;
  }
  .tp-banner-inner ul {
    justify-content: space-between;
  }
  .tp-banner-inner li {
    margin-bottom: 20px;
    width: 47%;
    padding: 0;
  }
  .tp-banner-inner li:nth-child(5n) {
    padding-right: 0;
  }

  /* #tp-search
  ----------------------------------------------------------- */
  #tp-search {
    padding: 60px 5% 80px;
  }
  #tp-search::before {
    content: '';
    position: absolute;
    background: url(../image/img_white_l.png) no-repeat left top;
    background-size: 100px;
    top: 0;
    left: 0;
    width: 100px;
    height: 200px;
  }
  #tp-search::after {
    content: '';
    position: absolute;
    background: url(../image/img_white_r.png) no-repeat right top;
    background-size: 100px;
    top: 0;
    right: 0;
    width: 100px;
    height: 200px;
  }

  .tp-search-inner {
    width: 100%;
    clear: both;
  }
  .tp-search-inner .ttl-base {
    margin-bottom: 40px;
  }
  .tp-search-inner .tp-search-area {
    padding: 20px 5%;
  }
  .tp-search-inner .tp-plan-btn {
    margin-top: 60px;
  }

  /* footer
  ----------------------------------------------------------- */
  .pagetop {
    height: 60px;
  }

  .pagetop a {
    width: 100%;
    height: 60px;
  }

  .pagetop a::after {
    top: 25px;
  }

  .footer-inner {
    display: block;
  }

  .f-info {
    width: 100%;
    height: 420px;
  }
  .f-info .f-info-wrap {
    padding: 36px 3% 30px;
    width: 75%;
    bottom: 60px;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
  }
  .f-info .f-info-wrap .f-logo {
    margin: 0 auto 30px;
    padding-right: 10px;
  }

  .f-nav {
    width: 100%;
    padding: 40px 5% 60px;
  }
  .f-nav .f-nav-wrap {
    display: block;
  }
  .f-nav .f-nav-wrap .f-nav-txt {
    width: 100%;
  }
  .f-nav .f-nav-wrap .f-nav-txt li {
    line-height: 1.5;
  }
  .f-nav .f-nav-wrap .f-nav-link {
    display: none;
  }
  .f-nav .btn-yoyaku li {
    width: 100%;
    margin-right: 0;
  }
  .f-nav .btn-yoyaku-sub a {
    width: 80%;
    margin: 0 auto;
  }

  .f-copy {
    width: 100%;
    clear: both;
    text-align: center;
    background: #fff;
    padding: 40px 0;
  }
  .f-copy small {
    font-size: 11px;
    font-size: 1.1rem;
    font-family: 'Capriola', sans-serif;
  }

  /* sub_common
  ----------------------------------------------------------- */
  #sub-visual {
    height: 360px;
    width: 92%;
    margin-left: auto;
    padding-top: 110px;
    background-size: cover;
    border-radius: 0px 0px 0px 40px;
  }
  #sub-visual::before {
    display: none;
  }
  #sub-visual .sub-visual-inner {
    width: 100%;
    clear: both;
  }
  #sub-visual .sub-ttl-area {
    display: block;
  }
  #sub-visual .sub-visual-ttl {
    padding: 0;
    margin-left: -6%;
  }
  #sub-visual .sub-visual-ttl img {
    width: 160px;
  }
  #sub-visual .sub-visual-copy {
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.5;
    letter-spacing: 0;
    padding: 3px 5% 0;
  }

  .breadCrumb {
    display: none;
  }

  .inner {
    width: 100%;
    clear: both;
  }

  .ttl-intro {
    font-size: 36px;
    font-size: 3.6rem;
  }

  .txt-intro {
    margin-top: 32px;
    text-align: left;
  }

  table {
    border-collapse: collapse;
    width: 100%;
    border: none;
  }

  th,
  td {
    padding: 1em 5%;
    display: block;
    border: none;
    text-align: left;
  }

  th {
    width: 100%;
    border-top: 1px dotted #3d3222;
  }

  th {
    width: 100%;
    background-color: #f4f3f0;
    display: block;
  }

  td {
    width: 100%;
    background-color: #fff;
  }

  .gmap {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 75%;
    overflow: hidden;
  }
  .gmap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  /* spa
  ----------------------------------------------------------- */
  .spa #sub-visual {
    background: url(../image/spa_ttlimg_sp.jpg) no-repeat center center;
  }

  .spa-main-wrap {
    padding-top: 40px;
  }
  .spa-main-wrap .sub-intro {
    padding: 0 5% 60px;
  }

  .detail-wrap {
    padding: 60px 0 0;
  }

  .detail-wrap.green::before {
    height: 300px;
  }

  .detail-wrap.beige::before {
    height: 300px;
  }

  /*両脇グリーン*/
  .bg-deco::before {
    background-size: 80px;
    width: 80px;
    height: 100%;
  }
  .bg-deco::after {
    background-size: 80px;
    width: 80px;
    height: 100%;
  }

  /*タイトル - ドットライン*/
  .ttl-dot {
    font-size: 30px;
    font-size: 3rem;
    margin-bottom: 40px;
  }

  .spa-ginga {
    padding: 80px 0;
  }
  .spa-ginga .img-sub {
    width: 42%;
  }

  .spa-name {
    width: 100%;
  }

  /*色枠*/
  .box-style {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 4px 0.8em;
    margin-bottom: 1em;
  }

  /*タイトル - 画像ライン*/
  .ttl-line {
    font-size: 24px;
    font-size: 2.4rem;
    padding: 0 0 1.2em;
  }
  .ttl-line span {
    font-size: 11px;
    font-size: 1.1rem;
  }

  .spa-amanogawa {
    padding: 0 0 80px;
  }
  .spa-amanogawa .img-sub {
    width: 40%;
  }
  .spa-amanogawa .spa-name {
    position: static;
    padding-top: 20px;
  }

  .spa-orihime,
  .spa-kengyu {
    padding: 30px 0 70px;
  }
  .spa-orihime .table-wrap,
  .spa-kengyu .table-wrap {
    margin-top: 70px;
    padding: 0 5%;
  }

  /*hanare*/
  .spa-hanare-wrap .sub-intro {
    padding-top: 60px;
  }
  .spa-hanare-wrap .media {
    display: block;
    margin-top: 40px;
  }
  .spa-hanare-wrap .media figure {
    width: 90%;
    margin: 0 auto;
  }
  .spa-hanare-wrap .media figure img {
    min-width: inherit;
  }
  .spa-hanare-wrap .media p {
    max-width: inherit;
    padding: 40px 5% 60px;
  }

  .beige .ttl-dot {
    font-size: 30px;
    font-size: 3rem;
    margin-bottom: 40px;
  }

  .spa-kiburo {
    padding-bottom: 80px;
  }
  .spa-kiburo .img-sub {
    width: 40%;
  }
  .spa-kiburo p {
    padding: 80px 5% 40px;
    width: 100%;
  }
  .spa-kiburo .table-wrap {
    padding: 0 5%;
  }

  .spa-tsuti, .spa-iwa {
    padding-bottom: 80px;
  }
  .spa-tsuti p, .spa-iwa p {
    padding: 40px 5% 40px;
  }
  .spa-tsuti .table-wrap, .spa-iwa .table-wrap {
    padding: 0 5%;
  }

  /*タイトル - 下ドロップ*/
  .ttl-drop {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 20px;
  }
  .ttl-drop span {
    font-size: 11px;
    font-size: 1.1rem;
  }

  /*about*/
  .spa-about-wrap {
    padding-bottom: 120px;
    margin-top: 60px;
  }
  .spa-about-wrap::before {
    background: url(../image/common/bg_nordic_03.jpg);
    content: '';
    position: absolute;
    width: 80%;
    height: 480px;
    margin-left: auto;
    top: -60px;
    right: 0;
  }
  .spa-about-wrap::after {
    width: 100%;
    height: 600px;
  }
  .spa-about-wrap .inner {
    padding-top: 150px;
  }
  .spa-about-wrap .table-wrap {
    width: 100%;
    padding: 0 5%;
  }

  .spa-about-box {
    width: 88%;
    padding: 60px 5% 0;
  }
  .spa-about-box .spa-about-img {
    position: absolute;
    top: -40px;
    left: 5px;
  }
  .spa-about-box p {
    text-align: left;
  }

  /*untiku*/
  .spa-untiku-wrap {
    padding: 0 5% 60px;
  }
  .spa-untiku-wrap .untiku-box {
    border-radius: 30px;
    padding: 60px 5% 40px;
  }

  /* meal
  ----------------------------------------------------------- */
  .meal #sub-visual {
    background: url(../image/meal_ttlimg_sp.jpg) no-repeat top center;
  }

  .meal-main-wrap {
    padding-top: 40px;
  }
  .meal-main-wrap .sub-intro {
    padding: 0 5% 60px;
  }

  .meal-place {
    padding: 24px 5%;
  }
  .meal-place .comment {
    border-radius: 50px;
    padding: 0.5em 5%;
  }
  .meal-place .comment p {
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.5;
  }
  .meal-place .table-wrap {
    width: 100%;
    margin: 20px auto 0;
  }

  .meal-lead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 5% 0 0;
  }
  .meal-lead figure {
    width: 50%;
  }
  .meal-lead .meal-lead-txt {
    width: 45%;
    padding: 0;
  }

  .meal .detail-wrap.green::before {
    height: 75%;
  }

  .meal-menu.miyama {
    padding: 80px 0 0 0;
  }
  .meal-menu.miyama .txt-intro {
    padding: 0 5%;
  }

  .miyama-season {
    margin: 40px auto 24px;
  }
  .miyama-season li {
    margin-bottom: 2px;
  }
  .miyama-season li .season {
    font-size: 24px;
    font-size: 2.4rem;
  }

  .meal-menu.wagyu {
    padding: 80px 0;
  }
  .meal-menu.wagyu .txt-intro {
    margin-bottom: 40px;
    padding: 0 5%;
  }

  .ttl-grade {
    font-size: 15px;
    font-size: 1.5rem;
    margin-bottom: 1em;
  }

  .meal-menu .btn-round {
    width: 80%;
    margin-top: 40px;
  }
  .meal-menu .btn-round a {
    line-height: 1.2;
    font-size: 15px;
    font-size: 1.5rem;
    padding: 1em 0;
    border-radius: 40px;
  }

  .meal-menu.irori {
    padding: 80px 0;
  }
  .meal-menu.irori .txt-intro {
    margin-bottom: 40px;
    padding: 0 5%;
  }
  .meal-menu.irori .img-main {
    margin-bottom: 24px;
  }

  .meal-other {
    padding: 0 5% 80px;
  }
  .meal-other ul {
    display: block;
  }
  .meal-other li {
    width: 100%;
    text-align: center;
  }
  .meal-other li:nth-child(2n) {
    margin-top: 80px;
  }
  .meal-other .ttl-line {
    font-size: 24px;
    font-size: 2.4rem;
  }
  .meal-other figure {
    margin-top: 24px;
    max-width: inherit;
  }
  .meal-other p {
    margin-top: 24px;
    max-width: inherit;
    text-align: left;
  }
  .meal-other .btn-round {
    width: 80%;
    margin-top: 40px;
  }
  .meal-other .btn-round a {
    line-height: 1.2;
    font-size: 15px;
    font-size: 1.5rem;
    padding: 1em 0;
    border-radius: 40px;
  }

  .meal-morning-wrap {
    padding: 0;
  }
  .meal-morning-wrap .detail-wrap.green {
    padding-bottom: 80px;
  }
  .meal-morning-wrap .detail-wrap.green::before {
    background: #cce6e5;
    height: 100%;
  }
  .meal-morning-wrap .txt-intro {
    padding: 0 5%;
  }
  .meal-morning-wrap .img-main {
    margin-top: 24px;
  }
  .meal-morning-wrap .inner {
    display: block;
    margin-top: 40px;
  }
  .meal-morning-wrap .table-wrap {
    width: 100%;
    padding: 0 5%;
  }
  .meal-morning-wrap .meal-morning-txt {
    width: 100%;
    padding: 24px 5% 0;
  }
  .meal-morning-wrap .btn-round {
    width: 80%;
    margin-top: 40px;
  }
  .meal-morning-wrap .btn-round a {
    line-height: 1.2;
    font-size: 15px;
    font-size: 1.5rem;
    padding: 1em 0;
    border-radius: 40px;
  }

  /*カラム 2 */
  .column-2 {
    display: block;
  }
  .column-2.inner {
    padding: 32px 5% 24px;
  }
  .column-2 .caption-box {
    width: 100%;
    padding: 32px 5%;
    margin-bottom: 16px;
  }

  /* yamanochaya
  ----------------------------------------------------------- */
  .yamanochaya #sub-visual {
    background: url(../image/yama_ttlimg_sp.jpg) no-repeat top center;
  }

  .yama-main-wrap {
    padding-top: 40px;
  }
  .yama-main-wrap .sub-intro {
    padding: 0 5% 40px;
  }

  .yama-place {
    padding: 24px 5% 60px;
  }
  .yama-place .table-wrap {
    margin: 0 auto 24px;
  }
  .yama-place .column-3 {
    display: block;
  }
  .yama-place .column-3 img {
    margin-bottom: 8px;
  }

  .yama-sumibi-wrap {
    padding: 20px 5% 40px;
  }
  .yama-sumibi-wrap h2 {
    font-size: 40px;
    font-size: 4rem;
    padding-bottom: 40px;
    background: url(../image/yama_icon_sumibi.png) no-repeat 10% 0;
    background-size: 90px;
    display: inline-block;
    padding: 80px 40px 90px;
  }
  .yama-sumibi-wrap .inner {
    display: block;
  }
  .yama-sumibi-wrap .sumibi-img {
    width: 100%;
    margin: 0 auto;
    margin-right: auto;
    text-align: right;
  }
  .yama-sumibi-wrap .sumibi-img::before {
    width: 120px;
    height: 120px;
    top: -20px;
    left: -5%;
  }
  .yama-sumibi-wrap .sumibi-img::after {
    width: 120px;
    height: 120px;
    bottom: -20px;
    right: -5%;
  }
  .yama-sumibi-wrap .sumibi-txt {
    width: 100%;
    padding-top: 70px;
  }

  .yama-sumibi-course {
    padding: 60px 5% 0;
  }
  .yama-sumibi-course ul {
    display: block;
  }
  .yama-sumibi-course li {
    width: 100%;
    margin-bottom: 80px;
  }
  .yama-sumibi-course .ttl-line {
    font-size: 24px;
    font-size: 2.4rem;
  }
  .yama-sumibi-course figure {
    margin-top: 24px;
  }
  .yama-sumibi-course p {
    margin-top: 24px;
  }

  .yama-menu-wrap::after {
    height: 400px;
  }
  .yama-menu-wrap .yama-menu-ttl {
    padding: 0;
    display: block;
  }
  .yama-menu-wrap .yama-menu-ttl .ttl-box {
    padding-top: 80px;
  }
  .yama-menu-wrap .yama-menu-ttl h2 {
    font-size: 32px;
    font-size: 3.2rem;
    z-index: 1;
    position: relative;
  }
  .yama-menu-wrap .yama-menu-ttl figure {
    margin-top: -80px;
    position: relative;
    z-index: 0;
    text-align: right;
  }
  .yama-menu-wrap .yama-menu-ttl figure img {
    width: 80%;
  }
  .yama-menu-wrap .yama-menu-list {
    padding: 40px 5%;
  }
  .yama-menu-wrap .yama-menu-list h3 {
    padding: 1em 5%;
  }
  .yama-menu-wrap .yama-menu-list .bd-l {
    border-left: none;
    margin-top: -1.5em;
  }
  .yama-menu-wrap.tanpin th {
    width: 100%;
  }

  .yama-last {
    background-size: contain;
    padding: 36.45% 0 0;
  }

  /* room
  ----------------------------------------------------------- */
  .room #sub-visual {
    background: url(../image/room_ttlimg_sp.jpg) no-repeat top center;
  }

  .humming #sub-visual {
    background: url(../image/humming_ttlimg_sp.jpg) no-repeat top center;
  }

  .glamping #sub-visual {
    background: url(../image/glamping_ttlimg202310_sp.jpg) no-repeat top center;
  }

  .room-main-wrap {
    padding-top: 40px;
  }
  .room-main-wrap .sub-intro {
    padding-bottom: 40px;
  }
  .room-main-wrap .box-style {
    margin-bottom: 0.5em;
  }
  .room-main-wrap .img-main {
    width: 100%;
  }

  .room-media {
    display: block;
    margin-top: 16px;
    padding-bottom: 100px;
  }
  .room-media .img-box {
    width: 100%;
    padding: 0 5%;
    margin-bottom: 24px;
  }
  .room-media .img-box img {
    max-width: inherit;
    width: 100%;
    margin-bottom: 16px;
  }
  .room-media .room-info {
    width: 100%;
    padding: 0 5%;
  }
  .room-media .room-info .table-wrap {
    margin-top: 40px;
  }
  .room-media .room-info p {
    margin-top: 24px;
  }
  .room-media .room-info .btn-round {
    margin-top: 40px;
  }

  .hinoki .ttl-line .type {
    font-size: 20px;
    font-size: 2rem;
    display: block;
    padding: 0.2em;
  }

  .detail-wrap.brown::before {
    height: 300px;
  }
  .detail-wrap.brown .bg-deco::before {
    background-size: 80px;
    width: 80px;
    height: 100%;
  }
  .detail-wrap.brown .bg-deco::after {
    background-size: 80px;
    width: 80px;
    height: 100%;
  }
  .detail-wrap.brown .ttl-intro {
    margin-bottom: 40px;
  }
  .detail-wrap.brown .table-wrap {
    width: 100%;
    padding: 24px 5% 0;
  }
  .detail-wrap.brown .table-wrap th {
    width: 100%;
  }

  .room .caption-box .room-illust {
    left: 0;
    bottom: auto;
    top: -20px;
  }
  .room .caption-box .room-illust img {
    width: 100px;
  }

  /* facility
  ----------------------------------------------------------- */
  .faci-list-wrap {
    padding: 60px 0 80px;
  }
  .faci-list-wrap::after {
    height: 100%;
  }
  .faci-list-wrap .ttl-intro {
    margin-bottom: 40px;
  }
  .faci-list-wrap .main-faciimg {
    margin-bottom: 0;
  }
  .faci-list-wrap .main-faciimg.center {
    text-align: center;
  }
  .faci-list-wrap .sub-faciimg {
    position: relative;
    top: -30px;
    right: 16px;
    width: 65%;
    margin: 0 0 0 auto;
  }
  .faci-list-wrap .inner {
    padding: 16px 0 0 0;
  }
  .faci-list-wrap .btn-round {
    width: 80%;
    margin: 0 auto;
    margin-top: 40px;
  }
  .faci-list-wrap .btn-round a {
    line-height: 1.2;
    padding: 1em 0;
    border-radius: 40px;
  }

  /*kawanone*/
  .faci-list-wrap.kawanone {
    padding: 60px 0;
  }
  .faci-list-wrap.kawanone::after {
    height: 80%;
  }
  .faci-list-wrap.kawanone .ttl-intro span {
    padding-bottom: 0.5em;
  }
  .faci-list-wrap.kawanone .faci-img.noon {
    padding-bottom: 0;
  }
  .faci-list-wrap.kawanone .faci-img.reverse {
    margin-top: 100px;
  }
  .faci-list-wrap.kawanone .faci-img.reverse .sub-faciimg {
    margin-right: 16px;
  }
  .faci-list-wrap.kawanone .faci-img.reverse .inner {
    padding: 8px 0 0 0;
  }
  .faci-list-wrap.kawanone .main-faciimg .faci_launch {
    left: 10px;
  }
  .faci-list-wrap.kawanone .main-faciimg .faci_night {
    left: 10px;
  }
  .faci-list-wrap.kawanone .sub-faciimg {
    position: relative;
    top: -30px;
    right: 16px;
    width: 65%;
    margin: 0 0 0 auto;
  }

  /* tourism
  ----------------------------------------------------------- */
  .tour-access-nav {
    padding: 0 0 80px 0;
    margin-top: 80px;
  }
  .tour-access-nav::after {
    width: 80%;
    height: 220px;
    top: -30px;
    left: 0;
  }
  .tour-access-nav ul {
    width: 90%;
  }
  .tour-access-nav li {
    width: 49%;
    height: 160px;
  }
  .tour-access-nav li .page-ttl {
    padding: 1em 2em;
  }
  .tour-access-nav li .page-ttl span {
    font-size: 10px;
    font-size: 1rem;
  }
  .tour-access-nav li .page-ttl p {
    font-size: 20px;
    font-size: 2rem;
  }

  .tour-list-wrap {
    padding: 48px 5% 60px;
  }
  .tour-list-wrap .ttl-intro {
    font-size: 30px;
    font-size: 3rem;
  }

  .tour-spot {
    padding: 0 5% 40px;
    display: block;
    margin-top: 40px;
  }
  .tour-spot .spot-img {
    width: 100%;
  }
  .tour-spot .spot-info {
    width: 100%;
    padding-left: 0;
  }
  .tour-spot .spot-name {
    padding: 1.5em 0;
    text-align: center;
  }
  .tour-spot .spot-btn {
    margin-top: 3em;
    text-align: center;
  }
  .tour-spot .btn-round {
    width: 90%;
    height: 40px;
    margin-right: 0;
    margin-bottom: 8px;
  }
  .tour-spot .btn-round a {
    line-height: 40px;
  }

  .tour .tree-wrap {
    padding: 40px 5%;
  }
  .tour .tree-wrap .caption-box {
    padding: 64px 5% 32px;
  }
  .tour .tree-wrap .caption-box::before {
    top: -32px;
  }
  .tour .tree-wrap .caption-box .ttl-obi {
    padding: 1em 5%;
    margin-bottom: 0;
  }
  .tour .tree-wrap .caption-box .table-wrap {
    margin-bottom: 1em;
  }
  .tour .tree-wrap .caption-box .table-wrap th {
    width: 100%;
    padding: 0.5em 5%;
  }

  /* access
  ----------------------------------------------------------- */
  .access #sub-visual {
    background: url(../image/access_ttlimg_sp.jpg) no-repeat center center;
  }

  .access-gmap-wrap {
    padding: 0 5% 120px;
  }
  .access-gmap-wrap .gmap-txt {
    text-align: left;
    margin-bottom: 40px;
  }
  .access-gmap-wrap .gmap-txt p {
    font-size: 15px;
    font-size: 1.5rem;
  }

  .access-car-wrap .ttl-intro, .access-train-wrap .ttl-intro {
    padding-top: 66px;
    margin-bottom: 40px;
    font-size: 26px;
    font-size: 2.6rem;
  }

  .access-car-wrap {
    background: #f4f3f0;
    padding-bottom: 80px;
  }
  .access-car-wrap .ttl-intro::after {
    background: url(../image/access_icon_car@2x.png) no-repeat top center;
    background-size: 66px;
  }
  .access-car-wrap .car-intro {
    text-align: left;
    padding: 0 5%;
    margin-bottom: 60px;
  }

  .car-way-column2 {
    display: block;
    margin-bottom: 80px;
  }

  .car-way {
    width: 100%;
    padding: 0 5%;
    margin-bottom: 80px;
  }
  .car-way .line-btn {
    margin-top: 24px;
  }
  .car-way .line-btn a {
    padding: 1em 2em 0.8em;
  }
  .car-way.w-first {
    margin-bottom: 80px;
  }

  .car-parking {
    width: 80%;
    margin: 0 auto;
    padding: 1em 5%;
    text-align: center;
  }
  .car-parking p {
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
    letter-spacing: 0.02em;
  }
  .car-parking p span {
    font-size: 16px;
    font-size: 1.6rem;
    display: block;
    margin-top: 0.2em;
    margin-left: 0;
  }

  .access-train-wrap {
    padding-top: 40px;
    padding-bottom: 80px;
  }
  .access-train-wrap .ttl-intro::after {
    background: url(../image/access_icon_train@2x.png) no-repeat top center;
    background-size: 66px;
  }
  .access-train-wrap .train-intro {
    text-align: left;
    padding: 0 5%;
  }
  .access-train-wrap figure {
    width: 90%;
    margin: 40px auto 0;
  }

  .access .tree-wrap {
    padding: 40px 5%;
  }
  .access .tree-wrap .caption-box {
    padding: 24px 5%;
  }
  .access .tree-wrap .caption-box .ttl-obi {
    padding: 1em 5%;
    margin-bottom: 16px;
  }
  .access .tree-wrap .caption-box .access-info-wrap {
    margin-bottom: 2em;
  }
  .access .tree-wrap .caption-box .access-info-wrap li a {
    padding: 0.2em 1em;
  }

  /* daysplan
  ----------------------------------------------------------- */
  .day #sub-visual {
    background: url(../image/day_ttlimg_sp.jpg) no-repeat top right;
  }

  .day-nav-wrap {
    padding: 40px 5% 24px;
    margin-bottom: 60px;
  }
  .day-nav-wrap::after {
    content: '';
    position: absolute;
    background: #f4f3f0;
    width: 85%;
    height: 80%;
    bottom: 0;
    left: 0;
  }

  .day-nav {
    margin-top: 40px;
  }
  .day-nav ul {
    display: block;
  }
  .day-nav li {
    width: 100%;
    height: 180px;
    margin-bottom: 60px;
  }
  .day-nav li .plan-card {
    padding: 2.5em 1em 2em;
    margin-top: 110px;
  }
  .day-nav li .plan-card::after {
    background-size: 30px;
    width: 30px;
    height: 30px;
    bottom: -20px;
  }
  .day-nav li .plan-card .plan-num {
    font-size: 36px;
    font-size: 3.6rem;
    margin-top: -60px;
  }
  .day-nav li .plan-card .plan-en {
    font-size: 10px;
    font-size: 1rem;
  }
  .day-nav li .plan-card h3 {
    font-size: 20px;
    font-size: 2rem;
  }
  .day-nav li .plan-card h3 span {
    font-size: 15px;
    font-size: 1.5rem;
  }

  .day-plan {
    padding: 0 0 100px;
  }
  .day-plan .inner {
    padding-top: 10px;
    margin-top: -10px;
  }
  .day-plan .btn-round {
    margin-top: 40px;
    width: 80%;
  }
  .day-plan .btn-round a {
    line-height: 60px;
    font-size: 18px;
    font-size: 1.8rem;
  }

  .day-plan-ttl {
    padding-top: 8px;
  }
  .day-plan-ttl .plan-num {
    font-size: 120px;
    font-size: 12rem;
  }
  .day-plan-ttl .plan-en {
    font-size: 14px;
    font-size: 1.4rem;
    margin-top: -48px;
  }
  .day-plan-ttl .plan-ttl {
    font-size: 40px;
    font-size: 4rem;
  }
  .day-plan-ttl .plan-ttl span {
    font-size: 24px;
    font-size: 2.4rem;
  }

  .day-plan-course {
    margin-top: 40px;
    padding: 30px 5% 24px;
    width: 100%;
  }
  .day-plan-course img {
    margin-bottom: 24px;
  }

  .day-plan-info {
    display: block;
    background: #fff;
    margin-top: 0;
    padding: 40px 5% 0;
  }
  .day-plan-info .table-wrap {
    width: 100%;
    margin-top: 60px;
  }
  .day-plan-info .table-wrap th,
  .day-plan-info .table-wrap td {
    padding: 1em 1.2em;
  }
  .day-plan-info .table-wrap th {
    width: 100%;
  }
  .day-plan-info .table-wrap td {
    width: 100%;
  }

  .plan-schedule {
    width: 100%;
  }
  .plan-schedule .card {
    width: 100%;
    background: #cce6db;
    display: flex;
    align-items: center;
  }
  .plan-schedule .card .card-txt {
    padding-left: 0.5em;
    font-size: 14px;
    font-size: 1.4rem;
  }

  .day .tree-wrap {
    padding: 32px 5%;
  }
  .day .tree-wrap .caption-box {
    padding: 32px 5%;
  }
  .day .tree-wrap .caption-box p {
    margin-bottom: 0.5em;
    font-size: 14px;
    font-size: 1.4rem;
  }

  .day-ceremony-wrap {
    padding: 60px 5% 40px;
  }
  .day-ceremony-wrap ul {
    display: block;
    margin-top: 40px;
  }
  .day-ceremony-wrap li {
    width: 100%;
    margin-bottom: 40px;
  }
  .day-ceremony-wrap li .ttl-line {
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    margin-top: 1em;
  }
  .day-ceremony-wrap li figure {
    max-width: inherit;
  }
  .day-ceremony-wrap li p {
    margin-top: 1em;
  }

  /* info
  ----------------------------------------------------------- */
  .info #sub-visual {
    background-position: 70% 0;
  }

  /*list*/
  .info-list-wrap .ttl-intro {
    font-size: 32px;
    font-size: 3.2rem;
  }

  .info-list-inner {
    padding: 40px 0 60px;
    margin-top: 40px;
  }
  .info-list-inner::after {
    width: 20%;
  }
  .info-list-inner .info-list {
    width: 100%;
    padding: 0 5%;
  }
  .info-list-inner .info-list li a {
    display: flex;
    margin-bottom: 40px;
  }
  .info-list-inner .info-list figure {
    width: 25%;
  }
  .info-list-inner .info-list .info-about {
    padding: 0 0 0 5%;
    width: 75%;
  }
  .info-list-inner .info-list .info-about .date {
    font-size: 12px;
    font-size: 1.2rem;
    margin-bottom: 0.5em;
  }
  .info-list-inner .info-list .info-about h3 {
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
  }

  .pagenav {
    width: 90%;
    margin: 0 auto;
  }

  /*detail*/
  .info-cont-wrap {
    padding: 60px 5% 80px;
  }
  .info-cont-wrap .box-style span {
    font-size: 12px;
    font-size: 1.2rem;
  }
  .info-cont-wrap .ttl-intro {
    font-size: 24px;
    font-size: 2.4rem;
  }

  .info-cont {
    width: 100%;
    margin-top: 40px;
  }

  .info .tree-wrap {
    padding: 40px 0;
  }

  /*page*/
  .page #sub-visual {
    height: auto;
  }
  .page #sub-visual::before {
    display: none;
  }

  .info-page-wrap {
    padding: 20px 5% 80px;
  }
  .info-page-wrap .sub-intro .ttl-intro {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
/* -----@media screen and (max-width:768px) ------ */