.main-content h2{
    font-size:3.2rem;
    margin-bottom:30px
}

.main-content h3{
    font-size:2.4rem;
    margin-bottom:15px
}

.main-content .section{
    position: relative;
}

.main-inner{
    /*max-width:1400px;
    margin: auto;*/
    position: relative;
}

.title-copy{
    padding:72px 0;
    background-color:#fff;
    background-image: url(../images/title_background.jpg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: cover;
    text-align:center;
}

.title-copy span{
    display: block;
    font-size:2.4rem;
    font-weight:500;
    font-family: 'Pretendard', sans-serif;
}

.title-copy .main-inner{
    font-weight:700;
    font-size:4rem;
    letter-spacing:-0.5px;
    font-family: 'Paperlogy',sans-serif;
}

.title-copy .main-inner > strong{
    font-family: 'Paperlogy',sans-serif;
}

.title-copy .main-inner::after{
    content: "";
    position: absolute;
    right:0;
    top:-10px;
    background-image: url(../images/haerang.png);
    background-repeat: no-repeat;
    width:153px;
    height:189px;
}

.title-copy .main-inner::before{
    content: "";
    position: absolute;
    z-index: 1;
    right:130px;
    top:-10px;
    width: 30px;
    height: 30px;
    background-image: url(../images/ico_heart.svg);
    background-repeat: no-repeat;
    background-size:30px;
    animation: shape 0.9s ease-in 0s infinite alternate;
    /*animation: shape 1.3s linear 0s infinite alternate;*/
}

@keyframes shape {
    0% {
        margin-top: 0px;
    }

    100% {
        margin-top: 10px;
    }
}



/*** current-article ***/
.current-article{
    background-color:#e6f5ff;
    padding:120px 0;
}

.current-article .main-inner{
    display: flex;
    flex-wrap: nowrap;
    gap: 0 80px;
}

.current-article .stats{
    width:50%
}

.current-article .stats .date{
    font-size:1.4rem;
    color:#58677e;
    position: absolute;
    right:30px;
    top:30px
}

.current-article .stats-inner{
    position:relative;
    width:100%;
    height:365px
}

.current-article .stats-inner > ul > li{
    float:left;
    width:50%;
}

.current-article .stats-inner .tab{
    width:100%;
    display: block;
    line-height:60px;
    height:60px;
    font-size:2.4rem;
    letter-spacing:-0.5px;
    transition: all .3s;
    text-align:center;
    border-radius:20px 20px 0 0;
    font-weight: 600;
    position: relative;
}

.current-article .stats-inner .tab:hover{
    background-color:#fff;
}

.current-article .stats-inner .on .tab:hover{
    background-color:#0251ea;
}

.current-article .stats-inner .on .tab:hover::after{
    background-image: url(../images/transparent_hover.svg);
}

.current-article .stats-inner .tab span{
    font-size:1.4rem;
    font-weight:400;
    display:none;
}

.current-article .stats-inner .on .tab{
    background-color:#145ff1;
    color:#fff
}

.current-article .stats-inner .on .tab::after{
    content: "";
    background-image: url(../images/transparent.svg);
    background-repeat: no-repeat;
    background-size: 25px;
    width: 23px;
    height: 22px;
    position: absolute;
    right: -22px;
    bottom: 0;
}

.current-article .stats-inner .on:last-child .tab::after{
    right: auto;
    left:-23px;
    transform: rotate(-90deg);
}

.current-article .stats-inner .sbox{
    position:absolute;
    left:0;
    z-index:10;
    width:100%;
    height:275px;
    background-color:#fff;
    border:1px solid #ccebff;
    border-radius:0 0 20px 20px;
    pointer-events: none;
    user-select: none;
}

.current-article .stats-inner .list {
    padding:27px 30px;
    border-bottom:1px solid #dfe5eb;
    position: relative;
    height:50%;
}

.current-article .stats-inner .list:last-child{
    border-bottom:0
}

.current-article .stats-inner .list ul{
    display: flex;
    flex-wrap: nowrap;
    gap: 0 20px;
    width: 100%;
    justify-content: space-between;
}

.current-article .stats-inner .list li{
    display: flex;
    align-items: center;
    width: 100%;
}

.current-article .stats-inner .list .ltit{
    color:#58677e;
    width: 55px;
}

.current-article .stats-inner .list .count{
    font-size:3.3rem;
    line-height:0;
    font-weight:700;
    width:calc(100% - 60px);
    text-align:right;
}

.current-article .graph-inner{
    position:relative;
    width:100%;
    height:315px;
    border-radius:20px;
    background-color:#fff;
    border:1px solid #ccebff;
    padding:27px 30px;
}

.current-article .map-inner{
    position:relative;
    width:100%;
    height:664px;
}

.current-article .map .date{
    font-size:1.2rem;
    color:#58677e;
    position: absolute;
    right:0;
    bottom:0
}

.current-article .map .ntc-text{
    font-weight:600;
}

.current-article .map-inner > ul > li{
    width:100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.current-article .map-inner .tab{
    width:230px;
    line-height:54px;
    display: block;
    border:1px solid #ccebff;
    background-color:#fff;
    font-size:1.8rem;
    color:#58677e;
    transition: all ease-in-out .3s;
    border-radius:54px;
    text-align:center;
    margin-bottom:10px;
    position: relative;
}

.current-article .map-inner .tab::after{
    content:"";
    background-repeat: no-repeat;
    background-size: 20px;
    width: 22px;
    height: 16px;
    position: absolute;
    right: 14px;
    top:42%;
    transform: translateY(-42%);
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);   
}

.current-article .map-inner .tab:hover{
    background-color:#f8fafc;
    border:1px solid #cbd5e1
}

.current-article .map-inner .tab:hover::after{
    background-image: url(../images/ico_more.svg);
    transform: translate(25%, -42%);
}

.current-article .map-inner .on .tab{
    border:1px solid #003163;
    background-color:#003163;
    font-weight:600;
    color:#fff
}

.current-article .map-inner .on .tab::after{
    background-image: url(../images/ico_more_w.svg);
}

.current-article .map-inner .mbox{
    width: calc(100% - 280px);
    position: absolute;
    right: -50px;
    top: 0;
}

.current-article .map{
    width:50%
}

.current-article .cur-inner{
    position: absolute;
    left:0;
    bottom:0
}

.current-article .cur-inner .btn{
    width: 230px;
    line-height: 45px;
    font-weight:500;
    display: block;
    border: 2px solid #01b0cc;
    color: #01b0cc;
    background-color: #fff;
    background-image: url(../images/icon_quick_04.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: 15px center;
    font-size: 1.6rem;
    padding-left: 20px;
    transition: all ease-in-out .3s;
    border-radius: 54px;
    text-align: center;
    position: relative;
}

/*map-image*/
.map-image{
    position: relative;
    background-image: url(../images/map_background.svg);
    background-repeat: no-repeat;
    width:386px;
    height:640px;
    z-index: 2;
}

.map-image ul{
    position: absolute;
    left:50%;
    transform: translateX(-50%);
    width:100%
}

.map-image li{
    position: absolute;
    text-align:center;
    font-size:1.4rem
}

.map-image li a{
    display: block;
}

.map-image li .text{
    display: block;
    font-weight:500;
    font-size:1.4rem;
    margin-top:5px
}

.map-image li .tag{
    display:inline-block;
    width:54px;
    height:54px;
    padding-top:13px;
    border-radius:52px;
    color:#fff;
    background-color: rgb(0, 136, 86, .8);
    border:3px solid #95ceb9;
    font-size:1.4rem;
    /*position: relative;*/
}

.map-image li .tag::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -3px;
    left: -3px;
    width: 60px;
    height:60px;
    border-radius:52px;
    /*background: linear-gradient(150deg, #008856, rgba(255, 255, 255, 0.5));*/
    border:3px solid rgb(0, 136, 86, .8);
    transition: all 0.25s ease-in-out;
    animation: twinkle-tag 1s ease-out infinite;   
}

.map-image li .tag.caution{
    background-color: rgb(189, 144, 0, .8);
    border:3px solid #f3d8b5;
}

.map-image li .tag.caution::before{
    border:3px solid rgb(189, 144, 0, .8);
}

.map-image li .tag.danger{
    background-color: rgb(186, 24, 24, .8);
    border:3px solid #e8a7a7;
}

.map-image li .tag.danger::before{
    border:3px solid rgb(186, 24, 24, .8);
}

@keyframes twinkle-tag {
    0% {
        opacity: 0.6;
        transform: scale(0);
    }
    70% {
        opacity: 0;
        transform: scale(1.5);
    }
    100% {
        opacity: 0;
        transform: scale(3);
    }
}

.map-image li.esnorth{right:60px; top:50px}
.map-image li.escentral{right:50px; top:220px}
.map-image li.wsnorth{left:20px; top:150px;}
.map-image li.wscentral{left:30px; top:250px;}
.map-image li.wssouth{left:20px; top:420px}
.map-image li.sscentral{left:150px; top:420px}
.map-image li.sseast{right:70px; top:350px}
.map-image li.sswest{left:80px; top:420px}
.map-image li.jejusea{left:50px; top:500px}

/*해수욕장 방사능*/
.map-image.beach li .text{
    display:inline-block;
}

.map-image.beach li .tag{
    width:45px;
    height:30px;
    line-height:25px;
    padding:0;
}

.map-image.beach li .tag::before {
    width: 50px;
    height:35px;
}

.map-image.beach li.sokcho{right:100px; top:20px}
.map-image.beach li.gyeongpo{right:80px; top:60px}
.map-image.beach li.jangsa{right:30px; top:240px}
.map-image.beach li.yeongildae{right:10px; top:263px}
.map-image.beach li.ilsan{right:20px; top:300px}
.map-image.beach li.jinha{right:25px; top:325px}
.map-image.beach li.haeundae{right:10px; top:350px}
.map-image.beach li.gwangalli{right:30px; top:370px}
.map-image.beach li.hakdong{right:70px; top:400px}
.map-image.beach li.sangju{right:100px; top:420px}
.map-image.beach li.yulposolbat{left:82px; top:425px}
.map-image.beach li.myeongsasimni{left:70px; top:450px}
.map-image.beach li.hamdeok{left:55px; top:490px}
.map-image.beach li.jungmun{left:50px; top:530px}
.map-image.beach li.byeonsan{left:20px; top:330px}
.map-image.beach li.seonyudo{left:20px; top:280px}
.map-image.beach li.daecheon{left:20px; top:240px}
.map-image.beach li.mallipo{left:5px; top:180px}
.map-image.beach li.janggyeongri{left:20px; top:150px}
.map-image.beach li.eurwangni{left:10px; top:120px}


/*지역별*/
.map-image.area li .text{
    display:inline-block;
}

.map-image.area li .tag{
    width:45px;
    height:30px;
    line-height:25px;
    padding:0;
}

.map-image.area li .tag::before {
    width: 50px;
    height:35px;
}

.map-image.area li .tag.cir{
    width:40px;
    height:40px;
    padding: 0;
    line-height:35px;
}

.map-image.area li .tag.cir::before {
    width: 45px;
    height:45px;
}

.map-image.area li.gangwon{right:130px; top:80px}
.map-image.area li.gyeongbuk{right:100px; top:220px}
.map-image.area li.ulsan{right:20px; top:300px}
.map-image.area li.gyeongnam{right:130px; top:340px}
.map-image.area li.busan{right:25px; top:350px}
.map-image.area li.jeju{left:50px; top:500px}
.map-image.area li.jeonnam{left:50px; top:420px}
.map-image.area li.gwangju{left:60px; top:370px}
.map-image.area li.jeonbuk{left:80px; top:310px}
.map-image.area li.chungnam{left:70px; top:230px}
.map-image.area li.incheon{left:40px; top:100px}
.map-image.area li.gyeonggi{left:60px; top:60px}



/*map-copy*/
.map-copy{
    position: absolute;
    left:-87%;
    top: 320px;
    z-index:1;
}

.map-copy .mtit{
    font-size:2rem;
    font-weight:600;
    margin-bottom:15px;
    padding-left:30px;
    position: relative;
}

.map-copy .mtit::after{
    content: "";
    background-image: url(../images/icon_radi.svg);
    background-repeat: no-repeat;
    background-size: 22px;
    width:22px;
    height:22px;
    position: absolute;
    left:0;
    top:5px
}

.map-copy .box{
    font-size:1.2rem;
    width:40%;
    color:#58677e;
    margin-top:20px
}

.map-copy li{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    line-height: normal;
    margin-bottom:10px
}

.map-copy.sea li{
    margin-bottom:8px
}

.map-copy li:last-child{
    margin-bottom:0
}

.map-copy li .label{
    width:46px;
    height:32px;
    line-height:30px;
    border-radius:5px;
    font-weight:500;
    font-size:1.4rem;
    background-color:#fff;
    text-align:center;
    margin-right:15px
}

.map-copy li .label.safe{
    border:1px solid #95ceb9;
    color:#008856
}

.map-copy li .label.caution{
    border:1px solid #f3d8b5;
    color:#ae6300   
}

.map-copy li .label.danger{
    border:1px solid #e8a7a7;
    color:#ba1818   
}

.map-copy li .text-inner{
    font-size:1.5rem
}

.map-copy li .text-inner .wrap{
    display: inline-block;
    vertical-align: middle;
}

.map-copy li .text-inner strong{
    display: block;
    line-height:16px;
}

.map-copy li .text-inner span{
    color:#58677e;
    font-size:1.2rem
}




/*** more-btn ***/
.main-inner .more-btn{
    position: absolute;
    right:0;
    top:10px;
    z-index:1;
}

.main-inner .more-btn a{
    display:inline-block;
    font-size:1.7rem;
    font-weight: 500;
    padding-right:27px;
    position: relative;
    transition: all ease-in-out .3s;
}
.main-inner .more-btn a:hover{
    font-weight: 600;
}

.main-inner .more-btn a::after{
    content: "";
    width:20px;
    height:20px;
    border-radius:20px;
    background-color:#145ff1;
    background-image: url(../images/ico_arrow_w.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size:9px;
    position: absolute;
    right:0;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    transition: all ease-in-out .3s;
}

.main-inner .more-btn a:hover::after{
    background-color:#003163;
}

.main-inner .more-btn ul{
    display: flex;
    flex-wrap: nowrap;
    gap: 0 15px;
}




/*** info-article ***/
.info-article{
    background-color:#fff;
    padding:120px 0;
}

.info-article .main-inner{
    display: flex;
    flex-wrap: nowrap;
    gap: 0 60px;
}

.info-article .exam{
    background-color:#f2f6f8;
    padding:40px;
    border-radius:20px;
    width:50%
}

.info-article .exam .box-list li{
    background-color:#fff;
    border:1px solid #e8edf2;
    padding:30px 30px;
    border-radius:10px;
    margin-bottom:20px;
    display: flex;
    gap:15px;
    align-items: center;
}

.info-article .exam .box-list li:last-child{
    margin-bottom:0
}

.info-article .exam .box-list li .tag{
    background-color:#fff;
    font-weight:400;
    width:90px;
    height:34px;
    line-height:34px;
    border-radius:4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-article .exam .box-list li.ing .tag{
    background-color:#ddfaf3;
    border:1px solid #ddfaf3;
    color:#008856;
}

.info-article .exam .box-list li.end .tag{
    color:#1353c7;
    background-color: #eef9ff;
    border: 1px solid #eef9ff;
}

.info-article .exam .box-list li .tit{
    font-size:2.4rem;
    font-weight:600;
    width:calc(100% - 220px)
}

.info-article .exam .box-list li .tit span{
    display: inline-block;
    vertical-align: middle;
    font-size:1.6rem;
    font-weight:400;
    margin-left:10px
}

.info-article .exam .box-list li .more{
    display:inline-block;
    line-height:45px;
    font-size:1.8rem;
    width:115px;
    border-radius:5px;
    position: relative;
    text-align:center;
    font-weight:500;
}

.info-article .exam .box-list li.ing .more{
    color:#8897a9;
    background-color: #f8fafc;
    border: 1px solid #d0d7df;
    text-align:center;
}

.info-article .exam .box-list li.end .more{
    color: #1353c7;
    background-color: #fff;
    border: 1px solid #8dbae7;
    text-align: left;
    padding-left:15px;
}

.info-article .exam .box-list li.end .more::after{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../images/ico_angle_b.svg);
    background-repeat: no-repeat;
    background-size: 19px;
    background-position: center;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.info-article .exam .box-list li.end .more:hover::after{
    transform: translate(25%, -50%) rotate(-90deg);
}

.info-article .exam .more-btn{
    top:50px;
    right:40px
}

/*system*/
.info-article .system{
    width:50%;
    height:650px;
    display: flex;
    gap:25px;
}

.info-article .system ul{
    width: 50%;
    gap: 25px 0;
    display: grid;
}

.info-article .system li a{
    display: block;
    height: 100%;    
    border-radius:20px;
    font-size:2.4rem;
    font-weight:600;
    position: relative;
}

.info-article .system li span{
    display: block;
    font-size: 1.6rem;
    line-height: 20px;
    font-weight: 400;
    margin-top:10px
    /*position: absolute;
    bottom: 0;
    left: 0;*/
}

.info-article .system .lst a{
    background-repeat: no-repeat;
    background-position: center;
    background-size: 105%;
    background-position:89% 89%;
    padding:40px 30px;
    color:#fff;
    position: relative;
    overflow:hidden;
    transition: background-size .3s ease;
    background-color: #fff;
    border: 1px solid #e8edf2;
    /*box-shadow: 0 0 10px 0px rgba(86, 86, 87, 0.1);*/
}

.info-article .system .lst a:hover{
    background-size: 115%
}

.info-article .system .lst a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(88, 103, 116, .8), rgba(88, 103, 116, .2), rgba(50, 50, 50, .0));
    z-index:1;
}

/*
.info-article .system .lst a::after{
    content:"";
    width:17px;
    height:20px;
    background-image: url(../images/ico_arrow_w.svg);
    background-repeat: no-repeat;
    background-size:17px;
    position: absolute;
    right:20px;
    top: 50px;
    transform: rotate(-90deg);
    z-index:2;
}
*/
.info-article .system .lst a .text{
    position: relative;
    z-index:2;
    display: block;
    height: 100%;     
    font-weight:600;  
    font-size:2.4rem
}

.info-article .system .sl1 a{
    background-image: url(../images/system_background_01.jpg);
    background-color:#e6f5ff;
}

.info-article .system .sl2 a{
    background-image: url(../images/system_background_02.jpg);
    background-color:#ddfaf3;
}

/*
.info-article .system .sl1 a{
    background-image: url(../images/system_bg_icon_01.svg);
    background-size: 110px;
    background-position:89% 85%;
}

.info-article .system .sl2 a{
    background-image: url(../images/system_bg_icon_02.svg);
    background-size: 100px;
}
*/
.info-article .system .rst a{
    display: flex;
    gap: 10px;
    align-items: center;
    justify-items: center;
    background-color:#f2f6f8;
    border-radius:10px;
    padding: 0 0 0 110px;
    transition: all ease-in-out .3s;
}

.info-article .system .rst a:hover{
    background-color:#e6f5ff;
}

.info-article .system .rst a::before{
    content: "";
    width: 60px;
    height: 60px;
    background-size: 37px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    left: 35px;
    top: 50%;
    transform: translateY(-50%);
    background-color: #fff;
    border-radius: 10px;
}

.info-article .system .sr1 a::before{
    background-image: url(../images/icon_system_01.svg);
    background-size:34px;
}

.info-article .system .sr2 a::before{
    background-image: url(../images/icon_system_02.svg);
}

.info-article .system .sr3 a::before{
    background-image: url(../images/icon_system_03.svg);
}

.info-article .system .sr4 a::before{
    background-image: url(../images/icon_system_04.svg);
}

.info-article .system .rst a::after{
    content:"";
    width:17px;
    height:20px;
    background-image: url(../images/ico_arrow.svg);
    background-repeat: no-repeat;
    background-size:17px;
    background-position:center;
    position: absolute;
    right:25px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);  
}

.info-article .system .rst a:hover::after{
    transform: translate(25%, -50%) rotate(-90deg);
}




/*** 하단 info ***/
.main-content .section.info{
    width:100%;
    margin-bottom:120px
}

.main-inner .info ul{
    display: flex;
    flex-wrap: nowrap;
    gap: 0 60px;
}

.main-inner .info li{
    width:50%;
}

.main-inner .info li a{
    display: block;
    position: relative;
    font-size:3.2rem;
    font-weight:700;
    border-bottom:1px solid #000;
    padding-bottom:20px
}

.main-inner .info li a:hover:hover{
    color:#003163
}

.main-inner .info li a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 2px;
    background-color: #003163;
    transform: scale(0);
    transition: transform 0.3s;
}

.main-inner .info li a:hover::before {
    transform: scale(1);
}

.main-inner .info li a::after{
    content:"";
    background-image: url(../images/ico_more.svg);
    background-repeat: no-repeat;
    background-size:28px;
    width:28px;
    height:28px;
    position: absolute;
    right:0;
    top:15%;
    transform: translateY(-15%);
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);   
}

.main-inner .info li a:hover::after{
    transform: translate(25%, -15%);
    background-image: url(../images/ico_more_b.svg);
}




/*** switch-tab ***/
.switch-tab{
    display: inline-flex;
    position: absolute;
    right:20px;
    top:20px;
    background-color: #f2f6f8;
    border: 1px solid #f2f6f8;
    align-items: center;
    border-radius:40px;
}

.switch-tab a{
    display: block;
    background-color:#f2f6f8;
    border-radius:40px;
    padding:5px 10px;
    color:#58677e;
    font-size:1.5rem
}

.switch-tab a.on{
    color: #1353c7;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1353c7;
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.15);
}





/*** popupzone ***/
.popup-zone-wrap {
    position: fixed;
    z-index: 3000;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
}

.popup-zone {
    position: absolute;
    z-index: 3000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.popup-zone .title {
    background-color: rgba(255, 255, 255, 1);
    padding: 7px 0;
    font-size: 1.7rem;
    position: relative;
    width: 100%;
    text-align: left;
}

.popup-zone .thumb {
    width: 100%;
    border:1px solid #dfe5eb;
    padding:3px;
}

.popup-zone .thumb a {
    display: block;
    width: 100%;
    height: 100%;
}

.popup-zone .thumb a:focus {
    outline-offset: -3px
}

.popup-zone .thumb img {
    width: 100%;
    height: 100%;
}

.popup-zone .popup-close {
    background: url(../images/ico_close.svg) no-repeat center center;
    background-size: 17px;
    width: 17px;
    height: 17px;
    position: absolute;
    right: 8px;
    top: 12px;
    cursor: pointer;
    padding: 0;
    border-radius: 0;
    border: 0;
    z-index: 1000;
}

.popup-slider {
    width: 450px;
    padding: 0px 8px 12px;
    background-color: rgba(255, 255, 255, 1);
    border-radius: 5px;
    position: relative;
}

.popup-slider .swiper {
    width: 100%;
    height: 100%;
}

.popup-slider .swiper-slide {
    text-align: center;
    background: #fff;
    display: block;
}

.popup-slider .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popup-slider .swiper-pagination {
    position: inherit;
    top: 5px;
    text-align: left;
    width: auto;
    justify-content: start;
}

.popup-slider .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    text-align: center;
    line-height: 8px;
    font-size: 12px;
    color: #000;
    opacity: 1;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    vertical-align: middle;
}

.popup-slider .swiper-pagination-bullet-active {
    color: #fff;
    background: #256ef4;
    width: 13px;
    height: 13px;
}

.popup-slider .swiper-button-next:after,
.popup-slider .swiper-button-prev:after {
    color: #256ef4;
    font-size: 13px;
    font-weight: bold;
    background-image: url(../images/ico_angle_b.svg);
    width:15px;
    height:15px;
    background-size:15px;
}

.popup-slider .swiper-button-prev,
.popup-slider .swiper-button-next {
    background: #fff;
    box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 5%);
    border-radius: 2px;
}

.popup-slider .swiper-button-prev {
    border-radius: 0px 7px 7px 0;
}

.popup-slider .swiper-button-next {
    border-radius: 7px 0 0 7px;
}

.popup-slider .swiper-button-next,
.popup-slider .swiper-container-rtl .swiper-button-prev {
    width: 18px;
    right: 0px;
}

.popup-slider .swiper-button-prev,
.popup-slider .swiper-container-rtl .swiper-button-next {
    width: 18px;
    left: 0px;
}

.popup-slider .ckdbox {
    position: absolute;
    right: 7px;
    bottom: 15px;
    font-size: 1.5rem;
    z-index:1;
    min-width: unset;
}

.popup-slider .swiper-button-prev.swiper-button-disabled,
.popup-slider .swiper-button-next.swiper-button-disabled {
    display: none;
}

.link-btn-inner{
    display:none;
}




@media screen and (max-width:1499px){
    .current-article .main-inner{flex-wrap: wrap;}
    .current-article .stats, .current-article .map{width:100%}
    .current-article .stats{display: flex; flex-wrap:nowrap; align-items: center; gap:20px;}
    /*.current-article .stats-inner{height:330px;}*/
    .current-article .stats-inner .sbox{height:310px;}
    .current-article .map{margin-top:80px}
    .current-article .map-inner{height:730px;}
    .current-article .map-inner > ul {display: flex; gap:0px 15px;}
    .current-article .map-inner > ul > li{display: inline-flex; width:calc(25% - 10px); gap:0 20px;}
    .current-article .map-inner .tab{width:100%; margin: 0;}
    .current-article .map-inner .mbox{width: 100%; right: auto; top: 80px; left: 50%; transform: translateX(-50%);}
    .map-image{margin:auto;}
    .map-copy{left:0; bottom:100px;}
}


@media screen and (max-width:1399px){
    .title-copy span{font-size:2rem}
    .title-copy .main-inner{font-size:3.3rem;}
    .main-content h2{font-size:2.8rem}
    .main-content h3, .service-site h3{font-size:2rem}  
    .main-content .section{margin-bottom:60px}
    .main-content .section:last-child{margin-bottom:0}      
    .main-content .section.info{margin-bottom:90px}
    .map-copy .mtit{font-size:1.8rem}
    .map-copy li .text-inner{font-size:1.4rem}

    .current-article{padding:90px 0;}
    /*.current-article .stats-inner{height:325px;}*/
    .current-article .stats-inner .sbox{height:325px;}
    .current-article .stats-inner .tab{font-size:1.8rem; height:50px; line-height:50px; border-radius:15px 15px 0 0;}
    .current-article .map{margin:0}
    .current-article .map-inner .tab{line-height:48px; font-size:1.6rem}
    .current-article .stats-inner .list .ltit{font-size:1.5rem; width:50px}
    .current-article .stats-inner .list .count{font-size:2.8rem; width: calc(100% - 50px);}

    .info-article{padding:90px 0;}
    .info-article .main-inner{flex-wrap: wrap;}
    .info-article .exam, .info-article .system{width:100%}
    .info-article .exam .box-list ul{display:flex; flex-wrap: wrap; gap:20px}
    .info-article .exam .box-list li{margin:0; width: calc(50% - 10px); padding:30px;}
    .info-article .exam .box-list li .tit{font-size:2rem; width: calc(100% - 200px)}
    .info-article .exam .box-list li .tag{height:30px; line-height:30px; font-size:1.4rem; width:70px}
    .info-article .exam .box-list li .more{height:40px; line-height:40px; font-size:1.6rem; width:100px}
    .info-article .exam .box-list li.end .more::after{width:16px; height:16px; background-size:16px;}
    .info-article .system{height:490px;}
    .info-article .system li a{border-radius:15px; font-size:2rem}

    .main-inner .info li a{font-size:2.6rem}
    .main-inner .more-btn a{font-size:1.6rem}
    .main-inner .more-btn a::after{width:18px; height:18px; background-size:8px;}   
}


@media screen and (max-width:1099px){
    .current-article .stats{flex-wrap: wrap;}
    .current-article .stats-inner{height:301px;}
    .current-article .stats-inner .sbox{height:252px;}
    .current-article .map-inner .mbox{left:auto; transform:none; right:0; width:100%}
    .map-image{float:right; width:400px}

    .info-article .exam .box-list li{width:100%}
    .main-inner .info ul{flex-wrap: wrap; gap:20px;}
    .main-inner .info li{width:100%}

    .title-copy .main-inner::after{top:37px}
    .title-copy .main-inner::before{top:25px}
    .link-btn-inner{display:block; margin-top:20px}
    .link-btn-inner a{display:inline-flex; align-items: center; justify-content: center; height:45px; border-radius:45px; padding:0px 40px 0 20px; background-color:#fff; border: 1px solid #003163; color: #003163; margin:0px 5px; position: relative;}
    .link-btn-inner a::after{content: ""; width: 20px; height: 20px; background-image: url(../images/ico_more.svg); background-repeat: no-repeat; background-size: 19px; background-position: center; position: absolute; right: 15px; top: 50%; transform: translateY(-50%);}
    .link-btn-inner a.em{background-color:#003163; border: 1px solid #003163; color: #fff;}
    .link-btn-inner a.em::after{background-image: url(../images/ico_more_w.svg);}    
}


@media screen and (max-width:767px){
    .title-copy{padding:40px 0;}
    .title-copy .main-inner::before, .title-copy .main-inner::after{content:none;}
    .title-copy .main-inner{font-size:2.5rem; line-height:33px; word-break: keep-all; padding:0px 40px;}
    .title-copy span{font-size:1.6rem; line-height:24px; margin-bottom:10px}

    .main-inner .more-btn{position: relative; right:auto; top:auto; margin-bottom:20px}
    .main-inner .more-btn a{font-size:1.5rem; padding-right:20px}
    .main-inner .more-btn a::after{width:16px; height:16px;}
    .main-inner .info li a{font-size:1.9rem}
    .main-inner .info li a::after{width:24px; height:24px; background-size:24px;}
    .main-content h2{font-size:2.4rem; margin-bottom:15px}
    .main-content .section.info{margin-bottom:50px;}

    .switch-tab a{padding:3px 8px; font-size:1.3rem}

    .current-article{padding:50px 0;}
    .current-article .stats-inner{height:350px;}
    .current-article .stats-inner .sbox{height:300px;}
    .current-article .stats-inner .list li{flex-wrap: wrap;}
    .current-article .stats-inner .list .ltit{width:100%}
    .current-article .stats-inner .list .count{font-size:2.4rem; width:100%; line-height:normal; text-align:left;}

    .current-article .map-inner{height:920px;}
    .current-article .map-inner > ul{flex-wrap: wrap; gap:10px;}
    .current-article .map-inner > ul > li{width: calc(50% - 10px);}
    .current-article .map-inner .mbox{top:125px}
    .current-article .map .date{position: relative; display: block; margin-top:10px}
    .current-article .cur-inner{position: relative; bottom:auto; left:auto; margin-top:10px}

    .map-copy{position: relative; left:auto; bottom:auto; top:auto; margin-top:30px}
    .map-copy .box{width:100%}
    .map-image{float:none; width:300px; height:450px;}
    .map-image li .text{font-size:1.3rem}
    .map-image li .tag{width:30px; height:30px; font-size:1.2rem; padding-top:3px}
    .map-image.beach li .tag, .map-image.area li .tag{width:40px; height:24px; line-height:19px;}
    .map-image.area li .tag.cir{width:30px; height:30px; line-height:25px;}
    .map-image li .tag::before{width:35px; height:35px; left:5px;}
    .map-image.area li .tag.cir::before{width:35px; height:35px; left:-3px; top:-3px}
    .map-image.beach li .tag::before, .map-image.area li .tag::before{width:40px; height:28px; left:-1px; top:2px}
    
    .map-image li.esnorth{right:55px; top:40px}
    .map-image li.escentral{right:30px; top:170px}
    .map-image li.wsnorth{left:10px; top:128px;}
    .map-image li.wscentral{left:25px; top:195px;}
    .map-image li.wssouth{left:8px; top:338px}
    .map-image li.sscentral{left:111px; top:325px}
    .map-image li.sseast{right:52px; top:275px}
    .map-image li.sswest{left:61px; top:337px}
    .map-image li.jejusea{left:35px; top:393px}

    .map-image.beach li.sokcho{right:68px; top:15px}
    .map-image.beach li.gyeongpo{right:52px; top:43px}
    .map-image.beach li.jangsa{right:9px; top:79px}
    .map-image.beach li.yeongildae{right:0; top:199px}
    .map-image.beach li.ilsan{right:4px; top:229px}
    .map-image.beach li.jinha{right:7px; top:251px}
    .map-image.beach li.haeundae{right:0; top:274px}
    .map-image.beach li.gwangalli{right:19px; top:295px}
    .map-image.beach li.hakdong{right:46px; top:311px}
    .map-image.beach li.sangju{right:64px; top:326px}
    .map-image.beach li.yulposolbat{left:57px; top:328px}
    .map-image.beach li.myeongsasimni{left:43px; top:349px}
    .map-image.beach li.hamdeok{left:39px; top:377px}
    .map-image.beach li.jungmun{left:39px; top:409px}
    .map-image.beach li.byeonsan{left:15px; top:257px}
    .map-image.beach li.seonyudo{left:8px; top:220px}
    .map-image.beach li.daecheon{left:12px; top:183px}
    .map-image.beach li.mallipo{left:5px; top:142px}
    .map-image.beach li.janggyeongri{left:10px; top:115px}
    .map-image.beach li.eurwangni{left:3px; top:86px}

    .map-image.area li.gangwon{right:88px; top:56px}
    .map-image.area li.gyeongbuk{right:100px; top:220px}
    .map-image.area li.ulsan{right:10px; top:232px}
    .map-image.area li.gyeongnam{right:89px; top:267px}
    .map-image.area li.busan{right:15px; top:267px}
    .map-image.area li.jeju{left:40px; top:385px}
    .map-image.area li.jeonnam{left:41px; top:324px}
    .map-image.area li.gwangju{left:52px; top:283px}
    .map-image.area li.jeonbuk{left:58px; top:235px}
    .map-image.area li.chungnam{left:45px; top:170px}
    .map-image.area li.incheon{left:34px; top:75px}
    .map-image.area li.gyeonggi{left:42px; top:48px}    

    .info-article{padding:50px 0;}
    .info-article .exam{padding:0; background-color:unset;}
    .info-article .exam .more-btn{top:auto; right:auto}
    .info-article .exam .box-list li{padding:20px; gap:0 10px;}
    .info-article .exam .box-list li .tag{height:25px; line-height:25px; font-size:1.2rem; width:60px}
    .info-article .exam .box-list li .more{height:36px; line-height:36px; font-size:1.5rem; width:95px}
    .info-article .exam .box-list li .tit{width:calc(100% - 165px); font-size:1.8rem}
    .info-article .exam .box-list li .tit span{font-size:1.4rem}

    .info-article .system{flex-wrap:wrap;}
    .info-article .system ul{width:100%; display: flex; flex-wrap: wrap; gap:15px;}
    .info-article .system .lst li{width:calc(50% - 8px);}
    .info-article .system .lst a{background-size: cover; padding:25px;}
    .info-article .system .lst a:hover{background-size:100%;}
    .info-article .system .lst a .text{font-size:1.8rem; height:auto; width:100%; text-align:center; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
    .info-article .system .lst a::before{background: linear-gradient(180deg, rgba(0, 0, 0, .4))}
    .info-article .system .lst a::after{content:none;}
    .info-article .system li span{display:none;}
    .info-article .system .rst li{width:100%}
    .info-article .system .rst a{font-size:1.8rem; padding:15px 15px 15px 80px;}
    .info-article .system .rst a::before{left:20px; width:40px; height:40px; background-size:24px;}
    .info-article .system .rst a::after{right:20px}

    .popup-zone{width:90%}
    .popup-slider{width:100%}
    .popup-zone .title{font-size:1.6rem;}
    .popup-zone .popup-close{background-size:13px; width:13px; height:13px;}

    .link-btn-inner a{flex-wrap: nowrap; width:100%; margin:0 0 10px 0}
    .link-btn-inner a:last-child{margin-bottom:0}
}