/*	poster
============================== */
#second header{
  position: relative;
  width: 100%;
  background: rgb(200,199,199);
  background: linear-gradient(90deg, rgba(200,199,199,1) 0%, rgba(255,255,255,1) 10%, rgba(255,255,255,1) 50%, rgba(255,253,253,1) 90%, rgba(200,199,199,1) 100%);
}
#second  h1 span{
  display: block;
  background: url(../img/main2.png?) center top no-repeat;
  background-size: cover;
  width: 100%;
  height:0;
  padding-top:21.2962962962963%;
}
#second  h1 img{
  position: absolute;
  top:0;
}

@media all and (min-width: 768px) {
#second  h1{
  width: 1080px;
  margin:0 auto;
}

}
@media all and (max-width: 767px) {
#second  h1{
width: 98%;
margin:0 auto;
}
}

/*box
============================== */
.box{
  margin:0 auto;
}

.innerbox{
    background:rgba(255,255,255,0.8);
    padding-bottom: 1em;
}


.box h2 {
    margin: 0 auto;
    background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(255,255,255,0.8) 60%, rgba(255,255,255,0.8) 100%);
    display: flex;
    align-items: center;
    text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
                -1px 1px 0 #FFF, 1px -1px 0 #FFF,
                0px 1px 0 #FFF,  0-1px 0 #FFF,
                -1px 0 0 #FFF, 1px 0 0 #FFF;
  }

.innerbox p{
  line-height: 160%;

}

@media all and (min-width: 768px) {
.box{
    width:1020px;
    margin-bottom:50px;
}
.inn{
    width:980px;
    margin: auto;
}
.box h2 {
  width:1020px;
  line-height:100%;
  font-size:400%;
  }

.box h2 small{
  font-size:40%;
}

.innerbox .inn{
  width:800px;
  padding: 80px 0;
}
}

@media all and (max-width: 767px) {
  .box{
    width:96%;
    margin-bottom:2em;
  }
  .innerbox{
    padding:0 1em 1em;
    margin: auto;
  }
  .box h2 {
    width:100%;
    line-height:100%;
    font-size:200%;
    }

  .box h2 small{
    font-size:40%;
  }

  .innerbox .inn{
    width:95%;
    padding: 2em 0;
    margin:0 auto;
  }

}

  #snsBt{padding-bottom:100px;
  margin-bottom: 2em;}
  #snsBt::after {
    width: 100%;
    height:100px;
  }
}