@charset "UTF-8";


/* オンラインリフトとパックのボタン */
.other_bt{}
.other_bt .box{
display: grid;
grid-template-columns: 48% 48%;
gap: 4%;
}
.other_bt .box a{
border: 1px solid var(--color-green);
color:var(--color-black);
text-align: center;
padding: 15px 5px;
transition: 0.3s;
font-size: var(--s12);
}
.other_bt .box a span:last-child{
font-family: var(--font-en);
display: block;
font-size: var(--s18);
line-height: var(--s18);
}
.other_bt .box a.bt-01 span:first-child{
background-image: url(../img/icon_tickets.svg);
display: block;
width: 25px;
height: 30px;
margin: 0 auto 10px auto;
}
.other_bt .box a.bt-02 span:first-child{
background-image: url(../img/icon_pack.svg);
display: block;
width: 35px;
height: 30px;
margin: 0 auto 10px auto;
}
.other_bt .box a:hover{
background-color: var(--color-green);
color: var(--color-white);
}
.other_bt .box a.bt-01:hover span:first-child{
background-image: url(../img/icon_tickets_w.svg);
}
.other_bt .box a.bt-02:hover span:first-child{
background-image: url(../img/icon_pack_w.svg);
}



/* アンカーメニュー */
.anchor{margin: 50px 0;}




/* リフト料金タイトル */
.lift-tickets{}

.lift-tickets .js-title01 span{transition-delay:1s;}

/*リフト料金表 */
.lift-tickets__tab {
flex-wrap: wrap;
display: flex;
justify-content: center;
margin-top: 30px;
}
/* ボタン */
.lift-tickets__tab .tab_class {
width: calc((100%/4) - 4px);
font-size: var(--s12);
height: 80px;
line-height: var(--s16);
text-align: center;
display: block;
order: -1;
padding: 7px 3px;
color: var(--color-white);
margin: 0 2px 15px 2px;
font-weight: 600;
}
.lift-tickets__tab .tab_class span{display: block;}

.lift-tickets__tab label[for="tab1"] {background-color: #aa7777;}
.lift-tickets__tab label[for="tab2"] {background-color: #9ab588;}
.lift-tickets__tab label[for="tab3"] {background-color: #bfb588;}
.lift-tickets__tab label[for="tab4"] {background-color: #6fa1aa;}

/* チェックボタンを非表示 */
.lift-tickets__tab input[name="tab_name"] {display: none;}
.lift-tickets__tab input[name="tab_name-02"] {display: none;}

/* 表示してるボタンの下伸ばす */
.lift-tickets__tab input:checked + .tab_class::after {
content: "";
display: block;
width: calc(100% + 6px);
height: 15px;
margin-left: -3px;
margin-top: 9px;
}
.lift-tickets__tab input#tab1:checked + .tab_class::after {background-color: #aa7777;}
.lift-tickets__tab input#tab2:checked + .tab_class::after {background-color: #9ab588;}
.lift-tickets__tab input#tab3:checked + .tab_class::after {background-color: #bfb588;}
.lift-tickets__tab input#tab4:checked + .tab_class::after {background-color: #6fa1aa;}


/* 展開エリア */
.lift-tickets__tab .content_class {
display: none;
width: 100%;
border: 1px solid;
padding: 20px;
}
input:checked + .tab_class + .content_class {
display: block;
}


.lift-tickets__tab .content_class .date{
text-align: center;
font-size: var(--s16);
}
.lift-tickets__tab .content_class .time{
text-align: center;
font-size: var(--s18);
font-weight: 500;
line-height: var(--s18);
}
.lift-tickets__tab .content_class .time span{
margin-right: 5px;
display: block;
font-size: var(--s16);
margin-top: 10px;
}
.lift-tickets__tab .content_class .scroll-table{margin: 20px auto;}
.lift-tickets__tab .content_class .table01{width: 100%;}
.lift-tickets__tab .content_class .table01 td{text-align: center;}

/* th横 */
.content_class.tab1 .table01 tr:nth-child(1) th {background-color: #aa7777;}
.content_class.tab2 .table01 tr:nth-child(1) th {background-color: #9ab588;}
.content_class.tab3 .table01 tr:nth-child(1) th {background-color: #bfb588;}
.content_class.tab4 .table01 tr:nth-child(1) th {background-color: #6fa1aa;}

/* th縦 */
.content_class.tab1 .table01 th {background-color: #f4eaea;}
.content_class.tab2 .table01 th {background-color: #e8efe4;}
.content_class.tab3 .table01 th {background-color: #f9f6e8;}
.content_class.tab4 .table01 th {background-color: #f0f1f5;}

/* 色交互 */
.content_class.tab1 .table01 tr:nth-child(odd){background-color:#fcf5f5;}
.content_class.tab2 .table01 tr:nth-child(odd){background-color:#f6f9f4;}
.content_class.tab3 .table01 tr:nth-child(odd){background-color:#fcfbf7;}
.content_class.tab4 .table01 tr:nth-child(odd){background-color:#f8f9fb;}

/* ボタン */
.lift-tickets__tab .bt01{margin-top: 30px;}


/*カレンダー */
.calendar_winter{margin: 50px 0;}


/* ご利用にあたり */
.lift-tickets__note .title02{
margin-top: 50px;
margin-bottom: 10px;
}

/* シーズン券 */
.season-tickets{margin: 70px 0 130px 0;}
.season-tickets .table01 td{text-align: center;}
.season-tickets .table01 tr td:nth-of-type(1) {text-align:left;}
.season-tickets .scroll-table{margin: 10px 0; width: 100%;}

.season-tickets .title02{margin: 50px 0 10px 0;}
.season-tickets .content_class .table02{margin: 30px 0 5px 0;}
.season-tickets .content_class small{margin: 0 0 30px 0;}

.season-tickets .lift-tickets__tab label[for="tab5"] {background-color: var(--color-green);}
.season-tickets .lift-tickets__tab label[for="tab6"] {background-color: var(--color-blue);}
.season-tickets .lift-tickets__tab input#tab5:checked + .tab_class::after {background-color: var(--color-green);}
.season-tickets .lift-tickets__tab input#tab6:checked + .tab_class::after {background-color: var(--color-blue);}
.season-tickets .content_class a.bt01{width: 100%; margin: 7px 0;}

/* ボタン */
.season-tickets .lift-tickets__tab label[for="tab5"].tab_class,
.season-tickets .lift-tickets__tab label[for="tab6"].tab_class{
width: calc((100%/2) - 20px);
height: 50px;
margin: 0 2px 12px 2px;
}

.season-tickets a.bt{
display: block;
margin-top: 40px;
background-image: url(../img/seasonnet_bn_ja_sp.webp);
background-position:0 0;
background-size: contain;
width: 100%;
height: 0;
/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
padding-top: 36.862%;
transition: 0.3s;
/*かげ*/
box-shadow:0px 0px 4px 2px #ccc;
}
.season-tickets a.bt:hover{
opacity: 0.7;
}





/* アンヌプリとビレッジの共通リフト券 */
.annupuri_village{margin: 70px 0 130px 0;}
.annupuri_village .txt{margin: 20px 0 10px 0;}
.annupuri_village .table01 tr td:nth-of-type(1) {text-align:left;}
.annupuri_village .table01 td{text-align: center;}
.annupuri_village .bt01{margin-top: 30px;}
.annupuri_village .ac-title{
font-weight: 600;
font-size: var(--s14);
}



/*ニセコ全山 */
.niseko_all{
margin: 70px 0 130px 0;
}
.niseko_all .txt br{display: none;}
.niseko_all a.bt{
display: block;
margin-top: 20px;
background-image: url(../img/nisekounited_bn_sp.webp);
background-position:0 0;
background-size: contain;
width: 100%;
height: 0;
/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
padding-top: 36.89%;
transition: 0.3s;
}
.niseko_all a.bt:hover{
opacity: 0.7;
}