@charset "UTF-8";

/* main .flex{
    background: url('/user/images/main.png') no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}
main .main_notice{
    width: 100%;
    height: 100px;
    background: #5B776E;
    display: flex;
    align-items: center;
    padding: 30px;
}
main .main_notice article{
    display: flex;
    height: 100%;
}
main .main_notice article>img{
    align-self: center;
    margin-right: 20px;
}
main .main_notice .swiper{
    position: relative;
    width: 100%;
}
main .main_notice .swiper .swiper-slide{
    display: flex;
    padding: 4px;
}
main .main_notice .swiper .swiper-slide a{
    display: flex;
    width: calc(100% - 80px);
    justify-content: space-between;
    align-items: center;
    font-size: 22px;
}
 main .main_notice .swiper .swiper-slide a .notice_tit{
    display: block;
    width: 80%;
    overflow: hidden;
    color: #fff;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}
main .main_notice .swiper .swiper-slide a .notice_date{
    color: #f7f7f7;
    font-size: 20px;
    font-weight: normal;
}
.main_ctr.notice{
    right: 0;
    left: auto;
    top: 50%;
    transform: translate(0,-50%);
}
main .main_title{
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}
main .main_title h2{
    font-size: 26px;
    font-weight: 600;
    padding-left: 0;
    margin-bottom: 0;
    margin-right: 20px;
}
main .main_title h2 img{
    width: 24px;
    margin-right: 6px;
}
main .main_title h2 span{
    font-size: 20px;
}
main .main_title p{
    font-size: 18px;
    word-break: keep-all;
}
main .main_title h2::before{
    display: none;
}
main .main_btnmenu.mb{
    display: none;
}
main .main_btnmenu{
    padding: 60px 0 100px;
    min-width: 920px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
main .main_btnmenu .quickmenu{
    display: flex;
    width: 100%;
}
main .main_btnmenu .quickmenu .menucard{
    padding: 10px;
    width: 25%;
    height: 220px;
}
main .main_btnmenu .quickmenu .menucard .menubox{
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #fff;
    font-weight: bold;
    letter-spacing: -2px;
}
main .main_btnmenu.pc .quickmenu .menucard:focus-visible{
    outline: none;
}
main .main_btnmenu.mb .quickmenu .menubox:focus-visible{
    outline: Highlight auto 2px;
    outline: -webkit-focus-ring-color auto 2px;
}
main .main_btnmenu>div:not(.main_bottom){margin-bottom: 60px;}
main .main_btnmenu>div{
    height: 290px;
}
/* main .main_middle .quickmenu .menucard>a,main .main_bottom .quickmenu .menucard>a{
    color: #000;
}
main .main_btnmenu .quickmenu .menucard .menubox img{
    display: block;
    margin-top: 16px;
    width: 90px;
}

main .main_btnmenu .quickmenu .menucard:nth-child(1){
    border-radius: 30px 0 0 30px;
}
main .main_btnmenu .quickmenu .menucard:nth-child(4){
    border-radius: 0 30px 30px 0;
}

main .main_top .quickmenu .menucard:nth-child(1){background: #7BA458;}
main .main_top .quickmenu .menucard:nth-child(2){background: #AEC865;}
main .main_top .quickmenu .menucard:nth-child(3){background: #235B42;}
main .main_top .quickmenu .menucard:nth-child(4){background: #427362;}

main .main_middle .quickmenu .menucard:nth-child(1){background: #7ECCB4;}
main .main_middle .quickmenu .menucard:nth-child(2){background: #79B89D;}
main .main_middle .quickmenu .menucard:nth-child(3){background: #5C776E;}
main .main_middle .quickmenu .menucard:nth-child(4){background: #97b9ac;}

main .main_bottom .quickmenu .menucard:nth-child(1){background: #1DA7F0;}
main .main_bottom .quickmenu .menucard:nth-child(2){background: #71cfff;}
main .main_bottom .quickmenu .menucard:nth-child(3){background: #044364;}
main .main_bottom .quickmenu .menucard:nth-child(4){background: #4A6B8E;}

main .main_top .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #3d4a35, #7ba458);}
main .main_top .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #677f34, #aec865);}
main .main_top .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #235b42, #43916e);}
main .main_top .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #141a18, #427362);}
main .main_middle .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #307864, #7eccb4);}
main .main_middle .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #3a6e58, #79b89d);}
main .main_middle .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #5c776e, #5fb396);}
main .main_middle .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #568171, #97b9ac);}
main .main_bottom .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #005889, #1da7f0);}
main .main_bottom .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #006da3, #71cfff);}
main .main_bottom .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #044364, #2e8abb);}
main .main_bottom .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #4a6b8e, #a0bbd9);}

main .main_top .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #3d4a35, #729b4f);}
main .main_top .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #475821, #8da54b);}
main .main_top .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #1d533b, #43916e);}
main .main_top .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #141a18, #427362);}
main .main_middle .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #1a5c48, #548f7d);}
main .main_middle .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #1d5838, #548570);}
main .main_middle .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #445a53, #4f967d);}
main .main_middle .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #315044, #5a8b69);}
main .main_bottom .quickmenu .menucard:nth-child(1){background: linear-gradient(145deg, #005889, #0d8bcf);}
main .main_bottom .quickmenu .menucard:nth-child(2){background: linear-gradient(145deg, #0a577e, #398cb6);}
main .main_bottom .quickmenu .menucard:nth-child(3){background: linear-gradient(145deg, #044364, #2e8abb);}
main .main_bottom .quickmenu .menucard:nth-child(4){background: linear-gradient(145deg, #44688f, #708dad);}

main .main_btnmenu .quickmenu .menucard .menucard_inner{
    opacity: 0;
    display: none;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner .quick_on_title{
    font-size: 24px;
    font-weight: bold;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner .quick_on_desc{
    font-size: 18px;
    margin-bottom: 28px;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner .quick_on_menu{
    display: flex;
    width: 68%;
    flex-wrap: wrap;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner .quick_on_menu li{
    font-size: 16px;
    margin-left: 14px;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner .quick_on_menu li::before{
    content: '▶';
    display: inline-block;
    font-size: 12px;
    color: var(--color-main);
    margin-right: 4px;
}
main .main_middle .quickmenu .menucard .menucard_inner .quick_on_menu li::before{
    color: #3bcf96;
}
main .main_bottom .quickmenu .menucard .menucard_inner .quick_on_menu li::before{
    color: #1da7f0;
}
main .main_btnmenu .quickmenu .menucard .menucard_inner img{
    position: absolute;
    width: 120px;
    right: 36px;
    bottom: 24px;
    filter: invert(30%) sepia(15%) saturate(0%) hue-rotate(163deg) brightness(94%) contrast(79%);
}
main .main_btnmenu .quickmenu .menucard.on{
    position: relative;
    width: 40%;
    height: 260px;
    background: #fff url(/user/images/quickmenu-bg.png) bottom no-repeat !important;
    border: var(--color-main) 1px solid;
    margin-top: -20px;
    padding: 30px;
    box-shadow:10px 10px 25px rgba(0,0,0,0.3);
    border-radius: 20px;
}
main .main_middle .quickmenu .menucard.on{
    background: #fff url(/user/images/quickmenu-bg.png) bottom no-repeat !important;
}
main .main_bottom .quickmenu .menucard.on{
    background: #fff url(/user/images/quickmenu-bg-2.png) bottom no-repeat !important;
}
main .main_middle .quickmenu .menucard.on{
    border:#3bcf96 solid 1px;
}
main .main_bottom .quickmenu .menucard.on{
    border: #1da7f0 solid 1px;
}
main .main_btnmenu .quickmenu .menucard.on .menubox{
    opacity: 0;
    display: none;
}
main .main_btnmenu .quickmenu .menucard.on .menucard_inner{
    opacity: 1;
    display: block;
    word-break: keep-all;
} */

main .flex{    
    display: flex;
    align-items: center;
    /*width: 80%;*/
    width: 1500px;
    height: 100%;
    margin-left: 15%;
    gap: 30px;
    font-weight: bold;
}
main .flex>div{
    min-height: 680px;
}
main .flex .text{
    width: 43%;
}
main .flex .text .num{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 90px;
    background: var(--color-white);
    border-radius: 50%;
    color: var(--color-main);
    font-size: 40px;
    box-shadow: 9px 6px 20px rgba(0,0,0,0.15);
    margin-bottom: 50px;
}
main .flex .text .tit{
    display: block;
    font-size: 40px;
    margin-bottom: 60px;
    color: var(--color-main);
}
main .flex .text .sub{
    display: block;
    font-size: 20px;
    font-weight: normal;
    line-height: 1.8;
    margin-bottom: 45px;
}
main .flex .text .menulist{
    width: 97%;
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
}
main .flex .text .menulist li{
    width: 48%;
    height: 65px;
    padding: 10px;
    /* border: 3px solid #000; */
    border-radius: 30px;
    font-size: 20px;
    text-align: center;
    background: #fff;
    box-shadow: 0 4px 4px rgba(0,0,0,0.25)/*, inset -7px -7px 20px rgba(0,0,0,0.15)*/;
}
main .flex .text .menulist li.narrow{
    line-height: 1;
}
main .flex .text .menulist li a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: var(--color-main);
}
main .flex .content{
    width: 55%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.container .request_cate{
    justify-content: space-between;
    margin-bottom: 0;
}
.container .request_cate.viewer_program>div{
    height: auto !important;
}
/*.container .request_cate.viewer_program .cate_inner{
    height: 485px;
}*/
.container .request_cate .cate_broad ul>div,.container .request_cate.viewer_program .cate_broad ul>div{
    width: 50%;
}
.container .request_cate .cate_broad ul li a,.container .request_cate.viewer_program .cate_broad ul li a{
    pointer-events: unset !important;
}
.container .request_cate .cate_broad ul li .circle,.container .request_cate.viewer_program .cate_broad ul li .circle{
    left: -17%;
}
#section-1{
    /*height: 900px;*/
    height: 1000px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 50px;
}
#section-1 .srch{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /*width: 80%;*/
    width: 1500px;
    /* margin: 50px auto 0; */
    margin-left: 15%;
    margin-bottom: 60px;
    padding: 50px 0 0;
}
#section-1 .srch .srch_box {
    position: relative;
    background-color: #f8f8f8;
    transition: 0.3s;
    display: flex;
    align-items: center;
    height: 100%;
    width: 50%;
    min-width: 280px;
    padding: 10px 30px;
    border-radius: 35px;
    border: 3px solid var(--color-main);
}
#section-1 .srch .srch_box form{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#section-1 .srch .srch_box form input.srch_txt_hd{
    width: 100%;
    text-align: center;
    background: transparent;
    height: 57px;
    font-size: 25px;
}
#section-1 .srch .srch_box form input.srch_txt_hd::placeholder{
    color: #000;
    font-weight: 500;
    text-align: center;
    font-size: 25px;
}
#section-1 .srch .srch_box .srch_btn{
    width: 35px;
    height: 35px;
}
#section-1 .srch .srch_recom{
    display: flex;
    justify-content: center;
    width: 100%;
    font-size: 20px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -40px;
}
#section-1 .srch .srch_recom1 {
    visibility: hidden;
    z-index: 100;
    width: 101.1%;
    height: 471px;
    border: 2px solid;
    border-color: #fff;
    background-color: #f0f0f3;
    border-radius: 0px 0px 16px 16px;
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .13);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .13);
    position: absolute;
    top: 103.8%;
    left: -0.5%;
    }
#section-1 .srch .srch_recom1 li {
    z-index: 100;
    color: #333;
    font-size:20px;
    padding: 8px;
    border-bottom: 1px solid #ddd;
}
#section-1 .srch .srch_recom .recom_tit{
    font-weight: bold;
    margin-right: 40px;
}
#section-1 .srch .srch_recom .recom_list{
    display: flex;
    gap: 0 20px;
}
#section-1 .srch .srch_recom .recom_list li{
    position: relative;
}
#section-1 .srch .srch_recom .recom_list li::after{
    content: "";
    position: absolute;
    top: 6px;
    right: -10px;
    display: block;
    width: 1px;
    height: 20px;
    background: #888;
}
#section-1 .srch .srch_recom .recom_list li:last-child:after{
    display: none;
}
#section-1 .srch .srch_recom .recom_list li button{
    font-size: 20px;
}
#section-1 .flex{
    height: auto;
    flex-wrap: wrap;
}
#section-1 .flex>div{
    /*height: 600px;
    min-height: unset;*/
    display: flex;
    /*flex-direction: column;*/
    justify-content: space-between;
    width: 100%;
    min-height: auto;
}
#section-1 .flex .flex-top .swiper{
    width: calc(100% - 628px);
    border-radius: 15px;
    /*border: 1px solid #ccc;*/
    height: 320px;
    margin: 0;
}
#section-1 .swiper{
    padding: 3px;
}
.main_ctr{
    position: absolute;
    left: 24px;
    top: 24px;
    z-index: 10;
    display: flex;
    align-items: center;
    background: #fff;
}
.btn_play,.btn_pause,.btn_pause_notice{
    width: 26px;
    height: 26px;
    margin-right: 4px;
    cursor: pointer;
}
.btn_play{
    background: url('/user/images/icon/slide_play.png') center no-repeat;
    background-size: contain;
}
.btn_pause{
    background: url('/user/images/icon/slide_pause.png') center no-repeat;
    background-size: contain;
}
.btn_pause_notice{
    background: url('/user/images/icon/slide_pause_w.png') center no-repeat;
}
/*.btn_play:focus,.btn_pause:focus,.btn_pause_notice:focus{
    outline: auto;
}*/
.swiper-pagination{
    display: flex;
}
#section-1 .flex .flex-top .swiper-slide {
    /* text-align: center;
    font-size: 18px;
    min-height: 100px;
    padding: 4px;
    background: transparent; */

    /* Center slide text vertically */
    display: -webkit-box;
        display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#section-1 .flex .flex-top .swiper-slide a{
    display: block;
    border-radius: 15px;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 1px solid #ccc;
}
#section-1 .flex .flex-top .swiper-slide a img {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    object-position: right;
    object-fit: cover !important;
}
#section-1 .flex .flex-top .btn_list{
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    width: 40%;
}
#section-1 .flex .flex-top .btn_list>span{
    display: block;
    margin-bottom: 12px;
    font-size: 28px;
    font-weight: bold;
}
#section-1 .flex .flex-top .btn_list .quickmenu{
    display: flex;
    /*width: 100%;*/
    flex-wrap: wrap;
    gap: 20px;
}
#section-1 .flex .flex-top .btn_list .quickmenu li{
    width: 48%;
    height: 120px;
    border-radius: 15px;
    padding: 0 30px;
    box-shadow: 0 4px 4px rgba(0,0,0,0.25);
    /*background: #00CED1;*/
    background: #008184;
}
#section-1 .flex .flex-top .btn_list .quickmenu li a{
    display: flex;
    /*flex-direction: column;*/
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 8px;
    height: 100%;
}
#section-1 .flex .flex-top .btn_list .quickmenu li a span{
    /*display: flex;
    align-items: center;
    height: 48px;*/
    width: 80%;
    font-size: 26px;
    text-align: center;
    color:#fff;
}
#section-1 .flex .flex-top .btn_list .quickmenu li a img{
    display: block;
    width: 70px;
    height: 70px;
}
/*#section-1 .flex .flex-top .btn_list .quickmenu li:hover{background: var(--color-main);}
#section-1 .flex .flex-top .btn_list .quickmenu li:hover a span{color:#fff;}*/
/*#section-1 .flex .btn_list .quickmenu.top li:nth-child(1):hover .menuicon{background: #FFD194;}
#section-1 .flex .btn_list .quickmenu.top li:nth-child(2):hover .menuicon{background: #FFC29B;}
#section-1 .flex .btn_list .quickmenu.top li:nth-child(3):hover .menuicon{background: #f3bfa0;}
#section-1 .flex .btn_list .quickmenu.top li:nth-child(4):hover .menuicon{background: #e2beb4;}
#section-1 .flex .btn_list .quickmenu.middle li:nth-child(1):hover .menuicon{background: #c2f5dc;}
#section-1 .flex .btn_list .quickmenu.middle li:nth-child(2):hover .menuicon{background: #b5e2c7;}
#section-1 .flex .btn_list .quickmenu.middle li:nth-child(3):hover .menuicon{background: #c6fdd4;}
#section-1 .flex .btn_list .quickmenu.middle li:nth-child(4):hover .menuicon{background: #b9e7bf;}
#section-1 .flex .btn_list .quickmenu.bottom li:nth-child(1):hover .menuicon{background: #c2d5fa;}
#section-1 .flex .btn_list .quickmenu.bottom li:nth-child(2):hover .menuicon{background: #b6cfe7;}
#section-1 .flex .btn_list .quickmenu.bottom li:nth-child(3):hover .menuicon{background: #c2e5f7;}
#section-1 .flex .btn_list .quickmenu.bottom li:nth-child(4):hover .menuicon{background: #b6dae0;}*/

#section-1 .flex .flex-bottom{
    display: flex;
    justify-content: space-between;
}
#section-1 .flex .flex-bottom .flex-left,
#section-1 .flex .flex-bottom .flex-center{
    width: 28%;
}
#section-1 .flex .flex-bottom .flex-right{
    width: 40%;
}
#section-1 .flex .flex-left .tab-menu{
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
    background: var(--color-white);
    border-radius: 20px;
}
#section-1 .flex .flex-left .tab-menu .tab-link span{
    display: block;
    padding: 8px 12px;
    font-size: 18px;
    text-align: center;
    color: var(--color-main);
}
#section-1 .flex .flex-left .tab-menu .tab-link.on>span{
    background: var(--color-main);
    border-radius: 30px;
    color: #fff;
}
#section-1 .flex .flex-left .menu-content{
    display: none;
    position: absolute;
    top: 44px;
    left: 0;
    width: 100%;
    height: 275px;
    padding: 20px;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 4px 4px rgba(0,0,0,0.25);
}
#section-1 .flex .flex-left .menu-content.on{
    display: inherit;
}
#section-1 .flex .plus{
    font-size: 24px;
}
#section-1 .flex .flex-left .menu-content .plus{
    display: block;
    position: absolute;
    right: 20px;
    top: -44px;
}
#section-1 .flex .flex-left .content-box{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
#section-1 .flex .flex-left .content-box li{
    border-bottom: 1px solid #ccc;
    padding: 12px 0;
}
#section-1 .flex .flex-left .content-box li:last-child{
    border-bottom: 0;
}
#section-1 .flex .flex-left .content-box li a{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#section-1 .flex .flex-left .content-box li a p:first-child{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 76%;
}
#section-1 .flex .date{
    font-size: 14px;
    color: #666;
    font-weight: normal;
}
#section-1 .flex .slide-tit{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 4px 20px;
    font-size: 18px;
    background: var(--color-white);
    border-radius: 20px;
}
.swiper-btn{
    display: flex;
    justify-content: end;
    gap: 20px;
    margin-bottom: 20px;
}
#section-1 .flex .swiper-btn{
    align-items: center;
    margin-bottom: 0;
}
#section-1 .flex .swiper-btn>* {
    display: flex;
    justify-content: center;
    align-items: center;
}
#section-1 .flex .flex-vod{
    /*width: 360px;*/
    height: 270px;
    background: #fff;
}
#section-1 .flex .vodSlide a,#section-1 .flex .adSlide a{
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    box-shadow: 0px 4px 4px rgba(0,0,0,0.25);
}
#section-1 .flex .flex-vod iframe, #section-1 .flex .flex-vod img{
    width: 100%;
    height: 100%;
    border-radius: 15px;
    object-fit: cover;
}
#section-1 .flex .swiper-slide{
    background: #fff;
}
#section-2 .content .request_cate .cate_left img{
    height: 350px;
}
#section-3 .content .request_cate .cate_title{
    background: var(--color-main2);
}
#section-4 .content .request_cate .cate_title{
    background: var(--color-main3);
}
#section-5 .content .request_cate .cate_title{
    background: var(--color-main4);
}
#section-2 .content .request_cate .cate_inner,
#section-4 .content .request_cate .cate_inner,
#section-5 .content .request_cate .cate_inner,
#section-2 .content .request_cate .cate_inner a,
#section-4 .content .request_cate .cate_inner a,
#section-5 .content .request_cate .cate_inner a{
    width: 100%;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
/*#section-3 .request_cate .cate_title,#section-3 .btn_lg.active{
    background: var(--color-main2);
}
#section-4 .request_cate .cate_title,#section-4 .btn_lg.active{
    background: var(--color-main3);
}
#section-5 .request_cate .cate_title,#section-5 .btn_lg.active{
    background: var(--color-main4);
}
#section-1 .flex .flex-vod iframe{
    height: 75%;
    border-radius: 15px 15px 0 0;
}
#section-1 .flex .vodSlide p{
    padding: 0 12px;
}
#section-1 .flex .vodSlide p:first-child{
    margin-top: 8px;
}
#section-1 .flex .btn_list .main_btn{
    display: flex;
    align-items: center;
    width: 100%;
    height: 140px;
    padding: 0 6%;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(234,234,234,1) 100%);
    border-radius: 0 10px 10px 0;
    box-shadow:0px 4px 4px rgba(0,0,0,0.25);
    margin-bottom: 12px;
    color: #000;
}
#section-1 .flex .btn_list .main_btn:nth-child(1){
    border-left: #EBAC86 8px solid;
}
#section-1 .flex .btn_list .main_btn:nth-child(2){
    border-left: #837AEB 8px solid;
    text-align: left;
}
#section-1 .flex .btn_list .main_btn:nth-child(3){
    border-left: #63E7EB 8px solid;
    margin-bottom: 0;
}
#section-1 .flex .main_btn .btn_inner{
    display: flex;
    align-items: center;
}
#section-1 .flex .main_btn .btn_inner img{
    margin-right: 20px;
    width: 90px;
}
#section-1 .flex .main_btn .btn_inner p{
    font-size: 14px;
    word-break: keep-all;
}
#section-1 .flex .main_btn .btn_inner .btn_title{
    font-weight: bolder;
    font-size: 28px;
}
#section-1 .flex span{
    display: block;
    font-size: 30px;
    font-weight: bold;
}
#section-1 .flex .flex-left{
    position: relative;
    width: 644px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    gap: 20px;
    background: linear-gradient(to top, white 260px, transparent), url("/user/images/screen1.jpg") no-repeat;
    border: 1px solid #ccc;
    border-radius: 15px;
}
#section-1 .flex .flex-left .service-box {
    width: 100%;
    padding: 0px 20px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}
#section-1 .flex .flex-left::before, #section-1 .flex .flex-left::after{
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background: #ccc;
}
#section-1 .flex .flex-left::after{
    transform: rotate(90deg);
}
#section-1 .flex .flex-left>div{
    width: 100%;
    padding: 30px 20px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#section-1 .flex .flex-left .service-1{
    display: flex;
    justify-content: end;
    align-items: end;
    background: url("/user/images/main-service.png") no-repeat;
    background-position: 33px 33px;
    text-align: right;
}
#section-1 .flex .flex-left .service-1 span{
    font-size: 40px;
}
#section-1 .flex .flex-left>span{
    position: absolute;
    bottom: 250px;
    font-size: 40px;
}
#section-1 .flex .flex-left .service-list{
    width: 100%;
}
#section-1 .flex .flex-left .service-list li{
    text-align: center;
    margin-bottom: 12px;
    font-weight: 500;
    font-size: 24px;
}
#section-1 .flex .flex-left .service-list li:first-child{
    position: relative;
    background: var(--color-sub4);
    color: #000;
    font-size: 24px;
    font-weight: bold;
    padding: 4px 0 4px 38px;
    border-radius: 15px;
}
#section-1 .flex .flex-left .service-list li:first-child::before{
    position: absolute;
    display: block;
    content: "";
    width: 24px;
    height: 24px;
    top: 50%;
    left: 20px;
    transform: translate(0,-50%);
    background: url("/user/images/icon/ic-service-list.png");
}
#section-1 .flex .flex-left .service-list li:last-child{
    margin-bottom: 0;
}
#section-1 .flex .flex-center{
    display: flex;
    flex-direction: column;
}
#section-1 .flex .flex-center span,#section-1 .flex .flex-right span{
    margin-bottom: 4px;
}
#section-1 .flex .flex-center .flex-center-vod{
    width: 360px;
    height: 180px;
    border-radius: 15px;
    box-shadow: 0px 4px 4px rgba(0,0,0,0.25);
}
#section-1 .flex .flex-center .flex-center-vod iframe,#section-1 .flex .flex-center .flex-center-vod img{
    width: 100%;
    height: 100%;
    border-radius: 15px;
}
#section-1 .flex .flex-right{
    position: relative;
    overflow: hidden;
}
.timeline-box{
    height: 638px;
}
.timeline-box::before {
	content: '';
	background: var(--color-main);
    width: 2px;
    height: 91%;
    position: absolute;
    top: 12%;
    left: 2%;
    z-index: -1;
}
.timeline {
    width: 480px;
    height: 100%;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
}
.timeline-item {
	width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}
.timeline-item::after {
	content: '';
	display: block;
	clear: both;
}
.timeline-item .date-box{
    position: relative;
}
.timeline-item .date-box .timeline-circle {
	width: 20px;
	height: 20px;
    background: #fff;
	border: 2px solid var(--color-main);
	border-radius: 50%;
	position: absolute;
	margin-top: 16px;
}
.timeline-item .date-box .date {
	display: inline-block;
	color: var(--color-main);
	padding: 10px;
    font-size: 20px;
    margin-left: 24px;
}
.timeline-item .timeline-content {
	position: relative;
	width: 90%;
	padding: 20px;
    margin-left: 24px;
	background: #fff;
    border: 1px solid var(--color-sub4);
	border-radius: 0 15px 15px 15px;
	box-shadow: 4px 4px 4px rgba(0, 0, 0, .25);
}
.timeline-item .timeline-content h2{
    font-size: 20px;
    margin-bottom: 16px;
}
.timeline-item .timeline-content p{
    color: var(--color-sub2);
    font-weight: normal;
}
.timeline-item .timeline-content.timeline-card {
	padding: 20px 0 0;
}
.timeline-item .timeline-content.timeline-card h2, .timeline-item .timeline-content.timeline-card p {
	padding: 0 20px;
}
.timeline-item .timeline-content.timeline-card .timeline-img {
    background: url('https://picsum.photos/1000/800/?random') center center no-repeat;
	background-size: cover;
	height: 200px;
    margin-top: 20px;
    border-radius: 0 0 15px 15px;
}
#section-2 .flex .content .swiper-btn>*{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
}
#section-2 .flex .content .swiper-btn>div::after{
    font-size: 30px;
}
#section-2 .flex .content .swiper-btn .plus{
    display: block;
    position: relative;
    background: url("/user/images/icon/ic-close.png") center no-repeat;
    transform: rotate(45deg);
}
#section-2 .flex .content .swiper{
    width: 100%;
    height: 100%;
    padding-left: 10px;
    padding-bottom: 10px;
}
#section-2 .flex .content .swiper-slide{
    width: 400px !important;
    height: 590px;
    padding: 45px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 15px;
    position: relative;
    font-size: 28px;
    box-shadow: 0 4px 4px rgba(0,0,0,0.25), inset -7px -7px 20px rgba(0,0,0,0.15);
}
#section-2 .flex .content .swiper-slide .tit{
    margin-bottom: 40px;
}
#section-2 .flex .content .swiper-slide iframe,#section-2 .flex .content .swiper-slide img{
    width: 100%;
    height: 400px;
    border-radius: 15px;
}
#section-2 .flex .content .swiper-slide .menulist{
    position: absolute;
    top: 184px;
    left: 45px;
    font-weight: normal;
    font-size: 24px;
}
#section-2 .flex .content .swiper-slide .menulist li{
    margin-bottom: 8px;
}
#section-2 .flex .content .swiper-slide .menulist li:last-child{
    margin-bottom: 0;
}
#section-2 .flex .content .swiper-slide .menulist li::before{
    content: "- ";
}
#section-2 .flex .content .swiper-slide img{
    position: absolute;
    right: 50px;
    bottom: 50px;
} 
#section-2 .flex .content{
    background: url("/user/images/section-2-img.jpg") no-repeat;
    background-size: cover;
    border-radius: 30px;
}
#section-3 .flex{
    width: 100%; 
}
#section-3 .flex .text{
    width: 34%;
}
#section-3 .flex .content{
    width: 49%;
    overflow: hidden;
} */

/* 통합검색 */
.atc_srch .cont_box{
    padding: 0 0 100px;
}
.atc_srch .sel_row{
    padding: 0 4%;
    margin-bottom: 0;
}
.atc_srch .sel_row .sel{
    margin-right: 0;
}
.atc_srch .srch_list{
    padding: 0 4%;
    margin: 40px 0;
}
.sort_menu{
    margin-bottom: 20px;
    padding: 0 2.5%;
    border-bottom: 1px solid #ccc;
}
.sort_menu ul {
    display: flex;
    padding: 25px 0;
    overflow: auto;
}
.sort_menu li{
    margin: 2px 1.5%;
    min-width: fit-content;
    font-size: 19px;
}
.sort_menu li.active {
    font-size: 20px;
}
.sort_menu li.active a{
    font-weight: 600;
    color: var(--color-main);
}
.srch_item{
    padding: 24px 0;
    border-bottom: 1px solid #ddd;
}
.srch_item .s_tit a{
    font-size: 18px;
    color: #0A41B5;
}
.srch_item .s_cont{
    margin: 10px 0 6px;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.srch_item .s_cont:focus-within{
    outline: 2px solid #111;;
}
.srch_item .s_cont *{
    line-height: 1.4 !important;
    color: #212529 !important;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-size: 16px !important;
    letter-spacing: -0.4px !important;
}
/* .srch_item .s_cont>a+* a{
    pointer-events: none;
} */
.srch_item .s_cont table{
    /* display: none; */
    margin: 10px auto;
}

.srch_item .s_info{
    display: flex;
    align-items: center;
    color: #777;
    font-size: 15px;
}
.srch_item .s_info .divider{
    display: inline-block;
    width: 1px;
    height: 14px;
    margin: 0 10px;
    background-color: #999;
}
.srch_top{
    display: flex;
    justify-content: space-between;
}
.srch_top h3{
    margin-bottom: 0;
}
.srch_top .more{
    color: #777;
}

/* 시청자 권익 상담 신청 */
.request_cate {
    display: flex;
    justify-content: space-around;
    align-items: center;
    /*margin-bottom: 70px;*/
}
.request_cate > div {
    width: 400px;
    /* height: 490px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(204, 204, 204);
    border-image: initial; */
    border-radius: 30px;
    overflow: hidden;
    border: 1px solid #ccc;
}
.request_cate .cate_center{
    width: 100%;
}
.request_cate .cate_title {
    width: 100%;
    text-align: center;
    color: var(--color-white);
    /* height: 60px; */
    background: var(--color-main);
    padding: 18px;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 0;
}
.request_cate .cate_inner {
    height: 406px;
    border-radius: 0 0 30px 30px;
    overflow-y: auto;
    background: #fff;
    font-weight: 500;
    border-top: 0;
}
.request_cate.represent_case .cate_inner {
    height: 306px;
}
.request_cate div ul {
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    width: 90%;
    padding: 14px 0;
    justify-content: center;
    gap: 16px;
}
.request_cate div ul.long {
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-y: auto;
}
.request_cate div ul.block{
    justify-content: flex-start;
}
.request_cate div ul li {
    display: flex;
    flex-direction: column;
    min-height: 78px;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 16px;
    text-align: center;
}
/*.request_cate ul li:focus-within,*/
.request_cate ul li:hover{
    border: 3px solid #111;
    font-weight: bold;
}
.request_cate ul.block li{
    width: 30%;
}
.request_cate ul.bigblock li{
    width: 46%;
}
.request_cate ul.long li {
    min-height: auto;
    border-radius: 20px;
    /* font-size: 15px; */
    background: #fff;
    text-align: left;
}
.request_cate div ul li a {
    width: 100%;
    display: block;
}
.request_cate ul.bigblock li a,.request_cate ul.block li a{
    /*height: 93px;*/
    height: 100%;
    /*padding: 10%;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.request_cate ul.long li a {
    padding: 20px 12px;
}
.request_cate .arrow{
    display: block;
    width: 50px;
    font-size: 50px;
    color: var(--color-sub3);
}

.request_info, .popup_info{
    color: #666;
    display: flex;
    margin: 50px 0;
    font-size: 13pt;
}
.request_info.type2{
    margin-top: 20px;
}
.request_info img, .popup_info img{
    width: 20px;
    height: 20px;
    margin-top: 4px;
    margin-right: 10px;
}
.button_inner{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 80px;
}
.button_inner button{
    margin: 2px 10px;
}
.request_popup{
  width: 550px !important;
}
.request_popup, .password_popup, .index_popup{
    position: fixed;
    display: flex;
    z-index: 1001;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 345px;
    height: 420px;
    background: #fff;
    border: 4px solid var(--color-main);
    align-items: center;
    justify-content: center;
    box-shadow: 10px 4px 10px 0px rgba(0,0,0,0.25);
}
.password_popup{
    width: 500px;
    height: 200px;
}
.index_popup{
    display: block;
    z-index: 101;
    top:110px;
    left:10px;
    transform: translate(0,0);
    border: none;
    box-shadow: none;
}
.index_popup .index_popup_area{
    position: relative;
    width: 100%;
    height: 100%;
}
.index_popup .index_popup_area a, .index_popup .index_popup_area a img{
    width: 100%;
    height: 100%;
    display: block;
}
.index_popup .index_bigclz{
    display: flex;
    gap: 2px;
    width: 100%;
    background: #eee;
    padding: 10px;
}
.request_popup .popup_close,.password_popup .password_close, .index_popup .index_close, .tb_cont.a_pop .popup_close{
    z-index: 10;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    background: url("/user/images/icon/ic-close.png");
    width: 40px;
    height: 40px;
    font-size: 0;
    text-indent: -9999px;
    overflow: hidden;
}
.request_popup .popup_desc,.password_popup .password_desc{
    padding: 20px;
}
.request_popup .popup_desc>p, .password_popup .password_desc>p{
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 12px;
}
.request_popup .popup_desc .popup_info{
    margin: 0 0 38px;
}
.request_popup .popup_desc .input_txt,.password_popup .password_desc .input_txt{
    display: block;
    margin: 12px auto;
    width: 400px;
}
.request_popup .popup_desc .popup_btn,.password_popup .password_desc .popup_btn{
    display: block;
    width: 400px;
    margin: auto;
    padding: 10px 0;
    border: none;
    color: #fff;
    font-weight: bold;
    background: var(--color-main);
    border-radius: 5px;
}

/* 만족도 조사 */
.satisfaction{
    margin-top: 150px;
    padding: 30px 3%;
    background: #f7f7f7;
    border: 3px solid #999;
    border-radius: 20px;
}
.satisfaction_list{
    position: relative;
    margin: 0;
    padding: 10px 0 10px 80px;
    background: url(/user/images/icon/ic-satisfaction.png) no-repeat 0;
}
.satisfaction_list .input_radio label{
    color: #555;
}
.satisfaction_list .opinion{
    position: absolute;
    top: 10px;
    right: 0;
}
.satisfaction_list .opinion input{
    width: 105px;
    height: 50px;
    border-radius: 15px;
    background: #404040;
    font-size: 13pt;
    color: #fff;
}

/* 시청자참여평가프로그램 */
#mapbase #visit a:focus-visible{
    outline: none;
}
.request_cate.viewer_program>div{
    height: 670px;
    background: #fff;
    border-top: 0;
}
.request_cate.viewer_program .cate_region #mapwrapper{
    width: 100%;
    /* height: calc(100% - 60px); */
    position: relative;
    padding: 5px 15px 15px;
}
.request_cate.viewer_program .cate_region #mapwrapper a{
    pointer-events: none;
}
/* .request_cate.viewer_program .cate_region #mapwrapper a:focus-visible{
    outline: 3px solid red;
} */
.request_cate.viewer_program .cate_region .region_all{
    position: absolute;
    display: flex;
    top: 45%;
    left: 20px;
    width: 60px;
    height: 40px;
    border: 1px solid #9CA8B6;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-weight: 500;
    background: #FFFFF3;
    z-index: 10;
}
.request_cate.viewer_program .cate_region #mapwrapper .region_all:hover{
    background: var(--color-beige);
}
.request_cate.viewer_program .cate_inner{
    display: flex;
    justify-content: center;
    /*align-items: center;*/
    height: auto;
    min-height: 406px;
}
.request_cate .cate_inner img,.request_cate.viewer_program .cate_inner img{
    width: 95%;
    object-fit: contain;
}
.request_cate .cate_broad ul,.request_cate.viewer_program .cate_broad ul{
    flex-wrap: nowrap;
    gap: 30px;
    margin-left: 36px;
}
.request_cate .cate_broad ul>div,.request_cate.viewer_program .cate_broad ul>div{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.request_cate .cate_broad ul li,.request_cate.viewer_program .cate_broad ul li{
    position: relative;
    width: 94%;
    /*height: 55px;*/
    height: 65px;
    min-height: auto;
    /*border-radius: 50px;*/
    border-radius: 20px;
}
.request_cate .cate_broad ul li .circle,.request_cate.viewer_program .cate_broad ul li .circle{
    position: absolute;
    left: -6%;
    top: 50%;
    transform: translate(0, -50%);
    width: 55px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 4px solid transparent;
    color: #000;
    background-image: linear-gradient(#fff, #fff), linear-gradient(to right, var(--color-sub1) 0%, var(--color-sub2) 100%);
    background-origin: border-box;
    background-clip: content-box, border-box;
    font-size: 14px;
}
.request_cate .cate_broad ul li .circle.pink,.request_cate.viewer_program .cate_broad ul li .circle.pink{
    background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #f9ba8e 0%, #f078a7 100%);
}
.request_cate .cate_broad ul li a,.request_cate.viewer_program .cate_broad ul li a{
    pointer-events: none;
    margin-left: 10px;
    padding: 20px;
}

/* 참여하기 */
.btn_program{
    display: inline-block;
    padding: 8px 14px;
    border-radius: 5px;
    background-color: #eee;
    font-size: 15px;
}
.btn_program.active a{
    color: #fff;
}
.btn_program.active{
    background-color: var(--color-main);
}

/* 게시판상세 */
.board{
    border-bottom: 1px solid #636363;
}
.board h3{
    padding-bottom: 20px;
    border-bottom: 1px solid #636363;
    font-size: 20px;
    font-weight: 500; 
}
.board .board_info{
    display: flex;
    justify-content: flex-end;
    color: #555;
}
.board .board_info span{
    margin-left: 20px;
}
.board .board_txt{
    padding: 35px 0;
}
.board .board_txt *{
    font-family: 'Noto Sans KR', sans-serif !important;
    max-width: 100% !important;
}

.board .board_txt.answer{
    background-color: #f8f8f8;
}
.board .board_txt.faq {
    display: flex;
    align-items: center;
    padding: 35px 16px;
}
.board .board_txt .faq_t{
    margin-right: 30px;
    padding: 4px 10px;
    color: #666;
    font-size: 15px;
    border: 1px solid #999;
    border-radius: 5px;
    word-break: keep-all;

}
.file_down{
    margin-top: 40px;
    padding: 20px;
    background-color: #f8f8f8;
}
.file_down button{
    padding: 5px 20px;
    font-size: 15px;
}
.file_down button:not(:first-of-type){
    text-align: left;
}
.file_down .sq_btn{
    background-color: white;
    border-color: #999; 
    color: #666;
}
.file_down li + li{
    margin-top: 8px;
}
.data-move-box {
    margin-bottom: 20px;
    border: 1px solid #000;
    border-width: 0px 0 1px;
}
.data-move {
    padding: 15px;
    display: flex;
    flex-wrap: wrap;
}
.data-move:first-child {
    border-bottom: 1px solid #999;
}
.data-move p:first-child {
    margin-right: 80px;
    padding: 5px;
    color: #666;
}
.data-move .d-move {
    width: 81%;
    padding: 5px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

/* 게시판 토글 */
.tit_cont a{
    /*display: block;*/
    display: flex;
    width: 100%;
    align-items: center;
    gap: 6px;
}
.tb_cont {
    display: none;
}
.tb_cont.active {
    display: table-row;
}
.tb_cont {
    background-color:#f8f8f8;
}
.tb_cont td{
    padding: 30px 10px;
}
.tb_cont td:last-child{
    text-align: left;
}
.tb_cont .tb_cont_info{
    margin-bottom: 8px;
    font-size: 14px;
    color: #666;
}
.tb_cont .tb_cont_info.commu{
    display: flex;
    justify-content: space-between;
}
.tb_cont .tb_cont_info span{
    margin-right: 16px;
}
.tb_cont .tb_cont_info.commu span{
    margin-right: 0;
}
.tb_cont .cont_info_mod-del{
    display: flex;
    width: 66px;
    justify-content: space-between;
    margin-right: 12px;
}
.tb_cont .cont_info_mod-del a{
    color: #666;
}
.tb_cont .cont_info_mod-del a + a:before {
    display: inline-block;
    content: '';
    width: 1px;
    height: 16px;
    margin: -3px 6px 0 3px;
    background: #666;
    vertical-align: middle;
}
.tb_cont.question{
    background-color: #fff;
}
.bdbt{
    border-bottom: 1px solid #ccc;
}
.bdt{
    border-top: 1px solid #ccc;
}

.tb_cont.pa td{
    padding: 30px 50px;
}

/* 상담신청 대표상담사례 답변 팝업으로 수정*/
.tb_cont.a_pop {
    z-index: 100;
    display: block;
    position: fixed;
    width: 60%;
    height: 100%;
    max-height: 560px;
    padding: 50px 40px;
    top: 50%;
    left: 60%;
    transform: translate(-50%, -50%);
    background: #fff;
    border: 2px solid #ccc;
    box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.20);
}
.tb_cont.a_pop .a_pop_inner{
    display: inline-block;
    height: 100%;
    padding: 0;
    padding-right: 20px;
    overflow: auto;
}
.tb_cont.a_pop .a_pop_inner *{
    font-size: 16px !important;
    letter-spacing: -0.4px ! important;
}
.tb_cont.a_pop .a_pop_q{
    padding: 20px 0px;
    margin-bottom: 14px;
    font-size: 18px !important;
    font-weight:bold;
    color: #666;
    background: #f7f7f7;
}
.tb_cont.a_pop .btn_close {
    padding: 8px 24px;
    color: #fff;
    border-radius: 4px;
    background: #404040;
}
.ico-lock{
    display: block;
    width: 14px;
    height: 18px;
    background: url("/user/images/icon/ic-lock.png") no-repeat;
    font-size: 0;
    text-indent: -9999px;
    overflow: hidden;
}

/*.password_popup {
    position: absolute;
    top: 50%;
    right: 0%;
    transform: translate(0%, -50%);
    background: #fff;
    border: 4px solid var(--color-main);
    z-index: 99;
    box-shadow: 10px 4px 10px 0px rgba(0,0,0,0.25);
}
.password_popup .password_desc {
    display: flex;
    align-items: center;
    padding: 5px;
}
.password_popup .pwd_tit{
    display: none;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 12px;
    text-align: center;
}
.password_popup .password_desc .popup_btn {
    margin: auto;
    padding: 9px;
    border: none;
    color: #fff;
    font-weight: bold;
    background: var(--color-main);
    border-radius: 5px;
}
.password_popup .password_close {
    cursor: pointer;
    background: url(/user/images/icon/ic-close.png);
    width: 40px;
    height: 40px;
    font-size: 0;
}*/

/* 권익 상담 */
h2 + .request_info{
    margin: 0 0 40px 0;
}
.request_info.rd{
    margin: 10px 0 0 0;
    font-size: 15px;
    color: #E95959;
}
.request_form{
    margin-bottom: 50px;
}
.request_form li{
    margin-bottom: 20px;
    display: flex;
    align-items: flex-start;
}
.request_form li > label{
    position: relative;
    display: inline-block;
    width: 12%;
    margin-right: 30px;
    margin-top: 7.5px;
    word-break: keep-all;
}
.request_form .enter_box{
    width: 86%;
}
.request_form li > label::after{
    display: block;
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    top: 0;
    right: 0;
    background-color: #ccc;
}
.request_form .sel{
    padding: 9px 20px;
    width: 25%;
    min-width: 225px;
    border-color: #ccc;
}
.request_form .input_txt,.request_popup .popup_desc .input_txt, .password_popup .password_desc .input_txt{
    border-color: #ccc;
    font-weight: 300;
}
.request_form .sq_btn{
    border-color: #ccc;
}
.request_form .consult_tit{
    width: 100%;
}
.request_form .consult_txt{
    width: 100%;
    height: 280px;
    resize: none;
    font-size: 16px;
    font-family: 'Noto Sans KR', sans-serif;
}
.request_form + .button_inner{
    margin-bottom: 0;
}
.file_box input:first-child{
    cursor: default;
    outline: none;
}
.file_box label{
    display: inline-block;
    cursor: pointer;
}
.file_box input[type="file"]:focus-visible + label{outline: 2px solid #111;}
.consult_request .show{
    margin-top: 40px;
}


/* 답변완료 */
.step {
    display: block;
    padding: 6px 8px;
    border-radius: 5px;
    background-color: #eee;
    font-size: 15px;
}
.step.two{
    background-color: var(--color-main);
    color: #fff;
}
/* 센터소개 */
/* .center_about .table th, .center_about .table td{
    padding: 20px 15px;
}
.center_about .map_box{
    display: flex;
}
.center_about .map{
    margin-bottom: 20px;
}
.center_about .map img{
    width: 100%;
    display: inline-block;
}
.center_about .map_cont{
   margin-left: 20px; 
}
.center_about .map_cont span{
    margin-right: 10px;
    font-weight: 500;
    color: #555;
} */

/* 이미지형 게시판 */
.photo-list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 45px 5%;
    margin: 30px 0 40px;
}
/*.photo-list:after {
  display: block;
  clear: both;
  content: '';
}*/
.photo-list li {
  width: 30%;
}
.photo-list li a {
  display: block;
}
.photo-list li a:hover .info {
  text-decoration: underline;
}
.photo-list .thumb {
  /*position: relative;
  padding-top: 70%;
  height: 0;*/
  height: 250px;
  width: 100%;
  object-fit: cover;
  border: 1px solid #eee;
}
/*.photo-list .thumb .ico-play-lg-white {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -.25rem 0 0 -.25rem;
}*/
.photo-list .info {
  margin-top: 18px;
  display: block;
  overflow: hidden;
  /* height: 40px; */
  /* display: -webkit-box; */
  /* -webkit-line-clamp: 2; */
  /* -webkit-box-orient: vertical; */
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 500;
}
.photo-list li .date {
    display: block;
    vertical-align: middle;
    color: #696969;
    font-size: 14px;
}
.photo-list .info span + span:before {
    display: inline-block;
    content: '';
    width: 1px;
    height: 16px;
    margin: -3px 6px 0 3px;
    background: #696969;
    vertical-align: middle;
}
/*.photo-list .item-info .info .part {
  max-width: 100%;
  white-space: nowrap;
  max-height: 0.18rem;
  line-height: 0.18rem;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 5em;
}*/

/* 카드형 리스트형 2
/* 이미지형 게시판 */
.photo-list2 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 45px 5%;
    margin: 30px 0 40px;
}
/*.photo-list:after {
  display: block;
  clear: both;
  content: '';
}*/
.photo-list2 li {
    width: 30%;
}
.photo-list2 li a {
    display: block;
}
.photo-list2 li a:hover .info {
    text-decoration: underline;
}
.photo-list2 .thumb {
    /*position: relative;
    padding-top: 70%;
    height: 0;*/
    height: 250px;
    width: 100%;
    object-fit: cover;
    border: 1px solid #eee;
    border-radius: 10px;
}
/*.photo-list .thumb .ico-play-lg-white {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -.25rem 0 0 -.25rem;
}*/
.photo-list2 .info {
    margin-top: 18px;
    display: block;
    overflow: hidden;
    /* height: 40px; */
    /* display: -webkit-box; */
    /* -webkit-line-clamp: 2; */
    /* -webkit-box-orient: vertical; */
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 500;
}
.photo-list2 li .date {
    display: block;
    vertical-align: middle;
    color: #696969;
    font-size: 14px;
}
.photo-list2 .info span + span:before {
    display: inline-block;
    content: '';
    width: 1px;
    height: 16px;
    margin: -3px 6px 0 3px;
    background: #696969;
    vertical-align: middle;
}
/*.photo-list .item-info .info .part {
  max-width: 100%;
  white-space: nowrap;
  max-height: 0.18rem;
  line-height: 0.18rem;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 5em;
}*/

/* 카드형 리스트형 게시판
.list_type {display: flex;align-items: center;}
.list_type a {display: flex;align-items: center;justify-content: center;width: 44px;height: 44px;background-repeat: no-repeat;background-position: center center;background-color: #c8cbce;border-radius: 10px;}
.list_type a.on {background-color: #366cf0;}
.list_type a span {display: none;}
.list_type a.list {margin-right: 5px;background-image: url('/user/images/icon/ico_list.png');}
.list_type a.card {background-image: url('/user/images/icon/ico_card.png');}
.card_list .row {margin: 0 -20px;}
.card_list .row:before {content: '';display: block;}
.card_list .row:after {content: '';display: block;clear: both;}
.card_list .row .item {float: left;width: 25%;padding: 0 20px;margin-bottom: 40px;}
.card_list .img {position: relative;height: 230px;background-position: center center;background-image: url('/user/images/icon/no_img.png');background-repeat: no-repeat;background-color: #e5e9ef;border-radius: 20px 20px 0 0;}
.card_list .img img {border-radius: 20px 20px 0 0;position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;z-index: 0;}
.card_list .img:after {display: block;content: "";padding-bottom: 100%;}
.card_list .info_wrap {background-color: #f5f6f9;padding: 20px 40px;border-radius: 0 0 20px 20px;}
.card_list .info_wrap .tit {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;font-size: 24px;color: #111;font-weight: 700;margin-bottom: 15px;}
.card_list .info .field {display: flex;align-items: center;padding: 8px 0;}
.card_list .info .field .th {width: 60px;font-size: 18px;color: #818284;font-weight: 500;}
.card_list .info .field .td {flex: 1;font-size: 18px;color: #333333;font-weight: 500;}
.card_list .info .field .td strong {font-family: "Montserrat", sans-serif;}

 */
/* 사이트맵 */
.cont_box.sitemap{
    padding: 30px 18px 100px;
}
.sitemap_depth1{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.sitemap_depth1 .depth1_item{
    width: 18%;
    display: flex;
    flex-direction: column;
}
.sitemap_depth1 .depth1_item span{
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    /*border: 1px solid var(--color-sub2);*/
    border: 1px solid var(--color-main);
    font-size: 22px;
    color: var(--color-main);
    font-weight: bold;
}
.sitemap_depth2 .depth2_item{
    border-bottom: 1px solid #ccc;
    padding: 16px 10px;
    font-size: 18px;
}
.sitemap_depth2 .depth2_item>a{
    font-weight: 500;
}
.sitemap_depth3 li{
    font-size: 16px;
    line-height: 2;
}
.sitemap_depth4{
    margin: 6px 14px;
    padding: 8px 10px;
    background: #f6f6f6;
}
/* 시청자미디어센터 지도 */
.center_map {
    position:relative;
    width: 100%;
    min-height: 830px;
    border: 1px solid #ddd;
    background: url(/user/images/contents/center-map.jpg) no-repeat center;
    background-size: 94%;
}
/*.center_map {
    position:relative;
    width: 600px;
    min-height: 402px;
    border: 1px solid #ddd;
    background: url(/user/images/contents/center-map.png) no-repeat center;
    background-size: contain;
}*/
.center_map .pin {position: absolute; border-radius: 50px; display:block; width: 25%; height: 9%;}
/*.center_map .pin .site {position:relative;display: block; opacity: 1; margin-bottom: 0px;}
.center_map .pin .site em {z-index:5;position: absolute;bottom:5px;left:25px;padding:2.5px 12px;border-radius:15px;min-width: 30px;font-size:13px;text-align: center;font-weight: 500;color:#fff;background: var(--color-main);word-break: keep-all;}
.center_map .pin .site em.right {left:auto;right:25px;}*/
.center_map .pin:nth-of-type(1){top: 12%;left: 8%;}
.center_map .pin:nth-of-type(2){top: 23.5%;left: 3%;}
.center_map .pin:nth-of-type(3){top: 36.5%;left: 8%;}
.center_map .pin:nth-of-type(4){top: 48%;left: 5%;}
.center_map .pin:nth-of-type(5){top: 60%;left: 8%;}
.center_map .pin:nth-of-type(6){top: 73%;left: 3%;}
.center_map .pin:nth-of-type(7){top: 11.5%;right: 8%;}
.center_map .pin:nth-of-type(8){top: 23.5%;right: 4%;}
.center_map .pin:nth-of-type(9){top: 37%;right: 5%;}
.center_map .pin:nth-of-type(10){top: 49%;right: 7%;}
.center_map .pin:nth-of-type(11){top: 61%;right: 3%;}
.center_map .pin:nth-of-type(12){top: 72%;right: 10.5%;}

/* 반응형 */
@media screen and (max-width: 1578px) {
    #section-1 .flex .flex-top .btn_list .quickmenu li{
        width: 47.5%;
    }
}
@media screen and (max-width: 1299px) {
    main .flex{
        margin: 0 20px;
    }
    main .flex>div{
        min-height: 550px;
    }
    main .flex .text .num{
        margin-bottom: 25px;
    }
    main .flex .text .tit{
        margin-bottom: 30px;
    }
    main .flex .text .sub{
        font-size: 18px;
        margin-bottom: 30px;
    }
    main .flex .text .menulist>li{
        width: 48%;
    }
    
    #section-1{
        /*height: auto;*/
        height: 1100px;
    }
    #section-1 .srch{
        /*overflow: hidden;*/
        padding: 120px 0 0;
        margin: 0 auto 40px;
    }
    #section-1 .flex{
        display: flex;
        /*overflow: hidden;
        padding-bottom: 10px;*/
    }
    #section-1 .flex .flex-top .swiper{
        width: calc(100% - 480px);
    }
    #section-1 .flex .flex-top .btn_list{
        width: 462px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li{
        height: 128px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a span{
        font-size: 19px;
    }
    /*#section-1 .flex .flex-left .tab-menu .tab-link{
        padding: 6px 8px;
    }
    #section-1 .flex>div{
        min-height: auto;
    }
    #section-1 .flex span{
        font-size: 24px;
        text-align: center;
    }
    #section-1 .flex .flex-left{
        width: 100%;
        background: none;
        gap: 0;
        margin-bottom: 40px;
    }
    #section-1 .flex .flex-left>span{
        position: unset;
        font-size: 30px;
        padding-top: 20px;
    }
    #section-1 .flex .flex-left .service-box{
        padding: 20px;
    }
    #section-1 .flex .flex-left .service-list li{
        font-size: 20px;
    }
    #section-1 .flex .flex-left>div{
        width: 23%;
    }
    #section-1 .flex .flex-left .service-1{
        justify-content: center;
        align-items: center;
        background-position: 50% 12%;
        background-size: 30%;
    }
    #section-1 .flex .flex-center{
        float: left;
        width: 48%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        padding-bottom: 8px;
    }
    #section-1 .flex .flex-center>div{
        width: 48%;
        margin-bottom: 20px;
    }
    #section-1 .flex .flex-center>div:last-child{
        width: 100%;
        margin-bottom: 0;
    }
    #section-1 .flex .flex-center .flex-center-vod{
        width: 100%;
        height: 200px;
        box-shadow: none;
    }
    #section-1 .flex .flex-center .flex-center-vod iframe,#section-1 .flex .flex-center .flex-center-vod img{
        width: 100%;
        height: 100%;
    }
    #section-1 .flex .flex-right{
        float: right;
        width: 48%;
    }
    .timeline{
        width: auto;
    }
    .timeline-box{
        height: 464px;
    }
    .timeline-box::before{
        top: 15%;
        left: 1.6%;
    }
    #section-1{
        height: 830px;
    }
    #section-1 .flex{
        width: 90%;
    }
    #section-1 .flex .flex-left::before, #section-1 .flex .flex-left::after{
        display: none;
    }
    #section-1 .flex .flex-left,#section-1 .flex .flex-right{
        width: 40%;
    }
    #section-1 .flex .flex-left>div{
        width: 47%;
        padding: 0;
        height: auto;
    }
    #section-1 .flex .flex-center{
        width: 20%;
    }
    .timeline-box{
        height: 548px;
    }
    .timeline-box::before{
        height: 100%;
    }
    .timeline{
        width: 100%;
    } */
    #section-2 .flex .content .swiper-btn>*{
        width: 40px;
        height: 40px;
    }
    #section-2 .flex .content .swiper-btn>div::after{
        font-size: 24px;
    }
    #section-2 .flex .content .swiper-slide{
        /* width: 316px !important; */
        height: auto;
    }
    #section-2 .content .request_cate .cate_left img{
        height: 250px;
    }
    #section-2 .content .request_cate .cate_right img{
        height: 200px;
    }
    .request_cate{
        margin-bottom: 35px;
        gap: 10px;
    }
    .request_cate .arrow{
        font-size: 30px;
    }
    .request_cate .cate_title{
        font-size: 20px;
    }
    .request_cate .cate_broad ul,.request_cate.viewer_program .cate_broad ul{
        margin-left: 29px;
    }
    .request_cate div ul li{
        font-size: 14px;
    }
    .request_cate.viewer_program>div{
        height: 500px;
    }
    .request_cate.viewer_program .cate_inner{
        height: 438px;
    }
}
@media screen and (max-width: 1024px) {
    .container>div{
        height: auto;
        padding: 60px 0;
    }
    main .flex{
        display: block;
        width: calc(100% - 32px);
        margin: 0 auto;
    }
    main .flex>div{
        height: auto;
        min-height: auto;
    }
    main .flex .text{
        width: 100%;
    }
    main .flex .text .menulist{
        width: 100%;
    }
    main .flex .text .menulist li{
        box-shadow: 0 2px 2px rgba(0,0,0,0.15);
    }
    main .flex .content{
        display: none;
    }

    #section-1 .srch{
        width: 90%;
        padding: 30px 0 0;
    }
    #section-1 .srch .srch_box{
        width: 100%;
    }
    #section-1 .srch .srch_recom1 {
        visibility: hidden;
        z-index: 100;
        width: 101.1%;
        height: 471pxpx;
        border: 2px solid;
        border-color: #fff;
        background-color: #f0f0f3;
        border-radius: 0px 0px 16px 16px;
        -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .13);
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .13);
        position: absolute;
        top: 102.8%;
        left: -0.5%;
    }
    #section-1 .srch .srch_recom1 li {
        z-index: 100;
        font-size:20px;
        color: #333;
        padding: 8px;
        border-bottom: 1px solid #ddd;
    }
    #section-1 .srch .srch_box form input.srch_txt_hd{
        height: 40px;
        font-size: 18px;
    }
    #section-1 .srch .srch_box form input.srch_txt_hd::placeholder{
        font-size: 18px;
    }
    #section-1 .srch .srch_recom{
        font-size: 16px;
    }
    #section-1 .srch .srch_recom .recom_tit{
        margin-right: 20px;
    }
    #section-1 .srch .srch_recom .recom_list li button{
        font-size: 16px;
    }
    #section-1{
        gap: 30px;
    }
    #section-1 .flex{
        gap: 40px;
    }
    #section-1 .flex-top{
        gap: 20px;
        margin-top: 30px;
    }
    #section-1 .flex-bottom{
        gap: 40px 20px;
    }
    #section-1 .flex .flex-top{
        flex-direction: column;
        margin-top: 30px;
    }
    #section-1 .flex .flex-top .swiper{
        width: 100%;
        height: auto;
        margin-top: 140px;
    }
    #section-1 .flex .flex-top .swiper-slide a img{
        min-height: 150px;
        max-height: 300px;
    }
    #section-1 .flex .flex-top .btn_list{
        width: 100%;
        /*gap: 20px;
        margin-top: 40px;*/
    }
    #section-1 .flex .flex-top .btn_list>span{
        display: none;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li{
        width: calc(50% - 10px);
        height: 90px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a img{
        width: 50px;
        height: 50px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a span{
        font-size: 20px;
    }
    #section-1 .flex .flex-bottom{
        justify-content: space-between;
        flex-wrap: wrap;
    }
    #section-1 .flex .flex-bottom .flex-left{
        width: 100%;
        height: 320px;
    }
    #section-1 .flex .flex-left .tab-menu{
        padding: 0;
    }
    #section-1 .flex .flex-left .tab-menu .tab-link span{
        font-size: 17px;
    }
    #section-1 .flex .flex-bottom .flex-center,
    #section-1 .flex .flex-bottom .flex-right{
        width: calc(50% - 10px);
    }
    #section-1 .flex .slide-tit{
        font-size: 17px;
    }
    /*#section-1 .flex .btn_list .quickmenu li a span{
        height: 36px;
        font-size: 12px;
    }
    #section-1 .flex .btn_list .quickmenu .menuicon{
        padding: 20px;
    }
    #section-1 .flex .btn_list .main_btn{
        width: 100%;
        height: 100px;
        padding: 16px;
    }
    #section-1 .flex .main_btn .btn_inner p:not(.btn_title){
        display: none;
    }
    #section-1 .flex .main_btn .btn_inner .btn_title{
        font-size: 22px;
    }
    #section-1 .flex .main_btn .btn_inner img{
        width: 40px;
        margin-right: 10px;
    }*/
    main .flex .text .num{
        font-size: 30px;
    }
    main .flex .text .tit{
        font-size: 30px;
    }
    main .flex .text .menulist{
        gap: 20px;
    }
    main .flex .text .menulist li{
        width: calc(50% - 10px);
        height: 70px;
        font-size: 18px;
        border: 1px solid #e3e3e3;
        border-radius: 40px;
    }
    /*#section-3 .flex{
        width: 90%;
        padding-left: 0;
    }*/
    #section-3 .flex .text{
        width: 100%;
    }

    /*main .main_banner{
        display: block;
        height: auto;
        padding: 16px;
    }
    main .main_notice .swiper .swiper-slide a{
        font-size: 20px;
    }
    main .main_notice .swiper .swiper-slide a .notice_date{
        font-size: 18px;
    }
    main .main_title{
        display: block;
    }
    main .main_title h2{
        margin-right: 0;
        margin-bottom: 8px;
    }
    main .main_btnmenu{
        display: none;
    }
    main .main_btnmenu.mb{
        display: block;
    }
    main .main_btnmenu>div{
        height: auto;
    }
    main .main_btnmenu .quickmenu .menucard.on .menucard_inner .quick_on_menu li{
        margin-left: 0;
        margin-right: 14px;
    }
    main .main_btnmenu .quickmenu{
        flex-wrap: wrap;
    }
    main .main_btnmenu .quickmenu .menucard{
        width: 50%;
    }
    main .main_btnmenu .quickmenu .menucard:nth-child(1){
        border-radius: 0;
    }
    main .main_btnmenu .quickmenu .menucard:nth-child(4){
        border-radius: 0;
    }*/
    .request_cate .cate_title{
        font-size: 17px;
    }
    .request_cate.viewer_program>div{
        height: 600px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        padding: 0 50px;
    }
    .request_cate.viewer_program .cate_region .region_all{
        top: auto;
        bottom: 10%;
        left: 70%;
    }
    
    .consult_main_tb colgroup, .consult_main_tb thead th:nth-of-type(1), .consult_main_tb .tb_tit td:nth-of-type(1), .consult_main_tb thead th:nth-of-type(2), .consult_main_tb .tb_tit td:nth-of-type(2), .consult_main_tb thead th:nth-of-type(3), .consult_main_tb .tb_tit td:nth-of-type(3),
    .consult_list_tb colgroup, .consult_list_tb thead th:nth-of-type(1), .consult_list_tb .tb_tit td:nth-of-type(1), 
    .survey_tb colgroup, .survey_tb thead th:nth-of-type(1), .survey_tb .tb_tit td:nth-of-type(1), .survey_tb thead th:nth-of-type(2), .survey_tb .tb_tit td:nth-of-type(2), .survey_tb thead th:nth-of-type(3), .survey_tb .tb_tit td:nth-of-type(3), .tb_cont th,
    .program_tb colgroup, .program_tb thead th:nth-of-type(1), .program_tb .tb_tit td:nth-of-type(1),.program_tb thead th:nth-of-type(2), .program_tb .tb_tit td:nth-of-type(2), .program_tb thead th:nth-of-type(4), .program_tb .tb_tit td:nth-of-type(4),.program_tb thead th:nth-of-type(6), .program_tb .tb_tit td:nth-of-type(6){
        display: none;
    }
    .table thead th{
        width: 20%;
    }
    .table thead th.tit{
        width: auto;
    }
    .table.commu tr.tb_tit{
        position: relative;
    }
    .table.commu .tit_cont{
        position: unset;
    }
    .tb_cont .cont_info_mod-del{
        margin-right: 0;
    }
    .tb_cont.pa td{
        padding: 30px 10px;
    }
    .notice_tb colgroup, .notice_tb thead th:nth-of-type(1), .notice_tb td:nth-of-type(1), .notice_tb thead th:nth-last-child(2), .notice_tb td:nth-last-child(2),
    .faq_tb colgroup, .faq_tb thead th:nth-of-type(1), .faq_tb td:nth-of-type(1){
        display: none;
    }

    .tb_cont.a_pop {
        left: 50%;
        width: 94%;
        max-height: 70%;
        padding: 40px 30px;
    }
    .tb_cont.a_pop .a_pop_inner * {
        font-size: 15px !important;
    }

    /*.password_popup{
        right: unset;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .password_popup .password_desc{
        flex-direction: column;
        width: 100%;
        padding: 20px;
    }
    .password_popup .pwd_tit{
        display: block;
    }
    .password_popup .password_desc .password_close{
        position: absolute;
        top: 10px;
        right: 10px;
    }*/

    .board .board_txt img{
        max-width: 100% !important;
        height: auto !important;
    }
    .center_about .map_box{
        flex-direction: column;
    }
    .photo-list .thumb{
        height: 160px;
    }

    .sitemap_depth1{
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .sitemap_depth1 .depth1_item{
        width: 45%;
    }
    .sitemap_depth1 .depth1_item:nth-child(-n+2){
        margin-bottom: 60px;
    }
    .sitemap_depth1 .depth1_itemspan{
        font-size: 20px;
    }    
    .sitemap_depth2 .depth2_item{
        font-size: 16px;
    }
    .sitemap_depth3 li{
        font-size: 14px;
    }

    
    .srch_item .s_tit a{
        font-size: 16px;
    }
    .srch_item .s_cont{
        font-size: 15px;
    }
    .center_map{
        min-height: 560px;
    }

    .index_popup{
        top: 70px;
        left: 50%;
        transform: translate(-50%, 0);
    }
    
}
@media screen and (max-width: 821px) {
    /*#section-1 .flex span{
        font-size: 22px;
    }
    #section-1 .flex .flex-top>div{
        width: 22%;
    }*/
    #section-1 .flex .flex-top>span{
        font-size: 24px;
    }
    #section-1 .flex .flex-top .service-list li{
        font-size: 20px;
    }
    .request_cate ul.block li, .request_cate ul.bigblock li{
        width: 45%;
    }
    /* .request_cate .cate_left ul li:nth-child(3n+1){
        margin-left: 12px;
    }
    .request_cate .cate_left ul li:nth-child(2n+1){
        margin-left: 6px;
    } */
    .request_cate ul.block li a, .request_cate ul.bigblock li a{
        font-size: 16px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        padding: 0 10px;
    }
    .center_map{
        min-height: 500px;
    }
}
@media screen and (max-width: 768px) {
    #section-1 .srch .srch_recom .recom_tit{
        margin-right: 20px;
    }
    #section-1 .srch .srch_recom .recom_list li:nth-child(n+4){
        display: none;
    }
    #section-1 .srch .srch_recom .recom_list li:nth-child(3)::after{
        display: none;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu{
        gap: 10px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li{
        width: calc(50% - 5px);
        height: 70px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a span{
        font-size: 18px;
    }
    #section-1 .flex .flex-left .content-box li a p:first-child{
        font-size: 16px;
    }
    /*.timeline-box::before{
        left: 3%;
        transform: translate(-11%, -3%);
    }
    .timeline-item .date-box .date,.timeline-item .timeline-content h2{
        font-size: 18px;
    }
    main .flex .btn_list .main_btn{
        background: #fff;
    }
    main .flex .main_btn .btn_inner .btn_title{
        font-size:19px;
    }
    main .flex .main_btn .btn_inner img{
        display: none;
    }
    main .main_notice article{
        width: 100%;
    }
    main .main_notice .swiper .swiper-slide a .notice_tit{
        width: 100%;
    }
    main .main_notice .swiper .swiper-slide a .notice_date{
        display: none;
    }*/

    /*.photo-list{
        margin: 30px 0;
    }*/
    .photo-list li {
        width: 47%;
    }
    .photo-list .info{
        font-size: 14px;
    }
    .photo-list .date {
        font-size: 12px;
    }
    .request_cate.viewer_program{
        display: block;
    }
    .request_cate.viewer_program>div{
        width: 100%;
        height: 500px;
    }
    .request_cate.viewer_program .arrow{
        display: block;
        width: 100%;
        text-align: center;
        transform: rotate(90deg);
    }
    .request_cate.viewer_program .cate_region{
        margin-top: 20px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        overflow-y: scroll;
        padding: 0 150px;
    }
    .request_cate.viewer_program .cate_region .region_all{
        bottom: 10%;
        left: 10%;
    }
    .request_cate.viewer_program .cate_broad ul{
        gap: 42px;
        margin-left: 64px;
    }
    .btn_program{
        padding: 8px 8px;
    }
    .request_form li{
        flex-direction: column;
    }
    .request_form li > label{
        width: 100%;
        margin-bottom: 10px;
    }
    .request_form li > label::after{
        display: none;
    }
    .request_form .enter_box{
        width: 100%;
    }
    .satisfaction_list{
        padding: 0;
        background: none;
    }
    .satisfaction_list .opinion{
        top: 0;
    }
    .data-move{
        padding: 10px;
    }
    .board .board_txt.faq {
        flex-direction: column;
        align-items: flex-start;
    }
    .board .board_txt .faq_t{
        margin-bottom: 8px;
    }
    .sort_menu{
        padding: 0 2%;
    }
    .sort_menu li{
        font-size: 16px;
        margin: 2px 2%;
    }

    .center_map{
        min-height: 420px;
    }

    /*.center_map .pin:nth-of-type(1){left: 63%;}
    .center_map .pin:nth-of-type(2){left: 53%;}
    .center_map .pin:nth-of-type(3){left: 48%;}
    .center_map .pin:nth-of-type(4){left: 44%;}
    .center_map .pin:nth-of-type(5){left: 56%;}
    .center_map .pin:nth-of-type(6){left: 47%;}
    .center_map .pin:nth-of-type(7){left: 50%;}
    .center_map .pin:nth-of-type(8){left: 69%;}
    .center_map .pin:nth-of-type(9){left: 66%;}
    .center_map .pin:nth-of-type(10){left: 44%;}*/
    .request_popup, .password_popup{
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        transform: translate(0,0);
        width: 100%;
        height: 100%;
        background: #fff;
        border: 0;
        box-shadow: none;
    }
    .password_popup .password_desc{
        width: 100%;
    }
    .request_popup .popup_desc .popup_info{
        margin: 0 0 50px;
    }
    .request_popup .popup_desc .input_txt,.password_popup .password_desc .input_txt{
        width: 100%;
    }
    .request_popup .popup_desc .popup_btn,.password_popup .password_desc .popup_btn{
        width: 100%;
    }
    .step{
        padding: 4px 3px;
        font-size: 14px;
    }
    .tb_cont.a_pop {
        width: 100%;
        max-height: 100%;
    }
}
@media all and (max-width: 580px){
    #section-1 .flex .flex-bottom .flex-center,
    #section-1 .flex .flex-bottom .flex-right{
        width: 100%;
    }
    main .flex .text .num{
        width: 70px;
        height: 70px;
        font-size: 20px;
    }
    main .flex .text .tit {
        margin-bottom: 10px;
        font-size: 24px;
    }
    main .flex .text .sub{
        margin-bottom: 20px;
        font-size: 15px;
    }
    main .flex .text .menulist{
        gap: 12px;
    }
    main .flex .text .menulist li{
        width: calc(50% - 6px);
        height: 60px;
        font-size: 16px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        overflow-y: auto;
        padding: 0 102px;
    }
    .request_cate.viewer_program .cate_broad ul{
        gap: 38px;
        margin-left: 43px;
    }
    .center_map{
        min-height: 320px;
    }
    .satisfaction_list .opinion{
        position: initial;
        text-align: center;
        margin-top: 20px;
    }
    .index_popup{
        width: 100%;
        height: 300px;
    }
}
@media all and (max-width:479px) {
    #section-1{
        gap: 10px;
    }
    #section-1 .flex-top {
        gap: 10px;
    }
    .container>div {
        padding: 40px 0;
    }
    main .flex .text .num{
        font-size: 32px;
    }
    /*#section-1{
        padding: 0 0 60px;
    }*/
    #section-1 .srch {
        padding: 40px 0 0;
        margin: 0 auto;
    }
    #section-1 .srch .srch_box form input.srch_txt_hd{
        height: 30px;
    }
    #section-1 .srch .srch_box form input.srch_txt_hd,#section-1 .srch .srch_box form input.srch_txt_hd::placeholder{
        font-size: 16px;
    }
    #section-1 .srch .srch_recom{
        display: none;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a img{
        width: 36px;
        height: 36px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li{
        padding: 0 10px;
    }
    #section-1 .flex .flex-top .btn_list .quickmenu li a span{
        width: auto;
        font-size: 16px;
    }
    #section-1 .flex .flex-left .tab-menu .tab-link span{
        font-size: 16px;
    }
    #section-1 .flex .flex-left .content-box li a p:first-child {
        font-size: 15px;
    }
    #section-1 .flex .slide-tit{
        font-size: 16px;
    }
    #section-1 .flex .flex-vod{
        height: 200px;
    }
    /* #section-1 .flex .flex-left>div{
        width: 47%;
    }
    #section-1 .flex .flex-left>span{
        font-size: 26px;
    }
    #section-1 .flex .flex-left .service-box{
        display: block;
    }
    #section-1 .flex .flex-left .service-list li{
        font-weight: normal;
        margin-bottom: 16px;
    }
    #section-1 .flex .flex-left .service-list li:first-child::before{
        left: 34%;
    }
    #section-1 .flex .flex-center, #section-1 .flex .flex-right{
        float: none;
        width: 100%;
    }
    #section-1 .flex .flex-center{
        margin-bottom: 30px;
        padding: 20px 0 30px;
        border: 1px solid var(--color-sub3);
        border-left: none;
        border-right: none;
    }
    #section-1 .flex .flex-right span{
        margin-bottom: 12px;
    }
    .timeline-box::before{
        left: 2.7%;
        transform: translate(-20%, -2.7%);
    }
    .timeline-item .timeline-content p{
        font-size: 15px;
    }
    main .flex .swiper{
        height: 300px;
    } 
    main .flex .btn_list{
        flex-direction: column;
        margin-top: 12px;
    }
    main .flex .btn_list .main_btn{
        width: 100%;
    }
    main .flex .btn_list .main_btn img{
        display: block;
        width: 60px;
    }
    main .flex .main_btn .btn_inner .btn_title{
        font-size: 22px;
    }
    main .main_notice{
        height: 80px;
        padding: 20px;
    }
    main .main_notice article>img{
        width: 30px;
        height: 30px;
        margin-right: 10px;
    }
    main .main_btnmenu{
        width: 90%;
        padding: 40px 0 80px;
    }
    main .main_title{
        margin-bottom: 20px;
    }
    main .main_title h2{
        font-size: 22px;
        margin-bottom: 4px;
    }
    main .main_title p{
        font-size: 16px;
    }    
    main .main_btnmenu .quickmenu .menucard{
        width: 100%;
        height: 180px;
    }*/
    .main_ctr{
        left: 12px;
        top: 12px;
    }
    .btn_play, .btn_pause, .btn_pause_notice{
        width: 24px;
        height: 24px;
    }
    .board h3{
        padding-top: 10px;
        font-size: 18px;
    }
    .file_down, .file_down button:not(:first-of-type){
        padding: 4%;
    }
    

    .request_cate{
        display: block;
    }
    .request_cate > div{
        width: 100%;
        height: 300px;
        margin-bottom: 20px;
    }
    .request_cate > div:last-child{
        margin-bottom: 0;
    }
    .request_cate .cate_inner {
        height: 240px;
    }
    .request_cate .cate_right ul{
        margin-top: 20px;
    }
    .request_cate .arrow{
        display: none;
    }
    .request_cate .cate_left ul li a{
        height: 70px;
    }
    .request_cate .cate_right ul li a{
        padding: 16px 10px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        padding: 0 50px;
    }
    .request_cate.viewer_program .cate_region .region_all{
        bottom: auto;
        top: 5%;
        left: 15%;
    }

    .program_tb thead th{
        width: 25%;
    }
    .sitemap_depth1 .depth1_item{
        width: 100%;
    }
    .sitemap_depth1 .depth1_item span{
        height: 40px;
        font-size: 18px;
        font-weight: bold;
    }
    .sitemap_depth1 .depth1_item:nth-child(3){
        margin-bottom: 60px;
    }
    .sitemap_depth2 .depth2_item{
        padding: 10px 6px;
    }
    .satisfaction{
        margin-top: 80px;
        padding: 20px 3%;
        text-align: center;
    }

    .center_map{
        min-height: 270px;
    }
    /*.center_map .pin .site em{left: 22px;padding: 2.5px 8px;}
    .center_map .pin:nth-child(1){top: 4%;}
    .center_map .pin:nth-child(2){top: 15%;}
    .center_map .pin:nth-child(3){top: 1%;}
    .center_map .pin:nth-child(4){top: 10%;}
    .center_map .pin:nth-child(5){top: 24%;}
    .center_map .pin:nth-child(6){top: 25%;}
    .center_map .pin:nth-child(7){top: 34%;}
    .center_map .pin:nth-child(8){top: 45%;left:73%;}
    .center_map .pin:nth-child(9){top: 54%;left:70%;}
    .center_map .pin:nth-child(10){top: 58%;}*/
}

@media all and (max-width:399px) {
    /*#section-1 .flex .flex-top .btn_list{
        margin-top: 20px;
    }*/
    /*#section-1 .flex .flex-top .btn_list .quickmenu .menuicon{
        padding: 10px;
    }*/
    #section-1 .flex .flex-left .content-box li a p:first-child{
        width: 100%;
    }
    #section-1 .flex .date{
        display: none;
    }
    #main .input_txt {
        width: 100%;
    }
    .request_popup .popup_desc, .password_popup .password_desc{
        width: 100%;
    }
    .request_form .sel{
        width: 100%;
    }
    .request_form .enter_box .sq_btn{
        margin-top: 4px;
    }
    .request_cate.viewer_program .cate_broad ul{
        gap: 26px;
        margin-left: 30px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        padding: 0 30px;
    }
    .srch_item .s_info{
        flex-direction: column;
        align-items: flex-start;
    }
    .srch_item .s_info .divider{
        display: none;
    }
    .center_map{
        min-height: 228px;
    }
    
    /*.center_map .pin:nth-child(8){left:79%;}
    .center_map .pin:nth-child(9){left:75%;}*/
}
@media all and (max-width:361px) {
    #section-1 .flex .flex-top>div{
        width: 46%;
    }
}
@media all and (max-width:299px) {
    /*main .flex .btn_list .main_btn img{
        display: none;
    }*/
    main .main_notice .swiper .swiper-slide a{
        width: 70%;
    }
    .request_cate.viewer_program>div{
        height: 400px;
    }
    .request_cate.viewer_program .cate_region #mapwrapper{
        overflow-x: scroll;
        width: 100%;
    }
}