@charset "utf-8";
/* CSS Document */
.cardWraper { position: relative; }
.cardWraper .swiper-button-prev:after {
    content: 'prev';
    color: rgba(255,255,255,0.9);
    border-radius: 25px;
    font-size: 1rem;
}
.cardWraper .swiper-button-next:after {
    content: 'next';
    color: rgba(255,255,255,0.9);
    border-radius: 25px;
    font-size: 1rem;
}

.cardWraper .swiper-button-prev,.cardWraper .swiper-button-next {
    width: 50px;
	height: 50px;
	border-radius: 25px;
	background: rgba(187,187,187,0.5);
}

.cardWraper .swiper-parentDiv .swiper-pagination { display: flex; justify-content: flex-start; margin:20px auto; }
.cardWraper .swiper-pagination-bullet { border-radius: 0px; width: 30px; height: 2px; background: var(--base-color); margin: 10px 1px; }

@media screen and (max-width: 599px) {
	.cardWraper { margin-bottom: 40px; }
	.cardWraper .swiper-button-prev,.cardWraper .swiper-button-next { width: 30px; height: 30px; border-radius: 15px; }
	.cardWraper .swiper-button-prev:after,.cardWraper .swiper-button-next:after { font-size: 0.7rem; }
	
	.cardWraper .swiper-button-prev { left: 10px;}
	.cardWraper .swiper-button-next { right: 10px;}
	
	.cardWraper .swiper-slide-card div { margin-bottom: 10px; }
	.cardWraper .swiper-slide-card h4 { text-align: left; margin-bottom: 10px; font-size: 0.9rem; }
	.cardWraper .swiper-slide-card p { font-size: 0.8rem; }
}
@media screen and (min-width: 600px) {
	.cardWraper .swiper-wrapper-card { margin-bottom: 40px; }
	.cardWraper .swiper-slide-card div { margin-bottom: 10px; }
	.cardWraper .swiper-slide-card h4 { text-align: left; margin-bottom: 10px; }
	.cardWraper .swiper-slide-card p { font-size: 0.9rem; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.cardWraper .swiper-button-prev,.cardWraper .swiper-button-next { width: 40px; height: 40px; border-radius: 20px; }
	.cardWraper .swiper-button-prev { left: 10px;}
	.cardWraper .swiper-button-next { right: 10px;}
}
@media screen and (min-width: 900px) and (max-width: 1079px) {
	.cardWraper .swiper-button-prev,.cardWraper .swiper-button-next { width: 45px; height: 45px; border-radius: 22.5px;}
	.cardWraper .swiper-button-prev { left: 10px;}
	.cardWraper .swiper-button-next { right: 10px;}
}
@media screen and (min-width: 1080px) {
	.cardWraper .swiper-button-prev { left: -10px;}
	.cardWraper .swiper-button-next { right: -10px;}
}

.cardWraper li h4 a         { resize: none; position: relative;}
.cardWraper li h4 a:link    { color:#000; text-decoration: none; }
.cardWraper li h4 a:visited { color:#000; text-decoration: none; }
.cardWraper li h4 a:hover   { color:var(--base-color); text-decoration: none; }
.cardWraper li h4 a:active  { color:#000; text-decoration: none; }
.cardWraper li h4 a::after {
	position: absolute;
	bottom: -10px;
	left: 0%;
	content: '';
	width: 90%;
	height: 1px;
	background: var(--base-color);
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
	z-index: 1;
}
.cardWraper li h4 a:hover::after {
	transform: scale(1, 1);
}

.cardWraper li .cate { display: flex; margin-bottom: 10px; }
.cardWraper li .cate dt { background: var(--base-color); color: #fff; font-size: 0.7em; border: 1px solid var(--base-color); padding: 2px 5px; line-height: 1.0; }
.cardWraper li .cate dd { background: #fff; color: var(--base-color); font-size: 0.7em; border: 1px solid var(--base-color); padding: 2px 5px; line-height: 1.0; }
.cardWraper li .cate dd .jp { font-family: 'Noto Serif JP','游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro', serif; margin-left: 5px; }