@charset "utf-8";
/* CSS Document */

@import url("font.css");

*{margin:0; padding:0;}

body,html{height:100%; text-align:center;}
ul,ol,dl{list-style:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button{margin:0;padding:0}
body,h1,h2,h3,h4,input,button{font-family:"nbg",Helvetica,AppleSDGothicNeo, Dotum,'돋움',sans-serif;}
a{text-decoration: none;}
.color{ color:#ff2d19!important;}
.block {display:block;}



#wrap {width:100%;position:relative; max-width:2000px; margin:0 auto; }
.header{width:100%; float:left; position: relative; z-index: 5000;}
.top{float:left; width:100%; height:30px; border-bottom:1px #e6e6e6 solid; background:#333;}
.top ul{float:right; margin-right:50px;}
.top li{float:left; font-size:14px;font-weight:normal;line-height:30px; margin-left:20px;}
.top li a{color:#ddd;}
.menu{float:left; width:100%; height:70px; border-bottom:1px #e6e6e6 solid; z-index:1001;}
.menu h1{float:left; width:160px; height:32px; background:url(../images/logo.png) 0 0 no-repeat; margin-left:30px; margin-top:19px; text-indent:-9999px;}
.menu h1 a{display:block;}

.gnb{width:603px; overflow: hidden; float: left; margin-top: 25px; margin-left: 20px;}
.gnb_menu{width:150px; float:left;}

.gnb dt{float:left; width:150px; font-size: 15px; font-weight: normal; text-transform: uppercase; font-family: 'Montserrat',sans-serif; position:relative;}
.gnb dt a{display:block; color:#555; width:150px; height:46px;} /* 20210318 */
.gnb dt:before{content:'';width:1px;height:150px;position:absolute;right:0;top:10px;background:#ddd; z-index:3001;}
.gnb dt:first-child:before{display:none;}
.noti{font-size: 13px; font-weight: normal; text-transform: uppercase; font-family: 'Montserrat',sans-serif; position:relative; margin-right: 30px ; margin-top:22px; padding:7px 12px 7px 32px; width: 60px; background:url(../images/noti2.png) 10px 7px no-repeat; border:1px #ddd solid; border-radius:20px; float: right;}
.noti a{display:block; color:#999;}

@media screen and  (max-width:1280px) 
            {
                .gnb_51
                {
                    font-size: 15px;
                    width: 150px;
                    height: 20px;
                    overflow: hidden;
                    line-height: 22px;
                }
            }


.gnb_51{font-size: 15px; font-weight: normal; text-transform: uppercase; font-family: 'Montserrat', 'nbg',Helvetica, AppleSDGothicNeo, Dotum,'돋움',sans-serif; position:relative; margin-right: 16px ; margin-top:22px; padding:6px 20px; background:#059dff; border-radius:20px; float: right; color: #fff;}
.gnb_51.color{color: #fff!important;}
.header.menu_wh a.gnb_51:hover{color: #fff;}

.menu_wh .noti{background:url(../images/noti.png) 10px 7px no-repeat;}
.header a:hover, .gnb_menu:hover dt a{color:#ff2d19;}
#top{position: fixed; bottom:30px; right:30px; z-index: 1000; display: block; width: 50px; height:50px; text-decoration: none; font-size: 13px; opacity: 0.8; cursor: pointer; border-radius:25px; background:#666; line-height:50px;font-family:'Montserrat',sans-serif; }
#top a{color:#fff; display:block;}

.gnb dl:hover dd{border-top:3px #ff2d19 solid; padding-top:15px; display:none; }
.gnb dd{z-index:3000; float:left; padding-top:18px; position:relative; display:none;}
.gnb .gnb_menu dd:before {content:'';width:1px;height:150px;position:absolute;right:0;top:10px;background:#ddd; z-index:3001;}
.gnb .gnb_menu:last-child dd:before{display:none;}
.gnb dd .navi_sub_ul li.text {margin-bottom:5px;}
.gnb dd .navi_sub_ul li {width:150px; }
.gnb dd .navi_sub_ul li a {font-size:14px;color:#999;padding:10px 0; font-weight:300;line-height:18px; display:block}
.gnb dd .navi_sub_ul li a:hover {color:#ff2d19;}

.menu .navi_layer {width:100%;height:0;position:absolute;left:0;top:101px;overflow:hidden;background:#f9f9f9;border-bottom:1px solid #bbb;border-top:1px solid #e3e3e3; display:none; z-index:500;}

.menu_wh .menu .navi_layer {background:rgba(0,0,0,0.9); border: 0;}


.container{width:100%; float:left;}
.container #wavybg-wrapper{width:100%; height:1130px;}


.gnb_51{font-size: 15px; font-weight: normal; text-transform: uppercase; font-family: 'Montserrat', 'nbg',Helvetica, AppleSDGothicNeo, Dotum,'돋움',sans-serif; position:relative; margin-right: 16px ; margin-top:22px; padding:6px 20px; background:#059dff; border-radius:20px; float: right; color: #fff;}
.gnb_51.color{color: #fff!important;}

.m-btn-menu{display: none;}
@media screen and (min-width:1180px)
    {
        #wrap{min-width:1180px;}
}
@media screen and (max-width:1180px)
    {
        .top{display: none;}
        .menu_mo{display: none;}
        .menu{background: #fff; }
        .m-btn-menu{display: block; position: absolute; right: 20px; top: 20px; }
        .m-btn-menu > button{font-size: 28px; background: none; border: none; outline: 0; cursor: pointer; color: #666;}
        .m-close{display: none;}
        .menu h1{margin-left: 20px;}
        .gnb{width: 100vw; height: auto; background: #fff; position: relative; border-top: 1px #ccc solid; margin: 20px 0 0; padding: 100px 20px 20px; box-sizing: border-box;}
        .gnb_menu{width: 100%;}
        .gnb dt{font-size: 20px; text-align: left;}
        .gnb dt a{width:100%; }
        .gnb dt:before{display: none;}
        .gnb dd:before{display: none;}
        .gnb dl dd{border: 0; padding-top: 0;}
        .gnb dl:hover dd{border: 0; padding-top: 0;}

        .noti{float: left;}
        .gnb_51{position: absolute; top: 90px; width: 90vw; left: 5vw; line-height: 50px; height: 50px; padding: 0; border-radius: 8px; margin: 0; font-size: 17px;}
        
        .main_banner{width: 100%; height: 100%;}
            }

/* main 5.1*/
#main_top{width: 100%; float:left; height: 799px;}
.main_banner{background:url(../images/main_banner.jpg) center no-repeat; background-size: cover; width: 100%; height: 900px; position: absolute; z-index: -1;}
.menu_wh .top{border-bottom: #000;}
.menu_wh .menu h1{ background:url(../images/logo_wh.png) 0 0 no-repeat; }
.menu_wh .menu{border-bottom: 1px #777 solid;}
.menu_wh .gnb a, .menu_wh .noti a{color: #fff;}
.main_tit{width: 1140px; margin: 0 auto;}
.main_tit *{text-align: left; color: #fff;}
.main_tit{width: 1140px; margin: 130px auto 200px;}
.container .main_tit h3 {font-family:'nsr', sans-serif; font-weight:100; font-size: 30px; color:#fff; }
.container .main_tit h2 {font-family:'nsr', sans-serif; font-weight:700; font-size: 70px; margin-top:30px;  }
.container .main_tit .main_p { font-size:36px; color:#ccc; font-weight: 100;  margin:50px auto 45px;}
.container .main_tit .main_p i{color:#fff; font-style: normal}
.container .main_tit .main_btn_area{float: left;width: 100%;margin: 25px 0;}
.container .main_tit a.pro_down {padding:15px 30px; background:#2d91ff; color:#fff; font-size:18px; float:left;}
.container .main_tit p.down_alert{ font-size:14px; color:#fff; float:left;}
.container .main_tit a.pro_down_ex{font-size: 14px; color: #b2b2b2; text-decoration: underline; float:left;}
.down {width:255px; height:570px; margin-left:40px; float:left; padding:200px 20px 0; box-sizing: border-box; border:1px #ddd solid;position: relative;background: #fff; }
.down:first-child{margin-left:0; }
.down.box1{ width: 550px;}

.down:before { content: ""; width: 100%; height: 190px; position: absolute; left: 0; top: 0; z-index: 1}
.down:after { content: "";  width: 100%; height: 190px; position: absolute; top: 0; left: 0; z-index: 2}
.down.box1:before { background:#74c9d9;}
.down.box1:after { background:url(../images/support/img_down1.png) center no-repeat; }
.down.box2:before { background:#1DA2E8;}
.down.box2:after { background:url(../images/support/img_down2.png) center no-repeat; }
.down.box3:before { background:#2d91ff;}
.down.box3:after { background:url(../images/support/img_down3.png) center no-repeat; }
.down.box1 a.down1{ border:2px #74c9d9 solid; width: 62px; margin-right: 8px;}
.down.box1 a.down2{ border:2px #ccc solid; width: 54px;}
.down.box2 a{ border:2px #1DA2E8 solid;}
.down.box3 a{ border:2px #2d91ff solid;}
.down .down_tit{font-size:22px; font-weight:500; float:left; width:100%; margin:10px 0;}
.down a{height:28px; line-height:30px; border-radius:20px; float:left; font-size: 13px; padding-left:30px; padding-right:4px; color:#666; display:block; }

.down .link1 a{width: 168px;}
.down .link2 a.wd{width: 73px}
.down .link2 a{width: 53px}
.down .link2 a:nth-child(2){margin-left: 8px;}


.down dl{float: left; width: 100%; border-bottom: 1px #ddd solid; margin-bottom: 10px;  padding: 10px 0 20px;}
.down.box1 dl{margin-bottom: 0;  padding: 15px 0;}
.down dl:last-child{border-bottom: 0;}
.down.box1 dl dt{float: left; width: 308px; text-align: left; height: 32px; margin-bottom: 0;}

.down dl dt{float: left; width: 200px; text-align: left; height: auto; margin-bottom: 10px;}
.down dl dt p{font-size: 16px;}
.down dl dt p.nospan{line-height: 32px}
.down dl dt span{font-size: 12px; color: #777;}
.down dl dd.link0{float: left;width: 200px;}
.down a.down1{background:url(../images/support/ico_down1.png) 7px -2px no-repeat;}
.down a.down2{background:url(../images/support/ico_down2.png) 7px -2px no-repeat;}
.down a.down3{background:url(../images/support/ico_down4.png) 7px -2px no-repeat; }
.down a.down4{background:url(../images/support/ico_down3.png) 7px -2px no-repeat; }
/* */

#main_nsec1{width:100%; float: left; background: #f7f8fa;}
.wrap_nsec1{width: 1140px; margin: 0 auto; height: 460px; padding:100px 0 }
.wrap_nsec1 h2{width: 100%; float: left; text-align: center; font-size: 30px; font-weight: 100; color: #333;}
.wrap_nsec1 h2 i{font-style: normal; color: #2d91ff;font-weight: 400; }
.wrap_nsec1 .main_func{float: left; width: 100%; margin: 80px 0; position: relative;}
.wrap_nsec1 .main_func:before{content: ''; width: 1140px; height: 1px; border-top: 4px #959595 dotted; position: absolute; left:0; top:96px; z-index: 0;}
.wrap_nsec1 .main_func li{float:left; width: 200px; height: 200px; border-radius: 100px; background: #2d91ff; color: #fff; font-size: 26px; z-index: 1; position: relative; margin-right: 35px; display: block;}
.wrap_nsec1 .main_func li:nth-child(even){background: #314f8c;}
.wrap_nsec1 .main_func li p{width: 200px; line-height: 32px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.wrap_nsec1 .main_func li:last-child{margin-right: 0;}
.wrap_nsec1 .btn_main_sec{ width: 300px; height: 58px; line-height: 60px; border-radius: 32px; border: 1px #2d91ff solid; background: #fff; display: inline-block; color: #2d91ff; font-size: 18px;}
#main_nsec2{float: left; width: 100%; background: #2d91ff;}
.wrap_nsec2{width: 1140px; margin: 100px auto 0;}
.wrap_nsec2 .sec_tit {margin: 50px 0 0;}
.wrap_nsec2 .sec_tit h2, .wrap_nsec2 .sec_tit h3{color: #fff;}
.wrap_nsec2 .sec_tit:before{border-color: #fff;}
.wrap_nsec2 .pc { width:1140px; height:600px;  background:url(../images/main_laptop.png) center 0 no-repeat; margin:50px auto 0; overflow: hidden}

.wrap_nsec2 .pc img{width: 1009px; margin-top: 48px; margin-left: 1px; }

.bx-controls { width:100%; margin:100px 0 0; position:relative; }
.bx-controls ul{ width: 114px; text-align: center; margin: 0 auto;}
.bx-controls li{ width:16px; height:16px; margin:0 6px; border:none; float:left;  }
.bx-controls li a.active { background:url(../images/btn_slide_on.png) 0 0 no-repeat; }
.bx-controls li a { background:url(../images/btn_slide_off.png) 0 0 no-repeat; text-indent:-9999px; display:block; border:none; }


/*footer*/
#footer {width:100%;height:100px;  background-color:#fff; border-top:1px #f0f0f0 solid; padding:15px 0; bottom:0; float:left; z-index:2900;}
#footer .foot_lt {float:left; font-size:13px; line-height:21px; color:#808080; margin-left:50px; margin-bottom:15px; font-weight:100; text-align:left; }
#footer .foot_rt {float:right; margin-right:50px; font-weight:100; line-height:25px;}
#footer .foot_rt #family_site { float:left; font-size:12px; width:148px; height:25px; border:1px #ccc solid; color:#808080; background:url(../images/ico_family.png) 132px 10px no-repeat; }
#footer .foot_rt .foot_menu {float:left; font-size:13px;}
#footer .foot_rt .foot_menu a{color:#808080;}
#footer .foot_rt .foot_menu li {float:left; margin-right:40px; color:#808080; cursor:pointer;}
#footer .foot_rt .foot_menu li:hover{text-decoration:underline;}
#footer .foot_bt{width:100%; float:left; height:40px; line-height:40px; text-align:center; border-top:1px #f0f0f0 solid;  font-family: 'Montserrat',sans-serif; font-size:12px; color:#999; }
#footer a.clean{ float:right; margin:-2px 0 0 20px; }
#select-title { float: left; text-align:left; cursor:pointer;  width:120px;padding:2px 20px 0 10px; }
#select-title:hover { text-decoration: none; color: #222; }
#select-layer { display: none; position:relative; margin:-114px 0px 0 -1px; width:148px; }
#select-layer { border: 1px solid #ababab; background: #fff; z-index:2000;}
#select-layer ul.site-list { overflow: auto; overflow-x:hidden; height: 112px; margin: 0 auto; }
#select-layer ul.site-list li { line-height: 28px; text-align:left; }
#select-layer ul.site-list li a { overflow: hidden; padding: 0 0 0 7px; display:block; color:#666; }
#select-layer ul.site-list li a:hover {   color: #222; background:#f5f5f5 }

/*main*/
#main_sec1{width:100%; padding:120px 0 80px; height:540px; float: left;}
.main_sec1{width:1140px; margin:0 auto;}
.sec_tit{width:100%; font-family: 'Montserrat',sans-serif; font-size:22px; margin:20px 0 50px; position:relative;}
#main_sec1 .sec_tit{ margin-bottom:100px;}
.sec_tit:before{left: 50%;top: -20px; width: 30px; height: 1px; border-top: 5px solid #333; content: ''; position:absolute; margin-left:-15px;}
.features{ width:100%; float:left; margin-bottom:100px;}
.features_box{ width:255px; float:left; margin-left:40px;}
.features_box:first-child{margin-left:0;}
.features_icon .fa{font-size: 42px; line-height: 100px; width: 100px; height: 100px; border-radius: 50px;}
.fe_ic1 .fa { color:#74c9d9; border:2px #74c9d9 solid; background:#fff;}
.fe_ic2 .fa { color:#1DA2E8; border:2px #1DA2E8 solid; background:#fff;}
.fe_ic3 .fa { color:#2d91ff; border:2px #2d91ff solid;  background:#fff;}
.fe_ic4 .fa { color:#314f8c; border:2px #314f8c solid;  background:#fff;}

.features h4{float:left; margin:25px 0 10px; width:100%; font-size:18px; line-height:24px;font-family:'nsb', sans-serif; font-weight:normal; color:#333;}
.features hr{width:235px; float:left; margin:0 15px;  border: 0; height: 1px; background: #ccc; }
.features .feature_desc{width:100%; float:left; font-size:15px; color:#666; line-height:24px; margin-top:15px;}

#main_sec2{width:100%; height:540px; padding:80px 0; background:url(../images/bg_main_news.png) center 0 no-repeat; float: left;}
.main_sec2{width:1140px; margin:0 auto;}
.together{ width:100%; float:left;}
.main_sec2 .sec_tit{ color:#fff; margin-bottom:30px;}
.main_sec2 .sec_tit h2{ color:#fff;}
.main_sec2 .sec_tit:before{ border-top: 5px solid #fff;}
.main_list_tit{ display:inline-block;height:25px; margin:20px auto 30px; color:#fff; font-size:17px; width:300px; margin-left:-120px;}
.go_all_media{ float:left; width:100%; margin-top:20px; }
.go_all_media a{display:inline-block; color:#fff; padding:15px 30px;font-size: 16px; border-radius: 6px; border:1px #fff solid;}

.slider1, .slider2 {  position: relative;  overflow: hidden; width:100%;  }
.slider1 ul, .slider2 ul {padding: 0 60px; }
.slider1 ul li.together_box {float: left; width:1140px;  position: relative;  display: block;   }
.slider1 ul li.together_box .together_list{width:1020px; height:280px;}
.slider1 ul li.together_box .together_list span{width:156px; height:37px; float:left; margin:0 7px 22px;}

#main_sec3{width:100%; height:700px; padding:80px 0; background:#f2f2f2; float: left;}
#main_sec3 .sec_tit{margin-bottom:20px;}
.main_sec3{width:1140px; margin:0 auto;}
#main_sec3 .main_list_tit{ color:#333; }

.customer{ width:100%; float:left;}
.slider2 ul li.customer_box {float: left; width:1140px;  position: relative;  display: block;  }
.slider2 ul li.customer_box .customer_list{width:950px; height:580px; padding:0 30px 0 40px;}
.slider2 ul li.customer_box .customer_list span{width:96px; height:96px; border-radius:48px; background:#fff; float:left; margin:0 10px 20px;}


a.control_prev, a.control_next {position: absolute; top:0; z-index: 999; display: block; width: 40px; height: 100%; color: #fff; text-decoration: none;  font-weight: 600; font-size: 48px; opacity: 0.7; cursor: pointer; line-height:420px;}
a.control_prev:hover, a.control_next:hover {  opacity: 1;  -webkit-transition: all 0.2s ease;}
a.control_next {  right: 0;}
#main_sec3 a.control_prev, #main_sec3 a.control_next{color:#333; line-height:710px;}

#download{width:100%; height:754px; padding:80px 0; background:#f2f2f2;}
#download .sub_sec{width:1140px; margin:0 auto;}
.sec_tit h2{font-family: 'Montserrat',sans-serif; font-size:8px; letter-spacing:5px; text-transform: uppercase; color:#666; font-weight:500;}
.sec_tit h3{ font-family:'nsr', sans-serif; font-weight:100; font-size:28px; margin:15px auto;}
.sec_tit p {font-family:'nsr', sans-serif; font-size:14px; line-height:20px; color:#333; }

/* FAQ */
#faq{width:100%; min-height:820px; padding:80px 0;  float:left;}
.faq{width:1140px; margin:0 auto;}
.faq dl{border-top:1px #ccc solid; margin-top:15px; width:1140px; float:left; background:#fff;}
.faq dl dt{width:1080px; font-size:15px; line-height:26px; border-bottom:1px #ddd solid; padding:10px 30px;  text-align:left; float:left;} 
.faq dl dt a{ text-decoration:none; color:#333; } 
.faq dl dt .faq_tit {width:890px; float:left;}
.faq dl dt .faq_date { float:left; background:url(../images/support/ico_tit_on.png) center left no-repeat; padding-left:10px; color:#ff2d19;}
.faq dl dt .faq_ico {width:20px; height:26px; float:right; background:url(../images/support/list_off.png) center left no-repeat;}
.faq dl dt.on{border-bottom:1px #eaeaea solid;}
.faq dl dt.on .faq_tit { color:#ff2d19;}
.faq dl dt.on .faq_date {background:url(../images/support/ico_tit_on.png) center left no-repeat; color:#ff2d19;}
.faq dl dt.on .faq_ico {background:url(../images/support/list_on.png) center left no-repeat;}
.faq dl dd{font-size:13px; line-height:18px; border-bottom:1px #ddd solid; width:1060px; height:auto;  padding:30px 40px; display:none; background:#f5f5f5; float:left;}  
.faq dl dd p {  width:100%; float:left; font-size:14px; line-height:22px; color:#555; text-align:left; margin:10px 0; font-weight:500;}
.faq dl dd p.faq_contit { width:100%; font-size:19px; line-height:28px; color:#222; float:left; margin-bottom:20px; }
.faq dl dd img { float:left; text-align:center;}
.faq .search {float:right; width:296px; height:36px; font-size:16px; font-weight:100; overflow:hidden;}
.faq .search input {display:inline-block; width:200px; height:18px; padding:8px 10px; border:1px #ccc solid; float:left;}
.faq .search a {display:block; padding:8px 20px; height:20px; line-height:20px; background:#ff2d19; color:#fff; float:left; margin-left:4px; font-size:15px; font-weight:500; border:none;}

/* NOTICE */
#notice{width:100%; padding:80px 0;  float:left;}
.notice{width:1140px; margin:0 auto;}
.notice dl{border-top:1px #ccc solid; margin-top:15px; width:1140px; float:left; background:#fff;}
.notice dl dt{width:1080px; height:50px;font-size:15px; line-height:51px; border-bottom:1px #ddd solid; padding:0 30px;  text-align:left; float:left;} 
.notice dl dt a{ text-decoration:none; color:#333; } 
.notice dl dt .new_tit {width:850px; float:left; padding-left:10px; background:url(../images/support/ico_tit.png) 0 25px no-repeat;}
.notice dl dt .new_date {width:200px; height:50px; float:left; color:#666}
.notice dl dt .new_ico {width:20px; height:50px; float:left; background:url(../images/support/list_off.png) 0 20px no-repeat;}
.notice dl dt.on{border-bottom:1px #eaeaea solid;}
.notice dl dt.on .new_tit {background:url(../images/support/ico_tit_on.png) 0 25px no-repeat; color:#ff2d19;}
.notice dl dt.on .new_date, .notice dl dt.on .noti_tit, .notice dl dt.on .noti_date {color:#ff2d19;}
.notice dl dt.on .new_ico {background:url(../images/support/list_on.png) 0 20px no-repeat;}
.notice dl dt .noti_ver {width:130px; float:left; padding-left:10px; background:url(../images/support/ico_tit.png) 0 25px no-repeat;}
.notice dl dt .noti_tit {width:720px; height:50px; float:left; color:#333}
.notice dl dt .noti_date {width:200px; height:50px; float:left; color:#666}
.notice dl dt .noti_ico {width:20px; height:50px; float:left; background:url(../images/support/list_off.png) 0 20px no-repeat;}
.notice dl dt.on .noti_ver {background:url(../images/support/ico_tit_on.png) 0 25px no-repeat; color:#ff2d19;}
.notice dl dt.on .noti_ico {background:url(../images/support/list_on.png) 0 20px no-repeat;}
.notice dl dd{font-size:13px; line-height:18px; border-bottom:1px #ddd solid; width:1060px; height:auto;  padding:30px 40px; display:none; background:#f5f5f5; float:left;}  
.notice dl dd p {  width:100%; float:left; font-size:14px; line-height:22px; color:#555; text-align:left; margin:10px 0; font-weight:500;}
.notice dl dd p.new_contit { width:100%; font-size:19px; color:#222; float:left; margin-bottom:20px; }
.notice dl dd img { float:left; text-align:center;}
.notice .search {float:right; width:296px; height:36px; font-size:16px; font-weight:100; overflow:hidden;}
.notice .search input {display:inline-block; width:200px; height:18px; padding:8px 10px; border:1px #ccc solid; float:left;}
.notice .search a {display:block; padding:8px 20px; height:20px; line-height:20px; background:#ff2d19; color:#fff; float:left; margin-left:4px; font-size:15px; font-weight:500; border:none;}
#price .tab, .notice .tab{width:100%; float:left; margin-bottom:20px;}
.notice .tab ul{ width:322px; margin:0 auto; }
#price .tab ul li, .notice .tab ul li{ width:160px; height:40px; border:1px #ccc solid; color:#999; float:left; font-size:14px; line-height:42px; margin-left:-1px; position:relative; cursor:pointer;}
#price .tab ul li a, .notice .tab ul li a{display:block; color:#999;}
#price .tab ul li.on, .notice .tab ul li.on{ border:1px #ff2d19 solid; color:#ff2d19; background:#fff; z-index:1000}
#price .tab ul li.on a, .notice .tab ul li.on a{ color:#ff2d19;}

/* paging */
.paging {width:100%; float:left; text-align:center;}
.paging ul { margin:40px auto;}
.paging li {overflow: hidden;display: inline-block;vertical-align: top; font-size:14px; font-weight:100; background:#fff}
.paging ul li a { color:#808080; display:block; width:30px; height:30px; border:1px #fff solid; line-height:32px;}
.paging ul li a:hover { border:1px #efefef solid; }
.paging ul li.active a { color:#ff2d19; font-weight:600;}
.paging li.first a{  text-indent:-9999px; background: url(../images/support/btn_first.png) 0 0 no-repeat;} 
.paging li.prev a{  text-indent:-9999px; background: url(../images/support/btn_prev.png) 0 0 no-repeat;} 
.paging li.next a{  text-indent:-9999px; background: url(../images/support/btn_next.png) 0 0 no-repeat;} 
.paging li.last a{  text-indent:-9999px; background: url(../images/support/btn_end.png) 0 0 no-repeat;} 
.paging li.first a:hover{ background: url(../images/support/btn_first_over.png) 0 0 no-repeat;} 
.paging li.prev a:hover{ background: url(../images/support/btn_prev_over.png) 0 0 no-repeat;} 
.paging li.next a:hover{ background: url(../images/support/btn_next_over.png) 0 0 no-repeat;} 
.paging li.last a:hover{ background: url(../images/support/btn_end_over.png) 0 0 no-repeat;} 


/* 문의하기 */
#call{width:100%; min-height:1310px; padding:80px 0; background:#f2f2f2;float:left; border-top:1px #ddd solid;}
.call{ width:1140px; margin:0 auto; min-height:900px;}
.call table{ width:100%; float:left; border-top:1px #ddd solid;}
.call th{background:#f6f6f6; height:45px; border-bottom:1px #ddd solid; border-left:1px #ddd solid; font-size:14px; color:#333;}
.call th:first-child, .call td:first-child{border-left:0;}
.call td{background:#fff;  border-bottom:1px #ddd solid; border-left:1px #ddd solid; font-size:14px; color:#666; padding: 10px 0; line-height: 24px;}
.call .call_box .agree_box { width:956px; height:145px; border:1px solid #e9e9e9; float:left; margin:20px 0 10px;padding:20px;font-size:13px;color:#666;line-height:24px;overflow:auto; text-align:left;}
.call .call_box .agree_box strong {font-size:14px;color:#333; font-weight:500;}
.call .call_box .agree_check { width:100%; float:left;padding-bottom:35px; font-weight:500; font-size:14px; border-bottom:1px #e5e5e5 solid; margin-bottom:35px;}
.call .call_box .agree_check p{width:240px; margin:0 auto;}
.call .call_box .agree_check input{ float:left; margin:2px 5px 0;}
.call .call_box .agree_check label{ float:left; margin:0;}
.call .call_box{width:998px; border:1px #ddd solid; background:#fff; float:left; margin-top:50px; padding:40px 70px; margin-bottom:100px;}
.call .call_box h3{ width:100%; float:left; text-align:left; font-weight:500; font-size:18px;}
.call .call_box dl {float:left; width:100%; margin:10px 0 10px; border-bottom:1px #ddd solid;}
.call .call_box dt {float:left; width:118px; border-bottom:1px #ddd solid; padding:10px; height:45px; line-height:45px; font-size:14px; text-align:left}
.call .call_box dd{float:left; width:840px; border-bottom:1px #ddd solid; padding:10px; height:45px; }
.call .call_box dd input { float:left; height:42px; border:1px #e4e4e4 solid; color:#666; padding:0 15px;}
.call .call_box dd input#commuTitle{width:670px;}
.call .call_box dd input.num{width:50px;}
.call .call_box dd input.mail{width:200px;}
.call .call_box dd span   { margin:0 5px; float:left; color:#666; line-height:45px;}
.call .call_box dd textarea {width:670px; float:left; height:78px;border:1px #efefef solid; color:#666; padding:15px; resize: vertical; }
.call .call_box .main_cont{min-height:110px; height: auto; border-bottom: 0;}
.call .call_box .call_send{width:100%; float:left; text-align:center; margin:10px 0 20px;}
.call .call_box .call_send p{display:inline-block; background:#ff2d19; color:#fff; font-size:15px; font-weight:500; border:none; width:140px; height:40px; line-height:40px; cursor:pointer;}


/* 제품소개 */
#product{width:100%; padding:80px 0; background:#fff; float:left;}
.product {width:1140px; margin:0 auto;}
.product .sub_sec{float:left; width:100%;}
.product .sec_tit{width:350px; margin-right:40px; float:left; text-align:left; }
.product .sec_tit:before {left:0; margin:0;}
.product .sec_tit h3{ line-height:38px;}
.product .sec_tit h4{font-weight:100; font-size:14px; margin:15px auto; line-height:28px; color:#999;}
.pro_feature{width:620px; float:right;}
.pro_box{width:100%; height:200px;float:left; margin-bottom:50px; position:relative;}
.pro_box img{float:left; width:255px; height:200px; margin-right:40px;}
.pro_box a{display:block; float:left;}
.pro_box a:hover *{ text-decoration:underline;}
.pro_tit{float:left; width:300px; text-align:left; color:#222; font-size:17px;}
.pro_box p{float:left; width:320px; text-align:left; color:#888; font-size:14px; line-height:30px; margin:10px 0;}
.pro_box p.pro_go{color:#333; font-weight:600; font-size:14px; bottom:0; margin:0; padding-left:295px; position:absolute;}

#pro_sec1{width:100%; float:left; background:url(../images/pro/bg_pro1.png) 0 0 no-repeat;  padding:100px 0;}
#pro_sec2{width:100%; float:left; background:url(../images/pro/bg_pro2.png) 0 0 no-repeat;  padding:100px 0;}
#pro_sec3{width:100%; float:left; background:url(../images/pro/bg_pro3.png) 0 0 no-repeat;  padding:100px 0;}
#pro_sec4{width:100%; float:left; background:url(../images/pro/bg_pro4.png) 0 0 no-repeat;  padding:100px 0;}
.pro_sec {width:1140px; margin:0 auto;}
.laptop {width:1140px; height:1000px; background: url(../images/pro/laptop.png) no-repeat center 0; overflow: hidden; margin:50px auto 0;}

.laptop .overflow {width: 867px;height: 542px;top: 48px;left: 144px;position: relative; }
.laptop .overflow .on { display:block; }
.laptop .overflow .off { display:none; }
.laptop .overflow img {width: 852px;height: 532px;;}
.serv_txt {  width:1000px; margin:0 auto;}
.serv_txt p { width:100%; font-size: 17px; color:#333; font-weight:100; line-height:26px; position:relative; padding-bottom:40px;}
.serv_txt a {color:#333; font-size:16px; font-weight:100; padding:8px 15px; border:1px #999 solid; position: relative;}
.serv_txt a:hover {color:#ff2d19;border:1px #ff2d19 solid; }
.tp_title .serv_txt{margin-top:800px;}
.wna {width:1000px; height:600px; background: url(../images/service/wna.png) no-repeat center; margin:150px auto 0;}


.mobile{width:1140px; height:900px; background: url(../images/pro/mobile.png) no-repeat center 0; overflow: hidden; margin:50px auto 0;}
.mobile .overflow {width: 304px;height: 540px;top: 92px;left: 419px;position: relative;overflow:hidden;}
.mobile .bx-pager { width:320px; margin:-500px 0 0; position:relative; float:left; text-align:right; }
.mobile .bx-pager.rt { width:320px; margin:-500px 0 0; position:relative; float:right; text-align:left; }
.mobile .bx-pager.rt *{text-align:left;}
.mobile .bx-pager ul{ width: 100%;margin: 80px auto 0; float:left;}
.mobile .bx-pager li.pro_thumb{ width:320px; height:240px; margin-bottom:40px;  float:left; text-align:right;  }
.mobile .bx-pager li.pro_thumb a .fa {text-align:center;}
.mobile .bx-pager li.pro_thumb{margin-left:0; text-align:right;}

.bx-pager { width:100%; margin:180px 0 0; position:relative; }
.bx-pager ul{ width: 100%;margin: 0 auto; float:left;}
.bx-pager li.pro_thumb{ width:255px; height:290px; margin-left:40px; float:left;  }
.bx-pager li:first-child{ margin-left:0;}
.bx-pager li.pro_thumb a {  width:255px; height:290px;display:block; border:none; float:right; }
.bx-pager.rt li.pro_thumb a { float:left; }
.bx-pager li.pro_thumb a .fa { font-size:32px; line-height:72px; width:72px; height:72px; border-radius:36px;}

.li1 .fa { background:#74c9d9;  border:2px #74c9d9 solid; color:#fff; }
.li2 .fa { background:#1DA2E8; border:2px #1DA2E8 solid;  color:#fff; }
.li3 .fa { background:#2d91ff; border:2px #2d91ff solid;  color:#fff; }
.li4 .fa { background:#314f8c; border:2px #314f8c solid;  color:#fff; }
.li1 a:hover .fa { color:#74c9d9; border:2px #74c9d9 solid; background:#fff;}
.li2 a:hover .fa { color:#1DA2E8; border:2px #1DA2E8 solid; background:#fff;}
.li3 a:hover .fa { color:#2d91ff; border:2px #2d91ff solid;  background:#fff;}
.li4 a:hover .fa { color:#314f8c; border:2px #314f8c solid;  background:#fff;}
.li1 a:hover span.pro_thumb_tit, .li2 a:hover span.pro_thumb_tit, .li3 a:hover span.pro_thumb_tit, .li4 a:hover span.pro_thumb_tit{text-decoration:underline;}
.bx-pager li.pro_thumb a .pro_thumb_tit {width:100%; float:left; margin:20px 0 10px; color:#333; font-size:16px;}
.bx-pager li.pro_thumb a .pro_thumb_txt {width:100%; float:left; color:#666; font-size:13px; line-height:20px;}


#pro_sec3 .bx-pager li.pro_thumb{ width:350px; height:290px; margin-left:40px; float:left;  }
#pro_sec3 .bx-pager li:first-child{ margin-left:0;}
#pro_sec3 .bx-pager li.pro_thumb a {  width:350px; height:290px;display:block; border:none; }

#pro_sec4 .bx-pager li.pro_thumb{ width:350px; height:290px; margin-left:40px; float:left;  }
#pro_sec4 .bx-pager li:first-child{ margin-left:0;}
#pro_sec4 .bx-pager li.pro_thumb a {  width:350px; height:290px;display:block; border:none; }


/* 신청/결제하러가기 */
#start{width:100%; float:left; background:#f2f2f2; padding:100px 0; border-top:1px #eee solid; }
.start{width:100%; float:left; margin-top: 40px;}
.start li.start_list {width:255px; height:300px;  float:left;}
.start li.arrow{width:40px; float:left;}
.start li.arrow .fa{color:#ddd; font-size:42px; height:300px;  line-height:200px; }
#start li.start_list .fa { color:#fff; font-size:42px; line-height:100px; width:100px; height:100px; border-radius:50px;}
#start li .start_thumb_tit {width:100%; float:left; margin:25px 0 15px; color:#333; font-size:18px;}
#start li .start_thumb_txt {width:100%; float:left; color:#666; font-size:15px; line-height:22px;}
#start .start_go{float:left; width:100%; height:60px; margin:30px 0 50px;}
#start .start_go a{ padding: 18px 30px; background: #ff4736; color: #fff; font-size: 18px; border-radius: 6px; display:inline-block }


/* 요금 */
#price{width:100%; padding:80px 0; background:#f2f2f2;  float:left;}
.price {width:1140px; margin:0 auto;}
.price_tit{width:100%; float:left; font-size:24px; margin-bottom:15px;color:#333;}
.price_list{width:253px; height: 410px; float:left; margin:10px 0 50px 40px; border:1px #dbdbdb solid; background:#fff}
.price_list h4{width:100%; height:70px; padding:15px 0; color:#fff; font-size:24px; line-height:36px; background:#74c9d9; font-weight:normal; float:left;}
.price_list h4.price_1hr{line-height:70px;}
.price_list .price_val{width:100%; color:#74c9d9; margin:15px 0 20px;font-family:'Montserrat',sans-serif; font-weight:normal; font-size:28px; float:left;}
.price_list .price_noti{width:100%; float:left; font-size:13px; color:#bbb;}
.price_list .price_noti2{width:100%; float:left; font-size:14px; color:#666; margin:15px 0;}
.price_list .price_line{width: 60%; border: none; background: #b7c0c6; height: 1px; float:left; margin:0 20%;}
.price_list .price_eg{width:100%; float:left; font-size:12px; color:#666; margin: -10px 0 5px; line-height: 1.4; font-weight: 600;}
.price_list .price_fun{width:215px; float:left; margin:15px 20px;}
.price_list .price_fun li{font-size:13px; float:left; margin:8px; color:#777; width:90px; line-height:20px; }
.price_list .price_fun li.pr_wd2{width:200px; }

.price .price_exp{width:1138px; float:left; color:#666; font-size:13px; height:50px; background:#f6f6f6; border:1px #ddd solid; line-height:50px;}
.price_list .price_fun li i{margin-right:6px; color:#777;}
.price_list.pr_li1{margin-left:0;}
.price_list.pr_li2 h4{background:#1DA2E8;}
.price_list.pr_li2 .price_val{color:#1DA2E8;}
.price_list.pr_li3 h4{background:#2d91ff;}
.price_list.pr_li3 .price_val{color:#2d91ff;}
.price_list.pr_li4 h4{background:#314f8c;}
.price_list.pr_li4 .price_val{color:#314f8c;}
.price_news.p_list3 .price_list.pr_li1{margin-left:295px;}

.price_list .firstedition{width: 204px; padding-right: 50px;}
.price_list .firstedition .fe_link{font-size: 12px; color: #fff; border: 1px #fff solid; padding: 5px 8px; line-height: 12px; border-radius: 8px; margin-left: 10px; margin-top: 20px; position: absolute;}
.price_list .firstedition .fe_link i{margin-left: 5px; font-size: 14px;}

.tab{width:100%; float:left; margin-bottom:20px;}
.tab ul{ width:644px; margin:0 auto; }
.tab ul li{ width:160px; height:40px; border:1px #ccc solid; color:#999; float:left; font-size:14px; line-height:42px; margin-left:-1px; position:relative; cursor:pointer;}
.tab ul li.on{ border:1px #ff2d19 solid; color:#ff2d19; background:#fff; z-index:1000}

.tab.tab2 ul{ width:322px; margin:0 auto; }
.tab.tab3 ul{ width:483px; margin:0 auto; }

.price_b2c_mess{float: left; width: 100%; text-align: left; background: #fff; border: 1px #e6e6e6 solid; padding: 5px 30px 10px;box-sizing: border-box;}
.price_b2c_mess p{float: left; width: 100%; text-align: left; font-size: 16px; color: red; margin-bottom: 8px; margin-top: 15px;}
.price_b2c_mess span{float: left; width: 100%; text-align: left; font-size: 14px; margin-bottom: 5px; color: #666; line-height: 1.6;}


#media{width:100%; padding:80px 0; float:left;}
.media_list ul{ display: grid; grid-template-columns: repeat(9, 1fr); grid-column-gap: 5px; grid-row-gap: 10px;}
.media_list{width:1140px; margin:0 auto;}
.media_list dt{float:left; width:100%; color:#ff2d19; font-size:14px; font-weight:600; text-align:left; margin:10px 0 5px;}
.media_list dd{width:100%; float:left;}
.media_list dd li{width: 120px; height: 36px; border: 1px #e6e6e6 solid; line-height:36px;  float:left;}
.media_list dd li img{max-height:20px; max-width:92px; vertical-align:middle;}


#pop1{ position:fixed; left:0; top:0; bottom:0; width:100%; z-index:3000; display:none; overflow:hidden;overflow-y:auto;}
#pop1 .pop_bg {position:fixed;top:0;bottom:0;left:0;width:100%; height:100%;cursor:pointer;background:rgba(0, 0, 0, .5); overflow:hidden;overflow-y: auto;}
#pop1 .pop_layer { background:#fff;} 
#pop1 .pop_layer.pop_1 { width:900px; height:600px; position:absolute; top:50%; left:50%; margin:-300px 0 0 -450px;}
#pop1 .pop_layer h1{height:58px;background:#fff;color:#333; border-bottom:2px #ff2d19 solid; font-size:24px;line-height:60px; font-weight:400; display:inline-block; width:100%; text-align:left; text-indent:25px;}
#pop1 .pop_layer .pop_wrap { padding:20px;overflow: hidden;    overflow-y: auto;}
#pop1 .pop_layer .pop_wrap .pop_close{position:absolute;top:16px;right:20px}
#pop1 .pop_layer .pop_wrap .pop_close p{display:block; width:28px; height:28px; background:url(../images/pop_close.png) 0 0 no-repeat; text-indent:-9999px;}
#pop1 .pop_layer .pop_wrap .pop_cont { height:440px; border:1px #ddd solid; overflow:auto; }
#pop1 .pop_layer .pop_wrap .pop_ok {margin-top:18px;}
#pop1 .pop_layer .pop_wrap .pop_ok p {width:120px; height:36px; line-height:36px; font-size:14px; border:1px solid #222; color:#222; display:block; margin:0 auto; }
#pop1 .pop_layer .pop_wrap .pop_ok p:hover{color:#ff2d19; border:1px solid #ff2d19;}

#pop1 .pop_layer .pop_wrap .pop_cont .sitemap{width:200px; float:left; margin-top:40px; }
#pop1 .pop_layer .pop_wrap .pop_cont .sitemap dt{ font-size:30px; font-weight:100; color:#333; float:left; width:100%;}                   
#pop1 .pop_layer .pop_wrap .pop_cont .sitemap dd{ float:left; width:100%; font-size:15px; line-height:35px;}   
#pop1 .pop_layer .pop_wrap .pop_cont .sitemap dd a{ color:#555;}
#pop1 .pop_layer .pop_wrap .pop_cont .sitemap dd .box_line{ margin:10px auto; width:30px; height:2px; background:#444;}
#pop1 iframe{border:0;}

#pop2{ position:fixed; left:0; top:0; bottom:0; width:100%; z-index:3000; display:none; overflow:hidden;overflow-y:auto;}
#pop2 .pop_bg {position:fixed;top:0;bottom:0;left:0;width:100%; height:100%;cursor:pointer;background:rgba(0, 0, 0, .5); overflow:hidden;overflow-y: auto;}
#pop2 .pop_layer { background:#fff;} 
#pop2 .pop_layer.pop_1 { width:900px; height:600px; position:absolute; top:50%; left:50%; margin:-300px 0 0 -450px;}
#pop2 .pop_layer h1{height:58px;background:#fff;color:#333; border-bottom:2px #ff2d19 solid; font-size:24px;line-height:60px; font-weight:400; display:inline-block; width:100%; text-align:left; text-indent:25px;}
#pop2 .pop_layer .pop_wrap { padding:20px;overflow: hidden;    overflow-y: auto;}
#pop2 .pop_layer .pop_wrap .pop_close{position:absolute;top:16px;right:20px}
#pop2 .pop_layer .pop_wrap .pop_close p{display:block; width:28px; height:28px; background:url(../images/pop_close.png) 0 0 no-repeat; text-indent:-9999px;}
#pop2 .pop_layer .pop_wrap .pop_cont { height:440px; border:1px #ddd solid; overflow:auto; }
#pop2 .pop_layer .pop_wrap .pop_ok {margin-top:18px;}
#pop2 .pop_layer .pop_wrap .pop_ok p {width:120px; height:36px; line-height:36px; font-size:14px; border:1px solid #222; color:#222; display:block; margin:0 auto; }
#pop2 .pop_layer .pop_wrap .pop_ok p:hover{color:#ff2d19; border:1px solid #ff2d19;}

#pop2 .pop_layer .pop_wrap .pop_cont .sitemap{width:200px; float:left; margin-top:40px; }
#pop2 .pop_layer .pop_wrap .pop_cont .sitemap dt{ font-size:30px; font-weight:100; color:#333; float:left; width:100%;}       
#pop2 .pop_layer .pop_wrap .pop_cont .sitemap dt a{color:#333;}
#pop2 .pop_layer .pop_wrap .pop_cont .sitemap dd{ float:left; width:100%; font-size:15px; line-height:35px;}   
#pop2 .pop_layer .pop_wrap .pop_cont .sitemap dd a{ color:#555;}
#pop2 .pop_layer .pop_wrap .pop_cont .sitemap dd .box_line{ margin:10px auto; width:30px; height:2px; background:#444;}


.policy{ width:800px; text-align:left;}
.policy .policy_info { float:left;color:#333; font-size:14px; line-height:22px; padding-bottom:30px; border-bottom:1px solid #dcdcdc; }
.policy .policy_history { float:left; width:100%; padding:10px 0; }
.policy .policy_history select { float:right; font-size:12px; padding:3px 10px 4px; border-radius:4px; }
.policy section{ float:left; margin-bottom:25px; font-size:12px; width:100%;}
.policy section *{font-family:"맑은고딕", Malgun Gothic;}
.policy section h5{font-size:12px; color:#666; margin:15px 0 5px;}
.policy section ol {float:left; width:100%; margin:15px 0; }
.policy section ol li { float:left; width:380px; line-height:20px; }
.policy section ol li a { color:#555; }
.policy section ol li a:hover{text-decoration:underline;}
.policy section h4 { font-size:14px; margin-bottom:8px; color:#ff2d19; font-weight:normal;}
.policy section p { color:#666; }
.policy section p span{padding-left:10px; width:790px; float:left; margin:5px 0;}

.policy section table{float:left; width:100%; margin:5px 0 10px; border-top:2px #666 solid; }
.policy section th{padding:7px 0; border-bottom:1px solid #919191;border-left:1px solid #e4e4e4;background:#f9f9f9;line-height:17px;color:#000; text-align:center;}
.policy section td{padding:6px 10px;border-bottom:1px solid #e4e4e4;border-left:1px solid #e4e4e4;text-align:center;}


.price_b2c_mess > span > span{text-indent: 40px; float: left;}
.mess_ex{margin-top: 5px;}
.start_thumb_txt a{color: blue;}




.bn-wrap *{box-sizing: border-box;}
.bn-wrap{position: fixed; z-index: 1000; width: 420px; height: 257px; right: 30px; bottom: 90px;box-shadow: 0 5px 15px rgba(0,0,0,0.5); overflow: hidden; text-align: left;}


.bn-float {position: absolute; top: 0; right: -420px; width: 420px; height: 227px; padding: 30px; }

.bn-nyt h1{font-size: 17px; font-weight: 800; color: #666; margin: 8px 0;}
.bn-nyt h2{font-size: 23px; font-weight: 700; color: #000; line-height: 1.4; margin-bottom: 10px;}

.bn-topnews h1{display: none;}
.bn-topnews h2{display: none}

.bn-float.bn-topnews{ background: url('https://dahami.com/images/bg-float3.png') 0 0 no-repeat; background-size: cover; }
.bn-float.bn-ndpt{ background: url('https://dahami.com/images/bg-float.png') 0 0 no-repeat; background-size: cover; }

.bn-float h1{font-size: 17px; font-weight: 800;
    background: linear-gradient(90deg,#5DCFFF 0%,#FFDDB7 80%, #FF941C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin: 8px 0;}
.bn-float h2{font-size: 23px; font-weight: 700; color: #fff; line-height: 1.4; margin-bottom: 10px;}

.bn-btn {height: 44px; line-height: 40px; padding-left: 30px; padding-right: 30px; border-radius: 30px; color: #fff; font-size: 15px; font-weight: 600; display: inline-block; }
.btn-nyt{ background: #086FFF;  border:2px solid #086FFF ;}

.bn-float .btn-ndpt:hover{background-image:linear-gradient(to right ,#086FFF, #FF941C);}
.btn-ndpt{
    border:2px solid transparent ;
    background-image:linear-gradient(#000, #000), linear-gradient(to right ,#086FFF ,#5DCFFF, #FFDDB7);
    background-origin:border-box;
    background-clip:padding-box, border-box;   }

.btn-topnews{
    margin-top: 130px;
    border:2px solid transparent ;
    background-image:linear-gradient(#000, #000), linear-gradient(to right ,#8f602b ,#e1ab4d, #fffada, #e9d388, #85541c);
    background-origin:border-box;
    background-clip:padding-box, border-box;   }
.bn-float .btn-topnews:hover{background-image:linear-gradient(to right ,#8f602b ,#e1ab4d, #e9d388,#e1ab4d, #85541c);}

.bn-btn span{float: right;width: 16px; height: 16px; background: url('https://dahami.com/images/arrow1.png') 0 0 no-repeat; filter: invert(50%) sepia(85%) saturate(2110%) hue-rotate(188deg) brightness(103%) contrast(101%); background-size: cover;margin-left: 20px; margin-top: 12px;}
.btn-topnews span{filter: invert(100%) sepia(5%) saturate(0%) hue-rotate(53deg) brightness(105%) contrast(109%); }
.bn-float .bn-btn:hover span{filter: invert(100%) sepia(5%) saturate(0%) hue-rotate(53deg) brightness(105%) contrast(109%); animation:move 0.5s ease-in infinite alternate; }
.bn-ft{width: 100%; height: 36px; padding: 0 16px; background: #333; display: flex; align-items: center; position: absolute; bottom: 0; cursor: pointer; }
.bn-ft:hover{ background: #444;}
.bn-ft:hover p{font-weight: 700;}
.bn-ft p{color: #fff; width: 100%; text-align: center;font-size: 14px;}
@keyframes move{
  0%{transform:translate(-5px, 0)}
  100%{transform:translate(5px, 0)}
}
    
.float-close{position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; background: #000; opacity: 0.5; border-radius: 16px; z-index: 1001; cursor: pointer; text-align: center;}
.float-close:hover{opacity: 0.8;}    
.float-close p{font-size: 16px; transform: scaleX(1.28); color: #fff; opacity: 0.8; line-height: 32px;}

#bn1 {
    right: 0;
}
#bn2 {
    right: -420px;
    animation: slideInOut 8s infinite; 
    animation-delay: 5s; 
}

@keyframes slideInOut {
    0% {
        right: -420px; 
    }
    10% {
        right: 0;
    }
    50% {
        right: 0; 
    }
    60% {
        right: 420px;
    }
    100% {
        right: 420px; 
    }
}



@media screen and (max-width:768px){    
    .bn-wrap {right: 0; bottom: 0;left: 50%; margin-left: -210px;}}