@keyframes a{0%{opacity:0}to{opacity:1}}
@keyframes b{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes c{0%{transform:translate(-50%,-50%) rotate(0)}50%{transform:translate(-50%,-50%) rotate(-180deg)}to{transform:translate(-50%,-50%) rotate(-1turn)}}
@keyframes d{0%{transform:scale(1)}10%{transform:scale(1.2) translateX(6px)}25%{transform:scale(1.3) translateX(8px)}40%{transform:scale(1.2) translateX(6px)}50%{transform:scale(1)}60%{transform:scale(.8) translateX(6px)}75%{transform:scale(.7) translateX(8px)}90%{transform:scale(.8) translateX(6px)}to{transform:scale(1)}}
@keyframes e{0%{transform:scale(1)}10%{transform:scale(1.2) translateX(-6px)}25%{transform:scale(1.3) translateX(-8px)}40%{transform:scale(1.2) translateX(-6px)}50%{transform:scale(1)}60%{transform:scale(.8) translateX(-6px)}75%{transform:scale(.7) translateX(-8px)}90%{transform:scale(.8) translateX(-6px)}to{transform:scale(1)}}


.lum-lightbox-inner img { 
user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-webkit-user-select:none;
-khtml-user-select:none;
-webkit-user-drag: none;
-khtml-user-drag: none;
-webkit-touch-callout: none;
}


.lum-lightbox{background:#fff}

.lum-lightbox-inner{top:100px;}

.lum-lightbox-inner img{
	z-index:999999;
	position:relative;
	max-width:600px;
	max-height:800px;

}

span.lum-lightbox-position-helper {
    overflow-y: scroll;
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    max-height: 100vh;
width: calc(100% + 17px);
}



.lum-lightbox-inner .lum-lightbox-caption{
    padding-top:6px;padding-bottom:10px;
    font-family: 'Noto Serif JP', sans-serif; 
     font-size: 13px;
    color: #555;   
    margin:0 auto;
	color:#000;
	max-width:700px;
	text-align:center
}

.lum-loading .lum-lightbox-loader{
	display:block;
	position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:66px;height:20px;animation:c 1.8s infinite linear}
.lum-lightbox-loader:after,.lum-lightbox-loader:before{
	content:"";
display:block;width:20px;height:20px;position:absolute;top:50%;margin-top:-10px;border-radius:20px;background:hsla(0,0%,100%,.9)}.lum-lightbox-loader:before{left:0;animation:d 1.8s infinite linear}.lum-lightbox-loader:after{right:0;animation:e 1.8s infinite linear;animation-delay:-.9s}.lum-lightbox.lum-opening{animation:a .18s ease-out}.lum-lightbox.lum-opening .lum-lightbox-inner{animation:b .18s ease-out}.lum-lightbox.lum-closing{animation:a .3s ease-in;animation-direction:reverse}.lum-lightbox.lum-closing .lum-lightbox-inner{animation:b .3s ease-in;animation-direction:reverse}.lum-img{transition:opacity .12s ease-out}.lum-loading .lum-img{opacity:0}

.lum-gallery-button{
	overflow:hidden;
	text-indent:150%;
	white-space:nowrap;
	background:transparent;
	border:0;
	margin:0;
	padding:0;
	outline:0;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	height:100px;
	max-height:100%;
	width:60px;
	cursor:pointer}

.lum-previous-button{
	left:30px}

.lum-next-button{
	right:30px}

.lum-gallery-button:after{content: "";
    display: block;
    position: absolute;
    top: 50%;
    width: 36px;
    height: 36px;
    border-top: 3px solid hsla(0, 0%, 50%, 0.8);}

.lum-previous-button:after{
    transform: translateY(-50%) rotate(-45deg);
    border-left: 3px solid hsla(0, 0%, 50%, 0.8);
    left: 12%;
    border-radius: 3px 0 0 0;}

.lum-next-button:after{ 
    transform: translateY(-50%) rotate(45deg);
    border-right: 3px solid hsla(0, 0%, 50%, 0.8);
    right: 12%;
    border-radius: 0;}

@media (max-width:736px){

	.lum-lightbox-image-wrapper{
	    vertical-align: middle;
    display: table-cell;
    text-align: center;
		-webkit-overflow-scrolling:touch}
		
	.lum-lightbox-caption{width:100%;position:absolute;bottom:0}


.lum-lightbox{
  z-index: 999;
}


.lum-lightbox-inner {
    top: 20px;
right:0;bottom:1%;left:0}  
    
  .lum-lightbox-inner img {
max-width: 70%;
    height: auto;
    margin-left: auto;
       margin-right: 4%;
  }

    
 .lum-previous-button {
    left: 15px;
}   
  .lum-next-button {
    right: 15px;
}  
.lum-gallery-button:after {
    width: 20px!important;
    height: 20px!important;
border-top: 1px solid hsla(0, 0%, 50%, 0.8) !important;
}
.lum-next-button:after {
    border-right: 1px solid hsla(0, 0%, 50%, 0.8)!important;
  }

	.lum-previous-button:after {
    border-left: 1px solid hsla(0, 0%, 50%, 0.8)!important;
    border-radius: 0;
}
	
    
}