@charset "UTF-8";
/* CSS Document */

/*========= 壁紙ダウンロード =========*/

.main_wallpaper{
    background: #ececea url("../../img/bg_gray.png") repeat-x;
    background-size: 30vw;
    display: inline-block;
}

.sub_ti{
    font-size: 6.4vw;
    text-align: center;
    margin-bottom: 20px;
}

.catch{
    margin-bottom: 20px;
    text-align: center;
}

.sp_dl_btn{
    background: #FFF;
    display: block;
    text-align: center;
    padding: 8px;
    border-radius: 10px;
    margin-bottom: 15px;
}
.wallpaper_item{
    width: 90%;
    margin: 0 auto 50px;
}

.wallpaper_item ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.wallpaper_item li{
    text-align: left;
    -webkit-flex: 0 1 43vw;
    -ms-flex: 0 1 43vw;
    flex: 0 1 43vw;
    position: relative;
    margin-bottom: 8vw;
}
.wallpaper_item li img{
    background: #FFF;
    padding: 8px;
    border-radius: 10px;
    position: relative;
    width: 100%;
    margin-bottom: 8px;
}

.wallpaper_item li span{
    display: block;
}

.wallpaper_item ul a{
    text-decoration: none;
    line-height: 1.8em;
}

.wallpaper_item .sub_ti_item{
    font-size:4.8vw;
    text-align: center;
    margin-bottom: 20px;
    font-weight: bold;
}
.wallpaper_item .item_name{
    font-weight: bold;
}

.new {
    position: absolute;
    top: 5px;
    left: 5px;
    background: #ec6bab;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    color: #FFF;
    padding-top: 6px;
    font-size: 14px;
}
.ti_kumo{
    text-align: center;
    margin-bottom: 30px;
    padding: 25px;
    background: url("../img/bg_ti_kumo.png") no-repeat 50%;
    font-weight: bold;
    font-size: 18px;
}



/*==============*/
/*      タブレット      */
/*==============*/
@media screen and (min-width: 768px) and (max-width: 1024px){
    .wallpaper_item {
        width: 90%;
        margin: 50px auto;
    }

}

/*==============*/
/*      PC      */
/*==============*/

@media screen and (min-width: 1025px)  {
    .main_wallpaper{
    background-size: 300px;
    }
    
    .catch{
        text-align: center;
        margin-bottom: 20px;
    }
    .sub_ti{
        font-size: 24px;
        text-align: center;
    }

    .wallpaper_item{
        width: 950px;
        margin: 50px auto;
    }
    
    .wallpaper_item ul{
        display: -webkit-flex;
       display: -ms-flexbox;
       display: flex;
        justify-content: flex-start;
       -webkit-flex-wrap: wrap;
       -ms-flex-wrap: wrap;
       flex-wrap: wrap;
       margin: 0 0 0 -20px;
       text-align: center;
    }
    
    .wallpaper_item li{
        -webkit-flex: 0 1 303px;
        -ms-flex: 0 1 303px;
        flex: 0 1 303px;
        margin:0 0 50px 20px;
    }
    .wallpaper_item li a {
        text-decoration: none;
        line-height: 1.8em;
    }
    .wallpaper_item .sub_ti_item{
        font-size: 24px;
    }
    .page_title img{
        width: 231px;
    }
    .wallpaper_item li img{
        padding:15px;
    }
}