@charset "utf-8";

body {
	/* フォントレンダリング設定: 1x解像度ではsubpixel、2x以上の解像度ではgrayscale */
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: unset;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	body {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}
h1 { font-size: 1.8rem;}
h2 { font-size: 1.6rem;}
h3 { font-size: 1.4rem;}
h4 { font-size: 1.2rem;}
h5 { font-size: 1.0rem; font-weight: normal;}
h2, h3, h4, dt, strong, em {		/* -------- h1 は対応しない！ */
	font-weight: bold;
}
h1, h2, h3 {		/* -------- h4 は対応しない！ */
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
a {
	text-decoration: none;
	transition: .3s;
	color: #33f;
}
a:link, a:visited, a:active, a:focus {
	text-decoration: none;
	color: #33f;
}
.table td a {
	text-decoration: none;
	transition: .3s;
}
.table td a:hover {
	color: #f63;
}
div a:hover, p a:hover, li a:hover, dd a:hover {
	text-decoration: none;
	color: #f63;
}
.text-white-shadow {
	text-shadow:
		1px 0 0 #fff, 0 1px 0 #fff, -1px 0 0 #fff, 0 -1px 0 #fff,
		1px 1px 2px rgba(255,255,255,0.8), -1px -1px 2px rgba(255,255,255,0.8);
}
.warning { color: red; }
p,
section ul {
	padding-bottom: 0.8em;
}
p strong,
dd strong,
li strong,
td strong {
	color: #000;
	}
article,
section,
aside {
	margin-bottom: 30px;
}
section:after {
	content: "";
	display: block;
	clear: both;
}
section h2 + article {
	margin-top: 20px;
}
article p:last-child,
section p:last-child,
aside p:last-child {
	padding-bottom: 0;
}
dl dt {
	color: #000;
}
dl dd {
	padding-left: 2.0em;
	margin-bottom: 0.6em;
}
dl.dl_press {
	line-height: 1.2em;
}
dl.dl_press dd {
	padding-left: 1em;
	margin-bottom: 0.8em;
}
.table_no_border,
.table_no_border th,
.table_no_border td {
	border: 0;
}
.table_no_border th,
.table_no_border td {
	vertical-align: top;
}
q {
	padding: 0 0.5em;
}
q:before {
	font-family: 'FontAwesome';
	content: "\f10d";
	font-size: 0.5em;
	position: relative;
	top: -1em;
	left: -0.2em;
	}
q:after {
	font-family: 'FontAwesome';
	content: "\f10e";
	font-size: 0.5em;
	position: relative;
	top: -1em;
	right: -0.2em;
	}
h2 + p, h3 + p, h4 + p {
	margin-top: 0.25em;
}
section > h2,
section > h3 {
	color: #063;
	background: linear-gradient(transparent 60%, #ffff66 60%);
	display: inline;
}
section > h2 + p,
section > h3 + p {
	margin-top: 0.4em;
}
.frameGim {
	height: 320px;
	border: solid 1px #ddd;
	overflow-y: scroll;
	padding: 10px 0 0 10px;
	background:url(../img/logo_mark_gray2.png) no-repeat right bottom #fffff0;
	color: black;
	margin-bottom: 30px;
}
.frameGim dl dt {
	font-weight: normal;
}
.btn_img_set {
	position: relative;
	margin-bottom: 80px;
}
.btn_img_set span {
	display: block;
	width: 100%;
	text-align: left;
	padding: 0.7em;
	text-decoration: none;
	font-weight: bold;
	color: #000;
	background-color: #ccf0e1;
	border-radius: 5px;
	transition: .3s;
}
.btn_img_set span:hover {
	color: #c30;
	background-color: #D9F4E9;
}
.btn_img_set img {
	position: absolute;
	top: 1.6em;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
@media (min-width: 768px) {
	.btn_img_set img {
		position: absolute;
		top: 1.6em;
		right: 0;
		transform: translateX(0);
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
	}
}

/* ------------------
------------------ */
body {
	background-color: #B3C7BF;
	color: #f00;
}
.body_contents {
	background-color: #fff;
	color: #000;
	overflow: hidden;
}
.body_contents.body_bg1 {
	background-color: #FFE0E5;
}
.body_contents.body_bg2 {
	background: url(../img/bg_white.png) center center #ccf0e1;
}
.body_contents.body_bg3 {
	background: url(../img/bg_gray.png) center center #fff;
}
.body_contents .frow-container {
	margin-top: 40px;
	padding-bottom: 10px;
}
header + .body_contents .frow-container,
.body_contents .frow-container + .frow-container {
	margin-top: 0;
}
/* --------------
ナビゲーション（フッタ以外）
-------------- */
#nav_main {
}
#nav_main li a {
	display: block;
	padding: .6em .2em;
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: #fffff0;
	color: #21353A;
	border: 1px solid #99B4A9;
	border-width: 1px 1px 1px 0;
}
#nav_main li:first-child a {
	border-left-width: 1px;
}
#nav_main li a:hover {
	background-color: #FFF0EB;
	box-shadow: none;
}
#nav_main li.active a,
#nav_main li.active a:hover {	
	background-color: #FDDAE2;
	
}
/* ------------------
------------------ */
header {
	text-align: center;
	padding: 1.0em 0;		
	background-color: #D9F4E9;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.92, #fff), color-stop(0.00, #ccf0e1));
	background: -webkit-linear-gradient(top, #ccf0e1 0%, #fff 92%);
	background: -moz-linear-gradient(top, #ccf0e1 0%, #fff 92%);
	background: -o-linear-gradient(top, #ccf0e1 0%, #fff 92%);
	background: -ms-linear-gradient(top, #ccf0e1 0%, #fff 92%);
	background: linear-gradient(to bottom, #ccf0e1 0%, #fff 92%);
}
header .frow-container {
	padding-bottom: 20px;
}
#h1_container {
	text-align: center;
	padding-top: 80px;
	background: url(../img/logo_mark.png) no-repeat center top;
	margin-bottom: 20px;
	position: relative;
}
#h1_container .h1_help {
	display: none;
}
@media (min-width:768px) {
	#h1_container {
		text-align: left;
		padding: 0 0 0 90px;
		background: url(../img/logo_mark.png) no-repeat left center;
		min-height: 80px;
	}
	#h1_container .h1_help {
		display: block;
		position: absolute;
		font-size: 1.0em;
		bottom: 0;
		right: 0;
		line-height: 1.8em;
		color: #339;
	}
	#h1_container .h1_help span:last-child {
		font-family: 'M PLUS Rounded 1c', sans-serif;
		font-size: 1.5em;
		text-shadow: 2px 2px 0px #ffc, 2px -2px 0 #ffc, -2px 2px 0 #ffc, -2px -2px 0 #ffc;
	}
}
#h1_container a span:first-child {
	color: #000;
	font-size: 0.6em;
	font-weight: normal;
}
#h1_container a span,
#h1_container a img {
	transition: .3s;
}
#h1_container a:hover span {
	color: #f63;
}
#h1_container a:hover img {
	opacity: 0.65;
}
/* ------------------
------------------ */
footer {
	padding: 30px 0;
	color: black;
	text-align: center;
	border-bottom: 20px solid #ccf0e1;
	background: url(../img/bg_footer.png) no-repeat left bottom;
}
footer .areaQrCode {
	display: none;
}
#nav_footer ul {
	margin-bottom: 20px;
}
#nav_footer li {
	display: inline-block;
	padding: 0 1.0em 0.5em 0;
	text-shadow: 1px 1px .5px #999, -1px 1px .5px #999;
}
#nav_footer li:first-child {
	padding-left: 0;
}
#nav_footer li i {
	display: none;
}
#nav_footer li a {
	display: inline-block;
	width: 100%;
	height: 100%;
	color: #60c;
}
#nav_footer li a:hover,
#nav_footer li.active a,
#nav_footer li.active a:hover {
	text-decoration: none;
	color: #c03;
}
address {
	font-style: normal;
	margin-bottom: 0.6em;
	padding-top: 35px;
	background: url(../img/logo_mark_min.png) no-repeat center top;
}
address a.tel {
	color: #000;
}
.footer_CopyRight {
	padding: 10px 0;
}
@media (min-width: 768px) {
	footer { text-align: left;}
	footer .areaQrCode {
		display: block;
		float: right;
	}
	footer .areaQrCode img {
		border-radius: 6px;
	}
	address {
		padding-top: 0;
		padding-left: 50px;
		background: url(../img/logo_mark_min.png) no-repeat left center;
	}
}
#GoTop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 80px;
	height: 80px;
	line-height: 84px;
	text-align: center;
	border-radius: 40px;
	background-color: rgba(102,102,102,0.5);
	color: #fff;
	transition: .3s;
}
#GoTop:hover {
	background-color: #44aeea;
}
/* --------------
ちいさなボード／<h4>タイトル＋<div>画像＋<p>文章
-------------- */
.tile_board {
	background-color: #fffff0;
	color: #000;
}
.tile_board > * {
	margin: .5em;
}
.tile_board h4 {
	background-color: #fff;
	color: #063;
	font-weight: normal;
	border-width: 2px 0;
	border-color: #063;
	border-style: solid;
	margin: 0;
	padding: .3em 0;
	text-align: center;
}
.tile_board *:last-child {
	padding-bottom: .5em;
}
.tile_board a {
}
/* ------------------
共通
------------------ */
#page_info > img {
	float: right;
	border-radius: 6px;
	width: 360px;
	height: 240px;
}
@media (max-width: 767px) {
	#page_info > img { display: none; }
}
#page_info h1 {
	color: #063;
	font-weight: 400;
	padding: 0.2em 0;
	margin-bottom: 20px;
	border-bottom: 1px solid #063;
}
#page_info h1,
#page_info p {
	font-family:
		Georgia,
		HiraMinProN-W6, HiraMinPro-W6, 'ヒラギノ明朝 Pro W6', 'Hiragino Mincho Pro W6',
		YuMincho,'Yu Mincho','游明朝体', '游明朝', HGS明朝E, 'ＭＳ 明朝',serif;		
}
hr.my_hr {
	display: block;
	width: 100%;
	height: 1px;
	background-color: #85D4E8;
	border: 0;
	margin-bottom: 30px;
}
.cover_title {
	position: relative;
}
.cover_title h2 {
	position:absolute;
	top: calc(0.5em - 40px);
	right: 0;
	height: 0.92em;
	line-height: 0.92em;
	overflow: hidden;
	text-align: right;
	letter-spacing: -.1em;
	color: #408C66;
	padding-right: .1em;
}
/* ------------------
円形ガイド
------------------ */
.circle_note {
	text-align: center;
	position: relative;
}
.circle_note h3 {
	position: relative;
	top: .7em;
	transition: .3s;
	background: linear-gradient(white 60%, #ffff66 60%);	/* 下の円形図柄を文字部分で透過させない為 */
}
.circle_tips {
	padding: .2em 0;
	background-color: rgba(255,255,255,0.6);
	border: 2px solid #063;
	border-width: 2px 0;
	position: relative;
	bottom: 1.8em;
	display: inline-block;
	color: #063;
	font-weight: bold;
	text-shadow:
		1px 0 0 #fff, 0 1px 0 #fff, -1px 0 0 #fff, 0 -1px 0 #fff,
		1px 1px 2px rgba(255,255,255,0.8), -1px -1px 2px rgba(255,255,255,0.8);
	transition: .3s;
}
a:hover .circle_note h3,
a:hover .circle_tips {
	color: #f63;
	border-color: #f63;
}
.circle_note h3 + div {
	width: 60%;
	margin: 0 auto;
}
@media (min-width: 768px) {
	a .circle_note h3 + div { width: 75%;}
}
.circle_note .dynamic_bg {
	background: url(../img/dummy.jpg) no-repeat center center;
	background-size: cover;
	border-radius: 50%;
    padding: 50%;
}
a:hover .circle_note .dynamic_bg {
	background-size: 155%;
}
/* ------------------
------------------ */
.table_my2column {
	background-color: white;
	color: #666;
	table-layout: fixed;
}
.table_my2column th {
	font-weight: normal;
	color: #000;
	vertical-align: top;
	border-bottom: none;
	width: 25%;
}
.section_border {
	border-style: solid;
	border-width: 1px 0;
	border-color: #F6BCA8;
	padding: 0.4em 0 0.8em 0;
	background-color: rgba(255,255,255,0.6);
}
.section_border p {
	margin-left: 1em;
	margin-right: 0.6em;
	color: black;
}
/* ------------------
------------------ */
.big_button {
	width: 100%;
	padding: 0.8em 0;
	background-color: #69c;
	color: white;
	border: none;
	border-radius: 6px;
}
.big_button:hover {
	background-color: #7ad;
	color: #ff6;
}
.article_information p {
	margin-left: 1.8em;
	padding-bottom: 0.3em;
}
.article_information p:before {
	font-family: 'FontAwesome';
	content: "\f046";
	position: relative;
	padding-right: 0.5em;
}
.article_information .a_inf_name::before {
	content: "\A";
	white-space: pre;
}
@media (min-width:768px) {
	.article_information .a_inf_name {
		margin-left: 1.0em;
	}
	.article_information .a_inf_name::before {
		content: none;
	}
}

/* ------------------
for LightBox／画像左下のキャプション
------------------ */
.lb-data .lb-caption {
	font-size: inherit;
	line-height: inherit;
	font-weight: normal;
	color: white;
}
/* ------------------
開閉記事
------------------ */
.dsp_onof {
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 10px;
	margin-bottom: 40px;
}
.dsp_onof_control {
	cursor: pointer;
	color: #33f;
	transition: .3s;
	position: relative;
}
.dsp_onof_control::after {
	position: absolute;
	top: 0;
	right: 0.1em;
	font-family: 'FontAwesome';
	content: "\f196";
}
.dsp_onof_control.is_open::after {
	position: absolute;
	top: 0;
	right: 0.1em;
	font-family: 'FontAwesome';
	content: "\f147";
}
.dsp_onof_control:hover {
	color: #f63;
}
.dsp_onof_body, .dsp_onof_body2 {
	display: none;
	margin-top: 20px;
}
.dsp_onof_body dd:after, .dsp_onof_body dd:after {
	content: "";
	display: block;
	clear: both;
}
/* ------------------
トップページの四角枠
------------------ */
.sptag_cld {
	line-height: 1.4em;
	text-align: center;
	border: 1px solid #063;
	/*
	border-radius: .5em;
	*/
	color: #063;
	padding: .3em;
	font-weight: bold;
}
.sptag_cld + .sptag_cld {
	margin: .5em 0;
}
/* ------------------
記事内の補助画像（300☓200）
------------------ */
.pic_subpic {
	float: right;
	margin-left: 10px;
	width: 180px;
	height: 120px;
}
@media (min-width:768px) {
	.pic_subpic {
		width: 240px;
		height: 180px;
	}
}

/* ------------------
トップページ専用装飾
------------------ */
#dl_magnews {
	line-height: 1.2em;
}
#dl_magnews dd {
	padding-left: 1em;
	margin-bottom: 0.8em;
}
/* ----------- */
#h1_container {
	position: relative;
}
#nav_recruit {
	position: absolute;
	top: 8px;
	right: 4px;
	width: 8em;
	height: 2.6em;
	border: 3px solid red;
	border-radius: 10px;
	transform: rotate(10deg);
	text-align: center;
	display: block;
	line-height: 1.1em;
	padding: 0.1em 0 0.1em 0;
	background-color: rgba(255, 255, 255, 0.5);
}
#nav_recruit a {
	color: red;
	font-weight: bold;
}
#nav_recruit:hover {
	border-color: pink;
}
#nav_recruit a:hover{
	color: pink;
}