@charset "utf-8";

/* DEFAULT
---------------------------------------------------------------------------*/
html {overflow-y: scroll;font-size: 62.5%; line-height:1.5;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {margin: 0;padding: 0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal !;}
table {border-collapse: collapse;border-spacing: 0;}
th {font-weight:lighter;}
caption, th {text-align: left;}
q:before ,q:after {content: '';}
object, embed, td, th {vertical-align: top;}
hr, legend {display: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;font-weight:lighter;}
img, abbr, acronym, fieldset {border: 0;}

li {list-style-type: none;}
img{vertical-align: bottom;}
p{line-height: 1.5; margin:0 0 1em;}
body {font-size:1.6rem;}

*, *:before, *:after { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}

div:after,ul:after,li:after,dd:after,section:after {content: ""; display: block; clear: both;}

img{max-width: 100%;height: auto;width /***/:auto;　}

a:hover img {opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";}

/* ALL
---------------------------------------------------------------------------*/
body {color: #333;font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; -webkit-text-size-adjust: 100%;}

#wrapper{ max-width:768px; margin:0 auto; text-align:center;}

.inner{ max-width:1100px; margin: 0 auto;}

.pad{padding:10px;}
.clear{clear:both;}
.clearfix { overflow:hidden; _zoom:1;}

/* LINK-STYLE
---------------------------------------------------------------------------*/
a:link{color: #0099FF;text-decoration: underline;}
a:visited{color: #0099CC;text-decoration: underline;}
a:hover{ color:#663399; text-decoration:underline;}
a:active{color:#663399;text-decoration: underline;}



/* HEADER
---------------------------------------------------------------------------*/
.l-header{ text-align:left; padding:10px 0; position:relative;}
.l-header__logo{ height:80px;}
.l-header__date{ float:right;text-align:left; border:2px #ddd solid; padding:10px;}
.l-header__company-name{ color:#009c74; font-weight:600; font-size:2.2rem; margin-bottom:5px; line-height:1;}
.l-header__tel{ color:#595757; font-size:1.5rem; font-weight:600; line-height:1.9;}
@media screen and (max-width: 1100px) {
	.l-header{padding:10px 10px; }
}
@media screen and (max-width: 900px) {
	.l-header__date{ padding:5px; margin-top:10px;}
	.l-header__tel{  font-size:1.3rem; line-height:2;}
}
@media screen and (max-width: 768px) {
	.l-header{ border-bottom:10px #eee solid;}
	.l-header__logo{ height:40px;}
	.l-header__date{ display:none;}
}





.l-gnav{ background:#009C74; font-size:1.4rem;}
.l-gnav__items{ display:table; table-layout : fixed ; width:100%;}
.l-gnav__items:after{ display:none;}
.l-gnav__item{ display:table-cell; text-align:center; border-right:1px #fff solid; color:#fff;}
.l-gnav__item:first-child{ border-left:1px #fff solid;}

.l-gnav__item a{ display:block; padding:8px 10px;}
.l-gnav__item a:link{color: #fff;text-decoration:none;}
.l-gnav__item a:visited{color: #fff;text-decoration:none;}
.l-gnav__item a:hover{ color: #fff; text-decoration:none; background:#00694e;}
.l-gnav__item a:active{color: #fff;text-decoration:none;}

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



#nav-drawer {
	display: none;
}

@media screen and (max-width: 768px) {
	 #nav-drawer{
		position: fixed;
		z-index: 1000;
		display: block;
		width:30px;
		border-bottom:none;
		background: none;
		top:0;
		right:0;

	}
}

#nav-drawer .logo {
	margin: 5px 10px;
	height: 50px;
}

.drawer__title {
	position: relative;
	padding: 7px 15px;
	background: #009c74;
	color: #fff;
	text-align: center;
	letter-spacing: 2px;
	font-weight: 700;
	font-size: 22px;
}

.close {
	position: absolute;
	top: 0;
	left: 10px;
	z-index: 999999;
	display: inline-block !important;
	display: none;
	padding: 10px 3px;
	color: #fff;
	cursor: pointer;
}

.close span {
	position: relative;
	display: inline-block;
	margin: 0 20px 0 7px;
	padding: 0;
	width: 3px;
	height: 30px;
	background:#fff;
	transition: .3s ease-in-out;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.close span::before {
	position: absolute;
	top: 50%;
	left: -13px;
	display: block;
	margin-top: -2px;
	width: 30px;
	height: 3px;
	background: #fff;
	content: "";
}

/*チェックボックス等は非表示に*/
.nav-unshown {
	display: none;
}

/*アイコンのスペース*/
#nav-open {
	display: inline-block;
	width: 30px;
	height: 22px;
	vertical-align: middle;
}

#nav-open {
	position: relative;
	width: 60px;
	height: 60px;
	background: #009c74;
	float: right;
}

#nav-open span:nth-of-type(1),
#nav-open span:nth-of-type(2),
#nav-open span:nth-of-type(3) {
	position: absolute;
	top: 13px;
	left: 13px;
	width: 34px;
	height: 2px;
	border-radius: 4px;
	background: #fff;
}

#nav-open span:nth-of-type(2) {
	top: 21px;
}

#nav-open span:nth-of-type(3) {
	top: 29px;
}

#nav-open span:nth-of-type(4) {
	position: absolute;
	top: 35px;
	width: 60px;
	color: #fff;
	text-align: center;
	font-weight: 600;
	font-size: 10px;
}

/*
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background: #BF495D;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}
*/
/*閉じる用の薄黒カバー*/
#nav-close {
	/*はじめは隠しておく*/
	position: fixed;
	top: 0;
	/*全体に広がるように*/
	right: 0;
	z-index: 99;
	display: none;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 9999;
	overflow: auto;
	/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;
	/*最前面に*/
	width: 90%;
	/*最大幅（調整してください）*/
	height: 100%;
	/*左に隠しておく*/
	background: #333;
	/*背景色*/
	transition: .3s ease-in-out;
	/*滑らかに表示*/
	-webkit-transform: translateX(105%);
	transform: translateX(105%);
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
	display: block;
	/*カバーを表示*/
	opacity: .5;
}

#nav-input:checked ~ #nav-content {
	/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
	-webkit-transform: translateX(0%);
	transform: translateX(0%);
}

#nav-content ul.drawer-main-navi {
	margin-bottom: 0;
	font-size:14px;
}

#nav-content ul.drawer-main-navi li span {
	display: block;
	padding: 15px 10px;
	color: $nav_drowar_navi_txt;
	text-decoration: none;
}

#nav-content ul.drawer-main-navi li {
	border-bottom: 1px #666 solid;
	padding: 10px 10px;
}

#nav-content ul.drawer-main-navi li a {
	display: block;
	padding: 6px 6px;
	color: #fff;
	text-decoration: none;
}
#nav-content ul.drawer-main-navi li a:visited,
#nav-content ul.drawer-main-navi li a:hover,
#nav-content ul.drawer-main-navi li a:active {
		color: #fff;
		text-decoration: none;
}
#nav-content ul.drawer-main-navi li a:before{
	font-family: "Font Awesome 5 Free";
	content: "\f0da";
	font-weight: 900 !important;
	margin-right:8px;

	}












/* CONTENTS
---------------------------------------------------------------------------*/
#container{}
#contents{}
#pankuzu{}


.l-contents{ padding:20px 10px 0; position:relative; max-width:800px; margin: 0 auto;}

h1{ font-weight:600; font-size:3.8rem; text-align:center; padding:10px;margin-bottom:20px; color:#009C74; line-height:1.3;}
h1 span{ display:block; font-size:1.6rem;font-weight:600; color:#aaa;}
@media screen and (max-width: 768px) {
	h1{  font-size:2.6rem;}
	h1 span{font-size:1.2rem;}
}

/* SIDE
---------------------------------------------------------------------------*/
#side{}

/* FOOTER
---------------------------------------------------------------------------*/
.l-fnav{ text-align:center; margin-bottom:40px; border-bottom:1px #CCCCCC solid; padding-bottom:20px;}
.l-fnav .title{ display:none;}
.l-fnav__items{ text-align:center; font-size:1.4rem;}
.l-fnav__item{  display:inline-block; margin-left:10px; margin-right:10px;}
.l-fnav__item:before{content:"\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right:3px;}
.l-fnav__item a{color:#333; text-decoration:none;}
.l-fnav__item a:hover{ text-decoration:underline;}

@media screen and (max-width: 768px) {
	.l-fnav{ border-bottom:none; margin-bottom:10px;}
	.l-fnav .title{ background:#009c74; font-weight:bold; font-size:1.2rem; text-align:center; color:#fff; padding:3px; display: block;}
	.l-fnav__items{ background:#f9f9f9;  text-align:left;}
	.l-fnav__item{ border-bottom: 1px #CCC solid; display:block; margin-left:0; margin-right:0;; padding:10px;}
	.l-fnav__item:before{ display:none;}
	.l-fnav__item a{ display:block; color:#333; text-decoration:none; padding:6px;}
	.l-fnav__item a:before{content:"\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right:8px;}
}




.l-footer{background:#F3F3F3; padding:20px; margin-top:40px;}
@media screen and (max-width: 768px) {
	.l-footer{padding:0; padding-bottom:20px; margin-top:40px;}
	
}
	
.l-footer__box{ margin:0 auto;}
.l-footer__logo{ float:left; border-right:1px #ccc solid; width:42%; padding-right:20px; text-align:right;}
.l-footer__logo img{ width:150px;}
.l-footer__address{ float:left; padding-left:20px; font-size:1.2rem; width:58%;}
.l-footer__address dt{ float:left; padding-right:1em; clear:both;}
.l-footer__address dd{ float:left; margin-bottom:1em;}
.p-address__br{ display:none;}


@media screen and (max-width: 768px) {
	.l-footer__box{}
	.l-footer__logo{ float:none; border-right:none; width:100px; margin:0 auto; padding-right:0; margin-bottom:20px;}
	.l-footer__address{ float:none; padding-left:0; font-size:1.2rem; width: auto; text-align:center;}
	.l-footer__address dt{ float:none; padding-right:0; clear:both; font-weight:600;}
	.l-footer__address dd{ float:none; margin-bottom:20px;}
	.p-address__br{ display: inline;}
	.p-address__span{ display:none;}
	
	
}



.c-copyright{ clear:both; text-align:center; font-size:1.2rem; margin-top:40px;}