@charset "UTF-8";
/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
/*
	sass 에서 사용되는 변수 및 함수 모음
*/
/*
	예) background-image:$img-file-url;
*/
/*
	사용방법
		1. margin 생성시
			예) margin-top:6px;, margin-left:1px;
				@include margin-padding-one-by-one('margin', '6px','','','1px');
		2. padding 생성시
			예) padding-top:6px;, padding-left:1px;
				@include margin-padding-one-by-one('padding', '6px','','','1px');
*/
/*
	사용방법
		예) width:30px;, height:10px;
			@include width-height('30px','10px');
*/
/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl의 구조를 잡기위한 sass
*/
.w_wo_100px {
  width: calc(100% - 100px);
}

.w_wo_200px {
  width: calc(100% - 200px);
}

.w_wo_300px {
  width: calc(100% - 300px);
}

.w_wo_350px {
  width: calc(100% - 350px);
}

.tpl_div {
  clear: both;
  overflow: hidden;
}

.tpl_fl_parent {
  position: absolute;
  left: -160px;
  top: 0px;
  width: 160px;
  height: 200px;
}

.tpl_fl {
  position: fixed;
  margin-left: 0px;
  width: 150px;
  height: 200px;
  border-color: #ff0000;
}

.tpl_fr_parent {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 160px;
  height: 200px;
}

.tpl_fr {
  position: fixed;
  margin-left: 10px;
  width: 150px;
  height: 200px;
  border-color: #0000ff;
}

.title_mid {
  font-size: 1.2rem;
  padding-bottom: 1em;
  color: #555;
  font-weight: bold;
}

.block_basic {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
  padding-left: 2em;
  padding-right: 2em;
  border-top: 7px solid #ddd;
}
.block_basic_wo_xpd {
  padding-top: 1em;
  padding-bottom: 1.5em;
  border-top: 6px solid #ddd;
}

.bttm_btn_box {
  position: fixed;
  left: 0px;
  bottom: 0px;
  width: 100%;
  height: 50px;
  z-index: 99;
}

.modal-open {
  overflow: hidden;
  height: 100%;
}

.modal {
  padding-right: 0px !important;
}
.modal td {
  word-wrap: break-word;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl li grid
*/
@media (max-width: 575.98px) {
  .b_grid {
    padding-left: 0px;
    padding-right: 0px;
  }
}
.b_grid li {
  float: left;
  /*		min-height:1rem;*/
  line-height: 2.5rem;
  word-break: nowrap;
  border-bottom: 1px dotted #dfdfdf;
}

.li_w_33p li {
  width: 33%;
}

.li_w_50p li {
  width: 50%;
}

.li_w_160 li {
  width: 160px;
}

.li_w_180 li {
  width: 180px;
}

.li_w_200 li {
  width: 200px;
}

.li_w_320 li {
  width: 320px;
}

.li_clear_bullet {
  list-style: none;
  padding-inline-start: 0px;
}

.li_remove_bstrp4_pd {
  padding-inline-start: 10px;
  display: inline-block;
}

.li_1_col_box {
  padding: 0px;
  padding-left: 1rem;
}
.li_1_col_box li {
  padding: 0px;
  width: 100%;
}

.li_2_col li:nth-child(n+3) {
  border-top: 1px solid #bbb;
}
.li_2_col li:nth-child(odd) {
  width: 110px;
}
.li_2_col li:nth-child(even) {
  width: calc(100% - 110px);
}

.li_2_col_half li {
  width: 50%;
  height: 60px;
}

.li_3_col li {
  width: 33%;
}

.li_4_col li {
  width: 25%;
}
.li_4_col li:nth-child(n+5) {
  border-top: 1px solid #eee;
}

.pop_up_btn li {
  min-width: 90px;
  width: 31.3%;
  list-style-position: inside;
  letter-spacing: -0.13rem;
  word-break: nowrap;
  white-space: nowrap;
  overflow: hidden;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 버튼
*/
/*	bootstarp 이 mobile 에서 사용성 개선을 위해
	클릭했던 버튼이 비활성화 되더라도 마지막에 클릭했던
	버튼을 표시하도록 highlight class 를 적용하는것을 방지함
*/
.btn_min_h {
  height: 20px;
  line-height: 17px;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.btn-light:focus {
  outline: none !important;
}

.btn-light:hover {
  color: #212529 !important;
  background-color: #f8f9fa !important;
  border-color: #f8f9fa !important;
  outline: none;
}

.btn-light:active:hover,
.btn-light.active:hover,
.open > .dropdown-toggle.btn-light:hover,
.btn-light:active:focus,
.btn-light.active:focus,
.open > .dropdown-toggle.btn-light:focus,
.btn-light:active.focus,
.btn-light.active.focus,
.open > .dropdown-toggle.btn-light.focus {
  background-color: #93a4b3 !important;
  border-color: #7e90a1 !important;
}

/*	bootstarp 5
	버튼 active, hover style
*/
.btn-check:active + .btn-outline-light_2,
.btn-check:checked + .btn-outline-light_2,
.btn-outline-light_2.active,
.btn-outline-light_2.dropdown-toggle.show,
.btn-outline-light_2:active {
  background-color: #93a4b3;
  border-color: #7e90a1;
  color: #fff;
}

.btn-outline-light_2 {
  color: #000;
  background-color: #f8f9fa;
  border-color: #f8f9fa;
}

.btn-check:active + .btn-outline-gray,
.btn-check:checked + .btn-outline-gray,
.btn-outline-gray.active,
.btn-outline-gray.dropdown-toggle.show,
.btn-outline-gray:active {
  background-color: #787878;
  border-color: #787878;
  color: #fff;
}

.btn-outline-gray {
  color: #666666;
  background-color: #ececec;
  border-color: #ececec;
}

.btn-check:active + .btn-outline-green,
.btn-check:checked + .btn-outline-green,
.btn-outline-green.active,
.btn-outline-green.dropdown-toggle.show,
.btn-outline-green:active {
  background-color: #00c767;
  border-color: #00c767;
  color: #fff;
}

.btn-outline-green {
  color: #666666;
  background-color: #ececec;
  border-color: #ececec;
}

.btn-check:active + .btn-outline-kyg,
.btn-check:checked + .btn-outline-kyg,
.btn-outline-kyg.active,
.btn-outline-kyg.dropdown-toggle.show,
.btn-outline-kyg:active {
  border-color: #135ce2 !important;
  background-color: #135ce2 !important;
  color: #fff !important;
}

.btn-outline-kyg {
  border-width: medium;
  border-color: #135ce2 !important;
  color: #135ce2 !important;
  background-color: #fff;
}

.btn-check:active + .btn-outline-pre,
.btn-check:checked + .btn-outline-pre,
.btn-outline-pre.active,
.btn-outline-pre.dropdown-toggle.show,
.btn-outline-pre:active {
  border-color: #16b3ce !important;
  background-color: #16b3ce !important;
  color: #fff !important;
}

.btn-outline-pre {
  border-width: medium;
  border-color: #16b3ce !important;
  color: #16b3ce !important;
  background-color: #fff;
}

.btn-check:active + .btn-outline-gng,
.btn-check:checked + .btn-outline-gng,
.btn-outline-gng.active,
.btn-outline-gng.dropdown-toggle.show,
.btn-outline-gng:active {
  border-color: #6957d3 !important;
  background-color: #6957d3 !important;
  color: #fff !important;
}

.btn-outline-gng {
  border-width: medium;
  border-color: #6957d3 !important;
  color: #6957d3 !important;
  background-color: #fff;
}

.btn-check:active + .btn-outline-bun,
.btn-check:checked + .btn-outline-bun,
.btn-outline-bun.active,
.btn-outline-bun.dropdown-toggle.show,
.btn-outline-bun:active {
  border-color: #4495c3 !important;
  background-color: #4495c3 !important;
  color: #fff !important;
}

.btn-outline-bun {
  border-width: medium;
  border-color: #4495c3 !important;
  color: #4495c3 !important;
  background-color: #fff;
}

.btn-check:active + .btn-outline-rp,
.btn-check:checked + .btn-outline-rp,
.btn-outline-rp.active,
.btn-outline-rp.dropdown-toggle.show,
.btn-outline-rp:active {
  border-color: #0ab584 !important;
  background-color: #0ab584 !important;
  color: #fff !important;
}

.btn-outline-rp {
  border-width: medium;
  border-color: #0ab584 !important;
  color: #0ab584 !important;
  background-color: #fff;
}

.btn-check:active + .btn-clear-sty,
.btn-check:checked + .btn-clear-sty,
.btn-clear-sty.active,
.btn-clear-sty.dropdown-toggle.show,
.btn-clear-sty:active {
  border: 0;
  color: #000 !important;
  background-color: #fff !important;
}

.btn-clear-sty {
  border: 0;
  color: #000 !important;
  background-color: #fff !important;
}

.width_dft_btn {
  width: 7rem;
}

.btn-light:not(:disabled):not(.disabled).active,
.btn-light:hover,
.btn-light:visited,
.btn-light:focus {
  background-color: #93a4b3;
  border-color: #7e90a1;
  color: #fff;
}

.btn {
  padding: 0.375rem 0rem;
}

.btn_min_w {
  min-width: 50px;
}

@media (max-width: 575.98px) {
  .btn {
    width: 23.5%;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .btn {
    width: 23.5%;
  }
}
@media (min-width: 768px) {
  .btn {
    width: 110px;
  }
}
button {
  font-size: 1rem;
  color: #222;
  background-color: #fff;
  cursor: pointer;
}

button:focus, input:focus {
  outline: 0;
}

.fab_container {
  z-index: 999;
  position: fixed;
  bottom: 90px;
  right: 30px;
  width: 40px;
}
.fab_container .fab_btn {
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 25px;
  text-align: center;
}

.n_icon_btn {
  float: left;
  width: 50px;
  height: 50px;
  font-size: 22px;
  line-height: 50px;
  text-align: center;
}

.btn_testtest {
  padding: 5px;
  border: 0px;
  border-radius: 3px;
  background-color: rgba(7, 165, 69, 0.15);
}

.scrollmenu {
  overflow: auto;
  white-space: nowrap;
}
@media (min-width: 576px) {
  .scrollmenu {
    top: 300px;
  }
}
@media (min-width: 768px) {
  .scrollmenu {
    top: 500px;
  }
}
.scrollmenu a {
  display: inline-block;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}
.scrollmenu::-webkit-scrollbar {
  display: none;
}

.btn_circle {
  margin-right: 0px;
  padding-left: 12px;
  padding-right: 12px;
  background-color: transparent;
  border: 0px;
  text-align: center;
  display: inline-block;
}
.btn_circle .circle {
  margin: 5px auto;
  padding-top: 8px;
  width: 46px;
  height: 46px;
  border-radius: 30px;
  border: 2px solid #40d88b;
  text-align: center;
  overflow: hidden;
}
.btn_circle .circle .far, .btn_circle .circle .fas {
  margin-top: 2px;
  font-size: 22px;
  width: 30px;
  height: 30px;
}

.bn_div {
  padding: 1.5em;
  width: 100%;
  text-align: center;
}

.bn {
  border: 1px solid #cdd1d4;
  border-radius: 4px;
  line-height: 1.2;
  color: #5c6872;
  margin: 0;
  padding: 0.6em 2em 0.5em;
  text-align: center;
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  vertical-align: middle;
  padding: 0.2em 2em 0.2em;
}

.bn2 {
  border: 1px solid #cdd1d4;
  border-radius: 4px;
  line-height: 1.2;
  color: #5c6872;
  margin: 0;
  padding: 0.6em 2em 0.5em;
  text-align: center;
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  vertical-align: middle;
  width: 8rem;
  height: 5rem;
  padding: 0.5em 0.2em 0.5em;
}

.btnDefault, .btnDefault:visited, a.btnDefault, a.btnDefault:visited {
  border: 1px solid #cdd1d4;
}

.bttm_btn {
  float: left;
  position: relative;
  border: 0px;
  filter: saturate(0.8);
  width: 50%;
  height: 50px;
  background-color: #fd8602;
  color: #fff;
}

.bttm_btn_box .dropup .dropdown-toggle::after {
  border-top: 0px;
  border-right: 0px;
  border-bottom: 0px;
  border-left: 0px;
}

.vertical_bdr_50:after {
  position: absolute;
  right: 0px;
  top: 50%;
  content: "";
  transform: translateY(-50%);
  width: 1px;
  height: 50%;
  background-color: #fff;
}

div[data-toggle=buttons] input[type=checkbox], div[data-toggle=buttons] input[type=radio] {
  width: 0px;
  display: none;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 테이블
*/
td, th {
  font-size: 1rem;
  color: #222;
  padding: 0.4em;
  padding-bottom: 0.5em;
  line-height: 1.3em;
  height: 2.5rem;
}

th {
  background-color: #F5F6F7;
}

.tbl {
  text-align: center;
}
.tbl td, .tbl th {
  border: 1px solid #ddd;
}
.tbl th {
  font-weight: normal;
}

.tbl_w_b td, .tbl_w_b th {
  border: 1px solid #ddd;
}

.test_ft_size td, .test_ft_size th {
  font-size: 0.5rem !important;
}

.tbl_2_wo_w, .tbl_2 {
  text-align: left;
}
.tbl_2_wo_w td, .tbl_2 td, .tbl_2_wo_w th, .tbl_2 th {
  border: 0px;
}
.tbl_2_wo_w th, .tbl_2 th {
  font-weight: normal;
  background-color: #fff;
  color: #777;
}

.tbl_2 th {
  width: 8rem;
}

.th_wide th {
  width: 12rem;
}

.tbl_wo {
  text-align: center;
}
.tbl_wo td, .tbl_wo th {
  height: 2rem;
  border: 0px solid #eee;
  padding: 0em;
}
.tbl_wo tr {
  border: 0px solid #eee;
}

.tbl_td_th_h16 td, .tbl_td_th_h16 th {
  height: 1.6rem;
}

.tr_btw td {
  height: 0.5rem;
  line-height: 0.5rem;
  padding: 0rem;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
}

.tbl_tr_n_b tr {
  border-bottom: 0px solid #ddd;
}

.tr_bdr tr {
  border-bottom: 1px dotted #dfdfdf;
}

.tbl_p_0 td, .tbl_p_0 th {
  padding: 0px;
  padding-top: 0px;
  padding-left: 0px;
  padding-bottom: 0px;
  padding-right: 0px;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 도량형
*/
.u_brkt_f:before {
  content: "(";
  color: #d3d3d3;
}

.u_brkt:before {
  content: "(";
  color: #d3d3d3;
}

.u_brkt:after {
  content: ")";
  color: #d3d3d3;
}

.u_sq_brkt:before {
  margin-right: 1px;
  content: "[";
  color: #c0c0c0;
}

.u_sq_brkt:after {
  margin-left: 1px;
  content: "]";
  color: #c0c0c0;
}

.u_slsh:before {
  margin-right: 1px;
  content: "/";
  color: #c0c0c0;
}

.u_abs {
  position: relative;
}

.u_abs:after {
  position: absolute;
  top: 2px;
  right: -14px;
}

.u_m:after {
  margin-left: 1px;
  content: "m";
  color: #777;
}

.u_km:after {
  margin-left: 1px;
  content: "㎞";
  color: #777;
}

.u_m2:after {
  margin-left: 1px;
  content: "㎡";
  color: #777;
}

.u_pyung:after {
  margin-left: 1px;
  content: "평";
  color: #777;
}

.u_won:after {
  margin-left: 1px;
  content: "원";
  /*@include color_black_3;*/
}

.u_year:after {
  margin-left: 1px;
  content: "년";
  color: #777;
}

.u_day:after {
  margin-left: 1px;
  content: "일";
  color: #777;
}

.u_dae:after {
  margin-left: 1px;
  content: "대";
  color: #777;
}

.u_pcnt:after {
  margin-left: 1px;
  content: "%";
  color: #777;
}

.u_myung:after {
  margin-left: 1px;
  content: "명";
  color: #777;
}

.u_jum:after {
  margin-left: 1px;
  content: "점";
  color: #777;
}

.u_gae:after {
  margin-left: 1px;
  content: "개";
  color: #777;
}

.u_gun:after {
  margin-left: 1px;
  content: "건";
  color: #777;
}

.u_hhld:after {
  margin-left: 1px;
  content: "세대";
  color: #777;
}

.u_dong:after {
  margin-left: 1px;
  content: "개동";
  color: #777;
}

.u_floor:after {
  margin-left: 1px;
  content: "층";
  color: #777;
}

.u_times:after {
  margin-left: 1px;
  content: "회";
  color: #777;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
* {
  font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", "AppleSDGothcNeo", "AppleGothic";
}

.df_font_awesome_icon_size {
  font-size: 22px;
}

.df_font_size_big {
  font-size: 1.6rem;
}

.df_font_size_biger {
  font-size: 1.4rem;
}

.df_middle_font_size {
  font-size: 1.2rem;
}

.df_font_size_small {
  font-size: 0.8rem;
}

.df_font_size_half {
  font-size: 0.5rem;
}

.default_font_size {
  font-size: 1rem;
}

.default_title_font_size {
  font-size: 1.2rem;
}

.font_size_0_3 {
  font-size: 0.3rem;
}

.font_size_0_5 {
  font-size: 0.5rem;
}

.font_size_0_8 {
  font-size: 0.8rem;
}

.font_size_0_9 {
  font-size: 0.9rem;
}

.font_size_1_0 {
  font-size: 1rem;
}

.font_size_1_1 {
  font-size: 1.1rem;
}

.font_size_1_2 {
  font-size: 1.2rem;
}

.font_size_1_3 {
  font-size: 1.3rem;
}

.font_size_1_5 {
  font-size: 1.5rem;
}

.font_size_1_6 {
  font-size: 1.6rem;
}

.font_size_2_0 {
  font-size: 2rem;
}

.font_size_2_2 {
  font-size: 2.2rem;
}

.font_size_2_4 {
  font-size: 2.4rem;
}

.font_size_12px {
  font-size: 12px;
}

.font_size_11px {
  font-size: 11px;
}

@font-face {
  font-family: "nanum-barun-gothic-regular";
  src: url("/third_party/Fonts/nanumbarungothicregular.eot");
  src: url("/third_party/Fonts/nanumbarungothicregular.eot?#iefix") format("embedded-opentype"), url("/third_party/Fonts/nanumbarungothicregular.woff2") format("woff2"), url("/third_party/Fonts/nanumbarungothicregular.woff") format("woff"), url("/third_party/Fonts/nanumbarungothicregular.ttf") format("truetype"), url("/third_party/Fonts/nanumbarungothicregular.svg#nanum-barun-gothic-regular") format("svg");
  font-weight: normal;
  font-style: normal;
}
.ft_nbr {
  font-family: "nanum-barun-gothic-regular";
}

.ft_ngr {
  font-family: "Nanum Gothic";
}

.ft_ntsans {
  font-family: "Noto Sans KR", sans-serif;
}

.ft_color_light {
  color: #777;
}

.ft_color_lighter {
  color: #a3a3a3;
}

.ft_color_lightmost {
  color: #d6d4d4;
}

.ft_color_orange_light {
  color: #ff7858;
}

.default_font_color {
  color: #222;
}

.txt_shadow_1 {
  text-shadow: 1px 1px 1px #a9a9a9;
}

.txt_shadow_2 {
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
}

.drop_sdw_1 {
  box-shadow: 0px 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.1);
}

.currentColor {
  color: currentColor;
}
.currentColor :before {
  color: currentColor;
}
.currentColor :after {
  color: currentColor;
}

.color_blue {
  color: #419aff;
}

.color_blue_2 {
  color: #014980;
}

.color_blue_5 {
  color: #2e73f2;
}

.color_gray_0_6 {
  color: #e2e2e2;
}

.color_gray_1 {
  color: #dfdfdf;
}

.color_gray_2 {
  color: #d3d3d3;
}

.color_gray_3 {
  color: #c0c0c0;
}

.color_gray_4 {
  color: #bbbbbb;
}

.color_gray_5 {
  color: #a9a9a9;
}

.color_gray_5_1 {
  color: #a6a6a6;
}

.color_gray_6 {
  color: #808080;
}

.color_gray_7 {
  color: #777777;
}

.color_gray_7_6 {
  color: #7e7e7e;
}

.color_gray_8 {
  color: #818181;
}

.color_gray_9 {
  color: #424242;
}

.color_black {
  color: #222;
}

.color_black_2 {
  color: #555;
}

.color_black_3 {
  color: #777;
}

.color_black_strong {
  color: #333;
}

.color_black_abs {
  color: #000;
}

.color_green_light {
  color: #dff3e7;
}

.color_green {
  color: #20c063;
}

.color_green_2 {
  color: #00c767;
}

.color_green_3 {
  color: #0bde8b;
}

.color_green_4 {
  color: #51b851;
}

.color_green_5 {
  color: #87d300;
}

.color_green_6 {
  color: #00c767;
}

.color_green_strong {
  color: #17916d;
}

.color_orange {
  color: #f19500;
}

.color_orange_0_1 {
  color: #ffd997;
}

.color_orange_2 {
  color: #f1970b;
}

.color_orange_strong {
  color: #F74A27;
}

.color_purple_light {
  color: #ec1b77;
}

.color_red {
  color: #ca001d;
}

.color_red_0 {
  color: #ff0000;
}

.color_red_grim {
  color: #ce5757;
}

.color_white {
  color: #fff;
}

.bgcolor_red_light {
  background-color: #db4437;
}

.bgcolor_white {
  background-color: #fff;
}

.bgcolor_gray_0_5 {
  background-color: #fafafa;
}

.bgcolor_gray_0_5_1 {
  background-color: #f2f2f2;
}

.bgcolor_gray_0_5_5 {
  background-color: #f9f9f9;
}

.bgcolor_gray_1 {
  background-color: #dfdfdf;
}

.bg_dark_0_5 {
  background-color: rgba(0, 0, 0, 0.4);
}

.bg_dark_0_2 {
  background-color: rgba(0, 0, 0, 0.2);
}

.bg_dark_light {
  background-color: #f8f9fa;
}

.bg_dark {
  background-color: #999999;
}

.bgcolor_orange_light {
  background-color: #ff7858;
}

.bgcolor_orange {
  background-color: #f19500;
}

.bgcolor_orange_0_1 {
  background-color: #ffd997;
}

.bgcolor_orange_1 {
  background-color: #fd8602;
}

.bgcolor_orange_2 {
  background-color: #f0a94d;
}

.bgcolor_orange_strong {
  background-color: #F74A27;
}

.bgcolor_blue_01 {
  background-color: #cfdff4;
}

.bgcolor_blue_02 {
  background-color: #eef4f9;
}

.bgcolor_blue_04 {
  background-color: #55a4ff;
}

.bgcolor_blue_10 {
  background-color: #00c7c0;
}

.bg_green_light {
  background-color: #dff3e7;
}

.bg_green {
  background-color: #20c063;
}

.bg_green_0_1 {
  background-color: #278c5c;
}

.bg_green_2 {
  background-color: #00c767;
}

.bg_green_5 {
  background-color: #87d300;
}

.bg_green_5 {
  background-color: #87d300;
}

.bg_green_7 {
  background-color: #e0f0e8;
}

.bg_green_strong {
  background-color: #17916d;
}

.bg_tt_bar {
  background-color: #00c767;
}

.bg_yellow_1 {
  background-color: #fef0c6;
}

.txt_top {
  vertical-align: top;
}

.txt_left {
  text-align: left;
}

.txt_center {
  text-align: center;
}

.float_lt {
  float: left;
}

.float_rt {
  float: right;
}

.cl_bth {
  clear: both;
}

.h_10_px {
  height: 10px !important;
}

.h_13_px {
  height: 13px !important;
}

.h_25_px {
  height: 25px !important;
}

.line_ht_11_px {
  line-height: 11px;
}

.line_ht_11 {
  line-height: 1.1rem;
}

.line_ht_12 {
  line-height: 1.2rem;
}

.line_ht_13 {
  line-height: 1.3rem;
}

.line_ht_14 {
  line-height: 1.4rem;
}

.line_ht_16 {
  line-height: 1.6rem;
}

.line_ht_18 {
  line-height: 1.8rem;
}

.line_ht_2 {
  line-height: 2rem;
}

.line_ht_3 {
  line-height: 3rem;
}

.pd_no {
  padding: 0rem;
}

.pd_all_2_0 {
  padding: 2rem;
}

.pd_btn_sm {
  padding: 0.3rem 0.5rem 0.3rem;
}

.px_2_0 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.px_15px {
  padding-left: 15px;
  padding-right: 15px;
}

.mg_left_sm {
  margin-left: 0.6rem;
}

.mg_top_sm {
  margin-top: 1rem;
}

.mg_auto {
  margin: auto auto;
}

.ft_bold {
  font-weight: bold;
}

.ft_normal {
  font-weight: normal;
}

.lttr_sp {
  letter-spacing: -1px;
}

.lttr_sp_half {
  letter-spacing: -0.5px;
}

.lttr_sp_r {
  letter-spacing: -0.13rem;
}

.bdr_no {
  border: 0px;
}

/*	-. block_basic 의 child element 에서 parent 와 같은 넓이의 border 표시할때 사용
	-. bootstrap 의 padding 을 무시하기위해 position:absolute; 를 사용하며, 해당 element 밖으로
	   child element 가 빠져나가지 않도록
	   block_basic 이 적용된 element 에 bootstrap class 인 .position-relative 이
	   적용되어야함.
*/
.bdr_b_def {
  border-bottom: 1px dotted #dfdfdf;
}

.bdr_top {
  position: absolute;
  left: 0px;
  border-top: 1px solid #ddd;
}

.bdr_bttm_solid {
  border-bottom: 1px solid #dfdfdf;
}

.bdr_bttm_solid_2 {
  border-bottom: 2px solid #dfdfdf;
}

.bdr_bttm_dotted {
  margin: 10px 0px;
  border-bottom: 1px dotted #dfdfdf;
}

.bdr_bttm_g_solid {
  border: 0px;
  border-bottom: 1px solid #0bde8b;
}

.bdr_top_solid {
  border-top: 1px solid #ddd;
}

.bdr_top_solid_6 {
  border-top: 6px solid #ddd;
}

.bdr_top_dotted {
  border-top: 1px dotted #ddd;
}

.bdr_top_g_solid {
  border: 0px;
  border-top: 1px solid #0bde8b;
}

.bdr_bttm_g_solid {
  border: 0px;
  border-bottom: 1px solid #0bde8b;
}

.bdr_bttm {
  border-bottom: 1px solid;
}

.bdr_w_2 {
  border-width: 2px;
}

.bdr_c_g_0_1 {
  border-color: #278c5c;
}

.bdr_c_g_3_1 {
  border-color: #40b767;
}

.bdr_c_g_4 {
  border-color: #51b851;
}

.df_btn {
  border: 1px solid #cdd1d4;
  border-radius: 4px;
  line-height: 1.2;
  color: #5c6872;
  margin: 0;
  padding: 0.6em 2em 0.5em;
  text-align: center;
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  vertical-align: middle;
}

.df_bttm_underline {
  border-bottom: 1px solid #dfdfdf;
}

.df_svg {
  margin-bottom: 10px;
  width: 100%;
  height: 300px;
}

.pt_2_px {
  padding-top: 2px;
}

.py_1_px {
  padding-top: 1px;
  padding-bottom: 1px;
}

.mr_1_per {
  margin-right: 1%;
}

.w_min_10 {
  min-width: 10px;
}

.w_min_20 {
  min-width: 20px;
}

.w_min_80 {
  min-width: 80px;
}

.w_50_px {
  width: 50px;
}

.w_20 {
  width: 20%;
}

.w_22 {
  width: 22%;
}

.w_23 {
  width: 23%;
}

.w_24 {
  width: 24%;
}

.w_30 {
  width: 30%;
}

.w_31 {
  width: 31%;
}

.w_32 {
  width: 32%;
}

.w_33 {
  width: 33%;
}

.w_34 {
  width: 34%;
}

.w_38 {
  width: 38%;
}

.w_48 {
  width: 48%;
}

.w_49 {
  width: 49%;
}

.w_58 {
  width: 58%;
}

.w_64 {
  width: 64%;
}

.w_90 {
  width: 90%;
}

.w_100 {
  width: 100%;
}

.z_top {
  z-index: 100;
}

.opacity_1 {
  opacity: 0.1;
}

.opacity_2 {
  opacity: 0.2;
}

.opacity_3 {
  opacity: 0.3;
}

.opacity_4 {
  opacity: 0.4;
}

.opacity_5 {
  opacity: 0.5;
}

.left_0 {
  left: 0px;
}

.left_3 {
  left: 3px;
}

.left_5 {
  left: 5px;
}

.left_10 {
  left: 10px;
}

.left_15 {
  left: 15px;
}

.right_0 {
  right: 0px;
}

.right_5 {
  right: 5px;
}

.right_10 {
  right: 10px;
}

.right_15 {
  right: 15px;
}

.bttm_0 {
  bottom: 0px;
}

.bttm_5 {
  bottom: 5px;
}

.bttm_10 {
  bottom: 10px;
}

.bttm_15 {
  bottom: 15px;
}

.top_0 {
  top: 0px;
}

.top_3 {
  top: 3px;
}

.top_5 {
  top: 5px;
}

.top_10 {
  top: 10px;
}

.top_15 {
  top: 15px;
}

.rotate_cw_45 {
  transform: rotate(45deg);
}

.rotate_ccw_45 {
  transform: rotate(-45deg);
}

.blinking {
  animation: blinkingText 1.2s infinite;
}

@keyframes blinkingText {
  0% {
    color: #d3d3d3;
  }
  49% {
    color: #d3d3d3;
  }
  60% {
    color: transparent;
  }
  99% {
    color: transparent;
  }
  100% {
    color: #d3d3d3;
  }
}
.container_mother {
  position: relative;
}

.center_child {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
}

.brk_wrd {
  -ms-word-break: break-all;
  -ms-word-wrap: break-all;
  -webkit-word-break: break-word;
  -webkit-word-wrap: break-word;
  word-break: break-word;
  word-wrap: break-word;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
}

.sep_line {
  display: flex;
  align-items: center;
  text-align: center;
}

.sep_line::before, .sep_line::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #dfdfdf;
}

.sep_line::before {
  margin-right: 0.5em;
}

.sep_line::after {
  margin-left: 0.5em;
}

.df_logo {
  background: #062D76;
  background: -webkit-linear-gradient(to top, #062D76 20%, #0070DA 55%);
  background: -moz-linear-gradient(to top, #062D76 20%, #0070DA 55%);
  background: linear-gradient(to top, #062D76 20%, #0070DA 55%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
  font-family: "Noto Sans KR", sans-serif;
  text-shadow: 1px 3px 6px rgba(110, 110, 110, 0.2);
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 기타
*/
input,
select {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.modal {
  z-index: 9999;
}

.pos_t_0 {
  top: 0px;
}

.pos_r_0 {
  right: 0px;
}

.pos_l_0 {
  left: 0px;
}

.pos_b_0 {
  bottom: 0px;
}

.clear_pd {
  padding: 0px;
}

.clear_pd_wo_lh {
  padding: 0px;
}

.child_clr_pd div {
  padding: 0px !important;
}

.clear_mg {
  margin: 0px;
}

.clear_lh {
  line-height: 0px;
}

.sm_fars {
  margin-right: 3px;
  width: 20px;
  text-align: center;
  vertical-align: middle;
}

.simple_txt {
  height: 90px;
  text-overflow: ellipsis;
  /* Needed to make it work */
  overflow: hidden;
  white-space: nowrap;
}

.simple_txt_04 {
  -webkit-line-clamp: 4; /* number of lines to show */
}

.simple_txt_05 {
  -webkit-line-clamp: 5; /* number of lines to show */
}

.simple_txt_06 {
  -webkit-line-clamp: 6; /* number of lines to show */
}

.simple_txt_07 {
  -webkit-line-clamp: 7; /* number of lines to show */
}

.simple_txt_08 {
  -webkit-line-clamp: 8; /* number of lines to show */
}

.simple_txt_09 {
  -webkit-line-clamp: 9; /* number of lines to show */
}

.simple_txt_10 {
  -webkit-line-clamp: 10; /* number of lines to show */
}

.b {
  font-weight: bold;
}

#progress_indicator {
  background-image: linear-gradient(rgba(255, 255, 255, 0), #fff, rgba(255, 255, 255, 0));
}

.no_more_data {
  font-size: 0.8rem;
}

.prgs_indict {
  z-index: 9999;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  display: table;
  text-align: center;
}
.prgs_indict span {
  display: table-cell;
  vertical-align: middle;
  color: #666;
  font-size: 16px;
  font-weight: bold;
}

.pg_prograss_indicator {
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 30px;
  position: fixed;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loan_slider::-webkit-slider-thumb {
  margin-top: -12px;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  cursor: pointer;
}

.loan_slider::-moz-range-thumb {
  margin-top: -12px;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  cursor: pointer;
}

.nav-pills > .active,
.nav-pills > li:hover {
  text-decoration: none;
  border-radius: 0px;
  border-bottom-width: 0.15rem;
  border-bottom-style: solid;
  border-bottom-color: #555;
  color: #555 !important;
  background-color: transparent !important;
  padding-bottom: 0.5rem;
}

.nav-pills > li {
  margin: 0px 10px 0px 10px;
  border-radius: 0px;
  color: #666;
}

.cursor_pointer {
  cursor: pointer;
}

@media (max-width: 991.98px) {
  .hide_on_desktop {
    display: none;
  }
}
.border-bottom-dotted {
  border-bottom: 1px dotted #dfdfdf;
}

.tel_ft_01 {
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  color: #d10116;
}

.ql-container {
  height: 250px !important;
}

.brd_ctn_lh {
  line-height: auto;
}
.brd_ctn_lh p {
  margin-bottom: 0;
}

.emt_ctn_1:empty:before {
  content: "-";
}

.submn_on {
  border-bottom: 2px solid #777 !important;
  background-color: #fff !important;
  color: #333;
  font-weight: bold;
}

.dark_set_mode {
  background-color: #222;
  color: #e6e6e6;
}

.text_align_right {
  text-align: right;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	구글광고가 로드되기전에 먼저 보여줄 임시 배경이미지
*/
.main_dummy_gg_ad {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% auto;
}

.dummy_gg_ad_size_200_200 {
  background-image: url(/images_root/A00/gg_ad/dummy_ad_img_200_200.jpg);
}

.main_dummy_gg_ad_250_250 {
  background-image: url(/images_root/A00/gg_ad/dummy_ad_img_250_250.jpg);
}

.main_dummy_gg_ad_970_90 {
  background-image: url(/images_root/A00/gg_ad/dummy_ad_img_970_90.jpg);
}

.main_dummy_gg_ad_970_250 {
  background-image: url(/images_root/A00/gg_ad/dummy_ad_img_970_250.jpg);
}

.main_dummy_gg_ad_336_280 {
  background-image: url(/images_root/A00/gg_ad/dummy_ad_img_336_280.jpg);
  background-size: 268px 224px;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
.d_tt_bar_shadow {
  transition: background-color 0.2s, height 0.2s, display 0.2s;
  position: fixed;
  z-index: 999;
  padding: 36px 10px 0px;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100px;
  text-align: right;
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00000000", endColorstr="#00000000",GradientType=0 ); /* IE6-9 */
}
.d_tt_bar_shadow .fas, .d_tt_bar_shadow .far {
  margin: 0px 8px;
  font-size: 22px;
  color: #fff;
  z-index: 999;
}
.d_tt_bar_shadow .d_tt_txt {
  transition: display 0.2s;
  padding-left: 5px;
  padding-bottom: 3px;
  width: calc(100% - 120px);
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.d_tt_bar_normal {
  z-index: 999;
  width: 100%;
  height: 5rem;
  background: #00c767;
  position: fixed;
  padding: 3px 10px 0px;
  top: 0px;
  left: 0px;
  text-align: right;
}
.d_tt_bar_normal .fas, .d_tt_bar_normal .far {
  margin: 0px 8px;
  font-size: 22px;
  color: #fff;
  z-index: 999;
}
.d_tt_bar_normal .d_tt_txt {
  transition: display 0.2s;
  padding-left: 5px;
  padding-bottom: 3px;
  width: calc(100% - 150px);
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dview_pic {
  display: flex;
  width: 100%;
  height: 330px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

@media (max-width: 575.98px) {
  .dview_pic {
    height: 230px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .dview_pic {
    height: 306px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .dview_pic {
    height: 396px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .dview_pic {
    height: 480px;
  }
}
@media (min-width: 1200px) {
  .dview_pic {
    height: 480px;
  }
}
.quick_bar {
  margin: 0px;
  left: 0px;
  z-index: 998;
  height: 34px;
  overflow: hidden;
  border-bottom: 1px solid #ccc;
  background-color: #e4e4e4;
}
.quick_bar .qb_active {
  background-color: #fff;
}
.quick_bar li {
  background-color: #e4e4e4;
  border-left: 1px solid #ccc;
}

.loan_box {
  padding: 20px 0px;
}
.loan_box .min_loan_range_bg {
  width: 100%;
  height: 7px;
  border-radius: 5px;
}

.clear_border {
  border: 0px;
  padding-bottom: 1rem;
}

.detail_template_contents {
  padding: 10px;
  padding-bottom: 3rem;
}
.detail_template_contents table {
  margin-bottom: 3rem;
  width: 100%;
}

@media (max-width: 490px) {
  .modal-body {
    padding: 0;
  }
  .detail_template_contents {
    padding: 0;
  }
}
.list_mother {
  clear: both;
}
.list_mother span.fc {
  float: left;
  width: 48%;
  line-height: 2rem;
}
.list_mother span.sc {
  display: inline-block;
  width: 6.3rem;
  color: #777;
}
.list_mother span.tc {
  display: inline-block;
  padding-right: 1.5rem;
}

.dvw_map_btn {
  right: 5%;
  top: 12px;
  z-index: 998;
}

.jb_cls {
  color: #f19500;
  font-weight: bold;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	물건목록 style
*/
.dtl_srch_opt div + div::before {
  content: ", ";
  color: #c0c0c0;
}
.dtl_srch_opt .dtl_opt_bx .sel_txt span[name*=_from]:after {
  content: "~";
}
.dtl_srch_opt .dtl_opt_bx .sel_txt span[name*=_to]:before {
  content: "~";
}
.dtl_srch_opt .dtl_opt_bx .sel_txt span[name*=_from] + span[name*=_to]:before {
  content: "";
}
.dtl_srch_opt .dtl_opt_bx .sel_txt span:not([name*=_from]) + span::before {
  content: ", ";
}
.dtl_srch_opt .dtl_opt_bx .sel_txt span + div::before {
  content: ", ";
}

#sw_tch_li label[name*=sw_tch_A_btn],
.sw_tch_li label[name*=sw_tch_A_btn] {
  border-width: medium;
}
#sw_tch_li .btn-light:focus:not([class*=active]),
.sw_tch_li .btn-light:focus:not([class*=active]) {
  background-color: #fff !important;
}
#sw_tch_li div:nth-child(1) label[class*=active], #sw_tch_li button:nth-child(1)[class*=active],
#sw_tch_li div:hover:nth-child(1) label[class*=active], #sw_tch_li button:hover:nth-child(1) [class*=active],
#sw_tch_li div:active:nth-child(1) label[class*=active], #sw_tch_li button:active:nth-child(1) [class*=active],
#sw_tch_li div:focus:nth-child(1) label[class*=active], #sw_tch_li button:focus:nth-child(1) [class*=active] div:focus:nth-child(1) label[class*=active],
#sw_tch_li button:focus:nth-child(1) [class*=active],
.sw_tch_li div:nth-child(1) label[class*=active],
.sw_tch_li button:nth-child(1)[class*=active],
.sw_tch_li div:hover:nth-child(1) label[class*=active],
.sw_tch_li button:hover:nth-child(1) [class*=active],
.sw_tch_li div:active:nth-child(1) label[class*=active],
.sw_tch_li button:active:nth-child(1) [class*=active],
.sw_tch_li div:focus:nth-child(1) label[class*=active],
.sw_tch_li button:focus:nth-child(1) [class*=active] div:focus:nth-child(1) label[class*=active],
.sw_tch_li button:focus:nth-child(1) [class*=active] {
  border-color: #135ce2 !important;
  color: #fff !important;
  background-color: #135ce2 !important;
}
#sw_tch_li div:nth-child(1) label:not([class*=active]), #sw_tch_li button:nth-child(1):not([class*=active]),
#sw_tch_li div:hover:nth-child(1) label:not([class*=active]), #sw_tch_li button:hover:nth-child(1) :not([class*=active]),
#sw_tch_li div:active:nth-child(1) label:not([class*=active]), #sw_tch_li button:active:nth-child(1) :not([class*=active]),
#sw_tch_li div:focus:nth-child(1) label:not([class*=active]), #sw_tch_li button:focus:nth-child(1) :not([class*=active]),
.sw_tch_li div:nth-child(1) label:not([class*=active]),
.sw_tch_li button:nth-child(1):not([class*=active]),
.sw_tch_li div:hover:nth-child(1) label:not([class*=active]),
.sw_tch_li button:hover:nth-child(1) :not([class*=active]),
.sw_tch_li div:active:nth-child(1) label:not([class*=active]),
.sw_tch_li button:active:nth-child(1) :not([class*=active]),
.sw_tch_li div:focus:nth-child(1) label:not([class*=active]),
.sw_tch_li button:focus:nth-child(1) :not([class*=active]) {
  border-width: medium;
  border-color: #135ce2 !important;
  color: #135ce2 !important;
  background-color: #fff;
}
#sw_tch_li div:nth-child(2) label[class*=active],
#sw_tch_li button:nth-child(2)[class*=active],
#sw_tch_li div:hover:nth-child(2) label[class*=active],
#sw_tch_li button:hover:nth-child(2) [class*=active],
#sw_tch_li div:active:nth-child(2) label[class*=active],
#sw_tch_li button:active:nth-child(2) [class*=active],
#sw_tch_li div:focus:nth-child(2) label[class*=active],
#sw_tch_li button:focus:nth-child(2) [class*=active],
.sw_tch_li div:nth-child(2) label[class*=active],
.sw_tch_li button:nth-child(2)[class*=active],
.sw_tch_li div:hover:nth-child(2) label[class*=active],
.sw_tch_li button:hover:nth-child(2) [class*=active],
.sw_tch_li div:active:nth-child(2) label[class*=active],
.sw_tch_li button:active:nth-child(2) [class*=active],
.sw_tch_li div:focus:nth-child(2) label[class*=active],
.sw_tch_li button:focus:nth-child(2) [class*=active] {
  border-color: #16b3ce !important;
  color: #fff !important;
  background-color: #16b3ce !important;
}
#sw_tch_li div:nth-child(2) label:not([class*=active]),
#sw_tch_li button:nth-child(2):not([class*=active]),
#sw_tch_li div:hover:nth-child(2) label:not([class*=active]),
#sw_tch_li button:hover:nth-child(2) :not([class*=active]),
#sw_tch_li div:active:nth-child(2) label:not([class*=active]),
#sw_tch_li button:active:nth-child(2) :not([class*=active]),
#sw_tch_li div:focus:nth-child(2) label:not([class*=active]),
#sw_tch_li button:focus:nth-child(2) :not([class*=active]),
.sw_tch_li div:nth-child(2) label:not([class*=active]),
.sw_tch_li button:nth-child(2):not([class*=active]),
.sw_tch_li div:hover:nth-child(2) label:not([class*=active]),
.sw_tch_li button:hover:nth-child(2) :not([class*=active]),
.sw_tch_li div:active:nth-child(2) label:not([class*=active]),
.sw_tch_li button:active:nth-child(2) :not([class*=active]),
.sw_tch_li div:focus:nth-child(2) label:not([class*=active]),
.sw_tch_li button:focus:nth-child(2) :not([class*=active]) {
  border-width: medium;
  border-color: #16b3ce !important;
  color: #16b3ce !important;
  background-color: #fff;
}
#sw_tch_li div:nth-child(3) label[class*=active],
#sw_tch_li button:nth-child(3)[class*=active],
#sw_tch_li div:hover:nth-child(3) label[class*=active],
#sw_tch_li button:hover:nth-child(3) [class*=active],
#sw_tch_li div:active:nth-child(3) label[class*=active],
#sw_tch_li button:active:nth-child(3) [class*=active],
#sw_tch_li div:focus:nth-child(3) label[class*=active],
#sw_tch_li button:focus:nth-child(3) [class*=active],
.sw_tch_li div:nth-child(3) label[class*=active],
.sw_tch_li button:nth-child(3)[class*=active],
.sw_tch_li div:hover:nth-child(3) label[class*=active],
.sw_tch_li button:hover:nth-child(3) [class*=active],
.sw_tch_li div:active:nth-child(3) label[class*=active],
.sw_tch_li button:active:nth-child(3) [class*=active],
.sw_tch_li div:focus:nth-child(3) label[class*=active],
.sw_tch_li button:focus:nth-child(3) [class*=active] {
  border-color: #6957d3 !important;
  color: #fff !important;
  background-color: #6957d3 !important;
}
#sw_tch_li div:nth-child(3) label:not([class*=active]),
#sw_tch_li button:nth-child(3):not([class*=active]),
#sw_tch_li div:hover:nth-child(3) label:not([class*=active]),
#sw_tch_li button:hover:nth-child(3) :not([class*=active]),
#sw_tch_li div:active:nth-child(3) label:not([class*=active]),
#sw_tch_li button:active:nth-child(3) :not([class*=active]),
#sw_tch_li div:focus:nth-child(3) label:not([class*=active]),
#sw_tch_li button:focus:nth-child(3) :not([class*=active]),
.sw_tch_li div:nth-child(3) label:not([class*=active]),
.sw_tch_li button:nth-child(3):not([class*=active]),
.sw_tch_li div:hover:nth-child(3) label:not([class*=active]),
.sw_tch_li button:hover:nth-child(3) :not([class*=active]),
.sw_tch_li div:active:nth-child(3) label:not([class*=active]),
.sw_tch_li button:active:nth-child(3) :not([class*=active]),
.sw_tch_li div:focus:nth-child(3) label:not([class*=active]),
.sw_tch_li button:focus:nth-child(3) :not([class*=active]) {
  border-width: medium;
  border-color: #6957d3 !important;
  color: #6957d3 !important;
  background-color: #fff;
}
#sw_tch_li div:nth-child(4) label[class*=active],
#sw_tch_li button:nth-child(4)[class*=active],
#sw_tch_li div:hover:nth-child(4) label[class*=active],
#sw_tch_li button:hover:nth-child(4) [class*=active],
#sw_tch_li div:active:nth-child(4) label[class*=active],
#sw_tch_li button:active:nth-child(4) [class*=active],
#sw_tch_li div:focus:nth-child(4) label[class*=active],
#sw_tch_li button:focus:nth-child(4) [class*=active],
.sw_tch_li div:nth-child(4) label[class*=active],
.sw_tch_li button:nth-child(4)[class*=active],
.sw_tch_li div:hover:nth-child(4) label[class*=active],
.sw_tch_li button:hover:nth-child(4) [class*=active],
.sw_tch_li div:active:nth-child(4) label[class*=active],
.sw_tch_li button:active:nth-child(4) [class*=active],
.sw_tch_li div:focus:nth-child(4) label[class*=active],
.sw_tch_li button:focus:nth-child(4) [class*=active] {
  border-color: #4495c3 !important;
  color: #fff !important;
  background-color: #4495c3 !important;
}
#sw_tch_li div:nth-child(4) label:not([class*=active]),
#sw_tch_li button:nth-child(4):not([class*=active]),
#sw_tch_li div:hover:nth-child(4) label:not([class*=active]),
#sw_tch_li button:hover:nth-child(4) :not([class*=active]),
#sw_tch_li div:active:nth-child(4) label:not([class*=active]),
#sw_tch_li button:active:nth-child(4) :not([class*=active]),
#sw_tch_li div:focus:nth-child(4) label:not([class*=active]),
#sw_tch_li button:focus:nth-child(4) :not([class*=active]),
.sw_tch_li div:nth-child(4) label:not([class*=active]),
.sw_tch_li button:nth-child(4):not([class*=active]),
.sw_tch_li div:hover:nth-child(4) label:not([class*=active]),
.sw_tch_li button:hover:nth-child(4) :not([class*=active]),
.sw_tch_li div:active:nth-child(4) label:not([class*=active]),
.sw_tch_li button:active:nth-child(4) :not([class*=active]),
.sw_tch_li div:focus:nth-child(4) label:not([class*=active]),
.sw_tch_li button:focus:nth-child(4) :not([class*=active]) {
  border-width: medium;
  border-color: #4495c3 !important;
  color: #4495c3 !important;
  background-color: #fff;
}
#sw_tch_li div:nth-child(5) label[class*=active],
#sw_tch_li button:nth-child(5)[class*=active],
#sw_tch_li div:hover:nth-child(5) label[class*=active],
#sw_tch_li button:hover:nth-child(5) [class*=active],
#sw_tch_li div:active:nth-child(5) label[class*=active],
#sw_tch_li button:active:nth-child(5) [class*=active],
#sw_tch_li div:focus:nth-child(5) label[class*=active],
#sw_tch_li button:focus:nth-child(5) [class*=active],
.sw_tch_li div:nth-child(5) label[class*=active],
.sw_tch_li button:nth-child(5)[class*=active],
.sw_tch_li div:hover:nth-child(5) label[class*=active],
.sw_tch_li button:hover:nth-child(5) [class*=active],
.sw_tch_li div:active:nth-child(5) label[class*=active],
.sw_tch_li button:active:nth-child(5) [class*=active],
.sw_tch_li div:focus:nth-child(5) label[class*=active],
.sw_tch_li button:focus:nth-child(5) [class*=active] {
  border-color: #0ab584 !important;
  color: #fff !important;
  background-color: #0ab584 !important;
}
#sw_tch_li div:nth-child(5) label:not([class*=active]),
#sw_tch_li button:nth-child(5):not([class*=active]),
#sw_tch_li div:hover:nth-child(5) label:not([class*=active]),
#sw_tch_li button:hover:nth-child(5) :not([class*=active]),
#sw_tch_li div:active:nth-child(5) label:not([class*=active]),
#sw_tch_li button:active:nth-child(5) :not([class*=active]),
#sw_tch_li div:focus:nth-child(5) label:not([class*=active]),
#sw_tch_li button:focus:nth-child(5) :not([class*=active]),
.sw_tch_li div:nth-child(5) label:not([class*=active]),
.sw_tch_li button:nth-child(5):not([class*=active]),
.sw_tch_li div:hover:nth-child(5) label:not([class*=active]),
.sw_tch_li button:hover:nth-child(5) :not([class*=active]),
.sw_tch_li div:active:nth-child(5) label:not([class*=active]),
.sw_tch_li button:active:nth-child(5) :not([class*=active]),
.sw_tch_li div:focus:nth-child(5) label:not([class*=active]),
.sw_tch_li button:focus:nth-child(5) :not([class*=active]) {
  border-width: medium;
  border-color: #0ab584 !important;
  color: #0ab584 !important;
  background-color: #fff;
}

#srch_opt_info .opt_str:after {
  margin-right: 3px;
  content: ",";
}

#srch_opt_info .opt_str:last-of-type:after {
  margin-right: 0px;
  content: "";
}

.svg_wrap {
  background: #fff;
  border-bottom: 1px solid #ddd;
  padding: 0px;
}

.abs_txt_block {
  position: absolute;
  bottom: 5px;
  color: #fff;
}

.li_pic {
  width: 125px;
  height: 110px;
}

.srch_li div[btn-tp*=OpenDview] {
  cursor: pointer;
}
.srch_li td {
  line-height: 1.5rem;
}

.srch_li div:last-child {
  border-bottom: 0px;
}

.rlty_li_label_btn .active {
  background-color: #93a4b3;
  color: #fff;
}
.rlty_li_label_btn .active span > span {
  color: #25537f;
}

.sq_label {
  border: 1px solid #ccc;
  padding: 0px 5px;
}

.area_info {
  color: #222;
}
.area_info .area {
  color: #222;
}

.min_amt,
.min_amt:before,
.min_amt:after {
  /*color:#036733;*/
}

.eva_amt {
  color: #444;
}

.srch_li .rlty_memo div:last-child .bdr_bttm_dotted {
  border-bottom: 0px;
}

.srch_opt_info {
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
}

.save_opt_more_btn {
  left: 0px;
  padding-top: 17px;
  width: 60px;
  height: 50px;
}

@media (max-width: 767px) {
  .amt_box {
    background-color: #eee;
  }
  .col_under_pic {
    width: 118px;
  }
  .col_under_pic .remainin_day {
    float: right;
  }
}
@media (min-width: 768px) {
  .amt_box {
    background-color: transparent;
  }
  .amt_box td {
    padding: 0px;
    vertical-align: top;
  }
}
.fixed-width {
  font-family: monospace;
  display: inline-block;
  width: 8ch;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	게시판 style
*/
.brd_kword_frm {
  -webkit-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.1);
}

.brd_list div:last-child .bdr_bttm_dotted {
  border-bottom: 0px;
}

#discuss_li {
  padding-top: 15px;
}

.brd_li_tt {
  border-top: 2px solid #7682aa;
}

.brd_list {
  padding: 0px;
  margin-left: auto;
  margin-right: auto;
}

.vote_box {
  float: left;
  width: 40px;
  background-color: #f8f9fa;
}
.vote_box div {
  line-height: 24px;
}
.vote_box button {
  padding: 0px;
  width: 24px;
  height: 24px;
  background-color: #f8f9fa;
}
.vote_box span {
  display: block;
  width: 100%;
  height: 24px;
}

.brd_ctn_box {
  float: left;
  margin-left: 40px;
  width: calc(100% - 40px);
  min-height: 82px;
}

.brd_t01_input {
  margin-left: 5%;
  margin-bottom: 30px;
  ime-mode: inactive;
  width: 90%;
  font-size: 1rem;
  border: 0px;
  border-radius: 0px;
  border-bottom: 1px solid #455a64;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 버튼등에 사용할 아이콘 및 로고 sass
*/
.kor_map {
  background-image: url(/images_root/test/ic_tmp_kor.png);
  background-repeat: no-repeat;
  background-position: 10px 13px;
  width: 45px;
  height: 45px;
}

.logo_38_38_0_5 {
  margin: 0px auto;
  width: 38px;
  height: 38px;
  background-image: url(/images_root/mobile_v2/m2_img_20180322.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
}

.logo_38_38_1_0 {
  margin: 0px auto;
  width: 38px;
  height: 38px;
  background-image: url(/images_root/mobile_v2/m2_img_20180322.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
}

.logo_46_46_1_0 {
  width: 46px;
  height: 46px;
  background-size: 280px auto;
  background-image: url(/images_root/mobile_v2/m2_img_20180322.png);
  background-repeat: no-repeat;
  background-position: 0px -372px;
}

.m_img {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
}

.login {
  width: 40px;
  height: 40px;
  background-size: 280px auto;
  background-position: -107px -378px;
}

.law_hammer {
  background-size: 370px auto;
  background-position: -99px -222px;
}

.pencil {
  background-size: 370px auto;
  background-position: -134px -222px;
}

.monitor {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -9px -612px;
}

.building {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -82px -616px;
}

.hammer {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -155px -612px;
}

.doc_1 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -230px -614px;
}

.doc_2 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -298px -612px;
}

.doc_3 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -11px -681px;
}

.doc_4 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -159px -687px;
}

.doc_5 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -227px -685px;
}

.weigh {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -81px -681px;
}

.book_hand {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -299px -681px;
}

.tel_1 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -107px -271px;
}

.doc_pencil {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -143px -271px;
}

.hamberg_menu {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: 4px -272px;
}

.srch_gray {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -222px -279px;
}

.srch_white {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -40px -244px;
}

.srch_white_2 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 400px auto;
  background-position: -4px -62px;
}

.doc_6 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 500px auto;
  background-position: -407px -203px;
}

.marker {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 500px auto;
  background-position: -6px -216px;
}

.filter {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 500px auto;
  background-position: -96px -216px;
}

.filter_2_0_7 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -159px -634px;
}

.subway {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 500px auto;
  background-position: -188px -216px;
}

.car {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 500px auto;
  background-position: -278px -216px;
}

.tel_2 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 600px auto;
  background-position: -166px -414px;
}

.go_back_1_0 {
  margin-top: 5px;
  margin-left: 5px;
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 370px auto;
  background-position: -266px -17px;
}

.drawer_menu_1_0 {
  margin-top: 5px;
  margin-left: 5px;
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 370px auto;
  background-position: -30px -51px;
}

.circle_concern {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -30px -388px;
}

.circle_concern_2 {
  width: 20px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -84px -389px;
}

.circle_concern_2_on {
  width: 20px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -111px -389px;
}

.circle_viewed {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -57px -388px;
}

.circle_viewed_2 {
  width: 20px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -84px -308px;
}

.circle_viewed_3 {
  width: 20px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -111px -308px;
}

.paper {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -2px -388px;
}

.gr_map {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -5px -223px;
}

.gr_srch {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -57px -225px;
}

.gr_srch_white {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -57px -634px;
}

.gr_srch_white_2 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -107px -634px;
}

.gr_srch_2 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -2px -43px;
}

.gr_graph {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -108px -225px;
}

.gr_house {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -5px -276px;
}

.gr_car {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -158px -225px;
}

.gr_building {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -57px -378px;
}

.gr_subway {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -108px -276px;
}

.gr_court {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -159px -276px;
}

.gr_compass {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -210px -276px;
}

.gr_calendar_1 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -6px -327px;
}

.gr_doc_1 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -56px -327px;
}

.gr_doc_2 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -158px -327px;
}

.gr_clock {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -107px -327px;
}

.gr_call {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 280px auto;
  background-position: -209px -327px;
}

.gr_srch_0_6 {
  width: 40px;
  height: 40px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 222px auto;
  background-position: -36px -383px;
}

.gr_map_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -2px -146px;
}

.gr_srch_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -36px -147px;
}

.gr_srch_white_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -36px -147px;
}

.gr_graph_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -70px -147px;
}

.gr_house_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -2px -180px;
}

.gr_car_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -103px -148px;
}

.gr_building_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -36px -248px;
}

.gr_subway_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -70px -180px;
}

.gr_court_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -103px -181px;
}

.gr_compass_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -137px -180px;
}

.gr_calendar_1_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -2px -214px;
}

.gr_doc_1_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -36px -214px;
}

.gr_doc_2_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -103px -214px;
}

.gr_clock_0_5 {
  width: 30px;
  height: 30px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -69px -213px;
}

.gr_call_0_5 {
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 185px auto;
  background-position: -206px -252px;
}

.line_w_blr_lf {
  position: absolute;
  right: 0px;
  top: 13px;
  width: 20px;
  height: 60px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 740px auto;
  background-position: -618px -410px;
}

.line_w_blr_bttm {
  margin: 0px auto;
  width: 60px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 740px auto;
  background-position: -109px -536px;
}

.fa-angle-up {
  margin-top: -1px;
}

.grn_arrow {
  width: 20px;
  height: 20px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 555px auto;
  background-position: -519px -47px;
}

.grn_arrow_big {
  width: 20px;
  height: 12px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 740px auto;
  background-position: -696px -71px;
  opacity: 0.8;
}

.arrow_up {
  width: 24px;
  height: 24px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -1px -279px;
}

.arrow_up_active {
  width: 24px;
  height: 24px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -28px -279px;
  background-color: #e2e3e4;
}

.arrow_down {
  width: 24px;
  height: 24px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -55px -279px;
}

.arrow_down_active {
  width: 24px;
  height: 24px;
  background-image: url(/images_root/mobile_v2/m2_img.png);
  background-repeat: no-repeat;
  background-size: 148px auto;
  background-position: -82px -279px;
  background-color: #e2e3e4;
}

.rotate_n_180 {
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	자동완성 style
*/
.ui-autocomplete {
  position: fixed;
  padding: 0px;
  z-index: 9999;
  top: 62px !important;
  left: 0px !important;
  width: 100%;
  height: calc(100vh - 62px);
  max-height: none;
  overflow: hidden;
  overflow-y: scroll;
  border-top: 1px solid #d4d4d4;
  background-color: #fff;
}
.ui-autocomplete li {
  float: left;
  width: 100%;
  height: 40px;
  line-height: 40px;
  list-style: none;
}
.ui-autocomplete li a {
  padding: 0px 0px;
  height: 40px;
  text-decoration: none;
}
.ui-autocomplete .ui-menu-item span {
  line-height: 40px;
}
.ui-autocomplete .item_bdr {
  border-top: 1px solid #d4d4d4;
}
.ui-autocomplete .ui-menu_item {
  position: relative;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 0px;
}
.ui-autocomplete .ui-menu_item:hover {
  background-color: #e9e9e9;
}
.ui-autocomplete .ui-state-active {
  display: inline-block;
  width: 100%;
  color: #fff;
  background: DodgerBlue !important;
}
.ui-autocomplete .ui-state-active .item_desc {
  color: #cdcdcd;
}
.ui-autocomplete .e_li_w {
  width: calc(100% - 150px);
}

.ui-helper-hidden-accessible {
  display: none !important;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
.bounce {
  position: absolute;
  z-index: 9999 !important;
  -webkit-animation: bounce 1s infinite;
}

@-webkit-keyframes bounce {
  0% {
    bottom: 0px;
  }
  25%, 75% {
    bottom: 5px;
  }
  50% {
    bottom: 10px;
  }
  100% {
    bottom: 0;
  }
}
/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 의 top 에 해당되는 sass
		-. tpl_tt_1 ~  tpl_tt_5
		-. tpl_tm
		-. tpl_tb
*/
.t02_top_sb_bar {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  height: 34px;
  z-index: 999;
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
}
.t02_top_sb_bar .btn {
  border-radius: 0px;
}

.t02_top_title_bar_4 {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 62px;
  z-index: 999;
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
  background-color: #00c767;
}
.t02_top_title_bar_4 td {
  padding: 0px;
  height: 57px;
}
.t02_top_title_bar_4 .logo_38_38_1_0 {
  margin-top: -5px;
}
.t02_top_title_bar_4 .hamberg_menu {
  margin-top: 6px;
  width: 46px;
  height: 46px;
}
.t02_top_title_bar_4 .t_srch_txt {
  opacity: 0.8;
}
.t02_top_title_bar_4 .t_srch_txt::placeholder {
  color: #fff;
  opacity: 0.8; /* Firefox */
}
.t02_top_title_bar_4 .srch_gray, .t02_top_title_bar_4 .srch_white, .t02_top_title_bar_4 .srch_white_2 {
  margin-top: 6px;
  width: 30px;
  height: 30px;
  margin: 10px auto;
}
.t02_top_title_bar_4 .t_smart_srch_input {
  float: left;
  width: 99%;
  height: 50px;
  background-color: #fff;
  border-radius: 3px;
  border: 0px;
}
.t02_top_title_bar_4 .t_smart_srch_btn {
  float: left;
  margin-top: 6px;
  width: 90%;
  height: 50px;
  line-height: 53px;
  text-align: center;
  font-size: 14px;
  background-color: #fff;
  border-radius: 3px;
  border: 0px;
  color: #222;
}
.t02_top_title_bar_4 .sub_tt {
  float: left;
  margin-top: 4px;
  color: #fff;
}
.t02_top_title_bar_4 .sub_tt_tel {
  display: inline-block;
  font-size: 1.2rem;
  line-height: 16px;
}

.t02_top_title_bar_4_bg_w {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 62px;
  z-index: 999;
  background-color: #fff;
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
  border-bottom: 1px solid #0bde8b;
}
.t02_top_title_bar_4_bg_w td {
  padding: 0px;
  height: 57px;
}
.t02_top_title_bar_4_bg_w .logo_38_38_1_0 {
  margin-top: -5px;
}
.t02_top_title_bar_4_bg_w .hamberg_menu {
  margin-top: 6px;
  width: 46px;
  height: 46px;
}
.t02_top_title_bar_4_bg_w .t_srch_txt {
  opacity: 0.8;
  color: #222;
}
.t02_top_title_bar_4_bg_w .t_srch_txt::placeholder {
  color: #222;
  opacity: 0.7; /* Firefox */
}
.t02_top_title_bar_4_bg_w .srch_gray, .t02_top_title_bar_4_bg_w .srch_white, .t02_top_title_bar_4_bg_w .srch_white_2 {
  margin-top: 6px;
  width: 30px;
  height: 30px;
  margin: 10px auto;
}
.t02_top_title_bar_4_bg_w .t_smart_srch_input {
  float: left;
  width: 99%;
  height: 50px;
  background-color: #fff;
  border-radius: 3px;
  border: 0px;
}
.t02_top_title_bar_4_bg_w .t_smart_srch_btn {
  float: left;
  margin-top: 6px;
  width: 90%;
  height: 50px;
  line-height: 53px;
  text-align: center;
  font-size: 14px;
  background-color: #fff;
  border-radius: 3px;
  border: 0px;
  color: #222;
}
.t02_top_title_bar_4_bg_w .sub_tt {
  float: left;
  margin-top: 4px;
  color: #fff;
}
.t02_top_title_bar_4_bg_w .sub_tt_tel {
  display: inline-block;
  font-size: 1.2rem;
  line-height: 16px;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 의 top 에 해당되는 sass
		-. tpl_tt_1 ~  tpl_tt_5
		-. tpl_tm
		-. tpl_tb
*/
.t02_cc_myz_btn {
  margin: 8px 15px 0px 15px;
  padding-top: 13px;
  height: 72px;
  background-color: #00c767;
  color: #fff;
  text-align: center;
}
.t02_cc_myz_btn div:last-child {
  border-right: 0px;
}
.t02_cc_myz_btn .myz_btn {
  float: left;
  list-style-type: none;
  width: 25%;
  height: 46px;
  line-height: 46px;
  text-align: center;
  position: relative;
  font-family: "Spoqa Han Sans";
  font-size: 16px;
  border-right: 1px solid #fff;
}

.mm_btn_row {
  margin: 0px 15px;
}
.mm_btn_row .mm_btn {
  margin: 15px auto 0px auto;
}
.mm_btn_row .mm_btn_0_5 {
  margin: 15px auto 5px auto;
}
.mm_btn_row .mm_tt {
  text-align: center;
  line-height: 10px !important;
}
.mm_btn_row .mm_cate_line {
  margin: 15px 0px 5px 0px;
  border-bottom: 1px solid #ddd;
}

.mm_btn_row > div {
  height: 85px;
}

/*
	-. tpl 공통 sass
	-. 특이사항
		-. 아이콘(font awesome)
			1. 아이콘의 line 이 얇은 버전은 유료 컨텐츠라 사용블가
				추후 대체할 다른 icon 검색 필요
			2. 아이콘의 크기는 font-size 로 조절 가능
			3. 아이콘의 색은 color 로 조절 가능

*/
/*
	tpl 의 top 에 해당되는 sass
		-. tpl_tt_1 ~  tpl_tt_5
		-. tpl_tm
		-. tpl_tb
*/
.main_bttm_brd {
  position: absolute;
  left: 0px;
  right: 0px;
  width: 100%;
  height: 50px;
  overflow: hidden;
  line-height: 50px;
}
.main_bttm_brd .swiper-slide {
  white-space: nowrap;
  width: 100%;
  overflow: hidden;
}

/*
	default 로 사용되는 class
*/
html {
  font-size: 14px;
  color: #222;
}

body {
  font-size: 1rem;
  color: #222;
  line-height: 1.5rem;
}

a {
  border: 0px;
  text-decoration: none;
}

a:active {
  color: #c90c0c;
}

a:hover {
  text-decoration: underline;
}

[onclick] {
  cursor: pointer;
}

img,
fieldset,
iframe {
  border: 0 none;
}

textarea:hover,
textarea:active,
textarea:focus,
button:focus,
button:active,
button:hover,
input[type=text]:hover,
input[type=text]:active,
input[type=text]:focus,
input[type=button]:hover,
input[type=button]:active,
input[type=button]:focus,
input[type=email]:hover,
input[type=email]:active,
input[type=email]:focus,
input[type=submit]:hover,
input[type=submit]:active,
input[type=submit]:focus,
input[type=tel]:hover,
input[type=tel]:active,
input[type=tel]:focus,
input[type=file]:hover,
input[type=file]:active,
input[type=file]:focus,
input[type=email]:hover,
input[type=email]:active,
input[type=email]:focus,
input[type=number]:hover,
input[type=number]:active,
input[type=number]:focus,
label:focus,
.btn:active,
.btn.active {
  outline: 0px !important;
  -webkit-appearance: none;
  box-shadow: none !important;
}

.form-control::-webkit-input-placeholder {
  color: #c0c0c0;
} /* WebKit, Blink, Edge */
.form-control:-moz-placeholder {
  color: #c0c0c0;
} /* Mozilla Firefox 4 to 18 */
.form-control::-moz-placeholder {
  color: #c0c0c0;
} /* Mozilla Firefox 19+ */
.form-control:-ms-input-placeholder {
  color: #c0c0c0;
} /* Internet Explorer 10-11 */
.form-control::-ms-input-placeholder {
  color: #c0c0c0;
} /* Microsoft Edge */
.hide {
  display: none !important;
}

.selected {
  background: green;
}

.selected:hover {
  background: green;
}

.hide_it_empty:empty {
  display: none;
}

.memo_on {
  color: #ff0000 !important;
}

.concern_on {
  color: #ff0000 !important;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
             supported by Chrome and Opera */
}

/*# sourceMappingURL=tpl.css.map */