/*

template project
@jun akagi ＆　ai hatakeyama

*/

/*-------------------------------------------------------

base

baseではサイト内の基本的な設定を行う
現バージョンでは以下を追加している
・cssリセット
・フォントリセットとマスターの設定
・PC専用/モバイル専用クラス
・Googleマップレスポンシブ化
・flex（safariとiPhoneではキャンセル）、その他flex関連の補助クラス

-------------------------------------------------------*/

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, font, img, ins, kbd, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, button {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	font-weight: normal;
	font-family: "メイリオ", "MS Pゴシック", Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	font-weight: normal;
	font-style: normal;
}
body {
	line-height: 1;
	border-top: 6px solid #004ca5;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
:focus {
	outline: 0;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 100%;
}
select, input, textarea {
	font: 100% "MS Pゴシック", Arial, sans-serif;
}
table {
	font-size: inherit;
	font: 100%;
}
sup {
	vertical-align: super;
	font-size: 50%;
	line-height: 1;
}
.dib {
	display: inline-block;
}
/*PC専用/モバイル専用クラス*/
/*ブロック要素にしか対応していないので注意*/
.onlypc {
	display: block;
}
.onlymobile {
	display: none;
}

@media only screen and (max-width: 959px) {
.onlypc {
	display: none;
}
.onlymobile {
	display: block;
}
span.onlymobile {
	display: inline;
}
}
/*Googleマップレスポンシブ化*/
/*div要素、section要素等のブロック要素に.ggmapを付与し、内部にGoogleマップから吐き出された埋め込み用要素を貼り付ける
このときiframe要素に入っているwidth属性やhight属性は無視される*/
.ggmap, .youtube {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	margin-bottom: 30px;
}
.ggmap iframe, .ggmapr object, .ggmap embed, .youtube iframe, .youtuber object, .youtube embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/*flex*/
/*flexを使用したいボックスにflexクラスを付与すると直下の子要素が横並びになる
flex非対応ブラウザおよびsafariではキャンセルされるようにする*/
.flex {
	display: -webkit-box;
	display: -moz-box;
	display: box;
	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: -webkit-flexbox;
	display: flex;
}
/*.no-flexbox .flex,*/
.no-flexbox .flex, .ua-safari .flex {
	display: block;
	overflow: hidden;
}
.no-flexbox .flex>*, .ua-safari .flex>* {
	float: left;
}
.jcsb {
	justify-content: -webkit-space-between;
	justify-content: -moz-space-between;
	justify-content: space-between;
}
.jcar {
	justify-content: -webkit-space-around;
	justify-content: -moz-space-around;
	justify-content: space-around;
}
.aic {
	align-items: center;
}
.acsb {
	align-content: -webkit-space-between;
	align-content: -moz-space-between;
	align-content: space-between;
}
.fdcu {
	-webkit-flex-direction: column;
	flex-direction: column;
}
.fdrr {
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.flwp {
	flex-wrap: wrap;
}
.displaynone {
	display: none;
}
/*@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);
.min,
table.min th,table.min td {
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}*/


/*-------------------------------------------------------

design

基本的なレイアウト、各種パーツの振る舞い、スタンダートな文章デザインをここで設定する
css作成作業の大部分がこのゾーンでの作業になる

-------------------------------------------------------*/

/*#wrap*/
.fixwidth {
	/*max-width: 960px;*/
	max-width: 95%;
	margin: 0 auto;
	padding: 0 10px;
	min-width: 320px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

@media only screen and (max-width: 979px) {
/*#wrap*/
.fixwidth {
	width: 100%;
	padding: 0 0px;
}
}

@media only screen and (max-width: 550px) {
/*#wrap*/
.fixwidth {
	padding: 0 10px;
}
}
#header {
	overflow: hidden;
	margin-bottom: 15px;
}
#header article {
	float: left;
	margin-bottom: 10px;
}
#header article p {
	padding-top: 15px;
	padding-left: 15px;
}
#header #logo {
	padding: 6px 0 0 16px;
}
#header #logo a {
	display: block;
}
#header #logo img {
	vertical-align: bottom;
}
#header aside {
	float: right;
	padding: 5px 7px 0 0;
	margin-bottom: 10px;
}
#header aside p {
/*			float: right;*/
}
#header aside .tel {
	/*			float: left;*/
	clear: both;
	text-align: right;
	margin-bottom: 5px;
}
#header aside img {
	margin-top: 7px;
	vertical-align: bottom;
}
#header .btn {
	display: block;
	height: 26px;
	line-height: 26px;
	border-radius: 5px;
	color: #004ca5;
	text-decoration: none;
	font-size: 100%;
	border: 1px solid #004ca5;
	padding: 0 13px;
	margin-bottom: 0;
	float: right;
}
#header a:hover.btn {
	background: #e7f1f8;
}
#header .btn .fa {
	margin-right: 0.5em;
	font-size: 120%;
}

/*@media only screen and (max-width:1819px) {
#header {
	padding: 0 10%;
}
}

@media only screen and (max-width:1119px) {
#header {
	padding: 0 30px;
}
}
*/
@media only screen and (max-width: 979px) {
#header {
	padding: 0;
	background: none;
	margin-bottom: 3px;
}
#header article {
}
#header article p {
	padding-top: 5px;
	padding-left: 15px;
}
#header #logo {
	padding: 3px 0 0 15px;
}
#header #logo a {
}
#header #logo img {
	width: 227px;
}
#header aside {
	display: none;
}
#header aside p {
}
#header aside img {
}
#header .btn {
}
#header .btn .fa {
}
}

@media only screen and (max-width: 767px) {
#header {
}
/*#header article {
	margin-bottom: 5px;
}*/
#header article p {
	font-size: 85%;
}
#header #logo {
	padding: 5px 0 5px 15px;
}
#header #logo a {
}
#header #logo img {
}
}

@media only screen and (max-width: 467px) {
}
#header #gNavopener {
	display: none;
	position: absolute;
	top: 42px;
	right: 18px;
	width: 36px;
	height: 4px;
	background: rgb(123, 123, 123);
	cursor: pointer;
	transition: all 0.2s;
	border-radius: 0;
	border: #7f7f7f 0 solid;
}
#header #gNavopener:after {
	display: block;
	content: "menu";
	position: absolute;
	top: 18px;
	right: 0;
	width: 35px;
	text-align: center;
	font-size: 94%;
	line-height: 1;
	transition: all 0.2s;
	overflow: hidden;
}
#header #gNavopener span {
	display: block;
	position: relative;
	top: -9px;
	width: 100%;
	height: 38px;
	transition: all 0.2s;
}
#header #gNavopener span:before, #header #gNavopener span:after {
	display: block;
	content: "";
	position: absolute;
	right: 50%;
	-webkit-transform: translateX(50%);
	transform: translateX(50%);
	width: 36px;
	height: 4px;
	background: #7b7b7b;
	transition: all 0.2s;
}
#header #gNavopener span:before {
	top: 0px;
}
#header #gNavopener span:after {
	top: 18px;
}
#header #gNavopener.active {
	top: 26px;
	width: 30px;
	height: 30px;
	background: rgba(123, 123, 123, 0);
	border-width: 3px;
	border-radius: 18px;
}
#header #gNavopener.active:after {
	height: 0;
}
#header #gNavopener.active span {
	top: -4px;
}
#header #gNavopener.active span:before, #header #gNavopener.active span:after {
	top: 50%;
	width: 25px;
}
#header #gNavopener.active span:before {
	-webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
	transform: translateX(50%) translateY(-50%) rotate(45deg);
}
#header #gNavopener.active span:after {
	-webkit-transform: translateX(50%) translateY(-50%) rotate(-45deg);
	transform: translateX(50%) translateY(-50%) rotate(-45deg);
}
#header #gNav {
	clear: both;
}
#header ul {
	display: table;
	width: 100%;
}
#header li {
	display: table-cell;
	border-left: #fff 1px solid;
	width: 170px;
	padding: 0 10px;
	background: rgb(204,204,204); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#cccccc', GradientType=0 ); /* IE6-9 */
}
#header li:first-child {
	border-left: #ccc 1px solid;
}
#header li:last-child {
	border-right: #ccc 1px solid;
}
#header li a {
	display: block;
	text-align: center;
	height: 45px;
	line-height: 45px;
	text-decoration: none;
	color: #000;
	font-size: 110%;
	position: relative;
	transition: all 0.2s;
}
#header li a.current, #header li a:hover {
	color: #004ca5;
}
#header li a:before, #header li a:after {
	position: absolute;
	bottom: 0;
	content: "";
	display: block;
	width: 100%;
	height: 0;
	background: #004ca5;
	transition: all 0.2s;
}
#header li a.current:before, #header li a.current:after, #header li a:hover:before, #header li a:hover:after {
	height: 5px;
}

@media only screen and (max-width: 979px) {
#header #gNavopener {
	display: block;
}
#header #gNav {
	position: absolute;
	display: none;
	top: 89px;
	left: 0;
	right: 0;
	z-index: 1000;
	background: #fff;
}
#header ul {
	display: block;
	width: 100%;
	border-top: #ccc 1px solid;
	background: #004ca5;
}
#header li {
	width: 100%;
	display: block;
	border-left: none;
	border-bottom: #fff 1px solid;
}
#header li:last-child {
	border-right: none;
}
#header li a {
	text-align: left;
	padding: 0 15px;
}
#header li a:hover {
	color: #004ca5;
}
#header li a:before, #header li a:after {
	color: #004ca5;
	background: none;
}
#header li a.current, #header li a:hover {
	color: #004ca5;
}
#header li a.current:before, #header li a.current:after {
	right: 0;
	-webkit-transform: none;
	transform: none;
	width: 100%;
	height: 2px;
}
#header li a.current:before {
	top: 0;
}
#header li a.current:after {
	top: auto;
	bottom: 0;
}
}

@media only screen and (max-width: 767px) {
#header #gNavopener {
	top: 34px;
	right: 19px;
	width: 34px;
	background: rgb(123, 123, 123);
}
#header #gNavopener:after {
}
#header #gNavopener span {
}
#header #gNavopener span:before, #header #gNavopener span:after {
	width: 34px;
}
#header #gNavopener span:before {
}
#header #gNavopener span:after {
}
#header #gNavopener.active {
}
#header #gNavopener.active:after {
}
#header #gNavopener.active span {
}
#header #gNavopener.active span:before, #header #gNavopener.active span:after {
}
#header #gNavopener.active span:before {
}
#header #gNavopener.active span:after {
}
}
#mainVisual {
	width: 100%;
	margin: 0 auto 20px auto;
	min-width: 320px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#mainVisual img {
	width: 100%;
	vertical-align: bottom;
}
#mainVisual img.pc {
	display: block;
}
#mainVisual img.mobile {
	display: none;
}

@media only screen and (max-width: 550px) {
#mainVisual img.pc {
	display: none;
}
#mainVisual img.mobile {
	display: block;
}
}
#pageTitle {
}
#pageTitle .fixwidth {
	max-width: 93.5%;
	height: 140px;
	line-height: 140px;
	font-size: 270%;
	color: #000;
	padding-left: 50px;
	position: relative;
	background: #a9cdff url(../../img/pagetitle_bk.jpg) right 0 no-repeat;
	border-bottom: 1px solid #ccc;
	border-radius: 10px;
}

@media only screen and (max-width: 979px) {
#pageTitle {
	-webkit-background-size: cover;
	background-size: cover;
}
#pageTitle .fixwidth {
	height: 100px;
	line-height: 100px;
	padding: 0 10px 0 30px;
	font-size: 220%;
}
}

@media only screen and (max-width: 767px) {
#pageTitle .fixwidth {
	padding: 0 10px 0 20px;
	font-size: 180%;
	background: #a9cdff url(../../img/pagetitle_bk.jpg) center 0 no-repeat;
}
}

@media only screen and (max-width: 600px) {
#pageTitle {
}
#pageTitle .fixwidth {
	max-width: 100%;
	height: 80px;
	line-height: 1.4;
	padding: 20px 10px 0 15px;
	border-radius: 0;
}
}
#main {
	padding: 40px 50px 21px;
}
#top #main {
	padding: 0;
	background: none;
	border: none;
}
#top #main p {
	font-size: 120%;
	line-height: 1.8;
}

@media only screen and (max-width: 979px) {
#main {
	padding: 30px 30px 4px;
}
#top #main {
	padding: 0;
}
}

@media only screen and (max-width: 767px) {
#main {
	padding: 30px 20px 4px;
}
}

@media only screen and (max-width: 399px) {
#main {
	padding: 18px 10px 4px;
	border: none;
}
#top #main img {
	width: 80%;
	height: auto;
}
}
/*トップページ　ティーザー*/
#topnav {
	margin-bottom: 25px;
}
#topnav .columnitem {
	width: 46%;
	width: calc(50% + 3px);
	height: 270px;
	position: relative;
	margin: 0 0 10px 0;
	padding: 15px 0 10px 0;
	border-radius: 10px;
}
#topnav .columnitem+.columnitem {
	width: 46%;
	width: calc(48% + 3px);
}
#topnav .topnav_guardrail {
	background: url(../../img/top/topnav_guardrail.jpg) center center no-repeat;
	background-size: cover;
}
#topnav .topnav_wall {
	background: url(../../img/top/topnav_wall.jpg) center center no-repeat;
	background-size: cover;
}
#topnav .columnSubitem {
	width: 31%;
	width: calc(32% + 3px);
	height: 180px;
	position: relative;
	margin: 0 0 10px 0;
	padding: 15px 0 10px 0;
	border-radius: 10px;
}
_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem {
 margin: 0 10px 10px 0;
}
#topnav .columnSubitem+.columnSubitem {
	width: 31%;
	width: calc(32% + 3px);
}
#topnav .topnav_tunnel {
	background: url(../../img/top/topnav_tunnel.jpg) center center no-repeat;
	background-size: cover;
}
#topnav .topnav_sound {
	background: url(../../img/top/topnav_sound.jpg) center center no-repeat;
	background-size: cover;
}
#topnav .topnav_safety {
	background: url(../../img/top/topnav_safety.jpg) bottom center no-repeat;
	background-size: cover;
}
#topnav h3 {
	border: none;
	padding: 4px 3px 2px 10px;
	text-align: left;
	font-size: 150% !important;
	font-weight: bold;
	line-height: 1.3;
	color: #004ca5;
	margin-bottom: 5px;
	/*text-shadow: 2px 2px 20px #fff,  -2px 2px 20px #fff,  2px -2px 20px #fff,  -2px -2px 20px #fff;*/
	background-color: rgba(255,255,255,0.8);
}
#topnav p {
	line-height: 1.7;
	margin-bottom: 2px;
}
#topnav .flex .columnitem .more, #topnav .flex .columnSubitem .more {
	display: none;
}

@media only screen and (max-width: 1060px) {
 _::-webkit-full-page-media, _:future, :root #topnav .columnSubitem {
 width: 30%;
 width: calc(30% - 3px);
}
_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem+.columnSubitem {
 width: 30%;
 width: calc(30% + 3px);
}
}

@media only screen and (max-width: 979px) {
#topnav {
	margin-bottom: 10px;
}
#topnav .columnitem {
	width: 46%;
	width: calc(49% - 2px);
}
#topnav .columnitem+.columnitem {
	width: 46%;
	width: calc(49% + 2px);
}
#topnav .columnSubitem {
	width: 31%;
	width: calc(32% - 3px);
}
#topnav .columnSubitem+.columnSubitem {
	width: 31%;
	width: calc(32% + 3px);
}
/*_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem {
	width: 28%;
	width: calc(30% - 3px);
}
_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem+.columnSubitem {
	width: 28%;
	width: calc(30% + 3px);
}*/


#topnav h3 {
	margin-bottom: 4px;
}
#topnav p {
	line-height: 1.6;
}
}

@media only screen and (max-width:550px) {
#topnav {
	margin-bottom: 20px;
}
#topnav .flex {
	display: block;
}
#topnav h3 {
	font-size: 140% !important;
}
#topnav .columnitem {
	width: 100%;
	height: 110px;
	margin-bottom: 5px;
	overflow: hidden;
	border-radius: 5px;
}
#topnav .columnitem+.columnitem {
	width: 100%;
	height: 110px;
}
#topnav .columnSubitem {
	width: 100%;
	height: 60px;
	margin-bottom: 5px;
	overflow: hidden;
	border-radius: 5px;
}
#topnav .columnSubitem+.columnSubitem {
	width: 100%;
	height: 60px;
}
_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem {
 width: 100%;
 margin: 0 0 10px 0;
}
_::-webkit-full-page-media, _:future, :root #topnav .columnSubitem+.columnSubitem {
 width: 100%;
}
}
/*お知らせ・新着情報と住所*/
/*背景*/
#topInfo {
	padding: 30px 0;
	background-color: #e3e3e3;
	overflow: auto;
}

@media only screen and (max-width: 499px) {
#topInfo {
	font-size: 85%;
	padding: 30px 0 20px 0;
}
}
#topInfo .bnr {
	width: 100%;
	margin-bottom: 10px;
}
#topInfo .bnr img {
	width: 100%;
	height: auto;
}
@media only screen and (max-width: 779px) {
#topInfo .bnr img {
	width: 50%;
	height: auto;
}
}
@media only screen and (max-width: 499px) {
#topInfo .bnr img {
	width: 100% !important;
	height: auto;
}
}
/*お知らせ・新着情報*/
#topInfo article {
	float: left;
	width: 65%;
	width: calc(65% - 8px);
	margin-bottom: 5x;
}
#topInfo article .columnitem {
	width: 100%;
	background: #fff;
	border-radius: 8px;
}
#topInfo article .columnitem h2 {
	color: #004ca5;
	font-size: 140%;
	line-height: 1;
	font-weight: bold;
	border-bottom: #004ca5 solid 3px;
	border-radius: 8px 8px 0 0;
	background: rgb(204,204,204); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(204,204,204,1) 0%, rgba(238,238,238,1) 50%, rgba(204,204,204,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#cccccc', GradientType=0 ); /* IE6-9 */
	padding: 15px 10px 10px 10px;
}
#topInfo article .columnitem dl {
	overflow: hidden;
	padding: 15px;
}
#topInfo article .columnitem dt, #topInfo article .columnitem dd, #topInfo article .columnitem dd a {
	font-size: inherit;
}
#topInfo article .columnitem dt, #topInfo article .columnitem dd {
	font-size: 110%;
	margin-bottom: 10px;
	padding-bottom: 10px;
}
#topInfo article .columnitem dt {
	float: left;
	width: 135px;
	color: #666;
}
#topInfo article .columnitem dd {
	border-bottom: #ccc dotted 1px;
}
#topInfo article .columnitem dd a {
	text-decoration: none;
}
#topInfo article .columnitem dd a:hover {
	text-decoration: underline;
}

@media only screen and (max-width: 779px) {
#topInfo article {
	float: none;
	width: 100%;
	width: calc(100% - 8px);
	margin-bottom: 5px;
}
}

@media only screen and (max-width:669px) {
#topInfo article .columnitem dt {
	float: none;
}
#topInfo article .columnitem dt {
	margin-bottom: 2px;
	padding-bottom: 2px;
}
#topInfo article .columnitem dt, #topInfo article .columnitem dd {
	font-size: 90%;
	margin-bottom: 5px;
	padding-bottom: 5px;
}
}

@media only screen and (max-width: 550px) {
#topInfo article {
	margin-bottom: 5px;
}
#topInfo article .columnitem {
	width: 100%;
	width: calc(100% - 0px);
}
}
/*住所*/
#topInfo aside {
	float: right;
	width: 33%;
	width: calc(33% - 8px);
	padding: 5px 7px 0 0;
	margin-bottom: 5px;
	margin-left: 20px;
	display: inline-block;
}
#topInfo aside .address {
	color: #004ca5;
	text-align: center;
	padding: 15px;
	border-radius: 8px;
	background: #c8e3fc;
}
#topInfo aside .address h2 {
	font-size: 150%;
	font-weight: bold;
}
#topInfo aside .address p {
	font-size: 95%;
	line-height: 1.4 !important;
	margin-bottom: 8px;
}
#topInfo aside .address .map a {
	display: inline-block;
	font-size: 110%;
	font-weight: bold;
	color: #004ca5;
	text-decoration: none;
	height: 28px;
	line-height: 28px;
	padding: 2px 20px 0 20px;
	border-radius: 5px;
	background: #fff;
}
#topInfo aside .address .map a:hover {
	background: #4cccff;
}

@media only screen and (max-width: 929px) {
#topInfo aside .address h2 {
	font-size: 120%;
	font-weight: bold;
}
#topInfo aside .address p {
	font-size: 100% !important;
}
}
@media only screen and (max-width: 779px) {
#topInfo aside {
	float: none;
	width: 100%;
	width: calc(100% - 8px);
	padding: 15px 0;
	margin-left: 0;
}

}
#footer {
	background: #ccc;
	text-align: center;
}
#footer .fixwidth {
	padding: 22px 0;
}
#footer section {
}
#footer h2 {
	font-size: 200%;
}
#footer img {
	vertical-align: bottom;
}
#footer p {
	font-size: 110%;
	margin-bottom: 1px;
}
#footer h3 {
	font-size: 110%;
}
#footer #fNav {
	text-align: center;
}
#footer #fNav ul {
	text-align: center;
	word-spacing: -5px;
}
#footer #fNav ul li {
	display: inline-block;
	border-left: 1px solid #999;
	padding: 0px 2em 0px;
}
#footer #fNav ul li:first-child {
	border-left: none;
}
#footer #fNav ul li a {
	color: #000;
	position: relative;
	text-decoration: none;
	top: 1px;
}
#footer #fNav ul li a:hover {
	color: #666;
}

@media only screen and (max-width: 979px) {
#footer {
}
#footer .fixwidth {
	padding: 15px 0 30px;
	display: block;
}
#footer section {
	text-align: center;
	margin-bottom: 39px;
	float: none;
}
#footer h2 {
}
#footer img {
}
#footer p {
	margin-bottom: 0;
}
#footer h3 {
}
}

@media only screen and (max-width: 767px) {
#footer {
}
#footer .fixwidth {
	padding: 15px 20px 25px;
	display: block;
}
#footer section {
	margin-bottom: 26px;
}
#footer h2 {
}
#footer img {
}
#footer p {
}
#footer h3 {
}
#footer #fNav {
}
#footer #fNav ul {
	padding: 0 0;
	border-top: #fff 1px dotted;
}
#footer #fNav ul li {
	padding: 0;
	border-left: none;
}
#footer #fNav li {
	width: 100%;
	float: none;
	margin-bottom: 0;
	border-bottom: 1px solid #fff;
}
#footer #fNav li a {
	height: 35px;
	line-height: 35px;
	text-align: center;
	font-size: 115%;
}
}
/*.unitは内部に文章が入る際に使用する

例
#main>section#pagetitle+section.unit 上からページタイトル部分、文章エリアと繋がるタイプ
#main>section#pagetitle+section.flex>article.unit>aside.unit ページタイトル以下が左右に分割されるタイプ asideが画像のみの場合はfigure>figcaptionでも可
*/

/*.unitが連続する場合にお互いのスペースを開ける
section.unit*2>h3.headline+p のような構造の時、わざわざp:last-childを指定してmargin-bottomなどを設定しなくても良くなる*/
.unit {
	overflow: hidden;
	margin: 0 0 18px;
}
.unit+.unit {
	margin-top: 30px;
}

@media only screen and (max-width: 550px) {
.unit+.unit {
	margin-top: 25px;
}
}
.columnitem.unit+.columnitem.unit {
	margin-top: 0;
}
#main .unit article {
	width: 55%;
	width: calc(60% - 20px);
	margin: 0;
	padding: 0;
}
#main .unit aside {
	width: 35%;
	width: calc(40% - 20px);
	margin: 0;
	padding: 0;
}
#main .unit article {
	float: left;
}
#main .unit aside {
	float: right;
}

@media only screen and (max-width: 979px) {
/*#main .unit aside,
	#main .unit article {
		width: calc(50% - 10px);
	}*/
	

}

@media only screen and (max-width: 767px) {
/*#main .unit aside,
	#main .unit article {
		width: calc(50% - 5px);
	}*/
}

@media only screen and (max-width: 639px) {
#main .unit aside, #main .unit article {
	width: 100%;
	float: none;
}
}
.unit h2, .unit h3, .unit h4, .unit h5, .unit p, .unit ul, .unit ol, .unit table, .unit dl, .unit figure, .unit .ggmap {
	margin: 0 0 9px;
	color: #000;
}
.unit h4, .unit h5, .unit p, .unit ul, .unit ol, .unit dl, .unit .ggmap {
	margin: 0 0 18px;
}
.unit h2 + .headline, .unit h3 + .headline, .unit h4 + .headline, .unit h5 + .headline, .unit p + .headline, .unit ul + .headline, .unit ol + .headline, .unit table + .headline, .unit dl + .headline, .unit .ggmap + .headline {
	margin-top: 18px;
}
.unit ul, .unit ol {
	margin-bottom: 9px;
}
.unit li {
	margin-bottom: 4.5px;
}
.unit li:last-child {
	margin-bottom: 0;
}
.unit ul.normal {
	padding-left: 2.5em;
}
.unit ul.normal li {
	list-style-type: disc;
}
.unit ol.normal {
	padding-left: 2em;
}
.unit ol.normal li {
	list-style-type: decimal;
}
.unit ol.normal ol {
	counter-reset: olol;
	margin: 0;
}
.unit ol.normal ol li {
	list-style-type: none;
	position: relative;
	padding-left: 2em;
}
.unit ol.normal ol li:first-child {
	padding-top: 4.5px;
}
.unit ol.normal ol li:before {
	content: counter(olol, upper-alpha)"）";
	counter-increment: olol;
	position: absolute;
	left: 0;
}
.unit input, .unit textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	vertical-align: top;
}
.unit table {
	width: 100%;
	margin: 0 0 18px;
	border-top: #ccc 1px solid;
	border-left: #ccc 1px solid;
}
.unit table th, .unit table td {
	border-bottom: #ccc 1px solid;
	border-right: #ccc 1px solid;
	padding: 5px;
}
.unit table thead th {
	font-weight: bold;
	text-align: center;
	background: #eee;
	width: auto;
}
.unit table tbody th {
	background: #e7f1f8;
	width: 20%;
	text-align: left;
	vertical-align: top;
}
.unit table.thlock tbody th {
	white-space: nowrap;
}
/*.unit table tbody .total th {
	background: #ebd0d0;
}
.unit table tbody .total td {
	background: #fadede;
}*/
.unit table tbody td ol {
	margin-bottom: 0;
}
.unit table.week tbody th, .unit table.week tbody td {
	width: 14%;
	text-align: center;
}
.bg_blue {
	background: #E4F7FF;
}
.bg_sla {
	background: url(../img/sla_gray.gif);
}
.bg_green {
	background: #ecf9d6;
}
.bg_lightgreen_center {
	background: #f7ffe5;
	text-align: center;
	white-space: nowrap;
}
.unit figure {
	margin: 0;
}
.unit figure+figure {
	margin-top: 18px;
}
.unit figure.columnitem+figure.columnitem {
	margin-top: 0;
}
.unit figure img {
	width: auto;
	max-width: 100%;
	vertical-align: bottom;
}
.unit .w-70-100 {
	width: 70%;
	height: auto;
}
@media only screen and (max-width: 767px) {
	.unit .w-70-100 {
		width: 100%;
	}
}
.unit .w-50-100 {
	width: 50%;
	height: auto;
}
@media only screen and (max-width: 767px) {
	.unit .w-50-100 {
		width: 100%;
	}
}
.unit .w-30-100 {
	width: 30%;
	height: auto;
}
@media only screen and (max-width: 1000px) {
	.unit .w-30-100 {
		width: 50%;
	}
}
@media only screen and (max-width: 667px) {
	.unit .w-30-100 {
		width: 100%;
	}
}

.unit .w-url {
	width: 370px;
	height: auto;
}

.unit figcaption {
	text-align: center;
	line-height: 1.5;
	font-size: 115%;
}

@media only screen and (max-width: 767px) {
.unit table {
	font-size: 94%;
	width: 100%;
}
.unit table.short {
	width: auto;
}
}
.unit table.contactnumber td {
	font-size: 150%;
}
/*.unit h3.headline {
	font-size: 190%;
	font-weight: normal;
	position: relative;
	padding-bottom: 0.3em;
	border-bottom: 4px solid #ccc;
	margin-bottom: 25px;
}
.unit h3.headline::after {
	position: absolute;
	bottom: -4px;
	left: 0;
	z-index: 2;
	content: '';
	width: 20%;
	height: 4px;
	background-color: #004ca5;
}*/
.unit h3.headline {
	font-size: 180%;
	background: linear-gradient(transparent 65%, #c3dcff 65%);
	margin-bottom: 25px;
}
#top .unit h3 {
	font-size: 180%;
	color: #004ca5;
	border: none;
	border-radius: 0;
	background: none;
	font-weight: normal;
	padding: 0;
	line-height: 35px;
	margin-bottom: 10px;
}
.unit h4 {
	color: #004ca5;
	font-size: 150%;
	font-weight: normal;
	/*	border-left: 3px solid #004ca5;
	border-bottom: 1px solid #004ca5;
	padding-left: 8px;*/
	margin-bottom: 9px;
}
.unit h5 {
	color: #000;
	font-size: 135%;
	font-weight: normal;
	margin-bottom: 5px;
}

@media only screen and (max-width: 767px) {
.unit h3 {
	padding: 4px 3px 1px 10px;
}
}

@media only screen and (max-width: 550px) {
.unit h3 {
	font-size: 130%;
	line-height: 1.5;
	text-align: left;
}
.unit h3.headline {
	font-size: 140%;
}
.unit h4 {
	font-size: 115%;
}
}
.unit figure {
	margin: 0 0 9px;
	text-align: center;
}
.unit img {
	vertical-align: bottom;
	max-width: 100%;
}
.paragraphBtm {
	margin-bottom: 35px !important;
}
.unit .bg {
	background: #FFF3E3;
	border-radius: 20px;
	padding: 20px 40px;
	margin-bottom: 18px;
}
.unit .bg p {
	line-height: 1.8;
}
.unit .bg li {
}
.unit .bg:last-child {
	margin-bottom: 0;
}
.unit .bg:nth-child(2n+1) {
	background: #FFEEFF;
}

@media only screen and (max-width: 359px) {
.unit .bg {
	border-radius: 10px;
	padding: 15px 25px;
}
}
.unit .tel {
	font-size: 180%;
}

@media only screen and (max-width: 550px) {
.unit .tel {
	font-size: 120%;
}
}
.unit .btn {
	background: #004ca5;
	color: #fff;
	font-size: 150%;
	font-weight: bold;
	text-decoration: none;
	line-height: 2;
	display: block;
	width: 100%;
	max-width: 410px;
	margin: 0 auto;
	text-align: center;
	border-radius: 5px;
	transition: all 0.2s;
}
.unit .btn:hover {
	opacity: 0.6;
}
.backNav {
	position: absolute;
	left: 50px;
	bottom: 15px;
}
.backNav .btn {
	background: #004ca5;
	color: #fff;
	font-size: 110%;
	font-weight: bold;
	text-decoration: none;
	line-height: 2;
	display: block;
	padding: 0 15px 0 25px;
	max-width: 410px;
	margin: 0 auto;
	text-align: center;
	border-radius: 5px;
	position: relative;
}
.backNav .btn:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	-webkit-transform: translateY(-50%) scaleX(1);
	transform: translateY(-50%) scaleX(1);
	border: transparent 5px solid;
	border-right-width: 0;
	border-left-color: #fff;
	border-right-color: #fff;
	border-left-width: 10px;
	transition: all 0.2s;
}
.backNav .btn:hover:before {
	-webkit-transform: translateY(-50%) scaleX(-1);
	transform: translateY(-50%) scaleX(-1);
}

@media only screen and (max-width: 979px) {
.backNav {
	position: absolute;
	left: 30px;
	bottom: 5px;
}
.backNav .btn {
}
.backNav .btn:before {
}
.backNav .btn:hover:before {
}
}

@media only screen and (max-width: 767px) {
.backNav {
	left: 20px;
	bottom: 3px;
}
.backNav .btn {
	font-size: 100%;
	line-height: 1.8;
}
.backNav .btn:before {
}
.backNav .btn:hover:before {
}
}
dl.tablestyle {
}
dl.tablestyle dt {
	float: left;
	clear: both;
	margin-bottom: 4px;
}
dl.tablestyle dd {
	margin-left: 100px;
	margin-bottom: 4px;
}
/*カラムスタイルを実現させる
基本的にはflexと併用
この辺りjsに置き換えちゃったのでだいぶ簡略化
*/

.column {
}
.columnitem {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 18px;
}
.columnSubitem {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 18px;
}
figure.columnitem img {
	width: 100%;
}
/*flex非対応ブラウザとsafariではcolumnでのflexがキャンセルされるため、その子要素を横並びにするための処理を行う*/
.ua-safari .columnitem, .no-flexbox .columnitem {
	float: left;
}
/*column2xは左右2カラムの場合にcolumnと同じ要素に設定する
flex非対応ブラウザとsafariでの偶数目の要素を右に寄せる処理を行っているため、
htmlの記述順も左→右の順で記述する必要がある*/
.ua-safari .column2x .columnitem:nth-child(2n), .no-flexbox .column2x .columnitem:nth-child(2n) {
	float: right;
}

/*js仕様にした場合のレスポンシブ対応案がまだ思いつかないので保留*/
@media only screen and (max-width: 499px) {
.column.noflex {
	display: block !important;
}
}

@media only screen and (max-width: 959px) {
.mobileitemsize1 {
width: calc(100% / 12 * 1 - 10px);
}
.mobileitemsize2 {
width: calc(100% / 12 * 2 - 10px);
}
.mobileitemsize3 {
width: calc(100% / 12 * 3 - 10px);
}
.mobileitemsize4 {
width: calc(100% / 12 * 4 - 10px);
}
.mobileitemsize5 {
width: calc(100% / 12 * 5 - 10px);
}
.mobileitemsize6 {
width: calc(100% / 12 * 6 - 10px);
}
.mobileitemsize7 {
width: calc(100% / 12 * 7 - 10px);
}
.mobileitemsize8 {
width: calc(100% / 12 * 8 - 10px);
}
.mobileitemsize9 {
width: calc(100% / 12 * 9 - 10px);
}
.mobileitemsize10 {
width: calc(100% / 12 * 10 - 10px);
}
.mobileitemsize11 {
width: calc(100% / 12 * 11 - 10px);
}
.mobileitemsize12 {
width: calc(100% / 12 * 12 - 10px);
}
}

/*レスポンシブデザイン上で最終的に1カラムになる場合に使用*/
@media only screen and (max-width: 529px) {
.mobileitemsize1, .mobileitemsize2, .mobileitemsize3, .mobileitemsize4, .mobileitemsize5, .mobileitemsize6, .mobileitemsize7, .mobileitemsize8, .mobileitemsize9, .mobileitemsize10, .mobileitemsize11, .mobileitemsize12 {
/*			width: 100%;*/
}
}
/*-------------------------------------------------------

unit

designセクションでは吸収しきれない個別スタイルをここで設定する

-------------------------------------------------------*/

body {
/*
	background: url(../../test.jpg) 50% -2px no-repeat;
	padding-bottom: 2000px;
*/
/*	background: #fff;*/
}
div.flex figure {
	margin-bottom: 18px;
}
#about p.about {
	margin-bottom: 84px;
}
#main article {
	overflow: hidden;
}
#main article #contents {
	width: 74.3%;
	width: calc(75% - 5px);
	float: left;
}
#main article #sNav {
	width: 24.3%;
	width: calc(25% - 5px);
	float: right;
}
#main article #sNav ul {
	border-top: #ccc 1px solid;
}
#main article #sNav li {
	border-bottom: #ccc 1px solid;
}
#main article #sNav a {
	display: block;
	position: relative;
	height: 35px;
	line-height: 35px;
	padding: 0 10px;
	text-decoration: none;
	color: #004ca5;
}
#main article #sNav a:before, #main article #sNav a:after {
	position: absolute;
	bottom: auto;
	top: 50%;
	right: 15px;
	content: "";
	display: block;
	width: 10px;
	height: 3px;
	background: #004ca5;
	transition: all 0.2s;
}
#main article #sNav a:before {
	-webkit-transform: translateY(-3px) rotate(45deg);
	-webkit-transform: translateY(calc(-50% - 3px)) rotate(45deg);
	transform: translateY(-3px) rotate(45deg);
	transform: translateY(calc(-50% - 3px)) rotate(45deg);
}
#main article #sNav a:after {
	-webkit-transform: translateY(3px) rotate(-45deg);
	-webkit-transform: translateY(calc(-50% + 3px)) rotate(-45deg);
	transform: translateY(3px) rotate(-45deg);
	transform: translateY(calc(-50% + 3px)) rotate(-45deg);
}
#main article #sNav a:hover:before, #main article #sNav a:hover:after {
	right: 10px;
}

@media only screen and (max-width: 639px) {
#main article #contents, #main article #sNav {
	width: 100%;
	float: none;
}
}
.newscontents {
}
.newscontents .unit {
	border: #ccc 1px solid;
	padding: 30px 20px;
	border-radius: 10px;
}
.newscontents .unit+.unit {
	margin-top: 0;
}
.newscontents .unit h3 {
	text-align: left;
	font-size: 150%;
	line-height: 1.3;
	margin-bottom: 0;
}
.newscontents .unit p {
	font-size: 100%;
}
.newscontents .unit .date {
	text-align: right;
}
.newscontents .unit .link {
}
.newscontents .unit .link li {
}
.newscontents .unit .link a {
	color: #06c;
	display: inline-block;
}
.newscontents .unit .link a:before {
	border-left-color: #06c;
}

@media only screen and (max-width: 639px) {
.newscontents {
}
.newscontents .unit {
	border: #ccc 1px solid;
	padding: 15px 10px;
	border-radius: 5px;
}
.newscontents .unit+.unit {
}
.newscontents .unit h3 {
	font-size: 130%;
}
.newscontents .unit p {
	font-size: 94%;
	margin-bottom: 1em;
}
}
/*写真2 注釈*/
#main .photo2Notes {
	clear: both;
}
#main .photo2Notes ul {
	clear: both;
	width: 100%;
	margin: 0 !important;
}
#main .photo2Notes ul li {
	width: 47%;
	height: auto;
	float: left;
	margin: 0 15px 5px 0 !important;
	padding: 0;
}
#main .photo2Notes ul li img {
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}

@media only screen and (max-width: 959px) {
#main .photo2Notes ul {
	width: 100%;
}
#main .photo2Notes ul li {
	width: 42%;
	height: auto;
	float: left;
	margin: 0 15px 5px 0 !important;
}
#main .photo2Notes ul li img {
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}
}

@media only screen and (max-width:499px) {
#main .photo2Notes ul li {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 15px 0 !important;
}
#main .photo2Notes ul li img {
	width: 100%;
	height: auto;
	margin: 0 0 4px 0;
}
}
/*写真3 注釈*/
#main .photo3Notes {
	clear: both;
}
#main .photo3Notes ul {
	clear: both;
	width: 100%;
	margin: 0 !important;
}
#main .photo3Notes ul li {
	width: 270px;
	height: auto;
	float: left;
	margin: 0 15px 5px 0 !important;
	padding: 0;
}
#main .photo3Notes ul li img {
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}

@media only screen and (max-width:499px) {
#main .photo3Notes ul li {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 15px 0 !important;
}
#main .photo3Notes ul li img {
	width: 100%;
	height: auto;
	margin: 0 0 4px 0;
}
}
/*写真4 注釈*/
#main .photo4Notes {
	clear: both;
}
#main .photo4Notes ul {
	clear: both;
	width: 100%;
	margin: 0 !important;
}
#main .photo4Notes ul li {
	width: 200px;
	height: auto;
	float: left;
	margin: 0 15px 5px 0 !important;
	padding: 0;
}
#main .photo4Notes ul li img {
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}

@media only screen and (max-width:499px) {
#main .photo4Notes ul li {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 15px 0 !important;
}
#main .photo4Notes ul li img {
	width: 100%;
	height: auto;
	margin: 0 0 4px 0;
}
}
/*
 form
-------------------------------------------------------------------*/

/* form */
#contactForm {
	padding: 15px;
	background: #efefef;
	border-radius: 10px;
}
#contactForm p {
	margin-bottom: 5px;
}
#contactForm th, #contactForm td {
	border-bottom: 1px solid #ccc;
	padding: 10px;
	line-height: 1.4;
}
#contactForm th {
	padding-left: 0;
	font-weight: bold;
}
#contactForm table {
	border: none;
}
#contactForm th, #contactForm td {
	border: none;
}
#contactForm th, #contactForm td {
	background: none;
}
#contactForm th, #contactForm td {
	border: none;
}
#submitBt {
	text-align: center;
	font-weight: bold;
}
#submitBt input {
	border: 5px solid #fff;
	padding: 8px;
	margin: 15px 5px;
	background-color: #004ca5;
	border-radius: 20px;
	color: #fff;
	cursor: pointer;
}
#submitBt input:hover {
	background-color: #4cccff;
}
label.error {
	display: block;
	padding: 2px 0 0 16px;
	font-size: 12px;
	color: red;
}
input {
	width: 50%;
}
textarea {
	width: 100%;
}
#submitBt input {
	width: 40%;
}

@media only screen and (max-width: 639px) {
input {
	width: 100%;
}
#submitBt input {
	width: 45%;
}
}
.contactform tbody th {
	width: 20%;
}
.contactform input[type=text] {
	width: 40%;
	min-width: 200px;
}
.contactform input, .contactform textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.contactform input.short {
	width: 20%;
	min-width: 100px;
}
.contactform input.long, .contactform textarea {
	width: 100%;
}
span.required, th.required:after {
	font-size: 75%;
	background: #f00;
	padding: 0.125em 0.3em 0;
	vertical-align: middle;
	border-radius: 3px;
	color: #fff;
	display: inline-block;
}
th.required:after {
	content: "必須";
	margin-left: 1em;
}
.enpage th.required:after {
	content: "Required";
}
.contactform label {
	display: inline-block;
	cursor: pointer;
	margin-right: 10px;
}
.contactform textarea {
	height: 10em;
}
.contactform .caption {
	display: block;
	font-size: 75%;
}
.contactform .caption a {
	font-size: inherit;
}
.contactform .error {
	background-color: #FFAAAA;
}
.contactform .error_text {
	color: #F00;
	font-weight: bold;
}

@media only screen and (max-width: 479px) {
.contactform, .contactform table, .contactform tbody, .contactform tr, .contactform th, .contactform td {
	border: none;
	display: block;
	border: none !important;
}
.contactform th, .contactform td {
	width: 100% !important;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.contactform td:last-child {
	margin-bottom: 18px;
}
.contactform br {
	display: none;
}
.contactform .annotation {
	display: block;
	font-size: 94%;
	line-height: 1.5;
}
.contactform .indent {
	margin-left: 2em;
}
.contactform .dindent {
	margin-left: 4em;
}
#contact input[type=text] {
	width: 95%;
	height: 2em;
}
#contact input.long {
	width: 100%;
}
#contact input.short {
	width: 40%;
}
.contactform label {
	display: block;
}
}
/*-------------------------------------------------------

state

:hover、:active、:focusなどの擬似要素や
.currentなどのページの状態によって部分的に変化を起こす際にここで設定

-------------------------------------------------------*/

.current {
	cursor: default;
}
#fNav a:hover {
}
a.link:hover {
}
/*-------------------------------------------------------

cosmetic

その他、局所的に使用するスタイル
あるいは、汎用性の高いスタイル設定を記述

-------------------------------------------------------*/
.basiclist {
	padding-left: 15px;
}
.basiclist ul li {
	position: relative;
}
.basiclist ul li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 8px;
	height: 8px;
	background-color: #004ca5;
	border-radius: 100%;
}
.link {
}
.link li {
	padding-left: 1.5em;
	padding-left: calc(2.5em - 16px);
}
.link a {
	color: #003;
	position: relative;
	padding-left: 16px;
}
.link a:before {
	content: "";
	border: 4px transparent solid;
	border-right: none;
	border-left-color: #003;
	border-left-width: 8px;
	position: absolute;
	top: 50%;
	top: calc(50% - 4px);
	left: 0;
	transition: all 0.2s;
}
.link a:hover:before {
	left: 4px;
}
.clear {
	clear: both;
}
.txtAlignC {
	text-align: center !important;
}
.txtAlignCL {
	text-align: center !important;
}

@media only screen and (max-width: 479px) {
.txtAlignCL {
	text-align: left !important;
}
}
.txtAlignR {
	text-align: right;
}
.floatContentsR {
	float: right;
	margin: 0 0 10px 10px !important;
}
.floatContentsL {
	float: left;
	margin: 0 10px 10px 0 !important;
}
#concept .floatContentsL {
	margin: 0 30px 10px 30px !important;
}
#concept .floatContentsL img {
	width: 250px;
}
em, .red {
	color: #c00;
}
.px8 {
	font-size: 62%;
}/**/
.px9 {
	font-size: 68%;
}
.px10 {
	font-size: 74%;
}/**/
.px11 {
	font-size: 83.3%;
}
.px12 {
	font-size: 93%;
}
.px13 {
	font-size: 100%;
}/**/
.px14 {
	font-size: 105%;
}
.px15 {
	font-size: 115%;
}/**/
.px16 {
	font-size: 123%;
}
.px17 {
	font-size: 136%;
}/**/
.px18 {
	font-size: 145%;
}
.px19 {
	font-size: 154%;
}
.px20 {
	font-size: 160%;
}
.px21 {
	font-size: 162%;
}
.px22 {
	font-size: 170%;
}
.px23 {
	font-size: 177%;
}
.px24 {
	font-size: 185%;
}
.fontRed {
	color: #FF0004 !important;
}
.fontBlue {
	color: #0063FF!important;
}
.fontGreen {
	color: #004ca5 !important;
}
ul.customicon {
	padding-left: 1em;
}
ul.customicon li {
	list-style: none;
	position: relative;
}
ul.customicon.dia li:before {
	content: "◆";
	position: absolute;
	left: -1em;
}
.pcNewLine {
	display: block;
}
.mNewLine {
	display: none;
}

@media (max-width:939px) {
.pcNewLine {
	display: none;
}
.mNewLine {
	display: block;
}
}
.btnStyle a {
	display: inline-block;
	font-size: 120%;
	color: #fff;
	text-decoration: none;
	height: 40px;
	line-height: 40px;
	padding: 2px 20px 0 20px;
	border-radius: 25px;
	background: #004ca5;
}
.btnStyle a:hover {
	background: #4cccff;
}
/*
 黄色囲み
-------------------------------------------------------------------*/
.yellowBox {
	padding: 15px 15px 5px 15px;
	background: #fff9da;
	border-radius: 10px;
	border: 1px solid #35a000;
}
/*
電話番号
-------------------------------------------------------------------*/
.telBox {
	padding: 15px;
	background: #fff9da;
	border-radius: 10px;
	border: 1px solid #35a000;
}
.telBox p {
	font-size: 180%;
	margin-bottom: 0;
}
/* Foundation v2.1.4 http://foundation.zurb.com */
/* Artfully masterminded by ZURB  */

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/


/* -----------------------------------------
   Shared Styles
----------------------------------------- */

/* Mobile */

#main table.responsive {
	margin-bottom: 0;
}
#main .pinned {
	position: absolute;
	left: 0;
	top: 0;
	background: #fff;
	width: 17%;
	overflow: hidden;
	/*		overflow-x: scroll;*/
	border-right: 1px solid #ccc;/*		border-left: 1px solid #ccc;*/
}
#main .pinned table {
	border-right: none;
	/*		border-left: none;*/
	width: 100%;
}
#main .pinned table th, .pinned table td {
	white-space: nowrap;
}
#main .pinned td:last-child {
	border-bottom: 0;
}
#main div.table-wrapper {
	position: relative;
	margin-bottom: 20px;
	overflow: hidden;
	border-right: 1px solid #ccc;
}
#main div.table-wrapper div.scrollable {
	margin-left: 17%;
	width: 83%;
	margin-right: 0 !important;
}
#main div.table-wrapper div.scrollable {
	overflow: scroll;
	overflow-y: hidden;
}
#main table.responsive td, table.responsive th {
	/*		position: relative;*/
	white-space: nowrap;
	overflow: hidden;
}
#main div.scrollable table.responsive th:first-child, #main div.scrollable table.responsive td:first-child {
	display: none;
}
#main .pinned table.responsive th:first-child, #main .pinned table.responsive td:first-child {
	display: table-cell;
}


.w_70_100{
	max-width:70%;
	height: auto;
}
@media (max-width:739px) {
.w_70_100{
	max-width: 100%;
	height: auto;
}
}
.w_50_80_100 {
	max-width:50%;
	height: auto;
}
@media (max-width:1300px) {
.w_50_80_100{
	max-width: 80%;
	height: auto;
}
}
@media (max-width:739px) {
.w_50_80_100{
	max-width: 100%;
	height: auto;
}
}
.w_600_100 {
	max-width:600px;
	height: auto;
}

@media (max-width:739px) {
.w_600_100{
	max-width: 100%;
	height: auto;
}
}

.w_700_100 {
	max-width:700px;
	height: auto;
}

@media (max-width:739px) {
.w_700_100{
	max-width: 100%;
	height: auto;
}
}

.w_800_100 {
	max-width:800px;
	height: auto;
}

@media (max-width:839px) {
.w_800_100{
	max-width: 100%;
	height: auto;
}
}

.display_not{
    display: none;
}