@charset "UTF-8";

/* Today */
#multipleDiv_hufs_633 {background: #f8f8f7;}
.check .wrap-today,
.edit .wrap-today {padding: 94px 0 90px 0;}
.wrap-today {overflow: hidden;}
.wrap-today .container {position: relative;}

.wrap-today .title {position: relative; left: -50px; text-align: center; opacity: 0;}
.wrap-today .title .small {font-family: 'H Medium'; font-size: 24px; color: #333;}
.wrap-today .title .big {margin-top: 8px; font-family: 'H Bold'; font-size: 80px; line-height: 1; color: #000;}
.wrap-today .title .big em {font-family: 'H Medium'; font-size: 70px; color: #008395;}

.wrap-today .control {position: absolute; right: -50px; top: 93px; opacity: 0;}
.wrap-today .control .state {/*display: inline-block;*/ display: none; font-size: 0;}
.wrap-today .control .state .now {position: relative; font-family: 'Play Bold'; font-size: 80px; line-height: 1; color: #c4b7af;}
.wrap-today .control .state .now::before {content: '0';}
.wrap-today .control .state .slash {margin: 0 7px 0 0; font-family: 'Play Bold'; font-size: 30px; color: #9c9c9c;}
.wrap-today .control .state .total {font-family: 'Play Bold'; font-size: 30px; color: #9c9c9c;}
.wrap-today .control .state .total::before {content: '0';}
.wrap-today .control .button  {position: relative; z-index: 50; display: inline-block; margin-left: 75px;}
.wrap-today .control .button button {width: 40px; height: 15px; text-indent: -999999px;}
.wrap-today .control .button .prev {background: url('../images/btn-today-prev.png') no-repeat center;}
.wrap-today .control .button .prev:hover {background: url('../images/btn-today-prev-on.png') no-repeat center;}
.wrap-today .control .button .next {margin-left: 20px; background: url('../images/btn-today-next.png') no-repeat center;}
.wrap-today .control .button .next:hover {background: url('../images/btn-today-next-on.png') no-repeat center;}
.wrap-today .control .button .stop,
.wrap-today .control .button .play {display: none; width: 9px; height: 16px; margin-left: 20px;}
.wrap-today .control .button .stop.on,
.wrap-today .control .button .play.on {display: inline-block}
.wrap-today .control .button .stop {background: url('../images/btn-today-stop.png') no-repeat center bottom;}
.wrap-today .control .button .play {background: url('../images/btn-today-play.png') no-repeat center bottom;}
.wrap-today .control .button .more {
    font-weight: 200;
    color: #ccc;
    font-size: 0;
    background: url(https://dep.hufs.ac.kr/Web-home/fnct/recentBbs/hufs_professors/images/btn-latest-more.png)center center no-repeat;
    background-size: 25px 25px;
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #f8f8f7;
    line-height: 50px;
    margin-left: 10px!important;}
.wrap-today .control .button .more:hover{
    font-weight: 200;
    color: #ccc;
    font-size: 0;
    background: url(https://dep.hufs.ac.kr/Web-home/fnct/recentBbs/hufs_professors/images/btn-latest-more.png)center center no-repeat;
    background-size: 25px 25px;
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #959393;
    line-height: 50px;
    margin-left: 10px!important;border-radius:50%;}
.wrap-today .list {margin-top: 5px;}
.wrap-today .list ul {display: inline-block; width: 100%; font-size: 0;}
.wrap-today .list li {float: left; width: 33.333%; }
.wrap-today .list li a {display: block; position: relative; top: 50px; opacity: 0;}
.wrap-today .list .text strong {overflow: hidden; display: -webkit-box; margin-top: 38px; font-family: 'Noto Medium'; font-size: 25px; line-height: 1.25; color: #000; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: color .5s;}
.wrap-today .list a:hover .text strong {color: #008395;}
.wrap-today .list .text p {overflow: hidden; display: -webkit-box; margin-top: 16px; font-family: 'Noto Light'; font-size: 18px; color: #333; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.wrap-today .slider .slick-slide {margin: 0 62.5px;}
.wrap-today .slider .slick-list {margin: 0 -62.5px; padding-top: 30px;}
.wrap-today .slider li a {outline: none;}
.wrap-today .slider li a:focus-visible::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #000;}
.wrap-today .slider .thumb {position: relative; overflow: hidden; display: flex !important; justify-content: center; align-items: center; height: 350px; text-align: center; transition: box-shadow .5s;}
.wrap-today .slider .thumb img {width: auto; max-width: none; height: 120% }
.wrap-today .slider a:hover .thumb {box-shadow: 1px 1px 13px rgba(0,0,0,.2);}

@media all and (max-width: 1620px) {
  .wrap-today .control {right: 40px !important;}
}

@media all and (max-width: 1450px) {
  .check .wrap-today,
  .edit .wrap-today {padding: 50px 0;}

  .wrap-today .title .small {font-size: 18px;}
  .wrap-today .title .big {font-size: 60px;}
  .wrap-today .title .big em {font-size: 55px;}

  .wrap-today .control {top: 66px;}
  .wrap-today .control .button {margin-left: 40px;}
  .wrap-today .control .state .now {font-size: 60px;}
  .wrap-today .control .state .total {font-size: 20px;}

  .wrap-today .list .text strong {margin-top: 25px; font-size: 19px;}
  .wrap-today .list .text p {margin-top: 10px; font-size: 16px;}
  .wrap-today .slider .slick-slide {margin: 0 20px;}
  .wrap-today .slider .slick-list {margin: 0 -20px; padding-top: 28px;}
  .wrap-today .slider .thumb {height: 280px;}
  .wrap-today .slider .thumb img {height: 120%;}
}

@media all and (max-width: 1440px) {
  .wrap-today .slider .slick-slide {margin: 0 40px;}
  .wrap-today .slider .slick-list {margin: 0 -40px;}
}

@media all and (max-width: 1400px) {
  .wrap-today .title {left: 0; opacity: 1;}
  .wrap-today .control {right: 0; opacity: 1;}
  .wrap-today .list li a {top: 0; opacity: 1;}
}

@media all and (max-width: 1000px) {
  .check .wrap-today,
  .edit .wrap-today {padding: 40px 0 23px 0;}

  .wrap-today .title .small {font-size: 16px;}
  .wrap-today .title .big {font-size: 50px;}
  .wrap-today .title .big em {font-size: 45px;}

  .wrap-today .control {top: 54px;}

  .wrap-today .list .text strong {font-size: 16px;}
  .wrap-today .list .text p {margin-top: 10px; font-size: 13px;}
  .wrap-today .slider .slick-slide {margin: 0 10px;}
  .wrap-today .slider .slick-list {margin: 0 -10px;}
  .wrap-today .slider .thumb {height: 230px;}
}

@media all and (max-width: 660px) {
  #multipleDiv_hufs_633 {margin-top: -1px;}
  .check .wrap-today,
  .edit .wrap-today {padding: 26px 0 23px 0;}
  .wrap-today .title {text-align: left;}
  .wrap-today .title .big {margin-top: 1px; font-size: 30px;}
  .wrap-today .title .big em {font-size: 30px;}

  .wrap-today .control {right: 30px !important; top: 28px;}
  .wrap-today .control .state .now {font-size: 20px;}
  .wrap-today .control .state .slash {font-size: 20px;}
  .wrap-today .control .button {margin-left: 24px;}
  .wrap-today .control .button button {width: 32px;}
  .wrap-today .control .button .prev {background-position: left center !important;}
  .wrap-today .control .button .next {margin-left: 10px; background-position: right center !important;}
  .wrap-today .control .button .stop,
  .wrap-today .control .button .play {margin-left: 10px;}

  .wrap-today .list ul {width: 140%;}
  .wrap-today .list .text strong {height: 39px;}
  .wrap-today .slider .slick-list {padding-top: 15px;}
  .wrap-today .slider .thumb img {height: 145%;}
}

@media all and (max-width: 550px) {
  .wrap-today .slider .thumb img {height: 115%;}
}