/**
* OLYM Cascading Style Sheets
* File Name : main.css
* Description : 메인 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2016.08.30
* Update : 2016.08.30
* Copyright(c) 2016 OLYM Communications. All Rights Reserved.
*/

.pc_mode { display:block;}
.mo_mode { display:none;}
@media all and (max-width:1000px) {
.pc_mode { display:none;}
.mo_mode { display:block;}
}

/* contents */
#fp-nav.fp-left{/*width: 400px;*/left: 0}
#fp-nav ul li, .fp-slidesNav ul li{width: 100%;height: 25px;margin: 7px 25px}
#fp-nav ul li a span, .fp-slidesNav ul li a span{background: none;width: auto;height: 100%}
#fp-nav .fp-sr-only{overflow: visible;clip: inherit;background: none}
#fp-nav ul li a, .fp-slidesNav ul li a{font-family: "Open Sans";color: rgba(255,255,255,0.4)}
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span,#fp-nav ul li:hover a span{margin: -2px 0 0 -2px;color: #35de4c;width: auto;;height: 100%}
#fp-nav ul li a.active:before, #fp-nav ul li:hover a:before{content: "";width: 30px;height: 2px;background: #35de4c;display: block;position: absolute;left: -25px;top: 18px}
#fp-nav ul li a.active .fp-sr-only:after, #fp-nav ul li:hover a .fp-sr-only:after{content: "";width: 5px;height: 5px;background: #35de4c;display: block;position: absolute;top: 0px;right: -8px;border-radius: 100%}
#fp-nav ul li:last-child{display: none}



.title h2{font-family: "Open Sans";font-size: 40px;color: #000;text-align: center;margin: 55px 0}
.mall .title h2, .comm .title h2{margin: 40px 0}

.swiper-container1{height: 100vh;overflow: hidden;}
.swiper-container1 .swiper-slide .main_video{height: 100%}
.swiper-container1 .swiper-slide .main_vod { position:absolute; left:50%; bottom:0; margin-left:-960px; width:1920px; height:100vh;}
.swiper-container1 .swiper-slide .main_vod video { width:100%; height:auto}
/* .swiper-container1 .swiper-slide .main_pic{transition: all 3.6s linear;  transform: scale(1.08); height: 100%;width:100%;}} */
.swiper-slide .main_pic{ transform: scale(1.08); transition: all 4.6s linear; }
.swiper-slide.swiper-slide-active .main_pic{ transform: scale(1); }
/* .swiper-slide.swiper-slide-prev   .main_pic{ transform: scale(1); }
.swiper-slide.swiper-slide-duplicate .main_pic{ transform: scale(1); }
.swiper-slide.swiper-slide-duplicate.swiper-slide-active .main_pic{ transform: scale(1); } */
/* .swiper-slide.swiper-slide-duplicate-next .main_pic{ transform: scale(1.8); transition: none; } */
/* .swiper-slide.swiper-slide-next .main_pic{ transform: scale(1);           transition: all 3.6s linear;}
.swiper-slide.swiper-slide-duplicate-next .main_pic{ transform: scale(1); transition: all 3.6s linear;} */

#scroll {transform: rotate( 90deg );position: absolute;z-index: 2;left: 0;font-family: "Open Sans";color: rgba(255,255,255,0.3);line-height: 36px;bottom: 200px}
#scroll::after{content: "";width: 2px;height: 100px;background: rgba(255,255,255,0.2);display: block;transform: rotate( 90deg );top: -90%;left: 180%;position: absolute;}
.swiper-container1 .swiper-button-next,.swiper-container1 .swiper-button-prev{width: 13px;height: 25px;top: auto;bottom: 35px}
.swiper-container1 .swiper-button-prev:after{content: "";background: url("/project/design/main/ic_arrow1.png") no-repeat;width: 100%;height: 100%}
.swiper-container1 .swiper-button-next:after{content: "";background: url("/project/design/main/ic_arrow2.png") no-repeat;width: 100%;height: 100%}
.swiper-container1 .swiper-pagination{top:auto; bottom: 30px; left: 50%;transform: translate(-50%, 0);}
.swiper-container1 .swiper-pagination-bullet{font-family: "Open Sans";font-weight: bold;background: none;color: #fff;font-size: 17px;width: 25px;height: 25px;padding: 5px;margin: 0 7px;line-height: 23px;opacity: .4;border: 2px solid transparent;border-radius: 100%;}
.swiper-container1 .swiper-pagination-bullet-active{border-color: #fff;opacity: 1}
.swiper-container1 .swiper-slide .text{position: absolute;display: inline-block;color: #fff;z-index: 1;top: 35%;left:300px}
.swiper-container1 .swiper-slide .text h2{font-size: 50px;font-weight: bold;margin-bottom: 25px;text-shadow: 2px 0 8px rgba(0,0,0,0.3)}
.swiper-container1 .swiper-slide .text p{font-size: 30px;font-weight: 100;text-shadow: 2px 0 8px rgba(0,0,0,0.3)}

.swiper-container1 .notice_box{position: absolute; width:40%; display: inline-block;z-index: 2;color: #fff;bottom: 120px;left:260px;border-bottom: 2px solid #fff;height: 50px;overflow: hidden;}
.swiper-container1 .notice_box ul li{ position: relative; }
.swiper-container1 .notice_box ul li a{color: #fff;display: block;font-weight: 500;padding: 15px 40px; box-sizing:border-box; font-size: 16px;text-shadow: 2px 0 8px rgba(0,0,0,0.3);text-overflow:ellipsis; white-space:nowrap; overflow:hidden; width:70%; }
.swiper-container1 .notice_box ul li span{ position: absolute; right: 60px;top: 15px}
.swiper-container1 .notice_box .btnCont{position: absolute;right: 10px;top: 0}
.swiper-container1 .notice_box #prev{cursor: pointer;margin-bottom: 13px;height: 13px;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid #fff;}
.swiper-container1 .notice_box #next{cursor: pointer;height: 13px;border-left: 7px solid transparent;border-right: 7px solid transparent;border-top: 7px solid #fff;}

/*Information center*/
.table_type1 { border-top:2px solid #000; overflow-x:auto;} /* 테이블 상단 라인과 세로라인이 겹치는 부분을 없앰, 모바일에서 가로스크롤 */
.table_type1 table, .table_type1 th, .table_type1 td { border:1px solid #d4d4d4; border-top:none; border-collapse:collapse; font-size:inherit; border-left-width: 0 !important;border-right-width: 0 !important}
.table_type1 table { width:100%;}
.table_type1 th { padding:15px; color:#333; background:#f6f6f6;}
.table_type1 td { padding:15px; text-align:center;}

.center{background: url("/project/design/main/bg_main1.jpg") no-repeat;background-size: cover;padding: 75px 0}
.center .con > div{background: #fff;width: 28%;float: left;margin-right: 3%; box-sizing:border-box; padding: 0 3%;box-shadow: 4px 0 12px rgba(0,0,0,0.1); min-height:620px;}
.center .con > div:last-child{margin-right: 0}
.center .con > div.w40{background: #051548;width: 38%;padding: 0}
.center .con > div h2{font-size: 24px;text-align: center;margin-top: 30px;}
.center .con h3 {font-size: 17px;text-align: center;font-weight:600; padding-bottom:10px;}
.center .con > div.w40 h2{color: #fff}
.center .con > div.w40 .tab ul li a{color: #fff}
.center .con .tab {margin-bottom: 25px}
.center .con .tab ul{display: table;margin: 0 auto;}
.center .con .tab ul li{display: table-cell;padding: 5px 12px}
.center .con .tab ul li a{color: #000;font-size: 16px;position: relative;}
.center .con .tab ul li a::after{content: "";position: absolute;top: 100%;left: 50%;transform: translate(-50%, -0%);opacity: 0;display: inline-block;height: 19px;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 8px solid #38b549;transition: all .3s ease;margin-top:5px}
.center .con .tab ul li:hover a::after,.center .con .tab ul li a.on::after{opacity: 1;}
.center .con .tab ul li:hover a,.center .con .tab ul li a.on{color: #38b549}
.center .con > div.w40 .tab ul li:hover a,.center .con > div.w40 .tab ul li a.on{color: #38b549}

.center .con .logoimg { margin-bottom:15px;}
.center .con .logoimg ul { border-top:1px solid #ddd; border-left:1px solid #ddd;}
.center .con .logoimg ul li{width:33.33%;float: left;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd; box-sizing:border-box;}
.center .con .logoimg ul li:last-child {width:66.66%;}
.center .con .logoimg ul li a{display: block; position:relative; text-indent:-9999px;height:64px;}
.center .con .logoimg ul li a img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.center .con .logoimg ul li a.bg1 {background: url("/project/design/main/img_cent1_off.png") no-repeat center;}
.center .con .logoimg ul li a.bg2 {background: url("/project/design/main/img_cent2_off.png") no-repeat center;}
.center .con .logoimg ul li a.bg3 {background: url("/project/design/main/img_cent3_off.png") no-repeat center;}
.center .con .logoimg ul li a.bg4 {background: url("/project/design/main/img_cent4_off.png") no-repeat center;}
.center .con .logoimg ul li a.bg5 {background: url("/project/design/main/img_cent5_off.png") no-repeat center;}
.center .con .logoimg ul li a.bg1:hover, .center .con .logoimg ul li a.bg1.on {background:#f0f0f0 url("/project/design/main/img_cent1_on.png") no-repeat center;}
.center .con .logoimg ul li a.bg2:hover, .center .con .logoimg ul li a.bg2.on {background:#f0f0f0 url("/project/design/main/img_cent2_on.png") no-repeat center;}
.center .con .logoimg ul li a.bg3:hover, .center .con .logoimg ul li a.bg3.on {background:#f0f0f0 url("/project/design/main/img_cent3_on.png") no-repeat center;}
.center .con .logoimg ul li a.bg4:hover, .center .con .logoimg ul li a.bg4.on {background:#f0f0f0 url("/project/design/main/img_cent4_on.png") no-repeat center;}
.center .con .logoimg ul li a.bg5:hover, .center .con .logoimg ul li a.bg5.on {background:#f0f0f0 url("/project/design/main/img_cent5_on.png") no-repeat center;}
.center .con .chart span.up{background: #ec434b;color: #fff;padding: 2px 4px; line-height:1em; display:inline-block; position: relative; font-size:0.8em;}
.center .con .chart span.up::before{content: "";top: 100%;left: 50%;transform: translate(-35%, -23%);display: inline-block;border-left: 4px solid transparent;border-right: 4px solid transparent;border-bottom: 6px solid #fff;transition: all .3s ease;margin-top: 5px;margin-left: 3px; }

.center .con .chart span.down{background: #437bec;color: #fff;padding: 2px 4px;line-height:1em; display:inline-block; position: relative; font-size:0.8em;}
.center .con .chart span.down::before{content: "";top: 100%;left: 50%;transform: translate(-35%, -23%);display: inline-block;border-left: 4px solid transparent;border-right: 4px solid transparent;border-top: 6px solid #fff;transition: all .3s ease;margin-top: 5px;margin-left: 3px;}
.center .con .chart .table_type1 th{background: #d6dae8;font-weight: normal;padding: 12px;border-bottom-width: 0!important}
.center .con .chart .table_type1 td{color: #7e7e7e;padding: 12px}


.center .con .info1 .chart .gr_box{padding: 10px 20px 0px;background: #f0f0f0;margin-bottom: 40px;}
.center .con .info2 .chart .gr_box{
	/* padding: 30px 20px 0px; */
	padding: 15px; box-sizing: border-box; height: 220px;
	margin:0 40px;background: #fff;}

.center .con .info2 .tab {margin-bottom: 15px}
.center .con .info2 .chart canvas{width: 200px; height: 220px; }
.center .con .info2 .chart .table_type1{border-top:none; margin: 35px 40px 0 40px}
.center .con .info2 .chart .table_type1 th{background: #162e7c;color: #fff;}
.center .con .info2 .chart .table_type1 td{color: #fff;border-bottom-color: rgba(255,255,255,0.2)}

/* 2차 탭 */
.center .con .info2 .chart .tab2 { background:#fff ;margin:0 40px;transition: all .3s ease;}
.tab2{position: relative; padding-top:10px;}
.tab2 ul {display:table; margin:0 auto;}
.tab2 ul li{display: table-cell;}
.tab2 ul li a{font-size: 13px;color: #666;transition: all .3s ease}
.tab2 ul li a:after{content: "ㆍ";margin: 0 5px;position: relative;right: -5px;color: #666}
.tab2 ul li:last-child a:after{content: ""}
.tab2 ul li a.on,.tab2 ul li a:hover{color: #437bec;font-weight: bold;}

.center .con .info3 .chart .table_type1 {margin-top:10px;}
.center .con .info3 h4 {position: relative; font-size:17px; font-weight:500;}
.center .con .info3 h4 .unit{position: absolute;top: 0;right: 0;color: #858585; font-size:15px; font-weight:400;}
.center .con .info3 .con1 { margin:20px 0;}
.center .con .info3 .con1 > ul > li { float:left; width:50%;}
.center .con .info3 .con1 > ul > li > a{ display:block; color:#fff; padding:10px 20px 0 15px;height:60px; box-sizing:border-box;}
.center .con .info3 .con1 > ul > li > a.bg1 { background:#5548a9 url("/project/design/main/ic_arrow5.png") no-repeat 90% center;}
.center .con .info3 .con1 > ul > li > a.bg2 { background:#5a69c3 url("/project/design/main/ic_arrow5.png") no-repeat 90% center;}
.center .con .info3 .con2 a { display:block; background:#cce2f0 url("/project/design/main/bg_info.jpg") no-repeat right bottom; padding: 20px 30px;}
.center .con .info3 .con2 h2{font-size: 20px;text-align: left;color: #252121;margin:5px 0;}
.center .con .info3 .con2 p{font-size: 15;color: #767676}

/*business*/
.business{background: url("/project/design/main/bg_main2.jpg") no-repeat;background-size: cover;padding: 75px 0;overflow: hidden;}
.business .title h2{color: #fff}

.business .innercontainer {opacity: 0;float: left;animation: fade linear 0.5s forwards;-webkit-animation: fade linear 0.5s forwards;transition: -webkit-filter 0.3s, height 0.5s ease, width 0.5s ease;overflow: hidden;}

.business .shown {cursor: pointer;}
.business .shown:after {height: 100%;width: 100%;content: "";display: block;top: 0;left: 0;position: relative;transition: opacity 0.3s linear;opacity: 0;text-align: center;line-height: 100%;color: white;}
.business .shown:hover:after {opacity: 1;}
.business .standing {height: 335px;width: 33.3%;}

.business .shown.standing:hover {width: 50%;height: 335px;}
.business .hover-left {width: 25% !important;}
.business .hover1{background: url("/project/design/main/bg_busi1.jpg") no-repeat center; background-size: cover;}
.business .hover2{background: url("/project/design/main/bg_busi2.jpg") no-repeat center; background-size: cover;}
.business .hover3{background: url("/project/design/main/bg_busi3.jpg") no-repeat center; background-size: cover;}
.business .hover4{background: url("/project/design/main/bg_busi4.jpg") no-repeat center; background-size: cover;}
.business .hover5{background: url("/project/design/main/bg_busi5.jpg") no-repeat center; background-size: cover;}
.business .hover6{background: url("/project/design/main/bg_busi6.jpg") no-repeat center; background-size: cover;}

.business .hover4.standing,.business .hover5.standing,.business .hover6.standing{height: 270px !important}
.business .hover4 .con h2,.business .hover5 .con h2,.business .hover6 .con h2{margin-top: 120px }
.business .hover4:hover .con h2,.business .hover5:hover .con h2,.business .hover6:hover .con h2{margin-top: 35px !important}

.business .shown:hover .con{border-color: #fff; padding: 35px}
.business .shown:hover .con p {opacity: 1}
.business .shown:hover .con h2 {margin-top:100px; font-size:30px; }
.business .con{position: relative;margin: 25px;border:2px solid transparent;padding: 35px 0;transition: all .3s ease}

.business .con h2{position: relative;color: #fff;font-size: 24px; font-weight:600;margin-top:185px;transition: all .3s ease}
.business .con p{color: #fff;font-size: 16px;line-height: 22px;opacity: 0;transition: all .7s ease;margin-top: 15px}

@keyframes fade
{
	from { opacity: 0; transform: scale(0.8); }
	to { opacity: 1; }
}

@-webkit-keyframes fade
{
	from { opacity: 0; transform: scale(0.8); }
	to { opacity: 1; }
}

/*Community*/
.comm{background: url("/project/design/main/bg_comm.jpg") no-repeat;background-size: cover;;padding: 75px 0}
.comm .con{position: relative;margin-bottom: 35px}
.comm .con > div > h2{font-size: 24px;margin: 15px 10px;margin-top: 0;position: relative;}
.comm .con > div > h2 span.more{position: absolute;right: 0}
.comm .con > div{width: 48.5%;float: left;transition: .3s ease;}
.comm .con > div.news{margin-right: 3%}
.comm .con > .news:hover,.comm .con > .post:hover{ transform:translate(0px, 15px);}
.comm .con > div > div{background: #fff;box-shadow: 4px 0 12px rgba(0,0,0,0.1)}
.comm .con .bg1{background: #162e7c}
.comm .con .bg2{background: #3677b9}
.comm .con .bg3{background: #c82d3f}
.comm .con .bg4{background: #122949}
.comm .con > div > div.left{width: 47%;float: left; min-height: 347px;overflow: hidden;z-index: 9}
.comm .con > div > div.left:hover img{transform: scale(1.2);transition: all .3s ease}
.comm .con > div > div.left img{transition: all .3s ease}

.comm .con > div > div.right{width: 53%;float: left;min-height: 347px;}
.comm .con > div > div.left a{display: block;overflow: hidden;}
.comm .con > div > div.left a img{width: 100%}

.comm .con .nolist{position: relative;display: block;padding: 25%;text-align: center;}
.comm .con .nolist h2{color: #fff;font-size: 16px}
.comm .con .left { position:relative;}
.comm .con .left .subject{position: absolute; bottom:0; padding: 30px}

.comm .con .left .subject h2{color: #fff;font-size: 16px}
.comm .con .left .subject p{font-family: "Open Sans";font-size: 14px;color: rgba(255,255,255,0.3);margin-top: 20px}
.comm .con .left .subject span{color: #fff;font-size: 15px;position: absolute;top: -14px; left: 0;padding: 5px 20px}

.comm .con .right > div{background: #fff;position: relative;border-bottom: 1px solid #ddd}
.comm .con .right > div:last-child{border-bottom: 0}
.comm .con .right > div ul{margin: 15px 33px 15px}
.comm .con .right > div ul li{position: relative;}
.comm .con .right > div ul li a::before{content: "ㆍ";}
.comm .con .right > div ul li a{line-height: 27px; color: #8d8d8d;font-size: 15px;  text-overflow:ellipsis; white-space:nowrap; overflow:hidden; display:block;}
.comm .con .right > div ul li:hover a{text-decoration:underline !important;}
.comm .con .right > div span{color: #fff;font-size: 15px;padding: 5px 0;display: block;width: 100px;text-align: center;}
.comm .con .right > div h2{font-size: 16px;margin: 23px 33px 10px 33px;color: #000; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.comm .con .right > div:hover h2{text-decoration: underline;}
.comm .con .right > div p{font-size: 15px;color: #8d8d8d;margin: 0 33px 18px 33px; height:40px;  text-overflow:ellipsis; overflow:hidden;}

.comm .con2 .tab{position: relative;}
.comm .con2 .tab .more{position: absolute;top: 0;right: 10px}
.comm .con2 ul{margin-bottom: 15px}
.comm .con2 .tab ul li{display: table-cell;}
.comm .con2 .tab ul li a{font-size: 20px;color: #595959;margin: 10px;transition: all .3s ease}
.comm .con2 .tab ul li a:after{content: "ㆍ";margin: 0 0 0 10px;position: relative;right: -5px;color: #595959}
.comm .con2 .tab ul li:last-child a:after{content: ""}
.comm .con2 .tab ul li a.on,.comm .con2 .tab ul li a:hover{color: #000;font-weight: bold;}

.comm .con2 .list .bg1{border: 1px solid #3677b9;color: #3677b9}
.comm .con2 .list .bg2{border: 1px solid #000;color: #000}
.comm .con2 .list .bg3{border: 1px solid #c82d3f;color: #c82d3f}
.comm .con2 .list .bg4{border: 1px solid #162e7c;color: #162e7c}
.comm .con2 .list ul li:hover .bg1{background: #3677b9;color: #fff}
.comm .con2 .list ul li:hover .bg2{background: #000;color: #fff}
.comm .con2 .list ul li:hover .bg3{background: #c82d3f;color: #fff}
.comm .con2 .list ul li:hover .bg4{background: #162e7c;color: #fff}
.comm .con2 .list .boardtype{border-radius: 5px;padding: 5px 10px;display: inline-block;;text-align: center;transition: all .3s ease}
.comm .con2 .list .regdate{position: absolute;right: 30px;color: #595959;font-family: "Open Sans";padding: 5px 0;font-weight: 600;}
.comm .con2 .list ul li{float:left; width:25%; position: relative;padding: 30px; box-sizing:border-box; background: #fff}

.comm .con2 .list ul li a{display: block;position: relative;}
.comm .con2 .list ul li a::after{content: "";width: 1px;height: 100%;background: #ddd;position: absolute;top: 0px;right: -17px}
.comm .con2 .list ul li:last-child a:after{display: none}
.comm .con2 .list ul li h2{font-size: 16px;color: #000;margin: 10px 0;  text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.comm .con2 .list ul li:hover h2{text-decoration: underline;}
.comm .con2 .list ul li p{font-size: 15px;color: #8d8d8d; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }

.mall{;padding: 75px 0}
.mall .tab{position: relative;margin-bottom: 40px}
.mall .tab .swiper-button-next::after,.mall .tab .swiper-button-prev::after{content: "";}
.mall .tab .swiper-button-prev{background: url("/project/design/main/ic_arrow3.png") no-repeat center; height: 26px;top: 74px;width: 20px;left: auto;right: 70px}
.mall .tab .swiper-button-prev::after{content: ""; width: 1px;height: 26px;background: #adadad;position: relative;right: -35px}
.mall .tab .swiper-button-next{background: url("/project/design/main/ic_arrow4.png") no-repeat center; height: 26px;top: 74px;width: 20px;right: 0}

.swiper-container3{overflow: hidden;position: relative;}
.swiper-container3 .swiper-slide img { width:100%;}
.mallbanner .tab .swiper-button-prev{background: url("/project/design/main/ic_arrow3.png") no-repeat center; height: 26px;top: 40px;width: 20px;left: auto;right: 70px}
.mallbanner .tab .swiper-button-next{background: url("/project/design/main/ic_arrow4.png") no-repeat center; height: 26px;top: 40px;width: 20px;left: auto;right: 0px}
.mallbanner .tab .swiper-button-prev::after{content: ""; width: 1px;height: 26px;background: #adadad;position: relative;right: -35px}
/*.mallbanner .tab{margin-bottom: 60px}*/

.mall .tab ul{display: table;margin: 0 auto;}
.mall .tab ul li{display: inline-block;;border: 2px solid #000;}
.mall .tab ul li:first-child{margin-right: 30px}
.mall .tab ul li a{position: relative;color: #000;font-size: 18px;padding: 15px 120px 15px 30px;display: block;}
.mall .tab ul li a::after{opacity: 0;content: "";width: 20px;height: 2px;background: #000;position: absolute;display: block;top: 23px;right: 20px;transition: all .3s ease}
.mall .tab ul li a.on::after,.mall .tab ul li a:hover::after{opacity: 1}

.mall .mallbanner > div{float: left;position: relative;}
.mall .mallbanner > div.tab{float: none; height:30px;}
.mall .mallbanner > div a{display: block}
.mall .mallbanner > div:last-child{margin-right: 0}
.mall .mallbanner .shadow{width: 100%;height: 100%;background: rgba(0,0,0,0.5);transition: all .3s ease;display: block;opacity: 1;position: absolute;}
.mall .mallbanner .shadow:hover,.mall .mallbanner .on .shadow{opacity: 0}

.swiper-container2{overflow: hidden;}
.swiper-container2 .shadow{background: rgba(0,0,0,0.8);position: absolute;padding: 35px 50px; width:100%; box-sizing:border-box;bottom: -50px;opacity: 0;transition: all .3s ease; text-align:center;}

.swiper-container2 .swiper-slide .shadow,.swiper-container2 .swiper-slide.on .shadow{opacity: 0;}
.swiper-container2 .swiper-slide:hover .shadow,.swiper-container2 .swiper-slide.on .shadow{opacity: 1;bottom: 0;}
.swiper-container2 .swiper-slide { max-height:320px; overflow:hidden;}
.swiper-container2 .swiper-slide img { width:100%;}
.swiper-container2 .shadow h2{color: #fff;font-size: 22px;line-height: 30px}


.owl-carousel.owl-drag .owl-item img{height: 100%}
/* 푸터배너 */
.bannerbg{background: #d6dae8}
.banner {padding:20px 0;}
.banner .slide_area {position:relative; float:left; width:86%;}
.banner .slide_area li { float:left; padding:0 5px; box-sizing:border-box;}
.banner .slide_area li a { display:block;}
.banner .slide_ctrl { float:right; width:12%; margin-top:13px; border-left:1px solid #ddd; box-sizing:border-box;}
.banner .slide_ctrl a {float:left; padding:6px 0; width:33.33%; text-align:center; display:block;  box-sizing:border-box; cursor:pointer;}


@media all and (max-width:1660px) {
.swiper-container1 {height:800px !important;}
.center {height:auto !important; padding:40px 0;}
.business {height:auto !important; padding:40px 0;}
.comm {height:auto !important; padding:40px 0;}
.mall {height:auto !important; padding:40px 0;}
.title h2 { margin:10px 0 30px 0; font-size:34px;}
.mall .title h2, .comm .title h2 {margin:10px 0 30px 0;}
}

@media all and (max-width:1280px) {
.swiper-container1 .swiper-slide .text{left:15%;}
.swiper-container1 .notice_box{left:12%; width:76%;}
.swiper-container1 .notice_box ul li a { padding:15px 20px;}
.center .con > div{ width: 30%; margin-right: 1%; padding: 0 1%;}
.center .con .tab ul li{padding: 5px}
.center .con .tab ul li a { font-size:0.95em;}
.center .con .info2 .chart .tab2 {margin:0 10px;}
.center .con .info2 .chart .gr_box { margin:0 10px;}
.center .con .info2 .chart .table_type1 { margin:35px 10px 0 10px;}
.comm .con .right > div ul { margin:10px 15px;}
.swiper-container2 .shadow{padding: 20px;}
.swiper-container2 .shadow h2{font-size: 18px;line-height: 1.4em;}
.banner .slide_ctrl { margin-top:6px;}
}

@media all and (max-width:1000px) {
.swiper-container1 {height:400px !important;}
.swiper-container1 .swiper-slide .text h2 { font-size:40px; margin-bottom:15px;}
.swiper-container1 .swiper-slide .text p { font-size:24px;}
.swiper-container1 .swiper-pagination{bottom: 27px;}
.center .con > div{ width: 100%; margin-right: 0; padding: 0 5% 30px 5%;}
.center .con > div.w40{width: 100%;padding: 0 5% 30px 5%; margin:20px 0;}
.comm .con2 .list .regdate { position:relative; right:auto; display:block; padding:10px 0 0 0;}
.comm .con2 .list ul li h2 { margin:0 0 10px 0;}
.comm .con > div { width:100%;}
.comm .con > div.news { margin:0 0 20px 0;}
.comm .con2 .list ul li{width:50%;}
.comm .con2 .list ul li:nth-child(3), .comm .con2 .list ul li:nth-child(4){display:none;}
.comm .con2 .list ul li:nth-child(2) a:after{display: none}
}

@media all and (max-width:800px) {
.swiper-container1 {height:370px !important;}
.swiper-container1 .swiper-slide .text{top: 30%;}
.swiper-container1 .swiper-slide .text h2 { font-size:30px; margin-bottom:10px;}
.swiper-container1 .swiper-slide .text p { font-size:16px;}
.swiper-container1 .notice_box { bottom:80px;}
.business .con h2 { font-size:20px;}
.business .shown.standing:hover {width:33.33%;}

.center .con .chart span.up::before{left: 50%;transform: translate(-35%, -10%);border-left: 3px solid transparent;border-right: 3px solid transparent;border-bottom: 5px solid #fff;margin-top: 5px;margin-left: 3px; }

.center .con .chart span.down::before{left: 50%;transform: translate(-35%, -10%);border-left: 3px solid transparent;border-right: 3px solid transparent;border-top: 5px solid #fff;margin-top: 5px;margin-left: 3px;}
}

@media all and (max-width:500px) {
#scroll {display:none;}
.swiper-container1 {height:500px !important;}
.swiper-container1 .notice_box{left:5%; width:90%;}
.swiper-container1 .notice_box ul li a { width:90%;}
.swiper-container1 .notice_box ul li span{ display:none;}
.swiper-container1 .swiper-slide .text h2 { font-size:26px;}
.swiper-container1 .swiper-button-next,.swiper-container1 .swiper-button-prev{bottom: 30px}
.swiper-container1 .swiper-pagination-bullet{font-size: 13px; letter-spacing:-0.05em; width: 16px;height: 16px;margin: 0 2px;line-height: 17px;}
.title h2 { font-size:28px;}
.table_type1 table, .table_type1 th, .table_type1 td { font-size:0.875em;}
.table_type1 th { padding:10px 5px;}
.table_type1 td { padding:10px 5px;}
.center .con > div { min-height:auto;}
.center .con .chart span.up{padding: 0 2px;line-height:1.2em;}
.center .con .chart span.up::before{border-left: 3px solid transparent;border-right: 3px solid transparent;border-bottom: 5px solid #fff;transform: translate(-35%, -50%);}

.center .con .chart span.down{padding: 0 2px;line-height:1.2em;}
.center .con .chart span.down::before{border-left: 3px solid transparent;border-right: 3px solid transparent;border-top: 5px solid #fff;transform: translate(-35%, -50%);}
.center .con .chart .table_type1 th{padding: 10px 5px;}
.center .con .chart .table_type1 td{padding: 10px 5px}
.center .con .info2 .chart .gr_box { height:auto;}

.center .con .tab ul li a { letter-spacing:-0.05em; font-size:0.875em;}
.business .standing { width:50%; height:150px; position:relative;}
.business .standing a { display:block; height:150px;}
.business .hover4.standing, .business .hover5.standing, .business .hover6.standing { height:150px !important;}
.business .hover4 .con h2,.business .hover5 .con h2,.business .hover6 .con h2{margin-top: 0 }
.business .hover4:hover .con h2,.business .hover5:hover .con h2,.business .hover6:hover .con h2{margin-top: 0 !important}
.business .shown.standing:hover { width:50%;}
.business .con { margin:0; padding:0; position:absolute; bottom:20px; right:20px;}
.business .con h2 { margin-top:0; font-size:18px; text-align:right;}
.business .con p { display:none;}
.business .shown:after { display:none;}
.business .shown.standing:hover { height:150px;}
.business .hover-left {width: 50% !important;}


.business .shown:hover .con{border:none !important; padding: 0}
.business .shown:hover .con p {display:none;}
.business .shown:hover .con h2 { margin-top:0; font-size:18px;}

.comm .con > div > div.left { width:100%;}
.comm .con > div > div.right { width:100%;}
.comm .con2 .tab ul li a { font-size:18px; margin:10px 0;}
.comm .con2 .tab ul li a:after { margin:0; right:0;}
.comm .con2 .list ul li{width:100%;}
.comm .con2 .list ul li:nth-child(1) a:after{display: none}
.comm .con2 .list ul li:nth-child(2){display: none}

.mall .tab { margin-bottom:60px;}
.mall .tab ul li:first-child { margin-right:10px;}
.mall .tab ul li a { padding:10px 30px;}
.mall .tab ul li a::after { display:none;}

.mall .tab .swiper-button-prev{top: 84px;}
.mall .tab .swiper-button-next{top: 84px;}

.mall .tab.arrow2 .swiper-button-prev{top: 44px;}
.mall .tab.arrow2 .swiper-button-next{top: 44px;}

.banner .slide_area {width:70%;}
.banner .slide_ctrl { width:28%;}
.banner .slide_ctrl a { padding:17px 0;}
}