@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
@font-face {
	font-family: 'Icons';
	src: url('./font/whhg/font/webhostinghub-glyphs.eot'); /* IE9 Compat Modes */
	src: url('./font/whhg/font/webhostinghub-glyphs.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	/*url('./font/whhg/font/webhostinghub-glyphs.woff') format('woff'), /* Modern Browsers */
	url('./font/whhg/font/webhostinghub-glyphs.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/whhg/font/webhostinghub-glyphs.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'Icons2';
	src: url('./font/foundation/foundation-icons/foundation-icons.eot'); /* IE9 Compat Modes */
	src: url('./font/foundation/foundation-icons/foundation-icons.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('./font/foundation/foundation-icons/foundation-icons.woff') format('woff'), /* Modern Browsers */
	url('./font/foundation/foundation-icons/foundation-icons.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/foundation/foundation-icons/foundation-icons.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'SNSIcons';
	src: url('./font/icomoon/fonts/icomoon.eot'); /* IE9 Compat Modes */
	src: url('./font/icomoon/fonts/icomoon.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('./font/icomoon/fonts/icomoon.woff') format('woff'), /* Modern Browsers */
	url('./font/icomoon/fonts/icomoon.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/icomoon/fonts/icomoon.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'Gill Sans Nova Heavy Italic';
	src: url('./font/gill_sans_nova_heavy_italic/gill_sans_nova_heavy_italic.eot'); /* IE9 Compat Modes */
	src: url('./font/gill_sans_nova_heavy_italic/gill_sans_nova_heavy_italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('./font/gill_sans_nova_heavy_italic/gill_sans_nova_heavy_italic.woff') format('woff'), /* Modern Browsers */
	url('./font/gill_sans_nova_heavy_italic/gill_sans_nova_heavy_italic.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/gill_sans_nova_heavy_italic/gill_sans_nova_heavy_italic.svg#svgFontName') format('svg'); /* Legacy iOS */
}
/****************************************
RESET
****************************************/
html{
	color: #ffffff;
	background: #1b1b1b;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input, textarea,
p, blockquote, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,
img {
	border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
li {
	list-style:none;
}
	
caption,
th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:”;
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
/* to preserve line-height and selector appearance */
sup {
	vertical-align:text-top;
}
sub {
	vertical-align:text-bottom;
}
input,
textarea,
select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
/*to enable resizing for IE*/
input,
textarea,
select {
	*font-size:100%;
}
/*because legend doesn’t inherit in IE */
legend {
	color:#000;
}
img {
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: ”;
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="reset"],
input[type="button"] {
	border-radius: 0;
	-webkit-box-sizing: content-box;
	-webkit-appearance: button;
	appearance: button;
	border: none;
	box-sizing: border-box;
	cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}
input[type="submit"]::focus,
input[type="reset"]::focus,
input[type="button"]::focus {
	outline-offset: -2px;
}


/****************************************
BASE
****************************************/
a:link	{ color: #ffffff; font-weight: normal; text-decoration: none; } /* 普通のリンク色 */
a:visited { color: #ffffff; font-weight: normal; text-decoration: none; } /* すでに見たリンク色 */
a:active { color: #ffffff; font-weight: normal; text-decoration: none; } /* クリックしたときのリンク色 */
a:hover	{ color: #ffffff; font-weight: normal; text-decoration: none; } /* カーソルが乗ったときのリンク色 */
a:hover,a.hover {
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
/*
a:hover img,a.hover img {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
*/
html, body {
	height: 100%;
		}
body {
	background: #1b1b1b;
	margin: 0 auto;
	font-size: 100%;
	line-height: 180%;
	color: #ffffff;
	font-family: Avenir,"Open Sans","Helvetica Neue",Helvetica,Arial,Verdana,Roboto,"游ゴシック","Yu Gothic","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Meiryo UI","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	-webkit-text-size-adjust : none;
/*
font-family: Avenir,"Open Sans","Helvetica Neue",Helvetica,Arial,Verdana,Roboto,"游ゴシック","Yu Gothic","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Meiryo UI","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
font-family: "KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Sans","Hiragino Kaku Gothic ProN","游ゴシック  Medium",meiryo, sans-serif;
font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "MS P明朝" , "MS PMincho" , serif;
*/
}
@media screen and (max-width: 870px) {

}
img {
	margin: 0;
	padding: 0;
	width: 100%;
}

h1,h2,h3,h4,h5,h6 {
	/*font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "MS P明朝" , "MS PMincho" , serif;*/
	font-family: "Sawarabi Mincho";
}
h1 {
	background: rgb(27, 27, 27);
	width: 100%;
	margin: 0 auto;
	padding: 3px 0;
	font-size: 75%;
	text-align: center;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	position: relative;
	z-index: 100;
}
@media only screen and (max-width: 870px) {
	h1 {

	}
}
#content h2 {
	margin: 0;
	padding: 0;
	font-size: 100%;
	text-align: center;
}
#content h2.title {
	margin: 5% auto 2%;
	padding: 0;
	color: #e4007f;
	font-size: 180%;
	text-align: center;
	text-shadow: 1px 1px 2px rgba(255,255,255,0.8);
}
#content h2.title:before {
}
#content h2.title:after {
	content: ' ';
	display: block;
	width: 10%;
	height: 1px;
	margin: 15px auto 0;
	background: #e4007f;
	box-shadow: 1px 1px 2px rgba(255,255,255,0.8);
}
@media only screen and (max-width: 870px) {
	#content h2.title {
		font-size: 130%;
		margin: 5% auto 4%;
	}
	#content h2.title:after {
		margin: 7px auto 0;
	}
}
/*
#content h3:before {
	padding-right: 3px;
	font-family: "Icons";
	font-size: 75%;
	content: "\f738";
}
*/
#content h3 {
	margin: 0;
	padding: 8px 2% 2px;
	color: #ff98d1;
	font-size: 120%;
	text-align: left;
	text-shadow: 1px 1px 2px rgba(255,255,255,0.8);
	border-top: 1px #e4007f solid;
	border-bottom: 1px #e4007f solid;
}
#content h3 span {
	font-size: 170%;
	text-shadow: 0 0 7px rgba(255,255,255,0.7);
	vertical-align: baseline;
}
@media only screen and (max-width: 870px) {
	#content h3 {
			font-size: 105%;
	}
	#content h3 span {

	}
}
h4:before {
	padding-right: 3px;
	font-family: "Icons";
	font-size: 75%;
	content: "\f504";
}
h4 {
	background: #313131;
	margin: 0;
	padding: 0 0 0 2%;
	color: #ffffff;
	font-size: 110%;
	text-align: left;
}
h4 span {

}
@media only screen and (max-width: 870px) {
	h4 {
		font-size: 95%;
	}
	h4 span {

	}
}
h5 {

}

@media only screen and (max-width: 870px) {
	h5 {

	}
}
#wall {
	min-height: 600px;
	width: 100%;
	height: auto;
	position: relative;
}
#content {
	margin: 0 auto;
	max-width: 100%;
	min-width: 100%;
	width: 100%;
}
.content_inner {
	margin: 0 auto 5%;
	max-width: 1000px;
	width: 100%;
}
#content:after,.content_inner:after {
	content: "";
	display: block;
	clear: both;
}
#content p,.content_inner p {

}
@media only screen and (max-width: 870px) {
	.content_inner {
		width: 98%;
	}
	#content p,.content_inner p {

	}
}
.pc {
	display: inline-block;
}
.sp {
	display: none;
}
@media only screen and (max-width: 870px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
}
.clear {
	clear: both;
}
.big {
	font-size: 200%;
}
.small {
	font-size: 75%;
}
.mincho {
	/* font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "MS P明朝" , "MS PMincho" , serif; */
	font-family: "Sawarabi Mincho";
}

/****************************************
effect
****************************************/
/* 画面外にいる状態 */
.effect {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 500ms;
}
	
/* 画面内に入った状態 */
.effect.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}

/****************************************
tub
****************************************/
.tub {
	width: 100%;
	max-width: 1000px;
	margin: 0.5% auto;
	font-size: 80%;
}
@media only screen and (max-width: 870px) {
	.tub {
		display: none;
	}
}
.breadcrumb {
	width: 100%;
}
.breadcrumb li {
	display: inline-block;
	margin: 0;
	width: auto;
}
.breadcrumb li a {
	display: inline-block;
	margin: 0;
	padding: 0;
	width: auto;
	text-decoration: underline;
}
.breadcrumb li a:hover,.breadcrumb li a.hover {
	text-decoration: none;
}
.breadcrumb li::after {
	content: '\00bb';
	margin: 0 10px;
	display: block;
	float: right;
}
.breadcrumb li:last-child::after {
	display: none;
}

/****************************************
CALAM
****************************************/
.main-contents {
	float: left;
	width: 71%;
	padding: 0 2%;
}
.side_bar {
	float: right;
	width: 23%;
	padding: 0 2% 0 0;
}

@media screen and (max-width: 1000px) {
	.main-contents {
		float: left;
		width: 71%;
		padding: 0 2%;
	}
	.side_bar {
		float: right;
		width: 23%;
		padding: 0 2% 0 0;
	}
}
.right ul.bn,.left ul.bn {
	width: 100%;
	margin: 0 auto;
}
.right ul.bn li,.left ul.bn li {
	width: 100%;
	margin: 0 auto 2px;
	padding: 0;
	color: #ffffff;
	font-size: 80%;
}

@media screen and (max-width: 870px) {
	.right ul.bn li a:hover,.left ul.bn li a:hover {
		-webkit-transform: scale(1.0);
		-moz-transform: scale(1.0);
		-o-transform: scale(1.0);
		-ms-transform: scale(1.0);
		transform: scale(1.0);
	}
}

/****************************************
backtop
****************************************/
.backtotop {
	position: fixed;
	right: 15px;
	bottom: 35px;
	z-index: 9000;
	display: none;
	text-align: center;
}

.backtotop a {
	display: block;
	color: #eeeeee;
	padding: 15px 20px;
	margin: 0;
	background-color: #a0a0a0;
	border-radius: 0;
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
}
.backtotop a:before {
	font-family: "Icons2";
	font-size: 200%;
	content: "\f144";
}
.backtotop a:hover {
	text-decoration: none;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
@media screen and (max-width: 870px) {
	.backtotop {
		position: relative;
		right: 0;
		bottom: 0;
		z-index: 1;
		margin: 2% auto;
	}
	.backtotop a {
		padding: 10px 15px;
		line-height: 100%;
	}
}

/****************************************
header
****************************************/

header {
	background: rgba(0,0,0,0.5);
	width: 98%;
	height: 55px;
	margin: 0;
	padding: 1%;
	text-align: center;
	position: relative;
	z-index: 9998;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
header.fixed {
	background: rgba(0,0,0,0.8);
	position: fixed;
	top: 0;
	left: 0;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
header .inner {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
}
header:after,header .inner:after {
	content: "";
	clear: both;
	display: block;
}
header .menu_bar {
	position: relative;
}
header .menu_bar:after {
	content: "";
	clear: both;
	display: block;
}
header .logo {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 80px;
	height: 80px;
	margin: 0 0 0 -40px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	text-align: center;
}
header.fixed .logo {
	width: 60px;
	height: 60px;
	margin: 0 0 0 -30px;
}
@keyframes turnY{
	0%{transform:rotateY(0deg);}
	100%{transform:rotateY(360deg);}
}
header .logo:hover {
	animation-name:turnY;
	animation-duration:3s;
	animation-iteration-count:1;
}
header .logo img {

}
header ul {
	width: 425px;
	position: absolute;
	font-size: 90%;
	line-height: 100%;
}
header ul:after {
	content: "";
	clear: both;
	display: block;
}
header ul li {
	margin: 0 10px 0 0;
	padding: 25px 0 0;
	display: inline-block;
}
header ul li:after {
	content: "";
	height: 8px;
	padding-right: 14px;
	border-right: 1px #ffffff solid;
}
/*
header ul.left li:nth-child(5),header ul.right li:last-child {
	margin: 0;
}
header ul.left li:nth-child(5):after,header ul.right li:last-child:after {
	display: none;
}
*/
header ul.left li:nth-child(6),header ul.right li:last-child {
	margin: 0;
}
header ul.left li:nth-child(6):after,header ul.right li:last-child:after {
	display: none;
}
header ul li.none,header ul li a .none {
	display: none;
}
header ul li:last-child {
	margin: 0;
}
header ul li a {
	margin: 2% 0 0;
	font-weight: bold;
}
header ul li a:hover,header ul li a.hover {
	color: #ea68a2;
	text-shadow: 0 0 7px rgba(255,255,255,0.8);
}
header ul.left {
	width: auto;
	left: 0;
	margin: 0;
	text-align: left;
}
header ul.right {
	left: 50%;
	margin-left: 60px;
	text-align: left;
}
header .address {
	background: #a40035;
	width: 420px;
	height: auto;
	margin: 0;
	padding: 1% 1% 0.5%;
	font-size: 85%;
	text-align: left;
	color: #ffffff;
	position: absolute;
	top: 0;
	right: 0;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
header.fixed .address {
	background: none;
	padding: 1% 1% 0.5%;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
header .address .time {
	width: 40%;
	margin: 0 auto;
	line-height: 140%;
	display: block;
	font-size: 90%;
	text-align: right;
	float: left;
}
header .address .time div.time_title {
	background: #ffffff;
	padding: 1px 2px;
	color: #a40035;
	text-align: center;
	font-size: 110%;
}
header.fixed .address .time div.time_title {
	display: none;
}
header .address .time div.time_days {
	margin: 5% 0 0;
	line-height: 170%;
}
header.fixed .address .time div.time_days {
	margin: 0;
}
header .address .time span.br {
	display: block;
}
header.fixed .address .time {
	/* display: none; */
}
header .address .tel_frame {
	width: auto;
	float: right;
}
header .address .tel {
	display: block;
	padding: 10px 0 5px;
	font-size: 240%;
	text-align: center;
	text-shadow: 0 0 7px rgba(255,255,255,0.8);
}
header.fixed .address .tel {
	color: #ffb7df;
	padding: 3px 0 0;
	text-shadow: 0 0 7px rgba(255,255,255,0.8);
}
header .address .tel:before {
	font-family: "Icons";
	font-size: 75%;
	padding-right: 5px;
	content: "\f15b";
}
@keyframes Flash1{
	50%{
		opacity: 0;
	}
}
header .address .atend {
	display: block;
	text-align: center;
	font-size: 95%;
	animation: Flash1 1s infinite;
}
header.fixed .address .atend {
	font-size: 80%;
	line-height: 140%;
	display: none;
}

.recruit {
	opacity: 1;
	width: 170px;
	height: auto;
	margin: 0;
	font-size: 85%;
	text-align: left;
	color: #ffffff;
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 0;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
/*
.recruit a {
	height: 114px;
	display: block;
	background: #f4f3ef url(../img/header/recruit_back.png) center center no-repeat;
	padding: 5px 0;
	color: #1b1b1b;
	text-decoration: none;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.recruit:hover,.recruit.hover {
	box-shadow: 0 0 15px rgba(255,255,255,0.8);
}
.recruit:hover a,.recruit.hover a {
	background: #ffffff url(../img/header/recruit_back.png) center center no-repeat;
	background-size: 150%;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.recruit a .frame {
	position: relative;
}
.recruit a .frame .title {
	width: 150%;
	margin: 15px 0 0 -39px;
	background: #7d7d7d;
	padding: 7px 0;
	font-size: 250%;
	text-align: center;
	font-weight: bold;
	color: #ffffff;
	text-shadow: 0 0 7px rgba(228,0,127,0.8);
	transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-webkit-transform: rotate(3deg);
	translate: 3deg;
}
.recruit a .frame .sub {
	background: rgba(0,0,0,0.7);
	width: 100%;
	font-size: 90%;
	line-height: 150%;
	text-align: center;
	color: #ffffff;
	text-shadow: 0 0 5px rgba(255,255,255,0.5);
	position: absolute;
	bottom: -53px;
}
.recruit a .frame .sub span {
	display: block;
}
header.fixed .recruit a {
	height: auto;
	background: #f4f3ef;
	padding: 5px 0;
}
header.fixed .recruit a .frame .title {
	width: 100%;
	margin: 0;
	padding: 3px 0;
	font-size: 200%;
	text-shadow: 0 0 5px rgba(228,0,127,0.8);
	transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	translate: 0deg;
}
header.fixed .recruit a .frame .sub {
	background: none;
	width: 100%;
	margin: 3px 0 0;
	font-size: 80%;
	font-weight: bold;
	line-height: 130%;
	color: #000000;
	text-shadow: none;
	position: relative;
	bottom: 0;
}
header.fixed .recruit a .frame .sub span {
	display: none;
}
*/
.recruit a {
	height: 114px;
	display: block;
	background: #007130;
	padding: 5px 0;
	color: #1b1b1b;
	text-decoration: none;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.recruit:hover,.recruit.hover {
	box-shadow: 0 0 15px rgba(255,255,255,0.8);
}
.recruit:hover a,.recruit.hover a {
	background: #009740;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.recruit a .frame {
	position: relative;
}
.recruit a .frame .title {
	width: 100%;
	margin: 32px 0 0;
	padding: 0;
	font-size: 250%;
	text-align: center;
	font-weight: 500;
	color: #ffffff;
	text-shadow: 0 0 7px rgba(255,255,255,0.8);
}
.recruit a .frame .sub {
	background: rgba(0,0,0,0.7);
	padding: 2px 0;
	width: 100%;
	font-size: 95%;
	line-height: 150%;
	text-align: center;
	color: #ffffff;
	text-shadow: 0 0 5px rgba(255,255,255,0.5);
	position: absolute;
	bottom: -40px;
}
.recruit a .frame .sub span {
	display: block;
}
header.fixed .recruit a {
	height: auto;
	padding: 5px 0;
}
header.fixed .recruit a .frame .title {
	width: 100%;
	margin: 0;
	padding: 3px 0;
	font-size: 200%;
	text-shadow: 0 0 5px rgba(255,255,255,0.8);
}
header.fixed .recruit a .frame .sub {
	background: none;
	width: 100%;
	margin: 3px 0 0;
	font-size: 80%;
	font-weight: bold;
	line-height: 130%;
	text-shadow: none;
	position: relative;
	bottom: 0;
}
header.fixed .recruit a .frame .sub span {
	display: none;
}
.fixed_wall {
	margin: 170px 0 0;
}

@media only screen and (max-width: 1000px) {
	header .inner {
		max-width: 100%;
		transition: all 0.5s ease;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
	}
	/*
	header .address {
		width: 240px;
		font-size: 85%;
		right: 5px;
	}
	*/
	/*
	header .address .time {
		width: 98%;
	}
	*/
	header .address .tel {
		padding: 5px 0 0px;
		font-size: 220%;
	}
	header .address .atend {
		font-size: 85%;
	}
	header ul {
		font-size: 80%;
	}
	header ul li,header ul li:nth-child(4) {
		margin: 0 5px 0 0;
		padding: 0;
	}
	header {
		background: rgba(0,0,0,1.0);
		width: 100%;
		height: auto;
		padding: 1% 0 0;
		position: relative;
		border-bottom: 1px #959595 solid;
	}
	header.fixed {
		background: rgba(0,0,0,1.0);
	}
	header .menu_bar {
		margin: 0 auto;
	}
	header .address {
		background: none;
		width: 100%;
		font-size: 70%;
		padding: 0;
		position: relative;
		right: unset;
		top: unset;
		transition: all 0.5s ease;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
	}
	.recruit {
		opacity: 0;
		z-index: -1;
		transition: all 0.5s ease;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
	}
	header.fixed .address {
		padding: 0.5% 0;
	}
	header .address .tel,header .address .atend {
		display: none;
	}
	header .logo {
		width: 50px;
		height: 50px;
		margin: 0;
		top: 10px;
		left: 5px;
	}
	header.fixed .logo {
		width: 50px;
		height: 50px;
		margin: 0;
	}
	header ul {
		width: auto;
		position: relative;
	}
	header ul.left {
		width: 100%;
	}
	header ul.right {
		display: none;
	}
	header ul li a .out {
		display: none;
	}
	header ul li.none,header ul li a .none {
		display: inline-block;
	}
	header ul li {
		height: auto;
		margin: 0;
		width: 16%;
		padding: 0;
		float: left;
	}
	header ul.left li,header ul.left li:nth-child(5) {
		margin: 0;
		padding: 10px 0;
	}
	header ul.left li:nth-child(1) {
		width: 17.5%;
	}
	header ul.left li:after,header ul.right li:after {
		display: none;
	}
	header ul li a {
		display: block;
		margin: 0;
		padding: 20px 0;
		color: #ffffff;
		text-align: center;
		border-right: 1px #959595 solid;
	}
	header ul li:last-child a {
		border-right: none;
	}
	header .address .time {
		display: none;
		/*
		width: 100%;
		text-align: center;
		display: inline-block;
		*/
	}
	header .address .time span.time_title {
		color: #000000;
	}
	header .address .time span.br {
		display: inline-block;
	}
	.fixed_wall {
		margin: 130px 0 0;
	}
}

/****************************************
footer
****************************************/
footer {
	background: #434343;
	margin: 0 auto;
	padding: 1% 0;
	clear: both;
	font-size: 85%;
}
footer:after {
	content: "";
	clear: both;
	display: block;
}
footer h4:before {
	padding-right: 3px;
	font-family: "Icons";
	font-size: 75%;
	content: "\f504";
}
footer h4 {
	background: #313131;
	margin: 0;
	padding: 0 0 0 2%;
	color: #ffffff;
	font-size: 110%;
	text-align: left;
}
footer h4 span {

}
@media only screen and (max-width: 870px) {
	footer h4 {
		font-size: 95%;
	}
	footer h4 span {

	}
}

footer .footer_group {
	margin: 0 auto;
	width: 98%;
	max-width: 1100px;
}
footer .footer_group:after {
	content: "";
	clear: both;
	display: block;
}
footer .left {
	width: 49%;
	margin: 0;
	padding: 0 1% 0 0;
	text-align: left;
	float: left;
}
footer .right {
	width: 49%;
	margin: 0;
	padding: 0 0 0 1%;
	text-align: left;
	float: left;
}
footer .right .lp {
	margin: 1% 0;
}
footer .footer_group ul {
	margin: 2%;
	line-height: 160%;
	text-align: left;
}

footer .footer_group ul li a {
	text-decoration: underline;
}
footer .footer_group ul li a:hover,footer .footer_group ul li a.hover {
	text-decoration: none;
}
footer .footer_group ul li {
	display: block;
	padding: 0 0 0.5%;
}
footer .footer_group ul li a span {
	display: none;
}
@media only screen and (max-width: 870px) {
	footer .left {
		width: 98%;
		margin: 0 auto;
		padding: 0;
		float: none;
	}
	footer .right {
		display: none;
	}
	footer .footer_group ul li {
		display: inline-block;
		padding: 0 1% 1% 0;
	}
}
footer .footer_group ul li.twitter a:before {
	font-family: "Icons";
	font-size: 350%;
	content: "\f78c";
	color: #1da1f2;
}
footer .footer_group ul li.facebook a:before {
	font-family: "Icons";
	font-size: 350%;
	content: "\f78d";
	color: #3b5998;
}
footer .footer_group ul li.mail a:before {
	font-family: "Icons";
	font-size: 350%;
	content: "\f136";
	color: #d1c0a5;
}
footer .footer_group ul li.line a:before {
	font-family: "SNSIcons";
	font-size: 350%;
	content: "\e009";
	color: #22ac38;
}
footer .footer_group ul li.hatena a:before {
	font-family: "SNSIcons";
	font-size: 350%;
	content: "\e00a";
	color: #3c7dd1;
}
footer .footer_group ul li.google a:before {
	font-family: "SNSIcons";
	font-size: 350%;
	content: "\e608";
	color: #dd4b39;
}
footer .footer_group ul li.pocket a:before {
	font-family: "SNSIcons";
	font-size: 350%;
	content: "\e008";
	color: #ee4056;
}
footer .copy {
	text-align: left;
	margin: 2% auto 0;
	padding: 0 1%;
	font-size: 90%;
}
footer .copy {
	font-size: 85%;
	text-align: center;
}
footer .copy a {
	text-decoration: underline;
}
footer .copy a:hover,footer .copy a.hover {
	text-decoration: none;
}
@media screen and (max-width: 870px) {
	footer .f_group {
		width: 98%;
		margin: 0 auto 5%;
		font-size: 80%;
		float: none;
		line-height: 145%;
		clear: both;
	}
	footer ul.f_menu {
		width: 98%;
		border-right: none;
		min-height: auto;
		font-size: 85%;
	}
	footer ul.f_share {
		width: 98%;
		border-right: none;
		min-height: auto;
		font-size: 75%;
	}
	footer ul.f_menu li {
		display: inline-block;
		margin: 0 2% 0 0;
	}
}
/****** FIXED_NAV ******/
@media screen and (max-width: 870px) {
	#fixed_nav .fixed_nav {
		position: fixed;
		z-index: 9999;
		bottom: 0;
		left: 0;
		overflow: hidden;
		width: 100%;
		height: auto;
		padding: 2% 0;
		background: rgba(255,255,255,0.7);
	}
	#fixed_nav .static {
		margin: 5% auto 2%;
		position: static;
	}
	#fixed_nav .fixed_nav ul.fixed_menu {
		margin: 0 auto;
		width: 98%;
	}
	#fixed_nav .fixed_nav ul.fixed_menu:after {
		content: "";
		display: block;
		clear: both;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li {
		margin: 0;
		width: 50%;
		display: block;
		float: left;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li:first-child {
		margin: 0;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li a {
		margin: 0 auto;
		padding: 10px 0;
		width: 96%;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
		display: block;
		text-align: center;
		border-radius: 5px;
		color: #1b1b1b;
		font-size: 12px;
		font-weight: bold;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li a:hover,#fixed_nav .fixed_nav ul.fixed_menu li a.hover {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f6f6f6+100 */
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.tel a:before {
		font-family: "Icons2";
		font-size: 200%;
		content: "\f1f8";
		vertical-align: bottom;
		padding: 5px;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.mail a:before {
		font-family: "Icons";
		font-size: 130%;
		content: "\f136";
		vertical-align: bottom;
		padding: 5px;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.line_b a:before {
		font-family: "Icons";
		font-size: 130%;
		content: "\f697";
		vertical-align: bottom;
		padding: 5px;
	}
}
@media screen and (max-width: 430px) {

	#fixed_nav .fixed_nav ul.fixed_menu li a {
		padding: 3px 0;
		font-size: 70%;
		line-height: 130%;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.tel a:before {
		display: block;
		font-size: 260%;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.mail a:before,#fixed_nav .fixed_nav ul.fixed_menu li.line_b a:before {
		display: block;
		font-size: 200%;
	}
}
