﻿@charset "utf-8";

/* slick
---------------------------------------*/


.slick-slider{max-width:100vw;overflow:hidden;}
.slick-dots{display:block;text-align:center;}
.slick-dots li{display: inline-block !important;margin:0 5px;
padding: 0;cursor: pointer;background:#ccc;}



.slick-dots{padding:9px 0;}
.slick-dots li{width: 12px;height: 12px;border-radius:100%;}
.slick-dots li button{width: 12px;height:12px;font-size:0 !important;}

.slick-dots li button{background:transparent;display: block;width: 20px;height: 5px;cursor: pointer;outline: none;font-size:0 !important;border-radius:100%;border:0;}
.slick-dots li:hover,.slick-dots li:focus{outline: none;}
.slick-dots li:hover,.slick-dots li:focuse{opacity: 1;}
.slick-dots li.slick-active{opacity: 1;background:#000;}

.slick-arrow{position:absolute;display:block;background:rgba(0,0,0,0.2) no-repeat 50% 50%;border-radius:0%;width:30px;height:30px;border:0;z-index:1;top:50%;margin-top:-50px;outline: none;font-size:0 !important;cursor:pointer;}


.slick-arrow:before{
content:'';display:block;width:40%;
height:40%;background:transparent no-repeat 50% 50%;margin:0 0 0 20%;
/*background-image:linear-gradient(-45deg,#fff 50%,transparent 50%);*/
background-size:100% 100%;transform-origin:50% 50%;transform:rotate(-45deg);
color:#fff;box-shadow:-3px 0 0 inset,0 -3px 0 0 inset;
}


.slick-next{right:0;}
.slick-prev{left:0;transform:scale(-1,1)}


@media screen and (min-width: 480px) {

.slick-dots{padding:9px 0;}
.slick-dots li{width: 12px;height: 12px;border-radius:100%;}
.slick-dots li button{width: 12px;height:12px;font-size:0 !important;}
.slick-arrow{width:30px;height:30px;}

}


/* #mainSlide
----------------*/
#mainSlide{max-width:1060px;margin:0 auto;}

#mainSlide,
#mainSlide .slick-list,
#mainSlide .slick-slider{overflow:hidden !important;}

/* 全画面 */
#mainSlide,
#mainSlide .slick-list,
#mainSlide .slick-slider{overflow:visible !important;}

#mainSlide li img{width:100%;}
#mainSlide li>a{display:block;}
#mainSlide li>a{padding:0 ;}

#mainSlide .slick-arrow{width:50px;height:50px;margin-top:-25px;}
#mainSlide .slick-arrow{position:absolute;display:block;
background-color:transparent;border:0;border-radius:0;z-index:1;outline: none;font-size:0 !important;}


/*
#mainSlide .slick-dots{position:absolute;bottom:0;width:100%;}

#mainSlide .slick-dots{padding:15px 0;}
#mainSlide .slick-dots li{width:80px;border-radius:0 !important;height:10px;
background:rgba(153,153,153,0.4);
}
*/



#mainSlide .slick-dots li.slick-active{
background:rgba(153,153,153,0.8)
}
#mainSlide .slick-dots li button{width:100%;background:transparent;border-radius:0;height:10px;}


#mainSlide .slick-arrow{top:50%;opacity:0;transition:0.5s;}
#mainSlide .slick-next{right:0;}
#mainSlide .slick-prev{left:0;}
#mainSlide .slick-arrow{opacity:1 !important;}


#mainSlide .slick-arrow::before{color:#ccc;}


#mainSlide .slick-slide img{opacity:0.4;transition:1s;}
#mainSlide .slick-center img{opacity:1;}





@media screen and (min-width: 1060px) {
#mainSlide .slick-arrow{opacity:0;transition:0.5s;}
#mainSlide .slick-next{right:calc(50% - 530px);}
#mainSlide .slick-prev{left:calc(50% - 530px);transform:scale(-1,1)}

}
@media screen and (max-width: 768px) {
#mainSlide .slick-dots{position:relative !important;display:block;}

#mainSlide .slick-dots li{width:16px;height:16px;border-radius:100% !important;
}
}



/* .itemList
----------------*/


.iWrap{padding:5px;}

.iImg{background:transparent no-repeat 50% 50%;background-size:contain;}
.iImg img{width:100% !important;}
.iInfo{text-align:center;font-size:12px;line-height:20px;padding:5px 0;}
.iPrice p{display:inline-block;}

.iPrice[data-tax] span::after{content:'円(税込)';font-size:0.5em;}
.iPrice[data-tax='0'] span::after{content:'円(税抜)';}

.itemList li{vertical-align:top;}
.itemList li a{position:relative;overflow:hidden;text-decoration:none;}


@media screen and (max-width: 480px) {
.itemList li>a .iPrice p::before{display:none;}
.itemList li>a .iPrice p::after{font-size:10px;}
}


#page[data-id="pickItem"]{max-width:1100px;margin:0 auto;}


/**/




li[data-rank] .iWrap{position:relative;text-align:left;}
li[data-rank] .iWrap::before{content:'';position:absolute;
z-index:1;width:40px;height:40px;
display:inline-block;box-sizing:border-box;
color:#fff;padding:0px 5px;
line-height:40px;font-size:20px;text-align:center;
background:#000 no-repeat 0;
}

li[data-rank="1"] .iWrap::before{content:'1';background:#D9A300}
li[data-rank="2"] .iWrap::before{content:'2';background:#999999}
li[data-rank="3"] .iWrap::before{content:'3';background:#8C2300}
li[data-rank="4"] .iWrap::before{content:'4';}
li[data-rank="5"] .iWrap::before{content:'5';}
li[data-rank="6"] .iWrap::before{content:'6';}
li[data-rank="7"] .iWrap::before{content:'7';}
li[data-rank="8"] .iWrap::before{content:'8';}
li[data-rank="9"] .iWrap::before{content:'9';}
li[data-rank="10"] .iWrap::before{content:'10';}