@charset "utf-8";

/* -------------------------------------------------------------------
	file Information
	
	File name:      				style.css
	Created:   					    2011
	Last update:				    2011-07-10
	by Author Style Info:		topページCSS
	
	Author:									OSM by image graff
	Author URI: 						http://osm.main.jp/work

------------------------------------------------------------------- */

/* -----------------------------------------------------------
	setup
----------------------------------------------------------- */
/* ---------------------------------------
	PIE.htc
--------------------------------------- */
#pfj-content {
	behavior: url(/PIE.htc) \9;/* IE6,7,8 */
}

/* ---------------------------------------
	section CSS sprite
--------------------------------------- */
#book .bx-pager a,
#book a.bx-prev,
#book a.bx-next {
	background-image: url(../images/top/book_bt.png);
	background-repeat: no-repeat;
}

#info li .link {
	background-image: url(../images/top/ico.png);
	background-repeat: no-repeat;
}

/* -----------------------------------------------------------
	.wrap-inner
----------------------------------------------------------- */
#wrapper .wrap-inner {
	padding-top: 32px;/* pfjがないときにはcenter 32px */
	background: #f5f5f1 url(../images/top/book_bg.jpg) no-repeat center 22px;/* pfjがないときにはcenter 60px */
}

/* -----------------------------------------------------------
	#book
----------------------------------------------------------- */
#book {
	margin-bottom: 50px;
}
#book .inner {
	overflow: hidden;
	width: 960px;
	height: 480px;
}
#book .inner li {
	position: relative;
}
#book h2 {
	position: absolute;
	top: 76px;
	width: 960px;
	text-align: center;
	z-index: 10000;
}
#book p {
	position: absolute;
	top: 430px;
	right: 70px;
	z-index: 10000;
}
#book .bx-pager,
#book a.bx-prev,
#book a.bx-next {
	position: absolute;
	top: 425px;
	z-index: 10000;
}
#book .bx-pager a,
#book a.bx-prev,
#book a.bx-next {
	display: inline-block;
	overflow: hidden;
	width: 40px;
	height: 0;
	padding-top: 40px;
	line-height: 2;
}
#book .bx-pager {
	left: 65px;
}
#book .bx-pager a {
	background-position: -40px 0;
}
#book .bx-pager a:hover {
	background-position: -40px -40px;
}
#book a.bx-prev {
	left: 15px;
	background-position: 0 0;
}
#book a.bx-prev:hover {
	background-position: 0 -40px;
}
#book a.bx-next {
	right: 15px;
	background-position: -80px 0;
}
#book a.bx-next:hover {
	background-position: -80px -40px;
}

/* -----------------------------------------------------------
	#info
----------------------------------------------------------- */
#info {
	/*margin-bottom: 66px;*/
	width: 470px;
	border-top: 1px solid #999;
	font-family: "jun201","じゅん201","Hiragino Maru Gothic Pro", "ヒラギノ丸ゴ Pro W4","メイリオ","Meiryo","ＭＳ Ｐゴシック",Osaka,sans-serif;
	font-size: 83%;
	line-height: 1.4;
	
	float:left;

}
#info li .link  {
	display: block;
	min-height: 45px;
	padding: 7px 0;
	border-bottom: 1px solid #999;
}
* html #info li .link {
	height: 45px;/* IE6 */
}
#info li .link:hover {
	text-decoration: none;
	cursor: pointer;
}
#info .list-1 .link {
	background-position: 5px 11px;
}
#info .list-1 .link:hover {
	background-position: 5px -363px;
}
#info .list-2 .link {
	background-position: 5px -119px;
}
#info .list-2 .link:hover {
	background-position: 5px -493px;
}
#info .list-3 .link {
	overflow: hidden;
	background-position: 5px -245px;
}
* html #info .list-3 .link {
	overflow: visible;/* IE6 */
}
#info .list-3 .link:hover {
	background-position: 5px -619px;
}
#info .list-3 .link .twLink:hover {
	text-decoration: underline;
}
#info h2 {
	float: left;
	width: 120px;
	padding-left: 42px;
	letter-spacing: -0.05em;
}
#info p,
#info div {
	float: right;
	width: 300px;
}
#info #latest_tweet p {
	float: none;
	width: auto;
}
#info .link:hover p {
	color: #000;
}
#info #latest_tweet .loading {
	display: inline-block;
	width: 350px;
}

.bt-watch-all{
	text-align:right;
	/*float:right;*/
	line-height:1.7;
}

/* -----------------------------------------------------------
	#top-new-pets
----------------------------------------------------------- */
#top-new-pets{
	float:right;
	width:470px;
	margin-top:-20px;
}
#top-new-pets .image img{
	width:100px;
	height:auto;
}

#top-new-pets >div > h2{
	margin-bottom:5px;
	height:0;
	overflow:hidden;
	padding-top:35px;
	background: url('../images/shared/top_ico.png') no-repeat 0 0;
	background-size:180px auto;
	line-height:2;
}

#top-new-pets #m_exp{
	display:none;
}

#top-new-pets .bt_watchmore,
#mb-top .bt_watchmore{
	text-align:right;
}
#info .bt_watchmore{
	padding-left:0;
	padding-right:0;
}

#top-new-pets .bt_watchmore a,
#mb-top .bt_watchmore a{
	display:inline-block;
	height:0;
	padding-top:40px;
	margin-top:5px;
	line-height:2;
	width:220px;
	background:url('../images/shared/top_ico.png') no-repeat 0 -80px;
	background-size:260px auto;
}
#top-new-pets .bt_watchmore span,
#mb-top .bt_watchmore span{
	display:none;
}

/* -----------------------------------------------------------
	.topRecruit
----------------------------------------------------------- */
.topRecruit{
	margin-top:35px;
	margin-bottom:35px;
	padding:25px 0;
	background:#fff;
}
.topRecruit img:hover{
	opacity:.85;
}
.topRecruit + .wrap-inner2{
	padding:0 20px 16px;
}

/* -----------------------------------------------------------
	.topNuts
----------------------------------------------------------- */
.topNuts{
    margin-top: 50px;
}
.topNuts img:hover{
	opacity:.85;
}