@charset "UTF-8";
/*-------------------------------------------------
Author : ksi
Create date : 2019-07-23
-------------------------------------------------*/
body { overflow-x: hidden; }

/* 배너 */
.banner-wrap { background: #0f1c2c; color: #fff; z-index: 9; position: relative; -webkit-transition: all .2s; transition: all .2s; }

.banner-wrap .banner-area { width: 86rem; max-width: 100%; margin: 0 auto; position: relative; padding: .6rem 0; }

.banner-wrap .banner-area .inner { visibility: visible; }

.banner-wrap .banner-area .container { overflow: hidden; height: 5rem; }

.banner-wrap .bx-wrapper { overflow: hidden; height: 5rem; }

.banner-wrap .bx-viewport { position: relative; width: 100%; }

.banner-wrap .bx-controls-direction { position: absolute; top: 50%; left: 0; width: 100%; height: 0; }

.banner-wrap .bx-controls-direction a { display: block; font-size: 0; position: absolute; top: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

.banner-wrap .bx-controls-direction a::before { display: block; line-height: 1; font-size: 2.4rem; color: #cfcfcf; font-family: "xeicon"; }

.banner-wrap .bx-controls-direction a.bx-prev { left: -1.7rem; }

.banner-wrap .bx-controls-direction a.bx-prev::before { content: '\e93d'; }

.banner-wrap .bx-controls-direction a.bx-next { right: -1.7rem; }

.banner-wrap .bx-controls-direction a.bx-next::before { content: '\e940'; }

.banner-wrap .slide-counter { position: absolute; top: 2.5rem; right: 5rem; font-family: "Montserrat"; font-weight: 600; }

.banner-wrap .bx-controls-auto { position: absolute; top: 2.5rem; right: 2.5rem; }

.banner-wrap .bx-controls-auto a { display: block; font-size: 0; }

.banner-wrap .bx-controls-auto a::before { font-size: 1rem; font-family: "xeicon"; line-height: 1; display: block; }

.banner-wrap .bx-controls-auto a.bx-stop::before { content: '\ea3b'; }

.banner-wrap .bx-controls-auto a.bx-start::before { content: '\ea3e'; }

.banner-wrap .today { position: absolute; top: 4rem; right: 1.2rem; font-size: .7rem; }

.banner-wrap .btn-close { display: block; position: absolute; bottom: -.8rem; right: 0; border-radius: 50%; width: 1.6rem; height: 1.6rem; text-align: center; background-color: #0f1c2c; }

.banner-wrap .btn-close i { position: absolute; font-size: .9rem; position: absolute; bottom: .2rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

.banner-wrap.close { margin-top: -6.2rem; }

.banner-wrap.close .inner { visibility: hidden; }

/* header */
#header::before { opacity: 0; -webkit-transition: all 1s; transition: all 1s; width: 0; }

#header .bg::before { top: 12rem; }

#header > .container { opacity: 0; -webkit-transition: all 0.7s; transition: all 0.7s; height: 0; overflow: hidden; }

/* 퀵메뉴 */
#btn-quick.white { background: transparent; }

#btn-movie { display: block; width: 5rem; height: 5rem; text-align: center; color: #fff; position: absolute; right: 0; top: 35%; z-index: 2; padding: 1rem; /*background:#f49f17;*/ }

#btn-movie i { font-size: 1.8rem; display: block; }

#btn-movie span { display: block; font-size: .65rem; font-family: "Montserrat"; font-weight: 700; }

#btn-home { display: block; width: 5rem; height: 5rem; text-align: center; color: #fff; position: absolute; right: 0; top: 35%; z-index: 2; opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; visibility: hidden; padding: 1rem; }

#btn-home i { font-size: 1.8rem; display: block; }

#btn-home span { display: block; font-size: .65rem; font-family: "Montserrat"; font-weight: 700; }

/* section1 */
#section1 { position: relative; }

#section1::before { content: ''; width: 20rem; background: #f49f17; position: absolute; bottom: 2.7rem; right: 0; z-index: 0; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; height: 0; }

#section1 .top { padding-top: 4rem; position: relative; z-index: 2; }

#section1 .top::after { content: ""; clear: both; display: table; }

#section1 .top .category { width: 2.4rem; height: 6.8rem; background: #1d1d1d; color: #fff; text-align: center; float: left; margin-right: 1.6rem; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; padding-top: .4rem; }

#section1 .top .category span { display: inline-block; width: .5rem; word-break: break-all; vertical-align: top; }

#section1 .top .news-wrap { float: left; width: calc(100% - 4.5rem); position: relative; z-index: 1; opacity: 0; -webkit-transition: all 0.9s; transition: all 0.9s; }

#section1 .top .news-wrap .news { position: relative; width: 100%; padding-bottom: 1.3rem; }

#section1 .top .news-wrap .news::after { content: ""; clear: both; display: table; }

#section1 .top .news-wrap .news .desc { display: block; width: 40rem; max-width: 65%; float: left; word-break: keep-all; }

#section1 .top .news-wrap .news .desc .title { display: block; margin-bottom: 1.5rem; font-family: "Nanum Myeongjo"; color: #222; font-weight: 900; font-size: 1.9rem; padding-right: 10rem; height: 4.7rem; overflow: hidden; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; -webkit-transform: translateX(2rem); transform: translateX(2rem); }

#section1 .top .news-wrap .news .desc .txt { font-size: .9rem; color: #888; line-height: 1.5; padding-right: 5rem; height: 4.2rem; overflow: hidden; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; -webkit-transform: translateY(2rem); transform: translateY(2rem); }

#section1 .top .news-wrap .news .img { float: left; width: 23.5rem; max-width: 35%; -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.21); box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.21); opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; -webkit-transform: translateX(2rem); transform: translateX(2rem); }

#section1 .top .news-wrap .swiper-slide-active .news .desc .title { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition-delay: .3s; transition-delay: .3s; }

#section1 .top .news-wrap .swiper-slide-active .news .desc .txt { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: .5s; transition-delay: .5s; }

#section1 .top .news-wrap .swiper-slide-active .news .img { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition-delay: .7s; transition-delay: .7s; }

#section1 .top .btn-area { position: absolute; top: 5rem; left: 53%; width: 6.3rem; height: 3rem; z-index: 2; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; }

#section1 .top .btn-area .swiper-button-prev { width: 1.5rem; height: 3rem; position: absolute; top: 0; left: 0; cursor: pointer; font-size: .8rem; color: #292929; line-height: 3rem; }

#section1 .top .btn-area .swiper-button-next { width: 1.5rem; height: 3rem; position: absolute; top: 0; right: 0; cursor: pointer; font-size: .8rem; color: #292929; line-height: 3rem; }

#section1 .top .btn-area .swiper-pagination { font-size: 0; position: relative; width: 2.9rem; height: 2.6rem; margin: 1rem auto 0; }

#section1 .top .btn-area .swiper-pagination::before { content: ''; width: 3.1rem; height: 1px; background: #cfcfcf; position: absolute; top: 1.25rem; left: -.1rem; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

#section1 .top .btn-area .swiper-pagination span { font-size: 1.3rem; display: inline-block; color: #333; font-family: "Montserrat"; position: absolute; }

#section1 .top .btn-area .swiper-pagination span.swiper-pagination-current { font-weight: 900; font-size: 1.8rem; top: -.8rem; left: -.1rem; }

#section1 .top .btn-area .swiper-pagination span.swiper-pagination-total { bottom: 0; right: 0; }

#section1 .bottom { width: calc(100% - 5rem); position: relative; z-index: 1; -webkit-transform: translateY(-2.7rem); transform: translateY(-2.7rem); opacity: 0; -webkit-transition: all 1s; transition: all 1s; }

#section1 .bottom::before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #fff; z-index: 2; -webkit-transition: all 1s; transition: all 1s; }

#section1 .bottom .img-slider .swiper-wrapper > li .img { height: 25.5rem; background-size: cover; background-repeat: no-repeat; background-position: right top; }

#section1 .bottom .btn-area { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; color: #fff; height: 0; width: calc(100% + 5rem); }

#section1 .bottom .btn-area .container { position: relative; width: 77.7rem; }

#section1 .bottom .btn-area .swiper-button-prev { width: 1.5rem; height: 3rem; position: absolute; cursor: pointer; top: 0; left: 0; }

#section1 .bottom .btn-area .swiper-button-prev .arr { display: block; width: 2.2rem; height: 2.2rem; border-left: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: .4rem; left: .4rem; }

#section1 .bottom .btn-area .swiper-button-next { width: 1.5rem; height: 3rem; position: absolute; cursor: pointer; top: 0; right: 0; }

#section1 .bottom .btn-area .swiper-button-next .arr { display: block; width: 2.2rem; height: 2.2rem; border-left: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); position: absolute; top: .4rem; right: .4rem; }

#section1 .pop-area { position: absolute; bottom: 0; left: 0; width: calc(100% + 5rem); z-index: 3; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; height: 0; }

#section1 .pop-area::before { content: ''; width: calc(100% - 5rem); height: 4rem; background: rgba(28, 34, 55, 0.7); position: absolute; bottom: 0; left: 0; z-index: -1; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; height: 0; }

#section1 .pop-area .container { position: relative; z-index: 1; }

#section1 .pop-area .btn-list::after { content: ""; clear: both; display: table; }

#section1 .pop-area .btn-list > li { width: 25%; float: left; position: relative; }

#section1 .pop-area .btn-list > li .btn-pop { display: block; font-size: .85rem; color: #fff; height: 4rem; padding: 1.4rem 2.8rem 1.4rem 1.4rem; border-left: 1px solid rgba(255, 255, 255, 0.15); position: relative; z-index: 2; }

#section1 .pop-area .btn-list > li .btn-pop i { position: absolute; top: 1.5rem; right: 1.4rem; }

#section1 .pop-area .btn-list > li:last-child .btn { border-right: 1px solid rgba(255, 255, 255, 0.15); }

#section1 .pop-area .btn-list > li .pop-box { position: absolute; bottom: 4rem; left: 0; opacity: 0; visibility: hidden; height: 0; background: rgba(28, 34, 55, 0.8); -webkit-transition: all .5s; transition: all .5s; z-index: 1; overflow: hidden; padding: 0 1.4rem; color: rgba(255, 255, 255, 0.8); }

#section1 .pop-area .btn-list > li .pop-box .img { margin: 3rem auto 2rem; border-radius: 50%; width: 8.2rem; height: 8.2rem; text-align: center; background-color: #fff; overflow: hidden; }

#section1 .pop-area .btn-list > li .pop-box .txt { line-height: 1.5; margin-bottom: 1rem; }

#section1 .pop-area .btn-list > li .pop-box .more { display: block; font-size: .75rem; color: rgba(255, 255, 255, 0.43); }

#section1 .pop-area .btn-list > li .pop-box .more:hover { color: #fff; }

#section1 .pop-area .btn-list > li .pop-box .close { display: none; }

#section1 .pop-area .btn-list > li .pop-box .link-box { border: 1px solid rgba(255, 255, 255, 0.4); border-bottom: 0; }

#section1 .pop-area .btn-list > li .pop-box .link-box::after { content: ""; clear: both; display: table; }

#section1 .pop-area .btn-list > li .pop-box .link-box .link { width: 50%; float: left; border-bottom: 1px solid rgba(255, 255, 255, 0.4); padding: .7rem .3rem; text-align: center; position: relative; }

#section1 .pop-area .btn-list > li .pop-box .link-box .link:nth-of-type(2n) { border-left: 1px solid rgba(255, 255, 255, 0.4); }

#section1 .pop-area .btn-list > li .pop-box .link-box .link::before { content: ''; width: 100%; height: 100%; border: 2px solid #fff; position: absolute; top: 0; left: 0; opacity: 0; -webkit-transition: all .3s; transition: all .3s; z-index: -1; }

#section1 .pop-area .btn-list > li .pop-box .link-box .link:hover::before { opacity: 1; }

#section1 .pop-area .btn-list > li:nth-child(1) .link-box .link { height: 3.7rem; }

#section1 .pop-area .btn-list > li:nth-child(1) .link-box .link:nth-child(2) { padding-top: .3rem; }

#section1 .pop-area .btn-list > li:nth-child(3) .link-box > li { height: 5rem; width: 50%; float: left; }

#section1 .pop-area .btn-list > li:nth-child(3) .link-box > li > .link { width: 100%; float: none; height: 2.5rem; padding: .1rem .3rem; }

#section1 .pop-area .btn-list > li:nth-child(3) .link-box > li > .link a { display: block; }

#section1 .pop-area .btn-list > li.active .btn-pop { background: #f49f17; background: -webkit-gradient(linear, left top, right top, from(#f49f17), to(#b83e0d)); background: linear-gradient(to right, #f49f17 0%, #b83e0d 100%); }

#section1 .pop-area .btn-list > li.active .btn-pop i { -webkit-transform: rotate(180deg); transform: rotate(180deg); }

#section1 .pop-area .btn-list > li.active .pop-box { height: 21.5rem; opacity: 1; visibility: visible; }

#section1 .movie-area { position: absolute; bottom: 0; left: 100%; height: 42.1rem; width: 100%; z-index: 2; opacity: 0; -webkit-transition: all 1s; transition: all 1s; visibility: hidden; }

#section1 .movie-area::before { content: ''; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); position: absolute; top: 0; left: 0; }

#section1 .movie-area .video { width: 100%; height: 100%; overflow: hidden; z-index: 1; }

#section1 .movie-area .video video { width: 100%; min-height: 100%; }

#section1 .movie-area .bar-area { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; height: .2rem; }

#section1 .movie-area .bar-area .bar { display: block; background: #f49f17; width: 0; height: inherit; }

/* start */
body.start #header::before { opacity: 1; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; width: 100%; }

body.start #header > .container { opacity: 1; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; height: 5rem; overflow: inherit; }

body.start #section1::before { opacity: 1; height: 32.5rem; -webkit-transition-delay: .5s; transition-delay: .5s; }

body.start #section1 .bottom { opacity: 1; }

body.start #section1 .bottom::before { width: 0; }

body.start #section1 .pop-area { opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s; height: 4rem; }

body.start #section1 .pop-area::before { opacity: .7; -webkit-transition-delay: 1s; transition-delay: 1s; height: 4rem; }

body.start #section1 .top .category { opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s; }

body.start #section1 .top .news-wrap { opacity: 1; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; }

body.start #section1 .top .btn-area { opacity: 1; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; }

/* 배너 오픈 */
body.banner-open #btn-quick { -webkit-transform: translateY(-50%); transform: translateY(-50%); }

body.banner-open #btn-quick.white { -webkit-transform: translateY(-27%); transform: translateY(-27%); }

/* 동영상 */
#main.play #btn-movie { opacity: 0; visibility: hidden; }

#main.play #btn-home { opacity: 1; visibility: visible; }

#main.play #section1 .top .news-wrap .news .desc .title, #main.play #section1 .top .news-wrap .news .desc .txt, #main.play #section1 .top .btn-area .swiper-pagination span, #main.play #section1 .top .btn-area .swiper-button-prev, #main.play #section1 .top .btn-area .swiper-button-next { color: #fff; }

#main.play #section1 .movie-area { left: 0; opacity: 1; visibility: visible; }

#main.play #section1 .movie-area .bar-area .bar { -webkit-animation: bar 28s linear infinite; animation: bar 28s linear infinite; }

@-webkit-keyframes bar { 0% { width: 0%; }
  100% { width: 100%; } }

@keyframes bar { 0% { width: 0%; }
  100% { width: 100%; } }

/* section2 */
#section2 { margin-top: 2.3rem; margin-bottom: 5rem; }

#section2 .row { margin: 0 -1.5rem; }

#section2 .row > li { padding: 0 1.5rem; }

#section2 .news-area .menu-area { position: relative; }

#section2 .news-area .menu-area .title { font-size: 1.6rem; font-weight: 700; color: #333; position: absolute; top: 0; left: 0; }

#section2 .news-area .menu-area .tabs { position: relative; padding-top: 2.9rem; padding-bottom: 6rem; }

#section2 .news-area .menu-area .tabs .btn-tab { display: block; width: 9rem; font-size: .85rem; color: #666; padding: .8rem 0; border-bottom: 1px solid #ddd; position: relative; }

#section2 .news-area .menu-area .tabs .btn-tab::before { content: ''; width: 0; height: 4px; background: #222; position: absolute; bottom: 0; left: 0; opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; }

#section2 .news-area .menu-area .tabs .btn-tab::after { content: '\ea3e'; font-family: "xeicon"; font-size: .7rem; color: #f49f17; position: absolute; top: 50%; right: .5rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; }

#section2 .news-area .menu-area .tabs .board { position: absolute; top: 0; left: 12rem; opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; visibility: hidden; z-index: -1; width: calc(100% - 12rem); }

#section2 .news-area .menu-area .tabs .board .view { display: block; }

#section2 .news-area .menu-area .tabs .board .view .caption { font-family: "Nanum Myeongjo"; font-size: 1.7rem; color: #333; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-bottom: 1.5rem; }

#section2 .news-area .menu-area .tabs .board .view .cont { padding-bottom: 2.7rem; border-bottom: 1px solid #ddd; margin-bottom: 1.8rem; }

#section2 .news-area .menu-area .tabs .board .view .cont::after { content: ""; clear: both; display: table; }

#section2 .news-area .menu-area .tabs .board .view .cont .img { width: 13.5rem; max-width: 42%; height: 8.3rem; overflow: hidden; float: left; margin-right: 1.5rem; }

#section2 .news-area .menu-area .tabs .board .view .cont .txt { width: calc(100% - 15rem); max-width: 57%; float: left; word-break: keep-all; }

#section2 .news-area .menu-area .tabs .board .view .cont .txt .desc { color: #666; line-height: 1.5; height: 6rem; overflow: hidden; margin-bottom: 1.4rem; }

#section2 .news-area .menu-area .tabs .board .view .cont .txt .info { color: #888; font-size: .75rem; }

#section2 .news-area .menu-area .tabs .board .view .cont.noimg .txt { width: 100%; max-width: 100%; float: none; }

#section2 .news-area .menu-area .tabs .board .link-list > li { margin-bottom: 1rem; }

#section2 .news-area .menu-area .tabs .board .link-list > li:last-child { margin-bottom: 0; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a { display: block; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a::after { content: ""; clear: both; display: table; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a .desc { max-width: calc(100% - 7rem); display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: 700; color: #222; float: left; padding-left: .9rem; position: relative; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a .desc::before { content: ''; width: .25rem; height: .25rem; background: #b9b9b9; position: absolute; top: .4rem; left: 0; border-radius: 50%; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a .date { float: right; display: block; font-size: .75rem; color: #888; }

#section2 .news-area .menu-area .tabs .board .link-list > li > a:hover .desc { text-decoration: underline; }

#section2 .news-area .menu-area .tabs .board .more { display: block; position: absolute; bottom: 0; left: -11.8rem; color: #888; font-size: .75rem; }

#section2 .news-area .menu-area .tabs li.active .btn-tab { font-weight: 700; color: #333; }

#section2 .news-area .menu-area .tabs li.active .btn-tab::before { opacity: 1; width: 100%; }

#section2 .news-area .menu-area .tabs li.active .btn-tab::after { opacity: 1; }

#section2 .news-area .menu-area .tabs li.active .board { opacity: 1; visibility: visible; z-index: 1; }

#section2 .news-area .menu-area .tabs li:hover .btn-tab { font-weight: 700; color: #333; }

#section2 .news-area .menu-area .tabs li:hover .btn-tab::before { opacity: 1; width: 100%; }

#section2 .result-area { position: relative; }

#section2 .result-area .title { font-size: 1.4rem; color: #222; margin-bottom: 1.8rem; }

#section2 .result-area .link-area > li { margin-bottom: .9rem; }

#section2 .result-area .link-area > li:last-child { margin-bottom: 0; }

#section2 .result-area .link-area > li > a { display: block; }

#section2 .result-area .link-area > li > a::after { content: ""; clear: both; display: table; }

#section2 .result-area .link-area > li > a:hover .txt .caption { color: #ba410d; }

#section2 .result-area .link-area .img { border-radius: 50%; width: 5.5rem; height: 5.5rem; text-align: center; background-color: #fff; overflow: hidden; margin-right: 1.8rem; float: left; }

#section2 .result-area .link-area .txt { width: calc(100% - 7.5rem); float: left; padding-top: .7rem; word-break: keep-all; }

#section2 .result-area .link-area .txt .caption { font-size: .85rem; color: #222; font-weight: 700; line-height: 1.5; margin-bottom: .5rem; height: 2.5rem; overflow: hidden; -webkit-transition: all .3s; transition: all .3s; }

#section2 .result-area .link-area .txt .from { display: block; font-size: .75rem; color: #888; }

#section2 .result-area .more { display: block; position: absolute; top: .4rem; right: 0; font-size: .75rem; color: #888; }

/* section3 */
#section3 { margin-bottom: 4.5rem; }

#section3 .container { position: relative; padding-top: 4.5rem; padding-bottom: 5.5rem; }

#section3 .container::before { content: ''; width: 1000%; height: 100%; position: absolute; top: 0; left: 12rem; background: #0f4b91 url("/main/img/main/3_research_bg.jpg") left 0 no-repeat; background-attachment: fixed; background-size: 100% auto; }

#section3 .container::after { content: ''; width: 1000%; height: 100%; position: absolute; top: 0; left: -1000%; background: #fff; z-index: 1; margin-left: -2rem; }

#section3 .research-wrap .swiper-container { overflow: visible !important; height: 28rem; }

#section3 .research-wrap .swiper-slide { width: 18rem; }

#section3 .research-wrap .swiper-slide .card { width: 100%; color: #fff; margin-top: 17rem; height: 11rem; overflow: hidden; }

#section3 .research-wrap .swiper-slide .card .img { width: 100%; height: 11rem; overflow: hidden; position: relative; }

#section3 .research-wrap .swiper-slide .card .img::before { content: ''; width: 100%; height: 100%; background: -webkit-gradient(linear, left bottom, left top, color-stop(10%, rgba(0, 0, 0, 0.7)), color-stop(47%, transparent)); background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 10%, transparent 47%); position: absolute; top: 0; left: 0; z-index: 1; -webkit-transition: all .3s; transition: all .3s; }

#section3 .research-wrap .swiper-slide .card .img img { min-height: 100%; position: relative; }

#section3 .research-wrap .swiper-slide .card .img .caption { position: absolute; bottom: 1rem; left: 0; width: 100%; text-align: center; z-index: 2; font-size: .85rem; }

#section3 .research-wrap .swiper-slide .card .txt { opacity: 0; visibility: hidden; -webkit-transition: all .8s; transition: all .8s; -webkit-transform: translateX(-4rem); transform: translateX(-4rem); }

#section3 .research-wrap .swiper-slide.swiper-slide-active { width: 34rem; z-index: 2; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card { margin-top: 0; height: 23rem; overflow: visible; -webkit-box-sizing: border-box; box-sizing: border-box; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .img { height: 23rem; overflow: visible; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .img::before { opacity: 0; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .img::after { content: ''; width: 4rem; height: 4rem; background: #f49f17; position: absolute; top: -2rem; left: -2rem; z-index: -1; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .img .caption { display: none; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt { opacity: 1; visibility: visible; position: absolute; top: 0; left: 100%; display: block; width: calc(100% - 4rem); margin-left: 4rem; word-break: keep-all; -webkit-transform: translateX(0rem); transform: translateX(0rem); }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt .category { display: block; font-size: 1rem; font-style: italic; margin-bottom: 1.2rem; font-weight: 400; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt .caption { font-family: "Nanum Myeongjo"; font-size: 1.7rem; margin-bottom: 1.2rem; font-weight: 700; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt .desc { font-size: .85rem; font-weight: 300; line-height: 1.7; margin-bottom: 1.2rem; }

#section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt .more { display: block; font-size: .75rem; opacity: .59; }

#section3 .research-wrap .swiper-slide.swiper-slide-prev { opacity: 0; }

#section3 .btn-area { position: absolute; bottom: 5rem; left: 0; width: 34rem; max-width: 50%; height: 2.5rem; z-index: 3; }

#section3 .btn-area::after { content: ""; clear: both; display: table; }

#section3 .btn-area .swiper-button-prev { height: inherit; position: absolute; top: 0; left: 0; width: 3.2rem; cursor: pointer; }

#section3 .btn-area .swiper-button-prev .arr { width: 100%; position: absolute; top: 1rem; left: 0; height: .25rem; background: #000; }

#section3 .btn-area .swiper-button-prev .arr::before { content: ''; width: 1.3rem; height: .25rem; background: #000; position: absolute; top: .5rem; left: -.1rem; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

#section3 .btn-area .swiper-button-next { height: inherit; position: absolute; top: 0; right: 0; width: 20rem; cursor: pointer; }

#section3 .btn-area .swiper-button-next .arr { width: 100%; position: absolute; top: 1rem; left: 0; height: .25rem; background: #fff; }

#section3 .btn-area .swiper-button-next .arr::before { content: ''; width: 1.3rem; height: .25rem; background: #fff; position: absolute; top: -.5rem; right: -.1rem; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

#section3 .btn-area .swiper-pagination { font-size: 0; position: absolute; top: 0; left: 6.1rem; width: 2.9rem; height: 2.6rem; margin: 0 auto; }

#section3 .btn-area .swiper-pagination::before { content: ''; width: 3.1rem; height: 1px; background: #cfcfcf; position: absolute; top: 1.25rem; left: -.1rem; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

#section3 .btn-area .swiper-pagination span { font-size: 1.3rem; display: inline-block; color: #333; font-family: "Montserrat"; position: absolute; }

#section3 .btn-area .swiper-pagination span.swiper-pagination-current { font-weight: 900; font-size: 1.8rem; top: -.8rem; left: -.1rem; }

#section3 .btn-area .swiper-pagination span.swiper-pagination-total { bottom: 0; right: 0; }

/* section4 */
#section4 { position: relative; overflow: hidden; padding: 3.5rem 0; color: #fff; background: url("/eng/img/main/4_bg1.jpg") top center/cover no-repeat; }

#section4 .title { display: block; font-size: 1.6rem; font-weight: 600; margin-bottom: 2rem; position: relative; z-index: 2; }

#section4 .link-list li { position: static; }

#section4 .link-list li::before { content: ''; width: 100%; height: 100%; display: block; position: absolute; bottom: 0; left: 0; background: url("/eng/img/main/4_bg1.jpg") top center/cover no-repeat; z-index: 0; -webkit-transition: all 1s; transition: all 1s; opacity: 0; max-height: 50%; }

#section4 .link-list li a { display: block; text-align: center; padding: 2.5rem; border: .3rem solid transparent; -webkit-transition: all .8s; transition: all .8s; position: relative; z-index: 2; }

#section4 .link-list li a span { font-size: 1.2rem; font-style: italic; display: block; padding-top: 5.3rem; }

#section4 .link-list li a:hover { border-color: #fff; }

#section4 .link-list li:nth-child(1) span { background: url("/eng/img/main/4_link_icon1.png") center top no-repeat; }

#section4 .link-list li:nth-child(2)::before { background-image: url("/eng/img/main/4_bg2.jpg"); }

#section4 .link-list li:nth-child(2) span { background: url("/eng/img/main/4_link_icon2.png") center top no-repeat; }

#section4 .link-list li:nth-child(3)::before { background-image: url("/eng/img/main/4_bg3.jpg"); }

#section4 .link-list li:nth-child(3) span { background: url("/eng/img/main/4_link_icon3.png") center top no-repeat; }

#section4 .link-list li:nth-child(4)::before { background-image: url("/eng/img/main/4_bg4.jpg"); }

#section4 .link-list li:nth-child(4) span { background: url("/eng/img/main/4_link_icon4.png") center top no-repeat; }

#section4 .link-list li.active::before { opacity: 1; max-height: 100%; }

/*==================================================*/
/* 반응형 */
/*==================================================*/
@media (max-width: 1790px) { .banner-wrap .banner-area { width: calc(100% - 5rem); }
  .banner-wrap .banner-area .container { width: 33rem; }
  .banner-wrap .bx-wrapper { width: 33rem; margin: 0 auto; } }

@media (max-width: 1200px) { .banner-wrap { display: none; }
  #section1::before { width: 60%; }
  #section1 .top { padding: 3rem 1rem 0; }
  #section1 .top .category { width: 7.4rem; height: 2.4rem; padding: 0.6rem; float: none; margin-bottom: 0.8rem; }
  #section1 .top .category span { width: auto; }
  #section1 .top .news-wrap { float: none; width: 100%; }
  #section1 .top .news-wrap .news .desc { width: 100%; max-width: 100%; float: none; margin-bottom: 1rem; }
  #section1 .top .news-wrap .news .desc .title { font-size: 1.4rem; height: auto; padding-right: 0; margin-bottom: 0.8rem; }
  #section1 .top .news-wrap .news .desc .txt { padding-right: 0; font-size: .8rem; }
  #section1 .top .news-wrap .news .img { float: none; width: 100%; max-width: 100%; -webkit-box-shadow: none; box-shadow: none; }
  #section1 .top .btn-area { top: 3.8rem; left: auto; right: 0; }
  #section1 .top .btn-area .swiper-pagination span { font-size: 1.1rem; }
  #section1 .top .btn-area .swiper-pagination span.swiper-pagination-current { font-size: 1.4rem; top: -.3rem; left: .2rem; }
  #section1 .top .btn-area .swiper-pagination span.swiper-pagination-total { right: .4rem; }
  #section1 .bottom { width: 100%; }
  #section1 .pop-area { width: 100%; }
  #section1 .pop-area .btn-list > li { position: inherit; }
  #section1 .pop-area .btn-list > li .btn-pop { padding: 1.2rem .5rem; }
  #section1 .pop-area .btn-list > li .btn-pop i { display: none; }
  #section1 .pop-area .btn-list > li .pop-box { width: 15rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); text-align: center; word-break: keep-all; }
  #section1 .pop-area .btn-list > li .pop-box .txt { margin-bottom: 0.8rem; }
  #btn-movie { display: none; }
  #section3 .research-wrap .swiper-container { height: 18rem; overflow: hidden !important; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active { width: 26rem; }
  #section3 .research-wrap .swiper-slide .card { padding: 2rem 1rem 0; height: auto !important; }
  #section3 .research-wrap .swiper-slide .card .img { height: auto !important; width: 40%; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt { left: 40%; width: 55%; -webkit-transform: none; transform: none; margin-left: 2rem; top: 2rem; }
  #section3 .btn-area { bottom: 2rem; left: 2rem; }
  #section3 .btn-area .swiper-button-next { max-width: calc(100% - 10rem); } }

@media (max-width: 992px) { #section1 .bottom .btn-area { display: none; }
  #section2 .news-area .menu-area .title { left: 1rem; }
  #section2 .news-area .menu-area { padding: 0 1rem; margin-bottom: 2rem; }
  #section2 .result-area { padding: 2rem 1rem; background: #f3f3f3; }
  #section2 .result-area .more { top: 2.4rem; right: 1rem; }
  #section3 { margin-bottom: 0; }
  #section4 { padding: 2rem 1rem; }
  #section4 .link-list li a { padding: 1rem .5rem; } }

@media (max-width: 768px) { body.start #section1::before { height: 16rem; }
  #section1 .top .news-wrap .news .desc .title { font-size: 1rem; }
  #section1 .top .news-wrap .news .desc .txt { height: 3.8rem; }
  #section1 .top .btn-area { top: 2.8rem; }
  #section1 .bottom.active { z-index: 3; }
  #section1 .bottom .img-slider .swiper-wrapper > li .img { height: 11rem; }
  body.start #section1 .pop-area { height: 3.5rem; }
  body.start #section1 .pop-area::before { height: 3.5rem; }
  #section1 .pop-area .btn-list > li .btn-pop { padding: .9rem .2rem; font-size: .65rem; text-align: center; height: 3.5rem; }
  #section1 .pop-area .btn-list > li .btn-pop i { display: none; }
  #section1 .pop-area .btn-list > li .pop-box { padding: 0 .5rem; }
  #section1 .pop-area .btn-list > li.active .pop-box { height: 21.5rem; }
  #section1 .pop-area .btn-list > li .pop-box .title { color: #fff; text-align: center; padding-top: 1.4rem; font-size: .9rem; }
  #section1 .pop-area .btn-list > li .pop-box .img { margin: 1.5rem auto 1rem; }
  #section1 .pop-area .btn-list > li .pop-box .close { display: block; position: absolute; top: 1rem; right: 1rem; font-size: 1.5rem; }
  #section2 { margin-top: 0; margin-bottom: 2.5rem; }
  #section2 .news-area .menu-area { margin-bottom: 0; }
  #section2 .news-area .menu-area .title { position: static; margin-bottom: 1rem; }
  #section2 .news-area .menu-area .tabs { padding-bottom: 22rem; padding-top: 0; border-top: 1px solid #ddd; }
  #section2 .news-area .menu-area .tabs.img-mode { padding-bottom: 31rem; }
  #section2 .news-area .menu-area .tabs > li { float: left; width: 50%; }
  #section2 .news-area .menu-area .tabs .btn-tab { width: 100%; text-align: center; font-size: .65rem; }
  #section2 .news-area .menu-area .tabs .btn-tab::after { display: none; }
  #section2 .news-area .menu-area .tabs .board { max-width: 100%; width: 100%; left: 0; top: 2.5rem; padding: 1.5rem 0; }
  #section2 .news-area .menu-area .tabs .board .view .caption { font-size: 1rem; margin-bottom: 1rem; }
  #section2 .news-area .menu-area .tabs .board .view .cont { padding-bottom: 1.5rem; }
  #section2 .news-area .menu-area .tabs .board .view .cont .txt { width: 100%; max-width: 100%; float: none; }
  #section2 .news-area .menu-area .tabs .board .view .cont .img { float: none; width: 100%; max-width: 100%; margin-right: 0; margin-bottom: 1rem; }
  #section2 .news-area .menu-area .tabs .board .view .cont .txt .desc { height: 3.8rem; margin-bottom: 1rem; }
  #section2 .news-area .menu-area .tabs .board .more { top: -5rem; right: 0; bottom: auto; left: auto; }
  #section2 .news-area .menu-area .tabs .board .link-list > li { margin-bottom: 0.5rem; }
  #section2 .news-area .menu-area .tabs .board .link-list > li > a .desc { max-width: 100%; font-weight: 400; }
  #section2 .news-area .menu-area .tabs .board .link-list > li > a .date { display: none; }
  #section3 .container { padding-top: 0; padding-bottom: 7.5rem; }
  #section3 .container::before { left: 0; top: 7rem; height: calc( 100% - 7rem); background-size: cover; }
  #section3 .research-wrap .swiper-container { height: auto; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active .card .img { width: 100%; margin-bottom: 1rem; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active .card .img::after { top: -0.7rem; left: -0.7rem; width: 2rem; height: 2rem; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt { width: 100%; position: static; margin: 0; }
  #section3 .research-wrap .swiper-slide.swiper-slide-active .card .txt .desc { margin-bottom: 1rem; }
  #section3 .btn-area { max-width: 80%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  #section3 .btn-area .swiper-pagination span { color: #fff; }
  #section4 .link-list li { margin-bottom: 2rem; }
  #section4 .link-list li a span { background-size: 2.5rem !important; font-size: 1rem; padding-top: 3.5rem; }
  #section5 .top .link { padding: .5rem 0; }
  #section5 .top .link .row > li::before { display: none; }
  #section5 .top .link a { padding: .3rem 1rem; height: auto; text-align: left; }
  #section5 .bottom .page-link a { font-size: .7rem; } }
