@charset "utf-8";
/* =====================================
	共通
===================================== */
.textblue {
color:#008ffe;
}
/* =====================================
	気温ページ
===================================== */
.contentsDATA {
margin:0 auto;
width:930px;
background:url(../img/bg2.png) repeat-y;
height:550px;
padding:5px;
}
.textblue {
color:#008ffe;
}
.CitySelectJapan {
font-size: 18px;
padding: 2px 5px 5px 0px;
position: relative;
z-index: 100;
width: 160px;
}

.CitySelectWorld {
font-size: 18px;
padding: 2px 5px 5px 0px;
width: 310px;
}

#japan_data{
position:absolute;
top:140px;
left:30px;
color:#333333;
font-size:18px;
height:100px;
}

#world_data{
position:absolute;
top:360px;
left:30px;
color:#333333;
font-size:18px;
height:100px;
}

#japan_temperatures, #world_temperatures {
	
}

#japan_temperatures table,
#world_temperatures table {
border-collapse: collapse;
border: 2px solid #666;
width: 100%;
}


#japan_temperatures th, #japan_temperatures td,
#world_temperatures th, #world_temperatures td {
width: 48px;
background-color: #FFF;
border-collapse: collapse;
border: 1px solid #666;
padding: 10px 5px;
font-weight: normal;
text-align: left;
line-height: 1.2;
}

#japan_temperatures th:first-child, 
#japan_temperatures td:first-child,
#world_temperatures th:first-child, 
#world_temperatures td:first-child {
width: 140px;
background-color: #fffff4;
}

#world_temperatures th:first-child, 
#world_temperatures td:first-child {
font-size: 16px;
}

#japan_temperatures td:first-child, 
#world_temperatures td:first-child {
position: relative;
padding-right: 18px;
height: 100%;
}

#japan_temperatures td:first-child:after, #world_temperatures td:first-child:after {
content:'▼';
width: 15px;
height: 15px;
background-color: #fff;
text-align: center;
vertical-align: middle;
padding: 5px;
position: absolute;
top: 50%;
right: -8%;
transform: translate(-50%, -50%);
font-size: 16px;
border: 1px solid #ddd;
}

.japan_city,
.world_city {
cursor: pointer;
}
.area, .warea {
display: none;
}
.datahide {
  /* 表示の切り替えに使用する */
  display: none;
}
/*吹き出し*/
.balloon,
.wballoon {
position: relative;
display: inline-block;
background-color: #fff;
border: solid 2px #666;
padding: 10px;
min-width: 200px;
max-width: 100%;
text-align: center;
border-radius: 10px;
margin-top: 12px;
}
.balloon:before,
.balloon:after,
.wballoon:before,
.wballoon:after {
content: "";
position: absolute;
bottom: 100%;
left: 20%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.balloon:before,
.wballoon:before {
border: solid 12px transparent;
border-bottom: solid 12px #666;
}
.balloon:after,
.wballoon:after {
border: solid 14px transparent;
border-bottom: solid 14px #fff;
margin-bottom: -5px;
}
.balloon p,
.wballoon p {
margin: 0;
padding: 0;
}

#source {
position: absolute;
bottom: 20px;
right: 30px;
height: 30px;
color:#333333;
font-size:14px;
}


/* =====================================
	人口ページ
===================================== */
.contents_AreaDATA {
margin:0 auto;
width:930px;
background:url(../img/bg2.png) repeat-y;
height:1130px;
padding:5px;
}

#population{
position:absolute;
top:140px;
left:30px;
color:#333333;
font-size:18px;
height:100px;
width: 93%;
}

.area_l {
float: left;
width: 48%;
}
.area_r {
float: right;
width: 48%;
}

.area_r table,
.area_l table {
border-collapse: collapse;
border: 1px solid #666;
width: 100%;
}

.area_r table th,
.area_l table th {
width: 35%;
background-color: #fffff4;
border-collapse: collapse;
border: 1px solid #666;
padding: 10px 5px;
font-weight: normal;
text-align: center;
}

.area_r table td,
.area_l table td {
width: 35%;
background-color: #FFF;
border-collapse: collapse;
border: 1px solid #666;
padding: 10px 5px;
font-weight: normal;
text-align: right;
}

.area_r table th:first-child,
.area_l table th:first-child {
width: 30%;
}

.area_r table td:first-child,
.area_l table td:first-child {
text-align: left;
width: 30%;
}

.area_r table th:nth-child(-n+2),
.area_l table th:nth-child(-n+2){
	padding-top: 15px;
}

span.m2 {
vertical-align: 9px;
font-size: 70%;
padding-right:2px;
}