@charset "utf-8";


.fs-l-main {
	padding: 0;
}


/* --------------------------------------------------------------------------------
	indexメイン
-------------------------------------------------------------------------------- */
#index{
	
}

/* --------------------------------------------------------------------------------
	スライダー（コマースクリエイター）
-------------------------------------------------------------------------------- */
.fs-body-top .parts-slider-main {
	overflow: hidden;
	padding: 0 0 8vw;
}
.fs-body-top .parts-slider-main .slider-main-box {
	position: relative;
}

.fs-body-top .slider-for-sp .slick-track a{
	display: block;
}
.fs-body-top .slider-for-sp .slick-track img{
	display: block;
	max-width: 100%;
}

/********** スライダーバナーなど **********/
.fs-body-top .slider-for-sp .slick-track .slide-item {
	padding: 2vw 0 2vw;
}
.fs-body-top .slider-for-sp .slick-track .slide-item .slide-item-box {
}
.fs-body-top .slider-for-sp .slick-track .slide-item a{
	display: block;
}
.fs-body-top .slider-for-sp .slick-track .slide-item img{
	display: block;
	max-width: 100%;
}


/***** スライダーボタン *****/
.fs-body-top .slider-btns{
	position: absolute;
	z-index: 1;
	top: 50%;
	
	width: 100%;
}
.fs-body-top .parts-slider-main .slick-prev,
.fs-body-top .parts-slider-main .slick-next {
	position: absolute;
	cursor: pointer;
	
	width: 6vw;
	height: 20vw;
	margin-top: -10vw;
	
	line-height: 1;
	opacity: 1;
	
	font-size: 1px;
	text-indent: -9999px;
	border: none;
}
.fs-body-top .parts-slider-main .slick-prev{
	left: 0;
	background: url("../images/index/btn-slider-prev.png") no-repeat 50% 50%;
	background-size: 50% auto;
}
.fs-body-top .parts-slider-main .slick-next{
	right: 0;
	background: url("../images/index/btn-slider-next.png") no-repeat 50% 50%;
	background-size: 50% auto;
}


/********** スライダーサムネイル **********/
.fs-body-top .slider-thunbnail {
	width: 100%;
	padding: 0 0 0 4vw;
}
.fs-body-top .slider-nav-sp .slick-track {
	width: 100%!important;
	left: 0!important;
}
.fs-body-top .slider-nav-sp .slick-track .slide-item {
	width: 23.5vw;
}
.fs-body-top .slider-nav-sp .slick-track .slide-item .slide-item-box {
	width: 21.5vw;
}







/* --------------------------------------------------------------------------------
	RANKING
-------------------------------------------------------------------------------- */
#index .ranking {
	margin: 0 0 14vw;
	padding: 9vw 0 15vw;
	background: #f2f2f2;
}
#index .ranking h2 {
	padding: 0 0 5vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .ranking h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .ranking h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}


/* ----------------------------------------
メンズ・レディースタブ
---------------------------------------- */
#index .tab-mens-ladies {
	padding: 0 4vw 6vw;
}
#index .tab-mens-ladies ul {
	display: flex;
	justify-content: space-between;
	
	width: 100%;
}
#index .tab-mens-ladies ul li {
	width: 48%;
}
#index .tab-mens-ladies ul li .tab-btn {
	padding: 2vw 0;
	border-bottom: solid 0.3vw #9a9a9a;
	text-align: center;
	font-weight: bold;
	font-size: 4vw;
	color: #9a9a9a;
	
	cursor: pointer;
}
/* アクティブ時 */
#index .tab-mens-ladies ul li.active-tab-btn .tab-btn {
	color: #4c4c4c;
	border-bottom: solid 0.5vw #4c4c4c;
}


/* ----------------------------------------
メンズ・レディースタブの表示非表示
---------------------------------------- */
#index .tab-area {
	display: none;
}

/* アクティブ時 */
#index .tab-area.active-tab {
	display: block;
}


/* ----------------------------------------
カテゴリータブボタン
---------------------------------------- */
#index .tab-nav {
	padding: 0 0 4vw;
}
#index .tab-nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
	width: 100%;
}
#index .tab-nav ul li {
	margin: 0 2.5vw 1.5vw;
	padding: 1vw 2vw;
	border: solid 0.2vw rgba(0,0,0,0);
	
	cursor: pointer;
	
	font-size: 3.6vw;
}
#index .tab-nav ul li.tab-cat-btn-active {
	border: solid 0.2vw #9a9a9a;
	font-weight: bold;
}


/********** フューチャーレコメンド表示部分 **********/
#index .ranking .tabs .recommend-ranking-sp {
	padding: 0 7vw;
}
#index .ranking .tabs .recommend-ranking-sp ul {
}
#index .ranking .tabs .recommend-ranking-sp ul li {
	position: relative;

	width: 36.5vw;
}
#index .ranking .tabs .recommend-ranking-sp ul li:last-child {
	margin-right: 0;
}
#index .ranking .tabs .recommend-ranking-sp ul li a {
	position: relative;
	
	display: block;
	width: 35vw;
	text-decoration: none;
	font-size: 3.4vw;
}
#index .ranking .tabs .recommend-ranking-sp ul li::before {
	display: flex;
	justify-content: center;
	align-items: center;

	border-radius: 10vw;

	width: 6vw;
	height: 6vw;
	margin: 0 0 1vw;
	font-size: 4vw;
	font-family: 'Tenor Sans', sans-serif;
	font-weight: 400;
	color: #fff;
}
#index .ranking .tabs .recommend-ranking-sp ul li:nth-of-type(1)::before {
	content: '1';
	background: #cda000;
}
#index .ranking .tabs .recommend-ranking-sp ul li:nth-of-type(2)::before {
	content: '2';
	background: #777;
}
#index .ranking .tabs .recommend-ranking-sp ul li:nth-of-type(3)::before {
	content: '3';
	background: #ac5d00;
}
#index .ranking .tabs .recommend-ranking-sp ul li:nth-of-type(4)::before {
	content: '4';
	background: #000;
}
#index .ranking .tabs .recommend-ranking-sp ul li:nth-of-type(5)::before {
	content: '5';
	background: #000;
}
#index .ranking .tabs .recommend-ranking-sp ul li .item-thumb {
	padding: 0 0 2vw;
}
#index .ranking .tabs .recommend-ranking-sp ul li img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* 税込み */
#index .ranking .tabs .recommend-ranking-sp ul li .txt-tax {
	font-size: 3vw;
}


/* ----------------------------------------
ランキングスライダー
---------------------------------------- */
/***** スライダーボタン *****/
#index .ranking .tabs .slider-btns {
	position: absolute;
	z-index: 1;
	top: 50%;
	
	width: 100%;
}
#index .ranking .tabs .slick-prev,
#index .ranking .tabs .slick-next {
	position: absolute;
	cursor: pointer;
	
	width: 7vw;
	height: 8vw;
	margin-top: -4vw;
	
	line-height: 1;
	opacity: 1;
	
	font-size: 1px;
	text-indent: -9999px;
	border: none;
}
#index .ranking .tabs .slick-prev{
	left: -7vw;
	background: url("../images/index-device/icon-arrow-l.svg") no-repeat 50% 50%;
	background-size: 2.4vw auto;
}
#index .ranking .tabs .slick-next{
	right: -7vw;
	background: url("../images/index-device/icon-arrow-r.svg") no-repeat 50% 50%;
	background-size: 2.4vw auto;
}


/* --------------------------------------------------------------------------------
	NEW ITEM
-------------------------------------------------------------------------------- */
#index .new-item {
	padding: 0 0 15vw;
}
#index .new-item h2 {
	padding: 0 0 8vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .new-item h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .new-item h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}


#index .new-item-list {
	padding: 0 7vw;
}


/* ----------------------------------------
カテゴリータブ
---------------------------------------- */
#index .tabs .tabs-box {
	display: block;
}
#index .tabs .tabs-box.active-cat-tab {
	display: block;
}


/* ----------------------------------------
ランキングカテゴリータイトル
---------------------------------------- */
#index .tabs-box {
    margin-bottom: 3em;
}
#index .tabs-box h3 {
    text-align: center;
    margin: 0 1em 1em;
    font-weight: bold;
    font-size: 120%;
}




/********** フューチャーレコメンド表示部分 **********/
#index .new-item .recommend-new_item-sp ul {
}
#index .new-item .recommend-new_item-sp ul li {
	position: relative;

	width: 36.5vw;
}
#index .new-item .recommend-new_item-sp ul li:last-child {
	margin-right: 0;
}
#index .new-item .recommend-new_item-sp ul li a {
	position: relative;
	
	display: block;
	width: 35vw;
	text-decoration: none;
	font-size: 3.4vw;
}

#index .new-item .recommend-new_item-sp ul li .item-thumb {
	padding: 0 0 2vw;
}
#index .new-item .recommend-new_item-sp ul li img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* 税込み */
#index .new-item .recommend-new_item-sp ul li .txt-tax {
	font-size: 3vw;
}


/* ----------------------------------------
新着商品スライダー
---------------------------------------- */
/***** スライダーボタン *****/
#index .new-item .slider-btns {
	position: absolute;
	z-index: 1;
	top: 50%;
	
	width: 100%;
}
#index .new-item .slick-prev,
#index .new-item .slick-next {
	position: absolute;
	cursor: pointer;
	
	width: 7vw;
	height: 8vw;
	margin-top: -4vw;
	
	line-height: 1;
	opacity: 1;
	
	font-size: 1px;
	text-indent: -9999px;
	border: none;
}
#index .new-item .slick-prev{
	left: -7vw;
	background: url("../images/index-device/icon-arrow-l.svg") no-repeat 50% 50%;
	background-size: 2.4vw auto;
}
#index .new-item .slick-next{
	right: -7vw;
	background: url("../images/index-device/icon-arrow-r.svg") no-repeat 50% 50%;
	background-size: 2.4vw auto;
}






/* --------------------------------------------------------------------------------
	STYLE
-------------------------------------------------------------------------------- */
#index .style {
	padding: 10vw 0 0;
	background: #f2f2f2;
}
#index .style h2 {
	padding: 0 0 5vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .style h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .style h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}


#index .style .style-box {
	padding: 0 0 6vw;
}


/********** 中見出し **********/
#index .style h3 {
	padding: 0 0 5vw;
	text-align: center;
	font-size: 4vw;
}


/********** スタイルリスト **********/
#index .style .style-list {
	padding: 0 4vw;
}
#index .style ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
	width: 100%;
}
#index .style ul li {
	display: flex;
	width: 43vw;
	margin: 0 6vw 3vw 0;
}
#index .style ul li:nth-of-type(2n),
#index .style ul li:last-child {
	margin-right: 0;
}
#index .style ul li a {
	display: flex;
	justify-content: center;
	align-items: center;

	width: 100%;
	border-radius: 1.8vw;
	border: solid 1px #fff;
	
	text-decoration: none;
	overflow: hidden;
	color: #333;
	background: #fff;
	
	font-size: 3.6vw;
	letter-spacing: -0.14em;
}
#index .style ul li.list-type-2 a {
	/* 左右2個ずつ偶数の時は高さが画像サムネイルのある高さに調整されますが、
	最後1個（奇数）になったときはコメントアウトを外して、調整してください */
	/*
	padding: 6vw 0;
	*/
}
#index .style ul li a .style-img {
	width: 129px;
}
#index .style ul li a .style-img .img {
	display: block;
	height: auto;
}
#index .style ul li a .style-label {
	display: flex;
	align-items: center;
	
	width: 139px;
	padding: 0 16px;
}



/* --------------------------------------------------------------------------------
	SCENE
-------------------------------------------------------------------------------- */
#index .scene {
	padding: 15vw 0 4vw;
}
#index .scene h2 {
	padding: 0 0 6vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .scene h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .scene h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}

#index .scene .scene-box {
	padding: 0 0 9vw;
}

/********** シーンバナー **********/
#index .scene .bnr {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 100%;
	height: 40vw;
	margin: 0 0 6.5vw;
}
/* リンク */
#index .scene .bnr a:hover{
	text-decoration: none;
}
/* レディース */
#index .scene .bnr-ladies {
	background: url("../images/index/img-kanban-l.jpg") no-repeat 0 0;
	background-size: 132% auto;
}
/* メンズ */
#index .scene .bnr-mens {
	background: url("../images/index/img-kanban-m.jpg") no-repeat 0 0;
	background-size: 132% auto;
}

/* 文字 */
#index .scene .bnr .bnr-label {
	width: 52vw;
	padding: 4vw 0;
	border-radius: 1.5vw;
	line-height: 1.2;
	text-align: center;
	background: rgba(255,255,255,0.8);
	color: #4c4c4c;
}
#index .scene .bnr .bnr-label-en {
	padding: 0 0 0.2vw;
	font-size: 5.6vw;
}
#index .scene .bnr .bnr-label-ja {
	font-size: 4vw;
}


/********** シーンリスト **********/
#index .scene ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
	width: 100%;
}
#index .scene ul li {
	width: 43vw;
	margin: 0 6vw 3vw 0;
}
#index .scene ul li:nth-of-type(2n),
#index .scene ul li:last-child {
	margin-right: 0;
}
#index .scene ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 100%;
	padding: 3vw 0;
	border-radius: 0.8vw;
	
	text-decoration: none;
	overflow: hidden;
	color: #fff;
	background: #9a9a9a;
	letter-spacing: 0.05em;
	
	font-size: 4vw;
	/*font-weight: bold;*/
}



/* --------------------------------------------------------------------------------
	BRAND
-------------------------------------------------------------------------------- */
#index .list-brand {
	margin: 0 0 14vw;
	padding: 9vw 0 5vw;
	background: #f2f2f2;
}
#index .list-brand h2 {
	padding: 0 0 6vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .list-brand h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .list-brand h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}
#index .list-brand ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
	width: 100%;
}
#index .list-brand ul li {
	width: 27vw;
	margin: 0 5.5vw 5.5vw 0;
}
#index .list-brand ul li:nth-of-type(3n),
#index .list-brand ul li:last-child {
	margin-right: 0;
}
#index .list-brand ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 27vw;
	height: 27vw;
	border-radius: 1.6vw;
	
	text-align: center;
	text-decoration: none;
	overflow: hidden;
	background: #fff;
	
	font-size: 3.6vw;
}
#index .list-brand ul li img {
	display: block;
	
	width: 20.5vw;
	height: auto;
}



/* --------------------------------------------------------------------------------
	FEATURE
-------------------------------------------------------------------------------- */
#index .feature {
	padding: 0 4vw 70px;
}
#index .feature h2 {
	padding: 0 0 8vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .feature h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .feature h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}
#index .feature ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .feature ul li {
	width: 45%;
	padding: 0 0 4vw;
}
#index .feature ul li a {
	display: block;
}
#index .feature ul li a .bnr {
	padding: 0 0 0.5vw;
}
#index .feature ul li a img {
	display: block;
}



/* --------------------------------------------------------------------------------
	NEWS
-------------------------------------------------------------------------------- */
#index .list-news {
	margin: 0 0 20vw;
	padding: 0 4vw;
}
#index .list-news h2 {
	padding: 0 0 8vw;
	text-align: center;
	font-size: 7.2vw;
	color: #4c4c4c;
}
#index .list-news h2 .label-en {
	display: block;
	padding: 0 0 1vw;
}
#index .list-news h2 .label-ja {
	display: block;
	font-size: 3.4vw;
}
#index .list-news .list-news-box {
	padding: 0 0 6vw;
}
#index .list-news ul {
	display: flex;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .list-news ul li {
	display: flex;
	justify-content: space-between;
	
	width: 100%;
	padding: 2vw 0;
	border-bottom: solid 1px #dcdcdc;
	line-height: 1.6;
}
#index .list-news ul li .news-date {
	display: block;
	
	width: 29vw;
	padding: 0 0 0 1vw;
	font-size: 3.2vw;
	font-weight: 600;
	color: #666;
}
#index .list-news ul li .news-title {
	width: calc(100% - 29vw);
}
#index .list-news ul li .news-title a {
	display: block;
	font-size: 3.6vw;
}

/* お知らせトップへ */
#index .list-news .btn-details {
	display: flex;
	
	width: 100%;
}
#index .list-news .btn-details a {
	display: block;
	
	width: 60vw;
	margin: 0 auto;
	padding: 3.5vw 0;
	border-radius: 30vw;
	text-decoration: none;
	text-align: center;
	font-size: 4vw;
	color: #fff;
	background: #9a9a9a;
}




/* --------------------------------------------------------------------------------
	SNS
-------------------------------------------------------------------------------- */
#index .list-sns {
	padding: 0 0 25vw;
}
#index .list-sns h2 {
	padding: 0 0 8vw;
	text-align: center;
	font-size: 6.4vw;
	color: #4c4c4c;
}
#index .list-sns h2 .label-en {
	display: block;
}
#index .list-sns ul {
	display: flex;
	justify-content: center;
	
	width: 100%;
}
#index .list-sns ul li {
	width: 12vw;
	margin: 0 2.5vw;
}
#index .list-sns ul li a {
	display: flex;
	justify-content: center;
	
	width: 100%;
}
#index .list-sns ul li img {
	display: block;
	height: auto;
}
#index .list-sns ul li.list-sns-instagram img {
	width: 9vw;
}
#index .list-sns ul li.list-sns-youtube img {
	width: 9vw;
}
#index .list-sns ul li.list-sns-facebook img {
	width: 5vw;
}
#index .list-sns ul li.list-sns-x img {
	width: 8vw;
}
#index .list-sns ul li.list-sns-line img {
	width: 9.5vw;
}








