﻿
	
    ul{
        padding: 0;
    }
    #copyright{text-align: center;}
    .bto{
        width:100%; max-width:870px; margin:auto;
    }   
@media screen and (min-width:768px){
.pc-only{
display: block;
}
.sp-only{
display: none;
}
}
@media screen and (max-width:767px){
.pc-only{
display: none;
}
.sp-only{
display: block;
}
}  
#main{
font-family: "Noto Sans JP", "ＭＳ Ｐゴシック", "MS PGothic", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
width: 100%;
    max-width: 870px;
    margin: auto;
}
    #main .kinouicon.sample{
        max-width: 100%;
    }
    
    #main .wallpaper-sample{
        display: flex;
        flex-wrap: wrap;
        list-style: none;
		justify-content: space-between;
    }
    #main .wallpaper-sample li {
    width: calc(25% - 9px);
    margin-bottom: 20px;
    border: 1px solid #333;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
	font-feature-settings: "palt";
}
    
    #main .wallpaper-sample li div{
        /*border:1px solid #333;
        box-sizing: border-box;*/
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg{
        
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg.rp{
       display: flex;
    	flex-wrap: wrap;
		justify-content: space-around;
		padding: 2px;
		height: 4rem;
    align-items: flex-start;
    }
	#main .wallpaper-sample li div.wallpaper-sample-pimg.rp img{
		width:calc(33% - 2px);
		margin-bottom:2px;
			 
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg.cons{
        /*height: 15em;*/
        text-align: center;
		border-top: #ccc dotted 2px;
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg.cons span{
        font-size: 7em;
    display: block;
    text-align: center;
    margin: auto;
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg p{
        text-align: center;
    font-weight: bold;
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg a{
        
    }
    #main .wallpaper-sample li div.wallpaper-sample-pimg a img.smn{
        display: block;
    margin: auto;
    padding: 15px;
        max-width: 164px;
        width: 100%;
        max-height: 164px;
        height: auto;
        box-sizing: border-box;
    }
    #main .wallpaper-sample li div.wallpaper-sample-status{
        padding: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
		border-top: #CCC dotted 2px;
    }
    #main .wallpaper-sample li div.wallpaper-sample-status.bikou{
        /*height: 5em;*/
    }
    #main .wallpaper-sample li div.wallpaper-sample-status span{
        
    }
@media screen and (max-width: 768px) {
	#main .kinouicon.sample{
        min-width: 870px;
    }
    #main .wallpaper-sample{
        justify-content: space-between;
    }
	
 #main .wallpaper-sample li{
        width: calc(50% - 5px);
    margin-bottom:10px;
    }
    #main .wallpaper-sample li div.wallpaper-sample-status{
        /*height: 4em;*/
		
    }
    #main .wallpaper-sample li div.wallpaper-sample-status.bikou {
    /*height: 7em;*/
}
	#main .wallpaper-sample li div.wallpaper-sample-pimg.rp{
		height: 15vw;
	}	
}
    #main .lb {
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,.7);
    opacity: 0;
    transition: .3s opacity ease;
    z-index: -1;
}
#main .lb img {
    width: 100% !important;
    max-width: 500px!important;
    max-height: 100%!important;
    transform: scale(1);
    transition: .4s transform ease;
    pointer-events: none;
}

#main .lb.ex02 img {
    transform: scale(1);
    max-width: 870px!important;
}
#main .lb:target {
    opacity: 1;
    z-index: 103;
}
.lb:target img {
    transform: scale(1);
}

#main .lb::before,.lb::after {
    display: block;
    position: fixed;
    content: "";
    width: 24px;
    height:3px;
    top: 24px;
    right: 12px;
    background: #fff;
    border-radius: 4px;
}
#main .lb::before {
    transform: rotate(-315deg);
}
#main .lb::after {
    transform: rotate(315deg);
}
#main a.lb:hover img {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1!important;
}

.backtop{
width:100%;
}