@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=block');

:root{

    --Poppins: 'Poppins' , sans-serif;
    --Mont: 'Montserrat', sans-serif;
    --awesome: 'Font Awesome 6 Pro';

    --blue: #121A42;
    --lightbu: #192356;
    --red: #EC1C24;
    --lightGy: #F5F7FA;
    --fontGy: #6A7092;


    --hd_height: 140px;
    --cont_tit: clamp(3rem, 1.3393vw + 1.0714rem, 4.5rem);
    --wrap_tit: 2.4rem;
    --box_tit: 2rem;

    --main_cont_pd: clamp(5rem, 2.6786vw + 1.1429rem, 8rem);

    /*241017 제목과 본문사이 공백수정*/
    --sub_cont_pd: 5rem;
    /*--sub_cont_pd: 10rem;*/


}

.mo_over { display: block !important; }
.mo_only { display: none !important; }
.mo_flex { display: none !important; }

html{font-size: 10px}
body { font-size: 1.6rem; }

.ms-preloader { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #fff; z-index: 9999; }

html.scroll_none { overflow: hidden; }

.in { width: 100%; max-width: 130rem; padding: 0 2rem; margin: 0 auto; }
.in2 { width: 100%; max-width: 104rem; padding: 0 2rem; margin: 0 auto; }

/*버튼스타일*/
.btn_wrap { display: flex; align-items: center; justify-content: flex-start; }
.btn_wrap.center { justify-content: center }
.btn_wrap.right { justify-content: flex-end }
.btn_wrap.side { justify-content: space-between; }
.btn_wrap > * + * { margin-left: 1rem; }

.slide_btn { display: flex; align-items: center; justify-content: center; height: 3rem; padding: 0 1.3rem; line-height: 3rem; color: #fff; fill: #fff; font-size: 1.2rem; border-radius: 2em; background-color: var(--red); }
.slide_btn .ico { margin-left: 0.8rem; }

@-webkit-keyframes arrMove {
    0%   { -webkit-transform:translate(0,0); }
    25%   { -webkit-transform:translate(3px,0); opacity: 0 }
    50% { -webkit-transform:translate(-3px,0); opacity: 0; }
    754% { opacity: 1; }
    100%   { -webkit-transform:translate(0,0); }
}
@-moz-keyframes arrMove {
    0%   { -moz-transform:translate(0,0); }
    25%   { -moz-transform:translate(3px,0); opacity: 0; }
    50% { -moz-transform:translate(-3px,0); opacity: 0; }
    75% { opacity: 0; }
    100%   { -moz-transform:translate(0,0); }
}
@keyframes arrMove {
    0%   { transform:translate(0,0); }
    25%   { transform:translate(3px,0); opacity: 0; }
    50% { transform:translate(-3px,0); opacity: 0; }
    75% { opacity: 1; }
    100%   { transform:translate(0,0); }
}

.slide_btn.bl { background-color: var(--blue) }

.more_btn { display: flex; align-items: center; justify-content: space-between; min-width: 18rem; height: 5.2rem; padding: 0 2.2rem; line-height: 5.2rem; font-size: 1.4rem; font-weight: 600; border-radius: 2em; background-color: var(--red); border: 1px solid var(--red); color: #fff; box-shadow: 0 0 0 transparent; transition: box-shadow 0.3s, background-color 0.3s, color 0.3s; }
.more_btn.bu { background-color: var(--blue); border: 1px solid var(--blue); }
.more_btn .txt { font-weight: 600; }

.more_btn .ico { display: inline-block; width: 1.5rem; height: 1.5rem; position: relative; z-index: 1; transition: width 0.3s ease-in; margin-left: 1.8rem; }
.more_btn .ico:before { content: ""; position: absolute; left: 50%; top: 50%; display: block; width: 2px; height: 15px; background-color: #FFF; transform: translate(-50%, -50%); transition: left 0.25s ease-in; }
.more_btn .ico:after { content: ""; position: absolute; top: 50%; left: 50%; display: block; width: 15px; height: 2px; background-color: #FFF; transform: translate(-50%, -50%); transition: width 0.25s ease-in; }

.more_btn .svg { position: relative; top: -1px; margin-left: 1rem; fill: #fff; transition: fill 0.3s; }

.more_btn.sub { min-width: unset; }
.more_btn.submit { min-width: 18rem; justify-content: center; }

.more_btn.bl { background-color: transparent; border: 1px solid var(--lightbu); color: var(--lightbu); }
.more_btn.bl .ico:before,
.more_btn.bl .ico:after { background-color: var(--lightbu) }

.more_btn.line { background-color: transparent; border: 1px solid var(--lightbu); color: var(--lightbu); }
.more_btn.line .ico:before { background-color: var(--blue); }
.more_btn.line .ico:after { background-color: var(--blue); }

.more_btn.bu { background-color: transparent; border: 1px solid var(--lightbu); color: var(--lightbu); }
.more_btn.bu .svg{fill: var(--lightbu);}

.subs_btn { height: 6.4rem; line-height: 6.4rem; padding: 0 4rem; margin-right: 0.6rem; background-color: var(--lightbu); color: #fff; font-size: var(--box_tit); font-weight: 700; font-family: var(--Poppins); border-radius: 1rem; box-shadow: 0 0 0 transparent; transition: background-color 0.3s, color 0.3s, box-shadow 0.3s; }

.more_btn.wide { padding: 0 5rem; }
.more_btn.center { justify-content: center; }
.more_btn.w100 { width: 100%; }
.more_btn.square { border-radius: 0.5rem; }

.goto_btn { position: relative; display: flex; align-items: center; justify-content: flex-start; color: #9AA2A9; fill: #9AA2A9; font-size: 1.2rem; transition: color 0.3s, fill 0.3s; }
.goto_btn:before { content: ''; position: absolute; left: 0; bottom: -0.2rem; width: 100%; height: 1px; background-color: #9AA2A9; transition: background-color 0.3s; }
.goto_btn .ico { margin-left: 0.8rem; }

/*북마크 버튼*/
.mark_btn { fill: #D4D8DC; font-size: 2rem; }
.mark_btn.on { fill: var(--red); }


.wrap { display: flex; flex-direction: column; min-height: 100vh; }

/*-----header-----*/
.header { position: fixed; left: 0; top: 0; width: 100%; height: var(--hd_height); padding: 2rem 0 1rem 0; background-color: var(--blue); z-index: 300; box-shadow: 1px 1px 8px 0 transparent; transition: background-color 0.2s, background-color 0.3s; }
.header.fix {  box-shadow: 1px 1px 8px 0 rgba(18,26,66,0.1); }
.header.on { background-color: transparent; transition: background-color 0.5s; }
.header .hd_top { display: flex; align-items: center; justify-content: space-between; }

.header .hd_top .util_wrap { display: flex; align-items: center; justify-content: flex-end; }
.header .hd_top .util_wrap .util { color: #fff; }
.header .hd_top .util_wrap .util .btn { position: relative; padding: 0 1.5rem; color: #fff; font-weight: 500; font-size: 1.2rem; }
.header .hd_top .util_wrap .util .btn span { position: relative; }
.header .hd_top .util_wrap .util .btn span:before { content: ''; position: absolute; left: 50%; bottom: -1px; width: 0; height: 1px; background-color: #fff; transform: translateX(-50%); transform-origin: center; transition: width 0.3s; }

.header .hd_top .util_wrap .util.lang_sel { width: 72px; }
.header .hd_top .util_wrap .util .nice-select { height: unset; margin-top: 2px; padding-left: 1.5rem; padding-right: 3rem; line-height: 1; color: #fff; font-weight: 500; font-size: 1.2rem; background-color: transparent; border: 0 ; }
.header .hd_top .util_wrap .util .nice-select:after { right: 5px; margin-top: -5px; border-bottom: 1.5px solid #fff; border-right: 1.5px solid #fff; }
.header .hd_top .util_wrap .util .nice-select .list { width: 100%; background-color: var(--lightGy); border: 0; box-shadow: 0 0 2px 0 rgba(0,0,0,0.2); color: var(--lightbu); }
.header .hd_top .util_wrap .util .nice-select .list li { padding: 0 20px; }
.header .hd_top .util_wrap .util .nice-select .option:hover,
.header .hd_top .util_wrap .util .nice-select .option.focus,
.header .hd_top .util_wrap .util .nice-select .option.selected.focus { background-color: #E9EBF3; }

.header.wh .hd_top .util_wrap .util .btn { color: var(--blue); }
.header.wh .hd_top .util_wrap .util .btn span:before { background-color: var(--blue); }


.header .hd_btm { display: flex; align-items: center; justify-content: space-between; margin-top: 2rem; }
.header .nav { width: 100%; color: #fff; }
.header .nav .depth1 { position: relative; display: flex; align-items: center; justify-content: flex-start; }
.header .nav .depth1 > li { position: relative; }
.header .nav .depth1 > li > a { display: block; padding: 1.5rem 4rem; font-size: 1.7rem; font-weight: 600; transition: padding 0.3s; }
.header .nav.on .depth1 > li > a { padding: 1.5rem 6rem; }
.header .nav .depth1 > li > a span { position: relative; }
.header .nav .depth1 > li > a span:before { content: ''; position: absolute; left: 0; top: 0; width: 0.5rem; height: 0.5rem; border-radius: 100%; background-color: var(--red); transform: translate(-120%, -120%); opacity: 0; transition: opacity 0.3s; }
.header .nav .depth1 > li > a.on span:before { opacity: 1; }
.header .nav .depth1 > li:first-of-type > a { padding-left: 0; }
.header .nav .depth1 > li:last-of-type > a { padding-right: 0; }

.header .nav .depth2_bg { position: absolute; left: 0; top: 0; width: 100%; height: 0; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: rgba(18,26,66,0.85); z-index: -1; pointer-events: none; transition: height 0.3s; }
.header .nav.on .depth2_bg { box-shadow: 0 5px 5px 0 rgba(18,26,66,0.02); }
.header.wh .nav .depth2_bg { background-color: rgba(245,247,250,0.85); }
.header .nav .depth2 { position: absolute; left: 6rem; bottom: 0; width: 100%; height: var(--height); transform: translateY(100%); opacity: 0; transition: opacity 0.1s; pointer-events: none; }
.header .nav .depth2 > li {  }
.header .nav .depth2 > li > a { position: relative; display: block; padding: 0.8rem 0; font-size: 1.4rem; }
.header .nav .depth2 > li > a span { position: relative; display: inline-block; border-radius: 2em; padding: 0.2em 0; transition: padding 0.3s, background-color 0.3s, color 0.3s; }
.header .nav .depth2 > li:hover > a span { padding: 0.2em 0.7em; color: var(--blue); background-color: #fff; }
.header.wh .nav .depth2 > li:hover > a span { background-color: var(--blue); color: #fff; }
.header .nav .depth2 > li > a.active span { padding: 0.2em 0.7em; color: var(--blue); background-color: #fff; }
.header.wh .nav .depth2 > li > a.active span { background-color: var(--blue); color: #fff; }
.header .nav .depth1 > li:first-of-type .depth2 > li > a { margin-left: -6rem; }

.header .nav.on .depth2_bg { height: 65rem }
.header .nav.on .depth2 { opacity: 1; pointer-events: visible; transition: opacity 0.5s; }

.header .hd_btm .menu { display: flex; align-items: center; justify-content: flex-end; flex-shrink: 0; margin-left: 5rem; }
.header .hd_btm .menu .btn_box { position: relative; }
.header .hd_btm .menu .btn_box + .btn_box { margin-left: 3rem; }
.header .hd_btm .menu .btn_box .btn { font-size: 2.4rem; fill: #fff; transition: fill 0.3s; }

.header .hd_btm .menu .share_area { position: absolute; padding: 20px 0; flex-direction: column; justify-content: space-around; align-items: center; opacity: 0; pointer-events: none; width: 70px; height: 0; overflow: hidden; top: 48px; left: 50%; transform: translateX(-50%); background: var(--lightGy); flex-wrap: wrap; box-shadow: 0 3px 5px 0 rgba(0,0,0,0.1); transition: height 0.5s, width 0s ease-in-out, opacity 0.5s; }
.header .hd_btm .menu .share_area.on { height: 160px; opacity: 1; pointer-events: inherit; }
.header .hd_btm .menu .share_area .a_box { display: block; width:100%; padding:0; background: none; border-radius: 0; }
.header .hd_btm .menu .share_area a { display: flex; align-items: center; justify-content: center; margin:0 auto 0; text-align: center; opacity: 0.7; width:100%; transition: 0.3s ease-in-out; color: var(--blue); fill: var(--blue); font-size: 23px; line-height: 1 }
.header .hd_btm .menu .util_box .share_area a svg { width: 100%; height: 100%; fill: var(--blue); }
.header .hd_btm .menu .share_area a i { color: #fff; }
.header .hd_btm .menu .share_area .a_box + .a_box { margin-top: 26px; }
.header .hd_btm .menu .share_area a.share { font-size: 20px; }

.header.wh { background-color: var(--lightGy); }
.header.fix.wh { box-shadow: 1px 1px 10px 0 rgba(18,26,66,0.03); }
.header.wh.on { background-color: transparent; }
.header.wh .nav { color: var(--blue); }
.header.wh .hd_top .util_wrap .util .btn_box { color: var(--blue); }
.header.wh .hd_top .util_wrap .util .nice-select { color: var(--blue); }
.header.wh .hd_top .util_wrap .util .nice-select:after { border-bottom: 1.5px solid var(--blue); border-right: 1.5px solid var(--blue); }
.header.wh .hd_btm .menu .btn_box .btn { fill: var(--blue); }

/*통합검색*/

.all_sch { position: fixed; left: 0; top: var(--hd_height); display: flex; align-items: center; justify-content: center; width: 100%; padding: 6rem 0; background-color: rgba(18,26,66,0.9); backdrop-filter: blur(10px); z-index: 200; opacity: 0; pointer-events: none; transition: opacity 0.2s; }
.all_sch.on { opacity: 1; pointer-events: visible; }

.all_sch .in { position: relative; }

.all_sch .in > .tit { margin-bottom: 5rem; font-size: var(--cont_tit); font-weight: 600; color: #fff; text-align: center; font-family: var(--Poppins); line-height: 1; }

.all_sch .in > .btn_wrap { position: absolute; right: 3rem; top: 0; transform: translateY(-100%); }
.all_sch .cls_btn { fill: var(--lightGy); font-size: var(--wrap_tit); transition: transform 0.5s; }

.all_sch .cont { max-width: 70rem; margin: 0 auto; }

.all_sch .sch_box { display: flex; align-items: center; justify-content: center; width: 100%; height: 6rem; margin: 0 auto; background-color: var(--lightGy); border-radius: 1rem; padding: 0 2.5rem; }
.all_sch .sch_box input { width: 100%; background-color: transparent; color: var(--blue); }
.all_sch .sch_box input::placeholder { color: #BDBDBD; }
.all_sch .sch_box .ico { margin-left: 1.5rem; font-size: var(--box_tit); flex-shrink: 0; fill: var(--blue); }

.all_sch .tag_wrap { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; max-width: 70rem; margin: 1.5rem auto 0; }
.all_sch .tag_wrap .tag { height: 25px; line-height: 25px; margin: 8px 0 0 5px; padding: 0 15px; border: 0.5px solid transparent; background-color: rgba(255,255,255,0.7); color: var(--blue); font-weight: 500; font-size: 1.2rem; border-radius: 2em; white-space: nowrap; transition: background-color 0.5s, color 0.5s; }
/*.all_sch .tag_wrap .tag:hover { background-color: #0c1233; color: #fff; }*/

/*.header.wh .all_sch { background-color: var(--blue); }*/
/*.header.wh .all_sch .sch_box { background-color: var(--lightGy); }*/
/*.header.wh .all_sch .sch_box input { color: var(--blue); }*/
/*.header.wh .all_sch .sch_box .ico { fill: var(--blue); }*/
/*.header.wh .all_sch .cont .cls_btn { fill: #fff; }*/

/*사이트맵*/
.sitemap { position: fixed; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh; background-color: var(--blue); color: #fff; z-index: 400; opacity: 0; pointer-events: none; transition: opacity 0.25s ease-out; }
.sitemap.on { opacity: 1; pointer-events: visible; }
.sitemap .cont { display: flex; align-items: flex-start; justify-content: center; flex-direction: column; width: 100%; max-width: 128rem; height: 70%; margin: 0 auto; }
.sitemap .cont > .top { display: flex; align-items: flex-end; justify-content: space-between; width: 100%; padding: 0 2rem 3rem; border-bottom: 1px solid rgba(255,255,255,0.3); }
.sitemap .cont .tit { display: block; font-size: var(--cont_tit); font-weight: 600; font-family: var(--Poppins); }
.sitemap .cont .cls_btn { width: 3rem; height: 3rem; font-size: var(--wrap_tit); fill: #fff; }
.sitemap .cont .cls_btn svg { width: 100%; height: 100%; transition: transform 0.5s; }
.sitemap .cont .site_nav { width: 100%; height: 80%; padding: 0 2rem; margin-top: 3rem; overflow: auto; }
.sitemap .cont .site_nav::-webkit-scrollbar { width: 3px; }
.sitemap .cont .site_nav::-webkit-scrollbar-thumb { height: 30%; background: var(--lightbu); border-radius: 10px; }
.sitemap .cont .site_nav .depth1 { display: flex; align-items: flex-start; justify-content: center; }
.sitemap .cont .site_nav .depth1 li { width: 100%; }
.sitemap .cont .site_nav .depth1 > li { width: auto; }
.sitemap .cont .site_nav .depth1 > li + li { margin-left: 7rem; }
.sitemap .cont .site_nav .depth1 > li > a { position: relative; display: block; padding: 2rem 0; font-size: 2.4rem; font-weight: 600; }
.sitemap .cont .site_nav .depth1 > li > a span { position: relative; }
.sitemap .cont .site_nav .depth1 > li > a span:before { content: ''; position: absolute; left: -0.5em; top: 0; width: 0.2em; height: 0.2em; border-radius: 100%; background-color: var(--red); opacity: 0; transition: opacity 0.3s; }
.sitemap .cont .site_nav .depth1 > li > a .arr { display: none; }
.sitemap .cont .site_nav .depth1 li.active> a span:before { opacity: 1; }

.sitemap .cont .site_nav .depth2 > li > a { display: block; padding: 0.5rem 0; transition: color 0.3s; }
.sitemap .cont .site_nav .depth2 > li.active > a { color: var(--red); }
.sitemap .cont .site_nav .depth2 > li + li { margin-top: 1.4rem; }

.sitemap .cont .site_nav .depth3 { margin-top: 0.3rem; }
.sitemap .cont .site_nav .depth3 > li > a { display: block; padding: 0.5rem 0; font-size: 1.4rem; color: var(--fontGy); transition: color 0.3s; }
.sitemap .cont .site_nav .depth3 > li.active > a { color: #fff; }

#container { position: relative; margin-top: var(--hd_height); flex: 1; min-height: 80vh; }
/*#container:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 26vh; background-color: var(--lightGy); z-index: 5; }*/
#container:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: var(--hd_height); background-color: var(--blue); transform: translateY(-100%); }
#container.wh:before { background-color: var(--lightGy); }


/*-----footer-----*/
.footer { background-color: var(--blue); }

.footer .ft_top { position: relative; padding: 6rem 0 4.5rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.footer .ft_top .in { display: flex; align-items: flex-start; justify-content: space-between; }
.footer .ft_top .ft_tit { font-size: 1.5rem; color: #fff; font-weight: 600; }
.footer .ft_top .menu_wrap { width: 65%; display: flex; align-items: flex-start; justify-content: flex-start;  }
.footer .ft_top .menu { display: flex; align-items: flex-start; justify-content: flex-start; width: 50%; }
.footer .ft_top .menu .ft_tit { width: 30%; }
.footer .ft_top .menu .depth2 { width: 70%; font-size: 1.4rem; font-weight: 300; color: #6A7092; }
.footer .ft_top .menu .depth2 > li + li { margin-top: 0.8rem; }
.footer .ft_top .menu .depth2 > li > a { transition: color 0.3s; }
.footer .ft_top .menu .depth2 > li > a.active { color: var(--red); }

.footer .ft_top .contact { width: 35%; }
.footer .ft_top .contact .ft_inp { margin-top: 1rem; }
.footer .ft_top .contact .ft_tit + .inp_box { margin-top: 2rem; }
.footer .ft_top .contact .inp_box { background-color: #2A3153; border-radius: 0.5rem; overflow: hidden; }
.footer .ft_top .contact .ft_inp + .inp_box { margin-top: 1.2rem; }
.footer .ft_top .contact .name_inp { display: flex; align-items: center; justify-content: center; }
.footer .ft_top .contact .name_inp .inp_box:first-of-type { width: 45%; }
.footer .ft_top .contact .name_inp .inp_box:last-of-type { width: 55%; }
.footer .ft_top .contact .name_inp .inp_box + .inp_box { margin-top: 0; margin-left: 1rem; }

.footer .ft_top .contact .name_inp + .inp_box { margin-top: 1.2rem; }
.footer .ft_top .contact .inp_box + .inp_box { margin-top: 1.2rem; }
.footer .ft_top .contact .inp_box input { width: 100%; height: 4.5rem; line-height: 4.5rem; padding: 0 1.5rem; background-color: transparent; color: #bdbdbd; }
.footer .ft_top .contact .inp_box textarea { width: 100%; height: 9.5rem; padding: 1.5rem; background-color: transparent; border: 0; resize: none; color: #bdbdbd; }
.footer .ft_top .contact .inp_box input::placeholder,
.footer .ft_top .contact .inp_box textarea::placeholder { color: rgb(87, 87, 87); }

.footer .ft_top .contact .inp_box .select2-container .select2-selection { position: relative; display: block; height: 4.5rem; line-height: 4.5rem; padding-left: 2rem; border-radius: 0.5rem; border: none; color: #bdbdbd; background-color: transparent; }
.footer .ft_top .contact .inp_box .select2-container .select2-selection .select2-selection__rendered { height: 4.5rem; line-height: 4.5rem; padding: 0; color: #bdbdbd; }
.footer .ft_top .contact .inp_box .select2-container--default .select2-selection--single .select2-selection__placeholder {  color: rgba(87, 87, 87); }
.footer .ft_top .contact .inp_box .select2-container.select2-container--default .select2-selection--single .select2-selection__arrow { display: none; }
.footer .ft_top .contact .inp_box .select2-container .select2-selection:after { content: '\f0d7'; position: absolute; right: 1.5rem; top: 55%; width: auto; height: auto; color: rgba(87, 87, 87); font-weight: 900; border: 0; transform: translateY(-50%); font-family: var(--awesome); transform-origin: center; transition: transform 0.3s; }
.footer .ft_top .contact .inp_box .select2-container.select2-container--open .select2-selection:after { transform: translateY(-50%) rotate(180deg); }
.footer .ft_top .contact .inp_box .nice-select { display: none !important; }

.footer .ft_top .contact .turnstile-wrap { margin-top: 1.5rem; overflow: hidden; }
.footer .ft_top .contact .turnstile-wrap .cf-turnstile { display: flex; align-items: center; justify-content: flex-start; width: 100% !important; height: 100% !important; }

.footer .ft_top .contact .captcha { height: 8rem; margin-top: 1.2rem; border-radius: 0.5rem; overflow: hidden; }
.footer .ft_top .contact .captcha img { width: 100%; height: 100%; object-fit: contain; }
.footer .ft_top .contact .captcha .g-recaptcha { display: flex; align-items: center; justify-content: flex-start; width: 100% !important; height: 100% !important; }
.footer .ft_top .contact .btn_wrap .btn { width: 100%; height: 4.5rem; line-height: 4.5rem; margin-top: 1.2rem; border-radius: 0.5rem; border: 1px solid #fff; color: #fff; font-size: 1.5rem; font-weight: 600; transition: background-color 0.3s, color 0.3s; }

.footer .ft_btm { padding: 6rem 0; }
.footer .ft_btm .in { display: flex; align-items: stretch; justify-content: flex-start; }
.footer .ft_btm .logo { width: 16rem; margin-right: 8rem; flex-shrink: 0; opacity: 0.2; }
.footer .ft_btm .cont { display: flex; align-items: flex-start; justify-content: space-between; flex-direction: column; width: 100%; }
.footer .ft_btm .cont .util { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.footer .ft_btm .cont .util ul { display: flex; align-items: center; justify-content: flex-start; color: #fff; font-size: 1.5rem; font-weight: 600; }
.footer .ft_btm .cont .util ul li { transition: color 0.3s; }
.footer .ft_btm .cont .util ul li + li { margin-left: 4rem; }
.footer .ft_btm .cont .util .sns_wrap { display: flex; align-items: center; justify-content: flex-end; }
.footer .ft_btm .cont .util .sns_wrap .sns { font-size: 2rem; fill: #6A7092; transition: fill 0.3s; }
.footer .ft_btm .cont .util .sns_wrap .sns + .sns { margin-left: 4rem; }
.footer .ft_btm .cont .copy { color: rgba(255,255,255,0.2); }

/*탑버튼*/
.footer .top_btn_box { overflow: hidden; position: fixed; bottom: 20px; right: 5%; z-index: 10; opacity: 0; width: 8.5rem; height: 8.5rem; background-color: #fff; box-shadow: 3px 2px 15px 4px rgba(18,26,66,0.085); border-radius: 50%; transition: background 0.2s ease-in-out , opacity .5s }
.footer .top_btn_box.show { opacity: 1 }
.footer .top_btn_box.fixed { position: absolute; top: 0; bottom: auto; transform: translateY(-50%) }
.footer .top_btn_box .top_btn { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; cursor: pointer }
.footer .top_btn_box .top_btn svg { font-size: 2rem; fill: var(--blue); transition: transform 0.5s, fill 0.5s; }

/*-----체크박스-----*/
.chk_box input.hidden { display: none; }
.chk_box svg { width: 1.8rem; height: 1.8rem; padding-right: 1.5px; margin-right: 0.5rem; margin-top: 0.1em ; vertical-align: middle; }
.chk_box.agree svg { width: 1.2rem; height: 1.2rem; margin-top: 0.22em; }
.chk_box .n {fill: var(--blue);}
.chk_box .y {display: none; fill: var(--blue)}
.chk_box span {font-size: 1.4rem; font-weight: 500; }
.chk_box label { display: flex; align-items: flex-start; justify-content: flex-start; cursor: pointer; }
.chk_box input:checked + label .n {display: none}
.chk_box input:checked + label .y {display: inline}

.chk_box.agree {  }
.chk_box.agree label { height: 2.4rem; line-height: 2.3rem; padding: 0 1.5rem; border-radius: 2em; background-color: #fff; color: #A7ABBD; fill: #A7ABBD; border: 1px solid #A7ABBD; }
.chk_box.agree label .txt { font-size: 1.2rem; }
.chk_box.agree label .ico { margin-top: 0.2em; font-size: 1.3rem; }
.chk_box.agree input:checked + label { background-color: var(--blue); color: #fff; fill: #fff; border: transparent; }
.chk_box.agree.line input:checked + label { background-color: var(--blue); color: #fff; fill: #fff; border: 1px solid var(--blue); }



/*-----모달-----*/
.modal { display: block; justify-content: center; align-items: center; overflow: auto; position: fixed; top:0; bottom:0; left:0; right:0; z-index: 9999; opacity: 0; width:100%; height: 100%; padding: 50px 0 80px; background: rgba(0,0,0,0.4); pointer-events: none; transition: 0.2s ease-in-out}
.modal.open { opacity: 1; pointer-events: inherit }
.modal_wrap { display: table; position: relative; width: 100%; height: 100%; padding: 0 20px; margin: 0 auto; table-layout: fixed; vertical-align: middle}
.modal_wrap .scroll_box { display: table-cell; vertical-align: middle}
.modal_wrap .modal_cont { position: relative; width: 800px; max-width: 100%; padding: 6rem; margin: 0 auto; background-color: #fff; border-radius: 2rem; }
.modal_wrap .modal_cont .cls_btn { position: absolute; right: 3rem; top: 3rem; font-size: 2.4rem; transition: fill 0.3s, transform 0.3s; }
.modal_wrap .modal_cont .modal_tit { font-size: var(--cont_tit); font-weight: 600; font-family: var(--Poppins); text-align: center; }
.modal_wrap .modal_cont .modal_tit + .modal_txt { margin-top: 2.5rem; }
.modal_wrap .modal_cont .modal_txt { font-size: 1.5rem; font-weight: 400; color: var(--fontGy); text-align: center; }
.modal_wrap .modal_cont .modal_tit + .cont { margin-top: 3rem; }
.modal_wrap .modal_cont .modal_tit + form { margin-top: 3rem; }
.modal_wrap .modal_cont .modal_txt + .cont { margin-top: 3rem; }
.modal_wrap .modal_cont .modal_txt + form { margin-top: 3rem; }

/*over*/
.over_modal { display: block; justify-content: center; align-items: center; overflow: auto; position: fixed; top:0; bottom:0; left:0; right:0; z-index: 9999; opacity: 0; width:100%; height: 100%; padding: 50px 0 80px; background: rgba(0,0,0,0.4); pointer-events: none; transition: 0.2s ease-in-out }
.over_modal.open { opacity: 1; pointer-events: inherit }


/*로그인*/
.modal_wrap .modal_cont.login { width: 53rem; }
.modal_wrap .modal_cont.login .cont > .btn_wrap { margin-top: 2rem; }
.modal_wrap .modal_cont.login .cont > .btn_wrap .btn { position: relative; font-size: 1.3rem; color: var(--fontGy); transition: color 0.2s; }
/*.modal_wrap .modal_cont.login .cont > .btn_wrap .btn:before { content: ''; position: absolute; left: 0; bottom: -0.3rem; width: 100%; height: 1px; background-color: var(--fontGy); }*/
.modal_wrap .modal_cont.login .cont > .btn_wrap + .btn_wrap { margin-top: 3rem; }
.modal_wrap .modal_cont.login .cont .join_box { margin-top: 6rem; padding: 3rem; border-radius: 0.5rem; background-color: var(--lightGy); }
.modal_wrap .modal_cont.login .cont .join_box .top { display: flex; align-items: center; justify-content: space-between; }
.modal_wrap .modal_cont.login .cont .join_box .top > .tit { font-size: var(--box_tit); font-weight: 700; }
.modal_wrap .modal_cont.login .cont .join_box > .txt { margin-top: 2rem; font-size: 1.5rem; font-weight: 400; color: var(--fontGy); }

/*비밀번호*/
.modal_wrap .modal_cont.password { width: 63rem; }
.modal_wrap .modal_cont.password .cont > .btn_wrap { margin-top: 3rem; }
.modal_wrap .modal_cont.password .cont > .btn_wrap .btn { position: relative; font-size: 1.5rem; color: var(--fontGy); transition: color 0.3s; }
.modal_wrap .modal_cont.password .cont > .btn_wrap .btn + .btn { margin-left: 2.4rem; }
.modal_wrap .modal_cont.password .cont > .btn_wrap .btn + .btn:before { content: ''; position: absolute; left: -1.2rem; top: 52%; width: 0.25em; height: 0.25em; border-radius: 100%; background-color: rgba(167,171,189,0.5); transform: translate(-50%, -50%); }
.modal_wrap .modal_cont.password .cont > .box { display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.modal_wrap .modal_cont.password .cont > .box .ico { display: flex; align-items: center; justify-content: center; width: 16rem; height: 16rem; border-radius: 100%; background-color: var(--lightGy); font-size: 6rem; fill: var(--blue); }
.modal_wrap .modal_cont.password .cont > .box .ico + .txt { margin-top: 4rem; }

/*개인정보처리방침*/
.modal_wrap .modal_cont.priv { width: 82rem; }
.modal_wrap .modal_cont.priv .cont { margin-top: 5rem; }
.modal_wrap .modal_cont.priv .cont .txt_box h5 { margin-bottom: 3rem; font-size: var(--wrap_tit); font-weight: 600; }
.modal_wrap .modal_cont.priv .cont .txt_box .box + .box { margin-top: 4rem; }
.modal_wrap .modal_cont.priv .cont .txt_box .tit { font-size: var(--box_tit); font-weight: 600; }
.modal_wrap .modal_cont.priv .cont .txt_box .tit + p { margin-top: 1rem; }
.modal_wrap .modal_cont.priv .cont .txt_box .txt { font-size: 1.5rem; color: var(--fontGy); }
.modal_wrap .modal_cont.priv .cont .txt_box p + p { margin-top: 1.5rem; }
.modal_wrap .modal_cont.priv .cont .txt_box ul { margin-top: 2.5rem; }
.modal_wrap .modal_cont.priv .cont .txt_box ul li { position: relative; padding-left: 1em; }
.modal_wrap .modal_cont.priv .cont .txt_box ul li:before { content: ''; position: absolute; left: 0; top: 0.6em; width: 0.5rem; height: 1.5px; background-color: var(--lightbu); transform: translateY(50%); }
.modal_wrap .modal_cont.priv .cont .txt_box ul li + li { margin-top: 1rem; }

/*내정보 수정*/
.modal_wrap .modal_cont.modify { width: 950px; }
.modal_wrap .modal_cont.modify .modal_tit + .cont { margin-top: 9rem; }

/*회원가입메일 확인*/
.modal_wrap .modal_cont.sign { width: 800px; }
.modal_wrap .modal_cont.sign .cont .txt_box { width: 70%; margin: 0 auto; padding: 3rem; border-radius: 2rem; font-size: var(--box_tit); font-weight: 600; background-color: var(--lightGy); text-align: center; }
.modal_wrap .modal_cont.sign .cont .txt + .txt_box { margin-top: 4rem; }
.modal_wrap .modal_cont.sign .cont .txt_box + .txt { margin-top: 4rem; line-height: 1.6; }
.modal_wrap .modal_cont.sign .cont .txt a { text-decoration: underline; }

/*opinion leaders*/
.modal_wrap .modal_cont.leader { width: 85%; max-width: 1340px; }


/*radio 버튼*/
.radio_box input[type="radio"] { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px) }
.radio_box input[type="radio"] + label { position: relative; padding-left: 2.5rem; margin-right: 2rem; color: #192356; font-size: 1.6rem; vertical-align: middle; line-height: 1em; cursor: pointer; display: inline-block; min-width: 6rem; }
.radio_box input[type="radio"] + label::before { content:'\f111'; position: absolute; top: 0.1em; left: 0; margin-right: 0.5em; color: #D4D8DC; cursor: pointer; font-family: 'Font Awesome 6 Pro'; }
.radio_box input[type="radio"]:checked + label:before { content: '\f2f8'; color: #192356; }

.modal_wrap .modal_cont.mypage { width: 560px; padding: 0 0 5rem; overflow: hidden; }
.modal_wrap .modal_cont.mypage .modal_tit { padding: 3rem; text-align: left; }
.modal_wrap .modal_cont.mypage .modal_tit + .cont { margin-top: 0; }
.modal_wrap .modal_cont.mypage .cont {  }
.modal_wrap .modal_cont.mypage .cont .filter_cont { max-height: 750px; overflow-y: auto; padding: 3rem; background-color: #F5F7FA; position:relative;}
.modal_wrap .modal_cont.mypage .cont .filter_cont::-webkit-scrollbar { width: 3px; }
.modal_wrap .modal_cont.mypage .cont .filter_cont::-webkit-scrollbar-thumb { height: 30%; background: var(--lightbu); border-radius: 10px; }
.modal_wrap .modal_cont.mypage .cont .filter_cont .filter + .filter { margin-top: 3rem; padding-top: 3rem; border-top: 1px solid #DCE2EB; }
.modal_wrap .modal_cont.mypage .cont .filter_cont .filter > .tit { font-size: 1.8rem; font-weight: 600; }
.modal_wrap .modal_cont.mypage .cont .filter_cont .filter .radio_wrap { margin-top: 2rem; }
.modal_wrap .modal_cont.mypage .cont .filter_cont .filter .radio_box + .radio_box { margin-top: 1rem; }
.modal_wrap .modal_cont.mypage .cont .filter_cont + .btn_wrap { margin-top: 2.5rem; }



/*-----호버 스타일-----*/
@media screen and (min-width: 1025px) {
    .slide_btn:hover .ico { animation: arrMove 0.8s linear; }

    .more_btn:hover .ico { width: 1.5rem; cursor: pointer; }
    .more_btn:hover .ico:before { left: 1.2rem; top: 50%; width: 0.8rem; height: 0.8rem; background-color: transparent; color: #D3E337; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: translate(-50%, -50%) rotate(45deg); }
    .more_btn:hover .ico:after { width: 1.8rem; }

    .more_btn:hover .svg { fill: var(--blue); }

    .more_btn.sub:hover { background-color: #fff; color: var(--red); }
    .more_btn.sub.bl:hover { background-color: var(--blue); color: #fff; }

    .more_btn.bl:hover .ico:before { background-color: transparent; border-top: 2px solid var(--lightbu); border-right: 2px solid var(--blue); }

    .more_btn.line:hover { background-color: var(--lightbu); color: #fff; }
    .more_btn.line:hover .ico:before { border-right: 2px solid #fff; border-top: 2px solid #fff; color: #fff; }
    .more_btn.line:hover .ico:after { background-color: #fff; }


    .more_btn.bu:hover { background-color: var(--lightbu); color: #fff; }
    .more_btn.bu:hover .svg { fill: #fff; }

    .subs_btn:hover { background-color: #fff; color: var(--lightbu); box-shadow: 0 0 7px rgba(18,26,66,0.1); }

    .goto_btn:hover { color: var(--lightbu); fill: var(--lightbu); }
    .goto_btn:hover:before { background-color: var(--lightbu) }

    .header .hd_top .util_wrap .util .btn:hover span:before { width: 110%; }
    .header .nav .depth2 > li > a:hover { color: var(--red); }
    .header .hd_btm .menu .btn_box:hover .btn { fill: var(--red); }
    .header .hd_btm .menu .share_area a:hover { fill: var(--red); }

    .sitemap .cont .cls_btn:hover svg { transform: rotate(180deg); }
    .sitemap .cont .site_nav .depth1 li:hover > a span:before { opacity: 1; }
    .sitemap .cont .site_nav .depth2 > li:hover > a { color: var(--red); }
    .sitemap .cont .site_nav .depth3 > li:hover > a { color: #fff; }

    .footer .ft_top .menu .depth2 > li > a:hover { color: #fff; font-weight: bold; }
    .footer .ft_top .contact .btn_wrap .btn:hover { background-color: #fff; color: var(--blue); }
    .footer .ft_btm .cont .util ul li:hover { color: var(--red); }
    .footer .ft_btm .cont .util .sns_wrap .sns:hover { fill: #fff; }

    .modal_wrap .modal_cont .cls_btn:hover { fill: var(--red); }

    .modal_wrap .modal_cont.login > .cont > .btn_wrap .btn:hover { color: var(--blue); }

    .modal_wrap .modal_cont.password > .cont > .btn_wrap .btn:hover { color: var(--blue); }

    .all_sch .cls_btn:hover { transform: rotate(180deg); }
    .all_sch .tag_wrap .tag:hover { background-color: #fff; }
    
    .footer .top_btn_box:hover .top_btn svg { transform: translateY(-3px); fill: var(--red); }

}

/*-----반응형-----*/
@media screen and (min-width: 2800px) {
    html { font-size: 12px }
}

@media screen and (max-width: 1920px) {
    html { font-size: 9.5px }
}

@media screen and (max-width: 1640px) {
    .modal_wrap .modal_cont.leader .opi_li { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media screen and (max-width: 1024px){
    html { font-size: 9px }

    :root {
        --hd_height: 100px;

        --cont_tit: 3rem;
        --wrap_tit: 2.2rem;
        --box_tit: 2rem;

        --main_cont_pd: 5rem;
        --sub_cont_pd: 8rem;
    }
    .in { padding: 0 20px; }

    .header .nav .depth1 > li > a { padding: 2rem 4.5rem; }
    .header .hd_btm .menu { margin-left: 3rem; }
    .header .hd_btm .menu .share_area { top: 70px; }

    /*mobile menu*/
    .sitemap .cont { height: 75%; }
    .sitemap .cont > .top { position: absolute; right: 3px; top: 30px; width: auto; border-bottom: 0; }
    .sitemap .cont .tit { display: none; }
    .sitemap .cont .site_nav { height: 100%; margin-top: 0; }
    .sitemap .cont .site_nav .depth1 { flex-direction: column; justify-content: flex-start }
    .sitemap .cont .site_nav .depth1 > li { width: 100%; }
    .sitemap .cont .site_nav .depth1 > li + li { margin-left: 0; }
    .sitemap .cont .site_nav .depth1 > li > a { width: 100%; padding: 18px 15px; font-size: 2.2rem; }
    .sitemap .cont .site_nav .depth1 > li > a.active span:not(.arr):before { opacity: 1; }
    .sitemap .cont .site_nav .depth1 > li > a .arr { position: absolute; right: 20px; top: 0.5em; display: block; font-weight: 500; transform: translateY(50%); color: #fff; fill: #fff; font-size: 1em; }
    .sitemap .cont .site_nav .depth1 > li > a .arr svg { transition: transform 0.3s; transform-origin: center; }
    .sitemap .cont .site_nav .depth1 > li > a.on .arr svg { transform: rotate(180deg); }

    .sitemap .cont .site_nav .depth2 { display: none; padding: 16px 0; border-radius: 10px; background-color: var(--lightbu); }
    .sitemap .cont .site_nav .depth2 > li > a { padding: 5px 15px 5px 25px; font-size: 1.8rem; opacity: 0.7; }

    .sitemap .cont .site_nav .depth3 { display: none; }

    /*header*/
    /*.header { height: 90px; }*/
    .header .hd_top .logo { max-width: 130px; }
    .header .nav { display: none; }
    .header .hd_btm { justify-content: flex-end; }
    .header .hd_btm .menu .share_area { top: 41.8px; width: 57px; }
    .header .hd_btm .menu .share_area a { font-size: 21px; }
    .header .hd_btm .menu .share_area a.share { font-size: 19px; }

    .modal_wrap .modal_cont.leader .opi_li { grid-template-columns: repeat(1, minmax(0, 1fr)); }

    .footer .top_btn_box { width: 7rem; height: 7rem; }
    .footer .ft_top .contact { margin-left: 2rem; }

}

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

    .mo_over { display: none !important; }
    .mo_only { display: block !important; }
    .mo_flex { display: flex !important; }

    html { font-size: 8px; }
    body { font-size: 13px; }

    .in .in { padding: 0; }

    :root {
        --hd_height: 90px;

        --cont_tit: 22px;
        --wrap_tit: 17px;
        --box_tit: 15px;

        --main_cont_pd: 40px;
        --sub_cont_pd: 30px;
    }

    /*버튼 스타일*/
    .more_btn { height: 40px; line-height: 40px; padding: 0 15px; }
    .more_btn.row2 { height: 40px; padding: 0 18px; line-height: 1.3; }
    .more_btn .ico:before { width: 1px; height: 10px; }
    .more_btn .ico:after { width: 10px; height: 1px; }

    .subs_btn { height: 45px; margin-right: 0; line-height: 45px; padding: 0 2rem; font-size: 12px; }

    .goto_btn { font-size: 11px; }
    .goto_btn .ico { font-size: 8px; }

    .mark_btn { font-size: 17px; }

    /*체크박스*/
    .chk_box svg { width: 23px; height: 23px; padding-right: 5px; margin-top: -0.13em; font-size: 17px; }

    .chk_box.agree label { height: 25px; line-height: 24px; align-items: center; border-width: 0.5px; }
    .chk_box.agree.line input:checked + label { border-width: 0.5px; }
    .chk_box.agree span { font-size: 11px; }
    .chk_box.agree label .txt { font-size: 12px; }
    .chk_box.agree label .ico { margin-top: 0.1em; }
    .chk_box.agree svg { margin-top: 0; font-size: 14px; }

    /*통합검색*/
    .all_sch { padding: 50px 0 30px; }
    .all_sch .in > .btn_wrap { top: -15px; }
    .all_sch .in > .tit { margin-bottom: 30px; font-size: 20px; }
    .all_sch .sch_box { height: 40px; }
    .all_sch .tag_wrap .tag { height: 20px; line-height: 18px; padding: 0 10px; font-size: 11px; }


    /*header*/
    .sitemap .cont > .top { width: 100%; }
    .sitemap .cont > .top .util_wrap { padding-left: 15px; }
    .sitemap .cont > .top .util_wrap .util { display: block; }
    .sitemap .cont > .top .util_wrap .util + .util { margin-left: 10px; }
    .sitemap .cont > .top .util_wrap .util .btn { display: block; height: 25px; line-height: 23px; padding: 0 15px; border: 0.5px solid #fff; border-radius: 0.5rem; }
    .sitemap .cont > .top .util_wrap .util span { color: #fff; font-size: 11px; }

    .header .hd_top .util_wrap .util .nice-select { font-size: 11px; }
    .header .hd_top .util_wrap .util .nice-select .list li { padding: 0 12px; }
    .header .hd_top .util_wrap .util .nice-select .list li.option { min-height: 36px; line-height: 36px; }

    .header .hd_btm .menu .share_area { top: 38.8px; }

    /*footer*/
    .footer .ft_top{padding: 4rem 0 4.5rem;}
    .footer .ft_top .in { flex-direction: column; }
    .footer .ft_top .menu_wrap { width: 100%; }
    .footer .ft_top .menu { flex-direction: column; }
    .footer .ft_top .menu .depth2 { margin-top: 10px; }
    /*.footer .ft_top .menu .depth2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }*/
    .footer .ft_top .contact .captcha {  }
    .footer .ft_top .contact .captcha iframe { transform: scale(0.8); transform-origin: left; }

    .footer .ft_top .contact { width: 100%; margin-top: 24px; margin-left: 0; }
    .footer .ft_top .contact .name_inp{width: 100%;}
    .footer .ft_top .ft_inp { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; margin-top: 10px; }
    .footer .ft_top .ft_inp .inp_box { width: 100%; }
    .footer .ft_top .ft_inp .inp_box + .inp_box { margin-top: 0; margin-left: 10px; }

    .footer .ft_btm { padding: 20px 0 30px; }
    .footer .ft_btm .in { flex-direction: column; }
    .footer .ft_btm .logo { width: 80px; }
    .footer .ft_btm .cont .util { /*flex-direction: column;*/ align-items: center; margin-top: 20px; }
    .footer .ft_btm .cont .util .sns_wrap .sns + .sns { margin-left: 25px; }
    /*.footer .ft_btm .cont .util .sns_wrap { margin-top: 20px; }*/
    .footer .ft_btm .cont .copy { margin-top: 25px; font-size: 11px; }

    /*top_btn*/
    .footer .top_btn_box { position: absolute; width: 50px; height: 50px }
    .footer .top_btn_box .top_btn svg { font-size: 14px; }

    /*modal*/
    .modal_wrap .modal_cont { padding: 35px 15px; }
    .modal_wrap .modal_cont .cls_btn { top: 1.5rem; right: 1.5rem; }
    .modal_wrap .modal_cont .modal_txt br { display: none; }
    .modal_wrap .modal_cont .modal_tit + .cont,
    .modal_wrap .modal_cont .modal_txt + .cont { margin-top: 20px; }
    .modal_wrap .modal_cont.modify .modal_tit + .cont { margin-top: 30px; }

    .modal_wrap .modal_cont.leader { width: 98%; }

    .modal_wrap .modal_cont.priv >.cont { margin-top: 40px; }

    .modal_wrap .modal_cont.login > .cont .join_box .top { align-items: baseline; }
    .modal_wrap .modal_cont.login > .cont .join_box { margin-top: 30px; padding: 15px; }
    .modal_wrap .modal_cont.login > .cont > .btn_wrap { margin-top: 10px; }

    .modal_wrap .modal_cont.password > .cont > .box .ico { width: 8rem; height: 8rem; font-size: 24px; }
    .modal_wrap .modal_cont.password > .cont > .box .ico + .txt { margin-top: 2rem; }

}