@charset "utf-8";
/****************************************/
/* Name: 부산광역시 중구청 중문
/* PART: LAYOUT STYLE 
/* Version: 1.0 / day: 2017-11-13
/* Author: imtec 

/* Summary 
	1)메인, 서브레이아웃
	2)상단메뉴
	3)왼쪽메뉴
	4)메인, 서브레이아웃 반응형
*/
/****************************************/



/*
================================================================================
메인, 서브레이아웃
================================================================================
*/

body{font-family:"Arial",Simsun,"宋体",san-serif;letter-spacing:0px}
h1,h2,h3,h4,h5,h6,input,button,textarea,select,table{font-family:"Arial",Simsun,"宋体",san-serif;}
a:hover{font-weight:normal}

#wrapper{min-width:320px;width:100%;height:100%;}

/* ---- 상단영역 ---- */
#header{position:absolute;top:0;left:0;width:100%;min-width:320px;background:rgba(0,0,0,0.05);border-bottom:1px solid rgba(255,255,255,0.1);z-index:90}
.head_box{position:relative;margin:0 auto;width:1200px;min-height:135px;}
.head_box::after{display:block;clear:both;content:''}
.head_box .logo{position:absolute;top:40px;left:0;z-index:200;}
.head_box .logo a{display:inline-block;width:250px;height:60px;text-indent:-999px;overflow:hidden;background:url('/img/lang/com_lang.png') no-repeat}
#header{
	transition: all 0.3s;
	-moz-transition: all 0.3s; /* Firefox 4 */
	-webkit-transition: all 0.3s; /* Safari and Chrome */
	-o-transition: all 0.3s; /* Opera */
}

/* 상단 페밀리사이트 링크 */
.head_box .topLink{float:right;height:54px;font-family:'NanumSquare';}
.head_box .topLink::after{display:block;clear:both;content:''}
.head_box .topLink .topFamSite{float:left;padding-top:5px}
.head_box .topLink .topFamSite .btn{display:none}
.head_box .topLink .topFamSite ul::after{display:block;clear:both;content:''}
.head_box .topLink .topFamSite ul li{position:relative;float:left;}
.head_box .topLink .topFamSite ul li.home{padding-left:25px}
.head_box .topLink .topFamSite ul li.home::after{position:absolute;top:50%;left:0;margin-top:-15px;width:30px;height:30px;content:'';background:url('/img/common/com_img.png') no-repeat -10px -10px}
.head_box .topLink .topFamSite ul li a{display:block;padding:10px 15px;color:#fff;}
.head_box .topLink .topFamSite ul li::before{position:absolute;top:50%;left:0;margin-top:-4px;width:1px;height:8px;content:'';background:rgba(255,255,255,0.4)}
/* 상단 언어별 링크 */
.head_box .topLink .btnLang{position:relative;float:left;margin-left:20px}
.head_box .topLink .btnLang button{width:114px;height:50px;color:#fff;letter-spacing:0;background:rgba(0,0,0,0.4);}
.head_box .topLink .btnLang button span{position:relative;display:inline-block;padding-right:20px;}
.head_box .topLink .btnLang button span::after{position:absolute;top:50%;right:0;margin-top:-2px;width:7px;height:4px;content:'';background:url('/img/common/com_img.png') no-repeat -191px -124px}
.head_box .topLink .btnLang button.on span::after{background-position:-191px -100px}
.head_box .topLink .btnLang #lang_list{position:absolute;top:50px;left:0;width:100%;background:#fff;border:1px solid #000;border-width:0 1px 1px;z-index:250}
.head_box .topLink .btnLang #lang_list ul{padding:5px}
.head_box .topLink .btnLang #lang_list li a{position:relative;display:block;padding:10px 0 10px 40px;color:#000;letter-spacing:0;line-height:14px;border-top:1px solid #dfe2e5}
.head_box .topLink .btnLang #lang_list li a::before{position:absolute;top:50%;left:15px;margin-top:-7px;width:18px;height:14px;content:'';background:url('/img/common/com_img.png') no-repeat}
.head_box .topLink .btnLang #lang_list li.ic_en a::before{background-position:-152px -79px}
.head_box .topLink .btnLang #lang_list li.ic_ch a::before{background-position:-46px -146px}
.head_box .topLink .btnLang #lang_list li.ic_jp a::before{background-position:-10px -146px}
.head_box .topLink .btnLang #lang_list li.ic_kr a::before{background-position:-75px -146px}
.head_box .topLink .btnLang #lang_list li:first-child a{border-top:0}
.head_box .topLink .btnLang #lang_list li a:hover{background:#e5ecf8}

#header .btnSearch{position:absolute;top:0;right:0;width:50px;height:50px;text-indent:-999px;overflow:hidden;background:rgba(0,0,0,0.4) url('/img/common/com_img.png') no-repeat -97px -41px;z-index:200}
#header .btnSearch.on{background-color:#10284c;background-position:7px -159px}
#header .btnMenu{position:absolute;top:65px;right:0;width:50px;height:50px;text-indent:-999px;overflow:hidden;background:url('/img/common/com_img.png') no-repeat 2px -46px;z-index:200}


/* ---- 중간영역 ---- */
#container{position:relative;background:#fff}
#container #content{position:relative;width:100%;}
#container #content::after{display:block;clear:both;content:''}
#subContainer{position:relative;margin:0 auto;padding-top:40px;width:1200px;}
#subContainer::after{display:block;clear:both;content:''}
#subContainer aside{float:left;margin-bottom:100px;width:240px}
#subContainer aside .left_title{padding-top:40px;height:160px;background:#005fca}
#subContainer aside .left_title h2{margin-bottom:10px;font-size:30px;color:#fff;text-align:center;line-height:30px;}
#subContainer aside .left_title p{padding:0 20px;font-size:15px;color:#fff;text-align:center;word-break:break-all;}
#subContainer #content{position:relative;float:right;padding-bottom:50px;width:900px;min-height:500px;}

h1.title,
h2.title,
h3.title{font-family:"Arial",Simsun,"宋体",san-serif}

/* 서브 비주얼 */
.subSkin{position:relative;height:340px;text-align:center;background:url('/img/lang/sub_skin.jpg') no-repeat center top;background-size:cover}
.subSkin p{position:absolute;top:0;top:180px;width:100%;font-size:18px;color:#fff;text-align:center;line-height:40px}
.subSkin p b{display:block;font-size:42px}
.subSkin::after{position:absolute;left:0;bottom:0;height:54px;width:100%;content:'';background:rgba(0,0,0,0.26);border-top:1px solid rgba(0,0,0,0.22)}

/* 서브 location */
.locaInfor{position:absolute;top:-54px;left:0;width:100%;height:54px;}
.locaInfor .location{padding-left:54px;font-size:15px;line-height:54px;}
.locaInfor .location::after{display:block;clear:both;content:''}
.locaInfor .location .home{position:absolute;top:0;left:0;z-index:2}
.locaInfor .location .home a{position:relative;display:block;width:54px;height:100%;text-indent:-999px;overflow:hidden;background:#ffa70f}
.locaInfor .location .home a::after{position:absolute;top:50%;left:50%;margin:-9px 0 0 -8px;width:18px;height:16px;content:'';background:url('/img/common/com_img.png') no-repeat -101px -177px;z-index:1}
.locaInfor .location ul::after{display:block;clear:both;content:''}
.locaInfor .location ul li{position:relative;float:left;padding:0 45px 0 20px;color:#fff;border-right:1px solid rgba(0,0,0,0.22)}
.locaInfor .location ul li::after{position:absolute;top:50%;right:16px;margin-top:-5px;width:6px;height:10px;content:'';background:url('/img/common/com_img.png') no-repeat -51px -210px;z-index:1}
.locaInfor .location ul li:last-child::after{display:none}
.locaInfor .btnEtc{position:absolute;top:0;right:0}
.locaInfor .btnEtc > li{position:relative;float:left;}
.locaInfor .btnEtc > li button{position:relative;display:block;width:54px;height:54px;text-indent:-999px;overflow:hidden;border-right:1px solid rgba(0,0,0,0.22)}
.locaInfor .btnEtc > li:first-child button{border-left:1px solid rgba(0,0,0,0.22)}
.locaInfor .btnEtc > li button::after{position:absolute;top:50%;left:50%;content:'';background:url('/img/common/com_img.png') no-repeat;z-index:1}
.locaInfor .btnEtc > li .btnSns::after{margin:-9px 0 0 -7px;width:15px;height:18px;background-position:-101px -210px}
.locaInfor .btnEtc > li .btnPrint{position:relative;display:block;width:54px;height:54px;border-right:1px solid rgba(0,0,0,0.22)}
.locaInfor .btnEtc > li .btnPrint a{display:block;height:100%;text-indent:-999px;overflow:hidden;}
.locaInfor .btnEtc > li .btnPrint a::after{position:absolute;top:50%;left:50%;margin:-8px 0 0 -8px;width:16px;height:17px;content:'';background:url('/img/common/com_img.png') no-repeat -141px -210px}
.locaInfor .btnEtc > li .btnSns.on{background-color:rgba(0,0,0,0.4);border-bottom:1px solid rgba(0,0,0,0.22);}
.locaInfor .btnEtc > li .snsView{display:none;position:absolute;top:54px;left:0;width:100%;z-index:10}
.locaInfor .btnEtc > li .snsView li a{position:relative;display:block;width:54px;height:54px;text-indent:-999px;overflow:hidden;background-color:rgba(0,0,0,0.7);}
.locaInfor .btnEtc > li .snsView li a::after{position:absolute;top:50%;left:50%;content:'';background:url('/img/common/com_img.png') no-repeat;z-index:1}
.locaInfor .btnEtc > li .snsView li:first-child a{border-bottom:1px solid rgba(0,0,0,0.22);}
.locaInfor .btnEtc > li .snsView li.ic1 a::after{margin:-8px 0 0 -4px;width:8px;height:16px;background-position:-191px -10px}
.locaInfor .btnEtc > li .snsView li.ic2 a::after{margin:-7px 0 0 -9px;width:19px;height:14px;background-position:-152px -10px}

/* ---- 하단영역 ---- */
#footer {clear:both;width:100%;background:#565656;}
#footer .footWrap{position:relative;margin:0 auto;padding:60px 0 0 350px;width:1200px;min-height:160px;line-height:20px}
#footer .footWrap .footLogo{position:absolute;top:40px;left:25px;width:250px;height:60px;text-indent:-999px;overflow:hidden;background:url('/img/lang/com_lang.png') no-repeat -250px 0;}
#footer .footWrap address{font-size:14px;color:#ddd;}
#footer .footWrap small{font-size:14px;color:#ddd;word-break: break-all;}

/* 위로가기버튼 */
#footer .footWrap .botBtTop{display:none}
/*
================================================================================
상단메뉴
================================================================================
*/
#gnbArea{position:relative;clear:both;padding-top:20px;min-height:50px;z-index:150}
#gnb{position:relative;margin:0 auto;padding:0 60px 0 380px;width:1200px;z-index:20}
#gnb ul{width:100%;}
#gnb ul:after{display:block;clear:both;content:''}
#gnb .gnb.on > li > ul{visibility: visible;top:60px;opacity:1}
#gnb > ul > li{position:relative;float:left;margin-left:-1px}
#gnb > ul > li:first-child{background:none}
#gnb > ul > li > a{position:relative;display:block;padding:0 48px;height:60px;font-size:20px;color:#fff;text-decoration:none;font-weight:700;}
#gnb > ul > li > a::after{position:absolute;left:50%;bottom:-1px;width:0;height:3px;content:'';transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;background:#5380d2}
#gnb > ul > li > ul{visibility: hidden;position:absolute;top:40px;left:0;padding:20px 10px 0 15px;width:100%;opacity:0;overflow:hidden;transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;border-right:1px solid rgba(255,255,255,0.1);border-left:1px solid rgba(255,255,255,0.1)}
#gnb > ul > li > ul li{position:relative;margin:10px 0;padding-left:10px;line-height:20px;word-break:keep-all}
#gnb > ul > li > ul li::before{position:absolute;top:9px;left:0;width:3px;height:3px;content:'';background:#fff}
#gnb > ul > li > ul li a{display:block;font-size:14px;color:#fff;letter-spacing:1px}
#gnb > ul > li > ul li a:hover{font-weight:bold;letter-spacing:0.5px}

#gnb > ul > li.hv > a,
#gnb > ul > li.hv > a::after,
#gnb > ul > li > a:hover::after{left:0;width:100%;color:#5380d2;}

#gnbArea .gnbTxt{position:absolute;top:100px;left:0;opacity:0;transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;}
#gnbArea .gnbTxt h2{margin-bottom:15px;width:250px;font-size:34px;color:#fff;line-height:36px}
#gnbArea .gnbTxt p{width:230px;font-size:18px;color:#fff;line-height:20px;word-break:break-all}
#gnbArea.over .gnbTxt{top:110px;opacity:1}

.gnb_bg{position:absolute;top:135px;left:0;width:100%;height:0;overflow:hidden;background:rgba(50,66,81,0.95) ;transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;z-index:100}
.gnb_bg::after{position:absolute;left:50%;bottom:0;margin-left:-600px;width:1200px;width:270px;height:160px;opacity:0;content:'';background: url('/img/common/fam_gnb_bg.png') no-repeat left bottom;transition: all 1s ;-moz-transition: all 1s ;-webkit-transition: all 1s ; -o-transition: all 1s ;}
.gnb_bg.over::after{opacity:1;}
.gnb_bg.over{height:340px} /* 2차메뉴 높이 지정 */
#gnb > ul > li > ul{min-height:340px;} /* 2차메뉴 높이 지정 */


/* 모바일메뉴 */
#total_m_lay{display:none;position:fixed;top:0;width:250px;height:100%;overflow:auto;background:#173670;z-index:500;transition: all 0.3s;-ms-transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s; -o-transition: all 0.3s;}
#total_m_lay .mbTopLink{position:relative;padding-top:15px;height:135px;border-bottom:1px solid #455e8d}
#total_m_lay .mbTopLink::before{display:block;margin:0 auto 10px;width:105px;height:60px;content:'';background:url('/img/common/com_img.png') no-repeat -220px -190px}
#total_m_lay .mbTopLink a{position:relative;display:block;margin:0 auto;padding-left:10px;width:100px;height:32px;line-height:28px;font-size:15px;color:#fff;font-weight:bold;border:1px solid rgba(255,255,255,0.2)}
#total_m_lay .mbTopLink a::before{display:inline-block;margin-right:5px;width:18px;height:15px;content:'';vertical-align:middle;background:url('/img/common/com_img.png') no-repeat -101px -177px}
#total_m_lay .total_m > ul{background:#173670}
#total_m_lay .total_m li{position:relative}
#total_m_lay .total_m li a{display:block}
#total_m_lay .total_m li button{position:absolute;top:0;left:0;width:100%;height:100%;text-indent:-999px;overflow:hidden;}
#total_m_lay .total_m > ul > li{width:auto !important;font-size:18px;border-bottom:1px solid #455e8d}
#total_m_lay .total_m > ul > li.has-sub > a::after{position:absolute;top:22px;right:20px;width:12px;height:6px;content:'';background:url('/img/common/com_img.png') no-repeat -260px -400px}
#total_m_lay .total_m > ul > li.has-sub.open > a::after{background-position:-280px -400px}
#total_m_lay .total_m > ul > li > a{display:block;color:#fff;padding:15px 0 15px 20px;font-weight:bold;text-decoration:none;word-break: keep-all;}
#total_m_lay .total_m > ul > li.open > a{color:#fff;background:#353c47}
#total_m_lay .total_m > ul > li.has-sub.open > a{background:#0b2350}
#total_m_lay .total_m > ul > li > ul{display:none;padding:0;background:#e7e7e7;}
#total_m_lay .total_m > ul > li > ul > li{font-size:15px;border-bottom:1px solid #fff}
#total_m_lay .total_m > ul > li > ul > li.has-sub{}
#total_m_lay .total_m > ul > li > ul > li.has-sub.open{background-color:#fff;}
#total_m_lay .total_m > ul > li > ul > li > a{padding:10px 10px 10px 20px;color:#333;}
#total_m_lay .total_m > ul > li > ul > li.open > a{color:#fff;font-weight:bold;background:#5380d2}
#total_m_lay .total_m > ul > li > ul > li.has-sub > a::after{position:absolute;top:20px;right:20px;width:8px;height:4px;content:'';background:url('/img/common/com_img.png') no-repeat -300px -400px}
#total_m_lay .total_m > ul > li > ul > li.has-sub.open > a::after{background-position:-322px -400px}
#total_m_lay .total_m > ul > li > ul > li > ul{display:none;margin:5px 0;}
#total_m_lay .total_m > ul > li > ul > li > ul > li{font-size:14px;letter-spacing:-1px;}
#total_m_lay .total_m > ul > li > ul > li > ul > li.has-sub{}
#total_m_lay .total_m > ul > li > ul > li > ul > li > a::before{position:absolute;top:12px;left:20px;width:5px;height:7px;content:'';background:url('/img/common/com_img.png') no-repeat -191px -46px;}
#total_m_lay .total_m > ul > li > ul > li > ul > li.has-sub.open > a{color:#005fca;font-weight:bold}
#total_m_lay .total_m > ul > li > ul > li > ul > li.has-sub.open > a::before{background-position: -191px -73px;}
#total_m_lay .total_m > ul > li > ul > li > ul > li > a{padding:5px 10px 5px 30px;}
#total_m_lay .total_m > ul > li > ul > li > ul > li.has-sub > a:after{position:absolute;top:13px;right:20px;width:7px;height:7px;content:'';background:url('/img/common/com_img.png') no-repeat -340px -400px}
#total_m_lay .total_m > ul > li > ul > li > ul > li.has-sub.open > a:after{background-position:-360px -400px}
#total_m_lay .total_m > ul > li > ul > li > ul > li > ul{display:none;margin:5px 20px;padding:5px 0;border:1px solid #e7e7e7}
#total_m_lay .total_m > ul > li > ul > li > ul > li > ul > li{position:relative;font-size:12px;letter-spacing:0;font-weight:normal;}
#total_m_lay .total_m > ul > li > ul > li > ul > li > ul > li a{padding-left:16px;color:#555}
#total_m_lay .total_m > ul > li > ul > li > ul > li > ul > li::before{position:absolute;top:12px;left:10px;width:3px;height:1px;content:'';background:#ccc}
#total_m_lay .total_m > ul > li > ul > li > ul > li > ul > li.on a{color:#598dcd}

.btnMenuClose{position:absolute;top:0;left:0;width:35px;height:35px;text-indent:-999px;overflow:hidden;opacity:0;background: url('/img/common/com_img.png') no-repeat 0 -166px;z-index:20}
.btnMenuClose:focus{opacity:0.5}

.wra_box{position:fixed;top:0;left:0;height:auto;z-index:200}
.fix_bg{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000;opacity:0.7;z-index:450}

/*
================================================================================
왼쪽메뉴
================================================================================
*/
#lnb li{position:relative;font-size:18px;border-bottom:1px solid #e8e8e8;}
#lnb li a{position:relative;display:block;word-break: keep-all;}
#lnb > li.has-sub > a{}
#lnb > li > a{display:block;color:#555;padding:15px 35px 15px 15px;text-decoration:none;line-height:18px;background-color:#fff;border:1px solid #e8e8e8;border-width:0 1px}
#lnb > li > a:hover{text-decoration:underline}
#lnb > li.open > a{color:#fff;background:#353c47;border:1px solid #353c47;border-width:0 1px}
#lnb > li.has-sub > a::after{position:absolute;top:20px;right:20px;width:14px;height:14px;content:'';background:url('/img/common/com_img.png') no-repeat -10px -240px;}
#lnb > li.has-sub.open > a::after{top:26px;right:20px;width:15px;height:2px;background-position:-51px -240px;}

#lnb > li > ul{display:none;padding:10px 0;background:#f2f4f6;border:1px solid #e8e8e8;border-width:1px 1px 0}
#lnb > li > ul > li{margin-bottom:5px;font-size:14px;line-height:18px;border:0}
#lnb > li > ul > li > a{padding:5px 10px 5px 25px;}
#lnb > li > ul > li > a:hover{color:#0071d9;text-decoration:underline}
#lnb > li > ul > li > a:hover::before{background-position:-191px -73px;}
#lnb > li > ul > li > a::before{position:absolute;top:10px;left:15px;width:5px;height:7px;content:'';background:url('/img/common/com_img.png') no-repeat -191px -46px;}
#lnb > li > ul > li.has-sub::before{position:absolute;top:7px;right:15px;width:13px;height:13px;content:'';background:url('/img/common/com_img.png') no-repeat -101px -240px;}
#lnb > li > ul > li.open > a{color:#0071d9;font-weight:bold;}
#lnb > li > ul > li.open > a::before{background-position:-191px -73px;}
#lnb > li > ul > li.has-sub.open::before{background-position:-141px -240px;}
#lnb > li > ul > li > ul{display:none;margin:5px 15px 10px;padding:10px 0;background:#fff}
#lnb > li > ul > li > ul > li{margin-bottom:5px;font-size:13px;font-weight:normal;border:0}
#lnb > li > ul > li > ul > li a{padding:1px 10px 1px 20px;}
#lnb > li > ul > li > ul > li.on a{color:#285da3;font-weight:bold}
#lnb > li > ul > li > ul > li a:hover{color:#285da3;text-decoration:underline}

/*
================================================================================
메인, 서브레이아웃 반응형
================================================================================
*/

 /* PC Device */
@media all and (min-width:1025px){
	/* head오버시 */
	#header.over{background:#fff;border-bottom:0}
	#header.over .head_box .logo a{background-position:0 -60px;}
	#header.over .head_box .topLink .topFamSite ul li a{color:#777}
	#header.over .head_box .topLink .topFamSite ul li.home::after{background-position:-60px -10px}
	#header.over .head_box .topLink .topFamSite ul li::before{background:#cfcfcf}
	#header.over #gnb > ul > li > a{color:#333}
	#header.over #gnb > ul > li.hv > a{color:#5380d2}
	#header.over .btnSearch{background-color:#5380d2;}
	#header.over .btnMenu{background-position:-45px -46px}
	#header.over .btnSearch.on{background-color:#10284c;background-position:7px -159px}

	#total_m_lay.mOpen{right:0}
	#total_m_lay{right:-230px;}

}
  /* Tablet Device */
@media all and (max-width:1024px){
	img{max-width:100%}
	
	/* 상단 */
	.head_box{max-width:740px;width:100%}
	.head_box .logo{top:55px;width:100%;}
	.head_box .topLink{margin-right:0}
	#gnbArea{display:none}

	#header .btnMenu{position:absolute;top:70px;right:0;margin:0;background-color:#5380d2}
	
	#total_m_lay{right:-230px;}
	#total_m_lay.mOpen{right:0}
	
	#subContainer{padding:0;max-width:740px;width:100%}
	#subContainer aside{display:none}
	#subContainer #content{padding:30px 20px;width:100%}

	.locaInfor .location ul li{padding:0 20px 0 10px;}
	.locaInfor .location ul li::after{right:5px}
		
	#footer .famSite > ul{max-width:740px;width:100%}
	#footer .famSite > ul > li{width:50%}
	#footer .famSite > ul > li:nth-child(3){border-left:1px solid #5f6570;border-top:1px solid #5f6570}
	#footer .famSite > ul > li:nth-child(4){border-top:1px solid #5f6570}
	#footer .footWrap{padding:30px 10px;max-width:740px;width:100%;text-align:center}
	#footer .footWrap .footLogo{display:none}
	#footer .footWrap p{text-align:center}

	/* 위로가기버튼 */
	#footer .footWrap .botBtTop{position:relative;display:block;margin:50px -10px 0;padding-bottom:60px;text-align:center;border-top:1px solid #757575;opacity:0.5}
	#footer .footWrap .botBtTop::after{position:absolute;top:35px;left:50%;margin-left:-52px;width:104px;height:58px;content:'';background:url('/img/common/com_img.png') no-repeat -220px -190px;}
	#footer .footWrap .botBtTop button{position:relative;margin-top:-24px;width:40px;height:40px;font-size:11px;color:#fff;line-height:54px;background:#aeaeae;border-radius:50%}
	#footer .footWrap .botBtTop button::after{position:absolute;top:7px;left:50%;margin-left:-6px;width:12px;height:13px;content:'';background:url('/img/common/com_img.png') no-repeat -10px -210px}
}

@media all and (min-width:761px){
	.head_box .topLink .topFamSite ul{display:block !important}
}

/* Mobile Device */
@media all and (max-width:760px){
	
	#header::before{position:absolute;top:0;left:0;width:100%;height:40px;content:'';background:rgba(0,0,0,0.4)}
	.head_box{max-width:640px;min-height: 100px;}
	.head_box .logo{top:50px;left:20px;width:auto}
	.head_box .logo a{width:170px;height:40px;background-position:-250px -60px}
	.head_box .topLink{float:none;height:40px;}
	.head_box .topLink .btnLang{margin-left:10px}
	.head_box .topLink .btnLang button{height:40px;background:none}
	.head_box .topLink .btnLang #lang_list{top:40px}
	
	.head_box .topLink .topFamSite{display:none;position:relative;padding-top:0;width:155px}
	.head_box .topLink .topFamSite .btn{position:relative;display:block;width:100%;height:35px;font-size:13px;color:#fff;text-align:left;text-indent:20px;}
	.head_box .topLink .topFamSite .btn::after{position:absolute;top:50%;right:20px;margin-top:-2px;width:7px;height:4px;content:'';background:url('/img/common/com_img.png') no-repeat -191px -124px}
	.head_box .topLink .topFamSite .btn.on::after{background-position:-191px -100px}
	.head_box .topLink .topFamSite ul{display:none;position:absolute;top:35px;left:0;width:100%;background:#fff;border:1px solid #5380d2;border-width:0 1px 1px;z-index:300}
	.head_box .topLink .topFamSite ul li{float:none;font-size:13px;text-align:center}
	.head_box .topLink .topFamSite ul li.home{padding-left:0}
	.head_box .topLink .topFamSite ul li.home a{color:#5380d2}
	.head_box .topLink .topFamSite ul li.home::after{left:20px;background-position:-60px -10px}
	.head_box .topLink .topFamSite ul li a{padding:5px 0;color:#333;border-top:1px solid #dfe2e5}
	.head_box .topLink .topFamSite ul li a:hover{background:#e5ecf8}
	
	#header .btnMenu{top:45px;width:45px;height:45px;background-position:1px -47px;}
	
	.subSkin{height:250px;background-position:60% top}
	.subSkin::after{height:39px}
	.subSkin p{top:130px;padding:0 20px}
	.subSkin p b{font-size:30px;line-height:32px}
	.subSkin p span{display:none}
	#subContainer{max-width:640px;}
	#subContainer #content{padding:20px 10px;}

	.locaInfor{top: -40px;padding-right:40px;height:40px}
	.locaInfor .location{padding-left:45px;height:40px;line-height:40px;overflow-x:auto;overflow-y:hidden}
	.locaInfor .location .home a{width:40px}
	.locaInfor .location ul{white-space: nowrap;}
	.locaInfor .location ul li{float:none;display:inline-block;padding:0 14px 0 5px;font-size:13px;border-right:0}
	.locaInfor .location ul li::after{right:0}
	
	.locaInfor .btnEtc > li button{width:40px;height:40px}
	.locaInfor .btnEtc > li:last-child{display:none}
	.locaInfor .btnEtc > li .snsView{top:40px;}
	.locaInfor .btnEtc > li .snsView li a{width:40px;height:40px}

	
	#footer .famSite > ul{max-width:640px;}
	#footer .famSite > ul > li{float:none;width:auto;border:1px solid #5f6570;border-width:1px 1px 0 1px}
	#footer .famSite > ul > li:first-child{border-top:0}
	#footer .footWrap{max-width:640px;}
	#footer .footWrap .footMenu li{margin:4px 0}
	#footer .footWrap .footMenu li:nth-child(3)::before{display:none}
	
}

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

	#header .btnMenu{right:10px}

	.subSkin::after{display:none}

	.locaInfor{top:-41px;height:41px;background: rgba(0,0,0,0.26);border-top: 1px solid rgba(0,0,0,0.22);}
	.locaInfor .location .home{top:-1px}
	.locaInfor .location .home a{height:41px}
}