@charset "utf-8";

.main-intro-slide {position:relative;}
.main-sw .swiper-slide {height:100vh; min-height:800px;}
.main-sw .swiper-slide .sw-text {display:flex; height:100%;     flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; text-align:center;}
.main-sw .swiper-slide .sw-text > div {/*transition:0.5s ease-out; opacity:0; transform:translateY(30px);*/  animation-name: textAni; animation-duration: 0.5s; animation-timing-function: ease-in; animation-iteration-count: 1; animation-direction: alternate; animation-fill-mode: forwards; /*animation-play-state:paused;*/ transform:translateY(30px); opacity:0;}
.main-sw .swiper-slide .sw-text .t1 {font-size:52px; font-weight:800; color:#fff; animation-delay:0.3s;}
.main-sw .swiper-slide .sw-text .t2 {font-size:26px; font-weight:300; line-height:36px; color:#fff; margin-top:25px; animation-delay:0.7s;}
.main-sw .swiper-slide .sw-text .t3 {margin-top:55px; transform:translateY(0); animation-delay:1.3s;}
.main-sw .swiper-slide .sw-text .t3 a {padding:0 35px; border:2px solid #fff; line-height:38px; color:#fff; font-size:18px; font-weight:500; background:rgb(255 255 255 / 14%); display: inline-block;}
.main-sw .swiper-slide.swiper-slide-active .sw-text > div {/*opacity:1; transform:translateY(0);*/ /* animation-play-state:running; */}
/*.main-sw .swiper-slide.swiper-slide-active .sw-text .t1 {}*/
/*.main-sw .swiper-slide.swiper-slide-active .sw-text .t2 {}*/
/*.main-sw .swiper-slide.swiper-slide-active .sw-text .t3 {}*/
/*.main-sw .swiper-slide.swiper-slide-active .sw-text .t3 a {}*/
.main-sw .swiper-slide .bg {position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1;  transition:10s ease; /*transition-delay:0.5s;*/}
.main-sw .swiper-slide.swiper-slide1 .bg {background:url("/assets/images/main-slide-1.jpg") no-repeat; background-size:cover;}
.main-sw .swiper-slide.swiper-slide2 .bg {background:url("/assets/images/main-slide-2.jpg") no-repeat; background-size:cover;}
.main-sw .swiper-slide.swiper-slide3 .bg {background:url("/assets/images/main-slide-3.jpg") no-repeat; background-size:cover;}
/*.main-sw .swiper-slide.swiper-slide-active .bg {transform:scale(1.2);}*/
.sidebtn {z-index:16; position:absolute; top:0; bottom:0; height:100%; font-size:16px; font-weight:500; color:#fff;  width:70px; opacity:0.5; background:rgb(255,255,255, 0%); display:flex; align-items: center; justify-content: center; transition:0.5s; cursor:pointer;}
.sidebtn:hover {opacity:1; background:rgb(255 255 255 / 10%);}
.sidebtn-left {left:0; border-right:1px solid rgb(255 255 255 / 20%);}
.sidebtn-left span {display: inline-block; /*transform-origin:left top;*/ transform:rotate(-90deg);}
.sidebtn-right {right:0; border-left: 1px solid rgb(255 255 255 / 20%);}
.sidebtn-right span {display: inline-block; /*transform-origin:left top;*/ transform:rotate(90deg);}
.sw-control {position:absolute; right:120px; bottom:40px; color:#fff; z-index:10; display:flex; width:105px; justify-content: space-between; align-items: center;}
.sw-control > div {opacity:0.8; cursor:pointer;}
.sw-control .sw-prev, .sw-control .sw-next {font-size:20px;}
.sw-control .sw-play .fa-pause { display: inline; }
.sw-control .sw-play .fa-play {display:none;}
.sw-control .sw-play.on .fa-pause {display:none;}
.sw-control .sw-play.on .fa-play {display:inline;}
.main-intro-slide .swiper-pagination {position:absolute; right:280px; bottom:48px;}
.main-intro-slide .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin :0; margin-right: 20px; }
.main-intro-slide .swiper-pagination-bullet { position: relative; width: 250px; height: auto; text-align: left; border-radius: 0; opacity: 1; margin-right: 20px; background-color: transparent; display:none; }
.main-intro-slide .swiper-pagination-bullet em {position:absolute; bottom:-12px; font-size: 15px; line-height: 28px; font-weight: bold; letter-spacing: -0.38px; color: #fff; font-style:normal;}
.main-intro-slide .swiper-pagination-bullet em.current {left:-28px;}
.main-intro-slide .swiper-pagination-bullet em.total {right:-28px;}
.main-intro-slide .swiper-pagination-bullet i { position: absolute; bottom: 0; left: 0; z-index: 1; width: 100%; height: 2px; background-color: #E4E4E4;; }
.main-intro-slide .swiper-pagination-bullet b { position: absolute; bottom: 0; left: 0; z-index: 2; width: 0%; height: 2px; background-color: #ED2024 }
.main-intro-slide .swiper-pagination-bullet-active { background-color: transparent; display:block;}
.main-intro-slide .swiper-pagination-bullet-active b { animation-name: countingBar; animation-duration: 3.5s; animation-timing-function: ease-in; animation-iteration-count: 1; animation-direction: alternate; animation-fill-mode: forwards; }
.main-intro-slide .swiper-pagination.off .swiper-pagination-bullet b {animation-play-state: paused;}

@keyframes countingBar {
    0% {width: 0;}
    100% {width:100%;}
}

@keyframes textAni {
    0% {/*transform:translateY(30px); opacity:0;*/}
    100% {transform:translateY(0); opacity:1;}
}

.main-panel {background:#F8F8F8; padding:80px 0;}
.main-panel .row {display:flex; display: flex; justify-content: space-between; margin-bottom:26px;}
.main-panel .row:last-chld {margin-bottom:0;}
.main-panel .row .col {}
.main-panel .panel {border-radius:20px; width:331px; height:324px; background:#fff; position:relative; overflow:hidden;}
.main-panel .panel .p-title {padding-top:35px; padding-left:42px; font-size:21px; font-weight:bold; color:#444444;}
.main-panel .panel .p-title.white {color:#fff;}
.main-panel .panel.p-partners, .main-panel .panel.p-hull-block {width:687px;}
.panel .sw-partners {margin:30px 20px 0;}
.panel .sw-partners .swiper-slide {border:1px solid #E1E1E1; border-radius:5px; display: flex; align-items: center; justify-content: center; height:98px;}
.panel .arrow-box {display:flex; justify-content: space-between; width:58px; position:absolute; right:30px; top:35px;}
.panel .arrow-box > div {color:#444444; font-size:18px; cursor:pointer;}
.panel .arrow-box > div.swiper-button-disabled {opacity:0.2;     pointer-events: none;}
.panel .notice-txt {margin-top:30px; padding:0 40px;}
.panel .notice-txt a {position:absolute; left:0; top:0; width:100%; height:100%;}
.panel .notice-txt .t1 {color:#444444; font-weight:500; font-size:18px;}
.panel .notice-txt .t2 {color:#444444; font-weight:300; font-size:14px; margin-top:10px; 
display: -webkit-box;
-webkit-line-clamp: 3;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
text-align: left;
word-wrap: break-word;
line-height: 24px;
height: 72px;}
.panel .notice-txt .t3 {color:#666666; font-weight:500; font-size:14px; position:absolute; right:40px; bottom:40px;}
.panel .bg-icon {position:absolute; bottom:23px;}
.main-panel .panel.p-partners {}
.main-panel .panel.p-hull-block {}
.main-panel .panel.p-certification {background:#E8E8E8; height:150px; margin-bottom:24px; cursor:pointer;}
.main-panel .panel.p-certification .bg-icon {right:-10px;}
.main-panel .panel.p-safety-regulation {background:#AAAAAA; height:150px; cursor:pointer;}
.main-panel .panel.p-safety-regulation .bg-icon {right:-30px;}
.main-panel .panel.p-about-us {background:url("/assets/images/about-us-bg.png"); background-size:cover; cursor:pointer;}
.main-panel .panel.p-about-us .bg-icon {right:-20px;}

.sw-hull-block {margin-top:30px;}
.sw-hull-block .swiper-slide {width:200px; height:200px; cursor:pointer;}
.sw-hull-block .swiper-slide img {width:100%; height:100%; object-fit:cover;}

.p-link-box {padding:0 40px; margin-top:70px;}
.p-link-box ul {border-top:3px solid #999999;}
.p-link-box ul li {border-bottom:1px solid #DDDDDD;}
.p-link-box ul li:last-child {border-bottom:none;}
.p-link-box ul li a {line-height:55px; display: inline-block; font-size:18px; font-weight:600; color:#444444; padding:0 20px; display: inline-block; width:100%;}
.p-link-box ul li a i {color:#D5D5D5; float:right; line-height:55px; font-size:18px;}

.blocker {z-index:9999;}
.blocker .modal {max-width:1220px; text-align:center; padding:30px; border-radius:26px;}
.blocker .modal .tit {color:#fff; font-size:24px; font-weight:600; position:absolute; left:50%; top:-60px; transform:translateX(-50%);}
.blocker .modal .popup-con {overflow-y: scroll; max-height: 560px;}

.popup-con::-webkit-scrollbar {width: 2px;}
.popup-con::-webkit-scrollbar-button {width: 0; height: 0;}
.popup-con::-webkit-scrollbar-thumb {border-radius:2px; background-color:#222;}
.popup-con::-webkit-scrollbar-track {background:#ddd;}

/* 효과 */
@-webkit-keyframes spin { 100%{ -webkit-transform: rotate(-360deg); } } @-moz-keyframes spin { 100%{ -moz-transform: rotate(-360deg); } } @-ms-keyframes spin { 100%{ -ms-transform: rotate(-360deg); } } @keyframes spin { 100%{ transform: rotate(-360deg); } }
.test {-webkit-animation:spin 10000ms infinite linear; -moz-animation:spin 10000ms infinite linear; -ms-animation:spin 10000ms infinite linear; animation:spin 10000ms infinite linear;}