@charset "UTF-8";

/* ==========================================================================
   ※4月以降削除※
   ========================================================================== */
/* width 950px layout */
.yj950-2 #wrapper{ width:950px;min-width:950px !important;margin:0 auto;padding:0 10px;}
.yj950-2 #contents{ padding:0;}
/* ==== */

/* ==========================================================================
   Common
   ========================================================================== */
* { zoom: 1; }
ul, ol, li { zoom: normal; }

@font-face {
	font-family:XBRAND-Logotype;
	src: url('http://xbrand.yahoo.co.jp/XBRAND-Logotype.eot');
	src: url('http://xbrand.yahoo.co.jp/XBRAND-Logotype.eot?#iefix') format('embedded-opentype'),
		 url('http://xbrand.yahoo.co.jp/XBRAND-Logotype.woff') format('woff'),
		 url('http://xbrand.yahoo.co.jp/XBRAND-Logotype.ttf')  format('truetype');
}


/* title */
#whats_new h2,
#ranking h2,
#category h2.cate_ttl,
#information h2 {
	background:url(../images/v2/home_title.png) no-repeat;
	text-indent:-9999px;
}
/* ----- #featured ----- */
#featured {
	margin-top:20px;
}
#featured h2 {display:none;}
/*-- jsCarousel 1.0.0 --*/
/* Slider base CSS　※UNREWRITABLE※ */
.jsCarousel .elItem {
	position: relative;
}
.jsCarousel .elItem .elPanel {
	overflow: hidden;
	position: relative;
}
.jsCarousel .elItem .elPanel ul {
	position: relative;
	-ms-transition: -ms-transform;
	-webkit-transition: -webkit-transform;
	transition: transform;
	-ms-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	width: 99999px;
	overflow: hidden;
	*zoom: 1;
}
.jsCarousel .elItem .elPanel li {
	float: left;
	max-width: 100%;
	margin: 0 auto;
}
.jsCarousel　.elItem　.elPanel .elImg {
	width: 100%;
	padding: 0;
	line-height: 0;
	text-align: center;
}
.jsCarousel .elPanel .elImg img {
	width: 100%;
	height: auto;
}

/* Slider list layout */
.jsCarousel .elItem{
	margin: 0 auto;
	max-width:710px;
}
.jsCarousel .elPanel .elImg {
	min-height: 250px;
	max-height: 283px;
}
.jsCarousel .elPanel li{
	position: relative;
}
.jsCarousel .elPanel li a{
	display: block;
}
.jsCarousel .elPanel .elImg img{
	width:100%;
	vertical-align: bottom;
}
.jsCarousel .elPanel li .elTxt{
	background-color: rgba(255,255,255,0.8);
	position: absolute;
	bottom: 5px;
	width: 100%;
}
.jsCarousel .elPanel li .elTxt .ttl{
	font-size: 1em;
	line-height: 50px;
	text-shadow: 1px 1px 0 #fff;
	padding: 0 125px 0 10px;
	font-size:143%;
	text-overflow:ellipsis;
	overflow:hidden;
	word-break: break-all;
	white-space:nowrap;
}
.jsCarousel .elPanel li .elTxt .magLogo {
	display:block;
	position:absolute;
	top:15px;
	right:10px;
}
.jsCarousel .elItem .elPanel ul.elSwipable {
	cursor: -moz-grab;
	cursor: -webkit-grab;
	cursor: grab;
}
.jsCarousel .elItem .elPanel ul.elSwiping, .jsCarousel .elItem .elPanel ul.elSwiping a {
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
	cursor: grabbing;
}
.jsCarousel .elItem .elButton{
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
}
.jsCarousel .elItem .elButton a {
	background-color: rgba(0,0,0,0.5);
	background-image: url(../images/v2/carousel_arw.png);
	background-repeat: no-repeat;
	overflow: hidden;
	width: 20px;
	height: 40px;
	font-size: 0;
	text-indent: -9999px;
	top: 0;
	margin-top: -20px;
}
.jsCarousel .elItem .elButton a:before {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}
.jsCarousel .elItem .elButton a.elPrev {
	position: relative;
	display: inline-block;
	background-position: 0 0;
	line-height: 16px;
	padding-left: 8px;
	position: absolute;
	left: 0;
	padding-left: 0;
}
.jsCarousel .elItem .elButton a.elNext {
	position: relative;
	display: inline-block;
	background-position: -20px 0;
	line-height: 16px;
	padding-left: 8px;
	position: absolute;
	right: 0;
	padding-left: 0;
}
.jsCarousel .elItem .elButton a.elHide {
	display: none;
}
.jsCarousel .elItem .elButton a.elDisable {
	color: #ddd;
	cursor: default;
	pointer-events: none;
}
.jsCarousel .elItem .elButton a.elDisable {
	color: #c0bfb6;
}
.jsCarousel .elItem .elCircle {
	text-align: center;
	font-size: 0;
}
.jsCarousel .elItem .elCircle ol {
	margin-top: 5px;
	min-height: 5px;
	text-align: right;
}
.jsCarousel .elItem .elCircle li {
	display: inline-block;
	margin: 0 5px;
}
.jsCarousel .elItem .elCircle a {
	display: inline-block;
	width: 5px;
	height: 5px;
	background: #999;
}
.jsCarousel .elItem .elCircle a.elShow {
	background: #000;
	cursor: default;
}
.jsCarousel .elItem .elCircle ol.elHide {
	visibility: hidden;
}

/* ----- .ad_featured-banner ----- */
.ad_featured-banner {
	margin-top:10px;
}
.ad_featured-banner div {
	width:640px;
	margin:auto;
}
.ad_featured-banner .banner01 img {
	width:100%;
}
.ad_featured-banner .banner02 li {
	float:left;
}
.ad_featured-banner .banner02 li:first-child {
	margin-right:10px;
}
.ad_featured-banner .banner02 img {
	width:315px;
}

/* ----- #whats_new ----- */
#whats_new {
	margin-top:20px;
}
#whats_new h2 {
	background-position:0 -300px;
	width:620px;
	height:68px;
	margin-bottom:20px;
}
body.yj950-2 #whats_new h2 {
	background-position:0 -400px;
	margin-left:0;
}
#whats_new .whats_inner{
	float: left;
	width: 480px;
	margin-bottom:40px;
}
#whats_new ul.new_article{
	letter-spacing: -0.4em;
}
#whats_new ul.new_article li{
	display: inline-block;
	*display:block;
	vertical-align: top;
	letter-spacing: normal;
}
#whats_new ul.new_article > li {
	*float:left;
	width:230px;
	margin:0 10px 10px 0;
}
#whats_new ul.new_article li a {
	display:block;
	position:relative;
	padding-top:175px;
	padding-bottom:10px;
}
#whats_new ul.new_article li a:hover {
	background-color:#e8e8e8;
}
#whats_new ul.new_article li a .title {
	position:relative;
	padding:10px;
	margin:0 10px;
	background-color:#fff;
	background:-moz-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,1) 25%);
	background:-webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(255,255,255,0.8)),color-stop(25%,rgba(255,255,255,1)));
	background:-ms-linear-gradient(top, rgba(255,255,255,0.8) 0,rgba(255,255,255,1) 25%);
	background:linear-gradient(to bottom,rgba(255,255,255,0.8) 0,rgba(255,255,255,1) 25%);
	min-height:11em;
	z-index:10;
}
#whats_new ul.new_article li a .img {
	position:absolute;
	top:0;
	left:0;
	width:230px;
	height:230px;
	border-top:1px solid #fff;
	z-index:0;
}
#whats_new ul.new_article li a:hover .img:after {
	display: block;
	content: "";
	position: absolute;
	top:0;
	left:0;
	width:230px;
	height:230px;
	background:-moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.4) 70%, rgba(0,0,0,0.4) 100%);
	background:-webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(50%,rgba(0,0,0,0.2)),color-stop(70%,rgba(0,0,0,0.4)),color-stop(100%,rgba(0,0,0,0.4)));
	background:-ms-linear-gradient(top, rgba(0,0,0,0) 0,rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.4) 70%, rgba(0,0,0,0.4) 100%);
	background:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.4) 70%, rgba(0,0,0,0.4) 100%);
	z-index: 1;
}
#whats_new ul.new_article li a .title h3 {
	min-height: 42px;
	height: auto !important;
	height: 42px;
	margin-top:5px;
	font-weight:bold;
}
#whats_new ul.new_article li a .title .lead_txt {
	margin-top:5px;
	color:#333;
	font-size:85.7%;
}
#whats_new ul.new_article li a .title .read_more {
	display:inline-block;
	background:url(../images/v2/arw_top.png) no-repeat right center;
	margin-top:5px;
	padding-right:10px;
	color:#666;
	font-size:79%;
}
#whats_new ul.new_article li a:hover .title h3,
#whats_new ul.new_article li a:hover .read_more {
	text-decoration:underline;
}
#whats_new ul.new_article li a .category {
	position:absolute;
	top:-5px;
	left:0;
	font-family:Avenir Next Condensed;
	color:#fff;
	font-size:86%;
}
#whats_new ul.new_article li a .category > li {
	float:left;
	margin-right:1px;
	padding:1px 4px;
	background-color:#000;
	border-top:1px solid #fff;
	letter-spacing:0.05em;
}
#whats_new ul.new_article li a .category > li:last-child {
	margin-right:0;
}
#whats_new #js_button{
	padding-bottom: 20px;
	text-align: center;
}
#whats_new #js_button span{
	display: inline-block;
	background: #000 url(../images/v2/clumn_more_arw.png) no-repeat 100% 0;
	cursor: pointer;
	color: #fff;
	font-size: 93%;
	padding-left: 5px;
	padding-right: 35px;
	line-height: 30px;
}
#whats_new #js_button span:hover {
	background-position:100% -30px;
}
#whats_new .moreLink {
	border-top:1px solid #ccc;
}

/* ----- #ranking ----- */
#ranking {
	float: left;
	width:140px;
	padding:10px 0 10px 10px;
	margin:-50px 0 40px 10px;
}
#ranking #ranking_inner {
	padding:1px;
	background: -moz-linear-gradient(top center, #e6e6e6 80%, #fff 100%);
	background: -webkit-gradient(linear, center top, center bottom, from(#e6e6e6), to(#fff));
	background: linear-gradient(top center, #e6e6e6 80%, #fff 100%);
	border-top:1px solid #fff;
	border-bottom:1px solid #ccc;
}
#ranking .ranking_inner_inner {
	display:block;
	position:relative;
	background-color:#fff;
}
#ranking h2 {
	background-position:0 0;
	width:97px;
	height:50px;
	position:absolute;
	top:-22px;
	left:20px;
}
#ranking .date {
	padding-top:30px;
	font-size:72%;
	text-align:center;
}
#ranking ol {
	counter-reset:number;
}
#ranking ol li {
	position:relative;
	margin:10px 10px 20px;
}
#ranking ol li:before {
	font-family:XBRAND-Logotype;
	display:inline-block;
	position:absolute;
	top:-10px;
	left:-20px;
	width:30px;
	height:30px;
	counter-increment:number;
	content:counter(number);
	color:#fff;
	font-size:122%;
	line-height:30px;
	text-align:center;
	vertical-align:middle;
	background-color:#000;
	z-index:10;
}
#ranking ol li a {
	display:block;
	position:relative;
	padding-top:130px;
}
#ranking ol li a .title {
	position:relative;
}
#ranking ol li a .title h3 {
	font-size:86%;
	word-break:break-all;
	line-height:1.45;
}
#ranking ol li a:hover .title h3 {
	text-decoration:underline;
}
#ranking ol li a .title .magTxt {
	color:#999;
	font-size:79%;
}
#ranking ol li a .img {
	position:absolute;
	top:0;
	left:0;
	width:120px;
	height:120px;
}
#ranking .moreLink {
	margin-bottom:40px;
}

/* ----- #information ----- */
#information {
	position:relative;
	background-color:#f2f2f2;
	padding:10px 0;
	clear:both;
}
#information h2 {
	background-position:0 -60px;
	width:120px;
	height:113px;
	position:absolute;
	left:15px;
	top:15px;
}
#information ul {
	margin-top:20px;
	padding-left:150px;
}
#information ul li {
	background:url(../images/v2/home_dot.png) no-repeat left center;
	font-size:86%;
	margin-bottom:10px;
	padding-left:10px;
}
#information ul li a {
	font-weight:bold;
}
#information ul li span{
	margin-left:10px;
}
#information ul li a:hover{
	text-decoration: underline;
}
#information .moreLink {
	border-top:1px dotted #cccccc;
	margin:0 10px 0 135px;
	padding-top:10px;
	text-align:right;
}
#information .moreLink a{
	font-size:86%;
	background:url(../images/v2/arw_top.png) no-repeat right center;
	padding-right:10px;
	color:#666;
	font-size:86%;
	text-align:right;
	width: auto;
	height: auto;
	text-indent: 0;
}
#information .moreLink a:hover{
	text-decoration:underline;
}

/* ----- #category ----- */
#category {
	clear:both;
	margin-top:80px;
}
#category h2 {
	display:none;
}
#category h2.cate_ttl {
	display:block;
	margin:0 auto;
	background-position:0 -500px;
	width:540px;
	height:58px;
}
#category #featured_category {
	margin:0 auto;
	max-width:640px;
}
#category #featured_category .featured_category_sub {
	position:relative;
	margin:0 auto;
	width:596px;
	z-index:10;
	white-space:nowrap;
}
#category #featured_category .featured_category_sub h3 {
	display:inline-block;
	background:url(../images/v2/home_Fcategory.png) no-repeat;
	margin-left:-30px;
	text-indent:-9999px;
	height:75px;
	vertical-align:top;
	overflow:hidden;
}
#category #featured_category .featured_category_sub .f_cate_sub_inner {
	display:inline-block;
	margin-left:10px;
	vertical-align:top;
}
#category #featured_category .featured_category_sub .f_cate_sub_inner .moreLink{
	padding-top: 0;
}
#category #featured_category .featured_category_sub .f_cate_sub_inner .moreLink a{
	margin-left: 0;
}
#category #featured_category .featured_category_sub .f_cate_sub_inner .date{
	margin-top:5px;
	color:#999;
	font-size:79%;
}
#category #featured_category .featured_category_sub .f_cate_sub_inner .date span {
	padding-left:5px;
}
#category #featured_category .featured_category_sub h3.fashion {background-position:0 0; width:307px;}
#category #featured_category .featured_category_sub h3.gourmet {background-position:0 -80px; width:357px;}
#category #featured_category .featured_category_sub h3.product {background-position:0 -160px; width:334px;}
#category #featured_category .featured_category_sub h3.vehicle {background-position:0 -240px; width:290px;}
#category #featured_category .featured_category_sub h3.beauty {background-position:0 -320px; width:268px;}
#category #featured_category .featured_category_sub h3.travel {background-position:0 -400px; width:250px;}
#category #featured_category .featured_category_sub h3.lifestyle {background-position:0 -480px; width:317px;}
#category #featured_category .featured_category_sub h3.entertainment {background-position:0 -558px; width:520px;}
#category #featured_category .featured_category_sub h3.business_money {background-position:0 -634px; width:532px;}
#category #featured_category .featured_category_sub h3.bodycare {background-position:0 -720px; width:388px;}
#category #featured_category .featured_category_sub h3.video {background-position:0 -800px; width:218px;}

#category .featured_category_main{
 position: relative;
 width: 596px;
 margin: -18px auto 80px;
}
/*#category .featured_category_main {
	position:relative;
	margin-top:-18px;
	margin-bottom:80px;
}*/
#category .featured_category_main a {
	display:block;
}
#category .featured_category_main .magTitle{
	position:absolute;
	bottom:-45px;
	right:0;
}
#category .featured_category_main .magTxt {
	padding:2px 4px;
	margin-bottom:1px;
	background-color:#000;
	color:#fff;
	font-family:Avenir Next Condensed;
	font-size:86%;
	display:inline-block;
}
#category .featured_category_main h4 span{
	display:block;
	float:left;
	clear:both;
	background-color:#000;
	color:#fff;
	font-family:"ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	font-size:143%;
	padding:5px 10px;
	border-bottom:1px solid #fff;
	white-space:nowrap;
}
#category .featured_category_main h4 span:last-child {
	background-image:url(../images/v2/arw_right_30x30.png);
	background-position: 100% 0;
	background-repeat:no-repeat;
	padding-right:41px;
}
#category .featured_category_main a:hover h4 span:last-child {
	background-position: 100% -50px;
}
#category .featured_category_main .img {
	display:block;
	/*text-align:center;*/
}
#category .featured_category_main .img img {
	padding:10px;
	max-width:550px;
	height:auto;
	border:1px solid #ccc;
	box-shadow:5px 5px 0 #e0e0e0;
}
#category .category_list{
	border-bottom:1px solid #ccc;
}
#category .category_list li{
	float:left;
	border-top:1px solid #ccc;
	padding: 2px 0 1px;
	width:50%;
}
#category .category_list li .category_list_li{
	border-left:1px solid #ccc;
	padding:25px 14px 20px;
}
#category .category_list li:nth-child(odd) .category_list_li {
	border-left: none;
	padding:25px 14px 20px 0;
}

#category .category_list .category_sub h3 {
	display:inline-block;
	background:url(../images/v2/home_category.png) no-repeat;
	height:30px;
	margin-right:5px;
	text-indent:-9999px;
	overflow:hidden;
	vertical-align:middle;
}
#category .category_list .category_sub h3.fashion {background-position:0 0; width:125px;}
#category .category_list .category_sub h3.gourmet {background-position:0 -40px; width:145px;}
#category .category_list .category_sub h3.product {background-position:0 -80px; width:136px;}
#category .category_list .category_sub h3.vehicle {background-position:0 -120px; width:117px;}
#category .category_list .category_sub h3.beauty {background-position:0 -160px; width:105px;}
#category .category_list .category_sub h3.travel {background-position:0 -200px; width:102px;}
#category .category_list .category_sub h3.lifestyle {background-position:0 -240px; width:132px;}
#category .category_list .category_sub h3.entertainment {background-position:0 -280px; width:232px;}
#category .category_list .category_sub h3.bodycare {background-position:0 -320px; width:157px;}
#category .category_list .category_sub h3.business_money {background-position:0 -400px; width:164px; height:63px;}

#category .category_list .category_sub {
	margin-bottom:10px;
}
#category .category_list .category_sub .moreLink {
	display:inline-block;
	vertical-align:top;
}
#category .category_list .category_sub .date {
	margin-top:5px;
	color:#999;
	font-size:79%;
}
#category .category_list .latest_article {
	position:relative;
	margin-top:5px;
}
#category .category_list .latest_article .title {
	padding-left:60px;
	min-height: 120px;
}
#category .category_list .latest_article .title h4 {
	margin-bottom:5px;
	font-weight:bold;
}
#category .category_list .latest_article a:hover .title h4 {
	text-decoration:underline;
}
#category .category_list .latest_article .title .lead_txt,
#category .category_list .latest_article .title .magTxt {
	color:#333;
	font-size:86%;
}
#category .category_list .latest_article .img {
	position:absolute;
	top:0;
	left:0;
	box-shadow:5px 5px 0 #e0e0e0;
}
#category .moreLink_allcate a {
	display:block;
	background:url(../images/v2/btn_viewallcategories.png) no-repeat;
	margin-top:1px;
	margin-left:auto;
	width:125px;
	height:19px;
	text-indent:-9999px;
}
#category .moreLink_allcate a:hover {
	background:url(../images/v2/btn_viewallcategories_h.png) no-repeat;
}
/* window size ~951px */
@media screen and (max-width:951px){
#category .category_list .category_sub h3.business_money {background-position:0 -400px; width:164px; height:63px;}
}

/* window size 1210px~ */
@media screen and (min-width:1210px){
#featured{float: left;width: 710px; margin-top:10px;}
.jsCarousel .elItem{margin: 0;width:auto;}
.ad_featured-banner div {width:710px;margin-left:0;}
.ad_featured-banner .banner02 img{width:350px;}
#whats_new{float: left;width: 720px;}
#whats_new h2 {background-position:0 -200px; width:790px; height:85px; margin-left:-80px; margin-bottom:-10px;}
#whats_new .whats_inner{float: none;width: auto;margin-left: 0 !important;}
#ranking {margin-top:10px;}
#ranking {float: none;margin-left: 720px; padding:30px 0 10px 10px;}
#category .category_list .category_sub h3.business_money {background-position:0 -360px; width:278px; height:30px;}

.ad950 #featured{float:none; width: auto; margin-top: 20px;}
.ad950 #whats_new{float: none;width: auto;}
.ad950 #whats_new h2{background-position: 0 -300px;width: 620px;height: 68px;margin-left:0;margin-bottom: 20px;}
.ad950 #whats_new .whats_inner{float: left;width: 480px;}
.ad950 #ranking {float: left;margin:-50px 0 40px 10px; padding:10px 0 10px 10px;}

/* ==========================================================================
   ※4月以降削除※
   ========================================================================== */
.yj950-2 #featured{float:none; width: auto; margin-top: 20px;}
.yj950-2 #whats_new{float: none;width: auto;}
.yj950-2 #whats_new h2{background-position: 0 -300px;width: 620px;height: 68px;margin-left:0;margin-bottom: 20px;}
.yj950-2 #whats_new .whats_inner{float: left;width: 480px;}
.yj950-2 #ranking {float: left;margin:-50px 0 40px 10px; padding:10px 0 10px 10px;}
/* ==== */
}