
@media screen and (max-width: 767px) {

    /*-----------------------
      ヘッダー
    -----------------------*/

    #header{
         background: none;
    }
    #header .header-content {
        width: 100%;
    }
    .header-illust{
        display: none;
    }
    .head-catch{
        padding: 10px 2% 0;
        text-align: left;
        font-size: 10px;
    }
        .logo {
            margin-top: 8px;
            margin-left: 2%;
            width: 150px;
            height: 60px;
            background: url(../img/logo.png) no-repeat top center / contain;
        }

    #gnavi{
        display: none;
    }
    .head-link{
        display: none;
    }


    .gull-img01 {
        display: none;
    }

    .gull-img02 {
        width: 12vw;
        height: 15vw;
        position: absolute;
        left: 50%;
        z-index: 10;
    }

    .gull-img03 {
        right: 13%;
        width: 13vw;
        height: 15vw;
    }


    /*-----------------------
      共通パーツ
    -----------------------*/

    * {
        box-sizing: border-box;
    }

    .contents {
        width: 100% !important;
    }

    img {
        max-width: 100%;
        height: auto;
    }

     #wrapper{
        position: relative;
        background: none;
     }
    #wrapper:before{
             position: absolute;
             top: 0;
             left: 0;
             content: "";
             width: 100%;
             height: 30vw;
              background:  url(../img/bg-site_sp.jpg)no-repeat top center /cover;
    }



/*-----------------------
      フッター
    -----------------------*/

#footer .btn-top {
    width: 100%;
}

#footer .footer-content {
    width: 100% !important;
}

#footer .footer-link {
    display: grid;
    gap: 15px 0;
    grid-template-columns: repeat(3, 1fr);
}

#footer .link-blc {
    width: auto;
    height: auto;
    float: none;
}



.foot-logo {
    margin: 0 auto;
    float: none;
    max-width: 190px;
    width: 100%;
    height: auto;
}

}
/*end*/

@media screen and (max-width: 500px) {
    #footer .footer-link {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
}

