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

.cate1{
	margin-bottom: 80px;
}
.cate1 .box_wrap{
	gap: 50px;
}
.cate1 .box_wrap .imgbox{
	width: calc(50% - 25px);
	margin-top: auto;
}
.cate1 .txtbox{
	width: calc(50% - 25px);
}
.cate1 .namebox{
	gap: 10px;
}
.cate1 .txtbox .topbox{
	align-items: flex-start;
	flex-direction: column;
	margin-right: auto;
}
.cate1 .txtbox .black-box{
	width: 100%;
	background-color: #2E2A27;
	padding: 50px 60px;
	margin-top: 40px;
	margin-bottom: -80px;
}

/* ---------- cate3 ---------- */
.cate3 .box_wrap {
	flex-direction: column;
	gap: 40px;
}
.cate3 .box_wrap .box-item{
	gap: 80px;
}
.cate3 .box_wrap .box-item .imgbox{
	width: calc(30% - 40px);
}
.cate3 .box_wrap .box-item .txtbox{
	width: calc(70% - 40px);
}
.cate3 .box_wrap .box-item .imgbox img{
	border-radius: 10px;
}
.cate3 .box_wrap .box-item .txtbox .topbox{
	flex-direction: column;
	gap: 40px;
	align-items: flex-start;
	padding-bottom: 40px;
	border-bottom: #B2B2B2 1px solid;
	margin-bottom: 40px;
}
.cate3 .box_wrap .box-item .txtbox .topbox .namebox .label{
	color: #9A9A9A;
	font-size: 14px;
}
.cate3 .box_wrap .box-item .txtbox .topbox .namebox .nameitem{
	gap: 10px;
}
.cate3 .box_wrap .box-item .txtbox .topbox .namebox .nameitem .en {
	color: #009746;
	font-size: 15px;
	font-family: "Orbitron",  sans-serif;
	font-weight: 600;
}

.cate4 .youtube-wrap{
	position: relative;
	width: 100%;
	max-width: 100%;
	padding-top: 56.25%;
}

.cate4 .youtube-wrap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	border: 5px #DCDDC7 solid;
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
	.cate1 .box_wrap .imgbox{
		width: calc(40% - 25px);
		margin-top: auto;
	}
	.cate1 .txtbox{
		width: calc(60% - 25px);
	}
	.cate3 .box_wrap .box-item {
		gap: 50px;
	}
	.cate3 .box_wrap .box-item .imgbox{
		width: calc(40% - 25px);
	}
	.cate3 .box_wrap .box-item .txtbox{
		width: calc(60% - 25px);
	}
	.cate3 .box_wrap .box-item .txtbox .topbox {
		gap: 30px;
		padding-bottom: 30px;
		margin-bottom: 30px;
	}
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
	.cate1 .box_wrap {
		flex-direction: column;
	}
	.cate1 .box_wrap .imgbox{
		width: 60%;
		margin-left: auto;
		margin-bottom: -400px;
	}
	.cate1 .txtbox{
		width: 90%;
	}
	.cate1 .box_wrap {
		gap: 0px;
	}
    .cate3 .box_wrap .box-item {
        flex-direction: column;
    }
	.cate3 .box_wrap .box-item .imgbox{
		width: 50%;
	}
	.cate3 .box_wrap .box-item .txtbox{
		width: 80%;
	}
	.cate3 .box_wrap {
		gap: 50px;
	}
    .cate3 .box_wrap .box-item {
        gap: 30px;
    }
    .cate3 .box_wrap .box-item .txtbox .topbox {
        gap: 20px;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
	.cate3 .box_wrap .box-item .imgbox{
		width: 60%;
	}
	.cate3 .box_wrap .box-item .txtbox{
		width: 100%;
	}
	.cate1 .txtbox .black-box {
		width: 100%;
		background-color: #2E2A27;
		padding: 40px 30px;
		margin-top: 40px;
		margin-bottom: -80px;
	}
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
	.company_a .company-wrap .item h3 {
        width: 20%;
    }
    .company_a .company-wrap .item > div {
        width: 80%;
        padding-left: 20px;
    }
	.company_a .company-wrap .item h3 span{
		display: inline-block;
	}
	.cate3 .box_wrap .box-item .imgbox{
		width: 80%;
	}
	.cate4 .youtube-wrap iframe{
		border-radius: 10px;
	}
	.cate1 .box_wrap .imgbox{
		width: 70%;
		margin-right: -50px;
	}
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}