/*.zoom-icon{ display:none;}*/

body {touch-action: pan-x pan-y;}
#loading_wrap{ display:block; position:fixed; width:100%; height:100%; background:#FFF; z-index:9999; line-height:1;}
#loading_wrap .loading_cont{ position:absolute; width:120px; height:40px; left:0; right:0; top:0; bottom:0; margin:auto;}
#loading_wrap .loading_cont span{ display:inline-block; width:0%; height:4px; border-radius:3px;background:#555; position:absolute;
animation-name: fadeInAnime;
animation-fill-mode:backwards;
animation-duration:1.2s;
animation-iteration-count:infinite;
animation-timing-function:ease;
animation-direction:alternate;
}
@keyframes fadeInAnime{
  0% {
    width: 0;
	background:#BBB;
  }

  100% {
    width: 100%;
	background:#555;
  }
}
#loading_wrap .loading_cont .bar1{ top:0;animation-delay: 0s;}
#loading_wrap .loading_cont .bar2{ top:18px;animation-delay: 0.3s;}
#loading_wrap .loading_cont .bar3{ bottom:0;animation-delay: 0.6s;}

#fixed_bottom{ display: none;}

.thumbnail_modal{ width:0%; height:100%; position:absolute; top:0; left:0; background:rgba(80,80,80,0.50);line-height: 1; z-index:50; overflow:hidden;}
.thumbnail_modal_wrap{max-width:420px;width:0%; height:100%; position:absolute; top:0; left:0; background:#FFF; box-shadow:2px 0 4px 0 rgba(0,0,0,0.30);}

.thumbnail_modal_anime{ position:absolute; left:0; top:0; width:100%; height:0%;overflow:auto; border-bottom: 50px solid #FFF; box-sizing:border-box;}

.thumbnail_modal_cont{ display:block;padding:10px; box-sizing:border-box;
/*display: flex;flex-wrap: wrap;flex-direction: row-reverse;*/
}

.thumbnail_modal_wrap .cont{ display:inline-block; width:50%; margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #777; cursor:pointer;}
.thumbnail_modal_wrap .cont img{ max-width:100%; vertical-align:bottom;}
.thumbnail_modal_wrap .cont img:hover{ opacity:0.8;}

.thumbnail_modal_wrap .cont.first{ margin:0 auto 15px; text-align:center; display:block; width:100%; }
.thumbnail_modal_wrap .cont.first img{max-width:50%;}
.thumbnail_modal_wrap .cont.last{ margin:0 auto; display:block; border-bottom:none; text-align:center; width:100%; }
.thumbnail_modal_wrap .cont.last img{max-width:50%;}


.thumbnail_modal,
.thumbnail_modal_wrap{
-moz-transition-property : width;-webkit-transition-property : width;-o-transition-property : width;-ms-transition-property : width;transition-property : width;
-moz-transition-duration : 0.4s;-webkit-transition-duration : 0.4s;-o-transition-duration : 0.4s;-ms-transition-duration : 0.4s;transition-duration : 0.4s;
}
.thumbnail_modal_anime{
-moz-transition-property : height;-webkit-transition-property : height;-o-transition-property : height;-ms-transition-property : height;transition-property : height;
-moz-transition-duration : 0.4s;-webkit-transition-duration : 0.4s;-o-transition-duration : 0.4s;-ms-transition-duration : 0.4s;transition-duration : 0.4s;
}
.thumbnail_modal_on .thumbnail_modal{}




#fixed_bottom{ z-index:55;
-moz-transition-property : transform;-webkit-transition-property : transform;-o-transition-property : transform;-ms-transition-property : transform;transition-property : transform;
-moz-transition-duration : 0.5s;-webkit-transition-duration : 0.5s;-o-transition-duration : 0.5s;-ms-transition-duration : 0.5s;transition-duration : 0.5s;}
#fixed_bottom.hide{
-moz-transform: translateY(100%);-webkit-transform: translateY(100%);-o-transform: translateY(100%);-ms-transform: translateY(100%);transform: translateY(100%); }
.page_control{ box-shadow:0 -1px 3px 0 rgba(0,0,0,0.30); background:#FFF;}
.page_control .flex_wrap{ width:94%; max-width:750px; margin:auto; padding:11px 0 10px;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;
-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;
-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;
}
.page_control .flex_wrap .slide_icon{
    margin: 0 12px;
    max-width: 18px;
    line-height: 1;
    cursor: pointer;}
.page_control .flex_wrap .slide_icon img{ max-width: 100%;}
.page_control .flex_wrap .slide_left{ margin-right: 25px;}
.page_control .flex_wrap .slide_right{ margin-left: 25px;}

.page_control .thumbnail_select{ margin-right:8px; max-width:35px;line-height: 1; cursor:pointer;}
.page_control .thumbnail_select img{ max-width:100%; vertical-align:bottom;}

.page_control .page_now_max{  margin-left:8px;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;
-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;
-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
.page_control .page_now_max .page_now{ min-width:1.3em; text-align:right;}
.page_control .page_now_max .page_max{ min-width:1.3em; text-align:left;}

.turnjs-slider{
	max-width:600px;
	width:90%;
	height:8px;
	background:rgba(0,0,0, 0.2);
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	-ms-border-radius:5px;
	border-radius:5px;
	margin:0 auto;
	flex: 1;
}

.turnjs-slider .thumbnail{
	width:115px;
	height:85px;
	position:absolute;
	background:rgba(0,0,0, 0.5);
	z-index:10000;
	top:-100px;
	left:-17px;
	display:none;

	-webkit-transform:translate3d(0px, 50px, 0px) scale(0.1, 0.1);
	-webkit-transition:-webkit-transform 0.2s;
	-webkit-border-radius:5px;

	-moz-transform:translate3d(0px, 50px, 0px) scale(0.1, 0.1);
	-moz-transition:-moz-transform 0.2s;
	-moz-border-radius:5px;

	-o-transform:translate3d(0px, 50px, 0px) scale(0.1, 0.1);
	-o-transition:-o-transform 0.2s;
	-o-border-radius:5px;

	-ms-transform:translate3d(0px, 50px, 0px) scale(0.1, 0.1);
	-ms-transition:-ms-transform 0.2s;
	-ms-border-radius:5px;

	transform:translate3d(0px, 50px, 0px) scale(0.1, 0.1);
	transition:transform 0.2s;
	border-radius:5px;
}

.no-transition{
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	-ms-transition:none;
}

.turnjs-slider .thumbnail div{
	width:100px;
	margin:7px;
	height:70px;
	background-color:white;
}

.turnjs-slider .ui-state-hover .thumbnail{
	display:block;
	opacity:0;
}

.turnjs-slider .ui-state-active .thumbnail{
	display:block;
	opacity:1;
	-webkit-transform:scale(1, 1);
	-moz-transform:scale(1, 1);
	-o-transform:scale(1, 1);
	-ms-transform:scale(1, 1);
	transform:scale(1, 1);
}

/* Layout helpers
----------------------------------*/

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}

/* Misc visuals
----------------------------------*/

/* Overlays */
.turnjs-slider .ui-widget-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.turnjs-slider .ui-slider {
	position: relative;
	text-align: left;
}

.turnjs-slider .ui-slider-handle{
	position: absolute;
	z-index:0;
	width:20px;
	height: 20px;
	border-radius:50%;
	background:#4D4D4D;
}

.turnjs-slider .ui-slider-horizontal {
	height: 20px;
	margin-left:10px;
	width : 90%;
   width : -webkit-calc(100% - 20px) ;
   width : calc(100% - 20px) ;
}

.turnjs-slider .ui-slider-horizontal .ui-slider-handle {
	margin-left:-0px;
	margin-top:-7px;
	-moz-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%); 
}

/* Interaction states
----------------------------------*/
.turnjs-slider .ui-slider-handle{
	border:1px solid white;
	opacity:1;
	display:block;
	-webkit-transition:background 0.2s;
	-moz-transition:background 0.2s;
	-ms-transition:background 0.2s;
	-o-transition:background 0.2s;
	transition:background 0.2s;
}

.turnjs-slider .ui-state-hover{
	background:#222;
}

.turnjs-slider .ui-state-active{
	background:#000;
}