@charset "UTF-8";

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

　　＜全ページ共通のCSS＞

　　01.共通
　　02.ヘッダー
　　03.フッター
　　04.上へ戻るボタン
　　05.下層ページメインビジュアル

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


 /* import（他のcssを読み込む） */
@import "reset.css";
@import "navi.css";

 /* font（フォントを読み込む） */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&display=swap');

 /* 個別にフォント指定する場合は下記の記述を追加する */
 /*
	＜明朝体＞
	font-family: 'Noto Serif JP', serif;
	　※文字の太さを変える場合は下記の数値を当てはめる
	　200、300、400、500
	　例）font-weight: 200;

	＜ゴシック体＞
	font-family: 'Noto Sans JP', sans-serif;
	　※文字の太さを変える場合は下記の数値を当てはめる
	　100、300、400、500、700
	　例）font-weight: 100;

	＜丸ゴシック体＞
	font-family: 'M PLUS Rounded 1c', sans-serif;
	　※文字の太さを変える場合は下記の数値を当てはめる
	　100、300、400、500、700、800、900
	　例）font-weight: 100;
 */


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

　　01.共通

---------------------------------------------------*/
body {
	background: #FFF;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
	-webkit-backface-visibility: hidden;
}


/* 画面内に入ってフェードイン */
/* 動かずにフェードイン */
.slide-in {
	opacity: 0;
	transition: all 0.8s ease-out;
 }

/* 上からフェードイン */
.slide-top {
	opacity: 0;
	transform: translate(0, -20px);
	transition: all 0.8s ease-out;
 }

/* 下からフェードイン */
.slide-bottom {
	opacity: 0;
	transform: translate(0, 20px);
	transition: all 0.8s ease-out;
 }

 /* 左からフェードイン */
.slide-left {
	opacity: 0;
	transform: translate(-20px, 0);
	transition: all 0.8s ease-out;
 }

/* 右からフェードイン */
.slide-right {
	opacity: 0;
	transform: translate(20px, 0);
	transition: all 0.8s ease-out;
 }


/* Clearfix*/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden; }
.clearfix {
	min-height: 1px; }
* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/ }

.pc {	display: block; }
.sp {	display: none; }

/* sp */
@media only screen and (max-width: 768px) {
	.pc { display: none; }
	.sp { display: block; }
}


/* Link */
a { color:#0093e2; text-decoration:none; }
a:link { color:#0093e2; text-decoration:none; }
a:visited { text-decoration:none; }
a:hover { text-decoration:underline; }
a:active {	text-decoration:none; }

a[href^="tel:"] { cursor: default; }


/* Layout */
#container {
	width: 100%;
	overflow: hidden;
	padding-top: 94px;
	background: #FFF;
}
#mainArea {
	width: 100%;
	padding: 70px 0 300px;
	background: url(../img/footer_bg.jpg) repeat-x bottom center;
	/* background-size: contain; */
}
#mainArea img {
	flex-shrink: 0;
}
#mainArea a {
	transition: 0.3s;
	text-decoration: none;
}
#mainArea a:hover {
	opacity: 0.6;
}
#contentsArea {
	position: relative;
}
#mainContent {
	width: 100%;
}
.section {
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}
.flex {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
}

/* Tab */
@media only screen and (max-width:1220px) {

	#container {
		padding-top: 50px;
	}
	#contentsArea {
		position: static;
	}
	.section {
		width: 94%;
		margin-left: auto;
		margin-right: auto;
	}

}

/* sp */
@media only screen and (max-width: 768px) {
	img {
		width: 100%;
	}

	#mainArea {
		width: 100%;
		padding: 10% 0 260px;
		background: url(../img/footer_bg_sp.jpg) repeat-x bottom center;
		/*background-size: contain;*/
	}

}
@media only screen and (max-width: 500px) {
	#mainArea {
		padding: 10% 0 170px;
		background: url(../img/footer_bg_sp.jpg) repeat-x bottom center;
		background-size: 111%;
	}
}




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

　　02.ヘッダー

---------------------------------------------------*/
#headBG {
	position: fixed;
	width: 100%;
	background: #fff;
	z-index: 99999;
}
#headArea {
	position: relative;
	width: 100%;
	height: 94px;
	margin: auto;
}
/* ヘッダーロゴ */
#headArea .main_logo {
	position: absolute;
	top: 50%;
	left: 10px;
	transform: translateY(-50%);
	width: 100%;
	max-width: 410px;
	z-index: 999999;
}
#headArea .main_logo img {
	vertical-align: middle;
}
.Item{
  cursor: pointer;
  }


/* Tab */
@media only screen and (max-width: 1220px) {
	#headArea {
		height: 60px;
	}
	#headArea .main_logo {
		position: absolute;
		left: 0;
		width: 40%;
		max-width: 300px;
	}
}

/* sp */
@media only screen and (max-width: 768px) {
	#headArea .main_logo {
		width: 62%;
	}
}





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

　　03.フッター

---------------------------------------------------*/
footer {
	position: relative;
	width: 100%;
	padding: 0;
	margin: 0;
}


/*
関連リンク
---------------------------------------------------*/
#flinkArea {
	width: 100%;
	background: #006d32;
	padding: 40px 0;
}
#flinkArea .section {
	width: 900px;
	margin: auto;
}
#flinkArea .flink {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-start;
	text-align: left;
}
#flinkArea #flink_ttl {
	font-size: 22px;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 700;
	line-height: 1.4;
	color: #fff;
	text-align: left;
	border-bottom: dotted 2px #fff;
	margin-bottom: 2rem;
	padding-bottom: 0.3rem;
}
#flinkArea .flink_01,
#flinkArea .flink_02 {
	width: 50%;
}
#flinkArea .flink_con {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-start;
}
#flinkArea .flink_con ul {
	width: 50%;
	list-style-type: disc;
	list-style-position: inside;
}
#flinkArea .flink li {
	position: relative;
	margin-bottom: 0.5rem;
	color: #fff;
}
#flinkArea .flink li:last-child {
	margin-bottom: 0;
}
#flinkArea .flink a {
	font-size: 15px;
	line-height: 1.6;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	color: #fff;
	text-decoration: none;
	transition: 0.3s;
}
#flinkArea .flink a:hover {
	opacity: 0.6;
}

/* Tab */
@media screen and (max-width: 1200px) {
}

/* sp */
@media only screen and (max-width: 768px) {
	#flinkArea {
		padding: 6% 0;
	}
	#flinkArea .section {
		width: 94%;
		margin: auto;
	}
	#flinkArea #flink_ttl {
		font-size: 18px;
		margin-bottom: 1rem;
		padding-bottom: 0.3rem;
	}
	#flinkArea .flink_01,
	#flinkArea .flink_02 {
		width: 100%;
	}
	#flinkArea .flink_01 {
		margin-bottom: 1rem;
	}
	#flinkArea .flink_con ul {
		width: 50%;
	}
	#flinkArea .flink li {
		margin-bottom: 0.2rem;
	}
	#flinkArea .flink li:last-child {
		margin-bottom: 0;
	}
	#flinkArea .flink a {
		font-size: 13px;
	}
}



/*
ロゴ・住所・お問い合わせ・利用規約
---------------------------------------------------*/
#footerArea {
	width: 100%;
	padding: 30px 0;
}
#footerArea a {
	text-decoration: none;
	transition: 0.3s;
}
#footerArea a:hover {
	opacity: 0.6;
}
#footerArea ul {
	display: flex;
  justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-start;
}
#footerArea li {
	width: 33.33%;
	display: flex;
	align-items: center;
	text-align: center;
	border-right: solid 1px #1a1a1a;
	box-sizing: border-box;
}
#footerArea li:last-child {
	border: none;
}
#footerArea .foot_logo {
	width: 390px;
	padding: 15px 0;
}
#footerArea .foot_address {
	width: 84%;
	margin: auto;
	font-size: 17px;
	/*font-family: 'Noto Serif JP', serif;*/
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	line-height: 1.4;
	text-align: left;
}
#footerArea .foot_address span {
	font-size: 15px;
}
#footerArea .foot_address .foot_address_txt {
	font-size: 11px;
}
#footerArea .foot_tel {
	width: 84%;
	margin: auto;
	display: flex;
  justify-content: center;
	align-items: flex-end;
	padding: 10px 0;
}
#footerArea .foot_tel img {
	width: 43px;
}
#footerArea .foot_tel_txt {
	font-size: 17px;
	/*font-family: 'Noto Serif JP', serif;*/
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	line-height: 1.4;
	text-align: left;
	margin-left: 0.5rem;
}
#footerArea .foot_tel_txt p {
	font-size: 35px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	line-height: 1.4;
}
.termsArea {
	width: 100%;
	margin: 50px auto 0;
	font-size: 12px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    color: #000000;
	text-align: center;
	/*
	border-top: dotted 2px #1a1a1a;
    padding: 10px 0 0;
	*/
}
.termsArea .terms a {
	position: relative;
    padding-left: 10px;
	color: #000000;
}
.termsArea .terms a:before {
    position: absolute;
    top: 38%;
    left: 0;
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    border-right: solid 1px #000000;
    border-bottom: solid 1px #000000;
    -webkit-transform: rotate(
-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(
-45deg);
}
.termsArea .copyrightArea {
	width: 100%;
	padding-top: 15px;
}

/* Tab */
@media screen and (max-width: 1200px) {
}

/* sp */
@media only screen and (max-width: 768px) {
	#footerArea {
		width: 100%;
		padding: 3% 0;
	}
	#footerArea ul {
		display: block;
	}
	#footerArea li {
		width: 100%;
		display: flex;
		align-items: center;
		text-align: center;
		border-right: none;
		border-bottom: solid 1px #1a1a1a;
		padding: 3% 0;
	}
	#footerArea li:last-child {
		border: none;
	}
	#footerArea .foot_logo {
		width: 100%;
		padding: 0;
	}
	#footerArea .foot_address {
		width: 100%;
		font-size: 14px;
		text-align: center;
	}
	#footerArea .foot_address span {
		font-size: 12px;
	}
	#footerArea .foot_tel {
		width: 100%;
		padding: 0;
	}
	#footerArea .foot_tel img {
		width: 38px;
	}
	#footerArea .foot_tel_txt {
		font-size: 14px;
	}
	#footerArea .foot_tel_txt p {
		font-size: 30px;
	}
	.termsArea {
		margin: 35px auto 0;
	}
	.termsArea .copyrightArea {
		padding-top: 10px;
	}
}




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

　　04.上へ戻るボタン

---------------------------------------------------*/
#topBtn {
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 46px;
	z-index: 999;
}




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

　　05.下層ページメインビジュアル

---------------------------------------------------*/
#mainimgArea {
	position: relative;
	width: 100%;
}
#mainimgArea .mainimg_ttl {
	box-sizing: border-box;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 55%;
	padding: 10px 60px;
	z-index: 999;
}
#mainimgArea h2 {
	font-size: 32px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 300;
	line-height: 1.4;
	color: #FFF;
}

/* Tab */
@media screen and (max-width: 1200px) {
	#mainimgArea h2 {
		font-size: 130%;
	}
}

/* sp */
@media screen and (max-width: 768px) {
	#mainimgArea .mainimg_ttl {
		width: 60%;
		padding: 10px 20px;
	}
}