@charset "UTF-8";

@media screen and (max-width: 1023px) {
#breadCrumb h1:before {
background:url(../../img/csr/common/bread_icon_csr.png) no-repeat 0 0/52px auto
}

.csr #content {
box-sizing:border-box;
padding:0 10px 20px
}

.csr .conteInr {
width:100%!important
}

.csr #section01 {
margin:40px 0 30px
}

.csr #section01 h3 {
margin-bottom:30px
}

.csr #section01 h4 {
font-size:131%;
margin:24px 0 8px
}

.csr #section01 p {
font-size:100%;
padding:0 10px;
text-align:left
}

.csr #section02,.csr #section03 {
background:none;
width:100%
}

.csr #section04 {
background:none;
margin:0 auto 10px;
width:100%
}

.csr #section04 .left,.csr #section04 .right {
margin-bottom:0
}

.csr #section03 h3,.csr #section04 h3 {
padding-top:0
}

.csr .section .left p,.csr .section .right p {
margin-top:15px
}

.csr #section02,.csr #section03,.csr #section04 {
box-sizing:border-box;
padding:0 10px
}

.csr #section04 .left {
background:none
}

.quality .conteInr {
float:none;
margin:0 0 50px!important;
width:100%!important
}

.quality .section {
margin-bottom:35px
}

.quality #section01 {
background:none;
margin-bottom:20px;
padding:0 10px
}

.quality #section01 ul {
margin:15px 0 0;
width:100%
}

.quality #section01 li {
box-sizing:border-box
}

.quality #section01 li:nth-of-type(1) {
background:url(../../img/csr/quality/img02.png) no-repeat 0 0;
width:100%
}

.quality #section01 li:nth-of-type(2) {
background:url(../../img/csr/quality/img03.png) no-repeat 0 0;
width:100%
}

.quality #section01 li:nth-of-type(3) {
background:url(../../img/csr/quality/img04.png) no-repeat 0 0;
width:100%
}

.quality #section03 {
margin-bottom:40px;
padding:0 10px
}

.quality #section04 {
background:none;
background-color:#F1ECE0;
margin:0 10px 60px;
padding-top:40px;
position:relative
}

.quality #section04::before {
background:url(../../img/sp/csr/quality/block_top.png) no-repeat 0 0;
content:'';
display:block;
height:75px;
left:-20px;
position:absolute;
top:-20px;
width:75px
}

.quality #section04::after {
background:url(../../img/sp/csr/quality/block_bottom.png) no-repeat 0 0;
bottom:-20px;
content:'';
display:block;
height:75px;
position:absolute;
right:-20px;
visibility:visible;
width:75px
}

.quality #section04 .secInr {
background:none;
padding:0 20px
}

.quality #section04 .secInr dl {
float:none;
font-size:100%;
margin-top:0;
padding-bottom:30px;
width:100%
}

.quality #section04 .secInr dl:nth-of-type(1) {
margin-left:0
}

.quality #section04 .secInr dl:nth-of-type(2) {
margin:0
}

.quality #section04 .secInr dl dt {
background:url(../../img/sp/common/line_dot.png) repeat-x center bottom;
text-align:center
}

.quality #section04 .secInr dl dd {
line-height:1.7;
margin-top:10px
}

.quality .section h4 span {
font-size:14px;
font-weight:700
}

.eco #section01 {
background:url(../../img/csr/eco/img02.png) no-repeat 65% bottom/auto 100px;
min-height:inherit;
padding:0 10px 115px
}

.eco #section01 h4 {
font-size:131%;
width:auto
}

.eco #section01 h4:nth-of-type(2) {
margin-top:25px
}

.eco #section02 img {
display:block;
float:none;
height:auto;
max-width:100%
}

.eco #section04 img {
display:block;
float:none;
height:auto;
max-width:176px;
width:80%
}

.society #section01 {
background:url(../../img/csr/society/img02.png) no-repeat center calc(100% + 138px);
padding:0 10px 250px
}

.society #section01 h4,.society #section01 p {
width:100%
}

.society #section01 p {
margin-bottom:12px
}

.society #section02 {
margin:40px 0;
padding:0 10px
}

.jna #section01 ul {
float:none;
margin-bottom:15px;
width:auto
}

.disaster .section h4 span {
left:0;
line-height:1.3
}

.disaster #section01 {
padding:0 10px 40px
}

.disaster #section01 ul {
margin:20px 0 0
}

.disaster #section01 ul li {
float:none;
margin:0 auto 10px;
width:220px
}

.disaster #section01 ul li:last-child {
margin:0 auto
}

.disaster #section02 div {
background:#F9F6F5 url(../../img/sp/csr/disaster/img04.png) no-repeat right bottom;
box-sizing:border-box;
padding:20px;
width:100%
}

.disaster #section04 {
margin-bottom:50px;
padding:0 10px
}

#cr03,.csr #section01 p br,.quality #section01 li br {
display:none
}

.csr #section01 h3 img,.csr #section02 img,.csr #section03 img,.csr #section04 img,.quality #catImg h2 img,.quality h3 img,.quality #section03 img,.eco #catImg h2 img,.eco h3 img,.society #catImg h2 img,.society h3 img,.society #section02 img,.jna #catImg h2 img,.jna h3 img,.disaster #catImg h2 img,.disaster h3 img {
height:auto;
max-width:100%
}

.csr .section .left,.csr .section .right {
background:url(../../img/sp/csr/top/line_dot.png) repeat-x center bottom;
float:none;
margin-bottom:25px;
padding-bottom:25px;
width:100%
}

.quality #content,.eco #content,.society #content,.jna #content,.disaster #content {
box-sizing:border-box;
padding:0 10px;
width:100%
}

.quality #catImg h2,.eco #catImg h2,.society #catImg h2,.jna #catImg h2,.disaster #catImg h2 {
margin:0 0 30px;
overflow:hidden;
width:100%
}

.quality h3,.eco h3,.society h3,.jna h3,.disaster h3 {
margin-bottom:25px
}

.quality .kv,.eco .kv,.society .kv,.jna .kv,.disaster .kv {
margin-bottom:30px!important
}

.quality .kv img,.eco .kv img,.society .kv img,.jna .kv img,.disaster .kv img {
display:block;
height:auto;
margin-left:auto;
margin-right:auto;
max-width:100%
}

.quality #section02 p,.quality #section0202 p {
margin-bottom:8px
}

.quality .section h4,.society .section h4,.jna #section01 h4,.disaster .section h4 {
font-size:131%
}

.eco .conteInr,.society .conteInr,.jna .conteInr,.disaster .conteInr {
float:none;
margin:0 0 40px!important;
width:100%!important
}

.eco #section01 p,.jna #section01 .right {
width:auto
}

.society #section03,.jna #section02 {
box-sizing:border-box;
margin:0 10px 40px;
text-align:center;
width:calc(100% - 20px)
}

.society #section03 h5,.jna #section02 h5 {
font-size:108%
}

.jna #section01,.disaster #section02,.disaster #section03 {
padding:0 10px
}

.disaster .section h5,.disaster #section02 div .w330 {
box-sizing:border-box;
width:100%
}

.disaster #section03 div,.disaster #section04 div {
box-sizing:border-box;
padding:20px;
width:100%
}
}