@charset "utf-8";
/* ================================================== */
/*                                                    */
/*                    index_res.css                   */
/*                                                    */
/* ================================================== */
@media screen and (max-width: 768px){
    /* ==================== 基本設定 ==================== */
    #contents_wrap{
        width:100%;
        /*
        background-image: url("../images/index/main_bg.jpg");
        background-size:contain;
        */
        z-index:1;
    }
    #contents_wrap .contents_area{
        width:100%;
        background-image: url("../images/index/main_bg-free.jpg");
        background-size:contain;
        display:block;
        margin:20% auto 10% auto; 
        padding:70% 0 0 0;
    }
    p.footer_banner{
        width:100%;
        position:fixed;
        bottom:0;
        left:0;
        z-index:9999;
        padding:0;
    }
    /* ================== //基本設定// ================== */

    /* ==================== リフォーム内容 ==================== */
    #contents_wrap .contents_area .reform_area{
        width:96%;
        margin:0 auto 5% auto;
    }
    #contents_wrap .contents_area .reform_area p.reform_title{
        margin:0 0 0 0;
    }
    #contents_wrap .contents_area .reform_area p.reform_title img{
        width:100%;
        margin:0 0 2% 0 ;
    }
    #contents_wrap .contents_area .reform_area ul{
        width:100%;
    }
    #contents_wrap .contents_area .reform_area ul li{
        width:98%;
        margin:0 auto 1% auto;
    }
    #contents_wrap .contents_area .reform_area ul li img{
        width:100%;
    }
    #contents_wrap .contents_area .reform_area ul li.last{
        width:98%;
        margin:0 auto;
        padding:0 0 0 0;
    }
    /* ================== //リフォーム内容// ================== */

    /* ==================== 新着情報 ==================== */
    #contents_wrap .contents_area .news_area{
        width:96%;
        margin:0 auto 3% auto;
    }
    #contents_wrap .contents_area .news_area p.news_title{
        margin:0 0 0 0;
    }
    #contents_wrap .contents_area .news_area p.news_title img{
        width:100%;
        margin:0 0 2% 0;
    }
    #contents_wrap .contents_area .news_area ul{
        width:96%;
        height:auto;
        overflow:scroll;
        overflow-x:hidden;
        background-color: rgba(231,181,181,0.3);
        background-image: none;
        margin:0 auto;
        padding:3% 0;
    }
    #contents_wrap .contents_area .news_area ul li{
        width:96%;
        font-size:1.0rem;
        line-height:1.2;
        background-image: url("../images/index/information/info_arrow.png");
        background-position:0 2%;
        background-size:contain;
        background-color: rgba(255,255,255,0.7);
        margin:0 auto 2% auto;
        padding:3% 2% 3% 6%;
    }
/* ==================== 新着情報 ==================== */

/* ==================== 施工実績 ==================== */
    #contents_wrap .achievements_area{
        width:96%;
        margin:0 auto;
    }
    #contents_wrap .achievements_area p.achievements_title{
        display:none;
    }
    #contents_wrap .achievements_area p.achievements_title_sp{
        width:100%;
        display:inline;
    }
    #contents_wrap .achievements_area p.achievements_title_sp img{
        width:100%;
        margin:0 0 3% 0;
    }
    #contents_wrap .achievements_area ul{
        width:100%;
        display:flex;
        flex-wrap:wrap;
        justify-content:space-around;
        margin:3% 0 0 0;
    }
    #contents_wrap .achievements_area ul li{
        width:48%;
    }
    #contents_wrap .achievements_area ul li img{
        width:100%;
        margin:0 0 2% 0
    }


    /* ==================== SNSバナー・選ばれる理由 ==================== */
    #contents_wrap .banner_area{
        width:96%;
        display:block;
        margin:0 auto 10% auto;
    }
    #contents_wrap .banner_area p{
        width:100%;
        margin:0 auto 4% auto;
    }
    #contents_wrap .banner_area p.last{
        margin:0 auto;
    }
    #contents_wrap .banner_area p img{
        width:100%;
    }
}