@charset "UTF-8";
/* auther: cee; */

.outline #kv{
	background-image: url(/jpn/images/company/outline/kv_bg.jpg);
}
.history #kv{
	background-image: url(/jpn/images/company/history/kv_bg.jpg);
	background-position: top;
}
.recruit #kv {background-image: url(/jpn/images/company/recruit/kv_bg.jpg);}
.tour #kv {
	background-image: url(/jpn/images/company/tour/kv_bg.jpg) !important;
	background-position: center top;
}
.sustainability #kv {
	background-image: url(/jpn/images/company/sustainability/kv_bg.jpg) !important;
	background-position: center top;
}
.privacy #kv {background-image: url(/jpn/images/company/privacy/kv_bg.jpg);}
.privacy #kv::before{background:none}



#subcategorytop.outline #submenuData a[href*='outline.html'],
#subcategorytop.history #submenuData a[href*='history.html'],
#subcategorytop.recruit #submenuData a[href*='recruit.html'],
#subcategorytop.tour #submenuData a[href*='recruit.html'],
#subcategorytop.sustainability #submenuData a[href*='sustainability.html'],
#subcategorytop.privacy #submenuData a[href*='privacy.html']
 {
	color: rgba(0,0,0,1) !important;
	background: rgba(236,245,82,.75);	
	/* color: #E4FF00; */
}
#submenuData li:nth-of-type(1) {
	background-image: url(/jpn/images/company/outline/kv_bg.jpg);
}
#submenuData li:nth-of-type(2) {
	background-image: url(/jpn/images/company/history/kv_bg.jpg);
	background-position: top;
}
#submenuData li:nth-of-type(3) {background-image: url(/jpn/images/company/recruit/kv_bg.jpg);}
/* #submenuData li:nth-of-type(4) {background-image: url(/jpn/images/company/tour/kv_bg.jpg);
	background-position: center 15%;} */
#submenuData li:nth-of-type(4) {background-image: url(/jpn/images/company/sustainability/kv_bg.jpg);
	background-position: center 15%;}
#submenuData li:nth-of-type(5) {background-image: url(/jpn/images/company/privacy/kv_bg.jpg);}

.recruit article p{
	max-width: 740px;
}
.recruit .message .container::before {background-image: url(/jpn/images/company/recruit/message_bg.jpg);}

.tour #letter .box:nth-of-type(n+2) {padding: 60px 0 0;}
.tour #letter #staff li {
color: #fff;
position: relative;
z-index: 2;
}
.tour #letter #staff li:nth-of-type(odd) {background: rgb(37,37,37);}
.tour #letter #staff li:nth-of-type(even) {background: rgb(42,42,42);}
.tour #letter #staff li::after {
width: 100%;
height: 100%;
content: '';
visibility: visible;
background: no-repeat;
position: absolute;
left: 0;
top: 0;
z-index: -1;
}
.tour #letter #staff .staff01::after {background-image: url(/jpn/images/company/tour/staff01.jpg);}
.tour #letter #staff .staff02::after {background-image: url(/jpn/images/company/tour/staff02.jpg);}
.tour #letter #staff .staff03::after {background-image: url(/jpn/images/company/tour/staff03.jpg);}
.tour #letter #staff .staff04::after {background-image: url(/jpn/images/company/tour/staff04.jpg);}
.tour #letter #staff li span:nth-of-type(1) {margin-right: .5em;}
.tour #letter #schudule {text-align: center;}
.tour #letter #schudule dl {
margin-bottom: 20px;
padding: 20px 20px 10px;
display: block;
border: 1px solid rgb(170,170,170);
}
.tour #letter #schudule dt,
.tour #letter #schudule dd {
margin-bottom: .5em;
padding-bottom: 10px;
line-height: 1.5em;
}
.tour #letter #schudule dt {
width: 8em;
color: rgb(170,170,170);
text-align: right;
float: left;
display: inline-block;
}
.tour #letter #schudule dd {
margin-bottom: 10px;
padding-left: 9em;
text-align: left;
border-bottom: 1px dashed rgb(170,170,170);
display: block;
clear: right;
}
.tour #entry {
background: url(/jpn/images/company/tour/entry_bg.jpg) repeat-x center top;
background-size: auto 100%;
position: relative;
}
.tour #entry::before {
width: 100%;
height: 100%;
content: '';
background: rgba(0,0,0,.6);
position: absolute;
left: 0;
top: 0;
}
.tour #entry h5 {
margin-bottom: .5em;
color: rgb(170,170,170);
line-height: 1em;
text-align: right;
float: right;
}
.tour #entry .sample {
margin-top: 40px;
position: relative;
}
.tour #entry .sample::after {
width: 100%;
height: 0;
content: '.';
visibility: hidden;
display: block;
clear: both;
}
.tour #entry .box {
padding: 20px;
background: rgba(255,255,255,.9);
}
.tour #entry ul {
padding: 21px 21px 11px;
line-height: 1.5em;
text-align: justify;
}
.tour #entry ul::before {
height: 100%;
content: '';
position: absolute;
top: 0;
}
.tour #entry ul:nth-of-type(1)::before {
border: 1px solid rgb(170,170,170);
left: 0;
}
.tour #entry ul:nth-of-type(1) span {
color: rgb(170,170,170);
display: block;
}
.tour #entry ul:nth-of-type(2) {
padding-left: 2em;
list-style: circle outside;
float: right;
}
.tour #entry ul:nth-of-type(2)::before {
border: 1px dashed rgb(170,170,170);
right: 0;
}
.tour #entry li {margin-bottom: .5em;}
.tour #entry .button {
max-width: 300px;
margin-left: auto;
margin-right: auto;
}
.tour #riders {position: relative;}
.tour #riders::before {
width: 100%;
height: 100%;
content: '';
background: rgba(42,42,42,.8);
position: absolute;
left: 0;
top: 0;
}
.tour #riders h4 {
width: 100%;
height: 1em;
margin: auto 0;
color: #fff;
text-align: center;
position: absolute !important;
left: 0;
top: 0;
bottom: 0;
z-index: 2;
}
.tour #riders img {width: 100%;}
.tour #recruit {
	margin: -40px auto 120px;
}
.tour .message .container::before {background-image: url(/jpn/images/company/tour/message_bg.jpg);}
.companies ul li{ width:25%; }
.companies img	{ width:100%; vertical-align:top; border:solid 1px #ccc; }
.companies p	{ text-align:center; margin-bottom:0; }
/* .takumi h3			{  }
.takumi div.box		{ margin:0 0 25px 0; }
.takumi table td	{ line-height:1.5; padding:0 0 25px; } */

.sustainability #letter.grey{background-color: #f7f7f7;}
.sustainability #letter .box:nth-of-type(n+2) {padding: 60px 0 0;}
.sustainability #letter #staff li {
color: #fff;
position: relative;
z-index: 2;
}
.sustainability #letter #schudule {text-align: center;}
.sustainability #letter #schudule dl {
margin-bottom: 20px;
padding: 20px 20px 10px;
display: block;
border: 1px solid rgb(170,170,170);
}
.sustainability #letter #schudule dt,
.sustainability #letter #schudule dd {
margin-bottom: .5em;
padding-bottom: 10px;
line-height: 1.5em;
}
.sustainability #letter #schudule dt {
width: 8em;
color: rgb(170,170,170);
text-align: right;
float: left;
display: inline-block;
}
.sustainability #letter #schudule dd {
margin-bottom: 10px;
padding-left: 9em;
text-align: left;
border-bottom: 1px dashed rgb(170,170,170);
display: block;
clear: right;
}

.sustainability #entry::before {
width: 100%;
height: 100%;
content: '';
background: rgba(0,0,0,.6);
position: absolute;
left: 0;
top: 0;
}

.sustainability #riders {position: relative;}
.sustainability #riders::before {
width: 100%;
height: 100%;
content: '';
background: rgba(42,42,42,.8);
position: absolute;
left: 0;
top: 0;
}
.sustainability #riders h4 {
width: 100%;
height: 1em;
margin: auto 0;
color: #fff;
text-align: center;
position: absolute !important;
left: 0;
top: 0;
bottom: 0;
z-index: 2;
}
.sustainability #riders img {width: 100%;}
.sustainability #recruit {
	margin: -40px auto 120px;
}
.sustainability #letter .box-image{
	width: 100%;
	margin: 60px auto;
}
.sustainability article p{
	max-width: 740px;
}

.sustainability .message .container::before {background-image: url(/jpn/images/company/tour/message_bg.jpg);}

.sustainability .related h3 {
	color: #000!important;
	font-size: 22px!important;
}
.sustainability .related h3 span{
	color: #000!important;
	font-size: 38px!important;
	border: 0!important;
}


.sustainability .related h4 span{
	display: block!important;
	color: #fff!important;
	font-size: 30px!important;
	width: 200px!important;
    text-align: left!important;
    float: left!important;
}
.sustainability .related h4 small{
	text-align: left!important;
    font-size: 16px!important;
    display: block!important;
    float: left!important;
	max-width: 550px!important;
}

.companies ul li{ width:25%; }
.companies img	{ width:100%; vertical-align:top; border:solid 1px #ccc; }
.companies p	{ text-align:center; margin-bottom:0; }

@media all and (min-width:2000px) {
	.sustainability .related h4 small{
		max-width: 500px!important;
	}
}

@media all and (min-width:1599px) {
	article#recruit #lead h3{
	font-size: 30px!important;
	}
}

@media all and (min-width:995px) {
	#submenuData li {width: calc(100% / 5);}
	#submenuData li:nth-of-type(4) {background-position: 25% center;}
	.recruit #main {padding: 150px 0;}
	.recruit #lead {
		padding: 50px 0;
		margin-bottom: -150px;
	}
	.recruit #main h4 {padding-top: 60px;}
	.recruit .video {margin-bottom: 60px;}
	.tour #letter {padding: 150px 0;}
	.tour #letter #staff li {
	width: 25%;
	padding: 200px 0;
	text-align: center;
	float: left;
	}
	.tour #letter #staff li::after {
	background-size: cover;
	background-position: center center;
	opacity: .8;
	}
	.tour #letter #schudule {
	max-width: 640px;
	margin: 0 auto;
	}
	.tour #entry {padding: 120px 0 60px;}
	.tour #entry .box {margin-bottom: 60px;}
	.tour #entry ul {width: 49%;}
	.tour #entry ul:nth-of-type(1) {float: left;}
	.tour #entry ul::before {width: 49%;}
	.related h4 {max-width: 100%;}

	.history #sub-kv .container .box{
		width: 60%;
		padding: 2rem 2vw;
		background: rgba(255, 255, 255, 0.6);
		color: #000;
	}
	.history #sub-kv .container .box h2 span{
		font-size: 38px;
	}
	.history #sub-kv .container .box p{
		font-size: 22px;
	}
	.companies ul	{ display:flex; }
	.companies li	{ margin-right:10px; }
	.companies li:last-child { margin-right:0; }
	.sustainability #letter {padding: 150px 0;}
	.sustainability #letter #staff li {
	width: 25%;
	padding: 200px 0;
	text-align: center;
	float: left;
	}
	.sustainability #letter #staff li::after {
	background-size: cover;
	background-position: center center;
	opacity: .8;
	}
	.sustainability #letter #schudule {
	max-width: 640px;
	margin: 0 auto;
	}
	
}
@media all and (max-width:1294.9px) {
	.sustainability .related h4 span{
		font-size: 26px!important;
	}
	.sustainability .related h4 small{
		font-size: 14px!important;
		max-width: 450px!important;
	}
}
@media all and (max-width:1199.9px) {
	.sustainability .related h4 span{
		font-size: 24px!important;
		width: 150px!important;
	}
	.sustainability .related h4 small{
		max-width: 400px!important;
	}
}

@media screen and (min-width:994.9px) and (max-width:1299.9px){
	article#recruit #lead h3{
		font-size: 26.5px!important;
	}
}

@media all and (max-width:994.9px) {
	#submenuData li:nth-of-type(4) {background-position: 25% 35%;}
	.recruit #kv {background-position: 15% center;}
	.recruit #main {padding: 120px 0;}
	.recruit #lead {
		padding: 60px 0;
		margin-bottom: -120px;
	}
	.recruit #main h4 {padding-top: 120px;}
	.tour #letter {padding: 120px 0;}
	.tour #letter #staff li {padding: 80px 0 80px 160px;}
	.tour #letter #staff li::before {
	width: 100%;
	height: 100%;
	content: '';
	background: center center;
	background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	opacity: .2;
	}
	.tour #letter #staff .staff01::before {background-image: url(/jpn/images/company/tour/staff01.jpg);}
	.tour #letter #staff .staff02::before {background-image: url(/jpn/images/company/tour/staff02.jpg);}
	.tour #letter #staff .staff03::before {background-image: url(/jpn/images/company/tour/staff03.jpg);}
	.tour #letter #staff .staff04::before {background-image: url(/jpn/images/company/tour/staff04.jpg);}
	.tour #letter #staff li::after {
	background-size: auto 100%;
	background-position: left center;
	}
	.tour #letter #staff li span {
	line-height: 1.5em;
	display: inline-block;
	}
	.tour #entry {padding: 120px 0;}
	.tour #entry .box {margin-bottom: 30px;}
	.tour #entry ul {width: 100%;}
	.tour #entry ul::before {width: 100%;}
	.tour #entry ul {position: relative;}
	.tour #entry ul:nth-of-type(2)::before {left: 0;}
	.tour #entry ul + ul {margin-top: 20px;}
	.tour .message .container::before {background-position: center top;}
	.recruit #notice #kv {background-position: 22% bottom;}
	.recruit #main h4 br {display: none;}

	.history #sub-kv{
		padding:8rem 0;
	}
	.history #sub-kv .container .box{
		width: 100%;
		padding: 2rem 2vw;
		background: rgba(255, 255, 255, 0.6);
		color: #000;
	}
	.history #sub-kv .container .box h2 span{
		font-size: 38px;
	}
	.history #sub-kv .container .box p{
		font-size: 22px;
	}
	.companies ul li{ width:100%; }
	.companies li { margin-bottom:40px; }
	.sustainability #letter {padding: 120px 0;}
	.sustainability #letter #staff li {padding: 80px 0 80px 160px;}
	.sustainability #letter #staff li::before {
	width: 100%;
	height: 100%;
	content: '';
	background: center center;
	background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	opacity: .2;
	}
	.sustainability #letter #staff .staff01::before {background-image: url(/jpn/images/company/tour/staff01.jpg);}
	.sustainability #letter #staff .staff02::before {background-image: url(/jpn/images/company/tour/staff02.jpg);}
	.sustainability #letter #staff .staff03::before {background-image: url(/jpn/images/company/tour/staff03.jpg);}
	.sustainability #letter #staff .staff04::before {background-image: url(/jpn/images/company/tour/staff04.jpg);}
	.sustainability #letter #staff li::after {
	background-size: auto 100%;
	background-position: left center;
	}
	.sustainability #letter #staff li span {
	line-height: 1.5em;
	display: inline-block;
	}
	.sustainability .message .container::before {background-position: center top;}
	.sustainability #letter .box-image{
		margin: 0 auto;
	}
	.sustainability .related h4 span{
		font-size: 24px!important;
		width: 120px!important;
		clear: both;
	}

	.sustainability .related h4 small{
		font-size: 14px!important;
		clear: both;
		max-width: 100%!important;
	}
 /* 230712追記　*/
	.sustainability .related h4 br{
		display: block;
	}
 
	.tour #recruit .button.yellow{
		width: 60%!important;
	}
}

@media screen and (min-width:600px) {
	.recruit #notice .wrap > .button {
	width: calc(50% - 5px);
	margin-bottom: 0;
	clear: none;
	}
	.recruit #notice .wrap > .button:nth-of-type(odd) {float: left;}
	.recruit #notice .wrap > .button:nth-of-type(even) {float: right;}
}