@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fredericka+the+Great&display=swap');

html{font-size:20px;}
body {font-family:'Noto Sans KR';}

.container{width:60rem; margin:0 auto;}
.container:after{content:""; clear:both; display:block;}

#wrap {min-width:95rem}

/* 헤더 탑 */
header .top {background: #03356c;position: relative;}
header .top .top-wrap {width:60rem; margin:0 auto;padding: 0 0.75rem;}
header .top .top-wrap>ul {float: right;font-size: 0;}
header .top .top-wrap>ul>li {display: inline-block;font-size: 0.6rem;color: #fff;font-weight: 100;}
header .top .top-wrap>ul>li>a {display: block;line-height:1.4rem;margin-left: 1rem;}
header .top .top-wrap>ul .language {background: #1168ae;color: #fff;margin-left: 1rem;position: relative;text-align: center;}
header .top .top-wrap>ul .language i {margin: 0 0.5rem;}
header .top .top-wrap>ul .language.on i {transform: rotate(180deg);}
header .top .top-wrap>ul .language>ul {position: absolute;top:1.4rem;left: 0;width: 100%;height:0;background: #1168ae;overflow: hidden;transition: 0.3s;z-index: 5;}
header .top .top-wrap>ul .language.on>ul {height: 2.5rem;}
header .top .top-wrap>ul .language>ul>li>a {display: block;line-height:1.25rem;}
header .top .top-wrap>ul .language>ul>li>a:hover {background:#03356c}
header .top-serch {display:none;background:#333;color:#fff;text-align:center;position:absolute;top:1.4rem;left:0;width:100%;height:4rem;padding-top:1.2rem;z-index: 6;}

header .top-serch input {border:none;border: 1px solid#fff;border-radius: 2.5rem;padding-left: 0.7rem;width: 28em;}

/* 헤더 */
nav {position:relative;border-bottom:1px solid#ddd;}
nav>div {padding:0 0.75rem;}
nav h1{float:left;width:15%;line-height:4rem;}
nav h1 img {width: 100%;}
nav .gnb-menu {float:right;font-size:0;}
nav .gnb-menu>li {display:inline-block;font-size:0.8rem;font-weight: 500;}
nav .gnb-menu>li:hover>a {text-decoration: underline;text-decoration-color:#03356c;text-decoration-thickness:3px}
nav .gnb-menu>li>a {display: block;padding-left:3rem;line-height:4rem;}
nav .gnb-menu>li .gnb-submenu {height:0;overflow:hidden;width:100%;position:absolute;top:calc(4rem);left:0;text-align:center;font-size:0;background-color:#fff;z-index:222;}
nav .gnb-menu>li:hover .gnb-submenu {height:auto;border-top: 1px solid#e5e5e5;border-bottom:3px solid #03356c;}
nav ul .gnb-submenu dl {width:70rem;margin:0 auto;padding:1rem 0 2rem 0;font-size: 0;}
nav ul .gnb-submenu dt {display:inline-block;width:10%;vertical-align:top;padding:0 0.75rem;font-size: 2rem;color: #03356c;}
nav ul .gnb-submenu dd {display:inline-block;width:13%;font-size:1rem;vertical-align:top;text-align:center;}

nav ul .gnb-submenu dd>a {display:block;text-align:center;line-height:2rem;padding:0 2rem;font-weight:500;font-size:0.8rem;background-color: #1168ae;color: #fff;}
nav ul .gnb-submenu dd.on>a {background-color: #03356c;}
nav ul .gnb-submenu dd li>a {display:block;text-align:center;line-height:2.5;font-weight:400;font-size:0.7rem;color: #777;}

/* 메인 슬라이드 */

#section01 .bg01 {background-image: url(../img/bg02.png);height:37.5rem;position: relative;}
#section01 .bg02 {background-image: url(../img/bg01.png);height:37.5rem;}
#section01 .bg01 img {position: absolute;top:3rem;left:50%;transform: translateX(-50%);}



/* 일정 */
#section02 {padding: 5rem 0;}
#section02 h2 {font-size:1.8rem;font-weight:400;margin-bottom:1.5rem;}
#section02 h2 strong {color: #03356c;font-weight:700}
#section02>div .calendar-l{float: left;width: 70%;display: flex;padding: 0 0.75rem;}
#section02>div .calendar-l h2 strong, .calendar-l h2 span {display: block;text-align: center;line-height: 1.2;}
#section02>div .calendar-l>div {width: 100%;margin: 0 0.75rem;border: 1px solid#1168ae;padding:1.5rem;position: relative;}
#section02>div .calendar-l>div::before {content: "";display: block;width:1.5rem;height:1.5rem;background: #fff;position: absolute;top:-0.25rem;left:-0.25rem;opacity: 0;}
#section02>div .calendar-l>div::after {content: "\eaf1";font-family: xeicon!important;position: absolute;top:-0.2rem;left:-0.2rem;font-size: 1.6rem;color: #1168ae;opacity: 0;}
#section02>div .calendar-l>div.on::before {opacity: 1;}
#section02>div .calendar-l>div.on::after {opacity: 1;}
#section02>div .calendar-l>div span {display: block;text-align: center;font-size: 1.2rem;position: relative;font-weight: 500;padding-bottom:1rem;color: #03356c;}

#section02 .calendar-l>div span::after {content: "";display: block;width:2.5rem;height:3px;background: #1168ae;position: absolute;bottom:0rem;left: 50%;transform: translateX(-50%);}
#section02 .calendar-l>div p {line-height: 1.5;margin-top:1rem;font-size:0.7rem;}
#section02 .calendar-l>div p em {display: block;font-weight:700;}
#section02 .calendar-r{float: left;width: 30%;padding: 0 0.75rem;text-align: center;}
#section02 .calendar-r h2 {background: #03356c;color: #fff;line-height:1.7;font-size:1.2rem;font-weight: 100;margin-bottom:0;}
#section02 .calendar-r img {width: 100%;}
#section02 .calendar-r span {display: block;padding: 0.5rem 0;}


/* 뉴스 */
#section03 {background-image: url(../img/bg00.jpg);padding:5rem 0;background-position: bottom;}
#section03 h2 {font-size:1.8rem;font-weight:400;margin-bottom:2.5rem;text-align: center;}
#section03 h2 strong {color: #03356c;font-weight:700}
#section03 .container {display: grid;grid-template-columns: repeat(4, 1fr);}
#section03 .container div:nth-child(1) {grid-column: 1 / 4;}
#section03 .container div:nth-child(2) {background: #f2981e;padding: 4rem 3.5rem;color: #191919;font-weight:500;}
#section03 h3 {position: relative;padding-bottom: 1.5rem;line-height: 1.3;font-size: 1rem;text-align: center;}
#section03 h3::after {content: "";display: block;width:4rem;height:2px;background: #191919;position: absolute;bottom:0;left: 50%;transform: translateX(-50%);}
#section03 p {font-size: 0.8rem;font-weight: 300;margin-top: 2rem;line-height: 1.7;}
#section03 .container div:nth-child(3) {background: #1168ae;padding: 4rem 3.5rem;color: #fff;font-weight:500;}
#section03 .container div:nth-child(3) h3::after {background: #fff;}
#section03 .container div:nth-child(4) {grid-column: 2 / 5;}
#section03 img {width: 100%;}

/* 배경 다운로드 */
#section04 figure {background: url(../img/d01.jpg);height:25rem;}
#section04 figure>div {float: right;padding:5rem 10rem 0 0;color: #1168ae;}
#section04 figure p {font-size: 1rem;margin-bottom:0.5rem ;}
#section04 figure h3 {font-size: 1.8rem;font-weight: 900;line-height: 1.2;font-family: 'Fredericka the Great', cursive;}
#section04 figure h3 span {display: block;}
#section04 figure a {display: block;background: #fff;width:7.5rem;text-align: center;line-height: 2.5;border: 2px solid#1168ae;font-size: 1rem;font-weight: 500;margin-top: 2rem;}
#section04 figure a i {margin-left: 0.25rem;transition: 0.3s;}
#section04 figure a:hover {background:#1168ae;color: #fff;}
#section04 figure a:hover i {transform: rotate(180deg);}

/* 연구성과 */
#section05 {padding:5rem 0;position: relative;overflow: hidden;}
#section05 h2 {font-size:1.8rem;font-weight:400;margin-bottom:2.5rem;text-align: center;}
#section05 h2 strong {color: #03356c;font-weight:700}
#section05 .container {width:58.5rem;border: 1px solid#1168ae;}
#section05 .container>div {float: left;width: 50%;}
#section05 .research-img img {width: 100%;}
#section05 .research-text {padding:3rem 3.5rem 0 3.5rem;}
#section05 .research-text h3 {font-size: 0.7rem;color: #f2981e;font-weight: 700;}
#section05 .research-text strong {display: block;font-size:1.2rem;font-weight:500;line-height: 1.3;margin:1rem 0 2rem 0;}
#section05 .research-text p {font-weight: 300;line-height: 1.5;padding-top:0.5rem;}
#section05 .research-text>div {position: relative;}


#section05 .research-text a {display: block;position: relative;margin-top:2.5rem ;}
#section05 .research-text a::before {content: "";display: block;width:8rem;height: 2px;background: #aaa;position: absolute;bottom:0.4rem;left:0;transition: 0.3s;}
#section05 .research-text a::after {content: "";display: block;width:1rem;height:1rem;border-top:2px solid#aaa;position: absolute;bottom:-1px;left:6.85rem;transform: rotate(45deg);transition: 0.3s;}
#section05 .research-text a:hover::before {background: #03356c;}
#section05 .research-text a:hover::after {border-top:2px solid#03356c;}
#section05 .research-text .slick-dots {position: absolute;bottom:0rem;right:3.5rem;font-size:0.75rem;color: #aaa;}
#section05 .research-text .slick-dots li {display: inline-block;margin:0.25rem;}
#section05 .research-text .slick-dots li.slick-active {color:#03356c;}



/* 콘텐츠,공지사항 */
#section06 {background-image: url(../img/bg00.jpg);padding:5rem 0;background-position: bottom;}
#section06 h2 {font-size:1.8rem;font-weight:400;margin-bottom:1.5rem;}
#section06 h2 strong {color: #03356c;font-weight:700}
#section06>div .content {float: left;width: 70%;display: flex;padding: 0 0.75rem;}
#section06>div .content h2 strong, .content h2 span {display: block;text-align: center;line-height: 1.2;}
#section06>div .content>div {float: left;}
#section06>div .content>div figure {float: left;width: 33.333333%;padding:0 0.75rem 1.5rem 0.75rem;position: relative;}
#section06>div .content>div figure a {display: block;width:3rem;line-height:3rem;text-align: center;font-size:2rem;border-radius: 50%;color: #fff;position: absolute;top:30%;left: 50%;transform: translate(-50%,-50%);opacity: 0;}
#section06>div .content>div figure:hover a {opacity: 1;top: 50%;transition: 0.5s;}
#section06>div .content>div figure:nth-child(1) a, #section06>div .content>div figure:nth-child(2) a {background: #4459b0;}
#section06>div .content>div figure:nth-child(3) a, #section06>div .content>div figure:nth-child(5) a {background-image: linear-gradient(45deg,orange,orange,red,purple,purple);}
#section06>div .content>div figure:nth-child(4) a, #section06>div .content>div figure:nth-child(6) a {background: #27d34a;}
#section06 .content>div img {width: 100%;}
#section06 .notice {float: left;width: 30%;padding: 0 0.75rem;}
#section06 .notice h2 {background: #03356c;color: #fff;text-align: center;line-height:1.7;font-size:1.2rem;font-weight: 100;margin-bottom:0;}
#section06 .scroll {height:445px; overflow-Y:auto;background:#fff;padding-top: 1rem;}
#section06 .scroll::-webkit-scrollbar {width:0.3rem;background:#ededef;border-radius:2.5rem;}
#section06 .scroll::-webkit-scrollbar-thumb {background:#1168ae;border-radius:2.5rem} 
#section06 .scroll dt {color:#f2981e; font-size:0.6rem;padding-left:1rem;}
#section06 .scroll dd {padding:0.3rem 1rem 1rem 1rem;}
#section06 .scroll dd a {display: block;line-height:1.1;font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#section06 .scroll dd span {font-size:0.6rem;color: #aaa;}
#section06 .scroll dd:hover {text-decoration:underline;}

/* 배너 */
#section07 {padding:5rem 0 5rem 17.5rem;overflow: hidden;}
#section07 h2 {font-size:1.8rem;font-weight:400;margin-bottom:1.5rem;padding-left: 0.75rem;}
#section07 h2 strong {color: #03356c;font-weight:700}
#section07 .txt {float: left;width: 20%;position: relative;}
#section07 .txt .xi-angle-left {display: block;position: absolute;top:3.5rem;left:3.5rem;font-size: 1.5rem;border:1px solid#aaa;padding:0.5rem;}
#section07 .txt .xi-angle-right {display: block;position: absolute;top:70px;left:130px;font-size: 1.5rem;border:1px solid#aaa;padding:0.5rem;}
#section07 .txt i:hover {background: #aaa;color: #fff;}
#section07 .bn-wrap {float:left;width: 80%;}
#section07 .banner-slide figure {border:5px solid transparent;}
#section07 .banner-slide figure:hover {border:5px solid#03356c}
#section07 .banner-slide img {width: 100%;}

/* section08 */
#section08 {background: #03356c;}
#section08>div {padding:0 0.75rem}
#section08 ul {display: flex;padding:1.5rem 0;text-align: center;color: #fff;font-size:0.8rem;}
#section08 ul li {flex:1;border-left:1px solid #ddd;}
#section08 ul li a {display: block;}
#section08 ul li:last-child {border-right:1px solid #ddd;}

/* footer */
footer {background-color:#191919;padding:2.5rem 0;position: relative;}
footer>div {padding: 0 0.75rem;color: #999;}
footer figure {float:left;width: 20%;}
footer>div>div {float: right;text-align: right;}
footer ul {font-size: 0;}
footer ul li {display: inline-block;color: #eee;font-size:0.8rem;}
footer ul li a {display:block;padding:0 0.5rem;}
footer ul li:last-child a {padding-right:0;}
footer ul li:first-child {color: #f2981e;}
footer address {font-size: 0.7rem;}
footer address div {margin:2rem 0 1rem 0;}
footer address div a {margin-left:1rem;font-size: 1rem;color: #eee;}
footer address div a:hover {color: #03356c;text-decoration: underline;}
footer address span {display: block;margin-top: 0.5rem;}
footer .totop {position:absolute;bottom:2.5rem;right:2.5rem;cursor:pointer;}
footer .totop i {font-size:1.5rem;padding:0.5rem;background:#eee;color:#03356c;}

/* 퀵메뉴 */
#quick {position: fixed;top:30%;right:-10rem;z-index: 1000;transition: 0.5s;}
#quick.on {right: 0;}
#quick>div {display: flex;}
#quick>div .txt {text-align: center;width:3.5rem;background: #191919;color: #fff;font-size:0.8rem;font-weight: 100;height: 3.5rem;line-height: 2;cursor: pointer;}
#quick>div .txt.on i {transform: rotate(180deg);}
#quick>div h3 {padding-top: 0.3rem;}
#quick>div h3 i {display: block;font-size: 1rem;}
#quick>div .quick-menu {background: #1168ae;color: #fff;text-align: center;font-size: 0.7rem;font-weight: 100;}
#quick>div .quick-menu li {padding:0.5rem 0;border-bottom:1px solid#eee;cursor: pointer;}
#quick>div .quick-menu li.on {background:#03356c;}
#quick>div .quick-menu li:last-child {border-bottom: none;}
#quick>div .quick-menu span {display: block;margin:0.5rem 0 0 0;}
#quick>div .quick-menu img {width: 50%;}
#quick>div .quick-smenu {position:relative;width:6rem;visibility: hidden;border-top: 1px solid#ddd;}
#quick>div .quick-smenu dl {position: absolute;width: 100%;height:14.75rem;background: #fff;padding: 1rem;border-top: 1px solid#ddd;border-bottom: 1px solid#ddd;}
#quick>div .quick-smenu dl:nth-child(1) {visibility: visible;}
#quick>div .quick-smenu dl dt {font-size: 0.7rem;border-bottom:2px solid#18244a;padding-bottom:0.3rem;font-weight:700;color: #18244a;margin-bottom:0.5rem;}
#quick>div .quick-smenu dl dd {font-size: 0.6rem;line-height: 2.3;position: relative;padding-left:0.5rem;}
#quick>div .quick-smenu dl dd>a {display: block;padding-left:0.3rem;}
#quick>div .quick-smenu dl dd::before {content:"\e91b";display: block;font-family: xeicon!important;position:absolute;top:0.1rem;left:0;color: #f2981e;}

/* 모바일버튼 */
.mopen {display:none;position:fixed;top:24%;right:0;font-size:3rem;background: #1168ae;color:#fff;padding:0.5rem;z-index:1001;}
.mopen:after {content:"\e91c";font-family: xeicon!important;transition: 0.3s;}
.mopen.on:after {content:"\e921";font-family: xeicon!important;}




/* 
--------------------------------------------------------------------------------------------------

@media 768px 이하 ipad 대응

--------------------------------------------------------------------------------------------------
*/


@media (max-width:768px) {
    @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
    

    html{font-size:10px;}
    body {font-family:'Noto Sans KR';}

    .container{width:100%; margin:0 auto;}
    .container:after{content:""; clear:both; display:block;}

    #wrap {min-width:auto}

    /* 헤더 탑 */
    header .top {background: #03356c;position: relative;}
    header .top .top-wrap {width:100%; margin:0 auto;padding: 0.5rem 0.75rem;}
    header .top .top-wrap>ul {float: right;font-size: 0;}
    header .top .top-wrap>ul>li {display: inline-block;font-size: 1.4rem;color: #fff;font-weight: 100;}
    header .top .top-wrap>ul>li>a {display: block;line-height:2rem;margin-left: 1rem;}
    header .top .top-wrap>ul .language {background: #18244a;color: #fff;margin-left: 1rem;position: relative;text-align: center;}
    header .top .top-wrap>ul .language i {margin: 0 0.5rem;}
    header .top .top-wrap>ul .language.on i {transform: rotate(180deg);}
    header .top .top-wrap>ul .language>ul {position: absolute;top:2rem;left: 0;width: 100%;height:0;background: #18244a;overflow: hidden;transition: 0.3s;z-index: 5;}
    header .top .top-wrap>ul .language.on>ul {height: 3.5rem;}
    header .top .top-wrap>ul .language>ul>li>a {display: block;line-height:1.75rem;}
    header .top .top-wrap>ul .language>ul>li>a:hover {background:#1168ae}
    header .top-serch {display:none;background:#333;color:#fff;text-align:center;position:absolute;top:3rem;left:0;width:100%;height:5rem;padding-top:1.5rem;z-index:1002;}
    
    header .top-serch input {border:none;border: 1px solid#fff;border-radius: 2.5rem;padding-left: 0.7rem;}

    /* 헤더 */
    nav {position:relative;}
    nav>div {padding:0 0.75rem;}
    nav h1{float:left;width:100%;line-height:7rem;text-align: center;}
    nav h1 img {width:40%;}
    nav .gnb-menu {float:none;font-size:0;position:fixed;top:0;left:-100%;height: 100vh;width:100%;overflow-Y:auto;background: #fff;padding:5rem 3rem 0 3rem;border-right:1px solid#ddd;transition: 0.5s;z-index:1000;}
    nav .gnb-menu.on {left: 0;}
    nav .gnb-menu>li {display:block;font-size:1.8rem;font-weight: 500;border-bottom: 1px solid#e5e5e5;}
    nav .gnb-menu>li:hover>a {text-decoration:none;text-decoration-color:#03356c;text-decoration-thickness:3px}
    nav .gnb-menu>li>a.on {text-decoration: underline;text-decoration-color:#03356c;text-decoration-thickness:5px}
    nav .gnb-menu>li>a {display: block;padding-left:0;line-height:6rem;}
    nav .gnb-menu>li .gnb-submenu {display:none;height:auto;overflow:hidden;width:100%;position:static;top:6rem;left:0;text-align:center;font-size:0;background:#fff;border-top:none;z-index:222;}
    nav .gnb-menu>li:hover .gnb-submenu {display:none;height:auto;border-top:none;border-bottom:none;}
    nav ul .gnb-submenu dl {width:100%;margin:0 auto;padding:1rem 0 2rem 0;font-size: 0;}
    nav ul .gnb-submenu dt {display:block;width:100%;padding:0 0 0.75rem 0;font-size: 2rem;color: #03356c;text-align: right;border-bottom: 3px dotted#03356c;margin-bottom: 1rem;}
    nav ul .gnb-submenu dd {display:block;width:100%;text-align:left;position: relative;overflow: hidden;}
    nav ul .gnb-submenu dd>a {display:block;text-align:left;line-height:2rem;padding:0;font-weight:400;font-size:1.6rem;line-height: 1.8;border-left:none;color: #333;background-color:#fff;}
    nav ul .gnb-submenu dd.on>a {background-color: #fff;}
    nav ul .gnb-submenu dd ul {display:none;height:auto;position:static;top:0;background: #03356c;padding: 1rem 0;}
    nav ul .gnb-submenu dd li>a {display:block;text-align:center;line-height:2.5;font-weight:300;font-size:1.4rem;color: #fff;}
    

    /* 메인 슬라이드 */

    #section01 .bg01 {background-image: url(../img/bg02.png);background-position: 20% 20%;height:37.5rem;position: relative;}
    #section01 .bg02 {background-image: url(../img/bg01.png);background-position: right 60%;height:37.5rem;}
    #section01 .bg01 img {position: absolute;top:3rem;left:50%;transform: translateX(-50%);width: 100%;}

    /* 일정 */
    #section02 {padding: 5rem 0;}
    #section02 h2 {font-size:1.8rem;font-weight:400;margin-bottom:none;text-align: center;}
    #section02 h2 strong {color: #03356c;font-weight:700}
    #section02>div .calendar-l{float: left;width:100%;display:block;padding: 0 0.75rem;}
    #section02>div .calendar-l h2 strong, .calendar-l h2 span {display:inline-block;text-align: center;line-height: 1.2;}
    #section02>div .calendar-l>div {flex-wrap:50%;margin:0 0 0.75rem 0;border:0.25rem solid#ddd;padding: 2rem 1.5rem;}
    #section02>div .calendar-l>div span {display: block;text-align: center;font-size: 1.6rem;position: relative;font-weight: 300;padding-bottom:1rem;}
    #section02>div .calendar-l>div span::after {content: "";display: block;width:2.5rem;height:2px;background: #1168ae;position: absolute;bottom:0rem;left: 50%;transform: translateX(-50%);}
    #section02>div .calendar-l>div p {line-height: 1.5;margin-top:1rem;font-size: 1.4rem;}
    #section02>div .calendar-l>div p em {display: block;font-weight:700;font-size:1.2rem;}
    #section02>div .calendar-r {float: left;width:100%;padding:2rem 0.75rem 0 0.75rem;}
    #section02>div .calendar-r h2 {text-align: center;}
    #section02>div .calendar-r img {width: 100%;}
    #section02 .calendar-r span {display: block;padding: 1.5rem 0;font-size: 1.4rem;font-weight: 700;}

    /* 뉴스 */
    #section03 {background-image: url(../img/bg00.jpg);padding:5rem 0.75rem;background-position: bottom;}
    #section03 h2 {font-size:1.8rem;font-weight:400;margin-bottom:2.5rem;text-align: center;}
    #section03 h2 strong {color: #03356c;font-weight:700}
    #section03 .container {display: grid;grid-template-columns: repeat(4, 1fr);}
    #section03 .container div:nth-child(1) {grid-column: 1 / 4;}
    #section03 .container div:nth-child(2) {background: #f2981e;padding: 5rem 3.5rem;color: #191919;font-weight:500;}
    #section03 h3 {position: relative;padding-bottom: 1.5rem;line-height: 1.3;font-size: 1rem;text-align: center;}
    #section03 h3::after {content: "";display: block;width:4rem;height:2px;background: #191919;position: absolute;bottom:0;left: 50%;transform: translateX(-50%);}
    #section03 p {font-size: 0.8rem;font-weight: 300;margin-top: 2rem;line-height: 1.7;display:none;}
    #section03 .container div:nth-child(3) {background: #1168ae;padding: 5rem 3.5rem;color: #fff;font-weight:500;}
    #section03 .container div:nth-child(3) h3::after {background: #fff;}
    #section03 .container div:nth-child(4) {grid-column: 2 / 5;}
    #section03 img {width: 100%;}

    /* 배경 다운로드 */
    #section04 figure {background-image: url(../img/d02.jpg);background-position:bottom;height:25rem;}
    #section04 figure>div {float: right;padding:5rem 2.5rem 0 0;color: #fff;}
    #section04 figure p {font-size: 1.4rem;margin-bottom:0.5rem ;text-shadow:1px 1px  #1168ae;}
    #section04 figure h3 {font-size: 3rem;font-weight: 900;line-height: 1.2;text-shadow:1px 1px #1168ae,-1px 1px #1168ae,1px -1px #1168ae,-1px -1px #1168ae ;}
    #section04 figure h3 span {display: block;}
    #section04 figure a {display: block;background: #fff;color: #1168ae;width:7.5rem;text-align: center;line-height: 2.5;border: 2px solid#1168ae;font-size: 1rem;font-weight: 500;margin-top: 1rem;}
    #section04 figure a i {margin-left: 0.25rem;transition: 0.3s;}
    #section04 figure a:hover {background:#1168ae;color: #fff;}
    #section04 figure a:hover i {transform: rotate(180deg);}

    /* 연구성과 */
    #section05 {padding:5rem 0.75rem;position: relative;overflow: hidden;}
    #section05 h2 {font-size:1.8rem;font-weight:400;margin-bottom:2.5rem;text-align: center;}
    #section05 h2 strong {color: #03356c;font-weight:700}
    #section05 .container {width:100%;border: 1px solid#1168ae;}
    #section05 .container>div {float: left;width:100%;}
    #section05 .research-img img {width: 100%;}
    #section05 .research-text {padding:3rem 3.5rem 3rem 3.5rem;}
    #section05 .research-text h3 {font-size: 1.2rem;color: #f2981e;font-weight: 700;}
    #section05 .research-text strong {display: block;font-size:1.6rem;font-weight:500;line-height: 1.3;margin:1rem 0 2rem 0;}
    #section05 .research-text p {display: none;font-weight: 300;line-height: 1.5;padding-top:0.5rem;}
    #section05 .research-text>div {position: relative;}
    #section05 .research-text a {display: block;position: relative;margin-top:2.5rem ;}
    #section05 .research-text a::before {content: "";display: block;width:8rem;height: 2px;background: #aaa;position: absolute;bottom:0.4rem;left:0;transition: 0.3s;}
    #section05 .research-text a::after {content: "";display: block;width:1rem;height:1rem;border-top:2px solid#aaa;position: absolute;bottom:0;left:6.85rem;transform: rotate(45deg);transition: 0.3s;}
    #section05 .research-text a:hover::before {background: #03356c;}
    #section05 .research-text a:hover::after {border-top:2px solid#03356c;}
    #section05 .research-text .slick-dots {position: absolute;bottom:1rem;right:3.5rem;font-size:1.2rem;color: #aaa;}
    #section05 .research-text .slick-dots li {display: inline-block;margin:0.25rem;}
    #section05 .research-text .slick-dots li.slick-active {color:#03356c;}

    /* 콘텐츠,공지사항 */
    #section06 {background-image: url(../img/bg00.jpg);padding:5rem 0;background-position: bottom;}
    #section06 h2 {font-size:1.8rem;font-weight:400;margin-bottom:1.5rem;}
    #section06 h2 strong {color: #03356c;font-weight:700}
    #section06>div .content {float: left;width:100%;display: flex;padding: 0 0.75rem;}
    #section06>div .content h2 strong, .content h2 span {display: block;text-align: center;line-height: 1.2;}
    
    #section06>div .content>div figure {float: left;width:33.333333%;padding: 0.75rem;position: relative;}
    #section06>div .content>div figure a {display: block;width:3rem;line-height:3rem;text-align: center;font-size:2rem;border-radius: 50%;color: #fff;position: absolute;top:30%;left: 50%;transform: translate(-50%,-50%);opacity: 0;}
    #section06>div .content>div figure:hover a {opacity: 1;top: 50%;transition: 0.5s;}
    #section06>div .content>div figure:nth-child(1) a, #section06>div .content>div figure:nth-child(2) a {background: #4459b0;}
    #section06>div .content>div figure:nth-child(3) a, #section06>div .content>div figure:nth-child(5) a {background-image: linear-gradient(45deg,orange,orange,red,purple,purple);}
    #section06>div .content>div figure:nth-child(4) a, #section06>div .content>div figure:nth-child(6) a {background: #27d34a;}
    #section06>div .content>div img {width: 100%;}
    #section06 .notice {float: left;width:100%;padding: 2rem 0.75rem 0 0.75rem;}
    #section06 .notice h2 {background: #03356c;color: #fff;text-align: center;line-height:1.7;font-size:1.8rem;font-weight: 100;margin-bottom:0;}
    #section06 .scroll {height:22.25rem; overflow-Y:auto;background:#fff;padding-top: 1rem;}
    #section06 .scroll::-webkit-scrollbar {width:0.3rem;background:#ededef;border-radius:2.5rem;}
    #section06 .scroll::-webkit-scrollbar-thumb {background:#1168ae;border-radius:2.5rem} 
    #section06 .scroll dt {color:#f2981e; font-size:1.4rem;padding-left:1rem;}
    #section06 .scroll dd {padding:0.3rem 1rem 1rem 1rem;font-size:1.6rem;}
    #section06 .scroll dd a {display: block;line-height:1.1;font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    #section06 .scroll dd span {font-size:1.2rem;color: #aaa;}
    #section06 .scroll dd:hover {text-decoration:underline;}

    /* 배너 */
    #section07 {padding:5rem 0.75rem;overflow: hidden;}
    #section07 h2 {font-size:1.8rem;font-weight:400;margin-bottom:1.5rem;padding-left: 0.75rem;text-align: center;}
    #section07 h2 strong {color: #03356c;font-weight:700}
    #section07>div .txt {float: left;width:100%;position: relative;}
    #section07>div .txt .xi-angle-left {display:none;position: absolute;top:7.5rem;left:40rem;font-size: 1.5rem;border:1px solid#aaa;padding:0.5rem;}
    #section07>div .txt .xi-angle-right {display:none;position: absolute;top:11.5rem;left:40rem;font-size: 1.5rem;border:1px solid#aaa;padding:0.5rem;}
    #section07>div .txt i:hover {background: #aaa;color: #fff;}
    #section07>div .bn-wrap {float:left;width: 100%;}
    #section07 .banner-slide figure {border:5px solid transparent;}
    #section07 .banner-slide figure.slick-center {border:5px solid#03356c}
    #section07 .banner-slide figure:hover {border:5px solid#03356c}
    #section07 .banner-slide img {width: 100%;}

    /* section08 */
    #section08 {background: #03356c;}
    #section08>div {padding:0 0.75rem}
    #section08>div ul {display: flex;padding:1.5rem 0;text-align: center;color: #fff;font-size:1.4rem;}
    #section08>div ul li {flex:1;border-left:none;}
    #section08>div ul li a {display: block;}
    #section08>div ul li:last-child {border-right:none;}

    /* footer */
    footer {background-color:#333;padding:2.5rem 0;position: relative;}
    footer>div {padding: 0 0.75rem;color: #999;}
    footer>div>figure {float:left;width:100%;text-align: center;margin-bottom:2rem;}
    footer>div>div {float: right;width:100%;text-align: center;}
    footer>div>div ul {font-size: 0;}
    footer>div>div ul li {display: inline-block;color: #eee;font-size:1.4rem;}
    footer>div>div ul li a {display:block;padding:0.5rem 1rem 1rem 1rem;}
    footer>div>div ul li:last-child a {padding-right:0;}
    footer>div>div ul li:first-child {color: #f2981e;}
    footer address {font-size: 0.7rem;}
    footer address div {margin:2rem 0 3rem 0;}
    footer address div a {margin-left:1rem;font-size: 1.6rem;color: #eee;}
    footer address div a:hover {color: #03356c;text-decoration: underline;}
    footer address span {display: block;margin-top:1rem;}
    footer .totop {position:absolute;bottom:2.5rem;right:2.5rem;cursor:pointer;}
    footer .totop i {font-size:1.5rem;padding:0.5rem;background:#eee;color:#03356c;}

    /* 퀵메뉴 */
    #quick {position: fixed;top:30%;right:-27.6rem;z-index: 999;transition: 0.5s;}
    #quick.on {right: 0;}
    #quick>div {display: flex;}
    #quick>div .txt {text-align: center;width:5rem;background: #191919;color: #fff;font-size:1.2rem;font-weight: 100;height: 5rem;line-height: 2;cursor: pointer;}
    #quick>div .txt.on i {transform: rotate(180deg);}
    #quick>div h3 {padding-top: 0.3rem;}
    #quick>div h3 i {display: block;font-size: 1rem;}
    #quick>div .quick-menu {background: #1168ae;color: #fff;text-align: center;font-size: 1rem;font-weight: 100;}
    #quick>div .quick-menu li {padding:0.5rem 0;border-bottom:1px solid#eee;cursor: pointer;}
    #quick>div .quick-menu li.on {background:#03356c;}
    #quick>div .quick-menu li:last-child {border-bottom: none;}
    #quick>div .quick-menu span {display: block;margin:0.5rem 0 0 0;}
    #quick>div .quick-menu img {width: 50%;}
    #quick>div .quick-smenu {position:relative;width:20rem;visibility: hidden;border-top: 1px solid#ddd;}
    #quick>div .quick-smenu dl {position: absolute;width: 100%;height:21.9rem;overflow-y: auto;background: #fff;padding: 1rem;border-top: 1px solid#ddd;border-bottom: 1px solid#ddd;}
    #quick>div .quick-smenu dl:nth-child(1) {visibility: visible;}
    #quick>div .quick-smenu dl dt {font-size: 1.4rem;border-bottom:2px solid#03356c;padding-bottom:0.3rem;font-weight:700;color: #18244a;margin-bottom:0.5rem;}
    #quick>div .quick-smenu dl dd {font-size: 1.6rem;line-height: 2.3;position: relative;padding-left:1rem;}
    #quick>div .quick-smenu dl dd>a {display: block;padding-left:0.3rem;}
    #quick>div .quick-smenu dl dd::before {content:"\e91b";display: block;font-family: xeicon!important;position:absolute;top:0.1rem;left:0;color: #f2981e;}

    /* 모바일 메뉴 버튼 */
    .mopen {display:block}
    

}