@charset "UTF-8";

#fault{
	margin-bottom: 20px;
	padding: 10px 0;
	width: 100%;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
}
#fault p:not(:last-of-type){
	margin-bottom: 1em;
}
#fault h2{
	margin-bottom: 0.3em;
	font-size: 18px;
	color: #F00;
}
@media screen and (max-width: 480px){
	#contents #fault{
		font-size: 14px;
		line-height: 1.5;
	}
	#fault h2{
		margin-bottom: 0.3em;
		font-size: 16px;
		color: #F00;
	}
}

/* ---------------------------------------------------------
	スライド：テキスト
---------------------------------------------------------*/
.swiper {
	width: 100%;
	height: 100%;
}
.swiper-wrapper{
	width: 700px;
	height: 400px;
}
.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: none;
	display: flex;
	justify-content: center;
	align-items: center;
	background-position: center;
	background-size: cover;
}
.swiper-slide img {
	display: block;
	width: 100%;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
	bottom: 5px;
}
.swiper-pagination-bullet{
	width: 12px;
	height: 12px;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
	margin: 0 8px;
}
.swiper-pagination-bullet{
	opacity: 0.6;
}

/* ---------------------------------------------------------
	出発地から選ぶ
--------------------------------------------------------- */
section#dep_nav{
	margin-block: 70px 0;
}
section#dep_menu h2{
	margin-block: 0 20px;
	font-size: 28px;
	text-align: center;
}
#dep_nav nav > ul{
	justify-content: center;
	gap: 5px;
}
#dep_nav nav > ul > li{
	width: 16.25%;
}
#dep_nav nav ul li a{
	display: block;
	height: 100%;
	padding: 75px 15px 15px;
	text-align: center;
	background-color: #FFF;
	background-position: center 15px;
	background-repeat: no-repeat;
	border: 1px solid #FFF;
	text-decoration: none;
}
#dep_nav nav ul li#osa a{
	background-image: url(/ski/_common/dep_osa.svg);
}
#dep_nav nav ul li#ngo a{
	background-image: url(/ski/_common/dep_ngo.svg);
}
#dep_nav nav ul li#tyo a{
	background-image: url(/ski/_common/dep_tyo.svg);
}
#dep_nav nav ul li#hkr_thk a{
	background-image: url(/ski/_common/dep_hkr_thk.svg);
}
#dep_nav nav ul li#fuk a{
	background-image: url(/ski/_common/dep_fuk.svg);
}
#dep_nav nav ul li#mycar a{
	background-image: url(/ski/_common/dep_car.svg);
}
#dep_nav nav ul li a h3{
	padding-block: 3px;
	font-size: 20px;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	background: #00A0E9;
	border-radius: 100rem;
	transition: 0.3s;
}
#dep_nav nav ul.plan_list{
	margin-block: 10px 0;
}
ul.plan_list li:not(:last-of-type){
	margin-bottom: 5px;
}
ul.plan_list li{
	margin-block: 10px 0;
	font-size: 16px;
	color: #013C68;
}
#dep_nav nav ul li a:hover{
	border: 1px solid #E94900;
}
#dep_nav nav ul li a:hover h3{
	background: #E94900;
}
ul.plan_list li a:hover{
	color: #E94900;
}

/* ---------------------------------------------------------
	コンテンツ：ニュース
---------------------------------------------------------*/
article#news_wrapper{
	margin-block: 50px 0;
	padding: 50px;
	background: #FFF;
}
#news_wrapper #news_inner{
	padding: 30px;
	background: #F6F6F6;
}
#news_inner #news{
	justify-content: space-between;
	margin-block: 20px 0;
	padding: 5px 20px;
	height: 250px;
	overflow: scroll;
	background: #FFF;
}
#news section{
	width: 48%;
}
#news section a{
	padding: 10px;
	padding-bottom: 10px;
	text-decoration: none;
	border-bottom: 1px dotted #CCC;
	background: #FFF;
}
#news section a:hover{
	color: #16160E;
	background: #FFFFDD;
}
#news section > a > .summary{
	width: calc(100% - 110px);
}
#news section > a > .summary.noimg{
	width: 100%;
}
#news .summary > span{
	display: inline-block;
	margin-right: 5px;
	padding: 2px 5px;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	color: #FFF;
	background: #00A0E9;
	border-radius: 3px;
}
#news .summary > span > span{
	display: block;
	margin-top: 2px;
	line-height: 1.2;
	font-weight: normal;
}
#news .summary > span.dep{
	width: fit-content;
}
#news .summary > span.area{
	width: 9em;
}
#news a:hover .summary > span.dep,
#news a:hover .summary > span.area{
	background: #FF871B;
}
#news section time{
	font-size: 14px;
	color: #013C68;
}
#news section a h3{
	margin-top: 5px;
	line-height: 1.2;
	font-size: 16px;
	text-decoration: underline;
}
#news section a:hover h3{
	color: #E94900;
}
#news section a p{
	margin-top: 5px;
	color: #013C68;
}
#news section a figure{
	width: 100px;
	margin-left: 10px;
	-webkit-transition: 300ms;
	transition: 300ms;
}
#news section a:hover figure{
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

/* ---------------------------------------------------------
	bxticker：ティッカー
--------------------------------------------------------- */
#ticker_wrapper{
	margin-top: 50px;
	max-width: 100%;
}
#ticker_wrapper .bx-wrapper{
	margin: 0 auto;
	background: none;
	box-shadow: none;
	border: none;
}
#ticker_wrapper ul#ticker{
	display: flex;
	height: 100%;
}
#ticker_wrapper ul#ticker li{
	background: #FFF;
}
#ticker_wrapper ul#ticker .slick-slide{
	margin: 0 5px;
}
#ticker_wrapper ul#ticker li a{
	display: block;
	text-decoration: none;
}
#ticker_wrapper ul#ticker li:hover{
	background: #FFFFDD;
	cursor: pointer;
}
#ticker_wrapper ul#ticker li a img{
	width: 100%;
	max-height: 140px;
	-webkit-transition: 300ms;
	transition: 300ms;
}
#ticker_wrapper ul#ticker li a:hover img{
	-webkit-transform: scale(1.03);
	transform: scale(1.03);
}
#ticker_wrapper ul#ticker li a dl{
	margin: 5px 10px 10px;
}
#ticker_wrapper ul#ticker li a dl dt{
	font-size: 14px;
	font-size: 14rem;
	font-weight: bold;
	color: #000;
	text-decoration: underline;
}
#ticker_wrapper ul#ticker li a:hover dl dt{
	color: #1592E6;
}
#ticker_wrapper ul#ticker li a dl dd{
	font-size: 12px;
	font-size: 12rem;
}
#ticker_wrapper ul#ticker li a:hover dl dd{
	color: #16160E;
}

/* ---------------------------------------------------------
	レスポンシブ
--------------------------------------------------------- */
@media screen and (max-width: 1180px){
	#dep_nav nav > ul > li{
		width: 25%;
	}
}
@media screen and (max-width: 820px){
	article#news_wrapper{
		margin-block: 80px 0;
		padding: 30px;
	}
}
@media screen and (max-width: 440px){
	.swiper-wrapper{
		width: 100vw;
		height: fit-content;
	}
	#dep_nav nav > ul > li{
		width: calc((100% - 5px) / 2);
	}
	#dep_nav nav ul li a h3{
		padding-block: 5px;
		font-size: 19px;
	}
	ul.plan_list li{
		margin-block: 0;
	}
	section#dep_nav{
		margin-block: 30px 0;
	}
	article#news_wrapper{
		margin-top: 50px;
		padding: 20px;
		width: 100%;
	}
	#news_wrapper #news_inner{
		padding: 20px;
	}
	#news section{
		width: 100%;
	}
	#news_inner #news{
		margin: 0;
		padding: 5px;
	}
}