/*@charset "euc-jp";
 * simplyScroll 2 - a scroll-tastic jQuery plugin
 *
 * http://logicbox.net/jquery/simplyscroll
 *
 * Copyright (c) 2009-2012 Will Kelly - http://logicbox.net
 *
 * Dual licensed under the MIT and GPL licenses.
 *
 * Last revised: 31/01/2012
 *
 */

/* Default/Master classes 

Example markup format (for horizontal scroller)
Note all DIVs are generated and should not be hard-coded

<div class="your-custom-class simply-scroll-container">
	<div class="simply-scroll-btn simply-scroll-btn-left"></div>
	<div class="simply-scroll-btn simply-scroll-btn-right"></div>
	<div class="simply-scroll-clip">
		<ul class="simply-scroll-list">
			<li>...</li>
			...
		</ul>
	</div>
</div>


*/

.simply-scroll-container { /* Container DIV - automatically generated */
position: relative;
}

.simply-scroll-clip { /* Clip DIV - automatically generated */
position: relative;
overflow: hidden;
}

.simply-scroll-list { /* UL/OL/DIV - the element that simplyScroll is inited on */
overflow: hidden;
margin: 0 0 0 4px;
padding: 0;
list-style: none;
}

* html .simply-scroll-list { /* UL/OL/DIV - the element that simplyScroll is inited on */
margin: 0 0 0 4px;
}
	
.simply-scroll-list li {
padding: 0;
margin: 0;
list-style: none;
}
	
.simply-scroll-list li img {
border: none;
display: block;
}
	
.simply-scroll-btn {
position: absolute;
/*background-image: url(http://i.jiji.jp/images/buttons.png);*/
width: 42px;
height: 102px;
z-index:3;
cursor: pointer;
}
	
.simply-scroll-btn-left {
left: 0px;
/*bottom: 6px;*/
/*background-position: 0 -44px;*/
background-image: url(http://www.jiji.com/img/btn_scrl_left2.gif);
height:102px;
width:19px;
}
.simply-scroll-btn-left.disabled {
/*background-position: 0 0 !important;*/
}
.simply-scroll-btn-left:hover, .simply-scroll-btn-left:focus {
/*background-position: 0 -88px;*/
}

.simply-scroll-btn-right {
right: 0px;
/*bottom: 6px;*/
/*background-position: -84px -44px;*/
background-image: url(http://www.jiji.com/img/btn_scrl_right2.gif);
height:102px;
width:19px;
}


.simply-scroll-btn-right.disabled {
/*background-position: -84px 0 !important;*/
}
.simply-scroll-btn-right:hover, .simply-scroll-btn-right:focus {
/*background-position: -84px -88px;*/
}
	
.simply-scroll-btn-up {
right: 6px;
top: 6px;
background-position: -126px -44px;
}
.simply-scroll-btn-up.disabled {
background-position: -126px 0 !important;
}
.simply-scroll-btn-up:hover, .simply-scroll-btn-up:focus {
background-position: -126px -88px;
}
	
.simply-scroll-btn-down {
right: 6px;
bottom: 6px;
background-position: -42px -44px;
}
.simply-scroll-btn-down.disabled {
background-position: -42px 0 !important;
}
.simply-scroll-btn-down:hover, .simply-scroll-btn-down:focus {
background-position: -42px -88px;
}
	
.simply-scroll-btn-pause {
right: 6px;
bottom: 6px;
background-position: -168px -44px;
}
.simply-scroll-btn-pause:hover, .simply-scroll-btn-pause:focus {
background-position: -168px -88px;
}
	
.simply-scroll-btn-pause.active {
background-position: -84px -44px;
}
.simply-scroll-btn-pause.active:hover, .simply-scroll-btn-pause.active:focus {
background-position: -84px -88px;
}

/* Custom class modifications - override classees

.simply-scroll is default

*/

.simply-scroll { /* Customisable base class for style override DIV */
width: 658px;
/*height: 200px;*/
margin-bottom: 1em;
}

.simply-scroll .simply-scroll-clip {
width: 658px;
/*height: 200px;*/
}
	
.simply-scroll .simply-scroll-list {}

/*	
.simply-scroll .simply-scroll-list li {
float: left;
width: 90px;
height: 60px;
margin :0 15px 0 0;
}
*/

.simply-scroll .simply-scroll-list li img {}

.simply-scroll .simply-scroll-btn {}

.simply-scroll .simply-scroll-btn-left {}
.simply-scroll .simply-scroll-btn-left.disabled {}
.simply-scroll .simply-scroll-btn-left:hover {}

.simply-scroll .simply-scroll-btn-right {}
.simply-scroll .simply-scroll-btn-right.disabled {}
.simply-scroll .simply-scroll-btn-right:hover {}

.simply-scroll .simply-scroll-btn-up {}
.simply-scroll .simply-scroll-btn-up.disabled {}
.simply-scroll .simply-scroll-btn-up:hover {}

.simply-scroll .simply-scroll-btn-down {}
.simply-scroll .simply-scroll-btn-down.disabled {}
.simply-scroll .simply-scroll-btn-down:hover {}



/* Vertical scroller example */

.vert { /* wider than clip to position buttons to side */
width: 340px;
height: 400px;
margin-bottom: 1.5em;
}

.vert .simply-scroll-clip {
width: 290px;
height: 400px;
}
	
.vert .simply-scroll-list {}
		
.vert .simply-scroll-list li {
width: 290px;
height: 200px;
}
.vert .simply-scroll-list li img {}

.vert .simply-scroll-btn {}

.vert .simply-scroll-btn-up { /* modified btn pos */
right: 0;
top: 0;
}
.vert .simply-scroll-btn-up.disabled {}
.vert .simply-scroll-btn-up:hover {}
	
.vert .simply-scroll-btn-down { /* modified btn pos */
right: 0;
top: 52px;
}
.vert .simply-scroll-btn-down.disabled {}
.vert .simply-scroll-btn-down:hover {}
	
/* NOTE left-right classes wouldn't be needed on vertical scroller */



#scroller li{
list-style-type: none;
float:left;
text-align:center;
width:100px;
height:100px;
margin:0 4px;
display:inline;
}
				
#scroller li a:link {
text-decoration: none;
}



/*Add Matsumoto*/


#scroller li a:link img,#scroller li a:visited img,
#scroller li a:link img,#scroller li a:visited img,
#scroller li a:link img,#scroller li a:visited img,
#scroller li a:link img,#scroller li a:visited img {
padding:1px;
margin-bottom:2px;
border:1px solid #ccc;
}
#scroller li a:hover img,
#scroller li a:hover img,
#scroller li a:hover img,
#scroller li a:hover img {
padding:1px;
margin-bottom:2px;
border:1px solid #3366ff;
}
#scroller-box{
width:658px;
height:135px;
padding:1px;
border:1px solid #ccc;
margin:20px 0 0 20px;
_margin-left:10px;
display:inline;
}
.scroller-box_bar{
background:url("http://www.jiji.com/img/slider_bar.gif") repeat-x;
width:658px;
height:22px;
margin:0 0 10px 0;
font-size:80%;
font-weight:bold;
color:#333;
}
.tittle-blue{
margin:2px 0 0 6px;
}
.scroller-box_bar p{
width:100px;
margin:-15px 0 0 20px;
} 

#scroller-box .scroller_txt{
width:100px;
font-size:75%;
text-align:center;
color:#000;
text-decoration: none;
}


#scroller-box .scroller_txt a:link{
	color:#333;
	text-decoration: none;
}
#scroller-box .scroller_txt a:active{
	color:#3366FF;
	text-decoration: underline;
}
#scroller-box .scroller_txt a:visited{
	color:#333;
	text-decoration: none;
}
#scroller-box .scroller_txt a:hover{
	color:#3366FF;
	text-decoration: underline;
}