@charset "utf-8"; /* CSS Document */

/**slick基礎**/
[class*="_SlDes"]{ opacity: 0; transition: opacity .1s linear;}
[class*="_SlDes"].slick-initialized{ opacity: 1;}
[class*="_SlDes"] .slick-list li.slick-slide img{ max-width: 100%;}
[class*="_SlDes"] [class*="arrow-"]{display: inline-block; width:2em; height:2em; position: absolute; top: 0; bottom: 0; margin: auto;/* background-image: url(../img/arr_black.svg); width: 3em; height: 3em; background-repeat: no-repeat; background-position: center center; background-size: 100% auto;*/ cursor: pointer; z-index: 101; }
[class*="_SlDes"] [class*="arrow-"]:before{	display: inline-block; width: 100%; height: 100%; content: ""; transform: scale(1, 1) rotate(-180deg); position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; background-image: url(../img/arr_MaruRED.svg); background-repeat: no-repeat; background-position: center center; background-size: contain;
}
[class*="_SlDes"] .arrow-prev{ left:2vw;}
[class*="_SlDes"] .arrow-next{ right:2vw; }
[class*="_SlDes"] .arrow-next:before{ transform:scale(1, 1) rotate(0deg);}

[class*="_SlDes"] .uniq-dots{position: absolute; bottom:3em; display: flex; width: 100%; justify-content: center; gap:0.75em; flex-wrap: wrap; z-index: 1;}
[class*="_SlDes"] .uniq-dots li{ height: 1em; width: 1em; padding: 0!important; cursor: pointer;}
[class*="_SlDes"] .uniq-dots li button{ display: block; border: 0; background: #fff; height: 100%; width: 100%; outline: none; line-height: 0px; font-size: 0px; color: transparent; cursor: pointer; border-radius:20%; }
[class*="_SlDes"] .uniq-dots li.slick-active button{ background: var(--color-red)!important;}
[class*="_SlDes"] .uniq-dots li:only-child {display: none;}



@media screen and (max-width: 760px) {
    /**slickカスタマイズ**/
    [class*="_SlDes"] .slick-list li.slick-slide img{ }
    [class*="_SlDes"] [class*="arrow-"]{ top: 0; bottom: 0; width: 1.25em; height: 1.25em; }
    [class*="_SlDes"] [class*="arrow-"]:before{ }
    [class*="_SlDes"] .arrow-prev{}
    [class*="_SlDes"] .arrow-next{}
    [class*="_SlDes"] .uniq-dots{bottom: 7rem; padding: 0 3em; gap: 1rem 4%;}
    [class*="_SlDes"] .uniq-dots li{ height: 0.5em; width: 22%;}
    [class*="_SlDes"] .uniq-dots li button{}
    [class*="_SlDes"] .uniq-dots li.slick-active button{ }


}