/*-------------------------------------- eyoom (이윰빌더) --------------------------------------*/ /*---------- Wrapper & Basic Layout & Boxed Layout ----------*/ .wrapper {background-image:url("../image/bg_boxed.png")} .basic-layout {background:#fff} .boxed-layout {padding:0;box-shadow:0 0 5px #bbb;margin-left:auto !important;margin-right:auto !important;background:#fff} @media (min-width: 992px) { .boxed-layout .header-nav > .navbar > .container {padding-right:0;padding-left:0} .boxed-layout .header-nav > .navbar > .container li.menu-icons i.menu-icons-style {margin-right:15px} } /*---------- Header Top Bar ----------*/ .header-topbar {position:relative;background:#f0f0f0} .header-topbar ul {margin:0} .header-topbar .topbar-left li {color:#333;padding:5px 0;font-size:12px;/*margin-right:15px;*/display:inline-block} .header-topbar .topbar-left li:last-child {margin-right:0} .header-topbar .topbar-right {text-align:right} .header-topbar .topbar-right li {padding:5px 12px;display:inline-block} .header-topbar .topbar-right li a {font-size:12px;color:#ddd} .header-topbar .topbar-right li a:hover {text-decoration:none;color:#fff} .header-topbar .topbar-right li i {color:#777} .header-topbar .topbar-right li a:hover i {color:#ff2a00} .header-topbar .topbar-right li.dropdown-extended li {border-left:0;border-right:0;top:0;margin-left:0;position:relative;border:0;text-align:left} .header-topbar .dropdown-extended .dropdown-menu {float:right;left:inherit;right:0px;margin:0;margin-right:9px;border:1px solid #ccc;background-color:#fafafa;width:275px;z-index:9999} .header-topbar .dropdown-extended .dropdown-menu:before {position:absolute;top:-7px;right:30px;display:inline-block !important;border-right:7px solid transparent;border-bottom:7px solid #fafafa;border-left:7px solid transparent;border-bottom-color:#ccc;content:""} .header-topbar .dropdown-extended .dropdown-menu:after {position: absolute;top:-6px;right:31px;display:inline-block !important;border-right:6px solid transparent;border-bottom:6px solid #fafafa;border-left:6px solid transparent;content:""} .header-topbar .dropdown-extended .dropdown-menu > li.external {display:block;overflow:hidden;padding:10px;letter-spacing:0.5px} .header-topbar .dropdown-extended .dropdown-menu > li.external > h5 {margin:0;padding:0;float:left;font-size:12px;display:inline-block} .header-topbar .dropdown-extended .dropdown-menu > li.external > a {display:inline-block;padding:0;background:none;clear:inherit;font-size:12px;font-weight:300;position:absolute;right:10px;border:0;margin-top:-1px} .header-topbar .dropdown-extended .dropdown-menu > li.external > a:hover {text-decoration:underline;color:#ff2a00} .header-topbar .dropdown-extended .dropdown-menu .dropdown-menu-list {padding:0;margin:0;list-style:none;border:1px solid #eee} .header-topbar .dropdown-extended .dropdown-menu .dropdown-menu-list > li > a {display:block;clear:both;white-space:normal;padding:8px 0 0;text-shadow:none} .header-topbar .sns_title {width:100%; height:35px; background:#2aa494;} .header-topbar .sns_title p {color:#fff; text-align:center; line-height:35px; font-weight:bold;} .header-topbar ul.sns {} .header-topbar ul.sns li {padding:7px 0px; width:126px; text-align: center; background:url(/images/topmenu_l.gif) 0px 11px no-repeat;} .header-topbar ul.sns li:first-child {background:none; margin-left:30px;} .header-topbar ul.sns li > a {vertical-align:middle;} .header-topbar ul.sns li > a > span {font-size:12px;vertical-align:middle;display:inline-block;margin-left:7px;} @media (max-width: 991px){ .header-topbar ul.sns li:first-child {margin-left:0px;} } @media (max-width: 991px){ .header-topbar .container {width:100%; padding:0;} .header-topbar ul {text-align:center !important} .header-topbar .topbar-left {margin:0} .header-topbar .topbar-right li {top:1px;padding:5px 12px;margin-left:-5px;position:relative} .header-topbar .sns_title {display:none;} .header-topbar ul.sns li {width:24%;} .header-topbar ul.sns li > a > span {margin-left:3px;} } @media (max-width: 767px){ .header-topbar .dropdown-extended .dropdown-menu {right:-60px} .header-topbar .dropdown-extended .dropdown-menu:before {right:88px} .header-topbar .dropdown-extended .dropdown-menu:after {right:89px} } @media (max-width: 991px){ .header-topbar ul {text-align:center !important} .header-topbar .topbar-left {margin:0 0} .header-topbar .topbar-right li {top:1px;padding:5px 12px;margin-left:-5px;position:relative} } @media (max-width: 767px){ .header-topbar .dropdown-extended .dropdown-menu {right:-60px} .header-topbar .dropdown-extended .dropdown-menu:before {right:88px} .header-topbar .dropdown-extended .dropdown-menu:after {right:89px} } /*---------- Header Title ----------*/ .header-logo {position:relative;float:left} .header-logo a {display:block;height:70px;line-height:70px;font-size:32px;text-indent:15px} .header-logo a img {/*height:32px;*/width:auto} .scroll_logo {position:relative;float:left} .scroll_logo a {display:block;height:70px;line-height:70px;font-size:32px;text-indent:15px} .scroll_logo a img {/*height:32px;*/width:auto} .header-m-logo {display:none;} @media (min-width: 992px) { .header-logo a {height:90px;line-height:80px;text-indent:30px} .header-logo a img {/*height:40px*/} .scroll_logo a {height:90px;line-height:80px;text-indent:30px} .scroll_logo a img {/*height:40px*/} } @media (max-width: 1200px) { .header-logo a {line-height:75px} .header-logo a img {height:30px; } .scroll_logo a {line-height:95px} .scroll_logo a img {height:30px; } } @media (max-width: 992px) { .header-logo {display:none;} .header-m-logo {display:block; position:absolute; top:14px; left:25px;} .header-m-logo img {width:150px; float:left;} } /*---------- Header Nav ----------*/ .header-nav {z-index:99;position:relative} @media (min-width: 768px) and (max-width: 991px) { .header-nav .menu-container {width:750px} } @media (max-width: 991px) { .header-nav .navbar {min-height:70px} .header-nav {position:static;border-bottom:1px solid #e5e5e5} .header-nav .menu-container:before, .header-nav .menu-container:after {content:" ";display:table} .header-nav .menu-container:after {clear:both} .header-nav .menu-container {margin-left:auto;margin-right:auto;padding-left:15px;padding-right:15px} .header-nav > .navbar > .container {width:inherit;margin-left:0;margin-right:0;padding-left:0;padding-right:0} .header-nav > .navbar > .container > .navbar-header, .header-nav > .navbar > .container > .navbar-collapse {margin-left:0;margin-right:0} } .header-nav .navbar {border:none;margin-bottom:0} .header-nav .navbar-toggle {border:none;margin:15px 0 5px 10px;font-size:16px} .header-nav .navbar-toggle .icon-bar:last-child {margin-bottom:0} .header-nav .navbar-toggle, .header-nav .navbar-toggle:hover, .header-nav .navbar-toggle:focus {background:#2e3092; color:#fff; padding:10px 15px;} .header-nav .navbar-collapse {position:relative} .header-nav .navbar-nav > li > a {color:#fff;font-size:22px;padding:0px 15px;letter-spacing:0px} .header-nav .nav > li > a:hover, .header-nav .nav > li > a:focus {background:inherit} .header-nav .navbar-nav .dropdown > a:after {display:none;top:12px;right:12px;font-size:11px;position:absolute;font-weight:normal;color:#bbb;display:inline-block;font-family:FontAwesome;content:"\f0d7"} @media (min-width: 992px) { .navbar {border-radius:0} .header-nav .navbar-nav {float:left;} } @media (max-width: 1200px) { .header-nav .navbar-nav > li > a {font-size:16px; padding:0px 8px;} } /*Nav In Right*/ .header-nav .nav-in-right {float:right;z-index:999;margin-left:-20px;position:relative} @media (max-width: 350px) { .header-nav .nav-in-right {display:none} } .header-nav .menu-icons-list {margin:0;list-style:none} .header-nav li.menu-icons {position:relative;display:inline-block} .header-nav li.menu-icons i.menu-icons-style {color:#fff;width:25px;cursor:pointer;font-size:16px;line-height:100px;text-align:center;display:inline-block} .header-nav .search-open {top:0;right:0;height:100px;width:100%;z-index:99;display:none;padding:35px 15px 0;position:absolute;background:#fff} .header-nav .search-open .form-control {color:#333;border:none;height:26px;font-size:13px;font-weight:400;box-shadow:none;background:#fff;padding:0 20px} @media (max-width: 991px) { .header-nav .search-open {height:70px;padding-top:20px} .header-nav .search-open .form-control {padding:0;background:#f4f4f4;padding:0 10px;margin-top:3px} .header-nav li.menu-icons i.menu-icons-style {line-height:70px} } @media (min-width: 768px) and (max-width: 991px) { .header-nav .search-open .form-control {position:relative;overflow:hidden;width:500px;margin:3px auto} } .header-nav .search-open .form-control::-moz-placeholder {color:#555} .header-nav .search-open .form-control:-ms-input-placeholder {color:#555} .header-nav .search-open .form-control::-webkit-input-placeholder {color:#555} .header-nav .search-open .form-control:hover, .header-nav .search-open .form-control:active, .header-nav .search-open .form-control:focus {border:none;box-shadow:none} .header-nav .search-close {z-index:999;position:relative} .header-nav li.menu-icons i.search-btn {color:#fff} .header-nav li.menu-icons i.fa-times {color:#444} /*Responsive*/ @media (max-width: 991px) { .header-nav .navbar-header {float:none} .header-nav .navbar-toggle {display:block} .header-nav .navbar-collapse {border-color:#eee} .header-nav .navbar-collapse.collapse {display:none !important} .header-nav .navbar-collapse.collapse.in {display:block !important;overflow-y:auto !important} .header-nav .navbar-nav {margin: 0;float:none !important} .header-nav .navbar-nav > li {float:none} .header-nav .navbar-nav > li > a {padding-top:30px;padding-bottom:40px} .header-nav .navbar-nav > li > a {color:#444} .header-nav .dropdown-menu.pull-right {float:none !important} .header-nav .navbar-nav .open .dropdown-menu {border:0;float:none;width:auto;margin-top:0;position:static;box-shadow:none;background-color:transparent} .header-nav .navbar-nav .open .dropdown-menu > li > a, .header-nav .navbar-nav .open .dropdown-menu .dropdown-header {padding:5px 15px 5px 25px} .header-nav .navbar-nav .open .dropdown-menu > li > a {line-height:20px} .header-nav .navbar-nav .open .dropdown-menu > li > a:hover, .header-nav .navbar-nav .open .dropdown-menu > li > a:focus {background-image:none} .header-nav .navbar-nav .open .dropdown-menu > li > a {color:#777;} .header-nav .navbar-nav .open .dropdown-menu > li > a:hover, .header-nav .navbar-nav .open .dropdown-menu > li > a:focus {color:#ff2a00;background-color:transparent} .header-nav .navbar-nav .open .dropdown-menu > .active > a, .header-nav .navbar-nav .open .dropdown-menu > .active > a:hover, .header-nav .navbar-nav .open .dropdown-menu > .active > a:focus {color:#ff2a00;background-color:transparent} .header-nav .navbar-nav .open .dropdown-menu > .disabled > a, .header-nav .navbar-nav .open .dropdown-menu > .disabled > a:hover, .header-nav .navbar-nav .open .dropdown-menu > .disabled > a:focus {color:#ff2a00;background-color:transparent} .header-nav .dropdown-menu.no-bottom-space {padding-bottom:0} .header-nav .navbar-collapse, .header-nav .navbar-collapse .container {padding-left:0 !important;padding-right:0 !important} .header-nav .navbar-nav > li > a {font-size:13px;padding:12px 5px} .header-nav .navbar-nav > li a {border-bottom:none;border-top:1px solid #eee} .header-nav .navbar-nav > li:first-child > a {border-top:1px solid transparent} .header-nav .navbar-nav > li > a:hover {color:#ff2a00;border-top:1px solid #039ee1} .header-nav .navbar-nav > .open > a, .header-nav .navbar-nav > .open > a:hover, .header-nav .navbar-nav > .open > a:focus {color:#555;background:inherit} .header-nav .navbar-nav > .active > a, .header-nav .navbar-nav > .active > a:hover, .header-nav .navbar-nav > .active > a:focus {background:inherit;color:#039ee1 !important} .header-nav .dropdown .dropdown-submenu > a {font-size:12px;color:#555 !important} } @media (min-width: 992px) { .header-nav .navbar-collapse {padding:0} .header-nav .navbar {min-height:40px !important} .header-nav .container > .navbar-header, .header-nav .container-fluid > .navbar-header, .header-nav .container > .navbar-collapse, .header-nav .container-fluid > .navbar-collapse {margin-bottom:-10px} .header-nav .navbar-nav {top:2px;position:relative; margin-left:115px;} .header-nav .navbar-nav > li > a {line-height:90px} .header-nav .navbar-nav > li.dropdown > a {/*padding-right:30px*/} .header-nav .navbar-nav > li > a, .header-nav .navbar-nav > li > a:hover, .header-nav .navbar-nav > li > a:focus, .header-nav .navbar-nav > .active > a, .header-nav .navbar-nav > .active > a:hover, .header-nav .navbar-nav > .active > a:focus {color:#fff;background:none} .header-nav .navbar-nav > .open > a, .header-nav .navbar-nav > .open > a:hover, .header-nav .navbar-nav > .open > a:focus {color:#fff} .header-nav .navbar-nav .dropdown > a:after {display:none;top:32px;right:15px;font-size:11px;position:absolute;font-weight:normal;color:#888;/*display:inline-block;*/font-family:FontAwesome;content:"\f107"} .header-nav .dropdown-menu {border:none;padding:0;border-radius:0;z-index:9999 !important;border:5px solid transparent;border-left:0 none;box-shadow:0 0 0 #fff} .header-nav .dropdown-menu li a {color:#ddd;font-weight:bold; font-size:12px; font-weight:normal; padding:12px 20px;background:#6a6a6a} .header-nav .dropdown-menu li a:before {display:block; position:absolute; left:-130%; bottom:0; content:""; width:120%; height:100%; color:#fff; background:#039ee1; /* opacity:0;filter:Alpha(opacity=0); */ transform:skew(-20deg); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s} .header-nav .dropdown-menu li a span{position:relative; font-size: 14px; /*font-family: 'MaplestoryOTFBold';*/ z-index:1;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s} .header-nav .dropdown-menu li a:hover {overflow:hidden;} .header-nav .dropdown-menu li.active a {color:#ddd;font-weight:bold; font-size:12px; font-weight:normal; padding:12px 20px;background:#6a6a6a} .header-nav .dropdown-menu li.active a:before {display:block; position:absolute; left:-130%; bottom:0; content:""; width:120%; height:100%; color:#fff; background:#039ee1; /* opacity:0;filter:Alpha(opacity=0); */ transform:skew(-20deg); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s} .header-nav .dropdown-menu li.active a span{position:relative; font-size: 14px; /*font-family: 'MaplestoryOTFBold';*/ z-index:1;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s} .header-nav .dropdown-menu li.active a span:hover {color:#fff;} .header-nav .dropdown-menu li.active a:hover {overflow:hidden;} /*.header-nav .dropdown-menu li a:hover span{color:#fff;}*/ .header-nav .dropdown-menu li a:hover:before {color:#fff;left:-10%; opacity:1.0;filter:Alpha(opacity=100);} .header-nav .dropdown-menu .active > a, .header-nav .dropdown-menu li > a:hover {overflow:hidden;color:#039ee1;background:inherit;filter:none !important;-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} .header-nav .dropdown-menu li > a:focus {background:none;filter:none !important} .header-nav .dropdown-menu li.active a:hover:before {color:#fff;left:-10%; opacity:1.0;filter:Alpha(opacity=100);} .header-nav .navbar-nav > li.dropdown:hover > .dropdown-menu {overflow:hidden;display:block} .header-nav .open > .dropdown-menu {display:none} .header-nav .mega-menu .dropdown-menu > li a:hover {/*background:#9f73f0;*/ color:#fff;} } @media (max-width: 1200px) { .header-nav .navbar-nav > li > a {line-height:75px} } @media (max-width: 992px) { .header-nav .navbar-nav > li > a {line-height:24px} } /*Dropdown Submenu*/ .header-nav .dropdown-submenu {position:relative} .header-nav .dropdown-submenu > a > .sub-caret {top:5px;left:8px !important;float:right;font-size:11px;font-weight:normal;display:inline-block} @media (min-width: 991px) { .header-nav .dropdown-submenu > a > .sub-caret {position:absolute !important;left:inherit !important;right:8px;top:13px} } .header-nav .dropdown-submenu > .dropdown-menu {top:-15px;left:100%;margin-left:0px} .header-nav .dropdown-submenu > .dropdown-menu.submenu-left {left:-100%} .header-nav .dropdown-submenu:hover > .dropdown-menu {display:block} @media (max-width: 991px) { .header-nav .dropdown-submenu > .dropdown-menu {display:block;margin-left:15px} } .header-nav .dropdown-submenu.pull-left {float:none} .header-nav .dropdown-submenu.pull-left > .dropdown-menu {left:-100%;margin-left:10px} .header-nav .dropdown-menu li [class^="fa-"], .header-nav .dropdown-menu li [class*=" fa-"] {left:-3px;width:1.25em;margin-right:1px;position:relative;text-align:center;display:inline-block} .header-nav .dropdown-menu li [class^="fa-"].fa-lg, .header-nav .dropdown-menu li [class*=" fa-"].fa-lg {width:1.5625em} /*Mega Menu*/ .header-nav .mega-menu .nav, .header-nav .mega-menu .dropup, .header-nav .mega-menu .dropdown, .header-nav .mega-menu .collapse {position:static} .header-nav .mega-menu .navbar-inner, .header-nav .mega-menu .container {position:relative} .header-nav .mega-menu .dropdown-menu {left:auto; top:60px;} .header-nav .mega-menu .dropdown-menu > li {display:block} .header-nav .mega-menu .dropdown-submenu .dropdown-menu {left:100%;margin:0;border:0 none;border-left:5px solid transparent;top:0} .header-nav .mega-menu .nav.pull-right .dropdown-menu {right:0} .header-nav .mega-menu .mega-menu-content {*zoom:1;padding:0} .header-nav .mega-menu .mega-menu-content:before, .header-nav .mega-menu .mega-menu-content:after {content:"";display:table;line-height:0} .header-nav .mega-menu .mega-menu-content:after {clear:both} .header-nav .mega-menu.navbar .nav > li > .dropdown-menu:after, .header-nav .mega-menu.navbar .nav > li > .dropdown-menu:before {display:none} .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu {left:0;right:0;overflow:hidden} .header-nav .mega-menu .mega-height-list h3 {color:#000;font-size:14px;font-weight:bold;padding:0 10px} @media (max-width: 1200px) { .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu .container {width:1140px} .header-nav .navbar-nav {margin-left:85px;} } @media (max-width: 992px) { .header-nav .navbar-nav {margin-left:0px;} } @media (min-width: 992px) and (max-width: 1199px) { .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu .container {width:940px} } @media (min-width: 992px) { .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu {margin-left:15px;margin-right:15px} .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu .container {background:#f9f9f9} .header-nav .mega-menu .mega-height {display:-webkit-flex;display:-ms-flexbox;display:flex} .header-nav .mega-menu .mega-height-in {display:-webkit-flex;display:-ms-flexbox;display:flex} .header-nav .mega-menu .big-screen-space {margin-bottom:20px} .header-nav .mega-menu .mega-height-in {padding:5px 0 10px;border-left:1px solid #e5e5e5} .header-nav .mega-menu .mega-height-in:first-child {border-left:none;margin-left:-1px} .header-nav .mega-menu .mega-height-list {width:100%} .header-nav .mega-menu .mega-height-list li a {display:block;position:relative;border-bottom:none;padding:5px 10px 5px 15px} .header-nav .mega-menu .mega-height-list a:hover {text-decoration:none} .header-nav .mega-menu .mega-menu-area li a {padding:5px 10px 5px 30px} .header-nav .mega-menu .mega-menu-area li a:after {top:7px;left:15px;font-size:11px;content:"\f105";position:absolute;font-weight:normal;display:inline-block;font-family:FontAwesome} .header-nav .mega-menu .mega-menu-area .disable-icons li a {padding:5px 10px 5px 15px;background:#fff;color:#6a6a6a} .header-nav .mega-menu .mega-menu-area .disable-icons li a:after {display:none} } @media (min-width: 737px) and (max-width: 991px) { .header-nav .mega-menu .mega-menu-content .container {width:690px !important} .header-nav .mega-menu .mega-height {margin-right:0;} .header-nav .mega-menu .mega-height-in {padding-right:0;margin-right:-15px} } @media (max-width: 991px) { .header-nav .mega-menu .mega-height {margin-right:0} .header-nav .mega-menu .mega-height-in {padding-right:0;padding-left:5px} .header-nav .mega-menu .dropdown.mega-menu-area .dropdown-menu {width:auto} .header-nav .mega-menu .mega-height-in, .header-nav .mega-menu .mega-height-list {display:block} .header-nav .mega-menu .mega-menu-area .dropdown-menu > li > ul {display:block} .header-nav .mega-menu .mega-height-list h3 { color:#555; margin:0 0 5px;font-size:13px; font-weight:400; padding:6px 15px 5px} .header-nav .mega-menu .mega-height-list li a {color:#777;display:block;font-size:12px; font-weight:400; margin-left:15px;padding:6px 25px} .header-nav .mega-menu .mega-height-list > h3.active, .header-nav .mega-menu .mega-height-list > .active > a, .header-nav .mega-menu .mega-height-list > .active > a:hover, .header-nav .mega-menu .mega-height-list > .active > a:focus {color:#039ee1;background-color:transparent} .header-nav .mega-menu .mega-height-list li a:hover {color:#039ee1;text-decoration:none} } /*Header Nav Fixed*/ @media (min-width: 992px) { .header-fixed .header-nav.header-sticky {width:100%;height:auto;z-index:999;position:fixed;} .header-fixed .header-nav.header-fixed-trans {border-bottom:none;/*box-shadow:0 0 3px #bbb;*/position:fixed;top:0;left:0} .header-fixed .header-nav.header-fixed-trans .navbar {background:#fff;border:0} .header-fixed .header-nav.header-fixed-trans .navbar-nav > li > a {color:#555} .header-fixed .header-nav.header-fixed-trans .navbar-nav .active > a, .header-fixed .header-nav.header-fixed-trans .navbar-nav li > a:hover {color:#9f73f0} .header-fixed .header-nav.header-fixed-trans li.menu-icons i.menu-icons-style {color:#555} .header-fixed .header-nav.header-fixed-trans .navbar-brand, .header-fixed .header-nav.header-fixed-trans .navbar-nav > li > a, .header-fixed .header-nav.header-fixed-trans li.menu-icons i.menu-icons-style, .header-fixed .header-nav.header-fixed-trans .search-open .form-control {-webkit-transition:all 0.4s cubic-bezier(0.7, 1, 0.7, 1);transition:all 0.4s cubic-bezier(0.7, 1, 0.7, 1)} .header-fixed .header-nav.header-fixed-trans .navbar-brand {height:70px;max-height:70px;line-height:39px} .header-fixed .header-nav.header-fixed-trans .navbar-nav > li > a {line-height:90px} .header-fixed .header-nav.header-fixed-trans li.menu-icons i.menu-icons-style {line-height:100px} .header-fixed .header-nav.header-fixed-trans li.menu-icons span.badge {top:5px} .header-fixed .header-nav.header-fixed-trans .shopping-cart .shopping-cart-open {top:70px} .header-fixed .header-nav.header-fixed-trans .search-open {border-bottom:1px solid #eee} .header-fixed .header-nav.header-fixed-trans .search-open .form-control {height:26px;font-size:13px} .header-fixed .header-sticky-space.header-fixed-space-trans {clear:both;margin-bottom:100px} } @media (max-width: 991px) { .call {display:none;} .call2 {display:none;} .header-fixed .header-nav, .header-fixed .header-nav.header-fixed-trans {height:inherit;position:relative} .header-fixed .header-nav.header-fixed-trans .nav-in-right {margin-left:0;margin-right:20px} .header-nav li.menu-icons i.menu-icons-style {color:#555} } .header-nav.nav-background-light .navbar .login_menu {position:absolute; margin:0; top: 10px; right:0;} .header-nav.nav-background-light .navbar .login_menu li {display:inline-block; padding:0 0 0 6px; /*line-height:100px;*/ background:url(/images/topmenu_l.gif) 0px 4px no-repeat;} .header-nav.nav-background-light .navbar .login_menu li:first-child {background:none;} @media (max-width: 992px) { .header-nav.nav-background-light .navbar .login_menu {position:static; width:100%;padding-left: 15px;} .header-nav.nav-background-light .navbar .login_menu li {line-height:40px; padding:0 0 0 6px; background:url(/images/topmenu_l.gif) 0px 14px no-repeat;} } /*Fixed Boxed*/ .boxed-layout.header-fixed .header-nav.header-sticky {left:inherit;width:inherit} /*Header Nav Background Light*/ @media (min-width: 992px) { .header-nav.nav-background-light .navbar {background:#fff; border-radius: 0 0 60px 60px; box-shadow: 2px 0 10px #666;} .header-fixed .header-nav.nav-background-light .navbar-nav > li > a {color:#000;} .header-fixed .header-nav.nav-background-light .navbar-nav .submenus {color:#000;font-weight:bold; } .header-fixed .header-nav.nav-background-light .navbar-nav .active > a {color:#009de0;/*background:#333 !important*/} /*.header-fixed .header-nav.nav-background-light .navbar-nav li > a:hover, .header-fixed .header-nav.nav-background-light .navbar-nav li.open {background:#555}*/ .header-fixed .header-nav.nav-background-light .navbar-nav .active > a:hover {color:#009de0; z-index: 100000;} .header-fixed .header-nav.nav-background-light li.menu-icons i.menu-icons-style {color:#555} .header-nav.nav-background-light .search-open .form-control {background:#f4f4f4} } @media (min-width: 992px) { .header-fixed .header-nav.nav-background-light .navbar-nav > li > a .submenus {color:#000;font-weight:bold;} } /*---------- Header Slider ----------*/ .header-slider {position:relative} .slider-info {position:relative} .slider-info > ul {width:100%;margin:0 auto} .slider-info > ul > li {padding:5px 10px;border-bottom:1px dashed #eee;width:50%;float:left;height:45px} .slider-info > ul > li:nth-child(3), .slider-info > ul > li:nth-child(4) {border-bottom:0 none} .slider-info > ul > li > h5 i {font-size:28px;position:absolute;left:0;top:5px} .slider-info > ul > li > h5 {font-size:12px;color:#888;padding-left:40px;position:relative;margin:0} .slider-info > ul > li > h5 small, .slider-info > ul > li > h5 small a {display:block;font-size:12px;color:#ccc;font-weight:bold;margin-top:-2px} .slider-info > ul > li > h5 small a:hover {color:#039ee1} .slider-info > ul > .slider-info-sns ul {padding-top:5px;text-align:left} .slider-info > ul > .slider-info-sns i {color:#9a9a9a;font-size:28px;display:block} @media (min-width:992px){ .slider-info {position:absolute;z-index:10;width:100%;bottom:0;background-color:rgba(0,0,0,0.3);border-top:1px solid #555} .slider-info > ul {width:970px;margin:0 auto} .slider-info > ul > li {width:25%;border:0 none;border-left:1px solid #555;padding:15px 15px 15px 35px;height:65px} .slider-info > ul > li:last-child {border-right:1px solid #555} .slider-info > ul > .slider-info-sns {padding:15px} .slider-info > ul > .slider-info-sns ul {text-align:center} .slider-info > ul > .slider-info-sns ul a:hover i {color:#fff} } @media (min-width:1200px){ .slider-info > ul {width:1170px} .slider-info > ul > li {padding-left:65px} } .header-slider-bg {z-index:1;padding:110px 0;position:relative;overflow:hidden;height:500px} .header-slider-bg:after {position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;content:" ";background:rgba(0,0,0,0.5)} .header-slider-bg > img {position:absolute;top:0;left:0} .header-slider-bg > .container {position:relative;z-index:3;max-width:970px} .header-slider-bg h3 {font-size:46px;line-height:46px;color:#fff;margin-bottom:20px;font-weight:normal} .header-slider-bg p {color:#fff;font-size:14px;margin-bottom: 5px} .header-slider-bg p span {background-color:rgba(0, 0, 0, 0.3);padding:5px 10px;display:inline-block} .header-slider-btn {margin-top:20px} @media (min-width: 768px) and (max-width: 991px) { .header-slider-bg {padding:100px 0 0} } @media (max-width: 991px) { .header-slider-bg > .container {max-width:750px} } @media (max-width: 767px) { .header-slider-bg {padding:70px 0 0;height:250px} .header-slider-bg > .container {max-width:100%} .header-slider-bg h3 {font-size:32px;line-height:32px;text-align:center} .header-slider-bg h3.header-slider-title {font-size:20px;line-height:20px} .header-slider-bg p {display:none} .header-slider-btn {margin-top:10px;text-align:center} } @media (max-width: 430px) { .header-slider-bg {padding:40px 0 0;height:180px} } /*owl control*/ .header-slider .owl-pagination {position:absolute;bottom:10px;text-align:center;z-index:100;margin-left:-32px;left:50%} .header-slider .owl-pagination .owl-page {background:#e5e5e5;width:15px;height:10px;border-radius:5px !important;display:inline-block;margin:0 5px;transition:all 0.3s ease-in-out} .header-slider .owl-pagination .owl-page.active {background:#DF3128;width:30px} .header-slider .owl-buttons > div {position:absolute;height:36px;width:50px;line-height:36px;text-align:center;background:rgba(255, 255, 255, 0.5);color:#fff;top:50%;margin-top:-18px} .header-slider .owl-buttons .owl-prev {left:0} .header-slider .owl-buttons .owl-next {right:0} @media (max-width: 767px) { .header-slider .owl-buttons {display:none} } /*---------- Basic Body ----------*/ .basic-body.main-page {width:100%} .basic-body .basic-body-main {padding-top:0px;padding-bottom:0;min-height:800px} .basic-body.main-page .basic-body-main{padding:0} .basic-body .basic-body-main.left-main {border-right:1px solid #e5e5e5} .basic-body .basic-body-main.right-main {border-left:1px solid #e5e5e5} .basic-body .basic-body-side {padding-top:25px;padding-bottom:25px} .basic-body .basic-body-side.left-side {margin-right:-1px;border-right:1px solid #e5e5e5} .basic-body .basic-body-side.right-side {margin-left:-1px;border-left:1px solid #e5e5e5} @media (max-width: 991px){ .basic-body .basic-body-main.left-main {border-right:0} .basic-body .basic-body-main.right-main {border-left:0} .basic-body .basic-body-side.left-side {margin-right:0;border-right:0} .basic-body .basic-body-side.right-side {margin-left:0;border-left:0} } /*---------- Board Title ----------*/ .board-title {position:relative;overflow:hidden;padding:25px 0;background-repeat:no-repeat;background-size:cover} .board-title:after {display:block;content:"";width:100%;height:100%;background:rgba(0,0,0,0.3);top:0;left:0;position:absolute;z-index:1} .board-title > .container {z-index:10;position:relative} .board-title h3 {margin:0;padding:0;line-height:30px;font-size:17px;color:#ddd;font-weight:bold} .board-title .breadcrumb {padding:0;margin:0;list-style:none;background-color:inherit;border-radius:0;line-height:30px} .board-title .breadcrumb li, .board-title .breadcrumb li a {color:#ccc} .board-title .breadcrumb li a:hover {color:#fff} /*---------- Footer ----------*/ .footer {position:relative;z-index:1} /*Footer Background Dark*/ .footer.footer-dark {clear:both;padding:45px 0 60px;background:#909090;font-size:12px} .footer.footer-dark p {color:#fff; font-size: 14px;} .footer.footer-dark .heading-footer {text-align:left;position:relative;margin-bottom:20px;padding-bottom:2px} .footer.footer-dark .heading-footer:after {left:0;bottom:0;height:1px;width:40px;content:" ";background:#aaa;position:absolute} .footer.footer-dark .heading-footer h4 {color:#e5e5e5;font-size:15px;font-weight:normal} .footer.footer-dark .footer-logo {margin-bottom:20px} .footer.footer-dark .footer-logo a {color:#ccc;font-size:28px} .footer.footer-dark .footer-logo img {height:32px} .footer-social-icons, .footer-link-list, .footer-contactus {margin-bottom:0} .footer.footer-dark .footer-social-icons li, .footer.footer-dark .footer-link-list li, .footer.footer-dark .footer-contactus li {margin-bottom:5px} .footer.footer-dark .footer-social-icons li a, .footer.footer-dark .footer-link-list li a, .footer.footer-dark .footer-contactus li, .footer.footer-dark .footer-contactus li a {color:#aaa;line-height:24px;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out} .footer.footer-dark .footer-social-icons li a i, .footer.footer-dark .footer-link-list li a i, .footer.footer-dark .footer-contactus li i {font-size:24px;color:#aaa;margin-right:10px} .footer.footer-dark .footer-social-icons li a:hover, .footer.footer-dark .footer-link-list li a:hover, .footer.footer-dark .footer-contactus li a:hover {color:#eee} .family-site {position:relative} .family-site dt {display:block;width:100%;border:1px solid #aaa;color:#aaa;padding:5px 10px;background:#212227;cursor:pointer} .family-site dd {} .family-site ul {background:#212227;position:absolute;width:100%;border:1px solid #aaa;border-bottom:0 none;margin-bottom:0;bottom:100%;display:none} .family-site ul li {border-bottom:1px solid #aaa} .family-site ul li:last-child {border-bottom:0 none} .family-site ul li a {display:block;color:#aaa;padding:5px 10px} .family-site ul li a:hover {color:#eee} .footer.footer-dark .copyright {margin-top:10px;padding:15px 0;background:#000} .footer.footer-dark .copyright p {font-size:12px;margin:0;color:#777} @media (max-width: 991px){ .footer.footer-dark {padding:20px 0px;} .footer.footer-dark .col-md-10, .footer.footer-dark .col-md-2 {/*margin: 0 15px;*/} } /*----- Back To Top -----*/ .eb-top {z-index:9999;width:34px;height:34px;text-align:center;line-height:32px;color:#fff;background:rgba(0, 0, 0, 0.5);-webkit-border-radius:50% !important;-moz-border-radius:50% !important;border-radius:50% !important} /*----- Perfect Scrollbar -----*/ .contentHolder{padding:0;height:320px;margin:0 auto;overflow:hidden;position:relative;background:#fff} @media (max-width: 767px){ .contentHolder{height:auto} } /*----- Table List eb -----*/ .table-list-eb {font-size:12px} .table-list-eb .btn-e.dropdown-toggle {border-left:none} .table-list-eb .btn-group .btn-e {top:4px;padding:0 6px;position:relative} .table-list-eb .table tbody > tr > td {border-top:1px solid #e5e5e5} .table-list-eb .table thead > tr > th {text-align:center} .table-list-eb thead {border-top:1px solid #e5e5e5;background:#f8f8f8} .table-list-eb tbody {border-bottom:1px solid #e5e5e5} .table-list-eb tfoot {border-bottom:1px solid #e5e5e5;background:#f8f8f8} .table-list-eb td {vertical-align:middle !important} .table-list-eb .user-names span,.table-list-eb .user-names small {display:block;text-align:center} .table-list-eb .user-names span {color:#555;font-size:16px;position:relative} .table-list-eb .user-names small {color:#999;font-size:12px} .table-list-eb td h3 {font-size:14px;margin:0 0 2px;color:#000} .table-list-eb td a {color:#000} .table-list-eb td a:hover {color:#039ee1} .table-list-eb td p {margin-bottom:0;color:#555} .table-list-eb .s-icons {margin-bottom:0} .table-list-eb .s-icons li {padding:2px} .table-list-eb .table-button s{margin:0} .table-list-eb .table-buttons li {padding:0} .table-list-eb .table-buttons .btn-e-sm {padding:3px 6px} .table-list-eb .td-width {width:40%} .table-list-eb .td-width-60 {width:60%} .table-list-eb .td-width-50 {width:50%} .table-list-eb .td-width-40 {width:40%} .table-list-eb .td-width-30 {width:30%} .table-list-eb .td-width-20 {width:20%} .table-list-eb .td-width-10 {width:10%} @media (max-width: 767px){ .table-responsive {border-top:0;border-bottom:0} } /*----- Modal -----*/ .modal-header, .modal-body, .modal-footer {padding:10px} /*----- G5 Captcha -----*/ .vc-captcha {padding:15px 10px 10px;border:1px solid #ddd} .vc-captcha fieldset {padding:0} #captcha #captcha_img {height:62px;border:1px solid #eee;width:158px} #captcha #captcha_key {width:130px;height:62px;border:1px solid #ddd;font-size:24px;line-height:14px;margin-left:34px} #captcha .required,#captcha textarea.required {background:#fff !important} /*----- 회원 레이어팝업 -----*/ .sv_wrap .sv {z-index:998;border:1px solid #ccc;min-width:110px;padding:4px 0;background:#fff} .sv_wrap .sv a{background:#fff;color:#000 !important;padding:3px 12px;font-size:12px;border-bottom:0;display:block;width:110px} .sv_wrap .sv a:hover{background:#f4f4f4} /*----- EXIF INFO -----*/ .exif_info {position:relative;overflow:hidden;border:1px dotted #ddd;padding:5px 10px;background:#fafafa;margin:10px 0} .exif_info ul {list-style:none;margin-bottom:0;-webkit-padding-start:0} .exif_info ul li {display:inline-block;padding:0 8px;font-size:11px;color:#888} .exif_info ul li:before {content:"-";margin-right:5px} /*----- Etc -----*/ fieldset legend{border-bottom:0} .sch_word{color:crimson} /*----- company h1 style css -----*/ /* 레이아웃 */ .main-page > .container {width:100%} .basic-body-main > section {padding:30px 0} .section-gray {background:#F2F2F2} @media (min-width:992px){ .basic-body-main > section {padding:80px 0} } /* 메인 콘텐츠 타이틀 */ .hte-title {position:relative;margin:0 0 20px} .hte-title:before {content:" ";width:100%;position:absolute;height:1px;background:#ddd;display:block;top:50%;z-index:1} .hte-title span, .hte-title span a {display:inline-block;background:#fff;padding:0 10px;z-index:2;color:#bbb;position:relative;margin-left:30px;font-size:18px;;font-weight:600} .hte-title.hte-title-gray span, .hte-title.hte-title-gray span a {background:#F2F2F2;color:#9a9a9a} .hte-title span a {margin-left:0;padding:0} .hte-title span a:hover {color:#6a6a6a} @media (min-width:992px){ .hte-title {margin-bottom:40px} } /* 메인 콘텐츠 */ .tab-h1-type01 {padding:0 15px} .tab-h1-type01 .nav-tabs {border:0 none;margin-top:10px;padding-bottom:10px;border-bottom:1px solid #ddd} .tab-h1-type01 .nav-tabs li a {border:1px solid #9a9a9a;color:#9a9a9a} .tab-h1-type01 .nav-tabs li.active a {font-weight:bold;border-color:#333;color:#333} .tab-h1-type01 .tab-content .img {display:inline-block;width:100%;padding:0 10px 0px 0} .tab-h1-type01 .tab-content .img img {width:100%;height:auto} .tab-h1-type01 .tab-content .content-text h3 {font-size:14px;font-weight:bold} .tab-h1-type01 .tab-content .content-text p {font-size:12px;color:#6a6a6a;margin:0} .tab-h1-type01 .tab-content .content-text p span {display:none} .tab-h1-type01 .tab-content .content-text p a {font-weight:bold;display:inline-block;padding:1px 5px;border-radius:5px !important;background:#eee;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out} .tab-h1-type01 .tab-content .content-text p a:hover {background:#333} @media (min-width:992px){ .tab-h1-type01 .tab-content {width:80%;float:left;overflow:hidden} .tab-h1-type01 .tab-content .img {width:35%;float:left;text-align:right} .tab-h1-type01 .tab-content .content-text {width:60%;float:right;padding:0 20px} .tab-h1-type01 .tab-content .content-text h3 {font-size:18px} .tab-h1-type01 .tab-content .content-text p span {display:inline} .tab-h1-type01 .nav-tabs {width:20%;height:150px;float:right;padding:0 0 0 40px;margin:0;border-bottom:0 none} .tab-h1-type01 .nav-tabs li {display:block;width:100%;margin-bottom:5px} .tab-h1-type01 .nav-tabs li a:hover {color:#6a6a6a;border-color:#6a6a6a;background:none} } @media (min-width:1200px){ .tab-h1-type01 .tab-content .img img {width:auto;height:190px} .tab-h1-type01 .nav-tabs {padding-left:70px} } .section-02-box {margin:10px 0} .section-02 h2 {font-size:16px;font-weight:bold} .section-02 h2 span {display:block;font-size:30px;line-height:30px;font-weight:100;color:#bbb} .section-02 .img {border-bottom:5px solid #bbb} .section-02 h4 {font-size:12px;font-weight:bold;margin-bottom:5px} .section-02 p {font-size:12px;color:#6a6a6a} @media (min-width:992px){ .section-02-box {margin:0} } .btn-tab-h1 {display:none} .tab-h1 {padding:0 15px;position:relative} .tab-h1 .nav {border-bottom:1px solid #6a6a6a} .tab-h1 .nav li a {border:0 none;color:#9a9a9a} .tab-h1 .nav li a:hover {background:none;border:0 none} .tab-h1 .nav li.active a {background:none;border:0 none;color:#333} @media(max-width:767px){ .btn-tab-h1 {display:block} .btn-tab-h1 a {display:block;border:1px solid #ddd;color:#6a6a6a;padding:5px;background:#fff;position:relative} .btn-tab-h1 a i {position:absolute;right:10px;top:5px} .tab-h1 .nav {position:relative;border:1px solid #ddd;z-index:10;width:100%;background:#fff;margin-top:-1px;display:none} .tab-h1 .nav li {width:100%;float:inherit;display:block} } .service-box-h2 {margin-bottom:20px} .service-box-h2 i {display:block;width:100px;height:100px;line-height:98px;text-align:center;margin:0 auto;border-radius:50% !important;border:5px solid #ddd;color:#ddd;font-size:50px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out} .service-box-h2:hover i {border-color:#6a6a6a;color:#6a6a6a} .service-box-h2 h4, .service-box-h2 p {text-align:center} .service-box-h2 h4 span {font-size:14px;font-weight:bold;margin:10px 0;position:relative} .service-box-h2 h4 span:after {content:"";display:block;width:0;height:5px;background:#6a6a6a;position:absolute;left:0;top:100%;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out} .service-box-h2:hover h4 span:after {width:100%} .service-box-h2 p {font-size:12px;color:#9a9a9a} @media (max-width:767px){ .section-04 .col-sm-4:last-child .service-box-h2 {margin-bottom:0} .service-box-h2 i {border-color:#6a6a6a;color:#6a6a6a;width:60px;height:60px;line-height:58px;font-size:30px;border-width:3px} .service-box-h2 h4 span:after {width:100%;height:3px} } /* side layout */ .basic-body-side h3.side-title {margin:0 0 5px;background:#333;color:#eee;text-align:center;padding:15px 0} .sidebar-nav-e1 > li.active, .sidebar-nav-e1 > li.active:hover {border-color:#999} .side-menu-bottom li {margin-bottom:5px} .side-menu-bottom li a {display:block;border:1px solid #828282;padding:5px 10px;color:#828282;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out} .side-menu-bottom li a i{margin-right:5px} .side-menu-bottom li a:hover {background-color:#828282;color:#fff} /* sidebar-nav-e1 */ .list-toggle:after {color:#bbb} .list-toggle.active:after {color:#333} /* pages */ .sub-title {margin:0 0 30px;font-size:18px;border-bottom:1px solid #555} /* --- color set : 컬러셋의 색은 #039ee1 이며 컬러셋의 색상 교체를 원하면 컬러셋 영역 안의 #039ee1 를 원하는 컬러로 변경 --- */ .hte-font-color {color:#039ee1 !important} .hte-border-color {border-color:#039ee1 !important} .hte-bg-color {background-color:#039ee1 !important} a:hover {color:#039ee1} /* 메뉴 - 모바일 */ @media (max-width: 991px) { .header-nav .navbar-nav > li > a:hover, .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {border-top:1px solid #039ee1;color:#039ee1} .header-nav .navbar-nav > .active > a, .header-nav .navbar-nav > .active > a:hover, .header-nav .navbar-nav > .active > a:focus {color:#039ee1 !important} .header-nav .mega-menu .mega-height-list li a:hover {color:#039ee1} } /* 메뉴 - pc */ @media (min-width: 992px) { /*.header-fixed .header-nav.nav-background-light .navbar-nav .active > a, .header-fixed .header-nav.nav-background-light .navbar-nav li > a:hover, .header-fixed .header-nav.nav-background-light .navbar-nav li.open > a {color:#039ee1}*/ } /* 헤더 슬라이더 아이콘 */ @media (min-width: 992px) { .slider-info > ul > .slider-info-sns ul a:hover i {color:#039ee1} } /* 메인 section-02 이미지 밑 라인 및 버튼 */ .btn-section a {display:inline-block;font-weight:bold;border:2px solid #039ee1;color:#039ee1;font-size:12px;padding:5px 10px;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out} .btn-section a:hover {background:#039ee1;color:#fff} .section-02 .img {border-bottom:5px solid #039ee1} /* section-05 아이콘 */ .service-box-h2:hover i {border-color:#039ee1;color:#039ee1} .service-box-h2 h4 span:after {background:#039ee1} @media (max-width:767px){ .service-box-h2 i {border-color:#039ee1;color:#039ee1} } /* breadcrumb */ .board-title .breadcrumb li a:hover {color:#039ee1} /* sidebar-nav-e1 */ .sidebar-nav-e1 ul li:hover a, .sidebar-nav-e1 ul li.active a {color:#039ee1;font-weight:bold} /* footer */ .footer.footer-dark .footer-social-icons li a i, .footer.footer-dark .footer-social-icons li a:hover, .footer.footer-dark .footer-link-list li a i, .footer.footer-dark .footer-link-list li a:hover, .footer.footer-dark .footer-contactus li i, .footer.footer-dark .footer-contactus li a:hover {color:#039ee1} /* --- end of color set --- */ .top_contents {width:100%; height:650px; padding:125px 0 0px; border-radius: 0 0 100px 100px; box-sizing:border-box; background:url('/images/top_contentsbg.jpg') #ddd 90% center; background-size: cover;} @media (max-width: 1600px) { .top_contents { height: 680px; } } /* .top_contents .container .row { height:986px; padding:140px 0 0px; box-sizing:border-box;background:url('/images/top_contentsbg.jpg') top center; background-size: cover; } @media (max-width: 1600px) { .top_contents { height: 980px; background-position: 0 0; background: url('/images/top_contentsbg.jpg') no-repeat top center; padding: 110px 0 0px; } }*/ @media (max-width: 992px) { .top_contents { padding:40px 0; width:100%; height: 1230px; background:#009de0; border-radius: 0 0 10px 10px; } .top_contents .container .row { height:auto; padding:0; background:none; } } .top_contents .col-md-4 {padding: 0 20px;} .top_contents .col-md-4:nth-child(2) {/*border-left:1px solid #e2eaf1; border-right:1px solid #e2eaf1;*/} .top_contents .col-md-4:nth-child(1) {/*padding-left:0;*/} .top_contents .col-md-4:nth-child(3) {/*padding-right:0;*/} @media (max-width: 1200px) { .top_contents .col-md-4 {padding: 0 20px;} } @media (max-width: 992px) { .top_contents .col-md-4 {padding: 0 10px; margin-bottom:30px;} .top_contents .col-md-4:nth-child(2) {border-left:1px solid #039ee1; border-right:1px solid #039ee1; } .top_contents .col-md-4:nth-child(1) {padding-left:10px;} .top_contents .col-md-4:nth-child(3) {padding-right:10px;} } /*top_title*/ h2.top_title {color:#fff; text-align:center; line-height:20px;} h2.top_title p {color:#009de0; font-weight:bold; text-shadow: 1px 0px 0px #565656; font-size:30px; margin-bottom:20px;} h2.top_title span { color:#fff; font-size: 20px; line-height:26px; text-shadow: 1px 0 1px #7d7d7d;} @media (max-width: 1200px) { h2.top_title {} h2.top_title p {font-size:22px; margin-bottom: 10px; color: #fff;} h2.top_title span {font-size: 16px; line-height:14px;} } @media (max-width: 992px) { h2.top_title {line-height:18px;} h2.top_title p {font-size:20px;} h2.top_title span {font-size: 14px; } } /* mv_btn */ .mv_btn { padding-top: 70px; margin: 0 auto; display: table; } .mv_btn a { width: 250px; position: relative; display: inline-block; font-size: 16px; line-height: 20px; font-weight: 900; text-align: left; color: #fff; padding: 14px 30px; border-radius: 2em; border: 1px solid rgba(255,255,255,0.1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0px 1px 5px rgba(28,35,69,0.14); background-color: rgba(255,255,255,0.1); transition: box-shadow 0.1s ease, background-color 0.1s ease; -webkit-transition: box-shadow 0.1s ease, background-color 0.1s ease; } .mv_btn a:after { content: ''; display: inline-block; width: 8px; height: 15px; background: url(/images/arr_btn.png) 0 0 no-repeat; position: absolute; top: 50%; right: 30px; margin-top: -7px; } .mv_btn a:hover { background-color: #fff; color: #039ee1; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0px 8px 16px rgba(28,34,65,0.24); transition: box-shadow 0.2s ease, background-color 0.2s ease; -webkit-transition: box-shadow 0.2s ease, background-color 0.2s ease; } .mv_btn a:hover:after { background-position: -8px 0; } @media (max-width: 992px) { .mv_btn { padding-top: 30px; margin: 0 auto 30px; display: table; } } /* box_apply */ .box_apply { width: 100%; height: 370px; padding: 24px 24px 30px; background: #fff; border-radius: 4px; box-shadow: 0 1px 5px 0 rgba(0,13,57,0.1); margin: 25px auto 0; } .box_apply > ul { margin-top: 1px; } .box_apply > ul > li .inputWrap_st1, .box_apply > ul > li .selectWrap_st1 { margin-top: -1px; } .box_apply li:first-child .inputWrap_st1 input { border-radius: 3px 3px 0 0; } .box_apply li .selectWrap_st1 .sel_txt { border-radius: 0 0 3px 3px; } .box_apply .checksWrap_st1 { margin-top: 12px; } .box_apply .btn { margin-top: 10px; } @media (max-width: 1200px) { .box_apply { width:100%; height: auto; /*margin: 0 10%;*/ padding: 24px 24px 40px; margin: 15px auto 0; } } /* btn_grd */ a.btn_grd, button.btn_grd{display:inline-block;min-width:220px;margin:0 auto;border:0;height:50px;border-radius:100px;background-color:#1976D2;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9f73f1+0,8147ec+100 */ /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#039ee1+0,425ce3+100 */ background: #039ee1; /* Old browsers */ background: -moz-linear-gradient(left, #039ee1 0%, #425ce3 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #039ee1 0%,#425ce3 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #039ee1 0%,#425ce3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#039ee1', endColorstr='#425ce3',GradientType=1 ); /* IE6-9 */ color:#ffffff;font-size:15px;letter-spacing:-0.05em;font-weight:700;line-height:25px;text-align:center;vertical-align:middle;transition:all 0.2s ease;-webkit-transition:all 0.2s ease} a.btn_grd:focus, a.btn_grd:hover, button.btn_grd:focus, button.btn_grd:hover{background-color:#039ee1;box-shadow:0 5px 10px 0 rgba(14,176,205,0.50);} a.btn_grd.w180, button.btn_grd.w180{min-width:180px;padding-left:20px;padding-right:20px} a.btn_grd.w160, button.btn_grd.w160{min-width:160px;padding-left:20px;padding-right:20px} @media (max-width: 1200px) { a.btn_grd, button.btn_grd{min-width:100%;} } /* --- --- --- --- --- --- --- --- --- --- 내차팔기 간편 상담/구입 상담 시작 --- --- --- --- --- --- --- --- --- --- ---*/ .my_car {width:100%; height:212px; background:#fff; border-radius:7px; padding:25px 20px;} .my_car .title {} .my_car .title h3, .my_car .title p {float:left;} .my_car .title h3 {font-size:24px; color:#039ee1; font-weight:bold; letter-spacing:-1px;} .my_car .title p {font-size:16px; margin:0;} /* checksWrap_st1 */ .checksWrap_st1{clear:both; position:relative;text-align:left;} .checksWrap_st1 a{display:inline-block;font-size:13px;line-height:24px;padding:0 12px;right:-5px;background:#fff;border:1px solid #eaeaea;color:#999;border-radius:2px;position:absolute;top:0} .checksWrap_st1 a:hover{background:#f9f9f9} /* -------------------------------------------- * input /* ------------------------------------------ */ [class*="inputWrap_st"] input::-webkit-input-placeholder{color:#bbbbbb} [class*="inputWrap_st"] input:-moz-placeholder{color:#bbbbbb;opacity:1} [class*="inputWrap_st"] input::-moz-placeholder{color:#bbbbbb;opacity:1} [class*="inputWrap_st"] input:-ms-input-placeholder{color:#bbbbbb} [class*="inputWrap_st"] input:placeholder-shown{color:#bbbbbb} /* inputWrap_st1 */ .inputWrap_st1{position:relative;z-index:1} .inputWrap_st1 .tit{position:absolute;top:14px;left:15px;font-size:14px;line-height:20px;white-space:nowrap;color:#2e3092;letter-spacing:0.05em;z-index:10} .inputWrap_st1 input{width:100%;height:78px;padding:36px 15px 14px 15px;font-size:14px;color:#333;line-height:26px;background:#f6f6f6;border:1px solid #eaeaea;letter-spacing:-0.05em} .inputWrap_st1.focus{z-index:10} .inputWrap_st1.focus input, .inputWrap_st1.focus input:hover{background:#fff;color:#1976d2;border:1px solid #2a9ffd;box-shadow:0 1px 5px 0 rgba(28,35,69,0.12);transition:box-shadow 0.2s ease,border-color 0.2s ease;-webkit-transition:box-shadow 0.2s ease,border-color 0.2s ease} .sell .inputWrap_st1 .tit{color:#3D5BDC} .sell .inputWrap_st1.focus input, .sell .inputWrap_st1.focus input:hover{border:1px solid #488ff6;color:#3D5BDC} .buy .inputWrap_st1 .tit{color:#0f82be} .buy .inputWrap_st1.focus input, .buy .inputWrap_st1.focus input:hover{border:1px solid #11b4e3;color:#0f82be} .carPrc .inputWrap_st1 .tit{color:#0593a6} .carPrc .inputWrap_st1.focus input, .carPrc .inputWrap_st1.focus input:hover{border:1px solid #00bac0;color:#0593a6} /* -------------------------------------------- * select /* ------------------------------------------ */ .selectWrap_st1{position:relative} .selectWrap_st1 .tit{position:absolute;top:14px;left:20px;font-size:13px;line-height:20px;white-space:nowrap;color:#039ee1;letter-spacing:0.05em;z-index:10} .selectWrap_st1 .sel_txt{width:100%;height:60px;border-radius:7px;position:relative;font-size:14px;padding:18px 10px 9px 18px;color:#333;line-height:26px;background:#fff;border:1px solid #eaeaea;letter-spacing:-0.05em;display:block;text-align:left;z-index:1} .selectWrap_st1 .sel_txt:after{content:'';display:inline-block;width:10px;height:6px;background:url("../_img/arr_select.png") no-repeat 0 0;position:absolute;top:46px;right:30px} .selectWrap_st1 select{width:100%;height:100%;-webkit-appearance:none;cursor:pointer;position:absolute;top:0;left:0;z-index:2;opacity:0;filter: alpha(opacity=0);-moz-opacity:0} .selectWrap_st1.focus{z-index:10} .selectWrap_st1.focus .sel_txt, .selectWrap_st1.focus .sel_txt:hover{background:#fff;color:#1976d2;border:1px solid #2a9ffd;box-shadow:0 1px 5px 0 rgba(28,35,69,0.12);transition:box-shadow 0.2s ease,border-color 0.2s ease;-webkit-transition:box-shadow 0.2s ease,border-color 0.2s ease} @media (max-width: 1200px) { .my_car { padding: 26px 20px } .my_car .title p { margin:0; } } @media (max-width: 992px) { .my_car { height: auto; } .inputWrap_st1 input { margin-bottom:10px; } } @media (max-width: 992px) { .btn_class { margin-top: 20px; } a.btn_grd, button.btn_grd { height: 50px; } } /* --- --- --- --- --- --- --- --- --- --- 내차팔기 간편 상담/구입 상담 끝 --- --- --- --- --- --- --- --- --- --- ---*/ /* list_roll */ .list_roll { float: right; width: 100%; /*margin: 0 auto;*/ position: relative; } .list_roll ul { position: absolute; margin: 0px; padding: 0px; width: 100%; /*top: -55.1285px;*/ } .list_roll li { cursor: pointer; margin: 0px; padding: 0px; height: 52px; margin-bottom:5px; } .list_roll dl { width: 100%; height: 50px; position: relative; display: block; text-align: left; padding: 11px 20px; border-radius: 3px; overflow: hidden; box-shadow: 0px 1px 5px rgba(28,35,69,0.14); background-color: rgba(255,255,255,0.1); transition: box-shadow 0.1s ease, background-color 0.1s ease; -webkit-transition: box-shadow 0.1s ease, background-color 0.1s ease; } .list_roll dl dt, .list_roll dl dd { font-size: 16px; line-height: 18px; color: #fff; display: inline-block; } .list_roll dl dt { max-width: 245px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: lighter; } .list_roll dl dt span.icon { width: 38px; height: 20px; display: inline-block; text-indent: -99999999em; overflow: hidden; margin-right:8px; background: url("/images/ico_new.png") no-repeat 0 0; -webkit-background-size: 38px 20px; background-size: 38px 20px; position: relative; top: 3px; } .list_roll dl dd { float: right; text-align: right; position: relative; top: 5px; } @media (max-width: 1200px) { .list_roll {width: 100%;} .list_roll dl dt { max-width: 190px; } } @media (max-width: 992px) { .list_roll dl dt { max-width: 230px; } .list_roll dl dt, .list_roll dl dd { font-size: 14px; } .list_roll li { margin-bottom: 7px; } } /* -------------------------------------------- * main_count /* ------------------------------------------ */ .sell { position:relative; /*margin-top: -115px;*/ } .main_count { clear: both; padding: 30px 0; height: 240px; } .main_count ul { padding: 0; } .main_count li { /*width: 33.333333%; float: left;*/ text-align: center; } .main_count .mc_total .col-md-4 { border-left: 1px solid #ccc; border-right: 1px solid #ccc; } .main_count li .tit { font-size: 18px; line-height: 1; font-weight: 500; letter-spacing: 0.5px; color: #000; font-family: 'GmarketSansBold'; } .main_count li .count { color: #333; font-size: 60px; line-height: 1; letter-spacing: -0.05em; font-weight: 300; margin: 25px 0 18px; } .main_count li .count span { font-family: 'GmarketSansBold'; } .main_count li.mc_total .count { color: #2e3092; font-weight: bold; } .main_count li .desc { font-size: 18px; line-height: 26px; color: #666; letter-spacing: -0.05em; } @media (max-width: 1600px) { .sell { margin-top: -290px; } } @media (max-width: 992px) { .sell { margin-top: 0px; } .main_count .mc_total .col-md-4 { border-left: 0; border-right: 0; } .main_count { height: auto; padding: 50px 0 0; } .main_count li .count { font-size: 40px; } .main_count li { margin-bottom: 40px; } } /* -------------------------------------------- * 10년 스마일카, 내차팔기는 스마일카가 잘합니다! /* ------------------------------------------ */ .sell_honesty { background:#fff; padding: 30px 0 30px;} .sell_honesty .sell_tit { width:100%; margin:30px auto 50px;} .sell_honesty .sell_tit h3 { margin-bottom:14px; font-size:38px; font-weight:bold; line-height:1.4em; margin:0;} .sell_honesty .sell_tit h3 span {color:#009de0;} .sell_honesty .sell_tit h3:first-child {color:#2e3092;} .sell_honesty .sell_tit h3:last-child {color:#333;} .sell_honesty .sell_tit .desc { margin-top:10px; font-size:18px; color:#888; line-height:1.4em;} .sell_honesty .sell_smile_car {} .sell_honesty .sell_smile_car img {width:80%; float:right; margin-bottom:30px;} .sell_honesty .honesty_step { clear:both; overflow:hidden; padding:0;} .sell_honesty .honesty_step .col-md-3 .box { width:100%; height: 254px; padding:20px; border-radius:5px; border:1px solid #999; } .sell_honesty .honesty_step .col-md-3 .box.cs {background:url('/images/honesty_step_ico1.png') #fff no-repeat; background-position: 90% 90%;} .sell_honesty .honesty_step .col-md-3 .box.free {background:url('/images/honesty_step_ico2.png') #fff no-repeat; background-position: 90% 90%;} .sell_honesty .honesty_step .col-md-3 .box.realtime {background:url('/images/honesty_step_ico3.png') #fff no-repeat; background-position: 90% 90%;} .sell_honesty .honesty_step .col-md-3 .box.end {background:url('/images/honesty_step_ico4.png') #fff no-repeat; background-position: 90% 90%;} .sell_honesty .honesty_step .col-md-3 .subject { height:80px; overflow:hidden;} .sell_honesty .honesty_step .col-md-3 .step { display:inline-block; height:25px; padding:0 10px; background:#2e3092; line-height:25px; color:#fff; font-size:13px; border-radius:13px; vertical-align:middle;} .sell_honesty .honesty_step .col-md-3 strong { margin-top:15px; letter-spacing:-0.5px; font-size:20px; color:#111; line-height:1.4em; display:block;} .sell_honesty .honesty_step .col-md-3 .btn_more { float:right; position:relative; top: -25px; max-width:165px; font-size: 11px; letter-spacing:-0.5px; margin-top:8px; background:transparent; border:0; text-decoration:underline;} .sell_honesty .honesty_step .col-md-3 p { position:relative; clear:both; font-size: 16px; color: #999; padding-right:80px; margin-right:-10px; letter-spacing:-1px; line-height:1.6em;} .sell_honesty .honesty_step .col-md-3 p:after { position:absolute; top:0; right:0; display:block; width:90px; height:65px; content:"";} @media (max-width: 1200px) { .sell_honesty .honesty_step .col-md-3 .box { margin-bottom: 20px; } .sell_honesty .honesty_step .col-md-3 strong { font-size: 16px; } .sell_honesty .honesty_step .col-md-3 .btn_more { float: none; top: -8px; } .sell_honesty .honesty_step .col-md-3 p { padding: 0; font-size: 14px; } .sell_honesty .sell_smile_car img { float:none; margin: 0 auto 30px; } } @media (max-width: 991px) { .sell_tit {margin: 0 auto 20px} .sell_tit h3 {font-size: 20px;} .sell_tit .desc {font-size: 14px;} } /* Image Splite */ .expensive_list li:before, .time_list li:before, .sell_realtime .sell_inner:before, .sell_realtime .sell_inner:after, .sell_honesty .honesty_step li p:after, .sell_cor_document .need, .sell_process .process_step li:after, .sell_process .process_step li:before, .sell_benefit .benefit_list li:before { background-image:url('/resources/images/front/img_sell.png')} /* -------------------------------------------- * main_service_info /* ------------------------------------------ */ .main_service_info { padding: 40px 0; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; height: 245px; } .main_service_info li { float: left; /*margin-left: 20px;*/ } .main_service_info li:first-child { margin-left: 0px; } .main_service_info li a { position: relative; height: 160px; top: 0; display: block; overflow: hidden; padding-top: 45px; line-height: 1; border-radius: 7px; /*box-shadow: 0px 2px 12px 0px rgba(0,13,57,0.1);*/ transition: all 0.2s ease; -webkit-transition: all 0.2s ease; background-color: #fff; background-repeat: no-repeat; background-position: 0 0; } .main_service_info li a:hover, .main_service_info li a:focus { top: -4px; box-shadow: 0px 20px 30px 0px rgba(0,13,56,0.2); transition: all 0.2s ease; -webkit-transition: all 0.2s ease; } .main_service_info li.si1 a { background-image: url(/images/bann_01.jpg); background-position:center center; background-size: cover; } .main_service_info li.si2 a { background-image: url(/images/bann_02.jpg); background-position:center center; background-size: cover; } .main_service_info li.si3 a { background-image: url(/images/bann_03.jpg); background-position:center center; background-size: cover; } .main_service_info li.si4 a { background-image: url(/images/bann_04.jpg); background-position:center center; background-size: cover; } .main_service_info li a h3 { height: 52px; position: absolute; top: 20px; left: 20px; color: #fff; font-weight: bold; } .main_service_info li a p { padding: 40px 18px 13px 18px; font-size: 14px; line-height: 1.4; color: #e9e9e9; width: 300px; } @media (max-width: 1200px) { .main_service_info { height: 250px; } .main_service_info li a { padding-top: 75px; } .main_service_info li a p { padding: 13px 18px 13px; width: auto; } } @media (max-width: 992px) { .main_service_info { height: auto; border-bottom: 0; } .main_service_info li { width: 100%; margin-bottom:20px; } .main_service_info li:last-child { margin-bottom: 0; } .main_service_info li a { padding-top: 45px; } } /* -------------------------------------------- * main_service_info2 /* ------------------------------------------ */ .main_service_info2 { padding: 30px 0; /*border-top: 1px solid #e9e9e9;*/ border-bottom: 1px solid #e9e9e9; } .main_service_info2 ul { margin: 0; } .main_service_info2 li { } .main_service_info2 li:first-child { margin-left: 0px; } .main_service_info2 li a { min-height: 170px; position: relative; top: 0; display: block; overflow: hidden; /*padding-top: 120px;*/ line-height: 1; border-radius: 4px; box-shadow: 0px 2px 12px 0px rgba(0,13,57,0.1); transition: all 0.2s ease; -webkit-transition: all 0.2s ease; background-color: #fff; background-repeat: no-repeat; background-position: 0 0; } .main_service_info2 li a:hover, .main_service_info2 li a:focus { top: -4px; box-shadow: 0px 20px 30px 0px rgba(0,13,56,0.2); transition: all 0.2s ease; -webkit-transition: all 0.2s ease; } .main_service_info2 li.si1 a { background-image: url(/images/service_info1.jpg); background-size: contain;} .main_service_info2 li.si2 a { background-image: url(/images/service_info2.jpg); background-size: contain;} .main_service_info2 li.si3 a { background-image: url(/images/service_info3.jpg); background-size: contain;} .main_service_info2 li.si4 a { background-image: url(/images/service_info4.jpg); background-size: contain;} .main_service_info2 li a h3 { height: 52px; position: absolute; top: 20px; left: 20px; } .main_service_info2 li.si1 a h3 { background-position: 0 -232px; width: 97px; } .main_service_info2 li.si2 a h3 { background-position: 0 -284px; width: 140px; } .main_service_info2 li.si3 a h3 { background-position: 0 -336px; width: 124px; } .main_service_info2 li.si4 a h3 { background-position: 0 -388px; width: 165px; } .main_service_info2 li a p { padding: 13px 10px 5px; font-size: 13px; line-height: 1.4; color: #555; letter-spacing:-1px; text-align: center; } @media (max-width: 1200px) { .main_service_info2 li a { /*padding-top:90px; height: 150px;*/ } } @media (max-width: 992px) { .main_service_info2 {padding: 20px 0;} /*.main_service_info2 li.si1 a { background-size: 100% 130px; } .main_service_info2 li.si2 a { background-size: 100% 130px; } .main_service_info2 li.si3 a { background-size: 100% 130px; } .main_service_info2 li.si4 a { background-size: 100% 130px; }*/ .main_service_info2 li { padding: 0 10px; margin-bottom: 20px; height: auto; } .main_service_info2 li a { min-height: auto; /*padding-top:130px;*/ } } /* footer_banner */ .footer_banner { clear:both; border-top: 1px solid #ddd; /*padding: 40px 0; height: 300px;*/ } .footer_banner li { /*width: 280px;*/ float: left; } .footer_banner li:first-child { margin-left: 0; } .footer_banner li h3 { position: relative; padding: 11px 0 11px 0px; margin: 0 0 20px; font-size: 18px; } .footer_banner li h3:before { content: ''; width: 40px; height: 40px; position: absolute; top: 0; left: 0; } .footer_banner li h3 span { height: 18px; font-weight: bold; } .footer_banner li.fb1 dl {margin:0; float:left;} .footer_banner li p { color: #555; margin: 0; } .footer_banner li p.txt { font-size: 14px; line-height: 22px; color: #888; margin-top: 25px; letter-spacing: -0.05em; } .footer_banner li p.tel { line-height: 34px; font-weight:bold; color: #333; } .footer_banner li p.kakao { font-size: 32px; line-height: 34px; font-weight:bold; color: #2e3092; } .footer_banner li.fb1 dl dd { position: relative; padding: 1px 0 1px 8px; } .footer_banner li.fb1 dl dd a { display: inline-block; color: #555; font-size: 14px; line-height: 20px; max-width: 310px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .footer_banner li.fb1 dl dd a:hover { color: #1e88e5; } .footer_banner li.fb4 { margin:10px 0px 0 0; } @media (max-width: 1200px) { .footer_banner li h3 { margin: 0 0 10px; } .footer_banner li.fb4 { margin:10px 0 0 -5px; } .footer_banner li.fb1 dl dd a { max-width: 220px; } .footer_banner li p.tel { margin-top: 22px; } .footer_banner li p.txt { margin-top: 30px; } .footer_banner li p.kakao { font-size: 30px; margin-top: 20px; } } @media (max-width: 992px) { .footer_banner { margin: 0 20px; height: auto; border-top: 0; } .footer_banner li { width:100%; } .footer_banner li p.txt { margin-top:20px; } .footer_banner li.fb1, .footer_banner li.fb2, .footer_banner li.fb3 { border-bottom:1px solid #ddd; width:100%; padding: 15px; margin-bottom:20px; } .footer_banner li.fb1 dl dd a { max-width: 100%; } .footer_banner li.fb4 {/*margin:10px 0 30px -5px;*/ margin:0;} .footer_banner li.fb4 .text .btn { margin:5px 0 0 -12px; clear:both; display: block; width: 100px; } } /* footer_banner */ .footer_banner .container { padding: 40px 0; /*border-top: 1px solid #e9e9e9;*/ } .footer_banner li { } .footer_banner li:first-child { margin-left: 0; } .footer_banner li h3 { position: relative; padding: 5px 0 11px 50px; margin-bottom: 20px; } .footer_banner li h3:before { content: ''; width: 34px; height: 34px; position: absolute; top: 0; left: 0; } .footer_banner li.fb1 h3:before { background-position: 0 -64px; background:url('/images/bottom_ico1.png');} .footer_banner li.fb2 h3:before { background-position: -40px -64px; background:url('/images/bottom_ico2.png');} .footer_banner li.fb3 h3:before { background-position: -80px -64px; background:url('/images/bottom_ico3.png');} .footer_banner li h3 span { height: 18px; } .footer_banner li.fb1 h3 span { background-position: 0 0; width: 104px; } .footer_banner li.fb2 h3 span { background-position: 0 -18px; width: 63px; } .footer_banner li.fb3 h3 span { background-position: 0 -36px; width: 134px; } footer_banner li p { color: #555; } .footer_banner li p.txt { font-size: 14px; line-height: 22px; color: #888; margin-top: 8px; letter-spacing: -0.05em; } .footer_banner li p.tel { font-size: 32px; line-height: 34px; color: #009de0; } .footer_banner li p.kakao { font-size: 30px; line-height: 34px; font-weight: 700; } .footer_banner li.fb1 dl { width: 100%; position: relative; display: block; text-align: left; height: 30px; } .footer_banner li.fb1 dl dd { position: relative; padding: 1px 0 1px 8px; } .footer_banner li.fb1 dl dt { max-width: 218px; float: left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: lighter; } .footer_banner li.fb1 dl dd { float: right; text-align: right; font-weight: 700; position: relative; } .footer_banner li .img_awards a { display: block; /*width: 100%; height: 125px; /*background: url(/images/bottom_bann.jpg) no-repeat center center;*/ } .footer_banner .listInfo {padding: 0;} .footer_banner .listInfo li {font-weight:400; color:#666; line-height:30px; font-size: 14px; word-wrap:break-word; word-break:keep-all; padding-left: 20px;} .footer_banner .listInfo li:before { position:absolute; float:left; content:''; width:3px; height:3px; background-color:#666; margin:5px 15px 0 -15px; vertical-align:middle; display:inline-block; } @media (max-width: 1200px) { .footer_banner li.fb1 dl dt { width: 158px; } .footer_banner li p.tel { font-size: 26px; } .footer_banner li .img_awards a { height: 130px; background-size: cover; background-position: left 3%; } } @media (max-width: 992px) { .footer_banner .container { padding: 20px 0; } .footer_banner li .img_awards a { background-size: cover; height: 145px; } } .scroll_logo {display:none;} .scroll { height: 90px; /*background: #fff;*/ text-align: center; position: fixed; top: 0; left: 0; right: 0; z-index: 9999; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } .scroll .mega-menu .container .navbar-collapse .nav li a{color:#000;}