@charset "UTF-8";

.pr-photo .photo {position: absolute; width: calc(100% - 950px);}
.pr-photo .photo > div:first-child .box ul:first-child {position: absolute; top:0; overflow: hidden; white-space: nowrap;}
.pr-photo .photo > div:first-child .box.active ul:first-child {animation: rolling 40s linear infinite;}
.pr-photo .photo > div:first-child .box ul:last-child {position: absolute;}
.pr-photo .photo > div:first-child .box.active ul:last-child {animation: rolling 40s linear infinite; animation-delay: -20s;}

.pr-photo .photo > div:last-child ul:first-child {position: absolute; top:0; overflow: hidden; white-space: nowrap;}
.pr-photo .photo > div:last-child .active ul:first-child {animation: rolling 40s linear infinite reverse;}
.pr-photo .photo > div:last-child ul:last-child { position: absolute;}
.pr-photo .photo > div:last-child .active ul:last-child {animation: rolling 40s linear infinite reverse; animation-delay: -20s;}

.pr-photo .photo > div:first-child:hover .box ul:first-child,
.pr-photo .photo > div:first-child:hover .box ul:last-child {animation-play-state: paused;}
.pr-photo .photo > div:last-child:hover .box ul:first-child,
.pr-photo .photo > div:last-child:hover .box ul:last-child {animation-play-state: paused;}

@keyframes rolling {
  0% {transform: translateY(100%);}
  100% {transform: translateY(-100%);}
}

@keyframes rollingWidth {
  0% {transform: translateX(100%);}
  100% {transform: translateX(-100%);}
}

.pr-photo .photo li {margin-bottom: 40px; cursor: pointer;}
.pr-photo .photo img {width: 100%;}
.pr-photo .photo .photo1 {overflow: visible; position: relative; top: -100px; opacity: 0; float: left; width: 50% !important; height: 1px !important; padding-right: 35px;}
.pr-photo .photo .photo2 {overflow: visible; position: relative; top: 80px; opacity: 0; float: left; width: 50% !important; height: 1px !important; padding-left: 35px;}
.pr-photo .photo .thumb {position: relative; overflow: hidden; border-radius: 50px;}
.pr-photo .photo .info {display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6); text-align: center; opacity: 0; transition: opacity .5s;}
.pr-photo .photo .thumb:hover .info {opacity: 1;}
.pr-photo .photo .info .subject {font-family: 'Dream Medium'; font-size: 25px; line-height: 1.6; color: #fff;}
.pr-photo .photo .info .more {display: inline-block; width: 45px; height: 45px; margin-top: 23px; background: url('../images/btn-empl.png') no-repeat center; text-indent: -99999px; transform: rotate(180deg); transition: all 0.3s;}
.pr-photo .photo .thumb:hover .info .more {transform: rotate(360deg);}

@media (max-width: 1700px) {
  .pr-photo .photo {width: calc(100% - 1010px);}
}

@media (max-width: 1500px) {
  .pr-photo .photo {width: calc(100% - 920px);}
  .pr-photo .photo .photo1 {padding-right: 15px; opacity: 1;}
  .pr-photo .photo .photo2 {padding-left: 15px;}
}

@media (max-width: 1350px) {
  .pr-photo .photo {width: calc(100% - 790px);}
  .pr-photo .photo .info .subject {font-size: 20px;}
}

@media (max-width: 1230px) {
  .pr-photo .photo .photo1,
  .pr-photo .photo .photo2 {width: 100% !important; padding-right: 0;}
  .pr-photo .photo .photo2 {display: none;}
}

@media (max-width: 1085px) {
  .pr-photo .photo {width: 310px; margin-top: 230px}
  .pr-photo .photo .photo1 {top: 0;}
  .pr-photo .photo .photo2 {top: 0;}
}

@media (max-width: 940px) {
  .pr-photo .photo {display: block;  margin-top: 0px; bottom:0; height:285px;}
  .pr-photo .photo1 {top:unset !important; bottom:0;}
  .pr-photo .photo1 .box ul {display: flex; height :285px; }
  .pr-photo .photo1 .box ul li {width:200px; margin-right: 40px;}
  .pr-photo .photo .thumb {border-radius:20px;}
  .pr-photo .photo > div:first-child .box.active ul:first-child {animation: rollingWidth 40s linear infinite;}
  .pr-photo .photo > div:first-child .box.active ul:last-child {animation: rollingWidth 40s linear infinite; animation-delay: -20s;}
}