@charset "utf-8";

/*!
 * - v1.2.0
 * Homepage: http://bqworks.com/slider-pro/
 * Author: bqworks
 * Author URL: http://bqworks.com/
 */

/* Core
--------------------------------------------------*/
.slider-pro { margin:0 auto; position:relative; box-sizing:content-box; -moz-box-sizing:content-box;}

.sp-slides-container { position:relative;}
.sp-mask { position:relative; overflow:hidden;}

.sp-slides { position:relative; -webkit-backface-visibility:hidden; -webkit-perspective:1000;}
.sp-slide { position:absolute;}

.sp-image-container { overflow:hidden;}
.sp-image { display:block; position:relative; border:none;}

.sp-no-js { max-width:100%; overflow:hidden;}

/* Thumbnails
--------------------------------------------------*/
.sp-thumbnails-container { position:relative; overflow:hidden;}

.sp-top-thumbnails,.sp-bottom-thumbnails { margin:0 auto; left:0;}
.sp-top-thumbnails { margin-bottom:4px; position:absolute; top:0;}
.sp-bottom-thumbnails { margin-top:4px;}

.sp-left-thumbnails,.sp-right-thumbnails { position:absolute; top:0;}
.sp-right-thumbnails { margin-left:4px; right:0;}
.sp-left-thumbnails { margin-right:4px; left:0;}

.sp-thumbnails { position:relative;}

.sp-thumbnail { border:none;}
.sp-thumbnail-container {
 float:left; display:block; position:relative; overflow:hidden;
 box-sizing:border-box; -moz-box-sizing:border-box;}

/* Horizontal thumbnails
------------------------*/
.sp-top-thumbnails .sp-thumbnail-container,
.sp-bottom-thumbnails .sp-thumbnail-container {
 margin-right:2px; margin-left:2px;}

.sp-top-thumbnails .sp-thumbnail-container:first-child,
.sp-bottom-thumbnails .sp-thumbnail-container:first-child {
 margin-left:0;}

.sp-top-thumbnails .sp-thumbnail-container:last-child,
.sp-bottom-thumbnails .sp-thumbnail-container:last-child {
 margin-right:0;}

/* Vertical thumbnails 
----------------------*/
.sp-left-thumbnails .sp-thumbnail-container,
.sp-right-thumbnails .sp-thumbnail-container {
 margin-top:2px; margin-bottom:2px;}

.sp-left-thumbnails .sp-thumbnail-container:first-child,
.sp-right-thumbnails .sp-thumbnail-container:first-child {
 margin-top:0;}

.sp-left-thumbnails .sp-thumbnail-container:last-child,
.sp-right-thumbnails .sp-thumbnail-container:last-child {
 margin-bottom:0;}

/* Right thumbnails with pointer
--------------------------------*/
.sp-right-thumbnails.sp-has-pointer { margin-left:-13px;}
.sp-right-thumbnails.sp-has-pointer .sp-thumbnail { margin-left:0!important; position:absolute; left:18px;}
.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
 height:100%; margin-left:13px; content:''; position:absolute; top:0; left:0; border-left:5px solid #F00;}
.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
 width:0; height:0; margin-top:-8px; content:''; position:absolute; top:50%; left:0;
 border-top:8px solid transparent; border-right:13px solid #F00; border-bottom:8px solid transparent;}

/* Left thumbnails with pointer
-------------------------------*/
.sp-left-thumbnails.sp-has-pointer { margin-right:-13px;}
.sp-left-thumbnails.sp-has-pointer .sp-thumbnail { position:absolute; right:18px;}
.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
 height:100%; margin-right:13px; content:''; position:absolute; top:0; right:0;
 border-left:5px solid #F00;}
.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
 width:0; height:0; margin-top:-8px; content:''; position:absolute; top:50%; right:0;
 border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:13px solid #F00;}

/* Bottom thumbnails with pointer
---------------------------------*/
.sp-bottom-thumbnails.sp-has-pointer { margin-top:-13px;}
.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail { margin-top:0!important; position:absolute; top:18px;}
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
 width:100%; margin-top:13px; content:''; position:absolute; top:0; border-bottom:5px solid #F00;}
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
 width:0; height:0; margin-left:-8px; content:''; position:absolute; top:0; left:50%;
 border-bottom:13px solid #F00; border-left:8px solid transparent; border-right:8px solid transparent;}

/* Top thumbnails with pointer
------------------------------*/
.sp-top-thumbnails.sp-has-pointer { margin-bottom:-13px;}
.sp-top-thumbnails.sp-has-pointer .sp-thumbnail { position:absolute; bottom:18px;}
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
 width:100%; margin-bottom:13px; content:''; position:absolute; bottom:0; border-bottom:5px solid #F00;}
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
 width:0; height:0; margin-left:-8px; content:''; position:absolute; bottom:0; left:50%;
 border-top:13px solid #F00; border-left:8px solid transparent; border-right:8px solid transparent;}

/* Layers
--------------------------------------------------*/
.sp-layer {
 margin:0; position:absolute; font-size:108%; text-align:left;
 box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
 -webkit-font-smoothing:subpixel-antialiased; -webkit-backface-visibility:hidden;}

.sp-black {
 color:#FFF; background:rgb(0, 0, 0); background:rgba(0, 0, 0, 0.7);}
.sp-white {
 color:#000; background:rgb(255, 255, 255); background:rgba(255, 255, 255, 0.7);}

.sp-rounded { border-radius:10px;}
.sp-padding { padding:10px;}

/* Touch Swipe
--------------------------------------------------*/
.sp-grab { cursor:url(http://yamamotofoods.co.jp/cs-files/images/slider/openhand.cur), move;}
.sp-grabbing { cursor:url(http://yamamotofoods.co.jp/cs-files/images/slider/closedhand.cur), move;}
.sp-selectable { cursor:default;}

/* Caption
--------------------------------------------------*/
.sp-caption-container { margin-top:10px; text-align:center;}

/* Full Screen
--------------------------------------------------*/
.sp-full-screen { margin:0!important; background-color:#000;}

.sp-full-screen-button {
 position:absolute; top:5px; right:10px; cursor:pointer; font-size:30px; line-height:1;
 -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}
.sp-full-screen-button:before { content:'\2195';}

.sp-fade-full-screen { opacity:0; -webkit-transition:opacity 0.5s; transition:opacity 0.5s;}
.slider-pro:hover .sp-fade-full-screen { opacity:1;}

/* Buttons
--------------------------------------------------*/
.sp-buttons { width:100%; padding-top:0; text-align:center; position:absolute; bottom:25px;}
.sp-button {
 width:14px; height:14px; margin:0 6px; display:inline-block; cursor:pointer;
 -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;
 background:url(http://yamamotofoods.co.jp/cs-files/images/slider/arrow.png) no-repeat 0 top;}

.sp-selected-button { background-position:-15px 0;}

@media only screen and (min-width:768px) and (max-width:1024px) {
 .sp-button { width:14px; height:14px;}
}

@media only screen and (min-width:568px) and (max-width:768px) {
 .sp-button { width:14px;  height:14px;}
}

@media only screen and (min-width:320px) and (max-width:568px) {
 .sp-button { width:14px; height:14px;}
}

/* Arrows
--------------------------------------------------*/
.sp-arrows { position:absolute;}

.sp-fade-arrows { opacity:0; -webkit-transition:opacity 0.5s; transition:opacity 0.5s;}
.sp-slides-container:hover .sp-fade-arrows { opacity:1;}
.sp-horizontal .sp-arrows { width:100%; margin-top:-15px; top:50%; left:0;}
.sp-vertical .sp-arrows { height:100%; margin-left:-10px; top:0; left:50%;}

.sp-arrow { width:50px; height:50px; display:block; position:absolute; cursor:pointer;}

.sp-vertical .sp-arrow {
 -webkit-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg);}

.sp-horizontal .sp-previous-arrow { left:160px; background:url(http://yamamotofoods.co.jp/cs-files/images/slider/arrow_r.png) no-repeat left top;}
.sp-horizontal .sp-next-arrow { right:160px; background:url(http://yamamotofoods.co.jp/cs-files/images/slider/arrow_l.png) no-repeat left top;}

.sp-vertical .sp-previous-arrow { top:20px;}
.sp-vertical .sp-next-arrow { bottom:20px;}

.sp-previous-arrow:before,.sp-previous-arrow:after,
.sp-next-arrow:before,.sp-next-arrow:after {
 width:50%; height:50%; content:''; position:absolute;}

.sp-previous-arrow:before {}
.sp-previous-arrow:after {}

.sp-next-arrow:before {}
.sp-next-arrow:after {}

.ie8 .sp-arrow,.ie7 .sp-arrow { width:0; height:0;}
.ie8 .sp-arrow:before,.ie8 .sp-arrow:after,
.ie7 .sp-arrow:before,.ie7 .sp-arrow:after { content:none;}
.ie8.sp-horizontal .sp-previous-arrow,.ie7.sp-horizontal .sp-previous-arrow {}
.ie8.sp-horizontal .sp-next-arrow,.ie7.sp-horizontal .sp-next-arrow {}
.ie8.sp-vertical .sp-previous-arrow,.ie7.sp-vertical .sp-previous-arrow {}
.ie8.sp-vertical .sp-next-arrow,.ie7.sp-vertical .sp-next-arrow {}

/* Thumbnail Arrows
--------------------------------------------------*/
.sp-thumbnail-arrows { position:absolute;}
.sp-fade-thumbnail-arrows {
 opacity:0; -webkit-transition:opacity 0.5s; transition:opacity 0.5s;}
.sp-thumbnails-container:hover .sp-fade-thumbnail-arrows { opacity:1;}

.sp-top-thumbnails .sp-thumbnail-arrows,
.sp-bottom-thumbnails .sp-thumbnail-arrows {
 width:100%; margin-top:-12px; top:50%; left:0;}

.sp-left-thumbnails .sp-thumbnail-arrows,
.sp-right-thumbnails .sp-thumbnail-arrows {
 height:100%; margin-left:-7px; top:0; left:50%;}

.sp-thumbnail-arrow {
 width:15px; height:25px; display:block; position:absolute; cursor:pointer;}

.sp-left-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow,
.sp-right-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow {
 -webkit-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg);}

.sp-top-thumbnails .sp-previous-thumbnail-arrow,
.sp-bottom-thumbnails .sp-previous-thumbnail-arrow { left:0px;}

.sp-top-thumbnails .sp-next-thumbnail-arrow,
.sp-bottom-thumbnails .sp-next-thumbnail-arrow { right:0px;}

.sp-left-thumbnails .sp-previous-thumbnail-arrow,
.sp-right-thumbnails .sp-previous-thumbnail-arrow { top:0px;}

.sp-left-thumbnails .sp-next-thumbnail-arrow,
.sp-right-thumbnails .sp-next-thumbnail-arrow { bottom:0px;}

.sp-previous-thumbnail-arrow:before,.sp-previous-thumbnail-arrow:after,
.sp-next-thumbnail-arrow:before,.sp-next-thumbnail-arrow:after {
 width:50%; height:50%; content:''; position:absolute; background-color:#FFF;}

.sp-previous-thumbnail-arrow:before {
 top:0; left:30%;
 -webkit-transform:skew(145deg, 0deg); -ms-transform:skew(145deg, 0deg); transform:skew(145deg, 0deg);}
.sp-previous-thumbnail-arrow:after {
 top:50%; left:30%;
 -webkit-transform:skew(-145deg, 0deg); -ms-transform:skew(-145deg, 0deg); transform:skew(-145deg, 0deg);}

.sp-next-thumbnail-arrow:before {
 top:0; right:30%;
 -webkit-transform:skew(35deg, 0deg); -ms-transform:skew(35deg, 0deg); transform:skew(35deg, 0deg);}
.sp-next-thumbnail-arrow:after {
 top:50%; right:30%;
 -webkit-transform:skew(-35deg, 0deg); -ms-transform:skew(-35deg, 0deg); transform:skew(-35deg, 0deg);}

.ie8 .sp-thumbnail-arrow,.ie7 .sp-thumbnail-arrow { width:0; height:0;}

.ie8 .sp-thumbnail-arrow:before,.ie8 .sp-thumbnail-arrow:after,
.ie7 .sp-thumbnail-arrow:before,.ie7 .sp-thumbnail-arrow:after {
 content:none;}

.ie8 .sp-top-thumbnails .sp-previous-thumbnail-arrow,
.ie8 .sp-bottom-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-top-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-bottom-thumbnails .sp-previous-thumbnail-arrow {
 border-top:12px solid transparent; border-right:12px solid #FFF; border-bottom:12px solid transparent;}

.ie8 .sp-top-thumbnails .sp-next-thumbnail-arrow,
.ie8 .sp-bottom-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-top-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-bottom-thumbnails .sp-next-thumbnail-arrow {
 border-top:12px solid transparent; border-bottom:12px solid transparent; border-left:12px solid #FFF;}

.ie8 .sp-left-thumbnails .sp-previous-thumbnail-arrow,
.ie8 .sp-right-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-left-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-right-thumbnails .sp-previous-thumbnail-arrow {
 border-bottom:12px solid #FFF; border-right:12px solid transparent; border-left:12px solid transparent;}

.ie8 .sp-left-thumbnails .sp-next-thumbnail-arrow,
.ie8 .sp-right-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-left-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-right-thumbnails .sp-next-thumbnail-arrow {
 border-top:12px solid #FFF; border-right:12px solid transparent; border-left:12px solid transparent;}

/* Video
--------------------------------------------------*/
a.sp-video { text-decoration:none;}
a.sp-video img { -webkit-backface-visibility:hidden; border:none;}
a.sp-video:after {
 width:45px; height:50px; margin:auto; padding-left:5px; content:'\25B6'; text-align:center;
 position:absolute; top:0; right:0; bottom:0; left:0;
 font-size:30px; color:#FFF; line-height:52px;
 border:2px solid #FFF; border-radius:30px; background-color:rgba(0, 0, 0, 0.2);}

/* CSS for preventing styling issues in WordPress
--------------------------------------------------*/
.slider-pro img.sp-image,.slider-pro img.sp-thumbnail {
 max-width:none!important; max-height:none!important; padding:0!important;
 border:none!important; border-radius:0!important;
 -webkit-box-shadow:none!important; -mox-box-shadow:none!important; box-shadow:none!important;
 transition:none; -moz-transition:none; -webkit-transition:none; -o-transition:none;}

.slider-pro a {
 position:static; transition:none!important; -moz-transition:none!important;
 -webkit-transition:none!important; -o-transition:none!important;}

.slider-pro iframe,.slider-pro object,.slider-pro video,
.slider-pro embed,.slider-pro canvas { max-width:none; max-height:none;}

.slider-pro h1.sp-layer { margin:0; font-size:32px; line-height:1.4;}
.slider-pro h2.sp-layer { margin:0; font-size:24px; line-height:1.4;}
.slider-pro h3.sp-layer { margin:0; font-size:19px; line-height:1.4;}
.slider-pro h4.sp-layer { margin:0; font-size:16px; line-height:1.4;}
.slider-pro h5.sp-layer { margin:0; font-size:13px; line-height:1.4;}
.slider-pro h6.sp-layer { margin:0; font-size:11px; line-height:1.4;}
.slider-pro p.sp-layer { margin:0; font-size:14px; line-height:1.4;}
.slider-pro img.sp-layer { border:none;}