@charset "utf-8";

.ani {position: relative; opacity: 0; transition: 0s;}
.ani-on .ani {opacity: 1; transition: 1s;}
.edit .ani {position: static; opacity: 1;}

@media all and (max-width: 900px) {
    .ani, .ani-on .ani {position: static; opacity: 1 !important; transition: 0s !important;}
}

/*FullPage Box Model*/
.check .multipleContentsDiv > div {height: auto !important;}

.check #_contentBuilder .multipleDiv,
.check #_contentBuilder .fp-tableCell {height: auto !important;}

/* Banner */
#multipleDiv_suhyup-en_35 {position: relative; background: url('../../images/main/img-section.jpg') no-repeat center center; background-size: cover;}
#multipleContentsDiv_suhyup-en_35 {position: static; height: auto;}
#menu563_obj36 {position: static;}
.check .wrap-banner ul,
.edit .wrap-banner ul {padding: 200px 7%;}
.wrap-banner ul {display: table; width: 100%; padding: 0 7%;}
.wrap-banner ul li {display: table-cell; width: 20%; text-align: center;}
.wrap-banner .box-banner {padding: 0 15px;}
.wrap-banner .box-banner > div {padding: 34px 0 60px 0; box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,.6); transition: .5s;}
.wrap-banner .box-banner > div:hover {box-shadow: inset 0px 0px 0px 10px rgba(255,255,255,.6);}
.wrap-banner .box-banner > div a {display: block;}
.wrap-banner .bn1 {background: rgba(24, 49, 89, .7);}
.wrap-banner .bn2 {background: rgba(0, 74, 125, .7);}
.wrap-banner .bn3 {background: rgba(0, 118, 152, .7);}
.wrap-banner .bn4 {background: rgba(0, 102, 129, .6);}
.wrap-banner .bn5 {padding: 34px 0 10px 0 !important; background: rgba(255, 255, 255, .7);}
.wrap-banner .box-banner strong {display: block; height: 60px; font-family: 'Mont Medium'; font-size: 24px; line-height: 1.2; color: #fff;}
.wrap-banner .box-banner .bn5 strong {height: auto; color: #000;}
.wrap-banner .box-banner .bn5 p {padding: 0 10px; font-family: 'Mont Regular'; font-size: 16px; color: #333;}
.wrap-banner .box-banner .icon {position: relative; margin-top: 20px; padding-top: 80px; display: block;} 
.wrap-banner .box-banner .icon::after {content: ''; position: absolute; left: 50%; top: 0; width: 1px; height: 50px; background: rgba(255,255,255,.5);}
.wrap-banner .box-banner .sns-list {overflow: hidden; padding: 14px 30px 0 30px;}
.wrap-banner .box-banner .sns-list a {float: left; width: 50%; padding: 15px 0;}

@media all and (max-width: 1660px) {
    .check .wrap-banner ul,
    .edit .wrap-banner ul {padding-left: 0; padding-right: 0;}
    .wrap-banner ul li {display: block; float: left; width: 25%;}
    .wrap-banner ul li.list5 {width: 100%; margin-top: 30px;}
    .wrap-banner .box-banner .sns-list a {width: 25%;}
}

@media all and (max-width: 1400px) {
    .check .wrap-banner ul,
    .edit .wrap-banner ul {padding-top: 70px; padding-bottom: 170px;}
    .wrap-banner .box-banner strong {font-size: 20px;}
}

@media all and (max-width: 1060px) {
    .check .wrap-banner ul,
    .edit .wrap-banner ul {padding-bottom: 190px;}
}

@media all and (max-width: 880px) {
    .wrap-banner ul li {width: 50%; margin-top: 30px;}
}

@media all and (max-width: 600px) {
    .check .wrap-banner ul,
    .edit .wrap-banner ul {padding-top: 30px; padding-bottom: 200px;}
    .wrap-banner ul li {width: 100%; margin-top: 30px;}
    .wrap-banner .box-banner strong {height: auto;}
    .wrap-banner .box-banner .icon {padding-top: 0;}
    .wrap-banner .box-banner .icon::after {display: none;}
}

.next-move {position: relative;}
.next-move button {display:block; position: absolute; left: -99999px; bottom: 0; z-index: 200; width:100%; padding: 25px 0; background:rgba(0,105,181,.7); border: 0 none; text-align: center; color:#fff;}
.next-move button:focus,
.next-move button:hover,
.next-move button:active {left: 0; font-size: 15px; font-weight:bold; line-height:1.5;}
