@charset "UTF-8";
/* CSS Document */
body {
   font-size: 10px;
   color: #000000;
}
img {
   max-width: 100%;
}
.caption-lh-1 {
   line-height: 1;
}
.container {}
.dis-section {
   width: 100%;
   background-repeat: no-repeat;
   background-attachment: scroll;
   background-size: cover;
   position: relative;
}
.dis-section-inner {
   max-width: 1000px;
   margin: 0 auto;
   position: relative;
}
@media screen and (max-width: 767px) {
   .dis-section-inner {
      padding: 0 1em;
   }
   .dis-section {
   background-size: cover;
   background-position: bottom 0px right 0px;

}
}
/*video-area-start*/
.dis-video {
   max-width: 728px;
   margin: 0 auto;
   color: #ffffff;
   position: relative;
   display: block;
}
.dis-video-inner {
   position: relative;
   display: block;
   width: 100%;
}

.dis-video-area {
   position: relative;
   display: block;
   width: 100%;
   height: 56.28%;
   top: 0;
   left: 0;
   z-index: 50;
}
.dis-video-area:hover {
   transition: 0.4s;
   opacity: 0.5;
}

.dis-video-thumb {
   position: absolute;
   display: block;
   width: 100%;
   z-index: 10;
   top: 0;
   right: 0;
}

.dis-video-caption {
   margin-top: 2rem;
   text-align: left;
   position: relative;
}
.dis-video-caption h3 {
   font-size: 2.8em;
   font-weight: bold;
}
.dis-video-caption p {
   margin-top: 0.7em;
   font-size: 1.6em;
   line-height: 1.25;
}
.dis-video-caption-small {
   font-size: 2rem;
   font-weight: normal;
}
@media screen and (max-width: 767px) {
   .dis-video-area:hover {
   transition: none;
   opacity: none;
}
   
   .dis-video-caption h3 {
      font-size: 2em;
   }
   .dis-video-caption p {
      font-size: 1.4em;
      line-height: 1.6;
   }
   .dis-video-caption-small {
      font-size: 0.8em;
      font-weight: normal;
   }
}


/*----------
title
-----------*/
.dis-title {
   padding: 55px 0 0;
}
.dis-title-inner {
   max-width: 1000px;
   margin: 0 auto;
   position: relative;
}
.dis-title h1 {}
.dis-title h2 {
   color: #2b61b0;
   font-size: 3.5em;
   font-weight: bold;
   margin-top: 2rem;
}
.dis-title p {
   font-size: 2.3em;
   color: #525252;
   line-height: 1.3;
   margin-top: 3rem;
}
@media screen and (max-width: 767px) {
   .dis-title h1 {
      width: 40%;
      position: relative;
      display: inline-block;
      margin: 0 auto;
   }
   .dis-title h2 {
      font-size: 2em;
      font-weight: bold;
      margin-top: 1rem;
   }
   .dis-title p {
      font-size: 1.4em;
      line-height: 1.6;
      margin-top: 1.5rem;
      /*      text-align: justify;
*/
   }
}
/*----------
nano balance 
----------*/
.dis-nbt {
   background-image: url("../img/dis_nbt_bg.jpg");
}
.dis-nbt-inner {
   padding: 120px 0 70px;
}
@media screen and (max-width: 767px) {
   .dis-nbt-inner {
      padding: 60px 1em 50px;
   }
}
/*----------
T-MODE 
----------*/
.dis-tmode {
   background-image: url("../img/dis_tmode_bg.jpg");
}
.dis-tmode-inner {
   padding: 60px 0 70px;
}
@media screen and (max-width: 767px) {
   .dis-tmode-inner {
      padding: 40px 1em 50px;
   }
}
/*----------
ATOM 
----------*/
.dis-atom {
   background-image: url("../img/dis_atom_bg.jpg");
}
.dis-atom-inner {
   padding: 60px 0 70px;
}
@media screen and (max-width: 767px) {
   .dis-atom-inner {
      padding: 40px 1em 50px;
   }
}
.dis-about {
   background: #e1e1e1;
}
.dis-about-inner {
   max-width: 760px;
   margin: 0 auto;
   position: relative;
   padding: 120px 0 110px;
}
@media screen and (max-width: 767px) {
   .dis-about-inner {
      padding: 40px 1em 50px;
   }
}
/*----------
button
-----------*/
.dis-about-button {
   width: 100%;
   margin: 0 auto;
   position: relative;
   display: inline-block;
   padding: 40px 0;
   font-size: 2.8em;
   font-weight: bold;
   background: #ffffff;
   border: solid 15px #06488d;
   box-sizing: border-box;
   color: #06488d;
   text-align: center;
   text-decoration: none;
   transition: all .3s;
}
.dis-about-button::after {
   position: absolute;
   top: 50%;
   right: 0.5em;
   content: '';
   margin-top: -10px;
   border: 15px solid transparent;
   border-top-width: 10px;
   border-bottom-width: 10px;
   border-left-color: #06488d;
   transition: all .3s;
}
.dis-about-button:hover {
   background-color: #06488d;
   color: #ffffff;
   text-decoration: none;
}
.dis-about-button:hover::after {
   border-left-color: #ffffff;
}
.dis-about-textbox {
   margin-top: 120px;
   text-align: center;
}
.dis-about-textbox-text {
   font-size: 2.2em;
   line-height: 1.6;
   color: #4c4c4c;
   margin-top: 30px;
   text-align: justify;
}
@media screen and (max-width: 767px) {
   .dis-about-button {
      width: 100%;
      padding: 1em 0;
      font-size: 1.6em;
      font-weight: bold;
      background: #ffffff;
      border: solid 7px #06488d;
   }
   
   .dis-about-textbox {
      margin-top: 60px;
      text-align: left;
   }
   .dis-about-textbox-img img {
      max-width: 150px;
   }
   .dis-about-textbox-text {
      font-size: 1.2em;
      line-height: 1.4;
      margin-top: 1em;
   }
}
@media screen and (min-width: 768px) {
   .pc-None {
      display: none;
   }
}
@media screen and (max-width: 767px) {
   .sp-None {
      display: none;
   }
   #sp-header .iconBox {
      z-index: 1000;
   }
   .sp-movie {
      position: relative;
      max-width: 100%;
      padding-top: 56.25%;
      display: block;
   }

   .bc-video {
      position: absolute;
      top: 0px;
      right: 0px;
      bottom: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      border: 10px solid #ffffff;
   }
}