@charset "utf-8";

    .mainTitle {
        text-align:center;
        margin-bottom:30px;
        position:relative;
    }
    .mainTitle .Title_T {
        font-size:26px;
        font-family: 'ONE-Mobile-Title'
    }
    .mainTitle .moreBtn {
        border:1px solid #ddd;
        border-radius:15px;
        padding:5px 15px;
        position:absolute;
        right:40px;
        top:0;
        display: flex;
        align-items: center;
    }
    .mainTitle .moreBtn span {
        margin-right:5px;
    }

    .section {
        position:relative;
    }
    .mircenter {
        position:relative;
    }
    #visual .visual {
        height:592px;
        -webkit-transition: all 0.6s ease-out;
        -moz-transition: all 0.6s ease-out;
        -o-transition: all 0.6s ease-out;
        transition: all 0.6s ease-out;
        background-image:url(../img/banner/banner.jpg);
        background-repeat:no-repeat;
        background-position:center center;
    }



    #direct {
        position:absolute;
        width:98%;   
        left:50%;
        bottom:0;
        z-index:10;
        transform:translateX(-50%);
    }
    #notice {
        background-color:#fff;
        border-radius:20px 20px 0 0;
        padding:20px 0;
    }
    #notice .noticeBox {}
    #notice .noticeBox ul {
        display:flex;
        padding:0 20px;
    }
    #notice .noticeBox ul li {
        width:18%;
        margin:0 1%;
        position:relative;
    }
    #notice .noticeBox .inner {
        position:relative;
        display:block;
    }
    #notice .noticeBox ul .img {
        border-radius:10px;
        overflow:hidden;
        margin-bottom:10px;
    }
     #notice .noticeBox ul .img img {
        width:100%;
     }
    #notice .noticeBox ul .tit {
        font-size:18px;
        font-weight:500;
        letter-spacing:-0.45px;
        margin-bottom:15px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    #notice .noticeBox ul .imgTxt {
        display:none;
    }
    #notice .noticeBox ul .imgTxt p,
    #notice .noticeBox ul .txt p{
        font-size:15px;
        line-height:1.47;
        letter-spacing:-0.38px;
        color:#777;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
    }
    #notice .noticeBox ul .dat {
        font-size:15px;
        letter-spacing:-0.38px;
        color:#777;
    }
    #notice .noticeBox ul .ico {
        position:absolute;
        right:10px;
        bottom:0;
    }
    #notice .noticeBox ul .ico span {
        background-color:#1dbecf;
        color:#fff;
        font-size:14px;
        font-weight:500;
        border-radius:10px;
        padding:2px 5px;
    }


    #program {
        background-color:#fbfbfb;
        padding:60px 0 80px;
    }
    #program .programBox {
        display:flex;
        justify-content: center;
    }
    #program .programBox .proBox {
        position:relative;
        margin:0.3%;
    }
    #program .programBox .proBox .programTitle {
        position:absolute;
        left:25px;
        top:25px;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        width: 80%;
    }
    #program .programBox .proBox .programTitle .programTit_T {
        font-family: 'ONE-Mobile-Title';
        font-size:22px;
    }
    #program .programBox .proBox .programTitle .programTit_T span {
        font-family: 'ONE-Mobile-Title';
        font-size:22px;
    }
    #program .programBox .proBox .programTitle .moreview {
        font-size:14px;
        font-weight:500;
        color:#404040;
        letter-spacing:-0.36px;
        border:1px solid #ddd;
        background-color:#fff;
        border-radius:12.5px;
        padding:2px 5px;
    }
    #program .programBox .proBox01 .programTitle .programTit_T span {
        color:#f89507;
    }
    #program .programBox .proBox02 .programTitle .programTit_T span {
        color:#5749a0;
    }
    #program .programBox .proBox03 .programTitle .programTit_T span {
        color:#4e6eda;
    }
    #program .programBox .proBox04 .programTitle .programTit_T span {
        color:#17aaba;
    }
    #program .programBox .proBox05 .programTitle .programTit_T span {
        color:#f67593;
    }

    #news {
        padding:80px 0;
        margin-bottom:80px;
        position:relative;
    }
    #news::before,
    #news::after {
        content:'';
        background-repeat:no-repeat;
        position:absolute;
        z-index: -1;
    }
    #news::before {
        width:164px;
        height:377px;
        background-image:url(../img/main/background_left.png);
        left:0;
        bottom:0;
    }
    #news::after {
        width:209px;
        height:294px;
        background-image:url(../img/main/background_right.png);
        right:0;
        top:0;
    }
    #news .mainTitle {
        text-align:left;
    }
    #news .mainTitle .moreBtn {
        right:auto;
        left:15%;
        top:5px;
    }
    #news .newsBox {
        border:1px solid #ddd;
        padding:20px;
        border-radius:20px;
        background-color:#fff;
    }
    #news .newsBox ul {
        display:flex;
        flex-wrap:wrap;
        overflow:hidden;
    }
    #news .newsBox ul li {
        width:48%;
        margin:1% 1% 0;
        padding:1% 1% 2%;
        position:relative;
    }
    #news .newsBox ul li:nth-child(1)::after,
    #news .newsBox ul li:nth-child(2)::after {
        content:'';
        width:100%;
        height:1px;
        background-color:#ddd;
        position:absolute;
        left:50%;
        bottom:0;
        transform:translateX(-50%);
    }
    #news .newsBox .inner {
        display:flex;
        align-items: flex-start;
    }
    #news .newsBox .img {
        border-radius:10px;
        overflow:hidden;
        margin-right:20px;
    }
    #news .newsBox .box {
        position:relative;
        flex:1;
        height:185px;
    }
    #news .newsBox .box .tit {
        font-size:20px;
        font-weight:500;
        letter-spacing:-0.5px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        width:85%;
    }
    #news .newsBox .box .txt {
        margin-top:15px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
    }
    #news .newsBox .box .txt p {
        font-size:15px!important;
        line-height:1.47!important;
        letter-spacing:-0.38px!important;
        color:#777!important;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
    }
    #news .newsBox .box .dat {
        font-size:15px;
        letter-spacing:-0.38px;
        color:#777;
        margin-top:50px;
        position:absolute;
        right:0;
        bottom:0;
    }
    #news .newsBox ul .ico {
        position:absolute;
        right:10px;
        top:0;
    }
    #news .newsBox ul .ico span {
        background-color:#1dbecf;
        color:#fff;
        font-size:14px;
        font-weight:500;
        border-radius:10px;
        padding:2px 5px;
    }




/*---------------반응형 미디어쿼리----------------*/
@media (max-width:1400px) {
    #visual .visual {
        height:550px;
    }

    .mainTitle .Title_T {
        font-size:22px;
    }

    #program .programBox .proBox img {
        width:100%;
        max-width:300px;
    }
    #program .programBox .proBox .programTitle {
        left:20px;
        top:20px;
    }
    #program .programBox .proBox .programTitle .programTit_T,
    #program .programBox .proBox .programTitle .programTit_T span {
        font-size:20px;
    }
    #program .programBox .proBox .programTitle .moreview {
        display:none;
    }

    #news .mainTitle .moreBtn {
        top:0;
        left:20%;
    }

}
@media (max-width:1200px) {
    #notice .noticeBox .inner {}
}

@media (max-width:1024px) {
    #visual .visual {
        height:480px;
        background-position:top;
    }
    .mainTitle .Title_T {
        font-size:20px;
    }
    #notice .noticeBox ul .tit,
    #news .newsBox .box .tit {
        font-size:17px;
    }
    #notice .noticeBox ul .imgTxt p,
    #notice .noticeBox ul .txt p,
    #notice .noticeBox ul .dat, 
    #news .newsBox .box .txt p,
    #news .newsBox .box .dat {
        font-size:14px;
    }
    #notice .noticeBox ul li {
        width:23%;
    }
    #notice .noticeBox ul li:nth-child(5) {
        display:none;
    }
    #program {
        padding:50px 0 60px;   
    }
    #program .programBox {
        flex-wrap:wrap;
    }
    #program .programBox .proBox{
        width:31.33%;
        margin:1%;
    }
    #program .programBox .proBox .programTitle .programTit_T, 
    #program .programBox .proBox .programTitle .programTit_T span {
        font-size:18px;
    }
    #news {  
        padding: 50px 0;
        margin-bottom: 30px;
    }
    #news .newsBox .img {
        width:150px;
        height:150px;
    }
    #news .newsBox .img img {
        width:100%;
    }
}

@media (max-width:991px) {}

@media (max-width:768px) {
    .mainTitle {
        margin-bottom:10px;
    }
    .mainTitle .moreBtn {
        right:15px;
        padding:5px 10px;
    }


    #visual .visual {
        background-image:url(../img/banner/m_visual.jpg);
        background-position:top;
    }



    #direct {
        width:90%;
    }
    #notice {
        padding-bottom:0;
    }
    #notice .noticeBox ul {
        flex-wrap:wrap;
    }
    #notice .noticeBox .inner {
        height:auto;   
    }
    #notice .noticeBox ul .img {
        max-width:320px;
        width:100%;
        margin:0 auto;
    }
    #notice .noticeBox ul .box {
        margin-top:20px;
    }
  
    #notice .noticeBox ul li {
        width:100%;
        margin:1% 0;
        padding:1% 1% 2%;
    }

    #notice .noticeBox ul li:nth-child(2),
    #notice .noticeBox ul li:nth-child(3),
    #notice .noticeBox ul li:nth-child(4) {
            display:none;
    }



    #program .programBox .proBox{
        width:100%;
        margin:1% 0;
        height:100px;
        border-radius:20px;
    }
    #program .programBox .proBox .moIcon {
        background-repeat:no-repeat;
        background-position:90% center;
        background-size:auto 100%;
        width:100%;
        height:100%;
    }
    #program .programBox .proBox img {
        display:none;
    }
    #program .programBox .proBox01 {
        background: rgb(255,246,209);
        background: radial-gradient(circle, rgba(255,246,209,1) 43%, rgba(252,238,180,1) 90%, rgba(252,238,177,1) 100%);
    }
    #program .programBox .proBox02 {
        background: rgb(234,230,254);
        background: radial-gradient(circle, rgba(234,230,254,1) 43%, rgba(215,208,249,1) 90%, rgba(215,208,249,1) 100%);
    }
    #program .programBox .proBox03 {
        background: rgb(231,237,255);
        background: radial-gradient(circle, rgba(231,237,255,1) 43%, rgba(211,221,255,1) 90%, rgba(200,212,252,1) 100%);
    }
    #program .programBox .proBox04 {
        background: rgb(215,243,246);
        background: radial-gradient(circle, rgba(215,243,246,1) 43%, rgba(189,235,240,1) 90%, rgba(186,238,244,1) 100%);
    }
    #program .programBox .proBox05 {
        background: rgb(255,237,241);
        background: radial-gradient(circle, rgba(255,237,241,1) 43%, rgba(255,228,234,1) 90%, rgba(255,228,234,1) 100%);
    }
    #program .programBox .proBox01 .moIcon {
        background-image:url(../img/main/m_quick_1.png);
    }
    #program .programBox .proBox02 .moIcon {
        background-image:url(../img/main/m_quick_2.png);
    }
    #program .programBox .proBox03 .moIcon {
        background-image:url(../img/main/m_quick_3.png);
    }
    #program .programBox .proBox04 .moIcon {
        background-image:url(../img/main/m_quick_4.png);
    }
    #program .programBox .proBox05 .moIcon {
        background-image:url(../img/main/m_quick_5.png);
    }

    #news .mainTitle {
        text-align:center;
    }
    #news .newsBox .box {
        height:125px;
    }
    #news .newsBox ul li {
        width:100%;
        margin:1% 0;
    }
    #news .newsBox ul li:nth-child(3)::after {
        content: '';
        width: 100%;
        height: 1px;
        background-color: #ddd;
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
    }

    #news .mainTitle .moreBtn {
        left:auto;
        right:0;
        background-color:#fff;
    }
    #news .newsBox .img {
        width:120px;
        height:120px;
    }

    #notice .noticeBox ul .dat, 
    #news .newsBox .box .dat {
        display:none;
    }
}        

@media (max-width:640px) {
    #visual .visual {
        height:540px;
    }
}
@media (max-width:480px) {
    #notice .noticeBox .inner {
        height:auto;
    }
    #notice .noticeBox ul li {
        width:100%;
        margin:1% 0;
        position:relative;
        padding:10px 0;
    }
    #notice .noticeBox ul .dat {
        position:unset;
    }
    #notice .noticeBox ul .ico {
        bottom:10px;
    }
}
@media (max-width:400px) {
    #program .programBox .proBox {
        width:100%;
        margin:1% auto;
        max-width:300px;
    }
}
@media (max-width:320px) {}