@charset 'uft-8';
/* ------------------------------------------------------------
*
    .img_slider
     -> Setting jQuery Plugin slick.min.js
*
------------------------------------------------------------ */
.slick-dots,.slick-next,.slick-prev{position:absolute;display:block;padding:0}.slick-dots li button:before,.slick-next:before,.slick-prev:before{font-family:slick;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-next,.slick-prev{font-size:0;line-height:0;top:50%;width:20px;height:20px;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:0;background:0 0}.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover{color:transparent;outline:0;background:0 0}.slick-next:focus:before,.slick-next:hover:before,.slick-prev:focus:before,.slick-prev:hover:before{opacity:1}.slick-next.slick-disabled:before,.slick-prev.slick-disabled:before{opacity:.25}.slick-next:before,.slick-prev:before{font-size:20px;line-height:1;opacity:.75;color:#fff}.slick-prev{left:-25px}[dir=rtl] .slick-prev{right:-25px;left:auto}.slick-prev:before{content:'←'}.slick-next:before,[dir=rtl] .slick-prev:before{content:'→'}.slick-next{right:-25px}[dir=rtl] .slick-next{right:auto;left:-25px}[dir=rtl] .slick-next:before{content:'←'}.slick-dotted.slick-slider{margin-bottom:30px}.slick-dots{bottom:-25px;width:100%;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:0;background:0 0}.slick-dots li button:focus,.slick-dots li button:hover{outline:0}.slick-dots li button:focus:before,.slick-dots li button:hover:before{opacity:1}.slick-dots li button:before{font-size:6px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:'・';text-align:center;opacity:.25;color:#000}.slick-list,.slick-slider,.slick-track{position:relative;display:block}.slick-dots li.slick-active button:before{opacity:.75;color:#000}.slick-slider{-moz-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{top:0;left:0}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-slide{display:none;float:left;height:100%;min-height:1px}[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-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}




@media print, screen and (min-width : 769px){
/*------------------------------------------------------------------------------------------
*
*
    min-width : 769px
*
*
------------------------------------------------------------------------------------------ */
.img_slider{ margin: 0 auto; text-align: center;}
.img_slider div{ text-align: left; outline: none;}
.img_slider h5{ margin: 0 0 10px 0; font-size: 18px; font-weight: bold; line-height: 1.388em;}
.img_slider h5 .small{ font-size: 16px; font-weight: normal;}
.img_slider .pic .caption{ font-size: 12px; line-height: 1.5em; display: block;}
.img_slider img{ width: 100%; height: auto; transition: opacity .1s ease;}
.img_slider a{ outline: none;}
.img_slider a:hover img{ opacity: .7;}


/* col01 */
.img_slider.col01 .pic{ width: 100%; margin: 0 0 10px 0 !important; line-height: 0;}
.img_slider.col01 img{ width: 100%; height: auto;}
.img_slider.col01 .title{ padding: 0 20px; font-size: 14px; line-height: 1.28em;}
.img_slider.col01 .caption{ margin: 0 0 40px 0; font-size: 11px;}

/* col03 */
.img_slider.col03{ position: relative; left: 0;}
.img_slider.col03 .slider_inner{ padding: 0 15px;}
.img_slider.col03 .desc{ font-size: 16px; line-height: 1.5em;}
.img_slider.col03 img{ margin: 0 0 15px 0;}

/* col04 */
.img_slider.col04{ width: 100% !important; margin: 0 auto;}
.img_slider.col04{ padding: 0 0 0 10px; position: relative;}
.img_slider.col04 .pic{ padding: 0 20px; margin: 0 auto 5px auto; width: 190px; height: 107px; overflow: hidden;}
.img_slider.col04 .title{ padding: 0 25px; margin: 0 0 3px 0; font-size: 14px; line-height: 1.287em;}
.img_slider.col04 .desc{ padding: 0 25px; font-size: 11px; line-height: 1.454em; color: #444;}

/* col06 */
.img_slider.col06 .pic{ width: 100%; margin: 0 20px 10px 20px !important; line-height: 0;}
.img_slider.col06 img{ width: 100%; height: auto;}
.img_slider.col06 .title{ padding: 0 5px; font-size: 14px; line-height: 1.28em;}


/* ----------- color_slider -----------*/
.color_slider{ width: 100%; text-align: center;}
.color_slider .pic{ width: 100%; margin: 0 0 10px 0; line-height: 0;}
.color_slider img{ width: 100%; height: auto; position: relative; top: 0; left: 0;}
.nav_wrap{ margin: 0 auto;}
.nav_color_list{ width: 100%; text-align: center; position: relative; bottom: 0;}
.nav_color_list li{ width: 28px; height: 28px; display: inline-block; cursor: pointer; position: relative; transition: opacity .1s ease;}
.nav_color_list li:hover{ opacity: .7;}
.nav_color_list li.current:after{
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    background-image:url(../image_common/parts_ico_color_check.png) !important;
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
}
/* -------------------------------------*/


/*
    .col01
*/

.slick-dots{
    width: auto !important;
    display: inline-block;
    position: relative;
    bottom: 2px !important;
}

.slick-dots li{
    width: 8px;
    height: 8px;
    padding: 0 8px;
    margin: 0 0 10px 0;
    text-align: center;
    float: left;
    vertical-align: top;
}

.slick-dots li button{
    width: 8px;
    height: 8px;
    position: relative;
}

.slick-dots li button:before{
    content: '';
    width: 8px;
    height: 8px;
    background-color: #d9d9d9;
    border-radius: 11px;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
}

.slick-dots li:hover button:before,
.slick-dots li.slick-active button:before{
    background-color: #0064a1;
    opacity: 1;
}


/* Setting Plugin Slick */
.img_slider.col01 .arrow_prev{
    width: 24px;
    height: 24px;
    margin: 0 0 5px -40px;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_left.png);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

.img_slider.col01 .arrow_next{
    width: 24px;
    height: 24px;
    margin: 0 -40px 5px 0;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_right.png);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    position: absolute;
    bottom: 0;
    right: 50%;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

/*
    .col04
*/
.img_slider.col04 .arrow_prev{
    width: 24px;
    height: 24px;
    margin: -12px 0 0 0;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_left.png);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    position: absolute;
    top: 0;
    left: -20px;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

.img_slider.col04 .arrow_next{
    width: 24px;
    height: 24px;
    margin: -12px 0 0 0;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_right.png);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    position: absolute;
    top: 0;
    right: -30px;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

.img_slider .arrow_prev:hover,
.img_slider .arrow_next:hover{
    opacity: .7;
} 


}

@media screen and (max-width : 768px){ 
/*------------------------------------------------------------------------------------------
*
*
        max-width : 768px
*
*
------------------------------------------------------------------------------------------ */

.img_slider{ text-align: center !important;}
.img_slider .slider_inner{ padding: 0 15px;}
.img_slider div{ text-align: left; outline: none; margin: 0 0 10px 0;}
.img_slider h5{ margin: 0 0 5px 0; font-size: 16px; font-weight: bold; line-height: 1.437em;}
.img_slider .title br{ display: none;}
.img_slider .pic{ box-sizing: border-box;}
.img_slider img{ width: 100%; height: auto; transition: opacity .1s ease;}
.img_slider a{ outline: none;}
.img_slider a:hover img{ opacity: .7;}


/* col01 */
.img_slider.col01{ width: 100%; clear: both; letter-spacing: 0; position: relative; left: 0;}
.img_slider.col01 .pic{ width: 100%; line-height: 0; margin: 0 0 10px 0 !important;}
.img_slider.col01 img{ width: 100%; height: auto;}
.img_slider.col01 .caption{ margin: 0; font-size: 11px; line-height: 1.5em; text-align: left;}


/* col03 */
.img_slider.col03 img{ margin: 0 0 15px 0;}
.img_slider.col03 .desc{ font-size: 14px; line-height: 1.5em;}


/* col04 */
.img_slider.col04{ position: relative; left: 0; padding: 0 10px;}
.img_slider.col04 .slider_inner{ padding: 0 5px;}
.img_slider.col04 .pic{ margin: 0 0 5px 0;}
.img_slider.col04 .title{ margin: 0 0 3px 0; font-size: 14px; line-height: 1.285em;}
.img_slider.col04 .desc{ font-size: 11px; line-height: 1.454em; color: #444;}


/* col06 */
.img_slider.col06{ position: relative; left: 0; padding: 0 10px;}
.img_slider.col06 .slider_inner{ padding: 0 5px;}
.img_slider.col06 .pic{ margin: 0 0 5px 0; padding: 0 5px;}
.img_slider.col06 .title{ padding: 0 10px; margin: 0 0 10px 0; font-size: 14px; line-height: 1.285em;}
.img_slider.col06 .desc{ padding: 0 10px; font-size: 11px; line-height: 1.454em; color: #444;}

/* ----------- color_slider -----------*/
.color_slider{ width: 100%; text-align: center;}
.color_slider .pic{ width: 100%; margin: 0 0 10px 0; line-height: 0;}
.color_slider img{ width: 100%; height: auto;}
.nav_wrap{ width: 100%; padding: 0; margin: 0 auto; text-align: center;}
.nav_color_list{ width: auto; text-align: center; display: inline-block; position: relative;}
.nav_color_list li{ width: 38px; height: 38px; margin: 0 2px 4px; display: block; float: left; cursor: pointer; position: relative; transition: opacity .1s ease;}
.nav_color_list li:hover{ opacity: .7;}
.nav_color_list li.current:after{
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    background-image:url(../image_common/parts_ico_color_check.png) !important;
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
}
/* -------------------------------------*/
.img_slider .arrow_prev{
    width: 20px;
    height: 20px;
    margin: 0 0 6px -25px;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_left.png);
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
    position: absolute;
    left: 0;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

.img_slider .arrow_next{
    width: 20px;
    height: 20px;
    margin: 0 -25px 6px 0;
    border: none;
    background-image:url(../image_common/parts_slider_arrow_right.png);
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
    position: absolute;
    right: 0;
    cursor: pointer;
    z-index: 2;
    transition: opacity .1s ease;
}

.img_slider .arrow_prev:hover,
.img_slider .arrow_next:hover{
    opacity: .7;
} 

.slick-dots{
    width: auto !important;
    display: inline-block;
    position: relative;
    bottom: -1px !important;
}

.slick-dots li{
    width: 11px;
    height: 11px;
    padding: 0 8px;
    margin: 0 0 10px 0;
    text-align: center;
    float: left;
    vertical-align: top;
}

.slick-dots li button{
    width: 11px;
    height: 11px;
    position: relative;
}

.slick-dots li button:before{
    content: '';
    width: 11px;
    height: 11px;
    background-color: #d9d9d9;
    border-radius: 11px;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
}

/*.slick-dots li:hover button:before,*/
.slick-dots li.slick-active button:before{
    background-color: #0064a1;
    opacity: 1;
}

}

