@charset "UTF-8";
/* CSS Document */



/*PC*/
@media print, screen and (min-width: 769px) {

#data { margin: 0 auto 120px; }

#data h3 {
font-size: 3rem;
margin-bottom: 40px;
background: linear-gradient(123deg, #2C2826 0%, #0050a6 60%);
background-size: 200% 200%;
background-position: 0 0;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
#data h3 span {
display: table;
font-size: 1.6rem;
font-weight: 500;
background: linear-gradient(123deg, #2C2826 0%, #0050a6 45%);
background-size: 200% 200%;
background-position: 0 0;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


#data .data_wrap_box {
width: 90%;
margin: auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
border-top: 1px solid #ccc;
}
#data .data_wrap_box .data_box {
width: calc((100% - 2px) / 3);
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding: 40px;
box-sizing: border-box;
}
#data .data_wrap_box .data_box:nth-child(3n) { border-right: 1px solid #ccc; }

#data .data_wrap_box .data_box .txtbox { text-align: center; }
#data .data_wrap_box .data_box .txtbox h4 { font-size: 3rem; line-height: 1; }
#data .data_wrap_box .data_box .txtbox h4 span { font-size: 6rem; margin-right: 10px; }
#data .data_wrap_box .data_box .imgbox { margin-top: 30px; }


#data .pie-chart ol { margin-top: 15px; display: flex; flex-wrap: wrap; }
#data .pie-chart li { display: flex; align-items: center; font-size: 1.6em; margin: 0 5px; }
#data .pie-chart li::before {
content: '';
display: inline-block;
width: 28px;
height: 12px;
margin-right: 5px;
}
#data .pie-chart li span { margin-right: 10px; font-weight: 600; font-size: 0.7em; }


#data .pie-chart01 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart01 li:nth-child(2)::before { background-color: #087fba; }


#data .pie-chart02 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart02 li:nth-child(2)::before { background-color: #087fba; }
#data .pie-chart02 li:nth-child(3)::before { background-color: #005f9e; }
#data .pie-chart02 li:nth-child(4)::before { background-color: #478193; }
#data .pie-chart02 li:nth-child(5)::before { background-color: #6ba0d2; }


#data .pie-chart03 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart03 li:nth-child(2)::before { background-color: #087fba; }
#data .pie-chart03 li:nth-child(3)::before { background-color: #005f9e; }
#data .pie-chart03 li:nth-child(4)::before { background-color: #478193; }
#data .pie-chart03 li:nth-child(5)::before { background-color: #6ba0d2; }
#data .pie-chart03 li:nth-child(6)::before { background-color: #6f7ce1; }
#data .pie-chart03 li:nth-child(7)::before { background-color: #2ebdcc; }



}






/*sp*/
@media only screen and (max-width: 768px) {

#data { width: 90%; margin:0 auto 60px; }

#data h3 {
font-size: 2.2rem;
margin-bottom: 20px;
background: linear-gradient(123deg, #2C2826 0%, #0050a6 60%);
background-size: 200% 200%;
background-position: 0 0;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}


#data .data_wrap_box { border-top: 1px solid #ccc; }
#data .data_wrap_box .data_box {
border: 1px solid #ccc;
border-top: none;
padding: 20px;
box-sizing: border-box;
}

#data .data_wrap_box .data_box .txtbox { text-align: center; }
#data .data_wrap_box .data_box .txtbox h4 { font-size: 2.6rem; line-height: 1; }
#data .data_wrap_box .data_box .txtbox h4 span { font-size: 4rem; margin-right: 10px; }
#data .data_wrap_box .data_box .imgbox { margin-top: 30px; }


#data .pie-chart ol { margin-top: 15px; display: flex; flex-wrap: wrap; }
#data .pie-chart li { display: flex; align-items: center; font-size: 1.6em; margin: 0 5px; }
#data .pie-chart li::before {
content: '';
display: inline-block;
width: 28px;
height: 12px;
margin-right: 5px;
}
#data .pie-chart li span { margin-right: 10px; font-weight: 600; font-size: 0.7em; }


#data .pie-chart01 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart01 li:nth-child(2)::before { background-color: #087fba; }


#data .pie-chart02 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart02 li:nth-child(2)::before { background-color: #087fba; }
#data .pie-chart02 li:nth-child(3)::before { background-color: #005f9e; }
#data .pie-chart02 li:nth-child(4)::before { background-color: #478193; }
#data .pie-chart02 li:nth-child(5)::before { background-color: #6ba0d2; }


#data .pie-chart03 li:nth-child(1)::before { background-color: #00488a; }
#data .pie-chart03 li:nth-child(2)::before { background-color: #087fba; }
#data .pie-chart03 li:nth-child(3)::before { background-color: #005f9e; }
#data .pie-chart03 li:nth-child(4)::before { background-color: #478193; }
#data .pie-chart03 li:nth-child(5)::before { background-color: #6ba0d2; }
#data .pie-chart03 li:nth-child(6)::before { background-color: #6f7ce1; }
#data .pie-chart03 li:nth-child(7)::before { background-color: #2ebdcc; }



}