/*
Template Name: Bootstrap Service Section
Author:  Abdullah Nahian
Author URI:
Version: 1.0

====/========        ===== ==/====/
             CSS Index
====/========        =======/====/

01. Common Css
02. Section Title CSS
03. Header Area CSS
04. Slider Area CSS
05. Slider Area CSS
06. Parallax Area CSS
07. Service Area CSS
08. Advertisement Area CSS
09. Portfolio Area CSS
10. Team Area CSS
11. Counter Up Area CSS
12. Price Area CSS
13. Testimonial Area CSS
14. Blog Area CSS
15. Contact Area CSS
16. Footer Area CSS

*/

/*
* ----------------------------------------------------
*   01. Reset CSS 
* ----------------------------------------------------
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

body, html{
	height:100%；
}
.alignleft {
    float: left;
    margin-right: 15px;
}
.alignright {
    float: right;
    margin-left: 15px;
}
.aligncenter {
    display: block;
    margin: 0 auto 15px;
}
img {
    /*max-width: 100%;*/
    height: auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 15px;
    color: #373737;
    font-weight: 400;
    line-height: 1.3
 }
 p{
	 color:#373737
 }

body { 
	font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    color: #000;
    line-height: 1.8
}
a:hover { 
    text-decoration: none;
}
a:focus, input:focus, textarea:focus, button:focus { 
    outline: 0 solid;
    text-decoration: none;
}
.row {
	padding: 0 15px;
}
.no-gutters {
	padding: 0;
}
html { scroll-behavior: smooth;}
/*
* ----------------------------------------------------
*   02. Common Css 
* ----------------------------------------------------
*/


body {
  
font-family: 'Noto Sans JP', sans-serif;
  background-color: #fff;
  height: 200vh;
  position: relative; }
  body:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    opacity: 0;
    visibility: hidden;
    z-index: 1; }
  body.offcanvas-menu:before {
    opacity: 1;
    z-index: 1002;
    visibility: visible; }

p {
  color: #353535;
  font-weight: 300; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; }

a {
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease; 
}
  a, a:hover {
    text-decoration: none !important; }

@media(min-width: 768px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}

.text-green{
	color: #008131;
}

h5.text-green{
	color: #008131;
	font-size: 18px;
}



.btn2,
a.btn2,
button.btn2 {
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.5;
  display: inline-block;
  padding: 5px 15px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  color: #212529;
  border-radius: 0.5rem;
  border: 1px solid #ccc;
}
.btn3,
a.btn3,
button.btn3 {
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.5;
  display: inline-block;
  padding: 5px 15px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  color: #008131!important;
  border-radius: 100vh;
  border: 2px solid #008131;
}


a.btn-pc-sp {
  line-height: 1.4;
  border-radius: 100vh;
  color: #ffff;
  padding: 0.5em 3em;
}

a.btn-pc-sp--contact {
    color: #FFFF99 !important;
    background: #6BA430;
    border: #FFFF99 2px solid;
}
a.btn-pc-sp--contact:hover {
	opacity:0.8;
}

.nature-brn a {
	color: #008131!important;
  font-size: 1.1rem;
  font-weight: 700;
	margin-left: 1rem;
}
.nature-brn a:hover {
	color: #0462F7;
}
@media screen and (max-width: 640px) {
	.nature-brn{
		text-align: center!important;
	margin-top: 15px;
	}
.nature-brn a {
	color: #008131!important;
	font-size: 1.1rem;
	font-weight: 700;	
}
.btn2,
a.btn2,
button.btn2 {
  padding: 2px 10px;
}
.btn3,
a.btn3,
button.btn3 {
  padding: 2px 10px;
}
}
/*
* ----------------------------------------------------
*   03. Section Title CSS
* ----------------------------------------------------
*/

section {
	padding:0  0 40px 0;
}
.top-section-title {
  text-align: center;
  margin: 40px 0;
}
.top-section-title h2 {
	position: relative;
	display: inline-block;
	padding-bottom: 15px;
  color: #008131;
	font-size: 1.4rem;
}
.top-section-title h2:before {
  position: absolute;
  content: "";
  width: 80px;
  height: 3px;
  background-color: #6eab23;
  bottom: 0;
  left: 50%;
  margin-left: -40px;
}
.top-section-title h2:after {
	position: absolute;
	content: "";
	width: 60px;
	height: 3px;
	background-color:#ccd00a;
	left: 50%;
	bottom: -10px;
	margin-left: -30px;
}




.e-title{
	position: absolute;
	top:-5px;
	left: 80px;
	color: #ccd00a;
	letter-spacing: .2em;
	font-size: 12px;
}

.section-title {
  text-align: left;
  margin: 40px 0;
	position: relative;
}
.section-title_h2 {
  text-align: left;
  margin: 80px 0;
	border: 1px solid #6eab23;
	height: 47px;
}
.section-title_h2 h2 {
  position: relative;
  font-size: 1.2rem;
  height: 45px;
  margin-right: 50%;
  padding: .6rem .6rem .6rem .8rem;
  word-break: break-all;
  color: #fff;
  background: #008131;
	
}

.section-title_h2 h2:after {
  position: absolute;
  top: 0;
  right: -35px;
  width: 0;
  height: 0;
  content: '';
  border-width: 45px 35px 0 0;
  border-style: solid;
  border-color: #008131 transparent transparent transparent;
}




.section-title h3 {
  position: relative;
  overflow: hidden;
  padding: 1rem 1rem 0rem 80px;
  border-bottom: 3px solid #ccd00a;
  font-size: 1.6rem;
}

.section-title h3:before {
  position: absolute;
  top: -150%;
  left: -100px;
  width: 118px;
  height: 300%;
  content: '';
  -webkit-transform: rotate(25deg);
  transform: rotate(25deg);
  background: #008131;
}
.section-title h3:after {
  position: absolute;
  top: -150%;
  left: 25px;
  width: 32px;
  height: 300%;
  content: '';
  -webkit-transform: rotate(25deg);
  transform: rotate(25deg);
  background: #6eab23;
  border-right: 15px solid #ccd00a;
}

.section-title h3 span {
  font-size: 2rem;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  display: block;
  padding-top: 3px;
  padding-left: 10px;
  color: #fff;
}


.section-title h4 {
  font-size: 18px;
	font-weight: 500;
  padding: .5rem;
  border-top: 3px double #ccd00a;
  border-bottom: 3px double #6eab23;
}





ul.check {
  border: double 4px #6eab23;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
  color: #22ac38;
  border-radius: 10px;
  background: #fff;
}
ul.check:before {
  font-size: 1rem;
  position: absolute;
  top: -28px;
  left: 5px;
  height: 24px;
  padding: 0 1em .5em 1em;
  content: '\POINT';
  color: #fff;
  border-radius: 10px 10px 0 0;
  background: #6eab23;
}

ul.check li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
	color: #202020;
}
ul.check li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: #6eab23; /*アイコン色*/
}
ul.check2 {
  border: double 4px #CDDABD;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
  color: #22ac38;
  border-radius: 10px;
  background: #fff;
}
ul.check2 li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
	color: #202020;
}
ul.check2 li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: #6eab23; /*アイコン色*/
}


ul.check3 li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
	color: #202020;
}
ul.check3 li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 2em; /*左端からのアイコンまで*/
  color: #6eab23; /*アイコン色*/
}

ul.check4 {
  border: double 4px #CDDABD;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
  color: #22ac38;
  border-radius: 10px;
  background: #fff;
}
ul.check4 li {
  line-height: 1.5;
  padding: 0.5em 0;
	color: #202020;
  list-style-type: none!important;/*ポチ消す*/
}
ul.check4 li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: #6eab23; /*アイコン色*/
}

ul.check4 ul.check4-1 li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 3.2em; /*左端からのアイコンまで*/
  color: #F6AF1A; /*アイコン色*/
}

ul.check5 {
  border: double 4px #008131;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
  color: #22ac38;
  border-radius: 10px;
  background: #fff;
}

ul.check5 li {
  line-height: 1.5;
  padding: 0.5em 0;
	color: #202020;
  list-style-type: none!important;/*ポチ消す*/
}
.num_cat {
	font-size: 18px;
	font-weight: bold;
	color: #008131;
}

ol.maru_number {
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
  margin: 0;
  border: double 4px #CDDABD;
  padding: 0.5em 1em 0.5em 1em;
  position: relative;
  border-radius: 10px;
  background: #fff;

}
ol.maru_number li {
  padding-left: 30px;
  position: relative;
  margin-bottom: 3px;
}
ol.maru_number li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color: #008131;
  border: 1px solid;
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 26px;
  width: 26px;
  color: #ffffff;
  font-size: 85%;
  line-height: 1;
  position: absolute;
  top: 4px;
  left: 0;
}

ol.alphabet{
	list-style-type: upper-latin;
	padding-inline-start: 15px!important;
}
ol.roman{
	list-style-type: upper-roman;
	padding-inline-start: 15px!important;
}
.emphasis {
     border-bottom: 2px solid #000;
}

.table.tbl-r02 th, .table.tbl-r02 td {
    border-top: none!important;
}
table.tbl-r02 {
  margin: 20px auto;
	width: 100%;
}
.tbl-r02 th {
  background: #fff;
  border-bottom: solid 1px #ccc;
  color: #008131;
  padding: 10px;
    width: 20%;
}
.tbl-r02 th span {
	padding-left: .5em;
  border-left: solid 5px #008131;
}
.tbl-r02 td {
  background: #fff;
  border-bottom: solid 1px #ccc;
  color: #222;
  padding: 10px;
    width: 80%;
}
.tbl-r02 .last th {
  border-bottom: none;
}
.tbl-r02 .last td {
  border-bottom: none;
}


.bg-green{
  background: #7fab55;
	color: white;
}
.bg-green2{
  background: #e5eedb;
}
.bg-green3{
  background: #DBECEE;
}
 
@media screen and (max-width: 640px) {
  
  .tbl-r02  {
    width: 80%;
  }
  .tbl-r02 th{
    display: block;
    width: 100%;
  }
	.tbl-r02 td{
    display: block;
    width: 100%;
  border-bottom: none!important;
  }
	.tbl-r02 .last th {
  border-bottom: solid 1px #ccc;
}
}
@media screen and (max-width:650px) {
	section {
	padding:0px 0;
}
	.section-title {
  margin: 30px 0;
}
	.section-title_h2 {
  margin: 30px 0;
}
	.section-title_h2 h2 {
  font-size: 1.2rem;
  /*height: 55px;*/
  margin-right: 30%;
  padding: .6rem .6rem .6rem .8rem;
  word-break: break-all;
  color: #fff;
  background: #008131;
		line-height: 1.1em;
	
}
	.section-title h3 {
  padding: .5rem 1rem 0rem 60px;
  border-bottom: 3px solid #ccd00a;
  font-size: 1.2rem;
}
	.section-title h3 span {
  font-size: 1.6rem;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  display: block;
  padding-top: 3px;
  padding-left: 10px;
  color: #fff;
}
	.e-title{
	position: absolute;
	top:-7px;
	left: 65px;
	color: #ccd00a;
	letter-spacing: .2em;
	font-size: 11px;
}
a.btn-pc-sp {
  padding: 0.3em 1.5em;
}

}

/*
* ----------------------------------------------------
*   04. Header Area CSS
* ----------------------------------------------------
*/
.navbar {
  padding:0!important;
}
 /*.navbar-dark .navbar-toggler-icon{
  三本線 
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}*/

	  /* ハンバーガーメニュー回転式  */
.navbar-dark .navbar-toggler {
  border-color: rgba(0, 0, 0, 0);
  outline: none;
}
 
.navbar-dark .navbar-toggler-icon {
  background-image: none;
}
 
.navbar-toggler-icon {
  position: relative;
  width: 40px;
  height: 40px;
  background: none;
  appearance: none;
  cursor: pointer;
 
  }
  .navbar-toggler-icon span {
    display: inline-block;
    transition: all 0.4s;
    box-sizing: border-box;
  }
 
  .navbar-toggler-icon span {
    position: absolute;
    left: 5px;
    width: 80%;
    height: 2px;
    background-color: rgba(165, 165, 165, 1);
    border-radius: 1px;
}
 

  .navbar-toggler-icon span:nth-of-type(1) {
      top: 8px;
    }
 .navbar-toggler-icon span:nth-of-type(2) {
      top: 20px;
    }
 .navbar-toggler-icon span:nth-of-type(3) {
      top: 32px;
    }
 

 
 .navbar-toggler[aria-expanded="true"] 
 .navbar-toggler-icon span:nth-of-type(1) {
      transform: translateY(12px) rotate(-315deg);
    }
.navbar-toggler[aria-expanded="true"] 
 .navbar-toggler-icon span:nth-of-type(2) {
      opacity: 0;
    }
.navbar-toggler[aria-expanded="true"] 
 .navbar-toggler-icon span:nth-of-type(3) {
      transform: translateY(-12px) rotate(315deg);
    }




/* adds some margin below the link sets  */

/*==矢印の設定*/
.dropdown-toggleB::before {
    display: inline-block!important;
    margin-left: 0em!important;
    margin-right: 0.5em!important;
    vertical-align: 0em!important;
    content: ""!important;
  font-family: FontAwesome!important;
  content: '\f054'!important; /* アイコンのunicode */
	color: #008131;
}

.dropdown-toggleB:hover::before {
  transform:rotate(90deg);
} 



.navbar .dropdown-menu div[class*="col"] {
   margin-bottom:1rem;
}

.navbar .dropdown-menu .container {
	display: inherit!important;
}


.navbar .dropdown-menu {
  border:none!important;
  background-color:#fff!important;
  color: #999!important;
  border-radius:0 0 0.25rem 0.25rem!important;
  font-size: .9rem!important;
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .1)!important;
}
.navbar .dropdown-menu h5{
  border-bottom: dotted 1px #ddd;
  color:#3F5C0A;
	font-size: 1rem!important;
}
  /* shows the dropdown menu on hover */
.navbar .dropdown a:hover {
  display:block;
  visibility: visible;
  opacity: 1;
	color: #008131!important;
  transition: visibility 0s, opacity 0.3s linear;
}
 
.navbar .dropdown .dropdown-menu a:hover {
  display:block;
  visibility: visible;
  opacity: 1;
	color: #008131!important;
  transition: visibility 0s, opacity 0.3s linear;
}
 
/* breakpoint and up - mega dropdown styles */
@media screen and (min-width: 992px) {
  
  /* remove the padding from the navbar so the dropdown hover state is not broken */
.navbar {
  padding-top:0px;
  padding-bottom:0px;
}

/* remove the padding from the nav-item and add some margin to give some breathing room on hovers */
.navbar .nav-item {
  padding:.5rem .5rem;
  margin:0 .25rem;
}

/* makes the dropdown full width  */
.navbar .dropdown {position:static;}

.navbar .dropdown-menu {
  width:100%;
  left:0;
  right:0;
/*  height of nav-item  */
  top:81px!important;
  
  display:block;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s linear;
  
}
  

  
  /* shows the dropdown menu on hover */
.navbar .dropdown:hover .dropdown-menu, .navbar .dropdown .dropdown-menu:hover {
  display:block;
  visibility: visible;
  opacity: 1;
	color: #2C2C2C!important;
  transition: visibility 0s, opacity 0.3s linear;
}
  
  .navbar .dropdown-menu {
    background-color: #fff!important;
	  
  }
	
 /* sdropdown menu point */
	ul.nav li {
  position: relative;
}
ul.nav li::after {
  display: block;
  content: '';
  position: absolute;
  top: 1.8em;
  left: 0em;
  width: 7px;
  height: 7px;
  border-right: 2px solid #008131;
  border-bottom: 2px solid #008131;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

}


@media (max-width:991px)  {
	
.navbar .dropdown-menu {
  box-shadow: none!important;
  font-size: .85rem!important;
  }
/* sdropdown menu point */
	ul.nav li {
  position: relative;
		margin-left: 1.5em;
}
ul.nav li::after {
  display: block;
  content: '';
  position: absolute;
  top: 1.2em;
  left: -1em;
  width: 7px;
  height: 7px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

}
@media screen and (max-width:650px) {
/* sdropdown menu point */
	ul.nav li {
  position: relative;
		margin-left: 1.5em;
}
ul.nav li::after {
  display: block;
  content: '';
  position: absolute;
  top: .7em;
  left: -1em;
  width: 7px;
  height: 7px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
}


.logo {
	width: 302px;
	height: auto;
}


.top-bar {
	border-top: solid 3px #008131;
  padding: .5rem 0;
  background: #fff; }
  .top-bar a {
    color: #666666; }

  .top-bar a {
    color: #666666; }

.foot-bar {
  padding: .5rem 0;
  background: #fff; }

@media screen and (max-width:650px) {
	.top-bar {
	border-top: solid 3px #008131;
  padding: .1rem 0;
  background: #eee;
	}
	/*.top-bar .mail {
		font-size: 1.6rem!important;
	}*/
	.top-bar .phone {
		font-size: 1.4rem!important;
	}	
	.nav-link {
    display: block;
    padding: 0.1em .5em!important;
}
	.navbar .dropdown-menu h5{
	font-size: .8rem!important;
	margin-bottom:0!important;
	margin-top:0!important;
}
	.foot-bar {
  padding: .2rem 0;
  background: #fff; }
}


.sticky-wrapper {
  position: relative;
  z-index: 100;
  width: 100%; }
  .sticky-wrapper .site-navbar {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease; }
  .sticky-wrapper .site-navbar {
    background: #fff; }
    .sticky-wrapper .site-navbar .site-logo a {
      color: #fff; }
    .sticky-wrapper .site-navbar ul li a {
      color: rgba(0, 0, 0, 0.7) !important; }
      .sticky-wrapper .site-navbar ul li a.active {
        color: #000 !important; }
  .sticky-wrapper.is-sticky .site-navbar {
    background: #fff;
    -webkit-box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2); }
    .sticky-wrapper.is-sticky .site-navbar .site-logo a {
      color: #007bff; }
    .sticky-wrapper.is-sticky .site-navbar ul li a {
      color: #000 !important; }
      .sticky-wrapper.is-sticky .site-navbar ul li a.active {
        color: #007bff !important; }
  .sticky-wrapper .shrink {
    padding-top: 0px !important;
    padding-bottom: 0px !important; }
    @media (max-width: 991.98px) {
      .sticky-wrapper .shrink {
        padding-top: 30px !important;
        padding-bottom: 30px !important; } }

.navbar-dark .navbar-toggler {
    color: #000!important;
     border-color: rgba(255, 255, 255, 0)!important ;
}

.navbar-brand {
    /* display: inline-block; */
    padding-top: 0.3125rem;
    padding-bottom: 0.3125rem;
    margin-right: 1rem;
	min-width: 185px!important ;
	height: auto;
    line-height: inherit;
    white-space: nowrap;
}
@media (max-width:991px) {
    .navbar-brand {
	max-width: 125px!important ;
	height: auto;
	}
}

/*--------------------------------------------------------------
# video_slider Section
--------------------------------------------------------------*/
#lab_video_slider {
	margin-top:0!important;
	padding-top:0!important;
}

.swiper-container {
  width: 100%;
  height: 100%;
	padding: 0px!important;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

/* Text Overlay */
#lab_video_text_overlay h2 {
  font-size:4em
}

#lab_video_text_overlay .btn {
  border-radius:0;
  text-transform:uppercase;
  font-weight:200;
}
#lab_video_text_overlay .btn-warning {
  background-color:#F5D328;
}

#lab_video_text_overlay {
  position: absolute;
  color: #FFF;
  width: 100%;
  top: 40%;
}

#lab_video_text_overlay .container {
  text-align: center;
  margin: 0px auto;
}

@media screen and (max-width:991px) {
  #lab_video_text_wrap {
    height: 300px;
  }
}

@media screen and (max-width:650px) {
  #lab_video_text_wrap {
    height: 250px;
  }
  #lab_video_text_overlay h3 {
    font-size: 1em;
  }
  #lab_video_text_overlay p {
    font-size: .6em;
  }
}

/*
* ----------------------------------------------------
*   05. Slider Area CSS
* ----------------------------------------------------
*/


.hero {
  height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; }



/*
Removes white gap between slides - chagnge to base color of slide images
*/
.carousel {
  background:#007aeb;
}

/*
Forces image to be 100% width and not max width of 100%
*/
.carousel-item {
  width:100%;
}

.carousel-item .img-fluid {
  width:100%;
}

/* 
anchors are inline so you need ot make them block to go full width
*/
.carousel-item a {
  display: block;
  width:100%;
}

/*
* ----------------------------------------------------
*   06. Parallax Area CSS
* ----------------------------------------------------
*/


.jumbotron{margin-bottom: 0; position: relative;}

.parallax {
  /* Set a specific height */
  height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Paragraph for Parallax Section */ 
.parallax p {
font-size: 24px;
color:#f5f5f5;
text-align: center;
line-height: 60px;
}
 
/* Heading for Parallax Section */ 
.parallax h1 {
text-transform: uppercase;
color: rgb(255, 255, 255);
font-size: 40px;
text-align: center;
padding-top: 60px;
line-height: 100px;
}

#parallax-static {
    background-image: url("https://cdn.pixabay.com/photo/2016/11/29/04/19/beach-1867285_1280.jpg");
}

#parallax-slightly-moving {
    background-image: url("https://cdn.pixabay.com/photo/2015/09/09/16/05/forest-931706_1280.jpg");
}
#parallax-slightly-moving::after {
  /* Display and position the pseudo-element */
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  /* Move the pseudo-element back away from the camera,
   * then scale it back up to fill the viewport.
   * Because the pseudo-element is further away, it appears to move more slowly, like in real life. */
  /*transform: translateZ(-1px) scale(1.5);*/
  /* Force the background image to fill the whole element. */
  background-size: 100%;
  /* Keep the image from overlapping sibling elements. */
  z-index: -1;
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 120px 0 120px 0;
  min-height: 30vh;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
	margin-bottom: 30px;
}

.breadcrumbs:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.1);
  position: absolute;
  inset: 0;
}

.breadcrumbs h2 {
  font-size: 28px;
  font-weight: 500;
  color: transparent;
 letter-spacing: .3em;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

@media screen and (max-width:650px) {
	.breadcrumbs {
  padding: 60px 0 60px 0;
	}
	.breadcrumbs h2 {
  font-size: 23px;
}
}

/*
* ----------------------------------------------------
*   07. Service Area CSS
* ----------------------------------------------------
*/
 .parent_box, .parent_box2, .parent_box3 {
  display: flex!important;
  display: -webkit-box;
  display: -ms-flexbox;
}
.single-service {
  text-align: center;
  border: 1px solid #ddd;
  padding: 25px 20px;
  -webkit-transition:.4s;
  transition: .4s;
margin-bottom:20px;
}
.single-service h6{
	color: #008131;
}

.single-service i.fa {
  width: 60px;
  height: 60px;
  font-size: 30px;
  line-height: 60px;
  border: 1px solid #008131;
  margin-bottom: 30px;
  border-radius: 50%;
  color: #008131;
  -webkit-transition:.4s;
  transition: .4s;
}
.single-service:hover i.fa {
  background-color: #6eab23;
  color: #fff;
  border-color: #008131;
}
.single-service:hover {
  box-shadow: -3px 3px 3px 0px #ddd;
	background: linear-gradient(#efefd7, #6eab23);
  border: 1px solid #ccd00a;
}
.single-service:hover p {
	color: #222;
}

@media screen and (max-width:650px) {
	.parent_box, .parent_box2, .parent_box3 {
		display:table-cell!important;
}
}
.single-service2 {
  text-align: center;
  border: 1px solid #ddd;
  padding: 20px 20px 0 20px;
  -webkit-transition:.4s;
  transition: .4s;
margin-bottom:10px;
	
	width: 100%;
}
.single-service2 h6{
	color: #008131;
	border-left: 4px solid #008131;
	padding-left: .5em;
	font-weight: 800;
	font-size: 18px;
}

.single-service3 {
  text-align: center;
  border: 1px solid #ddd;
  padding: 20px 20px 0 20px;
  -webkit-transition:.4s;
  transition: .4s;
margin-bottom:20px;
	background-color: #EFF6BF;
	width: 100%;
}
.single-service3 h6{
	color: #008131;
	border-left: 4px solid #008131;
	padding-left: .5em;
}

.single-service4 {
  text-align: center;
  border: none;
  padding: 20px 20px 0 20px;
  -webkit-transition:.4s;
  transition: .4s;
margin-bottom:20px;
	background-color: #fff;
	width: 100%;
}
.single-service4 h6{
	color: #008131;
	border-left: 4px solid #008131;
	padding-left: .5em;
}
/*
* ----------------------------------------------------
*   07. News Area CSS
* ----------------------------------------------------
*/

#news-content #section-01 #release-list ul,
#news-content #section-02 #topics-list ul {
	margin:5px;
	list-style: none!important;
	text-align: left!important;
    padding-inline-start: 0px!important;
}

#news-content #section-01 #release-list ul li,
#news-content #section-02 #topics-list ul li {
	padding:0 0 10px 15px;
	line-height: 1.2em;
	background:no-repeat 0 0.4em;
	
}

#news-content #section-01 #release-list ul li {background-image:url(../common/img/icon_disc_01.png);}
#news-content #section-02 #topics-list ul li {background-image:url(../common/img/icon_disc_02.png);}

#news-content #section-01 #release-list ul li a,
#news-content #section-02 #topics-list ul li a {
	color: #3A3A3A;
	text-decoration: none;
}
#news-content #section-01 #release-list ul li a:hover,
#news-content #section-02 #topics-list ul li a:hover{
	color: #92B74F;
	text-decoration: none;
}

#news-content #section-01 #release-list ul li a:hover,
#news-content #section-02 #topics-list ul li a:hover {
	text-decoration: underline;
}

/*
* ----------------------------------------------------
*   Banner Area CSS
* ----------------------------------------------------
*/
#banner.carousel {
    background: #fff!important;
}
#banner .col-md-3{
  display: inline-block;
  margin-left:-10px;
}
#banner .col-md-3 img{
  width:80%;
  height:auto;
}

#banner2.carousel {
    background: #fff!important;
}
#banner2 .col-md-3{
  display: inline-block;
  margin-left:-10px;
}
#banner2 .col-md-3 img{
  width:80%;
  height:auto;
}

  
.carousel-control-prev-icon,
.carousel-indicators li,
.carousel-control-next-icon{
  background-color: #000;
}

span.carousel-control-prev-icon {
 position: relative;
 bottom: 40px;
 right: 40px;
}

span.carousel-control-next-icon {
 position: relative;
 bottom: 40px;
}
.carousel-control-prev, .carousel-control-next {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 15%;
    
	color: #000!important;
    text-align: center;
    opacity: 0.5;
    transition: opacity 0.15s ease;
}

/*
* ----------------------------------------------------
*   Banner SLIDER Area CSS
* ----------------------------------------------------
*/


.slider-container {
  overflow: hidden;
}

.slider {
  width: 100%;
  position: relative;
}

.slides {
  display: flex;
  width: 200%;
  -webkit-animation: slide var(--duration, 10s) linear infinite;
          animation: slide var(--duration, 10s) linear infinite;
}
.slides.alternate {
  -webkit-animation: slide_alternate var(--duration, 10s) linear infinite;
          animation: slide_alternate var(--duration, 10s) linear infinite;
}
.slides.allow-pause:hover {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}

.slides2 {
  display: flex;
  width: 600%;
  -webkit-animation: slide var(--duration, 30s) linear infinite;
          animation: slide var(--duration, 30s) linear infinite;
}
.slides2.alternate {
  -webkit-animation: slide_alternate var(--duration, 30s) linear infinite;
          animation: slide_alternate var(--duration, 30s) linear infinite;
}
.slides2.allow-pause:hover {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}


.slide {
  flex-basis: 50%;
  display: flex;
  align-items: center;
}
/*.slide img {
  display: block;
  flex-basis: var(--logo-width, 20%);
  font-size: clamp( 60px, 6.8vw, 120px);
  padding: clamp( 30px, 4vw, 60px ) 0;
  transition: transform 0.3s;
  cursor: pointer;
}*/
.slide img.sb {
  display: block;
  width: 250px;
	height: auto;
  padding: 5px 35px;
  cursor: pointer;
}
.slide img.sb :hover {
  transform: scale(1.12);
}


.slide img.sb2 {
  display: block;
  width: 75%;
	height: auto;
  padding:5px ;
  cursor: pointer;
}
.slide img.sb2 :hover {
  transform: scale(1.12);
}

@media screen and (max-width:991px) {
	.slides {
  display: flex;
  width: 500%;
  -webkit-animation: slide var(--duration, 16s) linear infinite;
          animation: slide var(--duration, 16s) linear infinite;
		margin-top: 30px;
}
	.slides2 {
  display: flex;
  width:  1000%;
  -webkit-animation: slide var(--duration, 16s) linear infinite;
          animation: slide var(--duration, 16s) linear infinite;
		margin-top: 30px;
}
	
.slide img.sb {
  display: block;
  width: 65%;
	height: auto;
  padding:5px 5px ;
  cursor: pointer;
}
	.slide2 img.sb2 {
  display: block;
  width: 95%!important;
	height: auto;
  padding:5px 5px ;
  cursor: pointer;
}
}
@-webkit-keyframes slide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes slide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@-webkit-keyframes slide_alternate {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
@keyframes slide_alternate {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}



/*--------------------------------------------------------------
# Member
--------------------------------------------------------------*/
.card-custom {
  overflow: hidden;
  min-height: 450px;
  box-shadow: 0 0 15px rgba(5, 5, 5, 0.3);
}

.card-custom-img {
  height: 200px;
  min-height: 200px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-color: inherit;
}

/* First border-left-width setting is a fallback */
.card-custom-img::after {
  position: absolute;
  content: '';
  top: 121px;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-top-width: 80px;
  border-right-width: 0;
  border-bottom-width: 0;
  border-left-width: 1145px;
  border-left-width: calc(1175px - 5vw);
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: inherit;
}

.card-custom-avatar img {
  border-radius: 50%;
  box-shadow: 0 0 15px rgba(10, 10, 10, 0.3);
  position: absolute;
  top: 60px;
  left: 1.25rem;
  width: 150px;
  height: 150px;
}
.card-custom-name {
  position: absolute;
	top: 10px;
	right: 20px;
	color: #fff;
	font-weight: 800;
	font-family: "Arial Black", Gadget, "sans-serif"
}

/*--------------------------------------------------------------
# timeline Section
--------------------------------------------------------------*/

.cbp_tmtimeline {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative
}

.cbp_tmtimeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #eee;
    left: 20%;
    margin-left: -6px
}

.cbp_tmtimeline>li {
    position: relative
}

.cbp_tmtimeline>li .cbp_tmtime span.large {
    color: #444;
    font-size: 17px !important;
    font-weight: 700
}

.cbp_tmtimeline>li .cbp_tmicon {
    background: #fff;
    color: #666
}

.cbp_tmtimeline>li:nth-child(odd) .cbp_tmtime span:last-child {
    color: #444;
    font-size: 13px
}

.cbp_tmtimeline>li:nth-child(odd) .cbp_tmlabel {
    background: #fff
}

.cbp_tmtimeline>li:nth-child(odd) .cbp_tmlabel:after {
    border-right-color: #fff
}

.cbp_tmtimeline>li .empty span {
    color: #777
}

.cbp_tmtimeline>li .cbp_tmtime {
    display: block;
    width: 23%;
    padding-right: 70px;
    position: absolute
}

.cbp_tmtimeline>li .cbp_tmtime span {
    display: block;
    text-align: right
}

.cbp_tmtimeline>li .cbp_tmtime span:first-child {
    font-size: 15px;
    color: #3d4c5a;
    font-weight: 700
}

.cbp_tmtimeline>li .cbp_tmtime span:last-child {
    font-size: 14px;
    color: #444
}

.cbp_tmtimeline>li .cbp_tmlabel {
    margin: 0 0 15px 25%;
    background: #fff;
    padding: 1.2em;
    position: relative;
    border-radius: 5px
}

.cbp_tmtimeline>li .cbp_tmlabel:after {
    right: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-right-color: #fff;
    border-width: 10px;
    top: 10px
}

.cbp_tmtimeline>li .cbp_tmlabel blockquote {
    font-size: 16px
}

.cbp_tmtimeline>li .cbp_tmlabel .map-checkin {
    border: 5px solid rgba(235, 235, 235, 0.2);
    -moz-box-shadow: 0px 0px 0px 1px #ebebeb;
    -webkit-box-shadow: 0px 0px 0px 1px #ebebeb;
    box-shadow: 0px 0px 0px 1px #ebebeb;
    background: #fff !important
}

.cbp_tmtimeline>li .cbp_tmlabel h2 {
    margin: 0px;
    padding: 0 0 10px 0;
    line-height: 26px;
    font-size: 16px;
    font-weight: normal
}

.cbp_tmtimeline>li .cbp_tmlabel h2 a {
    font-size: 15px
}

.cbp_tmtimeline>li .cbp_tmlabel h2 a:hover {
    text-decoration: none
}

.cbp_tmtimeline>li .cbp_tmlabel h2 span {
    font-size: 15px
}

.cbp_tmtimeline>li .cbp_tmlabel p {
    color: #444
}

.cbp_tmtimeline>li .cbp_tmicon {
    width: 20px;
    height: 20px;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-size: 1.4em;
    line-height: 20px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    color: #fff;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 5px #f5f5f6;
    text-align: center;
    left: 20%;
    top: 0;
    margin: 5px 0 0 -15px
}

@media screen and (max-width: 992px) and (min-width: 768px) {
    .cbp_tmtimeline>li .cbp_tmtime {
        padding-right: 60px
    }
}

@media screen and (max-width: 65.375em) {
    .cbp_tmtimeline>li .cbp_tmtime span:last-child {
        font-size: 12px
    }
}

@media screen and (max-width: 47.2em) {
    .cbp_tmtimeline:before {
        display: none
    }
    .cbp_tmtimeline>li .cbp_tmtime {
        width: 100%;
        position: relative;
        padding: 0 0 20px 0
    }
    .cbp_tmtimeline>li .cbp_tmtime span {
        text-align: left
    }
    .cbp_tmtimeline>li .cbp_tmlabel {
        margin: 0 0 30px 0;
        padding: 1em;
        font-weight: 400;
        font-size: 95%
    }
    .cbp_tmtimeline>li .cbp_tmlabel:after {
        right: auto;
        left: 20px;
        border-right-color: transparent;
        border-bottom-color: #fff;
        top: -20px
    }
    .cbp_tmtimeline>li .cbp_tmicon {
        position: relative;
        float: right;
        left: auto;
        margin: -64px 5px 0 0px;
    width: 20px;
    height: 20px;
    box-shadow: 0 0 0 5px #fff;
    }
    .cbp_tmtimeline>li:nth-child(odd) .cbp_tmlabel:after {
        border-right-color: transparent;
        border-bottom-color: #fff
    }
}


/*--------------------------------------------------------------
#comment Section
--------------------------------------------------------------*/
.comment-box {
    margin-top: 30px !important;
}
/* CSS Test end */

.comment-box img {
    width: 50px;
    height: 50px;
}
.comment-box .media-left {
    padding-right: 10px;
    width: 65px;
}
.media-small {
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2em;
}

.comment-box .media-body p {
    border: 1px solid #ddd;
    padding: 10px;
}
.comment-box .media-body .media p {
    margin-bottom: 0;
}
.comment-box .media-heading {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    padding: 7px 10px;
    position: relative;
    margin-bottom: -1px;
}
.comment-box .media-heading:before {
    content: "";
    width: 12px;
    height: 12px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-width: 1px 0 0 1px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute;
    top: 10px;
    left: -6px;
}

.btn-green-moon {
    background: #56ab2f;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #a8e063, #56ab2f);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #a8e063, #56ab2f); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
    border: 3px solid #eee;
}

.btn-rounded {
    border-radius: 35px;
}
/*
* ----------------------------------------------------
*   flow
* ----------------------------------------------------
*/
.clear{
	float: none;
}
.blockquote-box.blockquote-primary .square {
    background-color: #428bca;
    color: #FFF;
	
	
}
.blockquote-box .square {
    width: 120px;
    min-height: 50px;
    margin-right: 22px;
    text-align: center !important;
    background-color: #E6E6E6;
    padding: 20px 0;
    font-size: 15px;
}
.blockquote-box {
    border-left: 5px solid;
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    margin-bottom: 25px;
	width: 100%;
}
.blockquote-box.blockquote-primary {
    border-color: #428bca;
}
.blockquote-box.blockquote-warning .square {
    background-color: #f0ad4e;
    color: #FFF;
}
.blockquote-box .square {
    width: 120px;
    min-height: 50px;
    margin-right: 22px;
    text-align: center !important;
    background-color: #E6E6E6;
    padding: 20px 0;
    font-size: 15px;
}
.blockquote-box.blockquote-warning {
    border-color: #f0ad4e;
}
.blockquote-box.blockquote-success .square {
    background-color: #449d44;
    color: #FFF;
}
.blockquote-box .square {
    width: 120px;
    min-height: 50px;
    margin-right: 22px;
    text-align: center !important;
    background-color: #E6E6E6;
    padding: 20px 0;
    font-size: 15px;
}
.blockquote-box.blockquote-success {
    border-color: #449d44;
}
.blockquote-box.blockquote-danger {
    border-color: #d9534f;
}
.blockquote-box {
    border-left: 5px solid;
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    margin-bottom: 25px;
}
.blockquote-box.blockquote-danger .square {
    background-color: #d9534f;
    color: #FFF;
}

.progress .progress-type {
    position: absolute;
    left: 0px;
    font-weight: 800;
    padding: 3px 30px 2px 10px;
    color: white;
    background-color: rgba(25, 25, 25, 0.2);
}
.progress {
    position: relative;
    height: 25px !important;
}

.box-p{
    padding:15px;
}
.card-detail-badge {      
        background: #f2d900;
        text-align: center;
        border-radius: 30px 30px 30px 30px;
        color: #000;
        padding: 5px 10px;
        font-size: 14px; 
margin: 2px;
    }
.card-image-overlay {
        font-size: 16px;
	padding:5px 15px;
        
    }


.card-image-overlay span {
            display: inline-block;              
        }
/*
* ----------------------------------------------------
*   step
* ----------------------------------------------------
*/
.steps-title {
  width: 100%;
  margin: 0 .5em 1em 0em;
  background: #eaeebb;
  text-decoration: none;
  color: #444;
  position: relative;
  height: 100px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column nowrap;
}

.form-explain {
  min-height: 5em;
}

.steps-title::after {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 50px solid transparent;
  border-bottom: 50px solid transparent;
  border-left: 30px solid #eaeebb;
  position: absolute;
  top: 50%;
  margin-top: -50px;
  left: 100%;
  z-index: 2;
}

@media print, screen and (max-width: 768px) {
  .steps-title {
    width: 80%;
    margin: 0 auto 30px;
    background: #eaeebb;
    text-decoration: none;
    color: #444;
    position: relative;
    height: auto;
    text-align: center;
    padding: 10px;
  }
  .steps-title::after {
    content: "";
    display: block;
    border-top: 20px solid #eaeebb !important;
    border-right: 38vw solid transparent !important;
    border-left: 38vw solid transparent !important;
    border-bottom: none;
    position: absolute;
    width: 0;
    height: 0px;
    bottom: -20px !important;
    top: auto !important;
    left: 50%;
    margin-top: 0 !important;
    margin-left: -38vw;
  }
}

/*
* ----------------------------------------------------
*   08. result
* ----------------------------------------------------
*/

nav > .nav.nav-tabs{

  border: none;
    color:#fff;
    background:#6eab23;
    border-radius:0;

}
nav > div a.nav-item.nav-link,
nav > div a.nav-item.nav-link.active
{
  border: none;
    padding: 18px 25px;
    color:#fff;
    background:#6eab23;
    border-radius:0;
}

nav > div a.nav-item.nav-link.active
{
  border: none;
    padding: 18px 25px;
    color:#fff;
    background:#449d44;
    border-radius:0;
}

nav > div a.nav-item.nav-link.active:after
 {
  content: "";
  position: relative;
  bottom: -55px;
  left: -20%;
  border: 15px solid transparent;
  border-top-color: #449d44 ;
}
.tab-content{
  background: #fdfdfd;
    line-height: 25px;
    border: 1px solid #ddd;
    border-top:5px solid #449d44;
    border-bottom:5px solid #449d44;
    padding:30px 25px;
}

nav > div a.nav-item.nav-link:hover,
nav > div a.nav-item.nav-link:focus
{
  border: none;
    background: #449d44;
    color:#fff;
    border-radius:0;
    transition:background 0.20s linear;
}
.tab-pane {
	padding: 1rem;
	
	width: 100%!important;
}
@media screen and (max-width:650px) {
	nav > div a.nav-item.nav-link.active:after
 {
  display: none;
}
}
/*
* ----------------------------------------------------
*   08. Contact Area CSS
* ----------------------------------------------------
*/
.with-errors {
	color: darkred!important;
}

.text-contact {
  color: #FFFF99 !important;
  font-size: 1.2rem !important;
  background: #6BA430 !important;
  border:solid 2px #FFFF99;
}
.text-contact:hover {
	opacity:0.9;
}
.btn-c {
  font-size: 1.2rem;

  display: block;
  overflow: hidden;

  padding: 1.5rem 0 1.5rem 3rem;

  border: 1px solid #C4C3BF!important;
  background:  #fff!important;
}

.btn-light{
  background:  #ededed!important;
	
}

.btn-en {
  font-size: 1.2rem;

  display: block;
  overflow: hidden;

  padding: 1.5rem 0 1.5rem 3rem;

  border: 1px solid #C4C3BF!important;
  background:  #DCE6B5!important;
}

.btn-en:before {
  font-size: 1.2rem;
  font-weight: bold;

  position: absolute;
  top: 1.2rem;
  left: -3.2rem;

  padding: 0 2.1rem;

  content: "Contact";
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transform-origin: top;
  transform-origin: top;

  color: #fff;
  background: #B4C36D;
  -webkit-box-shadow: 0 3px 3px #e6d900;
  box-shadow: 0 2px 2px #e6d900;
}

footer{
	background-color: #fff;
}




.company_info h3 {
	font-size: 1.2rem;
	font-weight: 500;
}
.company_info dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.company_info dt {
  padding-bottom: 2px;
  margin-bottom: 2px;
	color: #484848;
}

.company_info dd {
  padding-bottom: 2px;
  margin-bottom: 2px;
	color: #484848;
	line-height: 1.2em;
}

.foot-nav {
	font-size: .75rem;
}
.foot-nav ul {
  list-style: none;
}
.foot-nav li {
	padding-right: 1rem;
}
.foot-nav li a{
	color: #282828;
}
.foot-nav li a:hover{
	color: #7C7C7C;
}

.foot-nav li:before {
  font-family: FontAwesome;
  content: '\f054'; /* アイコンのunicode */
	margin-right: .5rem;
}
@media screen and (max-width:650px) {
.card-body .h4 {
	font-size: 1rem;
	font-weight: 600;
	}
.text-contact {
	font-size: 1rem;
	}
.company_info h3 {
	font-size: .9rem;
	font-weight: 600;
}
}

/* Back to top button
---------------------------------- */
#back-top {
	position: fixed;
	z-index: 1000;
	bottom: 40px;
	right: 50px;
}
#back-top a {
	width: 60px;
	height: 60px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff!important;
	background: #008131;
	border-radius:60px;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	background: #ccd00a;
	color: #fff;
}
/* arrow icon (span tag) */
#back-top i {
	margin-top: 15px;
	font-size: 28px;
}
 @media only screen and (min-width : 320px) and (max-width : 480px) {
#back-top {
	position: fixed;
	bottom: 10px;
	right: 30px;
}
#back-top a {
	width: 40px;
	height: 40px;
}
#back-top i {
	margin-top: 7px;
	font-size: 20px;
}
}

#info,#services,#CO2,#project {
   margin-top:-100px;
   padding-top:100px;
	
}