@charset "utf-8";


/*---------------------------------------------------------------------------------------
	header
----------------------------------------------------------------------------------------*/

header{
	color: #fff;
	width: 100%;
	height: 100px;
	margin: 0 auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	background: #000;
}
/*header#top-header,header#top-header #headerwrap{ background: none;}*/
header a{ color: #fff;}
header #headerwrap{
	max-width: 1510px;
	padding: 0 3%;
	margin: 0 auto;
	height: 100px;
	background: #000;
}
header #headerwrap #site-logo{
	float: left;
	padding: 35px 0;
}
header #headerwrap #site-logo img{
	width: 302px;
}
header #headerwrap #site-logo span{
	line-height: 1;
	display: inline-block;
	vertical-align: bottom;
	margin-bottom: 4px;
}
header #headerwrap .spmenu{
	display: none;
}
/* nav */
header nav{
	font-size: 1.4rem;
	float: right;
}
header nav div{
	display: flex;
	justify-content: space-between;
}
header nav ul{
	font-size: 1.8rem;
	display: flex;
	justify-content: space-between;
}
header nav ul > li{
	padding: 4px 15px 0;
	height: 100px;
}
header nav ul > li:nth-child(6){
	padding-right: 30px;
}
header nav ul > li > a,header nav ul > li > a,
header nav ul > li > a,header nav ul > li > p{
	padding-top: 32px;
	display: block;
}
header nav ul > li > p{ position: relative;}
header nav ul > li > p:after{
	position: absolute;
	right: 0;
	bottom: -10px;
	left: 0;
	margin: 0 auto;
	width: 6px;
	height: 6px;
	background: #f00;
	border-radius: 50%;
}
header nav ul > li.active > p:after{
	content: "";
}
header nav ul > li > a{
	-webkit-transition: all 0s;
	transition: all 0s;
}
header nav ul > li.mega > ul{
	font-size: 1.6rem;
	overflow: hidden;
	position: absolute;
	top: 100px;
	right: 0;
	margin: 0 auto;
	width: 100%;
	background: #534741;
	background:rgba(0,0,0,0.7);
	height: 0;
	color: #fff;
	left: 0;
	display: flex;
	justify-content: center;
	transition: all .5s;
	opacity: 0;
}
header nav ul > li.mega.gnav-privacy > ul,
header nav ul > li.mega:hover > ul{
	height: 70px;
	padding: 0 3%;
	border-top: 4px solid #f00;
	opacity: 1;
}
header nav ul > li.mega > ul a{ color: #fff;}
header nav ul > li.mega > ul a:hover{ opacity: 1;}
header nav ul > li.mega > ul p{
	font-size: 3.6rem;
	margin-bottom: 30px;
}
header nav ul > li.mega a{display: block;}
header nav ul > li.mega > ul li{
	padding: 0;
	height: inherit;
}
header nav ul > li.mega > ul li a{
	padding: 20px 0;
	margin: 0 24px;
	position: relative;
	overflow: hidden;
}
header nav ul > li.mega > ul li a:hover:after{
	content: "";
	position: absolute;
	right: 0;
	bottom: 20px;
	left: 0;
	margin: 0 auto;
	width: 100%;
	height: 1px;
	display: block;
	background: #f00;
	animation: Mega .4s;
}
@keyframes Mega {
  0% { transform: translateX(-100%);}
  100% { transform: translateY(0);}
}
header nav ul > li.mega > ul li.active{ background: #f00;}
header nav dl{
	position: relative;
	padding-top: 37px;
}
header nav dl dt{
	border: 1px solid #fff;
	padding: 2px 10px;
}
header nav dl dd{
	height: 0;
	overflow: hidden;
	position: absolute;
	width: 100%;
	top: 65px;
	left: 0;
	display: flex;
	transition: all .5s;
}
header nav dl:hover dd{
	height: 27px;
}
header nav dl dd p{
	width: 33.33%;
	width: calc(100% / 3);
}
header nav dl dd p a{
	color: #fff;
	font-weight: 500;
	padding: 2px 10px;
	display: block;
	background: #323232;
	border-top: none;
}
header nav dl dd p.active a{
	color: #000;
	background: #fff;
}
header nav dl dd p a:hover,header nav dl dd p.active a:hover{
	opacity: 1;
	color: #fff;
	background: #808080;
}

@media screen and (max-width: 1240px) {
	header{
		width: 100%;
		height: 60px;
	}
	/* headerwrap */
	header #headerwrap{
		width: 100%;
		height: 60px;
		z-index: 999;
		padding: 0;
	}
	header #headerwrap #site-logo{
		text-align: left;
		padding: 18px 0 0 3%;
		width: 240px;
		position: relative;
		z-index: 999;
		float: left;
	}
	header #headerwrap #site-logo.f-none{
		width: 100%;
		text-align: center;
	}
	header #headerwrap #site-logo img{
		width: 230px;
		height: auto;
	}
	header #headerwrap .spmenu{
		color: #fff;
		font-size: 1.6rem;
		display: block;
		float: right;
		width: 60px;
		height: 60px;
		cursor: pointer;
		z-index: 101;
		position: relative;
	}
	header #headerwrap .spmenu span,
	header #headerwrap .spmenu span:before,
	header #headerwrap .spmenu span:after{
		position: absolute;
		display: block;
		background: #fff;
		width: 40px;
		height: 4px;
		transition: all .5s;
	}
	header #headerwrap .spmenu span{
		top: 18px;
		left: 10px;
	}
	header #headerwrap .spmenu span:before,header #headerwrap .spmenu span:after{
		content: "";
		left: 0;
	}
	header #headerwrap .spmenu span:before{
		top: 10px;
	}
	header #headerwrap .spmenu span:after{
		top: 20px;
	}
	header.open #headerwrap .spmenu span{
		top: 5px;
		-webkit-transform: translateY(20px) rotate(-45deg);
		transform: translateY(20px) rotate(-45deg);
	}
	header.open #headerwrap .spmenu span:before{
		opacity: 0;
	}
	header.open #headerwrap .spmenu span:after{
		-webkit-transform: translateY(-20px) rotate(90deg);
		transform: translateY(-20px) rotate(90deg);
		top: 20px;
	}
	/* nav */
	header #headerwrap nav{
		font-size: 1.8rem;
		position: relative;
		z-index: 1;
		top: 0;
		right: 0;
		width: 100%;
		background: #000;
		display: block;
		text-align: left;
		float: none;
	}
	header nav ul > li > a:hover,header nav ul > li.active > a,header nav ul > li > a:hover,header nav ul > li:hover  > a{ border-bottom: none;}
	header #headerwrap nav div{
		overflow: auto;
		display: block;
		position: absolute;
		z-index: 1;
		top: 60px;
		width: 100%;
		left: 0;
		-webkit-transform: scale(1, 0);
		transform: scale(1, 0);
		-webkit-transform-origin: center top;
		transform-origin: center top;
		opacity: 0;
		transition-property: opacity, transform, -webkit-transform;
		transition-duration: .5s, 0s, 0s;
		transition-delay: 0s, .5s, .5s;
		box-shadow: 0 0 0 100vh #000;
		background: #000;
		height: calc(100vh - 80px);
	}
	header.open #headerwrap nav div{
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1;
		transition-delay: 0s, 0s, 0s;
	}
	header #headerwrap nav ul{
		display: block;
		margin-bottom: 10px;
	}
	header nav ul > li.mega:hover > ul,header nav ul > li.gnav-privacy.mega:hover > ul{ border-top: none;}
	header #headerwrap nav ul > li{
		float: none;
		height: auto;
		margin-left: 0;
		padding: 0;
	}
	header nav ul > li:nth-child(4){ display: block;}
	header #headerwrap nav ul > li a{
		color: #fff;
		display: block;
		padding: 12px;
		margin: 0;
		border-top: 1px dashed #808080;
		position: relative;
		min-height: inherit;
	}
	header nav ul > li.mega > ul li a:hover:after{ content: none;}
	header #headerwrap nav ul > li p{
		color: #fff;
		min-height: inherit;
		padding-top: 0;
		position: relative;
	}
	header nav ul > li > p span{
		position: absolute;
		z-index: 99;
		top: 0;
		right: 10px;
		width: 46px;
		height: 46px;
		display: block;
		transition-duration: .2s, 0s, 0s;
		transition-delay: 0s, .2s, .2s;
		background: url("../images/ac.png") center / 20px auto no-repeat;
	}
	header nav ul > li.mega > p span.open{
		-webkit-transform: translateY(0) rotate(180deg);
		transform: translateY(0) rotate(180deg);
	}
	header #headerwrap nav ul > li:last-child a{
		border-bottom: 1px dashed #808080;
	}
	header #headerwrap nav ul > li.mega ul{
		display: none;
	}
	header nav ul > li.mega > ul li{
		max-width: inherit;
		margin: 0;
	}
	header nav ul > li.mega > p{
		position: relative;
	}
	header nav ul > li.mega:hover > p{
		display: block;
	}
	header nav ul > li.active > p:after{ content: none;}
	header nav ul > li > p span{
		position: absolute;
		z-index: 99;
		top: 0;
		right: 10px;
		left: inherit;
		width: 46px;
		height: 46px;
		display: block;
		transition-duration: .2s, 0s, 0s;
		transition-delay: 0s, .2s, .2s;
		background: url("../images/ac.png") center / 20px auto no-repeat;
	}
	header nav ul > li.mega > p span.open,
	header nav ul > li.ac > p span.open{
		-webkit-transform: translateY(0) rotate(180deg);
		transform: translateY(0) rotate(180deg);
	}
	header nav ul > li.mega > ul{
		font-size: 1.4rem;
		position: static;
		height: auto;
		background: none;
		display: none;
		opacity: 1;
		transition: none;
	}
	header nav ul > li.mega:hover > ul,header nav ul > li.gnav-privacy.mega:hover > ul{
		height: auto;
		border-top: none;
		padding: 0;
	}
	header nav ul > li.mega.gnav-privacy > ul{
		border-top: none;
		padding: 0;
		height: auto;
	}
	header #headerwrap nav ul > li.gnav-privacy.mega ul{ display: block;}
	header nav ul > li.mega:hover > div{
		padding: 0;
	}
	header nav ul > li.mega:hover > p:after{ content: none;}
	header nav ul > li > a:hover, header nav ul > li.active > p, header nav ul > li > p:hover, header nav ul > li:hover p{ border: none;}
	header #headerwrap nav dl{ padding: 0 3% 50px;}
	header #headerwrap nav dl dt{ margin-bottom: 10px;}
	header #headerwrap nav dl dd{
		position: static;
		text-align: center;
		height: auto;
	}
	header #headerwrap nav dl dd p a{ padding: 5px;}
}



/*---------------------------------------------------------------------------------------
	footer
----------------------------------------------------------------------------------------*/

#pagetop,#windowclose{
	text-align: center;
	position: fixed;
	z-index: 999;
	right: 10px;
	bottom: 10px;
	line-height: 1;
}
#pagetop{ display: none;}
#pagetop a,#windowclose a{
	display: block;
	width: 40px;
}
footer{ text-align: left;}
footer #footer-contact a{
	color: #fff;
	font-size: 3rem;
	line-height: 1.2;
	font-weight: 400;
	-moz-text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
	-webkit-text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
	-ms-text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
	text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
	text-align: left;
	background: url("../images/footer-contact.jpg") center / cover no-repeat;
	padding: 75px 0;
	display: block;
}
footer .wrap{ max-width: 1420px;}
footer #footer-contact p strong{
	font-size: 4.8rem;
	line-height: 1.4;
	font-weight: 700;
}
footer #copy{
	color: #fff;
	text-align: center;
	background: #f00;
	padding: 20px 3%;
}
footer #copy span{ vertical-align: middle;}
footer #footer-nav{
	color: #fff;
	background: #323232;
}
footer #footer-nav a{ color: #fff;}
footer #footer-nav .wrap{
	display: flex;
	justify-content: space-between;
}
footer #footer-nav .wrap dl{
	width: 20.75%;
	border-left: 1px solid #fff;
	padding: 25px 18px 100px;
}
footer #footer-nav .wrap dl:last-child{ width: 17%;}
footer #footer-nav .wrap dl dt a{
	padding: 10px 0;
	display: block;
}
footer #footer-nav .wrap dl dd a:before{ content: "・";}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 768px) {
	#pagetop a{
		width: 25px;
	}
	footer #footer-contact a{
		font-size: 2.4rem;
		padding: 35px 0;
	}
	footer #footer-contact p strong{ font-size: 3.6rem;}
	footer #footer-nav .wrap{ display: block;}
	footer #footer-nav .wrap dl{
		width: 100%;
		border-bottom: 1px solid #fff;
		border-left: none;
		padding: 15px 0;
	}
	footer #footer-nav .wrap dl:last-child{
		width: 100%;
		border-bottom: none;
	}
	footer #footer-nav .wrap dl dd a{
		padding: 5px 0;
		display: block;
	}
}


#top-main{
	width: 100%;
	height: 100vh;
/*	background: url("../images/load.gif") center / 32px auto no-repeat;*/
	position: relative;
	padding-top: 20vh;
}
#top-main #video-area{
	position: fixed;
	z-index: -1;/*最背面に設定*/
	top: 99px;
	right:0;
	left:0;
	bottom:0;
	overflow: hidden;
	/*
	background: url("../images/load.gif") center / 32px auto no-repeat;
	*/
}
#top-main #video-area video{
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/*縦横幅指定*/
	width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
	height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
	min-height: 100%;
	min-width: 100%;
}
#main-visual{
	padding-top: 30vh;
	height: 70vh;
}
@media screen and (max-width: 768px) {
	#main-visual.map-title{
		padding-top: 15vh;
		height: 40vh;
	}
}
#main-visual h2{
	display: inline-block;
}
#main-visual.company-title{ background: url("../images/company-title.jpg") center / cover no-repeat;}
#main-visual.sustainability-title{ background: url("../images/sustainability-title.jpg") center / cover no-repeat;}
#main-visual.work-title{ background: url("../images/work-title.jpg") center / cover no-repeat;}
#main-visual.product-title{ background: url("../images/product-title.jpg") center / cover no-repeat;}
#main-visual.contact-title{ background: url("../images/contact-title.jpg") center / cover no-repeat;}
#main-visual.recruit-title{ background: url("../images/recruit-title.jpg") center / cover no-repeat;}
#main-visual.privacy-title{ background: url("../images/privacy-title.jpg") center / cover no-repeat;}



/* top */
#top-main #top-main-read{
	color: #fff;
	font-size: 3rem;
}
#top-main #top-main-read strong{
	font-size: 6rem;
}
#top-main #top-news{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 104px;
	border-top: 4px solid #f00;
	background: #e5e5e5;
}
#top-main #top-news .wrap{
	display: flex;
	align-items: center;
}
#top-main #top-news #top-news-title{
	background: #f00;
	height: 100px;
	display: flex;
	align-items: center;
	padding: 0 40px;
}
#top-main #top-news dl{
	display: flex;
	justify-content: flex-start;
	padding-left: 60px;
}
#top-main #top-news dl dt{ margin-right: 35px;}

#top-business{
	color: #fff;
	padding: 60px 3%;
	background: url("../images/top-business-bg.jpg") center / cover no-repeat;
	margin-bottom: 100px;
}
#top-business ul{
	font-size: 2.4rem;
	line-height: 1.4;
	display: flex;
	justify-content: center;
	max-width: 1600px;
	margin: 0 auto;
}
#top-business ul li{
	width: 16.66%;
	width: calc(100% / 6);
	padding: 0 20px 20px;
}
#top-business ul li img{
	margin-bottom: 15px;
}

#top-link{
	color: #fff;
	text-align: left;
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 85px;
}
#top-link article{
	width: 50%;
	position: relative;
	z-index: 1;
	padding: 40px 50px;
	background: #323232;
	margin-bottom: 100px;
}
#top-link article:after{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
}
#top-link article:nth-child(2n+1):after{
	right: 0;
	border-color: transparent #fff transparent transparent;
	border-width: 26px 15px 26px 0;
}
#top-link article:nth-child(2n):after{
	left: 0;
	border-color: transparent transparent transparent #fff;
	border-width: 26px 0 26px 15px;
}
#top-link article:nth-child(4n+2),#top-link article:nth-child(4n+3){ background: #f00;}
#top-link article div .subtitle1{
	margin-bottom: 30px;
}
#top-link article div ul{
	margin-left: 20px;
	width: 42%;
}
#top-link article div ul li a{
	color: #fff;
	display: block;
	padding: 10px 0;
	border-bottom: 1px dotted #fff;
}
#top-link article figure{
	width: 40.8%;
	max-width: 300px;
	position: absolute;
	z-index: 99;
	right: 48px;
	bottom: -50px;
}
#top-link article figure a:hover{ opacity: 1;}
#top-link article.img100w{
	justify-content: center;
	padding-bottom: 20%;
}
#top-link article.img100w figure{
	width: calc(100% - 100px);
	max-width: inherit;
}
@media screen and (max-width: 1200px) {
	#top-business ul{
		flex-wrap: wrap;
	}
	#top-business ul li{
		width: 25%;
	}
	#top-main #video-area{
		top: 59px;
	}
}
@media screen and (max-width: 768px) {
	#top-main{
		height: inherit;
		padding-top: 59px;
	}
	#top-main .main-movie{
		height: auto;
	}
	#top-main #video-area{
		position: static;
	}
	#top-main #video-area video{
		top: 32%;
		left: 50%;
		/*縦横幅指定*/
		width: 46vh;
		height: 56.25vw;
		display: none;
	}
	#top-main #top-main-read{
		font-size: 2rem;
		line-height: 1.4;
	}
	#top-main #top-main-read strong{
		font-size: 4rem;
		line-height: 1.4;
	}
	#top-main #top-news{
		height: auto;
		position: static;
		border-top: 2px solid #f00;
	}
	#top-main #top-news .wrap{
		padding: 0;
		align-items:stretch;
	}
	#top-main #top-news #top-news-title{
		padding: 10px;
		height: inherit;
	}
	#top-main #top-news dl{
		text-align: left;
		align-items: center;
		padding: 15px;
	}
	#top-main #top-news dl dt{ margin-right: 15px;}

	#top-business{
		padding: 30px 3%;
		margin-bottom: 50px;
	}
	#top-business ul{ font-size: 2rem;}
	#top-business ul li{ width: 50%;}
	#top-business ul li img{margin-bottom: 10px;}

	#top-link{
		padding-bottom: 35px;
	}
	#top-link article{
		width: 100%;
		display: block;
		padding: 20px 3%;
		margin-bottom: 0;
	}
	#top-link article:after{
		right: 0;
		left: 0;
		margin: 0 auto;
	}
	#top-link article:nth-child(2n+1):after{
		top: inherit;
		bottom: 0;
		border-width: 0 18px 10px 18px;
		border-color: transparent transparent #ffffff transparent;
	}
	#top-link article:nth-child(2n):after{
		top: 0;
		border-width: 10px 18px 0 18px;
		border-color: #ffffff transparent transparent transparent;
	}
	#top-link article:nth-child(4n+2),#top-link article:nth-child(4n+3){ background: #323232;}
	#top-link article:nth-child(2n){ background: #f00;}
	#top-link article div{ width: 52%;}
	#top-link article div .subtitle1{ margin-bottom: 10px;}
	#top-link article div ul{
		width: 100%;
		margin-left: 0;
	}
	#top-link article figure{
		max-width: 128px;
		right: 3%;
		bottom: 15px;
	}
	#top-link article.img100w{ padding-bottom: 52%;}
	#top-link article.img100w figure{
		width: 94%;
		max-width: inherit;
	}
}



/* lower-list */
#lower-list{ margin-top: -100px;}
#lower-list ul{
	text-align: left;
	display: flex;
	flex-wrap: wrap;
}
#lower-list ul li{
	width: 48.33%;
	margin: 0 3.34% 80px 0;
	background: #fff;
}
#lower-list ul li:nth-child(2n){ margin-right: 0;}
@media screen and (max-width: 768px) {
	#lower-list{ margin-top: -50px;}
	#lower-list ul{ display: block;}
	#lower-list ul li{
		width: 100%;
		margin: 0 0 40px;
	}
}



/* company-message */
#company-message{
	text-align: left;
	margin-top: -100px;
}
#company-message p{ margin-bottom: 1em}
@media screen and (max-width: 768px) {
	#company-message{ margin-top: -50px;}
}



/* company-philosophy */
#company-philosophy .bd-top{
	text-align: left;
	border-top: 1px solid #333;
	padding: 50px 0;
	display: flex;
	justify-content: space-between;
}
#company-philosophy .bd-top h4{ width: 29%;}
#company-philosophy .bd-top div{ width: 71%;}
#company-philosophy .bd-top div p{ margin-bottom: 40px;}
#company-philosophy .bd-top div h5{ margin-bottom: 5px;}
#company-philosophy .bd-top div h6{
	padding-left: 2em;
	text-indent: -2em;
	margin-bottom: 10px;
}
#company-philosophy .bd-top div > ol > li{ margin-bottom: 40px;}
#company-philosophy .bd-top div ol li ol li{
	padding-left: 2.5em;
	text-indent: -2.5em;
}
@media screen and (max-width: 768px) {
	#company-philosophy .bd-top{
		padding: 30px 0;
		display: block;
	}
	#company-philosophy .bd-top h4{
		width: 100%;
		margin-bottom: 30px;
	}
	#company-philosophy .bd-top div{ width: 100%;}
	#company-philosophy .bd-top div p{ margin-bottom: 20px;}
	#company-philosophy .bd-top div > ol > li{ margin-bottom: 20px;}
}



/* company-place */
#company-place{
	margin-top: -100px;
}
#company-place .place-wrap{
	position: relative;
}
#company-place .place-wrap a{
	position: absolute;
	background: url("../images/pin.png") center / 100% auto no-repeat;
	width: 4.357%;
	height: 6.357%;
	display: block;
	z-index: 10;
}
#company-place .place-wrap a:hover{
	opacity: 1;
	background: url("../images/pin-on.png") center / 100% auto no-repeat;
}
#company-place .place-wrap a#pin1{
	top: 64.14%;
	left: 48.28%;
}
#company-place .place-wrap a#pin2{
	top: 61.14%;
	left: 76.43%;
}
#company-place .place-wrap a#pin3{
	top: 24.28%;
	left: 85%;
}
#company-place .place-wrap a#pin4{
	top: 12.28%;
	left: 31.86%;
}
#company-place .place-wrap a#pin5{
	top: 41%;
	left: 47.43%;
}
#company-place .place-wrap a#pin6{
	top: 28.7%;
	left: 40.14%;
}
#company-place .place-wrap a#pin6-2{
	top: 19.7%;
	left: 68.18%;
}
#company-place .place-wrap a#pin7{
	top: 32.57%;
	left: 14%;
}
#company-place .place-wrap a#pin8{
	top: 55.57%;
	left: 8.6%;
}
#company-place .place-wrap span{
	position: absolute;
	display: inline-block;
	z-index: 2;
}
#company-place .place-wrap span.move1{
	width: 11.66%;
	left: 44%;
	top: 17%;
}
#company-place .place-wrap span.move2{
	width: 12.16%;
	left: 11.5%;
	top: 39%;
}
#company-place .place-wrap span.move3{
	width: 20.83%;
	left: 38.5%;
	top: 42%;
}
#company-place .place-wrap span.move4{
	width: 4.16%;
	left: 75.5%;
	top: 52%;
}
#company-place .place-wrap span.move5{
	width: 6%;
	left: 67.7%;
	top: 60%;
}
#company-place .place-wrap span.move6{
	width: 11.3%;
	left: 80%;
	top: 55%;
}
#company-place .place-wrap span.move7{
	width: 13%;
	left: 4%;
	top: 60%;
}
#company-place .place-wrap span.move8{
	width: 8.83%;
	left: 47.2%;
	top: 69%;
}
#company-place .place-wrap span.move9{
	width: 7.3%;
	left: 72.8%;
	top: 69.2%;
}

a.inline{
	animation-name:movebtn;
	animation-duration:2s;
	animation-iteration-count:infinite;
	animation-timing-function:ease;
}
@-webkit-keyframes movebtn{ 0% { margin-top: 0;} 50% { margin-top: 10px;} 100% { margin-top: 0;}}
@-moz-keyframes movebtn{ 0% { margin-top: 0;} 50% { margin-top: 10px;} 100% { margin-top: 0;}}
@keyframes movebtn{ 0% { margin-top: 0;} 50% { margin-top: 10px;} 100% { margin-top: 0;}}
.inline-cont{
	text-align: left;
	padding: 50px;
}
.inline-cont .subtitle2{
	font-weight: 700;
	text-align: left;
	padding-bottom: 10px;
}
.inline-cont .subtitle2:after{ bottom: 20px;}
.inline-cont figure{
	display: flex;
	justify-content: space-between;
}
.inline-cont figure img{ width: 48.18%;}
@media screen and (max-width: 768px) {
	#company-place{ margin-top: -50px;}
	.inline-cont{ padding: 20px;}
	.inline-cont .subtitle2{ font-size: 3rem;}
	.inline-cont figure{display: block;}
	.inline-cont figure img{
		width: 100%;
		margin-bottom: 10px;
	}
	.inline-cont figure img:last-child{ margin-bottom: 0;}
}



/* sdgs */
#sdgs p,#sdgs h4{ text-align: left;}
#sdgs p.t-center{ text-align: center;}
#sdgs ul.sdgs-icon1{
	display: flex;
	flex-wrap: wrap;
}
#sdgs ul.sdgs-icon1 li{
	width: 15.25%;
	margin: 0 1.7% 15px 0;
}
#sdgs ul.sdgs-icon1 li:nth-child(6n){ margin-right: 0;}
#sdgs ul.sdgs-list{
	text-align: left;
	display: flex;
	flex-wrap: wrap;
}
#sdgs ul.sdgs-list > li{
	width: 46.66%;
	margin: 0 6.67% 100px 0;
}
#sdgs ul.sdgs-list > li:nth-child(2n){ margin-right: 0;}
#sdgs ul.sdgs-list > li figure{ margin-bottom: 20px;}
#sdgs ul.sdgs-list > li h4{ margin-bottom: 15px;}
#sdgs ul.sdgs-list > li ul.sdgs-icon2{
	display: flex;
	flex-wrap: wrap;
}
#sdgs ul.sdgs-list > li ul.sdgs-icon2 li{
	width: 90px;
	margin: 0 10px 10px 0;
}
@media screen and (max-width: 768px) {
	#sdgs ul.sdgs-icon1 li{
		width: 31%;
		margin: 0 3.5% 10px 0;
	}
	#sdgs ul.sdgs-icon1 li:nth-child(3n){ margin-right: 0;}
	#sdgs ul.sdgs-list{ display: block;}
	#sdgs ul.sdgs-list > li{
		width: 100%;
		margin: 0 0% 50px;
	}
	#sdgs ul.sdgs-list > li figure{ margin-bottom: 15px;}
	#sdgs ul.sdgs-list > li h4{ margin-bottom: 10px;}
	#sdgs ul.sdgs-list > li ul.sdgs-icon2 li{
		width: 31%;
		margin: 0 3.5% 10px 0;
	}
	#sdgs ul.sdgs-list > li ul.sdgs-icon2 li:nth-child(3n){ margin-right: 0;}
}


/* csr */
#csr{ margin-bottom: 150px;}
#csr p{ text-align: left;}
#csr .imgleft{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	margin-bottom: 160px;
}
#csr .imgleft p{ width: 62.5%;}
#csr .imgleft figure{ width: 32.5%;}
@media screen and (max-width: 768px) {
	#csr{ margin-bottom: 75px;}
	#csr .imgleft{
		display: block;
		margin-bottom: 80px;
	}
	#csr .imgleft p{
		width: 100%;
		margin-bottom: 20px;
	}
	#csr .imgleft figure{
		width: 60%;
		margin: 0 auto;
	}
}



/* environment-cont */
#environment-cont{
	text-align: left;
	margin-bottom: 170px;
}
#environment-cont .imgright1{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#environment-cont .imgright1 p{ margin-right: 20px; flex: 1;}
#environment-cont .imgright2{
	display: flex;
	justify-content: space-between;
}
#environment-cont .imgright2 div{ width: 64%;}
#environment-cont .imgright2 div p,#environment-cont .imgright2 div ol{ margin-bottom: 1.5em;}
#environment-cont .imgright2 figure{ width: 32.5%;}
#environment-cont .imgright2 figure img{ margin-bottom: 10px;}
#environment-cont .imgright2 figure figcaption{ text-align: right;}
@media screen and (max-width: 768px) {
	#environment-cont{ margin-bottom: 85px;}
	#environment-cont .imgright2{ display: block;}
	#environment-cont .imgright2 div{ width: 100%;}
	#environment-cont .imgright2 figure{ width: 100%;}
}



/* female */
#female{
	text-align: left;
	overflow: hidden;
}
#female ol.female-list > li{
	padding: 15px;
	background: #fbf5e9;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}
#female ol.female-list > li:nth-child(2n){ flex-direction: row-reverse;}
#female ol.female-list > li div{
	background: #fff;
	border-radius: 5px;
	width: 58.33%;
	padding: 50px;
}
#female ol.female-list > li div h4{
	color: #f00;
	font-size: 2.4rem;
	display: flex;
	align-items: center;
}
#female ol.female-list > li div h4 em{
	font-weight: bold;
	width: 85px;
	line-height: 85px;
	text-align: center;
	border: 3px solid #f00;
	display: block;
	border-radius: 10px;
	margin-right: 25px;
}
#female ol.female-list > li figure{
	text-align: center;
	width: 40.5%;
	margin: auto 0;
}
#female ol.female-list > li:first-child figure{
	position: relative;
	left: -5.5%;
}
#female .kurumin{
	display: flex;
	justify-content: space-between;
}
#female .kurumin div{
	flex: 1;
	margin: 0 30px 30px 0;
}
#female .kurumin div .bd-box{
	font-size: 1.4rem;
	border: 1px solid #000;
	padding: 20px 25px;
}
#female .kurumin div .bd-box dt{ margin-bottom: 5px;}
#female .kurumin figure{ width: 25%;}
@media screen and (max-width: 768px) {
	#female ol.female-list > li{
		padding: 10px;
		display: block;
		margin-bottom: 20px;
	}
	#female ol.female-list > li div{
		width: 100%;
		padding: 25px;
		margin-bottom: 20px;
	}
	#female ol.female-list > li div h4{ align-items: flex-start;}
	#female ol.female-list > li div h4 em{
		width: 70px;
		line-height: 70px;
		margin-right: 15px;
	}
	#female ol.female-list > li div h4 span{ width: calc(100% - 85px);}
	#female ol.female-list > li figure{
		width: 60%;
		margin: 0 auto;
	}
	#female ol.female-list > li:first-child figure{ left: 0%;}
	#female .kurumin{ display: block; margin-bottom: 30px;}
	#female .kurumin div{ margin: 0 0 10px;}
	#female .kurumin div .bd-box{ padding: 15px 20px;}
	#female .kurumin figure{ width: 70%; max-width: 250px; margin: 0 auto;}
}



/* supply-chain */
#supply-chain ol li dl dd{ margin-left: 3.65em;}



/* numeral */
#numeral ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#numeral ul.bd-top{ border-top: 1px solid #333;}
#numeral ul li{
	width: 600px;
	padding: 90px 50px 100px;
	margin-right: auto;
	margin-left: auto;
	border-bottom: 1px solid #333;
}
#numeral ul li h3{
	text-align: center;
	margin-bottom: 30px;
}
#numeral ul li p{ font-size: 3.6rem; font-weight: bold;}
#numeral ul li p em,#numeral ul li p strong{ font-family: 'Open Sans', sans-serif;}
#numeral ul li p em{ font-weight: bold;}
#numeral ul li.numeral-1 figure{
	position: relative;
}
#numeral ul li.numeral-1 figure figcaption{
	position: absolute;
	top: 31%;
	right: 0;
	left: 0;
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
#numeral ul li.numeral-1 figure figcaption p{
	padding: 0 5%;
}
#numeral ul li.numeral-1 figure figcaption p:last-child{ color: #fff;}
#numeral ul li.numeral-2{
	background: url("../images/numeral-img2.png") center bottom 100px / 80% auto no-repeat;
}
#numeral ul li.numeral-3 h3.subtitle3{ margin-bottom: 60px;}
#numeral ul li.numeral-3 p{ line-height: 1.1;}
#numeral ul li.numeral-3 p:first-child{
	position: relative;
	margin-bottom: 50px;
}
#numeral ul li.numeral-3 p:first-child:after{
	content: "";
	position: absolute;
	right: 0;
	bottom: -30px;
	left: 0;
	margin: 0 auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 11px 0 11px;
	border-color: #ff0000 transparent transparent transparent;
}
#numeral ul li.numeral-3 p .f60{ line-height: 1.1;}
#numeral ul li.numeral-3 p .f80{ line-height: 1.1;}
#numeral ul li.numeral-3 figure{
	position: relative;
	padding-top: 8%;
}
#numeral ul li.numeral-3 figure figcaption{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	margin: 0 auto;
}
#numeral ul li.numeral-4{
	background: url("../images/numeral-img4.png") center bottom 100px / 80% auto no-repeat;
	padding-bottom: 30%;
}
#numeral ul li.numeral-4 p{
	padding-top: 30%;
}
#numeral ul li.numeral-5{
	width: 100%;
	background: url("../images/numeral-img5.png") right 50px bottom 100px / 37.66% auto no-repeat;
	padding-left: 50px;
}
#numeral ul li.numeral-5 h3.subtitle3{
	max-width: 380px;
}
#numeral ul li.numeral-5 div{
	display: flex;
}
#numeral ul li.numeral-5 div p{
	margin-right: 90px;
}
#numeral ul li.numeral-6{
	background: url("../images/numeral-img6.png") center bottom 100px / 70% auto no-repeat;
	padding-bottom: 32%;
}
#numeral ul li.numeral-6 p{
	padding: 10% 0 0 20%;
}
#numeral ul li.numeral-7 p{
	padding-bottom: 7%;
}
#numeral ul li.numeral-7 p:last-child{
	background: url("../images/numeral-img7.png") center bottom 0 / 90% auto no-repeat;
	padding-bottom: 15%;
}
#numeral ul li.numeral-8{
	width: 70%;
	background: url("../images/numeral-img8.png") right 10% bottom 100px / 39% auto no-repeat;
	padding: 90px 4.17% 100px 3%;
}
#numeral ul li.numeral-8 h3.subtitle3{
	max-width: 430px;
	margin-bottom: 50px;
}
#numeral ul li.numeral-8 p{
	text-align: left;
	margin-bottom: 8%;
}
#numeral ul li.numeral-8 p:last-child{ margin-bottom: 0;}
#numeral ul li.numeral-8 .f36{ line-height: 1.2;}
#numeral ul li.numeral-8 p span{
	display: inline-block;
	text-align: center;
}
#numeral ul li.numeral-9{
	width: 30%;
	background: url("../images/numeral-img9.png") center bottom 100px / 80% auto no-repeat;
	padding: 90px 3% 100px 4.17%;
}
#numeral ul li.numeral-9 h3.subtitle3{
	max-width: 380px;
	margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
	#numeral canvas{ width: 250px;}
	#numeral ul{
		flex-wrap: wrap;
	}
	#numeral ul li,
	#numeral ul li.numeral-5{
		width: 270px;
		padding: 40px 10px 50px;
		margin-right: auto;
		margin-left: auto;
	}
	#numeral ul li h3{
		margin-bottom: 15px;
	}
	#numeral ul li.numeral-1 figcaption .f120{ font-size: 7rem;}
	#numeral ul li.numeral-2{
		background: url("../images/numeral-img2.png") center bottom 50px / 240px auto no-repeat;
		padding-bottom: 200px;
	}
	#numeral ul li.numeral-3 h3.subtitle3{ margin-bottom: 30px;}
	#numeral ul li.numeral-3 figcaption .f60{ font-size: 4rem;}
	#numeral ul li.numeral-3 figcaption .f80{ font-size: 5rem;}
	#numeral ul li.numeral-4{
		background: url("../images/numeral-img4.png") center bottom 50px / 240px auto no-repeat;
		padding-bottom: 50px;
	}
	#numeral ul li.numeral-4 p{
		padding-top: 60px;
	}
	#numeral ul li.numeral-5{
		background: url("../images/numeral-img5.png") center bottom 50px / 240px auto no-repeat;
		padding-left: 3%;
		padding-bottom: 200px;
	}
	#numeral ul li.numeral-5 div{
		display: block;
	}
	#numeral ul li.numeral-5 div p{
		margin: 0 0 20px;
	}
	#numeral ul li.numeral-6{
		background: url("../images/numeral-img6.png") center bottom 30px / 150px auto no-repeat;
		padding-bottom: 200px;
	}
	#numeral ul li.numeral-6 p{
		padding: 0;
	}
	#numeral ul li.numeral-7 p{
		padding-bottom: 10%;
	}
	#numeral ul li.numeral-8{
		width: 270px;
		background: url("../images/numeral-img8.png") center bottom 30px / 150px auto no-repeat;
		padding: 40px 10px 200px;
	}
	#numeral ul li.numeral-8 h3.subtitle3{
		margin-bottom: 30px;
	}
	#numeral ul li.numeral-8 p{
		text-align: center;
	}
	#numeral ul li.numeral-9{
		width: 270px;
		background: url("../images/numeral-img9.png") center bottom 30px / 180px auto no-repeat;
		padding: 40px 10px 200px;
	}
	#numeral ul li.numeral-9 h3.subtitle3{
		margin-bottom: 30px;
	}
}



/* works-lower */
#works-lower{
	text-align: left;
	margin-top: -100px;
}
#works-lower .imgleft{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
#works-lower .imgleft div{
	width: 46%;

}
#works-lower .imgleft figure{
	width: 50%;
}
#works-lower table.tb2 th{ width: 20%;}
#works-lower table.tb2 td{ width: 80%;}
#works-lower ul.department{
	display: flex;
	flex-wrap: wrap;
}
#works-lower ul.department li:before{
	content: "|";
	margin: 0 1em;
}
#works-lower ul.department li:first-child:before{ content: none}
@media screen and (max-width: 768px) {
	#works-lower{ margin-top: -50px;}
	#works-lower .imgleft{
		display: block;
	}
	#works-lower .imgleft div{
		width: 100%;
		margin-bottom: 30px;
	}
	#works-lower .imgleft figure{
		width: 100%;
	}
	#works-lower table.tb2.sp-table th,#works-lower table.tb2.sp-table td{ width: 100%;}
}



/* product */
#product{
	font-size: 1.6rem;
	text-align: left;
	margin-top: -100px;
}
#product ul.product-anclink{
	text-align: center;
	display: flex;
	flex-wrap: wrap;
}
#product ul.product-anclink li{
	width: 15%;
	margin: 0 2% 20px 0;
	background: #fff;
}
#product ul.product-anclink li:nth-child(6n){ margin-right: 0;}
#product ul.product-anclink li figure{ margin-bottom: 10px;}
#product table.tb1 tr:first-child th{ border-top: 1px solid #333;}
#product table.tb1 tr:first-child th:before{
	content: "";
	top: -1px;
}
#product table.tb1 tr:first-child td{ border-top: 1px solid #e5e5e5;}
#product table.tb1 th,#product table.tb1 td{
	text-align: left;
	vertical-align: top;
}
#product table.tb1 th{ width: 40%;}
#product table.tb1 th a{
	display: inline-block;
	margin-left: 1em;
}
#product table.tb1 th a.ml0{ margin-left: 0;}
#product table.tb1 th a:before{
	content: "》";
	color: #f00;
}
#product table.tb1 th a span{ text-decoration: underline;}
#product table.tb1 td{
	padding: 10px 0;
	width: 60%;
}
#product table.tb1 td ul{
	display: flex;
	flex-wrap: wrap;
	max-width: 720px;
}
#product table.tb1 td ul li{
	line-height: 2;
	margin-right: 2em;
}
#product table.tb1 td ul li:before{
	content: "●";
	color: #f00;
	margin-right: .2em;
}
@media screen and (max-width: 768px) {
	#product{ margin-top: -50px;}
	#product ul.product-anclink li{
		width: 32%;
		margin: 0 2% 10px 0;
	}
	#product ul.product-anclink li:nth-child(3n){ margin-right: 0;}
	#product ul.product-anclink li figure{ margin-bottom: 5px;}
	#product table.tb1 th a{
		display: block;
		margin-left: 0;
	}
	#product table.tb1 td ul li{
		line-height: 1.8;
		margin-right: 1em;
	}
}



/* contact */
#contact{ text-align: left;}
#contact .glovalsign{
	display: flex;
	justify-content: space-between;
}
#contact .glovalsign p{ width: 81.66%;}
#contact .glovalsign div{ width: 116px;}
#contact table.tb1 tr:first-child th{ border-top: 1px solid #333;}
#contact table.tb1 tr:first-child th:before{
	content: "";
	top: -1px;
}
#contact table.tb1 tr:first-child td{ border-top: 1px solid #e5e5e5;}
#contact input[type="text"]{
	margin-right: 20px;
	max-width: 500px;
}
#contact input[type="text"].w200{ max-width: 200px;}
#contact input[type="text"].w300{ max-width: 300px;}
#contact input[type="text"].w400{ max-width: 400px;}
@media screen and (max-width: 768px) {
	#contact .glovalsign{
		display: block;
		margin-bottom: 40px;
	}
	#contact .glovalsign p{ width: 100%;}
	#contact .glovalsign div{ text-align: center;}
	#contact table.tb1 tr:first-child th{ border-top: 1px solid #e5e5e5;}
	#contact table.tb1 tr:first-child th:before{ content: none;}
	#contact table.tb1 tr td input:nth-last-of-type(2){ margin-bottom: 10px;}
	#contact input[type="text"].w200{ max-width: 500px;}
	.sp-pt10{
		display: block;
		padding-top: 10px;
	}
}



/* privacy */
#privacy{ text-align: left;}
#privacy .anchor{
	padding-top: 170px;
	margin-top: -170px;
}
#privacy dl{
	display: flex;
	justify-content: space-between;
	padding: 50px 0 100px;
	border-top: 1px solid #333;
}
#privacy dl dt{ width: 30%;}
#privacy dl dd{ width: 70%;}
#privacy dl dd ol li,
#privacy dl dd .bd-btm{ border-bottom: 1px solid #e5e5e5;}
#privacy dl dd ol li{
	padding: 15px 15px 15px 2.5em;
	text-indent: -1.5em;
}
#privacy dl dd .bd-btm{ padding-bottom: 15px;}

@media screen and (max-width: 768px) {
	#privacy .anchor{
		padding-top: 60px;
		margin-top: -60px;
	}
	#privacy dl{
		display: block;
		padding: 25px 0 50px;
	}
	#privacy dl dt{
		width: 100%;
		margin-bottom: 15px;
	}
	#privacy dl dd{ width: 100%;}
	#privacy dl dd ol li{
		padding: 10px 10px 10px 2em;
		text-indent: -1.5em;
	}
	#privacy dl dd .bd-btm{ padding-bottom: 10px;}
}