@charset "utf-8";
/*--------------------------------------
Author : Worksdesign (웍스디자인)
License : Worksdesign License (https://worksdesing.co.kr/page/works_license)
--------------------------------------*/
/*---------- Reset Styles ----------*/
html {overflow-y:scroll;height:100%;min-width:320px}
body {margin:0;padding:0;font-size:.8125rem;background:#fff;height:100%}
body, h1, h2, h3, h4, h5, h6, input, button, textarea, select {font-family:'Noto Sans KR', sans-serif}
html, fieldset, img {margin:0;padding:0;border:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;margin:0}
input, button {margin:0;padding:0}
button {cursor:pointer}
input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:.8125rem;-webkit-appearance:none}
textarea {border-radius:0;-webkit-appearance:none;border:1px solid #d5d5d5}
select {margin:0;background:none}
p {margin:0;word-break:keep-all}
hr {display:none}
pre {overflow-x:scroll}
a {color:#000;text-decoration:none}
ul,li,dl,dt,dd {list-style:none;padding:0;margin:0}
a[type=button] {-webkit-appearance:inherit}
*, :after, :before {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden}
.msg_sound_only, .sound_only, .sound-only {display:inline-block;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0 !important;line-height:0 !important;overflow:hidden}
/* 본문 바로가기 */
.to_content a {z-index:100000;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;overflow:hidden}
/*---------- Preloader ----------*/
.loader-wrap {bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:1000}
.no-js .loader-wrap {display:none}
.loader {display:block;position:relative;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;border:3px solid transparent;border-top-color:#006be2;-webkit-animation:loader-spin 0.9s linear infinite;animation:loader-spin 0.9s linear infinite;z-index:11}
.loader:before {content:"";position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:3px solid transparent;border-top-color:#e52700;-webkit-animation:loader-spin-reverse .3s linear infinite;animation:loader-spin-reverse .3s linear infinite}
.loader:after {content:"";position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:3px solid transparent;border-top-color:#ec8b00;-webkit-animation:loader-spin 0.5s linear infinite;animation:loader-spin 0.5s linear infinite}
.loader-wrap .loader-section-left {position:fixed;top:0;left:0;width:51%;height:100%;background:#212121;z-index:10}
.loader-wrap .loader-section-right {position:fixed;top:0;right:0;width:51%;height:100%;background:#212121;z-index:10}
@-webkit-keyframes loader-spin {
0% {-webkit-transform:rotate(0)}
100% {-webkit-transform:rotate(360deg)}
}
@keyframes loader-spin{
0% {-webkit-transform:rotate(0);transform:rotate(0)}
100% {-webkit-transform:rotate(360deg);transform:rotate(360deg)}
}
@-webkit-keyframes loader-spin-reverse{
0% {-webkit-transform:rotate(0)}
100% {-webkit-transform:rotate(-360deg)}
}
@keyframes loader-spin-reverse{
0% {-webkit-transform:rotate(0);transform:rotate(0)}
100% {-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}
}
.loaded .loader-wrap .loader-section-left {transform:translateX(-100%);transition:all .7s .3s cubic-bezier(.645,.045,.355,1)}
.loaded .loader-wrap .loader-section-right {transform:translateX(100%);transition:all .7s .3s cubic-bezier(.645,.045,.355,1)}
.loaded .loader {opacity:0;transition:all .3s ease-out}
.loaded .loader-wrap {visibility:hidden;transform:translateY(-100%);transition:all .3s 1s ease-out}
/*---------- Popup Layer ----------*/
#hd_pop {z-index:1100;position:relative;margin:0 auto;width:100%;height:0}
#hd_pop h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
.hd_pops {position:fixed;border:2px solid #fff;background:#fff}
.hd_pops img {max-width:100%;height:auto}
.hd_pops_footer {padding:10px;background:#212121;color:#fff;text-align:right}
.hd_pops_footer button {margin-left:5px;padding:5px 10px;border:0;background:#424242;color:#fff;font-size:.75rem}
@media (max-width:600px) {
.hd_pops {position:absolute;top:20px !important;left:50% !important;transform:translateX(-50%);width:90%;height:auto}
.hd_pops_con {position:relative;overflow:hidden;width:100% !important;height:auto !important}
}
/* 버튼 스타일 */
.btn-more a {position:relative;display:inline-block;overflow:hidden;padding:8px 25px;letter-spacing:2px;color:#1b1b1b;border-width:1px;border-style:solid;border-color:#1b1b1b;-webkit-transition: all .5s ease;-moz-transition: all .5s ease;transition: all .5s ease}
.btn-more a:hover {color:#fff}
.btn-more a:before {content:"";position:absolute;top:0;left:0;bottom:0;right:-50px;display:block;border-right:50px solid transparent;border-bottom:80px solid #1b1b1b;z-index:-1;transform: translateX(-100%);-webkit-transition: all .5s ease;-moz-transition: all .5s ease;transition: all .5s ease}
.btn-more a:hover:before {transform: translateX(0)}
@media (max-width:767px){
.btn-more a {padding:5px 20px;font-size:11px}
}
/*---------- Wrapper ----------*/
.wrapper {position:relative;overflow:hidden}
/*---------- Header & Navbar ----------*/
#hd {position:relative;border-bottom:1px solid #d9dde3;background:#fff}
#hd:after {display:block;visibility:hidden;clear:both;content:""}
#hd-h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
.to-content a {z-index:1000;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;overflow:hidden}
/* header wrap */
.header-wrap {background-color:#ffffff;transition:all .5s ease 0s;box-shadow:0 0 1px rgba(0,0,0,.35)}}
.page-header-wrap {background-color:#fff}
.header-wrap.nav-sticky {background-color:#ffffff;position:fixed;right:0;left:0;top:0;z-index:99}
/* top header */
.top-header {border-bottom:1px solid rgba(255,255,255,.1)}
.nav-sticky .top-header {display:block !important}
.top-header-nav li {display:inline-block;padding:0;color:#fff;font-size:12px;margin-right:15px;vertical-align:middle}
.top-header-nav li > a {display:block;color:#fff;height:45px;line-height:45px;padding:0}
.top-header-nav li > a i {margin-right:5px;vertical-align:middle}
.top-header-nav li.dropdown > a {cursor:pointer}
.top-header-nav li.dropdown .dropdown-menu {background-color:#424242;padding:5px 0;border:0 none;box-shadow:none;border-radius:0;margin:0}
.top-header-nav li.dropdown .dropdown-menu a {display:block;padding:5px 10px;color:#fff}
.top-header-nav li.dropdown .dropdown-menu a:hover {background-color:rgba(0,0,0,.3);color:#fff}
.top-header-nav li.dropdown:hover > .dropdown-menu {display:block}
.top-header .social-icons {font-size:0}
.top-header .social-icons li {display:inline-block;padding:2px}
.top-header .social-icons li a {font-size:16px;height:30px;width:30px;line-height:28px;display:inline-block;text-align:center;vertical-align:middle;color:#fff;border:1px solid rgba(255,255,255,.35)}
.top-header .social-icons li a:hover {background-color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.9);color:#3949AB}
@media (max-width:767px) {
.top-header-nav li.book-mark {display:none}
}
/* navbar */
.navbar {padding:0}
.navbar-brand img {width:auto;max-height:40px}
.navbar .mobile-search-btn {position:absolute;top:10px;right:50px}
.navbar-nav li {position:relative;list-style:none}
.navbar-nav a,.navbar-toggler {color:#111}
.navbar-nav .navbar-toggler .nav-link {color:#fff}
.nav-sticky .navbar-nav>li>a,.nav-sticky .navbar-toggler {color:#111}
.navbar-nav>li>.nav-link {font-size:15px;font-weight:800;padding:25px 18px !important}
.navbar-nav>li>.nav-link.active {color:#001bab}
.navbar-nav > li.navbar-nav-home > a {background:#424242;color:#fff;border-top:1px solid #424242;display:none;}
.navbar-nav>.nav-empty {font-size:12px;padding:25px 10px !important;color:#fff}
.navbar-nav>.nav-empty>a {color:#53a5fa;padding:0}
.navbar-nav>li.dropdown-mega-menu>.nav-link {font-size:16px;padding:23px 18px !important}
.navbar-nav>li>.pc-search-btn {font-size:16px;padding:23px 10px !important}
.navbar-nav .dropdown-toggle::after {border:0 none;font-family:'Font Awesome\ 5 Free';content:"\f107";font-weight:900;height:auto;line-height:normal;margin-left:5px;vertical-align:middle;width:auto;}
.navbar-nav .dropdown-toggle:only-child::after {display:none}
.navbar-nav .dropdown-mega-menu .dropdown-toggle::after {display:none;}
.navbar-nav .dropdown-menu {background-color:#424242;border:0 none;border-radius:0;margin:0;min-width:12rem;padding:8px 0;top:120%;display:inherit;opacity:0;visibility:hidden;z-index:-1;transition: all 0.2s ease-in-out}
.navbar-nav .dropdown-menu .dropdown-toggler::after {position:absolute;right:10px;top:10px}
.navbar-nav .dropdown:hover>.dropdown-menu {z-index:10;top:100% !important;opacity:1;visibility:visible}
.navbar-nav .dropdown-item {padding:8px 25px 8px 15px !important;color:#d5d5d5;font-size:14px}
.navbar-nav .dropdown-item.active,.navbar-nav .dropdown-item:active,.navbar-nav .dropdown-item:focus,.dropdown-item:hover {background-color:transparent}
.navbar-nav .dropdown-menu li a.active,.navbar-nav .dropdown-menu li a:hover,.navbar-nav .dropdown-menu>ul>.mega-menu-col ul>li:hover>a,.navbar-nav .dropdown-menu>ul>li:hover>a {background-color:rgba(0,0,0,.3);color:#fff}
.navbar-nav .dropdown-mega-menu {position:static}
.navbar-nav .mega-menu {display:table;padding:15px 0;width:100%;-ms-flex-wrap:wrap;flex-wrap:wrap}
.navbar-nav .dropdown-mega-menu .dropdown-menu {right:0}
.navbar-nav .mega-menu-col {border-right:1px solid #525252}
.navbar-nav .mega-menu-col:nth-child(4) {border-right:0}
.navbar-nav .mega-menu-col:nth-child(8) {;border-right:0}
.navbar-nav .mega-menu-col:nth-child(12) {border-right:0}
.navbar-nav .mega-menu-col:nth-child(5) h5,.navbar-nav .mega-menu-col:nth-child(6) h5,.navbar-nav .mega-menu-col:nth-child(7) h5,.navbar-nav .mega-menu-col:nth-child(8) h5,.navbar-nav .mega-menu-col:nth-child(9) h5,.navbar-nav .mega-menu-col:nth-child(10) h5,.navbar-nav .mega-menu-col:nth-child(11) h5,.navbar-nav .mega-menu-col:nth-child(12) h5 {border-top:1px solid #525252;padding-top:20px;margin-top:15px}
.navbar-nav .mega-menu-col h5 a {display:block;padding:5px 15px !important;font-size:15px;font-weight:700}
.navbar-nav .mega-menu-col h5 a {background-color:transparent;color:#fff}
.navbar-nav .mega-menu-col h5 a:hover {background-color:transparent;color:#8C9EFF}
.navbar-nav .mega-menu-col h5 a.active {background-color:transparent;color:#8C9EFF}
@media (min-width:992px) {
.navbar-nav {max-height:70px}
}
@media (max-width:991px) {
.navbar {height:50px}
.navbar-brand img {width:auto;height:34px}
}
/* sidebar nav (mobile) */
@media (max-width:991px) {
.sidebar.left {z-index:1004;display:none;position:fixed;top:0;left:0;bottom:0;width:280px;background:#fff}
.sidebar-left-mask {display:none}
.sidebar-left-mask.active {display:block;position:fixed;top:0;bottom:0;left:0;right:0;z-index:1003;background:#000;opacity:0.5}
.sidebar .sidebar-left-content {padding-bottom:20px}
.sidebar .sidebar-left-content.active {position:relative;height:100%;width:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}
/* nav */
.sidebar .navbar-nav {position:relative;margin:0;float:none;border-bottom:1px solid #e5e5e5}
.sidebar .navbar-nav > .nav-li-divider {display:none}
.sidebar .navbar-nav > .nav-li-space {height:40px;border-bottom:none;border-top:1px solid #e5e5e5;background:#fff}
.sidebar .navbar-nav > li {float:none}
.sidebar .navbar-nav > li > a {line-height:42px;padding:0 15px !important;font-size:14px;color:#000;font-weight:bold}
.sidebar .navbar-nav > li > a > .nav-cate-icon {width:20px;text-align:center}
.sidebar .navbar-nav > li a {border-bottom:none;border-top:1px solid #e5e5e5}
.sidebar .navbar-nav > li a:hover {border-top:1px solid #e5e5e5}
.sidebar .navbar-nav > li:first-child > a {border-top:1px solid transparent}
.sidebar .navbar-nav > li > .nav-link.active {color:#cc2300}
.sidebar .navbar-nav > li.navbar-nav-home > a {background:#424242;color:#fff;border-top:1px solid #424242;display:block;}
.sidebar .navbar-nav > li > .cate-dropdown-open {position:absolute;top:1px;right:0;width:42px;height:42px;line-height:42px;margin:0;padding:0;text-align:center;border:0;border-left:1px solid #f0f0f0;z-index:1}
.sidebar .navbar-nav > li > .cate-dropdown-open:before {font-family:'Font Awesome\ 5 Free';content:"\f067";font-weight:900;color:#353535}
.sidebar .navbar-nav > li > .cate-dropdown-open:hover {border-top:0}
.sidebar .navbar-nav > li.show > .cate-dropdown-open:before {font-family:'Font Awesome\ 5 Free';content:"\f068";font-weight:900;color:#cc2300}
.sidebar .navbar-nav .dropdown > a:after {display:none}
.sidebar .navbar-nav .dropdown-menu {position:relative;border:0;float:none;width:auto;margin:0;padding:0;box-shadow:none;background-color:transparent;display:none}
.sidebar .navbar-nav .dropdown-menu:after {content:"";position:absolute;top:10px;bottom:10px;left:20px;width:1px;background:#e5e5e5}
.sidebar .navbar-nav .dropdown-menu > li > a {color:#555555;line-height:26px;border-top:1px solid #e5e5e5}
.sidebar .navbar-nav .dropdown-menu > li:first-child > a {border-top:1px solid #e5e5e5}
.sidebar .navbar-nav .dropdown-menu.show {display:block;opacity:1;visibility:visible}
.sidebar .navbar-nav .dropdown-submenu > a {position:relative;color:#555555;font-size:13px;background:#fafafa;line-height:26px;padding:6px 15px 6px 35px !important;border-top:0}
.sidebar .navbar-nav .dropdown-submenu > a:after {content:"";position:absolute;top:50%;left:15px;width:11px;height:11px;transform:translateY(-50%);border:2px solid #a5a5a5;border-radius:50%;background:#fff;z-index:1}
.sidebar .navbar-nav .dropdown-submenu:first-child > a {border-top:1px solid #e5e5e5}
.sidebar .navbar-nav .dropdown-submenu > a:hover {background:#e5e5e5;color:#000;border-top:0}
.sidebar .navbar-nav .dropdown-submenu > a.active {background:#e5e5e5;color:#000;font-weight:700}
.sidebar .navbar-nav .dropdown-submenu:first-child > a:hover {border-top:1px solid #e5e5e5}
}
/*---------- submenu - 서브메뉴 ----------*/
.submenu {position:relative;z-index:99;margin-bottom:40px;border:1px solid #E5E5E5;background:#fff}
.submenu .sub-home-link {float:left;}
.submenu .sub-home-link a {display:block;width:60px;height:60px;line-height:60px;text-align:center;font-size:20px;background:#1b1b1b;color:#fff}
.submenu .sub-home-link a:hover {background:#57B5E7}
.submenu .submenu-title {position:relative;float:left;min-width:200px;padding:0 20px;cursor:pointer}
.submenu .submenu-title.submenu-title-second {margin-left:-1px}
.submenu .submenu-title:before {content:"";display:block;position:absolute;top:0;right:0;width:1px;height:100%;background:#e5e5e5}
.submenu .submenu-title:after {content:"";display:block;position:absolute;top:50%;right:20px;transform:translateY(-50%) rotate(45deg);width:10px;height:10px;border-bottom:1px solid #999;border-right:1px solid #999}
.submenu .submenu-title h2 {margin:0;height:60px;line-height:60px;font-size:15px}
.submenu .list-submenu {display:none;position:absolute;top:100%;left:0;z-index:1;width:100%;border:1px solid #e5e5e5;background:#fff}
.submenu .list-submenu li {margin:0}
.submenu .list-submenu li a {display:block;padding:15px 20px}
.submenu .list-submenu li a:hover {color:#57B5E7}
@media (max-width:767px){
.submenu {padding-left:45px;border-width:1px 1px 0 0}
.submenu .sub-home-link {position:absolute;top:0;left:0;float:none}
.submenu .sub-home-link a {width:45px;height:45px;line-height:45px}
.submenu .submenu-title {float:none;border-bottom:1px solid #e5e5e5}
.submenu .submenu-title:before {right:inherit;left:0}
.submenu .submenu-title.submenu-title-second {margin-left:0}
.submenu .submenu-title h2 {height:45px;line-height:45px}
.submenu .list-submenu li a {padding:10px 20px}
}
/*---------- Sub Nav ----------*/
.sub-nav-wrap {position:relative;z-index:3;padding:20px 0;margin-top:40px; margin-bottom:20px}
.sub-nav-home {display:none}
.sub-nav-list {position:relative}
.sub-nav-title {position:relative;margin:0;padding:0 30px 0 15px;font-size:13px;line-height:30px;border:1px solid #c5c5c5}
.sub-nav-title i {position:absolute;top:8px;right:10px;}
.sub-nav-list ul {display:none;position:absolute;top:31px;left:0;z-index:10;width:100%;padding:10px 0;border:1px solid #c5c5c5;background:#fff}
.sub-nav-list li a {display:block;padding:0 15px;font-size:13px;line-height:30px;}
.sub-nav-depth1 {margin-bottom:10px}
.sub-nav-wrap .sub-breadcrumb-wrap {display:none}
@media (min-width:992px){
.sub-nav-wrap {position:relative;width:100%;height:50px;background:#fff;padding:0;margin-bottom:40px}
.sub-nav-wrap .container {position:relative}
.sub-nav-wrap-in {position:relative;margin:0;line-height:30px;border:1px solid #c5c5c5}
.sub-nav-wrap-in:after {content:"";display:block;clear:both}
.sub-nav-home {display:block;float:left;}
.sub-nav-home a {display:block;height:50px;padding:0 15px;line-height:50px;font-size:20px;color:#353535;border-left:0px solid #c5c5c5;border-right:1px solid #c5c5c5}
.sub-nav-home a:hover {color:#cc2300}
.sub-nav-list {float:left;margin:0 0 0 -1px}
.sub-nav-title {min-width:200px;padding:0 45px 0 25px;line-height:50px;font-size:15px;border:0 none;color:#353535;border-right:1px solid #c5c5c5}
.sub-nav-title.cursor-pointer {cursor:pointer}
.sub-nav-title i {top:18px;right:20px}
.sub-nav-title:hover {color:#cc2300;font-weight:700}
.sub-nav-list ul {top:50px;padding:0}
.sub-nav-list li {float:none;}
.sub-nav-list li a {padding:10px 15px;border-top:1px solid #c5c5c5;font-size:14px}
.sub-nav-list li:first-child a {border-top:0}
.sub-nav-list li a:hover {color:#303F9F;background:#fafafa}
.sub-nav-list li.active a {color:#303F9F;font-weight:700}
.sub-nav-wrap .sub-breadcrumb-wrap {display:block;position:absolute;top:10px;right:15px}
.sub-nav-wrap .sub-breadcrumb {color:#353535;font-weight:400;}
.sub-nav-wrap .sub-breadcrumb a {color:#353535;margin:0 5px;font-weight:400;}
}
@media (max-width:992px) {
.sub-nav-wrap {padding-top:10px;background:#fff}
}
/*---------- Board Title - 서브페이지 보드 타이틀 ----------*/
.board-title {position:relative;padding-top:70px;}
.board-title-image {position:relative;width:100%;height:300px;background-repeat:no-repeat;background-size:cover;background-position:center top}
.board-title-image:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.35)}
.board-title-image .mask-block {position:absolute;;width:100%;height:50%;background:#57B5E7}
.board-title-image .mask-block.mask-1 {right:0;top:0}
.board-title-image .mask-block.mask-2 {left:0;bottom:0}
.board-title-image .mask-block.active {width:0%;-webkit-transition: width .5s linear;-moz-transition: width .5s linear;-o-transition: width .5s linear;-ms-transition: width .5s linear;transition: width .5s linear}
.board-title-caption {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.board-title-caption h2 {position:relative;margin:80px 0 20px;font-size:36px;color:#fff;letter-spacing:5px}
.board-title-caption h2:after {content:"";position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:40px;height:1px;background:#fff}
.board-title-caption .breadcrumb {margin:0;background:none;color:#ddd}
.board-title-caption .breadcrumb a {font-size:15px;color:#eee;padding:0 10px 0 10px;}
.board-title-caption .breadcrumb a:hover {color:#fff;}
@media (max-width:991px) {
.board-title {padding-left:0; padding-top:50px;}
.board-title-caption {top:0;left:0;transform:translateY(0%);width:100%;height:100%;padding:110px 10px 10px;background:rgba(0,0,0,.2)}
.board-title-caption h2 {margin-bottom:10px;font-size:20px}
.board-title-caption .breadcrumb a {font-size:13px;padding:0 10px 0 10px;}
}
/*---------- Body ----------*/
.basic-body {position:relative;padding:0 0 50px}
.page-body {margin-top:30px;padding:0 0 40px}
@media (max-width:991px) {
.page-body {margin-top:106px}
}
/*---------- Page Title ----------*/
.subpage-title {position:relative;font-size:1.5rem;border-bottom:1px solid #e5e5e5;font-weight:bold;padding:10px 0;line-height:1.7;color:#353535;background:#fff;margin-bottom:30px}
.subpage-title::after {content:"";position:absolute;bottom:-2px;left:0;width:50px;height:3px;background-color:#3F51B5}
.subpage-title .back-btn {display:block;position:absolute;top:16px;right:0;text-align:center;padding:6px 15px;margin:0;font-weight:400;line-height:1;border:1px solid #b5b5b5;font-size:.875rem}
.subpage-title .back-btn:hover {color:#303F9F}
@media (max-width:767px) {
.subpage-title .back-btn {display:none}
}
/* --- 페이지 로더 --- */
.page-loader {position:fixed;top:0;left:0;z-index:9999;width:100%;height:100%;background:#57B5E7}
.page-loader .logo-loader {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
.page-loader .logo-loader:before, .page-loader .logo-loader:after {content:"";position:absolute;top:60px;left:0;height:1px}
.page-loader .logo-loader:before {width:100%;background:rgba(255,255,255,.4)}
.page-loader .logo-loader:after {width:0;background:#fff;-webkit-transition:all 1.2s ease;-moz-transition:all 1.2s ease;-o-transition:all 1.2s ease;-ms-transition:all 1.2s ease;transition:all 1.2s ease}
.page-loader .logo-loader.active:after {width:100%}
.page-loader .logo-loader img {max-height:35px;width:auto}
.page-loader .logo-loader h5 {margin:40px 0 0;text-align:center;letter-spacing:5px;font-size:12px;color:#fff}
/*---------- Main Contents ----------*/
.main-section {position:relative;padding-top:50px;}
.full-screen {height:720px}
.background-bg {background-position:center center;background-size:cover}
.fixed-bg {background-attachment:fixed !important}
/* main heading */
.heading-e1 h1, .heading-e1 h2 {font-weight:700;margin:0;font-size:1.675rem}
.heading-e1 {margin-bottom:30px;padding-bottom:15px;position:relative}
.heading-e1::before {background-color:#E91E63;bottom:0;content:"";height:3px;left:0;position:absolute;width:40px}
.heading-e1.text-center::before {margin:0 auto;right:0}
.heading-e1.text-right::before {left:auto;right:0}
.heading-wrap {margin-bottom:40px}
.heading-wrap h5 {margin-bottom:30px;text-align:center;word-break:keep-all}
.heading-wrap h5 span {display:inline-block;position:relative;padding:0 30px;line-height:1.5;font-size:20px;font-weight:700;color:#353535}
.heading-wrap h5 i {position:absolute;top:0;font-size:1.25rem;color:#d5d5d5}
.heading-wrap h5 i.fa-quote-left {left:0}
.heading-wrap h5 i.fa-quote-right {right:0}
.heading-wrap p {font-size:1.0625rem;color:#959595;margin-bottom:0}
@media (max-width:992px) {
.full-screen {height:560px}
.heading-e1 h1 {font-size:1.475rem}
.heading-e1 h2 {font-size:1.875rem}
.heading-wrap h5 {font-size:1rem}
.heading-wrap h5 i {font-size:1rem}
.heading-wrap p {font-size:.9375rem}
}
/* --- 메인 슬라이더 --- */
.main-slider {position:relative;height:720px;padding-top:0px;}
.main-slider-inner {position:relative;overflow:hidden;display:none}
.main-slider .main-slider-list {margin-bottom:0}
.main-slider .main-slider-item {position:relative;outline:none;height:720px;overflow:hidden}
/* 이미지 */
.main-slider .main-slider-image {position:relative;width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:center}
.main-slider .slick-current .main-slider-item.item-animation .main-slider-image {-webkit-transform:scale(1.1);transform:scale(1.1);;-webkit-transition: transform 10s linear;-moz-transition: transform 10s linear;-o-transition: transform 10s linear;-ms-transition: transform 10s linear;transition: transform 10s linear}
.main-slider .main-slider-image:before {content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4)}
.main-slider .main-slider-image .mask-block {opacity:0;position:absolute;width:33.333%;height:100%;background:#57B5E7}
.main-slider .main-slider-image .mask-block.mask-1 {top:0;left:0}
.main-slider .main-slider-image .mask-block.mask-2 {bottom:0;left:33.33%}
.main-slider .main-slider-image .mask-block.mask-3 {top:0;left:66.666%}
.main-slider .slick-current .main-slider-item.item-animation .main-slider-image .mask-block {opacity:1;height:0;-webkit-transition-delay:1s;transition-delay:1s;-webkit-transition: height 1s linear;-moz-transition: height 1s linear;-o-transition: height 1s linear;-ms-transition: height 1s linear;transition: height 1s linear}
/* 내용 */
.main-slider .main-slider-caption {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:1100px;text-align:center}
.main-slider .main-slider-caption h4 {position:relative;margin:0 0 30px;font-size:60px;letter-spacing:2px;color:#fff;font-family: 'Do Hyeon', sans-serif;}
.main-slider .main-slider-caption h4:after {content:"";display:block;position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);width:50px;height:1px;background:#fff}
.main-slider .main-slider-caption h5 {margin:0 0 30px;line-height:30px;font-size:20px;word-break:keep-all;color:#fff;font-family: 'Noto Serif KR', serif;}
/* 버튼 */
.main-slider .main-slider-caption .btn-more a {color:#fff;border-color:#fff}
.main-slider .main-slider-caption .btn-more a:hover {color:#333}
.main-slider .main-slider-caption .btn-more a:before {border-bottom:80px solid #fff}
/* 컨트롤 점 - 숫자 */
.main-slider .slick-dots {bottom:50px}
.main-slider .slick-dots li {display:inline-block;margin:0 1px 0 0;width:40px;height:40px;line-height:40px;text-align:center;font-size:15px;border-bottom:1px solid #ccc;color:#ccc;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease}
.main-slider .slick-dots li:hover {background:rgba(200,200,200,.2)}
.main-slider .slick-dots li.slick-active {color:#fff;border-color:#fff}
/* 컨트롤 좌우 */
.main-slider .slick-next, .main-slider .slick-prev {width:60px;height:120px;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;transition: all .3s ease}
.main-slider .slick-next {right:40px;z-index:1}
.main-slider .slick-prev {left:40px;z-index:1}
.main-slider .slick-next:before, .main-slider .slick-prev:before {content:"";display:block;position:absolute;top:50%;width:80px;height:80px;margin-top:-40px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
.main-slider .slick-next:before {right:17px;border-right:1px solid #ccc;border-top:1px solid #ccc}
.main-slider .slick-prev:before {left:17px;border-left:1px solid #ccc;border-bottom:1px solid #ccc}
.main-slider .slick-next:after, .main-slider .slick-prev:after {content:"";display:block;position:absolute;top:50%;width:0;height:1px;background:#ccc;-webkit-transition:all 0.4s ease-in-out;-moz-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out}
.main-slider .slick-next:after {right:1px}
.main-slider .slick-prev:after {left:1px}
.main-slider .slick-next:hover:after, .main-slider .slick-prev:hover:after {width:100px}
/* 반응형 중간기기 992px 사이즈 이하*/
@media all and (max-width:992px){
.main-slider {position:relative;height:560px;}
.main-slider, .main-slider .main-slider-item {height:560px}
.main-slider .main-slider-caption {max-width:700px}
.main-slider .main-slider-caption h4 {font-size:40px}
.main-slider .main-slider-caption h5 {font-size:18px}
.main-slider .slick-next, .main-slider .slick-prev {width:30px;height:60px}
.main-slider .slick-next {right:15px}
.main-slider .slick-prev {left:15px}
.main-slider .slick-next:before, .main-slider .slick-prev:before {width:40px;height:40px;margin-top:-20px}
.main-slider .slick-next:before {right:10px}
.main-slider .slick-prev:before {left:10px}
.main-slider .slick-next:after {right:3px}
.main-slider .slick-prev:after {left:3px}
.main-slider .slick-next:hover:after, .main-slider .slick-prev:hover:after {width:40px}
}
/* introduce section (소개1 영역) */
.main-introduce {position:relative}
.introduce-slider-wrap {position:relative;overflow:hidden;height:450px;float:left;width:50%}
.introduce-slider-item {position:relative;overflow:hidden;width:100%;height:450px;background-position:center center;background-size:cover}
.introduce-slider .slick-next, .introduce-slider .slick-prev {width:50px;height:50px;background:#2e3340;text-align:center;z-index:1;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}
.introduce-slider .slick-next {right:0}
.introduce-slider .slick-prev {left:0}
.introduce-slider .slick-next::before, .introduce-slider .slick-prev::before {font-family:'Font Awesome\ 5 Free';font-weight:900;color:#fff;font-size:16px}
.introduce-slider .slick-next::before {content:"\f054"}
.introduce-slider .slick-prev::before {content:"\f053"}
.introduce-cont {position:relative;width:50%;height:450px;background:#141826;float:right;color:#fff}
.introduce-cont-in {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:80%}
.introduce-cont h3 {font-size:1.75rem;color:#FF3D00;margin:0 0 20px}
.introduce-cont h5 {font-size:1.25rem;color:#fff;margin:0 0 30px}
.introduce-cont p {font-size:1rem;color:#979aa7}
@media (max-width:991px) {
.main-introduce {position:relative}
.introduce-slider-wrap {height:300px}
.introduce-slider-item {height:300px}
.introduce-slider-wrap {width:100%}
.introduce-cont {width:100%;height:auto}
.introduce-cont-in {position:relative;top:inherit;left:inherit;transform:inherit;width:100%;padding:50px 30px}
}
/* about section (소개2 영역) */
.main-about {position:relative;background-color:#e5e5e5; margin-top:50px; padding-bottom:50px; }
.about-cont h5 {font-size:1.0625rem;color:#384aab;margin:0 0 10px}
.about-cont h2 {font-size:1.875rem;font-weight:700;word-break:keep-all;line-height:1.4;margin:0 0 30px}
.about-cont p {font-size:1rem;color:#555}
.about-img-in {position:relative}
.about-img-in::after {content:"";display:block;clear:both}
.about-img-box {border:1px solid #b5b5b5;padding:7px;background-color:#fff}
.about-img-l {float:left;width:48%;margin-top:-20px}
.about-img-r {float:right;width:48%;margin-bottom:-20px}
@media (max-width:767px) {
.main-about {position:relative;background-color:#e5e5e5; margin-top:70px; }
}
/* side event section (컨설팅 업무) */
.main-sideevent {border-bottom:1px solid #e5e5e5; padding-bottom:50px; }
.sideevent-slider-wrap {position:relative;overflow:hidden;padding:0;margin-left:-10px;margin-right:-10px}
.sideevent-slider .sideevent-slider-item {position:relative;padding:0 10px;outline:none}
.sideevent-slider .sideevent-slider-item-in {position:relative;overflow:hidden}
.sideevent-slider .sideevent-slider-cont {border:1px solid #c5c5c5;border-top:0;padding:20px}
.sideevent-slider .sideevent-slider-cont h4 {font-size:1.25rem;font-weight:700;margin:0 0 20px}
.sideevent-slider .sideevent-slider-cont p {margin:0 0 20px;font-size:.9375rem;color:#757575}
.sideevent-slider .sideevent-slider-item:hover .sideevent-slider-cont {display:block}
.sideevent-slider .slick-next,.sideevent-slider .slick-prev {width:50px;height:50px;background:#2e3340;text-align:center;z-index:1;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}
.sideevent-slider .slick-next {right:10px}
.sideevent-slider .slick-prev {left:10px}
.sideevent-slider .slick-next::before,.sideevent-slider .slick-prev::before {font-family:'Font Awesome\ 5 Free';font-weight:900;color:#fff;font-size:16px}
.sideevent-slider .slick-next::before {content:"\f054"}
.sideevent-slider .slick-prev::before {content:"\f053"}
.main-sideevent .sub-title {position:relative}
.main-sideevent .sub-title span {display:block;font-size:70px;color:#000;font-weight:700;line-height:1;opacity:0.1;font-family:'Roboto', sans-serif}
.main-sideevent .sub-title h4 {font-weight:700;margin:0 0 30px}
.main-sideevent .sub-title p {font-size:1.0625rem;color:#959595;margin-bottom:0;word-break}
@media (max-width:991px) {
.sideevent-slider .sideevent-slider-item-in::before, .sideevent-slider .sideevent-slider-cont {opacity:1;visibility:visible}
.sideevent-slider .sideevent-slider-cont {text-align:center}
.sideevent-slider .sideevent-slider-cont h4 {font-size:1.25rem}
.main-sideevent .sub-title span {font-size:50px}
.main-sideevent .sub-title h4 {font-size:1.25rem}
.main-sideevent .sub-title p {font-size:.9375rem}
}
/* latest section (최신글 영역) */
.main-latest {border-bottom:1px solid #e5e5e5;padding-bottom:50px;}
/* sponsor section (클라이언트 업체 영역) */
.main-sponsor {padding:40px 0 40px}
.sponsor-slider-wrap {position:relative}
.sponsor-slider {position:relative;margin-left:-10px;margin-right:-10px}
.sponsor-slider .slick-list {position:relative;z-index:1}
.sponsor-slider .sponsor-slider-item {position:relative;padding:0 10px}
.sponsor-slider .sponsor-slider-item-in {position:relative;overflow:hidden;background:#fff;border:1px solid #c5c5c5;padding:5px 30px;text-align:center;-webkit-transition:all 0.1s ease-in-out;-moz-transition:all 0.1s ease-in-out;-o-transition:all 0.1s ease-in-out;transition:all 0.1s ease-in-out}
.sponsor-slider .sponsor-slider-item-in a {display:block;position:absolute;top:0;bottom:0;left:0;right:0}
.sponsor-slider-wrap .sponsor-slider-line {position:relative;height:1px;background:#eaeaea;margin-top:36px}
.sponsor-slider .slick-next, .sponsor-slider .slick-prev {width:34px;height:34px;border:1px solid #c5c5c5;background:#fff;top:inherit;bottom:-70px;z-index:1;-webkit-transition:all 0.1s ease-in-out;-moz-transition:all 0.1s ease-in-out;-o-transition:all 0.1s ease-in-out;transition:all 0.1s ease-in-out}
.sponsor-slider .slick-next:hover, .sponsor-slider .slick-prev:hover {border:1px solid #000}
.sponsor-slider .slick-next {left:50%;margin-left:15px}
.sponsor-slider .slick-prev {left:50%;margin-left:-50px}
.sponsor-slider .slick-next:before, .sponsor-slider .slick-prev:before {font-family:'Font Awesome\ 5 Free';font-weight:900;color:#000;font-size:12px;line-height:34px}
.sponsor-slider .slick-next:before {content:"\f054"}
.sponsor-slider .slick-prev:before {content:"\f053"}
/*---------- Footer ----------*/
.footer {position:relative;background:#212121;}
.footer-top {margin-bottom:30px;padding:30px 0;border-bottom:1px solid #353535}
.footer-top:after {content:"";display:block;clear:both}
.footer-nav {width:50%;float:left}
.footer-nav a {color:#959595;font-size:15px;margin-right:20px}
.footer-aside {position:relative;width:50%;float:right}
.footer-cont {color:#757575;font-size:13px}
.footer-cont span {display:inline-block;position:relative;padding-right:15px;margin-right:10px}
.footer-cont span:after {content:"";position:absolute;top:4px;right:0;width:2px;height:12px;background-color:#414141}
.footer-cont .last-span {padding-right:0;margin-right:0}
.footer-cont .last-span:after {display:none}
.footer-cont span a {color:#959595}
.footer-cont span a:hover {text-decoration:underline}
.footer-copyright {color:#757575;font-size:13px;text-align:center;margin-top:30px;padding:30px 0}
.family-site {position:absolute;top:-11px;right:0;margin-bottom:0;width:250px}
.family-site dt {position:relative}
.family-site dt a {font-size:13px;line-height:15px;padding:10px;font-weight:200;color:#eee;display:block;background:rgba(255,255,255,.3)}
.family-site dt a:hover {color:#fff}
.family-site dt i {color:#ddd;float:right;display:inline-block;padding-top:5px}
.family-site dd {position:absolute;bottom:32px;margin-bottom:0;width:100%;z-index:2;display:none}
.family-site dd ul {margin-bottom:0;background-color:#fff;border:1px solid #c5c5c5;border-bottom:0}
.family-site ul li {border-top:1px solid #c5c5c5}
.family-site ul li:first-child {border-top:0}
.family-site ul li a {color:#707070;font-size:13px;display:block;padding:7px}
.family-site ul li a:hover {color:#cc2300}
@media (max-width:991px) {
.footer-nav {width:100%;text-align:center}
.footer-aside {width:100%;height:45px;margin-top:30px}
.family-site {top:0;left:50%;right:inherit;transform:translateX(-50%)}
}
@media (max-width:767px) {
.footer-copyright span {display:none}
}
/*---------- Search Full ----------*/
.search-full {position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(0, 0, 0, 0.9);display:none;z-index:9999}
.search-full .search-field {position:absolute;top:50%;left:0;right:0;transformY:translate(-50%)}
.search-field h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
.search-field form {position:relative;width:30%;margin:0 auto}
.search-field #search_input {font-size:1.25rem;padding:10px 30px 10px 10px;-webkit-appearance:none;display:block;background:transparent;color:#fff;width:100%;border:none;border-bottom:1px solid #fff;margin:0 auto}
.search-field .search-btn {position:absolute;top:0;right:0;width:45px;height:45px;border:0;cursor:pointer;color:#0078ff;background:transparent;font-size:1.25rem}
.search-full .search-close-btn {position:absolute;top:20px;right:20px;width:50px;height:50px;cursor:pointer;z-index:1}
.search-close-btn:after {content:"";height:50px;border-left:2px solid #fff;position:absolute;transform:rotate(45deg);left:24px}
.search-close-btn:before {content:"";height:50px;border-left:2px solid #fff;position:absolute;transform:rotate(-45deg);left:24px}
@media (max-width:1199px) {
.search-field form {width:50%}
}
@media (max-width:767px) {
.search-field form {width:80%}
}
/* 타이틀 박스 */
.body_title_box {}
.body_title_box h3 {font-size:19px; line-height:140%; font-weight:550; letter-spacing:-1px; padding:10px 0; margin-bottom:10px; border-bottom:1px solid #000;}
.body_title_box i {margin-right:5px;}
.body_title_box h4 {font-size:16px; font-weight:600; font-family:"Nanum Gothic"; color:#000;}
.body_title_box h4 i {color:#ff5a00;}
h4 {line-height:140% !important;}
/* 기타 */
.btn_box {clear:both; width:100%; background:#f4f4f4; padding:15px 0; margin:20px 0; text-align:center;}
.display_ibk {display:inline-block;}
.display_none {display:none !important;}
.txt_center {text-align:center !important;}
.strong_price {font-size:23px; font-family:"Nanum Gothic"; letter-spacing:-1px; color:red;}
.nav-tabs li.active a {font-weight:bold;color:#000;}
/* 공용 */
.body_content {font-family:"Nanum Gothic" !important; color:#616161; line-height:150%; padding-bottom:20px;}
.top_desc {padding:0px 10px 0px 20px; line-height:140%; border-left:5px solid #db2d04; font-size:15px; font-family:"Nanum Gothic" !important; white-space:pre-line; color:#000;}
.top_desc strong {color:#db2d04; font-size:16px;}
.top_desc_img {display:inline-block; width:100%; font-size:16px; line-height:170%;}
.top_desc_img div {white-space:pre-line;}
.top_desc_img strong {color:#000;}
.top_desc_img h3 {font-size:30px; color:#db2d04; padding:13px 0; line-height:120%;}
.top_desc_vod {display:inline-block; width:100%; font-size:16px; line-height:170%; border-top:3px solid #000; padding-top:30px;}
.top_desc_vod div {white-space:pre-line;}
.top_desc_vod strong {color:#000;}
.top_desc_vod h3 {font-size:30px; color:#000; padding:13px 0;}
.check_list {}
.check_list ul {list-style:none; padding-left:10px;}
.check_list ul li {padding-left:20px; margin-bottom:5px; font-size:14px; font-family:"Nanum Gothic";}
.check_list ul li i {margin-left:-20px;}
.con_box_line {width:100%; padding:15px; border:1px solid #eaeaea; }
.txt_justify {text-align: justify !important; text-justify: inter-word;}
.line_height_200 {line_height:200% !important;}
.line_height_150 {line_height:150% !important;}
.line_height_130 {line_height:130% !important;}
.line_height_100 {line_height:100% !important;}
.border_left_redline {border-left:5px solid #db2d04; }
.box_redline {padding:0px 10px 0px 20px; border-left:5px solid #db2d04;}
.tab-pane h4 {color:#299400; font-weight:500;}
table {
border-collapse: collapse;
border-spacing: 0;
table-layout: fixed;
}
/* 홈페이지제작 */
table.tbl_price {width:100%;}
table.tbl_price tr {}
table.tbl_price tr th { border:1px solid #ada3a3; padding:30px; letter-spacing:-1px; line-height:100%; font-size:29px; font-family:"Nanum Gothic" !important;}
table.tbl_price tr th strong {margin-left:10px; color:#cf0000; font-size:32px;}
table.tbl_price tr th span {font-size:20px; color:#6d6d6d;}
table.tbl_price tr td {padding:16px; color:#676767; font-size:14px; font-family:"Nanum Gothic"; border:1px solid #cdcdcd;}
table.tbl_price tr td ul {padding-left:20px;}
table.tbl_price tr td ul li {padding:3px 0; color:#000;}
table.tbl_option {width:100%; border-top:2px solid #848484; font-size:13px;}
table.tbl_option tr {}
table.tbl_option tr.bg {background:#f5f5f5;}
table.tbl_option tr th {padding:10px; border-bottom:1px dotted #b8b8b8; }
table.tbl_option tr td {padding:10px; border-bottom:1px dotted #b8b8b8; border-left:1px solid #eaeaea;}
.home_process ul {list-style:none; margin:0; padding:0;}
.home_process ul li {float:left; width:19%; border:1px solid #2e2e2e; margin-left:1%; margin-top:1%;}
.home_process ul li.partner_part strong {background:#bc0404;}
.home_process ul li span {display:block; padding:10px; font-size:14px; font-weight:bold;}
.home_process ul li i {display:block; text-align:center; font-size:30px; padding:0px 10px 20px 10px;}
.home_process ul li strong {display:block; text-align:center; background:#2e2e2e; color:#fff; padding:5px 0;}
.prepa_list {}
.prepa_list dl {}
.prepa_list dl dt {font-size:14px; color:#c31818;}
.prepa_list dl dd {padding-left:25px;}
.portfolio_more {float:right; font-size:14px;}
/* 관리호스팅 */
table.table_managed {border-top:2px solid #000; border-bottom:2px solid #969ca1;}
table.table_managed tr {border-bottom:1px solid #969ca1;}
table.table_managed tr:first-child {border-top:1px solid #969ca1;}
table.table_managed tr th {background:#f5f5f5; color:#000; border-bottom:1px solid #b0b0b0; border-top:1px solid #b0b0b0; border-right:1px solid #b0b0b0; padding:10px 5px; text-align:center; }
table.table_managed tr td {padding:10px; border-bottom:1px solid #e1e3e5; border-left:1px solid #e1e3e5;}
table.table_managed .border-bottom {border-bottom:1px solid #b0b0b0;}
.hosting_php {width:100%; display:block;}
.hosting_php ul {list-style:none;padding:10px; display:inline-block; border:1px solid #8e8e8e; width:100%;}
.hosting_php ul li {float:left; line-height:150%; font-size:15px; margin-right:30px; margin-top:2px;}
.hosting_php ul li strong {padding-left:20px; font-size:16px;}
.hosting_php ul li:first-child {width:15%; margin-top:5px;}
/* 제작 기술력 */
.standard_dl {}
.standard_dl dl {}
.standard_dl dl dt {font-size:14px; font-weight:bold; color:#008dc8; padding:5px 0;}
.standard_dl dl dd {border:1px solid #ccc; padding:15px; line-height:170%;}
.standard_dl dl dd ul {list-style:none; margin-top:10px; padding-left:10px;}
.standard_dl dl dd ul li {margin-bottom:5px;}
.google_report ul {}
.google_report ul li {margin-bottom:5px; font-size:14px;}
/* 온라인마케팅 */
.con_box_left_img {}
.con_box_left_img div {float:left; }
.con_box_left_img dl { margin-top:20px; margin-left:285px;}
.con_box_left_img dl dt {padding:5px 0; font-size:20px; font-family:"Nanaum Gothic"; letter-spacing:-1px; color:#000;}
.con_box_left_img dl dt h4 {line-height:140%;}
.con_box_left_img dl dd {margin-top:10px; font-size:14px; line-height:150%; white-space:pre-line; display:inline-block;}
.con_box_left_img dl dd strong {float:left; display:block; margin-bottom:15px;}
.con_box_left_img ul {float:left; list-style:none; padding:0 !important; margin:0; }
.con_box_left_img ul li {float:left; margin-bottom:7px; line-height:130% !important; padding-left:18px;}
.con_box_left_img ul li i {margin-left:-18px;}
.con_box_viral {}
.con_box_viral ul {list-style:none; padding:0; margin:0;}
.con_box_viral ul li {width:100%; display:inline-block; padding:5px 0; font-size:14px; border-bottom:1px solid #eaeaea;}
.con_box_viral ul li div {float:left; width:85%;}
.con_box_viral ul li div.viral_img {float:left; width:10% !important; text-align:center; margin-right:2%;}
.con_box_viral ul li div h4 {color:#000; font-family:"Nanum Gothic" !important; font-weight:500;}
.con_box_jun {display:block; width:100% !important;}
.con_box_jun h4 {line-height:140%;}
.con_box_jun dl {float:left; width:31%; display:inline-block; margin-left:3.5%; border:1px solid #aeaeae; }
.con_box_jun dl:first-child {margin-left:0 !important;}
.con_box_jun dl:nth-child(4) {margin-left:0 !important;}
.con_box_jun dl dt {padding-top:25px; text-align:center; color:#000; font-size:16px; font-family:"Nanum Gothic"; white-space:pre-line;}
.con_box_jun dl dt i {font-size:30px;}
.con_box_jun dl dd {font-size:15px; line-height:170%; padding:20px 0; font-family:"Nanum Gothic" !important; text-align:center; letter-spacing:-1px; white-space:pre-line;}
.con_box_key {display:block; width:100% !important;}
.con_box_key h4 {line-height:140%;}
.con_box_key dl {float:left; width:31%; display:inline-block; margin-left:3.5%; border:1px solid #aeaeae; }
.con_box_key dl:first-child {margin-left:0 !important;}
.con_box_key dl:nth-child(4) {margin-left:0 !important;}
.con_box_key dl dt {padding:15px; color:#fff; font-size:16px; font-family:"Nanum Gothic"; background:#000; }
.con_box_key dl dt i {font-size:30px;}
.con_box_key dl dd {font-size:14px; line-height:170%; padding:15px 10px; font-family:"Nanum Gothic" !important; letter-spacing:-1px; white-space:pre-line;}
.keyword_precess {width:100%; border:3px solid #e8ebeb; padding:3%; display:inline-block;}
.keyword_precess h3 { text-align:center; color:#000; font-size:24px; line-height:140%;}
.keyword_precess h3 span {color:#bb0909;}
.keyword_precess ul {padding:0; list-style:none; margin:0; margin-top:20px; }
.keyword_precess ul li {float:left; margin-left:8%; width:150px; height:150px; padding:2%; text-align:center; white-space:pre-line; border-radius:50%; background:#ccc; font-size:22px; color:#fff; line-height:140%; margin-top:20px;}
.keyword_precess ul li:nth-child(1) {background:#0872d5 !important;}
.keyword_precess ul li:nth-child(2) {background:#3eb919 !important;}
.keyword_precess ul li:nth-child(3) {background:#eb5900 !important;}
.keyword_precess ul li span {display:block; margin-top:50px;}
.keyword_precess ul li:nth-child(2) span {margin-top:40px;}
.con_box_blog {display:block; width:100% !important;}
.con_box_blog h4 {line-height:140%;}
.con_box_blog dl {float:left; width:48%; display:inline-block; margin-left:3.5%; border:1px solid #aeaeae; }
.con_box_blog dl.blog_01 {background:url(/img/sub/marketing_img_03-3.jpg) bottom right no-repeat;}
.con_box_blog dl.blog_02 {background:url(/img/sub/marketing_img_03-4.jpg) bottom right no-repeat;}
.con_box_blog dl.blog_03 {background:url(/img/sub/marketing_img_03-5.jpg) bottom right no-repeat;}
.con_box_blog dl.blog_04 {background:url(/img/sub/marketing_img_03-6.jpg) bottom right no-repeat;}
.con_box_blog dl:first-child {margin-left:0 !important;}
.con_box_blog dl:nth-child(3) {margin-left:0 !important;}
.con_box_blog dl dt {padding:15px; color:#fff; font-size:16px; font-family:"Nanum Gothic"; background:#000; }
.con_box_blog dl dt i {font-size:30px;}
.con_box_blog dl dd {font-size:14px; line-height:170%; padding:15px; padding-bottom:100px; font-family:"Nanum Gothic" !important; letter-spacing:-1px; white-space:pre-line;}
.blog_point {width:100%; border:3px solid #e8ebeb; padding:3%; display:inline-block;}
.blog_point h3 { text-align:center; color:#000; font-size:24px; line-height:140%;}
.blog_point h3 span {color:#bb0909;}
.blog_point ul {padding:0; list-style:none; margin:0; margin-top:-20px; }
.blog_point ul li {float:left; margin-left:3%; width:210px; height:210px; padding:2%; text-align:center; white-space:pre-line; border-radius:50%; font-size:17px; color:#000; font-weight:bold; line-height:140%; margin-top:20px; border:10px solid #52d0e7; }
.blog_point ul li span {display:block; margin-top:75px; font-size:17px;}
.blog_point ul li:nth-child(2) span {margin-top:65px;}
.blog_point ul li:nth-child(3) span {margin-top:65px;}
.cafe_why {width:100%; border:3px solid #e8ebeb; padding:3%; display:inline-block;}
.cafe_why h3 { text-align:center; color:#000; font-size:24px; line-height:140%;}
.cafe_why h3 span {color:#bb0909;}
.cafe_why ul {padding:0; list-style:none; margin:0; margin-top:-20px; }
.cafe_why ul li {float:left; margin-left:3%; width:210px; height:210px; padding:2%; text-align:center; white-space:pre-line; border-radius:50%; font-size:17px; color:#000; font-weight:bold; line-height:140%; margin-top:20px; border:10px solid #52d0e7; }
.cafe_why ul li span {display:block; margin-top:20px;}
.cafe_example {}
.cafe_example ul {list-style:none; padding:0; margin:0;}
.cafe_example ul li {float:left; width:32%; margin-left:2%;}
.cafe_example ul li div {text-align:center; }
.cafe_example ul li span {display:block; text-align:center; font-size:14px; color:#000; padding:7px 0;}
.cafe_example ul li:first-child {margin-left:0;}
.img_marketing_point {width:100%; border:3px solid #e8ebeb; padding:3%; display:inline-block;}
.img_marketing_point h3 { text-align:center; color:#000; font-size:24px; line-height:140%;}
.img_marketing_point h3 span {color:#bb0909;}
.img_marketing_point ul {padding:10px; list-style:none; margin:0; margin-top:-20px; }
.img_marketing_point ul li {float:left; margin-left:1.3%; width:32%;}
.img_marketing_point ul li h4 {width:210px; height:210px; padding:2%; text-align:center; white-space:pre-line; border-radius:50%; font-size:17px; color:#000; font-weight:bold; line-height:140%; padding-top:90px; border:10px solid #52d0e7;}
.img_marketing_point ul li p {white-space:pre-line; text-align:center; font-size:14px; line-height:150%;}
.vod_marketing_point {width:100%; border:3px solid #e8ebeb; padding:3%; display:inline-block;}
.vod_marketing_point h3 { text-align:center; color:#000; font-size:24px; line-height:140%;}
.vod_marketing_point h3 span {color:#bb0909;}
.vod_marketing_point ul {padding:10px; list-style:none; margin:0; margin-top:-20px; }
.vod_marketing_point ul li {float:left; margin-left:1.3%; width:32%;}
.vod_marketing_point ul li h4 {width:210px; height:210px; padding:2%; text-align:center; white-space:pre-line; border-radius:50%; font-size:21px; color:#000; font-weight:550; font-family:"Nanum Gothic"; line-height:140%; padding-top:70px; border:10px solid #febd40;}
.vod_marketing_point ul li p {white-space:pre-line; text-align:center; font-size:14px; line-height:150%;}
.img_nowhow {}
.img_nowhow ul {list-style:none; padding:0; margin:0;}
.img_nowhow ul li {float:left; width:48%; margin-left:2%;}
.img_nowhow ul li div {text-align:center; }
.img_nowhow ul li span {display:block; text-align:center; font-size:14px; color:#000; padding:7px 0;}
.img_nowhow ul li:first-child {margin-left:0;}
.local_example {}
.local_example ul {list-style:none; padding:0; margin:0;}
.local_example ul li {float:left; width:66%; margin-left:2%;}
.local_example ul li div {text-align:center; }
.local_example ul li span {display:block; text-align:center; font-size:14px; color:#000; padding:7px 0;}
.local_example ul li:first-child {margin-left:0; width:32%;}
@media all and (max-width:1250px){
#sidebar-btn {display:none;}
}
@media all and (max-width:800px){
.blog_point ul {width:100% !important;}
.blog_point ul li {clear:both; float:none; margin:0 auto !important; margin-top:20px !important; }
.cafe_why ul {width:100% !important;}
.cafe_why ul li {clear:both; float:none; margin:0 auto !important; margin-top:20px !important; }
}
@media all and (max-width:780px){
.img_marketing_point ul li {width:100%; margin-top:20px;}
.img_marketing_point ul li h4 {margin:0 auto; margin-bottom:10px;}
.vod_marketing_point ul li {width:100%; margin-top:20px;}
.vod_marketing_point ul li h4 {margin:0 auto; margin-bottom:10px;}
}
@media all and (max-width:767px){
#sidebar-btn {display:block !important;}
.home_process ul li {width:32.333%;}
.at-title {display:none;}
.table_prod {margin-top:20px;}
.spec_gray_font05 { width:88% !important;}
.con_box_jun dl {width:48%; margin-left:0;}
.con_box_jun dl:nth-child(even) {margin-left:2%;}
.con_box_jun dl:nth-child(4) {margin-left:2% !important;}
.con_box_key dl {width:48%; margin-left:0;}
.con_box_key dl:nth-child(even) {margin-left:2%;}
.con_box_key dl:nth-child(4) {margin-left:2% !important;}
.con_box_left_img dl dd {white-space:normal;}
.con_box_blog dl dd {white-space:normal;}
}
@media all and (max-width:670px){
.bottom_logo {display:none;}
.copy_txt {display:none;}
.copy_txt_m {display:block;}
.hosting_php ul li:first-child {width:100%; margin-left:0px; padding:10px 0;}
.hosting_php ul li {margin-left:20px;}
.content_txt09 p {float:left; display:block !important; width:100%;}
.spec_gray_font05 { width:80% !important;}
.keyword_precess ul {width:100% !important;}
.keyword_precess ul li {clear:both; float:none; margin:0 auto !important; margin-top:20px !important; }
}
@media all and (max-width:580px){
.top_desc {white-space:normal;}
.top_desc_img div {white-space:normal;}
.con_box_left_img div {width:100%; text-align:center;}
.con_box_left_img dl {float:left; width:100%; margin:0; margin-top:10px;}
.con_box_left_img dl dt {text-align:center;}
.con_box_viral ul li div {margin-left:0 !important; }
}
@media all and (max-width:480px){
.home_process ul li {width:49%;}
.header-left {display:none;}
.header-right {display:none;}
.m-header .header-logo {padding-left: 0px;}
.con_box_jun dl {width:100%; margin-left:0 !important;}
.con_box_jun dl:nth-child(4) {width:100%; margin-left:0 !important;}
.con_box_key dl {width:100%; margin-left:0 !important;}
.con_box_key dl:nth-child(4) {width:100%; margin-left:0 !important;}
.con_box_blog dl{width:100%; margin-left:0 !important;}
.local_example ul li {width:100% !important; margin-top:20px;}
}
@media all and {max-width:400px){
}
@media all and (max-width:360px){
.home_process ul li {width:100%; margin-left:0;}
}