@charset "utf-8";
@import url(reset.css);
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+KR:wght@100..900&display=swap');

 
body {opacity:0; color:#222222; font-family: "Noto Sans KR", sans-serif; letter-spacing:-1px; word-break:keep-all;}
strong {font-weight:600;}
h1 {font-size:50px;}
h2 {font-size:48px;}
h3 {font-size:40px;}
h4 {font-size:28px;}     
h5 {font-size:24px;}
h6 {font-size:18px;}
p  {font-size:20px;}


/* popup */

.pop_wrap {z-index:9999; width:90%; margin:0 auto; position:fixed; top:100px; left:50%; transform: translateX(-50%);}
.main_notice_pop { padding:10px 10px 20px; position:absolute; display:none; background:#222; border-radius:10px;}
.pop1 { right:0%; width:25%;}
.pop2 { right:25%; width:25%;}
.pop3 { right:50%; width:25%;}
.pop4 { right:75%; width:25%;}
.main_notice_pop .btn_close {position:absolute; bottom:10px; right:10px; color:#fff; z-index:1;}
.main_notice_pop .chkBox {position:absolute; bottom:10px; left:10px;  z-index:1;}
.main_notice_pop label {color:#fff;}

/* animation */

.ani_off1 {opacity:0; transform:translate(0,70%);}
.ani_off2 {opacity:0; transform:translate(0,60%);}
.ani_off3 {opacity:0; transform:translate(0,50%);}
.ani_off4 {opacity:0; transform:translate(0,40%);}
.ani_on {opacity:1; transform:translate(0,0); transition:all 1s ease-out;}

/* flex */

.flex {display:flex;}
.space_between {justify-content:space-between;}
.space_around  {justify-content:space-around;}
.space_evenly  {justify-content:space-evenly;}
.space_center  {justify-content:center;}
.item_center {align-items:center;}
.wrap {flex-wrap:wrap;}
.nowrap {flex-wrap:nowrap;}
.flex48_100 {flex-basis:48%;}
.flex50_100 {flex-basis:50%;}
.flex32_48 {flex-basis:32%;}

/* padding */

.container {width:1200px; margin:0 auto; position: relative;}
.pad_100 {padding:100px 0;}
.pad_t_100 {padding-top:100px;}
.pad_b_100 {padding-bottom:100px;}

/* txt */

.txt_center {text-align:center;}


/* =================================================================================================== */


/* header */

#header {z-index:999; position:fixed; top:0; left:0; width:100%; background:#fff;}
.header_wrap {position:relative; width:90%; margin:0 auto; border-bottom:none;}
.header_wrap.on {border-bottom:1px solid #ccc;}
.header_bg {display:none; position:absolute; top:97px;left:0; background:#fff; width:100%; height:450px; border-bottom:1px solid #c9c9c9; }

.logo {float:left; line-height:97px;}

.menu_m_wrap {display:none;}
.menu_wrap {float:right;}
.menu > li {float:left; position:relative; display:block; padding:0 40px; line-height:97px;}
.menu > li > a {display:block; font-size:20px; font-weight:500; transition:all 0.3s;}

.sub {display:none; position:absolute; top:97px; left:0; width:100%; height:450px;}
.sub > li {display:block; padding-top:25px; text-align:center; line-height:20px;}
.sub > li > a {font-size:18px; white-space:nowrap;}

.menu > li:hover > a {color:#004aa0;}
.menu > li:hover > .sub {background:#edf6ff; border-top:2px solid #004aa0;}
.sub > li:hover > a {font-weight:bold; color:#004aa0;}

/* footer */

#footer {position:relative; width:100%; background:#222222;}
.footer_wrap {padding:50px 0;}
.footer_txt {font-size:15px; color:#fff;}
.footer_txt p {font-size:16px; padding-bottom:20px;}
.footer_m {display:none;}


/* =================================================================================================== */


/* main */

/* main_sec1 */

.main_sec1 {}
.slide1 {width:100%;}
.slide1 img {width:100%;transform:scale(1.2); transition:transform 0s 3s;}
.slick-active img {transform:scale(1); transition:transform 3s;}
.slick_off img {transform:scale(1.2);}
.slide_txt {opacity:0; color:#fff; position:absolute; top:40%;}
.slide_txt1 {text-align:center; left:50%; transform:translateX(-50%);}
.slide_txt2 {text-align:left; left:20%;}
.slide_txt3 {text-align:right; right:20%;}
.slick-active .slide_txt {opacity:1; top:30%; transition:all 1.5s;}
.slide_main .slick-prev {z-index:1;position:absolute;top:45%;left:5%; width:28px;height:50px;background:url(../images/arr_pre.png) no-repeat center center;text-indent:-9999px;}
.slide_main .slick-next {z-index:1;position:absolute;top:45%;right:5%; width:28px;height:50px;background:url(../images/arr_next.png) no-repeat center center;text-indent:-9999px;}

/* main_sec2 */

.main_sec2 {}
.main_sec2 .box_wrap {display:flex; justify-content:space-between; flex-wrap:wrap;}
.main_sec2 .box {background:#f4f4f4;}
.main_sec2 .box_ico {text-align:center;}
.main_sec2 .box1 {width:270px; height:270px; padding:20px; display:inline-block; padding:15px;}
.main_sec2 .box1 .box_ico a {display:inline-block; padding:15px;}
.main_sec2 .box1 .box_txt {text-align:center; padding:10px 0;}
.main_sec2 .box1 img {transition:all 0.3s;}
.main_sec2 .box2 a {display:block; width:270px; height:270px; padding:20px; transition:all 0.3s;}
.main_sec2 .box2 .box_ico {padding:30px;}
.main_sec2 .box2 .box_txt {text-align:center; padding-top:10px;}
.main_sec2 .box1 a:hover img {transform:scale(1.1);}
.main_sec2 .box2 a:hover {box-shadow:5px 5px 10px 0 rgba(0,0,0,0.22); transform:translateY(2px);}


/* =================================================================================================== */


/* sub */

#section {padding-top:97px;}

.m_nav {display:none;}

.sub_tit {position:relative; text-align:center; padding:150px 0 180px; color:#fff;}
.sub_bg1 {background:url(../images/sub/sub_bg1.jpg) no-repeat center; background-size:cover;}
.sub_bg2 {background:url(../images/sub/sub_bg2.jpg) no-repeat center; background-size:cover;}
.sub_bg3 {background:url(../images/sub/sub_bg3.jpg) no-repeat center; background-size:cover;}
.sub_bg4 {background:url(../images/sub/sub_bg4.jpg) no-repeat center; background-size:cover;}

.sub_wrap {display:flex;}
.sub_L {flex-basis:18%; padding:40px 0;}
.sub_R {flex-basis:82%; padding:40px 0 0 40px;}

.tab_tit {padding:30px 0; text-align:center; color:#fff; background:linear-gradient(90deg,#4488d7 0%, #0152a4 100%);}
.tab > li {border:1px solid #ccc;}
.tab > li > a {display:block; padding:15px 0; text-align:center;}
.tab a:hover > h6 {font-weight:600;}

.sec_tit {padding-bottom:40px;}
.sec_tit > h3 {font-weight:700;}
.sec_tit > span {color:#0152a4; font-size:30px; font-weight:900; line-height:25px;}

.map {height:400px; padding-bottom:40px;}
.root_daum_roughmap .wrap_map {height:400px !important;}

.sub1 .numbering {margin:40px 0; border-top:2px solid #8e8e8f; border-bottom:2px solid #8e8e8f;}
.sub1 .num_img {flex-basis:5%; text-align:center; padding-top:5px;}
.sub1 .num_txt {flex-basis:95%;}
.sub2 .sec_txt {padding:40px 0 0;}
.sub2 .sec_txt p {padding:10px 0; line-height:160%;}
.sub2 .num_img {flex-basis:3%; padding-top:2px;}
.sub2 .num_txt {flex-basis:97%;}
.sub3 .numbering {margin:20px 0;}
.sub3 .num_img {flex-basis:25%; align-content:center; padding:15px 0; margin-right:25px; color:#fff; text-align:center; background:#226dbd; border-radius:10px;}
.sub3 .num_txt {flex-basis:75%; align-content:center;}
.sub3 .num_arr {flex-basis:25%; text-align:center;}
.sub3_box {padding-bottom:40px;}
.sub3_box h4 {padding-bottom:30px;}
.sub3_box p {padding-bottom:20px; line-height:170%;}
.sub3_img {padding:20px 0;}
.sub4_wrap {padding-bottom:40px;}
.sub4_box_wrap {padding:20px 0;}
.sub4_box {margin-bottom:20px; background:#eee; transition:all 0.3s;}
.sub4_box a {display:block; padding:15px; background:#eee;}
.sub4 .box_txt {text-align:center; padding:20px 0 10px;}
.sub4_box:hover {box-shadow:5px 5px 10px 0 rgba(0,0,0,0.22); transform:translateY(2px);}



/* 모바일================================================================================================ */

@media only screen and (max-width:1600px) {
    .header_wrap {width:100%;}
}

@media only screen and (max-width:1200px) {

    h1 {font-size:40px;}
    h6 {font-size:16px;}
    p {font-size:18px;}

    .container {width:95%;}
    .pad_100 {padding:50px 0;}
    .pad_t_100 {padding-top:50px;}
    .pad_b_100 {padding-bottom:50px;}

    .menu > li {padding:0 20px;}
    .menu > li > a {font-size:18px;}
    .sub {top:97px; height:400px; }
    .sub > li {padding-top:25px; line-height:20px;}
    .sub > li > a {font-size:16px;}
    .menu > li:hover > a {color:#004aa0;}
    .menu > li:hover > .sub {background:#edf6ff; border-top:2px solid #004aa0; }
    .sub > li:hover > a {font-weight:bold; color:#004aa0;}
    .header_bg {display:none; position:absolute; top:97px;left:0; background:#fff; width:100%; height:400px; }

    .main_sec1_bg {height:70vw;}
    .slide1 img {height:70vw; object-fit:cover; object-position:center;}

    .main_sec2 .box_ico img {transform:scale(0.8);}
    .main_sec2 .box1 {width:200px; height:200px; padding:10px 0;}
    .main_sec2 .box1 .box_ico a {padding:10px 0 0;}
    .main_sec2 .box1 .box_txt {padding:5px 0;}
    .main_sec2 .box2 a {display:block; width:200px; height:200px; padding:20px;}
    .main_sec2 .box2 .box_ico {padding:10px;}
    .main_sec2 a:hover img {transform:scale(1);}

}

@media only screen and (max-width:900px) {

    h1 {font-size:30px;}
    h6 {font-size:14px;}
    p {font-size:16px;}
    
    .flex48_100 {flex-basis:100%;}
    .flex50_100 {flex-basis:100%;}
    .flex32_48 {flex-basis:48%;}

    /* header */
    #section {padding-top:77px;}
    .header_wrap {width:100%;}  
    .header_bg {display:none;}
    .logo {display:none;}
    .menu_wrap {display:none;}
    .menu_m_wrap { display:block; padding:0;}  
    .menu_m_ico {display:flex; justify-content:space-between; align-items:center;}
    .m_ico {transform:scale(0.7);}
    .ico_off {display:none;}
    .menu_m {display:none;}
    .menu_m > ul {padding:20px 0 0;}
    .menu_m > ul > li {padding:15px; font-size:20px; font-weight:600; border-bottom:1px dotted #b2b2b2;}
    .menu_m > ul > li > a {display:block;}
    .sub_m {display:none;}
    .sub_m > li {font-size:18px; font-weight:400;}
    .sub_m > li > a {display:block; padding:10px 0 0 15px; }

    .slide_txt {top:35%;}
    .slide_txt1 {text-align:center; left:50%; transform:translateX(-50%);}
    .slide_txt2 {text-align:center; left:50%; transform:translateX(-50%);}
    .slide_txt3 {text-align:center; right:50%; transform:translateX(50%);}
    .slick-active .slide_txt {top:25%;}

    .main_sec2 .box {flex-basis:48%; margin-bottom:20px;}
    .main_sec2 .box img {transform:scale(0.7);}
    .main_sec2 .box1 a:hover img {transform:scale(0.8);}
    .main_sec2 .box1 {width:100%; height:100%;}
    .main_sec2 .box2 a {width:100%; height:100%; padding:15px 10px 35px;}
    .sub_L {display:none;}
    .sub_R {flex-basis:100%; padding:90px 0;}
    .sub_tit {padding:80px 0 100px;}

}

@media only screen and (max-width:600px) {
 
    .pop_wrap {left:50%; transform: translateX(-50%); top:70px;}
    .pop1 {width:100%; right:0;}
    .pop2 {width:100%; right:0;}
    .pop3 {width:100%; right:0;}
    .pop4 {width:100%; right:0;}

    h1 {font-size:7vw;}
    h2 {font-size:6.5vw;}
    h3 {font-size:6vw;}
    h4 {font-size:5vw;}     
    h5 {font-size:4.5vw;}
    h6 {font-size:3.5vw;}
    p  {font-size:4vw;}

    #section {padding-top:50px;}
    .header_wrap {padding:5px 0;}
    .header_wrap > .container {width:100%;}
    .m_ico {flex-basis:15%;}
    .m_logo {flex-basis:50%; padding-left:5px;}

    .main_sec1_bg {height:120vw;}
    .slide1 img {height:120vw; object-fit:cover; object-position:center;}
    .slide_txt1 {text-align:center; left:0; transform:translateX(0);}
    .slide_txt2 {text-align:center; left:0; transform:translateX(0);}
    .slide_txt3 {text-align:center; right:0; transform:translateX(0);}
    .slide_txt {top:35%; padding:0 20px;}
    .slick-active .slide_txt {top:25%;}
    .main_sec2 .box2 .box_txt {padding:0}
    .main_sec2 .box1 .box_txt p {font-size:3.5vw;}
    .main_sec2 .box2 .box_txt h6 {font-size:3.3vw;}
    .sub1 .num_img {flex-basis:5%; padding:0; margin-right:10px;}
    .sub1 .num_txt {flex-basis:95%;}
    .sub1_4_watermark > img {width:50%; margin-top:30px;}
    .sub2 .num_img {flex-basis:5%; padding:0; margin-right:5px;}
    .sub2 .num_txt {flex-basis:95%; align-content:center;}
    .sub3 .numbering {margin:20px 0;}
    .sub3 .num_img {flex-basis:30%; padding:10px 0; margin-right:10px; color:#fff; text-align:center; background:#226dbd; border-radius:10px;}
    .sub3 .num_txt {flex-basis:70%;}
    .sub3 .num_arr {flex-basis:30%; text-align:center;}
    .sub4_wrap > img  {transform:scale(0.7) translateY(3px);}

    .m_nav {display:flex; align-items:center; z-index:9; width:100%; position:absolute; bottom:-50px; text-align:left; color:#000; background:#fff; border-bottom:1px solid #ccc;}
    .deptIco {flex-basis:20%;text-align:center; background:#004a9f;}
    .deptIco > a {display:block; padding:15px;}
    .deptIco > a > img {transform:scale(0.6);}
    .deptBox {flex-basis:80%; padding:10px; display:flex;}
    .deptBox > h4 {flex-basis:90%;}
    .deptImg {flex-basis:10%; text-align:right;}
    .subPathList {display:none; width:100%; position:absolute; top:61.67px; left:0; background:#f3f3f3;}
    .subPathList > li {color:#222; border-bottom:1px solid #f9f9f9; font-size:4.5vw;} 
    .subPathList > li > a {display:block; padding:20px;}
    
    .footer_wrap {display:none;}
    .footer_m {display:block; padding:30px 0;}
    .footer_txt p {font-size:3.5vw;}

}