.bg_dark{
    position: relative;
}
.bg_dark img{
    width: 400px;
    display: block;
    opacity: 0.7;
  }

  span.bg_dark {
    background-color: black;
    display: inline-block;
  }
  .bg_dark p {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin:0;
    padding:0;
    color:#fff;
    z-index: 2;
    /*文字の装飾は省略*/
    }
    
/*img setting*/

@media screen and (max-width:768px){
    .bg_dark{
        position: relative;
    }
    .bg_dark img{
        width: 275px;
        /*padding:20px;*/
        display: block;
        opacity: 0.7;
      }
      span.bg_dark {
        background-color: black;
        display: inline-block;
       
      }

}

@media screen and (max-width:600px){
  .bg_dark p {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin:0;
    padding:0;
    color:#fff;
    font-size:15px;
    /*文字の装飾は省略*/
    }
}