@charset "utf-8";
/* 상단 슬라이드배너 */
.main_bn_wrap { width:100%; height: auto; margin: 0 auto; position: relative; margin-top: 60px; }
.main_bn_wrap .bx-wrapper .bx-prev:hover, .main_bn_wrap .bx-wrapper .bx-next:hover { opacity: .8; }
.main_bn_wrap .bx-wrapper .bx-pager .bx-default-pager a{ width:100% !important; height: 10px !important; border-radius: 0 !important; margin: 0 4px !important; }
.main_bn_wrap .bx-wrapper .bx-pager{ display: flex; position: absolute; bottom: 14px; z-index: 100; width:100%; justify-content: center; }
.main_bn_wrap .bx-wrapper .bx-pager div{ float: left; font-size: 0; }
.main_bn_wrap .bx-wrapper .slider img{ width:100%; }
.bx-pager-item { padding: 0 3px; }
.bx-pager-item .bx-pager-link { display: block; width:8px !important; height: 8px !important; background: #fff; border-radius: 10px; }
.bx-pager-item .active{ background: #222; }

/*main-content*/
.main_top_tabBn{ background: #f9f9f9; }
.tabmenu_wrap{ width: calc(200px + 36vw); margin: 0 auto; padding-top: 1.6rem; }
/* tabmenu */
.tabmenu { width: 100%; height: 134px; display: flex; flex-wrap: wrap; justify-content: space-between; }
.tabmenu > li { font-size: 14px; }
.tabmenu > li:first-child { margin-left: 0; }
.tabmenu > li > a{ display: block; width:70px; margin: 0 auto; text-align: center; color: #111; }
.tabmenu > li > a:hover{ color:#111; }
.tabmenu .on { font-weight: 800; border-bottom: 3px solid #dc1e25; }
.tabmenu .tab_iconImg{ position: relative; display: inline-block; }
.tabmenu .tab_iconImg img{ box-shadow: 0px 2px 3px rgb(173, 178, 185, 0.7); border-radius: 25px; } 
.tabmenu .tab_icon_tit { padding: 15px 0 10px 0; display: block; font-weight: 500; }
.tabmenu .on .tab_icon_tit { font-weight: 700; }

.list_div{ width: 100%; display: inline-block; border-top: 1px solid #ddd; padding: 1rem 1.2rem 2.2rem 1.2rem; }
.list_div > div > ul{ width:100%; display: flex; flex-wrap: wrap; }
.list_div > div > ul li{ width: calc(50% - .3rem); margin-right: .6rem; }
.list_div li:nth-child(2), .list_div li:nth-child(4), .list_div li:nth-child(6){ margin-right:0; }
.list_div > div > ul li a{ padding: 1rem 1.2rem; height: 114px; display: block; box-sizing: border-box; position: relative; background:#fff; border: 1px solid #ddd; border-radius: .8rem;}
.list_div > div > ul li a:hover, .list_div > div > ul li a:active { background: #fff; border:1px solid #bbb; }
.list_div > div > ul li a span{ color:#222; font-size: 16px; }
.list_div > div > ul li a .tab_con_tit{ font-weight: 500; }
.list_div > div > ul li a .tab_con_ico{ position: absolute; right:1.2rem; bottom:1rem; }
.list_div > div > ul li a .tab_con_ico img{ width:30px; }

/* .list_div > .tab_2 li, .list_div > .tab_4 li{ width:100%;  margin-right: 0; } */
.list_div .tab_4 li:nth-child(1), .list_div .tab_4 li:nth-child(2), .list_div .tab_4 li:nth-child(3), .list_div .tab_4 li:nth-child(4){ margin-bottom:.6rem; }
.list_div .tab_3 li:nth-child(1), .list_div .tab_3 li:nth-child(2){ margin-bottom:.6rem; }

/*07.24추가*/
.list_div .uv_stats{ width:100%; margin-right: 0; margin-top: 0.6rem;}
.list_div .uv_stats a{ height: 74px; }

.tab_1 {display:block;}
.tab_2 {display:none;}
.tab_3 {display:none;}
.tab_4 {display:none;}

.ui-content{ padding: 0 !important; }

.main_ourwork_bn_wrap{ width:100%; padding: 2.2em 1.2rem; }
.main_ourwork_bn_wrap h2{ font-size: 18px; color:#000; margin-bottom: .8rem; }
.main_ourwork_bn{ width: 100%; display: flex; flex-wrap: wrap; }
.main_ourwork_bn li{ width: calc(50% - .3rem); margin-right: .6rem; text-align: center; background:#fff; border: 1px solid #ddd; border-radius: .8rem; padding: .8rem .2rem; }
.main_ourwork_bn li:hover, .main_ourwork_bn li:active { background: #f9f9f9; border:1px solid #ccc; }
.main_ourwork_bn li:nth-child(2), .main_ourwork_bn li:nth-child(4){ margin-right:0; }
.main_ourwork_bn li:nth-child(1), .main_ourwork_bn li:nth-child(2){ margin-bottom:.6rem; }
.main_ourwork_bn li a{ color: #222; display: block; }
.main_ourwork_bn li a:hover{ color: #222; }
.main_ourwork_bn li img{ width: 60px; }
.main_ourwork_bn p{ font-size: 14px; font-weight: 500; margin-top: 10px; word-break: keep-all; }

.box_br{ width:100%; height: .8rem; display: block; background: #ededed; border-top:2px solid #d7d7d7; }

.menu-bg {
    width: 100%;
    height: 100%;
    overflow: auto;
    background: rgba(0,0,0,0.8);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1000;
}



@media only screen and (max-width: 320px) {
    .tabmenu_wrap { width: calc(180px + 32vw); }
    .tabmenu { justify-content: space-around; height: 120px; }
    .tabmenu > li { font-size: 13px; }
    .tabmenu > li > a { width: 60px; }
	.tabmenu .tab_iconImg img { width: 100%; height: 100%; }
}