@charset "utf-8";

/* ===================
clearfix
===================*/
.clearfix:after {
	visibility:hidden;
	height:0;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
}


/* ===================
link
===================*/
a {
	outline: none;
}
a:link {
	text-decoration: none;
	color: #231815;
}
a:visited {
	text-decoration: none;
	color: #231815;
}
a:hover{
	text-decoration: underline;
	color: #8abea5;
	opacity: 0.7;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
a:hover img{
	text-decoration: none;
	opacity: 0.7;
	-webkit-transition: all .7s ease-in-out;
	-moz-transition: all .7s ease-in-out;
	-o-transition: all .7s ease-in-out;
	transition: all 0.7s ease-in-out;
}
a:active {
	text-decoration: none;
	color: #8abea5;
}

.main a:link {
	text-decoration: underline;
}


/*==========================================
 body
===========================================*/
html {
	font-size: 62.5%;
}
body {
	font-size:1.6rem;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #333;
	/*letter-spacing: 0.1rem;*/
}
@media (max-width: 992px){
	h1 {
		font-size:1.6rem;
	}
	h2 {
		font-size:2.0rem;
	}
	h3 {
		font-size:1.8rem;
	}
	h4 {
		font-size:1.6rem;
	}
	h5 {
		font-size:1.6rem;
	}
	p,ul,ol,dl,address{
		font-size:1.4rem;
	}
	table{
		font-size:1.4rem;
	}
}
@media (min-width: 993px){
	h1 {
		font-size:4.5rem;
	}
	h2 {
		font-size:3.6rem;
	}
	h3 {
		font-size:2.6rem;
	}
	h4 {
		font-size:1.8rem;
	}
	h5 {
		font-size:1.6rem;
	}
	p,ul,ol,dl,address{
		font-size:1.6rem;
	}
	table{
		font-size:1.6rem;
	}
}

@media (max-width: 992px){
	.hiden_sp {
		display: none;
	}
}
@media (min-width: 993px)  {
	.hiden_pc {
		display: none;
	}
}

/*
.content {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}
*/



/*====================================================================================
[header] common
=====================================================================================*/
@media (max-width: 992px)  {
	.header{
	  position: fixed;
	  z-index: 99;
		cursor: pointer;
		background-color: #fff;
		width: 100%;
	/*	padding-left: 15px;
		padding-right: 15px;*/
	}
}

@media (min-width: 993px)  {
	.header_all {
		position: fixed;
		z-index: 99;
		width: 100%;
		background-color: #fff;
	}
}


/*
#header{
  position: fixed;
  z-index: 99;
  cursor: pointer;
  background-color: #fff;
	padding-left: 15px;
	padding-right: 15px;
}
*/

/*	logo
------------------------------------------ */
.header .logo {
	float: left;
	margin-left: 15px;
	margin-right: 15px;
	line-height: 1;
	text-align: left;
}
.header .logo a{
	text-decoration: none!important;
}


/*====================================================================================
[header] sp
=====================================================================================*/
/*	header
------------------------------------------ */
@media (max-width: 992px)  {
  #header{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
	width:100%;
	height: 60px;
  }
}

/*	header_inner
------------------------------------------ */
.header_inner {
/*	max-width: 1230px;
	margin-left: auto;
	margin-right: auto;*/
}

/*	logo
------------------------------------------ */
@media (max-width: 992px){
	.header .logo .logoImg {
		width: 180px;
	}
}


/*	------------------------------------------
SP-nav
------------------------------------------ */
@media (max-width: 992px){
	.PC-nav {
		display: none;
	}
}

#g-nav{
  position:fixed;
  z-index: -1;
  opacity: 0;
  top:0;
  width:100%;
  height: 100vh;
  background:#231815;
  transition: all 0.3s;
}

#g-nav.panelactive{
  opacity: 1;
  z-index:999;
}

#g-nav.panelactive #g-nav-list{
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#g-nav > ul {
  display: none;
  position: absolute;
  z-index: 999;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
}
#g-nav.panelactive > ul {
  display: block;
}

.openbtn1{
  position:fixed;
  z-index: 9999;
  top:8px;
  right: 10px;
  cursor: pointer;
  width: 50px;
  height:50px;
}
.openbtn1 span{
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 14px;
  height: 2px;
  border-radius: 2px;
  background-color: #000;
  width: 45%;
 }
 .openbtn1.active span{
  background-color: #fff;
 }

.openbtn1 span:nth-of-type(1) {
  top:15px;
}
.openbtn1 span:nth-of-type(2) {
  top:22px;
}
.openbtn1 span:nth-of-type(3) {
  top:28px;
}
.openbtn1.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 45%;
}
.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}
.openbtn1.active span:nth-of-type(3){
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 45%;
}


/* gNav
------------------------------------------ */
@media (max-width: 992px){
	/* gNav */
	.SP-nav .gNav {
		clear: both;
		text-align: center;
		list-style: none;
		margin-top: 6.0rem;
		margin-bottom: 3.0rem;
	}
	.SP-nav .gNav li a{
		font-size: 1.4rem;
		font-weight: 500;
		padding:1.0rem  0rem;
		display: block;
		text-decoration: none;
		color: #fff;
	}
}



/*====================================================================================
[header] pc
=====================================================================================*/
/*  #header {
		display: none;
  }*/

/*	header_inner
------------------------------------------ */
@media (min-width: 993px){
	.header_inner {
		padding: 10px 15px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
}

/*	logo
------------------------------------------ */
@media (min-width: 993px) and (max-width: 1399px) {
	.header .logo {
		margin-top: 0.5rem;
		margin-left: 0;
		width: 200px;
	}
}
@media (min-width: 1400px) {
	.header .logo {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
		width: 350px;
	}
	.header .logo img{
		height: 50px;
	}
}



/*	------------------------------------------
PC-nav
------------------------------------------ */
@media (min-width: 993px){
	.SP-nav {
		display: none;
	}
	.PC-nav {
		width: 100%;
	}

	/* .PC-nav [gNav]
	------------------------------------------ */
	.PC-nav {
	/*	display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;*/
		margin-right: 15px;
	}
	.PC-nav .gNav {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		list-style: none;
	}
	.PC-nav .gNav li a {
		text-decoration: none;
		margin-left: 2.5rem;
		font-weight: 500;
	}

	.PC-nav .gNav li a.current {
		color: #7CAB94;
	}
}
@media (min-width: 993px) and (max-width: 1399px)  {
	.PC-nav {
		width: calc(100% - 250px);
		margin-top: 1rem;
		margin-right: 0;
	}
	.PC-nav .gNav li a {
		font-size: 1.3rem;
	}
}
@media (min-width: 1400px)  {
	.PC-nav {
		width: calc(100% - 450px);
		padding-top: 2.0rem;
	}
	.PC-nav .gNav li a {
		font-size: 1.6rem;
	}
}



/*==========================================
 [main]
===========================================*/
.main{
	padding-left: 15px;
	padding-right: 15px;
}
@media (max-width: 992px)  {
	.main {
		padding-top: calc(60px);
	/*	padding-bottom: 5.0rem;*/
	}
}
@media (min-width: 993px)  {
	.main {
		padding-top: calc(60px);
		/*padding-bottom: 8.0rem;*/
	}
}

img{
	vertical-align:top;
  max-width: 100%;
  height: auto;
}


/*-------------------------------------------
section
-------------------------------------------*/
@media (max-width: 992px)  {
	.main .content_wrap > section {
		margin-bottom: 8.0rem;
	}
}
@media (min-width: 993px)  {
	.main .content_wrap > section {
		margin-bottom: 12.0rem;
	}
}



/*-------------------------------------------
content_wrap
-------------------------------------------*/
/*@media (min-width: 992px) and (max-width: 1029px)  {*/
@media (min-width: 992px) and (max-width: 969px)  {
	.content_wrap {
		max-width: calc(100% - 30px) ;
		margin-left: auto;
		margin-right: auto;
	}
}
@media (min-width: 970px) and (max-width: 1920px) {
	.content_wrap {
		/*max-width: 1030px;*/
		max-width: 970px;
		margin-left: auto;
		margin-right: auto;
	}
}
@media (min-width: 1921px)  {
	.content_wrap {
		/*max-width: 1200px;*/
		max-width: 970px;
		margin-left: auto;
		margin-right: auto;
	}
}



/*==========================================
[CTA]
===========================================*/
.cta_wrap_bg {
	position: relative;
	background-image: url(../images/bg_cta.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
/*	padding-top: 4.74%;
	padding-bottom: 4.75%;*/
	border-radius: 20px;
	margin-bottom: 5.0rem;
}
/*
.cta_wrap_bg::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(99,81,60,0.7);
	z-index: 0;
}
*/

.cta_wrap{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
　text-align: center;
/*	padding-left: 15px;
	padding-right: 15px;*/
}
.cta_wrap h2 {
	text-align: center;
	font-weight: 500;
	color: #fff;
	margin-bottom: 3.4rem;
	line-height: 1;
}
@media (max-width: 992px)  {
	.cta_wrap_bg {
		background-size: cover;
		height: 180px;
		margin-left: 15px;
		margin-right: 15px;
	}
	.cta_wrap{
		width: 95%;
	}
	/*
	.cta_wrap h2:before{
		font-size: 2.4rem;
	}
	*/
}
@media (min-width: 993px)  {
	.cta_wrap{
	/*	min-width: 330px;*/
	}
	.cta_wrap_bg {
		background-size: contain;
		height: 280px;
	}
	.cta_wrap h2 {
		font-size: 4.0rem;
	}
	.cta_wrap h2:after{
		font-size: 1.6rem;
	}
}

/* btn */
.cta_wrap .btn{
	list-style: none;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.cta_wrap .btn a{
	background-color: #8abea5;
	text-align: center;
	padding: 14px 5px;
	display: block;
  text-transform: uppercase;
  color: #fff;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none!important;
  position: relative;
}
.cta_wrap .btn a i {
  float: right;
  margin-right: 0.5rem;
	margin-top: 0.4rem;
  position: absolute;
  right: 20px;
}
@media (max-width: 992px)  {
	.cta_wrap .btn a{
		width: 100%;
  }
}
@media (min-width: 993px)  {
  .cta_wrap .btn a{
		width: 100%;
		font-size: 125%;
  }
}



/*==========================================
[footer]
===========================================*/
.footer {
	font-weight: 400;
	background-color: #231815;
    color: #fff;
}


/*-------------------------------------------
footer_inner
-------------------------------------------*/
.footer_inner {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-top: 4.0rem;
	padding-bottom: 3.5rem;
}

.footer_inner address {
  font-style: normal;
  line-height: 1.6;
  font-size: 1.4rem;
}
.footer_inner address .footer_name {
  font-size: 1.8rem;
	margin-bottom: 1.0rem;
}
@media (max-width: 992px)  {
	.footer_inner address p {
	font-size: 1.2rem;
	}
}

.footer_tel {
	display: inline-block;
	margin-left: 0.75rem;
	margin-right: 0.75rem;
}
.footer_fax {
	display: inline-block;
	margin-left: 0.75rem;
	margin-right: 0.75rem;
}

/* copyright */
.copyright {
	clear: both;
	text-align: center;
	margin-top: 1.6rem;
}
.copyright small {
	font-size: 1.1rem;
}
