
/****************************** Common ******************************/

html {
	font-size: 16px;
}

@media (min-width: 48em) {
	html {
		font-size: 16px;
	}
}

body {
	position: relative;
	overflow-y: scroll;/* - 高さが足りないページでも常時スクロールバーを表示(デザイン崩れ防止) - */
	margin: auto;
	margin-top: 80px;
	margin-bottom: 100px;
	color: #333333;
	background-color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;
}

body:not(.iframe_item) {
	display: none;/* - ページ読み込み時のStellarNav.jsの表示崩れ対策 - */
}

main {
	display: block;/* - IE対策(display: block;を全ブラウザで共通化) - */
}

a {
	color: #333333;
}

a:hover {
	text-decoration: none;
	color: inherit;
}

a:not(.btn):focus {
	transition-property: none !important;
}

a[href^='tel:'] {
	pointer-events: none;
}

img {
	max-width: 100%;
	height: auto;
}

a,
img {
	transition: all 0.3s ease;
}

button:focus {
	outline: none;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}


.p, p {
   
	letter-spacing: 0.01em;
	line-height: 2;
}

section {
	padding: 2rem 0;
}

@media (min-width: 48em) {
	section {
		padding: 3rem 0;
	}
}

/****************************** Common End ******************************/


/****************************** Bootstrap Override ******************************/

.container,
.container-fluid {
	position: relative;
}

.container-fluid {
	max-width: 1140px;
}

/* - flex-item(特にSwiper)突き抜け対策 - */
.d-flex:not(.flex-column) > *,
.d-sm-flex:not(.flex-column) > *,
.d-md-flex:not(.flex-column) > *,
.d-lg-flex:not(.flex-column) > *,
.d-xl-flex:not(.flex-column) > * {
	min-width: 0;
}

.d-flex.flex-column > *,
.d-sm-flex.flex-column > *,
.d-md-flex.flex-column > *,
.d-lg-flex.flex-column > *,
.d-xl-flex.flex-column > * {
	max-width: 100%;
}

/* - ボタンのスタイル - */
.btn {
	padding: 0.25em 1.5em;
	transition: all 0.15s ease;
	white-space: normal;
	border: 0;
	background-color: #81ba25;
}

@media (any-hover: hover) {
	.btn:hover {
		background-color: #f18b00;
	}
}

.btn:active {
	transform: scale(0.975);
}

.btn:focus {
	outline: none;
	box-shadow: none;
}

.btn:focus-visible {
	outline: -webkit-focus-ring-color auto 1px;
}

.btn:disabled {
	cursor: auto;
}

/****************************** Bootstrap Override End ******************************/


/****************************** Global Navigation  ******************************/

body>nav {
	position: fixed;
	z-index: 10;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.2);
}

body>nav .nav-text-row {
	order: 3;
	margin-right: 15px;
	margin-left: auto;
}

body>nav .nav-text-row ul {
	font-size: 0;
}

body>nav .nav-text-row ul li {
	display: inline-block;
	line-height: 1.8;
}

body>nav .nav-text-row ul li a {
	position: relative;
	margin: 0 1em;
	transition-property: none;
	font-size: 0.875rem;
}

body>nav .nav-text-row ul li a::before {
	display: inline-block;
	padding-right: 0.25em;
	content: '\f054';
	color: #81ba25;
	font-family: 'fa-select';
	font-weight: 400;
}

@media (any-hover: hover) {
	body>nav .nav-text-row ul li a:hover {
		color: #f18b00;
	}
}

body>nav .nav-text-row ul li a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	margin-top: 2px;
	margin-bottom: -4px;
	content: '';
	transition: transform 0.3s;
	transform: scale(0, 1);
	transform-origin: right top;
	background: #81ba25;
}

@media (any-hover: hover) {
	body>nav .nav-text-row ul li a:hover::after {
		transform: scale(1, 1);
		transform-origin: left top;
	}
}

/* - ロゴのスタイル - */
body>nav .nav-menu-row a.navbar-logo {
	order: 2;
	margin: auto;
}

@media (min-width: 48em) {
	body>nav .nav-menu-row a.navbar-logo {
		margin: 0;
	}
}

body>nav .nav-menu-row a.navbar-logo img {
	width: auto;
	height: 60px;
}

@media (min-width: 48em) {
	body>nav .nav-menu-row a.navbar-logo img {
		height: 75px;
		padding-left: 15px;
	}
}

/*===== StellarNav.js =====*/

.stellarnav {
	width: auto;
}

@media (any-hover: hover) {
	.stellarnav.mobile ul a:not(.dd-toggle):hover {
		color: #446313;
	}
}

/* - メニュー(第1階層)のスタイル - */
.stellarnav.mobile > ul {
	background-color: #81ba25;
}

.stellarnav.mobile ul li a:not(.dd-toggle) {
	padding: 15px;
	color: #ffffff;
	border-bottom: 0;
	font-size: 1rem;
	font-weight: normal;
	line-height: 20px;
}

/* - メニュー(第2階層)のスタイル - */
.stellarnav.mobile ul ul {
	background-color: #81ba25;
}

.stellarnav.mobile ul ul li a:not(.dd-toggle) {
	padding-left: 25px;
	font-size: 0.875rem;
}

.stellarnav.mobile ul ul li a:not(.dd-toggle)::before {
	display: inline-block;
	padding-right: 0.25em;
	content: '\f054';
	font-family: 'fa-select';
	font-weight: 400;
}

/* - MENUトグルボタンのスタイル - */
.stellarnav.mobile a.menu-toggle {
	padding: 30px 10px;
	color: #ffffff;/* - メニューテキストラベルの文字色 - */
	background-color: #81ba25;
	font-size: 14px;
	line-height: 20px;
}

.stellarnav.mobile a.menu-toggle span.bars {
	top: 4px;
	margin: 0;
}

.stellarnav.mobile a.menu-toggle span.bars span {
	width: 20px;
	background-color: #ffffff;
}

/* - StellarNav.js position:'left'時のボタンエリアスタイル - */
.stellarnav.mobile.left {
	text-align: right;
}

.stellarnav.mobile.left > ul {
	top: 80px !important;

	scrollbar-width: none;
}

.stellarnav.mobile.left.active > ul {
	-webkit-animation: fadeInLeft 0.3s;
	animation: fadeInLeft 0.3s;
}

.stellarnav.mobile.left a.call-btn-mobile,
.stellarnav.mobile.left a.location-btn-mobile {
	color: #ffffff;
	border-right: 1px solid rgba(255, 255, 255, 0.15);
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	font-size: 1.25rem;
	line-height: 20px;
}

.stellarnav.mobile.left svg {
	top: 0;
}

.stellarnav.mobile.left a.close-menu {
	vertical-align: bottom;
	color: #ffffff;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	font-size: 0.875rem;
	font-weight: normal;
	line-height: 20px;
}

/* - CLOSEボタン非表示 - */
.stellarnav.mobile a.close-menu {
	display: none !important;
}

/* - ドロップダウンボタンのスタイル - */
.stellarnav.mobile li a.dd-toggle {
	width: 50px;
	height: 50px;
}

@media (min-width: 48em) {
	.stellarnav.mobile li a.dd-toggle {
		display: none;
	}
}

.stellarnav.mobile li a.dd-toggle .icon-plus::before,
.stellarnav.mobile li a.dd-toggle .icon-plus::after {
	top: calc(50% - 1px);
	border-bottom: 2px solid #ffffff;
}

/* - iOS Safari[position:fixed;] バグフィックス - */
@media (max-width : 768px) {
	.stellarnav {
		overflow: visible;
	}
}

/****************************** Global Navigation End ******************************/


/****************************** Heading ******************************/

/* - 見出しのスタイル - */
.subtitle {
	margin-bottom: 2.5rem;
	text-align: center;
}

@media (min-width: 48em) {
	.subtitle {
		margin: 3.5rem;
	}
}

.subtitle h2 {
	margin-bottom: 0.75rem;
	font-size: 1.25rem;
	letter-spacing: 0.05em;
}


@media (min-width: 48em) {

.subtitle h2 {
	margin-bottom: 0.75rem;
	font-size: 1.75rem;
	letter-spacing: 0.05em;
}
}

.subtitle p {
	margin-top: 0.5rem;
	margin-bottom: 0;
	letter-spacing: 0.05em;
	font-size: 1rem;
}

/* - アンダーラインのスタイル - */
.underline {
	width: 100px;
	height: 2px;
	margin: auto;
	border-radius: 1.5px;
	margin-top: 1.5rem;
	background-color: #f18b00;
	
}

/****************************** Heading End ******************************/


/****************************** Background ******************************/

.bg-base {
	position: relative;
	display: flex;
	overflow: hidden;
	align-items: center;
	height: 10vh;/* - モバイル時の背景の高さ - */
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

@media (min-width: 48em) {
	.bg-base {
		height: 15vh;/* - PC時の背景の高さ - */
	}
}

.bg-inner {
	z-index: 1;
}

.bg-inner .page-banner-title {
	margin: 0;
	padding-left: 1em;
	color: #333;
	font-size: 1.25rem;
}

/****************************** Background End ******************************/


/****************************** Utility ******************************/

/* - 蛍光ペン - */
.highlighter.blue {
	background: linear-gradient(transparent 70%, #aaffff 70%);
	font-weight: bold;
}

.highlighter.yellow {
	background: linear-gradient(transparent 70%, #ffffaa 70%);
	font-weight: bold;
}

.highlighter.orange {
	background: linear-gradient(transparent 70%, #ffddaa 70%);
	font-weight: bold;
}

.highlighter.pink {
	background: linear-gradient(transparent 70%, #ffdddd 70%);
	font-weight: bold;
}

.highlighter.green {
	background: linear-gradient(transparent 70%, #ddffdd 70%);
	font-weight: bold;
}

.highlighter.purple {
	background: linear-gradient(transparent 70%, #ffddff 70%);
	font-weight: bold;
}

/****************************** Utility End ******************************/


/****************************** Footer ******************************/

footer {
	background-color: #81ba25;
}

/* - footer リンクエリアのスタイル - */
footer .footer-link {
	display: flex;
	align-items: center;
	height: 250px;
}

footer .footer-link .row {
	text-align: center;
}

@media (min-width: 48em) {
	footer .footer-link .row {
		text-align: left;
	}
}

footer .footer-link a {
	position: relative;
	display: inline-block;
	transition-property: none;
	color: #ffffff;
	font-size: 0.875rem;
	font-weight: bold;
	line-height: 2;
}

footer .footer-link a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	content: '';
	transition: transform 0.3s;
	transform: scale(0, 1);
	transform-origin: right top;
	background: #446313;
}

@media (any-hover: hover) {
	footer .footer-link a:hover {
		color: #446313;
	}

	footer .footer-link a:hover::after {
		transform: scale(1, 1);
		transform-origin: left top;
	}
}

footer .footer-link ul {
	padding-left: 0.5rem;
}

footer .footer-link li {
	display: none;
}

@media (min-width: 48em) {
	footer .footer-link li {
		display: block;
	}
}

footer .footer-link li a {
	font-size: 0.75rem;
	font-weight: normal;
}

footer .footer-link li a::before {
	display: inline-block;
	padding-right: 0.25em;
	content: '\f054';
	font-family: 'fa-select';
	font-weight: 400;
}

/* - footer コピーライト表示 - */
footer .copyright {
	height: 50px;
	margin-bottom: 0;
	text-align: center;
	letter-spacing: 0.1em;
	color: #446313;
	border-top: 1px solid #446313;
	background-color: #81ba25;
	font-size: 0.75rem;
	line-height: 50px;
}

footer .footer-banner {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #81ba25;
}

footer .footer-banner .row {
	align-items: center;
	flex-wrap: nowrap;
	justify-content: space-around;
	height: 100px;
}

footer .footer-banner .btn {
	position: relative;
	z-index: 1;
	display: flex;
	overflow: hidden;
	align-items: center;
	justify-content: center;
	width: 200px;
	height: 60px;
	margin: 0 10px;
	padding: 0;
	color: #ffffff;
	border-radius: 10px;
	background-color: #81ba25;
	font-size: 0.75rem;
	font-weight: bold;
}

@media (min-width: 48em) {
	footer .footer-banner .btn {
		width: 250px;
		margin: 0 10px;
		background-color: #81ba25;
		font-size: 1rem;
	}
}

footer .footer-banner .btn::after {
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
	height: 200%;
	content: '';
	transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
	transform: skewY(-20deg) scale(1, 0);
	transform-origin: left top;
	background: #446313;
}

@media (any-hover: hover) {
	footer .footer-banner .btn:hover::after {
		transform: skewY(-20deg) scale(1, 1);
	}
}

/* - ページトップボタン - */
#pagetop {
	position: fixed;
	z-index: 1000;
	right: 0;
	bottom: 100px;
}

#pagetop a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 80px;
	color: #ffffff;
	background-color: #81ba25;
	font-size: 2rem;
}

@media (any-hover: hover) {
	#pagetop a:hover {
		color: #446313;
		background-color: #81ba25;
	}
}

/****************************** Footer End ******************************/


/****************************** Print ******************************/

@media print {
	nav {
		position: relative !important;
	}
}


/*--------------------------------------------------------------
# link
--------------------------------------------------------------*/
a.anchor {
	display: block;
	padding-top: 80px;
	margin-top: -80px;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc {
	display: block !important;
}

.sp {
	display: none !important;
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
	.pc {
		display: none !important;
	}

	.sp {
		display: block !important;
	}
}


/*--------------------------------------------------------------
# スマホのみ改行
--------------------------------------------------------------*/
@media screen and (min-width: 768px) {
	.sp_br {
		display: none;
	}
}
/****************************** Print End ******************************/
