@charset "utf-8";

/*============================
	html5 base style
============================*/
html,body,div,span,object,iframe,
h1,h2,h3,h4,h5,h6,p,pre,address,code,
a,em,img,
small,strong,sub,sup,var,b,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,figcaption,figure,
footer,header,menu,nav,main,section,
time,mark,audio,video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
font-style:normal;
vertical-align:baseline;
background:transparent;
}
article,aside,figcaption,figure,
footer,header,menu,nav,main,section {
display:block;
}
ul {
list-style:none;
}
a {
text-decoration:none;
}
img {
vertical-align:top;
}
/*============================
	base layout
	header
	global navigation
	main visual
	main contents
	contents
	aside
	footer
	media query
============================*/
/*----------------------------
	base layout
-----------------------------*/
body {
	overflow-x: hidden;
}
body {
	font: 100% / 1.5 "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体","小塚ゴシックPr6N","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: 100%;
}
.inner{
	width: 860px;
	margin: 0 auto;
}
.cf::after {
	content: "";
	display: block;
	clear: both;
}
header, main, aside, footer {
	transition-duration: .4s;
	position: relative;
}
.bg_lblue {
	background-image: url(../images/bg.png);
}
/*----------------------------
	header
-----------------------------*/
#site_title {
	padding-left: 20px;
}
#site_title img {
	width: 235px;
	height: auto;
}
address {
	text-align: right;
	padding-right: 40px;
}
address p {
	letter-spacing: .05em;
}
.ico_tel {
	color: #000;
	font-size: 1.75rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: .085em;
}
.ico_tel::before {
	content: url(../images/ico_tel_bk.png);
	margin-right: 10px;
}
.link {
	color: #fff;
	background: #000;
	padding: 2px 13px;
	line-height: 1;
	margin-left: 8px;
	font-size: .75rem;
}
/*----------------------------
	global navigation
-----------------------------*/
nav {
	width: 328px;
	overflow: auto;
}
.nav_main {
	padding: 25px 20px 25px 30px;
}
.nav_main li {
	background-color: #ebf3f5;
	margin-bottom: 10px;
}
.nav_main li li {
	margin-bottom: 1px;
	padding: 0 10px;
}
.nav_main li li:last-child {
	padding-bottom: 15px;
}
.nav_main a {
	color: #3e505c;
	font-weight: bold;
	text-align: center;
	display: block;
	padding: 16px 0 15px;
}
.nav_main li li a {
	background-color: #fff;
	font-size: .875rem;
	padding: 8px 0 7px;
}
.nav_sub {
	padding: 0 20px 20px 30px;
}
.nav_sub li {
	float: left;
	width: 48%;
	margin-bottom: 10px;
}
.nav_sub li:nth-child(even) {
	float: right;
} 
.nav_sub a {
	color: #3e505c;
	font-size: .75rem;
	text-align: center;
	display: block;
	padding: 20px 0;
	border: 1px solid #cfcfcf;
}
.nav_sub a.row2 {
	padding: 11px 0;
}
.menu {
	color: #3e505c;
	font-size: .75rem;
	text-align: center;
	letter-spacing: .1em;
	height: 90px;
	padding-top: 52px;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
}
.menu span {
	display: block;
}
.menu::before, .menu span::before, .menu span::after {
	content: "";
	display: block;
	position: absolute;
}
.menu::before,
.menu span::before, .menu span::after {
	background-color: #3e505c;
	width: 25px;
	height: 4px;
	margin: 0 auto;
	right: 0;
	left: 0;
}
.menu::before		{ top: 32px; }
.menu span::before	{ top: 22px; }
.menu span::after	{ top: 42px; }
.menu.is_active::before {
	opacity: 0;
}
.menu.is_active span::before { transform: translateY(10px) rotate(45deg); }
.menu.is_active span::after	{ transform: translateY(-10px) rotate(-45deg); }
.nav_side a {
	color: #3e505c;
	line-height: 1.25;
	font-size: .75rem;
	text-align: center;
	display: block;
	padding: 12px 0 11px;
}
.nav_side a::before {
	content: url(../images/ico_tel.png);
	display: block;
	margin-bottom: 5px;
}
.nav_side li:first-child a::before {
	content: url(../images/ico_bus.png);
}
.nav_side li:nth-child(2) a::before {
	content: url(../images/ico_question.png);
}
.nav_side li:nth-child(3) a::before {
	content: url(../images/ico_pin.png);
}
#back {
	background-color: rgba(0,0,0,.3);
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: 50;
}
/*----------------------------
	aside
-----------------------------*/
aside {
	margin-bottom: 1px;
	padding-top: 40px;
}
aside ul{
	display: -webkit-flex;
	display: flex;
}
aside li {
	background-image: url(../images/bnr_recruit.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	flex: 1;
	height: 155px;
}
aside li+li {
	margin-left: 1px;
}
aside li:first-child {
	background-image: url(../images/bnr_blog.jpg);
}
aside li:nth-child(2) {
	background-image: url(../images/bnr_event.jpg);
}
aside li:nth-child(3) {
	background-image: url(../images/bnr_guide.jpg);
}
aside a {
	background-color: rgba(255,241,0,.5);
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 155px;
	text-align: center;
	letter-spacing: .1em;
	text-shadow: 4px 4px 0 #fff100;
	display: block;
	height: 100%;
	transition-duration: .4s;
}
aside a:hover {
	background-color: rgba(255,241,0,0);
}
aside li:first-child a {
	background-color: rgba(51,204,51,.5);
	text-shadow: 4px 4px 0 #3c3;
}
aside li:first-child a:hover {
	background-color: rgba(51,204,51,0);
}
aside li:nth-child(2) a {
	background-color: rgba(51,153,204,.5);
	text-shadow: 4px 4px 0 #39c;
}
aside li:nth-child(2) a:hover {
	background-color: rgba(51,153,204,0);
}
aside li:nth-child(3) a {
	background-color: rgba(204,51,119,.5);
	text-shadow: 4px 4px 0 #c37;
}
aside li:nth-child(3) a:hover {
	background-color: rgba(204,51,119,0);
}
/* page top */
#pagetop {
	background: #fff;
	text-align: center;
	line-height: 1.25;
	position: fixed;
	right: 40px;
	bottom: 30px;
	z-index: 40;
}
#pagetop a {
	color: #565656;
	font-size: .75rem;
	font-weight: bold;
	letter-spacing: .05em;
	text-shadow: 0 0 5px #fff;
	display: block;
	padding: 8px 15px;
	box-sizing: border-box;
}
#pagetop a::before {
	content: "";
	background: url(../images/link_pagetop.png) no-repeat;
	display: block;
	width: 20px;
	height: 40px;
	margin: 0 auto 5px;
	position: relative;
	top: 0;
	transition: top .3s ease-in-out;
}
#pagetop a:hover::before {
	top: -15px;
}
/*----------------------------
	footer
-----------------------------*/
footer {
	background-color: #e8e8e8;
	padding-top: 60px;
}
#foot_title {
	text-align: center;
	margin-bottom: 20px;
}
#foot_title img {
	width: 220px;
	height: auto;
}
footer ul,
.links {
	text-align: center;
}
footer > ul > li {
	vertical-align: top;
	display: inline-block;
	margin: 0 15px;
}
footer ul ul li {
	font-size: .75rem;
	margin-top: 6px;
}
footer ul ul li:first-child {
	margin-top: 20px;
}
footer a {
	color: #000;
}
footer a:hover {
	text-decoration: underline;
}
.links {
	margin: 55px 0;
}
.links a {
	font-size: .75rem;
	margin: 0 15px;
}
.copyright {
	background-color: #3e505c;
	color: #fff;
	font-size: .75rem;
	line-height: 1;
	text-align: center;
	padding: 18px 0 20px;
}
/*----------------------------
	media query
-----------------------------*/
/* リボン表示 */
@media only screen and (max-width:1100px) and (min-width:860px){
	.section_event { overflow-x: hidden; }
}
/* PC時ナビゲーション */
@media only screen and (min-width:981px){
	header, main, aside, footer {
		padding-left: 100px;
		left: 0;
	}
	header {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		padding-top: 18px;
		padding-bottom: 17px;
	}
	.nav_show header, .nav_show main, .nav_show aside, .nav_show footer {
		left: 328px;
	}
	.nav_outer {
		background-color: #fff;
		display: -webkit-flex;
		display: flex;
		margin-left: -328px;
		border-right: 1px solid #cfcfcf;
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 100;
		transition-duration: .4s;
	}
	.nav_outer.is_show {
		margin-left: 0;
	}
	.nav_side {
		width: 100px;
	}
	.menu::after {
		content: "";
		display: block;
		position: absolute;
		background-color: #cfcfcf;
		margin: 0 auto;
		width: 70px;
		height: 1px;
		left: 0;
		right: 0;
		bottom: 0;
	}
	.nav_side ul {
		padding-top: 12px;
	}
	.nav_side a {
		font-size: .625rem;
		padding: 15px 10px 20px;
	}
}
/* SP時ナビゲーション */
@media only screen and (max-width:980px){
	html, body {
		position: relative;
		overflow-x: hidden;
	}
	.nav_show, .nav_show body {
		width: 100%;
		height: 100vh;
		overflow: hidden;
	}
	header {
		float: left;
	}
	#site_title {
		height: 70px;
		padding: 0;
	}
	#site_title a {
		display: block;
		height: 100%;
		padding: 18px 5px 0 10px;
		box-sizing: border-box;
	}
	#site_title img {
		width: 150px;
	}
	.nav_outer {
		float: right;
	}
	nav {
		background-color: #fff;
		transition-duration: .4s;
		margin-top: 70px;
		overflow: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		right: -328px;
		z-index: 100;
	}
	.is_show nav {
		right: 0;
	}
	.nav_side, .nav_side ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row-reverse;
		flex-direction: row-reverse;
	}
	.menu {
		font-size: .5rem;
		width: 60px;
		height: 70px;
		padding-top: 40px;
	}
	.menu::before,
	.menu span::before, .menu span::after {
		width: 16px;
		height: 2px;
	}
	.menu::before		{ top: 24px; }
	.menu span::before 	{ top: 18px; }
	.menu span::after	{ top: 30px; }
	.menu.is_active span::before {
		transform: translateY(6px) rotate(45deg);
	}
	.menu.is_active span::after {
		transform: translateY(-6px) rotate(-45deg);
	}
	.nav_side a {
		font-size: .5rem;
		width: 45px;
		padding: 16px 0;
	}
	.nav_side a::before,
	.nav_side li:nth-child(3) a::before {
		content: "";
		background: url(../images/ico_tel.png) no-repeat center top / auto 20px;
		width: 22px;
		height: 20px;
		margin: 0 auto 5px;
	}
	.nav_side li:nth-child(3) a::before {
		background-image: url(../images/ico_pin.png);
	}
	#back {
		margin-top: 70px;
	}
	main {
		clear: both;
	}
	/* 非表示 */
	address,
	.nav_side li:nth-child(1), .nav_side li:nth-child(2) {
		display: none;
	}
}
/* コンテンツ SP表示 */
@media only screen and (max-width:860px){
	.inner{
		width: 100%;
		margin: 0;
		padding: 0 20px;
		box-sizing: border-box;
	}
	aside ul {
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	aside li {
		flex: 0 0 50%;
	}
	aside li+li {
		margin-left: 0;
	}
	aside a {
		font-size: 1.25rem;
		box-sizing: border-box;
	}
	aside li:first-child a, aside li:nth-child(2) a {
		border-bottom: 1px solid #fff;
	}
	aside li:nth-child(even) a {
		border-left: 1px solid #fff;
	}
	#pagetop {
		width: 50px;
		height: 50px;
		overflow: hidden;
		right: 10px;
		bottom: 10px;
	}
	#pagetop a {
		color: transparent;
		font-size: .5rem;
		height: 100%;
		position: relative;
	}
	#pagetop a::before {
		background-size: contain;
		width: 10px;
		height: 24px;
		margin: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
	}
	footer {
		padding-top: 40px;
	}
	#foot_title {
		margin-bottom: 50px;
	}
	#foot_title img {
		width: 175px;
	}
	/* 非表示 */
	footer ul, .links {
		display: none;
	}
}
