.result-col {background: transparent;}
.result-col .card{background: transparent;}

.school-box {position:relative;background: white; padding:1rem 1.3rem; margin: 1rem 0; box-shadow: 0 1px 4px rgba(0,0,0,.098), 0 0 2px rgba(0,0,0,.098);padding: 0;height: 200px;}
.school-box:hover {background-color:#f0f8ff}
.school-box h3 a {font-size: 1.275rem; display: block;line-height: 20px; padding-top: 8px;}
.school-box h3 a:hover {text-decoration: none;}
.school-box .summary-wrap {padding:1.2rem 1rem 1.2rem 1.5rem;}
.school-box .text-sm {font-size:0.825rem; line-height: 10px;}
.school-box .ranking, .school-box .ranking a {color: #e83e8c; font-weight: 500; font-size: 0.875rem; padding-bottom: 1rem;}
.school-box .inst-thumb {overflow: hidden; height: 100%; text-align: right;}
.school-box .inst-thumb img {margin-left: -25%; height: 100%}

.school-box ul.desc-line {padding-left:0px;}
.school-box ul.desc-line li {font-size: 0.85rem; position: relative; color: #666; list-style: none; display: inline-block; padding-right: 20px; line-height: 16px; padding-bottom: 8px;}
.school-box ul.desc-line li:not(last-child):after {position: absolute;content:"·";color:#bababa}
.school-box ul.desc-line li span,.school-box ul.desc-line li strong {display: inline-block;}
.school-box ul.desc-line li span {padding-right: 12px;}
.school-box ul.desc-line li strong {font-weight: 500; color: #121212}


#close-filter, #change-search {display: none;}
.paging.mobile-page {display: none}
@media screen and (min-width: 1800px) { .school-box .inst-thumb img {margin-left: 0} }
@media screen and (max-width: 1280px) {
  .school-box .inst-thumb img {height: calc(100% - 0.6rem);}
  .school-box {height: 230px;}
}
@media screen and (max-width: 991px) {
  .school-box .inst-thumb {display: none}
  .result-col .card-body {padding-right:0}
  .school-box.grid-d {display: block;}
}
@media (max-width: 640px) {
  .school-box {height: auto;}
  .school-box ul.desc-line {padding-left: 0;}
  .school-box .summary-wrap { padding: 1.2rem 0.5rem 1.2rem 1rem;}
  .result-col .card-body {padding-right: 1.25rem;}
  .grid-d .filter-col .adcard {width:0 ; display: none;}
  .grid-d .filter-col .card-body {padding: 0}
  body.frozen {height: 100vh; overflow: hidden}
  #close-filter {display: block; position: relative;}
  #change-search {display: inline-block; }
  #close-filter i {position: absolute; top: -35px; right: 14px; padding: 7px; border: 1px solid #aaa; border-radius: 5px;}
  .paging {display: none;}
  .paging.mobile-page {display: flex}
  .paging .prev-next {border: 1px solid #ddd;background: white;}
  .paging .prev-next.hide {opacity: 0;cursor: default;}
}

@media (max-width: 431px) {
  .result-col .card-header,   .result-col .card-body {padding-left:0; padding-right:0}
}


#search-filter {    transition: left 0.4s ease-in-out 0s }
#search-filter .search-filter-wrap label {display: inline-block;font-size: 12px;font-weight: 500;}
#search-filter .search-filter-wrap label.g-title {display: block;}
#search-filter .search-filter-wrap input {display: block; font-size: 14px;width: 100%; border: 1px solid #ddd; padding: 5px;}
#search-filter .search-filter-wrap div .search-item-wrap {display: block;width:100%;padding:8px 0}
#search-filter .search-filter-wrap select {width:100%;background-color: #FDFDFD;font-size: 13px;}
#search-filter .search-filter-wrap #search-by-name input[type="text"] {width: 100%}
#search-filter .search-filter-wrap .buttons {text-align: center;margin-top: 16px;}
#search-filter .search-filter-wrap .buttons input,
#search-filter .search-filter-wrap .buttons button {}

#search-filter input, #search-filter select {position:relative}

.current-filter-wrap span {display: inline-block;padding:3px 10px; background: #1565c0;font-size: 12px;margin-right: 8px;color:white;font-weight: 500;}
.current-filter-wrap span:last-child {margin-right: 0;}
.current-filter-wrap span i {font-size: 10px;padding-left: 10px;cursor: pointer;}

.paging {text-align: center;}
.paging span.page-box {display: inline-block;padding:5px 12px;font-size:14px;margin:0 2px;background: #36b9cc;color:white;cursor: pointer;}
.paging span.page-box.cur {cursor: default;background: #444;}

.ui-widget-header {background: #36b9cc !important;}



@media screen and (max-width: 640px) {

  #search-filter {width: calc(100vw - 20px);position:absolute;;left:-100vw;transition: left 0.4s ease-in-out 0s; background: white;z-index: 100;
      padding-top: 60px; padding-bottom: 100px; height: 90vh; overflow-y: scroll}
  #search-filter.active {left:-5px;}
  #search-filter .search-filter-wrap form {margin-left: 12px; margin-right: 12px;}
  #search-result {width:100%;float:none;position: relative; transition: left 0.4s ease-in-out 0s;left:0}
  #search-result.pushed {left:280px;overflow: hidden;width: auto}
  #search-result .entry-snippet {float:none}

  #search-by-name button {width: 27%;letter-spacing: 0;padding: 6px 10px;}
  .current-filter-wrap span {margin-bottom: 8px;}
}
