@charset "UTF-8";
.PC {
  display: block;
}
.SP {
  display: none;
}
#alpha a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha( opacity=70 )";
}
.alpha a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha( opacity=70 )";
}
.txt_red {
  color: #FF0000;
}
ul, li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
html {
  font-size: 62.5%;
}
.clearfix::after {
  content: "";
  clear: both;
  display: block;
}
/* Body */
body {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  background-color: #000;
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 1.6;
  padding-left: 0px;
  letter-spacing: normal;
}
/* Container */
.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: #000;
  max-width: 1280px;
}
/* header */
header {
  width: 100%;
  background-color: #e50012;
  height: 104px;
  max-width: 1280px;
}
header .logo img {
  width: 316px;
  height: 67px;
  margin-left: 20px;
  padding-top: 16px;
}
/* Contents */
#sec01 {
  width: 100%;
  max-width: 1280px;
  height: auto;
}
#sec01 .inner {
  width: 100%;
  max-width: 1280px;
  max-height: 1118px;
  position: relative;
}
#sec01 .inner img {
  width: 100%;
  height: auto;
  max-width: 1280px;
  right: auto;
  left: auto;
  top: auto;
}
#sec01 .inner .catch {
  width: 52.97%;
  height: auto;
  position: absolute;
  top: 20%;
  left: 11.87%;
}
#sec01 .inner h2 {
  width: 100%;
  max-width: 1280px;
  height: auto;
  position: absolute;
  top: 68.5%;
  text-align: center;
  color: #fff;
  font-size: 4rem;
}
#sec01 .inner p {
  width: 100%;
  max-width: 1280px;
  height: auto;
  position: absolute;
  top: 79.5%;
  text-align: center;
  color: #CBCBCB;
  line-height: 1.8em;
}
#sec01 .inner video {
  position: absolute;
  width: 45.3125%;
  max-width: 580px;
  top: 66%;
  left: 0;
  right: 0;
  margin: auto;
}
#sec02 {
  width: 100%;
  max-width: 1280px;
  height: auto;
}
#sec02 .inner {
  width: 100%;
  max-width: 1280px;
  max-height: 798px;
  position: relative;
}
#sec02 .inner img {
  width: 100%;
  height: auto;
  max-width: 1280px;
  line-height: normal;
}
#sec02 .inner .txt {
  height: auto;
  position: absolute;
  top: 16%;
  left: 42%;
  line-height: 2.2em;
  text-align: left;
  color: #fff;
}
#sec02 .inner .technology {
  width: 79%;
  height: auto;
  position: absolute;
  top: 65.5%;
  left: 10.5%;
}
#sec03 {
  width: 100%;
  max-width: 1280px;
  height: auto;
  background-color: #000;
  padding-top: 3%;
  padding-bottom: 3%;
}
#sec03 img {
  width: 100%;
  height: auto;
  max-width: 1280px;
}
#sec03 .ttl {
  width: 81.25%;
  height: auto;
  margin-top: 3%;
  margin-left: 9.375%;
}
#sec03 ul {
  height: auto;
}
#sec03 ul li {
  width: 100%;
  margin-top: 3%;
  margin-bottom: 3%;
  color: #fff;
  position: relative;
  line-height: 2em;
  text-align: left;
}
#sec03 ul li .left {
  position: absolute;
  left: 44%;
  top: 14%;
}
#sec03 ul li .right {
  position: absolute;
  left: 8%;
  top: 14%;
}
#sec03 ul li .left_02 {
  position: absolute;
  left: 44%;
  top: 20%;
}
#sec03 ul li .right_02 {
  position: absolute;
  left: 8%;
  top: 24%;
}
#sec03 ul li h3 {
  font-size: 30px;
  line-height: 0;
}
#sec04 {
  width: 100%;
  max-width: 1280px;
  height: auto;
  background-color: #000;
  padding-bottom: 3%;
}
#sec04 img {
  width: 100%;
  height: auto;
  max-width: 1280px;
}
#sec04 .ttl {
  width: 79.2%;
  height: auto;
  margin-left: 10.4%;
  margin-bottom: 2.5%;
}
#sec04 ul {
  height: auto;
  top: 10%;
}
#sec04 ul li {
  width: 100%;
  color: #fff;
  line-height: 2em;
  position: relative;
  margin-bottom: 4px;
}
#sec04 ul li .txt_2 {
  width: 100%;
  top: 26.5%;
  text-align: center;
  position: absolute;
}
#sec04 ul li .txt_3 {
  width: 100%;
  top: 20%;
  text-align: center;
  position: absolute;
}
#sec04 ul li h3 {
  font-size: 30px;
  line-height: 0;
}
#sec05 {
  width: 100%;
  max-width: 1280px;
  height: auto;
  background-color: #000;
  padding-top: 3%;
  padding-bottom: 10%;
  text-align: center;
}
#sec05 img {
  width: 100%;
  height: auto;
  max-width: 1280px;
}
#sec05 .ttl {
  width: 79.2%;
  height: auto;
  margin-left: 10.4%;
  margin-bottom: 0.5%;
}
#sec05 .about {
  width: 71%;
  max-width: 918px;
  height: auto;
  margin-left: 10.4%;
  border: 2px solid #74c043;
  margin-top: 7.5%;
  padding-top: 24px;
  padding-right: 4%;
  padding-left: 4%;
}
#sec05 .about .ttl {
  width: 100%;
  height: auto;
  margin-left: 0;
  margin-bottom: 5%;
}
#sec05 .about .concept {
  color: #74c043;
  text-align: left;
  line-height: 2.1em;
  letter-spacing: -0.04em;
}
#sec05 .about .concept img {
  width: 39.5%;
  height: auto;
  float: left;
  margin-right: 4.2%;
  margin-bottom: 6%;
}
#sec05 .about .concept h3 {
  font-size: 30px;
  line-height: 1.6em;
}
#sec06 {
  width: 100%;
  max-width: 1280px;
  height: auto;
  margin-bottom: 2%;
}
#sec06 .inner {
  width: 100%;
  max-width: 1280px;
  max-height: 1274px;
  position: relative;
}
#sec06 .inner img {
  width: 100%;
  height: auto;
  max-width: 1280px;
}
#sec06 .inner .ttl {
  width: 79.2%;
  height: auto;
  position: absolute;
  top: 6.5%;
  left: 10.4%;
}
#sec06 .inner p {
  width: 80%;
  height: auto;
  position: absolute;
  top: 13%;
  text-align: center;
  line-height: 2em;
  color: #CBCBCB;
  left: 10%;
}
#sec06 .inner .map {
  position: absolute;
  width: 80%;
  max-width: 1024px;
  top: 26%;
  left: 0;
  right: 0;
  margin: auto;
}
#sec06 .inner .mymap {
  position: absolute;
  width: 80%;
  max-width: 1024px;
  top: 27%;
  left: 0;
  right: 0;
  margin: auto;
}
#sec06 .inner .mymap::before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 66%;
}
#sec06 .inner .mymap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
#sec06 .inner .logo {
  width: 27%;
  height: auto;
  top: 86%;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
}
/* footer */
footer {
  width: 100%;
  max-width: 1280px;
  background-color: #000;
  height: 78px;
}
footer .inner {
  width: 100%;
  max-width: 1280px;
  max-height: 78px;
  position: relative;
}
footer .inner .copyright img {
  width: 221px;
  height: auto;
  position: absolute;
  left: 10%;
  margin-top: 33px;
}
footer .inner ul {
  width: 70%;
  height: auto;
  position: absolute;
  top: 5px;
  right: 6%;
  width: 70%;
}
footer .inner ul li {
  width: 3.3%;
  height: auto;
  float: right;
  margin-right: 5%;
}
/* Mobile */
@media all and (min-width: 751px) and (max-width:1280px) {
  .inner {
    margin-top: -6px;
  }
  #sec01 .inner h2 {
    font-size: 3.2031249999999996vw;
  }
  #sec01 .inner p {
    font-size: 1.40625vw;
    line-height: 1.8em;
  }
  #sec02 .inner .txt {
    font-size: 1.40625vw;
  }
  #sec03 ul li p {
    font-size: 1.40625vw;
    line-height: 2em;
  }
  #sec03 ul li h3 {
    font-size: 2.34375vw;
  }
  #sec04 ul li p {
    font-size: 1.40625vw;
    line-height: 2em;
  }
  #sec04 ul li h3 {
    font-size: 2.34375vw;
  }
  #sec05 .about .concept h3 {
    font-size: 2.34375vw;
  }
  #sec05 .about .concept {
    font-size: 1.40625vw;
  }
  #sec06 .inner p {
    font-size: 1.3vw;
    line-height: 1.8em;
  }
}
/* Mobile */
@media only screen and (max-width:750px) {
  .SP {
    display: block;
  }
  .PC {
    display: none;
  }
  .inner {
    margin-top: 0px;
  }
  /* Container */
  .container {
    width: 100%;
    max-width: 750px;
  }
  /* header */
  header {
    width: 100%;
    height: 38px;
  }
  header .logo img {
    width: 100px;
    height: auto;
    margin-left: 5px;
    padding-top: 8px;
  }
  /* sec01 */
  #sec01 {
    max-width: 750px;
  }
  #sec01 .inner {
    max-width: 750px;
    max-height: 1240px;
  }
  #sec01 .inner img {
    max-width: 750px;
  }
  #sec01 .inner .catch {
    width: 77%;
    top: 1%;
    left: 11.5%;
  }
  #sec01 .inner h2 {
    font-size: 4.266666666666667vw;
    top: 75.5%;
  }
  #sec01 .inner p {
    width: 100%;
    max-width: 750px;
    top: 84%;
    font-size: 2.4vw;
  }
  #sec01 .inner video {
    width: 80%;
    max-width: 584px;
    top: 68.2%;
    margin: auto;
  }
  #sec02 {
    max-width: 750px;
    height: auto;
  }
  #sec02 .inner {
    max-width: 750px;
    max-height: 845px;
  }
  #sec02 .inner img {
    width: 100%;
    max-width: 750px;
  }
  #sec02 .inner .txt {
    top: 6%;
    left: 38.5%;
    line-height: 1.8em;
    font-size: 2.4vw;
  }
  #sec02 .inner .technology {
    width: 100%;
    height: auto;
    position: absolute;
    top: 53%;
    left: 0;
  }
  #sec03 {
    max-width: 750px;
    text-align: center;
  }
  #sec03 img {
    width: 100%;
    max-width: 750px;
  }
  #sec03 .ttl {
    width: 100%;
    margin-top: 5.5%;
    margin-left: 0;
    margin-bottom: -2%;
  }
  #sec03 ul li {
    margin-top: 4%;
    margin-bottom: 4%;
    line-height: 2em;
    font-size: 2.4vw;
    line-height: 1.7em;
  }
  #sec03 ul li .left {
    position: absolute;
    left: 50.5%;
    top: 3%;
  }
  #sec03 ul li .right {
    position: absolute;
    left: 6%;
    top: 2.5%;
  }
  #sec03 ul li .left_02 {
    position: absolute;
    left: 50.5%;
    top: 15%;
  }
  #sec03 ul li .right_02 {
    position: absolute;
    left: 6%;
    top: 14%;
  }
  #sec03 ul li h3 {
    font-size: 3.8666666666666667vw;
    line-height: 1.4em;
    margin-bottom: -0.35em;
  }
  #sec04 {
    max-width: 750px;
    margin-top: -3%;
  }
  #sec04 img {
    max-width: 750px;
  }
  #sec04 .ttl {
    width: 100%;
    margin-top: 0;
    margin-left: 0;
    margin-bottom: 3%;
  }
  #sec04 ul li {
    line-height: 2em;
    margin-bottom: 2px;
    font-size: 2.4vw;
  }
  #sec04 ul li .txt_2 {
    top: 28%;
    text-align: center;
  }
  #sec04 ul li .txt_3 {
    top: 22%;
    text-align: center;
  }
  #sec04 ul li h3 {
    font-size: 3.8666666666666667vw;
  }
  #sec05 {
    max-width: 750px;
  }
  #sec05 img {
    width: 100%;
    max-width: 750px;
  }
  #sec05 .ttl {
    width: 100%;
    margin-top: 0;
    margin-left: 0;
    margin-bottom: 3%;
  }
  #sec05 .about {
    width: 78%;
    margin-left: 7%;
    border: 1px solid #74c043;
    margin-top: 10%;
    padding-top: 3%;
    padding-right: 3%;
    padding-left: 3%;
  }
  #sec05 .about .ttl {
    margin-bottom: 8%;
  }
  #sec05 .about .concept {
    letter-spacing: 0;
    font-size: 2.4vw;
    line-height: 1.65em;
    letter-spacing: -0.05em;
  }
  #sec05 .about .concept img {
    width: 34%;
    margin-right: 2%;
    margin-bottom: 0;
  }
  #sec05 .about .concept h3 {
    font-size: 3.733333333333334vw;
    margin-bottom: -0.1em;
  }
  #sec06 {
    max-width: 750px;
  }
  #sec06 .inner {
    max-width: 750px;
    max-height: 997px;
  }
  #sec06 .inner img {
    max-width: 750px;
  }
  #sec06 .inner .youtube {
    width: 86%;
    max-width: 645px;
    top: 2%;
  }
  #sec06 .inner .ttl {
    width: 100%;
    top: 4%;
    left: 0%;
  }
  #sec06 .inner p {
    top: 11.5%;
    width: 100%;
    font-size: 2.4vw;
    line-height: 2.1em;
    left: 0%;
  }
  #sec06 .inner .map {
    position: absolute;
    width: 85%;
    top: 33%;
    left: 0;
    right: 0;
    margin: auto;
  }
  #sec06 .inner .mymap {
    width: 85%;
    max-width: 700px;
    top: 33%;
  }
  #sec06 .inner .logo {
    width: 46%;
    top: 83%;
    left: 0;
    right: 0;
    margin: auto;
  }
  /* footer */
  footer {
    max-width: 750px;
    height: 36px;
  }
  footer .inner {
    max-width: 750px;
    max-height: 36px;
  }
  footer .inner .copyright img {
    width: 110px;
    left: 10%;
    margin-top: 15px;
  }
  footer .inner ul {
    width: 100%;
    right: 5%;
  }
  footer .inner ul li {
    margin-right: 6%;
  }
  footer .inner ul li img {
    width: 20px;
    height: auto;
    margin-right: 15px;
  }
}