@charset "utf-8";

.list-webzine { margin-bottom:15px; }

.list-category { margin:40px 0; }
.list-category ul.category { display:flex; justify-content:center; align-items:center; flex-wrap: wrap; }
.list-category ul.category li { margin:5px; border-radius:99px; border:none; float:none; }
.list-category ul.category li a { border-radius:99px; border-width:1px; border-style: solid; padding:15px 20px; }
.list-category ul.category li.active a { background:none; }

/* List */
.list-wrap .tile > .a { }
.list-wrap .tiles .tile > .a::after, .list-wrap .tiles .image::after { display:none; }
.list-wrap .tiles .image { padding-bottom:56.25%; }
.list-wrap .tiles .image .img { position:absolute; left:0; top:0; width:100%; height:100%; z-index:2; }
.list-wrap .tiles .image .swiper-container { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; }
.list-wrap .tiles .image .swiper-slide { padding-bottom:56.25%; }
.list-wrap .tiles .image .swiper-slide .slide-img { position:absolute; left:-10%; top:-10%; right:-10%; bottom:-10%; background:none center/cover; transition: 2000ms ease-in; }
.list-wrap .tiles .image .swiper-slide.swiper-slide-active .slide-img { transform:translateX(-40px); }
.list-wrap .tiles .image .swiper-slide.swiper-slide-active:nth-of-type(even) .slide-img { transform:scale(0.9); }
.list-wrap .tiles .image .swiper-slide.swiper-slide-active:nth-of-type(3n) .slide-img { transform:scale(1.2); }

.list-wrap .content { position: relative; z-index: 2; }
.list-wrap .content .head { height:30px; overflow: hidden; font-size: 18px; }
.list-wrap .content .date { margin-top:10px; font-size: 14px; }


.list-item { display:block; margin-bottom: 20px; border:1px solid #ccc; position:relative; background-color: white; }
.list-item:hover { background-color:#f5f5f5; }

.list-item .image { width:350px; }
.list-item .image img { width:100%; }
.list-item .content { position:absolute; left:410px; right:40px; top:50%; transform:translateY(-50%); }
.list-item .content .head { font-size:1.4rem; font-weight:700; }
.list-item .content .content2 { color:gray; line-height:180%; }
.list-item .content .date {  }

@media (max-width: 991px) {
	.list-item .image { width:100%; }
	.list-item .content { position:static; padding:30px 10px 10px; transform:none; }
}

.list-item .list-details { margin-top:6px; padding:6px 0px; border-top:1px dotted #ccc; border-bottom:1px dotted #ccc; }
.list-item .list-details .member, .list-item .list-details .guest { color:#787878 !important; }
.list-item .content {  }
.list-item .list-sp { margin:0 7px; color:#ddd; font-size:11px; }