@charset 'UTF-8';

/*  future
--------------------------------------- */

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

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

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

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

html:lang(ja) .lnav ul {
max-width: 1040px;
}

html:lang(en) .lnav ul {
max-width: 1280px;
}


.csr {
max-width: 900px;
margin: 0 auto;
padding: 70px 20px 55px;
box-sizing: border-box;
}

.csr .ttlBox {
padding: 35px 0 40px;
text-align: center;
background: url("/ja/assets/img/csr/bg_csr_01.jpg") no-repeat center top;
}

.csr .ttlBox h2 {
margin: 0 0 35px;
padding: 0 0 12px;
color: #333;
font-size: 26px;
font-weight: bold;
background: url("/ja/assets/img/csr/bg_line_01.png") no-repeat center bottom;
background-size: 123px auto;
}

.csr .ttlBox ul {
display: flex;
justify-content: center;
}

.csr .ttlBox ul li {
width: 191px;
margin: 0 27px;
padding: 40px 0 46px;
background: url("/ja/assets/img/csr/bg_csr_02.png") no-repeat;
}

.csr .ttlBox ul li h3 {
margin: 0 0 20px;
color: #fff;
font-size: 22px;
font-weight: bold;
}

.csr .ttlBox ul li p {
color: #fff;
font-size: 16px;
line-height: 1.625;
}

.csr > .note {
margin: 5px 0 34px;
text-align: right;
}

.csr > p {
margin: 0 0 24px;
font-size: 14px;
line-height: 1.58;
}

.csr .linkList {
display: flex;
flex-wrap: wrap;
margin: 0 -12px;
padding: 50px 0 0;
}

.csr .linkList > li {
width: 270px;
margin: 0 12px 25px;
}

.csr .linkList > li a {
display: flex;
align-items: center;
background: url("/ja/assets/img/csr/ico_arw_01.png") no-repeat right center;
}

.csr .linkList > li a .img {
width: 80px;
height: 70px;
overflow: hidden;
}

.csr .linkList > li a .img img {
display: block;
transition-duration: 0.3s;
}
.csr .linkList > li a:hover .img img {
transform: scale(1.1);
transition-duration: 0.3s;
}

.csr .linkList > li a .txt {
flex: 1;
margin: 0 0 0 15px;
color: #144996;
font-size: 18px;
font-weight: bold;
line-height: 1.23;
transition-duration: 0.3s;
}

.csr .linkList > li a:hover .txt {
color: #0022FF;
transition-duration: 0.3s;
}

.csr .linkList .txtList {
min-height: 142px;
padding: 16px 18px;
background: url("/ja/assets/img/csr/bg_csr_03.png") no-repeat center top;
box-sizing: border-box;
}

.csr .linkList .txtList li {
font-size: 14px;
line-height: 1.58;
}

.csr .linkList .txtList li span {
color: #144996;
}


@media screen and (max-width: 920px) {
.csr .linkList {
justify-content: center;
margin: 0;
}
}

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

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

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

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

.kv p {
padding: 0 0 9.16%;
color: #000033;
font-size: 13px;
font-weight: bold;
line-height: 1.16;
}

.lnav ul {
width: 1000px;
max-width: inherit;
}
	
html:lang(ja) .lnav ul {
width: 1000px;
max-width: inherit;
}

html:lang(en) .lnav ul {
width: 1280px;
max-width: inherit;
}

.csr {
width: 86.667%;
margin: 0 auto;
padding: 12% 0 0;
box-sizing: border-box;
}

.csr .ttlBox {
padding: 8% 0 8%;
text-align: center;
background: url("/ja/assets/img/csr/bg_csr_01_sp.jpg") no-repeat center top;
background-size: cover;
}

.csr .ttlBox h2 {
margin: 0 0 6%;
padding: 0 0 3%;
color: #333;
font-size: 18px;
font-weight: bold;
background: url("/ja/assets/img/csr/bg_line_01_sp.png") no-repeat center bottom;
background-size: 100px auto;
}

.csr .ttlBox ul {
display: block;
}

.csr .ttlBox ul li {
width: 240px;
margin: 0 auto 3%;
padding: 20px 0 19px;
background: url("/ja/assets/img/csr/bg_csr_02_sp.png") no-repeat center top;
background-size: cover;
}

.csr .ttlBox ul li:nth-child(2) {
padding: 20px 0 13px;
background: url("/ja/assets/img/csr/bg_csr_02_02_sp.png") no-repeat center top;
background-size: cover;
}

.csr .ttlBox ul li h3 {
margin: 0 0 12px;
color: #fff;
font-size: 16px;
font-weight: bold;
}

.csr .ttlBox ul li p {
color: #fff;
font-size: 13px;
line-height: 1.39;
}

.csr > .note {
margin: 3% 0 8%;
text-align: right;
}

.csr > p {
margin: 0 0 5.85%;
font-size: 12px;
line-height: 1.59;
}

.csr .linkList {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0;
padding: 4% 0 0;
}

.csr .linkList > li {
width: 47.7%;
margin: 0 0 9.5%;
}

.csr .linkList > li a {
display: flex;
align-items: center;
background: url("/ja/assets/img/csr/ico_arw_01_sp.png") no-repeat right center;
background-size: auto 5px;
}

.csr .linkList > li a .img {
width: 25.8%;
height: auto;
}

.csr .linkList > li a .img img {
display: block;
transition-duration: 0;
}
.csr .linkList > li a .img img:hover {
transform: scale(1);
transition-duration: 0;
}

.csr .linkList > li a .txt {
flex: 1;
margin: 0 0 0 2.6%;
color: #144996;
font-size: 14px;
font-weight: bold;
line-height: 1;
}

.csr .linkList .txtList {
min-height: 57px;
padding: 4% 3%;
background: url("/ja/assets/img/csr/bg_csr_03_sp.png") no-repeat center top;
background-size: 100% auto;
box-sizing: border-box;
}

.csr .linkList .txtList li {
padding: 0 0 0 1em;
font-size: 12px;
line-height: 1.59;
text-indent: -1em;
}

.csr .linkList .txtList li span {
color: #144996;
}




}
