/* 
 * ------- additional css elements  ---------------------
 */
table.list {
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 0px 15px;
	font-size: 12px;
}

table.list th,
table.list td {
	padding: 10px;
}

table.list th {
	vertical-align: middle;
	text-align: left;
	overflow: visible;
	position: relative;
	color: #fff;
	font-weight: normal;
	border-right:none;
	width:43%;
}
table.list th a {
	text-decoration:none;
}

table.list th:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-width: 10px;
	margin-top: -10px;
}
.fa-lg {
    line-height: 1.5em!important;
}

@media screen and (max-width: 768px) {
	table.list th:after {
		display:none;
	}
	
	table.list th {
		width:auto;
	}
}
/* firefox */
@-moz-document url-prefix() { 
	table.company th::after {
		float: right;
		padding: 0;
		left: 30px;
		top: 10px;
		content: " ";
		height: 0;
		width: 0;
		position: relative;
		pointer-events: none;
		border: 10px solid transparent;
		border-left: #295890 10px solid;
		margin-top: -10px;
	}
}

table.list td {
	padding-left: 20px;
	vertical-align:middle;
}


/*----------------------------
link
----------------------------*/


.btn_l {
	display:inline-block;
	margin-left:5px;
	float:right;
	
}
.btn_l a {
	padding: 7px 28px 7px 10px;
	line-height: 1;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	text-decoration: none;
	width: auto;
	font-size:0.9em;
}
.btn_l a::hover {
}
.btn_l a::after {
	position: absolute;
	top: 32%;
	bottom: 0;
	margin: auto;
	content: "\f08e";
		font-family: FontAwesome;
	vertical-align: middle;
	left: 70%;
	box-sizing: border-box;
		font-size:1.1em;
}
.sp-mt30{margin-top:30px;}
@media screen and (max-width: 420px) {
	.btn_l {
	float:none;
	display:block;
	margin-left:0;
	margin-top:5px;
}
	
}


.sml {
	font-size:0.9em;
}

/*===========================
content
===========================*/

.facility-name {
	width: 90px;
	margin: 30px auto;
}

.pic-adjust1 {
		width: 100%;
	height: 450px;
	position: relative;
	overflow: hidden;
}

.pic-adjust1 img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	-moz-transition: -moz-transform 0.5s linear;
	-webkit-transition: -webkit-transform 0.5s linear;
	-o-transition: -o-transform 0.5s linear;
	-ms-transition: -ms-transform 0.5s linear;
	transition: transform 0.5s linear;
}

.pic-adjust1 img {
	width: 400%;
	max-width: none;
}

/* 
 * ------- additional css elements  ---------------------
 */


.txtstyle12 {
	font-size:1.2em;
}


/*===========================
content
===========================*/

.facility-name {
	width: 90px;
	margin: 30px auto;
}

.pic-adjust1 {
		width: 100%;
	height: 450px;
	position: relative;
	overflow: hidden;
}

.pic-adjust1 img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	-moz-transition: -moz-transform 0.5s linear;
	-webkit-transition: -webkit-transform 0.5s linear;
	-o-transition: -o-transform 0.5s linear;
	-ms-transition: -ms-transform 0.5s linear;
	transition: transform 0.5s linear;
}

.pic-adjust1 img {
	width: 400%;
	max-width: none;
}

/* 
 * ------- additional css elements  ---------------------
 */


/*===========================

===========================*/



/* 
 * ------- additional css elements  ---------------------
 */
.txtslow2 {
	line-height: 2.3;
	font-size:1.2em;
}
@media only screen and (max-width: 768px) {
	
	.txtslow2 {
	font-size:1em;
}
}

h4.bb {
	border-bottom:1px dashed #000;
	padding-bottom:10px;
}
/* 写真の角丸　*/

.photo_circle {
	border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

/*===========================

===========================*/





.txtstyle_l {
	font-size:1.5em;
}


/* 
 * ------- additional css elements  ---------------------
 */


/*===========================

===========================*/





/*===========================
リスト
===========================*/

ul.circle, .content ul.check {
	position: relative;
}
ul.circle li {
	padding: 0 0 0.5em 1.2em;
	margin-bottom: 0.7em;
	border-bottom: 1px dashed #CCC;
}
ul.check li {
	padding: 0 0 0.5em 1.6em;
	margin-bottom: 0.7em;
	border-bottom: 1px dashed #CCC;
}
ul.circle li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #333;
	border-radius: 50%;
	left: 0.5em;
	margin-top: 0.6em;
}
ul.check li::before {
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 left: 0.3em;
 font-size: 1.3em;
}
ul.nb_circle, ul.circle2, ul.circle3, ul.nb_check, ul.check2, ul.check3 {
	position: relative;
}
.content ul.check_2 li {
	padding: 0 0 0.5em 1.6em;
	margin-bottom: 0.7em;
	left:-45%;
	position:relative;
}
.content ul.check_2 li::before {
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 left: 0.3em;
 font-size: 1.3em;
}
.content ul.nb_circle li {
	padding: 0 0 0.5em 1.2em;
}
.content ul.nb_circle li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #222;
	border-radius: 50%;
	left: 0.5em;
	margin-top: 0.6em;
}
.content ul.nb_check li {
	padding: 0 0 0.5em 1.6em;
}
.content ul.nb_check li::before {
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 left: 0.3em;
 font-size: 1.3em;
}
.content ul.circle2 li, .content ul.check2 li {
	margin-bottom: 0.5em;
	/*
	border-bottom: 1px dashed #CCC;
	*/
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1em;
	margin-right: 0.1%;
	margin-left: 0.1%;
	width: 45%;
}
.content ul.circle2 li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #222;
	border-radius: 50%;
	/* [disabled]left: 0.5em;
*/
	margin-top: 0.6em;
	margin-left: -1em;
}
 .content ul.check2 li::before {
 display: block;
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 font-size: 1em;
 margin-left: -1em;
}
.content ul.circle3 li {
	margin-bottom: 0.2em;
	margin-top: 0.2em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 0;
	margin-right: 35px;
	width: 7.5em;
}
.content ul.check3 li {
	margin-bottom: 0.2em;
	margin-top: 0.2em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1.8em;
	margin-right: 35px;
}
.content ul.circle3 li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #222;
	border-radius: 50%;
	/* [disabled]left: 0.5em;
*/
	margin-top: 0.6em;
	margin-left: -1em;
}
 .content ul.check3 li::before {
 display: block;
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 font-size: 1.3em;
 margin-left: -1.2em;
}
.content ul.circle4 li {
	margin-bottom: 0.2em;
	margin-top: 0.2em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1.8em;
	margin-right: 35px;
	border-bottom: 1px dashed #CCC;
}
.content ul.check4 li {
	margin-bottom: 0.2em;
	margin-top: 0.2em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 0.5em;
	margin-right: 35px;
}
.content ul.check4 li::before {
 display: block;
 position: absolute;
 content: "\f14a";
 font-family: FontAwesome;
 font-size: 1.3em;
 margin-left: -1.2em;
}
.content ul.circle4 li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #222;
	border-radius: 50%;
	/* [disabled]left: 0.5em;
*/
	margin-top: 0.6em;
	margin-left: -1em;
}
.content ul.circle_3 li {
	margin-bottom: 0.5em;
	border-bottom: 1px dashed #CCC;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1em;
	margin-right: 0.1%;
	margin-left: 0.1%;
	width: 30%;
}
.content ul.circle_3 li:before {
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: #222;
	border-radius: 50%;
	/* [disabled]left: 0.5em;
*/
	margin-top: 0.6em;
	margin-left: -1em;
}
ul.liReseter {
	line-height:1.8em;
	margin-left:20px;

}
ul.liReseter li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
}
ul.liReseter2 {
	line-height:1.8em;
	margin:0 0 12px 30px;

}
ul.liReseter2 li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
}
ul.liReseterFloat {
	line-height:1.8em;
	margin-left:20px;
}
ul.liReseterFloat li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
	float:left;
	padding-right:60px;
}
.content ol.number-list2 {
	display: block;
	list-style-position: outside;
}
.content ol.number-list2 li {
	list-style-type: decimal;
	padding: 0 0 0 10px;
	margin-left: 2em;
}
 @media screen and (max-width: 768px) {
 ul.liReseterFloat li {
 float:none;
 margin-bottom:10px;
}
.content ul.circle_3 li {
	width:90%;
}

}
/* メニューリスト(フォントオーサム) */

.content ul.menu {
	position: relative;
}
.content ul.menu li {
	margin-bottom: 0.2em;
	margin-top: 0.2em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1.8em;
	margin-right: 35px;
}
.content ul.menu li:before {
	position: absolute;
	content: "\f13a";
	font-family: FontAwesome;
	width: 6px;
	height: 6px;
	margin-left: -1.2em;
}
/* SNS　レスポ　フォントオーサム　*/

ul.sns li {
	float:left;
	margin-right:10px;
	font-size:2em;
}
ol.number-list_b {
	counter-reset:number; /* 名前を付けたカウンターをリセット */
	list-style:none; /* olが数字を付けることをキャンセル */
}
ol.number-list_b li {
	line-height: 2;
	margin-bottom: 1em;
	border-bottom:1px #CCC dashed;
	padding-bottom:10px;
	padding-left: 2.5em; /*1em（1文字）分、右に動かす*/
	text-indent: -2.5em; /*最初の行だけ1em（1文字）分、左に動かす*/
}
ol.number-list_b li:before {
	counter-increment: number;
	content: counter(number);
	display: inline-block;
	width: 2em;
	height: 2em;
	text-align: center;
	border-radius: 50%;
	margin-right: .3em;
	text-indent: 0.1em; /*最初の行だけ1em（1文字）分、左に動かす*/
}
@media screen and (max-width: 768px) {
ol.number-list_b li {
 width:80%;
 margin-left:0;
}
}

/* コメントリスト(フォントオーサム) */

.content ul.comment {
	position: relative;
}

.content ul.comment li {
	padding: 0 0 0.5em 1.6em;
	margin-bottom: 0.7em;
	/*
	border-bottom: 1px dashed #CCC;
	*/
}
.content ul.comment li::before {
	position: absolute;
	content: "\f27b";
	font-family: FontAwesome;
	left: 0em;
	font-size: 1.5em;
	margin-top:-4px;
}

.content ul.comment2 {
	position: relative;
}



.content ul.comment2 li {
	margin-bottom: 0.5em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 1em;
	margin-right: 0.1%;
	margin-left: 0.1%;
	width: 45%;
}
.content ul.comment2 li::before {
	display: block;
	position: absolute;
	content: "\f27b";
	font-family: FontAwesome;
	font-size: 1.4em;
	margin-left: -1.2em;

}

/*===========================
タブレット・スマホサイズのcircle2
===========================*/


@media screen and (max-width: 768px) {
 .content ul.circle2 li, .content ul.check2 li {
 margin-bottom: 0.7em;
 border-bottom: 1px dashed #CCC;
 float: left;
 padding-top: 0;
 padding-right: 0;
 padding-bottom: 0.5em;
 padding-left: 1.8em;
 margin-right: 1%;
 margin-left: 1%;
 width: 97%;
}

.content ul.comment2 li {
	width:95%;
	margin-left:2%;
}

}
/*===========================
地図追加
===========================*/
#map_canvas2, #map_canvas3, #map_canvas4, #map_canvas5, #map_canvas6, #map_canvas7 {
	height:300px;
	margin-bottom:1em;
}
 @media screen and (max-width: 768px) {
#map_canvas2, #map_canvas3, #map_canvas4, #map_canvas5, #map_canvas6, #map_canvas7 {
 width:100%;
}
}
/*===========================
テキスト調整
===========================*/

.tx-em {
	background: linear-gradient(transparent 62%, rgba(255, 250, 137, 0.71) 0%);
}
.tx_green {
	font-size:130%;
	line-height:1.5em;
	color:#00B300;
}
.tx_name {
	font-size:180%;
	line-height:1.5em;
	margin-bottom:20px;
	text-align:center;
}
.tx-red {
	background: linear-gradient(transparent 62%, rgba(255, 100, 100, 0.71) 0%);
}
.txtstyle3 {
	font-size: 1.3em;
}
.txtstyle4 {
	font-size: 1.5em;
}
.txtstyle5 {
	font-size: 1.5em;
	font-weight:bold;
}
.txtstyle6 {
	font-size: 1.7em;
}
.nomalcatch {
	font-size:1.7em;
	text-align:center;
	font-weight:bold;
	line-height:1.4em;
	
}
.tx-right {
	text-align:right;
}
.h2_ver2 {
	font-size: 1.6em!important;
	line-height: 1.3em;
	text-align: center;
	margin-bottom: 2em;
	position: relative;
}
.h2_ver2::after {
 position: absolute;
 bottom: -16px;
 left: 50%;
 z-index: 1;
 content: '';
 display: block;
 height: 3px;
 background: #dcdcdc;
 width: 120px;
 margin-left: -60px;
}


table.table-various1 tr th.th15 {
	width:15%;
}
@media only screen and (max-width: 768px) {
 table.table-various1 tr th.th15 {
 width:auto;
}

}
/*===========================
other
===========================*/

.transform {
	transform: rotate(0.05deg);
}
a.arrow3 {
	position:relative;
	display:inline-block;
	padding:0 32px 0 16px;
	color:#fff;
	text-decoration:none;
	height:24px;
	line-height:24px;
	border-radius:12px;
	background:#603;
	margin-bottom:2px;
}
a.arrow3:before, a.arrow3:after {
	content:"";
	display:block;
	position:absolute;
}
a.arrow3:before {
	width:16px;
	height:16px;
	background:#fff;
	border-radius:50%;
	right:4px;
	top:4px;
}
a.arrow3:after {
	width:4px;
	height:4px;
	border-right:2px solid #603;
	border-top:2px solid #603;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	right:10px;
	top:9px;
}

/*----------------------------
like-btn1のメールフォーム
----------------------------*/


.content .like-btn_m {
	display: block;
	margin-top: 0.5em;
}
.content .like-btn_m a {
	padding: 7px 18px 7px 44px;
	line-height: 1;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	text-decoration: none;
	border-radius: 3px;
	width: auto;
}
.content .like-btn_m a::before {
	position: absolute;
	top: 17%;
	bottom: 0;
	margin: auto;
	content: "\f0e0";
		font-family: FontAwesome;
	vertical-align: middle;
	left: 10%;
	box-sizing: border-box;
		font-size:1.5em;
}

/*===========================
縦写真
===========================*/

.before2, .after2 {
	position: relative;
}
 .before2::after {
 position: absolute;
 content:" ";
 display:inline-block;
 background:url(../img/common/watermark_before.png);
 background-repeat: no-repeat;
 background-size:contain;
 z-index: 1;
}
 .after2::after {
 position: absolute;
 content:" ";
 display:inline-block;
 background:url(../img/common/watermark_after.png);
 background-repeat: no-repeat;
 background-size:contain;
 z-index: 1;
}
.before2::after {
 width:22%;
 height:22%;
 bottom: -4%;
 left: 77%;
}
 .after2::after {
 width:22%;
 height:22%;
 bottom: -4%;
 left: 77%;
}
/*===========================
content
===========================*/
.com_soon {
	padding: 0.5em 1em;
	margin: 2em 0;
	border: double 3px #999;
	text-align:center;
}
.com_soon p {
	margin: 0;
	padding: 50px;
	font-size:1.3em;
	color:#808080;
}
.box17 {
	margin:2em 0;
	position: relative;
	padding: 1.5em 1.5em;
	padding-left:70px;
	border-top: solid 2px black;
	border-bottom: solid 2px black;
}
.box17:before, .box17:after {
	content: '';
	position: absolute;
	top: -10px;
	width: 2px;
	height: -webkit-calc(100% + 20px);
	height: calc(100% + 20px);
	background-color: black;
}
.box17:before {
	left: 10px;
}
.box17:after {
	right: 10px;
}
.box17 p {
	margin: 10px 0;
	padding: 0;
}
@media screen and (max-width: 768px) {
 .box17 {
 padding-left:7%;
 padding-right:9%;
}
}

.small-writeup2 {
	border: 1px dashed #000;
	padding: 20px;
}

.bg_box {
	background-color:#F2F2F2;
	border:double 4px #fff;
	padding:2em;
}


/* h3左右ライン付 */
.content h3.tx-splits-w {
	position: relative;
	display: inline-block;
	background-image: url(../img/top/line_pickup.png);
	background-position: center center;
	background-repeat: repeat-x;
	width: 100%;
	text-align: center;
	z-index: 1;
	font-weight: normal;
	margin-bottom: 1.3em;
	border-bottom: none;
	border-top: none;
	padding: 0 0;
}
.content h3.tx-splits-w:before {
	content: '';
	position: absolute;
	display: inline-block;
	width: 30%;
	height: 1em;
	left: 50%;
	top: 0%;
	-moz-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: -1;
}

@media only screen and (max-width: 420px) {
.content h3.tx-splits-w:before {
	width: 86%;
}
}
.content h3.tx-splits-w:before {
	background-color: #fff;
}
/*===========================
layout
===========================*/

.w80 {
	width:80%;
	margin:auto;
}
.w70 {
	width:70%;
	margin:auto;
}
.w60 {
	width:60%;
	margin:auto;
}
.w40 {
	width:40%;
	margin:auto;
}
.w30 {
	width:30%;
	margin:auto;
}
 @media screen and (max-width: 768px) {
 .w80, .w70, .w60, .w40, .w30 {
 width:100%;
}
}
.one_half h3 {
	margin-top:30px;
}
/* ボタン */


.sssp {
	display:block;
}
@media screen and (max-width: 768px) {
 .sssp {
 display:none;
}
}

/* TEL・フォーム */

 ul.tel_inq {
	position:relative;
	margin:auto;
	width:55%;
}
ul.tel_inq li {
	margin-bottom: 0.5em;
	float: left;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 0em;
	margin-right: 3%;
	margin-left: 3%;
}
 @media only screen and (max-width: 768px) {
 ul.tel_inq {
 width: 100%!important;
}
ul.tel_inq li {
 float: none;
 width: 100%;
 margin-left:0;
 padding-left:0;
}
}
.mt8 {
	margin-top:8px;
}

/*===========================
others
===========================*/

/* 画像とテキストを交互に表示 */


.contents-wrap {
	display: flex;
	justify-content: space-between;
	margin-bottom:30px;
}
.contents-wrap:nth-child(odd) {
 flex-direction: row-reverse;
}
.contents-text {
	width: 47.5%; /*flex: 2;*/
}
.contents-img {
	width: 47.5%; /*flex: 1;*/
}
.contents-text h2 {
	margin-bottom: 2rem;
	font-size: 2.2rem;
}
.contents-img img {
	display: block;
	width: auto;
	max-width: 100%;
}
.contents-text .mt60 {
	margin-top:60px;
}
.contents-text .mt50 {
	margin-top:50px;
}
.contents-text .mt40 {
	margin-top:40px;
}
.contents-text .mt30 {
	margin-top:30px;
}
.contents-text .mt20 {
	margin-top:20px;
}
 @media screen and (max-width: 768px) {
 .contents-wrap,  .contents-wrap:nth-child(odd) {
 flex-direction: column;
}
 .contents-text,  .contents-img {
 width: 100%; /*flex: 1;*/
 margin-bottom:1em;
}
 .contents-text h2 {
 text-align: center;
}
.contents-text.mt60, .contents-text.mt50, .contents-text.mt40, .contents-text.mt30, .contents-text.mt20 {
	margin-top:0!important;
}
}
/*----------------------------
カラー調整
----------------------------*/

/*
number-list
*/
ol.number-list_b li:before {
            background: #3551aa; /* ホバーはいけい */
            color: #fff; /* 文字色 */
}



.like-btn_m a {
		background-color:#30488a; /* はいけい */
	color: #FFF!important;
}
.like-btn_m a:hover {
	background-color: #3551aa; /* ホバーはいけい */
}


a .fa-instagram {
	color:#fff;
	background-color:#000;
	padding:2px 3px;
	border-radius:25%;
}
a .fa-instagram:hover {
	color:#000;
	background-color:#F0F0F0;
}


table.list th {
	background: #30488a; /* はいけい */
}
table.list th a {
	color:#fff;
}

table.list th:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #30488a; /* はいけい */
}

table.list td {
	background: #f8f8f8;
}

.btn_l a {
		background-color:#30488a; /* はいけい */
	color: #FFF!important;
}
.btn_l a:hover {
	background-color: #3551aa; /* ホバーはいけい */
}
.dataInner .name span {
    font-size: 0.7em;
}

/* ////// arra-ez responsive set --- please custom as you like //////////////////////////  */
body, html {margin:0; padding:0;}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
 
.shell { display: flex; flex-direction:row; flex-wrap:wrap; }
.shell.reverse { display: flex; flex-direction:row-reverse; flex-wrap:wrap; }
.shell.nowrap-x { flex-wrap:nowrap; }
.shell.left { justify-content:flex-start; }
.shell.center, .shell.x-center { justify-content:center; }
.shell.right { justify-content:flex-end; }
.shell.fill, .shell.fill-x, .shell.split { justify-content:space-between; }
.shell.equalize { justify-content:space-around; }
.shell.top { align-items:flex-start; }
.shell.middle, .shell.y-center { align-items:center; }
.shell.baseline { align-items:baseline; }
.shell.bottom { align-items:flex-end; }
.shell > .grow-x {flex-grow:1;}
.stretch, .grow-y { align-self:stretch; }
 
.solo, .full { width:100%;}
.duo, .half { width:50%;}
.trio, .one-third { width:calc(100% / 3);}
.two-thirds { width:calc(100% / 3 * 2);}
.quad, .quarter { width:25%;}
.three-quarters { width:75%;}
.penta, .twenty { width:20%;}
.thirty { width:30%;} 
.forty { width:40%;} 
.sixty { width:60%;}
.seventy { width:70%;}
.eighty { width:80%;}
 
.solo.gutter, .full.gutter { width:98%; margin:1em 1%;}
.duo.gutter, .half.gutter { width:48%;  margin:1em 1%;}
.trio.gutter, .one-third.gutter { width:calc(94% / 3); margin:1em 1%;}
.two-thirds.gutter { width:calc(97% / 3 * 2); margin:1em 1%;}
.quad.gutter, .quarter.gutter { width:23%; margin:1em 1%;}
.three-quarters.gutter { width:73%; margin:1em 1%;}
.penta.gutter, .twenty.gutter { width:18%; margin:1em 1%;}
.thirty.gutter { width:28%; margin:1em 1%;} 
.forty.gutter{ width:38%; margin:1em 1%;} 
.sixty.gutter { width:58%; margin:1em 1%;}
.seventy.gutter { width:68%; margin:1em 1%;}
.eighty.gutter { width:78%; margin:1em 1%;}
 
.centering {text-align:center;}
.centering > * { margin-left:auto !important; margin-right:auto !important;}
 
/* Universal Padding Class --- as you like */
.pd-around {padding:1.5em 1.5em;}
.pd-side {padding:0 1.5em;}
.pd-top-bottom {padding:1.5em 0;}
.pd-right {padding-right:1.5em;}
.pd-left {padding-left:1.5em;}
 
/* clearfix --- for use together with legacy float layout */
.clearfix:before, .clearfix:after { content: " "; display: table;}
.clearfix:after { clear: both;}
.clearfix { *zoom: 1;}
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}
 
/*** Media Query ***/
@media only screen and (max-width: 899px) {
     
    .shell.break900:not(.step) { flex-direction:column;}
    .shell.break900 > .solo, .shell.break900 > .full, .shell.break900 > .duo, .shell.break900 > .half, .shell.break900 > .trio, .shell.break900 > .one-third, .shell.break900 > .two-thirds, .shell.break900 > .quad, .shell.break900 > .quarter, .shell.break900 > .three-quarters, .shell.break900 > .penta, .shell.break900 > .twenty, .shell.break900 > .thirty, .shell.break900 > .forty, .shell.break900 > .sixty, .shell.break900 > .seventy, .shell.break900 > .eighty 
    { width:100%; }
    .shell.break900 > .solo.gutter, .shell.break900 > .full.gutter, .shell.break900 > .duo.gutter, .shell.break900 > .half.gutter, .shell.break900 > .trio.gutter, .shell.break900 > .one-third.gutter, .shell.break900 > .two-thirds.gutter, .shell.break900 > .quad.gutter, .shell.break900 > .quarter.gutter, .shell.break900 > .three-quarters.gutter, .shell.break900 > .penta.gutter, .shell.break900 > .twenty.gutter, .shell.break900 > .thirty.gutter, .shell.break900 > .forty.gutter, .shell.break900 > .sixty.gutter, .shell.break900 > .seventy.gutter, .shell.break900 > .eighty.gutter
    { width:98%; margin:1em 1%;}
     
    .shell.step { flex-direction:row; flex-wrap:wrap; }
    .shell.step > .duo, .shell.step > .half, .shell.step > .trio, .shell.step > .one-third, .shell.step > .two-thirds, .shell.step > .quad, .shell.step > .quarter, .shell.step > .three-quarters, .shell.step > .penta, .shell.step > .twenty, .shell.step > .thirty, .shell.step > .forty, .shell.step > .sixty, .shell.step > .seventy, .shell.step > .eighty 
    { width:50%;}
    .shell.step > .duo.gutter, .shell.step > .half.gutter, .shell.step > .trio.gutter, .shell.step > .one-third.gutter, .shell.step > .two-thirds.gutter, .shell.step > .quad.gutter, .shell.step > .quarter.gutter, .shell.step > .three-quarters.gutter, .shell.step > .penta.gutter, .shell.step > .twenty.gutter, .shell.step > .thirty.gutter, .shell.step > .forty.gutter, .shell.step > .sixty.gutter, .shell.step > .seventy.gutter, .shell.step > .eighty.gutter 
    { width:48%; margin:1em 1%;}
     
}
 
/* Mobile Single Column ( like 7-10 inch Tablet ) */
@media only screen and (max-width: 768px) {
 
    .container, .wide-container {padding:0 0.3em;} /* as you like */
 
    .shell.break768:not(.step) { flex-direction:column;}
    .shell.break768 > .solo, .shell.break768 > .full, .shell.break768 > .duo, .shell.break768 > .half, .shell.break768 > .trio, .shell.break768 > .one-third, .shell.break768 > .two-thirds, .shell.break768 > .quad, .shell.break768 > .quarter, .shell.break768 > .three-quarters, .shell.break768 > .penta, .shell.break768 > .twenty, .shell.break768 > .thirty, .shell.break768 > .forty, .shell.break768 > .sixty, .shell.break768 > .seventy, .shell.break768 > .eighty
    { width:100%; }
    .shell.break768 > .solo.gutter, .shell.break768 > .full.gutter, .shell.break768 > .duo.gutter, .shell.break768 > .half.gutter, .shell.break768 > .trio.gutter, .shell.break768 > .one-third.gutter, .shell.break768 > .two-thirds.gutter, .shell.break768 > .quad.gutter, .shell.break768 > .quarter.gutter, .shell.break768 > .three-quarters.gutter, .shell.break768 > .penta.gutter, .shell.break768 > .twenty.gutter, .shell.break768 > .thirty.gutter, .shell.break768 > .forty.gutter, .shell.break768 > .sixty.gutter, .shell.break768 > .seventy.gutter, .shell.break768 > .eighty.gutter
    { width:98%; margin:1em 1%;}
     
    .shell:not(.keep) > .solo, .shell:not(.keep) > .full, .shell:not(.keep) > .duo, .shell:not(.keep) > .half, .shell:not(.keep) > .trio, .shell:not(.keep) > .one-third, .shell:not(.keep) > .two-thirds, .shell:not(.keep) > .quad, .shell:not(.keep) > .quarter, .shell:not(.keep) > .three-quarters, .shell:not(.keep) > .penta, .shell:not(.keep) > .twenty, .shell:not(.keep) > .thirty, .shell:not(.keep) > .forty, .shell:not(.keep) > .sixty, .shell:not(.keep) > .seventy, .shell:not(.keep) > .eighty
    { width:100%; margin:0; }   
    .shell:not(.keep) > .solo.gutter, .shell:not(.keep) > .full.gutter, .shell:not(.keep) > .duo.gutter, .shell:not(.keep) > .half.gutter, .shell:not(.keep) > .trio.gutter, .shell:not(.keep) > .one-third.gutter, .shell:not(.keep) > .two-thirds.gutter, .shell:not(.keep) > .quad.gutter, .shell:not(.keep) > .quarter.gutter, .shell:not(.keep) > .three-quarters.gutter, .shell:not(.keep) > .penta.gutter, .shell:not(.keep) > .twenty.gutter, .shell:not(.keep) > .thirty.gutter, .shell:not(.keep) > .forty.gutter, .shell:not(.keep) > .sixty.gutter, .shell:not(.keep) > .seventy.gutter, .shell:not(.keep) > .eighty.gutter
    { width:98%; margin:1em 1%;}
 
    .shell.step { flex-direction:row; flex-wrap:wrap; }
    .shell.step > .duo, .shell.step > .half, .shell.step > .trio, .shell.step > .one-third, .shell.step > .two-thirds, .shell.step > .quad, .shell.step > .quarter, .shell.step > .three-quarters, .shell.step > .penta, .shell.step > .twenty, .shell.step > .thirty, .shell.step > .forty, .shell.step > .sixty, .shell.step > .seventy, .shell.step > .eighty 
    { width:50%;}
    .shell.step > .duo.gutter, .shell.step > .half.gutter, .shell.step > .trio.gutter, .shell.step > .one-third.gutter, .shell.step > .two-thirds.gutter, .shell.step > .quad.gutter, .shell.step > .quarter.gutter, .shell.step > .three-quarters.gutter, .shell.step > .penta.gutter, .shell.step > .twenty.gutter, .shell.step > .thirty.gutter, .shell.step > .forty.gutter, .shell.step > .sixty.gutter, .shell.step > .seventy.gutter, .shell.step > .eighty.gutter
    { width:48%; margin:1em 1%;}
 
    .shell.keep-half:not(.keep), .shell.keep-half:not(.keep) { flex-direction:row;}
    .shell.keep-half:not(.keep) > .solo, .shell.keep-half:not(.keep) > .full, .shell.keep-half:not(.keep) > .duo, .shell.keep-half:not(.keep) > .half, .shell.keep-half:not(.keep) > .trio, .shell.keep-half:not(.keep) > .one-third, .shell.keep-half:not(.keep) > .two-thirds, .shell.keep-half:not(.keep) > .quad, .shell.keep-half:not(.keep) > .quarter, .shell.keep-half:not(.keep) > .three-quarters, .shell.keep-half:not(.keep) > .penta, .shell.keep-half:not(.keep) > .twenty, .shell.keep-half:not(.keep) > .thirty, .shell.keep-half:not(.keep) > .forty, .shell.keep-half:not(.keep) > .sixty, .shell.keep-half:not(.keep) > .seventy, .shell.keep-half:not(.keep) > .eighty   
    { width:50%;}   
    .shell.keep-half:not(.keep) > .solo.gutter, .shell.keep-half:not(.keep) > .full.gutter, .shell.keep-half:not(.keep) > .duo.gutter, .shell.keep-half:not(.keep) > .half.gutter, .shell.keep-half:not(.keep) > .trio.gutter, .shell.keep-half:not(.keep) > .one-third.gutter, .shell.keep-half:not(.keep) > .two-thirds.gutter, .shell.keep-half:not(.keep) > .quad.gutter, .shell.keep-half:not(.keep) > .quarter.gutter, .shell.keep-half:not(.keep) > .three-quarters.gutter, .shell.keep-half:not(.keep) > .penta.gutter, .shell.keep-half:not(.keep) > .twenty.gutter, .shell.keep-half:not(.keep) > .thirty.gutter, .shell.keep-half:not(.keep) > .forty.gutter, .shell.keep-half:not(.keep) > .sixty.gutter, .shell.keep-half:not(.keep) > .seventy.gutter, .shell.keep-half:not(.keep) > .eighty.gutter
    { width:48%; margin:1em 1%;}
     
    /* Universal padding class --- as you like */
    .pd-around {padding:1.5em 1.5em;}
    .pd-side {padding:0 1.5em;}
    .ttal {text-align:left !important;}
    .ttal:not(.pd-side) { padding:0 1.5em;}
    .pd-around .ttal:not(.pd-side), .pd-side .ttal:not(.pd-side) { padding:0;}  
     
}
 
/* Traditional SmartPhone Portrait Size */
@media only screen and (max-width: 479px) {
     
    .shell:not(.keep), .shell.step:not(.keep) { flex-direction:column;}
    .shell.step:not(.keep) > .solo, .shell.step:not(.keep) > .full, .shell.step:not(.keep) > .duo, .shell.step:not(.keep) > .half, .shell.step:not(.keep) > .trio, .shell.step:not(.keep) > .one-third, .shell.step:not(.keep) > .two-thirds, .shell.step:not(.keep) > .quad, .shell.step:not(.keep) > .quarter, .shell.step:not(.keep) > .three-quarters, .shell.step:not(.keep) > .penta, .shell.step:not(.keep) > .twenty, .shell.step:not(.keep) > .thirty, .shell.step:not(.keep) > .forty, .shell.step:not(.keep) > .sixty, .shell.step:not(.keep) > .seventy, .shell.step:not(.keep) > .eighty    
    { width:100%; margin: margin:0;}
    .shell.step:not(.keep) > .solo.gutter, .shell.step:not(.keep) > .full.gutter, .shell.step:not(.keep) > .duo.gutter, .shell.step:not(.keep) > .half.gutter, .shell.step:not(.keep) > .trio.gutter, .shell.step:not(.keep) > .one-third.gutter, .shell.step:not(.keep) > .two-thirds.gutter, .shell.step:not(.keep) > .quad.gutter, .shell.step:not(.keep) > .quarter.gutter, .shell.step:not(.keep) > .three-quarters.gutter, .shell.step:not(.keep) > .penta.gutter, .shell.step:not(.keep) > .twenty.gutter, .shell.step:not(.keep) > .thirty.gutter, .shell.step:not(.keep) > .forty.gutter, .shell.step:not(.keep) > .sixty.gutter, .shell.step:not(.keep) > .seventy.gutter, .shell.step:not(.keep) > .eighty.gutter 
    { width:98%; margin:1em 1%;}
 
    /* Single Column --- Universal margin-bottom class */
    .shell.automa > , .shell.automa > .gutter {margin-bottom:1.5em !important;}
 
    /* Universal padding class --- as you like */
    .pd-around {padding:6% 3%;}
    .pd-side, .pd-right, .pd-left {padding:0 3%;}
    .stal {text-align:left !important;}
    .stal:not(.pd-side) { padding:0 3%;}
    .pd-around .stal:not(.pd-side), .pd-side .stal:not(.pd-side) { padding:0;}  
 
}
.x-scroll {
    overflow: auto;
}
@media only screen and (max-width: 768px) {
.x-scroll {
    border-right: 3px solid #ADADAD;
}	
}
.x-scroll table{
width:100%;
}
.x-scroll::-webkit-scrollbar{
height: 5px; /* スクロールバーの高さ */
}
.x-scroll::-webkit-scrollbar-track{
background: #F1F1F1; /* スクロールバーの背景色 */
}
.x-scroll::-webkit-scrollbar-thumb {
background: #d6d6d6; /* スクロールバーの色 */
}
.x-scroll td, .x-scroll th{
white-space: nowrap;　/* 文字の折返しを禁止 */
}
.box23 {
    position: relative;
    margin: 0.5em 0 0.5em 40px;
    padding: 8px 15px;
    background: #fff0c6;
    border-radius: 30px;
}
.box23:before{font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 15px;
    left: -40px;
    bottom: 0;
    color: #fff0c6;
}
.box23:after{
    font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 23px;
    left: -23px;
    bottom: 0;
    color: #fff0c6;
}
.box23 p {
    margin: 0; 
    padding: 0;
}
.bg-color1 th {
    background-color: #E4F5FF;
}
.bg-color2 th {
    background-color: #E4FFEC;
}
.bg-color3 th {
    background-color: #FFF6E4;
}
.img-responsive {
  display: block;
  height: auto;
  max-width: 100%;
}

.scroll{
	overflow:auto;
	height:260px;
	margin-bottom:30px;
}

.fs80p {
	font-size:80% !important;
}

.fs90p {
	font-size:90% !important;
}

.fs110p {
	font-size:110% !important;
}

.fs120p {
	font-size:120% !important;
	line-height:1.4em !important;
}

.fs130p {
	font-size:130% !important;
	line-height:1.4em !important;
}

.fs140p {
	font-size:140% !important;
	line-height:1.4em !important;
}

.fs140pM {
	font-size:140% !important;
	line-height:1.8em !important;
}

.fs150p {
	font-size:150% !important;
	line-height:1.4em !important;
}

.fs200p {
	font-size:200% !important;
	line-height:1.4em !important;
}

.txtCenter {
	text-align:center !important;
}

.txtRight {
	text-align:right !important;
}

.txtLeft {
	text-align:left !important;
}

/******************plus*********************/

.like-btn1 a {
    background-color: #617acc;
    padding: 10px 10px 10px 20px;
}
.home-bg1 {
    background-color: rgba(154,211,232,0.50) !important;
}
h4 {
  overflow: hidden;
  text-align: center;
}
h4 span {
  position: relative;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  text-align: left;
}
h4 span::before,
h4 span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 400%;
  height: 1px;
  background-color: #000;
}
h4 span::before {
  right: 100%;
}
h4 span::after {
  left: 100%;
}
.homeNavArea .main-nav{
	margin-left:50px;
}
.logo-sp img{width: 100%;margin-top: 20px;}
.dataContainer{
	background:url("../img/common/bg-blue.jpg");
}
.dataContainer .name {
    color: #becdff;
    font-size: 18px;
    margin-bottom: 10px;
}
.secondary header h1 {
    background-position:top;
}
.secondary header h1 span {
    color: #30488a;
}
.d-grid{display:grid;}
.home-bg1{
	background:url("../img/common/bg_section1.jpg");
	background-color:transparent;
}
.content img, .shell img {
    width: 100%;
    max-width: 100%;
}
.siema-btn {
    text-align: center;
}
.siema-btn ul li {
    display: inline;
    margin: 0 4px;
}
.btn {
    display: inline-block;
    min-width: 120px;
    padding: 8px 24px;
    margin-bottom: 16px;
    border-radius: 4px;
    text-align: center;
    background: transparent;
    border-color: #1ebeb4;
    border-style: solid;
    border-width: 1px;
    color: #1ebeb4;
}
.btn:hover {
    background-color: #1ebeb4;
    color: #fff;
    cursor: pointer;
}

#gallery .one_third {
    width: 33.3333%;
    margin: 0;
}
@media screen and (max-width: 768px){
	.homeNavArea .main-nav{
	margin-left:0px;
}
	}