@charset "utf-8";
.pageTit { font-weight:300; color:#333; margin-bottom:10px; font-size:2.0rem; font-weight:500;}
/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 카테고리  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.snb_menu3 { display:flex; margin-bottom:30px; gap:1px; border-bottom:1px solid #ddd;  }
.snb_menu3 li { width:20%; flex-grow:1; background:#f1f1f1; height:4.6rem; display:flex; justify-content:center; align-items:center; border-radius:6px 6px 0 0; cursor:pointer;}
.snb_menu3 li a,
.snb_menu3 li span { width:100%; display:block; text-align:center; font-size:1.5rem; color:var(--text-dkgrey); margin-top:2px; cursor:pointer; }
.snb_menu3 li.current { background:var(--gra-main);}
.snb_menu3 li.current a,
.snb_menu3 li.current span { color:#fff;}

/* ================================== 반응형 ================================== */
@media all and (max-width: 768px) { 
	.snb_menu3 li a,
	.snb_menu3 li span { font-size:1.4rem;}
}	

@media all and (max-width: 480px) { 
	.snb_menu3 li a,
	.snb_menu3 li span { font-size:1.3rem;}
}


/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 목록페이지  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
/*admin*/	
.s_default_admin { padding:5px; margin-top:10px; }
.s_default_admin img { vertical-align:-4px; }
.s_default_admin a{ color:red; }

/* 지점 검색 */
.branch_src_wrap { display:flex; justify-content:center; border:2px solid #efefef; padding:30px 50px 20px; border-radius:10px; margin-bottom:30px; gap:80px;}
.branch_src_wrap .branch_src { }
.branch_src_wrap .branch_src input[type=text], 
.branch_src_wrap .branch_src select { border-radius:4px; }
.branch_src_wrap .map_src { width:323px; flex-shrink:0; }
.branch_src_wrap .map_src .map { width:100%; aspect-ratio:323/349;}
.branch_src_wrap .map_src .map img { width:100%; }
.branch_src_wrap .keyword_src { flex-grow:1; max-width:500px; }
.branch_src .src_tit { height:60px; }
.branch_src .src_tit h4 { font-size:2.0rem; font-weight:500; color:var(--text-main); margin-bottom:5px; }
.branch_src .src_tit p { font-size:1.4rem; color:var(--text-grey); }
.branch_src .key_src_wrap { display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.branch_src .key_src_wrap .src_item { display:flex; width:100%; align-items:center; }
.branch_src .key_src_wrap .src_item span { width:80px; flex-shrink:0; }
.branch_src .src_btn_wrap { padding-left:80px; width:100%; }
.branch_src .src_btn_wrap .src_btn { width:100%; height:4.0rem; line-height:4.0rem; text-align:center; background:var(--gra-main); color:#fff; border:0; border-radius:4px; }

/* 목록 테이블 */
.boardList { border-top:2px solid var(--main); }
.boardList td {border-bottom:1px solid #efefef; padding:10px 15px ; text-align:center; font-size:1.5rem; color:var(--text-dkgrey); }
.boardList td a { color:var(--text-dkgrey); }
.boardList th { /*background:#f9f3f6;*/ font-weight:300; color:var(--text-ltgrey); text-align:center; padding:10px 15px; border-bottom:1px solid var(--main); }
.boardList tr:hover td { background:#f9f9f9; }

.branchBoard td.branch_name { text-align:left; }
.branchBoard td.branch_name span { cursor:pointer; font-weight:500; }
.branchBoard td.branch_address { text-align:left; color:var(--text-ltgrey); }
.branchBoard td.branch_tel br { display:none; }
.branchBoard .view_btn { font-size:1.4rem; width:70px; height:30px; line-height:30px; text-align:center; color:var(--text-grey); border:1px solid #ccc; border-radius:4px; display:inline-block; }
.branchBoard td.branch_tel a { cursor:default; pointer-events:none; }

.listBtmBtns { margin-top:10px;}


/* ================================== 반응형 ================================== */
@media all and (max-width: 1024px) { 
	/* 지점 검색 */
	.branch_src_wrap { padding:30px 20px 20px; gap:0px;}
	.branch_src .src_tit { height:auto; }
	.branch_src .src_tit p { display:none; }
}

@media all and (max-width: 768px) { 
	/* 지점 검색 */	
	.branch_src_wrap { padding:10px; border-radius:6px; }
	.branch_src_wrap .map_src { display:none; }
	.branch_src .src_tit { display:none; }
	.branch_src .key_src_wrap { gap:5px; margin-top:0; }

	/* 목록 테이블 */
	.boardList thead { display:none; }
	.boardList tr { display:flex; width:100%; border-bottom:1px solid #efefef; flex-wrap:wrap; gap:5px; padding:10px 5px; }
	.boardList td { border-bottom:0; padding:0;}
	.boardList tr:hover td { background:#fff; }

	.branchBoard td.branch_name { order:1; width:35%; }
	.branchBoard td.branch_tel { order:2; flex-grow:1;  }
	.branchBoard td.branch_address { order:3; width:100%; font-size:1.4rem; }
	.branchBoard td.branch_view { display:none; }
	.branchBoard td.branch_tel a { width:100%; pointer-events:initial; display:flex; align-items:center; gap:3px; justify-content:flex-end; flex-grow:1; }
	.branchBoard td.branch_name span { display:block; width:100%; }
	.branchBoard td.branch_tel a:before { content:''; display:block; width:12px; aspect-ratio:1/1; background:url(images/icon_tel.png)center no-repeat; background-size:contain; }

}	



/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 상세페이지  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.branch_view_wrap .branch_tit { font-size:3.6rem; font-weight:500; color:var(--text-black); margin-bottom:25px;}

.branch_certi { background:#f7ebf1; display:flex; justify-content:center; align-items:center; border-radius:6px; color:var(--text-dkgrey); font-weight:500; padding:17px 15px 15px; margin-bottom:20px;
flex-wrap:wrap;}
.branch_certi span { display:flex; align-items:center; white-space: nowrap;}
.branch_certi span:not(:first-child):before { content:''; width:1px; height:12px; background:#ccc; margin:0 10px; }
.branch_certi span.mohw:before { content:''; width:22px; aspect-ratio: 1/1;  background:url(images/mohw_mark.png)center; background-size:contain; margin-right:3px; }

.branch_ceo { display:flex; gap:50px;}
.branch_ceo .ceo_img { width:20%; max-width:256px; flex-shrink:0; }
.branch_ceo .ceo_img img { border-radius:6px; overflow:hidden;}
.branch_ceo .ceo_greeting { flex-grow:1; color:var(--text-grey); }
.branch_ceo .ceo_greeting .common_text_1 { font-size:2.0rem; font-weight:500; margin-bottom:20px; color:var(--text-dkgrey);}
.branch_ceo .ceo_greeting .common_text_1 strong { color:var(--text-main); }
.branch_ceo .ceo_greeting .common_text_2 { margin-bottom:15px; }
.branch_ceo .ceo_greeting .common_text_2 strong { font-weight:500; color:var(--text-dkgrey); }

.branch_section { margin-top:90px;}
.branch_section .title { font-size:2.6rem; font-weight:500; color:var(--text-black); margin-bottom:20px; position:relative;}
.branch_section .title:before { content:''; width:33px; aspect-ratio: 1/1; background:url(images/title_bullet.png)center; background-size:contain;
	 position:absolute; left:0; top:0; margin-top:-5px; margin-left:-10px; z-index:-1;}
.branch_info_table .service_list { display:flex; gap:5px; flex-wrap:wrap; }
.branch_info_table .service_list span { display:block; height:34px; line-height:38px; border-radius:17px; color:#fff; width:110px; text-align:center; font-weight:300; }
.branch_info_table .service_list span.service_1 { background:var(--gra-pink);}
.branch_info_table .service_list span.service_2 { background:var(--gra-blue);}
.branch_info_table .service_list span.service_3 { background:var(--gra-green);}
.branch_info_table .service_list span.service_4 { background:#908f8f;}
.branch_info_table a.tel { cursor:default; pointer-events:none; }
.branch_info_table .accountInfo { display:flex; flex-wrap:wrap; }
.branch_info_table .accountInfo + .accountInfo { margin-top:5px; }
.branch_info_table .accountInfo span { display:flex; align-items:center; white-space: nowrap;}
.branch_info_table .accountInfo span:not(:first-child):before { content:''; width:1px; height:12px; background:#ccc; display:block; margin:0 10px; }
.branch_info_table .ceo_name { font-size:1.7rem; color:var(--text-dkgrey); font-weight:500; margin-bottom:7px; display:block; }
.branch_info_table .career_list li+li { margin-top:0.4rem;}
.paymentList_open { background:var(--gra-green); color:#fff; font-size:1.6rem; font-weight:500; height:50px; width:180px; border:1px solid #85af56; display:flex; justify-content:center;
align-items:center; margin-top:20px; border-radius:10px; gap:5px; }

.branch_location .branch_map_wrap { width:100%; height:500px; border:3px solid #ccc; } 
.branch_location .branch_map_wrap .root_daum_roughmap { width:100% !important; }
.branch_location .branch_map_wrap .root_daum_roughmap .wrap_map { width:100% !important; height:464px !important; }
.branch_location .branch_map_wrap .root_daum_roughmap .cont .section.lst { display:none;}

.branchImgWrap { position:relative; }
.branchImgWrap .branchImgSlide .imgItem { margin:0 10px; max-width:306px; text-align:center; }
.branchImgWrap .branchImgSlide .imgItem .thumb { border:1px solid #ccc; margin-bottom:10px;}
.branchImgWrap .branchImgSlide .imgItem .caption {
  font-size: 1.6rem;
  font-weight: 200;
  color: var(--text-grey);
  line-height: 1.3em;
  height:2.6em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.branchImgWrap .arrowSlider {position:absolute; top:0; right:0;  display:flex; align-items:center;}
.branchImgWrap .arrowSlider .arrows { width:40px; aspect-ratio:1/1; border-radius:50%; border:1px solid #ccc;  }
.branchImgWrap .arrowSlider .arrows.prev { background:#fff url(images/slide_prev.png)center no-repeat; background-size:contain; }
.branchImgWrap .arrowSlider .arrows.next { background:#fff url(images/slide_next.png)center no-repeat; background-size:contain; }

.branch_btm_btns { margin-top:100px; display:flex; justify-content:center; gap:5px; align-items:center;}
.branch_btm_btns .btn { width:200px; max-width:20%; min-width:130px;  }

#paymentListLayer.show { display: block !important;}


/* ================================== 반응형 ================================== */
@media all and (max-width: 1024px) { 
	.branch_view_wrap .branch_tit { font-size:3.3rem; margin-bottom:20px;}
	.branch_certi { padding:12px 10px 10px; margin-bottom:20px; }
	.branch_certi span.mohw:before { width:18px; }

	.branch_ceo { gap:30px;}
	.branch_info_table .ceo_name { font-size:1.6rem; }
	.branch_ceo .ceo_greeting .common_text_1 { font-size:1.8rem; margin-bottom:15px; }

	.branch_section { margin-top:80px;}
	.branch_section .title { font-size:2.4rem; margin-bottom:15px;}
	.branch_section .title:before { width:26px; margin-top:-3px; margin-left:-7px; }
	.branch_info_table .service_list span { height:32px; line-height:36px;  width:90px; }
	.paymentList_open { font-size:1.5rem; height:46px; width:160px;  }

	.branch_location .branch_map_wrap { height:400px; border:2px solid #ccc; } 
	.branch_location .branch_map_wrap .root_daum_roughmap .wrap_map { height:364px !important; }

	.branchImgWrap .branchImgSlide .imgItem { margin:0 5px; }
	.branchImgWrap .branchImgSlide .imgItem .caption { font-size:1.5rem; }

	.branch_btm_btns { flex-wrap:wrap; margin-top:80px; }
}

@media all and (max-width: 768px) {	
	.branch_ceo { gap:15px;}
	.branch_ceo .ceo_greeting .common_text_1 { font-size:1.6rem; margin-bottom:10px; }
	.branch_view_wrap .branch_tit { font-size:2.8rem; margin-bottom:15px;}

	.branch_section { margin-top:60px;}
	.branch_section .title { font-size:2.2rem; margin-bottom:12px;}
	.branch_section .title:before { width:24px; margin-top:-3px; margin-left:-5px; }

    .branch_info_table a.tel { pointer-events:initial; }

	.branchImgWrap .arrowSlider .arrows { width:30px; }

	.branch_btm_btns { margin-top:60px; }
}

@media all and (max-width: 480px) {
	.branch_view_wrap .branch_tit { font-size:2.2rem; margin-bottom:10px;  }

	.branch_section { margin-top:50px; }
	.branch_section .title { font-size:2.0rem; margin-bottom:10px; font-weight:300; }
	.branch_section .title:before { width:20px; margin-top:-3px; margin-left:-5px; }
	.branch_info_table .service_list { justify-content:center; }
	.branch_info_table .service_list span { height:28px; line-height:30px; }
	.branch_info_table .accountInfo span { width:100%; }
	.branch_info_table .accountInfo span:not(:first-child):before { display:none; }
	.paymentList_open { font-size:1.4rem; height:40px; width:140px;  }
	.paymentList_open img { width:16px; }

	.branch_location .branch_map_wrap { height:360px; border:2px solid #ccc; } 
	.branch_location .branch_map_wrap .root_daum_roughmap .wrap_map { height:324px !important; }

	.branch_btm_btns { margin-top:40px; }
	.branch_btm_btns .btn { width:40%; max-width:initial; min-width:initial; }
}



/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 글쓰기  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.boardWrite { border-top:2px solid var(--main);}
.boardWrite th, 
.boardWrite td { border-bottom:1px solid #efefef; padding:10px 15px; font-size:1.5rem; color:var(--text-dkgrey); text-align:left; position:relative}
.boardWrite th .required { position:absolute; top:12px; left:3px; color:#ff8400;}
.boardWrite th { font-weight:300; width:15%; max-width:200px; vertical-align:top; line-height:4.0rem; }
.boardWrite td { /*display:flex; width:100%; gap:5px; align-items:center;*/}
#boardSkin_s_faq_write_editor,
#boardSkin_s_default_modify_editor { width:100%;}
.writeBtmBtns { margin-top:20px; }
.writeBtmBtns:after { content:''; display:block; clear:both; width:100%; }
.writeBtmBtns .left { float:left; }
.writeBtmBtns .right { float:right; }
.writeBtmBtns .left,
.writeBtmBtns .right { display:flex; gap:5px; align-items:center; }
.boardWrite .captcha { display:flex; gap:10px; align-items:center; width:100%; }
.boardWrite .captcha span { display:flex; gap:5px; align-items:center; flex-grow:1;}
.boardWrite .captcha span input { max-width:180px;}
.boardWrite .captcha img { height:4.0rem; width:auto;}
.boardWrite .flexDiv { display:flex; gap:5px; align-items:center; }
.popSelect { max-width:90px;}
.boardWrite .selectDiv { display:flex; gap:5px 15px; flex-wrap:wrap; }
.boardWrite .lableType { cursor:pointer; display:flex; align-items:center; gap:3px; line-height:1; }


/* ================================== 반응형 ================================== */
@media all and (max-width: 1024px) {	
	.boardWrite th { line-height:1.3; }
}

@media all and (max-width: 480px) {		
	.boardWrite tr, .boardWrite th, .boardWrite td { display:block; width:100%; max-width:100%; }
	.boardWrite th { background:#f9f9f9; line-height:1.0; }
	.boardWrite td { padding:10px 0;}
	.boardWrite .captcha { flex-wrap:wrap; gap:5px; }
	.boardWrite .captcha span { width:100%;}
}


/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 비밀번호입력  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.writePwd .title { text-align:center;}
.writePwd .title h2 { font-size:2.0rem; color:var(--text-main); font-weight:300; }
.writePwd .pwdBox { width:100%; max-width:360px; margin:30px auto;}
.writePwd .pwdBox .pwdBtns { display:flex; justify-content:center; align-items:center; gap:5px; margin-top:20px; }

/* ================================== 반응형 ================================== */
@media all and (max-width: 1024px) {		
}



/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// paging  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.paging {margin-top:30px; display:flex; justify-content:center; align-items:center; gap:3px; }
.paging a { width:44px; height:44px; border:1px solid #f2f2f2; color:#666; font-size:1.4rem; line-height:44px; text-align:center; border-radius:3px;}
.paging a:hover {background:#efefef; border-color:#ccc; }
.paging a.current { color:#fff; border-color:var(--main); color:var(--text-main); }
.paging button  { display:block; border-radius:3px; width:44px; height:44px; aspect-ratio:1/1 !important; border:1px solid #ccc; text-indent:-9999px; background:url(images/ico_paging.png) no-repeat; background-size:500%; cursor:pointer; }
.paging button.pg_first.disable {background-position:0 50%; cursor:default;}
.paging button.pg_prev.disable {background-position:25% 50%; cursor:default;}
.paging button.pg_next.disable {background-position:50% 50%; cursor:default;}
.paging button.pg_last.disable {background-position:75% 50%; cursor:default;}
.paging button.pg_first {background-position:0 0;}
.paging button.pg_prev {background-position:25% 0;}
.paging button.pg_next {background-position:50% 0;}
.paging button.pg_last {background-position:75% 0;}
.paging button.disable {cursor:default;}

@media all and (max-width:768px){
	.paging { margin-top:20px; gap:2px; }
	.paging a,
	.paging button {width:30px; height:30px; line-height:34px; }
}

@media all and (max-width:480px){
	.paging {flex-wrap:wrap;}
	.paging button {width:24px; height:24px; line-height:26px; }
	.paging a { font-size:1.3rem; width:auto; min-width:22px; padding:0 3px; height:24px; line-height:24px; }
}


/* -----------------------------------------------------------------------------------------------------
///////////////////////////////////////////// 자격증 및 수상이력  //////////////////////////////////////
------------------------------------------------------------------------------------------------------*/
.picLayerWrap { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:9999; display:flex; justify-content:center; align-items:center; }
.picLayerWrap .layerTitle { font-size:2.4rem; color:var(--text-black); font-weight:300; margin-bottom:2.0rem; } 

.picLayerWrap .picLayerBox { max-width:960px; width:90%; background:#fff; padding:25px; border-radius:8px; position:relative; min-height:50vh; max-height:85vh; overflow:hidden; padding-bottom:100px;}
.picLayerWrap .picLayerBox .layerCloseBtn { background:none; border:none; font-size:26px; position:absolute; right:15px; top:10px; cursor:pointer; }
.picLayerWrap .picLayerBox .uploadUI { padding:20px 15px; text-align:center; cursor:pointer; color:var(--text-grey); background:#efefef; border:2px solid #efefef; transition: all 0.3s; border-radius:6px; }
.picLayerWrap .picLayerBox .uploadUI:hover { border-color:var(--blue); color:var(--text-blue); background:#fff; }

.picLayerWrap .picLayerBox .picList { margin-top:30px; }
.picLayerWrap .picLayerBox .picList li { display:flex; justify-content:space-between; align-items:center;  border-top:1px solid #999; padding:15px 0; gap:10px; }
.picLayerWrap .picLayerBox .picList li img { width:80px; height:80px; object-fit:cover; cursor:pointer; }
.picList li input.titleInput { flex:1; padding:0 8px; border:1px solid #efefef; border-radius:4px; height:44px; line-height:44px; }
.picLayerWrap .picLayerBox .delBtn { cursor:pointer; color:#777; font-size:14px; border:1px solid #ccc; border-radius:4px; height:44px; line-height:44px; width:50px; text-align:center; flex-shrink:0;  }
.picLayerWrap .picLayerBox .delBtn:hover { color:#000; }
.picLayerWrap .picbtnWrap { display:flex; justify-content:center; position:absolute; bottom:0; left:0; width:100%; background:#fff; padding:20px; }
.picLayerWrap .picLayerBox .picScrollArea { max-height:calc(85vh - 220px); overflow-y:auto; padding-right:5px; }
.imgPreviewLayer { position:fixed;  top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); display:flex; justify-content:center; align-items:center; z-index:100000; }
.imgPreviewBox img { max-width:90%; max-height:90%; border-radius:8px; box-shadow:0 4px 15px rgba(0,0,0,0.4); background:#fff; }

@media all and (max-width:1024px){
	.picLayerWrap .picLayerBox .uploadUI:hover { border-color:#efefef; color:var(--text-grey); background:#efefef; }
}	

@media all and (max-width:768px){
  .picLayerWrap .picLayerBox { max-width:90%; padding:20px; max-height:80vh; padding-bottom:90px; }
  .picLayerWrap .layerTitle { font-size:2.2rem; margin-bottom:1.6rem; }
  .picLayerWrap .picLayerBox .uploadUI { padding:18px 12px; font-size:1.5rem; }
  .picLayerWrap .picLayerBox .picScrollArea { max-height:calc(80vh - 200px); }
  .picLayerWrap .picLayerBox .picList li { padding:12px 0; }
  .picLayerWrap .picLayerBox .picList li img { width:70px; height:70px; }
  .picLayerWrap .picLayerBox .delBtn { width:46px; height:40px; line-height:40px; font-size:13px; }
  .picList li input.titleInput { height:40px; line-height:40px; font-size:1.4rem; }
  .picLayerWrap .picbtnWrap { padding:16px; }
}

@media all and (max-width:480px){
  .picLayerWrap .picLayerBox { width:100%; padding:16px; padding-bottom:80px; height:90vh; }
  .picLayerWrap .layerTitle { font-size:1.9rem; margin-bottom:1.4rem; }
  .picLayerWrap .picLayerBox .uploadUI { padding:14px 10px; font-size:1.4rem; }
  .picLayerWrap .picLayerBox .picScrollArea { max-height:calc(78vh - 180px); }
  .picLayerWrap .picLayerBox .picList li { flex-direction:column; align-items:flex-start; gap:12px; padding:12px 0; }
  .picLayerWrap .picLayerBox .picList li img { width:70px; height:70px; }
  .picList li input.titleInput { width:100%; height:38px; line-height:38px; font-size:1.4rem; }
  .picLayerWrap .picLayerBox .delBtn { width:100%; height:38px; line-height:38px; text-align:center; font-size:13px; }
  .picLayerWrap .picbtnWrap { padding:14px; }
  .imgPreviewBox img { max-width:95%; max-height:85%; }
}













/* -----------------------------------------------------------------------------------------------
///////////////////////////////////////////// 전국지점 레이아웃 추가 (메인페이지 스타일 복제) //////////////////////////////////////
--------------------------------------------------------------------------------------------------*/
.section07 { margin-bottom:100px; }
.branchSection { text-align:center; }
.branchTabs { display:flex; height:60px; border-radius:30px; border:1px solid var(--main); width:100%; justify-content:space-around; margin-bottom:40px;}
.branchTabs li { flex-grow:1; }
.branchTabs li a { height:58px; line-height:58px; display:flex; width:100%; font-size:1.8rem; font-weight:500; color:var(--text-dkgrey); background:#fff; transition:all 0.3s; 
	border-radius:30px; justify-content:center; align-items:center; gap:10px; }
.branchTabs li a span { margin-bottom:-2px; }
.branchTabs li a.current { background:var(--gra-main); color:#fff;  transition:all 0.3s; }
.branchTabs li a:after { content:''; width:8px; height:8px; border:2px solid #fff; border-width:0 2px 2px 0; display:block; rotate: 45deg; margin-top:-4px; }
.branchListWrap { display:flex; justify-content:space-between; gap:40px; margin-top:40px; }
.branchListWrap > div { flex-basis:calc(50% - 20px); flex-grow:1; max-width:1000px; margin:0 auto; }
.branchListWrap .branchCnts { display: none; }
.branchListWrap .branchCnts.active { display:block; }

.branchCnts .area { height:40px; line-height:40px; font-size:1.8rem; font-weight:500; border-radius:10px 10px 0 0; text-align: left; padding: 0 15px; }
.branchCnts + .branchCnts { margin-top:10px; }

.listLeft .branchCnts .area { background:#f4e5ed; color:var(--text-pink); }
.listRight .branchCnts .area { background:#f1ebf5; color:var(--text-main); }