@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Didact+Gothic&display=swap');

@font-face {
  font-family: 'Jost';
  src: url('../font/TrueType/Jost-400-Book.ttf') format('truetype')
}

body {
  font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

.WebFont {
  font-family: Jost, 'Didact Gothic', sans-serif !important;
}

header .container,
footer .container {
  max-width: 1200px;
}

.container {
  max-width: 960px;
}

/* header ===============================*/
header {}

header nav {
  box-shadow: none !important;
  background: none;
}

.btn-lang {
  float: right;
  padding: 18px 0 0;
}

.btn-lang li {}

.btn-lang li a {
  display: block;
  background: #0E5C41;
  padding: 3px 20px 8px;
  border-radius: 9999px;
}

.btn-lang li a:hover {
  background: #26a69a;
}

.btn-lang li a img {
  display: block;
  overflow: hidden;
  padding: 0;
  margin: 0;
  font-size: 1px;
  line-height: 1px;
}

/* footer ===============================*/
footer.page-footer {
  margin: 5em 0 0 0;
  padding: 0;
}

footer.page-footer #FooterFirstArea {
  height: auto;
  border-bottom: 1px solid #565f6f;
  margin-bottom: 0;
}

footer.page-footer a#PageTopBtn {
  background: #292e34;
  display: flex;
  width: 100%;
  height: 62px;
  vertical-align: middle;
}

footer.page-footer a#PageTopBtn img {
  margin: auto;
  text-align: center;
  display: block;
  font-size: 1px;
  line-height: 1px;
  vertical-align: middle;
  height: 41px;
}

footer.page-footer #FootNav {
  float: left;
  margin-right: 30px;
}

footer.page-footer #FootNav li {
  margin: 0 0 0 30px;
  float: left;
}

footer.page-footer #FootNav li a {
  background: url(../images/base/arrow_right_w01.png) left center no-repeat;
  color: rgba(255, 255, 255, 0.55);
  display: block;
  padding: 0 0 0 10px;
  font-size: .8em;
  line-height: 30px;
}

footer.page-footer #FootNav li:first-child {
  margin: 0;
}

footer.page-footer #FootSNS {
  float: left;
}

footer.page-footer #FootSNS .Fb {}

footer.page-footer #FooterText {
  vertical-align: middle;
  display: table;
  height: 150px;
}

footer.page-footer #FooterText p {
  color: rgba(255, 255, 255, 0.5);
  font-size: .9em;
  line-height: 1.6em;
  margin: auto;
  text-align: left;
  vertical-align: middle;
  display: table-cell;
}

footer.page-footer #FooterLangBtn {
  padding-top: 50px;
  display: none;
}

footer.page-footer #FooterLangBtn .btn-flat {
  background: none;
  color: #FFF;
  margin: 3em 0 1em auto;
}

footer.page-footer #FooterLangBtn .btn-flat img {
  margin-top: -2px;
  width: 6px;
  height: auto;
}

footer.page-footer #FooterLangBtn .btn-flat:hover {
  background: #26a69a;
}

footer.page-footer #FooterLangBtn h5 {
  float: left;
  font-size: .8em;
  color: #26a69a;
  line-height: 50px;
  padding: 0;
  margin: 0 10px 0 0;
  vertical-align: middle;
}

footer.page-footer #FooterLangBtn ul {
  float: left;
  line-height: 50px;
  padding: 0;
  margin: 0;
}

footer.page-footer #FooterLangBtn ul li {
  float: left;
  vertical-align: middle;
}

footer.page-footer #FooterLangBtn ul li a {
  font-weight: bold;
  color: #FFF;
}

footer.page-footer #FooterLangBtn ul li a.active {
  color: #26a69a;
}

footer.page-footer #FooterLangBtn ul li a:hover {
  color: #26a69a;
}

footer.page-footer #FooterLangBtn ul li a:after {
  content: "/";
  padding: 0 5px;
  color: #26a69a;
}

@media (max-width: 700px) {
  footer.page-footer #FootNav li:first-child {
    margin: 5px 0 0 5px;
  }

  footer.page-footer #FootNav li {
    margin: 5px 0 0 5px;
  }

  footer.page-footer #FootNav li a {
    font-size: .6em;
    line-height: 16px;
    padding: 5px;
  }
}

@media (max-width: 768px) {
  footer.page-footer {
    margin: 2em 0 0 0;
  }

  footer.page-footer .container {
    width: 100%;
  }

  footer.page-footer .container .row {
    margin: 0;
  }

  footer.page-footer .container .col {
    padding: 0 !important;
  }

  footer.page-footer .container .col.s12 {
    width: 100%;
  }

  footer.page-footer .footer-copyright {
    font-size: .6em;
  }
}

/* content #main ===============================*/
#main {}

#main__visual {
  background: url(../images/main-v.png) no-repeat bottom right;
  background-size: auto 100%;
  min-height: 50vh;
  margin-top: 70px;
  margin-bottom: 200px;
}

#main__visual h1 {
  font-weight: 900;
  font-size: 6.5em;
  margin-left: 50px;
  margin-top: -70px;
  letter-spacing: 3px;
  margin-bottom: 130px;
  color: #000;
  line-height: 1em;
}

#main__visual h1:first-letter {
  font-family: 'Didact Gothic', sans-serif !important;
}

#main__visual h1 span {
  margin-left: 50px;
}

.btn--contact {}

.btn--contact a {
  background: #0E5C41;
  border-radius: 9999px;
  color: #FFF;
  padding: 1.2em 3em;
  font-size: 1.2em;
  text-transform: uppercase;
  letter-spacing: .3em;
  font-weight: bold;
}

.btn--contact a:hover {
  background: #26a69a;
}

/* strength */
.strength {
  background: url(../images/photo1.png) no-repeat top right;
  padding-top: 50px;
  margin-top: 150px;
  min-height: 468px;
}

.strength__img {
  max-width: 100%;
  position: absolute;
  margin-top: -150px;
}

.strength__list {
  font-size: 2em;
  width: auto;
  display: inline-block;
  margin: auto;
}

.strength__list li {
  background: rgba(255, 255, 255, 0.7);
  width: auto;
  display: block;
  clear: both;
  margin-bottom: 1em;
  padding: .5em;
  font-weight: bold;
}

.strength__list li.strength__list--1st {}

.strength__list li.strength__list--2nd {
  text-align: right;
  padding-right: 2em;
  margin-right: -70px;
}

.strength__list li.strength__list--3rd {
  margin-right: -140px;
  padding-left: 80px;
}

.strength__point {
  clear: both;
  margin-top: 7em;
}

.strength__point .col {
  position: relative;
  padding: 0%;
  margin: 0;
  text-align: center;
}

.strength__point--img {
  width: 80%;
  height: auto;
  margin: auto;
}

.strength__point--text {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0 5%;
  width: 80%;
  background: rgba(14, 92, 65, 0.8);
  text-align: center;
  color: #FFF;
  height: 100px;
  display: table;
}

.strength__point--text p {
  vertical-align: middle;
  display: table-cell;
  text-align: left;
  font-size: 1.3em;
  line-height: 1.3em;
  font-weight: bold;
  letter-spacing: 1px;
}

/* lines */
.lines {
  margin: 4em auto;
}

.lines .container .row {
  display: flex;
}

.lines .lines__photo {
  background: url(../images/photo3.png) no-repeat top left;
  background-size: cover;
}

.lines .lines__text {
  padding-left: 2em;
}

.lines h2 {
  text-transform: uppercase;
  font-weight: bold;
  margin: .7em auto 0;
}

.lines .lines__h2--1st {
  text-align: right;
  font-size: 7em;
  color: #FFF;
}

.lines .lines__h2--2nd {
  margin-top: 2.2em;
}

.lines .lines__list {
  margin: 1em auto;
  font-size: 1.9em;
  line-height: 1.2em;
  font-weight: bold;
}

.lines .lines__list li {
  margin: 1em auto;
}

.lines .lines__list .lines__list--1st:before,
.lines .lines__list .lines__list--2nd:before,
.lines .lines__list .lines__list--3rd:before {
  display: block;
  position: absolute;
  z-index: 10;
  margin-left: -134px;
  margin-top: -8px;
}

.lines .lines__list .lines__list--1st {}

.lines .lines__list .lines__list--1st:before {
  content: url(../images/line01.png);
  margin-top: 10px;
}

.lines .lines__list .lines__list--2nd {
  margin-left: 1.5em;
  margin-bottom: 1em;
}

.lines .lines__list .lines__list--2nd:before {
  content: url(../images/line02.png);
  margin-left: -123px;
}

.lines .lines__list .lines__list--3rd {
  margin-left: 3em;
  margin-bottom: 1.5em;
}

.lines .lines__list .lines__list--3rd:before {
  content: url(../images/line03.png);
  margin-left: -120px;
}

/* specialtys */
.specialtys {
  background: #0e5c41;
  color: #FFF;
  margin: 4em auto;
  padding: 3em 0;
}

.specialtys h2 {
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
}

.specialtys h3 {
  font-weight: bold;
}

.specialtys .row .col.m4 {
  margin-bottom: 2em;
}

.specialtys img {max-width: 100%;height: auto;}

/* contact */
.contact {margin: 4em auto;text-align: center;}

.contact p {
  margin: 4em auto;
}

.contact .btn--contact {}
.contact .btn--contact a {
}


/* SP */
@media only screen and (max-width: 600px) {

  body{}

header .container,
footer .container,
.container {
  max-width: 100%;
}

nav .brand-logo {
  /* left: 0; */
  /* position: relative; */
  display: block;
  /* right: 0; */
  width: 60%;
  margin-left: -60px;
}

nav .brand-logo img {
  max-width: 100%;
  height: auto;
}

.btn-lang {position: absolute;right: 0;top: 6px;}

.btn-lang li {}

.btn-lang li a {padding: 3px 10px 5px;}
.btn-lang li a img {
  width: 50px;
}

#main__visual {
  min-height: auto;
  margin-top: 0;
}

#main__visual h1 {padding: 0;margin: 0;font-size: 4em;letter-spacing: -3px;text-transform: uppercase;margin-top: 1em;}

#main__visual h1 span {
  margin-left: 0;
  text-align: right;
  display: block;
}

#main__visual .btn--contact {
  margin: 7em auto;
  text-align: center;
}

.specialtys h3 {
  font-size: 1em;
  min-height: 2.3em;
  margin-bottom: 0;
}

.strength__img {
  margin-top: -250px;
}
.strength__list {padding-left: 90px !important;}

.strength__list li {text-align: left !important;padding: 10px !important;font-size: 0.7em !important;line-height: 1.2em;}
.strength__list li br {
  display: none;
}
.strength__list li.strength__list--1st {margin: 0;}
.strength__list li.strength__list--2nd {margin: 0;}
.strength__list li.strength__list--3rd {margin: 0;}

.lines .container .row {
  display: block;
}

.lines .lines__text {
  padding-left:0;
}

.lines .lines__h2--1st {
  text-align: left;
}
.lines .lines__h2--2nd {
  text-align: left;
  margin: auto;
  margin-left: .5em;
  font-size: 3em;
  margin-top: .1em;
}

.lines .lines__list .lines__list--1st,
.lines .lines__list .lines__list--2nd,
.lines .lines__list .lines__list--3rd {font-size: .75em;letter-spacing: 0;}


.lines .lines__list .lines__list--1st:before,
.lines .lines__list .lines__list--2nd:before,
.lines .lines__list .lines__list--3rd:before {
  margin-left: -100px;
}


.lines .lines__list .lines__list--1st {
    margin-left: 2em;
}
.lines .lines__list .lines__list--1st br {

display: none;
}

.lines .lines__list .lines__list--1st:before {
  content: url(../images/line03.png);
  margin-top: -4px;
}

.lines .lines__list .lines__list--2nd {
  margin-left: 3em;
  margin-bottom: 0;
}

.lines .lines__list .lines__list--2nd:before {
  content: url(../images/line03.png);
}

.lines .lines__list .lines__list--3rd {
  margin-left: 4em;
  margin-bottom: 0;
}

.lines .lines__list .lines__list--3rd:before {
  content: url(../images/line03.png);
}


}