@import url("sub.css");

.inner {
	padding: 0;
}
.business .visual {
	position: relative;
	background: url("../images/business/top-bg.png")no-repeat 50% 50% / cover;
	color: #fff;
	height: 711px;
}
.business .visual .visual-box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-family: 'Cafe24Ohsquare';
	font-size: 50px;
	letter-spacing: 5px;
	width: 100%;
}
.business .visual .visual-box p {
	font-family: 'Cafe24Ohsquareair';
}

.business .visual-thumb {
	position: relative;
	margin-top: -70px;
	color: #181927;
}
.business .visual-thumb > div {
	flex: 1;
}
.business .visual-thumb > div img {
	width: 100%;
}
.business .visual-thumb > div strong {
	font-family: 'Cafe24Ohsquare';
	font-size: 25px;
	margin-top: 25px;
}
.business .visual-thumb > div p {
	font-size: 13px;
	font-family: 'Cafe24Ohsquareair';	
	margin-top: 5px;
	font-weight: 300;
}

.business-info {
	border-top: 1px solid #1D224F;
	border-bottom: 1px solid #1D224F;
	margin-top: 120px;
	padding: 150px 0;
}
.business-info .thumb img {
	width: 660px;
}
.business-info .text {
	margin-top: 100px;
	font-family: 'Cafe24Ohsquareair';
	font-size: 25px;
	white-space: pre-line;
	line-height: 45px;
}
.business-info .text p {
    background: #1D224F;
    color: #fff;
    padding: 20px 10px;
    width: 85%;
    margin: 0 auto;
    font-weight: bold;
    box-sizing: border-box;
}

.business-img {
	margin-top: 150px;
}
.business-img td {
	padding: 5px 5px 0;
	vertical-align: top;
}
.business-img td.td-col {
	padding: 5px 0 0;
}
.business-img td.td-col td {
	padding: 5px;
}
.business-img img {
	height: 100%;
}

.fields h2 {
	margin-top: 200px;
}
.fields .list {
	margin: 0 auto 120px;
	font-size: 0;
}
.fields .list > div {
	display: inline-block;
    position: relative;
    width: calc(50% - 10px);
    color: #fff;
    margin: 5px;
    padding-bottom: 21.7%;
    
}
.fields .list > div .num {
	position: absolute;
	top: 40px;
	left: 45px;
	font-size: 25px;
	font-weight: bold;
	font-family: 'Cafe24Ohsquare';
}
.fields .list > div .box {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.fields .list > div strong {
    font-size: 35px;
    font-family: 'Cafe24Ohsquare';
}
.fields .list > div p {
	font-size: 23px;
    font-weight: 300;
    line-height: 30px;
    margin-top: 35px;
    font-family: 'Cafe24Ohsquareair';
}
.fields .list > div p span {
	color: #fbff00;
}
.fields .list .item01 {
	background: url("../images/business/bg_detail01.png")no-repeat 0 0 / 100%;
}
.fields .list .item02 {
	background: url("../images/business/bg_detail02.png")no-repeat 0 0 / 100%;
}
.fields .list .item03 {
	background: url("../images/business/bg_detail03.png")no-repeat 0 0 / 100%;
}
.fields .list .item04 {
	background: url("../images/business/bg_detail04.png")no-repeat 0 0 / 100%;
}
.fields .list .item05 {
	background: url("../images/business/bg_detail05.png")no-repeat 0 0 / 100%;
}
.fields .list .item06 {
	background: url("../images/business/bg_detail06.png")no-repeat 0 0 / 100%;
}
.fields .list > div:nth-child(2n) .num {
	left: auto;
	right: 45px;
}




@media screen and (max-width: 1600px){
	.business .visual .visual-box {
		font-size: 40px;
	}
	.business .visual-thumb {
		padding: 0 0.5% 0 1%;
	}
	.business .visual-thumb > div strong {
		font-size: 23px;
	}
	.business-info .thumb img {
	    width: 500px;
	}
	.business-info .text {
		margin-top: 70px;
		font-size: 20px;
		line-height: 1.7;
	}
	.business-info .text p {
		width: 90%;
	}
	.business-img img {
		width: 100%;
		height: auto;
	}
	.fields .list > div strong {
    	font-size: 30px;
    }
    .fields .list > div p {
	    font-size: 16px;
	    margin-top: 25px;
	    line-height: 1.5;
	}
}
@media screen and (max-width: 1024px){
	.inner {
		padding: 0 20px;
	}
	.business .visual .visual-box {
	    font-size: 35px;
	}
	.business .visual-thumb > div strong {
	    font-size: 17px;
	}
	.business .visual-thumb > div p {
    	font-size: 12px;
    }
    .business-info {
    	margin-top: 80px;
    	padding: 80px 0;
    }
    .business-info .thumb img {
	    width: 350px;
	}
	.business-info .text {
		font-size: 16px;
	}
	.business-info .text p {
		width: 100%;
	}
	.business-img {
	    margin-top: 90px;
	}
	.business-img td {
    	padding: 3px 3px 0;
    }
    .business-img td.td-col {
	    padding: 3px 0 0;
	}
	.business-img td.td-col td {
	    padding: 3px 3px 2px;
	}
	.fields h2 {
	    margin-top: 100px;
	}
	.fields .list {
		max-width: 950px;
	    margin: 0 auto 60px;
	}
	.fields .list > div {
		margin: 5px 0;
		background-size: 100%!important;
		width: 100%;
	    padding-bottom: 43.7%;
	}
	.fields .list > div strong {
    	font-size: 35px;
    }
    .fields .list > div p {
    	font-size: 18px;
    	margin-top: 25px;
    }
    .fields .list > div .num {
    	font-size: 20px;
    }
}
@media screen and (max-width: 768px){
	.business .visual {
		height: 400px;
	}
	.business .visual .visual-box {
	    font-size: 22px;
	}
	.business .visual-thumb {
		display: block;
		font-size: 0;
	}
	.business .visual-thumb > div {
		display: inline-block;
		vertical-align: top;
		width: 50%;
		margin-bottom: 5%;
	}
	.business .visual-thumb > div strong {
	    margin-top: 10px;
	}
	.business-info {
	    margin-top: 40px;
	    padding: 70px 0;
	}
	.business-info .thumb img {
	    width: 320px;
	}
	.business-info .text {
	    font-size: 13px;
	    margin-top: 45px;
	}
	.business-img {
	    margin-top: 70px;
	}
	.business-img colgroup {
		display: none;
	}
	.business-img td {
		display: block;
		padding: 5px 0;
	}
	.fields h2 {
	    margin-top: 70px;
	}
	.fields .list > div strong {
	    font-size: 20px;
	}
	.fields .list > div p {
	    font-size: 11px;
	    margin-top: 10px;
	    line-height: 1.8;
	}
	.fields .list > div .num {
	    font-size: 15px;
	    top: 20px;
	    left: 25px;
	}
	.fields .list > div:nth-child(2n) .num {
	    right: 25px;
	}
	.fields .list > div p span {
    	font-size: 10px;
    }
}
@media screen and (max-width: 640px){
}