﻿@charset "utf-8";

/* ===================================================================

 TOP

=================================================================== */

.main{
padding: 5px 0;
background-color: #fff;
}

.topagetop { margin: 0 5px 15px 0; }


/* 見出し
----------------------------------------------------*/
.top-subtitle {
	position: relative;
	height: 34px;
	margin-bottom: 17px;
	border-top: solid 5px #000000;
	background: url(/voi/sp/webshop/spsale14_winter/img/spr_sale_subt.png) no-repeat 0 0;
	color: #333333;
	text-indent: -320px;
	font-weight: normal;
	font-size: 10px;
	overflow: hidden;
	/* ▼画像変更時　調整 */
	background-size: 320px 67px;
	-moz-background-size: 320px 67px;
	-webkit-background-size: 320px 67px;
}

.top-subtitle span {
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	text-indent: 0;
}

/* ▼画像変更時　調整 */

#salenews .top-subtitle { background-position: 0px 0px; }

#salenews .top-subtitle span { padding-left: 133px; }

#information .top-subtitle { background-position: 0px -34px; }

.news #salenews .news-subtitle {
	position: relative;
	padding: 10px 0;
	margin: 15px 0 0;
	background-color: #fff;
	text-align: center;
}

.news #salenews .news-subtitle::before {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -6px;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 10px solid #000;
}


/* TOPバナーエリア
----------------------------------------------------*/
.salebnrarea {
width: 314px;
margin: 0 auto;
}

.salebnr { margin-bottom: 15px; }

.salebnr li {
width: 152px;
float: left;
}

.salebnr li:nth-child(odd) { margin-right: 5px; }


/* 期間限定セール
----------------------------------------------------*/
.limitedsale_inner {
width: 300px;
margin: 0 auto;
padding-bottom: 10px;
}


/* アイテムから探す
----------------------------------------------------*/
.toglelist .itembox {
	float: left;
	width: 50%;
}

.toglelist .itembox {
	position: relative;
	float: left;
	width: 50%;
}


.toglelist .itembox > p {
	position: relative;
	padding: 0 0 0 0;
	border-top: solid 1px #bcbcbc;
	font-weight: bold;
}
.toglelist .itembox:nth-child(1) > p,
.toglelist .itembox:nth-child(2) > p{
	border-top: none;
}
.toglelist .itembox:nth-child(even) > p {
	border-left: solid 1px #bcbcbc;
}
.toglelist .itembox.open > p {
	background-color: #f5f5f5;
}


/* icon */
.toglelist .itembox > p:after {
	content: "";
	position: absolute;
	top: 0;
	left: 7px;
	display: block;
	width: 36px;
	height: 49px;
	background: url(/voi/sp/webshop/spsale14_winter/img/spr_sale.png) 0 0;
	background-size: 124px 686px;
	-moz-background-size: 124px 686px;
	-webkit-background-size: 124px 686px;
}
.toglelist .itembox#lad-1 > p:after {	background-position: 0 -196px;}
.toglelist .itembox#lad-2 > p:after {	background-position: 0 -147px;}
.toglelist .itembox#lad-3 > p:after {	background-position: 0 -245px;}
.toglelist .itembox#lad-4 > p:after {	background-position: 0 0;}
.toglelist .itembox#lad-5 > p:after {	background-position: 0 -49px;}
.toglelist .itembox#lad-6 > p:after {	background-position: 0 -637px;}

.toglelist .itembox#men-1 > p:after {	background-position: -37px -196px;}
.toglelist .itembox#men-2 > p:after {	background-position: -37px -147px;}
.toglelist .itembox#men-3 > p:after {	background-position: -37px -245px;}
.toglelist .itembox#men-4 > p:after {	background-position: -37px 0;}
.toglelist .itembox#men-5 > p:after {	background-position: -37px -49px;}
.toglelist .itembox#men-6 > p:after {	background-position: -37px -637px;}


/* open時下線隠す用 */
.toglelist .itembox.open > p:before {
	content: "";
	position: absolute;
	bottom: -1px;
	height: 4px;
	width: 100%;
	background-color: #f5f5f5;
}


/* arrow */
.toglelist .itembox:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 6px;
	display: block;
	width: 25px;
	height: 25px;
	margin-top: -12px;
	background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat 0px -75px;
	background-size: 50px 350px;
		-moz-background-size: 50px 350px;
		-webkit-background-size: 50px 350px;
}
.toglelist .itembox.close:after {background-position: 0px -75px;}
.toglelist .itembox.open:after {background-position: 0px -100px;}



.toglelist .itembox > p > span {
	display: table-cell;
	vertical-align: middle;
	height: 53px;
	padding-left: 50px;
}

.togle-sublist {
	clear: both;
	display: none;
}
.togle-sublist .clm2 {
	margin-bottom: -1px;
	padding: 19px 10px 13px;
	border-top: solid 1px #bcbcbc;
	border-bottom: solid 1px #bcbcbc;
	background-color: #f5f5f5;
}
.togle-sublist .clm2 li {
	float: left;
	width: 50%;
}
.togle-sublist .clm2 li a {
	position: relative;
	display: block;
	padding: 0 18px 0 10px;
	border: solid 1px #c0c0c0;
	background-color: #ffffff;
	font-size: 12px;
	font-weight: bold;
}
.togle-sublist .clm2 li:nth-child(odd) a {
	margin: 0 7px 7px 0;
}
.togle-sublist .clm2 li:nth-child(even) a {
	margin: 0 0 7px 7px;
}
.togle-sublist .clm2 li a span {
	display: table-cell;
	vertical-align: middle;
	height: 34px;
}

/* arrow */
.togle-sublist .clm2 li a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 8px;
	display: block;
	width: 9px;
	height: 14px;
	margin-top: -7px;
	background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat 0px 0px;
	background-size: 50px 350px;
		-moz-background-size: 50px 350px;
		-webkit-background-size: 50px 350px;
}


.catearea {
	float: left;
	width: 50%;
}

.catearea-clm1 {
	width: 100%;
}

.catearea h3 {
	padding-bottom: 8px;
}
.cate-l h3 {
	padding-left: 15px;
	color: #d8307e;
}
.cate-m h3 {
	padding-left: 7px;
	color: #242671;
}

.catearea ul li a {
	position: relative;
	display: block;
}
.catearea ul li a span {
	display: table-cell;
	height: 53px;
	padding: 0 20px 0 43px;
	vertical-align: middle;
}

.catearea .more {
	border-top: solid 1px #ffffff;
	background-color: #f5f5f5;
	border-top: solid 1px #bcbcbc;
}

.catearea .more a {
	position: relative;
	display: block;
	border-top: solid 1px #ffffff;
	font-weight: bold;
	font-size: 13px;
}
.cate-l .more a {	color: #d8307e;}
.cate-m .more a {
	border-left: solid 1px #ffffff;
	color: #242671;
}

.catearea .more span {
	display: block;
	height: 48px;
	line-height: 48px;
	padding: 0 30px 0 10px;
	vertical-align: middle;
	text-align: right;
}


/* arrow */
.catearea .more a:after,
.catearea ul li a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 7px;
	display: block;
	width: 10px;
	height: 15px;
	margin-top: -7px;
	background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat 0px 0px;
	background-size: 50px 350px;
		-moz-background-size: 50px 350px;
		-webkit-background-size: 50px 350px;
}
.cate-l .more a:after,
.cate-l ul li a:after {
	background-position: 0px -25px;
}
.cate-m .more a:after,
.cate-m ul li a:after {
	background-position: 0px -50px;
}

.cate-m ul li.cate-t a:after {
	background-position: 0px 0px;
}



/* セールアイテムから探す
----------------------------------------------------*/
.saleitem {
	padding: 0 0 8px;
	background-color: #ffffff;
}

.saleitem h2 {
position: relative;
margin-bottom: 17px;
padding: 10px 0;
background-color: #000;
text-align: center;
color: #ffffff;
}

.saleitem h2::before {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -6px;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 10px solid #000;
	}

.saleitem_inner { padding: 0 10px; }

.saleitem .container {
	float: left;
	width: 50%;
}
.saleitem * {
	box-sizing: border-box;
}

.saleitem .container h3 {
	font-size: 14px;
	margin: 0 0 8px 5px;
}

.saleitem .container .b-nol1, .saleitem .container .b-nom1 { margin-top: 15px; }

.saleitem li span {
	height: 54px;
	font-size: 14px;
	line-height: 1;
}
.saleitem li.bh40 span {
	height: 40px;
}

/* レディース */
.saleitem .ladieslist h3 { color: #d8307e; }
.saleitem .ladieslist li { margin-right: 3px; }

/* メンズ */

.saleitem .menslist h3 {
	margin-left: 8px;
	color: #242671;
}
.saleitem .menslist li { margin-left: 3px; }


/* ブランドから探す
----------------------------------------------------*/
.brandlist .stit {
	margin: 0 5px 14px 5px;
	padding: 14px 5px 0;
}
.brandlist .rankinglist {
	margin-top: 10px;
	padding: 0 0 15px 5px;
	/*border-bottom: dotted 1px #bcbcbc;*/
}
.brandlist .brandlist_m .rankinglist {
	border-bottom: none;
}
.brandlist .rankinglist li {
	float: left;
	width: 98px;
	height: 90px;
	margin-right: 5px;
	border: solid 1px #dfdfdf;
}
.brandlist .rankinglist li a {
	position: relative;
	display: block;
	xwidth: 98px;
	height: 90px;
}
.brandlist .rankinglist li .b_logo {
	padding: 30px 0 13px 0;
	text-align: center;
}

.brandlist .rankinglist li .b_name {
	padding: 0 6px;
	font-size: 11px;
	text-align: center;
	color: #333333;
}
/* ランキングアイコン　スプライト画像 */
.brandlist .rankinglist li .b_icn {
	position:absolute;
	top:1px;
	left:1px;
	width: 21px;
	height: 16px;
	background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat -29px 0;
	background-size: 50px 350px;
		-moz-background-size: 50px 350px;
		-webkit-background-size: 50px 350px;	
}

.brandlist .rankinglist li:nth-child(1) .b_icn { background-position: -29px 0px;}
.brandlist .rankinglist li:nth-child(2) .b_icn { background-position: -29px -20px;}
.brandlist .rankinglist li:nth-child(3) .b_icn { background-position: -29px -40px;}
.brandlist .rankinglist li:nth-child(4) .b_icn { background-position: -38px -60px;}
.brandlist .rankinglist li:nth-child(5) .b_icn { background-position: -38px -80px;}
.brandlist .rankinglist li:nth-child(6) .b_icn { background-position: -38px -100px;}
.brandlist .rankinglist li:nth-child(7) .b_icn { background-position: -38px -120px;}
.brandlist .rankinglist li:nth-child(8) .b_icn { background-position: -38px -140px;}
.brandlist .rankinglist li:nth-child(9) .b_icn { background-position: -38px -160px;}
.brandlist .rankinglist li:nth-child(10) .b_icn { background-position: -38px -220px;}

.brandlist .brandlist_l {
	border-bottom: solid 1px #bcbcbc;
}
.brandlist .brandlist_m {
	border-top: solid 1px #bcbcbc;
	border-bottom: solid 1px #bcbcbc;
}

.brandlist .viewport ul {
	width: 1050px;
}


/* トピックス
----------------------------------------------------*/

.btn_page a {
	position: relative;
	display: table;
	width: 100%;
}

.btn_page span {
	display: table-cell;
	vertical-align: middle;
}

.btn_page span.btn-img {
	padding-left: 10px;
}

.btn_page span.btn-txt {
	text-align: right;
}

/* セールニュース
----------------------------------------------------*/

#salenews { background-color: #ffffff; }

#salenews .other_news {
margin: 0 10px 5px;
padding: 10px 0;
border-top: solid 1px #E6002B;
border-bottom: solid 1px #E6002B;
}

#salenews h3 {
padding: 0 15px 10px;
line-height: 1;
}

#salenews h3.color-m {
	padding-top: 13px;
	border-top: solid 1px #bcbcbc
}

.newslist {
	padding: 0 15px 8px;
	border-bottom: solid 1px #bcbcbc;
}

.newslist li {
	margin-bottom: 0;
	padding: 9px 0;
	border-top: dotted 1px #bcbcbc;
}

.newslist li:first-child {
	border-top: none;
}


.newslist li p { display: table; }

.newslist li span {
display: table-cell;
width: 3.5em;
}

.newslist li a { text-decoration: underline; }

#salenews .other_news a {
text-decoration: underline;
color: #333333;
}


/* 	最近チェックした商品
----------------------------------------------------*/
#recentchk {
	padding-bottom: 10px;
	border-bottom: solid 1px #bcbcbc
}
#recentchk .subtitle h3 {
	background: url(/voi/sp/images/tlmtop/subt_check.png) no-repeat 0 0;
	background-size: 77px 34px;
	-moz-background-size: 77px 34px;
	-webkit-background-size: 77px 34px;
}
#recentchk .subtitle span {
	padding-left: 87px;
}
#recentchk ul {
	margin: 15px 0 0 5px;
}
#recentchk ul li {
	float: left;
	width: 100px;
	margin-right: 5px;
}
#recentchk ul li a {
	display: block;
}
#recentchk ul li div {
	padding: 0 10px;
	text-align: left;
	font-size: 10px;
}
#recentchk ul li div > span {
	display: block;
}
#recentchk ul li span.price {
	color: #f00;
}
#recentchk .noflick {
	margin-bottom: 10px;
}
#recentchk .nohistory {
	padding: 10px;
}
#recentchk .other {
	padding: 10px 15px;
}
#recentchk li .item_price {
	padding: 0 10px;
	font-weight: bold;
}

#recentchk li .item_price em {
	font-style: normal;
	color: #f00;
}


/* インフォメーション
----------------------------------------------------*/
#sp-session #salepage .stit-bgred {
	margin-bottom: 0;
}

.pagelist li {
	background-color: #ffffff;
	border-bottom: solid 1px #bcbcbc;
}

.pagelist li:last-child { 
	margin-bottom: 0;
	border-bottom: 0;
}

.pagelist li a {
	position: relative;
	display: block;
}

.pagelist li a span {
	display: table-cell;
	width: 100%;
	height: 60px;
	padding: 0 25px 0 20px;
	vertical-align: middle;
}

.pagelist li a strong {
	font-size: 16px;
}

.pagelist li a span span {
	display: inline;
	width: auto;
	height: auto;
	padding: 0;
}

/* arrow */

.pagelist li a:after {
content: "";
position: absolute;
top: 50%;
right: 8px;
display: block;
width: 9px;
height: 14px;
margin-top: -7px;
background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat 0px 0px;
background-size: 50px 350px;
-moz-background-size: 50px 350px;
-webkit-background-size: 50px 350px;
}

.top-l .pagelist li a:after { background-position: 0 -25px;}
.top-m .pagelist li a:after { background-position: 0 -50px;}



/* インフォメーション
----------------------------------------------------*/
.infolist { margin: 0 0 15px; }

.infolist li {
	background-color: #ffffff;
	border-bottom: solid 1px #bcbcbc;
}

.infolist li:last-child { margin-bottom: 0; }

.infolist li a {
	position: relative;
	display: block;
}

.infolist li a span {
	display: table-cell;
	width: 100%;
	height: 60px;
	padding: 0 25px 0 60px;
	vertical-align: middle;
}

.infolist li a span span {
	display: inline;
	width: auto;
	height: auto;
	padding: 0;
}
.infolist li a span.font-s { font-size: 12px; }

/* icon */
.infolist li a:before {
	content: "";
	position: absolute;
	top: 5px;
	left: 7px;
	display: block;
	width: 49px;
	height: 49px;
	background: url(/voi/sp/webshop/spsale14_winter/img/spr_sale.png) 0 0;
	background-size: 124px 686px;
	-moz-background-size: 124px 686px;
	-webkit-background-size: 124px 686px;
}


.infolist li.info-wishshow a:before { background-position: -75px 0px; }
.infolist li.info-epos a:before { background-position: -75px -49px; }
.infolist li.info-salemail a:before { background-position: -75px -98px; }
.infolist li.info-okini a:before { background-position: -75px -147px; }
.infolist li.info-begiguide a:before { background-position: -75px -196px; }
.infolist li.info-presale a:before { background-position: -75px -248px; }

#information .boxlink {
	margin: 0 20px 15px;
	border: solid 1px #bcbcbc;
	background-color: #f5f5f5;
}

#information .boxlink a {
	position: relative;
	display: block;
	padding-left: 20px;
}

#information .boxlink a span {
	display: table-cell;
	height: 48px;
	vertical-align: middle;
}

/* arrow */

#information .boxlink a:after, .infolist li a:after {
content: "";
position: absolute;
top: 50%;
right: 8px;
display: block;
width: 9px;
height: 14px;
margin-top: -7px;
background: url(/voi/sp/images/tlmtop/common/icon_parts_sprites.png) no-repeat 0px 0px;
background-size: 50px 350px;
-moz-background-size: 50px 350px;
-webkit-background-size: 50px 350px;
}

.systemmsg { margin: 0 5px 15px; }


/* ニュースエリア
--------------------------------------------------- */

.newsarea { background-color: #ffffff; }
.news .newslist { padding: 10px 15px 25px; }

.newslist li p {
font-size: 12px;
display: table;
}

.newslist li span {
display: table-cell;
width: 3.5em
}

.newslist li a {
margin-right: 5px;
text-decoration: underline;
}

.newsarea h3 {
padding: 4px 0 4px 10px;
background-color: #d8317f;
color: #fff;
}

.ladiesnews h3 { background-color: #d8317f; }
.mensnews h3 { background-color: #403f89; }



/* タブ
--------------------------------------------------- */

.js-tabbox {
	position: relative;
	padding: 0 10px;
}

.js-tabbox:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 10px;
	height: 1px;
	background: #c9c9c9;
}
.js-tabbox:after {
	content: '';
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 10px;
	height: 1px;
	background: #c9c9c9;
}

.js-tabs {
	display: table;
	width: 100%;
	margin: 8px 0;
}
.js-tabs li {
	display: table-cell;
	width: 50%;
	text-align: center;
	font-weight: bold;
}

.js-tabs li a {
	position: relative;
	display: block;
	height: 37px;
	background: #fcfcfc;
		background: -moz-linear-gradient(top,  #fcfcfc 0%, #e1e1e1 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#e1e1e1));
		background: -webkit-linear-gradient(top,  #fcfcfc 0%,#e1e1e1 100%); /* Chrome10+,Safari5.1+ */
		background: linear-gradient(to bottom,  #fcfcfc 0%,#e1e1e1 100%); /* W3C */
	border-top: solid 1px #c9c9c9;
	border-right: solid 1px #c9c9c9;
	border-left: solid 1px #c9c9c9;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
		-webkit-border-top-left-radius: 3px;
		-webkit-border-top-right-radius: 3px;
		-moz-border-radius-topleft: 3px;
		-moz-border-radius-topright: 3px;
	font-size: 15px;
	font-weight: bold;
	vertical-align: middle;
}


.js-tabs li:nth-child(1) a {
	color: #d8307e;
	border-right:none;
}

.js-tabs li:nth-child(2) a {
	color: #242671;
}
 
.js-tabs li.act a {
	height: 36px;
	padding-top: 7px;
	background: #fff;	
	font-size: 15px;
}

.js-tabs li a span {
	display: inline-block;
	margin-top: 11px;
	text-align: center;
	vertical-align: middle;
}

.js-tabs li.act a span {
	margin-top: 10px;
}

.act-ladies li:nth-child(1).act a {
	color: #d8307e;
	border-right: solid 1px #c9c9c9;
	border-left: solid 1px #c9c9c9;
}

.act-ladies li:nth-child(2) a {
	border-left: none;
}

.act-mens li:nth-child(2).act a {
	color: #d8307e;
	border-right: solid 1px #c9c9c9;
	border-left: solid 1px #c9c9c9;
}

.act-mens li:nth-child(1) a {
	border-right: none;
}



/*--------------------------------------------------------------------------------------------------------

spsale TOP  赤対応 bodyにid「sp-red」

--------------------------------------------------------------------------------------------------------*/

#sp-red .main{ background-color: #e7002c;}

#sp-red .saleitem {
padding: 5px 5px;
margin: 0 10px 5px 10px;
background-color: #ffffff;
}

#sp-red .saleitem h2 { background-color: #e7002c;}
#sp-red .saleitem h2::before { border-top: 10px solid #e7002c;}

#sp-red .top-subtitle {	border-top: none;}

#sp-red #salenews { margin: 0 10px 5px 10px; }

#sp-red #salenews .mens.morelink { border-bottom:none; }

#sp-red #information { padding-top: 5px; margin: 0 10px 5px 10px; }

#sp-red .topagetop a {
	background: url(/voi/sp/webshop/spsale14_winter/img/b_pagetop_red.gif) no-repeat 0px 0;
	background-size: 14px 14px;
	-moz-background-size: 14px 14px;
	-webkit-background-size: 14px 14px;
	color: #fff;
}

#sp-red .systemmsg {
	margin: 0;
	padding: 15px 15px 15px;
	background-color: #e7002c;
	color: #fff;
}

#sp-red .topbanner{ width: 100%; background: #e7002c;}


/*--------------------------------------------------------------------------------------------------------

spsale 開催中対応 bodyにid「sp-session」

--------------------------------------------------------------------------------------------------------*/
#sp-session .stit-bgred,
#sp-session .saleitem h2 {
	margin-bottom: 13px;
	padding: 13px;
	background-color: #e6002b;
	text-align: left;
	color: #ffffff;
}

#sp-session #information .stit-bgred {
	padding: 8px 13px;
	background: #000;
}

#sp-session .saleitem h2::before {
	display: none;
}
#sp-session #information .stit-bgred {
	margin-bottom: 0;
}

