@charset 'UTF-8';

/*  environment
--------------------------------------- */

.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: 50px 0 10px;
color: #000033;
font-size: 30px;
font-weight: bold;
}

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

.conservation {
max-width: 900px;
margin: 0 auto;
padding: 65px 20px;
text-align: center;
box-sizing: border-box;
}

.conservation h2 {
margin: 0 0 38px;
padding: 0 0 18px;
color: #333;
font-size: 30px;
font-weight: bold;
background: url("/ja/assets/img/bg_h2_01.png") no-repeat center bottom;
}

.conservation h3 {
margin: 0 0 26px;
padding: 8px 20px;
color: #fff;
font-size: 20px;
font-weight: bold;
text-align: left;
background: url("/ja/assets/img/bg_h3_01.png") no-repeat center;
}

.conservation .lead {
margin: 0 0 26px;
font-size: 14px;
line-height: 1.58;
text-align: left;
}

.conservation .lead02 {
font-size: 14px;
line-height: 1.58;
text-align: left;
}

.conservation .lead03 {
margin: 0 0 60px;
font-size: 14px;
line-height: 1.58;
text-align: left;
}

.conservation > .ttl {
margin: 0 0 13px;
font-size: 18px;
font-weight: bold;
line-height: 1.5;
text-align: center;
}

.conservation .tableBox01 ,
.conservation .tableBox02 ,
.conservation .tableBox03 ,
.conservation .tableBox04 ,
.conservation .tableBox05 ,
.conservation .tableBox06 ,
.conservation .tableBox07 {
position: relative;
border-top: 4px solid #ccc;
border-bottom: 4px solid #ccc;
}

.conservation .tableBox02 {
margin: 0 0 42px;
}
.conservation .tableBox03 ,
.conservation .tableBox04 ,
.conservation .tableBox05 {
margin: 0 0 60px;
}

.conservation .tableBox06 ,
.conservation .tableBox07 {
margin: 0 0 20px;
}

.conservation .tableBox01:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 215px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation .tableBox02:after ,
.conservation .tableBox03:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 195px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation .tableBox04:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 189px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation .tableBox06:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 140px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation .tableBox07:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 300px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation table {
position: relative;
width: 100%;
table-layout: fixed;
border-collapse: collapse;
}

.conservation table th {
background: #eef2f8;
border-bottom: 1px solid #ccc;
box-sizing: border-box;
}

.conservation .tableBox01 table th {
width: 215px;
padding: 16px 20px;
}

.conservation .tableBox02 table th {
padding: 10px 8px;
border-right: 1px solid #fff;
}

.conservation .tableBox02 table th:first-child {
width: 45px;
padding: 20px 8px;
}

.conservation .tableBox02 table th:nth-child(2) ,
.conservation .tableBox02 table th:nth-child(3) {
width: 75px;
}

.conservation .tableBox03 table th:first-child {
width: 195px;
padding: 15px 20px;
border-right: 1px solid #fff;
}

.conservation .tableBox04 table th:first-child {
width: 189px;
padding: 15px 20px 5px;
text-align: center;
border-right: 1px solid #fff;
}

.conservation .tableBox05 table th {
position: relative;
width: 215px;
padding: 16px 20px;
text-align: left;
border-right: 1px solid #fff;
}

.conservation .tableBox05 table th:after {
content: '';
position: absolute;
top: -4px;
left: 0;
width: 214px;
height: 4px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
}

.conservation .tableBox06 table th:first-child {
width: 140px;
padding: 10px 20px;
border-right: 1px solid #fff;
}

.conservation .tableBox07 table th {
width: 300px;
padding: 10px 20px;
}

.conservation .tableBox07 table tr:first-child th {
border-right: 1px solid #fff;
}

.conservation .tableBox07 table th:nth-child(2) {
border-left: 1px solid #ccc;
}

.conservation table td {
border-bottom: 1px solid #ccc;
box-sizing: border-box;
}

.conservation .tableBox01 table td {
padding: 16px 10px 16px 20px;
}

.conservation .tableBox02 table td {
padding: 10px 13px;
text-align: right;
}

.conservation .tableBox02 table tr:first-child td {
background: #f0f0f0;
}

.conservation .tableBox03 table td {
padding: 10px 13px;
text-align: right;
}

.conservation .tableBox03 table tr:first-child td {
vertical-align: middle;
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox04 table td {
padding: 10px 13px;
text-align: right;
}

.conservation .tableBox04 table tr:first-child td:last-child {
border-bottom: none;
}

.conservation .tableBox04 table tr:first-child td ,
.conservation .tableBox04 table tr:nth-child(2) td {
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox04 table tr:nth-child(2) td {
padding: 6px 13px;
}

.conservation .tableBox05 table td {
padding: 16px 20px;
text-align: center;
vertical-align: middle;
border-right: 1px solid #fff;
}

.conservation .tableBox06 table td {
padding: 10px 15px;
vertical-align: middle;
}

.conservation .tableBox06 table tr:first-child td ,
.conservation .tableBox06 table tr:nth-child(2) td {
padding: 10px 0;
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox06 table td:nth-child(2) ,
.conservation .tableBox06 table td:nth-child(4) {
padding: 10px 35px;
text-align: right;
}

.conservation .tableBox06 table td:nth-child(5) ,
.conservation .tableBox06 table td:nth-child(6) {
text-align: center;
}

.conservation .tableBox07 table td {
padding: 10px 15px;
text-align: center;
vertical-align: middle;
}

.conservation .tableBox07 table tr:first-child td {
padding: 10px 0;
background: #f0f0f0;
}

.conservation table tr:last-child th ,
.conservation table tr:last-child td {
border-bottom: none;
}

.conservation table .ttl {
font-size: 14px;
font-weight: bold;
line-height: 2.43;
}

.conservation .tableBox01 table .ttl {
font-size: 16px;
line-height: 1.5;
}

.conservation .tableBox07 table .ttl {
padding: 6px 0;
line-height: 1.5;
}

.conservation .tableBox01 table tr:first-child .ttl ,
.conservation .tableBox01 table tr:nth-child(2) .ttl ,
.conservation .tableBox02 table tr:first-child .ttl ,
.conservation .tableBox02 table tr:first-child .txt {
text-align: center;
}

.conservation .tableBox02 table th:first-child .ttl {
/*writing-mode: vertical-rl;*/
text-orientation: upright;
line-height: 2;
}

.conservation .tableBox03 table th:first-child .ttl {
font-size: 14px;
line-height: 1.58;
}

.conservation .tableBox04 table tr:first-child .ttl ,
.conservation .tableBox04 table tr:nth-child(2) .ttl {
font-size: 14px;
line-height: 1.58;
}

.conservation .tableBox05 table .ttl {
font-size: 16px;
line-height: 1.375;
}

.conservation .tableBox07 table tr:nth-child(6) th:first-child {
vertical-align: middle;
}

.conservation .tableBox07 table tr:nth-child(6) th:first-child .ttl {
margin: 0 auto;
/*writing-mode: vertical-rl;*/
text-orientation: upright;
line-height: 2;
}

.conservation table .txt {
font-size: 14px;
line-height: 2.43;
}

.conservation .tableBox01 table .txt {
font-size: 16px;
line-height: 1.375;
}

.conservation .tableBox01 table th .txt {
font-size: 14px;
line-height: 1.29;
}

.conservation .tableBox01 table .txt02 {
position: relative;
padding: 0 0 0 38px;
font-size: 16px;
line-height: 1.375;
}

.conservation .tableBox01 table .txt02 span {
position: absolute;
top: 3px;
left: 0;
width: 38px;
}

.conservation .tableBox05 table .txt {
font-size: 20px;
font-weight: bold;
line-height: 1.1;
}

.conservation .noteList {
margin: 20px 0 50px;
text-align: left;
}

.conservation .noteList li {
font-size: 14px;
line-height: 1.58;
}

.conservation .noteList02 {
max-width: 680px;
margin: 20px auto 32px;
text-align: left;
}

.conservation .noteList02 li {
position: relative;
padding: 0 0 0 42px;
font-size: 14px;
line-height: 1.58;
}

.conservation .noteList02 li span {
position: absolute;
top: 0;
left: 0;
}

.conservation .note {
margin: 0 0 5px;
font-size: 14px;
text-align: right;
}

.conservation .img02 {
margin: 0 0 60px;
}

.conservation h4 {
margin: 25px 0 5px;
font-size: 18px;
font-weight: bold;
line-height: 1.89;
text-align: left;
}

.conservation .txtList {
padding: 0 0 36px;
}

.conservation .txtList li {
position: relative;
margin: 0 0 24px;
padding: 0 0 0 22px;
font-size: 14px;
line-height: 1.72;
text-align: left;
}

.conservation .txtList li span {
position: absolute;
top: 0;
left: 0;
color: #144996;
}













@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;
}

.conservation {
width: 86.666%;
margin: 0 auto;
padding: 11% 0 3%;
text-align: center;
box-sizing: border-box;
}

.conservation h2 {
margin: 0 0 8%;
padding: 0 0 2%;
color: #333;
font-size: 20px;
font-weight: bold;
background: url("/ja/assets/img/bg_h2_01.png") no-repeat center bottom;
background-size: 100px auto;
}

.conservation h3 {
margin: 0 0 7%;
padding: 7px 10px;
color: #fff;
font-size: 15px;
font-weight: bold;
text-align: left;
background: url("/ja/assets/img/bg_h3_01_sp.png") no-repeat center;
background-size: cover;
}

.conservation .lead {
margin: 0 0 7.5%;
font-size: 12px;
line-height: 1.59;
text-align: left;
}

.conservation .lead02 {
font-size: 12px;
line-height: 1.58;
text-align: left;
}

.conservation .lead03 {
margin: 0 0 15%;
font-size: 12px;
line-height: 1.59;
text-align: left;
}

.conservation > .ttl {
margin: 0 0 4%;
font-size: 14px;
font-weight: bold;
line-height: 1.5;
text-align: center;
}

.conservation .tableBox01 ,
.conservation .tableBox02 ,
.conservation .tableBox03 ,
.conservation .tableBox04 ,
.conservation .tableBox05 ,
.conservation .tableBox06 ,
.conservation .tableBox07 {
position: relative;
width: 107.69%;
border-top: none;
border-bottom: 2px solid #ccc;
overflow-x: scroll;
}

.conservation .tableBox02 {
margin: 0 0 14%;
}
.conservation .tableBox03 ,
.conservation .tableBox04 ,
.conservation .tableBox05 {
margin: 0 0 20%;
}

.conservation .tableBox06 ,
.conservation .tableBox07 {
margin: 0 0 6%;
}

.conservation .tableBox01:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 145px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}

.conservation .tableBox02:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 172px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}
.conservation .tableBox03:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 149px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}

.conservation .tableBox04:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 95px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}

.conservation .tableBox06:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 85px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}

.conservation .tableBox07:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 180px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 180px auto;
}

.conservation table {
position: relative;
width: 600px;
table-layout: fixed;
border-top: 2px solid #ccc;
border-collapse: collapse;
}

.conservation .tableBox02 table ,
.conservation .tableBox03 table {
width: 670px;
}

.conservation .tableBox04 table {
width: 510px;
}

.conservation .tableBox05 table {
width: 460px;
}

.conservation .tableBox07 table colgroup {
display: table-column-group;
}

.conservation table th {
background: #eef2f8;
border-bottom: 1px solid #ccc;
box-sizing: border-box;
}

.conservation .tableBox01 table th {
width: 145px;
padding: 8px 10px;
}

.conservation .tableBox02 table th {
padding: 10px 8px;
border-right: 1px solid #fff;
}

.conservation .tableBox02 table th:first-child {
width: 38px;
padding: 10px 4px;
}

.conservation .tableBox02 table th:nth-child(2) {
width: 69px;
}
.conservation .tableBox02 table th:nth-child(3) {
width: 65px;
}

.conservation .tableBox03 table th:first-child {
width: 149px;
padding: 8px 10px;
border-right: 1px solid #fff;
}

.conservation .tableBox04 table th:first-child {
width: 95px;
padding: 8px 10px 2px;
text-align: center;
border-right: 1px solid #fff;
}

.conservation .tableBox05 table th {
position: relative;
width: 115px;
padding: 8px 12px;
text-align: left;
border-right: 1px solid #fff;
}

.conservation .tableBox05 table th:after {
content: '';
position: absolute;
top: -2px;
left: 0;
width: 115px;
height: 2px;
background: url("/ja/assets/img/bg_line_01.png") no-repeat center;
background-size: 170px auto;
}

.conservation .tableBox06 table th:first-child {
width: 85px;
padding: 8px 10px;
border-right: 1px solid #fff;
}

.conservation .tableBox07 table th {
width: 180px;
padding: 8px 10px;
}

.conservation .tableBox07 table tr:nth-child(6) th:first-child {
width: 50px;
}

.conservation table td {
border-bottom: 1px solid #ccc;
box-sizing: border-box;
}

.conservation .tableBox01 table td {
padding: 8px 5px 8px 10px;
}

.conservation .tableBox02 table td {
padding: 10px 5px;
text-align: right;
}

.conservation .tableBox02 table tr:first-child td {
background: #f0f0f0;
}

.conservation .tableBox03 table td {
padding: 8px 5px;
text-align: right;
}

.conservation .tableBox03 table tr:first-child td {
vertical-align: middle;
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox04 table td {
padding: 5px 6px;
text-align: right;
}

.conservation .tableBox04 table tr:first-child td:last-child {
border-bottom: none;
}

.conservation .tableBox04 table tr:first-child td ,
.conservation .tableBox04 table tr:nth-child(2) td {
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox04 table tr:nth-child(2) td {
padding: 3px 6px;
}

.conservation .tableBox05 table td {
padding: 8px 5px;
text-align: center;
vertical-align: middle;
border-right: 1px solid #fff;
}

.conservation .tableBox06 table td {
padding: 8px 10px;
vertical-align: middle;
}

.conservation .tableBox06 table tr:first-child td ,
.conservation .tableBox06 table tr:nth-child(2) td {
padding: 8px 0;
text-align: center;
background: #f0f0f0;
}

.conservation .tableBox06 table td:nth-child(2) ,
.conservation .tableBox06 table td:nth-child(4) {
padding: 5px 18px;
text-align: right;
}

.conservation .tableBox06 table td:nth-child(5) ,
.conservation .tableBox06 table td:nth-child(6) {
text-align: center;
}

.conservation table tr:last-child th ,
.conservation table tr:last-child td {
border-bottom: none;
}

.conservation table .ttl {
font-size: 12px;
font-weight: bold;
line-height: 1.42;
}

.conservation .tableBox01 table .ttl {
font-size: 13px;
line-height: 1.5;
}

.conservation .tableBox01 table tr:first-child .ttl ,
.conservation .tableBox01 table tr:nth-child(2) .ttl ,
.conservation .tableBox02 table tr:first-child .ttl ,
.conservation .tableBox02 table tr:first-child .txt {
text-align: center;
}

.conservation .tableBox02 table th:first-child .ttl {
writing-mode: vertical-rl;
text-orientation: upright;
line-height: 2;
}

.conservation .tableBox03 table th:first-child .ttl {
font-size: 12px;
line-height: 1.58;
}

.conservation .tableBox04 table tr:first-child .ttl ,
.conservation .tableBox04 table tr:nth-child(2) .ttl {
font-size: 12px;
line-height: 1.58;
}

.conservation .tableBox05 table .ttl {
font-size: 13px;
line-height: 1.375;
}

.conservation table .txt {
font-size: 12px;
line-height: 1.42;
}

.conservation .tableBox01 table .txt {
font-size: 13px;
line-height: 1.375;
}

.conservation .tableBox01 table th .txt {
font-size: 12px;
line-height: 1.29;
}

.conservation .tableBox01 table .txt02 {
position: relative;
padding: 0 0 0 24px;
font-size: 13px;
line-height: 1.375;
}

.conservation .tableBox01 table .txt02 span {
position: absolute;
top: 2px;
left: 0;
width: 15px;
}

.conservation .tableBox05 table .txt {
font-size: 20px;
font-weight: bold;
line-height: 1.1;
}

.conservation .noteList {
margin: 12% 0 11%;
text-align: left;
}

.conservation .noteList li {
font-size: 13px;
line-height: 1.47;
}

.conservation .noteList02 {
max-width: inherit;
margin: -8% auto 8%;
text-align: left;
}

.conservation .noteList02 li {
position: relative;
padding: 0 0 0 34px;
font-size: 12px;
line-height: 1.58;
}

.conservation .noteList02 li span {
position: absolute;
top: 0;
left: 0;
}

.conservation .note {
margin: 0 0 2%;
font-size: 12px;
text-align: right;
}

.conservation .img ,
.conservation .img02 {
margin: 0 -7%;
}

.conservation h4 {
margin: 8% 0 2%;
font-size: 14px;
font-weight: bold;
line-height: 1.89;
text-align: left;
}

.conservation .txtList li {
position: relative;
margin: 0 0 8%;
padding: 0 0 0 15px;
font-size: 12px;
line-height: 1.58;
text-align: left;
}

.conservation .txtList li span {
position: absolute;
top: 0;
left: 0;
color: #144996;
}

.conservation .wide {
display: block;
width: 6.46%;
margin: 0 -6% 12% auto;
}

}
