@charset "UTF-8";
/* font color */
.fc_black {
color: #000;
}

.fc_deepgray {
color: #333;
}

.fc_orange {
color: #e73100;
}

.fc_blue {
color: #3679C1;
}

.fc_cobalt {
color: #02728D;
}

.fc_red {
color: #c10101;
}

.fc_green {
color: #3A7525;
}

@font-face {
font-family: "Pretendard";
src: url("/static/font/Pretendard/PretendardVariable.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Pretendard-ExtraBold";
src: url("/static/font/Pretendard/Pretendard-ExtraBold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
* {
box-sizing: border-box;
}

.bu2 {
margin: 40px 0 20px;
}

a {
color: #000;
}

button {
border: none;
background-color: transparent;
}

@media (max-width: 1199px) {
#header {
height: unset !important;
margin-bottom: unset !important;
}
}

.layout-bg {
display: none;
}

main .container {
max-width: 1320px;
}
main .container.section2, main .container.section4, main .container.section5 {
max-width: 1280px;
}

.section1 .left {
margin-top: -153px;
position: relative;
z-index: 0;
border-radius: 0 0 20px 20px;
}
@media (max-width: 749px) {
.section1 .left {
margin-inline: -10px;
max-width: unset;
width: unset;
}
}
.section1 .swiper-slide {
width: 100%;
}
.section1 .swiper a {
display: block;
}
.section1 .swiper a .img {
display: block;
}
.section1 .swiper a .img img {
object-fit: cover;
}
@media (max-width: 1199px) {
.section1 .swiper a .img img {
height: 590px;
border-radius: 0 0 20px 20px;
}
}
.section1 .swiper-ctrl {
color: #fff;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
position: absolute;
bottom: 10%;
left: 61px;
width: max-content;
z-index: 9;
}
@media (max-width: 749px) {
.section1 .swiper-ctrl {
bottom: 33px;
left: 30px;
}
}
.section1 .swiper-ctrl button {
width: 40px;
height: 40px;
background-position: 50%;
background-repeat: no-repeat;
}
.section1 .swiper-ctrl button:hover, .section1 .swiper-ctrl button:focus {
outline: 1px dashed #000;
outline-offset: -3px;
border-radius: 50%;
}
.section1 .swiper-ctrl-prev {
background-image: url(/static/portal/img/main/btn-prev.png);
}
.section1 .swiper-ctrl-next {
background-image: url(/static/portal/img/main/btn-next.png);
}
.section1 .swiper-ctrl-stop {
background-image: url(/static/portal/img/main/btn-stop.png);
}
.section1 .swiper-ctrl-play {
background-image: url(/static/portal/img/main/btn-play.png);
}
.section1 .swiper-ctrl .num,
.section1 .swiper-ctrl .total {
min-width: 12px;
text-align: center;
}
.section1 .swiper-ctrl .popup-paging {
display: flex;
align-items: center;
gap: 3px;
width: auto;
--progress-duration: 6s; /* autoplay.delay(6000ms) 동일하게 */
}
.section1 .swiper-ctrl .popup-paging .num {
color: #4282ba;
font-weight: bold;
}
.section1 .swiper-ctrl .popup-paging .progress {
opacity: 1;
position: relative;
width: 60px;
height: 4px;
border-radius: 10px;
background: #fff;
overflow: hidden;
margin: 0 8px;
}
.section1 .swiper-ctrl .popup-paging .progress .fill {
display: inline-block;
width: 0%;
height: 100%;
background: #4282ba;
transition: width 4s linear;
position: absolute;
top: 0;
left: 0;
z-index: 9;
animation: fillBar var(--progress-duration) linear forwards;
}
@keyframes fillBar {
from {
width: 0%;
}
to {
width: 100%;
}
}
.section1 .right {
margin-top: 57px;
}
@media (max-width: 749px) {
.section1 .right {
margin-top: 40px;
}
}
.section1_1 a {
position: relative;
font-size: 20px;
}
.section1_1 .img {
display: block;
aspect-ratio: 585/320;
max-width: 585px;
}
@media (max-width: 1199px) {
.section1_1 .img {
max-width: 100%;
}
}
.section1_1 .img img {
width: 100%;
height: 100%;
object-fit: cover;
vertical-align: middle;
}
.section1_1 .title {
position: absolute;
bottom: 0;
left: 0;
display: block;
padding: 13px 20px;
width: 100%;
color: #fff;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
font-weight: 600;
background: rgba(38, 34, 98, 0.6);
}
.section1_2 {
margin-top: 32px;
position: relative;
}
.section1_2 h3 {
font-size: 24px;
font-family: "Pretendard-ExtraBold";
margin-bottom: 21px;
}
.section1_2 ul {
display: flex;
flex-direction: column;
gap: 20px;
}
.section1_2 ul a {
width: 100%;
display: flex;
justify-content: space-between;
gap: 30px;
flex-shrink: 0;
}
@media (max-width: 749px) {
.section1_2 ul a {
gap: 20px;
}
}
.section1_2 ul .img {
display: block;
aspect-ratio: 180/120;
width: 180px;
}
@media (max-width: 749px) {
.section1_2 ul .img {
aspect-ratio: 120/80;
width: 120px;
height: 80px;
}
}
.section1_2 ul .img img {
width: 100%;
height: 100%;
object-fit: cover;
vertical-align: middle;
}
.section1_2 ul .txt-set {
width: calc(100% - 180px - 30px);
}
@media (max-width: 749px) {
.section1_2 ul .txt-set {
width: calc(100% - 120px - 20px);
}
}
.section1_2 ul .txt-set .title {
width: 100%;
padding-top: 15px;
font-size: 20px;
font-weight: 600;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
flex-shrink: 0;
margin-bottom: 2px;
}
@media (max-width: 749px) {
.section1_2 ul .txt-set .title {
overflow: hidden;
text-overflow: ellipsis;
display: block;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ie .section1_2 ul .txt-set .title {
display: block;
height: 32px;
overflow: hidden;
}
.section1_2 ul .txt-set .title {
white-space: normal;
}
}
.section1_2 ul .txt-set .txt {
overflow: hidden;
text-overflow: ellipsis;
display: block;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ie .section1_2 ul .txt-set .txt {
display: block;
height: 32px;
overflow: hidden;
}
@media (max-width: 749px) {
.section1_2 ul .txt-set .txt {
overflow: hidden;
text-overflow: ellipsis;
display: block;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
.ie .section1_2 ul .txt-set .txt {
display: block;
height: 64px;
overflow: hidden;
}
}
.section1_2 .more {
position: absolute;
top: 6px;
right: 0;
font-size: 14px;
}

.txtset {
position: absolute;
left: 61px;
bottom: 24.6296296296%;
color: #fff;
word-break: keep-all;
}
@media (max-width: 749px) {
.txtset {
left: 30px;
bottom: 123px;
}
.txtset br {
display: none;
}
}
.txtset .txt1 {
font-size: 47.5px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: -2.38px;
text-align: left;
}
@media (max-width: 749px) {
.txtset .txt1 {
font-size: 26px;
letter-spacing: -1.3px;
}
}
.txtset .txt2 {
margin-top: 20px;
font-size: 17.5px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: 1.71;
letter-spacing: -0.88px;
text-align: left;
}
@media (max-width: 749px) {
.txtset .txt2 {
font-size: 16.5px;
letter-spacing: -0.83px;
}
}

.section2.container {
padding: 50px 0 70px;
}
@media (max-width: 1199px) {
.section2.container {
padding: 20px 0 30px;
}
}
.section2.container ul {
display: flex;
justify-content: space-between;
overflow-y: hidden;
overflow-x: auto;
}
.section2.container ul li {
min-width: 120px;
}
.section2.container ul a {
display: block;
text-align: center;
}
.section2.container ul a .img {
position: relative;
display: block;
width: 100%;
height: 90px;
margin-bottom: 10px;
text-align: center;
}
.section2.container ul a .img img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.section3 {
overflow: hidden;
}
.section3 h2 {
text-align: center;
font-size: 30px;
font-family: "Pretendard-ExtraBold";
line-height: 1;
margin-bottom: 12px;
}
.section3 .tit {
color: #757575;
text-align: center;
margin: 0 auto;
margin-bottom: 25px;
word-break: keep-all;
}
.section3 .tit br {
display: none;
}
@media (max-width: 749px) {
.section3 .tit br {
display: block;
}
}
.section3 .service-swiper {
position: relative;
}
.section3 .service-swiper .swiper {
overflow: visible;
margin: 0 -30px;
}
@media (max-width: 1199px) {
.section3 .service-swiper .swiper {
overflow: hidden;
margin: 0 -30px 0 0;
}
}
.section3 .service-swiper__ctrl button {
width: 60px;
height: 60px;
position: absolute;
top: 50%;
transform: translate(0, -50%);
z-index: 99;
box-shadow: 0 24px 20px 2px rgba(0, 0, 0, 0.15);
border-radius: 50%;
}
.section3 .service-swiper__ctrl__prev {
left: 184px;
background: url(/static/portal/img/main/service_prev.png);
}
@media (max-width: 1199px) {
.section3 .service-swiper__ctrl__prev {
left: -12px;
}
}
.section3 .service-swiper__ctrl__next {
right: 184px;
background: url(/static/portal/img/main/service_next.png);
}
@media (max-width: 1199px) {
.section3 .service-swiper__ctrl__next {
right: -12px;
}
}
.section3 ul li {
width: 260px;
}
.section3 ul li a {
position: relative;
display: block;
width: 100%;
height: 360px;
color: #fff;
padding: 30px;
word-break: keep-all;
background-size: cover;
background-position: 50%;
background-repeat: no-repeat;
}
.section3 ul li a:hover::before {
content: "";
display: inline-block;
width: 100%;
height: 100%;
background-color: rgba(38, 34, 98, 0.85);
position: absolute;
top: 0;
left: 0;
}
.section3 ul li a:hover::after {
content: "";
display: inline-block;
vertical-align: middle;
width: 44px;
height: 44px;
background: url(/static/portal/img/main/btn_more.png) no-repeat;
position: absolute;
bottom: 30px;
right: 30px;
}
.section3 ul li a:hover .txt {
display: block;
}
.section3 ul li a.ico1 {
background-image: url(/static/portal/img/main/img_service1.png);
}
.section3 ul li a.ico2 {
background-image: url(/static/portal/img/main/img_service2.png);
}
.section3 ul li a.ico3 {
background-image: url(/static/portal/img/main/img_service3.png);
}
.section3 ul li a.ico4 {
background-image: url(/static/portal/img/main/img_service4.png);
}
.section3 ul li a.ico5 {
background-image: url(/static/portal/img/main/img_service5.png);
}
.section3 ul li a.ico6 {
background-image: url(/static/portal/img/main/img_service6.png);
}
.section3 ul li a.ico7 {
background-image: url(/static/portal/img/main/img_service7.png);
}
.section3 ul li a.ico8 {
background-image: url(/static/portal/img/main/img_service8.png);
}
.section3 ul li a.ico9 {
background-image: url(/static/portal/img/main/img_service9.png);
}
.section3 ul li a.ico10 {
background-image: url(/static/portal/img/main/img_service10.png);
}
.section3 ul li a .title {
display: block;
font-size: 24.5px;
font-weight: 600;
line-height: 1.3;
margin-bottom: 10px;
position: relative;
z-index: 9;
}
.section3 ul li a .txt {
display: none;
font-size: 13.5px;
line-height: 1.6;
position: relative;
z-index: 9;
}

.section4.container {
padding: 60px 0;
}
@media (max-width: 1199px) {
.section4.container {
margin: 0 20px;
}
}
@media (max-width: 749px) {
.section4.container {
margin: 0 10px;
}
}
@media (min-width: 1200px) {
.section4.container {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 110px;
}
.section4.container > * {
min-width: 0;
}
}
.section4.container .main-notices {
position: relative;
}
@media (min-width: 1200px) {
.section4.container .main-notices::before {
content: "";
position: absolute;
right: -80px;
top: 0;
height: 100%;
border-right: 1px solid #ddd;
}
}
@media (max-width: 1199px) {
.section4.container .main-notices ul {
margin-bottom: 26px;
}
}
.section4.container .main-notices ul li {
margin-top: 20px;
}
.section4.container .main-notices .date {
display: block;
color: #4282ba;
font-weight: 600;
margin-bottom: 8px;
}
.section4.container .main-notices .tit {
width: 100%;
font-size: 18px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
}
.section4.container .main-notices .more {
position: absolute;
top: -2px;
right: 0;
background-color: #eef1f6;
border-radius: 5px;
font-size: 14px;
padding: 7px 10px;
}
@media (max-width: 1199px) {
.section4.container .main-notices .more {
position: static;
}
}
.section4.container .notice-tab {
display: flex;
gap: 40px;
margin-bottom: 35px;
}
@media (max-width: 1199px) {
.section4.container .notice-tab {
margin-bottom: 25px;
}
}
.section4.container .notice-tab a {
font-size: 20px;
font-weight: 600;
}
.section4.container .tabpanel {
display: none;
}
.section4.container .tabpanel.on {
display: block;
}
.section4.container .left .notice-tab a.on {
padding-left: 27px;
background: url(/static/portal/img/main/ico_notice1.png) 0 50% no-repeat;
}
@media (max-width: 1199px) {
.section4.container .right {
margin-top: 45px;
}
}
.section4.container .right .notice-tab a.on {
padding-left: 33px;
background: url(/static/portal/img/main/ico_notice2.png) 0 50% no-repeat;
}

.quicklink ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px 10px;
}
.quicklink a {
display: block;
text-align: center;
word-break: keep-all;
}
.quicklink a span {
display: block;
margin-top: 10px;
}

.footer {
margin-top: 0 !important;
}
.footer .btn-chatbot {
top: -424px;
}
@media (max-width: 1199px) {
.footer .btn-chatbot {
top: -442px;
right: -10px;
}
}

.mobile-scroller-x {
display: none;
position: relative;
}
.mobile-scroller-x::before {
content: "";
display: block;
position: absolute;
z-index: 99;
top: -4px;
width: 44px;
height: 44px;
animation: tableScrollAni 4s infinite;
background: url(/static/portal/img/main/ico-m-swipe.png) 50% no-repeat;
}
@media (max-width: 749px) {
.mobile-scroller-x {
display: block;
}
}

@keyframes tableScrollAni {
0% {
left: 46%;
opacity: 0.3;
}
50% {
left: 54%;
opacity: 1;
}
100% {
left: 46%;
opacity: 0.3;
}
}
@media (min-width: 1200px) {
.user {
margin-right: 30px;
}
}
.user a {
color: #fff !important;
}
/*# sourceMappingURL=main-local.css.map */