html{font-size:13px;}
body{font-family: 'Noto Sans KR', sans-serif; font-size:13px;}
img{max-width:100%;}
.container{padding:0px 10px;}
a:hover{text-decoration:none;}
/*상단메뉴를 정의합니다.*/
a{color:#333;}
#header{width:100%;}

#topHead{background-color:#233053;color:white;}
#topHead .container{height:50px;display:flex;justify-content: space-between;align-items:center; }

#topHead .topLogo{flex-grow:1;}
#topHead .topLogo img{width:100%;}
#topHead .topCall{width:175px;min-width:175px;letter-spacing:-0.03em;line-height:20px;font-weight:bold;font-size:0.95rem;}
#topHead .topCall .text{font-size:1rem;}
#topHead .topCall a{color:white;}
.headerMargin{width:100%;height:95px;}


/**/

#topMenu {display:flex;justify-content: space-around;align-items:center;margin:0px;padding:0px;width:100%;height:45px;border-bottom:1px solid #ccc;background-color:white;overflow:hidden;-webkit-transition: height 1s; /* Safari */
	transition: all 0.3s;}
#topMenu li{height:45px;}
#topMenu li a{position:relative;display:inline-block;width:100%;min-width:30px;height:45px;line-height:45px;text-align:center;overflow:hidden;font-size:12px;letter-spacing:0em;color:#535353;font-weight: 500;}
#topMenu li a.on:after{position:absolute;content:"";display:block;width:30px;left:calc(50% - 15px);bottom:0px; border-bottom:3px solid #0165A0}

#header.scrolldown #topMenu{
	height: 0px;
	-webkit-transition: height 1s; /* Safari */
	transition: all 0.3s;
}



/*******************************
로엘을 정의한다
*******************************/
#shome .home_bg{width:100%;}
#shome .home_bg img{width:100%;}

/*로엘 qna*/
#shome .home_qna{padding:20px 15px;background-color:#D8D9DA;box-shadow: 0 8px 6px -6px rgba(0,0,0,0.1);margin-bottom: 10px;}
#shome .txt_time{margin-bottom:5px;text-align:center;font-size:16px;color:#437DDB;font-weight:bold;}
#shome .txt_phone{margin-bottom:0px;text-align:center;font-size:21px;color:#333333;font-weight: bold;}
#shome .txt_phone a{color:#333333}
#shome .txt_info{text-align:center;padding:15px 0px 5px 0px;font-size:14px;color:#333333}


#qna_form{mwidth:100%;}
#qna_form > div{margin:0px;padding:0px;margin-bottom:5px;}
#qna_form > div input[type='text']{margin:0px;padding-left:10px;padding-right:10px;display:inline-block;margin:0px;width:100%;height:30px;border:1px solid #ccc;}
#qna_form > div textarea{margin:0px 0px 0px 0px;display:inline-block;padding:10px;width:100%;height:150px;border:1px solid #ccc;}
#qna_form .call_view2{position:static;display:none;}
#qna_agree{display:flex;align-items:center;height:20px;}
#qna_agree input{width:20px;height:20px;margin-right:5px;}	
#qna_agree label{margin:0px;}	
#qna_form  .call_btn{width:100%;margin:10px 0px;padding:0px;text-align:center;}
#qna_form  .call_btn a{display:inline-block;width:100%; height: 40px; background: #313b4b; color:white;text-align:center;font-size:13px;line-height:40px;}

/*사무소 소개*/
#main_map{width:100%;background-color:white;}
#main_map .su_head{padding:0px 20px;height:30px;line-height:25px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #090D10;}
#main_map .su_head .su_title{font-size:12px;font-weight:700;}
#main_map .su_head .su_more a{font-size:18px;font-weight:bold;font-weight:700;margin-right:5px;}


#main_map .seoul_map{margin-bottom:3px;width:100%;height:27vw;background:url('/m/img/map_bg.jpg') repeat center center;background-size:cover;}
#main_map .seoul_map a{display:block;color:white;text-align:center;}
#main_map .seoul_map a .com_name{padding:20px 0px 10px 0px;text-align:center;line-height:23px;font-size:21px;font-weight:500;}
#main_map .seoul_map a .com_address{text-align:center;font-size:9px;font-weight:300;}

#main_map ul{width:100%;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:5px;}
#main_map ul li{position:relative;width:calc(16.6% - 2px);height:32.3vw;}
#main_map ul li.map01{background:url('/m/img/map01.jpg') repeat center center;background-size:cover;}
#main_map ul li.map02{background:url('/m/img/map02.jpg') repeat center center;background-size:cover;}
#main_map ul li.map03{background:url('/m/img/map03.jpg') repeat center center;background-size:cover;}
#main_map ul li.map04{background:url('/m/img/map04.jpg') repeat center center;background-size:cover;}
#main_map ul li.map05{background:url('/m/img/map05.jpg') repeat center center;background-size:cover;}
#main_map ul li.map08{background:url('/m/img/map08.jpg') repeat center center;background-size:cover;}

#main_map ul li a{display:block;position:absolute;top:0px;left:0px;width:100%;height:100%;color:white;}
#main_map ul li a > div{text-align:center;}
#main_map ul li a .com_name{margin-bottom:5px;padding-top:25px;font-size:9px;font-weight:500;letter-spacing:-0.05em;overflow:hidden;}
#main_map ul li a .com_location{font-size:17px;font-weight:500;}
#main_map ul li a .com_go{position:absolute;width:100%;left:0px;bottom:15px;font-size:8px;font-weight:600;text-align:center;}
#main_map ul li a .com_go span{display:inline-block;height:20px;line-height:20px;width:90%;margin:0px 5%; background:url('/m/img/mapbox_bg.png') no-repeat center center;background-size:100%;}

#main_map .map_text{padding:5px 10px;font-size:11px;font-family:'굴림';font-weight:500;letter-spacing:-0.08em;text-align:center;}


/*마약 범죄*/
.crime_bg{width:100%;}
.crime_bg img{width:100%;}

.crime_info{padding:30px 20px 50px 20px;width:100%;background:url('/m/img/crime_txt2.jpg') no-repeat center -30px;color:#666; }
.crime_info .info_text{margin-bottom:10px;font-size:16px;color:#666;font-weight:bold;}
.crime_info .info_content{margin-bottom:10px;font-size:14px;color:#666;}
.crime_info .info_title{margin:20px 0px -2px;font-size:14px;}
.crime_info .info_sign{font-size:18px;font-weight:bold;}





/*위치소개 */
/*매상단을 정의*/
.map_bg{width:100%;}
.map_bg img{width:100%;}
.map_nav{width:100%;}
.map_nav .map_top{width:100%;margin-bottom:2px;display:flex;justify-content:space-between;align-items:center;}
.map_nav .map_top .nav_item{width:calc(50% - 2px);height:44px;}
.map_nav .map_top .nav_item a{height:44px;line-height:44px;font-size:14px;}

.map_nav .map_bottom{width:100%;margin-bottom:2px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;}
.map_nav .map_bottom .nav_item {width:calc(33.3% - 2px);height:44px;margin-bottom:2px;}
.map_nav .map_bottom .nav_item a{height:44px;line-height:44px;font-size:11px;}


.map_nav .nav_item a{display:inline-block;width:100%;text-align:center;background-color:#f4f4f4;color:#999999;overflow:hidden;letter-spacing:-0.05em;}
.map_nav .nav_item a:hover, .map_nav .nav_item.on a{background-color:#626f78;color:#ffffff;}

/*오시는 글을 정의합니다.*/
#locationCon{position:relative;width:100%;height:640px;} 
#locationCon .location_content{position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:0;background-color:white;z-index:0;}
#locationCon .location_content.on{z-index:10;}
#locationCon .location_content .root_daum_roughmap{margin:20px 15px;width:calc(100% - 30px);height:30vh;border:1px solid #ccc;}

#locationCon .minfoDiv{padding:0px 15px 20px 15px;}

#locationCon  .minfo_line{height:10px;margin-bottom:10px;border-bottom:1px solid #ccc;}

#locationCon .minfoDiv .minfo_title{font-size:15px;margin-bottom:10px;}
#locationCon .minfoDiv .minfo_con{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:5px;}
#locationCon .minfoDiv .minfo_con .minfo_head{min-width:50px;width:50px;font-weight:bold;}
#locationCon .minfoDiv .minfo_con .minfo_text{flex-grow:1;}

#locationCon .minfoDiv .minfo_btn_con{width:100%;margin:10px 0px;}
#locationCon .minfoDiv .minfo_btn_con a{display:flex; justify-content:center;align-items:center;width:100%;height:44px;line-height:44px;text-align:center;background-color:#2E689E;color:white;font-size:14px;}
#locationCon .minfoDiv .minfo_btn_con a img{height:25px;display:inline-block;margin-right:10px;}


/**********************************
lawyer
**********************************/






/*오시는길 갤러리를 정의*/
.div_preview { position:relative; width:90%; margin:0 auto 50px;}
.div_preview .img_slide {width:100%; margin:0 auto; position:relative; overflow:hidden;}
.div_preview .img_slide .big_img {width:100%; position:relative;}
.div_preview .img_slide .big_img img {width:100%; display:block; }
.div_preview .img_slide .big_img .prev {z-index:100;}
.div_preview .img_slide .big_img .current {z-index:101;}
.div_preview .img_slide .big_img .bn {position:absolute; top:50%; width:63px; height:63px; z-index:110;}
.div_preview .img_slide .big_img .bn a {display:block; text-align:center; width:100%; height:100%;}
.div_preview .img_slide .big_img .bn a img {display:inline-block;}
.div_preview .img_slide .big_img .bn_left {left:20px;}
.div_preview .img_slide .big_img .bn_right {right:20px;}
.div_preview .img_slide .bns_area {width:100%; position:relative;margin-top:27px;}
.div_preview .img_slide .bns_area .imgs {position:relative; width:100%;}
.div_preview .img_slide .bns_area .imgs li {width:33.3%;  float:left; margin:0;  padding-top:18px;}
.div_preview .img_slide .bns_area .imgs li.selected {width:33.3%;  background:url('/img/nd_slider_selected_bg.jpg') left top repeat-x; padding-top:18px;}
.div_preview .img_slide .bns_area .imgs li a { display:block; width:100%; height:100%; display:block;}
.div_preview .img_slide .bns_area .imgs li.selected a {}
.div_preview .img_slide .bns_area .imgs li a img {width:100%;}
.div_interior { width:90%; position:relative; margin:0 auto; overflow:hidden;}
.div_interior > p.p_interior { text-align:center;}
.div_interior .div_movie { overflow:hidden;}





/******************************
성공사례를 보여준다
******************************/
#slc_best{padding:0px 5px;}
#slc_best .swiper-container{margin-top:15px;padding:0px 0px 35px 0px;}
.success_wrap .row {margin-left:0px;margin-right:0px;}
.success_wrap .row > div{padding-left:5px;padding-right:5px;}
.success_wrap .row > div > div{border:1px solid #ccc;}
.success_wrap .best_head {padding:5px;width:100%;height:70px;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:0px;}
.success_wrap .best_head .bh_img {width:50px;margin-right:10px;}
.success_wrap .best_head .bh_img img {width:100%;}

.success_wrap .best_head .bh_txt {flex-grow:1;}
.success_wrap .best_head .bh_txt .best_img{margin-bottom:5px;padding:0px 10px;font-size:10px;color:white;background-color:#437DDB;border:1px solid #aaa;border-radius:3px;font-weight:normal;}

.success_wrap .best_head .bh_txt .bh_tit1 {margin:0px;margin-bottom:3px;font-size:12px;color:#15294e; font-weight:600;line-height:14px;}
.success_wrap .best_head .bh_txt .bh_tit2 {margin:0px;margin-bottom:0px;font-size:12px; color:#495164; font-weight:600;line-height:14px;}

.success_wrap .best_body {background:#b8becb; color:#fff; font-size:12px;  font-weight:normal; padding:10px 5px;width:100%;line-height:17px;letter-spacing:-0.1em;}
.success_wrap .best_body .bb_txt{margin-bottom:10px;width:100%;height:119px;font-family:'돋움';overflow:hidden;}
.success_wrap .best_body .bb_btn a{display:inline-block;width:100%;text-align:center;padding:3px;color:white;border:1px solid white;letter-spacing:0px;}

/*검색을 정의*/
#slc_search{padding:0px 10px 15px 10px;}
.search_box {width:100%;}
.search_box .search_inp{width:100%;display:flex;justify-content:center;align-items:center;border:2px solid #084067; overflow:hidden; background:#495164;}
.search_box .search_inp input[type='text']{display:block; min-width:86%;width:86%; padding:1.74% 2%; border:0; font-size:13px}
.search_box .search_inp button{display:block; flex-grow:1;text-align:center;background-color:#495164;border:none;}
.search_box .search_inp button img{width:35px;}
.search_box .ap_form{margin-top:1%; border:1px solid #084067;}

/*성공사례 리스트*/
#slc_list{margin-top:0px;padding:0px 10px;font-size:12px;letter-spacing:-0.05em;}
#slc_list ul.list_con.list_con{border-top:2px solid #777;}
#slc_list ul.list_con li{border-bottom:1px solid #ccc;}
#slc_list ul.list_con li.header{width:100%;padding:10px 0px;display:flex;justify-content:space-between;text-align:center;color:black;}
#slc_list ul.list_con li.header .case_head{width:80px;min-width:80px;margin-right:10px;text-align:center;}
#slc_list ul.list_con li.header .case_text{flex-grow:1;text-align:center;}

#slc_list ul.list_con li.texter{position:relative;padding:8px 0px;}
#slc_list ul.list_con li.texter a{width:100%;display:flex;justify-content:space-between;text-align:flex-start;}
#slc_list ul.list_con li.texter a .case_head{width:80px;min-width:80px;margin-right:10px;text-align:center;color:black;}
#slc_list ul.list_con li.texter a .case_text{flex-grow:1;}

#slc_list ul.list_con li.texter a .case_text .code{color:#1b81bd;font-weight:bold;}
#slc_list ul.list_con li.texter a .case_text .info{color:#aaa;}
#slc_list ul.list_con li.texter a .case_text .info .vline{display:inline-block;margin:0px 5px;}

#slc_list ul.list_con li.texter.active{background-color:#f4f4f4;}

#slc_list ul.list_con li.texter .pw_required{display:none;position:absolute;top:0px;left:0px;width:100%;height:100%;justify-content:center;align-items:center;z-index:10;}
#slc_list ul.list_con li.texter.on .pw_required{display:flex;background-color:rgba(0,0,0,0.8);}
#slc_list ul.list_con li.texter .pw_required input{width:150px;height:35px;border:none;border-bottom:1px solid white;display:inline-block;margin-right:10px;color:white;background-color:transparent;}
#slc_list ul.list_con li.texter .pw_required button{width:80px;height:35px;border:1px solid white;display:inline-block;background-color:transparent;color:white;}


#scasePaging{padding:15px 0px;display:flex;justify-content:center;align-items:center;}
#scasePaging .page-item{margin:0px 3px;}
#scasePaging .page-item a, #scasePaging .page-item button{display:inline-block;padding:0px;width:32px;height:32px;line-height:30px;text-align:center;}



#slideCaseView{display:none;padding:15px 10px;}
#slideCaseList{display:block;}
#slideCaseView .list_con{margin-top:0px;padding:0px 10px;font-size:14px;letter-spacing:-0.05em;}
#slideCaseView ul.list_con li{border-bottom:1px solid #ccc;font-size:14px;}

#slideCaseView ul.list_con li.texter{padding:8px 0px;}
#slideCaseView ul.list_con li.texter {width:100%;display:flex;justify-content:center;text-align:flex-start;}
#slideCaseView ul.list_con li.texter .case_head{width:100px;min-width:80px;margin-right:10px;text-align:center;color:black;}
#slideCaseView ul.list_con li.texter .case_line{width:15px;min-width:15px;border-left:1px solid #ccc;}

#slideCaseView ul.list_con li.texter .case_text{flex-grow:1;}
#slideCaseView ul.list_con li.texter .case_text .title{color:#333;font-size:18px;font-weight:bold;}
#slideCaseView ul.list_con li.texter .case_text .code{color:#1b81bd;font-size:16px;font-weight:bold;}
#slideCaseView ul.list_con li.texter .case_text .info{color:#aaa;}
#slideCaseView ul.list_con li.texter .case_text .info .vline{display:inline-block;margin:0px 5px;}

#slideCaseView .rcc p{margin-bottom:5px;font-size:15px !important;line-height:20px;}
#slideCaseView .rcc span{font-size:15px !important;line-height:20px;}

#slideCaseView .readBtn{padding:20px 10px;text-align:right;}
/*성공사례를 정의한다*/
.lawyer_box {display:block; width:100%; margin-top:50px; clear:both;}
.lawyer_title {position:relative; font-size:30px; font-weight:bold; color:#000;  padding-top:7px; letter-spacing:-1px;}
@media all and (max-width:670px){
	.lawyer_title{ font-size:4.6875vw;  }
}
.lawyer_title span { position:absolute; left:0; top:0; width:30px; height:2px; background:#000; }
.lawyer_list_box { margin:2px 0 0 0; }
.lawyer_list_box ul { width:100%;  padding:0; margin:0; margin-left:0 !important; font-size:0;}
.lawyer_list_box li { display:inline-block; list-style:none;   background:none !important; padding-left:0 !important; text-align:center; font-size:12px !important; color:#353535 !important; letter-spacing:-1px; margin-right:0px; }
.lawyer_list_box li:last-child { margin-right:0px; }
.lawyer_list_box li span { display:block; width:80px; text-align:center; border-radius:50%; margin:20px 5px 0 5px; }
.lawyer_list_box li span img { width:80px; height:80px;margin:5px 0 !important; vertical-align:bottom; border-radius:50%;}

/******************************
하단을 정의한다
******************************/
#quickMenu{position:fixed;bottom:80px;right:15px;z-index:100000;}
#quickMenu > div{}
#quickMenu > div a{display:inline-block;}
#quickMenu > div a img{display:inline-block;width:60px;}
#quickMenu > div.quick_call{margin-bottom:15px;}


#footer2{background:#495164;padding:25px 20px 70px 20px;}
#footer2 .logo{margin-bottom:5px;font-size:12px;color:#f1f1f1;font-weight:700;}

#footer2  div{font-size:11px;color:#eee;line-height:1.5em;letter-spacing:-0.08em;font-family:'Nanum Gothic'}
#footer2  div.company{}
#footer2  div.company .stitle{color:#ccced2;font-weight:700;color:#f1f1f1;}
#footer2  div.ceo{border-bottom:1px solid #666;margin-top:5px;margin-bottom:8px;padding-bottom:8px}
#footer2 .addrCon{border-bottom:1px solid #666;margin-bottom:8px;padding-bottom:8px}

#footer2 .addrCon li{display:flex;width:100%;margin-bottom:5px;letter-spacing:-0.05em;}
#footer2 .addrCon li .addr_title{width:65px;min-width:65px;color:#ccced2;font-weight:700;}
#footer2 .addrCon li .addr_text{flex-grow:1;color:#b8bbc0;font-family:'굴금';}

#footer2 .cscenter{padding-bottom:10px;}
#footer2 .cscenter .phone{display:flex;width:100%;margin-bottom:5px;}
#footer2 .cscenter .phone .tel{}
#footer2 .cscenter .phone .fax{margin-left:auto;}
#footer2 .cscenter div{font-size:12px;color:#ccc;font-weight:400;letter-spacing:-0.02em;font-family:'Century Gothic';}
#footer2 .cscenter div span.stitle{display:inline-block;width:30px;font-weight:700;font-size:12px;color:white;}
#footer2 .manager{text-align:left;font-size:14px;margin-bottom:20px;}
#footer2 .pc_go{text-align:center;}
#footer2 .pc_go a{display:inline-block;padding:10px 30px;border:1px solid #ccc;text-align:center;color:white;}


#bottomNav{position:fixed;bottom:0px;left:0px;width:100%;height:60px;background-color:#233053;padding:0px;margin:0px;z-index:100000;}
#bottomNav li{margin:0px;padding:0px;float:left;width:33.3%;}
#bottomNav li a{position:relative;display:block;width:100%;height:60px;display:flex;align-items:center;justify-content:center;color:white;font-size:13px; letter-spacing:-0.05em;}
#bottomNav li a img{display:inline-block;max-height:35px;margin-right:3px;}
#bottomNav li a .vline{display:inline-block;position:absolute;top:15px;right:0px;height:30px;border-right:1px solid #ddd;}

/******************************
로엘의조력
******************************/
