@charset "UTF-8";

/*==================================
    共通部分
==================================*/

*{
	margin: 0;
	padding: 0;
	font-style: normal;
	border: 0;
	zoom: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}
	
html{height:100%;}

html>/**/body{overflow:-moz-scrollbars-vertical;}

html:first-child body{
	min-height: 100%;
	padding-bottom: 1px;
	overflow-x: hidden;
}
	

body{
	font-family:"Noto Sans JP","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", Meiryo,"ＭＳ Ｐゴシック","MS PGothic", sans-serif;
	margin: 0;
	padding: 0;
	border: 0;
	color: #333;
	font-weight: normal;
	font-weight: 400;
	font-size: 95%;
	-webkit-text-size-adjust: 100%;
	line-height: 1.75;
	background-color: #fff;
	min-width:320px;
	overflow-x: hidden;
	}

a {outline: none;color:#6e8aa4;text-decoration: none;}


a:visited	{color:#6e8aa4;}
a:hover		{
	opacity:0.7;
	-webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
    transition: 0.4s;
	text-decoration: none;
	cursor: pointer;
	}
	
	p a,p a:visited{
		color:#6e8aa4;
	}

a.menu-item {
    padding: 5% 0;
    text-indent: 1em;
    display: block;
	color: #fff;
}

img {
	border: none;
	max-width: 100%;
	width: auto;
	height: auto;
	vertical-align: bottom;
	margin: 0 auto;
	display: block;
	}

a img:hover	{opacity: 0.7;}
	
a img{margin-bottom: 0 !important;}

p{
	font-size: 95%;
}

p.space {
	margin:0 1.5% 2%;
	
}
	
strong{font-weight: 700;}

em{
	color: #c30d23;
	font-style: normal;
	}

	
/*文字を中央揃えにする*/
.center {
	text-align: center;
}

/*文字を左揃えにする*/
.left {
	text-align: left;
}

/*文字を右揃えにする*/
.right {
	text-align: right;
}

.inner{
    max-width: 800px;
    width: 96%;
    margin: 0 auto;
}

.contents{
	display: block;
	margin: 0 auto;	
}

.m_both{
	padding:3% 0;	
}

.m_bottom{
	margin-bottom: 3%;	
}


i.fab.fa-facebook-square {
    font-size: 180%;
}

.ul_sitemap {
	display: block;
	margin: auto;
	color:#333;
}

hr{
	clear:both;
	border-color:#e7e7e7;
	border-style:solid;
	border-width:1px 0 0;
	display:block;
	height:1px;
	margin:60px 1%;
}


/* breadcrumbs */
.breadcrumbs {
	width: 100%;
	min-height:40px;
	padding:8px 0.9em;
	font-size: 85%;
	text-align: center;
	background-color:#e7e7e7;
	color: #333;
	font-weight:400;
	letter-spacing:0;
}

	.breadcrumbs a,
	.breadcrumbs a:visited,
	.breadcrumbs a:hover:after{
		text-decoration:none;
		color: #333;
	}
	
	.breadcrumbs a:hover{color:#8c8d81;}
	
	.breadcrumbs a:after{
		font-family: FontAwesome;
		content: "\f105";
		padding: 0 0.5em 0 0.9em;
		color:#333;
	}


/* ------------------------------------------  
BOX
------------------------------------------ */
/* grid */

.grid1,
.grid2,
.grid3,
.grid4,
.half,
.info div{
	float: left;
	margin: 0 1% 20px;
	box-sizing: border-box;
}

.grid1		{width: 31.33%;}
.grid2		{width: 64.67%;}
.grid3		{width: 31.33%;}
.grid4,
.info div	{width: 23.00%;}
.half		{
			 width: 47%;
			 margin:1.5%;
			 }

.box{
	margin: 0 1% 40px;
	width: 98%;
	clear: both;
}

.fb{
	padding:0 0 80px;
	text-align:center;
}

.fb .fb-page{
	display:block;
	margin:0 auto;
}

.white_box {
	margin: 5% 0;
	display:block;
}

.gray_box{
	background-color:#e7e7e7;
	padding:5% 0;		
}

.gray_box.b_space {
	padding:5% 3%;
	margin-bottom: 3%;	
}


.white {
	background: #fff;
    margin: 0;
    padding: 2% 5% 4%;
	display:block;
}

.white_box.vision {
	background: url(img/map.png) no-repeat;
	background-size: 350px auto;
	background-position: top -2px right 10%;
}


.bg_box {
    background: url(img/bg_nature.jpg) no-repeat 50% -10%;
    background-size: cover;
    display: block;
    margin: 0;
    padding: 5% 0;
    max-width: 100%;
    width: 100%;
    z-index: 300;
}

.bg_box.vision {
    background: url(img/map.png) no-repeat;
   	background-size: 300px auto;
	background-position: top -2px right 10%;
	z-index:301;
}

.bg_vision {
    background: url(img/bg_furusato.jpg) no-repeat 50% 50%;
    background-size: cover;
    display: block;
    margin: 0;
    padding: 5% 0;
    max-width: 100%;
    width: 100%;
    z-index: 300;
	color:#fff;		
	
}

.bg_vision h2,
.bg_vision h3{
	color:#fff;
	border:#fff;
}

.bg_vision h2:before,.bg_vision h2:after{
	background-color: #fff;
}

.box_system {
	background: url(img/system.png) no-repeat;
	background-size:contain;
	padding-top: 25%;
	margin:0 1%;
	width:98%;
	box-sizing:border-box;	
}


/* ------------------------------------------  
CONTACT
------------------------------------------ */

.contact {
	display:block;
	padding:3%;
	text-align:center;	
}

.contact h3 {
	padding:0;	
}

.contact p {
	font-size:140%;
	font-weight:400;
	color:#2a2d40;
}

.contact p.tel {
	font-size: 200%;
	font-weight: 700;
}

/* form */
label{
	cursor: pointer;
}

input,textarea{
	font-family:'Noto Sans JP',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-weight:300;
	padding:5px 6px;
	vertical-align: middle;

}

.checkbox label {
    display: inline-block;
    margin-right: 1.5em;
}

textarea{
	width:100%;
}


/* ------------------------------------------  
MENU
------------------------------------------ */
		
ul.menu {
	display:block;
	list-style: none;
	position: absolute;
	z-index: 999;
    top: 5px;
    right: 5%;
	white-space: nowrap;
	color: #fff;
	}

ul.menu li {
	padding: 8px;
	list-style: none;
	letter-spacing: 1.2;
	font-size: 90%;
	float: left;
}

.menu .fb_icon img{
	width:30px;
	height:30px;
	margin-top: -5px;
}

ul.menu li a:hover {
	border-bottom:2px solid #fff;
	margin-bottom:2%;
	opacity:0.7;
	color:#fff;
	}

ul.menu li a,
ul.menu li a:visited {
	text-decoration: none;
	color:#fff;
	}

.eyecatch ul.menu li.fb_icon a:hover {
	border-bottom: none;
}
	
.contents_eyecatch ul.menu {
	color:#333;
	position: absolute;
	z-index: 999;
	top: -45px;
	right: 5%;
}

.contents_eyecatch ul.menu li a:hover {
	border-bottom:2px solid #333;
	opacity:1;
	}

.contents_eyecatch ul.menu li.fb_icon a:hover  {
	border:none;
	opacity:0.7;
}

.contents_eyecatch .fb_icon {
	color:#333;
	padding-right:0;
}


.contents_eyecatch ul.menu li a{
	color:#333;
	border-bottom:2px solid #fff;
}

.slidemenu,.menu-button{
	display:none;
}

.sp_menu img:hover {
  cursor : pointer;		
	
}

.menu ul li.fb_icon img {
	display: block;
	z-index: 500;
	position: absolute;
	top: 20px;
	right: 70px;
	width: 40px;
	height: 40px;
}

.resources h4{
	text-align:center;
}

span.small {
	font-size:70%;	
}
						
/* ------------------------------------------  
HEADER
------------------------------------------ */

.eyecatch {
	position:relative;
	background: url(img/pc_eye.jpg) no-repeat center;
	background-size: cover;
	height: 0;
	z-index: 3;
	padding-bottom:50%;
	max-width: 100%;
	color:#fff;
	text-align:center;
	display: block;	
}



.contents_eyecatch {
	position:relative;
	background: url(img/pc_eye.jpg) no-repeat center top -50px;
	background-size: cover;
	height: 0;
	z-index: 3;
	max-width: 100%;
	color: #333;
	text-align:center;
	display: block;
	margin-top: 50px;
	padding-bottom: 25%;
}


.title {
	display:block;
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	margin: 0 auto;
}


.title p.catch {
    padding-top: 55%;
	font-family:"Noto Sans JP","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", Meiryo,"ＭＳ Ｐゴシック","MS PGothic", sans-serif;
	font-weight:normal;
	font-size:85%;
	letter-spacing:2.5px;
	color:#fff;
}


h1 {
	color: #fff;
	max-width: 800px;
	width: 800px;
	text-align: center;
	line-height: 1.3;
	z-index: 4;

	font-family: 'YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN', HGS明朝E, "Sawarabi Mincho", serif;
	font-size:220%;
	position: absolute;
	top: 45%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	margin: 0 auto;
	display: block;
	letter-spacing: 3.4px;
	padding-bottom:2%;
	border-bottom: 2px solid #fff;
	width: 330px;
}

h1 a{
	color: #fff;
}

h1 a, h1 a:visited {
	color: #fff;
}

.contents_eyecatch h1 a,
.contents_eyecatch h1 a:visited{
	color: #333;
}

.eyecatch .inner{
	max-width:1000px;
	width:90%;
	display: block;
	position: relative;
}

.contents_eyecatch .inner{
	max-width:1000px;
	width:90%;
	margin:0 auto;
	height:50px;
	position:absolute;
	top:-50px;
	left:0;
	right:0;
	bottom:0;

}

.contents_eyecatch h1{
	width:50%;
	text-align: left;
	line-height: 1.3;
	z-index: 4;
	font-family: 'YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN', 'HGS明朝E', "Sawarabi Mincho", serif;
	font-size: 100%;
	transform: translate(0,0);
	left: 0;
	top:15px;
	color: #333;
	display: block;
	letter-spacing: 2.0px;
	margin-left:0;
	border: none;
}


.contents_eyecatch ul.menu {
	color:#333;
	position: absolute;
	z-index: 999;
	top: 5px;
	right:0;
}


/* ------------------------------------------  
TITLE
------------------------------------------ */

h2 {
	cle.btnr: both;
	padding: 0;
	margin: 0 auto 4%;
	color: #333;
	font-size: 155%;
	font-weight:700;
	text-align: center;
	letter-spacing: 3px;
	position:relative;
	letter-spacing: 2px;
}

h2:after {
    content: '';
    width: 3em;
    height: 2px;
    background-color: #333;
    position: absolute;
    bottom: -5px;
    left: 50%;
	transform: translate(-50%,-50%);
    -webkit-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
	letter-spacing:1.6;
}

.gray_box h2 {
    overflow: hidden;
}

.gray_box h2:after {
	background-color:transparent;	
}


h2 span {
	display: flex;
	align-items: center;
	margin: 0;
}

h2 span:before, h2 span:after {
	content: "";
	flex-grow: 1;
	height: 2px;
	background: #333;
	display: block;	
}

h2 span:after {
	margin-left: 0.5em;
	margin-right: 0.5em;
}

h2 span:before {
	margin-right: 0.5em;
	margin-left: 0.5em;
}




.pc_hidden {
	display: none;	
	
}



.inner > h3{margin-top:40px;}


h3 {
	clear: both;
	font-size: 140%;
	letter-spacing: 2.0;
	color: #333;
	text-align: center;
	padding: 3%;
	overflow: hidden;
}
	
	h2 span, h3 span {
			position: relative;
			display: inline-block;
			margin: 0 1em;
			padding: 0 0.6em;
			text-align: left;
		}

		h2 span::before,
		h2 span::after,		
		h3 span::before,
		h3 span::after {
			position: absolute;
			top: 50%;
			content: '';
			width: 500px;
			height: 2px;
			background-color: #333;
		}
		
		h2 span::before, h3 span::before {right: 100%;}
		h2 span::after, h3 span::after {left: 100%;}



h4 {
    clear: both;
    line-height: 1.4em;
    padding: 8px;
    font-size: 1.75;
    font-weight: normal;
    border-radius: 3px;
    text-align: left;
    color: #2a2d40;
    font-size: 120%;
    font-weight: 700;

}


h5 {
	clear: both;
	margin: 0 1% 10px;
	font-size: 100%;
	line-height: 1.6em;
	font-weight: bold;
	color: #5f5f5f;
}

/* ------------------------------------------  
TABLE
------------------------------------------ */	
table{
	border-collapse: collapse;
	word-break:break-all;
	border-spacing: 0;
	width:100%;
	margin:0 0 20px;
	background:#ffffff;
	letter-spacing:0;
	font-size:90%;
}

	table tr{
		width:100%;
		white-space:nowrap;
	}

	table th,
	table td{
		padding:9px 15px;
		text-align:left;
		font-weight:normal;
		border-bottom: #f7f8f7 1px solid;
	}
	
	table th{
		background:#2a2d40;
		color:#fff;
	}
	

.half table{
	float: left;
	margin: 0 2% 10px 0;
	width: 49%;
}

.half > table:nth-of-type(2n){
	margin-right:0;
}


th{
	width:230px;
}
td{
	text-align:right;
	background-color:#e7e7e7;
}


/* ------------------------------------------  
BUTTON
------------------------------------------ */	

.btn {
	width: 250px;
	text-align: center;
	margin: 2% auto 5%;
	padding: 8px 3%;
	clear: both;
	display: block;
	background:#2a2d40;
	color:#fff;
	white-space: nowrap;
}

.btn a,.btn a:visited{color:#fff;}

input.form-button {
	width: 180px;
	text-align: center;
	margin: 2% auto 5%;
	clear: both;
	display: block;
	background:#2a2d40;
	color:#fff;
	white-space: nowrap;
    padding: 10px 2%;
}

	.form-button:hover,
		.btn:hover{
			opacity: 0.7;
			cursor: pointer;
		}
		
		
		.btn:after {
 			font-family: FontAwesome;
			font-size:115%;
  			content: "\f105";
 			padding: 0 0.4em;
  			display: inline-block;
		}



/* ------------------------------------------  
LIST
------------------------------------------ */

ul,ol {
	list-style: none;
}


ul.ul_nav{
	margin:40px 2% 40px;
	text-align:center;
}

	ul.ul_nav li{
		display:inline-block;
		font-size:90%;
		margin-left:0;
		text-indent:0;
		margin:0 5px 0 0;
		list-style:none;
		background-image:none;

		padding-left:1%;
	}
	
	ul.ul_nav li a{
		width:auto;
		padding: 8px 2em;
		margin:0 0 8px 0;
		color: #fff;
		display:inline-block;
		position:relative;
		overflow:visible;
		background-color: #2a2d40;
		font-size:90%;
		font-weight:300;
	}

	ul.ul_nav li a:before{
		display: inline-block;
		padding-right:5px;
		font-family: FontAwesome;
		content:"\f107";
		font-size:110%;
	}
	
	ul.ul_nav li a:hover{opacity:0.8;}

	
	ul.ul_ict {
		padding-left:1.5em;
		list-style-type:square;
		color:#333;
}

	ul.ul_ict02 {
		padding-left:2.5em;
		list-style-type:square;
		color:#333;
	}


/* ------------------------------------------  
サイトマップ
------------------------------------------ */

ul.ul_link,
ul.ul_sitemap{
	margin-left:0;
	margin:0 1% 20px;
	clear:both;
	border-bottom:1px solid #e7e7e7;
}

ul.ul_sitemap{
	width:48%;
	float:left;
	clear:none;
}

ul.ul_link li,
	ul.ul_sitemap li {
		list-style: none;
		margin:0;
		padding:0;
		width:100%;
		display: block;
		text-indent:0;
	}
	
	ul.ul_link li a,	
		ul.ul_sitemap li a{
			color:#333;
			display: block;
			padding: 10px 20px 10px 20px;
			font-size:100%;
			text-decoration:none;
			border-top:1px solid #e7e7e7;
		}

	ul.ul_link li a:hover,		
		ul.ul_sitemap li a:hover{
			color:#2a2d40;
			background-color: #e7e7e7;
		}

	ul.ul_link li a:before,		
		ul.ul_sitemap li a:before{
			content: "\f105";
			font-family: FontAwesome;
			padding-right: 0.5em;
		}
	
	/* 2階層目 */
	ul.ul_sitemap02 li{
		margin:0;

	}

	ul.ul_sitemap ul.ul_sitemap02 li a{
		padding: 10px 20px 10px 40px;
	}


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

.dl_link{
	width: 98%;
    margin: 0 1% 20px;
}

	.dl_link dt{
		line-height: 1.6em;
		font-weight: bold;
		padding-bottom: 5px;
		border-bottom: 1px solid #e7e7e7;
		margin-bottom: 1%;
	}

	.dl_link dt a{
		zoom: 1;
		border-bottom: none;
		font-size: 110%;
		font-weight: 500;
		margin-left: 5px;
		color:#2a2d40;
		text-decoration:none;

	}
	

		.dl_link dt a:before{
			content: "\f08e";
			font-family: FontAwesome;
			padding-right: 0.5em;
			color:#2a2d40;
		}
	
	.dl_link dd{
		padding-top:0;
		padding-bottom: 10px;
		margin-bottom: 15px;
	}

	.dl_link dd.last{
		border-bottom:none;
	}
	
	



/* ------------------------------------------  
ページトップへ
------------------------------------------ */

#pagemove {
    position: fixed;
    z-index: 200;
    bottom: 10px;
    right: 10px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 30px;
    color: #fff;
    border-radius: 2px;
    opacity: 0.75;
}

#pagemove a{
		display: block;
		width: 55px;
		height: 55px;
		background:url(img/pagemove.png) no-repeat;
		background-size: 55px 55px;

		background-position: 0 0;
}

a#pagemove:hover{
	box-shadow: 0 0.5px 0.5px rgba(0, 0, 0, 0.2);
	opacity: 0.55;
}


/* ------------------------------------------  
FOOTER
------------------------------------------ */

footer {
	background-image:url(img/bg.jpg);
	padding:3% 0;
	display:block;
	max-width:100%;
	margin:0;
	color:#fff;
	text-align:center;
}

footer h2 {
    color: #fff;
    font-size: 120%;
    font-weight: 400;
    padding: 0;
    display: block;
	margin: 20px auto 5px;
}

footer h2:after {
	content: '';
    width: 0;
    height: 0;
    position: absolute;
    bottom: 0;
    left: 0
}


footer .inner > div {
	display: block;
    line-height: 1.6;
}

footer .inner {
	max-width:1000px;
	width:100%;
	margin:0 auto;	
}

/*footer-menu*/

footer ul {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    line-height: 1.6;
    padding-left: 0;
}

	footer ul li {
	display: inline-block;
    margin-bottom: 10px;
    padding: 0px 10px 0px 12px;
    border-left: solid 1px #fff;
    margin-left: 0;
    text-indent: 0;
	
}
	
	footer ul li.child {
		border-left:none;
		padding-left:3px;
	}
	
		footer ul li.child a:before {
			content:"-";
		}
	
		footer ul li:last-child {
			border-right: solid 1px #fff;
			padding-right:8px;
		}
			
			footer ul li a,
			footer ul li a:visited{
				color:#fff;
				text-decoration:none;
			}
			
			footer ul li a:hover{
				opacity:0.7;
				color:#fff;
			}

			footer ul li.list_child{
					border-left:none;
					padding-left:0;
				}

.address {
    letter-spacing: 1.6px;
	text-align:center;	
}

.address p {
	line-height: 1.75;	
}

.copyright {
    margin: 0 auto;
    display: block;
    font-size: 85%;
    letter-spacing: 1.2px;
	padding-top: 3%;
}

.copyright a,.copyright a:visited{
	color:#fff;
}


.copyright a:hover{
	border-bottom:1px dotted #fff;
	text-decoration:none;	
}


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

.white_box.vision {
	background-size: 350px auto;
	background-position: top -2px right 5%;	
}


footer .inner > div {
	display: block;
    line-height: 1.6;
}

footer .inner {
	max-width:800px;
	width:100%;
	margin:0 auto;	
}
	
	
}


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

ul.menu {
	display:block;
	list-style: none;
	position: absolute;
	z-index: 999;
	top: 5px;
	right: 5%;
	white-space:nowrap;
	color: #fff;
}


.white_box.vision {
	background-size: 350px auto;
	background-position: top -2px right 3%;	
}

.white_box.vision .grid2 {
    width: 56%;
}

footer .inner {
	max-width: 90%;
	width: 100%;
	margin: 0 auto;	
}



}

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


.eyecatch {
	padding-bottom:60%;
}


h1 {
    font-size: 190%;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    margin: 0 auto;
}


.inner {
	max-width:94%;
	margin:0 3%;

}



p.btn {
    width: 250px !important;
    text-align: center;
    margin: 3% auto;
    padding: 7px 0;
    white-space: nowrap;
}


.white_box.vision {
	background-size: 330px auto;
    background-position: top 30px right 3%;
}


.white_box.vision .grid2 {
    width: 48%;
	margin: 0 1%;
}

th{
	width:160px;
}

td{
	white-space: normal;
}

footer .inner > div {
	display: block;
    line-height: 1.6;
}

footer .inner {
	max-width: 90%;
	width: 100%;
	margin: 0 auto;	
}

	
}


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

html {
	overflow-x: hidden;
}


.contents_eyecatch h1 {
	top:78px;
	border: none;
	color: #fff;
	width:auto;
	left:10px;
}

	.contents_eyecatch h1 a,.contents_eyecatch h1 a:visited{
		color: #fff;
	}

/*sp-menu*/

.menu-button,
.sp_menu img {
	display:block;
	z-index:500;
	position: fixed;
	top: 15px;
	right: 15px;
	width: 55px;
	height: 55px;
	color: #fff;
}


#wrapper {
	z-index: 1;
	background: #fff;
	margin: 0;
}

.slidemenu {
	top: 0;
	right: 0;
	width: 200px;
	position: fixed;
	visibility: hidden;
	z-index: -1;
	display:block;
	background-color: rgba(0,52,90,0.7);
	z-index:1000;
	margin:0 auto;
	color: #fff;
}

.slidemenu a.fb_icon {
	display: block;
	z-index: 500;
	font-size: 130%;
	position:absolute;
	top:22px;
	right:90px;
	color: #fff;
}

.slidemenu .slidemenu-header {
	position: relative;
	color: #fff;
}

.slidemenu .slidemenu-body {
	height: 100%;
	overflow: hidden;
	position: relative;
	margin-top: 80px;
	color: #fff;
}

.slidemenu-content {
	position: relative;
	color:#fff;
	display:block;
	padding-bottom: 150px;
}

.slidemenu .slidemenu-content li {
	font-size: 95%;
	border-bottom: 1px dashed #fff;
	color: #fff;
}

.slidemenu .slidemenu-content li a:before {
	font-family: FontAwesome;
	content: "\f0da";
	padding: 0 0.4em;
	color: #fff;
}


.slidemenu .slidemenu-content li:hover {
	opacty:0.7;
}

.slidemenu ul.nest li {
	padding: 0;
	border-top: 1px dashed #fff;
	border-bottom: none;
	color: #fff;
}

.slidemenu ul.nest li a:before {
		font-family: FontAwesome;
		content: "\f105";
		padding: 0 0.4em;
		display: inline-block;
		color: #fff;	
}


/*sp-menuここまで*/
	

.eyecatch {
	background: url(img/sp_eye.jpg) no-repeat;
	position: relative;	
	background-size: cover;
	padding-top: 50%;
	max-width: 100%;
}

.contents_eyecatch {
	background: url(img/sp_eye.jpg) no-repeat;
	position: relative;	
	background-size: cover;
	max-width: 100%;
	padding-bottom: 50%;
    margin-top: 0;
}

h1 {
	margin: auto;
	color: #fff;
	text-align: center;
	font-size:190%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
}

.contents_eyecatch h1{
	width:80%;
}

p.catch {
	font-size: 40%;	
}


.p.of_name {
	font-size:80%;	
}

p.of_name.copyright {
    font-size:70%;
	white-space: nowrap;
	text-align:center;
}
	
ul.menu{
	display:none;
}

h2 {
	margin:0 auto 7%;
	
}


.white_box.vision{
	background-size: 300px auto;
	background-position: top 80px right 3%;

}

/* form */
label{
	cursor: pointer;
}

input,textarea{
	font-family:'Noto Sans JP',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-weight:300;
	padding:5px 4px;
	vertical-align: middle;

}

textarea{
	width:100%;
}



footer {
	padding: 8%;
	margin: 0;
}


footer h2 {
	width:100%;
}


footer .inner > div {
    width: 100%;
    margin: 0 auto;
    line-height: 1.6;
}

ul.ul_sitemap{
	float:none;
	width:98%;
}

.clearfix ul.ul_sitemap:first-child{
	margin-bottom:0;
	border-bottom:0;
}


}


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

.title p.catch {
    white-space:nowrap;
}


.white_box.vision {
	background-size: 300px auto;
	background-position: top 80px right 3%;
}

.contents_eyecatch h1 {
	width: 200px;
}

}

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

	
.gray_box {
    padding: 10% 2%;
}

.white_box{
    padding: 5% 0;	
}

.gray_box h2 {
	margin:0 auto 5%;
}
	
.grid2,.half{
	clear:both;
	width:100%;	
}

.grid2 {
	display:block;	
}

.white_box.vision .grid2 {
    width: 100%;
}

.grid1,.grid3 {
	width: 94%;
	margin: 0 3% 5%;
	clear: both;	
}

.inner{
	max-width:94%;
	margin:0 3%;	
}

.half {
    width: 100%;
    margin: 5% 0 3%;
}

.btn {
    margin: 5% auto;
}

.box_system {
	display: block;
	background: url(img/sp_system.png) no-repeat;
	background-size: cover;
    padding-top: 266%;
	width: 100%;
    margin: 0 auto;
	box-sizing: border-box;	
}

.bg_vision {
	padding: 12% 0;
}

.white_box.vision {
    background-size: 85% auto;
    background-position: top 90% right 50%;
	display:block;
	padding-bottom: 100%;
}

table th,
table td{	
	padding:7px 15px;
	display:block;
	width:100%;
}

table th{
	border-bottom: none;
}

}

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

.gray_box.contact {
	padding: 5% 3%;	
	
}

.contact p.tel{
	font-size: 170%;
	font-weight: 700;
}


}


/* ------------------------------------------  
CLEARFIX-HACK
------------------------------------------ */

header:after,
#header-inner:after,
#footer-inner:after,

section:after,
nav:after,
ul:after,
dl:after,
.inner:after,
.bn_area:after,

footer:after,

.grid3:after,
.box_white:after,
.box_blue:after,
.wrap_white:after,
.wrap_gray:after,
.business:after,
.reading:after,
.box_archive:after,
.entry-content:after,
.clearfix:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
font-size: 0;}


header,
#header-inner,
#footer-inner,
section,
nav,
ul,
dl,
.inner,
.bn_area,
footer,
.grid3,
.box_white,
.box_gray,
.business,
.entry-content,
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
/** html #header-inner,*/
* html header,
* html #header-inner,
* html #footer-inner,
* html section,
* html nav,
* html ul,
* html dl,
* html .inner,
* html .bn_area,
* html footer,
* html .grid3,
* html .box_white,
* html .box_gray,
* html .business,
* html .entry-content,
* html .clearfix{height: 1%;}

/*#header-inner,*/
header,
#header-inner,
#footer-inner,
section,
nav,
ul,
dl,
nav ul,
.inner,
footer,
.grid3,
.box_white,
.box_gray,
#pagemove,
.business,
.entry-content,
.clearfix{display: block;}
/* End hide from IE-mac */