@charset "utf-8";
/* 2023-06 エネファームメーカー販売台数グラフ用 */
/* IE11対応のCSS */
  
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, #chartContainer { background-image: url(img/works_0090/works_0090_2306.png); background-color:white; background-repeat:no-repeat;height:0; padding-top:562px;}
  *::-ms-backdrop, #chartContainer > div{ display:none; }
}

.flexBox {
	display:flex;
	justify-content: space-between
}
.eneTitle {
	border:2px solid #868686;
	border-radius:5px;
	margin: auto;
	display:inline-block;
	padding:0 10px;
	font-size:16px;
}
/*年月*/
.eneTitle > .date:before {
	content:"2023年11月"
}
.main .inner {
	padding-left:5px;
	padding-right:5px;
	text-align:center;
}
.bArea.bg_yellow {
	width:calc(100% - 20px);
	margin:0 auto
}
/*凡例*/
#regend {
	background-color:white;
	position:absolute;
	top:40px;
	left:75px;
	display:inline-block;
	padding:5px 10px;
	border:1px solid #999;
	text-align: justify;
	text-align-last:justify;
}
#regend p {
	position:relative;
	padding-left:1em;
}
#regend p:before {
	position:absolute;
	content:"■";
	left:0;
}
#regend p:nth-child(1):before {
	color:#19b4f1;
}
#regend p:nth-child(2):before {
	color:#fe8f0a;
}
#regend p:nth-child(3):before {
	color:#ff1973;
}
#regend p:nth-child(4):before {
	color:#33ffad;
}
#regend p:nth-child(5):before {
	content:"◆";
	color:#3c00ff;
}
/*ラベル*/
#labelY {
	width:100%;
	align-items:flex-end;
	justify-content: space-between;
	font-size:11px;
}
#labelX {
	position: absolute;
	bottom:0;
	right:20px;
	font-size:11px;
}
#dataBox {
	position:absolute;
	top:11px;
	bottom:29px;
	left:51px;
	width: calc( 100% - 15.6%);
	display:flex;
}
#dataBox > .ybox {
	position:relative;
	font-size:10px;
	text-align:center;
	width:calc(100% / 15);
}
/*データ値*/
#dataBox > .ybox p {
	position:absolute;
	display:inline-block;
	left:50%;
	transform:translateX(-50%);
	text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; /* 白いアウトライン */
}
:root {
  /*Y軸最大値*/
  --maxY1: 55000;
  --maxY2: 550000;
  /*折れ線グラフ*/
  --g109: 4997;
  --g110: 11466;
  --g111: 24926;
  --g112: 49443;
  --g113: 82974;
  --g114: 120992;
  --g115: 161439;
  --g116: 208509;
  --g117: 257339;
  --g118: 303929;
  --g119: 344917;
  --g120: 392926;
  --g121: 433182;
  --g122: 480373;
  --g123: 500000;
/*棒グラフ-合計*/
  --g209: 4997;
  --g210: 6469;
  --g211: 13460;
  --g212: 24517;
  --g213: 33531;
  --g214: 38018;
  --g215: 40447;
  --g216: 47070;
  --g217: 48830;
  --g218: 46590;
  --g219: 40988;
  --g220: 48009;
  --g221: 40256;
  --g222: 47191;
  --g223: 19627;
/*棒グラフ-ＬＰガス*/
  --g311: 1789;
  --g312: 3958;
  --g313: 5734;
  --g314: 4740;
  --g315: 3979;
  --g316: 3234;
  --g317: 3215;
  --g318: 3112;
  --g319: 3277;
  --g320: 3627;
  --g321: 2996;
  --g322: 3395;
  --g323: 1806;
/*棒グラフ-都市ガス*/
  --g411: 11670;
  --g412: 20559;
  --g413: 27797;
  --g414: 33278;
  --g415: 36468;
  --g416: 43836;
  --g417: 45615;
  --g418: 43478;
  --g419: 37711;
  --g420: 44382;
  --g421: 37260;
  --g422: 43796;
  --g423: 17821
;
}
/*折れ線グラフ*/
#dataBox > .ybox p:nth-child(1) { left:60%;	transform:translateX(0); color:#3c00ff;}
#dataBox > .ybox:nth-child(1) p:nth-child(1) { bottom: calc(((var(--g109) / var(--maxY2)) - 0.03) * 100%); } /*2009*/
#dataBox > .ybox:nth-child(2) p:nth-child(1) { bottom: calc(((var(--g110) / var(--maxY2)) - 0.03) * 100%); } /*2010*/
#dataBox > .ybox:nth-child(3) p:nth-child(1) { bottom: calc(((var(--g111) / var(--maxY2)) - 0.03) * 100%); } /*2011*/
#dataBox > .ybox:nth-child(4) p:nth-child(1) { bottom: calc(((var(--g112) / var(--maxY2)) - 0.03) * 100%); } /*2012*/
#dataBox > .ybox:nth-child(5) p:nth-child(1) { bottom: calc(((var(--g113) / var(--maxY2)) - 0.03) * 100%); } /*2013*/
#dataBox > .ybox:nth-child(6) p:nth-child(1) { bottom: calc(((var(--g114) / var(--maxY2)) - 0.03) * 100%); } /*2014*/
#dataBox > .ybox:nth-child(7) p:nth-child(1) { bottom: calc(((var(--g115) / var(--maxY2)) - 0.03) * 100%); } /*2015*/
#dataBox > .ybox:nth-child(8) p:nth-child(1) { bottom: calc(((var(--g116) / var(--maxY2)) - 0.03) * 100%); } /*2016*/
#dataBox > .ybox:nth-child(9) p:nth-child(1) { bottom: calc(((var(--g117) / var(--maxY2)) - 0.03) * 100%); } /*2017*/
#dataBox > .ybox:nth-child(10) p:nth-child(1) { bottom: calc(((var(--g118) / var(--maxY2)) - 0.03) * 100%); } /*2018*/
#dataBox > .ybox:nth-child(11) p:nth-child(1) { bottom: calc(((var(--g119) / var(--maxY2)) - 0.03) * 100%); } /*2019*/
#dataBox > .ybox:nth-child(12) p:nth-child(1) { bottom: calc(((var(--g120) / var(--maxY2)) - 0.03 - 0.004 ) * 100%); } /*2020*/
#dataBox > .ybox:nth-child(13) p:nth-child(1) { bottom: calc((var(--g121) / var(--maxY2)) * 100%); } /*2021*/
#dataBox > .ybox:nth-child(14) p:nth-child(1) { bottom: calc((var(--g122) / var(--maxY2)) * 100%); } /*2022*/
#dataBox > .ybox:nth-child(15) p:nth-child(1) { bottom: calc((var(--g123) / var(--maxY2) + 0.005) * 100%); } /*2023*/
/*折れ線グラフ　調整*/
#dataBox > .ybox:nth-child(12) p:nth-child(1) { left:50%; transform:translateX(-50%)}/*2020*/
#dataBox > .ybox:nth-child(13) p:nth-child(1) { left:-64%}/*2021*/
#dataBox > .ybox:nth-child(14) p:nth-child(1) { left:-64%}/*2022*/
#dataBox > .ybox:nth-child(15) p:nth-child(1) { left:-56%}/*2023*/
/*棒グラフ-合計*/
#dataBox > .ybox:nth-child(1) p:nth-child(2) { bottom: calc(((var(--g209) / var(--maxY1)) - 0.003) * 100%); } /*2009*/
#dataBox > .ybox:nth-child(2) p:nth-child(2) { bottom: calc(((var(--g210) / var(--maxY1)) - 0.003) * 100%); } /*2010*/
#dataBox > .ybox:nth-child(3) p:nth-child(2) { bottom: calc(((var(--g211) / var(--maxY1)) - 0.003) * 100%); } /*2011*/
#dataBox > .ybox:nth-child(4) p:nth-child(2) { bottom: calc(((var(--g212) / var(--maxY1)) - 0.003) * 100%); } /*2012*/
#dataBox > .ybox:nth-child(5) p:nth-child(2) { bottom: calc(((var(--g213) / var(--maxY1)) - 0.003) * 100%); } /*2013*/
#dataBox > .ybox:nth-child(6) p:nth-child(2) { bottom: calc(((var(--g214) / var(--maxY1)) - 0.003) * 100%); } /*2014*/
#dataBox > .ybox:nth-child(7) p:nth-child(2) { bottom: calc(((var(--g215) / var(--maxY1)) - 0.003) * 100%); } /*2015*/
#dataBox > .ybox:nth-child(8) p:nth-child(2) { bottom: calc(((var(--g216) / var(--maxY1)) - 0.003) * 100%); } /*2016*/
#dataBox > .ybox:nth-child(9) p:nth-child(2) { bottom: calc(((var(--g217) / var(--maxY1)) - 0.003) * 100%); } /*2017*/
#dataBox > .ybox:nth-child(10) p:nth-child(2) { bottom: calc(((var(--g218) / var(--maxY1)) - 0.003) * 100%); } /*2018*/
#dataBox > .ybox:nth-child(11) p:nth-child(2) { bottom: calc(((var(--g219) / var(--maxY1)) - 0.003) * 100%); } /*2019*/
#dataBox > .ybox:nth-child(12) p:nth-child(2) { bottom: calc(((var(--g220) / var(--maxY1)) - 0.003) * 100%);} /*2020*/
#dataBox > .ybox:nth-child(13) p:nth-child(2) { bottom: calc(((var(--g221) / var(--maxY1)) - 0.003) * 100%);} /*2021*/
#dataBox > .ybox:nth-child(14) p:nth-child(2) { bottom: calc(((var(--g222) / var(--maxY1)) - 0.003 - 0.022 ) * 100%);} /*2022*/
#dataBox > .ybox:nth-child(15) p:nth-child(2) { bottom: calc(((var(--g223) / var(--maxY1)) - 0.003) * 100%);} /*2023*/
/*棒グラフ-ＬＰガス*/
#dataBox > .ybox:nth-child(3) p:nth-child(3)  { bottom: calc(((((var(--g311) / 2 ) + var(--g411)) / var(--maxY1)) - 0.015) * 100%); } /* 2011 */
#dataBox > .ybox:nth-child(3) p:nth-child(3)  { bottom: calc(((((var(--g311) / 2 ) + var(--g411)) / var(--maxY1)) - 0.015) * 100%); } /* 2011 */
#dataBox > .ybox:nth-child(4) p:nth-child(3)  { bottom: calc(((((var(--g312) / 2 ) + var(--g412)) / var(--maxY1)) - 0.015) * 100%); } /* 2012 */
#dataBox > .ybox:nth-child(5) p:nth-child(3)  { bottom: calc(((((var(--g313) / 2 ) + var(--g413)) / var(--maxY1)) - 0.015) * 100%); } /* 2013 */
#dataBox > .ybox:nth-child(6) p:nth-child(3)  { bottom: calc(((((var(--g314) / 2 ) + var(--g414)) / var(--maxY1)) - 0.015) * 100%); } /* 2014 */
#dataBox > .ybox:nth-child(7) p:nth-child(3)  { bottom: calc(((((var(--g315) / 2 ) + var(--g415)) / var(--maxY1)) - 0.015) * 100%); } /* 2015 */
#dataBox > .ybox:nth-child(8) p:nth-child(3)  { bottom: calc(((((var(--g316) / 2 ) + var(--g416)) / var(--maxY1)) - 0.015) * 100%); } /* 2016 */
#dataBox > .ybox:nth-child(9) p:nth-child(3)  { bottom: calc(((((var(--g317) / 2 ) + var(--g417)) / var(--maxY1)) - 0.015) * 100%); } /* 2017 */
#dataBox > .ybox:nth-child(10) p:nth-child(3) { bottom: calc(((((var(--g318) / 2 ) + var(--g418)) / var(--maxY1)) - 0.015) * 100%); } /* 2018 */
#dataBox > .ybox:nth-child(11) p:nth-child(3) { bottom: calc(((((var(--g319) / 2 ) + var(--g419)) / var(--maxY1)) - 0.015) * 100%); } /* 2019 */
#dataBox > .ybox:nth-child(12) p:nth-child(3) { bottom: calc(((((var(--g320) / 2 ) + var(--g420)) / var(--maxY1)) - 0.015) * 100%); } /* 2020 */
#dataBox > .ybox:nth-child(13) p:nth-child(3) { bottom: calc(((((var(--g321) / 2 ) + var(--g421)) / var(--maxY1)) - 0.015) * 100%); } /* 2021 */
#dataBox > .ybox:nth-child(14) p:nth-child(3) { bottom: calc(((((var(--g322) / 2 ) + var(--g422)) / var(--maxY1)) - 0.015) * 100%); } /* 2022 */
#dataBox > .ybox:nth-child(15) p:nth-child(3) { bottom: calc(((((var(--g323) / 2 ) + var(--g423)) / var(--maxY1)) - 0.016) * 100%); } /* 2023 */
/*棒グラフ-都市ガス*/
#dataBox > .ybox:nth-child(3) p:nth-child(4)  { bottom: calc(((var(--g411) / var(--maxY1)) - 0.042) * 100%); }/*2011*/
#dataBox > .ybox:nth-child(4) p:nth-child(4)  { bottom: calc(((var(--g412) / var(--maxY1)) - 0.042) * 100%); }/*2012*/
#dataBox > .ybox:nth-child(5) p:nth-child(4)  { bottom: calc(((var(--g413) / var(--maxY1)) - 0.042) * 100%); }/*2013*/
#dataBox > .ybox:nth-child(6) p:nth-child(4)  { bottom: calc(((var(--g414) / var(--maxY1)) - 0.042) * 100%); }/*2014*/
#dataBox > .ybox:nth-child(7) p:nth-child(4)  { bottom: calc(((var(--g415) / var(--maxY1)) - 0.042) * 100%); }/*2015*/
#dataBox > .ybox:nth-child(8) p:nth-child(4)  { bottom: calc(((var(--g416) / var(--maxY1)) - 0.042) * 100%); }/*2016*/
#dataBox > .ybox:nth-child(9) p:nth-child(4)  { bottom: calc(((var(--g417) / var(--maxY1)) - 0.042) * 100%); }/*2017*/
#dataBox > .ybox:nth-child(10) p:nth-child(4) { bottom: calc(((var(--g418) / var(--maxY1)) - 0.042) * 100%); }/*2018*/
#dataBox > .ybox:nth-child(11) p:nth-child(4) { bottom: calc(((var(--g419) / var(--maxY1)) - 0.042) * 100%); }/*2019*/
#dataBox > .ybox:nth-child(12) p:nth-child(4) { bottom: calc(((var(--g420) / var(--maxY1)) - 0.042) * 100%); }/*2020*/
#dataBox > .ybox:nth-child(13) p:nth-child(4) { bottom: calc(((var(--g421) / var(--maxY1)) - 0.042) * 100%); }/*2021*/
#dataBox > .ybox:nth-child(14) p:nth-child(4) { bottom: calc(((var(--g422) / var(--maxY1)) - 0.042) * 100%); }/*2022*/
#dataBox > .ybox:nth-child(15) p:nth-child(4) { bottom: calc(((var(--g423) / var(--maxY1)) - 0.042) * 100%); }/*2023*/
