@charset "UTF-8";
/*=============================================================
	Date: 2022-03
	CSS Document ： フィンレイソン
=============================================================*/

/*------------------------------------

	fonts

------------------------------------*/

@font-face {
  font-family: 'interstate';
  src: url('../fonts/interstate-regular.woff2') format('woff2'),
  url('../fonts/interstate-regular.woff') format('woff'),
  url('../fonts/interstate-regular.ttf') format('truetype');
  font-weight: normal;
}

@font-face {
  font-family: 'interstate';
  src: url('../fonts/interstate-bold.woff2') format('woff2'),
  url('../fonts/interstate-bold.woff') format('woff'),
  url('../fonts/interstate-bold.ttf') format('truetype');
  font-weight: bold;
}

@font-face {
  font-family: 'interstate';
  src: url('../fonts/interstate-black.woff2') format('woff2'),
  url('../fonts/interstate-black.woff') format('woff'),
  url('../fonts/interstate-black.ttf') format('truetype');
  font-weight: 800;
}

/*------------------------------------

	base, common

------------------------------------*/

/*html { overflow-y: inherit; }*/

.pc_fi { display: block; }
.pc_inline_fi {	display: inline; }
.sp_fi { display: none; }

/*body {
	font-family: "interstate", "秀英丸ゴシック L", Shuei MaruGo L, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "sans-serif";
	color: #000000;
	-webkit-text-size-adjust: 100%;
	position: relative;
	text-align: justify;
	text-justify: inter-ideograph;
}*/
#wrapper {
	overflow-y: inherit;
	padding-top: 0;
	overflow-x: hidden;
	overflow-y: hidden;
	font-family: "interstate", "秀英丸ゴシック L", Shuei MaruGo L, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "sans-serif";
	color: #000000;
	-webkit-text-size-adjust: 100%;
	position: relative;
	text-align: justify;
	text-justify: inter-ideograph;
	-webkit-font-feature-settings: normal;
	font-feature-settings: normal;
	letter-spacing: 0.015em;
}
img {
	display: block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	vertical-align: bottom;
	border: none;
}
#wrapper a, #wrapper a img {
	transition: all 0.3s ease;
	text-decoration: none;
}
.ofi_fi {
	height: 100% !important;
	width: 100% !important;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}
.flex_fi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}
.flexAutoW_fi { flex: 1; }

@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .flexAutoW_fi { flex: 1 0 0%; }
}
		
.ff_jp {
	font-family: "秀英丸ゴシック L", Shuei MaruGo L, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "sans-serif" !important;
}
#wrapper i { font-style: normal; }

/*---------------------
　　header
------------------------*/

#headerbox_fi {
	width: 100%;
	min-width: 920px;
	min-height: 40px;
	position: relative;
	left: 0px;
	top: 0px;
	z-index: 100;
	text-align: left;
	background: #FFF;
	box-shadow: 0 0 3px 2px rgba(0,0,0,.05);
}
#headerbox_fi a:hover {	opacity: 1.0; }
#header_fi {
	width: 40%;
	font-size: 80%;
	min-width: 200px;
	margin: 0;
	padding: 15px 15px 0px 0;
	white-space: nowrap;
	float: right;
}
#header_fi ul {	text-align: right; }
#header_fi li {	display: inline-block; margin-right: 7px; }
#header_fi li a { padding-bottom: 1px; }

@media (max-width: 834px) {
	.pc_fi, .pc_inline_fi { display: none !important; }
	.sp_fi { display: block; }
	#headerbox_fi {
		width: 100%;
		min-width: 10px;
		min-height: 12px;
		left: 0px;
		top: 0px;
	}
	#header_fi {
		width: auto;
		min-width: 10px;
		padding: 10px 10px 10px 10px;
		white-space: normal;
		float: none;
	}
	#header_fi ul { text-align: left; }
	#header_fi li {
		display: inline-block;
		_display: inline;
		margin: 0;
		padding-right: 5px;
		font-size: 10px;
	}
}

@media (max-width: 480px) {
	#header_fi { padding: 5px; }
	#header_fi li { padding-right: 3px; font-size: 8px;	}
}

/*------------------------------------

　　contents

------------------------------------*/

#wrapff_fi a:hover { text-decoration: none; }
.secPd_fi {
	padding-top: 100px;
	padding-bottom: 100px;
	text-align: center;
}
.inner_fi {
	max-width: 920px;
	margin: 0 auto;
	padding-left: 20px;
	padding-right: 20px;
}
#wrapper .secTitle_fi {
	font-size: 43px;
	margin-bottom: 60px;
	line-height: 1;
}
#wrapper .secTitle_fi span {	color: #C1B393; }
#wrapper .secTitle_fi + p { font-size: 20px; margin-bottom: 70px; }
.bgBeige_fi { background: #F7F5F0; }

@media (max-width: 834px) {
	.inner_fi { width: 90%; }
	#wrapper .secTitle_fi { font-size: 30px; line-height: 1.4; }
	#wrapper .secTitle_fi + p { font-size: 16px; margin-bottom: 40px; }
}
@media (max-width: 560px) {
	.secPd_fi { padding-top: 60px; padding-bottom: 60px; }
}

/*---------------------
　　btn style
------------------------*/

.btnMain_fi { max-width: 600px; }
.btnMain_fi { position: relative;	margin: 0 auto; }
.btnMain_fi:before,
.btnMain_fi:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	height: 1px;
	background: #fff;
	z-index: 3;
}
.btnMain_fi:before { width: 60px; transform: translate(0, 0px); }
.btnMain_fi:after {
	width: 15px;
	transform-origin: right center;
	transform: translate(0, 0px) rotate(25deg);
}
.btnMain_fi a {	
	color: #fff;
	font-size: 38px;
	line-height: 1;
	padding: 20px;
	letter-spacing: 0.05em;
	justify-content: center;
	align-items: center;
}
.btnMain_fi span {
	color: rgba(255,255,255,.7);
	font-size: 15px;
	display: block;
	margin-top: 8px;
	letter-spacing: 0;
}

/* btn animation */

.btnMain_fi a {
	display: block;
	z-index: 2;
	position: relative;
	transition: all .3s;
	text-align: center;
}
.btnMain_fi a:before,
.btnMain_fi a:after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
	transition: all .3s;
	top: 0;
	width: 50%;
	height: 100%;
	background-color: #000;
}
.btnMain_fi a:before { right: 0; }
.btnMain_fi a:after { left: 0; }
.btnMain_fi a,
.btnMain_fi a:hover,
.btnMain_fi a:hover:before,
.btnMain_fi a:hover:after { background-color: #7EAA05; }
.btnMain_fi a:hover:before,
.btnMain_fi a:hover:after { width: 0; }

/* pagetop */

.pagetop_fi {
	position: fixed;
	right: 2%;
	bottom: 10%;
	display: none;
	z-index: 10;
	font-size: 14px;
	transform: rotate(-90deg);
}
.pagetop_fi p {
	transition: all 0.3s ease;
	position: relative;
	background: #FFF;
	padding: 2px 40px 2px 10px;
}
.pagetop_fi p:hover {
	transform: translate(10px,0);
}
.pagetop_fi p:before, .pagetop_fi p:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 10px;
	height: 1px;
	background: #000;
	z-index: 3;
}
.pagetop_fi p:before { transform: translate(0, 0px); width: 20px; }
.pagetop_fi p:after {
	width: 5px;
	transform-origin: right center;
	transform: translate(0,0) rotate(25deg);
}
.pagetop_fi a {	display: block; }

@media (max-width: 834px) {
	.btnMain_fi a { font-size: 28px; }
	.btnMain_fi:before { width: 30px; }
	.btnMain_fi:after { width: 10px; }
	.pagetop_fi { right: -30px; }
}

/*------------------------------------

　　フッターエリア

------------------------------------*/

#Footer_fca ul { border: none; }

/*------------------------------------

	アニメーション

------------------------------------*/

.fadeInY_active_fi, .fadeInX_active_fi { opacity: 1; transform: translate(0,0); }
.fadeIn_fi, .fadeInY_fi, .fadeInX_l_fi, .fadeInX_r_fi { transition: 1s; opacity: 0; }

.fadeInY_fi { transform: translate(0,50px); }
.fadeInX_l_fi { transform: translate(-45px,0); }
.fadeInX_r_fi { transform: translate(45px,0); }
.fadeIn_active_fi, .fadeInX_l_active_fi, .fadeInX_r_active_fi { opacity: 1; }
.fadeInY_active_fi { transform: translate(0,0); opacity: 1; }
.fadeInX_l_active_fi, .fadeInX_r_active_fi { transform: translate(0,0); }

.zoom_fi { transition: 1s; transform: scale(0); }
.zoom_active_fi { transform: scale(1); }

.fadeIn_fi {
	animation-fill-mode: both;
	animation-duration: 1.7s;
	animation-name: fadeIn;
	visibility: visible;
}
.fadeInUp_fi {
	animation-fill-mode: both;
	animation-duration: 1s;
	animation-name: fadeInUp;
	visibility: visible !important;
}
.fadeInDown_fi {
	animation-fill-mode: both;
	animation-duration: 2s;
	animation-name: fadeInDown;
	visibility: visible !important;
}

@keyframes fadeIn {
	0% { display: none;	opacity: 0;	}
	1% { display: block; opacity: 0; }
	100% { display: block; opacity: 1; }
}
@keyframes fadeInUp {
	0% { opacity: 0; transform:translateY(30px); }
	100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInDown {
	0% { opacity: 0; transform:translateY(-50px); }
	100% { opacity: 1; transform: translateY(0); }
}
@keyframes atten {
	50% { transform: translate(-5px,0);	}
}

@keyframes gradient {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%;	}
}