.subf_view::before {
	background:url(../images/cb400four/bg_subf_cb400four.jpg) no-repeat center / cover;
}

/*-------------------------------
	cb_top
-------------------------------*/

.cb_top {
	padding:70px 0 180px;
}

.cb_affe {
	position:relative;
}


.cb_img {
	/* width:82%; */
	width:60vw;
	min-width:800px;
	max-width:1164px;
	position:absolute;
	left:50%;
	top:70px;
}

.cb_block {
	position:relative;
}

.cb_block .inner {
	min-height:870px;
	padding-top:110px;
	padding-bottom:180px;
}

.cb_block .inner::after {
	content:"";
	display: block;
	width:85px;
	height:320px;
	background:#dd2c32;
	transform-origin:center center;
	transform: skew(-21deg, 0deg);
	-webkit-transform: skew(-21deg, 0deg);
	position:absolute;
	bottom:0;
	left:34%;
	z-index: 5;
}

.cb_block02 .inner::after {
	transform: skew(21deg, 0deg);
	-webkit-transform: skew(21deg, 0deg);
	right:34%;
	left:auto;
}


.cb_block::after {
	content:"";
	display: block;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
}

.cb_block01::after,
.cb_block03::after {
	background: rgb(255,255,255);
	background: linear-gradient(111deg, rgba(255,255,255,0) 42%, rgba(25,24,25,1) 42%);
}

.cb_block02::after {
	background: rgb(255,255,255);
	background: linear-gradient(249deg, rgba(255,255,255,0) 42%, rgba(255,255,255,1) 42%);
}

.cb_block::before {
	content:"";
	display: block;
	width:68%;
	height:100%;
	position:absolute;
	top:0;
}

.cb_block01::before {
	background:url(../images/cb400four/bg_cb01.png) no-repeat right center / cover;
	right:50%;
}

.cb_block02::before {
	background:url(../images/cb400four/bg_cb02.png) no-repeat left center / cover;
	left:50%;
}

.cb_block03::before {
	background:url(../images/cb400four/bg_cb03.png) no-repeat right center / cover;
	right:50%;
}

.cb_txt {
	width:52%;
	padding-right:40px;
	position:relative;
	z-index: 4;
}

.cb_txt h2 {
	padding-top:160px;
	position:relative;
	margin-bottom:40px;
}

.cb_txt h2 span {
	display: block;
	font-size:4rem;
	line-height:1.375;
	letter-spacing: 0.1em;
	position:relative;
	font-weight:bold;
	z-index: 4;
}

.cb_txt h2::before {
	content:attr(data-en);
	display: block;
	font-size:20rem;
	letter-spacing: 0.025em;
	position:absolute;
	top:0;
	font-family: oswald,sans-serif;
	font-weight: 700;
	font-style: normal;
	font-style: italic;
	line-height:1;
	z-index: 3;
}

.cb_txt p:not(:last-of-type){
	margin-bottom:1em;
}

.cb_txt p span {
	font-size:1.6rem;
	display: block;
	line-height:1.875;
}

.cb_top .cb_txt h2::before {
	color:rgba(76,76,76,0.2);
	left:-1em;
}

.cb_block01 .cb_txt h2::before {
	color:rgba(219,42,49,0.3);
	left:0.75em;
}

.cb_block02 .cb_txt h2::before {
	color:rgba(219,42,49,0.3);
	left:-0.5em;
}

.cb_block03 .cb_txt h2::before {
	color:rgba(219,42,49,0.3);
	left:0.25em;
}

.cb_block01 .cb_txt,
.cb_block03 .cb_txt  {
	margin-left:auto;
}

.cb_block01 .cb_txt p,
.cb_block03 .cb_txt p {
	color:#fff;
}


@media screen and (max-width:1800px) {

	.cb_top .cb_txt h2::before {
		left:0.25em;
	}

	

	.cb_block01::before {
		right:48%;
	}
	
	.cb_block02::before {
		left:48%;
	}
	
	.cb_block03::before {
		right:48%;
	}

	.cb_block .inner::after {
		left:32%;
	}

	.cb_block02 .inner::after {
		right:32%;
		left:auto;
	}


	@media screen and (max-width:1500px) {

		.cb_block01 .cb_txt h2::before {
			left:-0.35em;
		}
		
		.cb_block02 .cb_txt h2::before {
			left:0.25em;
		}
		
		.cb_block03 .cb_txt h2::before {
			left:-0.35em;
		}

		.cb_block01::before {
			right:44%;
		}
		
		.cb_block02::before {
			left:44%;
		}
		
		.cb_block03::before {
			right:44%;
		}
		
		.cb_block .inner::after {
			left:30%;
		}
	
		.cb_block02 .inner::after {
			right:30%;
			left:auto;
		}
	
	}/* end 1500px */
	
} /* end 1800px */




/* ---------  ver.SmartPhone ------------ */

@media screen and (max-width:768px){

	.subf_view::before {
		background-position:10% center;
	}
	
	/*-------------------------------
		cb_top
	-------------------------------*/
	
	.cb_top {
		padding:7.5vw 0 10vw;
	}
	
	.cb_img {
		/* width:82%; */
		width:116.5vw;
		min-width:auto;
		max-width:none;
		left:2.5vw;
		top:auto;
		bottom:0vw;
	}

	.cb_affe {
		padding-bottom:77.5vw;
	}
	
	.cb_block .inner {
		min-height:auto;
		padding-top:145vw;
		padding-bottom:20vw;
	}
	
	.cb_block .inner::after {
		width:47vw;
		height:13vw;
		transform: rotate(-21deg) skew(-21deg, 0deg);
		-webkit-transform:  rotate(-21deg) skew(-21deg, 0deg);
		top:106vw;
		bottom:auto;
		left:auto;
		right:-2vw;
	}
	
	.cb_block02 .inner::after {
		transform: rotate(21deg) skew(21deg, 0deg);
		-webkit-transform: rotate(21deg) skew(21deg, 0deg);
		right:auto;
		left:-2vw;
		top:111vw;
	}

	.cb_block03 .inner::after {
		top:98vw;
	}
	
	
	.cb_block01::after,
	.cb_block03::after {
		background: rgb(255,255,255);
		background: linear-gradient(339deg,  rgba(25,24,25,1) 57%,rgba(255,255,255,0) 57%);
	}
	
	.cb_block02::after {
		background: rgb(255,255,255);
		background: linear-gradient(21deg, rgba(255,255,255,1) 55%, rgba(255,255,255,0) 55%);
	}
	
	.cb_block::before {
		width:100%;
		height:145vw;
		position:absolute;
		top:0;
		left:0;
		right:auto;
	}
	
	.cb_block01::before {
		background:url(../images/cb400four/bg_cb01_sp.png) no-repeat top center / cover;
	}

	.cb_block02 .inner {
		padding-top:152.5vw;
	}
	
	.cb_block02::before {
		background:url(../images/cb400four/bg_cb02_sp.png) no-repeat top center / cover;
		height:152.5vw;
	}
	
	.cb_block03::before {
		background:url(../images/cb400four/bg_cb03_sp.png) no-repeat top center / cover;
	}
	
	.cb_txt {
		width:100%;
		padding-right:0px;
	}
	
	.cb_txt h2 {
		padding-top:20vw;
		margin-bottom:7.5vw;
	}
	
	.cb_txt h2 span {
		font-size:2.2rem;
	}
	
	.cb_txt h2::before {
		font-size:10rem;
	}
	
	.cb_txt p:not(:last-of-type){
		margin-bottom:1em;
	}

	.cb_txt p,
	.cb_txt p span {
		letter-spacing: 0;
	}
	
	.cb_txt p span {
		font-size:1.4rem;
	}
	
	.cb_top .cb_txt h2::before {
		left:0.5em;
	}
	
	.cb_block01 .cb_txt h2::before {
		left:0.75em;
	}
	
	.cb_block02 .cb_txt h2::before {
		left:-0.5em;
	}
	
	.cb_block03 .cb_txt h2::before {
		left:0.25em;
	}
	



}