@charset "UTF-8";
.work-nav {
	position: fixed;
	left: 0;
	width: 100%;
	z-index: 10;
	opacity: 0;
	top: -55px;
	-webkit-transition: top 0.25s ease, opacity 0.25s ease;
	transition: top 0.25s ease, opacity 0.25s ease;
	-webkit-box-shadow: 4px 8px 17px 0px rgba(53, 53, 53, 0.35);
	box-shadow: 4px 8px 17px 0px rgba(53, 53, 53, 0.35);
}
.work-nav.-fixed {
	top: 0;
	opacity: 1;
}
.work-nav .inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	pointer-events: auto;
}
.work-nav .info {
	z-index: 2;
	position: -webkit-sticky;
	position: sticky;
}
.work-nav .info svg {
	width: 19px;
	height: 12px;
	margin-bottom: 4px;
}
.work-nav .info svg path {
	-webkit-transition: fill 0.3s ease;
	transition: fill 0.3s ease;
}
.work-nav .info span {
	text-align: center;
	display: block;
	padding-bottom: 6px;
}
.work-nav .info a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-flow: column;
	flex-flow: column;
	font-size: 1.2rem;
	line-height: 1.0;
	color: #000;
	-webkit-transition: color 0.3s ease;
	transition: color 0.3s ease;
	width: 87px;
	height: 80px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-font-feature-settings: "palt";
	font-feature-settings: "palt";
	background-color: #e7f0fa;
	letter-spacing: 0.04em;
}
.work-nav .info a.-active {
	color: #007cb6;
}
.work-nav .info a.-active svg path {
	fill: #007cb6;
}
.is-pc {
	border-top: solid 1px #FFFFFF;
}

@media screen and (min-width: 768px) {
	.work-nav {
		width: auto;
		left: inherit;
		display: block;
		-webkit-transition: right 0.25s ease, opacity 0.25s ease;
		transition: right 0.25s ease, opacity 0.25s ease;
		top: 64px;
		right: -72px;
	}
	.work-nav.-fixed {
		right: 0;
	}
	.work-nav .inner {
		display: block;
		max-height: 770px;
		min-height: 0px;
		max-width: 100px;
		min-width: 100px;
		border: solid 1px #FFFFFF;
	}
	.work-nav .info svg {
		margin-bottom: 0;
		margin-top: 10px;
		width: 25px;
		height: 16px;
	}
	.work-nav .info a {
		display: block;
		text-align: center;
		font-size: 1.3rem;
		line-height: 1.2;
		padding: 1.5vh 0 0.7vh;
		height: auto;
		width: auto;
		max-height: 181px;
	}
	.work-nav .info a:hover {
		-webkit-transition: color 0.3s ease;
		transition: color 0.3s ease;
		text-decoration: none;
		color: #007cb6;
	}
	.work-nav .info a:hover svg path {
		-webkit-transition: fill 0.3s ease;
		transition: fill 0.3s ease;
		fill: #007cb6;
	}
	.is-sp {
		display: none;
	}
}

@media screen and (min-width: 1025px) {
	.work-nav.-fixed {
		top: 64px;
	}
}

@media screen and (max-width: 767px) {
	.is-pc {
		display: none;
	}
	.work-nav .info {
		width: 100%;
		border: solid 1px #FFFFFF;
	}
	.work-nav .info a {
		width: 100%;
		height: 80px;
		font-size: 1.4rem;
	}
	.work-nav .info span {
	padding-bottom: 0;
}
}

/* ------------------------------------------------
  �E���Ǐ]�{�^��
------------------------------------------------- */
#fixed-btn {
  z-index: 50;
  bottom: 0;
  left: 0;
  visibility: hidden;
  width: 100%;
  height: 0;
  opacity: 0;
  -webkit-transition: 0.3s opacity;
  transition: 0.3s opacity;
}
#fixed-btn.is-show {
  position: fixed;
  visibility: visible;
  opacity: 1;
}
/*#fixed-btn.is-show .fixed-btn-inner {
  margin-top: -110px;
}*/
@media screen and (max-width: 1024px) {
  #fixed-btn.is-show .fixed-btn-inner {
    margin-top: -160px;
  }
}
@media print, screen and (min-width: 1201px) {
  #fixed-btn.is-show .fixed-btn-inner {
    /*padding-right: 92px;*/
  }
}
#fixed-btn.is-bottom {
  position: static;
}
#fixed-btn.is-bottom .fixed-btn-inner {
  top: -260px;
  margin-top: 0 !important;
}
@media screen and (max-width: 1024px) {
  #fixed-btn.is-bottom .fixed-btn-inner {
    top: -180px;
  }
}
#fixed-btn .fixed-btn-inner {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  height: 0;
  margin: 0 auto;
  /*padding-right: 3%;*/
  padding-left: 3%;
  text-align: right;
}

/* --------------------------------------------------
  ���\��͂�����
--------------------------------------------------- */
#anchor-reserve {
  z-index: 998;
}
@media screen and (min-width: 1025px) {
  #anchor-reserve .reserve-btn {
  width: 110px;
  height: 110px;
  }
  #anchor-reserve .reserve-btn a {
  font-size: 1.6rem;
  }
}
@media screen and (max-width: 1024px) {
/*  #anchor-reserve {
    margin-top: 10px;
    margin-right: 15px;
  }*/
  #anchor-reserve .reserve-btn {
  width: 90px;
  height: 90px;
  }
  #anchor-reserve .reserve-btn a {
  font-size: 1.4rem;
  }
}
#anchor-reserve .reserve-btn {
  display: table;
}
#anchor-reserve .reserve-btn a {
  display: table-cell;
  width: 100%;
  padding: 5px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  background: #042e60;
  /*border-radius: 50%;*/
  -webkit-box-shadow: 4px 8px 17px 0px rgba(53, 53, 53, 0.35);
          box-shadow: 4px 8px 17px 0px rgba(53, 53, 53, 0.35);
}
#anchor-reserve .reserve-btn a:hover {
  background: #08549c;
  opacity: 1;
}
#anchor-reserve .reserve-btn a .icon {
  display: block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #anchor-reserve .reserve-btn a .icon {
    padding-top: 4px;
  }
}