@charset "utf-8";

/************************************** import **************************************/

/* view type css */
@import url("../view-type/view-type.css");

/* category ui css */
@import url("../../../category/css/category/category.css");




/************************************** 공통 **************************************/
.sec-search-area { padding-bottom: 100px;}




/************************************** 페이지 타이틀, 검색결과 **************************************/

/* 필터 */
.sec-search-area.section-width {padding-top:0}
.sch-info-area { position: relative; width:100%; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #ddd; }
.sch-info-area .view-filter-wrap { float: right; }
.sch-info-area .view-filter-wrap .filter-wrap { float: right; margin-top: -9px; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area { background: #f1f1f1; display: inline-block; border-radius: 7px; position: relative; padding: 10px 30px 10px 20px; cursor: pointer; font-weight: 600; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area:after { content: "";  position: absolute; top: 48%; right: 10px; width: 0; height: 0; margin-top: -1px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #ccc;transition: border-top .25s ease; transform: rotate(0); transition: transform .2s; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area:hover { background: #e9e9e9; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-content { display: inline-block; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-content .filter-type { display: inline-block; margin-right: 8px; font-size:1.3rem; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-content .filter-name { color: #555; font-weight: 600; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-content .select { color: var(--theme-color); }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area label.filter-toggle { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 2; display: block; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer { display: none; position: absolute; right: -1px; top: 45px; z-index: 2; width: 300px; background: #fff; border: 1px solid #f0f0f0; height: auto; overflow: hidden; cursor: default; border-radius: 5px; box-shadow: 0 1px 7px -1px rgb(0,0,0,.2); }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .filter-type { padding:15px; border-bottom: 1px solid #ebebeb; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .filter-type:nth-child(4) { border-bottom:0; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .filter-type .filter-name { display:block; padding-bottom:12px;font-size:1.4rem; color:#7d7f90;}
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .filter-type ul li { display: inline-block; }
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .btn-wrap { margin-top: 15px; float: none;}
.sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer .btn-wrap button { font-weight: 600; min-width: auto; padding:0 25px;}
.sch-info-area .view-filter-wrap .filter-wrap .filter-area.on .filter-detail-set-layer { display: block; padding-bottom:10px;}
.sch-info-area .view-filter-wrap .filter-wrap .filter-area.on:after { transform: rotate(180deg); }

/* 보기 방식 */
.sch-info-area .view-filter-wrap .view-type { float:left; }
.sch-info-area .view-filter-wrap .view-type .item { float:left; position: relative; width:18px; height:18px; background-repeat: no-repeat; background-size: 18px 36px; background-position: top; margin-right:13px; cursor: pointer; }
.sch-info-area .view-filter-wrap .view-type .item:last-child { margin-bottom: 0; }
.sch-info-area .view-filter-wrap .view-type .item.v-select { background-position: bottom;}
.sch-info-area .view-filter-wrap .view-type .item.card { background-image: url('../../img/search/icon_type_card.svg'); }
.sch-info-area .view-filter-wrap .view-type .item.list { background-image: url('../../img/search/icon_type_list.svg'); }
.sch-info-area .view-filter-wrap .view-type .item.box { background-image: url('../../img/search/icon_type_box.svg'); }

.sch-info-area .result-summary { float: left; position: relative; font-size: 1.7rem; margin-top: 5px; font-weight:800}
.sch-info-area .result-summary .label{display: inline-block; height: 20px;padding: 0 15px;background: #f0ecff;line-height: 20px;font-size: 13px;border-radius: 10px;margin-left: 10px;}
.sch-info-area .result-summary b { color:var(--theme-color); }

@media(max-width:768px) {
    .sch-info-area .result-summary {font-size:1.5rem;}
    .sch-info-area .result-summary .label {font-size:11px}
}

@media (max-width: 600px) {
    .sch-info-area { margin:0; border:0; }
    .sch-info-area .result-summary { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #ddd; width: 100%; }
    .sch-info-area .view-filter-wrap { margin-top: 10px; width:100%; }
    .sch-info-area .view-filter-wrap .view-type { float: right; }
    .sch-info-area .view-filter-wrap .filter-wrap { float: left;}
    .sch-info-area .view-filter-wrap .filter-wrap .filter-area .filter-detail-set-layer { right: inherit; left:0; }
}


/* locale */
.top-locale-wrap { padding-bottom:5px}
.summary-locale-wrap {float:right;}
.summary-locale-wrap h4 {float:left; margin-right:15px; line-height:33px}
.summary-locale-wrap ul {float:left;}
.summary-locale-wrap img {width:15px; height:15px;margin-right:5px;border:1px solid #ddd;border-radius: 50%;}
.summary-locale-wrap .select { display: inline-block; width: 120px;border: 1px solid #ddd; border-radius: 5px; cursor:pointer;}
.summary-locale-wrap .select .selected {display: flex;justify-content: space-between;padding: 8px 5px;}
.summary-locale-wrap .select .selected .selected-value {max-width: 90px;}
.summary-locale-wrap .select .selected .arrow {width: 24px;background: url("../../img/common/select_arrow.png") no-repeat 70% 50%;background-size: 42% 42%;}
.summary-locale-wrap .select ul { width: 120px; border: 1px solid #ddd; position: absolute; background: #fff; border-top: none; margin: 1px 0 0 -1px; cursor: pointer; z-index:30; display:none;}
.summary-locale-wrap .select ul li {padding: 8px 5px;}
.summary-locale-wrap .select ul li:hover {background:#f7f7f7}
.summary-locale-wrap .select ul.on  {display:block;}

@media(max-width:768px) {
    .top-locale-wrap { padding-bottom:10px}
}

@media(max-width:500px) {
    .summary-locale-wrap h4 {font-size:1.2rem; line-height:25px;}
    .summary-locale-wrap .select {width:100px;}
    .summary-locale-wrap .select ul {width:100px}
    .summary-locale-wrap .select .selected {padding:5px;}
}