@charset "utf-8";

:root{
	--commonPadding: 30px 0 40px 0;--width:86%;
}

.commonHeader{position:relative}
.wrapper{padding-top:0}
.header_change{display:none}

article .btn{
    flex-direction: column;
    text-align: center;
}
article .btn a{
    display: block;
    font-size: 14px;
    padding: 14px 0;
}
article .btn a:after{}
article .btn a:hover{}

.commonTtl{
    margin-bottom: 20px;
    position: relative;
    z-index: 3;
}
.commonTtl .deco{}
.commonTtl .deco img{}
.commonTtl .main{
    font-size: 25px;
}
.commonTtl .main strong{}
.commonTtl .sub{
    font-size: 20px;
}
.commonTtl .sub span{}
.commonTtl .sub span img{}
.commonTtl .sub span + span{}

/*-----------------------------------------menuArea*/
.menuArea{padding: 0;}
.menuArea.header_fixed.fixed{position: fixed;display: block;}
.menuArea.header_fixed:before,
.menuArea.header_fixed:after{
    content: none;
}

.menuArea{position: absolute;width:100%;top:0;z-index:999}
.menuArea.header_fixed{
    display: none;
}
.menuArea .Inner{display:none;width: 100%;box-sizing:border-box;-webkit-overflow-scrolling:touch;box-sizing: border-box;padding: 10px 10px 10px 50px;background-color: var(--MainColor);color: #fff;}
.menuArea .humb{display:flex;position:absolute;right:10px;top:10px;width:45px;height:45px;box-sizing:border-box;justify-content:center;align-items:center;border-radius:3px;background-color: #fff;box-shadow:0 0 5px rgba(0,0,0,0.2);z-index:10001;padding-top: 7px;}
.menuArea .humb span{border-top: 1px solid var(--MainColor);display:block;padding-top:5px;letter-spacing:.5px;position:relative;font-weight:700;font-size: 10px;color: var(--MainColor);}
.menuArea .humb span:before,.menuArea .humb span:after{content:"";border-top: 1px solid var(--MainColor);display:block;width:100%;height:1px}
.menuArea .humb span:before{margin-bottom:3px}
.menuArea .humb span:after{content:"";position:absolute;left:0;top:-6px}
.menuArea.open{position:fixed;top:0;left:0;width:100%;z-index:10000}
.menuArea.open .humb{position:fixed;right:auto;left: 4px;top: 4px;background:transparent;box-shadow:none}
.menuArea.open .humb span{display:none}
.menuArea.open .humb:before,.menuArea.open .humb:after{content:"";display:block;position:absolute;width:2px;height:30px;background: var(--MainColor);top:50%;left:50%}
.menuArea.open .humb:before{transform:translate(-50%,-50%) rotate(45deg);background: #fff;}
.menuArea.open .humb:after{transform:translate(-50%,-50%) rotate(-45deg);background: #fff;}

.menuArea.open .Close:before,
.menuArea.open .Close:after{content:"";width: 2px;height: 47px;background: #fff;top: 20px;display: block;left: 20px;position: absolute;}
.menuArea.open .Close:before{transform: translate(-50%,-50%) rotate(45deg);}
.menuArea.open .Close:after{transform: translate(-50%,-50%) rotate(-45deg);}

.menuArea .Inner ul{
    width: var(--width);
    flex-direction: column;
}
.menuArea .Inner li{}
.menuArea .Inner li + li{
    border-top: 1px dotted #fff;
}
.menuArea .Inner li + li:before{
    content: none;
}
.menuArea .Inner li a{
    color: #fff;
    display: block;
    padding: 14px 0px;
}
.menuArea .Inner li a:hover,
.menuArea .Inner li a.active{
    color: #ffef79;
}
.menuArea .Inner li a[href=""#Tour""]{}
.menuArea .Inner li a[href=""#Tour""]:hover{}

/*--------------------------------------MVbackphoto*/
.MVbackphoto{
    position: relative;
}
.MVbackphoto .slick-list{}
.MVbackphoto .slick-list li{height: 200px;}
.MVbackphoto li .img{}
.MVbackphoto li .img img{
    height: 200px;
    width: auto;
}
.MVbackphoto li .caption{}

/*-----------------------#MV*/
#MV{
    width: 100%;
    border: none;
    height: auto;
}
#MV .Inner{
    padding: 0 20px;
}
#MV .Inner h1{}
#MV .Inner h1:after{
    width: 30px;
}
#MV .Inner h1 .sub{
    font-size: 16px;
}
#MV .Inner h1 .sub strong{}
#MV .Inner h1 .main{
    font-size: 30px;
}
#MV .Inner h1 .main strong{}
#MV .Inner h1 span{}
#MV .Inner .txt{
    text-align: left;
    font-size: 13.5px;
}
#MV .Inner .txt strong{}
#MV .Inner .txt br{
    display: none;
}
#MV .Inner .btn a{}
#MV .Inner .btn a:hover{}
#MV .Inner .btn a:after{}
#MV .Visual{}
#MV #container{}
#MV #theTarget{}
#MV #theTarget div{}
#MV .skippr-nav-container{}
#MV .skippr-previous{}
#MV .skippr-next{}
#MV #theTarget .MV01{}
#MV #theTarget .MV02{}
#MV #theTarget .MV03{}
#MV #theTarget .MV04{}
#MV #theTarget .MV05{}

#MV #theTarget .caption{}



/*-----------------------Item--*/
#Item{
    margin-top: 0;
    padding: 30px 25px;
}
#Item .MainTxt{}
#Item .MainTxt strong{}
#Item h2{}

#Item .TitleArea{
    width: 100%;
}
#Item .TitleArea:before,
#Item .TitleArea:after{
    content: none;
}
#Item .TitleArea:before{}
#Item .TitleArea:after{}

/*---------------------------Intro*/
#Intro{
    width: var(--width);
}
#Intro .Entry{
    flex-direction: column;
}
#Intro .Entry + .Entry{}
#Intro .Entry:nth-of-type(even){}
#Intro .Entry .Main{}
#Intro .Entry .Main h2{
    font-size: 18px;
}
#Intro .Entry .Main h2 span{}

#Intro .Entry .Main .txt{
    font-size: 13.5px;
}
#Intro .Entry .photo{
    width: 100%;
}
#Intro .Entry .photo .img{}
#Intro .Entry .photo .img img{}
#Intro .Entry .photo .caption{}

/*------------------------Area*/
#Area{}
#Area:before{}
#Area h2{}

#Area .Entry{
    padding: 15px;
}
#Area .Entry + .Entry{
    margin-top: 20px;
}
#Area .Entry + .Entry:before{}
#Area .Entry .photo{
    flex-direction: column;
}
#Area .Entry .photo li{}
#Area .Entry .photo li img{}
#Area .Entry .photo .caption{}

#Area .Entry .Main{
    flex-direction: column;
}
#Area .Entry .Main .Title{
    flex-direction: column;
    align-items: flex-start;
}
#Area .Entry .Main .Title h3{
    font-size: 14px;
}
#Area .Entry .Main .Title h4{
    font-size: 23px;
}
#Area .Entry .Main .Title p{
    font-size: 14px;
}
#Area .Entry .Main .Recom{
    margin-top: 15px;
}
#Area .Entry .Main .Recom dl{}
#Area .Entry .Main .Recom dt{
    margin-bottom: 3px;
}
#Area .Entry .Main .Recom dd{}
#Area .Entry .Main .Recom dd .txt{}
#Area .Entry .Main .Recom dd .btn{}
#Area .Entry .Main .Recom dd .btn a{
    font-size: 13px;
    padding: 10px 18px;
}
#Area .Entry .Main .Recom dl + dl{}


/*-------------------------------Shusse*/
#Shusse{}
#Shusse:before,
#Shusse:after{}
#Shusse:after{}
#Shusse h2{}
#Shusse h2 .deco{
    font-size: 16px;
}
#Shusse h2 .main{
    font-size: 28px;
}
#Shusse h2 .sub{}
#Shusse .Inner{}
#Shusse .Inner .Main{
    margin-bottom: 20px;
}
#Shusse .Inner .Main .MainTxt{
    font-size: 14px;
    text-align: left;
}
#Shusse .Inner .Main .MainTxt br{
    display: none;
}
#Shusse .Inner .Main .MainTxt + .MainTxt{}
#Shusse .Inner .Main .MainTxt strong{
    font-size: 110%;
}
#Shusse .Inner .Main .MainTxt em{
    font-size: 110%;
}

#Shusse .Inner .Illust{
    width: 60%;
}
#Shusse .Inner .Illust img{}
#Shusse .Info{
    flex-direction: column;
    margin-bottom: 40px;
}
#Shusse .Info ul{
    flex-direction: column;
    row-gap: 10px;
    width: 100%;
    margin-bottom: 32px;
}
#Shusse .Info li{
    font-size: 12px;
    aspect-ratio: auto;
    border-radius: 3px;
    width: 100%;
    padding: 7px 10px;
    box-sizing: border-box;
    flex-direction: row;
    flex-wrap: wrap;
}
#Shusse .Info li + li{}
#Shusse .Info li span{}
#Shusse .Info li span br{
    display: none;
}
#Shusse .Info li span strong{
    font-size: 15px;
}
#Shusse .Info li .small{
    font-size: 12px;
}
#Shusse .Info dl{}
#Shusse .Info dl dt{
    justify-content: center;
}
#Shusse .Info dl dt span{
    font-size: 25px;
}
#Shusse .Info dl dt span + span{
    font-size: 13px;
}
#Shusse .Info dl dd{}
#Shusse .Info dl dd + dd{}
#Shusse .Info dl dd strong{}
#Shusse .Info dl dd + dd:before{}
#Shusse .btn{
    width: var(--width);
    margin: 0 auto;
    display: block;
}
#Shusse .btn a{
    font-size: 14px;
    padding: 16px 10px;
    display: block;
}



/*-------------------------------------------FAQ*/
#FAQ{}

#FAQ .Inner{
    margin-bottom: 0;
}
#FAQ .Inner dl{
    width: var(--width);
}
#FAQ .Inner dl + dl{
    margin-top: 20px;
    padding-top: 30px;
}
#FAQ .Inner dt{
    font-size: 15px;
}
#FAQ .Inner dd{
    font-size: 13px;
}
#FAQ .Inner dd strong{}
#FAQ .Inner dd .btn{}
#FAQ .Inner dd .btn a{}
#FAQ .Inner dd .btn a:after{}
#FAQ .Inner dd .btn a:hover{}
#FAQ .Inner .icon{}
#FAQ .Inner .icon:before{}
#FAQ .Inner dt .icon{}
#FAQ .Inner dd .icon{}
#FAQ .Inner dt .icon:before{}
#FAQ .Inner dd .icon:before{}

/*----------------------Contact*/
#Contact{}
#Contact h2{}
#Contact h2 .main{}
#Contact .Inner .btn li{
    white-space: inherit;
}
#Contact .Inner .btn a{}
#Contact .Inner .btn a:hover{}