@charset "UTF-8";

.gachon-news {position:relative; overflow:hidden;}
.gachon-news .gachon-news-top {margin-bottom: 0px;}
.gachon-news .gachon-news-top .title {float: left; position:relative; display:inline-block; font-size: 40px; color: #111111; font-family: 'Roboto'; font-weight: 900;}
.gachon-news .gachon-news-top .title span.blue {color: #114B94;}


.gachon-news .gachon-news-top .news-url {float: right; margin-top: 7px;}
.gachon-news .gachon-news-top .news-url > p {float: left; font-size: 20px; line-height: 45px; color: #7d7c7b; font-family: "Noto DemiLight"; margin-right: 15px;}
.gachon-news .gachon-news-top .gachon-news-select  {float: left; }
.gachon-news .gachon-news-top .gachon-news-select select {position: relative; width: 170px; height: 60px; padding-right: 40px; padding-left: 30px; margin-right: 5px; cursor: pointer; background: #DDDDDD url("../images/btn_select1.png") no-repeat 140px center; appearance: none; font-size: 20px; line-height: 60px; color: #111111; font-family: "Noto DemiLight"; border: 0;}
/* .gachon-news .gachon-news-top .gachon-news-select select::after {content: ""; position: absolute; width: 9px; height: 7px; background: url("../images/btn_select1.png") no-repeat; top: 50%; margin-top: -3.5px; right: 30px;} */
.gachon-news .gachon-news-top .gachon-news-select > p {font-size: 20px; line-height: 60px; color: #111111; font-family: "Noto DemiLight";}
/* .gachon-news .gachon-news-top .gachon-news-select > select {position: absolute; width: 100%; left: 0; z-index: 10; border: 2px solid transparent; background: #fff; max-height: 0; overflow: hidden; transition: all 0.5s;} */
/* .gachon-news .gachon-news-top .gachon-news-select.open > ul {max-height: 200px; border-color: #ddd;} */
.gachon-news .gachon-news-top .gachon-news-select > ul li {}
.gachon-news .gachon-news-top .gachon-news-select > ul li button {position: relative; display: block; font-size: 15px; color: #111; font-family: "Noto DemiLight"; transition: background 0.3s; padding: 10px 15px; width: 100%; text-align: left;}
.gachon-news .gachon-news-top .gachon-news-select > ul li:hover button {background: #eee;}

/* .gachon-news .gachon-news-top .news-url .more {float: left; display: inline-block; width: 50px; height: 40px; text-align: center; font-family: 'Roboto'; font-size: 20px; font-weight: 600; color: #fff; background: #004E96; line-height: 45px; letter-spacing: 0; position: relative;}
.gachon-news .gachon-news-top .news-url .more span {width: 16px; height: 16px; background: url(../images/more_Btn.png); display: block; text-indent: -9999px; left: 50%; top: 50%; margin-top: -8px; margin-left: -8px; position: absolute;} */

.gachon-news .gachon-news-top .news-url .more {position: relative; float: left; display: inline-block; text-indent:-99999px;  width:45px; height:45px; border: 1px solid #BDBDBD;}
.gachon-news .gachon-news-top .news-url .more::after {content: ""; position: absolute; width: 17px; height: 17px; background:url('../images/btn_notice_more.png') no-repeat center center; left: 50%; margin-left: -8.5px; top: 50%; margin-top: -8.5px; transform: rotate(0deg); transition: transform 0.3s;}
.gachon-news .gachon-news-top .news-url .more:hover::after {transform: rotate(180deg);}

/* .gachon-news .gachon-news-top .news-url .more span {display: inline-block; transform: translateY(0);}
.gachon-news .gachon-news-top .news-url .more:hover span {animation-duration: 0.5s; animation-name: uptotxt;}



@keyframes uptotxt {
  0% {
		transform: translateY(0);
  }
  50% {
		transform: translateY(-10px);
  }
	100% {
		transform: translateY(0);
  }
} */

.gachon-news > ul > li {opacity: 0; visibility: hidden; height: 0; overflow: hidden; transition: opacity 0.3s;}
.gachon-news > ul > li.on {opacity: 1; visibility: visible; height: 100%;}

.gachon-news > ul > li > .more {position: relative; display: block; width:200px; height:60px; margin: 50px auto 0; border: 1px solid #004E96; font-family: 'Roboto'; font-size: 14px; text-align: center; line-height: 60px; letter-spacing: 1px; color: #004E96; overflow: hidden;}

.gachon-news > ul > li > .more::before {content: ""; position: absolute; width: 0; left: -40px; top: 0; height: 100%; background: #004E96; transform: skewX(-40deg); transition: width 0.5s;}

.gachon-news > ul > li > .more span {position: relative; z-index: 3;}

.gachon-news > ul > li > .more:hover {color: #fff;}
.gachon-news > ul > li > .more:hover::before {width: 150%;}

.gachon-news .slider {width:105%;}
.gachon-news .slider li {padding:0 60px 0 0;}
.gachon-news .slider .con {display:inline-block; width:100%; padding:20px 0; border-bottom:1px solid #d0d0d0;}
.gachon-news .subject {position:relative; font-size:0.9vw; color:#3e3e3e;}
.gachon-news .con {display: inline-block; width: 100%;}
.gachon-news .con a {position:relative; display: block;}

.gachon-news .con a:hover:before {width:100%;}
.gachon-news .date {float:right; font-size:0.85vw; color:#a2a2a2}
.gachon-news .pc-list {margin-top: 10px;height: 545px;}
.gachon-news .pc-list ul {overflow: hidden;}
.gachon-news .pc-list li {float: left; width: 23.5%; padding-right: 3.5%; padding-bottom: 25px;}
.gachon-news .pc-list li:nth-child(3), .gachon-news .pc-list li:nth-child(5) {width: 20%; padding-right: 0;}
.gachon-news .pc-list li .con-img {width: 100%; height: 170px; border: 1px solid #EEEEEE;}

.gachon-news .pc-list li .con-info {margin-top: 20px;}
.gachon-news .pc-list li .title {font-size: 16px; font-family: "Noto Medium"; letter-spacing: -0.5px; color: #111111;}
.gachon-news .pc-list li .title span {position: relative; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.gachon-news .pc-list li .title span::before {content: ""; position: absolute; left: 0; bottom: 0; left: 0; width: 0; height: 2px; background: #004E96; transition: width 0.3s;}
.gachon-news .pc-list li .info {font-size: 15px;line-height: 24px;letter-spacing: -0.5px;color: #666666;height: 24px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.gachon-news .pc-list li.first .info {display:none; font-size: 15px;line-height: 24px;letter-spacing: -0.5px;color: #666666;height: 24px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}

.gachon-news .pc-list li.nodata {text-align: center; padding: 20px 0; float: none; width: 100%; margin-top: 10%; font-size: 20px; color: #111; font-family: "Noto DemiLight";}

.gachon-news .pc-list a:hover .title {color: #004E96;}
.gachon-news .pc-list a:hover .title span::before {width: 100%;}

.gachon-news .m-list {display: none;}

@media all and (min-width:1056px) {
  .gachon-news .pc-list li.first {width: 53%; border-bottom: 1px solid #111111; padding-right: 0; margin-right: 3.5%; max-height: 628px; padding-bottom: 22px;}
  .gachon-news .pc-list li.first .con-img {height: 455px;}
  .gachon-news .pc-list li.first .con-info {margin-top: 23px;}
  .gachon-news .pc-list li.first .title {font-size: 24px;}
  .gachon-news .pc-list li.first .info {font-size: 16px; line-height: 28px; height: 56px; margin-top: 15px;}

  .gachon-news .pc-list li.top {padding-bottom: 50px;max-height: 272.5px;}
  .gachon-news .pc-list li.bottom {border-bottom: 1px solid #111111;max-height: 272.5px;}
}

@media all and (max-width:1055px) {
  .gachon-news .gachon-news-top {margin-bottom: 30px;}
  .gachon-news .gachon-news-top .title {font-size: 36px; line-height: 50px;}
  .gachon-news .gachon-news-top .news-url > p {font-size: 18px; line-height: 50px;}
  .gachon-news .gachon-news-top .gachon-news-select {width: 130px; height: 50px; padding-left: 10px; padding-right: 30px;}
  .gachon-news .gachon-news-top .gachon-news-select::after {right: 10px;}
  .gachon-news .gachon-news-top .gachon-news-select > p {line-height: 50px; font-size: 18px;}
  .gachon-news .gachon-news-top .news-url .more {}

  .gachon-news .pc-list {display: none;}
  .gachon-news .m-list {display: block; height: auto; margin-top: 0; max-height: 427px;}
  .gachon-news .m-list ul {margin: 0 -15px;}
  .gachon-news .m-list li {width: 505px; padding: 0 15px; margin-right: 0;}
  .gachon-news .con {border-bottom: 1px solid #111; padding-bottom: 20px;}
  .gachon-news .m-list li .con-img {width: 505px; height: 305px; border: 1px solid #EEEEEE;}
  .gachon-news .m-list li:nth-child(3), .gachon-news .m-list li:nth-child(5) {width: 505px;}
  .gachon-news .m-list li .title {font-size: 18px; letter-spacing: -0.5px; font-family: "Noto Medium"; color: #111111; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
  .gachon-news .m-list li .info {font-size: 16px; line-height: 28px; height: 56px; margin-top: 5px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;  word-break: break-all;}
  .gachon-news .m-list li .con-info {margin-top: 10px; width: 505px;}
  .gachon-news .m-list li.nodata {margin: 0 15px;}

  .gachon-news > ul > li > .more {width: 170px; height: 60px; line-height: 60px; margin: 30px auto 0;}
}

@media all and (max-width:767px) {
  .gachon-news .gachon-news-top {margin-bottom: 20px;}
  .gachon-news .gachon-news-top .title {font-size: 30px; line-height: 40px;}
  .gachon-news .gachon-news-top .news-url > p {display: none;}
  .gachon-news .gachon-news-top .gachon-news-select {width: 100px; height: 40px;}
  .gachon-news .gachon-news-top .gachon-news-select > p {line-height: 40px; font-size: 16px;}
  .gachon-news .gachon-news-top .news-url .more {}

  .gachon-news .con {padding-bottom: 10px;}
  .gachon-news .m-list ul {margin: 0;}
  .gachon-news .m-list li {padding: 0;}
  .gachon-news .m-list li .con-img  {width: 100%; height: 260px;}
  .gachon-news .m-list li .con-info {width: 100%; margin-top: 15px;}
  .gachon-news .m-list li .title {font-size: 16px;}
  .gachon-news .m-list li .info {display: none;}

  .gachon-news .slick-arrow {position: absolute; z-index: 5; width: 35px; height: 60px; top: 50%; margin-top: -60px; text-indent: -9999px;}
  .gachon-news .slick-prev {background: url("../images/btn_news_prev.png") no-repeat center; left: 0;}
  .gachon-news .slick-next {background: url("../images/btn_news_next.png") no-repeat center; right: 0;}

  .gachon-news > ul > li > .more {width: 150px; height: 50px; line-height: 50px; margin: 20px auto 0;}
}
