
/* CSS Document */

/*==================================================

contents
=================================================*/

.comapny-list {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
}
.comapny-list li {
	width: 33.33%;
	padding: 2.5%;
}
.comapny-list li h2 {
	color: #ce1a18;
	text-align: center;
}
.comapny-list li h2 span {
	width: 48px;
	display: block;
	margin: 0 auto 20px;
}
.comapny-list li p {
	margin: 20px 0 0;
}

.comapny-pict {
	background-color: #999;
	padding: 40px;
}
.comapny-pict .contents-inner {
	display: table;
}
.comapny-pict .contents-inner h2 {
	width: 50%;
	font-size: 3rem;
	color: #FFF;
	display: table-cell;
	vertical-align: middle;
}
.comapny-pict .contents-inner .pict {
	width: 50%;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
}
/* img */
.comapny-pict .contents-inner .pict img {
	width: 100%;
	max-width: 565px;
	height: auto;
}

.company-access h2,.company-access p {
	text-align: center;
	margin-top: 2%;
}

.ceo-name {
	width: 40%;
	max-width: 400px;
	position: absolute;
	bottom: 12%;
	right: 0;
	z-index: 2!important;
}

.company-logo {
	width: 100%;
	max-width: 640px;
	margin: 0 auto 5%;
}
/* img */
.company-logo img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.products-map {
	width: 100%;
	position: relative;
	overflow: hidden;
	margin: 70px auto 0;
}

.products-map .item {
	width: 2.6%;
	position: absolute;
	top: 20%;
	left: 39%;
	z-index: 2;
}
.products-map .item2 {
	width: 2.6%;
	position: absolute;
	top: 30%;
	left: 38%;
	z-index: 2;
}
.products-map .item3 {
	width: 2.6%;
	position: absolute;
	top: 40.5%;
	left: 38%;
	z-index: 2;
}
.products-map .item4 {
	width: 2.6%;
	position: absolute;
	top: 53%;
	left: 39%;
	z-index: 2;
}
.products-map .item5 {
	width: 2.6%;
	position: absolute;
	top: 51%;
	left: 35.5%;
	z-index: 2;
}
.products-map .item6 {
	width: 2.6%;
	position: absolute;
	top: 67%;
	left: 46%;
	z-index: 2;
}
.products-map > div {
	background-image: url(../../products/images/point_off.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.products-map > div:hover {
	background-image: url(../../products/images/point_on.png);
}

/* img */
.products-map img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.products-item {
	width: 100%;
	position: relative;
	margin-top: 100px;
}
.products-item dl {
	width: 100%;
	display: table;
	background-color: #333;
}
.products-item dl dt {
	width: 45%;
	position: relative;
	display: table-cell;
	vertical-align: middle;
	background-color: #FFF;
	padding: 0;
}
.products-item dl dt::before {
	content: " ";
	width: 15%;
	height: 100%;
	display: block;
	position: absolute;
	background-image: url(../../images/corner_l.png);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: contain;
	top: 0;
	left: 0;
	z-index: 2;
}

/* img */
.products-item dl dt img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.products-item dl dd {
	width: 55%;
	display: table-cell;
	vertical-align: middle;
	background-image: url(../../images/bg_products.png);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: contain;
	padding: 4%;
}
.products-item dl dd h2 {
	color: #FFF;
	border-bottom: 3px solid #ce1a18;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.products-item dl dd p {
	color: #FFF;
}

.e-movie ul {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.e-movie ul li {
	width: 48%;
	background-color: #FFF;
	margin-bottom: 5%;
}
.e-movie ul li:nth-of-type(n+3) {
	margin-bottom: 0;
}
.e-movie ul li h2 {
	width: 100%;
	color: #FFF;
	text-align: center;
	background-color: #ce1a18;
	padding: 15px 1em;
}
.e-movie ul li .inner {
	background-color: #FFF;
	padding: 5%;
}
.e-movie ul li .inner p {
	margin-top: 5%;
}

.e-movie .inner ul li video {
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
	outline: none;
	margin: 0 auto;
}

.r-message {
	color: #FFF;
	text-align: center;
	background-image: url(../../recruit/images/message_bg.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 100px 0;
}
.r-message h1 {
	font-size: 6rem;
}
.r-message h2 {
	line-height: 200%;
}
.r-message h2 span {
	border-bottom: 3px solid #F00;
}
.r-message p {
	margin: 5% 0;
}

.r-group {
	color: #FFF;
	text-align: center;
	background-color: #000;
	padding: 80px 0;
}
.r-group .inner {
	background-image: url(../../recruit/images/group_bg.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 80px 10%;
}
.r-group .inner p {
	margin: 5% 0;
}

.r-program {
	background-color: #FFF;
	padding: 80px 0;
}
.r-program .step {
	color: #FFF;
}
.r-program .step dl {
	width: 100%;
	display: table;
}
.r-program .step dl:nth-of-type(1) {
	background-color: #ce8718;
}
.r-program .step dl:nth-of-type(2) {
	background-color: #ce6e18;
}
.r-program .step dl:nth-of-type(3) {
	background-color: #ce5418;
}
.r-program .step dl:nth-of-type(4) {
	background-color: #ce3f18;
}
.r-program .step dl:nth-of-type(5) {
	background-color: #ce1a18;
}
.r-program .step dl dt {
	width: 180px;
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	padding: 5% 1.5em;
}
.r-program .step dl dd {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	padding: 5% 1.5em;
}

.r-voice .menu {
	width: 100%;
	
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.r-voice .menu a {
	width: 24%;
	max-width: 270px;
	display: block;
	color: #FFF;
	text-decoration: none;
	margin: 0 .5%;
}
.r-voice .menu a dl {
	background-color: #ce1a18;
}
.r-voice .menu a dl dt img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.r-voice .menu a dl dd {
	padding: 8% 3%;
}
.r-voice .menu a dl dd p {
	text-align: center;
	line-height: 180%;
}
.r-voice .menu a dl dd .name {
	font-size: 1.8rem;
	margin-bottom: 10px;
}

.r-voice.inner-menu {
    width: 100%;
	background-color: #FFF;
	margin: 0 auto;
	padding: 80px 0;
}
.r-voice.inner-menu .menu {
	width: 75%;
	margin: 0 auto;
}
.r-voice.inner-menu .menu a {
	width: 32%;
}

.v-profile {
	width: 100%;
	background-color: #999;
}
/* img */
.v-profile img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.v-profile dl {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.v-profile dl dt {
	width: 62.5%;
}
.v-profile dl dd {
	width: 37.5%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center; 
	
	background-image: url(../../images/bg_products_r.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: auto;
	border-top: 5px solid #ce1a18;
	padding: 5%;
}
.v-profile dl dd h2,.v-profile dl dd h3,.v-profile dl dd p {
	width: 100%;
	color: #FFF;
}
.v-profile dl dd h2 {
	width: 100%;
	font-size: 7rem;
	color: #FFF;
	font-family: 'Roboto', sans-serif;
}
.v-profile dl dd h3 {
	font-size: 2.4rem;
	margin: 8% 0;
}
.v-schedule {
	background-color: #FFF;
	padding: 80px 0;
}
.v-schedule .contents-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.v-schedule .contents-item .title {
	width: 300px;
}
.v-schedule .contents-item .title .icon {
	width: 68px;
	margin: 0 auto;
}
.v-schedule .contents-item .title h2 {
	width: 100%;
	color: #FFF;
	text-align: center;
	background-color: #ce1a18;
	padding: 15px 1em;
}
.v-schedule .contents-item .inner {
	width: 100%;
	max-width: 800px;
	padding-left: 5%;
}
.v-schedule .contents-item .inner ul li:nth-of-type(even) {
	background-color: #EEE;
}
.v-schedule .contents-item .inner ul li dl {
	width: 100%;
	display: table;
}
.v-schedule .contents-item .inner ul li dl dt {
	width: 8em;
	display: table-cell;
	vertical-align: top;
	padding: 1.5em 2em;
}
.v-schedule .contents-item .inner ul li dl dd {
	display: table-cell;
	vertical-align: top;
	padding: 1.5em;
}

.private {
	
}
.private dl {
	width: 100%;
	display: table;
	background-color: #FFF;
}
.private dl dt {
	width: 40%;
	display: table-cell;
	vertical-align: middle;
	padding: 3% 0 3% 3%;
}
.private dl dd {
	display: table-cell;
	vertical-align: middle;
	color: #ce1a18;
	padding: 3%;
}
/* img */
.private dl dt img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.comment {
	background-color: #ce1a18;
	margin-top: 300px;
}
.comment .photo {
	width: 50%;
	max-width: 346px;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translate(-50%, -100%); 
	transform: translate(-50%, -100%);
	z-index: 2!important;
}
.comment .contents-inner {
	padding: 100px 0 100px;
}
.comment .contents-inner h2 {
	color: #FFF;
	text-align: center;
	margin-bottom: 20px;
}
.comment .contents-inner p {
	color: #FFF;
}

.style-banner {
	background-color: #FFF;
	margin-top: 60px;
	padding: 3% 0;
}
.style-banner img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.style-banner .inner {
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
}
.style-banner .inner a {
	width: 100%;
	max-width: 420px;
	display: block;
	font-size: 2.4rem;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	background-color: #0599d9;
	margin: 5% auto 0;
	padding: 20px;
}

@media only screen and (min-width:1px) and (max-width: 900px) {
	
	
	.r-voice .menu {
		margin-bottom: -5%;
	}
	.r-voice .menu a {
		width: 48%;
		max-width: 48%;
		margin: 0 0 5%;
	}
	.r-voice .menu a dl {
		width: 100%;
		display: table;
	}
	.r-voice .menu a dl dt {
		width: 50%;
		display: table-cell;
		vertical-align: middle;
		padding: 0;
	}
	.r-voice .menu a dl dd {
		width: 50%;
		display: table-cell;
		vertical-align: middle;
		padding: 3%;
	}
	.r-voice .menu a dl dd .name {
		font-size: 1.5rem;
		margin-bottom: 10px;
	}
	
	.r-voice.inner-menu {
		padding: 8% 0 0;
	}
	.r-voice.inner-menu .menu {
		width: 100%;
		margin-bottom: -5%;
	}
	.r-voice.inner-menu .menu a {
		width: 48%;
		max-width: 48%;
		margin: 0 0 5%;
	}
	.r-voice.inner-menu .menu a:nth-last-of-type(1) {
		margin-bottom: 0;
	}
	
}

@media only screen and (min-width:1px) and (max-width: 768px) {
	
	.comapny-list li {
		width: 50%;
	}
	.comapny-pict {
		background-color: #999;
		padding: 5%;
	}
	.comapny-pict .contents-inner {
		display: block;
	}
	.comapny-pict .contents-inner h2 {
		width: 100%;
		display: block;
		font-size: 2.8rem;
		text-align: center;
		margin-bottom: 6%;
	}
	.comapny-pict .contents-inner .pict {
		width: 100%;
		display: block;
	}
	
	.products-map {
		max-width: 550px;
		margin: 7% auto 0;
	}
	.products-map .item {
		width: 4.7%;
		position: absolute;
		top: 20%;
		left: 54.5%;
		z-index: 2;
	}
	.products-map .item2 {
		width: 4.7%;
		position: absolute;
		top: 30%;
		left: 53.5%;
		z-index: 2;
	}
	.products-map .item3 {
		width: 4.7%;
		position: absolute;
		top: 40.5%;
		left: 53.5%;
		z-index: 2;
	}
	.products-map .item4 {
		width: 4.7%;
		position: absolute;
		top: 53%;
		left: 54.5%;
		z-index: 2;
	}
	.products-map .item5 {
		width: 4.7%;
		position: absolute;
		top: 51%;
		left: 48%;
		z-index: 2;
	}

	/* img */
	.products-map img {
		width: 100%;
		max-width: 100%;
		height: auto;
	}
	
	.products-item {
		max-width: 450px;
		margin: 10% auto 0;
	}
	.products-item dl {
		display: block;
	}
	.products-item dl dt {
		width: 100%;
		display: block;
	}
	.products-item dl dd {
		width: 100%;
		display: block;
	}
	
	.e-movie ul {
		width: 100%;
		display: block;
	}
	.e-movie ul li {
		width: 100%;
	}
	.e-movie ul li:nth-of-type(3) {
		margin-bottom: 6%;
	}
	.e-movie ul li h2 {
		width: 100%;
		color: #FFF;
		text-align: center;
		background-color: #ce1a18;
		padding: 15px 1em;
	}
	.e-movie ul li .inner {
		background-color: #FFF;
		padding: 5%;
	}
	.e-movie ul li .inner p {
		margin-top: 6%;
	}

	.e-movie .inner ul li video {
		width: 100%;
		max-width: 100%;
		height: auto;
		display: block;
		outline: none;
		margin: 0 auto;
	}
	
	.r-message {
		padding: 10% 0;
	}
	.r-message h1 {
		font-size: 4rem;
	}

	.r-group {
		padding: 8% 0;
	}
	.r-group .inner {
		padding: 8% 5%;
	}
	
	.r-program {
		padding: 8% 0;
	}
	.r-program .step dl dt {
		width: 50%;
		padding: 5% 1em;
	}
	.r-program .step dl dd {
		padding: 5% 1em 5% 0;
	}
	.v-profile {
		width: 90%;
		background-color: #999;
	}
	.v-profile dl {
		width: 100%;
		display: block;
	}
	.v-profile dl dt {
		width: 100%;
	}
	.v-profile dl dd {
		width: 100%;
		display: block;
		background-image: url(../../images/bg_products_r.png);
		padding: 5%;
	}
	.v-profile dl dd h2,.v-profile dl dd h3,.v-profile dl dd p {
		width: 100%;
		color: #FFF;
	}
	.v-profile dl dd h2 {
		width: 100%;
		font-size: 4rem;
	}
	.v-profile dl dd h3 {
		font-size: 2rem;
		margin: 10px 0;
	}
	.r-voice .menu {
		width: 100%;
		display: block;
		margin-bottom: 0;
	}
	.r-voice .menu a {
		width: 100%;
		max-width: 480px;
		margin: 0 auto 6%;
	}
	
	.v-schedule {
		background-color: #FFF;
		padding: 8% 0;
	}
	.v-schedule .contents-item {
		display: block;
	}
	.v-schedule .contents-item .title {
		width: 300px;
		margin: 0 auto 6%;
	}
	.v-schedule .contents-item .inner {
		width: 100%;
		max-width: 100%;
		padding-left: 0;
	}

	.private {

	}
	.private dl {
		width: 100%;
		display: block;
	}
	.private dl dt {
		width: 100%;
		max-width: 480px;
		display: block;
		margin: 0 auto;
		padding: 5%;
	}
	.private dl dd {
		display: block;
		color: #ce1a18;
		padding: 0 5% 5%;
	}
	.private dl dd h2 {
		text-align: center;
		margin-bottom: 20px;
	}
	
	.comment {
		margin-top: 40%;
	}
	.comment .contents-inner {
		padding: 10% 0 5%;
	}
	.comment .contents-inner h2 {
		color: #FFF;
		text-align: center;
		margin-bottom: 20px;
	}
	.comment .contents-inner p {
		color: #FFF;
	}
	
	.r-voice.inner-menu {
		padding: 8% 0 0;
	}
	.r-voice.inner-menu .menu {
		width: 100%;
		margin-bottom: 0;
	}
	.r-voice.inner-menu .menu a {
		width: 100%;
		max-width: 480px;
		margin: 0 auto 6%;
	}
	
	.style-banner {
		margin-top: 6%;
		padding: 5% 0;
	}
	.style-banner .inner a {
		font-size: 1.8rem;
		margin: 6% auto 0;
		padding: 20px;
	}
	
}

@media only screen and (min-width:1px) and (max-width: 568px) {
	
	.comapny-list li {
		width: 100%;
	}
	.comapny-pict .contents-inner h2 {
		font-size: 2.2rem;
	}
	
}
	
@media only screen and (min-width:1px) and (max-width: 480px) {
	

}

