.pic-box .next .fa,.pic-box .prev .fa{font-size:200%}
.pic-box{vertical-align:middle;position:relative;height:600px;text-align:center}
.pic-box .next a,.pic-box .prev a{position:absolute;bottom:0;margin:auto;top:0;background-color:#999;color:#fff;padding-top:15px;text-align:center;cursor:pointer}
.pic-box .pic,.pic-box .pic>div{margin:auto}
.pic-box .pic{right:0;left:0;width:580px;height:580px}
.pic-box .next,.pic-box .next a,.pic-box .prev,.pic-box .prev a{width:70px;height:70px}
.pic-box .pic>div{right:0;left:0;background-repeat:no-repeat;background-position:center center}
.pic-box .prev a{left:0;z-index:10}
.pic-box .next a{right:0}
.pic-box .next:hover a,.pic-box .prev:hover a{background-color:#aaa}
@media screen and (min-width:1050px){.pic-box .sp:not(.pc),.pic-box .tb.sp:not(.pc),.pic-box .tb:not(.pc){display:none!important}
}
@media screen and (min-width:560px) and (max-width:1050px){.pic-box .pc.sp:not(.tb),.pic-box .pc:not(.tb),.pic-box .sp:not(.tb){display:none!important}
}
@media screen and (max-width:560px){.pic-box .pc.tb:not(.sp),.pic-box .pc:not(.sp),.pic-box .tb:not(.sp){display:none!important}
.pic-box .next a,.pic-box .pic,.pic-box .pic>div,.pic-box .prev a{position:static;top:auto;right:auto;bottom:auto;left:auto;display:block}
.pic-box{height:auto}
.pic-box .pic{margin-bottom:10px;width:auto;height:auto}
.pic-box .prev a{float:left}
.pic-box .next a{float:right}
.pic-box .next .fa,.pic-box .prev .fa{font-size:100%}
.pic-box .next,.pic-box .prev{width:90px;height:30px;display:inline-block}
.pic-box .next{margin-left:30px}
.pic-box .next a,.pic-box .prev a{width:100px;height:35px;font-size:100%;padding-top:0;line-height:35px}
}
#piczoom-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(20,20,20,.9);z-index:90}
#piczoom-close{position:fixed;top:0;right:0;color:#fff;margin:5px 10px;cursor:pointer;line-height:1;z-index:96}
#piczoom-popup{position:absolute;color:#fff;z-index:95}
#photo-area #curr-photo{position:relative}
#photo-area #base{position:absolute;top:0;right:0;bottom:0;left:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}
.zoomContainer{cursor:none;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}
.piczoom-btn.disabled{opacity:.55;cursor:default}
#picture-name{display:flex;justify-content:center}
#picture-name .label,.disableBaseImageResize .pic-box .next,.disableBaseImageResize .pic-box .prev{display:inline-block}
#picture-name .text-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#picture-name .label{flex:none;border-radius:0;padding:3px 5px 2px;margin-bottom:5px;margin-left:5px;background-color:#999;font-size:10px;line-height:1}
.disableBaseImageResize .pic-box{height:auto}
.disableBaseImageResize .pic-box .pic{margin-top:10px;margin-bottom:10px;width:auto;height:auto}
.disableBaseImageResize .pic-box .next a,.disableBaseImageResize .pic-box .prev a{width:70px;height:70px;font-size:100%}
.disableBaseImageResize .pic-box .prev a{float:left}
.disableBaseImageResize .pic-box .next a{float:right}
.disableBaseImageResize .pic-box .next a:not(.pc),.disableBaseImageResize .pic-box .prev a:not(.pc){display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:5px}
@media screen and (orientation:landscape){.disableBaseImageResize .pic-box .next a:not(.pc){flex-direction:column-reverse}
.disableBaseImageResize .pic-box .next a:not(.pc),.disableBaseImageResize .pic-box .prev a:not(.pc){width:60px;height:60px;font-size:90%}
.disableBaseImageResize .pic-box .next a:not(.pc) .fa,.disableBaseImageResize .pic-box .prev a:not(.pc) .fa{margin-bottom:3px}
}
@media screen and (orientation:portrait){#photo-area #msg{margin:0 auto;padding:0 40px;max-width:100vw}
.disableBaseImageResize .pic-box .next a:not(.pc),.disableBaseImageResize .pic-box .prev a:not(.pc){flex-direction:row;position:static;top:auto;right:auto;bottom:auto;left:auto;padding-top:0;width:100%;height:100%;transform:none}
.disableBaseImageResize .pic-box .next a:not(.pc) .fa,.disableBaseImageResize .pic-box .prev a:not(.pc) .fa{font-size:100%}
.disableBaseImageResize .pic-box .next a:not(.pc) .fa{margin-left:.5em}
.disableBaseImageResize .pic-box .prev a:not(.pc) .fa{margin-right:.5em}
}
@media screen and (max-width:1050px) and (orientation:portrait){.disableBaseImageResize .pic-box .next,.disableBaseImageResize .pic-box .prev{width:130px;height:45px}
.disableBaseImageResize .pic-box .next{margin-left:20px}
}
@media screen and (max-width:560px) and (orientation:portrait){.disableBaseImageResize .pic-box .next,.disableBaseImageResize .pic-box .prev{width:100px;height:35px}
.disableBaseImageResize .pic-box .next{margin-left:10px}
}
.pic-box-side .pic{display:flex;align-items:center;justify-content:flex-end}
.pic-box-side .pic #base{position:static!important;margin:0 auto!important}
.pic-box-side .pic .photo-layout-side{flex:none;overflow:hidden auto;margin:-10px -75px -10px 20px;height:calc(100% - 200px);text-align:left}
.pic-box-side .pic .photo-layout-side .face-photo-list{width:130px;height:calc(100% - 20px)}
.pic-box-side .pic .photo-layout-side .face-photo{cursor:default;margin:10px 0}
.pic-box-side .prev a{left:-80px}
.pic-box-side .next a{right:-80px}
@media screen and (orientation:portrait){.pic-box-side,.pic-box-side .pic{height:auto!important}
.pic-box-side .pic{flex-direction:column;justify-content:center}
.pic-box-side .pic #base{margin:0!important}
.pic-box-side .pic .photo-layout-side{overflow:auto hidden;margin:10px 0 0;width:100%;height:auto}
.pic-box-side .pic .photo-layout-side .face-photo-list{display:flex;margin:0 -10px;width:100%;height:140px}
.pic-box-side .pic .photo-layout-side .face-photo{flex:none;margin:10px 10px 0}
.pic-box-side .next a,.pic-box-side .prev a{transform:translateY(-75px)}
.pic-box-side .prev a{left:0}
.pic-box-side .next a{right:0}
}
@media screen and (max-width:560px){.pic-box-side .pic .photo-layout-side .face-photo-list{height:120px}
.pic-box-side .pic .photo-layout-side .face-photo{width:90px}
.pic-box-side .next a,.pic-box-side .prev a{transform:none}
}
@media screen and (max-width:320px){.pic-box-side .pic .photo-layout-side .face-photo-list{height:100px}
.pic-box-side .pic .photo-layout-side .face-photo{width:70px}
}
body.piczoom-active .fixed-bottom:not(.piczoom-fix-bottom){display:none}
