@charset "utf-8";


.main_con{padding:0 0 50px 0;margin:0 6.25%}

.main_img p{margin:10px 0;}
.main_img img{width:100%;}

.mvisual{position:relative;padding:0 0 40px 0}
.mvisual h2{margin:30px 0}
.mvisual h2 a{color:var(--color2);display:block;text-overflow:ellipsis;overflow:hidden;max-height:110px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;position:relative}
.mvisual h2 a:hover:after,.mvisual h2 a:focus:after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:2px solid var(--color2)}
.mvis_btn{background:#0f447f;position:absolute;bottom:0;left:0;right:0;height:40px;text-align:center;z-index: 1;}
.mvis_btn button{display:inline-block;width:40px;height:0;padding:40px 0 0 0;margin:0 0 0 3px;background:url("/upload_data/user_file/01_portal/main/ico_main.png") no-repeat;overflow:hidden;vertical-align:middle}
.mvis_btn button.prev{background-position:-100px 0}
.mvis_btn button.next{background-position:-140px 0}
.mvis_btn button.stop{background-position:-180px 0}
.mvis_btn button.play{background-position:-220px 0}
.mvis_btn button.more{background:url("/upload_data/user_file/01_portal/main/mvis_more.png")no-repeat;}
.mvis_btn button.num{display:none;background:none;width:20px;padding:18px 0 0 0;border-radius:100%;border:1px solid #fff;box-shadow:1px 1px 5px rgba(0, 0, 0, .3)}
.mvis_btn button.on{background:#fff;border-color:#0f447f}
.mvis_btn span{display:inline-block;vertical-align:middle}
.mvis_list{border-radius:20px 20px 0 0;border: 1px #e1e1e1 solid;overflow:hidden;}
.mvis_list li a{display:block}
.mvis_list li img{width:100%}
.mvis_pop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, .4);backdrop-filter:blur(4px);z-index:5}
.mvis_pop>div{position:absolute;top:20px;left:50%;width:90%;transform:translate(-50%, 0);background:var(--bg)}
.mvis_pop div div{overflow-y:auto;margin:20px;height:300px}
.mvis_pop h3{background:#0089d0;padding:20px;font-size:18px;color:#fff;text-align:center}
.mvis_pop li{margin:0 0 10px 0}
.mvis_pop li:nth-child(odd){clear:both}
.mvis_pop li a{display:block}
.mvis_pop li img{width:100%}
.mvis_pop p{position:absolute;top:10px;right:10px}
.mvis_pop p a{display:block;width:40px;height:0;padding:40px 0 0 0;background:url("/images/01_portal/common/ico_cmd.png") no-repeat -240px -40px;overflow:hidden}

.infozone{position:relative;margin:40px 0}
.infozone h2{color:var(--color2);margin:0 0 15px 0}
.minfo_btn{position:absolute;top:5px;right:0}
.minfo_btn span{color:#737373;font-size:14px;vertical-align:bottom;line-height:1.5em}
.minfo_btn strong{color:var(--color2);vertical-align:bottom}
.minfo_btn button{width:20px;height:0;padding:20px 0 0 0;background:url("/images/01_portal/main/ico_main.png") no-repeat;overflow:hidden}
.minfo_btn button.prev{background-position:var(--btn_b1)}
.minfo_btn button.next{background-position:var(--btn_b2)}
.minfo_btn button.stop{background-position:var(--btn_b3)}
.minfo_btn button.play{background-position:var(--btn_b4)}
.minfo_btn button.more{background-position:var(--btn_b5)}
.minfo_list li a{display:block}
.minfo_list li img{width:100%}
.minfo_pop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, .4);backdrop-filter:blur(4px);z-index:5}
.minfo_pop>div{position:absolute;top:20px;left:50%;width:90%;transform:translate(-50%, 0);background:var(--bg)}
.minfo_pop div div{overflow-y:auto;margin:20px;height:300px}
.minfo_pop h3{background:#0089d0;padding:20px;font-size:18px;color:#fff;text-align:center}
.minfo_pop li{margin:0 0 10px 0}
.minfo_pop li:nth-child(odd){clear:both}
.minfo_pop li a{display:block}
.minfo_pop li img{width:100%}
.minfo_pop p{position:absolute;top:10px;right:10px}
.minfo_pop p a{display:block;width:40px;height:0;padding:40px 0 0 0;background:url("/images/01_portal/common/ico_cmd.png") no-repeat -240px -40px;overflow:hidden}

.mgovernor{margin:40px 0}
.mgovernor h2{color:var(--color2);margin:0 0 15px 0}
.mgov_left{padding:20px;background:#313e50}
.mgov_left p{color:#fff;font-size:22px}
.mgov_left p strong{display:block;font-size:30px}
.mgov_left li{margin:10px 0 0 0}
.mgov_left li a{color:#fff}
.mgov_left li a:hover,.mgov_left li a:focus{text-decoration:underline}
.mgov_left li a:after{content:"";display:inline-block;width:10px;height:11px;background:url("/images/01_portal/main/ico_main.png") no-repeat 0 -220px;vertical-align:middle;margin:0 0 0 10px}
.mginfo_btn{margin:10px 0;text-align: right;}
.mginfo_btn span{color:#737373;font-size:14px;vertical-align:bottom;line-height:1.5em}
.mginfo_btn strong{color:var(--color2);vertical-align:bottom}
.mginfo_btn button{width:20px;height:0;padding:20px 0 0 0;background:url("/images/01_portal/main/ico_main.png") no-repeat;overflow:hidden}
.mginfo_btn button.prev{background-position:var(--btn_b1)}
.mginfo_btn button.next{background-position:var(--btn_b2)}
.mginfo_btn button.stop{background-position:var(--btn_b3)}
.mginfo_btn button.play{background-position:var(--btn_b4)}
.mginfo_btn button.more{background-position:var(--btn_b5)}
.mginfo_list li a{display:block}
.mginfo_list li img{width:100%}
.mginfo_pop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, .4);backdrop-filter:blur(4px);z-index:5}
.mginfo_pop>div{position:absolute;top:20px;left:50%;width:90%;transform:translate(-50%, 0);background:var(--bg)}
.mginfo_pop div div{overflow-y:auto;margin:20px;height:300px}
.mginfo_pop h3{background:#0089d0;padding:20px;font-size:18px;color:#fff;text-align:center}
.mginfo_pop li{margin:0 0 10px 0}
.mginfo_pop li a{display:block}
.mginfo_pop li img{width:100%}
.mginfo_pop p{position:absolute;top:10px;right:10px}
.mginfo_pop p a{display:block;width:40px;height:0;padding:40px 0 0 0;background:url("/images/01_portal/common/ico_cmd.png") no-repeat -240px -40px;overflow:hidden}

.mico{margin:40px 0;text-align:center}
.mico button{width:50px;height:50px;overflow:hidden;padding:0;background:var(--color9)}
.mico button:before{content:"";display:block;width:20px;height:20px;margin:15px;background:url("/images/01_portal/main/ico_main.png") no-repeat var(--btn_b5)}
.mico_list ul{overflow:hidden}
.mico_list li{float:left;width:25%;margin:0 0 20px 0}
.mico_list li a{display:block;font-weight:700}
.mico_list li a:hover,.mico_list li a:focus{text-decoration:underline}
.mico_list li a:before{content:"";display:block;width:50px;height:50px;background-image:url("/upload_data/user_file/01_portal/main/ico_flink.png");margin:0 auto 5px auto;transition-duration:0.3s;transition-timing-function:ease-out}
.mico_list li a:hover:before,.mico_list li a:focus:before{transform:translateY(-7px)}
.mico_pop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, .4);backdrop-filter:blur(4px);z-index:5}
.mico_pop>div{position:absolute;top:20px;left:50%;width:90%;transform:translate(-50%, 0);background:var(--bg)}
.mico_pop div div{overflow-y:auto;margin:20px;height: 190px;}
.mico_pop h3{background:#0089d0;padding:20px;font-size:18px;color:#fff;text-align:center}
.mico_pop ul{overflow:hidden}
.mico_pop li{float:left;width:25%;margin:0 0 20px 0;text-align:center}
.mico_pop li:nth-child(4n+1){clear:both}
.mico_pop li a{display:block;font-weight:700}
.mico_pop li a:hover,.mico_pop li a:focus{text-decoration:underline}
.mico_pop li a:before{content:"";display:block;width:50px;height:50px;background-image:url("/upload_data/user_file/01_portal/main/ico_flink.png");margin:0 auto 5px auto}
.mico_pop button{position:absolute;top:10px;right:10px;display:block;width:40px;height:0;padding:40px 0 0 0;background:url("/images/01_portal/common/ico_cmd.png") no-repeat -240px -40px;overflow:hidden}

.mnews{margin:40px 0;position:relative}
.mnews h3{color:var(--color2);margin:0 0 15px 0;text-overflow:ellipsis;overflow:hidden;max-height:60px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mnew_btn{/* display:none;position:absolute;top:0;right:0 */margin:10px 0}
.mnew_btn button{width:50px;height:50px;overflow:hidden;padding:0;background:var(--color9)}
.mnew_btn button:before{content:"";display:block;width:20px;height:20px;margin:15px;background:url("/images/01_portal/main/ico_main.png") no-repeat}
.mnew_btn button.prev:before{background-position:var(--btn_b1)}
.mnew_btn button.next:before{background-position:var(--btn_b2)}
.mnew_list{border-top:2px solid var(--color2);padding:20px 0 0 0}
.mnew_list li{margin:0 0 20px 0}
.mnew_list li:nth-child(n+5){display:none}
.mnew_list li a{display:block}
.mnew_list li a:hover,.mnew_list li a:focus{text-decoration:underline}
.mnew_list li img{width:100%;}
.mnew_list li span{display:block;color:var(--color2);font-weight:700;font-size:24px;margin:10px 0 0 0;text-overflow:ellipsis;overflow:hidden;max-height:70px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mnew_list li.play{position:relative}
.mnew_list li.play:after{content:"";display:block;width:40px;height:40px;background:url("/images/01_portal/main/ico_main.png") no-repeat -260px 0;position:absolute;top:40%;left:50%;transform:translate(-50%, -50%)}
.mnews.on .mnew_list li:nth-child(n+5){display:block}
.mnews>button{display:none;width:50px;height:50px;overflow:hidden;padding:0;background:var(--color9);margin:0 auto}
.mnews>button:before{content:"";display:block;width:20px;height:20px;margin:15px;background:url("/images/01_portal/main/ico_main.png") no-repeat var(--btn_b5)}
.mnews.on>button{display:none}

.mbriefing{margin:40px 0;position:relative}
.mbriefing h2{color:var(--color2);margin:0 0 15px 0}
.mbriefing .more{position:absolute;top:-5px;right:0}
.mbriefing .more a{display:block;width:50px;height:50px;overflow:hidden;padding:0;background:var(--color9)}
.mbriefing .more a:before{content:"";display:block;width:20px;height:20px;margin:15px;background:url("/images/01_portal/main/ico_main.png") no-repeat var(--btn_b5)}
.mbri_list{border-top:2px solid var(--color2)}
.mbri_list li:first-child{border:none}
.mbri_list li{border-top:1px solid var(--color8)}
.mbri_list li a{display:block;padding:20px 0}
.mbri_list li strong{display:block;color:var(--color2);margin:0 0 10px 0;text-overflow:ellipsis;overflow:hidden;max-height:50px;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mbri_list li a:hover strong,.mbri_list li a:focus strong{text-decoration:underline}
.mbri_list li em{display:none;line-height:1.5em;text-overflow:ellipsis;overflow:hidden;max-height:50px;
-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--color1)}
.mbri_list li span{display:block;color:#898989;font-size:15px}

.msns{position:relative;height:530px;overflow:hidden}
.msns h2{color:var(--color2);margin:0 0 15px 0}
.msns h3{display:inline-block;margin:0 0 15px 0;position:relative}
.msns h3 a{display:block;width:45px;height:0;padding:55px 0 0 0;overflow:hidden;background:url("/upload_data/user_file/01_portal/main/ico_msns.png") no-repeat}
.msns h3.all a{background-position:0 0}
.msns h3.ut a{background-position:-50px 0}
.msns h3.blog a{background-position:-100px 0}
.msns h3.face a{background-position:-150px 0}
.msns h3.ins a{background-position:-200px 0}
.msns h3.kaka a{background-position:-250px 0}
.msns h3.ch a{background-position:-300px 0}
.msns h3.tv a{background-position:-350px 0}
.msns h3.on.all a{background-position:0 -60px}
.msns h3.on.ut a{background-position:-50px -60px}
.msns h3.on.blog a{background-position:-100px -60px}
.msns h3.on.face a{background-position:-150px -60px}
.msns h3.on.ins a{background-position:-200px -60px}
.msns h3.on.kaka a{background-position:-250px -60px}
.msns h3.on.ch a{background-position:-300px -60px}
.msns h3.on.tv a{background-position:-350px -60px}
/* .msns h3.on:after{content:"";display:block;width:12px;height:9px;background:url("/images/01_portal/main/ico_main.png") no-repeat 0 -180px;position:absolute;bottom:-8px;left:50%;transform:translate(-50%, 0)} */
.msns_list{display:none;position:absolute;top:180px;left:0;width:100%}
.msns_list.on{display:block}
.msns_list ul{overflow:hidden}
.msns_list li{float:left;margin:0 0 100px 0}
.msns_list li a{display:block;position:relative}
.msns_list li.txtlist a{padding:50px 0 0 0}
.msns_list em{display:block;width:50px;height:0;padding:50px 0 0 0;overflow:hidden;background:url("/images/01_portal/main/ico_main.png") no-repeat;position:absolute;top:0;left:0}
.msns_list em.ut{background-position:-60px -160px}
.msns_list em.blog{background-position:-120px -160px}
.msns_list em.face{background-position:-180px -160px}
.msns_list em.ins{background-position:-240px -160px}
.msns_list em.kaka{background-position:-300px -160px}
.msns_list em.ch{background-position:-360px -160px}
.msns_list em.tv{background-position:-420px -160px}
.msns_list img{width:100%;height:190px}
.msns_list strong{color:var(--color2);display:block;margin:20px 0 10px 0;text-overflow:ellipsis;overflow:hidden;max-height:50px;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.msns_list a:hover strong,.msns_list a:focus strong{text-decoration:underline}
.msns_list span{display:block;color:#898989;font-size:15px}
.msns_list span.txt{margin:0 0 10px 0;line-height:1.5em;font-size:17px;text-overflow:ellipsis;overflow:hidden;max-height:130px;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical}
.msns_btn{position:absolute;bottom:0;left:50%;transform:translate(-50%, 0)}
.msns_btn button{width:50px;height:50px;overflow:hidden;padding:0;background:var(--color9)}
.msns_btn button:before{content:"";display:block;width:20px;height:20px;margin:15px;background:url("/images/01_portal/main/ico_main.png") no-repeat}
.msns_btn button.prev:before{background-position:var(--btn_b1)}
.msns_btn button.next:before{background-position:var(--btn_b2)}

/*디데이*/
.d_Day{padding:20px 0 0 0;display: flex;justify-content: center;}
.d_Day a{display:block;}
.d_Day a>p{font-size:19px;font-weight:800;color:#222;line-height:24px;overflow:hidden;letter-spacing:-.5px;color: var(--color2);word-break: keep-all;}
.d_Day a>p:before{content:"";display:block;width: 25px;height: 26px;float:left;background:url("/upload_data/user_file/01_portal/main/han_logo.png")no-repeat;margin: 0 12px 0 0;background-size: cover;}
.d_Day .count{width: 157px;height: 38px;background:url("/upload_data/user_file/01_portal/main/count_bg.png")no-repeat;margin: 0 0 0 37px;position:relative;background-size: cover;}
.d_Day .count strong{font-size: 25px;color:#fff;font-weight:600;position:absolute;right: -2px;top:4px;}
.d_Day .count strong em{display:inline-block;text-align:center;width: 28px;float: left;margin-right: 3px;box-sizing: border-box;}

/* Tablet */
@media all and (min-width:768px) {
.top_search{position:absolute;bottom:20px;right:60px;width:300px}

.start_setting div{top:50%;transform:translate(-50%, -50%)}
.start_setting ul{margin:50px 0}
.start_setting li{display:inline-block;margin:0 20px}

.stset_tit{margin:50px 0}
.stset_tit strong{font-size:30px}
.stset_btn a{font-size:20px;padding:20px 0}

.main_con{margin:0 3.90625%}

.mvisual{padding:0}
.mvisual h2{font-size:40px}
.mvis_btn{background: #3d3d3d;text-align:right;bottom: 0px;right: 0;left: auto;padding: 0px 10px 0 3px;border-radius: 10px 0 0 0;}
.mvis_btn button.num{display:inline-block}
.mvis_pop div div{padding:20px}
.mvis_pop ul{margin-left:-2%}
.mvis_pop li{float:left;width:48%;margin:0 0 10px 2%}

.infozone{margin:50px 0}
.infozone h2{font-size:40px}
.minfo_btn{top:15px}
.minfo_pop div div{padding:20px}
.minfo_pop ul{margin-left:-2%}
.minfo_pop li{float:left;width:48%;margin:0 0 10px 2%}

.mgovernor{margin:50px 0}
.mgovernor>div{background:#313e50}
.mgovernor>div:after{content:"";display:block;clear:both}
.mgovernor h2{font-size:40px}
.mgov_left{float:left;width:40%;box-sizing:border-box;margin:0;padding:30px 30px 0 30px}
.mgov_right{float:right;width:60%;position:relative}
.mginfo_btn{position:absolute;top:-60px;right:0}
.mginfo_pop div div{padding:20px}
.mginfo_pop ul{margin-left:-2%}
.mginfo_pop li{float:left;width:48%;margin:0 0 10px 2%}

.mico{position:relative;margin:50px 0}
.mico>button{position:absolute;top:50%;right:0;transform:translate(0, -50%)}
.mico_list{width:calc(100% - 70px)}
.mico_list li{width: auto;margin: 0 35px;} /* 12.5% */
.mico_list li a{font-size:18px}
.mico_pop div div{padding:20px}
.mico_pop li{width:20%}
.mico_pop li:nth-child(4n+1){clear:none}
.mico_pop li:nth-child(5n+1){clear:both}

.mnews{margin:50px 0;overflow:hidden}
.mnews h3{font-size:40px;max-height:50px;-webkit-line-clamp:1;padding:0 110px 0 0}
.mnew_btn{display:block}
.mnew_list ul{overflow:hidden;margin-left:-10px}
.mnew_list li{float:left;margin:0 0 0 10px;width:calc(33.333% - 10px) !important}
.mnew_list li:nth-child(n+5){display:block}
.mnew_list li.play:after{top:40%;left:50%}
    /*
.mnew_list li.bodo{width:200px !important}
.mnew_list li.photo{width:250px !important}
.mnew_list li.play{width:250px !important}
.mnew_list li.short{width:130px !important}
.mnew_list li.card{width:200px !important}
.mnew_list li.gvn{width:200px !important} */
.mnews>button{display:none}
.mnew_list ul.col3 li{width:calc(33.333% - 10px) !important}
.mnew_list ul.col4 li{width:calc(25% - 10px) !important}
.mnew_list ul.col5 li{width:calc(20% - 10px) !important}
.mnew_list ul.col6 li{width:calc(16.66666666666667% - 10px) !important}

.mbriefing{margin:50px 0}
.mbriefing h2{font-size:40px}
.mbriefing .more{top:0}
.mbri_list li strong{font-size:24px}

.msns{height:350px;margin:50px 0}
.msns>div{text-align:right}
.msns h2{font-size:40px;position:absolute;top:0;left:0}
.msns_list{top:70px}
.msns_list ul{margin-left:-10px}
.msns_list li{width:33.333%}
.msns_list li a{margin:0 0 0 10px;text-align:left}
.msns_btn{display:none}
}

/* Desktop */
@media all and (min-width:1023px) {

.main_img{display:flex; justify-content:space-between;}
.main_img p{margin:0;}
    
.top_search{right:0}
.topsch_pop{top: 50px;right:4px}

.start_setting div{width:700px}

.main_con{width:1400px;margin:0 auto}

.mvisual h2{margin:40px 0;font-size:60px;color: #000;width: fit-content;color: var(--color2);}
.mvisual h2 a{font-size:60px;max-height:70px;-webkit-line-clamp:1}
.mvis_pop>div{width:1100px;top:100px}
.mvis_pop div div{height:500px}
.mvis_pop h3{font-size:30px}
.mvis_pop p{top:17px;right:17px}

.infoline{margin: 100px 0;overflow:hidden}
.infozone{margin:0;width:35.71428571428571%;float:left}
.minfo_list li img{width:500px;height:245px}
.minfo_pop>div{width:1100px;top:100px}
.minfo_pop div div{height:500px}
.minfo_pop h3{font-size:30px}
.minfo_pop p{top:17px;right:17px}

.mgovernor{margin:0;width:60%;float:right}
.mgov_left{padding:45px 45px 0 45px;width:calc(100% - 510px)}
.mgov_left p strong{font-size:38px}
.mgov_right{width:510px}
.mgov_left p strong{font-size:38px}
.mginfo_pop>div{width:1100px;top:100px}
.mginfo_pop div div{height:500px}
.mginfo_pop h3{font-size:30px}
.mginfo_pop p{top:17px;right:17px}

.mico{margin:70px 0}
.mico_pop>div{width:1100px;top:150px}
.mico_pop div div{/* height:190px; */}
.mico_pop h3{font-size:30px}
.mico_pop li{width:12.5%}
.mico_pop li:nth-child(5n+1){clear:none}
.mico_pop li:nth-child(8n+1){clear:both}
.mico_pop button{top:17px;right:17px}

.mnews{margin: 100px 0;}
.mnew_btn{position:absolute;top:0;right:0;margin:0}
.mnew_list ul{margin-left:-30px}
.mnew_list li{margin: 0 0 0 30px;width:calc(33.333% - 30px) !important}
.mnew_list li.play:after{top:40%;left:50%}
/*
.mnew_list li.bodo{width:420px !important}
.mnew_list li.photo{width:420px !important}
.mnew_list li.play{width:420px !important}
.mnew_list li.short{width:210px !important}
.mnew_list li.card{width:290px !important}
.mnew_list li.gvn{width:420px !important}*/
.mnew_list ul.col3 li{width:calc(33.333% - 30px) !important}
.mnew_list ul.col4 li{width:calc(25% - 30px) !important}
.mnew_list ul.col5 li{width:calc(20% - 30px) !important}
.mnew_list ul.col6 li{width:calc(16.66666666666667% - 30px) !important}
.mnew_list li img{height:237px;}

.mbriefing{margin: 100px 0;}
.mbri_list li a{overflow:hidden}
.mbri_list li strong{float:left;width:calc(100% - 100px)}
.mbri_list li em{display:block;display:-webkit-box;}
.mbri_list li span{float:right;width:100px;margin:5px 0 0 0}
.mbri_list li:first-child strong{font-size:34px;float:none;max-height:90px}
.mbri_list li:first-child span{float:none}

.msns{height:360px;margin: 100px 0;}
.msns_list ul{margin-left:-30px}
.msns_list li{width:25%}
.msns_list li a{margin:0 0 0 30px}
.msns_list strong{font-size:20px}

.d_Day{position:absolute;right:-40px;top: -20px;padding: 0;z-index: 2;}
.d_Day a>p{width:90%;}
.d_Day a>p:before{width:40px;height:41px;margin-top:4px;}
.d_Day .count{margin: 7px 0 0 4px;width: 211px;background-size: auto;height: 52px;}
.d_Day .count strong{font-size:36px;}
.d_Day .count strong em{width: 39px;}
}