@charset "UTF-8";

.wrap-photo {position: relative; padding: 0 35px; min-height: 495px;}
.wrap-photo .title {font-size: 36px; font-family: 'Titillium Web Bold'; padding-bottom: 65px; margin-bottom: 30px; background: url('../images/arrow-photo.png') no-repeat left bottom;}
.wrap-photo .thumb {margin-bottom: 10px;}
.wrap-photo .subject {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 20px; font-family: 'Noto Regular'; margin-bottom: 21px;}
.wrap-photo .subject a {position: relative;}
.wrap-photo .subject a:after {content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #0047bd; transition: all .5s ease;}
.wrap-photo .subject a:hover:after {width: 100%;}
.wrap-photo .subject a:hover {color: #0047bd;}
.wrap-photo .date {font-size: 14px; color: #666666;}
.wrap-photo .control {position: absolute; right: 35px; bottom: 0; width: 100%; text-align: right;}
.wrap-photo .control:after {content: ''; position: absolute; width: calc(100% - 70px); height: 1px; right: 0; top: 50%; background: #9da5a9; }
.wrap-photo .control button {position: relative; z-index: 100; display: inline-block; width: 75px; height: 50px; text-indent: -99999px;}
.wrap-photo .control button.prev {background: #274164 url('../images/arrow-photo-prev.png') no-repeat center center; margin-right: -4px;}
.wrap-photo .control button.next {background: #274164 url('../images/arrow-photo-next.png') no-repeat center center;}
.wrap-photo .nodata {text-align: center; padding: 69% 0;}

@media all and (max-width:1400px) {
    .wrap-photo .title {line-height: 1.2}
}

@media all and (max-width:1023px) {
    .wrap-photo {padding: 0 0 0 35px;}
    .wrap-photo .thumb img {width: 100%;}
    .wrap-photo .title {background-image: none; padding-bottom: 0;}
    .wrap-photo .control {right: 0;}
    .wrap-photo .control:after {width: calc(100% - 35px);}
}

@media all and (max-width:767px) {
    .wrap-photo {padding: 0 0 60px 0;}
    .wrap-photo .control:after {width: calc(100%);}
}

@media all and (max-width:540px) {
    .wrap-photo {min-height: 465px;}
}
