
/* ==================================================================

                    Slick Base

================================================================== */

        .slick-slider {
        position: relative;
        display: block;
        box-sizing: border-box;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-tap-highlight-color: transparent;
        }
        .slick-list {
        position: relative;
        overflow: hidden;
        display: block;
        margin: 0;
        padding: 0;
        }
        .slick-list:focus {
        outline: none;
        }
        .slick-list.dragging {
        cursor: pointer;
        cursor: hand;
        }
        .slick-slider .slick-track,
        .slick-slider .slick-list {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        }
        .slick-track {
        position: relative;
        left: 0;
        top: 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
        }
        .slick-track:before, .slick-track:after {
        content: "";
        display: table;
        }
        .slick-track:after {
        clear: both;
        }
        .slick-loading .slick-track {
        visibility: hidden;
        }
        .slick-slide {
        float: left;
        height: 100%;
        min-height: 1px;
        display: none;
        }
        [dir="rtl"] .slick-slide {
        float: right;
        }
        .slick-slide img {
        display: block;
        }
        .slick-slide.slick-loading img {
        display: none;
        }
        .slick-slide.dragging img {
        pointer-events: none;
        }
        .slick-initialized .slick-slide {
        display: block;
        }
        .slick-loading .slick-slide {
        visibility: hidden;
        }
        .slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
        }
        .slick-arrow.slick-hidden {
        display: none;
        }

        /*=================================================
                Slick Themeより
        ==================================================*/

        .slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; }

        @font-face {
        font-family: 'slick';
        font-weight: normal;
        font-style: normal;
        src: url('./fonts/slick.eot');
        src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
        }

        .slick-prev,
        .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 50%;
        display: block;
        width: 20px;
        height: 20px;
        padding: 0;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        cursor: pointer;
        color: transparent;
        border: none;
        outline: none;
        background: transparent;
        z-index: 2;
        }
        .slick-prev:hover,
        .slick-prev:focus,
        .slick-next:hover,
        .slick-next:focus {
        color: transparent;
        outline: none;
        background: transparent;
        }
        .slick-prev:hover:before,
        .slick-prev:focus:before,
        .slick-next:hover:before,
        .slick-next:focus:before {
        opacity: 1;
        }
        .slick-prev.slick-disabled:before,
        .slick-next.slick-disabled:before {
        opacity: .25; }

        .slick-prev:before,
        .slick-next:before {
        font-family: 'slick';
        font-size: 20px;
        line-height: 1;
        opacity: .75;
        color: white;
        -webkit-font-smoothing: antialiased;
        }
        .slick-prev { left: -25px; }
        [dir='rtl'] .slick-prev { right: -25px; left: auto; }
        .slick-prev:before {
        content: '←';
        }
        [dir='rtl'] .slick-prev:before {
        content: '→';
        }
        .slick-next { right: -25px; }
        [dir='rtl'] .slick-next {
        right: auto;
        left: -25px;
        }
        .slick-next:before {
        content: '→';
        }
        [dir='rtl'] .slick-next:before {
        content: '←';
        }

        /*=================================================
                dots / slick themeより
        ==================================================*/

        .slick-dots {
        position: absolute;
        bottom: -25px;
        display: block;
        width: 100%;
        padding: 0 1rem;
        box-sizing: border-box;
        margin: 0;
        list-style: none;
        text-align: center;
        }

        .slick-dots li {
        position: relative;
        display: inline-block;
        width: 20px;
        height: 20px;
        margin: 0 5px;
        padding: 0;
        cursor: pointer;
        }
        .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 20px;
        height: 20px;
        padding: 5px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: none;
        background: transparent;
        }
        .slick-dots li button:hover,
        .slick-dots li button:focus {
        outline: none;
        }
        .slick-dots li button:hover:before,
        .slick-dots li button:focus:before {
        opacity: 1;
        }
        .slick-dots li button:before {
        font-family: 'slick';
        font-size: 15px;
        line-height: 20px;
        position: absolute;
        top: 0;
        left: 0;
        width: 20px;
        height: 20px;
        content: '●';
        text-align: center;
        opacity: .25;
        color: black;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        }
        .slick-dots li.slick-active button:before {
        opacity: .75;
        color: black;
        }
        @media screen and (max-width:767px) {
        .slick-dots li { width: 15px; height: 15px; margin: 0 3px; }
        .slick-dots li button { width: 15px; height: 15px; }
        .slick-dots li button:before { font-size: 11px; line-height: 15px; width: 15px; height: 15px; }
        }


/* ==================================================================

                    追加

================================================================== */


        /*=================================================
                共通設定
        ==================================================*/

        .slick-slide img {
        display: block;
        width:100%;
        }
        .slick-slide　{
        display: none;
        float: left;
        margin:0;
        height: 100%;
        min-height: 1px;
        }

        /*=================================================
                追加オプション
        ==================================================*/   
        
        .slick-dots-none.slickslider .slick-dots  { display: none !important; }
        .slick-dots-none .slick-dots { display: none !important; }
        .slick-arrow-none .slick-prev,
        .slick-arrow-none .slick-next { display: none !important; }
        .dots-center .slick-dots li { display: inline-block; float:none; }
        .dots-white .slick-dots li button:before { color:#FFF; }
        .dots-white .slick-dots li.slick-active button:before { color:#FFF; }

/*==================================================================================================

        LOOP Slick

===================================================================================================*/

        .slick-loop li figure {
        margin:0 3px;
        }
        .slick-loop li figure img {border-radius:5px;}
        
        @media screen and (max-width:1024px) {
        .slick-loop li figure {  margin:0 3px; }
        }
        @media screen and (max-width:767px) {
        .slick-loop li figure {  margin:0 2px; }
        }

/*==================================================================================================

        サムネイル付

===================================================================================================*/

        .slick-gallery li{ list-style:none; }
        .slick-gallery .slick-list { overflow: inherit; }
        .slick-thumb .slick-list { overflow: inherit; }

        .slick-gallery .slick-thumb-prev, 
        .slick-gallery .slick-thumb-next {
        position: absolute;
        z-index: 3;
        top: 47%;
        cursor: pointer;
        outline: none;
        border-top: 2px solid #FFF;
        border-right: 2px solid #FFF;
        height: 14px;
        width: 14px;
        }
        .slick-gallery .slick-thumb-prev {
        left:2.5%;
        transform: rotate(-135deg);
        }
        .slick-gallery .slick-thumb-next {
        right:2.5%;
        transform: rotate(45deg);
        }
        .slick-thumb-wrap {
        padding-top:1rem;
        }
        .slick-thumb-wrap .slick-track { margin:0; }
        .slick-thumb li{
        cursor: pointer;
        outline: none;
        background:#333;
        width:24%!important;
        list-style:none;
        border-radius: 4px;
        margin:0 .5%;
        }
         /* 枚数変更時はこちらを設定 */
        .slick-thumb.thumb-2p li { width:49% !important; }
        .slick-thumb.thumb-3p li { width:32% !important; }
        .slick-thumb.thumb-5p li { width:19% !important; }


        .slick-thumb li img{ opacity: 0.8; }
        .slick-thumb li.slick-current img{ opacity: 1; }
        .slick-thumb .slick-track { transform: unset !important; }

        @media screen and (max-width:1024px) {
        .slick-gallery .slick-thumb-prev,.slick-gallery .slick-thumb-next { height: 12px; width: 12px; }
        .slick-thumb-wrap { padding-top:.75rem; }
        }
        @media screen and (max-width:767px) {
        .slick-gallery .slick-thumb-prev,.slick-gallery .slick-thumb-next { height: 10px; width: 10px; }
        .slick-thumb-wrap { padding-top:.5rem; }
        }

/*==================================================================================================

        ノーマル Arrow付

===================================================================================================*/

        .normal-slick-wrap { margin-bottom:45px; }
        .normal-slick-wrap.bottom-none { margin-bottom:0; }
        .normal-slick-wrap.mb-1em { margin-bottom:1rem; }
        .normal-slick-wrap.bg-slick { margin-bottom:0; }
        .normal-slick-wrap.normal-slick { margin-bottom:0; }

        .normal-slick-wrap .slickslider figure { position: relative; z-index: 0; }
        .normal-slick-wrap .slick-dots li { margin:0 !important;}
        .normal-slick-wrap .slick-dotted.slick-slider { margin-bottom: 0 !important;}
        .normal-slick-wrap .slickslider .slick-dots { bottom: -40px; z-index: +1; }

        .normal-slick-wrap .slick-prev:before, .normal-slick-wrap .slick-next:before { color:rgba(0,0,0,.5);}
        .normal-slick-wrap .slick-dots li { display: block; float:left; }

        .normal-slick-wrap .slick-prev,.normal-slick-wrap  .slick-next {
        bottom: -45px;
        width:35px;
        height:35px;
        top:auto;
        -webkit-transform:translate(0);
        transform :translate(0);
        }
        .normal-slick-wrap .slick-next { right:0; }
        .normal-slick-wrap .slick-prev { left:auto; right:60px; }
        
        .normal-slick-wrap .slick-prev:before,.normal-slick-wrap .slick-next:before { opacity: 1; }
        .normal-slick-wrap .slick-next:before {
            content:"";
            display: block;
            position: absolute;
            top:0;
            left:0;
            width:35px;
            height:35px;
            background: url("../slick/arrow-r.svg") center center / cover;
            }
        .normal-slick-wrap .slick-prev:before {
            content:"";
            display: block;
            position: absolute;
            top:0;
            left:0;
            width:35px;
            height:35px;
            background: url("../slick/arrow-l.svg") center center / cover;
            }
        .normal-slick-wrap figcaption {
        position: absolute;
        bottom:0;
        left:1em;
        }
        
        .bg-blue-b .slick-dots li button:before { color:#FFF; }
        .bg-blue-b .slick-dots li.slick-active button:before { color:#FFF; }

        @media screen and (max-width:1024px) {
        .normal-slick-wrap { margin-bottom:35px; }
        .normal-slick-wrap .slickslider .slick-dots { bottom: -30px; }
        .normal-slick-wrap .slick-prev { right:55px; }
        .normal-slick-wrap .slick-prev, .normal-slick-wrap .slick-next { bottom: -35px; width:28px; height:28px; }
        .normal-slick-wrap .slick-prev:before, .normal-slick-wrap .slick-next:before {  width:28px; height:28px; }
        }
        @media screen and (max-width:767px) {
        .normal-slick-wrap { margin-bottom:0; }
        .normal-slick-wrap .slick-prev, .normal-slick-wrap .slick-next { width: 0; height: 0; display: none; }
        .normal-slick-wrap .slick-prev:before, .normal-slick-wrap .slick-next:before { display: none;  }
        .normal-slick-wrap .slickslider .slick-dots { width:auto; position: absolute; bottom:8px; }
        }


/*==================================================================================================

        簡易 Slick　Arrow無し

===================================================================================================*/

        .slickslider-s .slick-dots { bottom:10px; text-align: left; }








