@charset "UTF-8";

/* .cSearchWrap { text-align:center; padding:20px; background:#f5f6f8; }
.cSearchWrap .box-title { display: inline-block; background: url("/sites/style_guide/images/common/ico-search-title.png") no-repeat left center; font-family: 'Noto Regular'; font-size: 18px; margin-right: 20px; padding:13px 0 13px 55px; color: #004d5d; }
.cSearchWrap .box-sel {position: relative; top: 0px; display: inline-block; margin-right: 2px; vertical-align: middle;}
.cSearchWrap .box-sel select {background: #fff url('/sites/style_guide/images/common/arrow-search.png') no-repeat right center; font-size: 16px; font-family: 'Noto Light'; color: #9d9d9d; border:1px solid #ccd0d7; height: 55px; min-width: 130px; padding-left: 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.cSearchWrap .box-search {position: relative; top:0; display: inline-block; vertical-align: middle;  background: #fff; height: 55px; line-height: 55px; border:1px solid #ccd0d7; min-width: 400px;}
.cSearchWrap .box-search input {position: relative; top: -1px; width: 100%; height: 100%; background: transparent; border: 0; font-family: 'Noto Light'; font-size: 16px; text-indent: 10px; color: #9d9d9d;}
.cSearchWrap .box-search input::placeholder {color: #9d9d9d;}
.cSearchWrap .box-search input[type="button"] {position: absolute; right:0; top: 0; width: 50px; height: 55px; background: url('/sites/style_guide/images/common/ico-search-btn.png') no-repeat center center; text-indent: -9999px; cursor: pointer;}

@media all and (max-width:780px) {
    .cSearchWrap {display: table; width: 100%; table-layout: fixed;}
	.cSearchWrap .box-title {display: none;}
    .cSearchWrap .box-sel {width:35%; display: table-cell; margin-right: 0; padding-right: 20px;}
    .cSearchWrap .box-sel select {min-width: auto; width: 100%;}
    .cSearchWrap .box-search {display: table-cell;}
} */

.staff-wrap {position: relative; padding:55px 160px;background:#F1EEE9; }
.staff-wrap .cSearchWrap {text-align: center; font-size: 0;}
.staff-wrap .box-title {font-size: 40px; color:#000; font-family: 'Pre Bold'; margin-bottom: 12px;}
.staff-wrap .box-sel {display: inline-block; vertical-align: middle; margin-right: 20px;}
.staff-wrap .box-sel select {min-width:204px; height:60px; border-radius:4px; color:#515151; font-size: 16px; font-family: 'Pre Medium'; padding:0 20px; border:1px solid #D9D9D9; background: #fff url('../images/select-arrow.svg') no-repeat right 20px center;; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.staff-wrap .box-search {position: relative; height:60px; border:1px solid #d9d9d9; min-width:400px; display: inline-block; border-radius:4px; vertical-align: middle;}
.staff-wrap .box-search input {position: relative; height:100%; width:100%; border-radius:4px; color:#515151; font-size: 16px; font-family: 'Pre Medium'; padding:0 20px; border:none;}
.staff-wrap .box-search input[type="button"] {position: absolute; right:0; top: 0; width: 60px; height: 60px; background: url('../images/ico-search-btn.svg') no-repeat center center; text-indent: -9999px; cursor: pointer;}

.staff-table {position: relative; margin-top: 48px;}
.staff-table thead th {background:#000; color:#fff; font-size: 16px; font-family: 'Pre Medium'; font-weight: normal; line-height: 26px; padding:15px 15px; }
.staff-table tbody tr {min-height:100px; border-bottom:1px solid #d9d9d9;}
.staff-table tbody tr td {font-size: 16px; font-family: 'Pre Medium'; line-height: 26px; color:#707070; padding:27px 15px; background: #fff;}
.staff-table tbody tr:hover td {background:#F7F7F7; }
.staff-table .staff-name {background:#fff; font-size: 20px; font-family: 'Pre Bold'; color:#000; line-height:30px;}
.staff-table .staff-name a {display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.staff-table .staff-name .new {width:25px; height:25px; background:#2822E9; border-radius:50%; text-indent: -9999px; display: inline-block; position: relative; top:2px; margin-left: 8px;}
.staff-table .staff-name .new::after {content:'N'; font-family: 'Pre Bold'; font-size: 16px; width:25px; height:25px; position: absolute; left:0; top:0; color:#fff; z-index: 1; text-indent: 0; text-align: center; line-height: 25px;}

.staff-wrap .no-data {position: relative; background: #F8F7F4; font-size: 20px; font-family: 'Pre Bold'; min-height:168px; display: flex; align-items: center; justify-content: center; margin-top: 48px; border-radius:4px; }

@media (max-width:1280px) {
  .staff-wrap {padding:40px 100px;}
}
@media (max-width:1000px) {
  .staff-wrap {padding:40px 50px;}
}
@media (max-width:800px) {
  .staff-wrap {padding: 40px 20px;}
  .staff-wrap .cSearchWrap {text-align:left;}
  .staff-wrap .box-sel {margin-right: 10px; }
  .staff-wrap .box-sel select {min-width:155px; height: 50px;}
  .staff-wrap .box-search {min-width:320px; height: 50px;}
  .staff-wrap .box-search input[type="button"] {width:50px; height:50px;}
  .staff-table .staff-name {font-size: 18px;}
}
@media (max-width:650px) {
  .staff-wrap .box-title {text-align: center;}
  .staff-wrap .box-sel,
  .staff-wrap .box-search  {margin-bottom: 10px; min-width:100%;}
  .staff-table {margin-top: 30px;}
}