@charset "UTF-8";
@import url(font.css);


html,body { font-size:16px; font-family: 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; height:100%; }

html.fixed { position:fixed; overflow: hidden; width:100%; }

/* 공식배너 누리집*/
#krds-masthead { background-color:#eef2f7; position:relative; }
#krds-masthead .inner {display:flex;align-items: center;justify-content: flex-start;flex-direction: row;flex-wrap:wrap;width:100%;margin:0 auto;padding: 4px 16.5px;min-height:32px;padding-top:0;padding-bottom:0;box-sizing: border-box;}
#krds-masthead .toggle-head .nuri-txt::before { content:""; display:inline-flex; width:24px; height:24px; background-image:url(/common/images/layout/component/taegeukgi.png); background-size:contain; background-repeat:no-repeat; background-position:center; }
#krds-masthead .toggle-head .nuri-txt { display:flex; align-items: center; justify-content: flex-start; flex-direction: row; gap:8px; font-size:15px; word-break: break-all; }

@media all and (max-width:1240px) {
	#krds-masthead .inner { padding: 4px 16.5px; }
}

.swiper-container-veritcal > .swiper-wrapper { flex-direction: column; }

#header { width:100%; height:105px; background-color:#fff; }
#header .inner { max-width:1980px; margin:0 auto; }
#header .header-flex { display:flex; height:105px; align-items: center; justify-content: space-between; padding-left:50px; }
#header .header-flex h1#logo { width:310px; }
#header .header-flex h1#logo a { display:block; }
#header .header-flex h1#logo img { width:100%; }

#gnb { width:890px; height:100%; }
#gnb ul.depth1-lists { display:flex; justify-content: space-between; width:100%; }
#gnb ul.depth1-lists a.depth1 { display:flex; align-items: center; justify-content: center; height:105px; font-size:1.3em; letter-spacing: -0.025em; font-weight:500; padding:0 30px; box-sizing: border-box; text-align: center;}

#gnb .depth2-list { display:none; position:absolute; z-index:5; /*width:890px; left:50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%);*/ background-color:#fff; border-left:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:20px; border-bottom-left-radius:8px; border-bottom-right-radius:8px; box-shadow:0 5px 8px rgba(0,0,0,0.2); }
#gnb .depth2-list.on { display:block; }
#gnb .depth2-list ul { display:flex; align-items: center; }
#gnb .depth2-list ul li { margin-right:10px; padding-right:10px; }
#gnb .depth2-list ul li:last-child { margin-right:0; padding-right:0; }
#gnb .depth2-list ul li a { display:block; color:#333; font-size:1.1em; letter-spacing: -0.05em; font-weight:500; color:#333; }

#gnb .m-links { display:none; }
#gnb .m-links ul { display:flex; justify-content: center; margin-top:35px;}
#gnb .m-links ul li { margin-right:5px; }
#gnb .m-links ul li:last-child { margin-right:0; }
#gnb .m-links ul li a { display:flex; align-items: center; justify-content: center; padding:0 10px; border:1px solid #ddd; height:32px; font-size:0.85em; border-radius:4px; box-shadow:0 3px 0 #ddd;}
#gnb .m-links ul li a.insta { text-indent:-9999em; font-size:0; width:40px; padding:0; background-image:url(../images/header_insta.png); background-repeat:no-repeat; background-position:center; background-position:center; }
#header a.m-menu { display:none; position:relative; width:80px; height:80px; background-color:#57585a; }
#header a.m-menu .ham { position:absolute; width:24px; height:16px; left:50%; top:50%; transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);}
#header a.m-menu .ham span { position:absolute; display:block; width:100%; height:2px; background-color:#fff; border-radius:3px; transition: all 0.3s}
#header a.m-menu .ham span:nth-of-type(2) { top:7px; width:80%; right:0; transition: all 0.3s; }
#header a.m-menu .ham span:nth-of-type(3) { top:14px; width:90%; right:0; transition: all 0.3s; }

#header a.m-menu.open .ham span:nth-of-type(1) { top:50%; transform:translateY(-50%) rotate(45deg); transition: all 0.3s }
#header a.m-menu.open .ham span:nth-of-type(2) { display:none; }
#header a.m-menu.open .ham span:nth-of-type(3) { width:100%; top:50%; transform:translateY(-50%) rotate(-45deg);}

#header .r-utils .all-menu { position:relative; display:block; width:105px; height:105px; background-color:#57585a; }
#header .r-utils .all-menu .ham { position:absolute; width:34px; height:21px; left:50%; top:50%; transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);}
#header .r-utils .all-menu .ham span { position:absolute; display:block; width:100%; height:3px; background-color:#fff; border-radius:3px; transition: all 0.3s}
#header .r-utils .all-menu .ham span:nth-of-type(2) { top:9px; width:80%; right:0; transition: all 0.3s; }
#header .r-utils .all-menu .ham span:nth-of-type(3) { top:18px; width:90%; right:0; transition: all 0.3s; }


#header .r-utils { display:flex; align-items: center; }
#header .r-utils .links { margin-right:20px;}
#header .r-utils .links ul { display:flex; }
#header .r-utils .links ul li { margin-left:5px;}
#header .r-utils .links ul li a { display:flex; align-items: center; justify-content: center; height:40px; padding:0 8px; box-sizing: border-box; border:1px solid #ddd; color:#555; letter-spacing: -0.05em; font-weight:300; font-size:0.9em }
#header .r-utils .links ul li a:hover { background-color:#ddd; }
#header .r-utils .links ul li a.insta { text-indent:-9999em; font-size:0; width:40px; padding:0; background-image:url(../images/header_insta.png); background-repeat:no-repeat; background-position:center; background-position:center; }

#header .r-utils .all-menu { position:relative; display:block; width:105px; height:105px; background-color:#57585a; }
#header .r-utils .all-menu .ham { position:absolute; width:34px; height:21px; left:50%; top:50%; transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);}
#header .r-utils .all-menu .ham span { position:absolute; display:block; width:100%; height:3px; background-color:#fff; border-radius:3px; transition: all 0.3s}
#header .r-utils .all-menu .ham span:nth-of-type(2) { top:9px; width:80%; right:0; transition: all 0.3s; }
#header .r-utils .all-menu .ham span:nth-of-type(3) { top:18px; width:90%; right:0; transition: all 0.3s; }

#header .r-utils .all-menu.open .ham span:nth-of-type(1) { top:50%; transform:translateY(-50%) rotate(45deg); transition: all 0.3s }
#header .r-utils .all-menu.open .ham span:nth-of-type(2) { display:none; }
#header .r-utils .all-menu.open .ham span:nth-of-type(3) { width:100%; top:50%; transform:translateY(-50%) rotate(-45deg);}

#header .r-utils .all-menu:hover .ham span:nth-of-type(2),
#header .r-utils .all-menu:hover .ham span:nth-of-type(3) { width:100%; transition: all 0.3s; }

#header .r-utils .allmenu-list { display:none; position:absolute; top:105px; left:0; width:100%; z-index:4; box-sizing: border-box; background-color:#f9f9f9; border-top:1px solid #ddd; box-shadow:0 6px 10px rgba(0,0,0,0.1); min-height:420px; }
#header .r-utils .allmenu-list.open { display:block;}
#header .r-utils .allmenu-list .list-wrap { width:890px; margin:0 auto; background-color:#fff; height:100%; padding:25px 20px; min-height:420px; border-left:1px solid #ddd; border-right:1px solid #ddd; }
#header .r-utils .allmenu-list ul.flex-ul { display:flex; flex-wrap:wrap; }
#header .r-utils .allmenu-list ul.flex-ul > li { width:32%; margin-right:2%; margin-bottom:2%; }
#header .r-utils .allmenu-list ul.flex-ul > li:nth-child(3n) { margin-right:0; }
#header .r-utils .allmenu-list ul.flex-ul > li a.all-depth1 { display:flex; align-items: center; justify-content: center; width:100%; text-align: center; background-color:#e7f0f8; height:40px; color:#002157; font-weight:500; box-sizing: border-box; }
#header .r-utils .allmenu-list ul.flex-ul > li .all-depth2 { min-height:200px; background-color:#f9f9f9;}
#header .r-utils .allmenu-list ul.flex-ul > li .all-depth2 ul li { border-bottom:1px dashed #eaeaea}
#header .r-utils .allmenu-list ul.flex-ul > li .all-depth2 ul li a { display:flex; align-items: center; justify-content: center; height:40px; padding:0 15px; font-weight:500; color:#333; }

#footer { height:170px; background-color:#f3f3f4; }
#footer .inner { width:1380px; margin:0 auto; }
#footer .footer-flex { display:flex; align-items: center; height:170px; }
#footer .footer-flex a { display:block;  }
#footer .footer-flex a h1.footer-logo { width:176px; }
#footer .footer-flex a h1.footer-logo img { width:100%; height:100%; }
#footer .footer-flex .footer-con { margin-left:50px; width:calc(100% - 226px); color:#555555; }
#footer .footer-flex .footer-con .footer-links ul { display:flex; }
#footer .footer-flex .footer-con .footer-links ul li { position:relative; margin-right:15px; padding-right:15px; }
#footer .footer-flex .footer-con .footer-links ul li::after { content:""; display:block; position:absolute; right:0; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); width:1px; height:12px; background-color:#8a8a8a;}
#footer .footer-flex .footer-con .footer-links ul li:last-child { margin:0; padding:0; }
#footer .footer-flex .footer-con .footer-links ul li:last-child::after { display:none; }
#footer .footer-flex .footer-con .footer-links ul li a { color:#555555; font-weight:300; }
#footer .footer-flex .footer-con .footer-copy { margin-top:20px}
#footer .footer-flex .footer-con .footer-copy .footer-info { margin-bottom:10px; }
#footer .footer-flex .footer-con .footer-copy .footer-info ul { display:flex; }
#footer .footer-flex .footer-con .footer-copy .footer-info ul li { position:relative; margin-right:15px; padding-right:15px; line-height:1.2; }
#footer .footer-flex .footer-con .footer-copy .footer-info ul li::after { content:""; display:block; position:absolute; right:0; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); width:1px; height:12px; background-color:#8a8a8a;}
#footer .footer-flex .footer-con .footer-copy .footer-info ul li:last-child { margin:0; padding:0; }
#footer .footer-flex .footer-con .footer-copy .footer-info ul li:last-child::after { display:none; }

@media all and (max-width:1650px){

    #header .header-flex { padding-left:20px; }
    #header .header-flex h1#logo { width:250px;}
    #gnb { width:auto; }
    #gnb ul.depth1-lists a.depth1 { padding:0 15px; font-size:1em;}

}

@media all and (max-width:1460px){
    #header .r-utils .links { display:none; }
}

@media all and (max-width:1380px){
    #header .inner { width:100%; max-width:100%; }
    #footer .inner { width:100%; padding:0 15px; box-sizing: border-box; }

}


@media all and (max-width:1180px){
    #header { height:80px; position:relative; z-index: 999; border-bottom:1px solid #ddd;  }
    #header .header-flex { width:100%; height:80px; padding:0 0 0 15px; box-sizing: border-box; }

    #header a.m-menu { display:block; }

    #gnb { position:absolute; right:100%; width:100%; top:81px; height:auto; background-color:#fff; height:100vh; overflow-y: scroll; }
    #gnb.open { right:0; }
    #gnb ul.depth1-lists { display:block; }
    #gnb .depth2-list { position:static; display:none; border-radius:0; box-shadow: none; border:none; }
    #gnb .depth2-list ul { display:block; }
    #gnb ul.depth1-lists a.depth1 { justify-content:space-between; height:50px; border-bottom:1px solid #ddd; }
    #gnb ul.depth1-lists a.depth1::after { content:""; display:block; width:17px; height:9px; background-image:url(../images/m_depth1.png); background-repeat:no-repeat; }
    #gnb ul.depth1-lists a.depth1.on::after { background-image:url(../images/m_depth1_open.png); }

    #gnb .depth2-list { background-color:#f2f2f2; border-bottom:1px solid#ddd; }
    #gnb .depth2-list ul li { margin-bottom:15px;}
    #gnb .depth2-list ul li:last-child { margin-bottom:0; }
    #gnb .depth2-list ul li a { font-size:1em;}

    #gnb .m-links { display:block; }

    #header .r-utils { display:none; }

}

@media all and (max-width:960px){
    #footer { font-size:0.9em;}
    #footer .footer-flex a h1.footer-logo { width:130px; }
    #footer .footer-flex .footer-con { width:calc(100% - 150px); margin-left:20px; }
}


@media all and (max-width:768px){
    #header { height:60px;}
    #header .header-flex { height:60px; }
    #header .header-flex h1#logo { width:160px }
    #header a.m-menu { width:60px; height:60px;}
    #gnb { top:61px;}
    #footer  { padding:25px 0; height:auto; box-sizing: border-box; font-size:0.85em; }
    #footer .footer-flex { flex-wrap:wrap; justify-content: center; height:auto; }
    #footer .footer-flex .footer-con { width:100%; margin:15px 0; }
    #footer .footer-flex .footer-con .footer-links ul { justify-content: center; }
    #footer .footer-flex .footer-con .footer-links ul li { margin-right:8px; padding-right:8px; }
    #footer .footer-flex .footer-con .footer-copy .footer-info { margin: 15px 0;}
    #footer .footer-flex .footer-con .footer-copy .footer-info ul { flex-wrap:wrap; }
    #footer .footer-flex .footer-con .footer-copy .footer-info ul li { width:100%; margin-right:0; padding-right:0; text-align:center; line-height:1.5; }
    #footer .footer-flex .footer-con .footer-copy .footer-info ul li::after { display:none; }
    #footer .footer-flex .footer-con .footer-copy .footer-info ul li.telnum { margin-top:10px; }
    #footer .footer-flex .footer-con .footer-copy p.copyright { text-align:center; }
}