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



body .bg_contents .bg_contents_item {
  max-height: none;
}
.cate2 .topbox .namebox{
	justify-content: flex-start;
	gap: 15px;
}
.cate2 .topbox .namebox h3{
	font-size: clamp(22px,3.8vw,34px);
}
.cate2 .topbox .namebox p{
	font-size: clamp(13px,1.4vw,15px);
	color: #939393;
}
.pagetitle .titleitem {
	position: relative;
	z-index: 3;
}
.pagetitle .titleitem .txtbox{
	text-align: left;
	width: 65%;
	padding-right: 5%;
	animation-delay: 0.4s;
}
.pagetitle .titleitem .imgitem{
	width: 35%;
	animation-delay: 0.8s;
}
.pagetitle .titleitem .txtbox .titlebox{
	flex-direction: column;
	align-items: flex-start;
	min-height: 200px;
}

.main_contents .catewrap .cate1 .boxwrap_item1 .box > div{
	width: 25%;
	letter-spacing: 0.6rem;
}
.main_contents .catewrap .cate1 .boxwrap_item1 .box h3{
	width: auto!important;
}
.main_contents .catewrap .cate1 .boxwrap_item1 .box h3::first-letter{
	color: #E5124A!important;
}
.main_contents .catewrap .cate1 .boxwrap_item1 .box p{
	width: 75%;
}
.main_contents .catewrap .cate2{
	background-color: #1C1C1C;
}
.main_contents .catewrap .cate2 .boxwrap{
	gap: 15px;
	align-items: stretch;
}
.main_contents .catewrap .cate2 .boxwrap .box{
	position: relative;
	width: calc(100% / 4 - 45px / 4);
	padding: 5% 0;
}
.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(2){
	animation-delay: 0.2s;
}
.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(3){
	animation-delay: 0.4s;
}
.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(4){
	animation-delay: 0.6s;
}
body.on .main_contents .catewrap .cate2 .boxwrap .box::after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #140905;
	background: linear-gradient(180deg, rgba(20, 9, 5, 0.8) 0%, rgba(20, 9, 5, 0.6) 65%, rgba(15, 14, 14, 0.4) 100%);
}
.main_contents .catewrap .cate2 .boxwrap .box .txtbox{
	position: relative;
	z-index: 2;
	flex-direction: column;
	gap: 15px;
	padding: 5%;
}

.main_contents .catewrap .cate3 .titlebox h2:not(:last-of-type){margin-bottom: 10px;}
.main_contents .cate_wrap .cate2 .topbox .namebox{
	justify-content: flex-start;
	gap: 15px;
}
.main_contents .cate_wrap .cate2 .topbox .namebox h3{
	font-size: clamp(22px,3.8vw,34px);
}
.main_contents .cate_wrap .cate2 .topbox .namebox p{
	font-size: clamp(13px,1.4vw,15px);
	color: #939393;
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
	.main_contents .catewrap .cate2 .boxwrap{
		gap: 15px;
	}
	.main_contents .catewrap .cate2 .boxwrap .box{
		width: calc(100% / 2 - 15px / 2);
		padding: 5% 0;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(2){
		animation-delay: 0.2s;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(3){
		animation-delay: 0s;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(4){
		animation-delay: 0.2s;
	}
  

}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
    .boxwrap_item1 .box {
flex-direction: column;
}
    .boxwrap_item1 .box h3 {
        width: 100%;
    }
        .boxwrap_item1 .box p {
        width: 100%;
    }
    
.main_contents .catewrap .cate1 .boxwrap_item1 .box p {
    width: 100%;
}
	.pagetitle .titleitem .txtbox .titlebox{
		min-height: 150px;
	}
	.pagetitle .titleitem .txtbox{
		width: 100%;
		padding-right: 0;
		margin-bottom: 30px;
	}
	.pagetitle .titleitem .imgitem{
		width: 70%;
	}
	.main_contents .catewrap .cate2 .boxwrap{
		gap: 15px;
	}
	.main_contents .catewrap .cate2 .boxwrap .box{
		width: 100%;
		padding: 5% 0;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(2){
		animation-delay: 0s;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(3){
		animation-delay: 0s;
	}
	.main_contents .catewrap .cate2 .boxwrap .box:nth-of-type(4){
		animation-delay: 0s;
	}
  .main_contents .catewrap .cate3 .titlebox h2{
    font-size: 22px;
}
}