.owl-nav, .owl-dots {display: block; text-align: center;} 
.owl-nav .owl-prev, .owl-nav .owl-next{ display:inline-block; } 
.owl-dots .owl-dot {display: inline-block;} 
.owl-controls .owl-page span.owl-numbers {display: block; width: auto; height: auto; font-size: 20px;}
.ic_slider_prev, .ic_slider_next {display: inline-block; width: 36px; height: 36px;}
.ic_slider_prev {background: url('../img/ic_slider_prev.png');}
.ic_slider_prev:hover {background: url('../img/ic_slider_prev_on.png');}
.ic_slider_next {background: url('../img/ic_slider_next.png');}
.ic_slider_next:hover {background: url('../img/ic_slider_next_on.png');}
.ic_slider_prev02, .ic_slider_next02{display: inline-block; width: 24px; height: 44px; opacity: 0.25; filter: alpha(opacity=25);}
.ic_slider_prev02 {background: url('../img/ic_slider_prev02.png');}
.ic_slider_next02 {background: url('../img/ic_slider_next02.png');}
.ic_slider_prev02:hover, .ic_slider_next02:hover {opacity: 0.75; filter: alpha(opacity=75);}   

/*#main_wrap {min-width: 1100px; overflow: hidden;}*/
#main_wrap {min-width: 1200px; overflow: hidden;}
.section_wrap {font-family: 'NotoSansKR', 'NanumGothic'; letter-spacing: -0.3px; }
.section_cont {width: 1100px; height: 100%; margin: 0 auto; font-size: 16px; }
.section_cont p { margin: 0; padding: 0;}
.section_cont > h3 {text-align: center;}
.cont_wrap {display: inline-block; width: 100%;}
.cont_w2, .cont_w3, .cont_w4 {float: left; display: inline-block;}
.cont_w2 {width: 49%; margin-left: 2%;}
.cont_w3 {width: 32%; margin-left: 2%;}
.cont_w4 {width: 23.5%; margin-left: 2%;}
.cont_w2:first-child, .cont_w3:first-child, .cont_w3:nth-child(4), .cont_w4:first-child, .cont_w4:nth-child(5) {margin-left: 0;}

.section_main {position: relative; height: 600px; overflow: hidden;}
/*
.section_main video {position: absolute; top: 0; left: calc(50% - 960px);}
.section_main .main_img {position: absolute; top: 0; left: calc(50% - 760px)}
.section_main .main_img > a {position: absolute; top: 405px; left: calc(50% - 182px);}
.section_main .main_img > p {position: absolute; top: 458px; left: calc(50% + 192px); animation: img_hand 1s infinite;}
*/
.main-owl-wrapper {width: 100%; margin: 0 auto; height: 600px;}
.main-carousel {height: 600px;}
.main-carousel .item {position: relative; width: 100%; height: 600px; overflow: hidden;}
.main-carousel .item > video {position: absolute; top: 0; left: calc(50% - 960px);}
.main-carousel .item > a.main_btn {position: absolute; top: 405px; left: calc(50% - 182px);}
.main-carousel .item > a.main_img {position: absolute; top: 0; left: calc(50% - 760px); display: inline-block; width: 1520px;}
.main-carousel .item > p.btn_hand {position: absolute; top: 458px; left: calc(50% + 192px); animation: img_hand 1s infinite;}
.main-carousel .item > p.main_bg02 {position: absolute; top: 0; left: calc(50% - 1000px); display: inline-block; width: 2000px; height: 600px;}
.main-carousel .ic_slider_prev02, .main-carousel .ic_slider_next02 {position: absolute; top: 278px;}
.main-carousel .ic_slider_prev02 {left: calc(50% - 710px);}
.main-carousel .ic_slider_next02 {right: calc(50% - 710px);} 
@keyframes img_hand{0%{transform: translate(15px,20px);}100%{transform: translate(0,0);}} 
    
.section01 {padding: 120px 0; border-top: 1px solid #ebebeb; background: #f3f3f3;}
.section01_wrap {position: relative; display: inline-block; width: 100%; height: 330px;}
.section01_banner { position: absolute; top: 0; right: calc(50% - 550px);}
.section01-wrapper {width: 1920px;}
.section01-owl-wrapper {margin-left: 400px;}
.section01-wrapper .owl-nav {position: absolute; bottom: 0; right: 0; }
.section01-wrapper .owl-dots {position: absolute; bottom: 10px; right: 60px;}
.section01-wrapper .ic_slider_next {margin-left: 90px;}
.section01-owl-wrapper .owl-dot {counter-increment: slides-num;}
.section01-owl-wrapper .owl-dot.active:before {content: counter(slides-num); padding-right: 4px; font-size: 22px; font-weight: 900; color: #151515;}
.section01-owl-wrapper .owl-dots:after {content: "/ " counter(slides-num); font-size: 20px; font-weight: normal; color: #555; letter-spacing: -1px;}    
.section01-carousel .off .item {opacity: 0;}
.section01-carousel .owl-item.active.center + .owl-item.active {opacity: 0;}
.section01-carousel .on .item {opacity: 1;}
    
   
.section02 {padding: 120px 0; background: #fff;}
.section02 h3 {margin-bottom: 40px;}
.section02 ul > li {position: relative; height: 160px; margin-top: 15px; border-radius: 10px;}
.section02 ul > li:first-child {margin-top: 0;}
.section02 ul > li:hover {box-shadow: 3px 3px 3px #d0d0d0;}
.section02 ul > li .section02_num {position: absolute; top: 18px; left: 55px; width: 118px; height: 118px; text-align: center;}
.section02 ul > li .section02_num > span {display: block;}
.section02 ul > li .section02_num > span.span_date {margin-top: 20px; font-size: 16px; color: #222;}
.section02 ul > li .section02_num > span.span_date > span {display: block; font-size: 20px; font-weight: 900; color: #e34747;}
.section02 ul > li .section02_num > span.span_date > span.span_date_dday {font-size: 20px; line-height: 26px; font-weight: 800; color: #e34747}
.section02 ul > li .section02_num > span.span_num {display: inline-block; min-width: 52px; font-size: 15px; font-weight: 800; background: #e34747; color: #fff;}
.section02 ul > li:nth-child(2n) .section02_num > span.span_date  > span {color: #11a371;}
.section02 ul > li:nth-child(2n) .section02_num > span.span_num {background: #11a371;}


.section02_event {height: 170px;}
.section02_event > a {display: inline-block; width: 100%; height: 170px;}
    
.section03 {padding-top: 310px; height: 860px; background: url('../img/main/section03_bg.jpg') center top; overflow: hidden;}
.ul_section03 {display: inline-block; width: 1100px;}
.ul_section03 > li {float: left; display: inline-block;}
.effect_ft {animation: fadeInUp 1s; animation-fill-mode: forwards;}
.ul_section03 > li:nth-child(2) .img_section03.effect_ft {animation-delay: 0.3s; margin-top: 35px;}
.ul_section03 > li:nth-child(3) .img_section03.effect_ft {animation-delay: 0.6s; margin-top: 70px;}
.ul_section03 > li:nth-child(4) .img_section03.effect_ft {animation-delay: 0.9s; margin-top: 35px;}
.ul_section03 > li:nth-child(5) .img_section03.effect_ft {animation-delay: 1.2s;}
.img_section03 {opacity: 0;}
@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}
    
.section04 {position: relative; height: 845px; padding: 105px 0 120px 0; background: #171717;}
.section04-wrapper {position: absolute; top: 105px; left: calc(50% - 1000px); display: inline-block; width: 2000px; height: 600px;}
.section04 .owl-wrapper {margin-bottom: 65px;}
.section04-carousel .item {display: flex; justify-content: center; height: 600px; padding: 0; margin: 0; opacity: 0.7; transform: scale(0.9); transition: transform 0.4s 0.5s ease-out, opacity 1s ease;}
.section04-carousel .active .item {transform: box-shadow 0.3s ease, transform 0.1s 0.4s ease-in, opacity 0.4s ease;}
.section04-carousel .item_content {position: relative; display: flex; align-items: center; text-align: center; opacity: 1;}
.section04-carousel .active .item_content {opacity: 1; transition: opacity 0.4s ease;}
.section04-carousel .center .item {opacity: 1; transform: scale(1);}
.section04-owl-wrapper .owl-dots {margin-top: 30px; text-align: center;}
.section04-owl-wrapper .owl-theme .owl-dots .owl-dot span {display: block; width: 65px; height: 4px; margin: 0 7px; background: #5d5d5d; -webkit-backface-visibility: visible; transition: opacity .2s ease; border-radius: 0;}
.section04-owl-wrapper .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #00e9e6;}
.section04-carousel .item_content > a {position: absolute; bottom: 235px; right: 48px;; display: inline-block; width: 200px; padding: 15px; line-height: 1; background: #00b8b6; color: #fff; border-radius: 65px; }
.section04-carousel .item_content > a > p {display: inline-block; width: calc(100% - 50px); padding-top: 2px; font-size: 17px; font-weight: 800; text-align: center; vertical-align: top;}
.section04-carousel .item_content > a > p > span {font-size: 14px; font-weight: normal;}
.ic_home_section04 {display: inline-block; width: 38px; height: 38px; background: url('../img/main/section04_ic_home.png');} 
.section04-carousel .item_content > a.on {animation: btn_img 10s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}
.shake-vertical {animation: shake-vertical 10s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}
@keyframes btn_img {
  0%, 100% {transform: translateY(0);}
  10%, 30%, 50%, 70% {transform: translateY(-6px);}
  20%, 40%, 60% {transform: translateY(6px);}
  80% {transform: translateY(4px);}
  90% {transform: translateY(-4px);}
}

.section05 {padding: 120px 0 75px 0;}
.section05 .cont_wrap {margin-top: 65px;}
/*
.section05 .cont_w2 > a p.section05_item_thumb {height: 300px; border-radius: 10px; overflow: hidden}
.section05 .cont_w2 > a p.section05_item_thumb > img {transform: scale(1); transition: transform 0.3s ease 0s, opacity 0.1s linear 0s; image-rendering: auto;}
.section05 .cont_w2 > a:hover p.section05_item_thumb > img {transform: scale(1.05); transition: transform 0.3s ease 0s, opacity 0.1s linear 0s; image-rendering: auto;}
*/
.section05 .cont_w2 > a + p.section05_item_title > span {display: block;}
.section05 .cont_w2 > a + p.section05_item_title > span:nth-child(1) {margin-top: 15px; font-size: 16px; color: #a3a3a3;}
.section05 .cont_w2 > a + p.section05_item_title > span:nth-child(2) {font-size: 20px; line-height: 1.2; color: #555;}
.section05_item .item_thumb { border-radius: 15px; overflow: hidden;} 

.section06 {padding-bottom: 85px;}
.section06 .cont_w4 {margin-bottom: 35px;}
.section06_item {display: inline-block; width: 100%;}

.section06_item .item_thumb {display: inline-block; width: 100%; height: 145px; background: #f0f0f0; border-radius: 15px; overflow: hidden;}
.section06_item .item_thumb > img {width: 100%; height: auto; margin-top: -7px; transform: scale(1); transition: transform 0.3s ease 0s, opacity 0.1s linear 0s;}
.section06_item:hover .item_thumb > img {transform: scale(1.05); transition: transform 0.3s ease 0s, opacity 0.1s linear 0s;}

.section06 .cont_w4 a {display: inline-block; width: 100%; overflow: hidden;}
/*
.section06_item .item_thumb {display: inline-block; width: 100%; height: auto;}
.section06_item .item_thumb.section06_item_thumb {height: 145px; border-radius: 15px; overflow: hidden;}
*/
.section06_item .item_category {color: #a3a3a3;}
.section06_item .item_text {min-height: 44px; font-size: 15px; color: #555; white-space: nowrap;}

.section07 {position: relative; height: 845px; padding: 105px 0 120px 0; background: #171717;}
.section07-wrapper {position: absolute; top: 105px; left: calc(50% - 1000px); display: inline-block; width: 2000px; height: 600px;}
.section07 .owl-wrapper {margin-bottom: 65px;}
.section07-carousel .item {display: flex; justify-content: center; height: 600px; padding: 0; margin: 0; opacity: 0.7; transform: scale(0.9); transition: transform 0.4s 0.5s ease-out, opacity 1s ease;}
.section07-carousel .active .item {transform: box-shadow 0.3s ease, transform 0.1s 0.4s ease-in, opacity 0.4s ease;}
.section07-carousel .item_content {position: relative; display: flex; align-items: center; text-align: center; opacity: 1;}
.section07-carousel .active .item_content {opacity: 1; transition: opacity 0.4s ease;}
.section07-carousel .center .item {opacity: 1; transform: scale(1);}
.section07-owl-wrapper .owl-dots {margin-top: 30px; text-align: center;}
.section07-owl-wrapper .owl-theme .owl-dots .owl-dot span {display: block; width: 65px; height: 4px; margin: 0 7px; background: #5d5d5d; -webkit-backface-visibility: visible; transition: opacity .2s ease; border-radius: 0;}
.section07-owl-wrapper .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #00e9e6;}   

    
.section08 {position: relative; height: 660px; padding-bottom: 120px; text-align: center; background: #171717;}
.section08 p.p_subtitle {position: relative; display: inline-block; margin: 0; padding: 0 35px; font-size: 20px; line-height: 38px; font-weight: 800; text-align: center; background: #7cfffe; color: #151515; border-radius: 40px;}
.section08 p.p_subtitle:after {content: ''; position: absolute; top: 38px; left: calc(50% - 7px); width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 10px solid #7cfffe; clear: both;}
.section08-wrapper {position: absolute; top: 0; left: calc(50% - 1685px); width: 2630px;}
.section08-carousel .item {opacity: 0.20; filter: alpha(opacity=20);}
.section08-carousel .cloned .item {opacity: 0.2;}
.section08-carousel .on .item {opacity: 1; transition: opacity 0.2s ease;}
.section08-wrapper .ic_slider_prev02, .section08-wrapper .ic_slider_next02 {position: absolute; top: 218px; opacity: 0.75;}
.section08-wrapper .ic_slider_prev02 {left: calc(50% - 615px);}
.section08-wrapper .ic_slider_next02 {right: calc(50% - 615px);}
.section08-wrapper .ic_slider_prev02:hover, .section08-wrapper .ic_slider_next02:hover {opacity: 1;}
.section08-carousel .active.center .item {opacity: 1;}
.section08-carousel .active.center + .active .item {opacity: 1;}
.section08-carousel .active.center + .active + .active .item {opacity: 1;}
.section08-carousel .on .item {opacity: 1;}
.section08 .btn_more {position: absolute; top: 525px; left: calc(50% - 35px); display: inline-block; font-size: 20px; color: #929292;}

.section09_pass {position: relative; width: 100%; height: 300px; overflow: hidden; }
.pass_wrap {display:block; width: 1200px; margin: 0 auto; padding-top: 350px; background: #fff; transform:perspective(25px) rotateX(4deg); overflow: hidden;}
.pass_list {position:absolute; top:0; left:0; width:100%; display:block; animation:list_date 24s linear infinite;}
.pass_list > ul{padding:0; margin:0; float:left; width:16%; overflow:hidden }
.pass_list > ul:first-child {margin-left: 2%;}
.pass_list > ul li{display:block; padding:0; margin:0; width:100%; text-align:center; line-height:34px; font-size:16px; color:#6b6b6b; ;}
.img_pass {position: absolute; top: 0; left: 0; z-index: 99; width: 100%; height: 150px; background: linear-gradient(to top, rgba(255,255,255,0), rgba(255,255,255,1));}
@keyframes list_date {0%{top:0px}100%{top:-780px}}
    
/*.section10 {position: relative; display: flex; height: 600px; margin-bottom: 40px; justify-content: space-around; align-items: center; overflow: hidden;}*/
.section10 {position: relative; height: 600px; margin-top: 70px; margin-bottom: 40px; justify-content: space-around; align-items: center; overflow: hidden;}
    
.section11_event {height: 170px;}
.section11_event > a {display: inline-block; width: 100%; height: 170px;}
    
.section12 {padding: 75px 0; border-top: 1px solid #e4e4e4; background: #f7f7f7}
.section12 .cont_main_notice, .section12 .cont_main_counsel {padding: 45px 0;}
.section12 .cont_main_notice {float: left;width: 46%; padding-right: 4%; border-right: 1px solid #d3d3d3;}
.section12 .cont_main_counsel {float: left; width: 46%; padding-left: 4%;}
.section12 h5 {margin-bottom: 25px; font-size: 32px; font-weight: 900; vertical-align: bottom;}
.section12 h5 > a {float: right; display: inline-block; min-width: 75px; height: 28px; margin-top: 14px; font-size: 17px; line-height: 24px; font-weight: 600; text-align: center; border: 1px solid #222; color: #222; border-radius: 30px;}
.section12 h5 > a:hover {background: #222; color: #fff;}
.section12 .ul_main_notice li {padding: 15px 0;border-bottom: 1px dotted #e1e1e1;}
.section12 .ul_main_notice a {display: inline-block; width: 100%;}
.section12 .ul_main_notice a > p {display: inline-block;}
.section12 .ul_main_notice a > p:first-child {width: 355px;}
.section12 .ul_main_notice a > p.notice_info {width: 95px; text-align: right;}
.section12 .ul_main_notice span {vertical-align: middle;}
.section12 .ul_main_notice .notice_title {display: inline-block;width: 100%;font-size: 17px;color: #222;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.section12 .ul_main_notice a .notice_info span {color: #989898;}
.section12_info > p:nth-child(1) {margin-bottom: 20px; font-size: 44px; line-height: 1; font-weight: 900;}
.section12_info > p:nth-child(2) {font-size: 17px; line-height: 26px; color: #666;}
.section12_info > p > span {margin-right: 20px; vertical-align: text-bottom;}
.section12_menu {margin-top: 40px;}
.section12_menu > a {float: left; display: inline-block; width: 25%; font-size: 15px; line-height: 50px; font-weight: 600; text-align: center; color: #222; border: 1px solid #c3c3c3; border-left: none;}
.section12_menu > a:nth-child(1) {border-left: 1px solid #c3c3c3;}
.section12_menu > a:hover {font-weight: 800; background: #232323; color: #fff;}
    

/*pop layer*/
.layer_bg{position:fixed; top:0; left:0; width:100%; height:100%; z-index: 9; overflow: hidden;}
.layer_bg_cont{position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.4; filter:alpha(opacity=40); z-index:9}
.pop_wrap{position:fixed; top: 150px; left: calc(50% - 330px); width: 660px; padding: 0; font-size: 15px; background: #fff; border-radius: 4px; z-index: 9; font-family: 'NotoSansKR', 'NanumGothic';}
.pop_header {position: relative; display: inline-block; width: calc(100% - 80px); margin: 30px 40px 0 40px; padding-bottom: 20px; font-size: 20px; font-weight: 800; border-bottom: 1px solid #dcdcdc;}
.pop_header > p, .pop_header > a {display: inline-block; font-weight: bold; color: #222;}
.pop_header > p {float: left; font-size: 20px; line-height: 48px; font-weight: normal;}
.pop_header > p > span {color: #d61f07;}
.pop_header > a {float: right; margin-top: 7px;}
.pop_header a.btn_layer_close {position: absolute; top: -15px; right: -15px;}
.pop_class_wrap{position:fixed; top: 150px; left: calc(50% - 550px); width: 1100px; padding: 30px 35px; font-size: 14px; background: #222; border-radius: 4px; z-index: 9;}
.pop_class_header {display: inline-block; width: 100%;}
.pop_class_header > p, .pop_class_header > a {display: inline-block; font-weight: 100; color: #fff; vertical-align: text-bottom;}
.pop_class_header > p > span {margin-right: 4px; font-weight: 800; font-size: 19px; vertical-align: bottom;}
.pop_class_header > p {float: left; font-size: 15px;}
.pop_class_header > a {float: right;}
#pop_class_sample {display: none;}
#pop_class_sample > .pop_class_wrap {left: calc(50% - 400px); width: 800px; padding: 30px 40px 20px 40px; background: #fff; border-radius: 20px;}
#pop_class_sample .pop_contents {padding: 0;}
#pop_class_sample .pop_class_video {width: 100%;}
#pop_class_sample .pop_class_header > p, #pop_class_sample .pop_class_header > a {color: #222;}
#pop_class_sample .class_video_info {display: inline-block; margin-top: 10px;}
#pop_class_sample .class_video_info img {height: 50px; margin-right: 10px;}
#pop_class_sample .class_video_info p {margin-top: 5px; font-size: 20px; line-height: 22px; font-weight: 800;}
#pop_class_sample .class_video_info span {font-size: 16px; font-weight: normal;}
#pop_class_sample .btn_layer_close {position: absolute; top: 15px; right: 10px;}


/*quick_banner*/
.quick_banner01 {display: inline-block; width: 130px; position: absolute; top: 365px; right: calc(50% - 760px); color: #333; font-family: 'NotoSansKR', 'NanumGothic'; z-index: 1;}
.quick_banner02 {display: inline-block; width: 130px; position: absolute; top: 965px; right: calc(50% - 760px); z-index: 99; font-family: 'NotoSansKR', 'NanumGothic';}
.quick_banner_fixed {position: fixed; top: 10px;}
.rbanner_top01_01 {position: relative; display: inline-block; height: 195px;}
.rbanner_top01_01:after {content: ''; position: absolute; bottom: 0; left: 0; display: inline-block; width: 100%; height: 170px; box-shadow: 10px 8px 10px rgb(0 0 0 / 0.9); border-radius: 10px;}
.rbanner_top01_01 > a:first-child {position: absolute; top: 0; left: 0; display: inline-block; width: 130px; height: 195px; z-index: 1;}
.rbanner_top01_01 > a.rbanner_top_close {position: absolute; top: 35px; left: 105px; display: inline-block; width: 15px; height: 15px; background: url('../img/ic_close.png'); background-size: cover; z-index: 2;}
.rbanner_top01_02, rbanner_top01_03 {height: 170px; margin-bottom: 5px;}
.rbanner_top01_02 > a, .rbanner_top01_03 > a {display: inline-block;}
    
.rbanner_top02_01 {border: 1px solid #0a0a0a; background: #fff; border-radius: 10px; overflow: hidden;}
.rbanner_header {padding: 8px 0; font-size: 17px; font-weight: 900; text-align: center; background: #0a0a0a; color: #fff;}
.rbanner_header span {display: block; color: #31ffdb;}
.rbanner_cont {padding: 10px;}
.rbanner_cont > p {margin-bottom: 5px; font-size: 13px; font-weight: 600; color: #333;}
.rbanner_cont > p > span {margin-right: 2px; background: #ececec; border-radius: 2px;}
.rbanner_cont > a {display: inline-block; width: 100%; height: 30px; margin-top: 3px; line-height: 28px; font-weight: 600; text-align: center; background: #0a0a0a; color: #fff; border-radius: 30px;}
    
.quick_banner02 > ul {display: inline-block; width: 100%; margin: 15px 0; border: 1px solid #c2c7cb; background: #fff; border-radius: 10px;}
.quick_banner02 > ul > li {margin: 0 10px; border-top: 1px solid #ddd;}
.quick_banner02 > ul > li:first-child {border-top: none;}
.quick_banner02 > ul > li > a {display: inline-block; padding-left: 12px; font-size: 14px; line-height: 44px; font-weight: 600; color: #555;}
.quick_banner02 > ul > li > a:hover {color: #00cdcb;}

.quick-wrapper .owl-nav {position: relative; color: #555;}
.quick-wrapper .owl-dots {position: absolute; bottom: -22px; right: calc(50% - 15px); width: 30px; font-size: 13px; text-align: center; color: #555;}
.quick-wrapper .owl-prev {position: absolute; top: 0; left: 30px;}
.quick-wrapper .owl-next {position: absolute; top: 0; right: 30px;}
.quick-owl-wrapper .owl-dot {counter-increment: slides-num; color: #555;}
.quick-owl-wrapper .owl-dot.active:before {content: counter(slides-num); padding-right: 2px; }
.quick-owl-wrapper .owl-dots:after {content: "/ " counter(slides-num); font-weight: normal; letter-spacing: -1px;}

   
@media (max-width:1560px) {
    .quick_banner01, .quick_banner02 {right: 0;}
}

/*
@media (max-width:1099px) {
    .quick_banner01, .quick_banner02 {display: none;}
}
*/
@media (max-width:1199px) {
    .quick_banner01, .quick_banner02 {display: none;}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}

/*card js*/
.button_card--inactive {
    opacity: 0.2;
}

.btn_card_left, .btn_card_right {position: absolute; top: 262px; display: inline-block; width: 24px; height: 44px; }
.btn_card_left {left: calc(50% - 550px);}
.btn_card_right { left: calc(50% + 550px);}

.cards-wrapper {display: flex; flex-direction: column; align-items: center;}

.cards__container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.box {
    box-shadow: 10px 8px 10px rgb(0 0 0 / 0.2);
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border-radius: 20px;
    opacity: 1;
}

.box:nth-child(2n) {transform: scale(0.85);z-index: -1;}
.box:nth-child(2) {left: 12%; opacity: 0.75;}
.box:nth-child(4) {left: -12%; opacity: 0.75;}
.box:nth-child(4n + 1) {transform: scale(0.75); z-index: -2;}
.box:nth-child(1) {left: 25%; opacity: 0.2;}
.box:nth-child(5) {left: -25%; opacity: 0.2;}
.box--hide {display: none;}

.move-out-from-left {
    animation: moveOutLeft 0.5s ease-in-out;
}

.move-out-from-right {
    animation: moveOutRight 0.5s ease-in-out;
}

.move-to-position5-from-left {
    animation: moveToP5Left 0.5s ease-in-out;
}

.move-to-position4-from-left {
    animation: moveToP4Left 0.5s ease-in-out;
}

.move-to-position3-from-left {
    animation: moveToP3Left 0.5s ease-in-out;
}

.move-to-position2-from-left {
    animation: moveToP2Left 0.5s ease-in-out;
}


.move-to-position1-from-left{
    animation: moveToP1Left 0.5s ease-in-out;
}

.move-to-position5-from-right{
    animation: moveToP5Right 0.5s ease-in-out;
}
.move-to-position4-from-right{
    animation: moveToP4Right 0.5s ease-in-out;
}
.move-to-position3-from-right{
    animation: moveToP3Right 0.5s ease-in-out;
}
.move-to-position2-from-right{
    animation: moveToP2Right 0.5s ease-in-out;
}
.move-to-position1-from-right{
    animation: moveToP1Right 0.5s ease-in-out;
}

@keyframes moveOutLeft {
    0% {
        transform: scale(0.75) translateX(0%);
        opacity: 1;
    }
    50% {
        transform: scale(0.5) translateX(-150%);
        opacity: 0.8;
    }
    100% {
        transform: scale(0.25) translateX(0%);
        opacity: 0;
    }
}

@keyframes moveOutRight {
    0% {
        transform: scale(0.75) translateX(0%);
        opacity: 1;
    }
    50% {
        transform: scale(0.5) translateX(150%);
        opacity: 0.8;
    }
    100% {
        transform: scale(0.25) translateX(0%);
        opacity: 0;
    }
}


@keyframes moveToP5Left {
    from {
        transform: scale(0.75) translateX(50%);
    }
    to {
        transform: scale(0.75) translateX(0);
    }
}

@keyframes moveToP4Left {
    from {
        transform: scale(0.75) translateX(50%);
    }
    to {
        transform: scale(0.85) translateX(0);
    }
}

@keyframes moveToP3Left {
    from {
        transform: scale(0.85) translateX(50%);
    }
    to {
        transform: scale(1) translateX(0);
    }
}

@keyframes moveToP2Left {
    from {
        transform: scale(1) translateX(50%);
    }
    to {
        transform: scale(0.85) translateX(0);
    }
}

@keyframes moveToP1Left {
    from {
        transform: scale(0.85) translateX(50%);
    }
    to {
        transform: scale(0.75) translateX(0);
    }
}


@keyframes moveToP1Right {
    from {
        transform: scale(0.75) translateX(-50%);
    }
    to {
        transform: scale(0.75) translateX(0);
    }
}

@keyframes moveToP2Right {
    from {
        transform: scale(0.75) translateX(-50%);
    }
    to {
        transform: scale(0.85) translateX(0);
    }
}

@keyframes moveToP3Right {
    from {
        transform: scale(0.85) translateX(-50%);
    }
    to {
        transform: scale(1) translateX(0);
    }
}

@keyframes moveToP4Right {
    from {
        transform: scale(1) translateX(-50%);
    }
    to {
        transform: scale(0.85) translateX(0);
    }
}

@keyframes moveToP5Right {
    from {
        transform: scale(0.85) translateX(-50%);
    }
    to {
        transform: scale(0.75) translateX(0);
    }
}
    

