@charset "euc-kr";
/* CSS Document */



/* 공통 */
.sub_visual {background-repeat: no-repeat; background-position: 0 0; background-size: cover;}
.sub_visual .inner {position: relative; height: 300px;}
.sub_visual .inner h2 {line-height: 240px; font-size: 2.5rem; font-weight: 600; color: #fff; text-align: center;}
.sub_visual .inner .sub_tab {position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto;}
.sub_visual .inner .sub_tab:after {display: block; clear: both; *zoom: 1; content: '';}
.sub_visual .inner .sub_tab li {float: left; box-sizing: border-box; border: 1px solid #ddd; border-left: 0; transition: all 0.4s;}
.sub_visual .inner .sub_tab li a {display: block; width: 100%; height: 60px; line-height: 60px; font-size: 1.125rem; color: #666; text-align: center; background-color: #fff; transition: all 0.4s;}
.sub_visual .inner .sub_tab li.on {border: 1px solid #3f5871;}
.sub_visual .inner .sub_tab li.on a {background-color: #3f5871; color: #fff;}
.sub_visual .inner .sub_tab li:hover {border: 1px solid #3f5871;}
.sub_visual .inner .sub_tab li:hover a {background-color: #3f5871; color: #fff;}
.sub_visual05 {background-image: url(../images/sub/sub_visual05.jpg);}
.sub_visual06 {background-image: url(../images/sub/sub_visual06.jpg);}
.sub_visual07 {background-image: url(../images/sub/sub_visual07.jpg);}
.sub_visual05 .inner .sub_tab li {width: 33.333333%;}
.sub_visual07 .inner .sub_tab li {width: 50%;}

.breadcrumb {padding: 20px 0 0 0; line-height: 15px; text-align: right;}
.breadcrumb ul {display: inline-block; text-align: left; vertical-align: top;}
.breadcrumb ul:after {display: block; clear: both; *zoom: 1; content: '';}
.breadcrumb ul li {float: left; padding: 0 20px 0 15px; line-height: 15px; font-size: 0.875rem; background: url(../images/sub/arrow_bread.png) no-repeat right center;}
.breadcrumb ul li a {display: block; font-size: 0.875rem; color: #666;}
.breadcrumb ul li.home a {width: 15px; height: 15px; text-indent: -9999px; background: url(../images/sub/ic_home.png) no-repeat 0 0;}
.breadcrumb ul li.current {padding: 0 0 0 15px; background: none;}
.breadcrumb ul li.current a {font-weight: 500; color: #333;}

.sub_tit {display: block; padding: 70px 0 50px; font-size: 2.5rem; color: #333; text-align: center;}
.sub_tit span {display: block; font-size: 1rem; font-weight: 500; color: #3f5871;}
.sub_txt {font-size: 1.125rem; font-weight: 500; color: #333; text-align: center; word-break: keep-all;}

.chk_box input[type="checkbox"] {display: none;}
.chk_box input[type="checkbox"] + label {display: inline-block; cursor: pointer;}
.chk_box input[type="checkbox"] + label:after {display: block; clear: both; *zoom: 1; content: '';}
.chk_box input[type="checkbox"] + label p {float: left; line-height: 20px; font-size: 0.875rem; font-weight: 500; color: #333;}
.chk_box input[type="checkbox"] + label span {display: block; float: left; width: 20px; height: 20px; margin: 0 10px 0 0; background: url(img/chk_off.png) no-repeat 0 0;}
.chk_box input[type="checkbox"]:checked + label span {background: url(img/chk_on.png) no-repeat 0 0;}
.chk_box input[type="radio"] {display: none;}
.chk_box input[type="radio"] + label {display: inline-block; cursor: pointer;}
.chk_box input[type="radio"] + label:after {display: block; clear: both; *zoom: 1; content: '';}
.chk_box input[type="radio"] + label p {float: left; line-height: 24px; font-size: 0.875rem; font-weight: 500; color: #333;}
.chk_box input[type="radio"] + label span {display: block; float: left; width: 24px; height: 24px; margin: 0 10px 0 0; background: url(img/radio_off.png) no-repeat 0 0;}
.chk_box input[type="radio"]:checked + label span {background: url(img/radio_on.png) no-repeat 0 0;}

.btn_box {height: 50px; margin: 70px auto 0; text-align: center;}
.btn_box > div {display: inline-block; vertical-align: top;}
.btn_box > div:after {display: block; clear: both; *zoom: 1; content: '';}
.btn_box > div button {float: left; display: block; width: 120px; height: 50px; margin: 0 0 0 10px; font-size: 1.125rem; font-weight: 500;}
.btn_box > div button:first-child {margin: 0;}
.btn_box > div button.btn_cancel {background-color: #fff; border: 1px solid #333; color: #333;}
.btn_box > div button.btn_ok {background-color: #a33192; border: 1px solid #a33192; color: #fff;}
.btn_box > div button.btn_list {background-color: #313131; border: 1px solid #313131; color: #fff;}

.list_page {display: block; margin: 0 auto; padding: 50px 0 0; text-align: center;}
.list_page > a {display: inline-block; box-sizing: border-box; width: 40px; height: 40px; text-indent: -9999px; border: 1px solid #bbb; vertical-align: middle;}
.list_page > a.first_btn {background: #fff url(../images/sub/arrow_prev.png) no-repeat center;}
.list_page > a.last_btn {background: #fff url(../images/sub/arrow_next.png) no-repeat center;}
.list_page ul {display: inline-block; margin: 0 10px; vertical-align: middle;}
.list_page ul:after {display: block; clear: both; *zoom: 1; content: '';}
.list_page ul li {float: left; width: 40px; height: 40px; line-height: 40px;}
.list_page ul li a {display: block; font-family: 'Poppins'; font-weight: 400; font-size: 1rem; color: #666; text-align: center;}
.list_page ul li.active {background-color: #333;}
.list_page ul li.active a {color: #fff;}

/* 공�??�항 */
.search_form {width: 765px; margin: 50px auto 70px;}
.search_form:after {display: block; clear: both; *zoom: 1; content: '';}
.search_form select {float: left; width: 200px; height: 44px; padding: 0 40px 0 20px; background: #f6f6f6 url(../images/sub/arrow_select.png) no-repeat 170px center; border: 1px solid #f6f6f6;}
.search_form input {float: left; margin: 0 10px; width: 460px; height: 44px; padding: 0 20px; background-color: #f6f6f6; border: 1px solid #f6f6f6;}
.search_form button {float: left; width: 84px; height: 44px; color: #fff; background-color: #273e5b;}

.table_num {line-height: 40px; font-size: 1rem; color: #333;}
.table_list {width: 100%; border-top: 2px solid #333;}
.table_list tr {height: 60px; border-bottom: 1px solid #ddd;}
.table_list td {min-width: 30px; font-size: 1rem; color: #333; text-align: center;}
.table_list td.tit {text-align: left;}
.table_list td.tit a {display: inline-block; box-sizing: border-box; max-width: 1000px; padding: 0 0 0 10px; height: 60px; line-height: 60px; color: #222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; vertical-align: middle;}
.table_list td.tit i {display: inline-block; margin: 0 3px; text-indent: -9999px; vertical-align: middle;}
.table_list td.tit .file {width: 15px; height: 15px; background: url(../images/sub/ic_file.png) no-repeat 0 0;}
.table_list td.tit .secret {width: 11px; height: 15px; background: url(../images/sub/ic_secret.png) no-repeat 0 0;}
.table_list .re_wait {display: block; width: 84px; height: 34px; margin: 0 auto; line-height: 34px; font-size: 1rem; color: #fff; font-weight: 500; background-color: #bbb; border-radius: 20px;}
.table_list .re_ok {display: block; width: 84px; height: 34px; margin: 0 auto; line-height: 34px; font-size: 1rem; color: #fff; font-weight: 500; background-color: #00a0e9; border-radius: 20px;}

.table_view {box-sizing: border-box; width: 100%; margin: 90px 0 0 0; border-top: 1px solid #000;}
.table_view .view_top {position: relative; box-sizing: border-box; width: 100%; padding: 20px 30px; border-bottom: 1px solid #ddd;}
.table_view .view_top .view_tit {display: block; box-sizing: border-box; width: calc(100% - 100px); margin: 0 0 10px 0; font-size: 1.5rem; font-weight: 500; color: #333;}
.table_view .view_top .view_tit span {color: #00a0e9;}
.table_view .view_top > span {display: inline-block; margin: 0 10px 0 0; font-size: 0.875rem; color: #666;}
.table_view .view_top .re_wait {display: block; position: absolute; top: 20px; right: 30px; width: 84px; height: 34px; margin: 0; line-height: 34px; font-size: 1rem; color: #fff; font-weight: 500; background-color: #bbb; border-radius: 20px; text-align: center;}
.table_view .view_top .re_ok {display: block; position: absolute; top: 20px; right: 30px; width: 84px; height: 34px; margin: 0; line-height: 34px; font-size: 1rem; color: #fff; font-weight: 500; background-color: #00a0e9; border-radius: 20px; text-align: center;}
.table_view .view_con {box-sizing: border-box; width: 100%; min-height: 230px; padding: 40px 30px;}
.table_view .view_con img {max-width: 100%; vertical-align: top;}
.table_view .file {box-sizing: border-box; width: 100%; padding: 15px 30px; background-color: #f6f6f6; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.table_view .file span {font-size: 1rem; color: #666;}
.table_view .file a {display: inline-block; font-size: 1rem; color: #666;}
.table_view .view_bot li {box-sizing: border-box; width: 100%; height: 60px; padding: 0 30px; border-bottom: 1px solid #ddd;}
.table_view .view_bot li:after {display: block; clear: both; *zoom: 1; content: '';}
.table_view .view_bot li span {float: left; width: 100px; line-height: 60px; color: #3f5871;}
.table_view .view_bot li a {float: left; overflow: hidden; max-width: calc(100% - 100px); line-height: 60px; color: #666; text-overflow: ellipsis; white-space: nowrap; word-break: break-all;}
.table_view.re_view {background-color: #f6f6f6;}
.table_view.re_view .file {background-color: #eee;}


/* ?�로?�치 ?�스 */
.table_list02 {width: 100%; border-top: 1px solid #000;}
.table_list02 li {padding: 30px 0; border-bottom: 1px solid #ddd;}
.table_list02 li a {display: block;}
.table_list02 li a:after {display: block; clear: both; *zoom: 1; content: '';}
.table_list02 li a .txt_box {float: left; box-sizing: border-box; width: calc(100% - 256px); padding: 20px 60px 0 0;}
.table_list02 li a .txt_box strong {display: block; overflow: hidden; font-size: 1.25rem; font-weight: 500; color: #333; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; transition: all 0.3s;}
.table_list02 li a .txt_box p {display: inline-block; overflow: hidden; margin: 15px 0; width: 100%; height: 3.2em; line-height: 1.6; font-size: 1rem; color: #666; text-align: left; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.table_list02 li a .txt_box span {font-size: 0.875rem; color: #666;}
.table_list02 li a .img_box {float: left; width: 256px;}
.table_list02 li a .img_box img {max-width: 100%; vertical-align: top;}
.table_list02 li a:hover .txt_box strong {color: #3f5871;}

/* �?��코너 */
.praise_top {box-sizing: border-box; width: 100%; padding: 8px; background: url(../images/sub/praise_bg.png) repeat;}
.praise_top div {box-sizing: border-box; width: 100%; padding: 40px 0; background-color: #fff; text-align: center;}
.praise_top div p {font-size: 1.25rem; color: #222; word-break: keep-all;}
.praise_top div a {display: block; box-sizing: border-box; width: 130px; height: 44px; line-height: 42px; margin: 25px auto 0; font-size: 1.125rem; color: #fff; text-align: center; background-color: #3f5871; border: 1px solid #3f5871; transition: all 0.3s;}
.praise_top div a:hover {background-color: #fff; color: #3f5871}

.praise_form {margin: 50px 0 0 0;}
.praise_form > strong {display: block; padding: 40px 0 10px; font-size: 1rem; font-weight: 500; color: #333;}
.praise_form .data_box {box-sizing: border-box; overflow-y: scroll; width: 100%; height: 153px; background-color: #f6f6f6; border: 1px solid #ddd;}
.praise_form .chk_box {padding: 10px 0 0;}

.table_write {width: 100%; border-top: 2px solid #333;}
.table_write tr {height: 70px; border-bottom: 1px solid #ddd;}
.table_write th {padding: 0 0 0 40px; font-size: 1rem; font-weight: 500; color: #333; background-color: #f6f6f6; text-align: left;}
.table_write td {padding: 10px; font-size: 1rem; font-weight: 400; color: #333;}
.table_write td input {width: 390px; height: 40px; padding: 0 20px; vertical-align: top;}
.table_write td button {height: 40px; padding: 0 20px; vertical-align: top; font-size: 1rem; font-weight: 500; color: #fff;}
.table_write td .btn_bbb {background-color: #bbb;}
.table_write td .btn_777 {background-color: #777;}
.table_write td.id input {width: 330px; margin: 0 8px 0 0;}
.table_write td.address > div input {width: 330px; margin: 0 8px 0 0;}
.table_write td.address input {width: 664px; margin: 10px 0 0 0;}
.table_write td .phone {float: left;}
.table_write td .phone input {float: left; width: 100px;}
.table_write td .phone span {float: left; margin: 0 5px; height: 40px; line-height: 40px; vertical-align: top; color: #333;}
.table_write td .marketing {float: left;}
.table_write td .marketing strong {float: left; margin: 0 40px 0 50px; line-height: 40px; font-weight: 500; color: #333;}
.table_write td .marketing .chk_box {float: left; padding: 0;}
.table_write td .marketing .chk_box + .chk_box {margin: 0 0 0 30px;}
.table_write td .marketing .chk_box input[type="radio"] + label span {height: 40px; background-position: 0 center;}
.table_write td .marketing .chk_box input[type="radio"] + label p {line-height: 40px; font-size: 1rem;}
.table_write td .email {float: left;}
.table_write td .email input {width: 330px;}
.table_write td textarea {width: 100%; height: 200px; vertical-align: top; border: 1px solid #ddd;}
.table_write td.name input {width: 330px;}
.table_write td.title input {width: 100%;}
.table_write .file_box {position: relative;}
.table_write .file_box:after {display: block; clear: both; *zoom: 1; content: '';}
.table_write .file_box label {float: left; display: block; width: 100px; height: 40px; line-height: 40px; font-size: 1rem; font-weight: 500; color: #fff; background: #777; text-align: center; cursor: pointer;}
.table_write .file_box input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
.table_write .file_box .upload_name {float: left; box-sizing:border-box; width: calc(100% - 100px); height:40px; padding:0 10px; background:#fff; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none;}

.write_form {width: 100%; border-top: 2px solid #333;}
.write_form .row {border-bottom: 1px solid #ddd;}
.write_form .row:after {display: block; clear: both; *zoom: 1; content: '';}
.write_form .row .label {float: left; box-sizing: border-box; width: 200px; height: 60px; padding: 18px 0 0 40px; font-size: 1rem; font-weight: 500; color: #333; background-color: #f6f6f6; text-align: left; margin-bottom: 0;}
.write_form .row .input_box {position: relative; float: left; box-sizing: border-box; width: calc(100% - 200px); height: 100%; padding: 10px; font-size: 0.8rem; font-weight: 400; color: #555;}
.write_form .row .input_box:after {display: block; clear: both; *zoom: 1; content: '';}
.write_form .row .input_box input {width: 390px; height: 40px; padding: 4px 5px;}
.write_form .row .input_box button {height: 40px; padding: 0 20px; vertical-align: top; font-size: 1rem; font-weight: 500; color: #fff;  background-color: #777;}
.write_form .row .input_box textarea {width: 100%; height: 200px; padding: 20px; vertical-align: top; border: 1px solid #ddd;}
.write_form .row .input_box select {width: 330px; height: 40px; padding: 0 40px 0 20px; border: 1px solid #ddd; background: url(../images/sub/arrow_select.png) no-repeat 95% center;}
.write_form .row .id input {float: left; margin: 0 10px 0 0;}
.write_form .row .id button {float: left; background-color: #bbb;}
.write_form .row .name input {width: 330px;}
.write_form .row .email input {width: 330px;}
.write_form .row .title input {width: 100%;}
.write_form .row .phone {float: left;}
.write_form .row .phone input {float: left; width: 100px;}
.write_form .row .phone span {float: left; margin: 0 5px; height: 40px; line-height: 40px; vertical-align: top; color: #333;}
.write_form .row .file_box {position: relative;}
.write_form .row .file_box:after {display: block; clear: both; *zoom: 1; content: '';}
.write_form .row .file_box label {float: left; display: block; width: 100px; height: 40px; line-height: 40px; font-size: 1rem; font-weight: 500; color: #fff; background: #777; text-align: center; cursor: pointer;}
.write_form .row .file_box input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
.write_form .row .file_box .upload_name {float: left; box-sizing:border-box; width: calc(100% - 100px); height:40px; padding:0 10px; background:#fff; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.write_form .row.cleaning .chk_box {float: left; margin: 0 0 0 40px;}
.write_form .row.cleaning .chk_box:first-child {margin: 0;}
.write_form .row.cleaning .chk_box input[type="radio"] + label p {font-size: 1rem;}


.write_form .row.datepicker {height: 262px;}
.write_form .row.datepicker .label {height: 262px;}
.write_form .row.datepicker #datepicker {position: absolute; top: 50%; transform: translateY(-50%);}
.write_form .row.address {height: 160px;}
.write_form .row.address .label {height: 160px;}
.write_form .row.post_address .label {height: 160px;}
.write_form .row.address .input_box > div:after {display: block; clear: both; *zoom: 1; content: '';}
.write_form .row.address .input_box > div input {float: left; width: 330px; margin: 0 10px 0 0;}
.write_form .row.post_address .input_box > div input {float: left; width: 330px; margin: 0 10px 0 0;}
.write_form .row.address .input_box > div button {float: left; width: 160px; height: 40px; background-color: #777; color: #fff;}
.write_form .row.address .input_box input {width: 664px; margin: 10px 0 0 0;}
.write_form .row.post_address .input_box input {width: 664px; /* margin: 10px 0 0 0; */}
.write_form .row.contents {height: 220px;}
.write_form .row.contents .label {height: 220px;}
.write_form .row .pyeong input {width: 330px;}
.write_form .row .phone_input {float: left;}
.write_form .row .email_input {float: left;}
.write_form .row .marketing {float: left;}
.write_form .row .marketing strong {float: left; display: block; line-height: 40px; margin: 0 0 0 50px; font-weight: 500;}
.write_form .row .marketing .chk_box {float: left; margin: 0 0 0 30px; height: 40px; padding: 0;}
.write_form .row .marketing .chk_box input[type="radio"] + label span {height: 40px; margin: 0 10px 0 0; background-position: 0 center;}
.write_form .row .marketing .chk_box input[type="radio"] + label p {line-height: 40px;}


/* ?�력 */
.ui-datepicker {width: 270px; height: auto; padding: 0; font-size: 0.875rem; color: #000; box-shadow: none; border-radius: 0; border: 1px solid #ddd; background: none;}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {border-radius: 0;}
.ui-datepicker .ui-datepicker-header {padding: 0; height: 34px; background-color: #ccc; border: 0;}
.ui-datepicker .ui-datepicker-title {line-height: 34px;}
.ui-datepicker .ui-datepicker-year:after {content: '.';}
.ui-widget-header {background: none;}
.ui-widget-header .ui-icon {background: none;}
.ui-datepicker .ui-datepicker-prev {top: 0; left: 10px; width: 34px; height: 34px;}
.ui-datepicker .ui-datepicker-prev:hover {border: 0; background: none;}
.ui-datepicker .ui-datepicker-prev-hover {left: 10px;}
.ui-datepicker .ui-datepicker-prev span {display: block; position: static; left: auto; top: auto; margin: 0; width: 100%; height: 100%;}
.ui-datepicker .ui-datepicker-prev .ui-icon {background: url(../images/sub/datepicker_prev.png) no-repeat center center;}
.ui-datepicker .ui-datepicker-next {top: 0; right: 10px; width: 34px; height: 34px;}
.ui-datepicker .ui-datepicker-next:hover {border: 0; background: none;}
.ui-datepicker .ui-datepicker-next-hover {right: 10px;}
.ui-datepicker .ui-datepicker-next span {display: block; position: static; right: auto; top: auto; margin: 0; width: 100%; height: 100%;}
.ui-datepicker .ui-datepicker-next .ui-icon {background: url(../images/sub/datepicker_next.png) no-repeat center center;}
.ui-datepicker table {width: 100%; margin: 0; font-size: 0.875rem;}
.ui-datepicker td {padding: 0;}
.ui-datepicker td span, .ui-datepicker td a {text-align: center; padding: 0; line-height: 28px;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {background: none; border: 0;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {background-color: #00a0e9; color: #fff;}


/* 고객지??*/
.popup {display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 80;}
.popup .popup_wrap {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; box-sizing: border-box; background-color: #fff;}
.popup .popup_wrap .btn_close {position: absolute; top: 0; right: -40px; width: 40px; height: 40px; background: #273e5b url(../images/sub/btn_close.png) no-repeat center center; text-indent: -9999px;}
.popup_secret .popup_wrap {width: 500px; padding: 40px 80px; text-align: center;}
.popup_secret .popup_wrap strong {font-size: 1.25rem; font-weight: 500; color: #333;}
.popup_secret .popup_wrap p {margin: 10px 0 0 0; font-size: 0.875rem; color: #333;}
.popup_secret .popup_wrap input {margin: 30px 0; width: 100%; height: 40px; text-align: left;}
.popup_secret .popup_wrap .btn_ok {display: block; margin: 0 auto; width: 120px; height: 50px; font-size: 1.125rem; font-weight: 500; background-color: #48b6f4; color: #fff;}


/* 로그??*/
.login_form {box-sizing: border-box; width: 600px; max-width: 100%; padding: 60px; margin: 30px auto 0; border: 1px solid #ddd; background-color: #fff;}
.login_form input {width: 100%; height: 50px; padding: 0 20px;}
.login_form input[type="text"] {margin: 0 0 10px 0;}
.login_form button {margin: 30px 0; width: 100%; height: 50px; font-size: 1.125rem; background-color: #a33192; color: #fff;}
.login_form ul {display: block; text-align: center;}
.login_form ul li {position: relative; display: inline-block; padding: 0 20px;}
.login_form ul li:before {display: block; position: absolute; top: 4px; left: 0; width: 1px; height: 14px; background-color: #ddd; content: '';}
.login_form ul li:first-child::before {display: none;}
.login_form ul li a {display: block; font-size: 0.825rem; color: #777; cursor: pointer;}

/* ?�원가??*/
.join_tab {box-sizing: border-box; width: 100%; margin: 0 0 70px 0; border: 1px solid #ddd;}
.join_tab:after {display: block; clear: both; *zoom: 1; content: '';}
.join_tab li {float: left; box-sizing: border-box; width: 33.333333%; height: 55px; line-height: 55px; font-size: 1.125rem; font-weight: 500; color: #666; text-align: center; background-color: #f6f6f6; border-left: 1px solid #ddd;}
.join_tab li:first-child {border: 0;}
.join_tab li.on {color: #fff; background-color: #a33192;}
.join_form .join_tit {position: relative;}
.join_form .join_tit h4 {padding: 0 0 10px 0; font-size: 1.375rem; font-weight: 500; color: #333; border-bottom: 2px solid #333;}
.join_form .join_tit .chk_box {position: absolute; top: 10px; right: 0; padding: 0;}
.join_form .join_tit .chk_box input[type="checkbox"] + label p {font-size: 1rem;}
.join_form .join_tit .chk_box input[type="checkbox"] + label span {margin: 0 0 0 10px;}
.join_form > strong {display: block; padding: 25px 0 10px; font-size: 1rem; font-weight: 500; color: #333;}
.join_form .data_box {box-sizing: border-box; overflow-y: scroll; width: 100%; height: 153px; background-color: #f6f6f6; border: 1px solid #ddd;}
.join_form .chk_box {padding: 15px 0 25px;}

.join_complete {box-sizing: border-box; width: 100%; padding: 70px 0; border: 1px solid #ddd; text-align: center;}
.join_complete strong {display: block; font-size: 1.875rem; font-weight: 500; color: #333;}
.join_complete p {display: block; line-height: 2.2; font-size: 1.125rem; color: #333;}
.join_complete img {display: block; margin: 30px auto 50px;}
.join_complete .btn_box > div button {width: 235px;}

/* ?�이??찾기 */
.join_tit {display: block; text-align: center; font-size: 1.25rem; font-weight: 500; color: #333; word-break: keep-all;}
.join_txt {margin: 5px 0 0 0; text-align: center; font-size: 1.125rem; color: #333; word-break: keep-all;}
.find_btn {margin: 20px 0 30px;}
.find_btn:after {display: block; clear: both; *zoom: 1; content: '';}
.find_btn button {float: left; width: calc((100% - 10px)/2); margin: 0 0 0 10px;}
.find_btn button:first-child {margin: 0;}
.find_btn .btn_cancel {background-color: #313131;}
.find_result strong {display: block; line-height: 100px; font-size: 1.25rem; font-weight: 500; color: #333; text-align: center;}

/* ?�원?�보관�?*/
.btn_pw_change {background-color: #00a0e9;}
.pw_box {display: none; padding: 20px 0 0 0;}
.pw_box li {margin: 10px 0 0 0;}
.pw_box li:first-child {margin: 0;}
.pw_box li label {display: block;}
.pw_box li input {display: block; margin: 10px 0 0 0;}
.pw_modify.open .label {height: 240px;}

/* ?�원?�퇴 */
.write_form .withdrawal .input_box {width: 100%; padding: 30px;}
.withdrawal .input_box strong {font-size: 1.25rem; font-weight: 500; color: #222;}
.withdrawal .input_box p {margin: 10px 0 0 0; color: #999;}
.write_form .reason .label {height: 220px;}
.write_form .caution .label {height: 90px;}
.caution_list li {margin: 5px 0 0 0; font-size: 0.875rem; color: #999;}
.caution_list li:first-child {margin: 0;}



/* ���*/

.member {padding-bottom: 60px;}
.h120{height:110px !important;}
.post_address .input_box > input {margin-top:10px;}
/* .write_form .join_phone .label {height: 100px;} */
.join_txt02{display: block; text-align: center;}



.edu_area_tab {overflow: hidden; margin:auto; width:90%; box-sizing:border-box;}
.edu_area_tab li {float: left; width: 31%; height:300px; margin:10px; text-align:center; box-sizing:border-box; border:1px solid #ddd;
border-bottom-left-radius:15px; border-top-right-radius:15px;}



.edu_area_tab li a{display: block; width: 100%; height: 100%; color: #999; text-align: center;}
.edu_area_tab li.active {border:1px solid #a33192;}

.edu_area_tab li.active .login_tit{color:#a33192; }


.edu_area_tab li .login_tit{color:#a33192; padding-top:150px;}




.edu_area_tab .login_btn1.active{background: url(../img/login1_1.png) 50% 30% no-repeat;}
.edu_area_tab .login_btn2.active{background: url(../img/login2_2.png) 50% 30% no-repeat;}
.edu_area_tab .login_btn3.active{background: url(../img/login3_3.png) 50% 30% no-repeat;}

.login_tit{font-weight:500; color: #999;}

.edu_area_tab li.active a {font-weight: 500; color: #a33192;}

.edu_area_tab li p{color:#999; padding-top:3px; font-size:13px;}


.login_list{display:flex; justify-content:center; margin-bottom:50px;}
.login_line{width:300px; height:2px; background:#ddd; position:absolute; z-index:-9999; top:44%; left:44%;}

.login_list1{width:270px; height:60px; background:#a33192; border-radius:30px; margin:20px; display:flex;  justify-content:center; align-items:center;}
.login_list1 p{font-size:15px; color:#fff;}
.login_list1 img{width:12%; padding-right:10px;}

.login_list2{width:60px; height:60px; background:#ddd; border-radius:30px; margin:20px; display:flex; justify-content:center; align-items:center;}

.login_list3{width:60px; height:60px; background:#ddd; border-radius:30px; text-align:center; margin:20px; display:flex; justify-content:center; align-items:center;}


.login_btn1{background: url(../img/login1.png) 50% 30% no-repeat; cursor:pointer;}
.login_btn2{background: url(../img/login2.png) 50% 30% no-repeat; cursor:pointer;}
.login_btn3{background: url(../img/login3.png) 50% 30% no-repeat; cursor:pointer;}






/*radio button*/
.radio_box input {display: none;}
.radio_box input + label {display: block; overflow: hidden; cursor: pointer; float: left; padding:10px;}
.radio_box input + label span {display: block; position: relative; float: left; box-sizing: border-box; border: 1px solid #ddd; border-radius: 50%;}
.radio_box input + label span:before {visibility: hidden; opacity: 0; position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; background-color: #8048ee; transition: all 0.1s ease-in-out; content: ''; border-radius: 50%;}
.radio_box input + label p {float: left; margin: 0 0 0 10px; line-height: 20px; color:#666;}
.radio_box input:checked + label span:before {visibility: visible; opacity: 1;}
.radio_box input:checked + label p {color:#8048ee; font-weight: 500;}
.radio_box input[type="radio"] + label span {width: 20px; height: 20px;}
.radio_box input[type="radio"] + label span:before {width: 10px; height: 10px;}

.check_box input {display: none;}
.check_box input + label {display: block; overflow: hidden; cursor: pointer; float: left; padding:10px;}
.check_box input + label span {display: block; position: relative; float: left; box-sizing: border-box; border: 1px solid #ddd;}
.check_box input + label span:before {visibility: hidden; opacity: 0; position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; background-color: #8048ee; transition: all 0.1s ease-in-out; content: '';}
.check_box input + label p {float: left; margin:2px 0 0 10px; line-height: 20px; color:#666;}
.check_box input:checked + label span:before {visibility: visible; opacity: 1;}
.check_box input:checked + label p {color:#8048ee; font-weight: 500;}
.check_box input[type="checkbox"] + label span {width: 20px; height: 20px;}
.check_box input[type="checkbox"] + label span:before {width: 10px; height: 10px;}

.write_form .row.cleaning{height:100px;}
.write_form .row.cleaning .label{height:100px;}

.write_form .row .label_1{height:100px;}
.write_form .row .label_2{height:63px;}
.write_form .row .label_3{height:90px;}


.cleaning_2{height:230px;}


.write_form .row .lable_4{height:230px;}

.cleaning_4{height:60px;}





@media screen and (min-width: 768px) and (max-width: 1410px) {
	.moduleCall{width:95%;}
/* ���*/

.member {padding-bottom: 60px;}
.write_form .join_phone .label {height: 100px;}

.write_form .row.cleaning{height:220px;}
.write_form .row.cleaning .label{height:220px;}



.cleaning_4{height:120px;}

}

/* tablet */
@media screen and (min-width: 768px) and (max-width: 1200px) {
	.moduleCall{width:95%;}
	.search_form {max-width: 100%;}
	.search_form select {width: 130px; background-position: 100px center;}
	.search_form input {width: calc(100% - 234px);}
	.table_list td.tit a {max-width: 360px;}

	.write_form .row.address .input_box input {max-width: 100%;}

     /* ���*/
	.member {padding-bottom: 60px;}
	.h120{height:200px !important;}
	.write_form .join_phone .label {height: 100px;}
	.write_form .join_email .label {height: 100px;}

	.cleaning_4{height:120px;}


 }

 @media screen and (min-width:948px) and (max-width:1242px){
	.moduleCall{width:95%;}
	.edu_area_tab li{width:30%; margin:11px; height:250px; padding-top:130px;}

	.write_form .row.cleaning{height:220px;}
	.write_form .row.cleaning .label{height:220px;}
	.write_form .row .label_2{height:120px;}

	.edu_area_tab li .login_tit{padding-top:20px;}
 }

@media screen and (min-width:868px) and (max-width:947px){
	.moduleCall{width:95%;}
	.edu_area_tab li{width:30%; margin:11px; height:250px; padding-top:130px;}
	.edu_area_tab li p{font-size:12px;}

	.write_form .row.cleaning{height:220px;}
	.write_form .row.cleaning .label{height:220px;}

	.write_form .row .label_2{height:120px;}

	.edu_area_tab li .login_tit{padding-top:20px;}
}


@media screen and (min-width:481px) and (max-width:767px) {
	.moduleCall{width:95%;}
	.search_form {max-width: 100%; margin: 0 auto 40px;}
	.search_form select {width: 130px; background-position: 100px center;}
	.search_form input {width: calc(100% - 234px);}
	.table_list td.tit a {max-width: 200px;}
	.table_list td.hits {display: none;}
	.table_list .re_wait {width: 70px; height: 30px; line-height: 30px; font-size: 0.875rem;}
	.table_list .re_ok {width: 70px; height: 30px; line-height: 30px; font-size: 0.875rem;}

	.table_list02 li {padding: 15px 0;}
	.table_list02 li a .img_box {width: 136px;}
	.table_list02 li a .txt_box {width: calc(100% - 136px); padding: 0 15px 0 0;}
	.table_list02 li a .txt_box p {margin: 10px 0; height: 1.6em; -webkit-line-clamp: 1;}

	.praise_top {margin: 0 0 20px 0;}

	.write_form .row .label_2{height:160px!important;}

	.write_form .row .label {width: 120px; padding: 18px 0 0 10px;}
	.write_form .row .input_box {width: calc(100% - 120px);}
	.write_form .row .name input {width: 100%;}
	.write_form .row .email input {width: 100%;}
	.write_form .row .phone input {width: calc((100% - 30px)/3);}
	.write_form .row .phone span {width: 5px;}
	.write_form .row.cleaning {height: 138px;}
	.write_form .row.cleaning .label {height: 138px;}
	.write_form .row.cleaning .chk_box {float: none; width: 100%; margin: 0;}
	.write_form .row .input_box select {width: 100%;}
	.write_form .row.address .input_box > div input {width: 110px;}
	.write_form .row.post_address .input_box > div input {width: 110px;}
	.write_form .row.address .input_box input {max-width: 100%;}
	.write_form .row .pyeong input {width: 100%;}

	.popup_secret .popup_wrap {max-width: 90%; padding: 30px 15px;}
	.popup_secret .popup_wrap input {margin: 15px 0;}
	.popup_secret .popup_wrap .btn_ok {height: 40px; font-size: 1rem;}
	.popup .popup_wrap .btn_close {right: 0; widtH: 30px; height: 30px; background-size: 15px 15px;}


	.write_form .row.cleaning{height:220px;}
	.write_form .row.cleaning .label{height:220px;}


	.label_5{height:70px;}



	/* 로그??*/
	.login_form {padding: 50px 30px;}

	/* ?�원가??*/
	.write_form .row .id input {width: calc(100% - 90px);}
	.write_form .row .id button {width: 80px; padding: 0 10px;}
	.write_form .row .input_box input {max-width: 100%;}
	.write_form .join_phone {height: 100px;}
	.write_form .join_phone .label {height: 100px;}
	.write_form .join_email {height: 100px;}
	.write_form .join_email .label {height: 100px;}
	.write_form .row .phone_input {float: none;}
	.write_form .row .email_input {float: none;}
	.write_form .row .marketing {float: none;}
	.write_form .row .marketing strong {margin: 0;}
	.write_form .row .marketing .chk_box {margin: 0 0 0 10px;}
	.write_form .row .marketing .chk_box input[type="radio"] + label span {width: 24px;}

	.join_complete .btn_box > div button {width: 135px;}
	.join_form .join_tit .chk_box {position: static; top: auto; text-align: right; margin: 10px 0 0 0;}


	/* ?�원?�퇴 */
	.write_form .withdrawal .input_box {width: 100%;}
	.write_form .caution .label {height: 172px;}

     /* ���*/
	.member {padding-bottom: 60px;}
	.write_form .join_phone .label {height: 100px;}
	.h120{height:200px !important;}
	.write_form .row.post_address .input_box div input {width: calc(100% - 170px);}

}

@media screen and (max-width: 867px) and (min-width: 481px){
	.moduleCall{width:95%;}
	.edu_area_tab li{width:100%; margin:0; height:100px; margin-top:10px; padding-top:12px; display:block; align-items:center;}
	.edu_area_tab li img{padding-left:50px; float:left;}
	.edu_area_tab li a{padding-top:10px;}

	.login_btn1{background: url(../img/login1.png) 10% 40% no-repeat;}
	.login_btn2{background: url(../img/login2.png) 10% 40% no-repeat;}
	.login_btn3{background: url(../img/login3.png) 10% 40% no-repeat;}

	.edu_area_tab .login_btn1.active{background: url(../img/login1_1.png) 10% 40% no-repeat;}
	.edu_area_tab .login_btn2.active{background: url(../img/login2_2.png) 10% 40% no-repeat;}
	.edu_area_tab .login_btn3.active{background: url(../img/login3_3.png) 10% 40% no-repeat;}

	.edu_area_tab li{padding-left:60px;}

	.write_form .row.cleaning{height:315px;}
	.write_form .row.cleaning .label{height:315px;}

	.write_form .row.cleaning>.label_2{height:100px;}

	.write_form .row .label{height:100px;}

	.write_form .row.cleaning .label{height:315px;}
	.write_form .row.cleaning_1{height:100px;}

	.cleaning_2{height:230px;}

	.label_5{height:60px;}


	.write_form .row .lable_4{height:230px;}

	.edu_area_tab li .login_tit{padding-top:0;}

}

/* mobile */
@media screen and (max-width: 480px) {
	.find_btn button{width:100%;}
	.moduleCall{width:95%;}
	.sub_visual .inner {height: 200px;}
	.sub_visual .inner h2 {line-height: 156px; font-size: 2.143rem;}
	.sub_visual .inner .sub_tab li {position: relative; height: 44px; background-color: #fff;}
	.sub_visual .inner .sub_tab li.on {background-color: #3f5871;}
	.sub_visual .inner .sub_tab li a {position: absolute; top: 50%; transform: translateY(-50%); height: auto; line-height: 1.3; font-size: 1rem; word-break: keep-all;}
	.breadcrumb {padding: 10px 0 0 0;}
	.breadcrumb ul li {padding: 0 15px 0 10px; line-height: 10px; font-size: 0.8571rem;}
	.breadcrumb ul li.current {padding: 0 0 0 10px;}
	.breadcrumb ul li a {font-size: 0.8571rem;}
	.breadcrumb ul li.home a {width: 10px; height: 10px; background-size: 10px 10px;}
	.sub_tit {padding: 30px 0; font-size: 2.143rem;}
	.sub_txt {font-size: 1rem;}
	.btn_box {height: 40px; margin: 30px auto 0;}
	.btn_box > div button {width: 100px; height: 40px; font-size: 1rem;}
	.list_page > a {width: 30px; height: 30px;}
	.list_page ul li {width: 30px; height: 30px; line-height: 30px;}
	.search_form {max-width: 100%; margin: 0 auto 20px;}
	.search_form select {width: 90px; height: 34px; padding: 0 30px 0 10px; background-position: 70px center;}
	.search_form input {width: calc(100% - 180px); height: 34px; padding: 0 10px;}
	.search_form button {width: 70px; height: 34px;}
	.table_list tr {height: 50px}
	.table_list td.tit a {max-width: 140px; height: 50px; line-height: 50px;}
	.table_list td.tit i {margin: 0;}
	.table_list td.num {display: none;}
	.table_list td.hits {display: none;}
	.table_list .re_wait {width: 70px; height: 30px; line-height: 30px; font-size: 0.8571rem;}
	.table_list .re_ok {width: 70px; height: 30px; line-height: 30px; font-size: 0.8571rem;}

	.table_view {margin: 50px 0 0 0;}
	.table_view .view_top {padding: 10px 15px;}
	.table_view .view_top .re_wait {top: 10px; right: 15px;}
	.table_view .view_top .re_ok {top: 10px; right: 15px;}
	.table_view .view_con {padding: 30px 15px;}
	.table_view .file {padding: 10px 15px;}
	.table_view .view_bot li {height: 40px; padding: 0 15px;}
	.table_view .view_bot li span {width: 60px; line-height: 40px;}
	.table_view .view_bot li a {width: calc(100% - 60px); line-height: 40px;}

	.table_list02 li {padding: 15px 0;}
	.table_list02 li a .img_box {width: 136px;}
	.table_list02 li a .txt_box {width: calc(100% - 136px); padding: 0 15px 0 0;}
	.table_list02 li a .txt_box p {margin: 10px 0; height: 1.6em; -webkit-line-clamp: 1;}

	.praise_top {margin: 0 0 20px 0;}
	.praise_top div {padding: 20px 15px;}
	.praise_top div p {font-size: 1rem;}
	.praise_top div a {height: 34px; line-height: 32px; font-size: 1rem;}

	.praise_form {margin: 30px 0 0 0;}
	.write_form .row .label {float: none; display: block; width: 100%; height: auto; padding: 10px 15px;}
	.write_form .row .input_box {float: none; width: 100%; padding: 10px 15px;}
	.write_form .row .input_box:after {display: block; clear: both; *zoom: 1; content: '';}
	.write_form .row .input_box input {padding: 0 10px;}
	.write_form .row .input_box textarea {padding: 10px;}
	.write_form .row .input_box select {width: 100%;}
	.write_form .row .name input {width: 100%;}
	.write_form .row .email input {width: 100%;}
	.write_form .row .phone input {width: calc((100% - 30px)/3);}
	.write_form .row .phone span {width: 5px;}
	.write_form .row .file_box label {width: 70px; height: 34px; line-height: 34px; font-size: 0.8571rem}
	.write_form .row .file_box .upload_name {height: 34px; width: calc(100% - 70px);}
	.write_form .row.contents {height: auto;}
	.write_form .row.contents .label {height: auto;}
	.write_form .row.cleaning .chk_box {float: none; width: 100%; margin: 0;}
	.write_form .row.datepicker {height: auto;}
	.write_form .row.datepicker .label {height: auto;}
	.write_form .row.datepicker #datepicker {position: static; top: auto; transform: none;}
	.write_form .row.address {height: auto;}
	.write_form .row.address .label {height: auto;}
	.write_form .row.post_address .label {height: auto;}
	.write_form .row.address .input_box > div input {width: calc(100% - 150px);}
	.write_form .row.post_address .input_box > div input {width: calc(100% - 150px);}
	.write_form .row.address .input_box > div button {width: 140px; padding: 0;}
	.write_form .row.address .input_box input {max-width: 100%;}
	.write_form .row .pyeong input {width: 100%;}

	.popup_secret .popup_wrap {width: 90%; padding: 30px 15px;}
	.popup_secret .popup_wrap input {margin: 15px 0;}
	.popup_secret .popup_wrap .btn_ok {height: 40px; font-size: 1rem;}
	.popup .popup_wrap .btn_close {right: 0; widtH: 30px; height: 30px; background-size: 15px 15px;}


	/* 로그??*/
	.login_form {padding: 30px 15px;}
	.login_form button {margin: 10px 0;}
	.login_form ul li {padding: 0 10px;}

	/* ?�원가??*/
	.join_tab {margin: 0 0 30px 0;}
	.join_tab li {height: 40px; line-height: 40px; font-size: 1rem;}
	.join_form .join_tit .chk_box {position: static; top: auto; text-align: right; margin: 10px 0 0 0;}
	.join_form > strong {padding: 15px 0 10px;}
	.join_form .chk_box {padding: 10px 0 15px;}
    .join_txt02{display: block; text-align: center;}

	.write_form .row .id input {width: calc(100% - 90px);}
	.write_form .row .id button {width: 80px; padding: 0 10px;}
	.write_form .row .input_box input {max-width: 100%;}
	.write_form .row .phone_input {float: none;}
	.write_form .row .email_input {float: none;}
	.write_form .row .marketing {float: none;}
	.write_form .row .marketing strong {margin: 0;}
	.write_form .row .marketing .chk_box {margin: 0 0 0 10px;}
	.write_form .row .marketing .chk_box input[type="radio"] + label span {width: 24px;}

	.join_complete {padding: 30px 15px;}
	.join_complete strong {font-size: 1.429rem; word-break: keep-all;}
	.join_complete p {font-size: 1rem;}
	.join_complete img {margin: 15px auto;}
	.join_complete .btn_box > div button {width: 100px;}

	/* ?�원?�퇴 */
	.withdrawal .input_box strong {font-size: 1.143rem;}

	 /* ���*/
	.member {padding-bottom: 60px;}

	.edu_area_tab li{width:100%; margin:0; height:100px; margin-top:10px; padding-top:12px; display:block; align-items:center;}
	.edu_area_tab li img{padding-left:30px; float:left; width:13%; padding-top:10px;}
	.edu_area_tab li a{padding-top:10px;}

	.login_btn1{background: url(../img/login1.png) 10% 40% no-repeat; background-size:12%;}
	.login_btn2{background: url(../img/login2.png) 10% 40% no-repeat; background-size:12%;}
	.login_btn3{background: url(../img/login3.png) 10% 40% no-repeat; background-size:12%;}

	.edu_area_tab .login_btn1.active{background: url(../img/login1_1.png) 10% 40% no-repeat; background-size:12%;}
	.edu_area_tab .login_btn2.active{background: url(../img/login2_2.png) 10% 40% no-repeat; background-size:12%;}
	.edu_area_tab .login_btn3.active{background: url(../img/login3_3.png) 10% 40% no-repeat; background-size:12%;}

	.edu_area_tab li{padding-left:50px;}

	.write_form .row.cleaning .label{height:45px;}
	.write_form .row.cleaning{height:270px;}


	.write_form .row.cleaning_1{height:150px;}

	.cleaning_2{height:265px;}

	.write_form .row.cleaning{height:330px;}

	.edu_area_tab li .login_tit{padding-top:0;}

}

@media screen and (max-width: 379px){
	.moduleCall{width:95%;}
	.edu_area_tab li{width:100%; margin:0; height:70px; margin-top:10px; padding-top:0; display:flex; align-items:center;}
	.edu_area_tab li img{padding-left:50px; width:13%;}
	.edu_area_tab li p{display:none;}

	.edu_area_tab li a{padding-top:40px;}

	.login_btn1{background: url(../img/login1.png) 10% 40% no-repeat; background-size:12%;}
	.login_btn2{background: url(../img/login2.png) 10% 40% no-repeat; background-size:12%;}
	.login_btn3{background: url(../img/login3.png) 10% 40% no-repeat; background-size:12%;}

	.edu_area_tab .login_btn1.active{background: url(../img/login1_1.png) 10% 40% no-repeat; background-size:12%;}
	.edu_area_tab .login_btn2.active{background: url(../img/login2_2.png) 10% 40% no-repeat; background-size:12%;}
	.edu_area_tab .login_btn3.active{background: url(../img/login3_3.png) 10% 40% no-repeat; background-size:12%;}

	.edu_area_tab li{padding-left:50px;}

	.write_form .row.cleaning_1{height:180px;}

	.write_form .row.cleaning{height:450px;}
}