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


		
		@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Hind+Madurai:wght@300;400;500;600;700&family=Noto+Sans+Tamil:wght@100..900&family=Oooh+Baby&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');
		html,
		body {
			padding: 0;
			margin: 0;
		}
		#by {
			padding: 0;
			margin: 0 auto;
			letter-spacing: 1px;
			line-height: 2;
			max-width: 1200px;
			width: 100%;
			margin-bottom: 50px;
			font-family: "Noto Sans JP", sans-serif;
			overflow: hidden;
		}
		#by ul,#by li {
			list-style: none;
			padding: 0;
			margin: 0;
		}
		#by a {
			color: #000000;
			text-decoration: none;
		}
		#by img {
			width: 100%;
			border: none;
			line-height: 0;
			vertical-align: bottom;
		}
		/*////pcview////*/
		   .spview {
				display: none;
			}    
			.pcview {
				display: block;
			}
		@media only screen and (max-width: 768px)  {
		   .spview {
				display: block;
			}    
		   .pcview {
				display: none;
			}    
			p{
				margin: 0;
				padding: 0;
			}
		}



		#by_header{
			width: 100%;
			margin: 5% auto;
		}	
	
		#by_header .tit{
			max-width: 400px;
			margin: 0 auto;
			width: 90%;
		}	



@media only screen and (max-width: 768px)  {	
	
	#by_header{
		margin: 10% auto;
	}
	
	#by_header .tit{
		max-width: 450px;	
		width: 70%;
	}	

	
}

#by_main{
	width: 100%;
	margin: 0 auto;
}

#by_main{
	width: 100%;
	margin: 0 auto;
}
#by_main .inner{
	width: 80%;
	margin: 0 auto;
	position: relative;
	display:flex;
	justify-content: space-around;
	
}
#by_main .inner .box{
	width: 48%;
}

#by_main .inner .credit_box{
	width: 90%;
	margin: 3% auto auto 0;
	position: relative;
}

#by_main .inner .credit_box li{
	display:  flex;
	position: relative;
	margin: 2% auto;
}

#by_main .inner .credit_box .new{
	width: 12%;
	margin: 0;
	font-family: "Roboto Condensed", sans-serif;
}
#by_main .inner .credit_box .new img{
	line-height: 0;
	vertical-align: bottom;
}
#by_main .inner .credit_box .credit{
	width: 95%;
	margin-left: 15px;
}

#by_main .inner .credit_box .credit .txt{
	font-size: 10px;
	line-height: 1.5;
	margin-top: 5px;
}

#by_main .inner .credit_box .credit .buy{
	font-size: 13px;
	line-height: 1;
}
#by_main .inner .credit_box .credit .buy a{
	margin-left: 15px;
	max-width: 60px;
	width: 100%;
	font-size: 12px;
	padding: 5px 10px;
	display: inline-block;
	background: #000;
	color: #fff;
	text-align: center;
	border-radius: 50px;
	font-family: "Roboto Condensed", sans-serif;
}


#by_main .more_box{
	width: 80%;
	margin: 8% auto 1%;
}

#by_main .more_box h2{
	font-size: 30px;
	text-align: center;
	font-family: "Roboto Condensed", sans-serif;
	margin: 2% auto;
}

#by_main .more_box .more{
	display: flex;
	justify-content: space-around;
}

#by_main .more_box .more .section{
	width: 48%;
}
#by_main .section .credit{
	width: 95%;
	margin-left: 5px;
}

#by_main .section .credit .txt{
	font-size: 10px;
	line-height: 1;
}

#by_main .section .credit .buy{
	font-size: 13px;
	line-height: 1;
	margin: 10px auto;
}
#by_main .section .credit .buy a{
	margin-left: 15px;
	max-width: 60px;
	width: 100%;
	font-size: 12px;
	padding: 5px 10px;
	display: inline-block;
	background: #000;
	color: #fff;
	text-align: center;
	border-radius: 50px;
	font-family: "Roboto Condensed", sans-serif;
}





@media only screen and (max-width: 768px)  {
#by_main .inner{
	width: 100%;
}
#by_main .inner .box{
	width: 50%;
	margin-bottom: 12%;
}

#by_main .inner .credit_box{
	width: 95%;
	margin: 2% auto auto 2%;
}

#by_main .inner .credit_box li{
	display:  flex;
	position: relative;
	margin: 4% auto;
}

#by_main .inner .credit_box .new{
	width: 13%;
	margin: 0;
	font-family: "Roboto Condensed", sans-serif;
	display: none;
}
#by_main .inner .credit_box .new img{
	line-height: 0;
	vertical-align: bottom;
}
#by_main .inner .credit_box .credit{
	width: 100%;
	margin-left: 5px;
}

#by_main .inner .credit_box .credit .txt{
	font-size: 9px;
	line-height: 2;
	margin-top: 0px;
}

#by_main .inner .credit_box .credit .buy{
	font-size: 12px;
	line-height: 1;
}
#by_main .inner .credit_box .credit .buy a{
	margin-left: 5px;
	max-width: 40px;
	width: 100%;
	font-size: 10px;
	padding: 3px 10px;
	display: inline-block;
	background: #000;
	color: #fff;
	text-align: center;
	border-radius: 50px;
	font-family: "Roboto Condensed", sans-serif;
}


#by_main .more_box{
	width: 100%;
	margin: 5% auto 5%;
}

#by_main .more_box h2{
	font-size: 22px;
	text-align: center;
	font-family: "Roboto Condensed", sans-serif;
	margin: auto auto 0;
}

#by_main .more_box .more{
	display: flex;
	justify-content: space-around;
}

#by_main .more_box .more .section{
	width: 50%;
}
#by_main .section .credit{
	width: 100%;
	margin-left: 2px;
}

#by_main .section .credit .txt{
	font-size: 10px;
	line-height: 1;
}

#by_main .section .credit .buy{
	font-size: 12px;
	line-height: 1;
	margin: 10px auto auto 5px;
}
#by_main .section .credit .buy a{
	margin-left: 2px;
	max-width: 35px;
	width: 100%;
	font-size: 10px;
	padding: 3px 7px;
	display: inline-block;
	background: #000;
	color: #fff;
	text-align: center;
	border-radius: 50px;
	font-family: "Roboto Condensed", sans-serif;
}
	
	
	
	
}



span{
	font-size: 9px;
}


.slick-prev {
   display: none;
}
.slick-prev:before {
    display: none;
}


/*--------------アニメーション--------------*/

.anim{
		opacity: 0;
		transition: 2.5s all 0s ease;
}

.anim.ac{
		opacity:1;
}