/*modal style*/
.modal-layer { display: none; position: fixed; top: 50%; left: 50%; z-index: 200; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); max-width: calc(100% - 40px); }
.modal-layer.video { width: 960px; }
.dim-layer { display: none; position: fixed; _position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 200; }
.dim-layer-on { display: block; }
.dim-layer .dim-bg { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; background: #000; opacity: .8; filter: alpha(opacity=80); }
.dim-layer .modal-layer { display: block; }
.modal-close { position: absolute; top: 0; right: -80px; z-index: 200; width: 58px; height: 58px; border: none; background: url('../img/ico_x1.png') center center no-repeat; background-size: contain; }
.modal-container { display: flex; flex-direction: column; justify-content: center; height: 100%; }

.modal-viewer .img-group { height: 600px; text-align: center; box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.3); box-sizing: border-box; }
.modal-viewer .img-group .thumb { max-height: 100%; }
.modal-viewer .tit { margin-top: 20px; font-size: 24px; font-weight: 400; color: #fff; text-align: center; letter-spacing: -0.6px; }

.modal-viewer .video-group { position: relative; height: 540px; box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.3); box-sizing: border-box; }
.modal-viewer .video-group .btn-play { position: absolute; top: 50%; left: 50%; z-index: 1; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); border: none; background: none; filter: drop-shadow(0 4px 3px rgba(0, 0, 0, 0.3)); }
.modal-viewer .video-group iframe { width: 100%; height: 100%; }

.modal-viewer .share-group { display: flex; justify-content: center; align-items: center; margin-top: 20px; }
.modal-viewer .share-group .ico-share { display: block; width: 40px; height: 40px; margin: 0 10px; border: 1px solid #fff; border-radius: 50%; box-sizing: border-box; background: center center no-repeat; background-size: contain; }
.modal-viewer .share-group .ico-share:last-child { margin-right: 0; }
.modal-viewer .share-group .ico-share-facebook { background-image: url('../img/ico_facebook1.png'); }
.modal-viewer .share-group .ico-share-naver { background-image: url('../img/ico_naver1.png'); }
.modal-viewer .share-group .ico-share-youtube { background-image: url('../img/ico_youtube2.png'); }

.dim-layer.apply .dim-bg { opacity: .3; filter: alpha(opacity=30); }
.dim-layer.apply .modal-close { width: 37px; height: 37px; background: url('../img/ico_x3.png') center center no-repeat; background-size: contain; }
.dim-layer.apply .date-wrap { padding:30px; text-align:center; width:500px; height:640px; background-color:#fff; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); }

@media only screen and (max-width: 1080px) {
	.modal-layer { height: 100%; }
	.modal-close { position: fixed; top: 25px; right: 0; width: 40px; height: 40px; }
	.modal-viewer .img-group { height: 59.200vw; }
	.modal-viewer .tit { margin-top: 15px; font-size: 17px; }
	.modal-viewer .video-group { height: 59.200vw; }
	.modal-viewer .video-group .btn-play img { zoom: 0.5; }
	.modal-viewer .share-group { display: flex; }
	.dim-layer.apply .date-wrap { padding: 10px; width: 100%; height: 440px; box-sizing: border-box;  }
}