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

.newitem {  background-color: #222222; overflow-x: hidden; padding-left: 0.5rem; padding-right: 0.5rem;}
.newarrival { width: 100%; height: 100%; padding:0 0.5rem 0 0 ; display: flex; align-items: center;}
    @media(min-width:1400px){
        .newitem { padding-left: 0; padding-right: 0;}
    }
.newarrival > a {width: 100%; display: block; padding:0; transition: 0.6s; box-sizing: border-box; font-size: 0;}
.newarrival svg { width: 100%!important; }
.newarrival .cls-1 { transition: 0.6s;}
.newarrival > a:hover .cls-1 { fill: #DEAF42;}


.rss { font-size: 0; margin: 0; padding: 0; }
.rss li { position: relative; font-size: 0; margin: 0; padding: 0.5rem; }
.rss li a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px;}
.rss li p { width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:0.8rem; line-height: 1.0rem; margin-top:0.5rem;  padding:0; transition: 0.6s;}
.rss li:hover p { color: #DEAF42;}
    
.rss li .trim { position: relative; width: 100%; }
.rss li .trim:before { content:""; display: block; padding-top:100%; /* 高さを幅の**%に固定 */ }

.rss li .img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; transition: 0.6s; }
.rss li:hover .trim .img { opacity: 0.8;}

/***動画**
.movie { text-align:center; font-size:0px; transition:0.2s; position: relative; }
.movie li { position:relative; padding:0.25rem; display:none; width: 100%; height: 88vw; vertical-align: top; margin-bottom: 2.0rem; overflow: hidden; }
.movie li:nth-child(-n+1) { display:inline-block;}
    @media (min-width:576px){
     .movie li { width: 50%; height: 47vw; }
     .movie li:nth-child(-n+2) { display: inline-block;}
    }
    @media (min-width:768px){
     .movie li { width: 33.333333333333%; height: 247px; }
     .movie li:nth-child(-n+3) { display: inline-block;}
     }
    @media (min-width:992px){
     .movie li { height: 300px; }
    }
    @media (min-width:1200px){
     .movie li { width: 25%; height: 290px;}
     .movie li:nth-child(-n+4) { display: inline-block;}
    }

.movie li p { display:none; }
.movie li a { display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:999; text-indent:-9999px; }
.movie li img { margin:0 auto 0.5rem auto; border-radius:5px; }
.movie li .title { width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:0.8rem; margin:0; padding:0; }
blockquote { margin: 0 auto; padding: 0.25rem; width: 100%; }
*/

.blog { font-size: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.blog li { position: relative; font-size: 0; margin: 0; padding: 0.75rem; width: 100%;}
@media(min-width:556px){
	.blog li { width: 50%;}
}
@media(min-width:768px){
	.blog li { width: calc(100% / 3);}
}
@media(min-width:992px){
	.blog li { width: 25%;}
}
.blog li > div { display: flex; flex-direction: column; height: 100%;}
.blog li a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px;}
.blog li p { width: 100%; padding:0; transition: 0.4s; font-size: initial; margin-bottom: 0.5rem; }
.blog li:hover p { color: #DEAF42;}
.blog li p.date { color: #999; font-size: 0.8rem; margin-top: auto;}
.blog li p.date span { color: #FFF000!important;}
    
.blog li .trim { position: relative; width: 100%; }
.blog li .trim:before { content:""; display: block; padding-top:56.25%; /* 高さを幅の**%に固定 */ }

.blog li .img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; transition: 0.4s; margin-bottom: 0.5rem;}
.blog li:hover .trim .img { opacity: 0.8;}