.apply{}

.apply .block{
    position: relative;
    width:100%;
    text-align: left;
    margin-top:100px;
}
.apply .block:first-child{
    margin-top:0;
}
.apply .block .title{
    margin-bottom:35px;
}

.apply .block .title i{
    position: relative;
    display:inline-block;
    width:18px;
    height:18px;
    border-radius:30px;
    background-color:#004098;
}
.apply .block .title i>font{
    position:absolute;
    display:inline-block;
    background-color:#fff;
    width:1px;
    height:5px;
}
.apply .block .title i>font:nth-child(1){
    top:28%;
    left:50%;
    transform: rotate(-45deg);
}
.apply .block .title i>font:nth-child(2){
    top:45%;
    left:50%;
    transform: rotate(45deg);
}
.apply .block .title span{
    display:inline-block;
    padding-left:5px;
    font-size:1.375rem;
    line-height:18px;
    font-weight:500;
    color:#111;
    vertical-align:top;
}
.apply .block .cont{
    font-size:1rem;
    line-height:1.313rem;
    word-break: keep-all;
}
.apply .block .list ul{
    width:100%;
}
.apply .block .list ul, .apply .block .list ul>li{
    display:inline-block;
}
.apply .block .list ul>li{
    position: relative;
    width: 23%;
    height:460px;
    padding-bottom:60px;
    margin-left: 2.666%;
    vertical-align: top;
    border:1px solid rgba(0,0,0,0.15);
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.apply .block .list ul>li:nth-child(4n-3){
    margin-left:0;
}
.apply .block .list ul>li .element{
    display:inline-block;
    width:100%;
    cursor:pointer
}
.apply .block .list ul>li .img, .apply .block .list ul>li .box{
    position: relative;
    width:100%;
}
.apply .block .list ul>li .img{
    
    background-color:#fff;
    object-fit: cover;
    aspect-ratio: 16 / 11;
    overflow:hidden;
}
.apply .block .list ul>li .img>img{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    max-width:100%;
    object-fit: cover;
}
.apply .block .list ul>li .box{
    padding:20px;
}
.apply .block .list ul>li .box i, .apply .block .list ul>li .box strong, .apply .block .list ul>li .box dl, .apply .block .list ul>li .box dl>dd{
    display:inline-block;
    width:100%;
}
.apply .block .list ul>li .box i{
    padding-bottom:5px;
    font-size:0.875rem;
    line-height:0.875rem;
    color:#004098;
    font-weight:500;
    font-style:normal;
}
.apply .block .list ul>li .box strong{
    padding-bottom:13px;
    font-size:1.313rem;
    line-height:1.313rem;
    color:#111;
}

.apply .block .list ul>li .box dl>dd{
    position: relative;
    padding-left:85px;
    padding-bottom:6px;
    
}
.apply .block .list ul>li .box dl>dd span, .apply .block .list ul>li .box dl>dd font{
    
    display:inline-block;
    vertical-align:top;
    font-size:0.875rem;
    line-height:1rem;
    letter-spacing:-0.01rem;
    word-break: keep-all;
}
.apply .block .list ul>li .box dl>dd font{
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* 최대 2줄 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.apply .block .list ul>li .box dl>dd span{
    position: absolute;
    top:0;
    left:0;
    width:70px;
    margin-right:10px;
    color:#111;
}
.apply .block .list ul>li .box dl>dd span::after{
    content: '';
    display:inline-block;
    position:absolute;
    top:2px;
    right:0;
    width:1px;
    height:10px;
    background-color:#ccc;
}
.apply .block .list ul>li .btn{
    position:absolute;
    bottom:20px;
    left:20px;
    display:flex;
    align-items:center;
    justify-content: center;
    width:calc(100% - 40px);
    height:40px;
    
    background-color:#004098;
}
.apply .block .list ul>li .btn>span{
    display:inline-block;
    font-size:1.063rem;
    line-height:1.063rem;
    color:#fff;

}
.apply .block .list ul>li .btn i{
    position: relative;
    display:inline-block;
    width:14px;
    height:14px;
    margin-left:7px;
    border-radius:30px;
    background-color:#fff;
}
.apply .block .list ul>li .btn i>font{
    position:absolute;
    display:inline-block;
    background-color:#004098;
    width:1px;
    height:5px;
}
.apply .block .list ul>li .btn i>font:nth-child(1){
    top:28%;
    left:50%;
    transform: rotate(-45deg);
}
.apply .block .list ul>li .btn i>font:nth-child(2){
    top:45%;
    left:50%;
    transform: rotate(45deg);
}
.apply .block .list ul>li .btn input[type=radio]{
    width:14px;
    height:14px;
    margin-left:7px;
    border:none;
}
.apply .block .list ul>li .btn input[type=radio]:checked{
  background:url(../images/common/iconRadio2.png) center center no-repeat #fff;
  background-size:8px;
}



.apply .block .list ul>li:hover, .apply .block .list ul>li.active{
    border:1px solid rgba(0,64,152,0.3);
    
    background-color: rgba(0,0,0,0.025);
}
.apply .block .list ul>li.active{
    border:1px solid rgba(0,64,152,0.7);
    background-color: rgba(0,0,0,0.035);
    box-shadow:5px 5px 3px rgba(0,0,0,0.1);
}

.apply .block .list.style1 ul>li{
    height:430px;
}
.apply .block .list.style1 ul>li .box dl>dd{
    padding-left:70px;
}
.apply .block .list.style1 ul>li .box dl>dd span{
    width:60px;
}



.apply .block2{
    margin-top:50px;
    padding:30px;
    background-color:#eae5e3;
    border:1px solid rgba(0,0,0,0.1);
}
.apply .block2 .date, .apply .block2 .time, .apply .block2 a{
    position: relative;
    display:inline-block;
    height:56px;
    vertical-align:top;
}
.apply .block2 div>input[type="text"], .apply .block2 div>select{
    width:100%;
    border-radius:0;
    vertical-align:top;
}
.apply .block2 .date{
    width:200px; 
    font-size:1rem;
    line-height:1rem;
}
.apply .block2 .date *{
    font-size: initial;
    line-height:initial;
}
.apply .block2 div>input[type="text"]{
    padding-left:15px;
    padding-right:45px;
}
.apply .block2 .date i{
    position:absolute;
    display:block;
    top:50%;
    right:20px;
    width:22px;
    height:22px;
    background: url(../images/content/iconCalendar.png) center no-repeat;
    background-size:100%;
    transform: translate(0,-50%);
    opacity:0.7;
    z-index:1;
}
.apply .block2 .time{
    width:300px;
    margin-left:30px;
}
.apply .block2 .time select{
    width:calc(50% - 15px);
    padding-left:15px;
    height:100%;
    background: url(../images/common/icon_arrowbottom2.png) 92% center no-repeat #fff;
    background-size:14px;
}
.apply .block2 .time span{
    display:inline-block;
    width:30px;
    height:100%;
}
.apply .block2 a{
    display:inline-block;
    margin-left:30px;
    width:220px;
    height:56px;
    background-color: #004098;
}
.apply .block2 a.st1{
    background-color:#333;
}
.apply .block2 a span, .apply .block2 a i{
    display:inline-block;
    vertical-align:middle;
}
.apply .block2 a span{
    padding-right:5px;
    font-size: 1.313rem;
    line-height:56px;
    color:#fff;
}
.apply .block2 a i{
    position: relative;
    display:inline-block;
    width:22px;
    height:22px;
    border-radius:30px;
    background-color:#fff;
}
.apply .block2 a i>font{
    position:absolute;
    display:inline-block;
    background-color:#004098;
    width:1px;
    height:7px;
}
.apply .block2 a.st1 i>font{
    background-color:#333;
}
.apply .block2 a i>font:nth-child(1){
    top:28%;
    left:50%;
    transform: rotate(-45deg);
}
.apply .block2 a i>font:nth-child(2){
    top:45%;
    left:50%;
    transform: rotate(45deg);
}


@media only screen and (max-width : 1024px) {
    .apply{
        max-width:600px;
    }

    .apply .block .list ul>li{
        position: relative;
        width: 49%;
        height:430px;
        margin-top:2%;
        margin-left:2%;
    }
    .apply .block .list ul>li:nth-child(1), .apply .block .list ul>li:nth-child(2){
        margin-top:0;
    }
    .apply .block .list ul>li:nth-child(2n-1){
        margin-left:0;
    }
    .apply .block .list ul>li:nth-child(4n-3){
        margin-left:0;
    }
    .apply .block .list ul>li .img{
        height:200px;
        object-fit: cover;
        aspect-ratio: none;
        overflow:hidden;
    }
    .apply .block .list.style1 ul>li{
        height:410px;
    }
    .apply .block2{
        padding:20px;
    }
    .apply .block2 .date, .apply .block2 .time, .apply .block2 a{
        width:100%;
        margin-left:0;
        margin-right:0;
    }
    .apply .block2 .time{
        margin-top:15px;
        margin-bottom:15px;
    }
    .apply .block2 a span{
        font-size:1.313rem;
    }
    .apply .block2 a i{
        width:20px;
        height:20px;
    }
    .apply .block2 a i>font{
        height:5px;
    }
    .apply .block2 a.st1{
        margin-top:10px;
    }
}
@media only screen and (max-width : 465px) {
    .apply .block .list ul>li{
        position: relative;
        width: 100%;
        height:auto;
        margin-top:2%;
        margin-left:0%;

        
    }
    .apply .block .list ul>li:nth-child(2){
        margin-top:2%;
    }
}


.apply .block3{
    padding:10px;
    max-width:600px ;
    height:330px;
    border:1px solid #eaeaea;
    margin: 0 auto;
}

.apply .block3 .top{
    width:100%;
    
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;
    height:40%;
    text-align:center;
    background-color:#004098;
}
.apply .block3 .top>strong, .apply .block3 .top>span{
    color:#fff;
}
.apply .block3 .top>strong{
    display: inline-block;
    width:100%;
    text-align:center;
    font-size:2.25rem;
    line-height:2.25rem;
}
.apply .block3 .top>span{
    display:inline-block;
    width:100%;
    padding-top:15px;
    text-align:center;
    font-size:1.625rem;
    line-height:1.313rem;
    
}
.apply .block3 .top>span>font, .apply .block3 .top>span a, .apply .block3 .top>span b{
    display:inline-block;
    font-size:inherit;
    line-height:inherit;
    word-break:keep-all;
}
.apply .block3 .cont{
    padding-top:30px;
}
.apply .block3 .cont .ex{
    display:flex;
    align-items:center;
    justify-content:center;
}
.apply .block3 .cont .ex>div{
    display:inline-block;
}
.apply .block3 .cont .ex>div:nth-child(1){
    margin-right:30px;
}
.apply .block3 .cont .ex>div i, .apply .block3 .cont .ex>div strong{
    display:inline-block;
    vertical-align:top;
}
.apply .block3 .cont .ex>div i{
    width:45px;
    height:20px;
    margin-right:8px;
}

.apply .block3 .cont .ex>div:nth-child(1) i{
    background-color:#e60012;
}
.apply .block3 .cont .ex>div:nth-child(2) i{
    background-color:#f39800;
}
.apply .block3 .cont .ex>div strong{
    font-size:0.875rem;
    line-height:20px;
    font-weight:400;
}
.apply .block3 .cont .timeline{
   
    margin: 0 auto;
    margin-top:10%;
    width:94%;
    height:20px;
}
.apply .block3 .cont .timeline>div{
    position: relative;
    display:inline-block;
    width:10.5555%;
    margin-left:0.5%;
    height:100%;
    background-color:#f39800;
    
}
.apply .block3 .cont .timeline>div>span{
    position:absolute;
    bottom:-18px;
    left:0;
    width:100%;
    font-size:0.75rem;
    line-height:0.75rem;
    color:#888;
    font-weight:300;
    text-align:center;
}
.apply .block3 .cont .timeline>div.on{
    background-color:#e60012;
}
@media only screen and (max-width : 640px) {
    
    .apply .block3{
        height:auto;
    }
    .apply .block3 .top{
        padding-top:30px;
        padding-bottom:30px;
    }
    .apply .block3 .top>strong{
    font-size:2rem;
    line-height:2rem;
    }
    .apply .block3 .top>span{
        font-size:1.313rem;
    }
    .apply .block3 .cont{
        padding-top:40px;
    }
    .apply .block3 .cont .timeline{
        height:auto;
    }
   .apply .block3 .cont .timeline>div{
    width:19%;
    height:20px;
    margin-bottom:28px;
    margin-left:1%;

    }
}


#ui-datepicker-div{
    font-size:1rem;
    line-height:1.5rem;
    text-align:center;
    
}
.ui-datepicker td span, .ui-datepicker td a{
    text-align:center;
}
#ui-datepicker-div * {
    font-size: inherit;
    line-height: inherit;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
        border: 1px solid #eee;
        background: #a1a1a1;
        color: #fff;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{
    border: 1px solid #004098;
    background: #004098;
    font-weight: normal;
    color: #ffffff;
}