@charset "utf-8";

/* ============================================
   Base / Common
   ============================================ */

article{}

img {}

.Inner {
}

/* 共通見出し */
.CommonTtl{
    padding: 0 50px;
    margin-bottom: 20px;
}
.CommonTtl:before,
.CommonTtl:after{
    width: 50px;
    height: 25px;
}
.CommonTtl:before{
    left: 5px;
}
.CommonTtl:after{
    right: 5px;
}
.min{}

h2{
    font-size: 4.8vw;
}
.Recommend,.Tour,.Charm,.Sightseeing,.RecommendSeason,.Season,.Point,.Temperature,.Guide,.Info,.FAQ{
    padding: 30px 0;
    width: 100%;
}

.table-scroll::-webkit-scrollbar {
  width: 16px;
}

.table-scroll::-webkit-scrollbar-track {
  background-color: #fff;
}

.table-scroll::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-image: linear-gradient(90deg, rgba(251, 213, 251, 1), rgb(90 234 199));
}

/* ============================================
   MV (Main Visual)
   ============================================ */
#MV{height: 190px;background-size: cover;position: relative;}
#MV .MV-Overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 1;
  }
#MV .Inner{
    padding-top: 50px;
    position: relative;
    z-index: 2;
}
#MV .Inner h1{}
#MV .Inner h1 img{}
#MV .Inner .mv-title {
}
#MV .Inner .main-title-wrap{gap: 0px;margin: 0;display: block;}
#MV .Inner .char {
    font-size: 8.3vw;
    display: contents;
}
#MV .Inner .char::before {
    display: none;
}
#MV .Inner .sub-title {
    font-size: 4.2vw;
    letter-spacing: 0.3em;
    margin-bottom: 5px;
}
#MV .Inner .sub-title .small{
    font-size: 3.2vw;
}
#MV .Inner .eng-title {letter-spacing: 0.1em;font-size: 3.2vw;margin-top: 3px;}

/* ============================================
   About Section Wrapper
   ============================================ */

#About{
    width: 100%;
}

/*-------------------------------------Intro*/
#About .Intro{padding: 30px 0;}
#About .Intro .Txt{
    width: 90%;
    font-size: 3.4vw;
    line-height: 1.8;
}
#About .Intro .Txt:before,
#About .Intro .Txt:after{
    display: none;
}
#About .Intro .Txt:before{}
#About .Intro .Txt:after{}
#About .Intro .Txt p {
    text-align: left;
    border-bottom: 2px dotted #a0c0d1;
}
#About .Intro .Txt p + p{
    margin-top: 5px;
}

/*-------------------------------------Recommend*/
#About .Recommend{padding: 40px 0 50px 0;}
#About .Recommend .MainTtl{width: 90%;margin-bottom: 13px;}
#About .Recommend .MainTtl:before,
#About .Recommend .MainTtl:after{
    display: none;
}
#About .Recommend .MainTtl:before{
}
#About .Recommend .MainTtl:after{
}
#About .Recommend .MainTxt{
    font-size: 3.4vw;
    text-align: left;
    width: 90%;
    margin: 0 auto;
    margin-bottom: 20px;
}
#About .Recommend .MainTxt span{
    display: initial;
}
#About .Recommend .Box{
    display: block;
    width: 90%;
}
#About .Recommend .Entry{
    width: 100%;
}
#About .Recommend .Entry + .Entry{
    margin-top: 20px;
}
#About .Recommend .Box .Entry .Ttl{
    font-size: 4.2vw;
}
#About .Recommend .Box .Entry .Ttl.summer{}
#About .Recommend .Box .Entry .Ttl.winter{}
#About .Recommend .Box .Entry .icon{
    font-size: 4.0vw;
}
#About .Recommend .Box .Entry .Ttl.summer .icon{}
#About .Recommend .Box .Entry .Ttl.winter .icon{}
#About .Recommend .Box .Entry .Photo{}
#About .Recommend .Box .Entry .Photo img{
    height: auto;
}
#About .Recommend .Box .Entry .Txt{text-align: left;}
#About .Recommend .Box .Entry .Txt p{
    font-size: 3.4vw;
}

/*-------------------------------------Tour*/
#About .Tour{}

/*-------------------------------------Charm*/
#About .Charm{padding: 40px 0 50px 0;}
#About .Charm .Box{
    display: block;
    margin-bottom: 30px;
    width: 90%;
}
#About .Charm .Box .Entry{
    width: 100%;
}
#About .Charm .Box .Entry + .Entry{
    margin-top: 20px;
}
#About .Charm .Box .Entry .Photo{}
#About .Charm .Box .Entry .Photo img{
    height: auto;
}
#About .Charm .Box .Entry .Ttl{
    font-size: 4.2vw;
}
#About .Charm .Box .Entry .Ttl.summer{}
#About .Charm .Box .Entry .Ttl.winter{}
#About .Charm .Box .Entry .Ttl .icon{
    font-size: 4.0vw;
}
#About .Charm .Box .Entry .Ttl.summer .icon{}
#About .Charm .Box .Entry .Ttl.winter .icon{}

#About .Charm .Box.OR{}
#About .Charm .Box.OR .Ttl{
    font-size: 4.2vw;
    margin-bottom: 15px;
}
#About .Charm .Box.OR .Ttl:before,
#About .Charm .Box.OR .Ttl:after{}
#About .Charm .Box.OR .SubBox{
    display: block;
}
#About .Charm .Box.OR .SubBox .point{
    width: 100%;
}
#About .Charm .Box.OR .SubBox .point.summer{}
#About .Charm .Box.OR .SubBox .point.winter{
    margin-top: 10px;
}
#About .Charm .Box.OR .SubBox .point .SubTtl{
    font-size: 3.8vw;
}
#About .Charm .Box.OR .SubBox .point.summer .SubTtl{}
#About .Charm .Box.OR .SubBox .point.winter .SubTtl{}
#About .Charm .Box.OR .SubBox .point ul{
}
#About .Charm .Box.OR .SubBox .point li{
    margin-right: 0;
    font-size: 3.2vw;
}
#About .Charm .Box.OR .SubBox .point li::before{}
#About .Charm .Box.OR .SubBox .point li + li{}
#About .Charm .Box.OR .SubBox .point  li:before{}

/*-------------------------------------Sightseeing*/
#About .Sightseeing{
}
#About .Sightseeing:before,
#About .Sightseeing:after{display: none;}
#About .Sightseeing:before{}
#About .Sightseeing:after{}
#About .Sightseeing .Inner{
    width: 90%;
}
#About .Sightseeing .Inner .Photo{
    width: 84%;
    margin-bottom: 30px;
}
#About .Sightseeing .Inner .Photo img{}
#About .Sightseeing .Inner .Box{
    width: 100%;
    display: block;
}
#About .Sightseeing .Inner .Box .Entry{
    width: 100%;
}
#About .Sightseeing .Inner .Box .Entry + .Entry{}
#About .Sightseeing .Inner .Box .Entry .Photo{}
#About .Sightseeing .Inner .Box .Entry .Photo .img{}
#About .Sightseeing .Inner .Box .Entry .Ttl{
    font-size: 4.2vw;
    margin-bottom: 3px;
}
#About .Sightseeing .Inner .Box .Entry .Txt{}
#About .Sightseeing .Inner .Box .Entry .Txt p{
    font-size: 3.4vw;
    text-align: left;
}

/*-------------------------------------RecommendSeason*/
#About .RecommendSeason{}
#About .RecommendSeason .table {
    width: 90%;
    margin: 0 auto;
    border: 2px solid #546e7a;
  }
#About .RecommendSeason .table thead {
    display:none;
  }
#About .RecommendSeason .table th, #About .RecommendSeason .table td {
    display: block;
    border: 0;
    border-bottom: 2px solid #546e7a;
    font-size: 3.4vw;
  }
#About .RecommendSeason .table td:last-child{
    border-bottom: none;
}

#About .RecommendSeason .table tbody th{
    background: #6e8c99;
    color:#fff;
    font-size: 3.8vw;
    padding: 10px;
    border-bottom: none;
  }
#About .RecommendSeason .table td::before{
    content: attr(data-label);
    color: #6e8c99;
    font-weight: bold;
    display: inline-block;
    width: 100%;
    min-width: 4em;
    text-align: center;
  }
  
/*-------------------------------------Season*/
#About .Season{}
#About .Season .ate{
    font-size: 3.2vw;
    text-align: left;
    width: 90%;
    margin: 0 auto;
    margin-bottom: 5px;
}
#About .Season .table-scroll {width: 90%;margin: 0 auto;}
#About .Season .table{}
#About .Season .table th, #About .Season .table td {}
#About .Season .table th {
    white-space: nowrap;
    font-size: 3.8vw;
}
#About .Season .table td{
    font-size: 3.4vw;
}
#About .Season .table th:last-of-type {}

/*-------------------------------------Point*/
#About .Point{
    background-image: none;
    padding: 40px 0 50px 0;
}
    #About .Point .CommonTtl {
        width: 66%;
    }
#About .Point .Inner{
    width: 90%;
}
#About .Point .Inner .Photo{
    margin-bottom: 15px;
}
#About .Point .Inner .Photo img{
    height: auto;
}
#About .Point .Inner .Box{}
#About .Point .Inner .Box .Entry{}
#About .Point .Inner .Box .Entry + .Entry{
    margin-top: 10px;
}
#About .Point .Inner .Box .Entry .Ttl{
    font-size: 4.2vw;
}
#About .Point .Inner .Box .Entry .Ttl span{
    font-size: 4.0vw;
}
#About .Point .Inner .Box .Entry .Txt{
    font-size: 3.4vw;
}

/*-------------------------------------Temperature*/
#About .Temperature{}
#About .Temperature .table-scroll {
    width: 90%;
    margin: 0 auto;
}
#About .Temperature .table{}
#About .Temperature .table th, #About .Temperature .table td {
    font-size: 3.4vw;
    /* display: table-cell !important; */
    /* white-space: nowrap; */
}
#About .Temperature .table th, #About .Temperature .table td.comment{
}
#About .Temperature .table th {
    font-size: 3.8vw;
}
#About .Temperature .table th:last-of-type {}

/*-------------------------------------Guide*/
#About .Guide{
    padding: 40px 0 50px 0;
}
#About .Guide .Inner{width: 90%;}
#About .Guide .Inner .Box{
    width: 100%;
    display: block;
    margin: 0 auto;
}
#About .Guide .Inner .Box .Entry{width: 100%;}
#About .Guide .Inner .Box .Entry + .Entry{
    margin-top: 20px;
}
#About .Guide .Inner .Box .Entry .Photo{}
#About .Guide .Inner .Box .Entry .Photo img{
    height: auto;
}
#About .Guide .Inner .Box .Entry .Ttl{
    font-size: 4.2vw;
}
#About .Guide .Inner .Box .Entry .Ttl.summer{}
#About .Guide .Inner .Box .Entry .Ttl.winter{}
#About .Guide .Inner .Box .Entry .Ttl .icon{
    font-size: 4.0vw;
}
#About .Guide .Inner .Box .Entry .Ttl.summer .icon{}
#About .Guide .Inner .Box .Entry .Ttl.winter .icon{}
#About .Guide .Inner .Box .Entry .list{}
#About .Guide .Inner .Box .Entry .list.summer{}
#About .Guide .Inner .Box .Entry .list.winter{}
#About .Guide .Inner .Box .Entry .list ul{
    padding: 20px 10px 10px 10px;
}
#About .Guide .Inner .Box .Entry .list li{
    padding-left: 30px;
    margin-right: 0;
    font-size: 3.2vw;
}
#About .Guide .Inner .Box .Entry .list li::before{}
#About .Guide .Inner .Box .Entry .list li + li{}
#About .Guide .Inner .Box .Entry .list li:before{
    margin-left: -7px;
}
#About .Guide .Inner .Box .Entry .list li strong{}

/*-------------------------------------Info*/
#About .Info{}
#About .Info .Inner{width: 80%;display: block;}
#About .Info .Inner dl{
    width: 100%;
    display: block;
    margin-bottom: 10px;
}
#About .Info .Inner dt{
    width: 100%;
    padding: 3px;
    margin-bottom: 3px;
}
#About .Info .Inner dd{
    font-size: 3.2vw;
}

/*-------------------------------------FAQ*/
#About .FAQ{}
#About .FAQ .Inner{
    width: 80%;
    margin: 0 auto;
}
#About .FAQ .Inner .Entry{}
#About .FAQ .Inner .Entry + .Entry{}
#About .FAQ .Inner .Entry .Ask{
    font-size: 3.8vw;
    margin-bottom: 5px;
}
#About .FAQ .Inner .Entry .Txt{
    font-size: 3.2vw;
}
#About .FAQ .Inner .Entry .Ask:before,
#About .FAQ .Inner .Entry .Txt:before{
    font-size: 4.2vw;
    margin-left: -21px;
}
#About .FAQ .Inner .Entry .Ask:before{}
#About .FAQ .Inner .Entry .Txt:before{}