@charset "UTF-8";

/*
以下
@media screen and (max-width: 899px) {
}
以上
@media screen and (min-width: 900px) {
}
*/


/*------------------------------------------------*/
/*------------------- 運行情報 -------------------*/
/*------------------------------------------------*/
.ski-info {}

.ski-info .ski-info__inner {}

/*日時*/
.ski-info .ski-info__inner .curent-time {
  background-color: var(--color-gray-light);
  text-align: center;
  padding: 7px;
  font-size: var(--s20);
  font-weight: 600;
  margin-bottom: 30px;
}

.ski-info .ski-info__inner .curent-time .day {
  margin-right: 15px;
}

/*リフト コース 全体囲み */
.ski-info .ski-info__inner .asari-rift-course {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 15px 3%;
}

@media screen and (max-width: 1000px) {
  .ski-info .ski-info__inner .asari-rift-course {
    grid-template-columns: 1fr 1fr;
  }
}


/*リフト コース 共通 */
.ski-info .asari-rift__content,
.ski-info .asari-course__content {
  margin: 7px 0 40px 0;
}

.ski-info .asari-rift__content .asari-rift__item .title,
.ski-info .asari-course__content .asari-course__item .title {
  font-size: var(--s14);
  line-height: var(--s18);
  place-content: center;
  /*gridの中央配置*/
  place-items: center;
  /*要素二つ以上ある場合に*/
}

.ski-info .asari-rift__content .asari-rift__item,
.ski-info .asari-course__content .asari-course__item {
  display: grid;
  grid-template-columns: 1fr 115px;
  border: 1px solid;
  border-width: 1px 0 0 0;
  padding: 5px 0;
}

.ski-info .asari-rift__content .asari-rift__item:last-child,
.ski-info .asari-course__content .asari-course__item:last-child {
  border-width: 1px 0;
}

.ski-info .asari-rift__content .asari-rift__item .open-close,
.ski-info .asari-course__content .asari-course__item .open-close {
  color: var(--color-white);
  line-height: 100%;
  text-align: center;
  padding: 7px;
  place-content: center;
  /*gridの中央配置*/
  place-items: center;
  /*要素二つ以上ある場合に*/
}

.ski-info .asari-course__content .asari-course__item.under_line {
  border-bottom: 1px solid;
}

@media screen and (max-width: 1000px) {
  .ski-info .asari-course__content .asari-course__item.under_line {
    border-bottom: 0px solid;
  }
}


/* リフト */
.ski-info .asari-rift__content .asari-rift__item .open-close {
  background-color: var(--category-color-blue);
}

.ski-info .asari-rift__content .asari-rift__item .open-close[data-content="Close"] {
  color: var(--color-white);
  background: var(--color-black);
}


/* コース */
.ski-info .asari-course__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 4%;
}

@media screen and (max-width: 1000px) {
  .ski-info .asari-course__content {
    grid-template-columns: 1fr;
    gap: 0 0;
  }
}

.ski-info .asari-course__content .asari-course__item .open-close {
  background-color: var(--color-green-light);
}

.ski-info .asari-course__content .asari-course__item .open-close[data-content="×"] {
  color: var(--color-white);
  background: var(--color-black);
}


/* わくわく */
.ski-info .ski-info-wakuwaku{
display: grid;
grid-template-columns: 1fr 2fr 1fr;
column-gap: 0px;
margin-top: 30px;
}
.ski-info .ski-info-wakuwaku .details{
background-color: var(--color-blue);
padding: 20px 30px;
color: var(--color-white);
}
.ski-info .ski-info-wakuwaku .details h4{
font-size: var(--s24);
}

.ski-info .ski-info-wakuwaku .img-left{
background-image: url(../img/ski-info-wakuwaku-ph01.webp);
background-size: cover;
}
.ski-info .ski-info-wakuwaku .img-right{
background-image: url(../img/ski-info-wakuwaku-ph02.webp);
background-size: cover;
}
.ski-info .ski-info-wakuwaku figcaption{
font-size: var(--s14);
padding: 5px;
}



/*------------------------------------------------*/
/*------------------- ゲレンデマップ -------------------*/
/*------------------------------------------------*/
.slope_map .slope_map_info{
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 20px;
  align-items:flex-end;
}






/*------------------------------------------------*/
/*------------------- コース -------------------*/
/*------------------------------------------------*/
.course{}

/* コースメニュー */
.course .anchor__nav .anchor__nav-list .item:nth-child(1):after{
background-color: var(--category-color-green);
}
.course .anchor__nav .anchor__nav-list .item:nth-child(2):after{
background-color: var(--color-red);
}
.course .anchor__nav .anchor__nav-list .item:nth-child(3):after{
background-color: var(--color-black);
}
.course .anchor__nav .anchor__nav-list .item:nth-child(4):after{
background-color: var(--color-orange);
}

/* コース内容 共通 */
.course_info{
margin-top: 120px;
}
.course .course_info h3{
font-size: var(--s30);
margin-bottom: 20px;
}
.course .course_info .course_info-list {
display: grid;
gap:40px 40px;
grid-template-columns: 1fr 1fr;
}
.course .course_info .course_info-list p{
line-height: var(--s24);
}
.course .course_info .course_info-list .img{
margin-bottom: 10px;
border-top: solid 4px;
}
.course .course_info .course_info-list .img img{
width: 100%;
}
.course .course_info .course_info-list h4{
font-size: var(--s26);
margin-bottom: 10px;
}
.course .course_info .course_info-list .table03{
font-size: var(--s14);
margin-top: 15px;
}
.course .course_info .course_info-list .table03 td{
text-align: center;
vertical-align: middle;
}


/* コース別 */
.course .course_info.beginner h3{color: var(--category-color-green);}
.course .course_info.beginner .course_info-list .img{border-color: var(--category-color-green);}

.course .course_info.intermediate h3{color: var(--color-red);}
.course .course_info.intermediate .course_info-list .img{border-color: var(--color-red);}

.course .course_info.expert h3{color: var(--color-black);}
.course .course_info.expert .course_info-list .img{border-color: var(--color-black);}

.course .course_info.fun h3{color: var(--color-orange);}
.course .course_info.fun .course_info-list .img{border-color: var(--color-orange);}

/* 初心者ゾーン */
.course .course_info .course_info-list .beginner{width: 100%; position: relative;}
.course .course_info .course_info-list .beginner figcaption{
width: 50%;
position: absolute;
left: 0;
padding: 10px;
font-size: var(--s14);
}
.course .course_info .course_info-list .beginner figcaption.beginner-02{
left:50%
}

/* 非圧雪 無料 */
.course .course_info .course_info-list .img {position: relative;}
.course .course_info.expert .course_info-list .img span,
.course .course_info.fun .course_info-list .img span{
position: absolute;
right: 10px;
top:10px;
background-color: var(--color-black);
padding: 7px;
line-height: 100%;
display: block;
color: var(--color-white);
font-size: var(--s24);
}
.course .course_info.fun .course_info-list .img span{
background-color: var(--color-orange);
color: var(--color-black);
}

/* ツリーラン ファン */
.course .course_info .course_info-list .treerun,
.course .course_info .course_info-list .fun-box{
grid-column: 1 / -1; /*幅100%にする */
/* 下記から内部 */
display: grid;
column-gap: 10px;
grid-template-columns: 1fr 1fr;
border-top: solid 4px;
}
.course .course_info .course_info-list .fun-box{border-color: var(--color-orange);}

.course .course_info .course_info-list .treerun .img,
.course .course_info .course_info-list .fun-box .img{
border: none;
}
.course .course_info .course_info-list .treerun .treerun-info,
.course .course_info .course_info-list .fun-box .fun-info{
margin: 20px 0 0 20px;
}
.course .course_info .course_info-list .fun-box .fun-info img{margin-top: 20px;}

.course .course_info .course_info-list .treerun .treerun-info-box{
background-color: var(--color-gray-light);
padding: 10px;
margin-top: 20px;
}



/*------------------------------------------------*/
/*------------------- 施設 -------------------*/
/*------------------------------------------------*/

.faciliteies{}

/* 施設囲い */
.faciliteies-wrap{
outline: 4px solid var(--color-blue);
position: relative;
margin-bottom: 100px;
overflow: hidden;
}

.faciliteies-wrap .faciliteies-title{
position: absolute;
color: var(--color-white);
font-size: var(--s28);
background-color: var(--color-blue);
line-height: 100%;
padding: 5px 15px 10px 15px;
top:0;
left: 0;
z-index: 5;
}
/* メイン */
.faciliteies-wrap .faciliteies-main-img{
  display: grid;
  grid-template-columns: 67.5% 32.5%;
  grid-template-rows: auto 1fr;
  align-items: flex-start;
  gap: 0;
  grid-template-areas:
    "areaA areaB"
    "areaA areaC";
}
.faciliteies-wrap .faciliteies-main-img .img{position: relative;}
.faciliteies-wrap .faciliteies-main-img .img img{width: 100%; height: auto;}
.faciliteies-wrap .faciliteies-main-img .img span{
position: absolute;
bottom: 10px;
left: 10px;
}
.faciliteies-wrap .faciliteies-main-img .img01 {
  grid-area: areaA;
}
.faciliteies-wrap .faciliteies-main-img .img02 {
  grid-area: areaB;
}
.faciliteies-wrap .faciliteies-main-img .img03 {
  grid-area: areaC;
}

/* インナー */
.faciliteies-wrap .faciliteies-inner{
margin: 2.5rem;
}

/* 施設アイコン */
.faciliteies-wrap .faciliteies-icon{
background-color: var(--color-gray-light);
padding: 15px;
margin: 20px 0 60px 0;
}
.faciliteies-wrap .faciliteies-icon .faciliteies-icon-list{
display: flex;
flex-wrap: wrap;
justify-content:start;
width: 80%;
margin: 0 auto;
}
.faciliteies-wrap .faciliteies-icon .faciliteies-icon-list .item{
margin: 5px 10px;
}
.faciliteies-wrap .faciliteies-icon .faciliteies-icon-list .item img{
width: 17px;
vertical-align: middle;
margin-right: 5px;
}

/* 店内施設 */
.faciliteies-wrap .faciliteies-info .faciliteies-info-list{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap:15px 3%;
margin-bottom: 80px;
}
.faciliteies-wrap .faciliteies-info .faciliteies-info-list .item{
position: relative;
}
.faciliteies-wrap .faciliteies-info .faciliteies-info-list .img img{
width: 100%;
}
.faciliteies-wrap .faciliteies-info .faciliteies-info-list .maru{
position: absolute;
top:-10px;
left: -10px;
background:var(--color-blue);
color: var(--color-white);
display: inline-flex;
justify-content: center;
align-items: center;
border-radius: 50%;
flex-flow: column;
vertical-align: top;
width: 45px;
height: 45px;
}
.faciliteies-wrap .faciliteies-info .faciliteies-info-list h4{
font-size: var(--s20);
margin: 7px 0 3px 0;
}
.faciliteies-wrap .faciliteies-info .faciliteies-info-list .bt07{
text-align: right;
margin-top: 15px;
}

.faciliteies-wrap .ac-box{
margin-bottom: 2.5rem;
}

/* メイン以外の写真 */
.faciliteies-wrap .faciliteies-img .img{
margin: 20px 0;
}



/* ゲレンデハウス、コヒーハウス、バルーガ */
.faciliteies .gerendehouse_coffeehouse_wrap{
display: flex;
  flex-wrap: wrap; /*折り返しても*/
  justify-content: space-between;
}
.faciliteies .gerendehouse_coffeehouse_wrap .faciliteies-wrap{
width: 48%;
}
.faciliteies .gerendehouse_coffeehouse_wrap .faciliteies-main-img{
  grid-template-areas:
    "areaA areaA";
}
.faciliteies .gerendehouse_coffeehouse_wrap .faciliteies-wrap .pay-content{
  display: block;
}
.faciliteies .gerendehouse_coffeehouse_wrap .faciliteies-wrap .pay-content .pay-item .img img{
  margin-right: 10px;
}
.faciliteies .gerendehouse_coffeehouse_wrap .faciliteies-wrap .bt05{
margin: 10px auto;
width: 100%;
display: block;
}


/* 微調整 */
.faciliteies-wrap.galzighouse .faciliteies-icon,
.faciliteies-wrap.baruga .faciliteies-icon{
margin-bottom: 0;
}
.faciliteies-wrap.centerhouse .ac-box{
margin-bottom: 0;
}