@charset "utf-8";

/* -------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
	SORATENA RANKING
	
	new released : July 2012
	update : 

	Copyright(c)WEATHER NEWS INC. ALL RIGHT RESERVED.
----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------------
  HEADER
------------------------------------------------------------------------------------- */
header#inner div#head-close{position: absolute; top: 5px; right: 5px; }
header#inner div#head-close a{display:block;width:57px;text-align:center;line-height:30px;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;color:#fff;
background:-webkit-gradient(linear,left top,left bottom,from(#5c70a7),color-stop(.5,#223f89),color-stop(.5,#062578),to(#07277a));
background:-webkit-linear-gradient(top,#5c70a7,#223f89 50%,#062578 50%,#07277a);
background:-moz-linear-gradient(top,#5c70a7,#223f89 50%,#062578 50%,#07277a);
background:-ms-linear-gradient(top,#5c70a7,#223f89 50%,#062578 50%,#07277a);
background:-o-linear-gradient(top,#5c70a7,#223f89 50%,#062578 50%,#07277a);
background:linear-gradient(top,#5c70a7,#223f89 50%,#062578 50%,#07277a);
box-shadow:inset 0 1px 3px rgba(0,0,0,.8);-webkit-box-shadow:inset 0 1px 3px rgba(0,0,0,.8);-moz-box-shadow:inset 0 1px 3px rgba(0,0,0,.8);
}
header#inner div#head-close a:after{position: absolute; bottom: 0; left: 0; content: ""; display: block; height: 10px; width: 57px;	-webkit-box-shadow: rgba(255, 255, 255, 1) 0 1px 1px; -moz-box-shadow: rgba(255, 255, 255, 1) 0 1px 1px; box-shadow: rgba(255, 255, 255, 1) 0 1px 1px;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
/* -------------------------------------------------------------------------------------
  NAV
------------------------------------------------------------------------------------- */
nav ul{padding:1px 11px 2px;border-top:solid 1px #fcf4e8;display:-webkit-box;display:-moz-box;display:box;list-style-type:none;
background:-webkit-gradient(linear,left top,left bottom,from(#f0e6c6),to(#dcc78c));
background:-webkit-linear-gradient(top,#f0e6c6,#dcc78c);
background:-moz-linear-gradient(top,#f0e6c6,#dcc78c);
background:-ms-linear-gradient(top,#f0e6c6,#dcc78c);
background:-o-linear-gradient(top,#f0e6c6,#dcc78c);
background:linear-gradient(top,#f0e6c6,#dcc78c);
}
nav ul li{margin-right:3px;}
nav ul li:last-child{margin-right:0;}
/* -------------------------------------------------------------------------------------
  COMMON
------------------------------------------------------------------------------------- */
div#main-container{background:#970303 !important;}
div#main-container>div{width:320px;margin:0 auto;}
/* -------------------------------------------------------------------------------------
  STAGE
------------------------------------------------------------------------------------- */
div.pres div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_pres.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #ff6600;color:#ff6600;text-align:center;}
div.co2 div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_co2.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #55ba3e;color:#55ba3e;text-align:center;}
div.rhum div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_humid.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #6289c6;color:#6289c6;text-align:center;}
div.lux div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_lux.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #ff9000;color:#ff9000;text-align:center;}
div.temp div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_temp.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #e93c6b;color:#e93c6b;text-align:center;}
div.uv div#stage{width:320px;height:130px;margin:0 auto;background:url(//weathernews.jp/s/soratena/img/ranking/back_rank_uv.gif)0 0 no-repeat;background-size:320px 130px;-webkit-background-size:320px 130px;-moz-background-size:320px 130px;-ms-background-size:320px 130px;-o-background-size:320px 130px;text-shadow:0 0 1px #9a46b6;color:#9a46b6;text-align:center;}

/*STAGE*/
div#stage .sign{width:223px;margin:0 auto;padding-top:10px;}
div#stage .sign p:first-child{line-height:20px;font-size:16px;}
div#stage .sign p:last-child{font-size:12px;text-shadow:none;}
div#stage .ani{width:85px;height:85px;position:relative;overflow:hidden;margin:0 auto;}
div#stage .ani img{width:85px;height:170px;position:absolute;top:0;left:0;}

/*RANKING*/
@keyframes right-to-left { from{left:100%;} to{left:0%;} }
@-webkit-keyframes right-to-left { from{left:100%;} to{left:0%;} }
ul.ranking{list-style:none;}
ul.ranking li{height:45px;background:#fbefe5;display:block;border-bottom:solid 1px #ebddd2;}
ul.ranking li a{height:100%;display:block;background:url(//weathernews.jp/s/soratena/img/arrow_red.png)98% center no-repeat;background-size:8px 13px;-webkit-background-size:8px 13px;-moz-background-size:8px 13px;-ms-background-size:8px 13px;-obackground-size:8px 13px;padding:0 20px 0 12px;}
ul.ranking li:last-child a{padding:0 20px 0 9px;}

ul.ranking li a p.place{font-size:14px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);padding:11px 0 5px;float:left;padding:0 7px;line-height:45px;margin-right:8px;}
ul.ranking li:last-child a p.place{margin-right:4px;}
/*ul.ranking li a div.lf{float:left;width:180px; position: relative; -webkit-animation-name:right-to-left; -webkit-animation-duration:1.0s; -webkit-animation-fill-mode:both;}
*/
ul.ranking li a div.lf{float:left;width:180px; position: relative; }
ul.ranking li a p.name{font-size:16px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);padding:8px 0 3px;}
ul.ranking li a p.location{font-size:13px;text-shadow:0 1px 1px rgba(255,255,255,.7);color:#7d7d7d;}
/*ul.ranking li a p.r-row1{float:right;font-size:17px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);line-height:40px;text-align:center; position: relative; -webkit-animation-name:right-to-left; -webkit-animation-duration:1.0s; -webkit-animation-fill-mode:both;}ul.ranking li a p.r-row1 span,ul.ranking li a p.r-row2 span{font-size:10px;}
*/
ul.ranking li a p.r-row1{float:right;font-size:17px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);line-height:40px;text-align:center; position: relative; }ul.ranking li a p.r-row1 span,ul.ranking li a p.r-row2 span{font-size:10px;}
/*ul.ranking li a p.r-row2{float:right;font-size:17px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);line-height:10px;padding-top:11px;text-align:center; position: relative; -webkit-animation-name:right-to-left; -webkit-animation-duration:1.0s; -webkit-animation-fill-mode:both;}
*/
ul.ranking li a p.r-row2{float:right;font-size:17px;text-shadow:0 0 1px #000,0 1px 1px rgba(255,255,255,.7);line-height:10px;padding-top:11px;text-align:center; position: relative; }

ul.ranking li.fp{height:53px;border-bottom:none;position:relative;
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,-webkit-gradient(linear,left top,left bottom,from(#a50101),to(#7e0b0b));
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,-webkit-linear-gradient(top,#a50101,#7e0b0b);
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,-moz-linear-gradient(top,#a50101,#7e0b0b);
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,-ms-linear-gradient(top,#a50101,#7e0b0b);
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,-o-linear-gradient(top,#a50101,#7e0b0b);
background:url(//weathernews.jp/s/soratena/img/ranking/icon_crown.png)10px center no-repeat,linear-gradient(top,#a50101,#7e0b0b);
background-size:37px 34px,100% 100%;-webkit-background-size:37px 34px,100% 100%;-moz-background-size:37px 34px,100% 100%;-ms-background-size:37px 34px,100% 100%;-o-background-size:37px 34px,100% 100%;
}
ul.ranking li.fp a{display:block;background:url(//weathernews.jp/s/soratena/img/arrow_white.png)98% center no-repeat;background-size:8px 13px;-webkit-background-size:8px 13px;-moz-background-size:8px 13px;-ms-background-size:8px 13px;-obackground-size:8px 13px;padding:0 20px 0 55px;color:#fff;}
ul.ranking li.fp:after{content:"";width:100%;height:4px;position:absolute;bottom:-4px;left:0;
background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(transparent));
background:-webkit-linear-gradient(top,rgba(0,0,0,.5),transparent);
background:-moz-linear-gradient(top,rgba(0,0,0,.5),transparent);
background:-ms-linear-gradient(top,rgba(0,0,0,.5),transparent);
background:-o-linear-gradient(top,rgba(0,0,0,.5),transparent);
background:linear-gradient(top,rgba(0,0,0,.5),transparent);
}
ul.ranking li.fp a div.lf{float:left;width:180px;}
ul.ranking li.fp a p.name{font-size:16px;text-shadow:0 0 1px #fff,0 1px 1px rgba(0,0,0,.7);padding:11px 0 5px;}
ul.ranking li.fp a p.location{font-size:13px;text-shadow:0 1px 1px rgba(0,0,0,.7);color:#fff;}
ul.ranking li.fp a p.r-row1{float:right;font-size:17px;text-shadow:0 0 1px #fff,0 1px 1px rgba(0,0,0,.7);line-height:53px;text-align:center;}ul.ranking li.fp a p.r-row1 span,ul.ranking li.fp a p.r-row2 span{font-size:10px;}
ul.ranking li.fp a p.r-row2{float:right;font-size:17px;text-shadow:0 0 1px #fff,0 1px 1px rgba(0,0,0,.7);line-height:11px;padding-top:11px;text-align:center;}

