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

                    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;
        margin:0;
        }
        [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: -27px;
        display: block;
        width: 100%;
        padding: 0 1rem;
        box-sizing: border-box;
        margin: 0;
        list-style: none;
        text-align: left;
        }

        .slick-dots li {
        position: relative;
        display: inline-block;
        width: 18px;
        height: 18px;
        margin: 0 5px;
        padding: 0;
        cursor: pointer;
        }
        .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 18px;
        height: 18px;
        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: 6px;
        line-height: 18px;
        position: absolute;
        top: 0;
        left: 0;
        width: 18px;
        height: 18px;
        content: '●';
        text-align: center;
        opacity: .5;
        color: #FFF;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        }
        .slick-dots li.slick-active button:before {
        opacity: 1;
        font-size:12px;
        }
        @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: 6px; 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; }




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

        Slick-WIde

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

        .slick-wide { padding-bottom:25px; }
        .slick-wide .slick-prev,
        .slick-wide .slick-next {
        top:auto;
        bottom:-40px;;
        }
        .slick-wide .slick-prev {
        left: 50%;
        margin-left: -100px;
        }
        .slick-wide .slick-next {
        right: 50%;
        margin-right: -100px;
        }
        .slick-wide .slick-prev:before, .slick-wide .slick-next:before { color:#555; font-size:18px; opacity:.35; }



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

        LOOP Slick

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

        .slick-loop li figure { margin:0 3px; }
        .slick-loop li figure img {border-radius:0px;}

        @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; }
        }

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

        SLIDE LOOP

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

        .slick-slideloop li.slick-slide {
        margin:0 1.4vw;
        }
        .slick-slideloop li.slick-slide img {
        width:86vw;
        max-width:1200px;
        }
        .slick-slideloop.large li figure img { max-width:800px; }
        .slick-slideloop .slick-prev { left:25px; }
        .slick-slideloop .slick-next { right:25px; }
        .slick-slideloop .slick-prev,
        .slick-slideloop .slick-next { width:25px; height:25px; }
        .slick-slideloop .slick-prev:before,
        .slick-slideloop .slick-next:before { color:black; font-size:25px; }
        .slick-slideloop .slick-dots { position: relative; bottom:0; height:20px; }
        .slick-slideloop .slick-dots li { width: 15px; height: 15px; }
        .slick-slideloop .slick-dots li button { width: 15px; height: 15px; padding:0; }
        .slick-slideloop .slick-dots li button:before { color: #000; width:15px; height:15px; line-height:15px; }
        .slick-slideloop .slick-dots li.slick-active button:before { color: #000; }
        
        @media screen and (max-width:1350px) {
        .slick-slideloop li figure img { max-width:800px; }
        .slick-slideloop.large li figure img { max-width:750px; }
        }
        @media screen and (max-width:1024px) {
        .slick-slideloop li figure img { max-width:550px; }
        .slick-slideloop.large li figure img { max-width:600px; }
        }
        @media screen and (max-width:767px) {
        .slick-slideloop li figure img { width:76vw; }
        .slick-slideloop.large li figure img { max-width:300px; }
        .slick-slideloop .slick-prev { left:18px; }
        .slick-slideloop .slick-next { right:18px; }
        }

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

        サムネイル付 A

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

        .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; }
        }

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

        サムネイル付 B

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

        .slick-gallery-b { margin:0 0 5px 0; }
        .slick-gallery-b li{ list-style:none; }

        .gallery-b-wrap .slick-prev, 
        .gallery-b-wrap .slick-next {
        position: absolute;
        z-index: 3;
        top: calc(50% - 9px);
        cursor: pointer;
        outline: none;
        border-top: 3px solid #FFF;
        border-right: 3px solid #FFF;
        height: 18px;
        width: 18px;
        }
        .gallery-b-wrap .slick-prev { left:2.5%; transform: rotate(-135deg); }
        .gallery-b-wrap .slick-next { right:2.5%; transform: rotate(45deg);}
        
        .gallery-b-wrap .slick-prev:before { display: none; }
        .gallery-b-wrap .slick-next:before { display: none; }

        .choice-btn li{ cursor: pointer; outline: none; background:#333; list-style:none; }
        .choice-btn li img{ opacity: 0.4; }
        .choice-btn li.slick-current img{ opacity: 1; }
        @media screen and (max-width:767px) {
        .gallery-b-wrap .slick-prev, 
        .gallery-b-wrap .slick-next { top: calc(50% - 7px); height: 12px; width: 12px; }
        }

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

        ノーマル 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:20px;
        height:20px;
        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:20px;
            height:20px;
            border-radius: 50%;
            background: url("../slick/arrow-r.svg") center center / cover;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            }
        .normal-slick-wrap .slick-prev:before {
            content:"";
            display: block;
            position: absolute;
            top:0;
            left:0;
            width:20px;
            height:20px;
            border-radius: 50%;
            background: url("../slick/arrow-l.svg") center center / cover;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            }
        .normal-slick-wrap .slick-next:hover:before { background: url("../slick/arrow-r.svg") center center / cover, #D0E4DD; }
        .normal-slick-wrap .slick-prev:hover:before { background: url("../slick/arrow-l.svg") center center / cover, #D0E4DD; }
        .normal-slick-wrap figcaption {
        position: absolute;
        }

        @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; }
        
        /* sp-arrow */
        .normal-slick-wrap.sp-arrow { margin-bottom:35px; }
        .normal-slick-wrap.sp-arrow .slick-prev, .normal-slick-wrap.sp-arrow .slick-next { width:28px; height:28px; display: block; }
        .normal-slick-wrap.sp-arrow .slick-prev:before, .normal-slick-wrap.sp-arrow .slick-next:before { display: block;  }
        .normal-slick-wrap.sp-arrow .slickslider .slick-dots { width:auto; position: relative; bottom:-8px; }
        }


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

        簡易 Slick　Arrow無し

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

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


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

        Arrow画像内埋込

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

        .normal-slick-wrap.inside { margin-bottom:0; }
        .normal-slick-wrap.inside .slickslider .slick-dots { bottom: 15px; z-index: +1; }
        .inside .slick-dots { text-align: center; }

        .normal-slick-wrap.inside .slick-prev,
        .normal-slick-wrap.inside .slick-next { bottom:12px; }
        .normal-slick-wrap.inside .slick-next { right:15px; }
        .normal-slick-wrap.inside .slick-prev { left:15px; }

        .normal-slick-wrap.inside .slick-next:before { background: url("../slick/arrow-r-w.svg") center center / cover; opacity:1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; }
        .normal-slick-wrap.inside .slick-prev:before { background: url("../slick/arrow-l-w.svg") center center / cover; opacity:1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; }
        .normal-slick-wrap.inside .slick-next:hover:before { opacity:1; }
        .normal-slick-wrap.inside .slick-prev:hover:before { opacity:1; }

        @media screen and (max-width:1024px) {
        .normal-slick-wrap.inside .slickslider .slick-dots { bottom: 15px; }
        }
        @media screen and (max-width:767px) {
        .normal-slick-wrap.inside .slickslider .slick-dots { bottom: 10px; }
        }

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

        STOP Slide

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

.stop-slider { width:100%;  margin:0 auto;}
.stop-slider.dots { margin-bottom:2rem; }
.stop-slider img { width:100%; height:auto;}
.stop-slider .slick-slide { margin:0 10px; }

.stop-slider .slick-prev, 
.stop-slider .slick-next { position: absolute; top: 48%; cursor: pointer; outline: none; border-top: 3px solid #FFF; border-right: 3px solid #FFF; height: 15px; width: 15px;}
.stop-slider .slick-prev { left: -1.5%; transform: rotate(-135deg);}
.stop-slider .slick-next { right: -1.5%; transform: rotate(45deg);}

.stop-slider .slick-prev:before { display: none; }
.stop-slider .slick-next:before { display: none; }
/*
.stop-slider .slick-dots { text-align:center; margin:20px 0 0 0;}
.stop-slider .slick-dots li { display:inline-block; margin:0 5px;}
.stop-slider .slick-dots button { color: transparent; outline: none; width:8px; height:8px; display:block; border-radius:50%; background:#ccc;}
.stop-slider .slick-dots .slick-active button{ background:#333;}
*/
        @media screen and (max-width:1350px) {
        .stop-slider .slick-slide { margin:0 7px; }
        }
        @media screen and (max-width:1024px) {
        .stop-slider .slick-slide { margin:0 5px; }
        }
        @media screen and (max-width:767px) {
        .stop-slider .slick-slide { margin:0 20px; }
        }

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

        Rss Slide

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

.rss-slider { width:100%;  margin:0 auto;}
.rss-slider img { width:100%; height:auto;}
.rss-slider .slick-slide { margin:0 18px; }

.rss-slider .slick-prev, 
.rss-slider .slick-next { position: absolute; top: 42%; cursor: pointer; outline: none; border-top: 3px solid #333; border-right: 3px solid #333; height: 15px; width: 15px;}
.rss-slider .slick-prev { left: -1.5%; transform: rotate(-135deg);}
.rss-slider .slick-next { right: -1.5%; transform: rotate(45deg);}

.rss-slider .slick-prev:before { display: none; }
.rss-slider .slick-next:before { display: none; }
/*
.rss-slider .slick-dots { text-align:center; margin:20px 0 0 0;}
.rss-slider .slick-dots li { display:inline-block; margin:0 5px;}
.rss-slider .slick-dots button { color: transparent; outline: none; width:8px; height:8px; display:block; border-radius:50%; background:#ccc;}
.rss-slider .slick-dots .slick-active button{ background:#333;}
*/
        @media screen and (max-width:1350px) {
        .rss-slider .slick-slide { margin:0 16px; }
        }
        @media screen and (max-width:1024px) {
        .rss-slider .slick-slide { margin:0 14px; }
        }
        @media screen and (max-width:767px) {
        .rss-slider .slick-slide { margin:0 11px; }
        }