html{
  scroll-behavior: smooth;
}

*{ 
margin:0; 
padding:0; 
} 

body {
  width:100%;
/*  background-image: url("../images/Bg.jpg");*/
/*  background-repeat: repeat;*/
  /*background-image: url("../images/~~~");*/
  /*background-repeat: no-repeat;*/
  background-color: #000;
  /*background: linear-gradient(#000 14.3%, #faae8f 14.8% 100%);*/
  font-family: serif;
  color:#FFF;
}


p,b,h2 {
  /*font-weight: bold;*/
  /*text-shadow: 0px 0px 4px #0589c0;*/
/*  text-shadow: 1px 1px 2px #0186be;*/
}

a {
  color: #f57d80;
  text-decoration:none; 
}

a img:hover {
    -webkit-transition: all 0.2s;
}

a img:hover {
    transform: scale(1.03); /*画像の拡大/縮小(xy)*/
    /*opacity:0.9;/*透明度*/
}

b {
  font-weight:900;
  font-size:2.5vw;
}

dd {
/*  color: #FFF;*/
}



h1 {
  font-weight:900;
  text-align: center;
  font-size:3.8vw;
  color: #FFF;
  /*font-family: "M PLUS 1p";*/
/*  font-family:serif;*/
/*  text-shadow: 1px 1px 2px #0589c0;*/
}

h2 {
/*  font-size:1.9vw;*/
  margin: 0px 0px 0px;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
  h2 {
/*    font-size:1.7vw;*/
  }
}


.TopArea{
  width: 95%;
  margin: auto;
}

.MainArea{
  width: 100%;
  margin: auto;
}


.LangBt {
  position: absolute;
  top: 0%;
  width:3.6%;
  height:6%;
  /*float: left;*/
  /*background-color:#F00;*/
}

.ninja_onebutton{
  margin: auto;
  width:148px;
  height:6%;
  /*text-align: center;*/
  /*background-color: #FFF;*/
  /*float: right;*/
}

div#Top {
/*  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.6);*/
}

.TopPC {
  /*background-image: url("../images/xxxxxxxxx.jpg");*/
  /*background-size: 100%;*/
  /*position: relative;*/
  margin:0px;
  padding:0px;
  border: 0px;
  width:100%;
  /*height: 80%;*/
  background-repeat: no-repeat;
}


.TopPhone{
display: none;
}

/*-------01-------*/

div#section01 {
  position: relative;
  background-size: 100%;
  /*background-color: #FFF;*/
  position: relative;
  margin-top: 1%;
  padding:0px;
  border: 0px;
  width:100%;
}


#section01:before {
    content:"";
    display: block;
    padding-top: 33%;
}

div#section01 b {
  font-size:3vw;
  margin: auto;
  font-family:serif;
  color: #041a5d;
}

.textbox01{
  position: absolute;
  top: 0%;
  width:100%;
  height:100%;
  text-align: center;
  margin: auto;
/*padding-bottom:100% : */
/*background-color: #020;*/
 }

.textbox01 h2{
  font-size:3.5vw;
  line-height:4vW;
  padding-top: 2%;
  padding-bottom: 2%;
 }

.textbox01 img{
  margin-top: 1% ;

 }

.textbox01 p{
  color:#FFCC33;
  font-style: italic; 
  font-size:2.5vw;
  font-family:sans-serif;
 }

/*-------02-------*/

div#VideoArea {
  background-size: 100%;
  /*background-color: #FFF;*/
  position: relative;
  margin:0px;
  padding:0px;
  border: 0px;
  width:80%;
  margin: auto;
}


#VideoArea:before {
    content:"";
    display: block;
    /*padding-top: 6.25%;*/
}

/*-------03-------*/

div#NewsLetterArea {
  background-size: 100%;
  /*background-color: #FFF;*/
  position: relative;
  margin:0px;
  padding:0px;
  border: 0px;
  width:100%;
/*  background-color: #F0F; */
}


#NewsLetterArea:before {
    content:"";
    display: block;
/*    padding-top: 10%;*/
}


.textbox02{
  width:80%;
  text-align: center;
  margin: auto;
 }

.textbox02 h2{
  font-size:3.1vw;
  padding-top: 2%;
  padding-bottom: 2%;
 }

.textbox02 a{
  position: relative;
  left:-10.5%;
 }

.textbox02 p{
  text-align: left;
  font-size:2.1vw;
  padding-top: 2%;
  padding-bottom: 2%;
  font-weight: bold;
 }

.button_box img{
  margin-bottom: 2%;
 }

.textbox03{
  width:83%;
  text-align: center;
  margin: auto;
 }

.textbox03 p{
  text-align: left;
  font-size:2.1vw;
  padding-top: 2%;
  padding-bottom: 2%;
  font-weight: bold;
 }

/*-------04-------*/
div#SubVideoArea{
  width:100%;
  margin-bottom: 0.8%;
}

div#SpecArea {
  width:92%;
  /*height:43%;*/
  /*background-color: #FFF;*/
  position: relative;
  margin: auto;
  padding:0px;
  border: 0px;
  text-align: center;
  margin-bottom: 1%;
}


/*#SpecArea:before {
    content:"";
    display: block;
    padding-top: 56.25%;
}*/

.textbox04{
  padding-top: 1%;
  padding-bottom: 1%;
 }

.textbox04 img{
  padding-top: 1%;
  padding-bottom: 1%;
 }

/*--------------*/


div#Footer {
  margin:auto;
  padding:0px;
  border: 0px;
  width:80%;
  text-align: center;

}

.textbox_link {
  width:20%;
  margin:auto;
}

.textbox_link p{
font-family:serif;
/*color: #000;*/
padding-top: 1%;
font-size:1.5vw;
/*  filter: drop-shadow(0px 0px 0px rgba(0,0,0,0));*/
  /*text-shadow: black 0 0 0px;*/
/*  text-shadow: 1px 1px 2px #004c6c;*/
}

.textbox_link img{
/*  filter: drop-shadow(1px 1px 1px #004c6c);*/
}

.video-container {
    position: relative;
    width:100%;
  /*height:100%;*/
  /*background-color: #FFF;*/
}

.video-container:before {
    content:"";
    display: block;
    padding-top: 56.25%;
}

#trailer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}