/* Visual */
.visual{
    overflow: hidden; height: 780px; /*background: #000;*/
}
.visual .swiper-container{
    height: 100%;
    -webkit-transition: all ease-in-out .6s; transition: all ease-in-out .6s;
    opacity: 0;
}
.visual .swiper-wrapper { height: 100%; }
.visual .swiper-slide { overflow: hidden; height: 100%; }
/* .visual .prev,
.visual .next{
    z-index: 2; position: absolute; top: 0; bottom: 0; margin: auto; cursor: pointer !important;
    -webkit-transition: all .35s ease-out .6s; transition: all .35s ease-out .6s;
    opacity:1;
} */
.visual .swiper-button-box {max-width:980px; width: 100%; padding:0px 20px; position:absolute; display: flex; justify-content:flex-start; right: 0; left:0; bottom:200px; z-index:10; margin:auto;}

.visual .prev{
    /*left: 100px;*/ width: 44px; height: 44px; background: url('/child/img/main/prev-off.png') no-repeat center; transition: all 0.3s ease;
    /*-webkit-transform: translateX(-50px); transform: translateX(-50px);*/ border:2px solid #fff; border-radius:50%; margin-right:10px;
}
.visual .next{
    /*right: 100px;*/ width: 44px; height: 44px; background: url('/child/img/main/next-off.png') no-repeat center; transition: all 0.3s ease;
    /*-webkit-transform: translateX(50px); transform: translateX(50px);*/  border:2px solid #fff; border-radius:50%;
}

.visual .prev:hover, .visual .prev:active {background: url('/child/img/main/prev-on.png') no-repeat center; background-color: #fff;}
.visual .next:hover, .visual .next:active {background: url('/child/img/main/next-on.png') no-repeat center; background-color: #fff;}

.visual .context {max-width:980px; padding:0px 20px; width:100%; height:100%; position: absolute; margin: auto; top:0; left:0; right:0; bottom:0; display: flex; flex-direction: column; justify-content: center; color:#fff; opacity:0;}

.visual .context .title {font-size: 6rem; font-weight: 700; line-height:1.4; margin-top:10px;}
.visual .context .text {font-size:2.2rem; font-weight:700;}

.visual .swiper-slide-active .context{
    animation: text-fade-in 1s ease .8s forwards;
}
/* .visual .swiper-slide-active .background{
    animation: background-unro 1s ease .35s forwards;
} */

@keyframes visual-curtain {
    from { -webkit-transform: scaleY(0); transform: scaleY(0); }
    to { -webkit-transform: scaleY(1); transform: scaleY(1); }
}
@keyframes visual-graphic {
    from { -webkit-transform: translateX(-50px); transform: translateX(-50px); opacity: 0; }
    to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }
}
@keyframes visual-fade-out {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes visual-side {
    from { opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); }
    to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes text-fade-in {
    from { opacity: 0; -webkit-transform: translateX(-100px); transform: translateX(-100px); }
    to { opacity: 1; -webkit-transform: translateX(0px); transform: translateX(0px); }
}
@keyframes text-fade-out {
    from { opacity: 1; -webkit-transform: translateX(0px); transform: translateX(0px); }
    to { opacity: 0; -webkit-transform: translateX(60px); transform: translateX(60px); }
}
@keyframes background-roll {
    from { width: 65%; opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
    to { width: 65%; opacity: 0; -webkit-transform: translateX(50px); transform: translateX(50px); }
}

@keyframes visual-left {
    to { -webkit-transform: scaleY(1); transform: scaleY(1); }
}


/* .visual .slide-pagination{
    height: 15px;
    -webkit-transition: all .35s ease-out .6s; transition: all .35s ease-out .6s;
    -webkit-transform: translateY(50px); transform: translateY(50px);
    opacity: 0;
}
.visual .slide-pagination.swiper-pagination-bullets { z-index: 2; position: absolute; bottom: 30px; width: 100%; text-align: center; font-size: 0; }
.visual .slide-pagination.swiper-pagination-bullets .swiper-pagination-bullet{
    margin: 0 5px; width: 14px; height: 100%; background: #ffffff; border-radius: 14px;
    -webkit-transition: all ease .2s; transition: all ease .2s;
}
.visual .slide-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active { width: 45px; } */
.visual .background{
    height: 780px;
    -webkit-transition: all ease-in-out 1s; transition: all ease-in-out 1s;
    /* -webkit-transform: scale(1.1); transform: scale(1.1); */
}
.visual .background--1 { background: url('/child/img/main/v1.jpg') no-repeat center / cover; }
.visual .background--2 { background: url('/child/img/main/v2.jpg') no-repeat center / cover; }
.visual .swiper-container-initialized { opacity: 1; }
.visual .swiper-container-initialized .background { -webkit-transform: none; transform: none; }
/* .visual .swiper-container-initialized .prev,
.visual .swiper-container-initialized .next, */
/* .visual .swiper-container-initialized .slide-pagination{
    -webkit-transform: none; transform: none;
    opacity: 1;
} */
@media (max-width: 1200px){

    .visual .context .title {font-size:5rem;}
    .visual .context .text {font-size:1.8rem;}


}

@media(max-width:1024px){
    /* .visual { height: 460px; }
    .visual .prev,
    .visual .next { display: none; } */
}
@media(max-width:768px){
    .visual { height: 580px; }

    .visual .context .title {font-size:3.8rem;}
    .visual .context .text {font-size:1.6rem;}

    .visual .swiper-button-box {bottom:160px;}
    .visual .prev, .visual .next {width:36px; height:36px;}
}
@media(max-width:580px){
    /* .visual { height: 240px; } */
    .visual .context .title {font-size:3.4rem;}
    .visual .prev, .visual .next {width:30px; height:30px;}
}

@media(max-width:480px){

    /* .visual .context .title {font-size:2.6rem;}
    .visual .context .text {font-size:1.4rem;} */
    .visual { height:400px; }

    .visual .swiper-button-box {display: none;}

}


/*section*/
.section--board {

    padding:150px 0px; background:url("/child/img/main/board-bg.jpg") no-repeat center;
    background-size:cover;

}

.section--board .board {text-align:center;}

.section--board .board .notice-tit {font-size:4.6rem; color:#222; font-weight:800; margin-bottom:30px;}

.section--board .board .notice-txt {font-size:2.2rem; color:#777; font-weight:400;}

.section--board .board .notice-container {display:flex; text-align:left; font-family:'Nanum Gothic', sans-serif; justify-content: space-between; margin:60px 0px;}

.section--board .board .notice-list {width:calc(33.33% - 15px); position: relative;}

.section--board .board .notice-list::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; display:block; border:0 solid #bea985; opacity:0; transition:opacity.3s, border.3s; pointer-events:none;}

.section--board .board .notice-list:hover::after {border-width:6px; opacity:1;}

.section--board .board .notice-context {padding:50px 40px; border:1px solid #e1e1e1;}

.section--board .board .notice-container h5 { font-size:1.8rem; font-weight:700; color:#444; line-height:1.4;  text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}

.section--board .board .notice-container p {font-size:1.6rem; color:#666; margin:20px 0px 30px; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.section--board .board .notice-container span {font-size:1.4rem; color:#b4b4b4;}

.section--board .board .more-btn {font-weight:800; font-size:2rem; color:#222; display: flex; justify-content: center; margin: auto; align-items: center; transition:all 0.3s ease;}

.section--board .board .more-btn::after {content:""; background:url('/child/img/icon/more-off.png') no-repeat center; display:block; width:26px; height:26px; border:1px solid #c8c8c8; border-radius:50%; margin-left:5px; transition:all 0.3s ease;}

.section--board .board .more-btn:hover { color:#bea985;}

.section--board .board .more-btn:hover::after {border-color:#bea985; background:url('/child/img/icon/more-on.png') no-repeat center;}


@media (max-width: 1200px){

    .section--board .board .notice-list {width: calc(33.33% - 10px);}
    /* .section--board .board .notice-context {padding:40px 20px;} */

}

@media(max-width:1024px){

    .section--board .board .notice-txt {font-size:1.8rem;}

    .section--board .board .notice-container {flex-wrap: wrap; margin:40px 0px;}

    .section--board .board .notice-list {width:100%; margin-bottom:10px;}
    .section--board .board .notice-list:last-child {margin-bottom:0px;}

    .section--board .board .notice-context {padding:40px 30px;}

}
@media(max-width:768px){
    .section--board {padding:100px 0px;}
    .section--board .board .notice-tit {font-size:3rem; margin-bottom:20px;}

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

    .section--board .board .notice-tit {font-size:2.6rem; margin-bottom:10px;}
    .section--board .board .notice-txt {font-size:1.6rem;}
}
