
/* Home
=========================================================================
=========================================================================*/
/* Hero Area
-----------------------------------------------------------*/
#home #heroarea {
	overflow: hidden;
	position: relative;
	padding: 158px 0 90px;
	width: 100%;
	height: 1102px;
}
#home #heroarea::before {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: calc(875 / 1600 * 100%);
	height: 100%;
	background: url('../img/home/heroarea_bg.png') right top no-repeat;
	background-size: cover;
}
/* ----- background movie ----- */
#home #heroarea .bg-video {
	position: absolute;
	top: 0;
	left: 50%;
  transform: translate(-50%);
	height: 100%;
	background: url('.../img/movie/firstframe.jpg') no-repeat;
	background-size: cover;
	z-index: -100;
}
/* ----- contents ----- */
#home #heroarea .cols {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	margin-bottom: 70px;
}
#home #heroarea .cols .text {
	width: 756px;
	width: calc(756 / 1200 * 100%);
}
#home #heroarea .cols figure {
	margin-right: -100px;
	width: 485px;
	width: calc(485 / 1200 * 100%);
}
@media screen and (max-width:1200px) {
	#home #heroarea .cols figure {
		margin-right: 0;
	}
}
#home #heroarea h1 {
	margin-bottom: 1em;
	font-weight: 900;
	font-size: 4rem;
	line-height: 1.4em;
}
#home main#jp #heroarea h1 {
	font-size: 3.6rem;
}
#home #heroarea h2 {
	margin-bottom: 1.3em;
	font-weight: 900;
	font-size: 3rem;
	line-height: 1.4em;
	color: #616161;
}
#home #heroarea h3 {
	margin-bottom: .5em;
	font-weight: 900;
	font-size: 4.4rem;
	line-height: 1.4em;
	text-align: center;
}
/* button */
#home #heroarea a.button {
	display: block;
	width: 228px;
	height: 46px;
	font-weight: 700;
	font-size: 2rem;
	line-height: 46px;
	text-align: center;
	color: #FFF;
	text-decoration: none;
	/* background: linear-gradient(to bottom, #ffaf19, #fe9b00); */
	background: #242424;
	border-radius: 3px;
	box-shadow: 0 5px 5px rgba(0, 0, 0, .16);
	transition: all .3s;
}
#home #heroarea a.button:hover {
	text-decoration: none;
	color: #000;
	background: #FFF;
}
/* movie */
#home #heroarea .movie {
	margin: 0 auto;
	width: calc(650 / 1200 * 100%);
}
#home #heroarea .movie video {
	max-width: 100%;
}
/* Contents:common
-----------------------------------------------------------*/
#home .contents.reverse {
	background-image: repeating-linear-gradient(
    -45deg,
    #f1f1f1 0, #f1f1f1 5px,
    #f6f6f6 5px, #f6f6f6 10px);
}
#home .contents .inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
#home .contents.reverse .inner {
	flex-direction: row-reverse;
}
#home .contents .inner h2 {
	margin-bottom: .4em;
	font-weight: 900;
	font-size: 5.4rem;
	line-height: 1em;
	color: #000;
}
#home .contents.reverse .inner h2 {
	text-align: right;
}
#home .contents .inner h3 {
	margin-bottom: .4em;
	font-weight: 700;
	font-size: 2.8rem;
	color: #616161;
}
#home .contents.reverse .inner h3 {
	text-align: right;
}
#home .contents .inner p {
	font-size: 1.8rem;
	line-height: 1.5em;
}
/* Solution
-----------------------------------------------------------*/
#home #solution {
	overflow: hidden;
	margin-top: -450px;
	position: relative;
	padding: 62px 0 47px;
	width: 100%;
	background: url('../img/home/solution_bg2.jpg') left center no-repeat;
	background-size: cover;
}
#home #solution .text {
	width: calc(601 / 1200 * 100%);
}
#home #solution figure {
	width: calc(461 / 1000 * 100%);
}
#home #solution figure img {
	padding-right: calc(38 / 461 * 100%);
}
#home #solution ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 50px;
	padding: 20px;
	width: 100%;
	text-align: center;
	background-color: #FFF;
	border: 2px solid #616161;
	border-radius: 20px;
}
#home #solution ul li {
	width: 33.333333%;
}
#home #solution ul li p.number {
	font-weight: 900;
	font-size: 7.2rem;
	color: #000;
}
#home #solution ul li p.number span {
	margin-left: .15em;
	font-size: 3.6rem;
}
#home #solution ul li p.title {
	font-size: 2.8rem;
	color: #858585;
}
@media screen and (max-width:1200px) {
	#home #solution ul {
		padding: 10px;
	}
	#home #solution ul li p.number {
		font-size: 6.5vw;
	}
	#home #solution ul li p.number span {
		font-size: 3.0vw;
	}
	#home #solution ul li p.title {
		font-size: 1.8vw;
	}
}
/* International Accounting
-----------------------------------------------------------*/
#home #ia {
	overflow: hidden;
	position: relative;
	padding: 62px 0 47px;
	width: 100%;
}
#home #ia .text {
	width: calc(485 / 1200 * 100%);
}
#home #ia figure {
	width: calc(585 / 1200 * 100%);
}
#home #ia figure img {
	padding-left: calc(80 / 585 * 100%);
}
/* Monitoring
-----------------------------------------------------------*/
#home #monitoring {
	overflow: hidden;
	position: relative;
	padding: 58px 0 60px;
	width: 100%;
}
#home #monitoring .text {
	width: calc(539 / 1200 * 100%);
}
#home #monitoring figure {
	width: calc(520 / 1200 * 100%);
}
#home #monitoring figure img {
	margin-bottom: 36px;
	padding-right: calc(129 / 520 * 100%);
	padding-left: calc(35 / 520 * 100%);
}
#home #monitoring figcaption {
	font-weight: 900;
	font-size: 8.2rem;
	color: #000;
}
#home #monitoring figcaption span {
	font-size: 4.6rem;
}
@media screen and (max-width:1200px) {
	#home #monitoring figcaption {
		font-size: 7.0vw;
	}
	#home #monitoring figcaption span {
		font-size: 4.0vw;
	}
}
/* Business Process Outsourcing
-----------------------------------------------------------*/
#home #bpo {
	overflow: hidden;
	position: relative;
	padding: 62px 0 47px;
	width: 100%;
}
#home #bpo .text {
	width: calc(550 / 1200 * 100%);
}
#home main#jp #bpo .text {
	width: calc(590 / 1200 * 100%);
}
#home #bpo figure {
	width: calc(505 / 1200 * 100%);
}
#home #bpo figure img {
	padding-left: calc(71 / 1000 * 100%);
}

 /*  SP（767px）
=========================================================================
=========================================================================*/
@media screen and (max-width:767px) {
		/* Hero Area
	-----------------------------------------------------------*/
	#home #heroarea {
		padding: 85px 0 20px;
		height: auto;
	}
	#home #heroarea::before {
		width: calc(520 / 640 * 100%);
		height: calc(1110 / 1390 * 100%);
		background: url('../img/home/heroarea_bg@2x.png') right bottom no-repeat;
		background-size: contain;
	}
	/* ----- contents ----- */
	#home #heroarea .cols {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: 400px;
	}
	#home #heroarea .cols .text {
		margin-bottom: 25px;
		width: 100%;
	}
	#home #heroarea .cols figure {
		text-align: right;
		width: 100%;
	}
	#home #heroarea .cols figure img {
		width: calc(440 / 640 * 100%);
	}
	#home #heroarea h1 {
		font-size: 2rem;
	}
	#home main#jp #heroarea h1 {
		font-size: 2rem;
	}
	#home #heroarea h2 {
		font-size: 1.5rem;
	}
	#home #heroarea h3 {
		font-size: 1.7rem;
	}
	/* button */
	#home #heroarea a.button {
		width: 180px;
		height: 40px;
		font-size: 1.6rem;
		line-height: 40px;
		border-radius: 3px;
	}
	/* movie */
	#home #heroarea .movie {
		margin: 0 auto;
		width: 100%;
	}
	/* Contents:common
	-----------------------------------------------------------*/
	#home .contents.reverse {
		background-image: repeating-linear-gradient(
			-45deg,
			#f1f1f1 0, #f1f1f1 3px,
			#f6f6f6 3px, #f6f6f6 6px);
	}
	#home .contents .inner .text {
		margin-bottom: 30px;
	}
	#home .contents .inner h2 {
		margin-bottom: .75em;
		font-size: 2.7rem;
		line-height: 1em;
	}
	#home .contents .inner h3 {
		margin-bottom: .75em;
		font-size: 1.6rem;
	}
	#home .contents .inner p {
		font-size: 1.3rem;
		line-height: 1.5em;
	}
	/* Solution
	-----------------------------------------------------------*/
	#home #solution {
		padding: 40px 0;
		width: 100%;
		background: url('../img/home/solution_bg@2x.png') left center no-repeat;
		background-size: auto 100%;
	}
	#home #solution .text {
		width: 100%;
	}
	#home #solution figure {
		width: 100%;
		text-align: center;
	}
	#home #solution figure img {
		padding-right: 0;
		width: calc(339 / 600 * 100%);
	}
	#home #solution ul {
		margin-top: 25px;
		padding: 10px 5px;
	}
	#home #solution ul li p.title {
		font-size: 1.0rem;
	}
	/* International Accounting
	-----------------------------------------------------------*/
	#home #ia {
		padding: 40px 0;
	}
	#home #ia .text {
		width: 100%;
	}
	#home #ia figure {
		width: 100%;
		text-align: center;
	}
	#home #ia figure img {
		padding-left: 0;
		width: calc(506 / 600 * 100%);
	}
	/* Monitoring
	-----------------------------------------------------------*/
	#home #monitoring {
		padding: 40px 0 10.0vw;
	}
	#home #monitoring .text {
		width: 100%;
	}
	#home #monitoring figure {
		width: 100%;
		text-align: center;
	}
	#home #monitoring figure img {
		margin-bottom: 15px;
		padding-right: 0;
		padding-left: 0;
		width: calc(350 / 600 * 100%);
	}
	#home #monitoring figcaption {
		font-size: 14.0vw;
	}
	#home #monitoring figcaption span {
		font-size: 7.0vw;
	}
	/* Business Process Outsourcing
	-----------------------------------------------------------*/
	#home #bpo {
		padding: 40px 0;
	}
	#home #bpo .text {
		width: 100%;
	}
	#home main#jp #bpo .text {
		width: 100%;
	}
	#home #bpo figure {
		width: 100%;
		text-align: center;
	}
	#home #bpo figure img {
		padding-left: 0;
		width: calc(434 / 600 * 100%);
	}
}
