* { margin: 0px; padding: 0px; }
html { font-size: 62.5%; overflow-y: scroll; }
body { font-size: 1.6rem; }
body {font-family:vdl-v7marugothic,"Helvetica Neue", Arial,"Hiragino Sans",Meiryo,sans-serif;font-size: 1.8rem;color: #1a1a1a;background: #fff;font-weight: 500;text-size-adjust: 100%;position: relative;letter-spacing: 0.08em;font-feature-settings: "palt";-webkit-font-smoothing: antialiased;}
body > .container-fluid {background: rgb(255 255 255);}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4,h5, h6 {font-weight: 700;font-style: normal;}
.font-k{font-family: vdl-logona, sans-serif;
font-style: normal;
font-weight: 400;}
.red{color:#a30000;}
a{transition: all 0.2s ease-out;}






header {background: #fff;max-width: 1140px;width:100%;margin:0 auto;padding: 2em;border-bottom:1px solid #333333;}
header p {max-width: 200px;margin: 0;margin-right: 6rem;}
header p img {width: 100%;height: auto;margin: 0;padding: 0;}
header a{
    font-size: 14px;
    color: #fff;
    padding: 3px .75em;
    background: #383942;
}
header a:hover{
    color: #a30000;
    text-decoration: none;
}
header a{font-size: 1.4rem;margin: 0;color: #383942;font-weight: 600;line-height: 1;background:none;padding:0;}
#cover{
    text-align: center;
}
.jumbotron-fluid {width: 100%;/* margin: 0 90px; */position: relative;background: url("/images/cover-bg.jpg")  center/ cover no-repeat;}
.copy {height: 34.75vw;max-height: calc(100vh - 230px);}
.copy h1 {text-align: center;font-size: 70px;font-size: 6rem;margin: 2vw 0;color: #fff;line-height: 1.5; text-shadow: 0 0px 10px #0a5fa59c;
}

.copy h1 span {font-size: 5rem;}
.copy-01{
    padding: 1vw 4vw 0;
    text-align:center;
}
.copy-01 img{
    width: 30%;
    max-width: 160px;
    background:#fff;
    border-radius:50%;
}










#strength {/* position: relative; *//* padding-top: 4em; *//* display: flex; *//* flex-flow: column; *//* align-items: stretch; *//* justify-content: center; */}
#strength::before {/* content: ""; */max-width: 500px;width: 100%;background: rgb(255, 255, 255);display: flex;z-index: 3;position: absolute;height: 1000px;top: 0px;left: 50%;transform: translate(-50%, 0px);}
#strength .justify-content-between {background: #fff;max-width: 1080px;margin: 2vw auto 4vw;}
#strength h2 {position: relative;z-index: 10;text-align: left;font-size: 40px;line-height: 1.2;}
#strength h2  span{font-size:22px}
#strength  ul {display: inline-block;text-align: left;list-style: none;margin-bottom: 1em;}
#strength  ul li{background: url(/images/check.png) no-repeat left center;background-size: contain;line-height: 40px;padding-left: 45px;}


#strength h2 ul { }
#strength p span { }
#strength .row {position: relative;z-index: 10;/* max-width: 1040px; *//* margin: 0px auto; */margin-top: 2vw;background: url(/images/strength-01.jpg) right center no-repeat;background-size: contain;}
#strength h3{
    margin: 1em 0;
    font-size: 22px;
}
#strength  .strength-point h3{
    margin: 1em 0;
    font-size: 25px;
    text-align: center;
}
#strength  img{width:100%}
#strength .col-md-5 img{width:100%;display: block;max-width: 300px;margin-left: auto;margin-right: 0;}
#strength  .strength-point{
    background: url(/images/strength-bg.jpg) center;
    background-size: cover;
    max-width: none;
    padding: 2.5vw 0;
    margin-bottom: 0;
}
#strength  .strength-point div{
    max-width: 768px;
    margin: auto;
}
#strength  .strength-point ul{font-size: 25px;font-weight: 600;}
#strength  .strength-point p{font-size: 22px;color: #fff;background: #244988;display: inline-block;padding: 0 6px;}




#industry{
    text-align: center;
    background: #233584;
    padding: 4vw 0;
    color: #fff;
}
#industry div{margin-bottom:4vw}
#industry h2{
    font-size: 40px;
}
#industry .text-area{font-size:30px;margin: 0 auto;}
#industry .text-area h3{background: #ffffff;color: #000000;width: 18em;font-size: 30px;padding: 1rem;margin: 1em auto;}
#industry span{
    width: 24%;
    margin: 0 .5%;
    position: relative;
    z-index: 1;
    display: inline-block;
}
#industry img{width: 100%}
.ind01::after{content:"\98DF\54C1\696D\754C";position: absolute;display: inline-block;z-index: 100;top: 0;left: 0;padding: 0 6px;color: #333;background: #ffffffa6;}
.ind02::after{content:"\88FD\85AC\696D\754C";position: absolute;display: inline-block;z-index: 100;top: 0;left: 0;padding: 0 6px;color: #333;background: #ffffffa6;}
.ind03::after{content:"\5316\7CA7\54C1\696D\754C";position: absolute;display: inline-block;z-index: 100;top: 0;left: 0;padding: 0 6px;color: #333;background: #ffffffa6;}
.ind04::after{content:"\7523\696D\6A5F\68B0";position: absolute;display: inline-block;z-index: 100;top: 0;left: 0;padding: 0 6px;color: #333;background: #ffffffa6;}



#flow{background: #ffffff;padding: 4vw 0;}
#flow h2 {font-size: 40px;margin: 0;margin-bottom: 1rem;/* padding: 2vw; */}
#flow .flow-area{max-width:1080px;margin:0 auto}
#flow img{ width:100%;margin-top:4rem}


#try{background: #f2f2f2 url(/images/try-bg.jpg) right no-repeat;background-size: contain;padding: 4vw 0;text-align: center;}
#try h2 {font-size: 40px;margin: 0;padding: 2em;text-align: center;}
#try img{width: 90%;max-width: 600px;margin-top:4rem;}









#about .justify-content-between {background: #fff;max-width: 1080px;margin: auto ;}
#about h2 {font-size: 3.8rem;margin: 0;padding: 2em 0 .5em;text-align: center;line-height: 2;color: #004020;}
#about h2 span img{display:block;max-width: 230px;width: 45%;margin: auto;}

#about .col-md-6 img{
    max-width: 125px;
    width: 30%;
    display: block;
    margin: 0 auto 1rem;
}
#about h3{
    font-size: 2.8rem;
    text-align: center;
    margin: 0 auto 2.4rem;
}
#about p{
    width: 90%;
    margin: 2px auto 5rem;
    text-align: justify;
    letter-spacing: .05em;
}

#about #mean{
  margin: 0 auto 9rem;
  padding: 2.5em 1em;
  max-width: 80%;
  background : -moz-linear-gradient(44.78% -72.64% -75deg,rgba(245, 249, 244, 1) 0%,rgba(223, 237, 222, 1) 100%);
  background : -webkit-linear-gradient(-75deg, rgba(245, 249, 244, 1) 0%, rgba(223, 237, 222, 1) 100%);
  background : -webkit-gradient(linear,44.78% -72.64% ,55.22% 172.64% ,color-stop(0,rgba(245, 249, 244, 1) ),color-stop(1,rgba(223, 237, 222, 1) ));
  background : -o-linear-gradient(-75deg, rgba(245, 249, 244, 1) 0%, rgba(223, 237, 222, 1) 100%);
  background : -ms-linear-gradient(-75deg, rgba(245, 249, 244, 1) 0%, rgba(223, 237, 222, 1) 100%);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F9F4', endColorstr='#DFEDDE' ,GradientType=0)";
  background : linear-gradient(165deg, rgba(245, 249, 244, 1) 0%, rgba(223, 237, 222, 1) 100%);
  border-radius : 15px;
  -moz-border-radius : 15px;
  -webkit-border-radius : 15px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F9F4',endColorstr='#DFEDDE' , GradientType=1);
}
#about #mean h4{font-size: 2.2rem;color:#006038;line-height: 1.8;text-align: center;}


#usage{ background: #ebf4ea;}
#usage .justify-content-between {max-width: 900px;margin: auto;}
#usage .justify-content-between:last-child {margin-bottom: 9rem;}
#usage h2 {font-size: 3.8rem;margin: 0;padding: 2em 0 .5em;text-align: center;line-height: 2;color: #004020;}
#usage h2 span img{display:block;max-width: 230px;width: 45%;margin: auto;}
#usage .media{
    margin: 0 auto 3rem;
}
#usage .media h3{
    font-size: 3.5rem;
    padding: 1.25em 0;
    width: 3.5em;
    text-align: center;
    background: #fff;
    line-height: 1;
    border-radius: 50%;
    margin: 0 auto;
    margin-right: 2rem;
}
#usage .media p{margin: 0 auto;}
#usage .media:last-child h3{
    background: #004020;
    color: #fff;
}
#usage .table{background: #fff;border-radius: 1.5rem;font-size: 1.6rem;}
#usage .shade{
  margin: 3rem auto 6rem;
  text-align: center;
  max-width: 96%;
}
#usage .table tr:first-child th:first-child{
  border-radius: 1.5rem 0 0 0;
  vertical-align: middle;
}
#usage .table th:last-child{
  border-radius:   0 1.5rem 0 0;
}
#usage .table .thead-dark th{
    background-color: #004020;
}
#usage .table th,#usage .table td{
  border: none;
}
#usage .shade h3{
  font-size:2.2rem;
}
#usage .table tr:nth-child(even){background: #eaf0e4;}

#concept{background: #f2f2f2 url(/images/bg-green.jpg) no-repeat;background-size: cover;padding: 9rem 0;text-align: center;}
#concept .flow-area{background: #fff;width: 96%;max-width: 768px;margin: 0 auto;padding: 0;border-radius: 1.5rem;}
#concept h2{font-size: 3.8rem;margin: 0;padding: 1em 0;text-align: center;line-height: 1.8;color: #004020;}
#concept h3{font-size: 2.5rem;margin: 3rem 0 3.5rem;padding: 0;text-align: center;line-height: 1.5;display: inline-block;border-bottom: 5px dotted #a30000;}
#concept div{padding: 0 6rem 6rem;}
#concept p{text-align: justify;}



#price .justify-content-between {
    background: #fff;
    max-width: 1080px;
    margin: auto;
    margin-bottom: 9rem;
}
#price h2{
    font-size: 2.8rem;
    margin: 0;
    padding: 3em 0;
    text-align: center;
    line-height: 2;
    color: #004020;
}
#price .col-md-6 *{
  z-index: 10;
  position: relative;
  }
#price .col-md-6:after{
  content:"";
  background: #ebf4ea;
  width: 350px;
  height: 350px;
  top: 50%;
  left: 50%;
  max-width: 90%;
  max-height: 90%;
  border-radius: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 0;
}

#price .col-md-6c *{
  z-index: 10;
  position: relative;
  }
#price .col-md-6c:after{
  margin:0 auto;
  content:"";
  background: #ebf4ea;
  width: 350px;
  height: 350px;
  top: 50%;
  left: 50%;
  max-width: 90%;
  max-height: 90%;
  border-radius: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 0;
}

#price h3,#price p{
    font-size: 3rem;
    margin-bottom: 3rem;
    text-align: center;
    font-weight:700;
    line-height: 1.1;
}
#price img{
    margin: 0 auto;
    display: block;
    max-height: 310px;
    
}
#price h2 span{
    font-size: 1.8rem;
    display: block;
}
#price h3 span,#price p span{
    font-size: 1.3rem;
    display: block;
}
#price .caution,#usage .caution{font-size:1.3rem;color:#ad1e18;margin: 3rem 0;}



#test{background: #f2f2f2 url(/images/bg-soil.jpg) no-repeat;background-size: cover;padding: 9rem 0;text-align: center;}
#test .flow-area{background: #fff;width: 96%;max-width: 768px;margin: 0 auto;padding: 0;border-radius: 1.5rem;}
#test h2{font-size: 3.8rem;margin: 0;padding: 1em 0;text-align: center;line-height: 1.8;color: #004020;}
#test p{text-align: justify;}
#test ul{
    margin-left: 1em;
    text-align: left;
}
#test li{}
#test a{
    background: #a30000;
    color: #fff;
    font-size: 2.5rem;
    padding: .8em 0;
    width: 12em;
    margin: auto;
    margin-top: 2em;
    display: block;
    border-radius: 5rem;
    text-decoration:none;
}
#test a:hover{background: #f54e34;}
#test p:first-child{margin-bottom: 3rem;}
#test div{padding: 0 6rem 6rem;}


#company{background: #ffffff ;padding: 9rem 0;text-align: center;}
#company .flow-area{background: #fff;color: #004020;width: 100%;max-width: 768px;margin: 0 auto;padding: 0;border-radius: 1.5rem;}
#company h2{font-size: 3rem;margin: 0;padding: 0 0 1em;text-align: center;line-height: 1.8;color: #004020;}
#company img{
    max-width: 300px;
    width: 60%;
    margin-bottom: 3rem;
}
#company p{text-align: center;font-size: 2.2rem;font-weight: 700;width: 90%;margin: auto;}
#company ul{
    list-style: none;
    text-align: center;
    font-size: 1.4rem;
}



#contact{ background: #ebf4ea;}
#contact .justify-content-between {margin: auto;}
#contact .justify-content-between:last-child {margin-bottom: 9rem;}
#contact h2 {font-size: 2.8rem;margin: 0;padding: 2em 0 .5em;text-align: center;line-height: 2;color: #004020;}
#contact h2 span img{display:block;max-width: 230px;width: 45%;margin: auto;}

#contact {}
#contact .contact_inner {width: 100%;max-width: 640px;margin: 3vw auto;}
#contact .contact_inner h2 {text-align: center;padding: 1em 0;font-size: 28px;width: 100%;color: rgb(61 63 71);line-height: 1.5;}
#contact .contact_inner .phone { text-align: center; background: rgb(237, 231, 231); padding: 2em 0px; }
#contact .contact_inner .phone p { font-size: 25px; font-weight: bold; }
#contact .contact_inner .phone a { font-size: 40px; color: rgb(68, 68, 68); font-family: toppan-bunkyu-midashi-go-std, sans-serif; font-weight: 900; font-style: normal; background: none; border-bottom: 10px solid rgb(225, 72, 53); }
#contact .contact_inner .form { text-align: center; }
#contact .contact_inner .form form {width: 100%;margin: auto;font-size: 1.5rem;}
#contact .contact_inner .form .s-font-body {margin-bottom: 4px;padding: 2px;text-align: left;}
#contact .contact_inner .form span {font-weight: bold;width: 15em;text-indent: 1.5em;line-height: 2.75em;text-align: left;font-size: 1.8rem;color: #fff;background: #006038;position: relative;}
#contact .contact_inner .form span.reqire:after{
    content: "*必須";
    position: absolute;
    font-size: 1rem;
    top: 0;
    right: 4px;
    color: #fff;
    }



#contact .contact_inner .form .text_area span {
    line-height: 5em;
}
#contact .contact_inner .form .btn-primary, #contact .contact_inner .modal-footer .btn-secondary, .modal-footer .btn-secondary { background-color: rgb(237, 116, 73); border-color: rgb(61, 64, 70); color: rgb(255, 255, 255); font-size: 12px; }
#contact .contact_inner .form .modal-footer p, .modal-footer p { font-size: 12px; text-align: left; margin: 0px auto 0px 1em; }
#contact .contact_inner .form input {background: rgb(253, 253, 253);border: none;width: 80%;text-align: left;line-height: 2em;padding: 0px 0.25em;text-indent: 0.75rem;}
#contact .contact_inner .form .contact-case span+ div{width:80%}
#contact .contact_inner .form .contact-case input{
    width: auto;
}
#contact .contact_inner .form .contact-case input[type=radio]{
    width: 20px;
    height: 20px;
    vertical-align: sub;
}
#contact .contact_inner .form .contact-case .radio-btn{
   font-size:1.125em;
}
#contact .contact_inner .form  .select-box{
}
#contact .contact_inner .form select{
    height: 2.8rem;
    margin-left: 2rem;
    width: 8em;
}
#contact .contact_inner .form textarea {background: rgb(253, 253, 253);border: none;width: 80%;min-height: 5em;line-height: 1.5em;padding: 4px 0.25em;padding-left: .75em;}
#contact .contact_inner .form .custom-select { width: 10em; height: 40px; font-size: 12px; }
#contact .contact_inner .form p { font-size: 25px; font-weight: bold; margin: 1em auto; }

#contact .contact_inner .form .s-submit-field input {text-align: center;max-width: 100%;transition: all 0.3s ease-out;background: #a30000;color: #fff;font-size: 3rem;padding: .53333em 0;width: 10em;margin: auto;line-height: 1.5;margin-top: 2em;display: block;border-radius: 5rem;text-decoration: none;}
#contact .contact_inner .form .s-submit-field {position:relative;margin: 2em 0;}


#contact .contact_inner .form .s-submit-field input[type="submit" i]:hover {background: #f54e34;}
.modal-dialog { max-width: 700px; }
.modal-body { max-height: 500px; overflow: auto; }
.searchtable-title { background: rgb(244, 244, 244); padding: 0px 5px; border-bottom: 3px solid rgb(255, 255, 255); border-left: 3px solid rgb(255, 255, 255); font-size: 15px; text-align: left; }
.searchtable-title.searchtable-title-industry { font-size: 18px; background: rgb(216, 216, 216); text-align: center; }
.searchitem-list { list-style: none; margin: 0.5em; }
.searchitem-list li { display: flex; justify-content: flex-start; align-items: center; }
#contact .contact_inner .form .searchitem-list li input, .searchitem-list li input { width: 2em; }
address { width: 100%; margin: 0px auto; color: rgb(68, 68, 68); background: rgb(62, 63, 71); }
footer { background: rgba(218, 213, 210, 0.93); }
footer div p {text-align: center;color: #006038;width: 100%;font-size: 1.3rem;background: #ffffff;padding: 4rem 0;margin: 0;}
footer a { color: rgb(255, 255, 255); }
footer a:hover { color: rgb(175, 175, 175); }
.hideClass { }
.sp{display:none}




@media screen and (min-width: 420px) {
}
@media screen and (min-width: 768px) {
  header .w-100 .row { max-width: 800px; margin: 0px auto; padding: 90px 0px 45px; }
  footer { }
}
@media screen and (min-width: 1200px) {
}
@media screen and (max-width: 1200px) {
  #strength .justify-content-between{
    max-height: none;
}

.copy h1{font-size: 4rem;}
.copy h1 span {
    font-size: 3rem;
}
}
@media screen and (max-width: 768px) {
  body{font-size: 14px;}
  header{
    width: auto;
    padding: 0;
}
  header p{
    max-width: 200px;
    width: 50%;
    margin: 1rem auto;
}
  header span{
    display:none
}
  header div>*{
    display:inline-block;
    vertical-align:middle;
    color:#33438b;
    background:none;
    font-size:22px;
    padding: 0 6px 0 0;
}
.nav{display:none}
#cover{
    margin-right: -15px;
    margin-left: -15px;
    width: auto;
    margin-bottom: 1rem;
}
.copy{
    height: 50vw;
}
  .copy h1 {font-size: 3rem;width: auto;line-height: 1.4;text-align: center;}
  .copy h1 span {font-size: 2.2rem;}

#about h2, #usage h2, #concept h2,#company h2{
    font-size: 4vw;
}
#price h2, #test h2,#contact h2{font-size:3vw}
#about h3{font-size:2.2rem}
#usage .media{flex-direction: column!important;}
#usage .media h3{
    margin: 0 auto 1rem;
}
  #contact .justify-content-between { padding: 0px; }
  #contact .contact_inner h2 {font-size: 18px;}
  #contact .contact_inner .phone p { font-size: 20px; }
  #contact .contact_inner .phone a { font-size: 28px; }
  #contact .contact_inner .form p { font-size: 20px; }
  #contact .contact_inner .form .s-font-body {font-size: 12px;}
  #contact .contact_inner {padding-bottom: 1rem;}
  #contact .contact_inner .form textarea {width: 80%;}
  #contact .contact_inner .form .text_area span {
    line-height: 5em;
}
#contact .contact_inner .form .s-submit-field {
    position: relative;
    margin: 2em;
}
  .searchitem-list li label { font-size: 14px; width: auto; }
  .modal-body { max-height: calc(100vh - 150px); overflow: auto; }
  .pc{display:none}.sp{display:inline}
}
@media screen and (max-width: 420px) {
  .carousel-inner { height: 75vw; width: 150%; margin-left: -25%; }
  #carouselExampleIndicators { overflow: hidden visible; padding-bottom: 15vw; }
  .copy {height: 50vh;}

#about h2, #usage h2, #concept h2, #company h2{
    font-size: 2.2rem;
}
#price h2, #test h2, #contact h2,#company p{
    font-size: 1.8rem;
    letter-spacing: .01em;
}
body{line-height:1.8}
#about p{width:100%;font-size: 1.8rem;}
#about #mean h4{
    font-size: 2rem;
    line-height: 1.5;
    /* margin-bottom: 5rem; */
}#about #mean h4 br{
    display:none
}
#usage .justify-content-between:last-child{margin-bottom: 5rem;}
#concept div{
    padding: 0  2rem 3rem;
}
#test div{
    padding: 0 2rem 2rem;
}
#test a{font-size: 2.2rem;}
#price .justify-content-between{
    margin-bottom: 0;
}
#contact .contact_inner .form span{
    padding: 1.5rem 1rem 1rem;
    width: 6em;
    font-size: 1.5rem;
    text-indent: unset;
    line-height: 1.5;
}
}
.lazyload { opacity: 0; transform: translate(0px, 50px); transition: all 1500ms ease 0s; }
.lazyload.scrollin { opacity: 1; transform: translate(0px, 0px); }


#page_title{background: #ffffff ;padding:0;text-align: center;}
#page_title .flow-area{background: #fff;color: #004020;width: 100%;max-width: 1000px;margin: 0 auto;padding: 10px;}
#page_title h1{font-size: 28px;margin: 0;padding: 0;text-align: left;line-height: 28px;color: #333333;}