@charset "utf-8";

/* ------------------------------------------------------------ episode */
#episodes{ padding: 75px 0 0; }
#episodes .title{ padding: 0 0 70px; }
#episodes .title.avater:before{ width: 105px; height: 152px; bottom: 78px; left: 3%; background-image: url(../images/avater/cat-04.png); }
#episodes .title.avater:after{ width: 88px; height: 157px; bottom: 55px; right: 4%; background-image: url(../images/avater/sheep-04.png); }

.episode-archive{ }
.episode-archive__list{ display: flex; align-items: stretch; flex-wrap: wrap; gap: 55px 37px; }
.episode-card{ width: calc(100% / 3 - 25px); }
.episode-card__link{ display: block; height: 100%; position: relative; background: #fff; }
.episode-card__link:hover{ opacity: 1; }
.episode-card__link::after{ content: ""; z-index: -1; position: absolute; right: -8px; top: 8px; width: 100%; height: 100%; background-image: repeating-linear-gradient(122deg, #df131f, #df131f 1px, transparent 1px, transparent 5px); }

.episode-card__media{ width: 100%; }
.episode-card__media img{ width: 100%; height: auto; }
.episode-card__body{ padding: 20px; }
.episode-card__title{ margin: 0 0 15px; font-size: 15px; font-family: 'Noto-Sans-JP-Medium'; }
.episode-card__text{ padding: 0 0 20px; font-size: 15px; line-height: 2; font-family: "hiragino-kaku-gothic-pron", sans-serif; font-weight: 300; font-style: normal; }


/* ------------------------------------------------------------ details */
#epi-article{ padding: 80px 0 0; }
.epi-inner{ width: 900px; margin: 0 auto }

.article__title{ position: relative; margin: 0 0 34px; padding: 0 0 25px; font-size: 34px; font-family: 'Noto-Sans-JP-Bold'; text-align: center; }
.article__title:before{ position: absolute; content: ""; width: 85px; height: 1px; background: var(--main-color); left: 50%; bottom: 0; transform: translate(-50%,0); }
.article__kv{ padding: 0 0 60px; }
.article__kv img{ width: 100%; height: auto; }
.article__text{ padding: 0 0 30px; line-height: 2.5; }
.article__faq{ padding: 0 0 30px; }
.article__faq dt{ line-height: 2.5; }
.article__faq dd{ line-height: 2.5; }

.article__text span{font-family: 'Noto Sans JP', sans-serif;font-weight: 700 !important;}

#onther-epi{ padding: 80px 0 0; }
#onther-epi .toppage{ padding: 70px 0 0; }

/* additnal blog style */
.blog__h3{ position: relative; padding: 5px 0 5px 20px; margin: 60px 0 30px; font-size: 26px; font-family: 'Noto-Sans-JP-Bold'; line-height: 1.5; }
.blog__h3:before{ position: absolute; content: ""; left: 0; top: 0; width: 9px; height: 100%; background: var(--main-color); }
.blog__h3:first-of-type{ margin-top: 0; }
.blog__btn { margin: 20px 0; }
.blog__link{ display: flex; align-items: center; justify-content: center; width: 425px; height: 75px; margin: 0 auto; font-size: 25px; border-radius: 100px; color: #fff!important; background: var(--main-color); box-shadow: 0px 7px 0px 0px #A5000A; }

.art_pic{padding: 0 0 30px;}
.art_pic img{ width: 100%; height: auto;}
    
    
/* ----------------------------- mobile ------------------------------- */
@media only screen and (max-width: 768px) {
	
	.fv__chach.avater:before{ width: 80px; height: 116px; bottom: 30px; left: -2%; background-image: url(../images/avater/cat-04.png); }
	.fv__chach.avater:after{ width: 80px; height: 135px; bottom: 18px; right: -2%; background-image: url(../images/avater/sheep-04.png); }	

/* ------------------------------------------------------------ episode */
	#episodes{ padding: 20px 0 0; }
	#episodes .title{ padding: 0 0 40px; }
	
	.episode-archive{ }
	.episode-archive__list{ display: block; }
	
	.episode-card{ width: 100%; margin: 0 0 40px; }
	.episode-card:last-of-type{ margin: 0; }
	.episode-card__link::after{ right: -6px; top: 6px; }
	.episode-card__body{ padding: 16px; }
	.episode-card__title{ margin: 0 0 12px; font-size: 14px; line-height: 1.6; }
	.episode-card__text{ padding: 0 0 15px; font-size: 14px; line-height: 1.8; }


/* ------------------------------------------------------------ details */
	#epi-article{ padding: 20px 0 0; }
	.epi-inner{ width: 90% }
	
	.article__title{ margin: 0 0 25px; padding: 0 0 18px; font-size: 22px; line-height: 1.6; }
	.article__title:before{ width: 60px; }
	.article__kv{ padding: 0 0 35px; }
	.article__text{ padding: 0 0 25px; font-size: 14px; line-height: 2; }
	.article__faq{ padding: 0 0 20px; }
	.article__faq dt{ padding: 0 0 5px; font-size: 14px; line-height: 2; }
	.article__faq dd{ font-size: 14px; line-height: 2; }
	
	
	#onther-epi{ padding: 40px 0 0; }
	#onther-epi .toppage{ padding: 40px 0 0; }
/* 	.onther-epi__btn .btn{ width: 90%; } */


	.blog__h3{ margin: 38px 0 18px; padding: 4px 0 4px 14px; font-size: 18px; line-height: 1.5; }
	.blog__h3:before{ width: 6px; }
	.blog__text{ margin: 10px 0; font-size: 14px; }
	
	.blog__link{ width: 100%; height: 55px; font-size: 16px; }

		
	
}