@import url("https://use.typekit.net/hqm7kbo.css");

html { width: 100vw;  margin: 0;  padding: 0; }
body, #content
{ overflow-x: hidden; max-width: 100vw;  width: 100vw;  margin: 0;  padding: 0; }


h1, h2, h3, blockquote {
  font-family: 'Jubilat', sans-serif;
   font-weight:700;
   font-style: normal;
}


body.page-template-ja-landingpage {
  background: url(../images/footer.png) no-repeat center bottom;


}

#content {
  position: static !important;

}

.ja_landing_page_content_top {
  content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
background: url(../images/top-ja.jpg) no-repeat top center;
background-size: 2044px 460px;
z-index: -1;
}

body.page-template-ja-landingpage .top-header {
padding: 2em 2em 0 2em;
margin-top: 160px;
background: url(../images/shape-bg.svg) no-repeat top center;
background-color: transparent;
background-size: cover;
}

.top_nello {
content: '';
position: absolute;
width: 100%;
max-width: 975px;
height: 200px;
background: url(../images/nello.png) no-repeat top center;
background-size: 227px 200px;

}


body.page-template-ja-landingpage h1,
body.page-template-ja-landingpage h2{
font-weight: 600;
font-style: normal;
font-family: 'Jubilat', sans-serif;
}

body.page-template-ja-landingpage h2 {
  font-size: 28px;
}

body.page-template-ja-landingpage .top-header h1 {
font-weight: 600;
text-align: center;
}



body.page-template-ja-landingpage .txt {
padding: 2em;
}


body.page-template-ja-landingpage  .flx_yellowblock_block {
  background: #fff8f2;
  box-shadow: 0 0 0 3px #fff1e7, 0 0 0 10px #fff8f2, 0 0 0 20px #fff1e7;
  padding: 20px;
  margin: 10px 0 0;
}

body.page-template-ja-landingpage  .flx_yellowblock_block h2 {
  width: 100%;
}

body.page-template-ja-landingpage  .flx_yellowblock_block h2::after {
  content: '';
  position: absolute;
  top: 0;
  right: -100px;
  width: 80px;
  height: 80px;
  background: url(../images/hart.svg) no-repeat top center;
}
body.page-template-ja-landingpage blockquote {
  margin: 0 0 30px;
      padding: 50px;
      background: #fff8f2;
      color: #D91B2B;
      font-size: 36px;
      line-height: 1.4;
      font-weight: 600;
      text-align: center;
      border-radius: 6px;
      font-family: 'Jubilat', sans-serif;
      font-style: italic;
}

.small-qoute {
  max-width: 540px !important;
}
.small-qoute blockquote {
  font-size: 28px !important;
}
.small-qoute blockquote footer {
  font-size: 16px !important;
}


body.page-template-ja-landingpage blockquote:before {
  content: '“';
  font-weight: 400;
    display: block;
    position: absolute;
    margin: -120px 0 0 -72px;
    width: 52px;
    height: 52px;
    /* background: url(../images/quote.svg) no-repeat; */
    background-size: 100% auto;
    font-size: 200px;
    transform: rotate(-10deg);
    font-family: 'Forma DJR Deck';
}


.green {
  background: #7dc578;
    color: #fff;
    padding: 20px 20px 10px 20px;
}

.testclass .txt {
  background: #7dc578;
    border: double #7dc578 20px;
    border-image: url(../images/border-box.png) 50 70 stretch stretch;
    color:#fff;
}


.usp-box .txt {
  background: #7dc578;
  border: double #7dc578 20px;
  border-image: url(../images/border-box.png) 50 70 stretch stretch;
  color:#fff;
}

.usp-lists {
  width: auto;
  margin: 0 auto;
}

.usp-lists ul {
  display: inline-block;
  font-size: 1.6em;
  width: auto;
  margin: 0 2em;
}

.img_usp {
  width: 100%;
  height: 100px;
  background: url(../images/product-benefits.svg) no-repeat top center;
  margin: 0 0 20px 0;
}

.section-title {
  text-align: center;
}

.figures-header {
  height: 300px;
  margin-bottom: -70px !important;
  background: url(../images/figures-header.png) no-repeat bottom center;
  background-size: contain;
  margin-top: -180px !important;
}

.news-box {
padding: 0;
margin: 0;
}


body.page-template-ja-landingpage .news-box .txt
{
  padding: 0;
}

.news-box .txt {
  background: #d81b2b;
color: #ffffff;
padding: 0;
margin: 0;
}

.news-box .news-item {
  padding: 2em;
}
.news-box .img-news {
  background: url(../images/belexpo.jpg) no-repeat center center;
  height: 310px;
  background-size: cover;
}



.news-box .txt .btn {
    background: url(../images/btn_bg_6.png) no-repeat center center;
    color: #D91B2B !important;
    background-size: 100% 100% !important;
}

.news-box .txt .btn:hover {
    background: url(../images/btn_bg_6_h.png) no-repeat center center;
    color: #fff !important;
}

.stepprocess {
  align-items: normal !important;
  align-items: stretch !important;
}

.img_orb {
  background: #D91B2B;
  color: #ffffff;
  padding: 4px;
}


.img_orb::after {
  content: ">";
  display: inline-block;
  position: absolute;
  text-align: center;
  height: 22px;
  width: 22px;
  background: #fff;
  right: 6px;
  color: #D91B2B;
  border-radius: 100%;
  text-orientation: upright;
}

.img_orb.last::after {
  content: unset;
  display: none;
}


.btn_sns {
  color: #ffffff;
  background: #D91B2B;
  padding: 26px 32px;
  text-align: center;
  border-radius: 4px;
  font-size: 1.2em;
  margin: 0.6em 0;
}

.btn_sns::after {
  content: "→";
  display: inline-block;
  position: absolute;
  text-align: center;
  height: 22px;
  width: 22px;
  right: 48px;
  color: #fff;
  border-radius: 100%;
}

.btn_sns::before {
  content: "";
  display: inline-block;
  position: absolute;
  text-align: center;
  height: 32px;
  width: 32px;
  left: 48px;
  background: #fff;
}



.btn_sns.twitter_x::before {
  background:none;
  background: url(../images/x.svg) no-repeat center center;
}

.btn_sns.instagram::before {
  background:none;
  background: url(../images/instagram.svg) no-repeat center center;
}

a.btn_sns:hover {
  background:#a30f1d;
}


.footer-ja {
  margin : 64px 0 0 0;
}

.footer-ja ul  {
  text-align: right;
  font-size: 0.8em;
  padding: 0;
}

.footer-ja ul li {
  display: inline-block;
  padding: 8px;
  color: #D91B2B;
}

.footer-ja ul li a:hover {
  text-decoration: underline;
}

.footer-ja::before {
     content: "";
  display: inline-block;
  position: absolute;
  text-align: center;
  height: 64px;
  width: 280px;
  left: 0;
  margin-top: -64px;
  background: url(../images/logo-ja.svg) no-repeat left center;

}

@media (max-width: 992px) {
  .btn_sns
}


@media (max-width: 767px) {
  p {
    font-size:1.4em;
  }
  .footer-ja {
    margin-top: 128px;
  }
  .footer-ja::before {
      margin-top: -128px;
    width: 100%;
    background-position: center center;
  }
  .footer-ja ul  {
    text-align: center;
  }
  .img_orb {
  text-orientation: inherit;
  writing-mode: vertical-rl;
  }
  .img_orb::after {
    right: -11px;
    z-index: 99;
  }
  .btn_sns::before{
    top: 30px;
  }
  .top_nello {
    max-width: 90%;
  }
}