@charset "utf-8";

/* -----------------------------------------------------------
	#header
		ヘッダー
----------------------------------------------------------- */

#header { height: 131px; background:#fff url("../img/share/headerLine.png") center bottom repeat-x; background-size: 2000px 10px; }

.headerInner{ width: 960px; margin: 0 auto; }
.headerLogo img{ width: 250px; height: 100px; margin-top: 10px; }
.headerContact{
	float: right; 
	margin-top: -117px; 
	line-height:2.3em;
}
.headerTel{ display: block; margin-bottom:-3px; }
.headerTel img{ width: 31px; height: 25px; margin-right: 10px; }
.headerTel a{ font-size: 3.2em; font-weight: bold; letter-spacing: 0.05em; line-height: normal; }
.headerTel a:link,.headerTel a:visited,.headerTel a:hover,.headerTel a:active{ color: #003a8f;}

.headerDayHours{ font-size: 1.4em; color: #fff; font-weight: bold; letter-spacing: 0.15em; line-height: normal;  text-align: center; display: block; background: #003a8f; border-radius:5px; padding: 0 0 2px 0; }

/* #gNav
----------------------------------------------------------- */
#header #gNav {
	overflow: hidden;
	margin-top: -42px; 
	float: right;
}

#header ul#gNav {
	display: flex;
	justify-content: flex-end;
}
#header ul#gNav li{
}
#header ul#gNav li a{
	padding: 0 0 0 40px;
	color: #003887;
	font-size: 1.5em;
	font-weight: bold;
	font-family: "M PLUS 1p";
}

/*============
nav
=============*/
/*　ハンバーガーボタン　*/
.hamburger {
  display : block;
  position: fixed;
  z-index : 3;
  right : 13px;
  top   : 12px;
  width : 62px;
  height: 62px;
  cursor: pointer;
  text-align: center;
  background: rgba(0,58,143,0.9);
  border-radius: 6px; 
  color: #fff; 
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 2px ;
  left    : 15px;
  background : #fff;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition   : 0.5s ease-in-out;
  transition        : 0.5s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}
.hamburger span:nth-child(4) {
  background : none;
  top: 35px; 
  left:10px;
}

/* ナビ開いてる時のボタン */
.hamburger.active{ 
  background: rgba(255,255,255,0.7);
}
.hamburger.active span:nth-child(1) {
  top : 22px;
  left: 16px;
  background : #fff;
  -webkit-transform: rotate(315deg);
  -moz-transform   : rotate(315deg);
  transform        : rotate(315deg);
  background : #333;
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top : 22px;
  left: 16px;
  background : #333;
  -webkit-transform: rotate(-315deg);
  -moz-transform   : rotate(-315deg);
  transform        : rotate(-315deg);
}
.hamburger.active span:nth-child(4){
	color: #333; 
}

nav.gNavSpMenu {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #fff;
  background: rgba(2,151,228,0.9);
  text-align: center;
  width: 100%;
  opacity: 0;
  transition: opacity .6s ease, visibility .6s ease;
  visibility: hidden;
}

nav.gNavSpMenu ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

nav.gNavSpMenu ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .4s all;
  border-bottom: 1px solid #fff;
}
nav.gNavSpMenu ul li:last-child {
  padding-bottom: 0;
}
nav.gNavSpMenu ul li:hover{
  background :#0089e0;
}

nav.gNavSpMenu ul li a {
  display: block;
  color: #fff;
  padding: 1em 0;
  font-size: 1.5em;
  text-decoration :none;
}

/* このクラスを、jQueryで付与・削除する */
nav.gNavSpMenu.active {
  opacity: 100;
  visibility: visible;
}

/* -- ふわっと表示 -- */
.sf {opacity: 0; transition: all 1s/*処理にかかる時間*/;}
.sf.done{opacity : 1; transform : translate(0, 0);}
.lf  {opacity: 0; transition: all 1s/*処理にかかる時間*/;}
.lf.done{opacity : 1; transform : translate(0, 0);}

/* -----------------------------------------------------------
	#footer
		フッター
----------------------------------------------------------- */
#footer { clear: both; background: #0297e3 url("../img/share/bg_footer.png") center top repeat-x; background-size: 1400px 150px; padding: 100px 0 70px 0; color: #fff; font-weight: bold;}
.footerInner{ width:960px; margin:0 auto; }

/* ナビ */
#footer ul.fNav { text-align: center; margin-bottom: 50px; }
#footer ul.fNav li { display: inline-block; }
#footer ul.fNav li:first-child a{  border-left: 2px solid #fff;}
#footer ul.fNav li a{ display:block; padding: 0 30px ; color: #fff; font-size: 1.2em; border-right: 2px solid #fff; line-height: 1.2em; }
#footer ul.fNav li.firstChild,#footer ul li:first-child {}

.footerContact{ display: flex; justify-content: space-between; width: 960px; }
.footerBox{ width:300px; height: 200px; overflow: hidden; }
.footerBox.add{  }
.footerBox.map{ }
.footerBox.day{ background: #fff; border-radius: 10px; text-align: center; color: #0297e3; padding:0px; }

/* 住所 */
#footer .add h2{ font-size:2.5em; margin-bottom: 20px; }
#footer .add p{ font-size:1.8em; letter-spacing: 0.1em; line-height: normal; margin-bottom: 20px; }
.footerTelIcon{ display: block; float: left; padding: 0px 10px 2px 10px; background: #fff; border-radius: 8px; font-size: 1.7em; font-weight: bold; color:#0297e3; margin: 0; }
.footerTel a{ display: block; font-size: 3.0em; letter-spacing: 0.05em; line-height: normal; margin: -10px 0 0  80px; }
.footerTel a:link,.footerTel a:visited,.footerTel a:hover,.footerTel a:active{ color: #fff;}

/* マップ */
.footerBox.map iframe{ border-radius: 10px; width:300px; height:200px; frameborder:0; border:0; }

/* 営業日 */
#footer .day h2{ font-size:1.9em; margin: 40px 20px 10px 20px; border-bottom: 2px dotted #eee;}
#footer ul.footerDay li{font-size:1.1em; letter-spacing: 0.1em; line-height: 1.3em; }

/* -----------------------------------------------------------
	.pegetop
		ページトップ 
----------------------------------------------------------- */
.pageTop{
	display: none; /*通常は非表示に*/ }
.pageTop a{ 
	animation: move1 3s linear infinite;
	display:block;
	cursor:pointer;
    position: fixed; /*固定表示*/
    bottom: 20em;
    right: 2em;
	text-align:center;
	line-height: 100px;
	width: 100px; height: 100px;
  	border-radius: 50%; 
	font-size: 1.2em;
	font-weight: bold;
	color: #fff; 
	background:rgba(2,151,228,0.8);
}

.pageTop span{
	animation: move2 3s linear infinite;
	display:block;
	cursor:pointer;
    position: fixed; /*固定表示*/
    bottom: 19em;
    right: 5.5em;
	text-align:center;
	line-height: 50px;
	width: 50px; height: 50px;
  	border-radius: 50%; 
	font-size: 1.2em;
	font-weight: bold;
	color: #fff; 
	background:rgba(199,242,252,0.6);}
.pageTop a			{ color: #fff; }
.pageTop a:link 	{ color: #fff; background: skyblue; transition :all  0.5s  ease; transition: .3s}
.pageTop a:visited	{ color: #fff; background: skyblue; }
.pageTop a:hover	{ color: #fff; background: skyblue; opacity: 0.6; filter: alpha(opacity=60); -moz-opacity:0.6;}
@keyframes move1 {
  0% { border-radius: 78% 69% 72% 81% / 65% 79% 75% 75%;  }
  30% { border-radius: 63% 63% 54% 63% / 69% 54% 62% 61%; }
  100% { border-radius: 78% 69% 72% 81% / 65% 79% 75% 75% ; }
}
@keyframes move2 {
  0% { border-radius: 78% 69% 82% 81% / 65% 89% 75% 75% ; }
  50% { border-radius: 78% 69% 82% 81% / 65% 89% 75% 75%; }
  100% { border-radius: 78% 69% 82% 81% / 65% 89% 75% 75% ; }
}