/****************************/
/**    　　　　　　　　　    **/
/**    全ページ共通ＣＳＳ    **/
/**    　　　　　　　　　    **/
/****************************/


/***** 初期値、リセットなど *****/
header, footer, nav, section, article, figure, aside {
	display:block;
	}

html, body, h1, h2, h3, h4, h5, h6, ul, li, dl, dt, dd, div, p, span, nav, img, .wrapper, header, footer {
	-webkit-font-smoothing: antialiased;
	font-family:
		"Meiryo",
        "メイリオ",
		"Hiragino Maru Gothic Pro",
		"ヒラギノ丸ゴ Pro",
		sans-serif;
	letter-spacing: 0.2vw;
	margin: 0;
	padding: 0;
	}



body {
	background: url(../image/share/sora.webp) center / auto 100% no-repeat fixed;
	color: #000;
	}

img {
	pointer-events: none;
	}

/****************************/
/**    スクロールアニメ       **/
/****************************/

@keyframes scroll-anim {
	from {
		opacity: 0;
		scale: 0.8;
		}
	to {
		opacity: 1;
		scale: 1;
		}
	}

.scroll_anime {
	animation: scroll-anim linear;
	animation-timeline: view(0);
	animation-range: entry 0% entry 100%;
	}


/****************************/
/**    ラッパー             **/
/****************************/

.wrapper {
	width: 100vw;
	height: auto;
	}

/***************************************************/
/**    ヘッダー メニュー     **/
/***************************************************/


header {
	position: fixed;
	top: 0;
	width: 100%;
	height: 7vw;
	background:rgba(255, 255, 255, 1.0);
	display: flex;
	justify-content: space-around;
	z-index: 100;
	}

/*---   ロゴ   ---*/
h1 {
	width: 15%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	}

h1 a {
	width: 80%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	}

h1 a img {
	width: auto;
	height: 100%;
	}


/*---   メニューお問い合わせ等   ---*/
.inquiry {
	width: 10%;
	height: 100%;
	background: #00a0e9;
	}

.inquiry a {
	width: 100%;
	height: 100%;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
	}

.mail {
	width: 40%;
	height: 45%;
	background: url(../image/share/mail.svg) center / 100% auto no-repeat;
	}

.inquiry a p {
	color: #fff;
	width: 90%;
	height: 20%;
	font-size: 1vw;
	display: flex;
	justify-content: center;
	align-items: center;
	}

/*---   メニュー   ---*/
.navi {
	width: 65%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	}

.navi ul {
	width: 100%;
	height: auto;
	font-size: 1.2vw;
	display: flex;
	justify-content: space-around;
	align-items: center;
	}

.navi ul li {
	display: flex;
	justify-content: center;
	align-items: center;
	}

.navi ul li a {
	position: relative;
	color: #000;
	text-decoration: none;
	width: auto;
	height: auto;
	text-decoration: none;
	}

.navi ul li a::before {
	background: #00a0e9;
	content: '';
	width: 100%;
	height: 2px;
	position: absolute;
	left: 0;
	bottom: 0;
	margin: auto;
	transform-origin: center top;
	transform: scale(0, 1);
	transition: transform .3s;
  	}

.navi ul li a:hover {
	color: #00a0e9;
	font-weight: bold;
	text-shadow: 0.1vw 0.1vw 0.1vw #f0f0f0;
	}

.navi ul li a:hover::before {
	transform-origin: center top;
	transform: scale(1, 1);
  	}

.navi_bottom {
	display: none;
	}

/****************************/
/**    フッター             **/
/****************************/

footer {
	background: #fcfff9;
	width: 100vw;
	height: auto;
	display: flex;
    flex-direction: column;
	align-items: center;
	}

.footer_main {
	width: 90%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	}

.footer_top {
	width: 94%;
	height: auto;
	margin: 5% 0;
	}

.map {
	aspect-ratio: 16/9;
	width: 100%;
	height: auto;
	}

iframe {
	width: 100%;
	height: 100%;
	}

.footer_middle {
	width: 94%;
	height: auto;
	display: flex;
	justify-content: space-between;
	}

.footer_middle_left {
	width: 33%;
	}

.footer_middle_left .date {
	font-size: 1.5vw;
	font-weight: bold;
	}

.each-file {
	margin-top: 5%;
	font-size: 1.1vw;
	line-height: 2vw;
	list-style: none;
	display: flex;
	flex-direction: column;
	}

.each-file li a {
	color: #000;
	text-decoration: none;
	}

.file {
	padding-right: 4%;
	background: url(../image/share/rink_yajirushi.svg) right center / auto 100% no-repeat;
	}	

.footer_middle_center {
	width: 50%;
	height: auto;
	display: flex;
	flex-direction: column;
	}

.footer_middle_center h4 {
	font-size: 1.5vw;
	}

.shien-p {
	margin-top: 10%;
	}

.shien-p a {
	background: url(../image/share/rink_yajirushi.svg) right center / auto 100% no-repeat;
	color: #000;
	text-decoration: none;
	}

.footer_middle_center h5 {
	font-size: 1.2vw;
	margin: 3% 0;
	}

.footer_middle_center dl {
	width: 100%;
	height: auto;
	margin-top: 1%;
	margin-bottom: 1%;
	display: flex;
	align-items: baseline;
	}

.footer_middle_center dl dt {
	width: 25%;
	font-size: 1.2vw;
	}


.footer_middle_center dl dd {
	display: flex;
	flex-direction: column;
	}

.footer_middle_center dl dd a {
	color: #000;
	background: url(../image/share/rink_yajirushi.svg) right center / auto 75% no-repeat;
	margin-top: 1%;
	margin-bottom: 1%;
	font-size: 1.2vw;
	text-decoration: none;
	}

.icon0 {
	padding-right: 1.5vw;
	}


.icon01 {
	margin-right: -7%;
	}

.icon02 {
	margin-right: 17%;
	}

.icon03 {
	margin-right: -5%;
	}

.banner {
	width: 15%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	}

.banner a {
	width: 100%;
	height: auto;
	margin: 2% 0;
	display: flex;
	align-items: center;
	}

.banner a img{
	width: 100%;
	height: auto;
	}

.location {
	width: 90%;
	height: auto;
	margin-top: 5%;
	display: flex;
	justify-content: space-around;
	align-items: baseline;
	}

.information_left {
	width: 40%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	}

.information_left p {
	font-size: 1.2vw;
	}

.information_left .name {
	font-size: 4vw;
	}

.information_right {
	width: 50%;
	height: auto;
	display: flex;
	flex-direction: column;
	}

.information_right dl {
	margin: 1% 0;
	display: flex;
	align-items: baseline;
	}

.information_right dl dt {
	width: 20%;
	font-size: 1vw;
	line-height: 0.8vw;
	display: flex;
	flex-direction: column;
	align-items: center;
	}

.information_right dl dt span {
	font-size: 0.4vw;
	}

.information_right dl dd {
	font-size: 1vw;
	}

/*---   コピーライトの文字   ---*/
.under {
	margin: 3vw 0;
	font-size: 0.8vw;
	display: flex;
    justify-content: center;
	align-items: center;
	}


@media (max-width: 960px){


	body {
		background: url(../image/share/sora_tate.webp) center center 100% auto no-repeat;
		}

	/***************************************************/
	/**    ヘッダー メニュー     **/
	/***************************************************/

	header {
		position: fixed;
		top: 0;
		width: 100%;
		height: 12vw;
		background:rgba(255, 255, 255, 0);
		justify-content: space-between;
		}
	
	.service {
		display: none;
		}
	
	/*---   ロゴ   ---*/
	h1 {
		margin-left: 3vw;
		justify-content: space-between;
		}
	
	
	/*---   お問い合わせ等   ---*/
	.inquiry {
		width: 12%;
		margin: 0.2vw 0.4vw 0 0;
		border-radius: 50%;
		}
	
	.mail {
		width: 60%;
		height: 65%;
		}
	
	.inquiry a p {
		display: none;
		}

	/*---   メニュー   ---*/
	.navi {
		display: none;
		}

	.navi_bottom {
		position: fixed;
		display: block;
		bottom: 0;
		width: 100vw;
		height: auto;
		background: #00a0e9;
		}

	.navi_bottom ul {
		width: 100%;
		font-size: 3vw;
		height: auto;
		display: flex;
		justify-content: space-around;
		}

	.navi_bottom ul li {
		width: auto;
		height: 17vw;
		display: flex;
		justify-content: center;
		align-items: center;
		}

	.navi_bottom ul li a {
		color: #fff;
		width: 100%;
		height: auto;
		text-align: center;
		text-decoration: none;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		}

	/****************************/
	/**    フッター             **/
	/****************************/

	footer {
		height: auto;
		margin-bottom: 17vw;
		}

	.footer_middle {
		width: 100%;
		flex-direction: column;
		align-items: center;
		}

	.footer_middle_left {
		width: 90%;
		margin-top: 10%;
		display: flex;
		flex-direction: column;
		align-items: center;
		}

	.footer_middle_left .date {
		font-size: 4vw;
		text-align: center;
		}

	.each-file {
		width: 100%;
		font-size: 3vw;
		line-height: 6vw;
		}

	.icon0 {
		padding-right: 4vw;
		}

	.footer_middle_center {
		width: 90%;
		margin: 10% 0;
		}

	.footer_middle_center h4 {
		font-size: 4vw;
		text-align: center;
		}

	.footer_middle_center h5 {
		font-size: 3.5vw;
		margin: 3% 0;
		}

	.footer_middle_center dl dt {
		width: 20%;
		font-size: 3vw;
		}

	.footer_middle_center dl dd a {
		margin-top: 1.5%;
		margin-bottom: 1.5%;
		font-size: 3vw;
		}

	.icon01 {
		margin-right: -8%;
		}

	.icon02 {
		margin-right: 16%;
		}

	.icon03 {
		margin-right: -7%;
		}

	.banner {
		width: 90%;
		flex-direction: row;
		justify-content: space-around;
		margin: 1% 0;
		}

	.banner a {
		width: 40%;
		height: auto;
		align-items: center;
		padding: 0;
		}

	.location {
		width: 100%;
		margin: 10% 0 5% 0;
		flex-direction: column;
		align-items: center;
		}

	.information_left {
		width: 80%;
		}

	.information_left p {
		font-size: 2vw;
		}

	.information_left .name {
		font-size: 8vw;
		}

	.information_right {
		width: 80%;
		margin-top: 5%;
		}

	.information_right dl dt {
		font-size: 2vw;
		line-height: 2vw;
		}

	.information_right dl dt span {
		font-size: 0.8vw;
		}

	.information_right dl dd {
		font-size: 2vw;
		}

	/*---   コピーライトの文字   ---*/
	.under {
		margin: 3vw 0;
		font-size: 1.5vw;
		}

}