@charset "utf-8"; 

html { word-break:keep-all; } 

/* header */
.header { position: absolute; width: 100%; height: 100px; background-repeat: no-repeat; background-position: center center; background-size: cover; box-sizing: border-box; z-index: 9; } 

.header > .gnb_web_area { position: absolute; top:0; left:0; width: 100%; height: 100px; overflow: hidden; 
-webkit-transition:height 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:height 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1), transform 0.5s cubic-bezier(0, 0, 0.25, 1); 
 } 
.header > .gnb_web_area > .gnb_bg { position: absolute; top:100px; left:0; width: 100%; height: 0; background-color: #fff; -webkit-transition:height 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:height 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); } 
.header > .gnb_web_area.active > .gnb_bg:before { content: ""; position: absolute; bottom:-15px; left:0; display: block; width: 100%; height: 15px; background: url("/web2019/images/common/bg_header_line.png") repeat-x 0 0; } 
.header > .gnb_web_area.active > .gnb_bg:after { content: ""; position: absolute; bottom:0; right: 130px; display: block; width: 166px; height: 200px; background: url("/web2019/images/common/bg_header_1.jpg") no-repeat 0 0; -webkit-transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); opacity: 0; } 
.header > .gnb_web_area:before { content: ""; position: absolute; top:99px; left:0; display: block; width: 100%; height: 1px; background-color: #fff; z-index: 2; opacity:0.2; } 
.header > .gnb_web_area ul li a { font-family: "NanumGothic"; color:#fff; } 
.header > .gnb_web_area > h1 { position: relative; float:left; display: block; width:15%; min-width: 110px; height: 99px; } 
.header > .gnb_web_area > h1 > .logo { position: absolute; top:50%; left:50%; display: block; width: 128px; height: 70px; margin-left:-50px; margin-top:-35px; background: url("/web2019/images/common/logo_w.png") no-repeat center center; } 
.header > .gnb_web_area > h1 > .logo em { position: absolute; top:0; left:0; width: 0; height: 0; overflow: hidden; opacity: 0; } 
.header > .gnb_web_area > .gnb { float:left; } 
.header > .gnb_web_area > .gnb ul.dep1 { position:relative; margin:0 -23px; } 

.header > .gnb_web_area > .gnb ul.dep1 > li { position: relative; padding:0 10px; line-height: 99px; } 
.header > .gnb_web_area > .gnb ul.dep1 > li:after { content: ""; position: absolute; top:42px; left:0; display: block; width: 1px; height: 20px; margin-left:-2px; background-color: #fff; } 
.header > .gnb_web_area > .gnb ul.dep1 > li:first-child:after { display: none; } 
.header > .gnb_web_area > .gnb ul.dep1 > li > a { display: block; font-size:20px; font-weight: bold; color:#fff; height: 100px; box-sizing: border-box; letter-spacing: 0; text-align:center; } 
.header > .gnb_web_area > .gnb ul.dep1 > li > a:hover,
.header > .gnb_web_area > .gnb ul.dep1 > li > a.hover,
.header > .gnb_web_area > .gnb ul.dep1 > li > a.active { border-bottom:4px solid #40ae49; color:#40ae49 !important; } 

.header > .gnb_web_area.active { height: 460px; z-index: 13; -webkit-transition:height 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:height 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1), transform 0.5s cubic-bezier(0, 0, 0.25, 1); } 
.header > .gnb_web_area.active > .gnb_bg { top:0; height: 444px; -webkit-transition:height 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:height 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); } 
.header > .gnb_web_area.active > .gnb_bg:after { opacity: 1; } 
.header > .gnb_web_area.active:before { background-color: #eeeeee; opacity:1; } 
.header > .gnb_web_area.active > h1 > .logo { background-image: url("/web2019/images/common/logo_b.png"); } 
.header > .gnb_web_area.active > .gnb ul.dep1 > li > a { color:#333333; } 
.header > .gnb_web_area.active > .gnb ul.dep1 > li:after { background-color: #d1d1d1; } 

.header > .gnb_web_area > .gnb ul.dep2 { position:relative; padding-top:29px; } 
.header > .gnb_web_area > .gnb ul.dep2 > li { position: relative; line-height: 40px; } 
.header > .gnb_web_area > .gnb ul.dep2 > li > a { display: block; font-size:16px; color:#333333; padding:8px 0; height: 40px; line-height: 24px; box-sizing: border-box; } 
.header > .gnb_web_area > .gnb ul.dep2 > li > a:hover,
.header > .gnb_web_area > .gnb ul.dep2 > li > a.hover,
.header > .gnb_web_area > .gnb ul.dep2 > li > a.active { color:#40ae49 !important; } 

.header > .gnb_web_area > .gnb ul.dep3 { position:relative; padding-bottom:9px; } 
.header > .gnb_web_area > .gnb ul.dep3 > li { position: relative; line-height: 24px; } 
.header > .gnb_web_area > .gnb ul.dep3 > li > a { display: block; font-size:14px; color:#999999; padding:3px 0; line-height: 18px; box-sizing: border-box; } 
.header > .gnb_web_area > .gnb ul.dep3 > li > a:hover,
.header > .gnb_web_area > .gnb ul.dep3 > li > a.hover,
.header > .gnb_web_area > .gnb ul.dep3 > li > a.active { color:#40ae49 !important; } 

.header > .gnb_web_area > .right_line { content: ""; position: absolute; top: 42px; left: 0; display: block; width: 1px; height: 20px; margin-left: -2px; background-color: #fff; } 
.header > .gnb_web_area > .right_zone { position: absolute; top:0; right:3%; height: 100px; font-weight:bold; height: 442px; box-sizing: border-box; } 
.header > .gnb_web_area > .right_zone > .info { float:left; } 
.header > .gnb_web_area > .right_zone > .info ul { position:relative; padding:0 10px 0 20px; height: 100px; line-height: 99px; } 
.header > .gnb_web_area > .right_zone > .info ul li { position: relative; padding:0 10px; } 
.header > .gnb_web_area > .right_zone > .info ul .dep2 { margin-top:20px; margin-left:-20px; font-weight:normal; } 
.header > .gnb_web_area > .right_zone > .info ul .dep2 > li { display: block; font-size:14px; color:#999999; padding:3px 0; line-height: 30px; box-sizing: border-box; } 
.header > .gnb_web_area > .right_zone > .info ul .dep2 > li a:hover,
.header > .gnb_web_area > .right_zone > .info ul .dep2 > li a:active { color:#40ae49 !important; } 
.header > .gnb_web_area > .right_zone > .info ul li a { display: block; font-size:13px; color:#fff; } 
.header > .gnb_web_area > .right_zone > .info ul li a:hover { color:#40ae49 !important; } 
.header > .gnb_web_area.active > .right_zone > .info ul li a { color:#333; } 

.header > .gnb_web_area > .right_zone > .global { float:left; padding-right:10px; } 
.header > .gnb_web_area > .right_zone > .global ul { position:relative; display: inline-block; width: 0; height: 100px; overflow: hidden; margin-left:21px; -webkit-transition:width 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:width 0.2s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); } 
.header > .gnb_web_area > .right_zone > .global ul:before { content: ""; position: absolute; top:50%; left:0; display: block; width: 1px; height: 11px; margin-top:-6px; background-color: rgba(255, 255, 255, 0.2); } 
.header > .gnb_web_area > .right_zone > .global ul li { position: relative; padding:0 6px; height: 100px; line-height: 99px; white-space:nowrap; } 
.header > .gnb_web_area > .right_zone > .global ul li a { display: block; font-size:16px; color:#fff; } 
.header > .gnb_web_area > .right_zone > .global ul li a:hover,
.header > .gnb_web_area > .right_zone > .global ul li.on a { color:#00aeef !important; } 
.header > .gnb_web_area.active > .right_zone > .global ul li a { color:#333; } 

.util { position:absolute; top:0; right:0; margin-left:-550px; } 
.util>div { float:left; text-align:center; background-color:rgba(255, 255, 255, 0.5); } 
.util>div>a { display: inline-block; color:#fff; height:28px; } 

.util .link_reservation { padding:0 33px 0; line-height:26px; background-color:#2f3b3f; font-size:12px; } 
.util .language>a { position:relative; width:70px; height:26px; border:1px solid #2f3b3f; color:#666; font-size:11px; line-height:26px; } 
.util .language>a.lang_default { background:url('/web2019/images/icons/arrow_down.png') no-repeat 50px center; } 
.util .language>a.lang_other { display:none; height:25px; border-top:none; } 
.util .language>a.lang_other:hover, .util .language>a.lang_other:focus { background-color:#333; } 

.header > .gnb_web_area > .right_zone > .global > a.btn_global { margin-top:39px; display: block; float:right; width: 19px; height: 19px; text-indent: -999em; background: url("http://www.hls.co.kr/assets/user/assets/images/icons/icon_earth.png") no-repeat 0 0; overflow: hidden; } 
.header > .gnb_web_area > .right_zone > .global.active ul { width: 100px; padding-left:15px; padding-right:15px; } 
.header > .gnb_web_area > .right_zone > .global > a.btn_global:hover,
.header > .gnb_web_area > .right_zone > .global.active > a.btn_global { background-image: url("http://www.hls.co.kr/assets/user/assets/images/icons/icon_earth_h.png") !important; } 
.header > .gnb_web_area.active > .right_zone > .global > a.btn_global { background-image: url("http://www.hls.co.kr/assets/user/assets/images/icons/icon_earth_b.png") } 
.header > .gnb_web_area.active > .right_zone > .global ul:before { background-color: rgba(0,0,0,0.2); } 

.header > .gnb_web_area .sub_menu { float:left; position: relative; padding-top:100px; margin-left:103px; } 
.header > .gnb_web_area .sub_menu .menu_area { position: relative; padding-left:76px; padding-top:29px; height: 344px; border-left:1px solid #eeeeee; box-sizing: border-box; } 
.header > .gnb_web_area .sub_menu ul.dep1 { display: block; float:left; margin-left:65px; } 
.header > .gnb_web_area .sub_menu ul.dep1:first-child { margin-left:0; } 
.header > .gnb_web_area .sub_menu ul.dep1 > li { position: relative; } 
.header > .gnb_web_area .sub_menu ul.dep1 > li > a { display: block; font-size:16px; color:#333333; padding:8px 0; line-height: 24px; box-sizing: border-box; } 
.header > .gnb_web_area .sub_menu ul.dep1 > li > a:hover,
.header > .gnb_web_area .sub_menu ul.dep1 > li > a.hover,
.header > .gnb_web_area .sub_menu ul.dep1 > li > a.active { color:#00aeef !important; } 

.header > .gnb_web_area .sub_menu ul.dep2 { position:relative; padding-bottom:9px; } 
.header > .gnb_web_area .sub_menu ul.dep2 > li > a { display: block; font-size:14px; color:#999999; padding:3px 0; line-height: 18px; box-sizing: border-box; } 
.header > .gnb_web_area .sub_menu ul.dep2 > li > a:hover,
.header > .gnb_web_area .sub_menu ul.dep2 > li > a.hover,
.header > .gnb_web_area .sub_menu ul.dep2 > li > a.active { color:#00aeef !important; } 

@media all and (min-width:0px) and (max-width:1290px) { 
.header > .gnb_web_area.active > .gnb_bg:after { display: none; } 
.header > .gnb_web_area .sub_menu { margin-left:50px; } 
.header > .gnb_web_area .sub_menu .menu_area { padding-left:35px; } 
.header > .gnb_web_area .sub_menu ul.dep1 { margin-left:20px; } 
.areas .search { display: none; } 

.util { position:absolute; top:0px; right:150px; margin-left:0px; line-height:55px; } 
.util .link_reservation { padding:0 15px; line-height:55px; background-color:#2f3b3f; font-size:12px; height: auto; } 
.menu .typeahead { width: 396px; padding: 12px !important; font-size: 14px !important; } 
 } 
@media all and (min-width:861px) and (max-width:1280px) { 

.header > .gnb_web_area > .gnb ul.dep1 { margin:0 -23px; } 
.header > .gnb_web_area > .gnb ul.dep1 > li { padding:0 23px; } 
.header > .gnb_web_area > .right_zone > .info ul { margin:0 -7px; } 
.header > .gnb_web_area > .right_zone > .info ul li { position: relative; padding:0 7px; } 
.header > .gnb_web_area > .right_zone > .global ul { margin-left:11px; } 
.header > .gnb_web_area > .right_zone > .global.active ul { width: 52px; padding:0 7px; } 
.header > .gnb_web_area > .right_zone > .global ul li { padding:0 3px; } 
.header > .gnb_web_area > .right_zone { right:25px; } 
 } 
@media all and (min-width:821px) and (max-width:1200px) { 
.header > .gnb_web_area .sub_menu { margin-left:0; float:none; position: absolute; top:0; right:25px; } 
.header > .gnb_web_area .sub_menu .menu_area { padding-left:20px; } 
 } 
@media all and (min-width:821px) and (max-width:1050px) { 
.header > .gnb_web_area .sub_menu ul.dep1:last-child { float:none; position: absolute; top:129px; right:0; } 
 } 
@media all and (min-width:769px) and (max-width:820px) { 
.header > .gnb_web_area .sub_menu ul.dep1 { position: relative; float:none; margin-left:0; } 
.header > .gnb_web_area .sub_menu ul.dep1 > li > a { padding:6px 0; } 
 } 
@media all and (min-width:769px) and (max-width:920px) { 
.header > .gnb_web_area > h1 { width: 120px; } 
.header > .gnb_web_area > .gnb ul.dep1 { margin:0 -12px; } 
.header > .gnb_web_area > .gnb ul.dep1 > li { padding:0 12px; } 
.header > .gnb_web_area > .gnb ul.dep2 > li > a > em { display: block; } 
.header > .gnb_web_area > .gnb ul.dep3 > li > a > em { display: block; margin-left:7px; } 
.header > .gnb_web_area > .right_zone > .info ul { margin:0 -7px; } 
.header > .gnb_web_area > .right_zone > .info ul li { position: relative; padding:0 7px; } 
.header > .gnb_web_area > .right_zone { right:12px; } 
 } 
.header > .gnb_mobile_area { display: none; height: 55px; border-bottom:1px solid rgba(255, 255, 255, 0.2); } 
.header > .gnb_mobile_area > h2 { position: absolute; top:0; left:0; display: block; width:70px; height: 55px; } 
.header > .gnb_mobile_area > h2 > .logo { display: block; width: 70px; height: 55px; background: url("/web2019/images/common/logo_w.png") no-repeat center center; background-size: 50px 30px; } 
.header > .gnb_mobile_area > h2 > .logo em { position: absolute; top:0; left:0; width: 0; height: 0; overflow: hidden; opacity: 0; } 
.header > .gnb_mobile_area > a.btn_gnb { position: absolute; top:0; right:0; display: block; width: 75px; height: 55px; background: url("/web2019/images/icons/icons.png") no-repeat center center; background-size: 500px auto; background-position: 0 0; } 
.header > .gnb_mobile_area > a.btn_gnb em { position: absolute; top:0; left:0; width: 0; height: 0; overflow: hidden; opacity: 0; } 

/* header mobile */
@media all and (max-width:1290px) { 
.header > .gnb_web_area { display: none; } 
.header > .gnb_web_area:before { display: none; } 
.header > .gnb_mobile_area { display: block; } 
 } 

/* */
.gnb_modal { visibility:hidden; opacity:0; position:fixed; top:0; bottom:0; left:0; right:0; z-index:11; background-color:rgba(0,0,0,.4); -webkit-transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1) 0.4s, visibility 0s cubic-bezier(0.9, 0, 0, 0.9) 0.7s; transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1) 0.4s, visibility 0s cubic-bezier(0.9, 0, 0, 0.9) 0.7s; } 
.show_gnb .gnb_modal { opacity:1; visibility:visible; -webkit-transition-delay:0s; transition-delay:0s; } 
/* */
.nav_gnb { opacity:0; visibility:hidden; position:fixed; right:0; top:0; box-sizing:border-box; max-width:460px; width:100%; height:100%; z-index:12; overflow:hidden; -webkit-transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1) 1s, visibility 0s cubic-bezier(0, 0, 0.25, 1) 1s, transform 0.5s cubic-bezier(0, 0, 0.25, 1); transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1) 1s, visibility 0s cubic-bezier(0, 0, 0.25, 1) 1s, transform 0.5s cubic-bezier(0, 0, 0.25, 1); -ms-transform:translateX(100%); -webkit-transform:translateX(100%); transform:translateX(100%); transform:translate3d(100%,0,0); background-color: #fff; } 
.show_gnb .nav_gnb { opacity:1; visibility:visible; -webkit-transition-delay:0s; transition-delay:0s; -ms-transform:translateX(0); -webkit-transform:translateX(0); transform:translateX(0); transform:translate3d(0,0,0); } 

.nav_gnb { font-family: "NanumGothic"; letter-spacing: 0; padding-bottom:83px; box-sizing: border-box; } 
.nav_gnb .head { position: relative; height: 55px; border-bottom:1px solid #eeeeee; } 
.nav_gnb .head .logo { position: absolute; top:0; left:0; width: 90px; height: 55px; text-indent: -999em; background: url("/web2019/images/common/logo_m_b.png") no-repeat center center; background-size: 50px 30px; } 
.nav_gnb .head .btns { position: absolute; top:0; right:0; padding-right:60px; height: 55px; } 
.nav_gnb .head .btns .btn_gnb_close { position: absolute; top:0; right:0; width: 50px; height: 55px; background: url("/web2019/images/icons/icons.png") no-repeat -75px 0; background-size: 500px auto; text-indent: -999em; } 
.nav_gnb .head .btns .btn_lang { display: inline-block; padding:0 7px; height: 55px; line-height: 55px; font-size:13px; color:#999; font-weight: normal; } 
.nav_gnb .head .btns .btn_lang.on { color:#00aeef; } 

.nav_gnb .scroller .ftscroller_y { -webkit-transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); } 
.nav_gnb .menus { } 
.nav_gnb .menu { padding:20px 20px 14px; } 
.nav_gnb .menu ul.dep1 > li > a { position: relative; display: block; padding:14px 0; font-size:22px; line-height: 32px; color:#333333; } 
.nav_gnb .menu ul.dep1 > li > a:before { content: ""; position: absolute; top:17px; right:1px; display: block; width: 30px; height: 30px; background: url("/web2019/images/icons/icons.png") no-repeat -125px 0; background-size: 500px auto; } 
.nav_gnb .menu ul.dep1 > li.active > a { color:#00aeef; } 
.nav_gnb .menu ul.dep1 > li.active > a:before { background-position: -155px 0; } 

.nav_gnb .menu ul.dep2 { display: none; border-top:4px solid #00aeef; background-color: #f4f4f4; padding:4px 20px; margin-bottom:16px; } 
.nav_gnb .menu ul.dep2 > li > a { position: relative; display: block; padding:9px 0; font-size:15px; line-height: 23px; color:#666666; border-top:1px solid #f1f1f1; } 
.nav_gnb .menu ul.dep2 > li > a.menuPlus:after { content: ""; position: absolute; top:7px; right:1px; display: block; width: 30px; height: 30px; background: url("/web2019/images/icons/icons.png") no-repeat -185px 0; background-size: 500px auto; } 
.nav_gnb .menu ul.dep2 > li.active > a { font-weight: bold; } 
.nav_gnb .menu ul.dep2 > li.active > a.menuPlus:after { background-position: -215px 0; } 
.nav_gnb .menu ul.dep2 > li:first-child > a { border-top:none; } 
.nav_gnb .menu ul.dep2 > li.active > a,
.nav_gnb .menu ul.dep2 > li > a:foucs,
.nav_gnb .menu ul.dep2 > li > a:hover { font-weight: bold; } 
.nav_gnb .menu ul.dep3 { padding-bottom:10px; } 
.nav_gnb .menu ul.dep3 > li > a { position: relative; display: block; padding:0 10px; font-size:13px; line-height: 23px; height: 25px; color:#999999; border-top:1px solid #f1f1f1; } 
.nav_gnb .menu.menuSub { padding-top:0; margin-bottom:30px; } 

.nav_gnb .nav_foot { position: absolute; bottom:0; left:0; width: 100%; height: 73px; z-index:1; background-color: #003591; } 
.nav_gnb .nav_foot ul li { display: block; float:left; width: 33.333%; padding-top:3px; } 
.nav_gnb .nav_foot ul li a { position: relative; display: block; width: 100%; height: 70px; padding-top:32px; background-color: #003591; text-align: center; box-sizing: border-box; } 
.nav_gnb .nav_foot ul li a em { font-size:13px; line-height: 23px; color:#fff; text-transform:uppercase; } 
.nav_gnb .nav_foot ul li a:after { content: ""; position: absolute; top:15px; left:50%; display: block; background-image: url("/web2019/images/icons/icons.png"); background-repeat: no-repeat; background-size: 500px auto; } 
.nav_gnb .nav_foot ul li a.btn_01:after { width: 15px; height: 11px; margin-left:-7px; background-position: -140px -35px; } 
.nav_gnb .nav_foot ul li a.btn_02:after { width: 15px; height: 14px; margin-top:-2px; margin-left:-7px; background-position: -170px -35px; } 
.nav_gnb .nav_foot ul li a.btn_03:after { width: 10px; height: 16px; margin-top:-3px; margin-left:-5px; background-position: -200px -35px; } 

/** container **/
.content { position: relative; width: 100%; } 
.ani { -webkit-transition:all 0.4s cubic-bezier(0, 0, 0.25, 1); transition:all 0.4s cubic-bezier(0, 0, 0.25, 1); } 

/** 서브 네비게이션 WEB **/
.web_snb { position: relative; width: 100%; height: 60px; background-color: #003591; z-index: 1; font-family: "Noto Sans"; } 
.web_snb.active { position: fixed; } 
.web_snb .tbox { width: 100%; max-width: 1200px; margin:0 auto; display: table; } 
.web_snb .tbox li { display: table-cell; height: 60px; line-height: 60px; text-align: center; vertical-align: center; font-size:18px; color:#fff; border-right:1px solid #305aa4; } 
.web_snb .tbox li:first-child { border-left:1px solid #305aa4; } 
.web_snb .tbox.tbox_02 li { width: 50%; } 
.web_snb .tbox.tbox_03 li { width: 33.333%; } 
.web_snb .tbox.tbox_04 li { width: 25%; } 
.web_snb .tbox.tbox_05 li { width: 20%; } 
.web_snb .tbox li.on { background-color: #fff; color:#003591; border:none; } 
.web_snb .tbox li a { display: block; } 

/** 서브 네비게이션 모바일 **/
.mobile_snb { display: none; font-family: "NanumGothic"; } 
.mobile_snb .box { width: 50%; float:left; height: 45px; background-color: #fff; } 
.mobile_snb .box.dep1 { background-color: #003591; } 
.mobile_snb .dropLst .txt, .mobile_snb .dropLst li span, .mobile_snb .dropLst li a { padding-left:20px; width:100%; height: 45px; line-height: 45px; font-size:14px; border:none; z-index: 99; } 
.mobile_snb .box .dropLst .txt { padding-right:40px; color:#003591; } 
.mobile_snb .box .dropLst .txt:before { content: ""; position: absolute; top:50%; right:20px; display: block; width: 11px; height: 8px; margin-top:-4px; background: url("/web2019/images/icons/icons.png") no-repeat -230px -35px; background-size: 500px auto; -webkit-transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); } 
.mobile_snb .box .dropLst .txt.on:before { -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } 
.mobile_snb .box .dropLst ul { padding:10px 0; } 
.mobile_snb .box.dep1 .dropLst ul,
.mobile_snb .box.dep1 .dropLst ul li { background-color: #003591; } 
.mobile_snb .box.dep1 .dropLst li .value { color:#fff; } 
.mobile_snb .box.dep1 .dropLst li .value.on { color:#00aeef; } 
.mobile_snb .box.dep1 .dropLst .txt { color:#fff; } 
.mobile_snb .box.dep1 .dropLst .txt:before { background-position: -215px -35px } 
.mobile_snb .box.dep2 .dropLst ul,
.mobile_snb .box.dep2 .dropLst ul li { background-color: #fff; } 
.mobile_snb .box.dep2 .dropLst li .value { color:#003591; } 
.mobile_snb .box.dep2 .dropLst li .value.on { color:#00aeef; } 
.mobile_snb .dropLst { width: 100%; box-sizing: border-box; } 
.mobile_snb .dropLst .dlst { width: 100%; left:0; box-shadow: none; -webkit-box-shadow: none; } 
.mobile_snb .dropLst .dlst ul { border:none; } 

.product_shop { position: relative; font-family: "NanumGothic"; letter-spacing: 0; } 

.product { position: relative; font-family: "NanumGothic"; letter-spacing: 0; } 
.product .tt { width:auto; max-width:1200px; margin:40px auto; text-align:center; } 
.product .tt .title1 { font-size:25px; color:#e2cf69; margin-bottom:10px; } 
.product .tt .title2 { font-size:25px; color:#7c6798; margin-bottom:10px; } 
.product .tt .title3 { font-size:25px; color:#5d838f; margin-bottom:10px; padding-top:40px; margin-top:-40px; } 
.product .tt .title4 { font-size:25px; color:#e2cf69; margin-bottom:10px; padding-top:40px; margin-top:-40px; } 
.product .tt .blog { float:right; margin-top:-55px; } 
.product .tt .bar { width:30px; height:3px; background-color:#000; margin: 0 auto; } 
.product .line { position: relative; width:100%; height:1px; background-color:#CCC; } 
.product .linebg { position: relative; width:100%; height:1px; background-color:#91bc95; } 

.product .sensor { width:100%; } 
.product .sensor .box { width: auto; max-width: 1200px; margin: 0 auto; display:flex; padding-bottom:40px; } 
.product .sensor .box .movie { width:230px; padding-top:0px; } 
.product .sensor .box .cont { width:50%; padding-top:0px; } 
.product .sensor .box .cont .contents { width:80%; padding-left:60px; } 
.product .sensor .box .cont .contents .title { font-size:25px; color:#e2cf69; } 
.product .sensor .box .cont .contents .bar { width:30px; margin-bottom:20px; height:3px; background-color:#000; } 
.product .sensor .box .cont .contents .title2 { font-size:25px; color:#000; } 
.product .sensor .box .cont .contents .content { font-size:15px; color:#636363; margin-top:10px; text-align:justify; line-height:20px; } 
.product .sensor .box .cont .contents button { padding:10px 20px; font-size:12px; border:none; background:#e2cf69; outline: none; overflow: hidden; overflow: hidden; color:#fff; } 

.product .news { width:auto; max-width: 1200px; padding-top:0px; padding-bottom:40px; display:flex; margin:0 auto; } 
.product .news .contents { width:65%; font-size:20px; margin:10px 30px 10px 60px; } 
.product .news .contents .cont { font-size:15px; margin-top:20px; } 
.product .news button { padding:10px 20px; margin-top:50px; font-size:12px; border:none; background:#3f3d33; outline: none; overflow: hidden; color:#fff; } 

.product .safety { width:100%; } 
.product .safety .box { width: auto; max-width: 1200px; margin: 0 auto; display:flex; padding-bottom:40px; } 
.product .safety .box .movie { width:230px; padding-top:0px; } 
.product .safety .box .cont { width:80%; padding-top:0px; } 
.product .safety .box .cont .contents { width:80%; } 
.product .safety .box .cont .contents .title { font-size:25px; color:#7c6798; } 
.product .safety .box .cont .contents .bar { width:30px; margin-bottom:20px; height:3px; background-color:#000; } 
.product .safety .box .cont .contents .title2 { font-size:25px; color:#000; } 
.product .safety .box .cont .contents .content { font-size:15px; color:#636363; margin-top:10px; } 
.product .safety .box .cont .contents .content button { padding:10px 20px; font-size:12px; border:none; background:#7c6798; outline: none; overflow: hidden; overflow: hidden; color:#fff; } 

.product .environment { width:100%; background-color:#91bc95; background-image:url("/web2019/images/main/in_box_bg.jpg"); background-repeat:no-repeat; background-position:center bottom; bottom:0px; } 
.product .environment .box { width: auto; max-width: 1200px; margin: 0 auto; display:flex; padding-bottom:40px; } 
.product .environment .box .movie { width:230px; padding-top:0px; } 
.product .environment .box .cont { width:80%; padding-top:0px; } 
.product .environment .box .cont .contents { width:80%; padding-left:60px; } 
.product .environment .box .cont .contents .title { font-size:25px; color:#5d838f; } 
.product .environment .box .cont .contents .bar { width:30px; margin-bottom:20px; height:3px; background-color:#000; } 
.product .environment .box .cont .contents .title2 { font-size:25px; color:#000; } 
.product .environment .box .cont .contents .content { font-size:15px; color:#636363; margin-top:10px; } 
.product .environment .box .cont .contents .content button { padding:10px 20px; font-size:12px; border:none; background:#5d838f; outline: none; overflow: hidden; overflow: hidden; color:#fff; } 

.product .breezeblow { width:100%; background-image:url(../images/main/breeze_bg.jpg); background-repeat: repeat-x; background-position:center bottom; background-color:#e9efeb; } 
.product .breezeblow .box { width: auto; max-width: 1200px; min-height:317px; margin: 0 auto; display:flex; } 
.product .breezeblow .box .movie { width:230px; padding-top:0px; } 
.product .breezeblow .box .cont { width:80%; padding-top:0px; } 
.product .breezeblow .box .cont .contents { width:80%; padding-left:60px; } 
.product .breezeblow .box .cont .contents .title { font-size:25px; color:#5d838f; } 
.product .breezeblow .box .cont .contents .bar { width:30px; margin-bottom:20px; height:3px; background-color:#000; } 
.product .breezeblow .box .cont .contents .title2 { font-size:25px; color:#000; } 
.product .breezeblow .box .cont .contents .content { font-size:15px; color:#636363; margin-top:10px; } 
.product .breezeblow .box .cont .contents .content button { padding:10px 20px; font-size:12px; border:none; background:#91bc95; outline: none; overflow: hidden; overflow: hidden; color:#fff; } 

@media all and (max-width:768px) { 
.util { right:160px; } 
.util>div>a { display:inline-block; color:#fff; height:55px; } 
.util .link_reservation { padding:0 15px 0; line-height:55px; background-color:#2f3b3f; } 
.web_snb { display: none; } 
.mobile_snb { display: block; } 

.product .line { display:none; } 


.product .sensor .box { width: auto; display: block; } 
.product .sensor .box .movie { width:100%; height: auto; padding-top:0px; } 
.product .sensor .box .cont { width:100%; height:auto; padding-top:0px; margin-bottom:20px; } 
.product .sensor .box .cont .contents { width:95%; padding-left:10px; } 
.product .sensor .box .cont .contents .title2 { font-size:15px; } 
.product .sensor .box .cont .contents .content { font-size:13px; } 

.product .news { width:auto; max-width: 1200px; margin: 20px 10px; display: block; padding-top: 10px; } 
.product .news img { display: none; } 
.product .news .contents .cont { font-size:13px; } 
.product .news .contents { width:100%; font-size:15px; margin:10px 0px 10px 0px; } 
.product .news button { padding:10px 20px; margin-top:0px; margin-bottom:20px; } 

.product .safety .box { width: auto; display: block; } 
.product .safety .box .movie { width:100%; height: auto; padding-top:50px; margin-top:0px; margin-bottom:0px; } 
.product .safety .box .cont { width:100%; height:auto; padding-top:0px; margin-top:0px; } 
.product .safety .box .cont .contents { width:95%; padding-left:10px; } 
.product .safety .box .cont .contents .title2 { font-size:15px; } 
.product .safety .box .cont .contents .content { font-size:13px; } 

.product .environment { width: auto; } 
.product .environment .box { display: block; } 
.product .environment .box .movie { width:100%; height:auto; padding-top:0px; } 
.product .environment .box .cont { width:100%; height:auto; padding-top:0px; margin-bottom:0px; } 
.product .environment .box .cont .contents { width:95%; padding-left:10px; padding-bottom:20px; } 
.product .environment .box .cont .contents .title2 { font-size:15px; } 
.product .environment .box .cont .contents .content { font-size:13px; } 

.product .breezeblow { width: auto; } 
.product .breezeblow .box { display: block; } 
.product .breezeblow .box .movie { width:100%; height:auto; } 
.product .breezeblow .box .cont { width:100%; height:auto; padding-top:0px; margin-bottom:0px; } 
.product .breezeblow .box .cont .contents { width:95%; padding-left:10px; padding-bottom:20px; padding-top:20px; } 
.product .breezeblow .box .cont .contents .title2 { font-size:15px; } 
.product .breezeblow .box .cont .contents .content { font-size:13px; } 
 } 

/** 푸터 **/
.footer { height:auto; font-family: "NanumGothic"; letter-spacing: 0; background-color: #373c44; padding-bottom:30px; } 
.footer_area { width: auto; max-width: 1230px; margin:0 auto; padding-left:30px; box-sizing: border-box; } 
.siteMap:after { content: ""; display: block; clear: both; height: 0; } 
.siteMap { padding-top:50px; padding-bottom:5px; } 
.siteMap .dep1 > li { position: relative; display: block; width: 14%; float:left; } 
.siteMap .dep1 > li > a { position: relative; display: inline-block; font-size:20px; line-height: 34px; height: 34px; color:#c0c1c3; } 
.siteMap .dep2 { display: block; padding-top:30px; } 
.siteMap .dep2 > li { margin-bottom:10px; } 
.siteMap .dep2 > li > a { position: relative; display: inline-block; font-size:14px; line-height: 26px; height: 26px; color:#9b9da0; } 
.siteMap .dep1 .bar { position: relative; display: block; width: 10%; float:left; } 
.siteMap .dep1 .bar > a { position: relative; display: inline-block; font-size:20px; line-height: 34px; height: 34px; color:#c0c1c3; } 
.footer .info { padding-top:50px; font-size:13px; line-height: 20px; background-color: #373c44; } 
.footer .info span { display: inline-block; color: #8d8f92; text-transform: uppercase; } 
.footer .info span.phone em { margin-left: 20px; } 
.footer .info .copyright { color:#707377; letter-spacing: -0.5px; float: right; } 
.footer .info .logout { color:#fff; font-size:12px; } 

@media all and (max-width:768px) { 
.header { height: 55px; } 
/**.footer { height: 350px; } **/
.siteMap { display: none; } 
.footer_area { padding:0 30px; } 
.footer .info { text-align: center; font-size:12px; line-height: 15px; } 
.footer .info span.adress { padding:2px 0 8px; } 
.footer .info span.adress em { display: block; } 
.footer .info span.phone { margin-bottom:14px; } 
.footer .info span.phone em { margin:0 8px; } 
.footer .info span { display: block; text-align: center; } 
 } 

/** 미사용 영역 **/
.stickyMenu,
.quickLayer,
.header > .title_area { display: none !important; } 

.eng { font-family: "NanumGothic"; } 

/** main_section **/
.wrap .areas { margin-bottom: 0; } 
.wrap .container { padding-top:0; } 
.wrap .content { } 
.main_section { position: relative; width: 100%; height: 100%; box-sizing: border-box; } 


/*.pages { position: relative; display:block; height: 1125px; min-width: 320px; min-height: 320px; padding-top: 0; background: #fff; } */
.pages { position: relative; display:block; height: 1080px; min-width: 320px; min-height: 320px; padding-top: 0; background: #fff; } 
.pages .slick_slider { opacity:0; -webkit-transition:opacity 0.5s ease; transition:opacity 0.5s ease; } 
.pages .slick-initialized { display: block; max-width: none; position: relative; top: 0; left: 0; margin-left: 0; height: 100%; width: 100%; opacity:1; } 
.pages .slick-list { z-index:1; } 
.pages .slick-list,
.pages .slick-track,
.pages .slick-slide { height: 100%; width: 100%; } 
.slick_slider .page { position: relative; width: 100%; height: 100%; display: block; position: relative; box-sizing: border-box; overflow:hidden; } 
.slick_slider .page .bg { position: absolute; top: 0; left:0; right:0; bottom:0; width: 100%; z-index: -1; 
background-position:50% 50%; 
background-repeat:no-repeat; 
background-size:cover; 
opacity: 0; 
-ms-transform: scale(1.2, 1.2); 
-webkit-transform: scale(1.2, 1.2); 
-webkit-transition:transform 7s ease-out, opacity 1s ease 0.3s; 
transition:transform 7s ease-out, opacity 1s ease 0.3s; 
 } 
.slick_slider.ani .page.slick-active .bg { 
opacity: 1; 
-ms-transform: scale(1, 1) rotate(.001deg); 
-webkit-transform: scale(1, 1) rotate(.001deg); 
transform: scale(1, 1) rotate(.001deg); 
-webkit-transition-delay: 0s; 
transition-delay: 0s; 
 } 


.slick_slider .page .bg .bg_area { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9990; overflow:hidden; } 
/*
.slick_slider .page .bg img { height: 100%; width: 100%; max-width: none; -o-object-fit: cover; object-fit: cover; } 
*/
.slick_slider .page .bg img { display: none; } 
.slick_slider .page.page_01 .bg { background-image: url("/web2019/images/bg_01.jpg"); } 
.slick_slider .page.page_02 .bg { background-image: url("/web2019/images/bg_02.jpg"); } 
.slick_slider .page.page_03 .bg { background-image: url("/web2019/images/bg_03.jpg"); } 
.slick_slider .page.page_04 .bg { background-image: url("/web2019/images/bg_04.jpg"); } 
.slick_slider .page.page_05 .bg { background-image: url("/web2019/images/bg_05.jpg"); } 

.slick_slider .intro { position: absolute; top:0; left:0; right:0; bottom:0; display: table; width: 100%; height:100%; padding:100px 60px 150px; box-sizing: border-box; background: url("/web2019/images/main/dot.png") } 
.slick_slider .intro .text_box { display: table-cell; text-align: center; padding-top:100px; } 
.slick_slider .intro .title { position: relative; padding-bottom:5px; letter-spacing:8px; } 
.slick_slider .intro .title em { display: block; font-size:70px; line-height:110px; font-weight: bold; color:#fff; text-shadow:0px 0px 5px #c7c7c7; text-transform: uppercase; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; } 


.slick_slider.ani .page.slick-active .intro .title em { -webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 

.slick_slider .intro .title:after { content: ""; position: absolute; bottom:0; left:50%; display: block; width:80px; height: 7px; margin-left:-40px; background-color:#40ae49; } 
.slick_slider .intro .desc { margin-top:26px; font-size:40px; line-height:24px; color:#fff; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px); } 
.slick_slider.ani .page.slick-active .intro .desc { -webkit-transform:translateX(0); transform:translateX(0); opacity: 0.8; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 
.slick_slider .intro .desc .br { display: block; } 
.slick_slider .intro a.btn_box { margin-top:50px; display: inline-block; width: 156px; border:5px solid #40ae49; background-color:#40ae49; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.slick_slider .intro a.btn_box:hover { background-color:#000; border-color:#000; } 
.slick_slider.ani .page.slick-active .intro a.btn_box { -webkit-transform:translateY(0); transform:translateY(0); transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; opacity: 1; } 


.slick_slider .intro a.btn_box em { font-family: "NanumGothic"; position: relative; display: inline-block; padding-right:15px; height: 56px; line-height: 56px; font-size:16px; color:#ffffff; } 
.slick_slider .intro a.btn_box em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 12px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -550px -60px; } 
.slick_slider .slick-arrow { position: absolute; top:50%; display: block; width: 50px; height: 100px; margin-top:-200px; z-index: 7; border:none; background: none; outline: none; text-indent: -999em; } 
.slick_slider .slick-arrow:before { content: ""; position: absolute; top:50%; left:50%; display: block; width: 38px; height: 82px; margin-top:-41px; margin-left:-19px; background: url("/web2019/images/icons/icons.png") no-repeat -500px -160px; -webkit-transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); transition:opacity 0.3s cubic-bezier(0, 0, 0.25, 1), visibility 0s cubic-bezier(0, 0, 0.25, 1); opacity: 0; opacity: 0.3; } 
.slick_slider .slick-arrow:hover:before { opacity: 1; } 
.slick_slider .slick-arrow.slick-prev { left:58px; } 
.slick_slider .slick-arrow.slick-next { right:58px; } 
.slick_slider .slick-arrow.slick-next:before { background-position: -550px -160px; } 

.slick_slider .slick-dots { position: absolute; top:100%; left:0; width: 100%; margin-top:-330px; text-align: center; z-index:2; } 
.slick_slider .slick-dots li { display: inline-block; width: 300px; padding:0 1px; max-width: 300px; height: 395px; } 
.slick_slider .slick-dots li button { position: relative; display: block; width: 100%; height: 395px; border:none; background: none; outline: none; overflow: hidden; overflow: hidden; color:#fff; } 
.slick_slider .slick-dots li button em { position: absolute; bottom:270px; left:0; width: 100%; height: 80px; display: block; text-align: center; line-height: 80px; color:#fff; z-index: 3; -webkit-transition:opacity 0.5s; transition:opacity 0.5s; } 
.slick_slider .slick-dots li button:before { content: ""; position: absolute; bottom:0; left:50%; display: block; width: 300px; margin-left:-150px; height: 365px; background: url("/web2019/images/main/web_nav_off.png") no-repeat 0 0; } 
.slick_slider .slick-dots li#slick-slide00 button:before { background-position: 0 0; } 
.slick_slider .slick-dots li#slick-slide01 button:before { background-position: -300px 0; } 
.slick_slider .slick-dots li#slick-slide02 button:before { background-position: -600px 0; } 
.slick_slider .slick-dots li#slick-slide03 button:before { background-position: -900px 0; } 
.slick_slider .slick-dots li#slick-slide04 button:before { background-position: -1200px 0; } 
.slick_slider .slick-dots li button:after { content: ""; position: absolute; top:0px; left:50%; display: block; width: 300px; height:395px; margin-left:-150px; background: url("/web2019/images/main/web_nav_on.png") no-repeat 0 0; -webkit-transition:opacity 0.5s; transition:opacity 0.5s; -webkit-transform:translateY(20px); transform:translateY(20px); opacity: 0; } 
.slick_slider .slick-dots li#slick-slide00 button:after { background-position: 0 0px; } 
.slick_slider .slick-dots li#slick-slide01 button:after { background-position: -300px 0px; } 
.slick_slider .slick-dots li#slick-slide02 button:after { background-position: -600px 0px; } 
.slick_slider .slick-dots li#slick-slide03 button:after { background-position: -900px 0px; } 
.slick_slider .slick-dots li#slick-slide04 button:after { background-position: -1200px 0px; } 
.slick_slider .slick-dots li.slick-active button:after { -webkit-transition:all 0.5s; transition:all 0.5s; } 

.slick_slider .slick-dots li button:hover:after { opacity:0; -webkit-transform:translateY(20px); transform:translateY(20px); } 

.slick_slider .slick-dots li.slick-active button:after { opacity: 1; -webkit-transform:translateY(0); transform:translateY(0); } 
.slick_slider .slick-dots li.slick-active button:before { opacity: 0; -webkit-transform:translateY(0); transform:translateY(0); } 
.slick_slider .slick-dots li.slick-active button em { bottom:300px; -webkit-transition:bottom 0.5s; transition:bottom 0.5s; } 
.slick_slider .slick-dots li#slick-slide00.slick-active button:after { background-position: 0 0; } 
.slick_slider .slick-dots li#slick-slide01.slick-active button:after { background-position: -300px 0; } 
.slick_slider .slick-dots li#slick-slide02.slick-active button:after { background-position: -600px 0; } 
.slick_slider .slick-dots li#slick-slide03.slick-active button:after { background-position: -900px 0; } 
.slick_slider .slick-dots li#slick-slide04.slick-active button:after { background-position: -1200px 0; } 

.shop_pages { position: relative; display:block; min-width: 320px; min-height: 320px; padding-top: 0; background: #fff; } 
.shop_pages .cont3,
.shop_pages .cont4,
.shop_pages .cont2 { width:100%; height:0px; text-align:center; } 
.shop_pages .cont { width:100%; height:170px; text-align:center; background:#e1cda4; } 
.shop_pages .cont img { position:absolute; z-index:1; margin-top:-300px; margin-left:100px; } 
.shop_pages .cont2 img { position:absolute; z-index:1; margin-top:-205px; margin-left:0px; } 
.shop_pages .cont3 img { position:absolute; z-index:1; margin-top:-220px; margin-left:-350px; } 
.shop_pages .cont4 img { position:absolute; z-index:1; margin-top:-183px; margin-left:-350px; } 

.shop_pages .slick_slider { opacity:0; -webkit-transition:opacity 0.5s ease; transition:opacity 0.5s ease; } 
.shop_pages .slick-initialized { display: block; max-width: none; position: relative; top: 0; left: 0; margin-left: 0; height: 650px; width: 100%; opacity:1; } 
.shop_pages .slick-list { z-index:1; } 
.shop_pages .slick-list,
.shop_pages .slick-track,
.shop_pages .slick-slide { height: 100%; width: 100%; } 
.shop_slick_slider .page { position: relative; width: 100%; height: 100%; display: block; position: relative; box-sizing: border-box; overflow:hidden; } 
.shop_slick_slider .page .bg { position: absolute; top: 0; left:0; right:0; bottom:0; width: 100%; z-index: -1; 
background-position:50% 50%; 
background-repeat:no-repeat; 
background-size:cover; 
opacity: 0; 

-webkit-transition:transform 7s ease-out, opacity 1s ease 0.3s; 
transition:transform 7s ease-out, opacity 1s ease 0.3s; 
 } 
.shop_slick_slider.ani .page.slick-active .bg { 
opacity: 1; 
-ms-transform: scale(1, 1) rotate(.001deg); 
-webkit-transform: scale(1, 1) rotate(.001deg); 
transform: scale(1, 1) rotate(.001deg); 
-webkit-transition-delay: 0s; 
transition-delay: 0s; 
 } 


.shop_slick_slider .page .bg .bg_area { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9990; } 
/*
.slick_slider .page .bg img { height: 100%; width: 100%; max-width: none; -o-object-fit: cover; object-fit: cover; } 
*/
.shop_slick_slider .page .bg img { display: block; } 
.shop_slick_slider .page.page_01 .bg { background-image: url("/web2019/images/main/shop_bg_01.jpg"); } 
.shop_slick_slider .page.page_02 .bg { background: url("/web2019/images/main/main_shop_dot.jpg"); } 
.shop_slick_slider .page.page_03 .bg { background:#FFF; } 
.shop_slick_slider .page.page_04 .bg { background:#91bc95; } 

.shop_slick_slider .intro { position: absolute; top:0; left:0; right:0; bottom:0; display: table; width: 100%; height:100%; padding:100px 60px 150px; box-sizing: border-box; background: url("/web2019/images/main/dot.png") } 
.shop_slick_slider .intro .text_box { display: table-cell; text-align: center; padding-top:50px; } 
.shop_slick_slider .intro .title { position: relative; padding-bottom:5px; letter-spacing:1px; } 
.shop_slick_slider .intro .title em { display: block; font-size:70px; font-weight: bold; color:#3f4953; text-transform: uppercase; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; } 


.shop_slick_slider.ani .page.slick-active .intro .title em { -webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 

.shop_slick_slider .intro .title:after { content: ""; position: absolute; bottom:0; left:50%; display: block; width:80px; height: 7px; margin-left:-40px; background-color: #fff; } 
.shop_slick_slider .intro .desc { margin-top:26px; font-size:25px; line-height:24px; color:#000; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px); } 
.shop_slick_slider.ani .page.slick-active .intro .desc { -webkit-transform:translateX(0); transform:translateX(0); opacity: 0.8; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 
.shop_slick_slider .intro .desc .br { display: block; } 
.shop_slick_slider .intro .desc .br1 { display: block; color:#fff; font-size:15px; } 
.shop_slick_slider .intro a.btn_box { margin-top:20px; display: inline-block; width: 156px; border:2px solid #ffffff; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro a.btn_box:hover { background-color:#40ae49; border-color:#40ae49; } 
.shop_slick_slider.ani .page.slick-active .intro a.btn_box { -webkit-transform:translateY(0); transform:translateY(0); transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; opacity: 1; } 


.shop_slick_slider .intro a.btn_box em { font-family: "NanumGothic"; position: relative; display: inline-block; padding-right:15px; height: 40px; line-height: 40px; font-size:13px; color:#ffffff; } 
.shop_slick_slider .intro a.btn_box em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 12px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -550px -60px; } 

/* intro1 */
.shop_slick_slider .intro1 { position: absolute; top:0; left:0; right:0; bottom:0; display: table; width: 100%; height:100%; padding:100px 60px 150px; box-sizing: border-box; background: url("/web2019/images/main/dot.png") } 
.shop_slick_slider .intro1 .text_box { display: table-cell; text-align: center; padding-top:0px; } 
.shop_slick_slider .intro1 .title { position: relative; padding-bottom:5px; letter-spacing:1px; } 
.shop_slick_slider .intro1 .title em { display: block; font-size:70px; font-weight: bold; color:#e2cf69; text-transform: uppercase; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; } 


.shop_slick_slider.ani .page.slick-active .intro1 .title em { -webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 

.shop_slick_slider .intro1 .title:after { content: ""; position: absolute; bottom:0; left:50%; display: block; width:80px; height: 7px; margin-left:-40px; background-color: #fff; } 
.shop_slick_slider .intro1 .desc { margin-top:26px; font-size:25px; line-height:24px; color:#000; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px); } 
.shop_slick_slider.ani .page.slick-active .intro1 .desc { -webkit-transform:translateX(0); transform:translateX(0); opacity: 0.8; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 
.shop_slick_slider .intro1 .desc .br { display: block; } 
.shop_slick_slider .intro1 .desc .br1 { display: block; color:#666; font-size:15px; } 
.shop_slick_slider .intro1 a.btn_box { margin-top:20px; display: inline-block; width: 156px; background:#e2cf69; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro1 a.btn_box_1 { margin-top:20px; display: inline-block; width: 156px; height:40px; background:#373735; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 1; } 
.shop_slick_slider .intro1 a.btn_box:hover { background-color:#40ae49; border-color:#40ae49; } 
.shop_slick_slider.ani .page.slick-active .intro1 a.btn_box,
.shop_slick_slider.ani .page.slick-active .intro1 a.btn_box_1 { -webkit-transform:translateY(0); transform:translateY(0); transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; opacity: 1; } 


.shop_slick_slider .intro1 a.btn_box em,
.shop_slick_slider .intro1 a.btn_box_1 em { font-family: "NanumGothic"; position: relative; display: inline-block; padding-right:15px; height: 40px; line-height: 40px; font-size:13px; color:#ffffff; } 
.shop_slick_slider .intro1 a.btn_box em:before,
.shop_slick_slider .intro1 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 12px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -550px -60px; } 


/* intro2 */
.shop_slick_slider .intro2 { position: absolute; top:0; left:0; right:0; bottom:0; display: table; width: 100%; height:100%; padding:100px 60px 150px; box-sizing: border-box; background: url("/web2019/images/main/dot.png") } 
.shop_slick_slider .intro2 .text_box { display: table-cell; text-align: center; padding-top:0px; } 
.shop_slick_slider .intro2 .title { position: relative; padding-bottom:5px; letter-spacing:1px; } 
.shop_slick_slider .intro2 .title em { display: block; font-size:70px; font-weight: bold; color:#7c6798; text-transform: uppercase; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; } 


.shop_slick_slider.ani .page.slick-active .intro2 .title em { -webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 

.shop_slick_slider .intro2 .title:after { content: ""; position: absolute; bottom:0; left:50%; display: block; width:80px; height: 7px; margin-left:-40px; background-color: #fff; } 
.shop_slick_slider .intro2 .desc { margin-top:26px; font-size:25px; line-height:24px; color:#000; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px); } 
.shop_slick_slider.ani .page.slick-active .intro2 .desc { -webkit-transform:translateX(0); transform:translateX(0); opacity: 0.8; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 
.shop_slick_slider .intro2 .desc .br { display: block; } 
.shop_slick_slider .intro2 .desc .br1 { display: block; color:#666; font-size:15px; } 
.shop_slick_slider .intro2 a.btn_box { margin-top:20px; display: inline-block; width: 156px; background:#ff772a; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro2 a.btn_box_1 { margin-top:20px; display: inline-block; width: 156px; background:#7c6798; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro2 a.btn_box:hover,
.shop_slick_slider .intro2 a.btn_box_1:hover { background-color:#40ae49; border-color:#40ae49; } 
.shop_slick_slider.ani .page.slick-active .intro2 a.btn_box,
.shop_slick_slider.ani .page.slick-active .intro2 a.btn_box_1 { -webkit-transform:translateY(0); transform:translateY(0); transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; opacity: 1; } 


.shop_slick_slider .intro2 a.btn_box em,
.shop_slick_slider .intro2 a.btn_box_1 em { font-family: "NanumGothic"; position: relative; display: inline-block; padding-right:15px; height: 40px; line-height: 40px; font-size:13px; color:#ffffff; } 
.shop_slick_slider .intro2 a.btn_box em:before,
.shop_slick_slider .intro2 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 12px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -550px -60px; } 

/* intro3 */
.shop_slick_slider .intro3 { position: absolute; top:0; left:0; right:0; bottom:0; display: table; width: 100%; height:100%; padding:100px 60px 150px; box-sizing: border-box; } 
.shop_slick_slider .intro3 .text_box { display: table-cell; text-align: center; padding-top:0px; } 
.shop_slick_slider .intro3 .title { position: relative; padding-bottom:5px; letter-spacing:1px; } 
.shop_slick_slider .intro3 .title em { display: block; font-size:70px; font-weight: bold; color:#5d838f; text-transform: uppercase; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; } 


.shop_slick_slider.ani .page.slick-active .intro3 .title em { -webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 

.shop_slick_slider .intro3 .title:after { content: ""; position: absolute; bottom:0; left:50%; display: block; width:80px; height: 7px; margin-left:-40px; background-color: #fff; } 
.shop_slick_slider .intro3 .desc { margin-top:26px; font-size:25px; line-height:24px; color:#000; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px); } 
.shop_slick_slider.ani .page.slick-active .intro3 .desc { -webkit-transform:translateX(0); transform:translateX(0); opacity: 0.8; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; } 
.shop_slick_slider .intro3 .desc .br { display: block; } 
.shop_slick_slider .intro3 .desc .br1 { display: block; color:#666; font-size:15px; } 
.shop_slick_slider .intro3 a.btn_box { margin-top:20px; display: inline-block; width: 156px; background:#5d838f; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro3 a.btn_box_1 { margin-top:20px; display: inline-block; width: 156px; background:#3f4953; text-align: center; -webkit-transform:translateY(50px); transform:translateY(50px); opacity: 0; } 
.shop_slick_slider .intro3 a.btn_box:hover,
.shop_slick_slider .intro3 a.btn_box_1:hover { background-color:#40ae49; border-color:#40ae49; } 
.shop_slick_slider.ani .page.slick-active .intro3 a.btn_box,
.shop_slick_slider.ani .page.slick-active .intro3 a.btn_box_1 { -webkit-transform:translateY(0); transform:translateY(0); transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s; opacity: 1; } 


.shop_slick_slider .intro3 a.btn_box em,
.shop_slick_slider .intro3 a.btn_box_1 em { font-family: "NanumGothic"; position: relative; display: inline-block; padding-right:15px; height: 40px; line-height: 40px; font-size:13px; color:#ffffff; } 
.shop_slick_slider .intro3 a.btn_box em:before,
.shop_slick_slider .intro3 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 12px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -550px -60px; } 

.shop_null { display:none; } 


@media all and (max-width:1024px) { 
.slick_slider .intro .title { letter-spacing: -2px; } 
.slick_slider .intro .title em { font-size:70px; line-height:90px; } 

.shop_slick_slider .intro .title { letter-spacing: -2px; } 
.shop_slick_slider .intro .title em { font-size:70px; line-height:90px; } 

.slick_slider .intro1 .title { letter-spacing: -2px; } 
.slick_slider .intro1 .title em { font-size:70px; line-height:90px; } 

.shop_slick_slider .intro1 .title { letter-spacing: -2px; } 
.shop_slick_slider .intro1 .title em { font-size:70px; line-height:90px; } 

.slick_slider .intro2 .title { letter-spacing: -2px; } 
.slick_slider .intro2 .title em { font-size:70px; line-height:90px; } 

.shop_slick_slider .intro2 .title { letter-spacing: -2px; } 
.shop_slick_slider .intro2 .title em { font-size:70px; line-height:90px; } 

.slick_slider .intro3 .title { letter-spacing: -2px; } 
.slick_slider .intro3 .title em { font-size:70px; line-height:90px; } 

.shop_slick_slider .intro3 .title { letter-spacing: -2px; } 
.shop_slick_slider .intro3 .title em { font-size:70px; line-height:90px; } 
 } 
@media all and (max-width:768px) { 
.areas { position: relative; height: 100%; box-sizing: border-box; } 
.pages { height:800px; } 
.shop_null { width:100%; height:1500px; display:block; } 

.product .tt .blog { float: none; margin-top:0px; } 

.slick_slider .intro { padding:55px 10px 70px; } 
.slick_slider .slick-arrow { display: none !important; } 
.slick_slider .intro .title { padding-bottom:12px; letter-spacing: -1.5px; } 
.slick_slider .intro .title em { font-size:30px; line-height:40px; -webkit-transform:translateX(-25px); transform:translateX(-25px); } 
.slick_slider .intro .title:after { width:40px; height: 2px; margin-left:-20px; } 
.slick_slider .intro .desc { margin-top:13px; font-size:14px; line-height:18px; -webkit-transform:translateX(25px); transform:translateX(25px); } 

.slick_slider .intro a.btn_box { margin-top:25px; width: 128px; height: 43px; border:1px solid #ffffff; -webkit-transform:translateY(25px); transform:translateY(25px); opacity: 0; } 
.slick_slider .intro a.btn_box em { position: relative; display: inline-block; padding-right:12px; height: 43px; line-height: 43px; font-size:13px; } 
.slick_slider .intro a.btn_box em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 10px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -280px -30px; background-size: 500px auto; } 

.slick_slider .slick-dots { margin-top:-40px; } 
.slick_slider .slick-dots { padding:0 40px; box-sizing: border-box; } 
.slick_slider .slick-dots li { max-width: 60px; height: 40px; } 
.slick_slider .slick-dots li button { height: 40px; } 
.slick_slider .slick-dots li button em { height: 30px; text-align: left; line-height: 50px; font-size:13px; font-weight: bold; padding-left:12px; box-sizing: border-box; } 

.slick_slider .slick-dots li button:before { width: 120px; margin-left:-60px; height: 30px; background-size: 600px auto; } 
.slick_slider .slick-dots li#slick-slide00 button:before { background-position: 0 0; } 
.slick_slider .slick-dots li#slick-slide01 button:before { background-position: -150px 0; } 
.slick_slider .slick-dots li#slick-slide02 button:before { background-position: -300px 0; } 
.slick_slider .slick-dots li#slick-slide03 button:before { background-position: -450px 0; } 
.slick_slider .slick-dots li#slick-slide04 button:before { background-position: -600px 0; } 

.slick_slider .slick-dots li button:after { width: 120px; margin-left:-60px; height: 30px; background-size: 600px auto; -webkit-transform:translateY(10px); transform:translateY(10px); } 

.slick_slider .slick-dots li#slick-slide00 button:after { background-position: 0 0px; } 
.slick_slider .slick-dots li#slick-slide01 button:after { background-position: -150px 0px; } 
.slick_slider .slick-dots li#slick-slide02 button:after { background-position: -300px 0px; } 
.slick_slider .slick-dots li#slick-slide03 button:after { background-position: -450px 0px; } 
.slick_slider .slick-dots li#slick-slide04 button:after { background-position: -600px 0px; } 

.slick_slider .slick-dots li button:hover:after { opacity:0; -webkit-transform:translateY(10px); transform:translateY(10px); } 
.slick_slider .slick-dots li.slick-active button:after { opacity:1; height:40px; -webkit-transform:translateY(0); transform:translateY(0); } 
.slick_slider .slick-dots li#slick-slide00.slick-active button:after { background-position: 0 0; } 
.slick_slider .slick-dots li#slick-slide01.slick-active button:after { background-position: -150px 0; } 
.slick_slider .slick-dots li#slick-slide02.slick-active button:after { background-position: -300px 0; } 
.slick_slider .slick-dots li#slick-slide03.slick-active button:after { background-position: -450px 0; } 
.slick_slider .slick-dots li#slick-slide04.slick-active button:after { background-position: -600px 0; } 

.slick_slider .slick-dots li.slick-active button em { height: 30px; line-height: 30px; } 

.slick_slider .page.page_04 .bg { background-position:60% 50%; } 
.slick_slider .page.page_05 .bg { background-position:60% 50%; } 

/*shop*/
.shop_pages .slick-initialized { display: block; max-width: none; position: relative; top: 0; left: 0; margin-left: 0; height: 550px; width: 100%; opacity:1; } 
.shop_pages .cont img { width:70%; margin-left:-150px; margin-top:-180px; } 
 .shop_pages .cont2 img { margin-top:-174px; margin-left:-150px; } 
.shop_pages .cont3 img { margin-left:-150px; margin-top:-173px; } 
.shop_pages .cont4 img { margin-left:-190px; margin-top:-85px; } 

.shop_slick_slider .intro { padding:55px 10px 70px; } 
.shop_slick_slider .slick-arrow { display: none !important; } 
.shop_slick_slider .intro .title { padding-bottom:12px; letter-spacing: -1.5px; } 
.shop_slick_slider .intro .title em { font-size:30px; line-height:40px; -webkit-transform:translateX(-25px); transform:translateX(-25px); } 
.shop_slick_slider .intro .title:after { width:40px; height: 2px; margin-left:-20px; } 
.shop_slick_slider .intro .desc { margin-top:13px; font-size:14px; line-height:18px; -webkit-transform:translateX(25px); transform:translateX(25px); } 

.shop_slick_slider .intro a.btn_box { margin-top:25px; width: 128px; height: 43px; border:1px solid #ffffff; -webkit-transform:translateY(25px); transform:translateY(25px); opacity: 0; } 
.shop_slick_slider .intro a.btn_box em { position: relative; display: inline-block; padding-right:12px; height: 43px; line-height: 43px; font-size:13px; } 
.shop_slick_slider .intro a.btn_box em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 10px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -280px -30px; background-size: 500px auto; } 

.shop_slick_slider .intro1 { padding:55px 10px 70px; } 
.shop_slick_slider .intro1 .title { padding-bottom:12px; letter-spacing: -1.5px; } 
.shop_slick_slider .intro1 .title em { font-size:30px; line-height:40px; -webkit-transform:translateX(-25px); transform:translateX(-25px); } 
.shop_slick_slider .intro1 .title:after { width:40px; height: 2px; margin-left:-20px; } 
.shop_slick_slider .intro1 .desc { margin-top:13px; font-size:14px; line-height:18px; -webkit-transform:translateX(25px); transform:translateX(25px); } 

.shop_slick_slider .intro1 a.btn_box,
.shop_slick_slider .intro1 a.btn_box_1 { margin-top:25px; width: 128px; height: 43px; -webkit-transform:translateY(25px); transform:translateY(25px); opacity: 0; } 
.shop_slick_slider .intro1 a.btn_box em,
.shop_slick_slider .intro1 a.btn_box_1 em { position: relative; display: inline-block; padding-right:12px; height: 43px; line-height: 43px; font-size:13px; } 
.shop_slick_slider .intro1 a.btn_box em:before,
.shop_slick_slider .intro1 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 10px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -280px -30px; background-size: 500px auto; } 

.shop_slick_slider .intro2 { padding:55px 10px 70px; } 
.shop_slick_slider .intro2 .title { padding-bottom:12px; letter-spacing: -1.5px; } 
.shop_slick_slider .intro2 .title em { font-size:30px; line-height:40px; -webkit-transform:translateX(-25px); transform:translateX(-25px); } 
.shop_slick_slider .intro2 .title:after { width:40px; height: 2px; margin-left:-20px; } 
.shop_slick_slider .intro2 .desc { margin-top:13px; font-size:14px; line-height:18px; -webkit-transform:translateX(25px); transform:translateX(25px); } 

.shop_slick_slider .intro2 a.btn_box,
.shop_slick_slider .intro2 a.btn_box_1 { margin-top:25px; width: 128px; height: 43px; -webkit-transform:translateY(25px); transform:translateY(25px); opacity: 0; } 
.shop_slick_slider .intro2 a.btn_box em,
.shop_slick_slider .intro2 a.btn_box_1 em { position: relative; display: inline-block; padding-right:12px; height: 43px; line-height: 43px; font-size:13px; } 
.shop_slick_slider .intro2 a.btn_box em:before,
.shop_slick_slider .intro2 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 10px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -280px -30px; background-size: 500px auto; } 

.shop_slick_slider .intro3 { padding:55px 10px 70px; } 
.shop_slick_slider .intro3 .title { padding-bottom:12px; letter-spacing: -1.5px; } 
.shop_slick_slider .intro3 .title em { font-size:30px; line-height:40px; -webkit-transform:translateX(-25px); transform:translateX(-25px); } 
.shop_slick_slider .intro3 .title:after { width:40px; height: 2px; margin-left:-20px; } 
.shop_slick_slider .intro3 .desc { margin-top:13px; font-size:14px; line-height:18px; -webkit-transform:translateX(25px); transform:translateX(25px); } 

.shop_slick_slider .intro3 a.btn_box,
.shop_slick_slider .intro3 a.btn_box_1 { margin-top:25px; width: 128px; height: 43px; -webkit-transform:translateY(25px); transform:translateY(25px); opacity: 0; } 
.shop_slick_slider .intro3 a.btn_box em,
.shop_slick_slider .intro3 a.btn_box_1 em { position: relative; display: inline-block; padding-right:12px; height: 43px; line-height: 43px; font-size:13px; } 
.shop_slick_slider .intro3 a.btn_box em:before,
.shop_slick_slider .intro3 a.btn_box_1 em:before { content: ""; position: absolute; top:50%; right:0; display: block; width: 7px; height: 10px; margin-top:-5px; background: url("/web2019/images/icons/icons.png") no-repeat -280px -30px; background-size: 500px auto; } 


 } 

.sticky_top { display: none; } 

.search { position:absolute; top:0px; right: 200px; z-index: 100; } 

.typeahead, .tt-query, .tt-hint { padding: 5px 12px !important; font-size: 12px !important; } 
.typeahead:focus { border: 1px solid #ddd !important; }