@charset "UTF-8";

body {font-family: 'Pretendard'; background-color: #f5f5f5; color: #333;}

header {width: 100%; position: absolute; top: 0; z-index: 99;}
header .header-container {width: 1300px; height: 80px; margin: 0 auto; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
header .header-container h1#logo {width: 211px; height: 34px; font-size: 0; text-indent: -99999px; background: url("/images/logo_header.png") no-repeat center/contain;}
header .header-container a#linkNavi {display: block; position: relative; width: 116px; height: 36px; font-size: 0; text-indent: -99999px; border: 1px rgba(255, 255, 255, 0.90) solid; border-radius: 50px; box-sizing: border-box; transition: all .5s;}
header .header-container a#linkNavi::before {display: block; content: ""; width: 65px; height: 14px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url("/images/logo_header_ipnavi.png") no-repeat center/65px auto;}
header .header-container a#linkNavi:hover {border: none; background: linear-gradient(94deg, #2773B3 0%, #398ED7 100%);}


.main {width: 100%; height: 812px; background: url("/images/img_main-bg.png") no-repeat center/cover;}
.main .main-container {width: 1300px; margin: 0 auto; padding-top: 200px;}
.main .main-container .main-text h2 {position: relative; font-size: 40px; color: #fff; font-weight: 600; padding-top: 30px;}
.main .main-container .main-text h2::before {position: absolute; top: 0; left: 0; display: block; content:""; display: block; width: 40px; height: 5px; background-color: #00ABFC;}
.main .main-container .main-text p {margin-top: 24px; color: #fff; font-size: 22px; letter-spacing: -.5px; line-height: 32px;}
.main .main-container .main-menu {display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 60px;}
.main .main-container .main-menu .main-menu__item a {display: block; width: 409px; height: 210px; padding: 32px; background-repeat: no-repeat; background-size: 90px auto; background-position: right 32px bottom 32px; box-sizing: border-box; border-radius: 10px; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.10); transition: background-color .2s;}
.main .main-container .main-menu .main-menu__item.benefit a {background-color: #6290B0; background-image: url("/images/icon_benefit.png");}
.main .main-container .main-menu .main-menu__item.cooperation a {background-color: #54BAC5; background-image: url("/images/icon_cooperation.png");}
.main .main-container .main-menu .main-menu__item.researcher a {background-color: #7A87C3; background-image: url("/images/icon_researcher.png");}
.main .main-container .main-menu .main-menu__item a:hover {background-color: #5B6275;}
.main .main-container .main-menu .main-menu__item h3 {display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; font-size: 24px; font-weight: 600;}
.main .main-container .main-menu .main-menu__item h3 span {display: block; margin-right: 6px;}
.main .main-container .main-menu .main-menu__item p {margin-top: 10px; color: #f0f0f0; font-size: 18px;}


section {width: 1300px; margin: 100px auto; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
section article {width: 624px;}
section article h3 {position: relative; margin-bottom: 32px; padding-top: 16px; font-size: 28px; font-weight: 600;}
section article h3::before {position: absolute; top: 0; left: 0; content: ""; display: block; width: 26px; height: 4px; background-color: #00abfc;}
section article .subject {font-size: 18px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .2s;}
section article a:hover .subject {color: #00ABFC;}
section article .period, section article .date {color: #999; font-size: 16px;}
section article.board-left .board-announce-list li:not(.btn-more) a {display: block; width: 100%; height: 134px; overflow: hidden; padding: 26px; box-sizing: border-box; margin-bottom: 16px; background-color: #fff; border-radius: 8px;  box-shadow: 4px 4px 50px rgba(98.81, 98.81, 98.81, 0.10);}
section article.board-left .board-announce-list li.btn-more a {display: -ms-flexbox; display: -webkit-box; display: flex; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 16px 0; font-size: 18px; font-weight: 500; background-color: #239AD7; color: #fff; border-radius: 8px; box-shadow: 10px 10px 50px rgba(101, 101, 101, 0.10);}
section article.board-left .board-announce-list li.btn-more a span {margin-right: 6px;}
section article.board-left .board-announce-list .board-list__item-top {display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;}
section article.board-left .board-announce-list .board-list__item-top span.badge {padding: 2px 10px; border: 1px solid; font-size: 14px; border-radius: 50px; box-sizing: border-box;} 
section article.board-left .board-announce-list .board-list__item-top span.badge.pink {color: #F975CC; border-color: #F975CC;}
section article.board-left .board-announce-list .board-list__item-top span.badge.orange {color: #F89D1C; border-color: #F89D1C;}
section article.board-left .board-announce-list .board-list__item-top span.badge.green {color: #30C8BF; border-color: #30C8BF;}
section article.board-left .board-announce-list .board-list__item-top .icon-first {width: 17px; height: 20px; background: url("/images/icon_badge.png") no-repeat center/contain;}
section article.board-left .board-announce-list .subject {width: 100%; padding: 16px 0;}

section article.board-right .board-notice-list {width: 100%; padding: 0 20px; box-sizing: border-box; background-color: #fff; border-radius: 10px; box-shadow: 4px 4px 50px rgba(98.81, 98.81, 98.81, 0.10);}
section article.board-right .board-notice-list li:not(:last-of-type) {border-bottom: 1px solid #e0e0e0;}
section article.board-right .board-notice-list li a {display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 40px 8px;}
section article.board-right .board-notice-list li .subject {width: 400px;}
section article.board-right .btn-link-clean {display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 91px; margin-top: 16px; padding: 24px 28px; box-sizing: border-box; background-color: #5B6275; color: #fff; border-radius: 10px; box-shadow: 10px 10px 50px rgba(99, 99, 99, 0.10); }
section article.board-right .btn-link-clean h4 {font-size: 22px; font-weight: 600; padding-left: 36px; background: url("/images/icon_megaphone.png") no-repeat left center/33px;}
section article.board-right .btn-link-clean p {color: #f0f0f0; line-height: 1.4; letter-spacing: -.5px;}


footer {width: 100%;}
footer .footer-top {width: 100%; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;}
footer .footer-top ul {width: 1300px; margin: 0 auto; padding: 20px 0; display: -ms-flexbox; display: -webkit-box; display: flex;}
footer .footer-top ul li:not(:last-of-type) {position: relative; padding-right: 50px;}
footer .footer-top ul li:not(:last-of-type)::after {position: absolute; top: 0; right: 25px; display: block; content: ""; width: 1px; height: 15px; background-color: #cfcfcf;}
footer .footer-top ul li a {color: #999; font-size: 14px;}
footer .footer-top ul li a strong {font-weight: 600;}
footer .footer-bottom {width: 1300px; margin: 0 auto; padding: 28px 0 40px; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
footer .footer-bottom address p {color: #999; font-size: 14px; line-height: 20px; letter-spacing: -.5px;}
footer .footer-bottom address .copy {margin-top: 12px; color: #bbb;}
footer .footer-bottom .footer-logo {display: -ms-flexbox; display: -webkit-box; display: flex;}
footer .footer-bottom .footer-logo a {font-size: 0; text-indent: -99999px;}
footer .footer-bottom .footer-logo a.kipo {display: block; margin-right: 50px; width: 93px; height: 36px; background: url("/images/logo_footer_kipo.png") no-repeat center/contain}
footer .footer-bottom .footer-logo a.koipa{display: block; width: 195px; height: 36px; background: url("/images/logo_footer_koipa.png") no-repeat center/contain}

