@charset "utf-8";

/**************************************************************************************

--------------------------------------------------------------------------------------
レイアウト
***************************************************************************************/

.wrap,
.wrapN {
	width:1000px;
	margin:0 auto;
	box-sizing:border-box;
}
@media only screen and (max-width:640px) {
	.wrap {
		width:100%;
		padding:0 15px;
	}
	.wrapN {
		width:100%;
	}
}

/**************************************************************************************

--------------------------------------------------------------------------------------
ヘッダー
***************************************************************************************/

body {
	padding-top:150px;
}
header {
	position:fixed;
	top:0;
	z-index:9999;
	width:100%;
	height:130px;
	background-color:#fff;
}
header a.logo {
	display:block;
	width:262px;
	margin:30px auto 0;
}
@media only screen and (max-width:640px) {
	body {
		padding-top:50px;
	}
	header {
		height:50px;
	}
	header a.logo {
		width:150px;
		margin-top:15px;
	}	
}
@media print{
	header {
		display:none;
	}
}

/* Gナビ
========================================== */

/* ---------------------------
PC
----------------------------- */

@media only screen and (min-width:641px) {
	header .gNav ul {
		width:960px;
		margin:25px auto 0;
        display: flex;
        justify-content: center;
	}
	header .gNav ul li {
/*		float:left;*/
		width:14.285%;
		position:relative;
	}
	header .gNav ul li::before,
	header .gNav ul li:last-of-type::after {
		content:"";
		width:1px;
		height:15px;
		background-color:#000;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
	}
	header .gNav ul li::before {
		left:0;
	}
	header .gNav ul li:last-of-type::after {
		right:0;
	}
	header .gNav ul li a {
		display:block;
		text-align:center;
		font-size:14px;
	}
}

/* ---------------------------
SP
----------------------------- */

@media only screen and (max-width:640px) {
	header ul.gNav {
		display:none;
	}
	header .gNav .menuBg {
		width:100%;
		height:100%;
		position:fixed;
		background-color:rgba(0,0,0,0.5);
		display:none;
		z-index:999;
		top:50px;
		left:0;
	}
	header .gNav button.menuIcon {
		display:block;
		background:none;
		border:none;
		padding:5px 15px 4px;
		width:60px;
		letter-spacing:0.1em;
		cursor:pointer;
		position:fixed;
		top:0;
		right:0;
		z-index:1001;
		text-align:center;
		outline:none;
		color:#000;
		box-sizing:border-box;
	}
	header .gNav button.menuIcon.active span {
		width:30px;
	}
	header .gNav button.menuIcon.active span:nth-of-type(1) {
		transform:rotate(45deg);
	}
	header .gNav button.menuIcon.active span:nth-of-type(2) {
		opacity:0;
	}
	header .gNav button.menuIcon.active span:nth-of-type(3) {
		transform:rotate(-45deg);
		position:relative;
		left:-2px;
		bottom:-1px;
	}
	header .gNav button.menuIcon span {
		display:block;
		height:2px;
		margin:8px 0;
		transition:all 0.3s;
		transform-origin:0 0;
		background-color:#000;
	}
	header .gNav nav {
		width:60%;
		height:100%;
		transition:all 0.3s;
		transform:translate(100%);
		position:fixed;
		top:50px;
		right:0;
		z-index:1000;
		background-color:#fff;
	}
	header .gNav nav.open {
		transform:translate(0);
	}
	header .gNav nav ul {
	}
	header .gNav nav ul li {
		border-bottom:1px solid #c8c8c8;
	}
	header .gNav nav ul li a {
		display:block;
		font-size:16px;
		text-align:right;
		padding:10px 20px;
	}
	header .gNav nav ul li a:hover {
		color:#000;
		background-color:rgba(255,0,0,0.3);
	}
}

/**************************************************************************************

--------------------------------------------------------------------------------------
メイン部分
***************************************************************************************/

#main {
	display:block;
}

/**************************************************************************************

--------------------------------------------------------------------------------------
ページトップ
***************************************************************************************/

a#pageTop {
	position:fixed;
	bottom:50px;
	right:50px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	width:55px;
	height:55px;
	border-top: solid 1px #000;
	border-right: solid 1px #000;
	transform:rotate(-45deg);
}
@media screen and (max-width:768px) {
	a#pageTop {
		bottom:0;
		right:0;
		width:46px;
		height:46px;
		background-color:#c8c8c8;
		border:none;
		transform:none;
	}
	a#pageTop::after {
		content:"";
		display:block;
		position:absolute;
		top:20px;
		left:13px;
		width:20px;
		height:20px;
		border-top: solid 1px #fff;
		border-right: solid 1px #fff;
		transform:rotate(-45deg);
	}
}

/**************************************************************************************

--------------------------------------------------------------------------------------
フッター
***************************************************************************************/

footer {
	margin-top:100px;
	padding:1px 0 30px;
	background-color:#b4b4b4;
	color:#fff;
}
footer .sitemap {
	margin:30px 40px 0;
}
footer .sitemap ul {
	float:left;
}
footer .sitemap ul + ul {
	margin-left:140px;
}
footer .sitemap ul li {
}
footer .sitemap ul li + li {
	margin-top:3px;
}
footer .sitemap ul li a {
	display:block;
	color:#fff;
	font-size:16px;
}
footer .sitemap ul li a:hover {
	color:#f00;
}
footer p.copy {
	font-size:13px;
	text-align:right;
	margin-top:20px;
}
@media only screen and (max-width:640px) {
	footer {
		margin-top:70px;
		padding-bottom:20px;
	}
	footer .sitemap {
		margin:15px 0;
	}
	footer .sitemap ul {
		float:none;
	}
	footer .sitemap ul + ul {
		margin-left:0;
	}
	footer .sitemap ul li {
		border:1px solid #fff;
	}
	footer .sitemap ul li + li {
		margin-top:0;
		border-top:none;
	}
	footer .sitemap ul + ul li:first-of-type {
		border-top:none;
	}
	footer .sitemap ul li a {
		padding:10px 30px 10px 15px;
		font-size:14px;
		position:relative;
	}
	footer .sitemap ul li a:hover {
		color:#fff;
		background-color:rgba(255,0,0,0.3);
	}
	footer .sitemap ul li a::after {
		content:"";
		position:absolute;
		top:50%;
		right:15px;
		transform:translateY(-50%);
		border-top:7px solid transparent;
		border-bottom:7px solid transparent;
		border-left:7px solid #fff;
	}
	footer p.copy {
		text-align:center;
		font-size:12px;
	}
}