@charset "UTF-8";

.triangle{
	height:120px;
	width:100%
}

@media (max-width:768px){
	.triangle{
		height:48px
	}
}

.triangle-rotate{
	transform:scaleY(-1)
}

.triangle-outer{
	background:#e6e6e6;
	padding-bottom:2px;
	position:relative;
	z-index:-1
}

.triangle-outer img:first-child{
	bottom:0;
	left:0;
	height:100%;
	right:0;
	top:0;
	position:absolute;
	width:100%;
	bottom:auto;
	height:calc(100% - 2px);
	top:2px
}

.triangle-outer img:first-child.triangle-rotate{
	transform:rotate(180deg)
}

.section{
	padding:80px 80px 64px
}

@media (max-width:768px){
	.section{
		padding:40px 24px 56px
	}
}

.section-title{
	font-size:22px;
	padding:24px 0 88px;
	text-align:center;
	letter-spacing:16px;
	margin-right:-16px
}

@media (max-width:768px){
	.section-title{
		font-size:13px;
		letter-spacing:8px;
		margin-right:-8px;
		padding:4px 0 32px
	}
}

.section-title{
	font-weight:700
}

@media (max-width:768px){
	.section-title{
		padding-bottom:24px
	}
}

.section-title span{
	color:rgba(43,56,84,.5);
	display:block;
	font-size:34px;
	letter-spacing:.12em;
	margin-right:-.12em
}

@media (max-width:768px){
	.section-title span{
		font-size:16px
	}
}

.section-title b{
	display:block;
	font-size:17px;
	letter-spacing:8px;
	margin-right:-8px
}

@media (max-width:768px){
	.section-title b{
		font-size:12px;
		letter-spacing:.4em;
		margin-right:-.4em
	}
}

.sectionSubtitle-en{
	display:block;
	letter-spacing:.1em;
	line-height:1;
	font-size:30px;
	font-weight:500;
	padding-top:8px
}

@media (max-width:768px){
	.sectionSubtitle-en{
		font-size:19px;
		padding-top:0
	}
}

.hero{
	position:relative;
	text-align:center;
}

.hero-innerbox{
	position:relative;
}
.hero-innerbox .hideSP{
	width:100%;
}
.hero-innerbox .hero-logo{
	position:absolute;
	top:19%;
	left:14%;
	width:24%
}

@media (max-width:768px){
	.hero{
	}
	.hero-innerbox .hero-logo{
		top:15%;
		left:30%;
		width:40%
	}
}

.lede{
	padding:24px 0 80px;
	position:relative
}

@media (max-width:768px){
	.lede{
		padding:0;
		margin:24px auto 0;
		max-width:560px
	}

}

.lede-title{
	font-size:20px;
	letter-spacing:.1em;
	padding-bottom:24px
}
.lede-title b{
	font-weight:500;
}
@media (max-width:768px){
	.lede-title{
		font-size:14px
	}
}

.lede-text{
	font-size:16.5px;
	line-height:2.4
}

@media (max-width:768px){
	.lede-text{
		font-size:12px;
		line-height:2
	}
}

.flow{
	background:#e6e6e6
}

.flow-top{
	padding-top:0;
	padding-bottom:0
}

@media (max-width:768px){
	.flow-top{
		padding:0 10px
	}

	.flow-top .section-subtitle{
		padding:0 14px
	}
}

.flow-top>*{
	position:relative;
	z-index:1
}

.business-flow-text{
	padding:2em 0;
	font-size:22px;
	font-weight:500;
	text-align:center;
}
.business .section-title b{
	font-size:30px;
	font-weight:500;
}

@media (max-width:768px){
	.business .section-title b{
		font-size:19px;
	}
	.business-flow-text{
		font-size:13px;
	}
}

.flow-second{
	background:#fff;
	padding-bottom:0;
	position:relative
}

@media (max-width:768px){
	.flow-second{
		padding:26px 0 0
	}
}

.flow-second img{
	position:relative;
	z-index:1
}

.flow-second:after{
	background:#e6e6e6;
	bottom:0;
	content:"";
	display:block;
	left:50%;
	height:7%;
	margin-left:-50vw;
	position:absolute;
	width:100vw;
	z-index:0
}


#ourbusiness .flowTop-title{
	font-size:16px;
	letter-spacing:.2em;
	padding:24px;
	position:relative;
	text-align:center;
	margin:56px 0 0 -.2em
}

@media (max-width:768px){
	#ourbusiness .flowTop-title{
		font-size:10px;
		padding:8px 8px 12px;
		margin:32px 0 0 -.2em
	}
}

#ourbusiness .flowTop-title:before{
	background:#f6d60b;
	content:"";
	display:block;
	left:50%;
	height:144px;
	margin-left:-50vw;
	top:0;
	position:absolute;
	width:100vw;
	z-index:-1
}

@media (max-width:768px){
	#ourbusiness .flowTop-title:before{
		height:72px
	}
}

#ourbusiness .flowSecond-title{
	font-size:17px;
	text-align:center;
	padding-bottom:40px
}

@media (max-width:768px){
	#ourbusiness .flowSecond-title{
		font-size:10px;
		padding-bottom:18px
	}
}

#ourbusiness .flowSecond-title img{
	width:300px;
	max-width:40%;
	margin-bottom:16px
}

@media (max-width:768px){
	#ourbusiness .flowSecond-title img{
		margin-bottom:2px;
		width:116px
	}
}

#ourbusiness .flow-last{
	padding-top:0
}

@media (max-width:768px){
	#ourbusiness .flow-last{
		padding:0 0 32px
	}
}

#ourbusiness .business{
	padding-bottom:80px
}

@media (max-width:768px){
	#ourbusiness .business{
		padding:16px 0 40px
	}
}

#ourbusiness .business ul{
	display:flex;
	margin:0 -2px
}

@media (max-width:768px){
	#ourbusiness .business ul{
		display:block;
		padding:0 24px;
		margin:0
	}
}

#ourbusiness .business li{
	flex:1;
	padding:0 2px
}

@media (max-width:768px){
	#ourbusiness .business li:not(:last-child){
		margin-bottom:10px
	}
}

#ourbusiness .business a{
	background:50% no-repeat;
	background-size:cover;
	color:#fff;
	display:block;
	padding-top:100%;
	position:relative
}

@media (max-width:768px){
	#ourbusiness .business a{
		padding-top:52.3%
	}
}

#ourbusiness .business a span{
	background:rgba(44,54,67,.7);
	bottom:0;
	left:0;
	line-height:1.4;
	overflow:hidden;
	position:absolute;
	text-align:center;
	width:100%;
	height:25%;
	display:flex;
	justify-content:center;
	align-items:center;
}

@media (max-width:768px){
	#ourbusiness .business a span{
		padding:8px 0
	}
}

#ourbusiness .business a b{
	display:block;
	font-size:20px;
	letter-spacing:.1em;
	text-indent:.1em;
}

@media (max-width:768px){
	#ourbusiness .business a b{
		font-size:15px;
	}
}

#ourbusiness .business a small{
	display:block;
	font-size:14px;
	letter-spacing:.1em;
	text-indent:.1em
	padding-top:12px;
}

@media (max-width:768px){
	#ourbusiness .business a small{
		font-size:11px;
		padding-top:2px
	}
}

.breadcrumbs + .section{
	padding-top:40px;
}