/* slick-slider ΗΚΌφ css */ #rollingB .slick-slider{position:relative; display:block; box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-touch-callout:none; -khtml-user-select:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent;} #rollingB .slick-list{position:relative; display:block; overflow:hidden; margin:0; padding:0;} #rollingB .slick-list:focus{outline:none;} #rollingB .slick-list.dragging{cursor:pointer; cursor:hand;} #rollingB .slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);} #rollingB .slick-track{position:relative; top:0; left:0; display:block;} #rollingB .slick-track:before,.slick-track:after{display:table; content:'';} #rollingB .slick-track:after{clear:both;} #rollingB .slick-loading .slick-track{visibility:hidden;} #rollingB .slick-slide{display:none; float:left; height:100%; min-height:1px;} #rollingB [dir='rtl'] .slick-slide{float:right;} #rollingB .slick-slide img{display: block; margin:0 auto;} #rollingB .slick-slide.slick-loading img{display:none;} #rollingB .slick-slide.dragging img{pointer-events:none;} #rollingB .slick-initialized .slick-slide{display:block;} #rollingB .slick-loading .slick-slide{visibility:hidden;} #rollingB .slick-vertical .slick-slide{display:block;height:auto; border:1px solid transparent;} #rollingB .slick-arrow.slick-hidden{display:none;} #rollingB {width:887px; height: 484px; position:relative; cursor:pointer;} #rollingB .visu {} #rollingB article {background-size:cover !important; } #rollingB .visu01 {background-image:url("../images/main/rolling_bn_img_01.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .visu02 {background-image:url("../images/main/rolling_bn_img_02.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .visu03 {background-image:url("../images/main/rolling_bn_img_03.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .visu04 {background-image:url("../images/main/rolling_bn_img_04.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .visu05 {background-image:url("../images/main/rolling_bn_img_05.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .visu06 {background-image:url("../images/main/rolling_bn_img_06.jpg");background-position: 50% bottom; background-size: cover; background-repeat: no-repeat; height:484px;} #rollingB .transition { transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; } #rollingB .default_pos{ opacity:0; transform:translateY(-80px); -moz-transform:translateY(-80px); -webkit-transform:translateY(-80px); -o-transform:translateY(-80px); -ms-transform:translateY(-80px); } #rollingB .active-item .txt {opacity:1 !important;} #rollingB .visu01.active-item .tit, #rollingB .visu02.active-item .tit, #rollingB .visu03.active-item .tit, #rollingB .visu04.active-item .tit, #rollingB .visu05.active-item .tit, #rollingB .visu06.active-item .tit{ opacity:1 !important; transform:translateY(0) !important; -moz-transform:translateY(0) !important; -webkit-transform:translateY(0) !important; -o-transform:translateY(0) !important; -ms-transform:translateY(0) !important; } #rollingB .visu01 .txt, #rollingB .visu02 .txt, #rollingB .visu03 .txt, #rollingB .visu04 .txt, #rollingB .visu05 .txt, #rollingB .visu06 .txt{background:rgba(12,76,140,.7); width:100%; padding:80px 0; color:#fff; position:relative; top:50%; transition:0.2s linear; opacity: 0; transform:translateY(-50%); -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); } #rollingB .visu01 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; margin-left:-35px; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .visu02 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; margin-left:-45px; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .visu03 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .visu04 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; margin-left:-45px; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .visu05 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; margin-left:-45px; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .visu06 .tit {font-family: 'NanumSquare', sans-serif; font-size:44px; font-weight:800; display:inline-block; margin-left:-45px; transition-delay:0.2s; -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; -o-transition-delay:0.2s; -ms-transition-delay:0.2s; } #rollingB .slick-dots {width:100%; text-align:center; bottom:53px; position:absolute; z-index:10;} #rollingB .slick-dots li {display:inline-block; margin:0 15px 0 0;} #rollingB .slick-dots li:last-child {margin:0; } #rollingB .slick-dots li button {width:8px; height:8px; background:#fff; text-indent:-9999px; } #rollingB .slick-dots li.slick-active button {width:80px; background:#0c4c8c; } #rollingB button { cursor: pointer; border: none; background: none; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: none; line-height:8px; font-size:8px; } @media (max-width:1580px){ #rollingB {width:800px;} #rollingB .visu01, #rollingB .visu02, #rollingB .visu03, #rollingB .visu04, #rollingB .visu05, #rollingB .visu06 {width:100%; background-position: 50% bottom; background-size: cover; background-repeat: no-repeat;} #rollingB .visu01 .tit, #rollingB .visu02 .tit, #rollingB .visu03 .tit, #rollingB .visu04 .tit, #rollingB .visu05 .tit, #rollingB .visu06 .tit {font-size:34px; margin-left:0;} } @media (max-width:1350px){ #rollingB {width:100%; height:400px;} #rollingB .visu01, #rollingB .visu02, #rollingB .visu03, #rollingB .visu04, #rollingB .visu05, #rollingB .visu06 {width:100%; height:400px;} } @media (max-width:740px){ #rollingB .visu01 .txt, #rollingB .visu02 .txt, #rollingB .visu03 .txt, #rollingB .visu04 .txt, #rollingB .visu05 .txt, #rollingB .visu06 .txt{padding:40px 0;} #rollingB .visu01 .tit, #rollingB .visu02 .tit, #rollingB .visu03 .tit, #rollingB .visu04 .tit,#rollingB .visu05 .tit,#rollingB .visu06 .tit {font-size:30px;} } @media (max-width:520px){ #rollingB .visu01 .txt, #rollingB .visu02 .txt, #rollingB .visu03 .txt, #rollingB .visu04 .txt, #rollingB .visu05 .txt, #rollingB .visu06 .txt{padding:40px 20px;} } @media (max-width:320px){ #rollingB {height:300px;} #rollingB .visu01, #rollingB .visu02, #rollingB .visu03, #rollingB .visu04, #rollingB .visu05, #rollingB .visu06 {width:100%; height:300px;} #rollingB .visu01 .txt, #rollingB .visu02 .txt, #rollingB .visu03 .txt, #rollingB .visu04 .txt, #rollingB .visu05 .txt, #rollingB .visu06 .txt{padding:30px 20px;} #rollingB .visu01 .tit, #rollingB .visu02 .tit, #rollingB .visu03 .tit, #rollingB .visu04 .tit, #rollingB .visu05 .tit, #rollingB .visu06 .tit {font-size:26px;} #rollingB .slick-dots {bottom:20px;} }