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



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

#data { position: relative; margin: 120px auto; }
#data .section_wrap { margin: 0 auto; position: relative; }

#data .data_wrap_box {
width: 80%;
margin: auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#data .data_wrap_box::after { content: ''; display: block; width: 30%; }
#data .data_wrap_box .data_box { width: 30%; margin-bottom: 80px; }
#data .data_wrap_box .data_box h3 { font-size: 1.4em; background: linear-gradient(90deg, #00488a, #087fba); color: #fff; padding: 10px; }

#data .data_wrap_box .data_box .txtbox { text-align: center; margin-top: 30px; }
#data .data_wrap_box .data_box .txtbox h4 { font-size: 4rem; line-height: 1; }
#data .data_wrap_box .data_box .txtbox h4 span {
font-size: 2.6em;
margin-right: 10px;
background-image: radial-gradient(rgba(8,127,186, 1), rgba(0,0,0, 1) 80%);
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
#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 { position: relative; margin: 80px auto; }
#data .section_wrap { margin: 0 auto; position: relative; }

#data .data_wrap_box { width: 90%; margin: auto; }
#data .data_wrap_box .data_box { margin-bottom: 50px; }
#data .data_wrap_box .data_box h3 { font-size: 1em; background: linear-gradient(90deg, #00488a, #087fba); color: #fff; padding: 10px; }

#data .data_wrap_box .data_box .txtbox { text-align: center; margin-top: 30px; }
#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: 2.6em;
margin-right: 10px;
background-image: radial-gradient(rgba(8,127,186, 1), rgba(0,0,0, 1) 80%);
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
#data .data_wrap_box .data_box .imgbox { width: 80%; margin: 30px auto 0; }


#data .pie-chart ol { margin-top: 15px; display: flex; flex-wrap: wrap; }
#data .pie-chart li { display: flex; align-items: center; font-size: 1.4em; 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; }



}