@charset "utf-8";
/* CSS Document */

.disabled{
	opacity: 0.5;
    cursor: default;
}

body,
button {
	font-family:"Zen Kaku Gothic New","游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック";
	font-size:16px;
	line-height: 1.5;
	font-weight: 700;
	color: #000000;
	text-align: justify;
}
* {
	vertical-align: top;
	box-sizing: border-box;
	word-break: break-all;
}
a {
	display: block;
	color: #000;
	text-indent: 0;
	text-decoration: underline;
}
/* マウスオーバー時 */
.btn_hover img{
	transition: 0.2s;
}
.btn_hover img:hover{
    transform: translateY(5px);
    cursor: pointer;
}
.sp {display: none;}
img {max-width: 100%;}
.max_w_inner{
	max-width: 920px;
	width: 90%;
	margin: 0 auto;
}
.absolute_img{position: absolute;}
@media screen and (max-width: 760px) {
	body,
	button {font-size: 15px;}
}

 /* ===== フローティングボタン ===== */
.floating_btn {
	position: fixed;
	padding: 30px 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #291d3dA6;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
	cursor: pointer;

  /* 初期状態: 非表示（下に隠れている） */
	transform: translateY(100%);
	opacity: 0;
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
	opacity   0.45s ease;
}
/* 表示状態 */
.floating_btn.is-visible {
	transform: translateY(0);
	opacity: 1;
}
/* ボタン内アイコン画像 */
.floating_btn img {
	object-fit: contain;
}
@media screen and (max-width: 760px) {
	.floating_btn {padding: 20px 0;}
	.floating_btn .pc{display: none;}
	.floating_btn .sp{display: block;}
}

/*=====================================================================================
***************************************************************************************

　　header

***************************************************************************************
=====================================================================================*/
/* ---------------------
   メニューボタン本体
--------------------- */

.menu {
	position: fixed;
	margin: auto;
	inset: 25px 25px auto auto;
	z-index: 10;
	width: 37px;
	height: 37px;
	cursor: pointer;
	border: solid 2px #fff;
	background-color: #ffffff40;
}
/* ---------------------
   ハンバーガー
--------------------- */
.menu__bar, .menu__bar::before, .menu__bar::after {
	content:"";
	display: block;
	width: 20px;
	height: 2px;
	background: #fff;
	border-radius: 2px;
	position: relative;
	transition: all 0.3s;
}
.menu__bar::before {
	position: absolute;
	top: -8px;
}
.menu__bar::after {
	position: absolute;
	top: 8px;
}
/* ---------------------
   メニューボタンアニメーション
--------------------- */
.is--active .menu__bar,
.is--active .menu__bar::before,
.is--active .menu__bar::after {
	background-color: #fff;
}
.is--active .menu__bar {
	background: transparent;
}
.is--active .menu__bar::before {
	transform: rotate(45deg);
	top: 0;
}
.is--active .menu__bar::after {
	transform: rotate(-45deg);
	top: 0;
}
/* ---------------------
   ナビゲーション（スライド）
--------------------- */
.nav {
	position: fixed;
	top: 0;
	right: -100%;
	width: 250px;
	height: 100%;
	background: #920783;
	transition: right 0.3s;
	padding-top: 80px;
	z-index: 5;
}
/* メニューが開いたときに右からスライドイン */
.is--active .nav {
	right: 0;
}
/* ---------------------
   ナビゲーション内部
--------------------- */
.nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.nav__link {
	display: block;
	padding: 16px 24px;
	text-decoration: none;
	color: #fff;
	transition: 0.2s;
	border-bottom: solid 1px;
}
.nav__link:hover {
	background: #ffef00;
	color: #920783;
}

/*=====================================================================================
***************************************************************************************

　　中ページタイトル

***************************************************************************************
=====================================================================================*/

/*=====================================================================================
***************************************************************************************

　　footer

***************************************************************************************
=====================================================================================*/
footer {
	background-color: #fff;
	padding: 50px 0 150px;
	text-align: center;
	font-size: 16px;
}
@media screen and (max-width: 760px) {
	footer {padding: 50px 0 100px;}
	footer .sp{display: block;}
}