@charset "utf-8";

@media screen and ( min-width:640px ) { /* PC ==================== */
  .content{
    font-size: 20px;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .content{
    font-size: 14px;
  }
}

.head-img img{
  position: relative;
  top:0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .btn-home-box{
    width:1200px;
    height:120px;
    position: absolute;
    top:20px;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
  }
  .btn-home{
    display: block;
    width:190px;
    height:120px;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .head-img img{
    width:100%;
  }
  .btn-home-box{
    width:90%;
    height:50px;
    position: absolute;
    top:0;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
  }
  .btn-home{
    display: block;
    width:60px;
    height:60px;
  }
}

.about-tm{
  background: #000;
  padding-bottom:100px;
}
.about-tm div{
  margin: 0 auto;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .about-tm div{
    width:1200px;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .about-tm div{
    width:90%;
  }
}
.about-tm div img{
  width:100%;
}
.about-tm div p{
  text-align: left;
  margin-top:30px;
}

.what-tm{
  width:100%;
  background: url("../img/what-bg.jpg");
  background-color:#000;
  background-position: center top;
  background-repeat: no-repeat;
}
.what-h,
.what-f{
  position: relative;
  top:0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
}
.what-h{
  margin-top:0 !important;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .what-h{
    width:100%;
  }
  .what-m{
    width:1200px;
    margin:0 auto;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .what-h,
  .what-f,
  .what-m{
    position: relative;
    top:0;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
  }
  .what-h{
    width:150%;
  }
  .what-f{
    width:150%;
  }
  .what-m{
    width:130%;
  }
}

.what-tm-l{
  margin-top:30px;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .what-tm-l{
    width:58% !important;
    float:left;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .what-tm01{
    width:90%;
  }
  p.what-tm-l{
    width:90%;
  }
}
.what-tm-l p{
  margin-top:30px;
}

.what-tm-r{
  margin-top:30px;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .what-tm-r{
    width:40% !important;
    float:right;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .what-tm-r img{
    width:100%;
  }
}
.what-tm-r video{
  width:100%;
  margin-top:30px;
}

@media screen and ( min-width:640px ) { /* PC ==================== */
  .what-tm img{
    margin-top:50px;
  }
  .what-tm div{
    width:1200px;
    margin:0 auto;
  }
  .what-tm p{
    text-align: left;
    margin-top:30px;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .what-tm img{
    margin-top:30px;
  }
  .what-tm div{
    margin:0 auto;
  }
  .what-tm div p{
    text-align: left;
    margin:30px auto 0;
  }
}

.item-title,
.item-content-box105 div,
.item-content-box100 div,
.item-content-box110 div,
.item-content-box120 div,
.item-content-box130 div,
.item-content-box140 div,
.item-content-box150 div,
.item-content-box div{
  position: relative;
  top:0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .item-title,
  .item-content-box105 div,
  .item-content-box100 div,
  .item-content-box110 div,
  .item-content-box120 div,
  .item-content-box130 div,
  .item-content-box140 div,
  .item-content-box150 div,
  .item-content-box div{
    width:1920px;
    margin:50px auto;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .item-title{
    width:150%;
    margin:30px auto;
  }
  .item-title img{
    width:100%;
  }
  .item-content-box div,
  .item-content-box100 div,
  .item-content-box105 div,
  .item-content-box110 div,
  .item-content-box120 div,
  .item-content-box130 div,
  .item-content-box140 div,
  .item-content-box150 div{
    margin:20px 0;
  }

  .item-content-box150 div{
    width:140%;
  }
    .item-content-box140 div{
    width:130%;
  }
    .item-content-box130 div{
    width:150%;
  }
    .item-content-box120 div{
    width:110%;
  }
    .item-content-box110 div{
    width:100%;
  }
    .item-content-box100 div{
    width:90%;
  }
    .item-content-box div{
    width:90%;
  }

  .item-content-box100 p,
  .item-content-box105 p,
  .item-content-box110 p,
  .item-content-box120 p,
  .item-content-box130 p,
  .item-content-box140 p,
  .item-content-box150 p,
  .item-content-box p{
    width:90%;
    margin:0 auto;
    text-align:left;
  }
  .item-content-box100 img,
  .item-content-box105 img,
  .item-content-box110 img,
  .item-content-box120 img,
  .item-content-box130 img,
  .item-content-box140 img,
  .item-content-box150 img,
  .item-content-box img{
    width:100%;
  }
}

.item-content-box105 div p,
.item-content-box100 div p,
.item-content-box110 div p,
.item-content-box120 div p,
.item-content-box130 div p,
.item-content-box140 div p,
.item-content-box150 div p,
.item-content-box div p,
.item-content-box105 p,
.item-content-box100 p,
.item-content-box110 p,
.item-content-box120 p,
.item-content-box130 p,
.item-content-box140 p,
.item-content-box150 p,
.item-content-box p{
  text-align: left;
}

@media screen and ( min-width:640px ) { /* PC ==================== */
  .item-content-box105 div p,
  .item-content-box100 div p,
  .item-content-box110 div p,
  .item-content-box120 div p,
  .item-content-box130 div p,
  .item-content-box140 div p,
  .item-content-box150 div p,
  .item-content-box div p,
  .item-content-box105 p,
  .item-content-box100 p,
  .item-content-box110 p,
  .item-content-box120 p,
  .item-content-box130 p,
  .item-content-box140 p,
  .item-content-box150 p,
  .item-content-box p{
    width:1200px;
    margin:50px auto;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .item-content-box105 div p,
  .item-content-box100 div p,
  .item-content-box110 div p,
  .item-content-box120 div p,
  .item-content-box130 div p,
  .item-content-box140 div p,
  .item-content-box150 div p,
  .item-content-box div p,
  .item-content-box105 p,
  .item-content-box100 p,
  .item-content-box110 p,
  .item-content-box120 p,
  .item-content-box130 p,
  .item-content-box140 p,
  .item-content-box150 p,
  .item-content-box p{
  }
}

.system{
  background: url("../img/img03-bg.png");
  background-position: center center;
  background-repeat: no-repeat;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .system{
    background-size: 150%;
  }
}



.tow-colam{
  position: relative;
  top:0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
}
.tow-colam li{
  display: block;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
    .tow-colam{
    width:1200px;
    }
    .tow-colam li{
      float: left;
     margin-top:50px;
    }
  .tow-colam li{
    margin-bottom: 10px !important;
    width: calc(50% - 0px);
  }
  .tow-colam li:nth-child(2n+1){
  	margin-right: 0;
  }
  .tow-colam li:nth-child(2n){
  	float: left;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
    .tow-colam{
       width:100%;
    }
    .tow-colam li{
    margin-top:20px;
    }
    .tow-colam li img{
    width:90%;
  }
}

.bg-w{
  width:100%;
  background: url("../img/bg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size:cover;
}
.bg-w-h,
.bg-w-f{
  margin:0 auto;
}
.bg-w-h{
  margin-bottom:50px;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .bg-w-h,
  .bg-w-f{
    width:80%;
  }
  .bg-w-h img,
  .bg-w-f img{
    width:100%;
  }
}

h3.subtitle{
  margin: 0 auto;
  padding: 10px 0;
  font-weight: bold;
  line-height: 1.2;
  color:#DC0000;
  border-top:2px solid #DC0000;
  border-bottom:2px solid #DC0000;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  h3.subtitle{
    width:1200px;
    font-size: 50px;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  h3.subtitle{
    width:90%;
    font-size: 25px;
  }
}

.page-back{
  width:200px !important;
  margin:0 auto;
  font-weight:bold;
  font-size:20px;
  text-align: center;
  color:#fff;
  padding:20px;
  border: 1px solid #fff;
  background:#000;
}
.page-back a{
  color:#fff;
  text-decoration: none;
}
.page-back a:hover{
  color:#fff;
  text-decoration: none;
}

.foot-text{
  text-align: center;
}
@media screen and ( min-width:640px ) { /* PC ==================== */
  .foot-text{
    margin:100px 0 50px 0;
  }
}
@media screen and ( max-width:640px ) { /* SP ==================== */
  .foot-text{
    width:90%;
    margin:50px auto 30px;
  }
}