@charset "utf-8";
/* CSS Document */
@media screen and (max-width: 640px) {

/*============================
#topPanelArea
============================*/
#topPanelArea {}
#topPanelArea h1 {}
#topPanelArea .en {}

/*============================
#dataArea
============================*/
#dataArea {}
#dataArea .topCopy {  padding-bottom: 30px; font-size: 1em; line-height: 1.75; }
#dataArea .container { padding: 20px 0 0 0; }
#dataArea .container .title { font-size: 1.125em; }
#dataArea .container .data {}
#dataArea .container .note {}
#dataArea .wrapper { flex-direction: column; }
#dataArea .container.manWomen { margin-top: 20px; height: 500px; }
#dataArea .container.manWomen .title { position: relative; z-index: 1; }
#dataArea .container.manWomen .data .graph-wrap { top: 0; width: 350px; height: 350px; }
#dataArea .container.manWomen .data .graph-wrap svg { width: 350px; height: 350px; }
#dataArea .container.manWomen .data .graph-wrap .circle {}
#dataArea .container.manWomen .data .graph-wrap .circle circle {}
#dataArea .container.manWomen .data .graph-wrap .circle circle:nth-child(1) {}
#dataArea .container.manWomen .data .graph-wrap .circle circle:nth-child(2) {}
#dataArea .container.manWomen .data .man { top: inherit; left: 55px; transform: inherit; bottom: 130px; }
#dataArea .container.manWomen .data .man:before { left: -40px; width: 30px; height: 68px; }
#dataArea .container.manWomen .data .man .sub { font-size: 1em; }
#dataArea .container.manWomen .data .man .main { font-size: 1.5em; }
#dataArea .container.manWomen .data .man .main span {}
#dataArea .container.manWomen .data .women { top: inherit; right: 55px; transform: inherit; bottom: 130px; }
#dataArea .container.manWomen .data .women:before { right: -40px; width: 30px; height: 68px; }
#dataArea .container.manWomen .data .women .sub { font-size: 1em; }
#dataArea .container.manWomen .data .women .main { font-size: 1.5em; }
#dataArea .container.manWomen .data .women .main span {}
#dataArea .container.manWomen .note { letter-spacing: 0.05em; }
#dataArea .container.manWomen .note:before { right: -20px; bottom: -15px; }
#dataArea .wrapper .container.overwork { width: 100%; height: 350px; }
#dataArea .wrapper .container.overwork:before { right: 20px; top: 50px; width: 100px; height: 100px; }
#dataArea .wrapper .container.overwork .title {}
#dataArea .wrapper .container.overwork .data {}
#dataArea .wrapper .container.overwork .data .main { font-size: 2em; white-space: nowrap; }
#dataArea .wrapper .container.overwork .data .main span { color: #1771bf; font-size: 3.25em; font-weight: 800; }
#dataArea .wrapper .container.overwork .data .sub { margin-top: 15px; color: #1771bf; font-size: 1.125em; font-weight: 600; }
#dataArea .wrapper .container.overwork .note { letter-spacing: 0.05em; }
#dataArea .wrapper .container.overwork .note:before { left: -20px; width: 130px; height: 144px; }
#dataArea .wrapper .container.holiday { width: 100%; height: 400px; }
#dataArea .wrapper .container.holiday:before { left: 15px; bottom: 90px; width: 90px; height: 108px; }
#dataArea .wrapper .container.holiday:after { right: 15px; top: 45px; width: 110px; height: 106px; }
#dataArea .wrapper .container.holiday .title {}
#dataArea .wrapper .container.holiday .data { top: 40%; font-size: 2em; white-space: nowrap; }
#dataArea .wrapper .container.holiday .data span { color: #1771bf; font-size: 3.25em; font-weight: 800; }
#dataArea .wrapper .container.holiday .note { letter-spacing: 0.05em; }
#dataArea .wrapper .container.holiday .note:before { right: -10px; }
#dataArea .container.native { height: 390px; }
#dataArea .container.native .title {}
#dataArea .container.native .data {}
#dataArea .container.native .data .image { margin: 100px auto; width: 70%; height: auto; }
#dataArea .container.native .data .image img {}
#dataArea .container.native .data .bubble.kyoto { top: 45px; left: 10px; width: 130px; height: 130px; }
#dataArea .container.native .data .bubble.kyoto:before { right: 0; bottom: 0; transform: rotate(45deg); }
#dataArea .container.native .data .bubble.kyoto:after { width: 130px; height: 130px; }
#dataArea .container.native .data .bubble.kyoto .sub { font-size: 0.875em; }
#dataArea .container.native .data .bubble.kyoto .main { font-size: 1.5em; }
#dataArea .container.native .data .bubble.kyoto .main span { font-size: 2.35em; }
#dataArea .container.native .data .bubble.kansai { right: 10px; bottom: 70px; width: 115px; height: 115px; }
#dataArea .container.native .data .bubble.kansai:before { left: -25px; top: 35px; transform: rotate(195deg); }
#dataArea .container.native .data .bubble.kansai:after { width: 115px; height: 115px; }
#dataArea .container.native .data .bubble.kansai .sub { font-size: 0.875em; }
#dataArea .container.native .data .bubble.kansai .main { font-size: 2em; }
#dataArea .container.native .data .bubble.kansai .main span { font-size: 1.75em; }
#dataArea .container.native .data .bubble.other { top: 60px; right: 20px; }
#dataArea .container.native .data .bubble.other:before { left: -20px; }
#dataArea .container.native .data .bubble.other:after { width: 100px; height: 100px; }
#dataArea .container.native .data .bubble.other .sub { font-size: 0.875em; }
#dataArea .container.native .data .bubble.other .main { font-size: 1.5em; }
#dataArea .container.native .data .bubble.other .main span { font-size: 1.75em; }
#dataArea .container.native .note { letter-spacing: 0.05em; }
#dataArea .container.native .note:before { right: inherit; left: -10px; }
#dataArea .wrapper .container.trip { width: 100%; height: 390px; }
#dataArea .wrapper .container.trip:before { left: 10px; bottom: 95px; width: 120px; height: 47px; }
#dataArea .wrapper .container.trip:after { right: 15px; top: 50px; width: 110px; height: 94px; }
#dataArea .wrapper .container.trip .title {}
#dataArea .wrapper .container.trip .data { font-size: 2em; }
#dataArea .wrapper .container.trip .data span {}
#dataArea .wrapper .container.trip .note {}
#dataArea .wrapper .container.trip .note:before {}
#dataArea .wrapper .container.childcare { width: 100%; height: 400px; }
#dataArea .wrapper .container.childcare:before { left: 0; width: 90px; height: 89px; }
#dataArea .wrapper .container.childcare .title {}
#dataArea .wrapper .container.childcare .data { top: 45% }
#dataArea .wrapper .container.childcare .data .graph-wrap { width: 350px; height: 350px; }
#dataArea .wrapper .container.childcare .data .graph-wrap svg { width: 350px; height: 350px; }
#dataArea .wrapper .container.childcare .data .graph-wrap .circle {}
#dataArea .wrapper .container.childcare .data .graph-wrap .circle circle {}
#dataArea .wrapper .container.childcare .data .graph-wrap .circle circle:nth-child(1) {}
#dataArea .wrapper .container.childcare .data .sub {}
#dataArea .wrapper .container.childcare .data .main { font-size: 2em; }
#dataArea .wrapper .container.childcare .data .main span {}
#dataArea .wrapper .container.childcare .note {}
#dataArea .wrapper .container.childcare .note:before { right: -10px; }


/*============================
#pankuzuArea
============================*/
.md_pankuzuArea.top {}
.md_pankuzuArea.top ul {}
.md_pankuzuArea.top ul li {}
.md_pankuzuArea ul li:first-child a {}
.md_pankuzuArea.top ul li a::after {}
.md_pankuzuArea.top ul li a span {}
}
