@charset "utf-8"; /* CSS Document */

/*201601*/
.pop_2016_01 { color:#FFF; width:90%; box-shadow:5px 5px 20px #000; margin:20% 5%; position:absolute; background:#1c46aa; } 
.pop_2016_01 img { width:100%; } 
.pop_2016_01_close { width:46%; float:right; text-align:right; padding:2%; font-size:1.2em; } 
.pop_2016_01_close a,.pop_2016_01_close2 a { color:#fff; } 
.pop_2016_01_close2 { width:46%; float:left; text-align:left; font-size:1.2em; padding:2%; } 
@media screen and (max-width: 360px){
 .pop_2016_01_close { width:46%; text-align:right; float:right; padding:2%; font-size:1em; } 
.pop_2016_01_close2 { width:46%; float:left; font-size:1em; text-align:left; padding:2%; } 
 }


/*20160610 APP_POPUP*/
.popup1606 { position:relative; width:90%; margin:5% auto; } 
.popup1606_close { width:100%; position:absolute; margin-top:10px; top:6%; left:83%; } 
.popup1606_close2 { position:relative; width:100%; font-size:1.1em; font-family:dotum; } 
.popup1606_close2 span { color:#fff; text-decoration:underline; } 

@media screen and (max-width: 639px){
 .popup1606 { position:relative; width:80%; margin:5% auto; } 
.popup1606_close { width:100%; position:absolute; margin-top:10px; top:3%; left:82%; } 
.popup1606_close2 { position:relative; font-size:1em; } 
 }

@media screen and (max-width: 360px){
 .popup1606 { position:relative; width:80%; margin:5% auto; } 
.popup1606_close2 { position:relative; width:100%; font-size:1em; font-family:dotum; } 
 }

/*20160609 event_POPUP*/
.popup1609 { position:relative; width:90%; text-align:left; margin:20% auto; } 
.popup1609 .pop_img img { width:100%; } 
.popup1609 .popup1609_close { width:100%; position:absolute; margin-top:10px; top:2%; left: 90%; } 
.popup1609 .popup1609_close img { width:5%; display:block; } 
.popup1609 .popup1609_close2 { position:relative; width:100%; font-size:1.1em; font-family:dotum; } 
.popup1609 .popup1609_close2 span { color:#fff; text-decoration:underline; } 


/*20160612 APP POPUP*/
.popup_w { position:fixed; top:25%; height:100%; width:100%; z-index:1000; } 
.popup_w .bg { position:absolute; top:0; left:0; width:100%; height:100%; background:#fff; opacity:.7; filter:alpha(opacity=70); } 
.popup1612 { width: 100%; position: absolute; left: -2px; top: -37px; } 
.popup1612 .btn_1612 ul li { float:left; width:100%; } 
.popup1612 .btn_1612 ul li img { width:100% } 
.popup1612_close { width:8%; position:absolute; right:0; top:0%; } 
.popup1612_close img { display:block; width:100% } 
.popup1612_close2 { width:100%; font-size:1.2em; color:#000; position:relative; } 
.popup1612_close2 img { width:5% } 


/*20240228 event modal*/
.eventModal { position: fixed; line-height: normal; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.7); font-family:'Noto Sans KR'; letter-spacing: -1px; z-index: 1; } 
.modalContent { display: flex; flex-direction: column; align-items: center; background-color: #fff; margin: auto; border-radius: 20px; text-align: center; padding: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 400px; width: 80%; height: 450px; } 
.modalContent .eventClick a { cursor: pointer; border-radius: 85px; }
.modalContent .eventClick img { width: 180px; margin-top: 16px; } 
.modalContent p.tit { font-size: 24px; font-weight: 600; color: #111; margin-top: 30px; } 
.modalContent span { font-size: 15px; font-weight: 400; color: #333; padding: 12px 0 30px; } 
.modalContent span.txtBlue { color: #0043A8; } 
.modalContent img.icoSns { width:70px; cursor: pointer; } 
.modalContent .snsWrap { width: 100%; display: flex; justify-content: center; gap: 30px; } 
.modalContent .snsWrap.wrap01 { margin-bottom: 10px; } 
.modalContent .snsWrap p { font-size: 14px; color: #333; padding: 10px 0; } 
.modalBtn { display: flex; align-items: center; position: absolute; bottom: 0; width: 100%; font-size: 17px; color: #333; border-top: 1px solid #aaa; } 
.modalBtn .closeBtn { flex: 1; border-right: 1px solid #aaa; padding: 18px 0; cursor: pointer; } 
.modalBtn .closeBtn:hover, .modalBtn .shareBtn:hover, .modalBtn .backBtn:hover { color: #0043A8; } 
.modalBtn .shareBtn, .modalBtn .backBtn { flex: 1; padding: 18px 0; cursor: pointer; } 
.eventModal.share { display: none; }
.eventModal.joinComp { display: block; }