@import url('root.css'); /* 변수 */
@import url('font.css'); /* 폰트 */
@import url('https://use.typekit.net/vst3koz.css');

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,article,aside,canvas,details,embed,html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0; line-height:165%; letter-spacing:normal} /* delete vertical-align,font:inherit; */
body,html{width:100%; font-size:17px; color:var(--basic); font-weight:400; line-height:165%; font-family: var(--kor); word-break: keep-all;}
*{font-family: var(--kor); word-break: keep-all;}
body{-webkit-text-size-adjust: none; word-break:keep-all;}
ol,ul,li{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table {border-collapse:separate;border-spacing:0; font-size:0.9375rem;}
table caption {overflow:hidden; font-size:0; line-height:0; font-size:0.9375rem;}
tbody,tfoot,thead,tr,th,td {margin:0;line-height:160%;letter-spacing:normal;}
dt{display:block;}
hr{display:none;}
a{cursor:pointer;text-decoration:none;color:inherit;}
a, a:hover{transition:all 0.7s cubic-bezier(0.215,0.61,0.355,1);}
address{font-style:normal;}
input,select,img{vertical-align:middle;}
input:focus, textarea:focus, button:focus {outline:none;}  /* 크롬에서 커서 클릭시 파란색 테두리 제외*/
/* input, button {border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none;} */
select { border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; background: url("/assets/images/newImg/cat_arrow_bk.svg") no-repeat right 20px center/10px auto;}
select::-ms-expand {display:none}
input[type=text]::-ms-clear {display: none;}
input::-webkit-input-placeholder {color:#999; }
input:-ms-input-placeholder {color:#999; }
input::placeholder {color:#999; }

span, b, strong, br {line-height:inherit; font-family:inherit;}

/* Web Content Accessibility TTS(Text To Speech) Code */
.blind {position:absolute; top:0px; left:0px; overflow:hidden; display:inline-block !important; width:1px !important; height:1px !important; margin:0 !important; font-size:0 !important; line-height:0 !important;}



/* Common */
.brFixed {display: block !important;}
.ls0 {letter-spacing:0 !important;}
.eng {font-family:var(--eng);}

.redFont{color:var(--sub3) !important;}
.blueFont{color:var(--sub2) !important;}
.blackFont{color:var(--black) !important;}
.whiteFont{color:var(--white) !important;}

.center{text-align:center !important;}
.left{text-align:left !important;}
.right{text-align:right !important;}
.bold{font-weight: 700 !important; letter-spacing:inherit; line-height:inherit;}
.semibold{font-weight: 600 !important; letter-spacing:inherit; line-height:inherit;}
.medium{font-weight: 500 !important; letter-spacing:inherit; line-height:inherit;}
.regular{font-weight: 400 !important; letter-spacing:inherit; line-height:inherit;}
.light{font-weight: 300 !important; letter-spacing:inherit; line-height:inherit;}
.pointColor{color:var(--main) !important;}
.grayBg{background-color:var(--grayBg) !important;}
.grayBg2{background-color:var(--grayBg2) !important;}
.widthBg{background-color:var(--white) !important;}
.material-symbols-outlined {font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 48;}
.underline_txt{display: inline-block; text-decoration:underline;}





/* 슬릭기본 */
.slick-slider{position: relative; display: block; box-sizing: border-box; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent; outline: 0 !important;}
.slick-list{position: relative; display: block; overflow: hidden; margin: 0; padding:0 !important;  outline: 0 !important;}
.slick-track {display:flex; }
.slick-slide{border:0; outline: 0 !important;}
.slick-initialized .slick-slide{display:block; outline: 0 !important;}
/* 슬릭기본 */


/* 레이아웃 */
.wrapper{position:relative; width:100%; min-width:1400px;}
.basic_in{max-width:1350px; width: calc(100% - 50px); box-sizing:border-box; margin: 0 auto;}
.w1720{max-width:1720px; width: calc(100% - 50px); box-sizing:border-box; margin: 0 auto;}
.w1905{max-width:1905px; width: calc(100% - 50px); box-sizing:border-box; margin: 0 auto;}


.scrollbar::-webkit-scrollbar {width:5px; height:5px;}
.scrollbar::-webkit-scrollbar-thumb {background-color:var(--border); border-radius:5px; background-clip:padding-box; border:0;}
.scrollbar::-webkit-scrollbar-track {background-color:var(--white); box-shadow:inset 0px 0px 5px white;}

/* 폰트 */
.fs45{font-size:2.647rem; letter-spacing: -1.8px; line-height: 120%; font-weight: 500; color:var(--black);}
.fs45.eng{letter-spacing: 0;}
.fs36{font-size:2.25rem; letter-spacing: -1.08px; line-height: 130%; font-weight: 200; color:var(--black);}
.fs36 b{display: inline; font-weight: 700; letter-spacing: inherit; line-height: inherit;}
.fs29{font-size:1.706rem; letter-spacing: -1.45px; line-height: 135%; font-weight: 700; color:var(--black);}
.fs25{font-size:1.471rem; letter-spacing: -1.25px; line-height: 140%; font-weight: 700; color:var(--black);}
.fs21{font-size:1.235rem; letter-spacing: -1.05px; line-height: 150%; color:var(--black);}
.fs19{font-size:1.118rem; letter-spacing: -0.57px; line-height: 145%; font-weight: 600; color:var(--black);}
.fs17{font-size:1rem; letter-spacing: -0.51px; line-height: 165%;}
.fs15{font-size:0.882rem; letter-spacing: -0.45px; line-height: 165%;}
.fs13{font-size:0.765rem; letter-spacing: -0.25px; line-height: 160%;}


.compad {padding:150px 0; box-sizing:border-box;}
.compad_t {padding:150px 0 0; box-sizing:border-box;}
.compad_b {padding:0 0 150px; box-sizing:border-box;}

.subpad {padding:60px 0; box-sizing:border-box;}
.subpad_t {padding:60px 0 0; box-sizing:border-box;}
.subpad_b {padding:0 0 60px; box-sizing:border-box;}


.subpad2 {padding:80px 0; box-sizing:border-box;}
.subpad2_t {padding:80px 0 0; box-sizing:border-box;}
.subpad2_b {padding:0 0 80px; box-sizing:border-box;}


/* Header */
.header{position: fixed; left:0; top:0; z-index: 99999999; transition:all .4s; width: 100%; height: 100px; overflow: hidden; min-width:1400px;}
.header:before{content:''; display:block; width: 100%; height: 1px; position: absolute; left:0; top:99px; background:var(--border); opacity: 0; transition:all .3s; z-index: 6;}
.header .header_in{padding: 37px 0; display: flex; align-items:center; justify-content: space-between;}
.header .header_in .logo{position: relative; z-index: 5;}
.header .header_in .logo a{display: block; width: 200px; height: 14px;}
.header .header_in .logo a svg{width: 100%; height: auto; position: absolute; left: 0; top:0; transition:all .3s linear;}
.header .header_in .logo a svg.logo_m{opacity: 0;}
.header .header_in .top_util{display: flex; align-items:center; position: relative; z-index: 5;}
.header .header_in .top_util ul{display: flex; margin-right: 27px;}
.header .header_in .top_util ul li{padding:0 20px 0 0; position: relative;}
.header .header_in .top_util ul li:after{content:''; display:block; width: 1px; height: 10px; background:rgba(255,255,255,.2); position: absolute; right: 10px; top:50%; margin-top: -5px;}
.header .header_in .top_util ul li:last-child:after{display: none;}
.header .header_in .top_util ul li:last-child{padding: 0;}
.header .header_in .top_util ul li a{display: block; font-size:0.824rem; letter-spacing: -0.42px; line-height: 150%; font-weight: 600; color:var(--white); transition:all .3s linear;}
.header .header_in .top_util ul li a:hover{opacity: 0.7;}
.header .header_in .top_util .sitemap_btn{}
.header .header_in .top_util .sitemap_btn a{display: block; width: 26px; height: 26px;}
.header .header_in .top_util .sitemap_btn a svg{width: 100%; height: auto; margin: 3px 0 0;}
.header .header_in .top_util .sitemap_btn a line{stroke:var(--white); transition:all .3s linear;}


/* 메뉴 */
.gnb {position: absolute; left: 0; top:0; width: 100%; transition:all .4s;}
.gnb ul{font-size:0; text-align:center; box-sizing:border-box; width: 100%;}
.gnb ul li{line-height: 120%; display: inline-block; vertical-align: top; padding: 0 30px; position: relative;}
.gnb ul li > a{display:inline-block; font-size:18px; letter-spacing: -0.72px; line-height: 120%; color:var(--white); font-weight:600; transition:all .3s linear; position: relative; padding:39px 0; box-sizing:border-box;}
.gnb ul li > a:after{content:''; display: block; width: 0; height: 3px; background:var(--main); position: absolute; left:50%; bottom:0; transition:all .3s; transform:translateX(-50%); z-index: 6;}
.gnb ul li:hover > a:after{width: 100%;}
.gnb ul li dl{position: absolute; left:0; top:100px; width: 100%; overflow: hidden; padding: 28px 0; box-sizing:border-box; text-align:center;}
.gnb ul li dl dd{padding:0 0 10px; line-height: 120%; position:relative; z-index: 2;}
.gnb ul li dl dd:last-child{padding:0;}
.gnb ul li dl dd a{display:block; font-size:16px; letter-spacing: -0.64px; line-height:150%; transition:all .3s linear;}
.gnb ul li dl dd a:hover{color:var(--main) !important; text-decoration:underline; font-weight: 600; transition:all .3s linear;}



.header.nofixed{top:-200px;}
.header.up{background:var(--white); height: 350px; border-bottom: 1px solid var(--border);}
.header.up:before{opacity: 1;}
.header.up .header_in .logo a svg.logo_m{opacity: 1;}
.header.up .header_in .logo a svg.logo_w{opacity: 0;}
.header.up .header_in .top_util ul li:after{background:var(--border);}
.header.up .header_in .top_util ul li a{color:var(--black);}
.header.up .header_in .top_util .sitemap_btn a line{stroke:var(--black);}
.header.up .gnb:before{background:var(--border);}
.header.up .gnb ul li > a{color:var(--black);}

.header.fixed{background:var(--white); box-shadow:0 0 20px rgba(0,0,0,.05);}
.header.fixed .header_in .logo a svg.logo_m{opacity: 1;}
.header.fixed .header_in .logo a svg.logo_w{opacity: 0;}
.header.fixed .header_in .top_util ul li:after{background:var(--border);}
.header.fixed .header_in .top_util ul li a{color:var(--black);}
.header.fixed .header_in .top_util .sitemap_btn a line{stroke:var(--black);}
.header.fixed .gnb:before{background:var(--border);}
.header.fixed .gnb ul li > a{color:var(--black);}



/* 사이트맵 */
.mo_menu{position: fixed; left:0; top:0; width: 100%; height: var(--vh); z-index: 99999999; display: none; overflow-x:hidden; overflow-y:auto;}
.mo_menu:before{content:''; display: block; width: 100%; height: 0; background:var(--white); position: absolute; left: 0; top:0; transition:all .3s;}
.mo_menu.show:before{height: 100%; transition:height 0.5s linear;}
.mo_menu .btnMenu_mClose{position: absolute !important; right: 80px; top:80px; width: 50px; height: 50px; cursor:pointer; font-size:0; z-index: 8 !important ;}
.mo_menu .btnMenu_mClose:after{content:'\e5cd'; display: block; font-size:50px; line-height:50px; width: 100%; height:100%; font-family:var(--icon); color:var(--black); text-align:center; transition:all .3s linear; position: absolute; left:0; top:0;}
.mo_menu .btnMenu_mClose:hover:after{color:var(--main);}
.mo_menu .menuList{display: flex; width: 100%; height: 100%;}
.mo_menu .menuList > div{box-sizing:border-box;  position: relative; z-index: 5;}
.mo_menu .menuList .mo_menu_logo{width: 600px; background:url('/assets/images/newImg/sitemap_img.jpg') no-repeat center/cover; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0;  transition:all .3s;}
.mo_menu.show .menuList .mo_menu_logo{opacity: 1; transition:all .6s 0.5s linear;}
.mo_menu .menuList .mo_menu_logo svg{width: 320px; height: auto;}
.mo_menu .menuList .mo_menu_logo path{fill:var(--white);}
.mo_menu .menuList .mo_menu_list{width: calc(100% - 600px); padding:50px 115px; display: flex; flex-direction: column; justify-content: center;}
.mo_menu .menuList .mo_menu_list dl{padding: 0 0 30px; opacity: 0; transform:translateY(60px); transition:all .3s 0;}
.mo_menu .menuList .mo_menu_list dl:last-child{padding:0;}
.mo_menu .menuList .mo_menu_list dl dt{font-size:1.765rem; letter-spacing: -1.8px; color:var(--black); line-height: 120%; font-weight: 700; pointer-events: none;}
.mo_menu .menuList .mo_menu_list dl dd{padding: 10px 0 0; font-size:0;}
.mo_menu .menuList .mo_menu_list dl dd a{display: inline-block; vertical-align: top; margin: 4px 25px 4px 0; font-size:1rem; letter-spacing: -0.54px; line-height:150%; color:var(--basic); transition:all .3s;}
.mo_menu .menuList .mo_menu_list dl dd a:hover{color:var(--black);}

.mo_menu.show .menuList .mo_menu_list dl{opacity: 1; transform:translateY(0); transition:all .6s linear;}
.mo_menu .menuList .mo_menu_list dl:nth-child(1){transition-delay:1s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(2){transition-delay:1.3s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(3){transition-delay:1.6s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(4){transition-delay:1.9s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(5){transition-delay:2.1s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(6){transition-delay:2.4s;}
.mo_menu .menuList .mo_menu_list dl:nth-child(7){transition-delay:2.7s;}






/* Footer */
.footer{padding: 80px 0 95px; border-top: 1px solid var(--border);}
.footer .foot_top{display: flex; align-items:center; justify-content: space-between;}
.footer .foot_top .foot_logo{width: 200px;}
.footer .foot_top .foot_logo svg{width: 100%; height: auto;}
.footer .foot_top ul{display: flex;}
.footer .foot_top ul li{padding-left: 32px; position: relative;}
.footer .foot_top ul li:before{content:''; display:block; width: 1px; height: 10px; background:var(--border); position: absolute; left: 16px; top:50%; margin-top: -5px;}
.footer .foot_top ul li:first-child:before{display: none;}
.footer .foot_top ul li a{display: block; font-size:0.941rem; letter-spacing: -0.48px; line-height: 150%; color:var(--black); transition:all .3s linear;}
.footer .foot_top ul li a:hover{color:var(--main);}
.footer .foot_top ul li a b{font-weight: 800; letter-spacing: inherit;}
.footer .foot_info{padding: 55px 0 0;}
.footer .foot_info ul{font-size:0;}
.footer .foot_info ul li{display: inline-block; vertical-align: top; font-size:0.882rem; letter-spacing: -0.45px; line-height:165%; box-sizing:border-box; padding:0 20px 6px 0;}
.footer .foot_info .copyright{padding: 50px 0 0; font-size:0.882rem; letter-spacing: 0; line-height: 150%; color:var(--light);}
.footer .foot_info .copyright span,
.footer .foot_info .copyright a{display: inline-block; letter-spacing: inherit; line-height: inherit; transition:all .3s linear; color:inherit;}
.footer .foot_info .copyright a:hover{color:var(--black);}


/* Quick */
#quick{position: fixed; right:30px; bottom: 30px; display: none; z-index: 99999;}
#quick ul{}
#quick ul li{margin: 0 0 10px;}
#quick ul li:last-child{margin: 0;}
#quick ul li a{display:block; width: 70px; height: 70px; font-size:0; border-radius:50%; background:var(--white); transition:all .3s linear; box-shadow: 5px 6px 30px 0px rgba(0, 0, 0, 0.15); position: relative; text-align:center;}
#quick ul li a:after{content:'\e25a'; display:block; width:100%; height:100%; font-size:24px; line-height:70px; font-family:var(--icon); color:var(--black); position: absolute; left: 0; top:0; transition:all .3s linear;}
#quick ul li a:hover{background:var(--black);}
#quick ul li a:hover:after{color:var(--white);}
#quick ul li.consult a{background:var(--main);}
#quick ul li.consult a:hover{background:var(--sub4);}
#quick ul li.consult a:after{content:'\f88c'; color:var(--white);}
#quick ul li.consult a:hover:after{color:var(--white);}









/**  코딩시 지우지 말 것 **/

/* 게시판 페이징 */
.page_num {padding:40px 0 0;}
.page_num ul.pagination {display:flex; flex-wrap:wrap; justify-content: center; align-items:center;}
.page_num ul.pagination li{margin:0 10px;}
.page_num ul.pagination li:nth-child(1){margin:0 3px 0 0;}
.page_num ul.pagination li:nth-child(2){margin:0 10px 0 0;}
.page_num ul.pagination li:nth-last-child(2){margin:0 0 0 10px;}
.page_num ul.pagination li:nth-last-child(1){margin:0 0 0 3px;}
.page_num ul.pagination li a{display:inline-block; vertical-align: top; font-size:0.882rem; line-height: 140%; color:var(--light); position:relative; transition:all .3s linear; text-align:center;}
.page_num ul.pagination li a:hover{color:var(--black);}
.page_num ul.pagination li a.active{color:var(--main) !important; font-weight: 700 !important;}
.page_num ul.pagination li a.active:after{content:''; display:block; width:100%; height:2px; background:var(--main); position:absolute; left:0; bottom:0;}
.page_num ul.pagination li.arrow a{width: 24px; height: 24px; color:#BBBBBB; padding:0; box-sizing:border-box; font-size:0; transition:all .3s linear; text-align:center;}
.page_num ul.pagination li.arrow a:hover{color:var(--black);}
.page_num ul.pagination li.arrow a:after{display: block; font-family:var(--icon); font-size:24px; width:24px; height: 24px; line-height: 24px; transition:all .3s linear;}
.page_num ul.pagination li.arrow.first a:after{content:'\eac3';}
.page_num ul.pagination li.arrow.prev a:after{content:'\e5cb';}
.page_num ul.pagination li.arrow.next a:after{content:'\e5cc';}
.page_num ul.pagination li.arrow.last a:after{content:'\eac9';}









