@charset 'UTF-8';

/*  company
--------------------------------------- */

.kv {
background: url("/ja/assets/img/company/bg_kv_01.jpg") no-repeat center;
}

.kv_50th {
background: url("/ja/assets/img/company/bg_kv_50.jpg") no-repeat center;
}

.kv .inner {
max-width: 900px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}

.kv h1 {
padding: 50px 0 10px;
color: #000033;
font-size: 30px;
font-weight: bold;
}

.kv p {
padding: 0 0 30px;
color: #000033;
font-size: 15px;
font-weight: bold;
line-height: 1.47;
}

.company {
padding: 65px 0 100px;
}

.company .listBox {
position: relative;
}

.company .listBox:after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 120px;
background: url("/ja/assets/img/company/bg_company_01.png") no-repeat center;
background-size: cover;
z-index: -1;
}

.company h2 {
margin: 0 0 40px;
font-size: 30px;
font-weight: bold;
text-align: center;
}

.company h2 span {
display: block;
color: #034a96;
font-size: 16px;
font-weight: bold;
}

.company ul {
display: flex;
justify-content: center;
max-width: 900px;
margin: 0 auto 60px;
padding: 0 20px 60px;
box-sizing: border-box;
}

.company ul li {
position: relative;
width: 30.24%;
margin: 0 2.32%;
overflow: hidden;
}

.company ul li a {
display: block;
}

.company ul li .txt {
position: absolute;
left: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 40px;
color: #fff;
font-size: 15px;
font-weight: bold;
text-align: center;
background: rgba(0,0,0,0.4);
box-sizing: border-box;
transition: all 0.5s;
}

.company ul li .txt.on {
height: 100%;
transition: all 0.5s;
}

.company ul li .txt > span {
display: block;
position: relative;
width: 100%;
}

.company ul li .txt > span:after {
content: '';
position: absolute;
bottom: -11px;
left: 0;
right: 0;
width: 150px;
height: 1px;
margin: 0 auto;
background: #fff;
}

.company .bnr {
width: 430px;
margin: 0 auto;
padding: 10px 0 0;
}

.company .bnr a {
display: block;
padding: 22px 0;
font-size: 20px;
font-weight: bold;
line-height: 1.3;
background: url("/ja/assets/img/company/img_company_08.jpg") no-repeat right center;
}

/*  video  */

.mov50th video {
	width: 800px;
	max-width: 100%;
}

/*  customers  */

.fl_left, .fl_right {
	width: 400px;
	display: block;
}

.fl_left ul, .fl_right ul {
	margin-left: 40px;
}

.fl_left {
	float: left;
}

.fl_right {
	float: right;
}


@media screen and (max-width: 800px) {
.company ul li .txt.on:after {
bottom: 65px;
}
}

@media screen and (max-width: 750px) {

.kv {
background: url("/ja/assets/img/company/bg_kv_01_sp.jpg") no-repeat center;
background-size: cover;
}
	
.kv_50th {
background: url("/ja/assets/img/company/bg_kv_50_sp.jpg") no-repeat center;
background-size: cover;
}

.kv .inner {
width: 88%;
margin: 0 auto;
padding: 0;
}

.kv h1 {
padding: 5% 0 0;
color: #000033;
font-size: 20px;
font-weight: bold;
line-height: 2;
}

.kv p {
padding: 0 0 5.6%;
color: #000033;
font-size: 10px;
font-weight: bold;
line-height: 1.5;
}

.company {
padding: 7.5% 0 7%;
text-align: center;
box-sizing: border-box;
}

.company .listBox {
position: relative;
}

.company .listBox:after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 40px;
background: url("/ja/assets/img/company/bg_company_01.png") no-repeat center;
background-size: cover;
z-index: -1;
}

.company h2 {
margin: 0 0 5%;
font-size: 20px;
font-weight: bold;
text-align: center;
}

.company h2 span {
display: block;
color: #034a96;
font-size: 11px;
font-weight: bold;
}

.company ul {
display: flex;
justify-content: center;
flex-wrap: wrap;
max-width: inherit;
margin: 0 auto 7.3%;
padding: 0 0 2%;
box-sizing: border-box;
}

.company ul li {
position: relative;
width: 42.13%;
margin: 0 1.33% 2.5%;
overflow: hidden;
}

.company ul li a {
display: block;
}

.company ul li .txt {
position: absolute;
left: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 25px;
color: #fff;
font-size: 13px;
font-weight: bold;
text-align: center;
line-height: 2;
background: rgba(0,0,0,0.4);
box-sizing: border-box;
transition: all 0.5s;
}

.company ul li .txt.on {
height: 100%;
transition: all 0.5s;
}

.company ul li .txt > span {
display: block;
position: relative;
width: 100%;
}

.company ul li .txt > span:after {
content: '';
position: absolute;
bottom: -11px;
left: 0;
right: 0;
width: 150px;
height: 1px;
margin: 0 auto;
background: #fff;
}

.company .bnr {
width: 100%;
max-width: 375px;
margin: 0 auto;
padding: 2% 0 0;
}

.company .bnr a {
display: block;
padding: 18px 6.66%;
font-size: 14px;
font-weight: bold;
text-align: left;
line-height: 1.22;
background: url("/ja/assets/img/company/img_company_08_sp.jpg") no-repeat right center;
background-size: auto 70px;
}

/*  customers  */

.fl_left, .fl_right {
	width:inherit;
}

.fl_left {
	float: none;
}

.fl_right {
	float: none;
}



}

@media screen and (max-width: 374px) {
.company .bnr a {
padding: 14px 6.66%;
font-size: 12px;
background: url("/ja/assets/img/company/img_company_08_sp.jpg") no-repeat right center;
background-size: auto 56px;
}
}