@import url('/common/font/GmarketSans/fonts.css');

/* 메인비주얼 */
.MVisual{ position: relative; height: 100%;}
.MVisual .slider{height: 100%;}
.MVisual .slider .slick-list,
.MVisual .slider .slick-track{ height: 100%;}
.MVisual .slider .item{position: relative; height: 100%;}
.MVisual .slider .item img{position: absolute; left: 50%; top: 0; transform: translateX(-50%); display: block; height: 100%; width: auto; }
.MVisual .slider .item .slogan {position: absolute;top: 11.5rem;left: 50%;transform: translateX(-50%);width: 100%;word-break: keep-all;}
.MVisual .slider .item .slogan p {/* font-family: 'GmarketSans'; */font-weight: 300;font-size: 1.8rem;color: #fff;text-align: center;line-height: 3rem;}
.MVisual .slider .item .slogan p span { font-weight: 700;background: linear-gradient(90deg, #00ddcb, #00b4ff); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.MVisual .control{ display: flex; align-items: center; justify-content: space-between; position: absolute; left: 50%; transform: translateX(-50%); top: 7rem; height: 0; width: 95%; max-width: 62.5rem; z-index: 999; }
.MVisual .control a{transition: 0.15s;}
.MVisual .slider .item .slogan p em{font-size: 2.5rem;font-weight: 700;}
/* 메인비주얼 : active */
.MVisual .control a:hover,
.MVisual .control a:focus{ transform: scale(1.2);}

/* 포토갤러리 */
.gallery{ position: relative; background: #46668ec7; border-radius: 0.5rem; padding: 1.5rem 2rem 2rem;}
.gallery .heading{ white-space: nowrap; margin-right: 6rem; font-size: 1.3rem; color: #fff; line-height: 1; overflow: hidden; font-weight: 600;}
.gallery ul{ height: 11.95rem; display: flex; align-items: flex-start; justify-content: flex-start; margin: 0 -0.9rem; margin-top: 1.75rem;}
.gallery ul li{width: 33.33%; padding: 0 0.9rem;}
.gallery ul li:nth-child(n+4){display: none;}
.gallery ul li a{display: block; width: 100%; height: 100%;}
.gallery ul li a .img{position: relative; height: 10rem; background: #01223e; border-radius: 1.5rem; overflow: hidden;}
.gallery ul li a .img img{position: absolute; display: block; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: 0.15s;}
.gallery ul li a .tit{font-size: 0.8rem; font-weight: 500; color: #fff; margin-top: 1rem; padding: 0 0.25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gallery .more{ display: flex; align-items: center; position: absolute; right: 2rem; top: 1.25rem; background: #fff; border-radius: 5rem; padding: 0.3rem 1rem; color: #00265c; transition: 0.15s;}
.gallery .more i{font-size: 1rem; margin-left: 0.25rem;}
/* 포토갤러리 : no_data */
.gallery .no_data{ height: 11.95rem; margin-top: 1.75rem; display: flex; align-items: center; justify-content: center; color: #fff; }
/* 포토갤러리 : new */
.gallery ul li a.new{position: relative;}
.gallery ul li a.new::before{font-family: 'Montserrat'; font-weight: 600; font-size: 0.7rem; content: 'New'; display: block; padding: 0.5rem 0.25rem; position: absolute; right: 1.5rem; top: -0.5rem; background: #00deb7; z-index: 1; border-radius: 0.5rem; box-shadow: 0.1rem 0.1rem 0.5rem rgba(0,0,0,0.2);}
/* 포토갤러리 : active */
.gallery ul li a:hover .img img,
.gallery ul li a:focus .img img{transform: translate(-50%, -50%) scale(1.1);}
.gallery ul li a:hover .tit,
.gallery ul li a:focus .tit{text-decoration: underline;}
.gallery .more:hover,
.gallery .more:focus{background: #00265c; color: #fff;}

/* 게시판 */
.notice{position: relative;}
.notice .titTab{background: #008a7f; padding-right: 5rem; border-radius: 0.5rem 0.5rem 0 0; overflow: hidden;}
.notice .titTab ul{display: flex; color: #fff;}
.notice .titTab ul li{ flex: 1; text-align: center; max-width: 33.33%;}
.notice .titTab ul li a{position: relative; display: block; white-space: nowrap; overflow: hidden; line-height: 3rem; font-size: 1rem; font-weight: 500;}
.notice .titTab ul li ~ li a::before{content: ''; display: block; position: absolute; width: 0; left: 0; top: 0.8rem; bottom: 0.8rem; border-right: 1px solid #4dada6;}
.notice .tabWrap{background: #fff; height: 15.5rem; border-radius: 0 0 0.5rem 0.5rem;}
.notice .tabWrap .list_box{ position: relative; display: none; padding:1.7rem 1.25rem; height: 100%; }
.notice .tabWrap .list_box ul{height: 100%;}
.notice .tabWrap .list_box ul li{position: relative; padding: 0 0.75rem 0 1.5rem;}
.notice .tabWrap .list_box ul li::before{content: ''; display: block; width: 6px; height: 6px; background: #d8d8d8; border-radius: 50%; position: absolute; top: 50%; left: 0.5rem; transform: translateY(-50%);}
.notice .tabWrap .list_box ul li:nth-child(n+7){display: none;}
.notice .tabWrap .list_box ul li a{ display: flex; align-items: center; justify-content: space-between; line-height: 2rem;}
.notice .tabWrap .list_box ul li a .tit{width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.notice .tabWrap .list_box ul li a .date{display: block; width: 5rem; text-align: right; color: #ccc; }
.notice .tabWrap .list_box .more{ position: absolute; right: 1rem; top: -2.4rem; color: #fff; display: flex; width: 1.75rem; height: 1.75rem; border-radius: 50%; align-items: center; justify-content: center; font-size: 1.2rem; transition: 0.15s;}
/* 게시판 : no_data */
.notice .tabWrap .list_box .no_data{display: flex; align-items: center; justify-content: center; height: 100%; }
/* 게시판 : new */
.notice .tabWrap .list_box ul li a.new::before{font-family: 'Montserrat'; font-weight: 600; content: 'New'; color: #da0000; background: #ffebe9; line-height: 1; margin-right: 0.5rem;}

/* 게시판 : active */
.notice .titTab ul li a.current{background: #fff; color: #000; font-weight: 600;}
.notice .titTab ul li a.current::before{ display: none;}
.notice .titTab ul li a:hover,
.notice .titTab ul li a:focus{font-weight: 800;}
.notice .tabWrap .list_box.on{display: block;}
.notice .tabWrap .list_box ul li a:hover p,
.notice .tabWrap .list_box ul li a:focus p{text-decoration: underline;}
.notice .more:hover,
.notice .more:focus{background: #00574f;}


/* 바로가기 */
.M_link{background: #1358ab; border-radius: 0.5rem 0.5rem 0 0;} 
.M_link ul{display: flex; justify-content: space-between; padding: 1rem; }
.M_link ul li{flex: 1;}
.M_link ul li ~ li{border-left: 1px dotted #a1bcdd;}
.M_link ul li a{ margin: -0.3rem 0; padding: 0 0.5rem; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; color: #fff;}
.M_link ul li a .img{margin-right: 1rem;}
.M_link ul li a .img img{display: block;}
.M_link ul li a .txt{max-width: 10rem; max-height: 2rem; overflow: hidden;}
/* 바로가기 : active */
.M_link ul li a:hover,
.M_link ul li a:focus{text-decoration: underline;}

@media screen and (max-width:1440px) {

    /* 포토갤러리 */
    .gallery ul li{width: 50%;}
    .gallery ul li:nth-child(n+3){display: none;}

}
@media screen and (max-width:1240px) {
    /* 메인비주얼 */
    .MVisual{min-height: 600px;height:100vh;}
    .MVisual .slider .item .slogan {top: 20%;transform: translate(-50%, -50%);}
    .MVisual .slider .item .slogan p { font-size: 1.4rem; line-height: 2.4rem;}
    .MVisual .slider .item .slogan p em{ font-size: 1.4rem; line-height: 2.4rem;}

    /* 포토갤러리 */
    .gallery .heading{font-size: 1.1rem;}
    .gallery ul{height: 10.3rem; margin: 0 -0.5rem; margin-top: 1.25rem;}
    .gallery ul li{padding: 0 0.5rem;}
    .gallery ul li a .img{height: 8.65rem;}
    .gallery ul li a .tit{margin-top: 0.7rem;}
    /* 포토갤러리 : no_data */
    .gallery .no_data{height: 10.3rem; margin-top: 1.25rem;}

    /* 게시판 */
    .notice .titTab ul li a{font-size: 0.8rem;}
    .notice .tabWrap{height: 13rem;}
    .notice .tabWrap .list_box{padding: 1rem 0.5rem;}
    .notice .tabWrap .list_box ul li a{line-height: 1.8rem;}
    .notice .tabWrap .list_box ul li a .tit{padding-right: 1rem;}

}
@media screen and (max-width:950px) {
    /* 포토갤러리 */
    .gallery ul li{width: 100%;}
    .gallery ul li:nth-child(n+2){display: none;}


}
@media screen and (max-width:860px) {
      /* 바로가기 */
    .M_link ul li a{position: relative;height: 100%;margin: 0;padding-left: 1rem;justify-content: flex-start;align-;align-items: center;}
    .M_link ul li a::before{content: '';display: none;position: absolute;left: 0.5rem;top: 0.4rem;width: 4px;height: 4px;border-radius: 50%;background: #30aaff;}
    .M_link ul li a .img{display: block;}

}
@media screen and (max-width:768px) {
    /* 게시판 */
    .notice .titTab ul li a{line-height: 2.5rem;}
    .notice .tabWrap .list_box .more{top: -2.1rem;}

    /* 바로가기 */
    .M_link ul {flex-wrap: wrap; padding: 1rem 0.5rem;}
    .M_link ul li { flex: none; width: 50%;}
    .M_link ul li ~ li{border-left: 0;}
    .M_link ul li:nth-child(n+3){margin-top: 0.5rem;}

}
@media screen and (max-width:480px) { 
    /* 메인비주얼 */
    .MVisual .slider .item .slogan {}
    .MVisual .slider .item .slogan p { font-size: 1rem; line-height: 1.7rem;}

    /* 포토갤러리 */
    .gallery{padding: 1.5rem 1rem;}
    .gallery .heading{margin-right: 2rem;}
    .gallery .more{right: 1.5rem; font-size: 0; padding: 0; background: none; color: #fff;}
    .gallery .more i{margin-left: 0;}

    /* 게시판 */
    .notice .titTab ul{flex-wrap: wrap;}
    .notice .titTab ul li{max-width: 100%;}
    .notice .titTab ul li a{padding: 0 0.5rem;}
    .notice .tabWrap .list_box{padding: 1rem;}
    .notice .tabWrap .list_box ul li{padding-left: 1rem;}
    .notice .tabWrap .list_box ul li::before{left: 0;}
    .notice .tabWrap .list_box ul li a .date{display: none;}

}
@media screen and (max-width:320px) { 
    /* 바로가기 */
    .M_link ul li{width: 100%;}
    .M_link ul li:nth-child(n+2){margin-top: 0.5rem;}
}