@charset "UTF-8";

/* 공지사항 */
#multipleContentsDiv_hufs_734 {overflow: hidden; max-width: 1600px;}
#menu11101_obj721 {position: relative; left: -50px; padding-right: 110px; opacity: 0;}
#menu11101_obj722 {position: relative; right: -50px; padding-left: 110px; opacity: 0;}

.check .wrap-notice,
.edit .wrap-notice {margin: 90px 0 100px 0;}
.wrap-notice {position: relative; min-height: 673px; text-align: center;}
.wrap-notice .title {position: relative; display: inline-block; text-align: center;}
.wrap-notice .title .btn-notice {position: relative; padding: 0 40px; font-family: 'Noto Bold'; font-size: 38px; line-height: 1; color: #212121;}
.wrap-notice .title .btn-notice:hover,
.wrap-notice .title .btn-notice.on {color: #e63b53;}
.wrap-notice .title::after {content: ''; position: absolute; right: -4px; top: 18px; width: 7px; height: 7px; background: #7f7f7f; border-radius: 100%;}
.wrap-notice .title.last::after {display: none;}

.wrap-notice .list {display: none; position: absolute; left: 0; top: 103px; width: 100%; text-align: left;}
.wrap-notice .list.on {display: block;}
.wrap-notice .list ul {padding-bottom: 5px; border-top: 1px solid #000; border-bottom: 1px solid #000;}
.wrap-notice .list .first {border-bottom: 1px solid #e7e7e7;}
.wrap-notice .list .first .box {display: block;}
.wrap-notice .list .first .subject {overflow: hidden; display: -webkit-box; margin-bottom: 13px; font-family: 'Noto Medium'; font-size: 25px; line-height: 1.1; color: #323232; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.wrap-notice .list .first .box:hover .subject {color: #008395;}
.wrap-notice .list .first .subject span {position: relative;}
.wrap-notice .list .first .subject span::after {content: ''; position: absolute; left: 0; bottom: -3px; width: 0; height: 1px; background: #77afba; transition: width .5s;}
.wrap-notice .list .first .box:hover .subject span::after {width: 100%;}
.wrap-notice .list .first .con {overflow: hidden; display: -webkit-box; margin-bottom: 10px; font-family: 'Noto Light'; font-size: 17px; color: #565656;  -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.wrap-notice .list .first .date {font-family: 'Play Regular'; font-size: 16px; color: #666;}
.wrap-notice .list li {display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; padding: 0 30px;}
.wrap-notice .list li.first {display: block; margin-bottom: 24px; padding: 20px 30px 15px 30px;}
.wrap-notice .list li.nodata {display: block; width: 100%; margin-bottom: 0; padding: 200px 0; text-align: center;}
.wrap-notice .list .sub-subject {overflow: hidden; display: -webkit-box; flex: 1; font-family: 'Noto Regular'; font-size: 18px; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: #323232;}
.wrap-notice .list .sub-subject:hover {color: #008395;}
.wrap-notice .list .sub-subject span {position: relative; background: linear-gradient(to bottom, transparent 96%, #77afba 0) left center no-repeat; background-size: 0; transition: .5s;}
.wrap-notice .list .sub-subject:hover  span{background-size: 100% auto;}
.wrap-notice .list .sub-date {width: 125px; font-family: 'Play Regular'; font-size: 16px; text-align: right; color: #666;}
.wrap-notice .list .more {text-align: center;}
.wrap-notice .list .more a {display: inline-block; width: 100%; max-width: 210px; height: 60px; margin-top: 45px; background: #fff; border: 1px solid #152c46; font-family: 'Play Bold'; font-size: 15px; line-height: 60px; color: #152c46;}
.wrap-notice .list .more a:hover {background: #00284a; border: 1px solid #00284a; color: #fff;}
.wrap-notice .list::after {content: ''; position: absolute; right: -110px; top: 0; width: 1px; height: 100%; width: 1px; height: 100%; background: #ccc;}
#menu11101_obj722 .wrap-notice .list::after {display: none;}

@media all and (max-width: 1620px) {
  #multipleContentsDiv_hufs_734 {padding: 0 40px;}
  #menu11101_obj721 {padding-right: 70px;}
  #menu11101_obj722 {padding-left: 70px;}
  .wrap-notice .list::after {right: -70px;}
}

@media all and (max-width: 1450px) {
  .wrap-notice {min-height: 496px;}
  #menu11101_obj721 {padding-right: 50px;}
  #menu11101_obj722 {padding-left: 50px;}

  .check .wrap-notice,
  .edit .wrap-notice {margin: 50px 0;}
  .wrap-notice .title::after {top: 13px;}
  .wrap-notice .title .btn-notice {padding: 0 30px; font-size: 30px;}

  .wrap-notice .list {top: 60px;}
  .wrap-notice .list::after {right: -50px;}
  .wrap-notice .list li.first {margin-bottom: 16px; padding: 16px 0 12px 0;}
  .wrap-notice .list li.nodata {padding: 160px 0;}
  .wrap-notice .list .first .subject {margin-bottom: 10px; font-size: 19px;}
  .wrap-notice .list .first .con {margin-bottom: -3px; font-size: 16px;}
  .wrap-notice .list .first .date {font-size: 13px;}

  .wrap-notice .list li {margin-bottom: 10px; padding: 0 0;}
  .wrap-notice .list .sub-subject {font-size: 16px;}
  .wrap-notice .list .sub-date {font-size: 16px;}
  .wrap-notice .list .more a {max-width: 140px; height: 50px; margin-top: 30px; font-size: 15px; line-height: 50px;}
}

@media all and (max-width: 1400px) {
  #menu11101_obj721 {left: 0; opacity: 1;}
  #menu11101_obj722 {right: 0; opacity: 1;}
}

@media all and (max-width: 1000px) {
  .wrap-notice {min-height: 446px;}
  #menu11101_obj721 {padding-right: 40px;}
  #menu11101_obj722 {padding-left: 40px;}

  .wrap-notice {margin: 40px 0;}
  .wrap-notice .title::after {top: 10px;}
  .wrap-notice .title .btn-notice {font-size: 25px;}

  .wrap-notice .list::after {right: -40px;}
  .wrap-notice .list .first .subject {font-size: 16px;}
  .wrap-notice .list .first .con {font-size: 13px;}
  .wrap-notice .list .first .date {font-size: 11px;}

  .wrap-notice .list .sub-subject {font-size: 13px;}
  .wrap-notice .list .sub-date {font-size: 11px;}
  .wrap-notice .list .more a {height: 40px; font-size: 12px; line-height: 40px;}
  .wrap-notice .list li.nodata {padding: 143px 0;}
}

@media all and (max-width: 820px) {
  .wrap-notice .title::after {top: 7px;}
  .wrap-notice .title .btn-notice {padding: 0 15px; font-size: 22px;}
}

@media all and (max-width: 660px) {
  #multipleContentsDiv_hufs_734 {padding: 0 30px;}
  #menu11101_obj721 {padding-right: 0; border-bottom: 1px solid #ccc;}
  #menu11101_obj722 {padding-left: 0;}

  .check .wrap-notice,
  .edit .wrap-notice {min-height: 436px; margin: 30px 0;}
  .wrap-notice .list {top: 50px;}
  .wrap-notice .list::after {display: none;}

  .wrap-notice .title::after {top: 10px;}
  .wrap-notice .title .btn-notice {padding: 0 30px; font-size: 25px;}
}