@charset "utf-8";

/***사이트맵***/
.etcbox{margin:-2% 0 0 -2%;width:102%;text-align:center;clear:both;overflow:hidden;}
.etcbox .box{position:relative;float:left;margin:2% 0 0 2%;width:31%;min-height:420px;border:1px solid #dfdfdf;border-top:1px solid #000; transition:all 0.2s ease;}
.etcbox .box.box01,
.etcbox .box.box02,
.etcbox .box.box03{min-height:320px;}
.etcbox .box .tit{padding:20px 0;font-weight:700;font-size:18px;line-height:1;color:#222;text-align:center;background: #ecf3f7; border-bottom:1px dashed #b2b6c4;}
.etcbox .box .con{margin:0 40px;}
.etcbox .box .con > ul{padding-top:22px;}
.etcbox .box .con ul li a{display:block;}
.etcbox .box .con > ul > li > a{height:30px;line-height:30px;font-size:15px;color:#222;}
.etcbox .box .con > ul > li > ul{margin:10px 0;padding:17px 0;border:1px solid #dfdfdf;background:#f9f9f9;}
.etcbox .box .con > ul > li > ul > li > a{height:25px;line-height:25px;font-size:15px;color:#555;}

/* 뷰어프로그램 */
.viewer_wrap{margin-top:40px;border-top:2px solid #222;}
.viewer_wrap .viewer_item{position:relative;display:table;width:100%;min-height:210px;background-repeat:no-repeat;background-position:20px 50%;border-bottom:1px dashed #a0a0a0;}
.viewer_wrap .viewer_item.item1{background-image:url(/sbcc/nanum/site/builder/dir/main/img/menu2720/ban_thumb1.png);}
.viewer_wrap .viewer_item.item2{background-image:url(/sbcc/nanum/site/builder/dir/main/img/menu2720/ban_thumb2.png);}
.viewer_wrap .viewer_item.item3{background-image:url(/sbcc/nanum/site/builder/dir/main/img/menu2720/ban_thumb3.png);}
.viewer_wrap .viewer_item.item4{background-image:url(/sbcc/nanum/site/builder/dir/main/img/menu2720/ban_thumb4.png);}
.viewer_wrap .viewer_item dl{padding:0 180px 0 220px;display:table-cell;vertical-align:middle;}
.viewer_wrap .viewer_item dl dt{margin-bottom:20px;font-weight:500;font-size:20px;color:#222;}
.viewer_wrap .viewer_item a{position:absolute;top:58px;right:20px;display:inline-block;width:98px;height:98px;line-height:98px;color:#222;text-align:center;border:1px solid #ddd;border-radius:50%;}


/******************************768******************************/
@media all and (max-width:768px){

/* 사이트맵 */
.etcbox .box{width:48%;box-sizing:border-box;}
.etcbox .box.box01, .etcbox .box.box02{min-height: 300px;}
.etcbox .box.box03, .etcbox .box.box04{min-height: 400px;}
.etcbox .box.box05, .etcbox .box.box06{min-height: 300px;}
.etcbox .box .tit{ padding:15px 0;font-size:16px;}
.etcbox .box .con{margin:0 20px;}
.etcbox .box .con > ul > li > a{font-size:14px;}
.etcbox .box .con > ul > li > ul{padding:12px 0;}
.etcbox .box .con > ul > li > ul > li > a{font-size:13px;}

/* 뷰어프로그램 */
.viewer_wrap .viewer_item{padding:100px 0 20px;min-height:auto;background-position:50% 10px;background-size:75px;}
.viewer_wrap .viewer_item dl{padding:0 15px 10px;display:block;text-align:left;box-sizing:border-box;}
.viewer_wrap .viewer_item dl dt{margin-bottom:10px;font-size:18px;}
.viewer_wrap .viewer_item a{display:block;position:static;margin-top:10px;width:100%;height:34px;line-height:34px;border-radius:6px;}
	
}

/******************************640******************************/
@media all and (max-width:640px){

/* 사이트맵 */
.etcbox .box{float:none;width:auto;}
.etcbox .box{min-height:auto !important;}
.etcbox .box .con > ul{padding:15px 0;}
.etcbox .box .con > ul > li > a {font-size:13px;}

}


/******************************769******************************/
@media all and (min-width:769px){

/* 사이트맵 */
.etcbox .box:hover{border:1px solid #222;box-shadow:8px 10px 20px rgba(0,0,0,0.2);}
.etcbox .box .con > ul > li > a:hover{font-weight:700;color:#0197dd;}
.etcbox .box .con > ul > li > ul > li > a:hover{color:#222;text-decoration:underline;}

/* 뷰어프로그램 */
.viewer_wrap .viewer_item:hover{background-color:#f3f9ff;}
.viewer_wrap .viewer_item:hover a{color:#fff;background:#222;border-color:#222;}

}