@charset "utf-8";


/* layout =============================================================

======================================================================== */


/* =====================================================================

	container
	
======================================================================== */


	.l-container-sp,
	.l-container-1920,
	.l-container-w,
	.l-container {
		margin-right: auto;
		margin-left: auto;
		}
	.l-container-sp:before, .l-container-sp:after,
	.l-container-1920:before, .l-container-1920:after,
	.l-container-w:before, .l-container-w:after,
	.l-container:before, .l-container:after {
		display: table;
		content: " ";
		}
	.l-container-1920:after,
	.l-container-w:after,
	.l-container:after {
		clear: both;
		}
	.l-container-1920 {
		overflow: hidden;
		}


	@media print, screen and (min-width: 768px) {
		body,
		.l-container-w {
			width: 100%;
			min-width: 1000px;
			}
		.l-container-1920 {
			width: 100%;
			min-width: 1000px;
			max-width: 1920px;
			}
		.l-container {
			width: 1000px;
			padding-left: 20px;
			padding-right: 20px;
			box-sizing: border-box;
			}
			.l-minWidth {
				min-width: 1000px;
				}
		.l-main {
			float: left;
			width: 620px;
			line-height: 1.8;
			word-wrap: break-word;
			}
		.l-sub {
			float: right;
			width: 300px;
			margin-bottom: 5.0rem;
			}
		
	}
	@media (max-width: 767px) {
		.l-container-w {
			width: 100%;
			}
		.l-container {
			width: 92%;
			}
		.l-container-sp {
			width: 92%;
			}
		.l-contents {
			padding-right: 3%;
			padding-left: 3%;
			}
		.l-main {
			line-height: 1.5;
			word-wrap: break-word;
			}
		.l-sub {
      margin-top: 50px;
			}

	}




/* =====================================================================

	header
	
======================================================================== */

.l-headerBase {
	width: 100%;
	}
.l-headerBase a {
	text-decoration: none !important;
	}

	@media print, screen and (min-width: 768px) {
		.l-headerBase {
			min-width: 1000px;
      min-height: 100px;
			position: fixed;
			z-index: 5000;
			top: 0;
      background-color: rgba(255,255,255,0.9);
			}

		/* hlogo */
		.l-headerBase h1 {
      position: absolute;
			width: 350px;
			left: 20px;
			top: 17px;
      z-index: 9403;
			}
    

		/* l-hnav */
		.l-hnav {
			display: block;
			position: absolute;
			right: 0px;
			top: 0;
			width: 400px;
			z-index: 9401;
			}
    
		.l-hnav .l-hnav-telfax {
      display: inline-block;
      width: 230px;
      height: 100px;
      margin-bottom: 0;
			}
    
		.l-hnav .l-hnav-contact {
      display: inline-block;
      width: 150px;
      height: 100px;
      margin-bottom: 0;
      z-index: 9403;
			}
      .l-hnav .l-hnav-contact a {
        display: block;
        width: 100%;
        height: 100%;
        background-color: #000;
        }
    
    
		/* l-gnav */
		.l-gnav {
      text-align: center;
			}
		.l-gnav > ul {
			list-style: none !important;
      margin: 40px auto 0px auto;
      padding: 0;
      display: inline-block;
			}
		.l-gnav > ul > li {
      display: inline-block;
			text-align: center;
			margin: 0;
      padding: 0;
			box-sizing: border-box;
      position: relative;
      z-index: 9402;
			}
		.l-gnav > ul > li a {
			height: 100%;
			box-sizing: border-box;
			padding: 5px 2px;
      margin: 0 5px;
			color: #231815;
			text-decoration: none;
			font-weight: bold;
			-webkit-transition: 1.0s;
			-moz-transition: 1.0s;
			-o-transition: 1.0s;
			-ms-transition: 1.0s;
			transition: 1.0s;
      position: relative;
			}

    .l-gnav > ul > li a::after {
      position: absolute;
      bottom: 10px;
      left: 0;
      content: '';
      width: 100%;
      height: 2px;
      background-color: #017a35;
      opacity: 0;
      transition: .3s;
      }
    .l-gnav > ul > li a:hover::after {
      bottom: 0;
      opacity: 1;
      }
	}
  @media screen and (min-width:1431px) and (max-width:1675px){
		.l-hnav .l-hnav-telfax {
      width: 210px;
      height: 60px;
			}
		.l-gnav > ul {
      margin-top: 65px;
      padding-left: 360px;
      padding-right: 160px;
			}
  }
  @media screen and (min-width:768px) and (max-width:1430px){
		.l-gnav > ul {
      margin-top: 110px;
      margin-bottom: 20px;
			}
  }
	@media (max-width: 767px) {
		.l-headerBase {
			height: 60px;
			position: fixed;
			z-index: 9440;
      background-color: rgba(255,255,255,0.9);
			top: 0;
  			}

		/* hlogo */
		.l-headerBase h1 {
			margin-left: 10px;
			}
		.l-headerBase h1 a {
      height: 60px;
			}
		.l-headerBase h1 img {
			max-width: 266px;
			width: 266px;
      width: -webkit-calc( 100% - 80px);
      width: -moz-calc(100% - 80px);
      width: calc(100% - 80px);
			height: auto;
			}
    
		.l-hnav,
		.l-gnav {
      display: none;
			}
	}



/* sp-menu >>> */
	@media print, screen and (min-width: 768px) {
		.button-open,
		.nav-content,
		.sp-hnav {
			display: none;
			}
	}
	@media (max-width: 767px) {

	/* button for spNav */
	.button-open {
		position: fixed;
		width: 50px;
		height: 50px;
		z-index: 9500;
		top: 8px;
		right: 5px;
		text-align: center;
		color: #000;
		box-sizing: border-box;
		}
		.button-open i {
			display: block;
			height: 2px;
			width: 31px;
			left: 9px;
			top: 22px;
			background: #000;
			-webkit-transition: background 0.5s;
					transition: background 0.5s;
			position: relative;
		}
		.button-open i:before,
		.button-open i:after {
			content: "";
			display: block;
			height: 2px;
			width: 31px;
			background: #000;
			position: absolute;
			-webkit-transform: rotate(0deg);
				-ms-transform: rotate(0deg);
					transform: rotate(0deg);
			-webkit-transition: all 0.3s !important;
					transition: all 0.3s !important;
			}
		.button-open i:before {
			-webkit-transform: translateY(10px);
				-ms-transform: translateY(10px);
					transform: translateY(10px);
			}
		.button-open i:after {
			-webkit-transform: translateY(-10px);
				-ms-transform: translateY(-10px);
					transform: translateY(-10px);
			}
		.button-open span {
			display: block;
			font-size: 1.0rem;
			margin-top: 30px;
			}

	
	.is-open .button-open i {
		background-color: transparent;
		}
		.is-open .button-open i:after {
			-webkit-transform: translateY(0px) rotate(-45deg);
				-ms-transform: translateY(0px) rotate(-45deg);
					transform: translateY(0px) rotate(-45deg);
					}
		.is-open .button-open i:before {
			-webkit-transform: translateY(0px) rotate(45deg);
				-ms-transform: translateY(0px) rotate(45deg);
					transform: translateY(0px) rotate(45deg);
					}


    /* sp-nav nav-content */
	#sp-nav {
		display: none;
		position: fixed;
		width: 100%;
		top: 60px;
		left: 0px;
		z-index: 9400;
		background: rgba(255,255,255,0.9);
		}
	.nav-content {
		}


	/* sp-hnav */
	.sp-hnav {
		padding: 15px 10% 30px 10%;
    list-style: none;
		}
	.sp-hnav li {
		text-align: left;
		width: 100%;
		padding: 5px 0;
		margin-bottom: 5px;
		}
	.sp-hnav li a {
		display: block;
		width: 100%;
		text-decoration: none;
		color: #000;
		font-weight: bold;
		}
		.sp-hnav li a::before {
			content: '\f0da';
			font-family: 'Font Awesome 5 Free';
			font-weight: bold;
			display: inline-block;
			margin-right: 10px;
      color: #017a35;
      }

	}



/* <<< sp-menu */






/* =====================================================================

	article / contents
	
======================================================================== */

  .l-article {
    overflow: hidden;
    }
	@media print, screen and (min-width: 768px) {
		.l-article {
      overflow: hidden;
			}
	}

	@media (max-width: 767px) {
		.l-article {
			}
	}




/* =====================================================================

	Section
	
======================================================================== */


	@media print, screen and (min-width: 768px) {
		.l-sectionL {
			padding-top: 100px;
			padding-bottom: 100px;
			}
		.l-section {
			padding-top: 60px;
			padding-bottom: 60px;
			}
		.l-sectionS {
			padding-top: 40px;
			padding-bottom: 40px;
			}
		.l-section-t {
			padding-top: 60px;
			}
		.l-section-b {
			padding-bottom: 60px;
			}
		.l-sectionS-t {
			padding-top: 40px;
			}
		.l-sectionL-t {
			padding-top: 100px;
			}
		.l-sectionS-b {
			padding-bottom: 40px;
			}
		.l-sectionL-b {
			padding-bottom: 100px;
			}
		.l-sectionLL-b {
			padding-bottom: 150px;
			}
	}

	@media (max-width: 767px) {
		.l-sectionL {
			padding-top: 50px;
			padding-bottom: 50px;
			}
		.l-sectionS,
		.l-section {
			padding-top: 30px;
			padding-bottom: 30px;
			}
		.l-sectionL-t {
			padding-top: 50px;
			}
		.l-sectionS-t,
		.l-section-t {
			padding-top: 30px;
			}
		.l-sectionLL-b,
		.l-sectionL-b {
			padding-bottom: 50px;
			}
		.l-sectionS-b,
		.l-section-b {
			padding-bottom: 30px;
			}
	}








/* =====================================================================

	footer
	
======================================================================== */

footer {
	clear: both;
  position: relative;
  text-align: center;
  background-color: #fff;
  overflow: hidden;
	}

  /* l-footer */
  .l-footer {
    background-color: #017a35;
		width: 100%;
		position: relative;
		color: #fff;
    border-top: #017a35 solid 1px;
		}
  .l-footer a {
		color: #fff;
    text-decoration: none;
		}
	.l-footer a:hover {
		color: #FFCC00;
		}
  .l-footer::before,
  .l-footer::after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    }
	@media print, screen and (min-width: 768px) {
    footer {
      padding-top: 400px;
      }
    .l-footer {
      padding: 180px 0 50px 0;
      }
		.l-footer::before,
		.l-footer::after {
      top: -200px;
			}    
		.l-footer::before {
			border-top: solid 100px transparent;
			border-left: solid 960px #017a35;
			border-bottom: solid 100px #017a35;
			border-right: solid 960px transparent;
			}
		.l-footer::after {
			border-top: solid 100px transparent;
			border-left: solid 960px transparent;
			border-bottom: solid 100px #017a35;
			border-right: solid 960px #017a35;
			}
	}
  @media (min-width: 1921px) {
 		.l-footer::before {
			left: 0;
			}
		.l-footer::after {
			right: 0;
			}
 	}
  @media (min-width:768px) and (max-width:1920px){
 		.l-footer {
      width: 1920px;
      margin-left: -20%;
      margin-left: -webkit-calc( (100% - 1920px) / 2 );
      margin-left: -moz-calc( (100% - 1920px) / 2 );
      margin-left: calc( (100% - 1920px) / 2 );
			}
		.l-footer::before {
			left: -960px;
			}
		.l-footer::after {
			left: 960px;
			}
	}
	@media (max-width: 767px) {
    footer {
      padding-top: 200px;
      }
    .l-footer {
      padding: 0px 0 50px 0;
      }
		.l-footer::before,
		.l-footer::after {
      top: -120px;
			}
		.l-footer::before {
      left: 0;
			border-top: solid 60px transparent;
			border-left: solid 500px #017a35;
			border-bottom: solid 60px #017a35;
			border-right: solid 500px transparent;
			}
		.l-footer::after {
			right: 0;
			border-top: solid 60px transparent;
			border-left: solid 500px transparent;
			border-bottom: solid 60px #017a35;
			border-right: solid 500px #017a35;
			}
	}


	/* logo */
  .l-footer h1 {
    z-index: 20;
    position: relative;
    }
	@media print, screen and (min-width: 768px) {
	}
	@media (max-width: 767px) {
    .l-footer h1 {
      margin-bottom: 20px;
      }
		.l-footer h1 img {
      width: 80%;
      max-width: 300px;
			}
	}


	/* Footer menu for pc */
  .l-fNav > ul > li {
  	padding: 2px 0px;
    }
	@media print, screen and (min-width: 768px) {
		.l-fNav {
      font-size: 1.5rem;
      z-index: 20;
      position: relative;
			}
		.l-fNav > ul {
			margin: 50px 0 130px 0;
      padding: 0;
			}
		.l-fNav > ul > li {
      display: inline;
      padding: 0 5px;
			}
	}
	@media (max-width: 767px) {
		.l-fNav {
      display: none;
			}
	}



  /* address */
  .l-footer address {
    font-style: normal;
    line-height: 1.8;
    }



	/* copyright */
	.l-copyright {
		text-align: center;
		}
	@media print, screen and (min-width: 768px) {
  	.l-copyright {
      background-color: #017a35;
  		color: #fff;
      padding: 0px 50px;
			}
  	.l-copyright span {
      display: block;
      width: 100%;
      height: 100%;
      border-top: rgba(255,255,255,0.5) solid 2px;
      padding: 15px 10px;
			}
	}
  @media (max-width: 767px) {
  	.l-copyright {
      background-color: #fff;
      padding: 15px;
      margin-bottom: 50px;
			}
  }



	/* mark */
  .l-fMark {
    position: absolute;
    z-index: 10;
    }
	@media print, screen and (min-width: 768px) {
  	.l-fMark {
      top: 350px;
      left: -130px;
			}
	}
  @media (max-width: 767px) {
  	.l-fMark {
      top: 50px;
      right: -50%;
			}
  	.l-fMark img {
      width: 60%;
			}
	}



	/* Pagetop */
	@media print, screen and (min-width: 768px) {
    .l-fBtn {
      position: absolute;
      z-index: 100;
      left: 50%;
      top: 230px;
      margin-left: -37px;
      }
	}
  @media (max-width: 767px) {
    .l-fBtn {
      display: none;
      }
	}



	/* Footer menu for sp */
	@media print, screen and (min-width: 768px) {
		#sp-nav,
		.l-fMenu-sp {
			display: none;
			}
	}
	@media (max-width: 767px) {
		.l-fMenu-sp {
			position: fixed;
			z-index: 9500;
			bottom: 0px;
			left: 0px;
			width: 100%;
			padding-bottom:env(safe-area-inset-bottom);
			}
		.l-fMenu-sp a {
			text-decoration: none;
			display: block;
			color: #fff;
			width: 100%;
			height: 50px;
      pointer-events: auto;
			}
		.l-fMenu-contact,
		.l-fMenu-tel {
      width: 33%;
			background-color: #017a35;
      border: #fff solid 1px;
			}
		.l-fMenu-pt {
      width: 34%;
			background-color: #4d4d4d;
      border: #fff solid 1px;
			}
		.l-fMenu-sp img {
      width: 30px;
      height: auto;
			}    
    
	}