@charset "utf-8";
.body_hidden {height:100%; min-height:100%; overflow:hidden; touch-action:none;}

body { background:#f5f5f7 }

#wrap { position:relative; }
.inner { max-width:1400px; width:100%; margin:0 auto; }
.inner1700 { max-width:1700px; width:100%; margin:0 auto; }
.inner:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
@media screen and (max-width:1740px){
	.inner1700 { padding:0 20px; }
}
@media screen and (max-width:1440px){
	.inner { padding:0 20px; }
}

:root { 
    --font-main:KoPubWorldDotum;
    --font-sub1:Netmarble;
    --mainColor:#242c8d; 
    /*--subColor:#df2a23;*/
    --subColor:#157ac3; 
}

/* header */
header { position:fixed; top:0; left:0; width:100%; z-index:999; transition:all .5s; }
header .bg { background:rgba(255, 255, 255, 0.50); backdrop-filter:blur(15px); position:fixed; left:0; top:0; width:100%; height:100%; z-index:-11; opacity:0; visibility:hidden; transition:all 0.3s ease; }
header.over .bg { z-index:33; opacity:1; visibility:visible; transition:all 0.3s 0.1s ease-in-out; }
header:before { content:""; display:block; width:100%; height:70px; background-color:#fff; position:absolute; left:0; top:0; transition:all 0.3s ease; }
header:after { content:""; display:block; width:0; height:1px; background:rgba(0, 0, 0, 0.10); position:absolute; left:0; top:70px; transition:initial; z-index:55}
header.over:after { width:100%; transition:all 0.3s; }
header .topbox { position:relative; max-width:1810px; width:100%; margin:0 auto; z-index:99 }
header h1 { position:absolute; left:0; text-align:left; padding:16px 0 0 0; z-index:999; transition:all 0.3s ease-in-out;  }
header h1 a { display:inline-block; transition:all 0.3s ease-in-out; width:157px; height:38px; background:url(/img/common/img_logo.svg) center center no-repeat; overflow:hidden; text-indent:-9999em; }
.body-bg header h1 a { background:url(/img/common/img_logo_off.svg) center center no-repeat; }
.body-bg header.active h1 a,
.body-bg header.over h1 a { background:url(/img/common/img_logo.svg) center center no-repeat; }
header h1 a svg path { transition:all 0.3s ease-in-out; }
header h1 a svg { width:157px; height:auto; }
/*
.body-bg header h1 a .logo-1 { fill:#dadada; }
.body-bg header h1 a .logo-2 { fill:#dbdadb; }
.body-bg header h1 a .logo-2-1 { fill:#f8f8f8; }
.body-bg header h1 a .logo-2-2 { fill:#a3a4a4; }
.body-bg header h1 a .logo-3 { fill:#eee; }
.mainBody header.active h1 a .logo-1,
.body-bg header.active h1 a .logo-1 { fill:#242C8D; }
.mainBody header.active h1 a .logo-2,
.body-bg header.active h1 a .logo-2 { fill:#DF2A23; }
.mainBody header.active h1 a .logo-3,
.body-bg header.active h1 a .logo-3 { fill:#231815; }
.body-bg header.over h1 a .logo-1 { fill:#242C8D; }
.body-bg header.over h1 a .logo-2 { fill:#DF2A23; }
.body-bg header.over h1 a .logo-3 { fill:#231815; }
*/
.body-bg header:before { display:none; }
.body-bg header.active:before { display:block; }

@media screen and (max-width:1850px){
	.topbox { padding:0 20px; }
    header h1 { padding:16px 0 0 20px; }
}


header #navi { position:relative; }
header #navi #gnb { position:relative; z-index:2; text-align:center; }
header #navi #gnb > ul { display:inline-block; }
header #navi #gnb > ul > li { position:relative; margin:0 -2px; display:inline-block; padding:14px 0 15px; min-width:230px; transition:all 0.6s; }
header #navi #gnb > ul > li > a { position:relative; z-index:10; font-weight:500; font-size:16px; color:#111; line-height:1.3; white-space:nowrap; text-transform:uppercase; display:inline-block; text-align:center; padding:10px 15px; transition:all 0.4s; border-radius:50px; }
.body-bg header #navi #gnb > ul > li > a { color:#fff }
.body-bg header.over #navi #gnb > ul > li > a { color:#111 }
.body-bg header.active #navi #gnb > ul > li > a { color:#111 }
/*
header #navi #gnb > ul > li:nth-child(4) { width:160px; }
header #navi #gnb > ul > li:nth-child(5) { width:215px; }
header #navi #gnb > ul > li:nth-child(6) { width:155px; }
*/
header.over #navi #gnb > ul > li { width:230px; }
header.over #navi #gnb > ul > li.on { z-index:3; }
header.over #navi #gnb > ul > li.on > a,
header #navi #gnb > ul > li > a:hover { color:#fff; background:var(--mainColor); }
header #navi #gnb > ul > li > .subDepth { z-index:-11; opacity:0; visibility:hidden; position:absolute; left:50%; transform:translateX(-50%); top:65px; padding-top:5px; width:100%; }
header.over #navi #gnb > ul > li > .subDepth > ul > li a { animation:ani_1 0.5s 0.3s; animation-fill-mode:forwards; }
header #navi #gnb > ul > li > .subDepth:after { content:""; display:block; width:1px; height:0; background:rgba(0, 0, 0, 0.10); position:absolute; left:0; top:6px; z-index:3; transition:initial; }
header #navi #gnb > ul > li:last-child > .subDepth:before { content:""; display:block; width:1px; height:0; background:rgba(0, 0, 0, 0.10); position:absolute; right:0; top:6px; z-index:3; transition:initial;}
header.over #navi #gnb > ul > li > .subDepth { opacity:1; visibility:visible; z-index:2; } 
header.over #navi #gnb > ul > li > .subDepth:before,
header.over #navi #gnb > ul > li > .subDepth:after  { display:block; height:100%; transition:all 0.5s 0.3s; }
header #navi #gnb > ul > li > .subDepth { opacity:1; z-index:4 }
header #navi #gnb > ul > li > .subDepth > ul { text-align:left; padding:40px 30px 70px; }
header #navi #gnb > ul > li > .subDepth > ul > li { overflow:hidden }
header #navi #gnb > ul > li > .subDepth > ul > li:not(:last-child){ margin-bottom:15px; }
header #navi #gnb > ul > li > .subDepth > ul > li > a { opacity:0; position:relative; font-size:15px; color:#111; font-weight:300; line-height:1.3; transition:all 0.2s; white-space:nowrap; display:block }
header.over #navi #gnb > ul > li > .subDepth > ul > li > a { white-space:normal }
header #navi #gnb > ul > li > .subDepth > ul > li > a:hover{ color:var(--mainColor); font-weight:600; letter-spacing:-0.042em; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 { z-index:-11; opacity:0; visibility:hidden; position:absolute; left:231px; top:6px; width:458px; padding:30px 30px 0; background:#f5f5f7; height:calc(100% - 1px); overflow:hidden }
header.over #navi #gnb > ul > li.on > .subDepth > ul > li.active .depth3 { opacity:1; visibility:visible; z-index:5; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .box { opacity:0; }
header.over #navi #gnb > ul > li.on > .subDepth > ul > li.active .depth3 .box { animation:ani_1 0.6s 0.1s; animation-fill-mode:forwards; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .imgbox img { max-width:100%; border-radius:5px; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .txtbox { margin-top:15px; font-weight:300; font-size:14px; color:#333; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .txtbox * { font-weight:300; font-size:14px; color:#333 !important; line-height:1.3; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .btn { margin-top:25px; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .btn a { transition:all 0.3s ease; display:flex; justify-content:center; align-items:center; font-weight:500; font-size:14px; color:#333; line-height:1.3; width:70px; height:36px; border-radius:20px; border:1px solid #c0c0c0; }
header #navi #gnb > ul > li > .subDepth > ul > li .depth3 .btn a:hover { color:#fff; border:1px solid var(--mainColor); background:var(--mainColor); }
header .gnb_bg { height:0; position:absolute; top:0; left:0; width:100%; background-color:#fff; transition:initial; z-index:44; }
header.over .gnb_bg { transition:all 0.5s ease-in-out; }
@media screen and (max-width:1600px){
    header #navi #gnb > ul { padding-left:9%; }
    /*
    header #navi #gnb > ul > li { min-width:120px; }
    header #navi #gnb > ul > li:nth-child(4) { width:150px; }
    header #navi #gnb > ul > li:nth-child(5) { width:205px; }
    header #navi #gnb > ul > li:nth-child(6) { width:145px; }
    */
    header #navi #gnb > ul > li { min-width:200px; }
    header.over #navi #gnb > ul > li { width:200px; }
    header #navi #gnb > ul > li > .subDepth > ul { padding:40px 20px; }
    header #navi #gnb > ul > li > .subDepth > ul > li .depth3 { left:201px; width:399px;}
}
@media screen and (max-width:1400px){
    header #navi #gnb > ul { padding-left:10%; }
    /*
    header #navi #gnb > ul > li:nth-child(4) { width:120px; }
    header #navi #gnb > ul > li:nth-child(5) { width:200px; }
    header #navi #gnb > ul > li:nth-child(6) { width:120px; }
    */
    header #navi #gnb > ul > li { min-width:180px; }
    header.over #navi #gnb > ul > li { width:180px; }
    header #navi #gnb > ul > li > a { font-size:15px; }
    header #navi #gnb > ul > li > .subDepth > ul { padding:40px 0 40px 15px; }
    header #navi #gnb > ul > li > .subDepth > ul > li > a { font-size:14px; }
    header #navi #gnb > ul > li > .subDepth > ul > li .depth3 { left:181px; width:358px; }
}
@media screen and (max-width:1250px){
    header #navi { display:none }
}


header .search-box { position:absolute; right:0; top:22px; z-index:5; }
header .search-box .btn { display:block; width:26px; height:26px; background-image:url(/img/common/btn_search.png);}
.body-bg header .search-box .btn { filter:invert(100%); }
.body-bg header.over .search-box .btn,
.body-bg header.active .search-box .btn { filter:invert(0); }
@media screen and (max-width:1850px){
	header .search-box { right:20px; }
}
@media screen and (max-width:1250px){
	header .search-box { right:60px; }
}

.allBox { position:absolute; right:12px; top:12px; transition:all 0.8s; display:none; z-index:9999 }
.subBody .allBox { }
.allBox.on { z-index:999999; }
.allBox.on .allmenu { z-index:999; }
.allmenu { position:relative; width:45px; height:45px; display:flex; justify-content:center; align-items:center; }
.allmenu a {font-size:15px; font-weight:300; color:var(--mainColor); width:18px; height:14px; position:relative; display:block; margin:0 auto; z-index:2; }
.allmenu a:before { content:""; display:block; width:100%; height:2px; background-color:#111; position:absolute; left:0; top:5px; transition:all 0.3s ease; border-radius:5px; }
.allmenu a:after { content:""; display:block; width:100%; height:2px; background-color:#111; position:absolute; left:0; top:10px; transition:all 0.5s ease; border-radius:5px; }
.allmenu a > span { position:relative; display:block; background-color:#111; width:100%; height:2px; transition:all 0.5s ease; text-align:center; border-radius:5px; }
.allmenu .stxt { font-size:12px; display:none; transition:all 0.3s; color:var(--mainColor); position:absolute; left:50%; top:50%; padding-top:5px; transform:translate(-50%, -50%); }
.allBox.on .allmenu a:before { width:100%; left:unset; right:0; }
.allBox.on .allmenu a > span { opacity:0 }
.allBox.on .allmenu a:before,
.allBox.on .allmenu a:after { background-color:#111; height:2px; }
.allBox.on .allmenu a:before,
.allBox.on .allmenu a:after { width:calc(100% + 2px)}
.allBox.on .allmenu a:before { transform:translate(1px, 1px) rotate(45deg); }
.allBox.on .allmenu a:after { transform:translate(-1px, -4px) rotate(-45deg); }
.body-bg .allBox .allmenu a > span,
.body-bg .allBox .allmenu a:before,
.body-bg .allBox .allmenu a:after { background-color:#fff }
.body-bg .allBox.on .allmenu a > span,
.body-bg .allBox.on .allmenu a:before,
.body-bg .allBox.on .allmenu a:after,
.body-bg header.active .allBox .allmenu a > span,
.body-bg header.active .allBox .allmenu a:before,
.body-bg header.active .allBox .allmenu a:after { background-color:#111 }
@media screen and (max-width:1250px){
	.allBox { display:block; }
}



@media screen and (max-width:1250px){
    #allmenuBox { position:fixed; top:0; right:-520px; max-width:520px; width:100%; height:100vh; background:#f5f5f7; transition:all 0.3s 0.1s ease-in-out; z-index:10000; }
    #allmenuBox.on { right:0; z-index:10000; opacity:1; visibility:visible; transition:all 0.3s 0.1s ease-in-out; }
    #allmenuBox .menuCont { height:100vh; justify-content:flex-start; } 
    #allmenuBox .menuBox { height:100%; }
    #allmenuBox #gnb { position:absolute; top:0; left:0; width:100%; padding:80px 30px; height:100%; overflow:auto; }
    #allmenuBox #gnb > ul > li { position:relative; text-align:left; margin-top:0; }
    #allmenuBox #gnb > ul > li:not(:last-child) { margin-bottom:20px; }
    #allmenuBox #gnb > ul > li > a { position:relative; color:#111; font-weight:500; font-size:30px; line-height:1.3; }
    #allmenuBox #gnb > ul > li > .subDepth { position:relative; display:none; }
    #allmenuBox #gnb > ul > li > .subDepth > ul { padding:10px 0 20px; display:block; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li { margin-top:15px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li > a { position:relative; color:#111; /* color:rgba(255, 255, 255, 0.8);*/ font-weight:300; font-size:18px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li > a:hover { color:#111; font-weight:600;  }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 { display:none; position:absolute;  }
    #allmenuBox #gnb > ul > li.on > .subDepth > ul > li.active .depth3 { display:block; z-index:5; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 { position:relative; margin:10px 0 30px; padding:20px; background:#eee; border-radius:10px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .imgbox { text-align:center }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .imgbox img { max-width:100%; border-radius:5px; margin:0 auto }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .txtbox { margin-top:15px; font-weight:300; font-size:14px; color:#333; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .txtbox * { font-weight:300; font-size:14px; color:#333; line-height:1.3; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .btn { margin-top:15px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 .btn a { display:flex; justify-content:center; align-items:center; font-weight:500; font-size:13px; color:#333; line-height:1.3; width:64px; height:32px; border-radius:20px; border:1px solid #c0c0c0; }
   
    #allmenuBox #gnb { opacity:0; }
    #allmenuBox.on #gnb { animation:ani_4 0.8s 0.5s; animation-fill-mode:both; }
}
@media screen and (max-width:640px){
    #allmenuBox #gnb {padding:60px 20px; }
    #allmenuBox #gnb > ul > li:not(:last-child) { margin-bottom:15px; }
    #allmenuBox #gnb > ul > li > a { font-size:24px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul { padding:10px 0; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li { margin-top:10px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li > a { font-size:16px; }
    #allmenuBox #gnb > ul > li > .subDepth > ul > li .depth3 { margin:10px 0 20px; padding:15px; }
    #allmenuBox .btn { left:20px; }
}


footer { position:relative; position:relative; z-index:100; }
footer .footer-box { position:relative; padding:0 0 30px; }
footer .footer-box .ftxt { font-weight:600; color:#111; font-size:40px; line-height:1.4;  }
footer .footer-box .info { display:flex; flex-wrap:wrap; flex-direction:row-reverse; justify-content:space-between; align-items:flex-end; }
footer .footer-box .info .flogo svg { width:197px; height:auto; }
footer .footer-box .fbox { margin-top:105px; width:70%; }
footer .footer-box .fbox ul:not(:last-child) { margin-bottom:15px; }
footer .footer-box .fbox li { font-weight:300; color:#111; font-size:17px; line-height:1.3; }
footer .footer-box .fbox li a { font-weight:300; color:#111; }
footer .footer-box .fbox li strong { font-weight:400; color:#222; display:inline-block; }
footer .footer-box .fbox ul:nth-child(2) { display:flex; flex-wrap:wrap;}
footer .footer-box .fbox ul:nth-child(2) li:not(:last-child) { margin-right:40px; }
footer .footer-box .all-menu { position:absolute; top:10px; right:0; }
footer .footer-box .all-menu > ul { text-align:right; display:flex } 
footer .footer-box .all-menu > ul > li:not(:first-child) { margin-left:40px; }
footer .footer-box .all-menu > ul > li > a { position:relative; font-weight:500; color:#111; font-size:18px; line-height:1.3 }
footer .footer-box .all-menu > ul > li .subDepth,
footer .footer-box .all-menu > ul > li:nth-child(5) { display:none }
footer .footer_b { margin-top:35px; padding-top:30px; border-top:1px solid rgba(0, 0, 0, 0.10); display:flex; justify-content:space-between; align-items:center; }
footer .copyright { font-weight:300; color:#333; font-size:14px; line-height:1.3 }
footer .fmenu ul li a { font-weight:500; color:#111; font-size:14px; line-height:1.3;}
@media screen and (max-width:1740px){
    footer .footer-box { padding:0 20px 30px; }
    footer .footer-box .all-menu { right:20px; }
}
@media screen and (max-width:1280px){
    footer .footer-box .ftxt { font-size:30px; }
}
@media screen and (max-width:1024px){
    footer .footer-box .ftxt { text-align:center; }
    footer .footer-box .info { align-items:center; flex-direction:column; margin-top:30px; }
    footer .footer-box .fbox { margin-top:80px; width:100%; text-align:center; }
    footer .footer-box .fbox ul:nth-child(2) { justify-content:center; }
    footer .footer-box .all-menu { position:absolute; top:190px; right:unset; left:0; width:100%; text-align:center; }
    footer .footer-box .all-menu > ul { justify-content:center; }
}
@media screen and (max-width:760px){
    footer .footer_b { flex-wrap:wrap; flex-direction:column-reverse; }
    footer .copyright { margin-top:10px; text-align:center; }
}

@media screen and (max-width:640px){
    footer .footer-box { padding:0 20px 100px; }
    footer .footer-box .ftxt { font-size:22px; }
    footer .footer-box .info { margin-top:25px; }
    footer .footer-box .fbox { margin-top:70px; }
    footer .footer-box .fbox li { font-size:16px; }
    footer .footer-box .fbox ul:not(:last-child) { margin-bottom:10px; }
    footer .footer-box .fbox ul:nth-child(2) li:not(:last-child) { margin-right:20px; }
    footer .footer-box .all-menu { top:170px; }
    footer .footer-box .all-menu > ul { flex-wrap:wrap; }
    footer .footer-box .all-menu > ul > li:not(:first-child) { margin-left:20px; }
    footer .footer-box .all-menu > ul > li > a { font-size:16px; }
    footer .footer_b { margin-top:20px; padding-top:20px; }
}
@media screen and (max-width:500px){
    footer .footer-box .fbox { margin-top:85px; }
    footer .footer-box .fbox li { font-size:15px; }
    footer .footer-box .all-menu { top:160px; }
    footer .footer-box .all-menu > ul > li > a { font-size:15px; }
}



/* slick-slider 필수 css */
/* .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;} */
.slick-slider{position:relative; display:block; user-select:text !important; }
.slick-list{position:relative; display:block; overflow:hidden; margin:0; padding:0;}
.slick-list:focus{outline:none;}
.slick-list.dragging{cursor:pointer; }
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}
.slick-track{position:relative; top:0; left:0; display:block;}
.slick-track:before,.slick-track:after{display:table; content:'';}
.slick-track:after{clear:both;}
.slick-loading .slick-track{visibility:hidden;}
.slick-slide{display:none; float:left; height:100%; min-height:1px; -webkit-transform:translate3d(0,0,0);}
.slick-slide img{display:block; margin:0 auto;}
.slick-slide.slick-loading img{display:none;}
.slick-slide.dragging img{pointer-events:none;}
.slick-initialized .slick-slide{display:block;}
.slick-loading .slick-slide{visibility:hidden;}
.slick-vertical .slick-slide{display:block;height:auto; border:1px solid transparent;}
.slick-arrow.slick-hidden{display:none;}

.slick-slider .slick-track,
.slick-slider .slick-list { transform:translate3d(0, 0, 0); }
.slick-slide { transform:translate3d(0,0,0); }




.quick-menu { position:fixed; right:25px; bottom:80px; }
.quick-menu li:not(:last-child) { margin-bottom:5px; }
.quick-menu li { position:relative; height:55px; }
.quick-menu li a { transition:all 0.3s ease; position:absolute; right:0; top:0; min-width:55px; height:55px; display:flex; align-items:center; border-radius:55px; background:#111; }
.quick-menu li a:before { content:""; display:block; position:absolute; right:0; top:0; width:55px; height:55px; z-index:5 }
.quick-menu li a.search:before { background:url(/img/common/quick_icon1.svg) center center no-repeat; }
.quick-menu li a.chart:before { background:url(/img/common/quick_icon2.svg) center center no-repeat; }
.quick-menu li a.inquiry:before { background:url(/img/common/quick_icon3.svg) center center no-repeat; }
.quick-menu li a span { transition:all 0.1s ease; opacity:0; position:relative; color:#fff; font-size:14px; font-weight:600; line-height:1.3; letter-spacing:0.7px; white-space:nowrap; }
.quick-menu li a:hover { padding:0 54px 0 22px; background-color:var(--mainColor);  }
.quick-menu li a:hover span { opacity:1; transition:all 0.7s ease; }
#btn_top { margin-top:5px;}
#btn_top a { display:flex; justify-content:center; align-items:center; flex-direction:column; width:55px; height:55px; background:var(--mainColor); border-radius:70px; color:#fff; font-size:16px; font-weight:500; line-height:1.3; }
#btn_top a img { margin-bottom:3px; }
@media screen and (max-width:640px){
    .quick-menu { position:fixed; right:0; bottom:0; width:100%; }
    .quick-menu ul { display:flex; }
    .quick-menu li { width:33.33%; height:50px; }
    .quick-menu li:before { content:""; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:12px; background:#fff; z-index:5; opacity:0.5 }
    .quick-menu li:not(:last-child) { margin-bottom:0; }
    .quick-menu li:first-child:before { display:none }
    .quick-menu li a,
    .quick-menu li:hover a { min-width:100%; height:55px; border-radius:0; opacity:1; background-color:var(--mainColor); padding:0 65px 0 45px; }
    .quick-menu li:nth-child(2) a,
    .quick-menu li:nth-child(2) a:hover { padding:0 65px 0 55px; }
    .quick-menu li a span { opacity:1; }
    .quick-menu li a:before { right:15px; width:55px; height:55px; }
    #btn_top { margin-top:0; position:absolute; right:10px; bottom:60px;}
    #btn_top a { width:40px; height:40px; font-size:12px; background:#111;  }
    #btn_top a img { margin-bottom:1px; width:6px;}
}

.os-theme-dark > .os-scrollbar, .os-theme-light > .os-scrollbar { padding:0; }
.os-theme-dark > .os-scrollbar-vertical, .os-theme-light > .os-scrollbar-vertical { width:4px; }
.os-theme-dark > .os-scrollbar-horizontal, .os-theme-light > .os-scrollbar-horizontal { height:4px; }
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle { background:var(--mainColor); width:4px; border-radius:4px; opacity:0.7 }
.os-theme-dark.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active, 
.os-theme-light.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active,
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle.active { background:var(--mainColor); border-radius:4px; opacity:1 }


/* privacy */

#privacy { position:fixed; top:0; left:0; z-index:99999; display:none; width:100%; height:100%; }
#privacy.on { display:block; }
#privacy .bg { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.62); }
#privacy .privacyBody { position:absolute; left:50%; transform:translateX(-50%); top:125px; z-index:5; max-width:1700px; width:100%; height:calc(100vh - 200px); padding:85px 40px 85px 80px; background-color:#fff; border-radius:30px; }
#privacy .privacyBody .privacy-box { width:100%; height:calc(100vh - 475px); padding-right:40px; }
#privacy .btn_close { cursor:pointer; position:absolute; top:15px; right:15px; width:50px; height:50px; background:url(/img/common/btn_close_p.png) center center no-repeat;}
@media screen and (max-width:1920px){
    #privacy .privacyBody { left:110px; transform:translateX(0); width:calc(100vw - 220px); }
}
@media screen and (max-width:1400px){
    #privacy .privacyBody { left:80px; top:100px; width:calc(100vw - 160px); height:calc(100vh - 160px); padding:60px 30px 60px 60px; }
    #privacy .privacyBody .privacy-box { padding-right:30px; height:calc(100vh - 370px); }
}
@media screen and (max-width:1024px){
    #privacy .privacyBody { left:40px; top:100px; width:calc(100vw - 80px); border-radius:15px; padding:40px 20px 40px 40px; }
    #privacy .privacyBody .privacy-box { padding-right:20px; height:calc(100vh - 300px); }
}
@media screen and (max-width:640px){
    #privacy .privacyBody { left:20px; top:100px; width:calc(100vw - 40px); padding:25px 10px 25px 20px; }
    #privacy .privacyBody .privacy-box { padding-right:10px; height:calc(100vh - 255px); }
}
@media screen and (max-height:540px){
    #privacy .privacyBody { padding:25px 10px 25px 20px; }
    #privacy .privacyBody .privacy-box { padding-right:10px; height:calc(100vh - 255px); }
}


.privacy * { color:#111; font-size:17px; font-weight:300; line-height:1.7 }
.privacy h2 { color:#111; font-size:50px; font-weight:600; line-height:1.3; }
.privacy h3 { color:#111; font-size:25px; font-weight:600; line-height:1.3; }
.privacy .privacy-box { margin-top:50px; }
.privacy .privacy-box p:not(:last-child) { margin-bottom:15px;  }
.privacy .privacy-box p+dl { margin-top:70px; }
.privacy .privacy-box dl { margin-top:50px; }
.privacy .privacy-box dl > dd p,
.privacy .privacy-box dl > dd li { margin-top:30px; }
.privacy .privacy-box dl > dd li ul { padding-left:18px; }
.privacy .privacy-box dl > dd li li { margin-top:10px; line-height:1.5 }
.privacy .privacy-box .txt_b  { color:#666; font-size:14px; font-weight:300; line-height:1.5; margin-top:20px; }
.privacy .privacy-box table { }
.privacy .privacy-box th { padding:12px 20px; border:1px solid #ddd; background-color:#fafafa; font-weight:700; color:#333 }
.privacy .privacy-box td { padding:12px 20px; border:1px solid #ddd }
@media screen and (max-width:1400px){
    .privacy h2 { font-size:40px; }
    .privacy h3 { font-size:24px; }
}
@media screen and (max-width:1280px){
    .privacy h2 { font-size:32px; }
    .privacy h3 { font-size:22px; }
    .privacy .privacy-box { margin-top:40px; }
    .privacy .privacy-box p+dl { margin-top:60px; }
    .privacy .privacy-box dl { margin-top:40px; }
    .privacy .privacy-box dl > dd p,
    .privacy .privacy-box dl > dd li { margin-top:20px; }
}
@media screen and (max-width:1024px){
    .privacy * { font-size:16px; }
    .privacy h2 { font-size:28px; }
    .privacy h3 { font-size:20px; }
    .privacy .privacy-box { margin-top:30px; }
    .privacy .privacy-box p+dl { margin-top:50px; }
    .privacy .privacy-box dl { margin-top:30px; }
    .privacy .privacy-box dl > dd p,
    .privacy .privacy-box dl > dd li { margin-top:15px; }
    .privacy .privacy-box dl > dd li ul { padding-left:14px; }
    #privacy .btn_close { top:7px; right:7px; }
}
@media screen and (max-width:640px){
    .privacy * { font-size:15px; }
    .privacy h2 { font-size:24px; }
    .privacy h3 { font-size:18px; }
    .privacy .privacy-box { margin-top:25px; }
    .privacy .privacy-box p+dl { margin-top:35px; }
    .privacy .privacy-box dl { margin-top:25px; }
    .privacy .privacy-box dl > dd li ul { padding-left:10px; }
    .privacy .privacy-box .txt_b  { font-size:13px; margin-top:15px; }
    #privacy .btn_close { top:0; right:0; }
}
@media screen and (max-height:540px){
    .privacy * { font-size:15px; }
    .privacy h2 { font-size:24px; }
    .privacy h3 { font-size:18px; }
    .privacy .privacy-box { margin-top:25px; }
    .privacy .privacy-box p+dl { margin-top:35px; }
    .privacy .privacy-box dl { margin-top:25px; }
    .privacy .privacy-box dl > dd li ul { padding-left:10px; }
    .privacy .privacy-box .txt_b  { font-size:13px; margin-top:15px; }
    #privacy .btn_close { top:0; right:0; }
}