@charset "utf-8";

/* ========================================================================================================================/
	
	Document	: common.css
	Description : 共通css

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


/* ------------------------------------------------------------------------------------------------------------------------/
   0-0, include
/------------------------------------------------------------------------------------------------------------------------ */

@import url("./basic.css");
@import url("./custom/margin.css");
@import url("./custom/padding.css");
@import url("./custom/width.css");

@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP:300,400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700&display=swap');


/* ------------------------------------------------------------------------------------------------------------------------/
   base
/------------------------------------------------------------------------------------------------------------------------ */

body {
	min-width:1100px;
	color:#232323;
	font-family:"Noto Sans JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
	letter-spacing:0.25px;
	line-height:180%;
	background:#ffffff url('../image/layout/bg.jpg') center top repeat;
	font-size:17px;
	}

.sp { display:none !important; }

h1 {}
h2 {}
h3 {}
h4 {}

a 			{ transition:0.25s; }
a:link 		{ color:#007dca; text-decoration:underline; cursor:pointer; }
a:visited 	{ color:#007dca; text-decoration:underline; cursor:pointer; }
a:hover 	{ color:#007dca; text-decoration:none; cursor:pointer; }

.shadow {
	box-shadow:5px 5px 5px 0 rgba(0,0,0,0.15);
	-moz-box-shadow:5px 5px 5px 0 rgba(0,0,0,0.15);
	-webkit-box-shadow:5px 5px 5px 0 rgba(0,0,0,0.15);
	}
.display 	{ display:inline-block !important; }
.hidden 	{ display:none !important; }

#container {
	width:100%;
	min-width:1220px;
	text-align:center;
	margin:0 auto;
	overflow:hidden;
	}


/* ------------------------------------------------------------------------------------------------------------------------/
   sidenavi
/------------------------------------------------------------------------------------------------------------------------ */

#navi_button {
	display:none;
	}


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

header {
	position:relative;
	width:100%;
	height:160px;
	box-sizing:border-box;
	border-bottom:solid 10px #cccccc;
	background:#ffffff url("../image/header/accessory01.png") right 100px bottom no-repeat;
	z-index:700;
	}
	header .inner {
		position:relative;
		width:1100px;
		height:160px;
		box-sizing:border-box;
		margin:0 auto;
		}

		header .inner h1 {
			position:absolute;
			top:35px;
			left:0;
			box-sizing:border-box;
			margin:0 auto;
			}

		header .inner p.address {
			position:absolute;
			top:15px;
			left:350px;
			font-size:15px;
			text-align:left;
			line-height:160%;
			box-sizing:border-box;
			margin:0 auto;
			}

		header .inner dl.tel {
			position:absolute;
			top:13px;
			right:0;
			text-align:right;
			}
			header .inner dl.tel dt {
				font-size:30px;
				text-decoration:none;
				}
				header .inner dl.tel dt a {
					font-family:"Noto Serif JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
					font-weight:bold;
					letter-spacing:0.05em;
					text-decoration:none;
					line-height:30px;
					box-sizing:border-box;
					background:transparent url("../image/header/ic_tel.png") left center no-repeat;
					padding:0 0 0 40px;
					}
			header .inner dl.tel dd {
				font-size:13px;
				}

		header .inner nav {
			position:absolute;
			bottom:9px;
			right:0;
			width:750px;
			height:70px;
			}
			header .inner nav ul {
				list-style:none;
				}
				header .inner nav ul li {
					float:left;
					width:calc(100% / 5);
					list-style:none;
					}
					header .inner nav ul li a {
						display:inline-block;
						width:100%;
						height:70px;
						color:#232323;
						font-family:"Noto Serif JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
						font-weight:500;
						text-decoration:none;
						line-height:70px;
						box-sizing:border-box;
						background:#ffffff;
						border:solid 1px #cccccc;
						border-left:none !important;
						}
					header .inner nav ul li:nth-of-type(1) a {
						border-left:solid 1px #cccccc !important;
						}
					header .inner nav ul li a:hover,
					header .inner nav ul li.stay a {
						color:#ffffff;
						background:#0da5ff;
						}

			header .inner nav .nav-line {
				position:absolute;
				top:66px;
				width:100%;
				height:3px;
				text-align:center;
				box-sizing:border-box;
				background:#ffffff;
				z-index:996;
				}
			header .inner nav .nav-line:after {
				content:"";
				position:absolute;
				top:-7px;
				left:50%;
				transform:translate(-50%,0);
				-webkit-transform:translate(-50%,0);
				-ms-transform:translate(-50%,0);
				display:block;
				width:0;
				height:0;
				border-style:solid;
				border-width:0 5px 10px 5px;
				border-color:transparent transparent #ffffff transparent;
				}


/* ------------------------------------------------------------------------------------------------------------------------/
   visual
/------------------------------------------------------------------------------------------------------------------------ */

#visual {
	position:relative;
	width:100%;
	height:700px;
	box-sizing:border-box;
	background:#ffffff url("../image/visual/bg.jpg") center center no-repeat;
	margin:0;
	z-index:500;
	}
	#visual .inner {
		position:relative;
		width:1100px;
		height:700px;
		box-sizing:border-box;
		margin:0 auto;
		}
		#visual .inner p {
			position:absolute;
			top:110px;
			left:245px;
			font-size:50px;
			font-family:"Noto Serif JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
			font-weight:550;
			letter-spacing:0.2em;
			line-height:140%;
			text-align:left;
			text-indent:-3.5em;
			text-shadow:0 0 5px 10px #ffffff;
			padding:0 0 0 3.5em;
			filter:glow(color=#ffffff,strength=10px);
			}
			#visual .inner p strong {
				font-size:60px;
				font-weight:550;
				}
		#visual .inner ul {
			list-style:none;
			}
			#visual .inner ul li { position:absolute; }
			#visual .inner ul li:nth-of-type(1) { animation:fuwafuwa01 3s linear infinite;  top:313px; left:352px; }
			#visual .inner ul li:nth-of-type(2) { animation:fuwafuwa02 3s linear infinite;  top:420px; left:631px; }
			#visual .inner ul li:nth-of-type(3) { animation:fuwafuwa03 3s linear infinite;  top:216px; left:848px; }

/* アニメーション */
@keyframes fuwafuwa01 {
	0% 		{ transform:translateY(0) }
	12% 	{ transform:translateY(-10px) }
	25% 	{ transform:translateY(0) }
	50% 	{ transform:translateY(0) }
	75% 	{ transform:translateY(0) }
	100% 	{ transform:translateY(0) }
}
@keyframes fuwafuwa02 {
	0% 		{ transform:translateY(0) }
	25% 	{ transform:translateY(0) }
	37% 	{ transform:translateY(-10px) }
	50% 	{ transform:translateY(0) }
	75% 	{ transform:translateY(0) }
	100% 	{ transform:translateY(0) }
}
@keyframes fuwafuwa03 {
	0% 		{ transform:translateY(0) }
	25% 	{ transform:translateY(0) }
	50% 	{ transform:translateY(0) }
	62% 	{ transform:translateY(-10px) }
	75% 	{ transform:translateY(0) }
	100% 	{ transform:translateY(0) }
}


/* ------------------------------------------------------------------------------------------------------------------------/
   breadcrumbs
/------------------------------------------------------------------------------------------------------------------------ */

#breadcrumbs {
	width:100%;
	box-sizing:border-box;
	background:transparent;
	border-top:solid 10px #ef8c43;
	margin:0 auto;
	padding:20px 15px 0 15px;
	}
	#breadcrumbs .inner {
		width:1120px;
		text-align:left;
		list-style:none;
		margin:0 auto;
		}
		#breadcrumbs .inner li {
			display:inline-block;
			height:21px;
			font-size:15px;
			line-height:21px;
			padding:1px 0 0 0;
			}
		#breadcrumbs .inner li:first-child a {
			height:21px;
			background:transparent url("../image/layout/bread_home.png") left center no-repeat;
			background-size:15px 15px;
			padding:1px 0 0 25px;
			}
		#breadcrumbs .inner li:last-child {
			font-weight:bold;
			}
		#breadcrumbs .inner li:before {
			content:">";
			font-weight:normal;
			margin:0 10px;
			}
		#breadcrumbs .inner li:first-child:before {
			content:"";
			margin:0;
			}
			#breadcrumbs .inner li a { color:#c92641; }


/* ------------------------------------------------------------------------------------------------------------------------/
   contents
/------------------------------------------------------------------------------------------------------------------------ */

#contents {
	width:100%;
	margin:0 0 100px 0;
	}


/* ------------------------------------------------------------------------------------------------------------------------/
   under
/------------------------------------------------------------------------------------------------------------------------ */

#under {
	width:100%;
	box-sizing:border-box;
	background:#ffffff url("../image/layout/bg01.gif") left top repeat;
	padding:50px;
	}
	#under ul {
		width:1100px;
		margin:0 auto;
		list-style:none;
		}
		#under ul li {
			float:left;
			width:calc((100% - 90px) / 4);
			background:#ffffff;
			margin:0 0 0 30px;
			list-style:none;
			}
		#under ul li:first-child {
			margin:0;
			}
			#under ul li img {
				width:100%;
				height:auto;
				}


/* ------------------------------------------------------------------------------------------------------------------------/
   footer
/------------------------------------------------------------------------------------------------------------------------ */

footer {
	position:relative;
	width:100%;
	height:375px;
	box-sizing:border-box;
	background:#007dca;
	}
	footer .inner {
		position:relative;
		width:1100px;
		height:335px;
		text-align:center;
		box-sizing:border-box;
		margin:0 auto;
		}
	footer .pagetop {
		position:absolute;
		top:0;
		width:100%;
		z-index:900;
		}
		footer .pagetop a {
			display:block;
			width:100%;
			line-height:35px;
			box-sizing:border-box;
			background:#007dca url("../image/footer/ic_pagetop.png") center center no-repeat;
			border-bottom:solid 1px #ffffff;
			}
		footer .pagetop a:hover {
			background:#0da5ff url("../image/footer/ic_pagetop.png") center center no-repeat;
			}

		footer .inner .logo {
			position:absolute;
			top:85px;
			left:0;
			box-sizing:border-box;
			margin:0 auto;
			}

		footer .inner .address {
			position:absolute;
			top:100px;
			left:395px;
			color:#ffffff;
			font-size:15px;
			text-align:left;
			}

		footer .inner dl.tel {
			position:absolute;
			top:86px;
			right:0;
			text-align:right;
			}
			footer .inner dl.tel dt {
				font-size:30px;
				text-decoration:none;
				}
				footer .inner dl.tel dt a {
					color:#ffffff;
					font-family:"Noto Serif JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
					font-weight:bold;
					letter-spacing:0.05em;
					text-decoration:none;
					line-height:30px;
					box-sizing:border-box;
					background:transparent url("../image/footer/ic_tel.png") left center no-repeat;
					padding:0 0 0 40px;
					}
			footer .inner dl.tel dd {
				color:#ffffff;
				font-size:15px;
				line-height:160%;
				margin:10px 0 0 0;
				}

		footer .inner nav {
			position:absolute;
			bottom:50px;
			right:0;
			width:100%;
			height:70px;
			}
			footer .inner nav ul {
				list-style:none;
				}
				footer .inner nav ul li {
					float:left;
					width:calc(100% / 5);
					list-style:none;
					}
					footer .inner nav ul li a {
						display:inline-block;
						width:100%;
						height:70px;
						color:#ffffff;
						font-family:"Noto Serif JP","メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
						font-weight:500;
						text-decoration:none;
						line-height:70px;
						box-sizing:border-box;
						background:#007dca;
						border:solid 1px #ffffff;
						border-left:none !important;
						}
					footer .inner nav ul li:nth-of-type(1) a {
						border-left:solid 1px #ffffff !important;
						}
					footer .inner nav ul li a:hover,
					footer .inner nav ul li.stay a {
						color:#ffffff;
						background:#0da5ff;
						}

			footer .inner nav .nav-line {
				position:absolute;
				top:66px;
				width:100%;
				height:3px;
				text-align:center;
				box-sizing:border-box;
				background:#ffffff;
				z-index:996;
				}
			footer .inner nav .nav-line:after {
				content:"";
				position:absolute;
				top:-7px;
				left:50%;
				transform:translate(-50%,0);
				-webkit-transform:translate(-50%,0);
				-ms-transform:translate(-50%,0);
				display:block;
				width:0;
				height:0;
				border-style:solid;
				border-width:0 5px 10px 5px;
				border-color:transparent transparent #ffffff transparent;
				}

	footer .copyright {
		position:absolute;
		bottom:0;
		width:100%;
		height:40px;
		font-size:15px;
		line-height:40px;
		box-sizing:border-box;
		background:#ffffff;
		list-style:none;
		}


/* ------------------------------------------------------------------------------------------------------------------------/
   side_button
/------------------------------------------------------------------------------------------------------------------------ */

ul#side_button {
	position:fixed;
	top:50px;
	right:0;
	list-style:none;
	z-index:9998;
	}
	ul#side_button li {
		position:absolute;
		top:0;
		right:0;
		}
		ul#side_button li a {
			position:relative;
			display:block;
			width:45px;
			height:210px;
			color:#ffffff;
			font-weight:bold;
			text-decoration:none;
			line-height:120%;
			box-sizing:border-box;
			border:solid 1px #ff2626;
			border-right:none !important;
			background:#ff2626 url("../image/layout/ic_see_off.png") center 15px no-repeat;
			background-size:20px 20px;
			padding:45px 5px;
			}
		ul#side_button li a:hover {
			color:#ff2626;
			background:#ffffff url("../image/layout/ic_see_on.png") center 15px no-repeat;
			background-size:20px 20px;
			border:solid 1px #ff2626;
			border-right:none !important;
			}
			ul#side_button li a span {
				position:absolute;
				left:0;
				right:0;
				bottom:15px;
				font-size:13px;
				margin:0 auto;
				}
	ul#side_button li:nth-of-type(2) {
		top:220px;
		right:0;
		}
		ul#side_button li:nth-of-type(2) a {
			height:230px;
			background:#ffc004 url("../image/layout/ic_fav_off.png") center 15px no-repeat;
			background-size:20px 20px;
			border:solid 1px #ffc004;
			border-right:none !important;
			}
		ul#side_button li:nth-of-type(2) a:hover {
			color:#ffc004;
			background:#ffffff url("../image/layout/ic_fav_on.png") center 15px no-repeat;
			background-size:20px 20px;
			border:solid 1px #ffc004;
			border-right:none !important;
			}


/* ------------------------------------------------------------------------------------------------------------------------/
   expansion
/------------------------------------------------------------------------------------------------------------------------ */

.submit {
	display:block;
	clear:both;
	width:100%;
	text-align:center;
	margin:0 auto;
	}
	.submit button,
	.submit a,
	.submit input[type="button"],
	.submit input[type="submit"] {
		float:none !important;
		display:inline-block !important;
		width:100% !important;
		height:auto !important;
		color:#232323;
		font-size:15px;
		font-family:'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,Osaka,'MS PGothic',arial,helvetica,sans-serif;
		text-decoration:none;
		line-height:34px;
		box-sizing:border-box;
		background:#f6f6f6;
		cursor:pointer;
		}
	.submit button:hover,
	.submit a:hover,
	.submit input[type="button"]:hover,
	.submit input[type="submit"]:hover {
		color:#232323;
		box-sizing:border-box;
		background:#ffffff;
		}

ul.submit {
	display:block;
	clear:both;
	width:100%;
	text-align:left;
	margin:0 auto;
	padding:0;
	list-style:none;
	}
	ul.submit button,
	ul.submit a,
	ul.submit input[type="button"],
	ul.submit input[type="submit"] {
		display:block !important;
		width:100% !important;
		height:auto !important;
		color:#232323;
		font-size:15px;
		font-family:'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,Osaka,'MS PGothic',arial,helvetica,sans-serif;
		text-align:center;
		text-decoration:none;
		line-height:34px;
		box-sizing:border-box;
		background:#f6f6f6;
		margin:0 !important;
		cursor:pointer;
		}
	ul.submit button:hover,
	ul.submit a:hover,
	ul.submit input[type="button"]:hover,
	ul.submit input[type="submit"]:hover {
		color:#232323;
		box-sizing:border-box;
		background:#ffffff;
		}

ul.pager {
	clear:both;
	text-align:left;
	margin:30px 0;
	list-style:none;
	}
	ul.pager li {
		position:relative;
		display:inline-block;
		width:2.75em;
		font-size:15px;
		text-align:center;
		box-sizing:border-box;
		margin:10px 2px 0 2px;
		}
	ul.pager li.stay {
		display:inline-block;
		width:2.75em;
		color:#ffffff;
		font-weight:bold;
		text-align:center;
		text-decoration:none;
		line-height:35px;
		box-sizing:border-box;
		background:#009944 !important;
		border:solid 3px #009944 !important;
		}
	ul.pager li:nth-of-type(-n+21) {
		margin-top:0 !important;
		}
	ul.pager li a {
		display:block;
		width:2.75em;
		color:#232323;
		text-align:center;
		text-decoration:none;
		line-height:35px;
		box-sizing:border-box;
		background:#f4f4f4;
		border:solid 3px #efefef;
		}
	ul.pager li a:hover {
		color:#232323 !important;
		background:#f4f4f4 !important;
		border:solid 3px #009944 !important;
		}


/* アニメーション */