@charset "EUC-JP";

.sp {
	display: none !important;
}
@media screen and (max-width:1024px){
	.pc {
		display: none !important;
	}
}


.c-top-firstView{
	--firstViewSlideHeight:calc((100vw - var(--navigationSize)) * (685 / 1377));
}
.c-top-firstView{
	width:100%;
	height:var(--firstViewSlideHeight);
	overflow:hidden;
}
.c-top-firstView a,
.c-top-firstView img,
.c-top-firstView picture{
	width:100%;
	height:var(--firstViewSlideHeight);
	display:block;
	outline:none;
}
.c-top-firstView img{
	object-fit:cover;
	object-position:center;
}
.c-top-firstView a:hover{
	opacity:1;
}

@media (max-width:768px){
	.c-top-firstView{
		--firstViewSlideHeight:calc((100vw - var(--navigationSize)) * (504 / 375));
	}
}

.c-top-firstView .slick-arrow{
	width:45px;
	height:45px;
	padding-top:45px;
	overflow:hidden;
	position:absolute;
	top:50%;
	z-index:10;
}
.c-top-firstView .slick-prev{
	left:0;
}
.c-top-firstView .slick-next{
	right:0;
}
.c-top-firstView .slick-arrow::before{
	content:"";
	width:50%;
	height:50%;
	left:50%;
	top:50%;
	position:absolute;
	transform:translate(-50%,-50%) rotate(45deg);
	opacity:0.35;
}
.c-top-firstView .slick-prev::before{
	border-left:1px solid white;
	border-bottom:1px solid white;
}
.c-top-firstView .slick-next::before{
	border-top:1px solid white;
	border-right:1px solid white;
}

.c-top-firstView .slick-dots,
.c-top-firstView .slick-dots *{
	list-style:none;
	margin:0;
	padding:0;
}
.c-top-firstView .slick-dots{
	position:absolute;
	right:var(--contentSidePadding);
	bottom:0;
	display:flex;
	justify-content:right;
	gap:5px;
}
.c-top-firstView .slick-dots button{
	width:44px;
	height:30px;
	padding-top:30px;
	overflow:hidden;
	position:relative;
}
.c-top-firstView .slick-dots button::before{
	content:"";
	width:100%;
	height:1px;
	background:white;
	position:absolute;
	left:0;
	top:calc(50% - 0.5px);
}
.c-top-firstView .slick-dots .slick-active button::before{
	background:#DA1822;
}

@media (max-width:768px){
	.c-top-firstView .slick-arrow{
		width:30px;
		height:30px;
	}
	.c-top-firstView .slick-dots{
		gap:3px;
	}
	.c-top-firstView .slick-dots button{
		width:30px;
		height:30px;
	}
}















.c-top-news{
	--topNewsHeight:70px;
	width:100%;
	height:var(--topNewsHeight);
	position:relative;
	z-index:2;
}
.c-top-news::before{
	content:"";
	width:calc(100% - 120px);
	height:100%;
	left:0;
	top:0;
	position:absolute;
	background:var(--defaultColor);
	opacity:0.05;
}
.c-top-news .l-content{
	height:var(--topNewsHeight);
	overflow:hidden;
	position:relative;
	background-color: #191919;
	color: #fff;
}

@media screen and (min-width:1025px){
	.c-top-news .l-content{
		padding-right:120px;
	}
}
.c-top-news a,.c-top-news span{
	font-size:14px;
	height:var(--topNewsHeight);
	line-height:var(--topNewsHeight);
	white-space:nowrap;
	width:100%;
	text-overflow:ellipsis;
	display:block;
	color:var(--defaultColor);
	overflow:hidden;
}
.c-top-news a:hover{
	text-decoration:underline;
}
.c-top-newsListNext,.c-top-newsListPrev{
	width:60px;
	height:var(--topNewsHeight);
	position:absolute;
	top:0;
	right:0;
	cursor:pointer;
	z-index:3;
}
.c-top-newsListPrev{
	right:60px;
}
/*
.c-top-newsListNext::before,.c-top-newsListPrev::before{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	background:var(--defaultColor);
	opacity:0.05;
}
*/
.c-top-newsListNext::after,.c-top-newsListPrev::after{
	content:"";
	width:10px;
	height:10px;
	position:absolute;
	top:calc(50% - 5px);
	transition:right 0.2s ease-out,left 0.2s ease-out;
}
.c-top-newsListPrev::after{
	right:5px;
	border-top:1px solid var(--defaultColor);
	border-left:1px solid var(--defaultColor);
	transform:rotate(-45deg);
}
.c-top-newsListNext::after{
	left:5px;
	border-top:1px solid var(--defaultColor);
	border-right:1px solid var(--defaultColor);
	transform:rotate(45deg);
}

@media screen and (max-width:1024px){
	.c-top-news{
		--topNewsHeight:100px;
		display:flex;
		align-items:center;
	}
	.c-top-news::before{
		width:100%;
	}
	.c-top-news a {
		margin-top: 20px;
	}
	.c-top-news a,.c-top-news span{
		font-size:14px;
		line-height:20px;
		height:60px;
		white-space:normal;
		width:100%;
		padding-right:0;
		display:-webkit-box;
		display:box;
		overflow:hidden;
		-webkit-line-clamp:3;
		line-clamp:3;
		-webkit-box-orient:vertical;
		box-orient:vertical;
	}
	.c-top-newsListNext,.c-top-newsListPrev{
		width:35px;
		height:35px;
	}
	.c-top-newsListPrev{
		right:37px;
	}
	.c-top-newsListNext::before,.c-top-newsListPrev::before{
		content:none;
	}
	.c-top-newsListNext::after,.c-top-newsListPrev::after{
		content:"";
		width:6px;
		height:6px;
		position:absolute;
		top:calc(50% - 3px);
		transition:right 0.2s ease-out,left 0.2s ease-out;
	}
	.c-top-newsListPrev::after{
		right:5px;
		border-top:1px solid #fff;
		border-left:1px solid #fff;
		transform:rotate(-45deg);
	}
	.c-top-newsListNext::after{
		left:5px;
		border-top:1px solid #fff;
		border-right:1px solid #fff;
		transform:rotate(45deg);
	}
}
.c-top-information{
	margin-top:60px;
}
.c-top-informationImage{
	width:100%;
	position:relative;
	background-image: url(https://img.shop-pro.jp/tmpl_img/87/bg.gif);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.c-top-informationImage::before{
	content:"";
	padding-top:59.61%;
	display:block;
}
.c-top-informationMessage{
	width:680px;
	max-width:80%;
	padding:60px 60px 0 60px;
	line-height:200%;
	margin:-100px 0 0 auto;
	background:var(--defaultBackgroundColor);
	position:relative;
	z-index:3;
}

@media screen and (max-width:1024px){
	.c-top-informationMessage{
		width:calc(100% - 8vw);
		max-width:100%;
		padding:30px 4vw 0 4vw;
		line-height:180%;
		margin:-4vw auto 0 auto;
	}
}
.c-top-interval,
.c-top-ranking,
.c-top-message,
.c-top-freespace{
	margin-top:120px;
}

@media screen and (max-width:1024px){
	.c-top-interval,
	.c-top-ranking,
	.c-top-message,
	.c-top-freespace{
		margin-top:90px;
	}
}
.c-top-intervalImage{
	width:100%;
	max-height: 40vw;
	position:relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.c-top-intervalImage img{
	position:static;
}
.c-top-ranking .c-sliderPrev{
	position:absolute;
	right:52px;
	top:50%;
	transform:translatey(-50%);
}
.c-top-ranking .c-sliderNext{
	position:absolute;
	right:0;
	top:50%;
	transform:translatey(-50%);
}

@media screen and (max-width:1024px){
	.c-top-ranking .c-sliderPrev{
		right:37px;
	}
}
.c-top-messageImage{
	width:100%;
	position:relative;
}
.c-top-messageImage::before{
	content:"";
	padding-top:48.08%;
	display:block;
}
.c-top-message .l-content{
	width:100%;
	margin-top:40px;
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
}
.c-top-messageManager{
	width:33%;
}
.c-top-messageComment{
	width:calc(100% - 33% - 40px);
	line-height:200%;
}
.c-top-messageManagerName{
	font-family:var(--boldfont);
	font-weight:bold;
	font-size:24px;
	line-height:150%;
}
.c-top-messageLink{
	display:inline-block;
	margin-top:1em;
	color:var(--defaultColor);
	font-size:16px;
	line-height:150%;
	position:relative;
}
.c-top-messageLink::before{
	content:"";
	position:absolute;
	width:100%;
	height:1px;
	left:0;
	bottom:0;
	background:var(--defaultColor);
	opacity:0.5;
}

@media screen and (max-width:1024px){
	.c-top-messageImage{
		width:100%;
		position:relative;
	}
	.c-top-message .l-content{
		display:block;
	}
	.c-top-messageManager{
		width:100%;
		text-align:center;
	}
	.c-top-messageComment{
		width:100%;
		line-height:180%;
		margin-top:40px;
	}
	.c-top-messageManagerName{
		font-size:20px;
	}
	.c-top-messageLink{
		display:inline-block;
		margin-top:1em;
		color:var(--defaultColor);
		font-size:16px;
		line-height:150%;
		position:relative;
	}
}










.c-newItems{
	margin-top:120px;
}
.c-newItems .c-items{
	list-style:none;
	margin:60px 0 0 0;
	padding:0;
	color:white;
	width:100%;
	--gap:2.5%;
	--cols:6;
	gap:30px var(--gap);
}
.c-newItems .c-items::before,
.c-newItems .c-items::after{
	content:none;
}
.c-newItems .c-items a{
	margin:0;
	width:calc((100% / var(--cols)) - (var(--gap) * (var(--cols) - 1)) / var(--cols));
}
@media (max-width:1400px){
	.c-newItems .c-items{--cols:4}
}
@media (max-width:768px){
	.c-newItems{
		margin-top:60px;
	}
	.c-newItems .c-items{
		margin-top:30px;
		--cols:2;
	}
}
.c-newItems .c-items a:nth-child(n+13){
	display:none;
}











.c-recommend{
	margin-top:120px;
}
.c-recommend .c-items{
	--gap:2.5%;
	--cols:4;
	gap:30px var(--gap);
}
.c-recommend .c-items::before,
.c-recommend .c-items::after{
	content:none;
}
.c-recommend .c-items a{
	margin:0;
	width:calc((100% / var(--cols)) - (var(--gap) * (var(--cols) - 1)) / var(--cols));
}
@media (max-width:768px){
	.c-recommend{
		margin-top:60px;
	}
	.c-recommend .c-items{
		margin-top:30px;
		--cols:2;
	}
}
.c-recommend .c-items a:nth-child(n+9){
	display:none;
}











