@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');
*{margin: 0; padding: 0; box-sizing: border-box; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -0.35px; outline: 0;}
body{min-width: 1200px; overflow: auto;}

a{text-decoration: none; cursor: pointer;}
li{list-style: none;}
button{cursor: pointer;}
td{table-layout:fixed; word-break:break-all;}
a:hover{text-decoration: none!important;}
.bl{color: #3457ea;}
.lt{float: left;}
.rt{float: right;}
header{position: relative; width: 100%; z-index: 10; background: #fff; float: left;}
main{position: relative; float: left; }
.gnb{ width: 100%; height: 72px; padding: 0 60px;display:flex; min-width: 1200px;}
.gnb .logo{float: left; width: 130px; height: 40px; background: url(../images/basic/img_lofo_TP.png) 0 0 no-repeat; text-indent: -9999px; margin-top: 16px;}
.gnb .logo a{display: block; height: 32px;}
.gnb .menu{margin: 0 auto; text-align: center;}
.gnb .menu ul{}
.gnb .menu ul li{display: inline-block; padding: 0 40px; height: 72px; text-align: center; text-transform: uppercase; font-size: 18px;}
.gnb .menu ul li a {font-family: 'Montserrat';  color: #595959; line-height: 72px; display: block;}
.gnb .menu ul li .new{padding: 2px 6px; border: 1px #ed1c24 solid; color: #ed1c24; font-size: 10px; border-radius: 10px; font-style: normal; text-transform:none; margin-left: 8px; font-weight: 400; display: inline-block; line-height: 14px; float: right; margin-top: 26px;}
.gnb .menu ul li.on a{color: #3457ea; font-weight: 700; font-size: 20px;}
.gnb .noti{ background: #ed1c24; border-radius: 30px; text-align: center;font-size: 17px; line-height: 32px;}
.gnb .noti a{color: #fff;font-family: 'Montserrat'; text-transform: uppercase;  width: 96px; height: 32px; display: block; font-weight: 500;}
.inner{width: 1200px; margin: 0 auto; }

footer{width: 100%; height: 180px; padding: 25px 60px; background: #e6eaf2; display:grid; grid-template-column: 1fr 1fr; gap:10px;}
footer .foot_lt{ font-size: 13px; color: #7c7e84; line-height: 1.6; padding-left: 100px; background: url(../images/basic/img_logo_dahami.png) 0 0 no-repeat; grid-column: 1 / 2;}

footer .foot_rt {display:flex; grid-column: 2 / 3; justify-content:flex-end; align-items:center; gap:40px;}
footer .foot_rt .foot_menu {font-size:15px; display:flex; gap:40px;}
footer .foot_rt .foot_menu li{ color:#808080; cursor:pointer;}
footer .foot_rt .foot_menu li a{color: #808080;}
footer .foot_rt .foot_menu li.color{color: #000;}
footer .foot_rt .foot_menu li:hover{text-decoration:underline;}
            
footer .foot_rt #family_site {  font-size:15px; width:160px; height:36px; border:1px #ccc solid; color:#808080; background:url(../images/basic/btn_arrow_insert_down.png) right 5px no-repeat; background-color: #fff; border-radius: 5px; padding: 4px 0;}
#select-title {  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:160px; }
#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: 30px; text-align:left; font-size: 13px;}
#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 }

.gs{width: 72px; height: 36px; background: url(../images/basic/img_logo_gs.png) center no-repeat;text-indent: -9999px; display:inline-flex}
footer .foot_bt{width: 100%; color: #666; font-size: 15px; font-weight: 500; text-transform: uppercase; grid-column: 1 / 3; display:flex; align-items: center; justify-content: space-between;}
footer .foot_bt *{display:flex;}

#top{position: fixed; bottom:30px; right:40px; z-index: 1000; display: block; width: 44px; height:44px; font-size: 13px;  cursor: pointer; border-radius:10px; border: 1px #7c7e84 solid; background:url(../images/basic/btn_arrow_up.png) -9px -17px no-repeat #fff; line-height:60px; text-align: center;}
#top a{color:#666; display:block;}


/* main */
.main_visual{width: 100%; height: 760px; background:url(../images/home/img_home_back.png) center no-repeat; background-size: cover;overflow: hidden; position: relative;}
.main_vis_box{width: 100%; background: rgba(0,27,74,0.8); height: 80px; position: absolute; bottom: 0;}
.main_vis_box li{float: left; width: 300px; height: 80px; line-height: 80px; text-align: center; color: #c8c8c8; font-size: 20px; font-weight: 700; cursor: pointer;}
.main_vis_box li.menu-0{width: 0px;}
.main_vis_box li:before{content: ''; float: left; width: 1px; height: 30px; background: #f5f6fa; margin-top: 25px;}
.main_vis_box li:hover{color: #fff;}
.main_visual .vis_tit{ width: 100%; margin-top: 0; color: #002b8f; font-size:24px; font-weight: 300; letter-spacing: 7px; }
.main_visual .vis_tit2{ width: 100%; margin-top: 10px; color: #002b8f; font-size:90px; line-height: 1.22; font-weight: 500;  }
.main_sec1{width: 100%; height: 780px; float: left; background: #f5f6fa; position: relative; z-index: 1;}
.sec_tit{ width: 100%; text-align: center; font-size: 48px; font-weight: 600; letter-spacing: -1px; color: #3457ea; position: relative; padding-bottom: 50px;}
.sec_tit:after{content: ''; width: 100px; height: 2px; background: #3457ea; position: absolute; left: 50%; margin-left: -50px; top: 100px;}
.sec_txt{f width: 100%; text-align: center; font-size: 24px; color: #333;}
.main_visual > .inner{position: relative; margin-top: 120px;}
.main_visual .btn_main_more{float: left; width: 240px; height: 48px; border: 2px #002382 solid; border-radius: 24px; text-align: center; line-height: 44px; font-size: 18px; color: #002382;  margin-top: 30px;}
.main_visual .btn_main_more span{float: left; margin: 0 5px 0 55px; font-weight: 600;}
.main_visual .btn_main_more i{ width: 36px; height: 48px; background: url(../images/home/ic_home_main_more.png) 0 -2px no-repeat; float: left;}
@keyframes bg{
  0%{
    opacity: 0;
    margin-top: 40px;
  }
  100%{
    opacity: 1;
  }
}

.bg_area{ position: absolute; right: -30px; top: 50px; height: 728px; }
.bg_area img{
    animation-name: bg;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
}

.slide0{float: left;width: 100%; z-index: 50; margin-top: -420px;}
.slide0 .swiper-slide img{opacity: 0; position: absolute;}
.slide0 .swiper-slide.swiper-slide-active img{
    animation-name: bg2;
    animation-duration: 1s;
    animation-fill-mode: forwards;}
@keyframes bg2{
  0%{opacity: 0;}
  100%{opacity: 1;}
}
.slide0 .menu-img1 img{right:148px; top: -45px;}
.slide0 .menu-img2 img{right:148px; top: -45px;}
.slide0 .menu-img3 img{right:-12px; top: 25px;}
.slide0 .menu-img4 img{right:-50px; top: 290px;}

.slide0 .swiper-pagination2.swiper-pagination-white{text-align: left; bottom: -100px; position: absolute;}
.slide0 .swiper-pagination2.paging2{z-index: 500; bottom: -258px; position: absolute;}
.slide0 .swiper-pagination2.paging2 .swiper-pagination-bullet{float: left;width: 300px;height: 80px;line-height: 80px;text-align: center;color: #b8b8b8;font-size: 20px;font-weight: 600;cursor: pointer;background: none;margin: 0;opacity: 1;}
.slide0 .swiper-pagination2.paging2 .swiper-pagination-bullet.swiper-pagination-bullet-active{color: #fff;}
.slide0 .swiper-pagination2.paging2 span:nth-child(1){display: none;}
.slide0 .swiper-pagination2.paging2 span:nth-child(2):after{content: '오늘의 1면 주요기사';}
.slide0 .swiper-pagination2.paging2 span:nth-child(3):after{content: '워드클라우드';}
.slide0 .swiper-pagination2.paging2 span:nth-child(4):after{content: '추천 도서';}
.slide0 .swiper-pagination2.paging2 span:nth-child(5){width: 299px;}
.slide0 .swiper-pagination2.paging2 span:nth-child(5):after{content: '사용자 맞춤 설정';}
.slide0 .swiper-pagination2.paging2 span:before{content: ''; float: left; width: 1px; height: 30px; margin-top: 26px; background: #f5f6fa;}

.slide0 .swiper-pagination2.paging2:after{content: ''; float: right; width: 1px; height: 30px; margin-top: 26px; background: #f5f6fa;}

.sec_box{float: left; width: 100%; margin-top: 40px;}
.sec_box ul li{float: left; width: 285px; margin-right: 20px;}
.sec_box ul li:last-child{margin-right: 0;}
.sec_box ul li .main_ico{width: 100px; height: 100px; border-radius: 50px; background: #fff; float: left; margin: 0 0 36px 92px; text-indent: -9999px;}
.sec_box ul li .ico_box1{background: url(../images/home/ico_home_function3.png) 0 0 no-repeat;}
.sec_box ul li .ico_box2{background: url(../images/home/ico_home_function4.png) 0 0 no-repeat;}
.sec_box ul li .ico_box3{background: url(../images/home/ico_home_function2.png) 0 0 no-repeat;}
.sec_box ul li .ico_box4{background: url(../images/home/ico_home_function1.png) 0 0 no-repeat;}
.sec_box ul li .box{width: 100%; height: 200px; padding: 24px 20px; background: #fff; text-align: center; float: left;}
.sec_box ul li .box_tit{margin-bottom: 24px; font-weight: 700; font-size: 24px;}
.sec_box ul li .box_txt{font-size: 18px; color: #666; line-height: 1.67; text-align:left;}
.sec_box ul li:nth-child(2) .box_txt{letter-spacing:-1.3px;}
.sec_box .disc{width:100%; padding-left:20px;}
.sec_box .disc li{list-style:disc; width:auto; margin:0; text-indent:-5px;}
.ls{letter-spacing:-1.5px;}
.btn_go_untact{display: none;}
/*
.btn_go_untact a{display: block; color: #fff; width: 100%; line-height: 80px; font-size: 20px;}
.btn_go_untact a i{width: 16px; height: 16px; background: url(../images/home/ico_go_link.png) 0 0 no-repeat; display: inline-block; margin-left: 5px;}
.btn_go_untact a:before{content: ''; float: left; width: 1px; height: 30px; margin-top: 26px; background: #f5f6fa;}
.btn_go_untact a:after{content: ''; float: right; width: 1px; height: 30px; margin-top: 26px; background: #f5f6fa;}
*/
.btn_area{float:left; width: 100%; text-align: center; margin: 60px 0; }
.btn_area a{width: 240px; text-align: center; color: #fff; background: #3457ea; font-size: 20px; height: 48px; line-height: 48px; border-radius: 24px; display: inline-block; }

main section > .inner{padding: 60px 0;}
.main_sec2{width: 100%;  float: left; background: #fff; position: relative; }
.main_sec3{width: 100%; float: left; background: #f5f6fa; position: relative; }

.swiper-container { width: 100%; height: 100%; }
.sub1_sec6{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative; }
.sub1_sec6 > inner{width: 1200px; height: 800px;}
.sub1_sec6 .swiper-container { width: 100%; height: 300px; margin:0 auto; }
.sub1_sec6 .swiper-slide {background-size: auto 540px; background-repeat: no-repeat; background-position: center 5px; }
.sub1_sec6 .swiper-slide .case{position: absolute; bottom: 0; width: 100%; text-align: center; font-size: 24px; color: #333;}
.sub1_sec6 .swiper-slide .case span{font-weight: bold; margin-right: 5px;}
.sub1_sec6 .gallery-top { height: 586px; width: 100%; margin-top: 20px; float: left;}
.sub1_sec6 .gallery-thumbs { height: 200px; box-sizing: border-box; padding: 0; margin: 30px 0; float: left; }
.sub1_sec6 .gallery-thumbs .swiper-wrapper{ display: none;}
.sub1_sec6 .gallery-thumbs .on {display: flex;}
.sub1_sec6 .gallery-thumbs .swiper-slide { height: 160px; opacity: 0.6; background-size: contain; background-repeat: no-repeat; background-position: center;}
.sub1_sec6 .gallery-thumbs .swiper-slide-thumb-active { opacity: 1; }
.sub1_sec6 .gallery-thumbs .ex_tit { position: absolute; bottom: -35px; width: 100%; text-align: center; font-size: 18px; color: #333;}
.sub1_sec6 .swiper-pagination{float: left; width: 100%; position: relative; }
.sub1_sec6 .swiper-pagination span{margin: 0 4px;}

.swiper-container .swiper-pagination-bullets{bottom: -5px;}
.swiper-container .swiper-button-prev, .swiper-container .swiper-button-next{width: 60px; height: 60px; border-radius: 8px;--swiper-theme-color:#fff; background: #c3cad9; }
.swiper-container .swiper-button-prev:hover, .swiper-container .swiper-button-next:hover{width: 60px; height: 60px; border-radius: 8px;--swiper-theme-color:#fff; background: #8a9abb; }
.swiper-container .swiper-button-prev:after{content: ''; width: 12px; height: 24px; background: url(../images/basic/ico_prev.png) 0 0 no-repeat; display: inline-block;}
.swiper-container .swiper-button-next:after{content: ''; width: 12px; height: 24px; background: url(../images/basic/ico_next.png) 0 0 no-repeat; display: inline-block;}
.swiper-pagination-bullet.swiper-pagination-bullet-active{width: 30px; height: 8px; border-radius: 4px; background: #737780;}
.slide_media{width: 1000px; float: left; margin: 50px 100px 20px;}
.slide_media li{float: left; width: 160px; height: 68px; margin-right: 8px; margin-bottom: 20px;text-align: center; line-height: 68px;}
.slide_media li img{max-width: 100%; max-height: 100%;}
.slide_media li:nth-child(6n){margin-right: 0;}

.slide_customer{width: 1080px; float: left; margin: 30px 85px 20px;}
.slide_customer li{float: left; width: 190px; height: 60px; margin-right: 20px; margin-bottom: 25px; background: #fff; text-align: center; border: 1px #c8c8c8 solid;}
.slide_customer li img{max-width: 100%; max-height: 100%;}
.slide_customer li:nth-child(5n){margin-right: 0;}

.slide3 .swiper-pagination.paging3{float: left; position: relative; margin-top: 50px;}
.slide3 .swiper-pagination.paging3 .swiper-pagination-bullet{width: 220px; height: 48px; line-height: 30px; text-align: center; color: #333; font-size: 22px; font-weight: 400; cursor: pointer; background: none; margin: 0; opacity: 1; border-radius: 0;}
.slide3 .swiper-pagination.paging3 .swiper-pagination-bullet.swiper-pagination-bullet-active{color: #3457ea; border-bottom: 2px #3457ea solid; font-size: 24px; font-weight: 800;}
.slide3 .swiper-pagination.paging3 span:nth-child(1):after{content: '공공도서관';}
.slide3 .swiper-pagination.paging3 .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(2){display: block; position: absolute; top: 0; left: 50%; margin-left: -330px; background: #f5f6fa;}
.slide3 .swiper-pagination.paging3 span:nth-child(2){display: none;}
.slide3 .swiper-pagination.paging3 span:nth-child(2):after{content: '공공도서관';}
.slide3 .swiper-pagination.paging3 span:nth-child(3):after{content: '공공기관';}
.slide3 .swiper-pagination.paging3 span:nth-child(4):after{content: '대학도서관';}

.slide3 .swiper-pagination-white{width: 100%; text-align: center;}
.slide3 .swiper-pagination-white span{margin: 0 4px;}
.slide3 .swiper-pagination-white span:nth-child(3),.slide3 .swiper-pagination-white span:nth-child(4){display: none;}
.slide3 .swiper-pagination-white span.swiper-pagination-bullet-active:nth-child(3), .slide3 .swiper-pagination-white span.swiper-pagination-bullet-active:nth-child(4){display: block; width: 100%; background: #f5f6fa; position: absolute; height: 10px; top: 10px;}


.sub_visual{width: 100%; height:287px; overflow: hidden; position: relative;  background-size: cover;}
#product .sub_visual{background: url(../images/img_top_pdt.png) 0 0 no-repeat; background-size: cover;}
#price .sub_visual{background: url(../images/img_top_prc.png) 0 0 no-repeat; background-size: cover;}
#support .sub_visual{background: url(../images/img_top_spt.png) 0 0 no-repeat; background-size: cover;}
#notice .sub_visual{background: url(../images/img_top_ntc.png) 0 0 no-repeat; background-size: cover;}
#magazine .sub_visual{background: url(../images/img_top_pm.png) 0 0 no-repeat; background-size: cover;}

.sub_visual:after{content: ''; position: relative; float: left; margin-top: 100px; margin-left: -25%; width: 150%; height: 30vh; border-radius: 100%; background: #f5f6fa; z-index: 10; }
#support .sub_visual:after{ background: #fff;  }
.sub_visual .inner{margin-top: 86px; height: 110px;}
.sub_visual p, .sub_visual p b{color: #fff; text-align: center; }
.sub_visual .sub_tit{ font-size: 24px;margin-top: 20px; line-height: 1.6;}
.sub_visual .sub_tit2{margin-top: 10px; font-size: 54px; font-weight: 500;}
.tab{float: left; width: 100%; background: #f5f6fa; padding-top: 80px;}
.tabs{width: 1200px; top: 387px; margin: 0 auto;}
.tabs ul{width: 800px; margin: 0 auto;}
.tabs ul li{width: 400px; height: 60px; line-height: 58px; font-size: 24px; color: #666; background: #fff; border: 1px #707070 solid; text-align: center; position: relative; float: left; margin-left: -1px; cursor: pointer;}
.tabs ul li:last-child:after{content: '';width: 1px; height: 60px; background: #3457ea;position: absolute; left: -1px; top: -1px; z-index: 20; }
.tabs ul li.on{border: 1px #3457ea solid; color: #3457ea; font-weight: 600;}

.tabs2{float: left; margin-top: 60px; width: 100%;}
.tabs2 ul{width: 660px; margin: 0 auto;display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center;}
.tabs2 ul li{width: 220px; height: 48px; line-height: 30px; text-align: center; color: #333; font-size: 22px; font-weight: 400; cursor: pointer;}
.tabs2 ul li.on{color: #3457ea; border-bottom: 2px #3457ea solid; font-size: 24px; font-weight: 800;}


/* product */
.sub1_sec1{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.sub1_sec1 .prod0 .prod_visual{float: left;width: 100%; background: url(../images/product/img_product_home_h.png) 0 0 no-repeat; height: 600px; margin-top: 30px; position: relative;}
.sub1_sec1 .prod0 .prod_visual img{position: absolute; opacity: 0; }
.sub1_sec1 .prod0 .prod_visual img.menu-img1{left: 0; top: -50px;}
.sub1_sec1 .prod0 .prod_visual img.menu-img2{left: 0; top: -50px;}
.sub1_sec1 .prod0 .prod_visual img.menu-img3{left: 0; top: -20px;}
.sub1_sec1 .prod0 .prod_visual img.menu-img4{left: 0; top: -38px;}
.sub1_sec1 .prod0 .prod_visual img.imgv{display: none;}
.sub1_sec1 .prod0 .prod_box{}
.sub1_sec1 .prod0 .prod_box ul{width: 100%;}
.sub1_sec1 .prod0 .prod_box ul li{float: left; width: 285px; height: 200px; margin-right: 20px; border: 1px #3457ea solid; text-align: center; padding: 20px; background: #fff; cursor: pointer;}
.sub1_sec1 .prod0 .prod_box ul li:hover{background:linear-gradient(to bottom, #0077ff, #3457ea);}
.sub1_sec1 .prod0 .prod_box ul li:last-child{margin-right: 0;}
.sub1_sec1 .prod0 .prod_box ul li .box_tit{font-size: 24px; font-weight: 600; color: #333;}
.sub1_sec1 .prod0 .prod_box ul li .box_txt{font-size: 18px; line-height: 1.67; margin-top: 24px; color: #666;}
.sub1_sec1 .prod0 .prod_box ul li:hover *{color: #fff;}

.prod_head{font-size: 38px; font-weight: 600; color: #002f82; position: relative; margin-bottom: 60px;}
.prod_head .prod_head_txt{ z-index: 2; position: relative;}
.prod_head .prod_head_num{position: absolute; width: 100%; left: 0; font-size: 160px; font-weight: 900; color: #f5f6fa; top: -140px; z-index: 0;}
.prod_head .prod_head_line{position: absolute; width: 40px; height: 2px; background: #002f82; top: 70px; left: 50%; margin-left:-20px;}
.prod1 .prod_head{margin-top: 40px;}
.sub1_sec2{width: 100%; float: left;background: #fff; padding: 50px 0 0; position: relative;}
.news_visual{font-size: 0;}
.prod1{width: 100%; height: 1000px; float: left; padding: 60px 0; text-align: center;}
.prod2{width: 100%; height: 360px; float: left; background: linear-gradient(89deg, #e8f3fd 0%, #dce3ff 100%); margin-top: 200px; padding: 100px 0 80px;}
.prod3{width: 100%; height: 770px; float: left; background: linear-gradient(to bottom, #ffffff, #ffffff 43%, #edeff5); padding: 200px 0; text-align: right;}

.prod1 .news_visual{width: 800px; height: 450px; background: url(../images/product/pd_news_h_01_edit.gif) 0 0 no-repeat; border: solid 1px #c8c8c8; margin: 0 auto 40px; box-shadow:  0 10px 40px 0 rgba(0, 23, 120, 0.2);}
.prod2 .news_visual{width: 640px; height: 360px; background: url(../images/product/pd_news_h_02_edit.gif) 0 0 no-repeat;  float: left; box-shadow: 20px 20px 40px 0 rgba(0, 23, 120, 0.25);  border: solid 1px #c8c8c8; margin-top: -190px; margin-right: 80px;}
.prod3 .news_visual{width: 600px; height: 400px; background: url(../images/product/pd_news_h_03_edit.gif) 0 0 no-repeat;  float: right;  margin-left: 120px; margin-top: -90px; box-shadow: 0 10px 60px 0 rgba(0, 23, 120, 0.1);}
.prod3 .inner{padding-top: 90px;}
.prod1 .prod_cont{float: left; width: 480px; height: 150px; border: 1px #dfe3ee solid; padding: 20px 40px; margin: 20px 20px 20px 100px;}
.prod1 .prod_cont:last-child{margin: 20px 100px 20px 20px;}

.prod2 .prod_head .prod_head_num{text-indent: 830px; top: -110px;}
.prod2 .prod_head .prod_head_line{margin-left: 125px;}
.prod3 .prod_head .prod_head_num{text-align: left; text-indent: 200px;}
.prod3 .prod_head .prod_head_line{margin-left: -165px;}

.prod_cont .prod_tit{font-size: 24px; font-weight: 600; color: #333;}
.prod_cont .prod_txt{font-size: 18px; font-weight: 400; color: #666; line-height: 1.67; margin: 10px 0;}

.sub1_sec3{width: 100%; height: 1460px; float: left;background: #fff; padding: 20px 0 80px; position: relative; overflow: hidden;}
.sub1_sec3 .bg{background: url(../images/product/pd_untact_hand.png) center no-repeat; width: 100%; position: absolute; left: 0; top: 0; height: 1200px; background-size: cover; }

.sub1_sec3 .inner{position: relative; text-align: left;}
.sub1_sec3 .inner .coming{color: #fff; font-size: 36px; line-height: 1.35;}
.sub1_sec3 .prod_txt{font-size: 24px; line-height: 1.42; color: #666;}
.untact1{float: left; width: 40%; margin-top: 200px; height: 420px;  }
.untact1 .prod_tit{color: #fff;text-align: right; font-size: 36px; font-weight: bold;}
.untact1 .prod_txt{color: #fff; text-align: right; font-size: 22px; line-height: 1.55; margin-top: 15px;}
.untact1 img{width: 70%; position: absolute; right: 20px; top: 250px;}
.untact2{float: left; position: relative; padding-left: 700px;margin-top: 50px; width: 100%; padding-top: 200px;}
.untact2 img{position: absolute; left: -40px; top: 0;}
.untact2 .prod_tit{float: left;font-size: 36px; font-weight: bold;}
.untact2 .prod_txt{float: left;font-size: 22px; margin-top: 20px;}

.sub1_sec4{width: 100%; height: 942px; float: left;background: #edeff5; text-align: center; padding: 100px 0;}
.sub1_sec4 .prod_head{font-size: 36px; margin-top: 40px; float: left; width: 100%;}
.sub1_sec4 .prod_cont{width: 50%; float: left;}
.sub1_sec5{width: 100%; float: left;background: #fff; padding: 50px 0 100px; position: relative; }
.sub1_sec5 .news_visual{float: left; width: 700px; height: 600px; border: 1px #707070 solid; padding: 77px 40px; background: url(../images/product/img_mockup_black_h.png) center no-repeat; position: relative;margin-top: 50px;}
.sub1_sec5 .news_visual:after{content: '기기 예시'; position: absolute; left: 0; bottom:10px; width: 100%; text-align: center;font-size: 16px; color: #666; }
.sub1_sec5 .prod_cont{float: right; width: 440px;margin-top: 50px;}
.sub1_sec5 .prod_cont > .prod_txt{float: right; width: 440px; line-height: 1.6; letter-spacing: -1px;}
.sub1_sec5 .prod_cont dl{float: left; width: 440px; margin-top: 10px;}
.sub1_sec5 .prod_cont dt{float: left;width: 120px; margin-right: 40px; font-size: 20px; font-weight: 600; color: #333; margin-bottom: 20px;}
.sub1_sec5 .prod_cont dd{float: left; width: 280px; margin: 0; margin-bottom: 20px;}


.sub1_sec4 .prod_head{color: #333; font-weight: 400;}
/* product vt */
.sub1_sec1.vt{padding-bottom: 50px;}
.sub1_sec1.vt .prod0 .prod_visual{width: 510px; background: url(../images/product/img_product_home_v.png) 0 0 no-repeat; height: 960px; margin:30px 160px 0 60px;  position: relative;}

.sub1_sec1.vt .prod0 .prod_visual img{position: absolute; opacity: 0;}
.sub1_sec1.vt .prod0 .prod_visual img.menu-img1{left: -50px; top: -100px;}
.sub1_sec1.vt .prod0 .prod_visual img.menu-img2{left: -50px; top: -50px;}
.sub1_sec1.vt .prod0 .prod_visual img.menu-img3{left: -50px; top: -15px;}
.sub1_sec1.vt .prod0 .prod_visual img.menu-img4{left: -50px; top: -25px;}
.sub1_sec1.vt .prod0 .prod_visual img{display: none;}
.sub1_sec1.vt .prod0 .prod_visual img.imgv{display: block;}

.sub1_sec1.vt .prod0 .prod_box{float: left; width: 360px; margin-top: 60px;}
.sub1_sec1.vt .prod0 .prod_box ul li{width: 360px; height: 185px; margin-right: 0; margin-bottom: 30px;}
.sub1_sec1.vt .prod0 .prod_box ul li .box_txt{ margin-top: 20px;}
.vt .prod1{height: 1020px;}
.vt .prod1 .prod_head{float: left; width: 600px; margin: 100px auto 80px;}
.vt .prod1 .news_visual{width: 360px; height: 640px; background: url(../images/product/pd_news_v_01_edit.gif) 0 0 no-repeat; margin: 0 70px 0 0; float: right;}
.vt .prod1 .prod_cont{margin: 20px 60px;}

.vt .prod2 {height: 500px;  margin-top: 0; padding-top: 240px;}
.vt .prod2 .news_visual{width: 324px; height: 576px; margin-top: -400px; margin-left: 140px; background: url(../images/product/pd_news_v_02_edit.gif) 0 0 no-repeat;}
.vt .prod2 .prod_head .prod_head_line{margin-left: -50px;}
.vt .prod2 .prod_head .prod_head_num{text-indent: 670px;}
.sub1_sec5.vt .news_visual{background: url(../images/product/img_mockup_black_v.png) center no-repeat; }
.sub1_sec5 .width{display: block;}
.sub1_sec5 .vertical{display: none;}
.sub1_sec5.vt .width{display: none;}
.sub1_sec5.vt .vertical{display: block;}

/* price */
.sub2_sec1{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.media > p{ width: 50%; height: 50px;color: #666; text-indent: 14px;position: relative;}
.media > p:before{content: '*'; color: #f00; font-size: 18px; position: absolute; top: 2px; margin-left: -25px;}
.media .cf1{float: left;text-align: left; font-size: 18px; line-height: 25px; }
.media .cf2{float: right;  text-align: right; font-size: 13px; line-height: 18px;}
.media .cf2:before{right: 170px;}
.media .cf1 span{float: left;}
.media .media_li{float: left; width: 100%; margin: 30px 0;}
.media .media_li > li{float: left; width: 100%; padding: 12px 10px; background: #fff; margin-bottom: 20px;}
.media .media_li li > span{width: 280px; float: left; height: 100%; font-weight: 600; color: #666; font-size: 20px;}
.media .media_li li input[type="checkbox"]{float: left;width: 18px; height: 18px; border: 1px #707070 solid; border-radius: 6px; margin:4px 6px 0 10px;}
.media .media_li li span input[type="checkbox"]{margin:6px 10px 0 10px;}
.media .media_li li label{float: left;}
.media .media_li li.pack label{color: #3457ea;}

.media .media_li li ul{float: left; width: 900px;}
.media .media_li li ul li{float: left; width: 210px; margin: 8px 0;}
.media .media_li li ul li input[type="checkbox"], .media .media_li li ul li label{ cursor: pointer;}
.media .price_float{}

.media .price_float.stk{bottom: 230px;}
.media .price_float.on{bottom: 0;}


.media .price_float .cart{float: right; width: 60px; height: 60px; border-radius: 30px; background: url(../images/price/btn_floating_cart.png) 0 0 no-repeat;  cursor: pointer; position: fixed; bottom: 80px; right: 30px;}
.media .price_float.on .cart{width: 60px; height: 60px; margin-bottom: 10px; border-radius: 30px; background: url(../images/price/btn_floating_close.png) 0 0 no-repeat; bottom: 285px;}
.media .price_float .badge_box{color: #fff; font-size: 13px; font-weight: bold; background: #ff0023; border-radius: 30px; position: absolute; right: 0px;}
.media .price_float.on .badge_box{display: none;}
.media .price_float .badge_box i{padding: 5px; font-style: normal; }


.media .media_total{ background: #fff; box-shadow: 0 -10px 30px 0 rgba(16, 32, 91, 0.2); padding: 20px 10px; z-index: 100; width: 100%; height: 270px; display: none; position: fixed; bottom: 0; left: 0;}
.media .media_total.on{display: block;}

.media .media_total dl{float: left;  padding-bottom: 10px; border-bottom: 1px #dde0e4 solid;}
.media .media_total .period{width: 194px; }
.media .media_total dt{float: left;width: 100%; font-size: 18px; font-weight: 600;  padding-bottom: 10px; border-bottom: 1px #999 solid; margin-bottom: 10px;}
.media .media_total dl dd{float: left;}
.media .media_total dl.period dd{width: 100%; margin: 10px 0;}
.media .media_total dl dd input[type="radio"]{float: left; width: 18px; height: 18px; margin: 4px 8px 0 0; }

.media .media_total dl.extotal {width: 608px;  margin:0 40px 0 20px;}
.media .media_total dl.extotal .pack_info {float: right; text-align: right; font-size: 14px; color: #595959; font-weight: 400;}
.media .media_total dl.extotal .pack_info i {color: #3457ea; font-weight: bold; font-style: normal;}
.media .media_total dl.extotal dl{border-bottom: 0;}
.media .media_total dl.extotal dd{height: 176px; overflow: auto;}
.media .media_total dl.extotal dd dt{border-bottom: 0; width: 100px;}
.media .media_total dl.extotal dd dd{width: 470px; margin-left: 20px; height: auto; overflow: hidden;}
.media .media_total dl.extotal dd dd .price_ex{width: 450px; margin-left: 20px; font-size: 15px; float: left;}
.media .media_total dl.extotal dd dd .price_ex > button{width: 24px; height: 24px; background: url(../images/price/btn_cart_minus.png) 0 0 no-repeat; text-indent: -9999px; border: 0;}
.media .media_total dl.extotal dd dd .price_ex .media_list{color: #6d6d6d; width: 100%; float: left; padding-left: 45px; position: relative; margin-bottom: 10px;}
.media .media_total dl.extotal dd dd .price_ex .media_list:before{content: '└'; position: absolute; left: 25px; }


.media .media_total dl.total {width: 338px; position: relative;}
.media .media_total dl.total .ini {float: right; width: 80px; height: 30px; line-height: 28px; background: url(../images/price/btn_cart_reset.png) 0 0 no-repeat; border: 0; padding-left: 15px;}
.media .media_total dl.total dd{ float: left; color: #777; font-size: 18px; width: 100%;}
.media .media_total dl.total dd dl{float: left; width: 100%; color: #333;}
.media .media_total dl.total dd dl dt{width: 120px; font-size: 18px; font-weight: bold; float: left;}
.media .media_total dl.total dd dl dd{width: 780px; float: left;}
.media .media_total dl.total dd.price_total1{color: #001c8f; font-size: 24px; font-weight: bold;}
.media .media_total dl.total dd.price_total2{color: #001c8f; font-size: 32px; text-align: right; font-weight: bold;}
.media .media_total dl.total dd.price_total3{color: #6d6d6d; font-size: 14px; text-align: right;}
.media .media_total dl.total dd.price_total4{position: absolute; bottom: -30px; width: auto; right: 0; text-align: right; font-size: 12px; cursor: pointer;}
.media .media_total dl.total dd.price_total{font-size: 30px; font-weight: 600; color: #333; }
.media .media_total dl.total dd.price_total4 i{width: 20px; height: 20px; float: left;background: url(../images/price/btn_exp_price.png) 0 0 no-repeat; margin-top: 3px;}

.media .media_li .price_guide{margin-top: 30px; padding: 30px 20px; background: #e0e6eb;}
.media .price_guide p{float: left; width: 100%;}
.media .price_guide .guide_tit{color: #666; font-size: 18px; font-weight: 600; margin-bottom: 10px;}
.media .price_guide .guide_tit:before{content: '*'; color: #f00; font-size: 15px; margin-right: 5px; }
.media .price_guide .guide_txt{color: #666; font-size: 16px; line-height: 1.75;}
.media .price_guide .guide_ex{color: #6d6d6d; font-size: 15px; line-height: 1.47; margin-top: 30px; text-indent: 5px;}
.media .price_guide .guide_ex span{text-indent: 40px; float: left;}

.media .media_total .total .price_guide{width: 520px; height: 340px; display: none; padding: 15px; margin-left: -160px; background: #e0e6eb;box-shadow: 0 3px 6px 0 rgba(16, 32, 91, 0.24);}
.media .total .price_guide.on{display: block; position: absolute; z-index: 60; bottom: 60px;}
.media .total .price_guide .guide_tit{font-size: 16px;}
.media .total .price_guide .guide_txt{font-size: 14px;}
.media .total .price_guide .guide_ex{font-size: 14px;}

.sub2_sec2{width: 100%; float: left;background: #fff; padding: 50px 0 100px; position: relative;}
.call_box dl{float:left; margin-top: 20px; }
.call_box dl.dl1 {width:600px; }
.call_box dl.dl2 {width:475px; margin-left: 125px;}
.call_box dl.dl3 {width:100%; }
.call_box dl.dl1 dt {width:180px; }
.call_box dl.dl1 dd {width:420px; }
.call_box dl.dl2 dt {width:95px; }
.call_box dl.dl2 dd {width:380px; }
.call_box dl.dl3 dt {width:180px; }
.call_box dl.dl3 dd {width:1020px; height: auto;}
.call_box dt {float:left; height:50px; line-height:50px; font-size:18px; font-weight: 600; color: #666;}
.call_box dd{float:left; height:50px; }
.call_box dd input { float:left; width: 100%; height:50px; font-size: 18px; border:1px #999 solid; color:#666; padding:15px;}
.call_box dd input.num{width:96px;}
.call_box dd textarea{width: 100%; height: 200px; overflow: auto; padding: 20px; font-size: 18px; line-height: 1.67; resize: vertical;}
.call_box dd span{float: left; line-height: 50px; padding: 0 17px; font-size: 30px; }

.call_box .agree_box { width:100%; height: 180px; border:1px solid #999; float:left; margin:60px 0 10px;padding:20px; font-size:18px; color:#666; line-height:1.67; overflow:auto;}
.call_box .agree_box p {font-size:20px;color:#333; font-weight:600;}
.call_box .agree_box span {color:#333; font-weight:600;}
.call_box .agree_check { width:100%; float:left; font-size:18px;}
.call_box .agree_check p{width:310px; margin:10px auto;}
.call_box .agree_check input{ float:left; margin:4px 8px 0; width: 18px; height: 18px; border-radius: 6px;}
.call_box .agree_check label{ float:left; margin:0;}

.sub3_sec1{width: 100%; float: left;background: #fff; padding: 50px 0 100px; position: relative;}
.sub3_sec2{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.sub3_sec3{width: 100%; float: left;background: #fff; padding: 50px 0 100px; position: relative;}
.sub3_sec4{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.sub3_sec5{width: 100%; float: left;background: #fff; padding: 50px 0 100px; position: relative;}



.staff{float: left; width: 100%; border-top: 1px #c8c8c8 solid; border-bottom: 1px #c8c8c8 solid; background: #fff; text-align: center; margin-top: 40px;}
.staff * {float: left;}
.staff > dt{ width: 100%; height: 60px; line-height: 60px; font-size: 20px; font-weight: 600; color: #666; border-bottom: 1px #c8c8c8 solid;}
.staff > dd{ border-right: 1px #c8c8c8 solid; padding: 20px; position: relative; text-align: left;}
.staff > dd:last-child{border-right: 0}
.staff > dd.stf1{width: 400px; padding-left: 40px;}
.staff > dd.stf2{width: 400px; padding-left: 145px; padding-top: 80px; position: relative;}
.staff > dd .stf_tit{ color: #666; font-weight: 600; position: absolute; left: 0;}
.staff > dd.stf1 .stf_tit{width: 120px; margin-left: 40px; font-size: 28px; letter-spacing: 4px;}
.staff > dd.stf2 .stf_tit{width: 120px; margin-left: 20px;font-size: 20px;}
.staff > dd.stf2 .stf_top{ position: absolute; left: 0; top: 0; width: 100%; border-bottom: 1px #c8c8c8 solid; height: 60px; line-height: 60px; text-align: center; font-size: 20px; color: #666; font-weight: 600;}
.staff > dd .stf_txt{ width: 100%; font-size: 22px;  color: #666; margin: 5px 0 10px;}
.staff > dd.stf1 .stf_txt{ padding-left: 130px;}
.staff > dd .stf_cont{ width: 100%; font-size: 18px; color: #666;}
.staff > dd .stf_cont dt{font-weight: 600;  width: 70px; margin:0 10px 8px 0;}
.staff > dd.stf1 .stf_cont dd{width: calc(100% - 80px); margin:0 0 8px 0;}
.staff > dd.stf2 .stf_cont dd:first-child{width: 100%;}

.download{float: left; width: 100%; margin: 40px 0 0; border-top: 1px #c8c8c8 solid; color: #666;}
.download li{float: left; width: 100%; padding: 30px; border-bottom: 1px #c8c8c8 solid; line-height: 48px;}
.download li .down_tit{float: left; width: 350px; font-size: 20px; font-weight: 600;}
.download li .down_txt{float: left; width: 640px; font-size: 16px; color: #666;}
.download li .down_file{float: left; width: 150px; text-align: center;}
.download li .down_file a{width: 150px; height: 48px; font-size: 20px; font-weight: 600; border-radius: 24px; color: #fff; display: block; background: url(../images/basic/ico_spt_download.png) 20px 12px no-repeat #3457ea; padding-left: 16px;}

.board_li{float: left; width: 100%; border-bottom: 1px #c8c8c8 solid; background: #fff; color: #666; margin-top: 50px;}
.board_li .board_tit{float: left; width: 100%; padding: 15px 60px 15px 20px; border-top: 1px #c8c8c8 solid; font-size: 18px; cursor: pointer;background: url(../images/basic/ico_board.png) right 20px no-repeat;}
.board_li .board_txt{float: left; width: 100%; padding: 30px 20px; border-top: 1px #c8c8c8 solid; background: #ebedf3; font-size: 16px; display: none;}
.board_li .open .board_tit{background: url(../images/basic/ico_board_on.png) right 20px no-repeat;}
.board_li .open .board_txt{display: block;}
.board_li .board_tit .noti_date{float: right; font-size: 16px; text-align: right;}

.paging{width: 100%; float: left; margin: 45px 0;}
.pagination{margin: 0 auto; text-align: center;}
.pagination li{display: inline-block;width: 30px; height: 30px; line-height: 30px; margin: 0 5px; text-align: center; font-size: 14px;}
.pagination .page a{color: #777; }
.pagination .page.active a{color: #333; font-weight: 600; }
.pagination .first {background: url(../images/basic/btn_arrow_list_foremost.png) 0 0 no-repeat; text-indent: -9999px;}
.pagination .prev {background: url(../images/basic/btn_arrow_list_prev.png) 0 0 no-repeat; text-indent: -9999px;}
.pagination .next {background: url(../images/basic/btn_arrow_list_next.png) 0 0 no-repeat; text-indent: -9999px;}
.pagination .last {background: url(../images/basic/btn_arrow_list_end.png) 0 0 no-repeat; text-indent: -9999px;}

.pagination .first.disabled {background: url(../images/basic/btn_arrow_list_foremost_dis.png) 0 0 no-repeat;}
.pagination .prev.disabled {background: url(../images/basic/btn_arrow_list_prev_dis.png) 0 0 no-repeat;}
.pagination .next.disabled {background: url(../images/basic/btn_arrow_list_next_dis.png) 0 0 no-repeat;}
.pagination .last.disabled {background: url(../images/basic/btn_arrow_list_end_dis.png) 0 0 no-repeat;}

.sub5_sec1{width: 100%; min-height: 760px; padding: 80px 0 100px; float: left;background: url(../images/magazine/img_pm_bg_mgz.png) center bottom no-repeat; background-size: cover; text-align: center;}
.sub5_sec1 h3{width: 100%; height: 45px; background: url(../images/magazine/img_pm_title_logo.png) center no-repeat; font-size: 0; }
.sub5_sec1 h1{width: 100%; height: 190px; background: url(../images/magazine/img_pm_title_text.png) center no-repeat; font-size: 0; margin: 80px 0 50px;}
.sub5_sec1 h5{font-size: 40px; font-weight: 600; color: #333;}
.sub5_sec1 p{font-size: 24px; font-weight: 400; color: #555;}
.sub5_sec1 .line{margin: 40px 0; width: 800px; height: 2px; background: linear-gradient(to right, rgba(52, 87, 234, 0) 1%, #3457ea 50%, rgba(52, 87, 234, 0) 99%); display: inline-block;}

.sub5_sec2{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.mag_ul{ margin: 70px 0; width: 100%; float: left;}
.mag_ul li{float: left; width: 360px; margin-right: 60px; border: 1px #3457ea solid; border-radius: 30px; padding: 320px 30px 50px; font-size: 28px; line-height: 40px; color: #333; font-weight: 600; text-align: center;}
.mag_ul li.mag_li1{background: url(../images/magazine/img_pm_pp_01.png) center 30px no-repeat #fff;}
.mag_ul li.mag_li2{background: url(../images/magazine/img_pm_pp_02.png) center 30px no-repeat #fff;}
.mag_ul li.mag_li3{background: url(../images/magazine/img_pm_pp_03.png) center 30px no-repeat #fff; margin-right: 0;}

.sub5_sec3{width: 100%; height: 1460px; float: left;background: #fff; padding: 20px 0 80px; position: relative; overflow: hidden;}
.sub5_sec3 .bg{background: url(../images/magazine/pd_mag_hand.png) center no-repeat; width: 100%; position: absolute; left: 0; top: 0; height: 1200px; background-size: cover; }
.sub5_sec3 .untact2 .prod_txt{font-size: 24px; line-height: 1.42; color: #666;}
.sub5_sec3 .inner{position: relative; z-index: 1;}
.sub5_sec3 .untact1{ width: 50%; }


.sub5_sec4{width: 100%; float: left;background: #f5f6fa; padding: 50px 0 100px; position: relative;}
.mag_table {text-align: center; margin-top: 50px; width: 100%; float: left;}
.mag_table th{font-size: 28px; color: #666; background: #e7e9ed; height: 90px;border: 1px #c8c8c8 solid; }
.mag_table th:last-child{ color: #fff; background: #3457ea; border: 2px #3457ea solid; }
.mag_table td{font-size: 24px; color: #333; height: 90px;border: 1px #c8c8c8 solid ; background: #fff; border-top: 0; line-height: 1.2; }
.mag_table td span{font-size: 16px;}
.mag_table td:last-child{ font-weight: bold; border-left: 2px #3457ea solid;border-right: 2px #3457ea solid;}
.mag_table tr:last-child td:last-child{ border-bottom: 2px #3457ea solid;}

.sub5_sec5{width: 100%; float: left;background: #edf7ff; position: relative; text-align: center;}
.sub5_sec5 .inner:before{content: ''; width: 1400px; height: 1400px; border-radius: 700px;   z-index: 0; position: absolute; top: 0; left: 50%; margin-left: -700px; background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 70%);  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 70%);  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 70%); 
 }
.sub5_sec5 h2{width: 100%; height: 296px; background: url(../images/magazine/img_pm_gr_bound.png) center no-repeat; color: #fff; margin: 0 0 50px; font-size: 48px; line-height: 1.25; font-weight: normal; padding-top: 50px; z-index: 1; position: relative;}
.mag_pack_img{width: 100%; float: left; z-index: 1;position: relative;}
.mag_pack_img > div{width:400px; height: 400px; font-size: 0; float: left;}
.mag_pack_img1{background: url(../images/magazine/img_pm_devices_pc.png) 0 0 no-repeat;}
.mag_pack_img2{background: url(../images/magazine/img_pm_devices_mobile.png) 0 0 no-repeat;}
.mag_pack_img3{background: url(../images/magazine/img_pm_devices_kiosk.png) 0 0 no-repeat;}
    
.mag_pack_tit{width: 100%; height: 70px; float: left; font-size: 0; background: url(../images/magazine/img_pm_bottom_text.png) center no-repeat; margin: 80px 0; z-index: 1; position: relative;}
.mag_pack_txt{width: 100%; float: left; background: #fff; border-radius: 30px; padding: 30px; font-size: 24px; line-height: 1.5; z-index: 1;}


.prom_area{float: left; width: 100%; margin: 100px 0;}
.prom_area .mag_prom_tit{width: 100%; font-size: 48px; font-weight: bold; color: #333;}
.prom_area .mag_prom_txt{width: 100%; font-size: 24px; color: #333; margin-top: 10px;}
.prom_area .mag_prom_btn{float: left; width: 100%; margin: 60px 0;}
.prom_area .mag_prom_btn a{float: left;display: inline-block;width: 480px; height: 70px; border-radius: 70px; box-shadow: 0 8px 10px 0 rgba(0, 23, 122, 0.1); margin: 0 60px; line-height: 70px; font-weight: bold; font-size: 30px;}
.prom_area .mag_prom_btn a.btn1{background: #fff; color: #3457ea;}
.prom_area .mag_prom_btn a.btn2{background: #3457ea; color: #fff;}

.prom_noti{width: 100%; float: left; text-align: left;}
.prom_noti .prom_noti_tit{float: left; width: 100%; font-size: 22px; font-weight: bold; color: #666;}
.prom_noti .prom_noti_txt{float: left; width: 100%; font-size: 18px; line-height: 1.67; color: #666; margin-top: 10px;}






.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; width:1000px; height:80vh; position:absolute; top:50%; left:50%; margin:-40vh 0 0 -500px;}
.pop1 .pop_layer h1{height:60px;background:#3457ea;color:#fff;font-size:22px;line-height:60px; font-weight:400; display:inline-block; width:100%; padding-left: 20px;}
.pop1 .pop_layer .pop_wrap { padding:20px;overflow: hidden;    overflow:hidden;}
.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/basic/pop_close.png) 0 0 no-repeat; text-indent:-9999px; cursor:pointer;}
.pop1 .pop_layer .pop_wrap .pop_cont {height:calc(80vh - 150px); border:1px #ddd solid;}
.pop1 .pop_layer .pop_wrap .pop_cont p{ font-size:13px; font-weight:500; line-height:18px; margin:5px 0;}
.pop1 .pop_layer .pop_wrap .pop_cont div table{width:100%;}
.pop1 .pop_layer .pop_wrap .pop_cont div td{border:1px #ddd solid;}
.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; cursor:pointer; text-align: center;}
.pop1 .pop_layer .pop_wrap .pop_ok p:hover{color:#3457ea; border:1px solid #3457ea;}

.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; height:100%;}


.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; width:900px; height:600px; position:absolute; top:50%; left:50%; margin:-300px 0 0 -450px;}
.pop2 .pop_layer h1{height:60px;background:#2d91ff;color:#fff;font-size:22px;line-height:60px; font-weight:400; display:inline-block; width:100%}
.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/basic/pop_close.png) 0 0 no-repeat; text-indent:-9999px; cursor:pointer;}
.pop2 .pop_layer .pop_wrap .pop_cont {padding:20px; height:400px; border:1px #ddd solid; }
.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; cursor:pointer;}
.pop2 .pop_layer .pop_wrap .pop_ok p:hover{color:#2d91ff; border:1px solid #2d91ff;}

.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 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;}











.bf-vis{background: url(../images/bf/img-bf-top.png) 0 0 no-repeat; background-size: cover;}
.gnb-rt{display:flex; align-items:center; gap:10px}
.btn-bf{ padding: 6px 12px;  border-radius: 30px;  border: solid 2px #ed1c24; font-weight:600}
.btn-bf a{color:#ed1c24}
.bf_sec1{background:#f5f6fa; text-align: center; padding: 100px 0;}
.bf-cont1{display:flex; align-items: center; justify-content: center; margin:120px auto;}
.line-bg { position: absolute; left: 0; transform: translateY(-50%); width: 100%; border-top: 2px dashed #4472f1; z-index: 1; }
.card-list { position: relative; display: flex; justify-content: center; align-items: center; gap: 35px; z-index: 2; }
.card-item { width: 150px; height: 200px; background-color: #ffffff; box-shadow: 0 8px 24px 0 rgba(0, 43, 130, 0.15);  border: solid 1px #a4c0e4; border-radius: 8px;  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; transition: transform 0.2s ease; }


.bf{min-height:100vh}
.card-item:nth-child(odd){margin-top:-40px}
.card-item:nth-child(even){margin-top:40px}
.card-title { font-size: 24px; font-weight: 700; color: #1a4cd2; margin: 0; }
.bf_sec{padding:120px 0; background:#fff; width:100%;}
.bf-cont { display: flex; justify-content: center; gap: 30px; margin-top:100px; }
.bf-card { flex: 1; min-width: 0; border: 1px solid #a4c0e4; background-color: #ffffff; display: flex; flex-direction: column; }
.bf-thumb { width: 100%; aspect-ratio: 350 / 230; overflow: hidden; border-bottom: 1px solid #a4c0e4; }
.bf-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-body { padding: 30px 24px; display: flex; flex-direction: column; text-align: left; }
.card-tit { font-size: 26px; font-weight: 700; color: #000000; margin: 0 0 16px 0; }
.card-stit { font-size: 20px; font-weight: 700; color: #000000; margin: 0 0 4px 0; line-height: 1.4; }
.card-desc { font-size: 20px; font-weight: 400; color: #4b5563; line-height: 1.6; margin: 0; word-break: keep-all; }
.bf_sec5{background-image: linear-gradient(to bottom, #fff, #fff 43%, #edeff5);}
.cert-container { margin: 0 auto; padding: 120px 0; box-sizing: border-box; text-align: center; }
.cert-logos { display: flex; justify-content: center; align-items: center; gap: 8%; margin-bottom: 50px; }
.logo-item { flex: 0 1 280px; min-width: 0; }
.logo-item img { width: 100%; height: auto; display: block; filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.2)); }
.cert-info { display: flex; flex-direction: column; align-items: center; color: #333333; word-break: keep-all; gap:12px }
.cert-title { font-size: 30px; font-weight: 700; color: #111; }
.cert-subtitle { font-size: 20px; font-weight: 500; color: #666; }
.cert-serial { font-size: 20px; font-weight: 400; color: #666; }
.kiosk-detail-container { width: 100%; margin: 0 auto; padding: 120px 0; box-sizing: border-box; background-color: #ffffff; }
.kiosk-gallery { display: flex; gap: 4px; margin-bottom: 60px; }
.gallery-main { flex: 2; }
.gallery-side { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.gallery-main img, .side-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kiosk-spec { border-top: 2px solid #d2d7df; border-bottom: 1px solid #d2d7df; }
.spec-row { display: flex; margin: 0; border-bottom: 1px solid #eaedf2; padding: 16px 0; align-items: center; }
.spec-row:last-child { border-bottom: none; }
.spec-title { width: 200px; font-size: 20px; font-weight: 700; color: #000000; padding-left: 20px; flex-shrink: 0; }
.spec-desc { margin: 0; font-size: 20px; font-weight: 400; color: #333333; line-height: 1.6; word-break: keep-all; }
.bf_sec3{background:url(../images/bf/img-bf-3.png) center no-repeat; background-size:cover; padding:120px 0;}
.newslink{display:flex; gap:40px; margin:120px 0;}
.news-card{ border: solid 1px #a4c0e4; background:#fff; flex:1}
.news-card:hover{border:solid 1px #1a4cd2}
.news-card a{font-size:24px; color:#333; display:flex; flex-direction:column; padding: 33px 25px; gap:12px; position:relative}
.news-card p{ font-weight:600;}
.news-card span:after{content:''; display:inline-block; width:24px; height:24px; background:url(../images/bf/ico-external-link-line.png) 0 0 no-repeat; margin-left:20px;}
.bf_lastsec{ background-image: linear-gradient(102deg, #3457ea 24%, #004eb1 100%); padding:120px 0; color:#fff;}
.bf_lastsec .inner{ display: flex;align-items: center; justify-content: space-between;}
.bf_lastsec p{font-size:36px;}
.bf_lastsec a{font-size:28px; color:white; width:360px; height:80px; line-height:80px; text-align:center; border:2px #fff solid;}
.bf_lastsec a img{margin-left:12px;}

.sticky{position: fixed; right:30px; bottom:30px; width:60px; z-index:9999; display:flex; gap:10px; flex-direction:column;}
.invert { filter: invert(1);}
.invert .sticky{position:sticky; right:30px;}
.sticky button{width:60px; height:60px; line-height:88px; font-size: 13px; cursor: pointer; border-radius:10px; border: 1px #7c7e84 solid; text-align: center;}
.sticky #top{width:60px; height:60px; line-height:88px; background-position:0px -12px;position:relative; bottom:auto; right:auto}
.btn-font{background:url(../images/bf/ico-font-big.png) 10px 8px no-repeat #fff; }
.btn-invert{background:url(../images/bf/ico-move-contrast-b.png) 16px 8px no-repeat #000; color:#fff;}

.font-large .btn-font{background:url(../images/bf/ico-font-normal.png) 10px 8px no-repeat #fff; }




.font-large .sub_visual .sub_tit2{font-size:70px !important;}
.font-large .sec_tit{font-size:62px !important;}
.font-large .bf_lastsec p{font-size: 48px !important; }
.font-large .cert-title{font-size:40px !important;}
.font-large .bf_lastsec a{font-size: 36px !important; }
.font-large .card-tit { font-size: 34px !important; }

.font-large .card-title, .font-large .sec_txt,
.font-large .news-card a,
.font-large .sub_visual .sub_tit { font-size: 31px !important; }

.font-large .card-stit,
.font-large .card-desc,
.font-large .spec-title,.font-large .cert-subtitle,
.font-large .cert-serial,
.font-large .spec-desc { font-size: 26px !important; }



.bn-wrap {
    position: fixed; 
    z-index: 1000; 
    right: 60px; 
    bottom: 90px;
    filter: drop-shadow(4px -5px 8px rgba(0, 0, 0, 0.5));
}

.bn-float {
    position: relative; 
    width: 514px; 
    height: 384px; 
    background: url('../images/home/img-main-popup-bf.png') 0 0 no-repeat; 
    background-size: contain; 
}

.bn-btn {
    position: absolute;
    bottom: 48px; 
    left: 14px;
    height: 48px; 
    width: 460px;
    display: inline-block; 
    background: url('../images/home/btn-main-popup-bf.png') 0 0 no-repeat; 
    background-size: contain; 
}
.bn-btn:hover{filter:brightness(0.95)}
/* 하단 오늘 하루 보지 않기 바 */
.bn-ft {
    position: absolute; 
    bottom: 12px; 
    left: 0;
    width: 480px; 
    padding: 0 24px; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    box-sizing: border-box;
}

.bn-ft span { 
    color: #fff; 
    font-size: 14px; 
    cursor: pointer; 
    opacity: 0.8;
}
.bn-ft span:hover { 
    text-decoration: underline; 
    opacity: 1;
}