@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Heebo:400,500,700,800,900');

.sp {
  display: none
}

.pc {
  display: block
}

.br-sp {
  display: none;
}

@media screen and (max-width: 736px) {
  .site-wrap {
    overflow: hidden;
  }
  .sp {
    display: block
  }
  .pc {
    display: none
  }
  .br-sp {
    display: block;
  }
  .br-pc {
    display: none;
  }
	a:hover {
		opacity: 1.0;
    filter: alpha(opacity=100);
    -ms-filter: "alpha( opacity=100)";
	}
  body {
    width: 100%;
    min-width: 100%;
    position: relative;
    left: 0;
    overflow-x: hidden;
  }
	.bg_fixed {
		position: fixed;
		top: 0;
		left: 0;
	}
  .container {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
  }

  header {
    max-width: 100%;
    min-width: 100%;
    height: 15vw;
    z-index: 99;
    top: 0;
  }
	body.open header {
		background-color: rgba(255,255,255,1.0);
	}
  .header_inner {
    width: 100%;
    height: 15vw;
		margin: 0;
		padding: 0;
  }

	#nav-toggle {
	  position: absolute;
	  top: 1.5vw;
	  right: 0;
  	z-index: 101;
	  width: 15vw;
	  height: 13vw;
	  margin: 0;
	  padding: 0;
	  background-color: #fff;
	}
	#nav-toggle p {
	  font-size: 2.3vw;
	}
	#nav-toggle .pc {
	  display: none;
	}
	#nav-toggle .nav-toggle-line {
		position: relative;
	  width: 9vw;
	  left: 50%;
	  margin-left: -4.5vw;
	}
	#nav-toggle .nav-toggle-line span {
		position: absolute;
	  height: 3px;
	  margin-top: 0;
	}
	#nav-toggle .nav-toggle-line span:nth-child(1) {
	  top: 0;
	}
	#nav-toggle .nav-toggle-line span:nth-child(2) {
	  top: 2.5vw;
	}
	#nav-toggle .nav-toggle-line span:nth-child(3) {
	  top: 5vw;
	}
	/* #nav-toggle 切り替えアニメーション */
	.open #nav-toggle .nav-toggle-line {
	  left: 55%;
	}
	.open #nav-toggle .nav-toggle-line span:nth-child(1) {
	  -webkit-transform: rotate(315deg) translate(-30%, 200%);
	  -moz-transform: rotate(315deg) translate(-30%, 200%);
	  transform: rotate(315deg) translate(-30%, 200%);
	}
	.open #nav-toggle .nav-toggle-line span:nth-child(2) {
	  width: 0;
	  left: 50%;
	}
	.open #nav-toggle .nav-toggle-line span:nth-child(3) {
	  -webkit-transform: rotate(-315deg) translate(-20%, -100%);
	  -moz-transform: rotate(-315deg) translate(-20%, -100%);
	  transform: rotate(-315deg) translate(-20%, -100%);
	}

  .h_left {
    width: 64vw;
	}
  #h_logo {
    position: relative;
    left: 4vw;
		width: 55vw;
    height: 15vw;
		margin: 0;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		-o-align-items: center;
		align-items: center;
		white-space: nowrap;
  }
  #h_logo a {
    text-decoration: none;
    font-size: 6vw;
    font-weight: bold;
	}
	#h_logo a span {
		color: #009a43;
	}

  #h_logo img{
		vertical-align: top;
  }
	header .h_left ul {
		display: none;
	}
	header .h_right .h_right-inner {
		display: none;
	}
	header .tel {
		position: absolute;
		z-index: 998;
		top: 0;
		right: 15vw;
		width: 15vw;
    height: 15vw;
		background-color: #1291b4;
		background-image: url(../common_img/ico_tel.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 6.36vw 6.98vw;
	}
	header .tel a {
		display: block;
		width: 100%;
		height: 100%;
	}
	#mobile-head {
		position: fixed;
		z-index: 9999;
    top: 0;
    right: 0;
	}

	/* Gnav
	-------------------------------------------------- */
	.spnav__bnr {
		padding: 5%;
		background-color: #009a43;
	}

	#spnav {
	  position: fixed;
	  /* 開いてないときは画面外に配置 */
	  top: 15vw;
	  right: -100%;
	  width: 100%;
	  z-index: 20;
	  height: 100%;
	  overflow: scroll;
	  background-color: rgba(0,0,0,0.9);
	}
  #spnav > .inner {
  	background-color: #fff;
  }
  #spnav ul {
  	display: flex;
  	flex-flow: row wrap;
		justify-content: space-between;
    float: none;
    list-style: none;
    position: static;
    right: 0;
    bottom: 0;
    padding: 3%;
    border-bottom: 2px solid #009a43;
  }
  #spnav ul li {
    float: none;
    width: 43%;
  }
  #spnav ul li:nth-of-type(2n) {
    width: 57%;
  }
  #spnav ul li a {
    display: block;
    position: relative;
    padding: 2px 0 2px 1em;
    text-decoration: none;
		color: inherit;
		font-size: 1.2rem;
  }
  #spnav ul li a::before {
  	content: "";
  	position: absolute;
  	top: 9px;
  	left: 0;
    width: 6px;
    height: 6px;
    border-right: 1px solid #009a43;
    border-bottom: 1px solid #009a43;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
 #spnav ul li a.toggle::after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    right: 1em;
  }
  #spnav ul li a.toggle::after {
    width: 10px;
    height: 10px;
    margin-top: -6px;
    border-right: 2px solid #ffaf66;
    border-bottom: 2px solid #ffaf66;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #spnav .child {
    display: none;
  }
  #spnav .toggle.active:before {
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }
  #spnav .toggle.active:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  #spnav ul ul {
		display: none;
		background: #00609b;
  }
  #spnav ul ul li:last-child {
    border-bottom: none;
  }
  #spnav ul ul li a {
    display: block;
    padding: 10px 20px 10px 30px;
  }
	#spnav ul ul li a::before {
		position: absolute;
		content: '└ ';
		display: inline-block;
		top: 50%;
		transform: translateY(-50%);
		margin-left: -1.5em;
		color: #fff;
	}

  .spnav__btn a {
    display: block;
    position: relative;
    padding: 8% 0 8% 10vw;
    background: url(../common_img/ico_email.png) 17vw 50% / auto 10vw no-repeat #009A43;
    color: #FFF;
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
  }
  .spnav__btn a::before {
  	content: "";
  	position: absolute;
  	top: calc(50% - 7px);
  	right: 10%;
    width: 14px;
    height: 14px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

	#sec_contact {
		padding: 0 0 10px;
	}
	#sec_contact .outer {
		border-right: none;
		border-left: none;
		padding: 0 0 20px;
	}
	#sec_contact .outer::after {
		display: none;
	}
	#sec_contact .inner {
		padding: 0 3%;
	}
	#sec_contact .outer .ttl {
		position: relative;
		top: -11px;
	}
	#sec_contact .outer .ttl p {
		display: table-cell;
		vertical-align: middle;
		line-height: 1.3;
		font-size: 3vw;
	}
	#sec_contact .outer .ttl p span {
		font-size: 4.3vw;
	}
	#sec_contact .outer .ttl p b {
		font-size: 3.8vw;
	}

	#sec_contact .lead {
		margin-bottom: 3vw;
	}

	#sec_contact .tel {
		margin-top: 3vw;
	}
	#sec_contact .tel .txt {
		font-size: 5vw;
	}
	#sec_contact .tel .txt .num {
		font-size: 7vw;
	}
	#sec_contact .tel .txt .em {
		font-size: 8vw;
	}
	#sec_contact .tel p.number {
		font-size: 10vw;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	#sec_contact .tel p.number a {
		text-decoration: none;
	}
	#sec_contact .tel .number__icon img {
		height: 2.4rem;
	}

	#sec_contact .btn {
		width: 100%;
		margin: 0 auto;
	}
	#sec_contact .btn a {
		line-height: 13vw;
		font-size: 4.5vw;
		padding: 0 7vw;
	}
	#sec_contact .btn a::before {
		width: 5.42vw;
		height: 4.38vw;
	}
	#sec_contact .btn a::after {
		width: 1.10vw;
		height: 1.10vw;
		margin-top: -0.55vw;
	}


  footer {
		padding-bottom: 16vw;
  }
	footer .fnav {
		padding: 0 3.34vw;
	}
	footer .fnav-row {
		width: 100%;
		padding: 3% 0;
		border-top: 2px solid #fff;
	}
	footer .fnav-row:first-of-type {
		border-top: none;
	}
	footer .fnav ul {
		width: 50%;
		margin-left: 0;
	}
	footer .fnav li {
		font-size: 1.2rem;
		word-break: break-all;
	}
	footer .fnav li a {
		display: inline-block;
	}
	footer .fnav li a::before {
		top: 10px;
	}

	footer .fnav-row.last {
		width: 100%;
	}
	footer .fnav-row.last ul {
		display: flex;
    flex-flow: row wrap;
		width: 100%;
	}
	footer .fnav-row.last li {
		width: 50%;
	}

  .footer {
    padding: 15px 0 0;
	}
	.footer .logo {
		margin: 0 3% 3%;
	}

	.footer .btn {
		width: 41.67vw;
	}
	.footer .btn a {
		line-height: 9.69vw;
		font-size: 3.44vw;
	}

	.copyright {
		margin-top: 0;
		font-size: 1.88vw;
		text-align: center;
	}

	#footer_btn {
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 100;
	}
	#footer_btn li {
		border: 2px solid #009a43;
	}
	#footer_btn .tel {
		width: 64.5%;
		border-right: 1px solid #009a43;
	}
	#footer_btn .btn {
		width: 35.5%;
		border-left: 1px solid #009a43;
	}
	#footer_btn li a:hover img {
  	opacity: 1.0;
  	filter: alpha(opacity=100);
  	-ms-filter: "alpha( opacity=100)";
	}

	.page-top {
		right: 10px;
		bottom: 23vw !important;
	}
	.page-top a{
		width: 60px;
		height: 60px;
	}
  .page_top {
		position: relative;
		bottom: 0;
		right: auto;
  }
  .page_top a {
		position: relative;
		display: block;
		background-color: #1B1B81;
		color: #fff;
		font-size: 1.5rem;
		font-weight: bold;
		text-decoration: none;
		line-height: 19.32vw;
		padding: 0 7vw;
		width: 100%;
  }
	.page_top a::before {
		position: absolute;
		content: '';
		display: block;
		right: 1em;
		top: 50%;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 8px 10px 8px;
		border-color: transparent transparent #ffffff transparent;
	}

}