@charset "UTF-8"; .wrap-notice-popup{background: url(../images/popup-background.png) no-repeat top center; background-size: cover; padding: 70px 0 40px 0;min-height:560px;} .wrap-notice-popup .more{display: none;} .popup-notice-wrap{max-width: 1600px; position: relative; margin: 0 auto;} .popup-list-box{width: calc(100% - 400px); z-index: 100;} .popup-list-box li .con::after{content:"";display: table;clear: both;} .popup-list-box .popup-image-box{display: block; float: left; padding: 5px;} .popup-list-box .popup-image{width: 600px; height: 416px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);} .popup-content{float: left; margin-left: 50px; width: calc(100% - 660px);} .popup-list-box .slick-list{margin: 0 -10px;} .popup-list-box .slick-slide{margin: 0 20px; outline: none;} .popup-content .title{font-size: 32px; color: #253369; text-transform: uppercase; letter-spacing: 0.3em; font-family:'TitilliumWeb-Bold'; margin-bottom: 10px;} .popup-content .post-title{font-family: 'Noto Medium'; font-size: 30px; color: #333333; line-height: 40px; margin-bottom: 55px;} .popup-content .post-content{color: white; font-size: 18px; line-height: 28px;} .popup-content .post-link{border: 1px solid white; margin-top: 25px; padding: 10px 41.5px; text-align: center; color: white; border-radius: 50px; display: inline-block; font-family:'S-CoreDream-3Light';} .popup-remote{position: absolute; bottom: 5px; left: 615px; z-index: 200;} .popup-remote::after{content:"";display: table;clear: both;} .popup-remote .popup-prev{width: 50px; height: 50px;float: left; background: rgba(4,46,110,0.7) url(../images/popup-prev.png) no-repeat center center; cursor: pointer;} .popup-remote .popup-stopplay{Width: 50px; height: 50px; background-color: rgba(11,77,162,0.7); float: left;} .popup-remote .popup-stopplay > button{display: none;} .popup-remote .popup-stopplay > button.on{display: block;} .popup-remote .popup-stop{width: 100%; height: 100%; border: 0; background: url(../images/popup-stop.png) no-repeat center center;} .popup-remote .popup-play{width: 100%; height: 100%; border: 0; background: url(../images/popup-play.png) no-repeat center center;} .popup-remote .popup-next{width: 50px; height: 50px; float: left; background: rgba(4,46,110,0.7) url(../images/popup-next.png) no-repeat center center; cursor: pointer;} .popup-remote .popup-total{background-color: rgba(255,255,255,.7); float: left; padding: 0 18px;} .popup-remote .popup-total span{line-height: 50px;} .popup-remote .currents{color: #253369; font-family:'TitilliumWeb-SemiBold';} .popup-remote .slashes{display: inline-block; font-family:'TitilliumWeb-ExtraLight'; margin: 0 5px; color: #666666;} .popup-remote .totals{color: #666666; font-family:'TitilliumWeb-ExtraLight';} @media all and (max-width: 1500px) { .wrap-notice-popup{padding-bottom: 100px;} .popup-content{width: calc(100% - 450px); margin-left: 40px;} .popup-content .title{font-size: 22px;} .popup-list-box{width: calc(100% - 350px);} .popup-content .post-content{font-size: 16px; line-height: 25px;} .popup-list-box .popup-image{width: 400px; height: 277px;} .popup-remote{bottom: -50px; left: 14px;} } @media all and (max-width: 1200px) { .popup-list-box .popup-image{width: 300px; height: 208px;} .popup-content{width: calc(100% - 350px);} .popup-content .post-title{font-size: 25px; margin-bottom: 40px;} .popup-remote{bottom: 0;} } @media all and (max-width: 1023px) { .wrap-notice-popup{min-height:300px;} .popup-list-box{width: 100%;} .popup-content{width: calc(100% - 330px); margin-left: 20px;} .popup-remote{bottom: -44px; left: 14px;} } @media all and (max-width: 768px) { .wrap-notice-popup{padding: 30px 0 100px 0;} .popup-list-box .popup-image-box{float: none; margin: 0 auto;} .popup-content{margin-left: 0; width: 100%; margin-top: 50px;} .popup-list-box .popup-image{margin: 0 auto; width: 100%; height: 0; padding-bottom: 69.25%;} .popup-content .post-title{color: white;} .popup-content .title{color: white;} .popup-remote{bottom: -80px;} } @media all and (max-width: 420px) { .popup-content{margin-top: 30px;} .popup-content .title{font-size: 16px;} .popup-content .post-title{font-size: 20px; margin-bottom: 20px;} .popup-content .post-content{font-size: 14px; line-height: 20px;} .popup-content .post-link{margin-top: 10px;} .popup-remote{bottom: -70px;} } /*20230509 백그라운드 이미지 alt 값 대신 css로 처리*/ .text-hidden{position: absolute !important; left: -99999px !important; text-indent: -9999px !important;}