@charset "utf-8";

/* ¸ñ·Ï */
.list-wrap { overflow:hidden; line-height:20px; }
.list-wrap .txt-normal { letter-spacing:0; }
.list-wrap .txt-short { letter-spacing:-1px; padding-right:1px; }
.list-wrap .item-row { float:left; }
.list-wrap .item-image { position:relative; overflow:hidden; }
.list-wrap .item-content { padding-top:10px; margin:0px 4px; text-align:center; }
.list-wrap .item-star { text-align:center; overflow:hidden; letter-spacing:-1px; font-size:18px; line-height:20px; height:20px; margin-bottom:4px; }
.list-wrap .item-name { overflow:hidden; letter-spacing:-1px; padding-right:1px; text-align:center; font-size:14px; }
.list-wrap .item-text { font-size:12px; color:#888; }
.list-wrap .item-price { margin-top:4px; line-height:22px; }
.list-wrap .item-price b { font-size:16px; display:inline-block; margin:0px 4px; }
.list-wrap .item-price b i { font-size:12px; }
.list-wrap .item-price strike { color:#888; margin:0px 4px; font-size:14px; display:inline-block; }
.list-wrap .item-details { color:#888; margin-top:4px; padding:0px 1px; font-size:13px; text-align:center; }
.list-wrap .item-sp { margin:0px 4px; white-space:nowrap; }
.list-wrap .item-sp i { margin-right:2px; color:#888; }
.list-wrap .item-sns { margin-top:15px; text-align:center; }
.list-wrap .item-sns img { width:15%; max-width:34px; border-radius:50%; }
.list-none { margin:0px 0px 15px; padding:80px 0px; text-align:center; color:#888; }
.list-page { margin:30px 0px; }
.list-page .pagination { margin:0; }

.section-title { margin-top: 0px; font-weight: 700; font-size: 40px; }
	.ranking-list-nav { display: flex; justify-content: center; }
	.ranking-list-nav ul { display: flex; padding: 0;}
	.ranking-list-nav ul li { list-style: none; margin-left: 60px;}
	.ranking-list-nav ul li:first-child { margin-left: 0px; }
	.ranking-list-nav ul li:hover, .ranking-list-nav ul li:active { border-bottom: 3px solid #000000; }
	.list-nav-active { border-bottom: 3px solid #000000; }
	.list-nav-active a { color: #000 !important; }
	.ranking-list-nav ul li a:active { color: #333; font-weight: 700; }
	.ranking-list-nav ul li a {
		text-decoration: none;
	    color: #9b9b9b;
	    font-size: 24px;
	}
	.ul-ranking {
		display: flex;
    	flex-wrap: wrap;
    	padding: 0;
	}
	.li-ranking { 
		list-style: none;
		max-width: 20%;
   		margin: 20px 0 40px;
    	padding: 0 15px;
    	box-sizing: border-box; 
	}
	.item-ranking { position: relative; }
	.rank_span { 
		position: absolute;
		background-color: #000; 
		color: #fff;
	    width: 40px;
		height: 40px;
		text-align: center;
		line-height: 37px;
		z-index: 1;
		top: 0;
		left: 0;
	}
	.goods-ranking a { text-decoration: none; }
	.goods-ranking img { width: 100%; }
	.goods-info { display: flex; flex-direction: column; margin: 30px 0 0 !important; }
	.goods-ranking .goods-name { 
	    font-size: 20px;
   		font-weight: 600;
    	display: block;
    	margin-bottom: 15px;
    	color: #000;
    	text-overflow: ellipsis;
	    overflow: hidden;
	    word-break: break-word;
	    display: -webkit-box;
	    -webkit-line-clamp: 1;
	    -webkit-box-orient: vertical;
	}
	.goods-img { position: relative; }
	.goods-info { margin-left: 20px; }
  	.goods-code { display: block; font-size: 13px; color: #919191; margin-bottom: 5px; }
  	.goods-name {  }
  	.goods-txt {
  		text-overflow: ellipsis;
	    overflow: hidden;
	    word-break: break-word;
	    display: -webkit-box;
	    -webkit-line-clamp: 2;
	    -webkit-box-orient: vertical;
  	}
  	.goods-price {
		display: block;
    	font-weight: 700;
    	color: #000;
    	font-size: 18px;
  	}
  	@media (max-width: 990px) {
  		.li-ranking { max-width: 33%; }
  		.ranking-list-nav ul li { margin-left: 40px; }
  		.ranking-list-nav ul li a { font-size: 20px; }
  	}
  	@media (max-width: 772px) {
  		.li-ranking { max-width: 50%; }
  	}
  	@media (max-width: 640px) {
  		.ranking-list-nav { margin-top: 20px; }
  		.ranking-list-nav ul li { margin-left: 16px; }
  		.ranking-list-nav ul li a { font-size: 16px; }
  	}