@charset "utf-8";

/* style */
body, html {
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
    box-sizing: border-box;
    color: #322e2b;
    position: relative;
}
ul, ol {
	list-style: none;
}

.only_pc{
    display: block;
}
.only_sp{
    display: none;
}

*,*:hover,a{
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.on,.on_0,nav .menu_content li{
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.on:hover{
    opacity: 0.5;
}
.on_0:hover{
    opacity: 0;
}

nav .menu_content li:hover{
    color: #5d5b5d;
}
.red{
 color: #e30012;   
}

span.square{
    font-size: 0.75rem;
    margin-right: 0.3rem;
}

h4.title{
    text-align: center;
    padding-top: 8rem;
    margin-bottom: 5.5rem;
}

h4.title img {
    height: 145px;
    margin:0 auto;
}
.bold{
 font-weight: 600;   
}
.box{
    display: flex;
}
.img img{
    width: 100%;
    object-fit: cover;
}

.wrapp{
    width: 100%;
}

.wrapper{
    width: 60%;
    margin: 0 auto;
}

.borer_line{
    border: 1px solid #fff;
    margin: 95px auto;
}

.detail{
    text-align: center;
}

.detail .img{
    margin: 3.8rem auto 3.3rem;
}

.detail img{
    width: 100%;
}

/* more  */

.more{
    font-size: 12px;
    font-weight: 400;
    position: relative;
    width: 236px;
    height: 38px;
    border: 1px solid #35325c;
    -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
    margin-top: 15px;
}

.more a{
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.more a:hover{
    background: #35325c;
    color: #fff;
}

.more a::before{
    content: url(../img/SVG/arrow.svg);
    display: inline-block;
    width: 8px;
    position: absolute;
    top: 11px;
    right: 10px;
}

.more a:hover::before{
    content: url(../img/SVG/arrow_wh.svg);
}

dl{
    margin-top: 1.4rem;
    letter-spacing: 0.1rem;
}

dt {
    font-weight: normal;
    
    width: 27%;
}
dd {
   margin-left: 0;
    width: 70%;
}
dd p{
    margin-top: 0.5rem;
}
dd p:first-child{
    margin-top: 0;
}
.indent{
    text-indent: -0.5rem;
}
.sub_text{
    text-align: right;
    font-size: 12px;
    margin-top: 0.5rem;
}


/*====================================================
                  header
====================================================*/
header{
    position: fixed;
    z-index: 999;
}
.logo{
    width: 161px;
    position: absolute;
    top: 20px;
    left: 20px;
}


.head_nav .box{
    width: 851px;
    font-weight: 600;
   align-items: center;
    justify-content: space-between;    
    position: fixed;
    top: 0.7rem;
   left: 45%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.bus_link img {
    width: 300px;
}


/*-- wrapper --*/
.bg_01{
    background: url(../img/main_bg.jpg);
    background-position:center;
    width: 100%;
    height: auto;
    background-size: cover;
    padding-bottom: 85px;
    
}


/*====================================================
                  main
====================================================*/

.main{
    text-align: center;
    position: relative;
    padding-bottom: 8rem;
    background: url(../img/main_bg.png);
    background-repeat: no-repeat;
    background-position: center;
}

.main_text img{
    width: 125px;
    position: absolute;
    top: 100px;
    right: 160px;
}
.main .title .img01{
    width: 480px;
    margin-top: 7.5rem;
}
.main .title .img02{
    width: 440px;
    margin: 2rem auto 0;
}

.logo{
    width: 115px;
    position: absolute;
    top: 20px;
    left: 20px;
}

.head.scroll{
    top:-400px;
        -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}






/*====================================================
                  about
====================================================*/

.about{
    text-align: center;
    padding: 0 0 2rem;
}

.about h5 img{
    width: 542px;
    margin: 3rem 0;
}

.about h6 img{
    width: 630px;
    margin: 1.8rem auto 1.3rem;
}


.about h4.title {
    text-align: center;
    margin-bottom: 0;    
    padding-top: 0;
}

.about p{
    color: #fff;
    line-height: 2.1;
}

/*====================================================
                  info
====================================================*/
.info .content{
    position: relative;
    height: 100%;
}

.info .img{
    width: 45%;

}

.info .txt{
width: 50%;
padding: 8.3rem 0 8.5rem 8.7rem;
}

.info .img.first img {
    height: 100%;
}


.info .txt h4{
    width: 330px;
    margin-bottom: 2.3rem;
}

.info .txt dd a{
}
.info .txt dd a img{
    width: 85px;
    margin-left: 0.75rem;
}
.info .txt .parking {
    margin: 2rem 0 3.6rem;
}

.info .parking img{
    width: 61px;
}

.info .txt .parking p{
    font-size: 14px;
    margin-left: 1.5rem;
    line-height: 1.55;
    width: 76%;
    text-align: justify;
}

.info .txt .bus_link img{
    width: 310px;
}

.info .txt .text_bottom{
    font-size: 12px;
    position: absolute;
    bottom: 1rem;
    right: 0;
}

li.img img {
    height: 14vw;
}



/*====================================================
                  map
====================================================*/
.map {
    background:url(../img/map_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
}

.map img.map_img{
    width: 667px;
    margin: 0 auto;
}

.map p{
    color: #fff;
    text-align: justify;
    width: 87%;
    letter-spacing: 0.05rem;
    margin: 6.5rem auto 10.5rem;
    line-height: 1.7;
}

/*====================================================
                  event
====================================================*/
.event {
    margin-bottom: 10.6rem;
}

.event .wrapper {
    width: 52%;
}

.event h4.title {
    margin-bottom: 2.6rem;
}

.event img.number{
    height: 32px;
    margin: 1.5rem auto;
}
.event img.day{
    height: 38px;
}
.event h5 img{
    height: 173px;
    margin: 1.5rem auto 3rem;
}
.event .content{
    width: 100%;
    margin: 3.2rem 0 2.6rem 12%;
}
.event dl {
    margin-top: 0.4rem;
    line-height: 1.6;
    letter-spacing: 0.09rem;
}
.event dt {
    width: 130px;
}

.event dt.short {
    width: 75px;
}
.event dt.large {
    width: 250px;
}
.event dt span.square {
    font-size: 0.75rem;
    margin-right: 0.2rem;
}

.event dd{
    width: 100%;
    vertical-align: middle;
}

.event dd.indent p{
    text-indent: -0.5rem;
}

.event dd.indent p:nth-child(2){
    margin-top: 0;
}

.event .content  dl.money{
    margin-bottom: 1.3rem;
}

.event .content  dd .sub_txt{
    font-size: 14px;
    font-weight: 400;
}

.event .content  dd .large{
    font-size: 24px;
    display: inline-block;
    margin-top: -0.6rem;
}

.event p.text{
    border-top: 1px solid;
    border-bottom: 1px solid;
    line-height: 2.1;
    text-align: justify;
    padding: 1.9rem 0;
}

.event  a.ticket{
    width: 359px;
    display: block;
    margin: 0 auto;
}

.event  a.ticket img{
    width: 100%;
}


/*
.event  ul.btn{
    justify-content: center;
}
.event ul.btn  li{
    text-align: center;
    border: 1px solid;
    width: 290px;
    height: 58px;
    margin-right: 1rem;
    font-size: 18px;
    font-weight: 600;
}
.event ul.btn  li:last-child{
    margin-right: 0;
}

.event ul.btn  li a{
    width: 100%;
    height: 100%;
    display: block;
    padding: 1.2rem 0;
}
*/

/* event02 */
.event02{
    margin-top: 5.2rem;
}


.event02 p.text {
    border-bottom:0;
}


.event02 span.red {
    color: #e83b18;
}

.event02 .sub{
    text-align: center;
    font-weight: 600;
}

.event02 .sub p.title{
    font-size: 18px;
    margin-bottom: 2.1rem;

}

.event02 .sub ul.menu{
    font-size: 16px;
    width: 416px;
    margin: 1rem auto;
    text-align: left;
    letter-spacing:-0.05rem;
}

.event02 .sub ul.menu li:first-child{
    margin-right: 1.5rem;
}

.event02 .sub ul.menu span.time{
    letter-spacing: 0.09rem;
    margin-left: 0.25rem;
}

.event02 .sub .small{
    font-size: 12px;
    font-weight: 400;
    border-bottom: 1px solid;
    padding: 1.4rem 0 3rem;
}

/*====================================================
               premium
====================================================*/

.premium{
    background: #141c2e;
    color: #fff;
    margin-bottom: 0;
    padding-bottom: 6.5rem;
}

.premium h4.title {
    margin-bottom: 5.6rem;
    padding-top: 5.6rem;
}

.premium .wrapper {
    width: 66%;
}

.premium img.number {
    height: 32px;
    margin: 1.5rem auto;
}

.premium .title{
    text-align: center;
    height: auto;
    width: 360px;
    margin: 0 auto;
}

.premium .title img {
    height: 100%;
}

/* premium plan02 */
.premium .plan02{
    padding-bottom: 8rem;
}


.premium .coming_soon{
    text-align: center;
    width: 140px;
    margin: 0 auto;
}

.premium .coming_soon img{
    width: 100%;
}


/*====================================================
               shuttle_bus
====================================================*/

.shuttle_bus{
    background-image: url(../img/shuttle_bus.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 250px;
}

.shuttle_bus:hover {
    opacity: 0.5;
}
.shuttle_bus a{
    display: block;
    width: 100%;
    height: 100%;
    padding: 3.9rem 0 3.1rem;
}

.text_name {
    position: relative;
    color: #FFF;
    text-align: center;
    line-height: 1.9;

}
.text_name img {
     width: 321px;
    display: block;
    margin: 0 auto;
}
.text_name img.maru{
    width: 42px;
    position: absolute;
    top: 30%;
    right: 2.5rem;
}

.text_name p {
    margin-top: 1.5rem;
}

/*====================================================
                  notes
====================================================*/
.notes{
    background: #f6f6f6;
    padding-bottom: 4rem;
}
.notes .wrapper {
    width: 69%;
}

.notes h4.title {
    padding-top: 5.3rem;
    margin-bottom: 4rem;
}

.notes h4.title img {
    height: auto;
    width: 268px;
}
.notes h5{
    border-bottom: 1px solid;
    font-weight: 600;
    font-size: 18px;
    padding-bottom: 0.7rem;
    letter-spacing: 0.05rem;
    margin-bottom: 0.8rem;
}
.notes ul{
    margin-bottom: 2.9rem;
}

.notes li{
    text-indent: -1rem;
    margin-left: 1rem;
    text-align: justify;
    font-size: 14px;
    line-height: 2;
}


/*====================================================
                  contact
====================================================*/
.contact .wrapper{
    width: 80%;
}

.contact h4.title {
    padding-top: 6rem;
    margin-bottom: 4rem;
}

.contact .detail{
    margin-top: 3.5rem;
}

.contact .detail h5{
    font-size: 18px;
    font-weight: 600;
}

.contact .detail .tel {
    width: 355px;
    margin: 1.6rem auto;
}

.contact .detail p{
    font-size: 14px;
    line-height: 2;
    letter-spacing: 0.06rem;
}
.contact .detail p span{
    font-weight: 600;
    font-size: 16px;
}

.contact .sub{
    font-size: 14px;
    letter-spacing: 0.01rem;
    line-height: 1.4;
    width: 536px;
    margin: 4.5rem auto 0;
}


/*====================================================
                  2023/12 追加
====================================================*/

.tour_links p {
	text-align: center;
	font-weight: bold;
	padding-bottom: 20px;
}

.tour_btn {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 500px;
	margin: auto;
}

.tour_btn li {
	padding: 5px;
}


/*====================================================
                  footer
====================================================*/
footer{
    width: 918px;
    margin: 13.1rem auto 0;
}


footer .title_img{
    text-align: center;
    margin: 0 auto 8.5rem;
    width: 355px;
}

footer .title_img img{
    width: 355px;
}

footer .title_img a{
    display: block;
    width: 100%;
    height: 100%;
}

footer .guide{
    display: flex;
    justify-content: space-between;
    width: 844px;
    margin: 0 auto;
}

footer .guide img{
   width: 300px;
}
footer .guide li{
    font-size: 16px;
    font-weight: 600;
    line-height: 2.5;
}

footer .guide li:last-child{
    margin-right: 0;
}
footer .guide li .sub li{
    font-size: 14px;
    font-weight: 100;
    line-height: 2.5;
    margin-right: 0px;
}
footer .copyright{
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    margin-top: 72px;
    letter-spacing: 0.05rem;
    margin-bottom: 75px;
}






/*====================================================
                スクロールフェードイン
====================================================*/

.fadeIn {
    transform: translate3d(0, 0px, 0);
    transition: 2s;
    opacity: 0;
}

.fadeIn.animated {
    transform: translate3d(0, 0, 0);
    opacity: 1;
}

/*==================================================
　ハンバーガーメニュー
===================================*/
.btn img{
	width: 80px;
	position: fixed;
	right: 0;
    top: 0;
    z-index: 9;
}

#nav-content {
    z-index: 900;
    overflow: auto;
    width: 100%;
    height: 100%;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    opacity: 0;
    transition: opacity .6s ease, visibility .6s ease;
    visibility: hidden;
}
#nav-content ul {
  list-style: none;
}
#nav-content a {
  display: block;
  text-decoration: none;
  padding: 15px 0;
  transition: opacity .6s ease;
  pointer-events: none;
    line-height: 1.4;
    text-align: center;
}

.is-open {
    overflow: hidden;
}
.is-open #nav-content {
  z-index: 999;
  visibility: visible;
  opacity: 1;
}
.is-open #nav-content a {
  pointer-events: auto;
}

nav{
    position: relative;
}

nav .menu_content{
    width: 315px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,40%);
    -webkit-transform: translate(-50%,40%);
    -ms-transform: translate(-50%,40%);
}

nav .menu_content li{
    font-size: 18px;
    font-weight: 600;
}

nav .menu_content .bus_btn{
    width: 228px;
    border: 0;
}

nav .icon {
    display: flex;
    justify-content: center;
}


.menu_content li img{
    width: 132px;
    height: auto;
    padding: 0;
    margin: 0 auto;
    margin-bottom: 0.6rem;
    }

.menu_content li .bus_link img{
    width: 250px;
    margin-top: 1.8rem;
}


/*====================================================
                  翻訳バナー
====================================================*/
header {
    width: 100%;
}

header .gnavi__lists {
    display: flex;
    position: absolute;
    top: 1.1rem;
    right: 6.2rem;
    z-index: 990;
}
.gnavi__list {
    width: 130px;
    height: 38px;
    font-size: 16px;
    background-color: #FFF;
    border: 1.5px solid #322e2b;
    position: relative;
    transition: all .3s;
}
.gnavi__list:not(:first-child)::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .3s;
}
/*.gnavi__list:hover::before {
    background-color: #0071BB;
}*/
.gnavi__list a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0.9rem;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: 0.05em;
    font-weight: 600;
    transition: all .3s;
}
    
.dropdown__lists {
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0;
}
.gnavi__list:hover .dropdown__lists {
    display: block;/*Gナビメニューにホバーしたら表示*/
}
.dropdown__list {
    font-size: 16px;
    background:rgb(50,46,43,0.8);
    height: 36px;
    transition: all .3s;
    position: relative;
}
.dropdown__list:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 0;
}
.dropdown__list a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
}

.dropdown__lists {
    visibility: hidden;/*デフォルトでは非表示の状態にしておく*/
    opacity: 0;/*不透明度0*/
    transition: all .3s;/*表示の変化を0.3秒に指定*/
    width: 100%;
    position: absolute;
    top: 36px;
    left: 0;
}
.gnavi__list:hover .dropdown__lists {
    visibility: visible;/*Gナビメニューにホバーしたら表示*/
    opacity: 1;/*不透明度1*/
}


/*====================================================
                  トップ　フェードイン
====================================================*/
body {
    animation: fadeIn 7s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*====================================================
                 サイト
====================================================*/
/*フェードイン表示の指定*/
.fadein {
    opacity: 0;
    animation: fadein 1s ease forwards;
}
@keyframes fadein {
    100% {  opacity: 1;}
}
 
/*以下遅延の指定*/
.img01 {
    animation-delay: 1s;
    animation-duration: 1s;
}

.img02 {
    animation-delay: 1.5s;
    animation-duration: 1s;
}

.img03 {
    animation-delay: 2s;
    animation-duration: 1s;
}

.img04 {
    animation-delay: 2s;
    animation-duration: 1s;
}

/*==================================================
　フェードアップ
===================================*/
.an5-fadeup{
    animation-name: fadeup;
    animation-delay: 1s;
    animation-duration: 1s;
}
@keyframes fadeup {
from {
    transform: translateY(40px);
}
to {
    opacity: 1;
transform: translateY(0px);
}
}

.an5-fadeup01{
    animation-name: fadeup;
    animation-delay: 1.5s;
    animation-duration: 1s;
}
@keyframes fadeup01 {
from {
    transform: translateY(40px);
}
to {
    opacity: 1;
transform: translateY(0px);
}
}

@media screen and (max-width:1440px) {
    .menu_content li img {
    width: 132px;
    height: auto;
    padding: 0;
    margin: 0 auto;
    margin-bottom: 0.6rem;
}
}



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

.head_nav .box {
    width: 60%;
    }
    
.head_nav .box li{
    margin-right: 2vw;
    } 
   
 .menu_content li.img{   
    width: 131px;
    height: auto;
    display: block;
    margin: 0 auto;  
    }
    
nav .menu_content {
    position: absolute;
    top: 0%;
    left: 50%;
    transform: translate(-50%,45%);
    -webkit-transform: translate(-50%,45%);
    -ms-transform: translate(-50%,45%);
}
    
.info .txt {
    width: 60%;
    padding: 4vw 0 0 8vw;
}
 
.event .content {
    width: 90%;
    margin: 2rem auto;
}   
    
.event .wrapper,.event .wrapper.event03,.event .special .wrapper {
    width: 80%;
}  
    
.info .txt .bus_link img {
    width: 60%;
    margin-bottom: 10vw;
}
    
    
.option .menu li{    
    width: 12vw;
    display: block;
}
    
.option .menu li:last-child{
   width: 100%;
    }
    

}



@media screen and (max-width:980px) { 
    
.only_pc.tab{
    display: none;
    }        
    
    
.wrapper {
    width: 80%;
    }    
    
.about h5 img {
    width: 100%;
    }    
    
.about p{
    text-align: justify;
    }    
    
.info .txt .text_bottom {
    font-size: 11px;
    bottom: 1vw;
    right: 1vw;
}    
    
.map img.map_img {
    width: 100%;
}    
    
.option .wrapper {
    width: 80%;
}    
    
.option .menu ul.box{
    flex-direction: column;    
    }  
    
.option .border_line {
    width: 80%;
}
    

    
footer {
    width: 100%;
    }    
footer .guide {
    width: 85%;
    margin: 0 auto;
}
footer .guide li:last-child {
    width: 21%;
    margin-top: -1vw;
}    
    
footer .guide img {
    width: 100%;
}
    
}











/*===================================
　リンク切る
===================================*/
.btn_out{
    pointer-events:none;
    opacity: 0.5;
}

.link_out{
    pointer-events:none;
}






