@charset "UTF-8";

/* ==========================================================================
#tl_coordinate
========================================================================== */

/*
 * reset
 */

#tl_coordinate_container body,#tl_coordinate_container div,#tl_coordinate_container p,#tl_coordinate_container h1,#tl_coordinate_container h2,#tl_coordinate_container h3,#tl_coordinate_container h4,#tl_coordinate_container ol,#tl_coordinate_container ul,#tl_coordinate_container li,#tl_coordinate_container dl,#tl_coordinate_container dt,#tl_coordinate_container dd ,#tl_coordinate_container a {
	margin:0;
	padding:0;
	}

#tl_coordinate_container h1,#tl_coordinate_container h2,#tl_coordinate_container h3,#tl_coordinate_container h4{
	text-indent: 0;
	overflow: visible;
}

#tl_coordinate_container ol,#tl_coordinate_container ul {
	list-style-type:none;
	}

#tl_coordinate_container table {
	border-collapse: collapse;
	border-spacing: 0;
}

#tl_coordinate_container a img,#tl_coordinate_container :link img,#tl_coordinate_container :visited img {
	border: 0;
}

#tl_coordinate_container img {
	border:0;
	vertical-align:top;
}

#tl_coordinate_container em {
	font-style: normal;
}

/*
 * clearfix
 */

#tl_coordinate .clearfix:before,
#tl_coordinate .clearfix:after{content:"";display:table;}
#tl_coordinate .clearfix:after{clear:both;}
#tl_coordinate .clearfix{*zoom:1;}

#tl_coordinate .tl_coordinate_tit:before,
#tl_coordinate .tl_coordinate_tit:after{content:"";display:table;}
#tl_coordinate .tl_coordinate_tit:after{clear:both;}
#tl_coordinate .tl_coordinate_tit{*zoom:1;}

/*
 * tl_coordinate{
 */

#tl_coordinate_container #tl_coordinate{
margin: 20px 0 30px;
width:950px;
clear: right;
}
/* invalidation float option style float解除用オプション */
#tl_coordinate_container #tl_coordinate.invldFloat{
float: none;
}
#m_checkoutComp #tl_coordinate_container #tl_coordinate{
margin: 20 0 30px;
width:950px;
padding-top: 9px;
border-top: 1px solid #666666;
}

#tl_coordinate_container #tl_coordinate .heading{
position:relative;
font-size: 14px;
/*font-weight: bold;*/
text-align: left;
padding: 0 0 0px;
color: #000;
border-bottom: 1px solid #000;
background: none;
height: auto;
text-indent: 0;
clear: both;
}
/*kids top heading style*/
#tl_coordinate_container #tl_coordinate .heading.hdg02{
font-size: 20px;
font-weight: normal;
padding: 0;
border-bottom: none;
}
/*shoes,bag top heading style*/
#tl_coordinate_container #tl_coordinate .heading.hdg03{
font-size: 18px;
padding: 0 0 0 10px;
border-bottom: none;
border-left: 1px solid #000;
}
/* ladies and mens shoes top heading style*/
#tl_coordinate_container #tl_coordinate .heading.hdg04{
font-size: 20px;
/*font-weight: bold;*/
padding: 2px 0 2px 10px;
border-bottom: none;
border-left: 1px solid #b6b6b6;
}
/* complete payment heading style*/
#tl_coordinate_container #tl_coordinate .heading.hdg05{
font-size: 16px;
/*font-weight: bold;*/
padding: 0 0 0 15px;
border-bottom: none;
border-left: 5px solid #666666;
}
/* ttop mtop ltop heading style */
#tl_coordinate_container #tl_coordinate .heading.hdg06{
font-size: 16px;
border-bottom: 2px solid #000;
height:15px;
font-weight:normal!important;
}

#tl_coordinate_container #tl_coordinate .heading .pager{
font-size:12px;
font-weight:normal;
position:absolute;
top:5px!important;
right:0px;
}

#tl_coordinate_container #tl_coordinate .inner{
margin-top:10px;
padding:5px 0;
position:relative;
}

#tl_coordinate_container #tl_coordinate .container{
overflow:hidden;
}

/* clearfix */
#tl_coordinate_container #tl_coordinate .tl_coordinate_items:before,
#tl_coordinate_container #tl_coordinate .tl_coordinate_items:after{content:"";display:table;}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items:after{clear:both;}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items{*zoom:1;}

#tl_coordinate_container #tl_coordinate .tl_coordinate_items > li{
float:left;
width:182px;
margin-right:10px;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items a{
display: block;
color:#333;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items a:hover{
color:#d20000;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items .image img{
width: 182px;
height: 218px;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items .name{
font-size: 12px;
margin-top:8px;
line-height: 120%;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items .view{
display:block;
font-size: 12px;
padding-top: 8px;
color: #999;
line-height: 120%;
}
#tl_coordinate_container #tl_coordinate .tl_coordinate_items .view em{
/*font-weight: bold;*/
font-style: normal;
padding-left: 3px;
}

/* slide list style (.more_box) */
#tl_coordinate_container #tl_coordinate.more_box .tl_coordinate_items{
margin: 0;
width:960px;
font-size: 10px;
line-height: 120%;
}
#tl_coordinate_container #tl_coordinate.more_box .tl_coordinate_items > li{
margin-top:20px;
}
#tl_coordinate_container #tl_coordinate.more_box .tl_coordinate_items > li .image a{
display: block;
}
#tl_coordinate_container #tl_coordinate.more_box .btnMore{
display: block;
text-align: center;
width: 122px;
margin: 20px auto;
padding: 10px 40px 10px 20px;
background: #f5f5f5;
}
#tl_coordinate_container #tl_coordinate.more_box .btnMore span{
position: relative;
padding: 15px 0 15px 0;
color: #4c4c4c;
font-size: 13px;
}
#tl_coordinate_container #tl_coordinate.more_box .btnMore span:after{
content: "";
position: absolute;
top: 18px;
right: -25px;
display: block;
width: 20px;
height: 10px;
background-image: url(https://voi.0101.co.jp/voi/content/dam/01/exclusivepage/index/pc/css_parts/icon_arrow_flex_02.png);
background-repeat: no-repeat;
background-position: 0px -10px;
background-size: 20px 20px;
}
#tl_coordinate_container #tl_coordinate.more_box .btnMore.open span:after{
background-position: 0 0;
}

/* tl_coordinate_items (.carousel) */
#tl_coordinate_container #tl_coordinate.carrousel .container{
width:950px;
margin:0 auto;
}

#tl_coordinate_container #tl_coordinate.carrousel .tl_coordinate_items{
margin:0;
width:9999px;
font-size: 10px;
line-height: 120%;
}

/* carousel navigation button */
*+html #tl_coordinate_container #tl_coordinate.carrousel .btnAction{
height:0;
}
/* white-black default nav arrow style */
#tl_coordinate_container #tl_coordinate.carrousel .button .ir {
margin-right: auto;
margin-left: auto;
background-image: url(https://voi.0101.co.jp/voi/content/dam/01/exclusivepage/index/pc/css_parts/btn_arrow_carousel.png);
background-repeat: no-repeat;
vertical-align: middle;
text-indent: -9999px;
cursor: pointer;
}
/* black-white nav arrow style */
#tl_coordinate_container #tl_coordinate.carrousel .button .ir.arrow02 {
background-image: url(https://voi.0101.co.jp/voi/content/dam/01/exclusivepage/index/pc/css_parts/btn_arrow_carousel02.png);
}
/* white-black angle brackets nav arrow style */
#tl_coordinate_container #tl_coordinate.carrousel .button .ir.arrow03 {
background-image: url(https://voi.0101.co.jp/voi/content/dam/01/exclusivepage/index/pc/css_parts/btn_arrow_carousel03.png);
}

#tl_coordinate_container #tl_coordinate.carrousel .container{
position: relative;
}

#tl_coordinate_container #tl_coordinate.carrousel .prev{
background-position: 0px 0px;
height: 60px;
width: 20px;
position:absolute;
top:109px; /* top = image height / 2 */
left:0;
margin-top: -30px;
}

#tl_coordinate_container #tl_coordinate.carrousel .next{
background-position: -20px 0px;
height: 60px;
width: 20px;
position:absolute;
top:109px; /* top = image height / 2 */
right:0;
margin-top: -30px;
}

#tl_coordinate_container #tl_coordinate.carrousel a.prev:hover,
#tl_coordinate_container #tl_coordinate.carrousel a.next:hover{
opacity:.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}

/* -----------------------------------
		item count option style
----------------------------------- */
/* items x 4 */
#tl_coordinate_container #tl_coordinate.itemCol4 .tl_coordinate_items > li{
width:230px;
}
#tl_coordinate_container #tl_coordinate.itemCol4 .tl_coordinate_items .image img{
width: 230px;
height: 275px;
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol4 .prev{
top:137px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol4 .next{
top:137px; /* top = image height / 2 */
}
/* items x 5 */
#tl_coordinate_container #tl_coordinate.itemCol5 .tl_coordinate_items > li{
width:182px;
}
#tl_coordinate_container #tl_coordinate.itemCol5 .tl_coordinate_items .image img{
width: 182px;
height: 218px;
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol5 .prev{
top:109px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol5 .next{
top:109px; /* top = image height / 2 */
}
/* items x 6 */
#tl_coordinate_container #tl_coordinate.itemCol6 .tl_coordinate_items > li{
width:150px;
}
#tl_coordinate_container #tl_coordinate.itemCol6 .tl_coordinate_items .image img{
width: 150px;
height: 180px;
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol6 .prev{
top:90px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.itemCol6 .next{
top:90px; /* top = image height / 2 */
}

/* column style option : 3column  */
#tl_coordinate_container #tl_coordinate.more_box.w571{
width:571px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571 .tl_coordinate_items{
width:571px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571 .tl_coordinate_items > li{
width: 183px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571 .tl_coordinate_items .image img{
width: 183px;
height: 220px;
}

#tl_coordinate_container #tl_coordinate.carrousel.w571{
width:571px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.carrousel .container{
width:571px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571 .tl_coordinate_items > li{
float:left;
width:187px;
margin-right: 5px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571 .tl_coordinate_items .image img{
width: 187px;
height: 227px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571 .prev{
top:114px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w571 .next{
top:114px; /* top = image height / 2 */
}

/* column style option : 3column : more_box : item count style option  */
/* item x 4 */
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol4 .tl_coordinate_items > li{
width: 135px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol4 .tl_coordinate_items .image img{
width: 135px;
height: 162px;
}
/* item x 5 */
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol5 .tl_coordinate_items > li{
width: 106px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol5 .tl_coordinate_items .image img{
width: 106px;
height: 127px;
}
/* item x 6 */
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol6 .tl_coordinate_items > li{
width: 86px;
}
#tl_coordinate_container #tl_coordinate.more_box.w571.itemCol6 .tl_coordinate_items .image img{
width: 86px;
height: 103px;
}

/* column style option : 3column : carrousel : item count style option  */
/* item x 4 */
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol4 .tl_coordinate_items > li{
width:139px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol4 .tl_coordinate_items .image img{
width: 139px;
height: 166px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol4 .prev{
top:88px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol4 .next{
top:88px; /* top = image height / 2 */
}
/* item x 5 */
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol5 .tl_coordinate_items > li{
width:110px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol5 .tl_coordinate_items .image img{
width: 110px;
height: 132px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol5 .prev{
top:66px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol5 .next{
top:66px; /* top = image height / 2 */
}
/* item x 6 */
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol6 .tl_coordinate_items > li{
width:91px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol6 .tl_coordinate_items .image img{
width: 91px;
height: 109px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol6 .prev{
top:54px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w571.itemCol6 .next{
top:54px; /* top = image height / 2 */
}

/* column style option : 2column */
#tl_coordinate_container #tl_coordinate.w780{
float: right;
}
#tl_coordinate_container #tl_coordinate.more_box.w780{
width:780px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780 .tl_coordinate_items{
width:790px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780 .tl_coordinate_items > li{
width: 187px;
}
/*#tl_coordinate_container #tl_coordinate.more_box.w780 .tl_coordinate_items > li:nth-child(5n + 1){
margin-left: 10px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780 .tl_coordinate_items > li:nth-child(4n + 1){
margin-left: 0;
}*/
#tl_coordinate_container #tl_coordinate.more_box.w780 .tl_coordinate_items .image img{
width: 187px;
height: 224px;
}

#tl_coordinate_container #tl_coordinate.carrousel.w780{
width:780px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.carrousel .container{
width:780px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780 .tl_coordinate_items > li{
float:left;
width:148px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780 .tl_coordinate_items > li{
width:187px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780 .tl_coordinate_items .image img{
width: 187px;
height: 224px;
}

/* column style option : 2column : more_box : item count style option  */
/* item x 4 */
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol4 .tl_coordinate_items > li{
width: 187px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol4 .tl_coordinate_items .image img{
width: 187px;
height: 224px;
}
/* item x 5 */
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol5 .tl_coordinate_items > li{
width: 148px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol5 .tl_coordinate_items .image img{
width: 148px;
height: 177px;
}
/* item x 6 */
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol6 .tl_coordinate_items > li{
width: 121px;
}
#tl_coordinate_container #tl_coordinate.more_box.w780.itemCol6 .tl_coordinate_items .image img{
width: 121px;
height: 145px;
}

/* column style option : 2column : carrousel : item count style option  */
/* item x 4 */
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol4 .tl_coordinate_items > li{
width:187px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol4 .tl_coordinate_items .image img{
width: 187px;
height: 224px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol4 .prev{
top:112px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol4 .next{
top:112px; /* top = image height / 2 */
}
/* item x 5 */
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol5 .tl_coordinate_items > li{
width:148px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol5 .tl_coordinate_items .image img{
width: 148px;
height: 177px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol5 .prev{
top:88px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol5 .next{
top:88px; /* top = image height / 2 */
}
/* item x 6 */
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol6 .tl_coordinate_items > li{
width:121px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol6 .tl_coordinate_items .image img{
width: 121px;
height: 145px;
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol6 .prev{
top:72px; /* top = image height / 2 */
}
#tl_coordinate_container #tl_coordinate.carrousel.w780.itemCol6 .next{
top:72px; /* top = image height / 2 */
}

/*carousel moreLink*/
#tl_coordinate_container #tl_coordinate.carrousel .moreLink{
font-size: 12px;
text-align: right;
}
#tl_coordinate_container #tl_coordinate.carrousel .moreLink a{
display: inline-block;
margin-top: 10px;
padding-right: 10px;
color: #00C;
position: relative;
}
#tl_coordinate_container #tl_coordinate.carrousel .moreLink a:after{
content: "";
position: absolute;
display: block;
width: 5px;
height: 10px;
top: 50%;
right: 0;
margin-top: -5px;
background-image: url(https://voi.0101.co.jp/voi/content/dam/01/exclusivepage/index/pc/css_parts/icon_arrow_flex_03.png);
background-repeat: no-repeat;;
background-position: -5px 0;
-webkit-background-size: 10px 10px;
background-size: 10px 10px;
}


/* ==========================================================================
   recommend coordinate page styles
   ========================================================================== */

/* clearfix */
#tl_coordinate_list .tl_boxCoordinate .items:before,
#tl_coordinate_list .tl_boxCoordinate .items:after{content:"";display:table;}
#tl_coordinate_list .tl_boxCoordinate .items:after{clear:both;}
#tl_coordinate_list .tl_boxCoordinate .items{*zoom:1;}

#tl_coordinate_list .tl_boxCoordinate .items {
margin: 0 15px 0 5px;
padding: 0;
}
#tl_coordinate_list .tl_boxCoordinate .items + .items {
border-top: none;
}
#tl_coordinate_list .tl_boxCoordinate .items > li {
float:left;
position:relative;
width: 176px;
margin-left: 10px;
padding-top:33px;
}
#tl_coordinate_list .tl_boxCoordinate .items > li > .image:hover{
width:176px;
}
#tl_coordinate_list .tl_boxCoordinate .items .image{
width: 176px;
height: 211px;
}
#tl_coordinate_list .tl_boxCoordinate .items a{
display:block;
}
#tl_coordinate_list .tl_boxCoordinate .items a:hover{
border:3px solid #ccc;
}
#tl_coordinate_list .tl_boxCoordinate .items a:hover .image{
position:relative;
z-index:-1;
margin:-3px;
}
#tl_coordinate_list .tl_boxCoordinate > li:hover{
z-index:1;
}
#tl_coordinate_list .tl_boxCoordinate p{
margin:5px 0;
}
#tl_coordinate_list .tl_boxCoordinate .name{
margin: 5px 0;
}
#tl_coordinate_list .tl_boxCoordinate .view{
color: #999;
margin: 5px 0;
}
#tl_coordinate_list .tl_boxCoordinate .view em{
font-style: normal;
}

/* tab style */
#tl_add_tab{
margin: 20px 0 0;
}
#tl_add_tab .tl_tab_recommend {
display:table;
}
#tl_add_tab .tl_tab_recommend li {
display:table-cell;
padding: 10px 30px;
text-align: center;
vertical-align: middle;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
border-left: 1px solid #ccc;
}
#tl_add_tab .tl_tab_recommend li:first-child {
border-left: none;
}
#tl_add_tab .tl_tab_recommend li a {
display: block;
color: #ababab;
}
#tl_add_tab .tl_tab_recommend li h2{
display: block;
color: #2d2d2d;
}
#tl_add_tab .tl_tab_recommend li span {
display: inline-block;
font-size: 16px;
/*font-weight: bold;*/
line-height: 1.3;
letter-spacing: 4px;
text-align: center;
padding: 0 5px 5px;
}
#tl_add_tab .tl_tab_recommend li h2 span {
border-bottom: 3px solid #2d2d2d;
}

/* ==========================================================================
   ranking option styles
   ========================================================================== */

#tl_coordinate .tl_coordinate_items li a{
position: relative;
}
#tl_coordinate .tl_coordinate_items li .rank{
position: absolute;
top: 5px;
right: 5px;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 10px;
width: 20px;
height: 15px;
padding-top: 5px;
background: #999;
}
#tl_coordinate .tl_coordinate_items li:first-child .rank{
background: #d6c684;
}
#tl_coordinate .tl_coordinate_items li:nth-child(2) .rank{
background: #c7c7c7;
}
#tl_coordinate .tl_coordinate_items li:nth-child(3) .rank{
background: #c29066;
}
#tl_coordinate .tl_coordinate_items li .rank em{
display: inline-block;
font-size: 10px;
color: #fff;
}