@charset "utf-8";

/*-- PICA ResortSite common.css --*/

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css?family=Emblema+One&display=swap');

/* reset */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {
    min-width: 320px;
    color: #333;
    line-height:1;
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","MS P Gothic","Osaka","Hiragino Kaku Gothic Pro", Verdana,Arial, Helvetica, sans-serif; 
	font-family: 'Noto Sans JP', sans-serif;
	-webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
ol,ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a,
botton {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    outline: none;
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
input, select {
    vertical-align:middle;
}
img {
	max-width: 100%;
}
*:focus {
    outline: none;
}

a {
    transition: .3s;
}

/* font */

.emblema {
    font-family: 'Emblema One', cursive;
}

/* layout */

.wrap { 
	width: 1000px; 
	margin: 0 auto;
}
.wrap_wide { 
	width: 1120px; 
	margin: 0 auto;
}

@media screen and (max-width: 1180px){
    .wrap_wide { 
        width: calc(100% - 60px); 
    }
}
@media screen and (max-width: 1060px){
    .wrap,
    .wrap_wide { 
        width: calc(100% - 40px); 
    }
    .wrap .wrap,
    .wrap .wrap .wrap { 
        width: 100%;
    }
}


/*----- header -----*/

/* nav */

.h_nav {
    display: flex;
    justify-content: space-between;
    font-weight: 500;
}
.h_nav h1 {
    width: 15.5%;
    order: 1;
}
.h_nav h1 img {
    width: 60.5%;
    padding: 10px 0 20px;
}
.h_nav .h_login {
    width: 12.5%;
    order: 3;
}
.h_nav .h_login a {
    display: block;
    background: #ff8633;
    height: 100px;
    color: #fff;
}
.h_nav .h_login a.btn_null {
    background: #ababab;
    pointer-events: none;
}
.h_nav .h_login a:hover {
    background: #ff661e;
}
.h_login_title {
    padding: 10px 0 12px;
    font-size: 1.375rem;
    text-align: center;
}
.h_login_arrow {
    position: relative;
    height: 24px;
    text-align: center;
}
.h_login_arrow::before,
.h_login_arrow::after {
    position: absolute;    
    top: 0;
    bottom: 0;
    left: calc(50% - 12px);
    margin: auto;
    content: "";
    vertical-align: middle;        
}
.h_login_arrow::before {
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    border-radius: 50%;    
}
.h_login_arrow::after {
    left: calc(50% - 6px);
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);    
}
.h_login_text {
    padding: 8px 0 0;
    font-size: .625rem;
    text-align: center;
}

.h_nav nav {
    width: 72%;
    order: 2;
}
.h_nav nav ul {
    display: flex;
}
.h_nav nav ul li {
    width: 33.3333%;
    border-left: 1px solid #e0f6a8;
}
.h_nav nav ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #ccc;
    height: 60px;
    font-size: .875rem;
    text-align: center;    
}
.h_nav nav ul li:nth-of-type(1) a {
    background: #343434;
    color: #fff;
}
.h_nav nav ul li:nth-of-type(1) a:hover {
    background: #000;
}
.h_nav nav ul li:nth-of-type(2) a,
.h_nav nav ul li:nth-of-type(3) a,
.h_nav nav ul li:nth-of-type(4) a {
    background: #c0ed51;
    color: #333;
}
.h_nav nav ul li:nth-of-type(2) a:hover,
.h_nav nav ul li:nth-of-type(3) a:hover,
.h_nav nav ul li:nth-of-type(4) a:hover {
    background: #91dc1a;
}
.h_nav nav ul li:first-child {
    border-left: none;
}
.h_nav nav ul li a img {
    width: 36px;
    margin: 0 8px 0 0;
}
.h_nav nav ul li a .activity {
    margin-left: -8px;
    font-size: .72rem;
}

/* menu */

.h_menu_btn {
    display: none;
}
.h_menu {
    width: 72%;
    margin-left: 15.5%;
    margin-top: -40px;
    display: flex;
    justify-content: space-between;
    height: 40px;
    font-weight: 500;
}
.h_menu_list {
    width: 82.5%;
}
.h_menu_list li {
    display: inline;
    margin-right: 30px;
}
.h_menu_list li a {
    display: inline-block;
    padding: 14px 0 10px;
    font-size: .75rem;
    border-bottom: 4px solid #fff;
    color: #333;
}
.h_menu_list li a:hover {
    border-bottom: 4px solid #333;
}
.h_menu_list span,
.h_menu_list ul {
    display: none;
}
.h_menu_list_sp {
    display: none;
}

.h_lang {
    position: relative;
    width: 17.5%;
}
.h_lang_btn {
    display: block;
    width: 85.5%;
    margin: 9px 0;
    padding: 4px 0;
    background: #fff;
    border: 1px solid #333;
    border-radius: 15px;
    cursor: pointer;
    font-size: .875rem;
    text-align: center;
    transition: .3s;
}
.h_lang_btn.open,
.h_lang_btn:hover {
    background: #333;
    color: #fff;
}
.h_lang_list {
    display: none;
    position: absolute;
    z-index: 99;
    top: 37px;
    width: 85.5%;
    background: #fff;
    border: 1px solid #333;
    border-radius: 10px;
}
.h_lang_list li {
    margin: 0 10px;
}
.h_lang_list li a {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid #333;
    color: #333;
    font-size: .75rem;
    text-align: center;
}
.h_lang_list li:last-child a {
    border-bottom: none;
}
.h_lang_list li a:hover {
    color: #666;
}

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

    /* nav */

    .h_login_title {
        font-size: 20px;
    }
    .h_login_text {
        font-size: 9px;
    }

    .h_nav nav ul li a {
        font-size: 1.2vw;
    }
    .h_nav nav ul li a img {
        width: 3vw;
        margin: 0 .8vw 0 0;
    }
    .h_nav nav ul li a .activity {
        margin-left: -.8vw;
        font-size: 1vw;
    }

    /* menu */

    .h_menu_list li {
        margin-right: 2vw;
    }
    .h_menu_list li a {
        font-size: 1.4vw;
        border-bottom-width: .2vw;
    }
    .h_menu_list li a:hover {
        border-bottom-width: .2vw;
    }
    
    .h_lang {
        width: 17.5%;
    }
    .h_lang_btn {
        padding: .4vw 0;
        font-size: 1.4vw;
    }
    .h_lang_list li {
        margin: 0 1vw;
    }
    .h_lang_list li a {
        padding: 1vw 0;
        font-size: 1.2vw;
    }

}
@media screen and (max-width: 767px){
    
    header .wrap_wide {
        width: 100%;
        margin: 0;
    }
    
    /* nav */

    .h_nav {
        flex-wrap: wrap;
    }
    .h_nav h1 {
        width: 47%;
        order: 1;
    }
    .h_nav h1 img {
        width: 40%;
        padding: 1.5vw 20px;
    }
    .h_nav .h_login {
        position: relative;
        width: 38%;
        order: 2;
    }
    .h_nav .h_login a {
        height: 16vw;
    }
    .h_login_title {
        padding: 4vw 3vw 0;
        font-size: 4vw;
        text-align: left;
    }
    .h_login_arrow {
        position: absolute;
        top: 50%;
        right: 8vw;
        height: auto;
    }
    .h_login_arrow::before,
    .h_login_arrow::after {
        left: 0;
    }
    .h_login_arrow::before {
        width: 6vw;
        height: 6vw;
    }
    .h_login_arrow::after {
        left: calc(50% + 1.2vw);
        width: 2vw;
        height: 2vw;
    }
    .h_login_text {
        padding: 2vw 3vw 0;
        font-size: 2.5vw;
        text-align: left;
    }

    .h_nav nav {
        width: 100%;
        order: 4;
    }
    .h_nav nav ul li a {
        flex-wrap: wrap;
        height: auto;
        padding: 2vw 0;
        font-size: 3.25vw;
    }
    .h_nav nav ul li a img {
        width: 8vw;
        margin: 0;
    }
    .h_nav nav ul li a span {
        display: block;
        width: 100%;
        margin-top: -2vw;
    }
    .h_nav nav ul li a span::before {
        content: "\A";
        white-space: pre;
    }
    .h_nav nav ul li a .activity {
        margin-top: -.25vw;
        margin-left: 0;
        font-size: 2.25vw;
    }

    /* menu_btn */
    
    .h_menu_btn {
        width: 15%;
        display: block;
        order: 3;
        background: #ebebeb;
        cursor: pointer;
    }
    .h_menu_btn_inner {
        position: relative;
        display: block;
        width: 50%;
        margin: 6vw auto 0;
    }
    .h_menu_btn span {
        position: absolute;
        right: 0;
        width: 100%;
        height: .5vw;
        background-color: #333;
        transition: all .3s;
    }
    .h_menu_btn span:nth-of-type(1) {
        top: 0;
    }
    .h_menu_btn span:nth-of-type(2) {
        top: 1.5vw;
    }
    .h_menu_btn span:nth-of-type(2)::after {
        position: absolute;
        top: 0;
        right: 0;
        content: '';
        width: 100%;
        height: .5vw;
        background-color: #333;
        transition: all .3s;
    }
    .h_menu_btn span:nth-of-type(3) {
        top: 3vw;
    }
    .h_menu_btn.active span:nth-of-type(1) {
        transform: translateY(8px) scale(0);
    }
    .h_menu_btn.active span:nth-of-type(2) {
        width: 100%;
        transform: rotate(-30deg);
    }
    .h_menu_btn.active span:nth-of-type(2)::after {
        transform: rotate(60deg);
    }
    .h_menu_btn.active span:nth-of-type(3) {
        transform: translateY(-8px) scale(0);
    }
    
    /* menu */

    .h_menu {
        display: none;
        position: absolute;
        z-index: 9999;
        top: 16vw;
        left: 0;
        width: 100%;
        background: #ebebeb;
        margin-left: 0;
        margin-top: 0;
        height: auto;
    }
    .h_menu_list {
        width: auto;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin: 3vw 6vw 6vw;
    }
    .h_menu_list li {
        width: 100%;
        display: block;
        margin-right: 0;
        margin-left: 30%;
    }
    .h_menu_list li a {
        display: inline-block;
        margin-bottom: 2vw;
        padding: 12px 0;
        padding-right: 2vw;
        font-size: 5vw;
        border-color: #333;
        border-width: .5vw;
    }
    .h_menu_list li a:hover {
        border-width: .5vw;
    }
    .h_menu_list span {
        display: inline-block;
        color: #b3dd4c;
        margin-right: 2vw;
    }
    .h_menu_list > li {
        display: none;
    }
    
    .h_menu_list ul {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-top: 4vw;
    }
    .h_menu_list ul li {
        width: 45%;
        margin-left: 5%;
    }
    .h_menu_list ul li a {
        font-size: 3.25vw;
        border-width: .25vw;
        padding-right: 0;
    }
    .h_menu_list ul li a:hover {
        border-width: .25vw;
    }
    .h_menu_list ul li a img {
        width: 3.5vw;
        margin: 0 0 -.5vw 2vw;
    }
    
    .h_menu_list_sp {
        display: block;
    }
    .h_menu_list_sp ul {
        display: block;
        margin: 2vw 4vw 0;
    }
    .h_menu_list_sp ul li {
        width: 100%;
        margin-left: 50%;
    }
    .h_menu_list_sp ul li a {
        display: inline-block;
        margin-bottom: 2vw;
        padding: 12px 0;
        padding-right: 2vw;
        font-size: 5vw;
        border-color: #333;
        border-width: .5vw;
    }
    .h_menu_list_sp ul li a:hover {
        border-width: .5vw;
    }
    
    
    .h_lang {
        display: flex;
        justify-content: space-between;
        width: 80%;
        margin: 0 auto 8vw;
        background: #fff;
        border-radius: 5vw;
    }
    .h_lang_btn {
        width: calc(28% - .5vw);
        margin: 9px 0;
        padding: 4px 0;
        background: none;
        border: none;
        border-right: .5vw solid #333;
        border-radius: 0;
        font-size: 3vw;
        cursor: default;
    }
    .h_lang_btn.open,
    .h_lang_btn:hover {
        background: #fff;
        color: #333;
    }
    .h_lang_list {
        display: flex;
        position: relative;
        align-items: center;
        top: auto;
        width: 68%;
        border: none;
        border-radius: 5vw;
    }
    .h_lang_list li {
        margin: 0;
        width: 25%;
    }
    .h_lang_list li a {
        display: inline-block;
        padding: 2vw 0;
        border: none;
        font-size: 3vw;
    }
    
}
@media screen and (min-width: 768px){

    .h_menu {
        display: flex!important;
    }
    
}


/*----- main -----*/

main {
    line-height: 1.6;
}
main a {
    color: #333;
    text-decoration: none;
}
main a:hover {
    color: #000;
}
.clearfix::after {
	display: block;
	clear: both;
	content: "";
}

/* section */

.section_area {
    padding: 100px 0;
}
.section_area.narrow {
    padding: 50px 0;
}
.gray {
    background: #f8f8f8;
}


/* reserved */

.reserved {
    padding: 50px 0 60px;
    background: #ebebeb;
}
.reserved .main_subtitle {
    color: #333!important;
}
.reserved .mod_btn {
    margin-bottom: 0;
}
.reserved .mod_btn li a {
    color: #333!important;
    border-color: #333!important;
}
.reserved .mod_btn li a:hover {
    color: #fff!important;
    background: #333!important;
}
.reserved .mod_btn li a::before {
    background: #333!important;
}
.reserved .mod_btn li a::after {
    border-color: #fff!important;
}
.reserved .mod_btn li a:hover::before {
    background: #fff!important;
}
.reserved .mod_btn li a:hover::after {
    border-color: #333!important;
}

/* point & camp */

.point_camp {
    display: flex;
    justify-content: space-between;
}

.point_area {
    width: 50%;
    background: #abd938;
    display: flex;
    justify-content: flex-end;
}
.point_area .frame {
    width: 500px;
}
.point_area .inner {
    display: flex;
    justify-content: space-between;
    padding: 30px 45px 30px 20px;
}
.point_area .mark {
    width: 26%;
}
.point_area .mark img {
    border-radius: 50%;
}
.point_area .text {
    width: 68%;
}
.point_area .point_title {
    font-size: 1.5rem;
    font-weight: bold;
}
.point_area .point_text {
    margin: 8px 0;
    font-size: .875rem;
}
.point_area .point_btn {
    text-align: right;
}
.point_area .point_btn a {
    position: relative;
    padding: 0 20px 3px 0;
    font-size: .875rem;
    font-weight: bold;
    border-bottom: 3px solid #333;
}
.point_area .point_btn a::after {
    position: absolute;
    content: '';
    bottom: 8px;
    right: 0;
    width: 6px;
    height: 6px;
    border-top: solid 2px #333;
    border-right: solid 2px #333;
    transform: rotate(45deg);
}
.point_area .point_btn a:hover,
.point_area .point_btn a:hover::after {
    color: #000;
    border-color: #000;
}

.camp_area {
    width: 50%;
    background: #333;
    color: #fff;
}
.camp_area .frame {
    width: 500px;
}
.camp_area .inner {
    display: flex;
    justify-content: space-between;
    padding: 30px 20px 30px 45px;
}
.camp_area .mark {
    width: 26%;
}
.camp_area .mark img {
    border-radius: 50%;
}
.camp_area .text {
    width: 68%;
}
.camp_area .camp_title {
    font-size: 1.5rem;
    font-weight: bold;
}
.camp_area .camp_link {
    display: flex;
    flex-wrap: wrap;
    margin-top: 12px;
}
.camp_area .camp_link li {
    font-size: .875rem;
    margin-bottom: 10px;
}
.camp_area .camp_link li:nth-of-type(2n) {
    width: 65%;
}
.camp_area .camp_link li:nth-of-type(2n+1) {
    width: 35%;
}
.camp_area .camp_link li a {
    padding-bottom: 3px;
    color: #fff;
    border-bottom: 2px solid #fff;
}
.camp_area .camp_link li a:hover {
    color: #999;
    border-color: #999;
}

/* follow us */

.follow_us {
    padding: 100px 0 60px;
    background: url("/common/images/sns_bg.png") no-repeat #f8f8f8;
    background-position: top 10px center;
    background-size: 398px auto;
}
.follow_us ul {
    display: flex;
    justify-content: space-between;
    width: 83%;
    margin: 0 auto;
}
.follow_us ul li {
    width: 48%;
}
.follow_us ul li a {
    position: relative;
    display: flex;
    justify-content: space-between;
    padding: 25px 0;
    background: #fff;
    border: 3px solid #fff;
    border-radius: 60px;
}
.follow_us ul li a .sns_mark {
    width: 20%;
    margin-top: 5px;
    text-align: right;
}
.follow_us ul li a .sns_mark img {
    width: 36px;
}
.follow_us ul li a .sns_text {
    width: 75%;
    font-size: 1.125rem;
    font-weight: bold;
    line-height: 1.2;
}
.follow_us ul li a .sns_text span {
    font-size: .875rem;
}
.follow_us ul li a:hover {
    border-color: #333;
}
.follow_us ul li a::before,
.follow_us ul li a::after {
    position: absolute;    
    top: 0;
    bottom: 0;
    right: 12px;
    margin: auto;
    content: "";
    vertical-align: middle;        
}
.follow_us ul li a::before {
    box-sizing: border-box;
    width: 30px;
    height: 30px;
    border: 3px solid #333;
    -webkit-border-radius: 50%;
    border-radius: 50%;    
}
.follow_us ul li a::after {
    right: 25px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);    
}

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

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

    /* section */

    .section_area {
        padding: 10vw 0;
    }
    .section_area.narrow {
        padding: 5vw 0;
    }

    /* reserved */

    .reserved {
        padding: 5vw 0 6vw;
    }
    
    /* point & camp */

    .point_area .frame {
        width: 100%;
    }
    .point_area .inner {
        padding: 3vw 2vw;
    }
    .point_area .point_title {
        font-size: 2.4vw;
    }
    .point_area .point_text {
        margin: .8vw 0;
        font-size: 1.4vw;
    }
    .point_area .point_btn a {
        padding: 0 2vw .3vw 0;
        font-size: 1.4vw;
        border-width: .3vw;
    }
    .point_area .point_btn a::after {
        bottom: .8vw;
        width: .6vw;
        height: .6vw;
        border-width: .3vw;
    }

    .camp_area .frame {
        width: 100%;
    }
    .camp_area .inner {
        padding: 3vw 2vw;
    }
    .camp_area .camp_title {
        font-size: 2.4vw;
    }
    .camp_area .camp_link {
        margin-top: 1.2vw;
    }
    .camp_area .camp_link li {
        font-size: 1.4vw;
        margin-bottom: 1vw;
    }
    .camp_area .camp_link li:nth-of-type(2n) {
        width: 65%;
    }
    .camp_area .camp_link li:nth-of-type(2n+1) {
        width: 35%;
    }
    .camp_area .camp_link li a {
        padding-bottom: .3vw;
        border-width: .3vw;
    }
    
    /* follow us */

    .follow_us {
        padding: 10vw 0 6vw;
        background-position: top 1vw center;
        background-size: 40vw auto;
    }
    .follow_us ul li a {
        padding: 2.5vw 0;
        border-width: .3vw;
        border-radius: 6vw;
    }
    .follow_us ul li a .sns_mark {
        margin-top: .5vw;
    }
    .follow_us ul li a .sns_mark img {
        width: 3.6vw;
    }
    .follow_us ul li a .sns_text {
        font-size: 1.7vw;
    }
    .follow_us ul li a .sns_text span {
        font-size: 1.4vw;
    }
    .follow_us ul li a::before,
    .follow_us ul li a::after {
        right: 1.2vw;
    }
    .follow_us ul li a::before {
        width: 3vw;
        height: 3vw;
        border-width: .3vw;
    }
    .follow_us ul li a::after {
        right: 2.5vw;
        width: .6vw;
        height: .6vw;
        border-width: .3vw;
    }
    
}
@media screen and (max-width: 767px){
    
    /* section */

    .section_area {
        padding: 12vw 0;
    }
    .section_area.narrow {
        padding: 6vw 0;
    }
    
    /* reserved */

    .reserved {
        padding: 8vw 0 10vw;
    }
    
    /* point & camp */

    .point_camp {
        display: block;
    }
    .point_area {
        width: 100%;
    }
    .point_area .inner {
        padding: 10vw 20px;
    }
    .point_area .point_title {
        font-size: 4.25vw;
    }
    .point_area .point_text {
        margin: 2vw 0;
        font-size: 3.5vw;
    }
    .point_area .point_text br {
        display: none;
    }
    .point_area .point_btn a {
        padding: 0 4vw .6vw 0;
        font-size: 4vw;
        border-width: .8vw;
    }
    .point_area .point_btn a::after {
        bottom: 2vw;
        width: 1.2vw;
        height: 1.2vw;
        border-width: .8vw;
    }
    
    .camp_area {
        width: 100%;
    }
    .camp_area .inner {
        padding: 10vw 20px;
    }
    .camp_area .camp_title {
        font-size: 4.25vw;
    }
    .camp_area .camp_link {
        margin-top: 4vw;
        
    }
    .camp_area .camp_link li {
        font-size: 3.25vw;
        margin-bottom: 4vw;
    }
    .camp_area .camp_link li:nth-of-type(2n) {
        width: 65%;
    }
    .camp_area .camp_link li:nth-of-type(2n+1) {
        width: 35%;
    }
    .camp_area .camp_link li a {
        padding-bottom: .8vw;
        border-width: .8vw;
    }
    
    /* follow us */

    .follow_us {
        padding: 20vw 0 12vw;
        background-position: top 2vw center;
        background-size: 80vw auto;
    }
    .follow_us ul {
        display: block;
        width: 90%;
    }
    .follow_us ul li {
        width: 100%;
        margin-bottom: 4vw;
    }
    .follow_us ul li a {
        padding: 5vw 0;
        border-width: 1vw;
        border-radius: 12vw;
    }
    .follow_us ul li a .sns_mark {
        margin-top: .5vw;
    }
    .follow_us ul li a .sns_mark img {
        width: 10vw;
    }
    .follow_us ul li a .sns_text {
        font-size: 4vw;
    }
    .follow_us ul li a .sns_text span {
        font-size: 3.25vw;
    }
    .follow_us ul li a::before,
    .follow_us ul li a::after {
        right: 3vw;
    }
    .follow_us ul li a::before {
        width: 6vw;
        height: 6vw;
        border-width: .8vw;
    }
    .follow_us ul li a::after {
        right: 5.5vw;
        width: 1.2vw;
        height: 1.2vw;
        border-width: .8vw;
    }

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

    /* point & camp */
    
    .point_area .point_title,
    .camp_area .camp_title {
        font-size: 6vw;
    }

}


/*----- footer -----*/

.f_nav {
    background: #abd938;
}
.f_nav_list {
    padding: 20px 0;
    text-align: center;
}
.f_nav_list li {
    display: inline;
    margin: 0 24px;
    font-size: 1rem;
}
.f_nav_list li a {
    color: #333;
}
.f_nav_list li a:hover {
    color: #000;
}

.f_menu {
    padding: 15px 0 25px;
    background: #343434;
    color: #fff;
}
.f_menu .wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.f_menu_list {
    width: 65%;
}
.f_menu_list li {
    display: inline;
    margin: 0 20px 0 0;
    font-size: .75rem;
}
.f_menu_list li a {
    color: #fff;
}
.f_menu_list li a:hover {
    color: #999;
}

.f_logo {
    width: 35%;
    text-align: right;
}
.f_logo h1 {
    margin: 0 0 20px;
}
.f_logo .copyright {
    font-size: .625rem;
}

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

    .f_nav_list {
        padding: 2vw 0;
    }
    .f_nav_list li {
        margin: 0 2.4vw;
        font-size: 1.6vw;
    }

    .f_menu {
        padding: 1.5vw 0 2.5vw;
    }
    .f_menu_list li {
        margin: 0 2vw 0 0;
        font-size: 1.2vw;
    }

    .f_logo h1 {
        margin: 0 0 2vw;
    }
    .f_logo .copyright {
        font-size: 1vw;
    }

}
@media screen and (max-width: 767px){
    
    .f_nav_list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 4vw 0;
        text-align: left;
    }
    .f_nav_list li {
        width: 50%;
        display: block;
        margin: 2vw 0;
        font-size: 3vw;
    }

    .f_menu {
        padding: 6vw 0;
    }
    .f_menu .wrap {
        display: block;
    }
    .f_menu_list {
        width: 100%;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .f_menu_list li {
        width: 50%;
        display: block;
        margin: 2vw 0;
        font-size: 3vw;
    }

    .f_logo {
        width: 100%;
    }
    .f_logo h1 {
        margin: 4vw 0;
    }
    .f_logo .copyright {
        font-size: 2vw;
    }    
    
}
@media screen and (max-width: 475px){

    .f_nav_list {
        padding: 8vw 0;
    }
    .f_menu {
        padding: 10vw 0;
    }
    .f_nav_list li,
    .f_menu_list li {
        margin: 4vw 0;
        font-size: 4vw;
    }
    .f_nav_list li:nth-of-type(2n),
    .f_menu_list li:nth-of-type(2n) {
        width: 40%;
    }
    .f_nav_list li:nth-of-type(2n+1),
    .f_menu_list li:nth-of-type(2n+1) {
        width: 60%;
    }

    .f_logo h1 {
        margin: 2vw 0 6vw;
    }
    .f_logo .copyright {
        font-size: 3vw;
    }
    
}





/*---------------------------------------

    for location

---------------------------------------*/

/*----- header -----*/

.lc_basic .h_nav h1 {
    width: 24%;
}
.lc_basic .h_nav h1 img {
    width: 84.5%;
    padding: 25px 0;
}
.lc_basic .h_nav nav {
    width: 63.5%;
    order: 2;
}
.lc_basic .h_menu {
    width: 63.5%;
    margin-left: 24%;
}
.lc_basic .h_menu_list {
    width: 80%;
}
.lc_basic .h_lang {
    width: 20%;
}
.lc_basic .h_reserve_btn {
    display: none;
}

/* float btn */

.lc_reserve_btn {
    position: fixed;
    top: 30vw;
    right: 0;
    z-index: 100;
    writing-mode: tb-rl;
}
.lc_reserve_btn a {
    position: relative;
    display: block;
    padding: 20px 15px 90px;
    background: #ff8633;
    color: #fff;
}
.lc_reserve_btn a:hover {
    background: #ff661e;
}
.lc_reserve_btn a::before,
.lc_reserve_btn a::after {
    position: absolute;    
    bottom: 20px;
    left: calc(50% - 12px);
    margin: auto;
    content: "";
    vertical-align: middle;        
}
.lc_reserve_btn a::before {
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    border-radius: 50%;    
}
.lc_reserve_btn a::after {
    bottom: 28px;
    left: calc(50% - 6px);
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);    
}
.lc_login_title {
    font-size: 1.5rem;
    font-weight: 500;
    margin-left: 10px;
}
.lc_login_text {
    font-size: .75rem;
}

@media screen and (max-width: 1180px){
    
}
@media screen and (max-width: 1060px){
    
    /* float btn */

    .lc_reserve_btn {
        top: 30vw;
    }
    .lc_reserve_btn a {
        padding: 2vw 1.5vw 9vw;
    }
    .lc_reserve_btn a::before,
    .lc_reserve_btn a::after {
        bottom: 2vw;
        left: calc(50% - 1.2vw);
    }
    .lc_reserve_btn a::before {
        width: 2.4vw;
        height: 2.4vw;
        border-width: .3vw;
    }
    .lc_reserve_btn a::after {
        bottom: 2.8vw;
        left: calc(50% - .6vw);
        width: .6vw;
        height: .6vw;
        border-width: .3vw;
    }
    .lc_login_title {
        font-size: 2.4vw;
        margin-left: 1vw;
    }
    .lc_login_text {
        font-size: 1.2vw;
    }
    
}
@media screen and (max-width: 767px){
    

    .lc_basic header {
        position: relative;
    }
    .lc_basic .h_nav {
        display: block;
    }
    .lc_basic .h_nav h1 {
        width: 100%;
    }
    .lc_basic .h_nav h1 img {
        width: 40%;
        padding: 1.5vw 20px;
    }
    .lc_basic .h_nav .h_login {
        display: none;
    }
    .lc_basic .h_nav nav {
        width: 100%!important;
    }
    
    /* menu */

    .lc_basic .h_menu {
        display: block;
        position: relative;
        z-index: 1;
        top: auto;
        background: #fff;
        width: 100%;
        margin-left: 0;
    }
    .lc_basic .h_menu_list {
        width: auto;
        display: flex;
        margin: 1vw 20px .2vw;
    }
    .lc_basic .h_menu_list li {
        width: auto;
        display: block;
        margin-right: 0;
        margin-left: 0;
    }
    .lc_basic .h_menu_list li a {
        display: inline-block;
        margin-bottom: 0;
        padding: 3vw 0;
        border-color: #fff;
        border-width: .9vw;
        font-size: 3vw;
    }
    .lc_basic .h_menu_list li a:hover {
        border-width: .9vw;
    }
    .lc_basic .h_menu_list > li:nth-of-type(4),
    .lc_basic .h_menu_list > li:nth-of-type(5) {
        display: inline-block;
    }
        
    .lc_basic .h_lang {
        position: absolute;
        top: calc(-25vw - 10px);
        right: 20px;
        display: block;
        width: 30%;
        margin: 0 auto 8vw;
        background: none;
    }
    .lc_basic .h_lang_btn {
        width: auto;
        margin: 9px 0;
        padding: 4px 0;
        background: #fff;
        border-right: none;
        border: 1px solid #333;
        border-radius: 5vw;
        font-size: 3vw;
        cursor: pointer;
    }
    .lc_basic .h_lang_btn.open,
    .lc_basic .h_lang_btn:hover {
        background: #333;
        color: #fff;
    }
    .lc_basic .h_lang_list {
        display: none;
        top: -1vw;
        width: 100%;
        border: 1px solid #333;
        border-radius: 2vw;
    }
    .lc_basic .h_lang_list li {
        margin: 0 auto;
        width: 87.5%;
    }
    .lc_basic .h_lang_list li a {
        display: block;
        padding: 2vw 0;
        border-bottom: 1px solid #333;
        font-size: 3vw;
        text-align: center;
    }
    .lc_basic .h_lang_list li:last-child a {
        border-bottom: none;
    }

    .lc_basic .h_reserve_btn {
        display: block;
    }
    .lc_basic .h_reserve_btn a {
        position: relative;
        display: block;
        padding: 5vw 20px;
        background: #ff8633;
        color: #fff;
        font-size: 4vw;
        font-weight: 500;
    }
    .lc_basic .h_reserve_btn a:hover {
        background: #ff661e;
    }
    .lc_basic .h_reserve_btn a span {
        margin-left: 1vw;
        font-size: 3vw;
    }
    .lc_basic .h_reserve_btn a::before,
    .lc_basic .h_reserve_btn a::after {
        position: absolute;    
        top: 0;
        bottom: 0;
        right: 20px;
        margin: auto;
        content: "";
        vertical-align: middle;        
    }
    .lc_basic .h_reserve_btn a::before {
        box-sizing: border-box;
        width: 6vw;
        height: 6vw;
        border: .6vw solid #fff;
        -webkit-border-radius: 50%;
        border-radius: 50%;    
    }
    .lc_basic .h_reserve_btn a::after {
        right: calc(20px + 2.4vw);
        width: 1.5vw;
        height: 1.5vw;
        border-top: .6vw solid #fff;
        border-right: .6vw solid #fff;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);    
    }
    .lc_basic .h_reserve_btn a.btn_null {
        background: #ababab;
        pointer-events: none;
    }
    
    /* float btn */

    .lc_reserve_btn {
        top: 60vw;
    }
    .lc_reserve_btn a {
        padding: 2vw 2vw 10vw;
    }
    .lc_reserve_btn a::before,
    .lc_reserve_btn a::after {
        bottom: 3vw;
        left: calc(50% - 2.4vw);
    }
    .lc_reserve_btn a::before {
        width: 5vw;
        height: 5vw;
        border-width: .6vw;
    }
    .lc_reserve_btn a::after {
        bottom: 4.6vw;
        left: calc(50% - 1.2vw);
        width: 1.2vw;
        height: 1.2vw;
        border-width: .6vw;
    }
    .lc_login_title {
        font-size: 4vw;
        margin-left: 1.5vw;
    }
    .lc_login_text {
        font-size: 2.75vw;
    }    

}
@media screen and (max-width: 475px){
    
    /* float btn */

    .lc_reserve_btn {
        top: 90vw;
    }
    
}


/*----- main -----*/

.logo_area {
    padding: 40px 0;
    border-top: 1px solid #ebebeb;
    text-align: center;
}
.logo_area img {
    height: 60px;
}

@media screen and (max-width: 1060px){
   
    .logo_area {
        padding: 4vw 0;
    }
    .logo_area img {
        height: 6vw;
    }
    
}
@media screen and (max-width: 767px){
  
    .logo_area {
        padding: 8vw 0;
    }
    .logo_area img {
        height: 10vw;
    }
    
}

/*----- footer -----*/

.lc_basic .f_nav {
    background: #ccc;
    color: #fff;
    padding: 50px 0 40px;
    line-height: 1.2;
}
.lc_basic .f_nav a {
    color: #fff;
}
.lc_basic .f_nav a:hover {
    color: #999;
    border-color: #999;
}
.lc_basic .f_nav .wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.lc_basic .f_nav_menu {
    width: 80%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.lc_basic .f_nav_menu_box {
    width: 15.625%;
}
.lc_basic .f_nav_menu_title {
    margin-bottom: 25px;
    font-size: 1.25rem;
    font-weight: 500;
}
.lc_basic .f_nav_menu_title a {
    display: block;
    padding-bottom: 10px;
    border-bottom: 3px solid #fff;
}
.lc_basic .f_nav_menu ul li {
    margin-bottom: 10px;
    font-size: .75rem;
}

.lc_basic .f_subnav_menu {
    width: 9%;
}
.lc_basic .f_subnav_menu ul {
    padding-bottom: 30px;
}
.lc_basic .f_subnav_menu ul:last-child {
    padding-bottom: 0;
}
.lc_basic .f_subnav_menu ul li {
    margin-bottom: 15px;
    font-size: .75rem;
}

.lc_basic .f_menu {
    background: #000;
}

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

    .lc_basic .f_nav {
        padding: 5vw 0 4vw;
    }
    .lc_basic .f_nav_menu {
        width: 87%;
    }
    .lc_basic .f_nav_menu_box {
        width: 17.25%;
    }
    .lc_basic .f_nav_menu_title {
        margin-bottom: 2.5vw;
        font-size: 2vw;
    }
    .lc_basic .f_nav_menu_title a {
        padding-bottom: 1vw;
        border-width: .4vw;
    }
    .lc_basic .f_nav_menu ul li {
        margin-bottom: 1vw;
        font-size: 1.4vw;
    }

    .lc_basic .f_subnav_menu {
        width: 9%;
    }
    .lc_basic .f_subnav_menu ul {
        padding-bottom: 3vw;
    }
    .lc_basic .f_subnav_menu ul li {
        margin-bottom: 1.5vw;
        font-size: 1.2vw;
    }    
    
}
@media screen and (max-width: 767px){
    
    .lc_basic .f_nav {
        padding: 10vw 0 4vw;
    }
    .lc_basic .f_nav_menu {
        width: 100%;
        margin-bottom: 4vw;
    }
    .lc_basic .f_nav_menu_box {
        width: 47%;
        margin-bottom: 8vw;
    }
    .lc_basic .f_nav_menu_title {
        margin-bottom: 5vw;
        font-size: 4.5vw;
    }
    .lc_basic .f_nav_menu_title a {
        padding-bottom: 2vw;
        border-width: .8vw;
    }
    .lc_basic .f_nav_menu ul li {
        margin-bottom: 2vw;
        font-size: 3.25vw;
    }

    .lc_basic .f_subnav_menu {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
    .lc_basic .f_subnav_menu ul {
        width: 47%;
        padding-bottom: 6vw;
    }
    .lc_basic .f_subnav_menu ul li {
        margin-bottom: 3vw;
        font-size: 3.25vw;
    }    
    
    .lc_basic .f_menu_list li:nth-of-type(2n),
    .lc_basic .f_menu_list li:nth-of-type(2n+1) {
        width: 47%;
    }
    
    
}
@media screen and (max-width: 475px){

    
}



/*----------------------------
    color change
----------------------------*/

/* reset */

.lc_basic .h_nav nav ul li {
    background: #ccc;
    border-color: rgba(255,255,255,.3);
}
.lc_basic .h_nav nav ul li:nth-of-type(n) a,
.lc_basic .h_nav nav ul li:nth-of-type(n) a:hover {
    background: none;
    color: #fff;
}
.lc_basic .h_nav nav ul li a {
    color: #fff;
}


/* yoshida */

#yoshida .h_nav nav ul li,
#yoshida .f_nav {
    background: #e8536a;
}
#yoshida .h_menu_list li a:hover {
    border-color: #e8536a;
}
#yoshida .h_nav nav ul li a:hover {
    background: #d92c3e;
}

/* saiko */

#saiko .h_nav nav ul li,
#saiko .f_nav {
    background: #00afeb;
}
#saiko .h_menu_list li a:hover {
    border-color: #00afeb;
}
#saiko .h_nav nav ul li a:hover {
    background: #009fdb;
}

/* yamanakako */

#yamanakako .h_nav nav ul li,
#yamanakako .f_nav {
    background: #00a95f;
}
#yamanakako .h_menu_list li a:hover {
    border-color: #00a95f;
}
#yamanakako .h_nav nav ul li a:hover {
    background: #00994f;
}

/* fujiyama */

#fujiyama .h_nav nav ul li,
#fujiyama .f_nav {
    background: #4d4398;
}
#fujiyama .h_menu_list li a:hover {
    border-color: #4d4398;
}
#fujiyama .h_nav nav ul li a:hover {
    background: #3d3388;
}

/* chichibu */

#chichibu .h_nav nav ul li,
#chichibu .f_nav {
    background: #a54a97;
}
#chichibu .h_menu_list li a:hover {
    border-color: #a54a97;
}
#chichibu .h_nav nav ul li a:hover {
    background: #953a87;
}

/* grinpa */

#grinpa .h_nav nav ul li,
#grinpa .f_nav {
    background: #f6ad3c;
}
#grinpa .h_menu_list li a:hover {
    border-color: #f6ad3c;
}
#grinpa .h_nav nav ul li a:hover {
    background: #e69d2c;
}

/* akeno */

#akeno .h_nav nav ul li,
#akeno .f_nav {
    background: #e95532;
}
#akeno .h_menu_list li a:hover {
    border-color: #e95532;
}
#akeno .h_nav nav ul li a:hover {
    background: #d94522;
}

/* omotefuji */

#omotefuji .h_nav nav ul li,
#omotefuji .f_nav {
    background: #9ace1e;
}
#omotefuji .h_menu_list li a:hover {
    border-color: #9ace1e;
}
#omotefuji .h_nav nav ul li a:hover {
    background: #8abe0e;
}

/* hatsushima */

#hatsushima .h_nav nav ul li,
#hatsushima .f_nav {
    background: #e85298;
}
#hatsushima .h_menu_list li a:hover {
    border-color: #e85298;
}
#hatsushima .h_nav nav ul li a:hover {
    background: #d84288;
}

/* sagamiko */

#sagamiko .h_nav nav ul li,
#sagamiko .f_nav {
    background: #177fc4;
}
#sagamiko .h_menu_list li a:hover {
    border-color: #177fc4;
}
#sagamiko .h_nav nav ul li a:hover {
    background: #076fb4;
}

/* wildbase */

#wildbase .h_nav nav ul li,
#wildbase .f_nav {
    background: #02ada9;
}
#wildbase .h_menu_list li a:hover {
    border-color: #02ada9;
}
#wildbase .h_nav nav ul li a:hover {
    background: #029d99;
}



