@charset "utf-8";

/* topBannerWrap */
#wrapper #topBannerWrap {height:auto;}
#wrapper #topBannerWrap .bannerArea { display:none; z-index:999; width:100%; height:215px; background-image: url(/images/kossa/main/bg_topbanner.jpg); background-repeat:repeat-x; }
.bannerArea .topWrap {position:relative; width:1085px; height:120px; margin:0 auto; padding:30px;}
.bannerArea .topWrap .btn_go {position:absolute; right:70px; bottom:50px;}
.bannerArea .topWrap .text {width:908px; line-height:20px; letter-spacing:0.01em;}
.bannerArea .topWrap .text .tit {color:#216e9e; font-size:22px; margin-bottom:21px;}
.bannerArea .topWrap .text .contents {width:908px;height:80px; overflow:hidden;}

.bannerArea .close {width:1145px; height:35px; margin:0 auto; line-height:35px; text-align:right; color:#ccc;}
.bannerArea .close input[type="checkbox"] {margin:0; vertical-align:middle;}
.bannerArea .close label.mr30 {margin-right:30px;}
.bannerArea .close .btn_close {margin-left:20px;}


/***************** 
*	container    *
******************/

/* main_slider */
#container {width: 1200px!important; margin: 0 auto;}
#container .main_slider {position:relative; height: 360px;width: 100%;margin-top: 10px; overflow: hidden;}
#container .main_slider .slide_bg{position: relative; width: 401%; height: 100%;}
#container .main_slider .slide_bg li{width: 1200px; height: 100%;display: inline-block;}
#container .main_slider .slide_bg li>img{width: 100%; height: 100%;}
/*
#container .main_slider .slide_bg li:first-child{background: url(/images/kossa/main/mainslide1.png) no-repeat 100%;}
#container .main_slider .slide_bg li:nth-child(2){background: url(/images/kossa/main/mainslide2.png) no-repeat 100%;}
#container .main_slider .slide_bg li:nth-child(3){background: url(/images/kossa/main/mainslide3.png) no-repeat 100%;}
#container .main_slider .slide_bg li:nth-child(4){background: url(/images/kossa/main/mainslide4.png) no-repeat 100%;}
*/
#container .main_slider .slide_navi{position: absolute; height: 8px; width: 240px; left: 50%; transform: translateX(-50%); bottom: 30px; }
#bx-pager li {display: inline-block;background-color:#c3c3c0;width: 55px; height: 8px; overflow: hidden; margin-right: 2px;}
#bx-pager li a {text-decoration: none; background-color: #5E7074; width: 100%; height: 100%;display: block;}
#bx-pager li a.active{background-color: #f3aa36;}
/*
#container .main_slider .slide_navi>li{position: relative; width: 55px; height: 100%; background-color:#c3c3c0; display: inline-block; margin-right: 10px; clear: both;}
#container .main_slider .slide_navi>li:last-child{margin-right: 0px;}
#container .main_slider .slide_navi>li.on{background-color: #f3aa36; }
*/





/* quickWrap */
#container .quickWrap {width:100%; height: 145px; position:relative; margin-top: 10px; }
.quickWrap .search_box {float: left; width:275px; height:100%; background:#269267; padding-top:35px; padding-left: 30px; box-sizing: border-box; }
.quickWrap .search_box h3 {color:#fff; font-size:21px; line-height:25px; margin-bottom:15px;}
.quickWrap .search_box .search {overflow:hidden;}
.quickWrap .search_box .search .bg {float:left; width:180px; height:40px; padding:9px 7px 10px 0px; border:1px solid #f6f7f6; background:#fff url(/images/kossa/main/icon_search.png) 10px 10px no-repeat ; box-sizing: border-box;}
.quickWrap .search_box .search .bg input {border:none; font-size:14px; width:130px; margin-left:42px; padding-top:1px;}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */color:#333;}
::-moz-placeholder { /* Firefox 19+ */color:#333;}
:-ms-input-placeholder { /* IE 10+ */color:#333;}
:-moz-placeholder { /* Firefox 18- */color:#333;}
.quickWrap .search_box .search button {float:left; width:45px; height:41px; background:#157952; color:#fff;font-size: 11px;}

.quickWrap .quick_box {position: relative; width:635px; height:145px; background-color:#2ead7a; display: inline-block;}
.quickWrap .quick_box ul {width: 100%; height: 100%;}
.quickWrap .quick_box ul li {float:left; text-align:center;width: 90px;}
.quickWrap .quick_box ul li a {display:block; position:relative; width: 80px; height:40px; padding-top: 85px; margin:0px 5px 0 5px; color:#fff; font-size:14px; line-height:18px; cursor: pointer;}
.quickWrap .quick_box ul li a:before {content:""; background-image: url(/images/kossa/main/quick_bg.png); background-repeat:no-repeat; position:absolute; top:0px;}
.quickWrap .quick_box ul li.q1 a:before {width:80px; height:80px; background-position:0px 0px; left:-7px;}
.quickWrap .quick_box ul li.q2 a:before {width:80px; height:80px; background-position:-90px 0px; left:-7px;}
.quickWrap .quick_box ul li.q3 a:before {width:80px; height:80px; background-position:-180px 0px; left:-7px;}
.quickWrap .quick_box ul li.q4 a:before {width:80px; height:80px; background-position:-273px 0px; left:-7px;}
.quickWrap .quick_box ul li.q5 a:before {width:80px; height:80px; background-position:-362px 0px; left:-7px;}
.quickWrap .quick_box ul li.q6 a:before {width:80px; height:80px; background-position:-450px 0px; left:-7px;}
.quickWrap .quick_box ul li.q7 a:before {width:80px; height:80px; background-position:-543px 0px; left:-6px;}

.quickWrap .quick_box ul li a:hover{color:#17724e; text-decoration: none; font-weight: bold;}
.quickWrap .quick_box ul li a:hover:before{background-image: url(/images/kossa/main/quick_over.png)!important;}

.quickWrap .membership{width: 290px; float: right;height: 145px; position: relative; background-color: #538fb9; padding-top: 35px;padding-left: 30px; box-sizing: border-box; }
.quickWrap .membership h3 {color:#fff; font-size:21px; line-height:25px; margin-bottom:15px; }
.quickWrap .membership button{position: absolute; width: 70px;height: 22px; background-color: #256b9c; line-height: 22px; left: 177px; top: 36px;}
.quickWrap .membership button a{width: 100%; display: block; height: 100%; color: #fff;  font-size: 14px; }
.quickWrap .membership span{color: #26343e;}

/* baordWrap */
#container .baordWrap{ width: 100%; height:225px; border: 1px solid #d8dcde; margin-top: 10px; box-sizing: border-box;position: relative; }
.baordWrap>div{width: 303px; height: 100%; border-right: 1px solid #d8dcde;  padding: 18px; box-sizing: border-box; float: left;}
/*.baordWrap>div:nth-of-type(3){border-right: none;}*/
.baordWrap>div>.boardTitle{position: relative; width: 100%; height: 50px; padding-bottom: 10px;}
.baordWrap>div>.boardTitle>img{position: relative; float: left;}
.baordWrap>div>.boardTitle>span{position: relative; color: #333; font-size: 20px;margin-left: 5px; width: 140px; height: 30px; display: inline-block;padding-top: 15px; box-sizing: border-box; font-weight: bold; }
.baordWrap>div>.boardTitle>a{color: #808080; font-size: 12px; float: right; display: inline-block; position: relative; padding-top: 15px; height: 15px; }
.baordWrap>div>ul{width: 100%; font-size: 13px; line-height: 25px; letter-spacing: -1px;}
.baordWrap>div>ul>li>a{float: left; color:#5d5d5d; }
.baordWrap>div>ul>li>a:hover{color: #383838;}
.baordWrap>div>ul>li>a>span{display: block; width: 190px;  text-overflow: ellipsis; overflow: hidden;white-space: nowrap;}
.baordWrap>div>ul>li>span{float: right; font-size: 12px;}

.baordWrap .BannerSlider {width: 289px; height: 100%;  border-right: 0px; padding: 12px 14px; background-color: #b6d4de; position: relative;}
.baordWrap .BannerSlider>div{width: 260px;height: 100%; height: 197px; overflow: hidden;}
.baordWrap .BannerSlider .BannerSliderImg{width:780px; height: 100%; padding: 0px!important; }
.baordWrap .BannerSlider .BannerSliderImg>li{float: left; width:260px; height: 100%;margin-right:10px; }
.baordWrap .BannerSlider .BannerSliderImg>li img{width: 100%; height: 100%;}
.baordWrap .BannerSlider .SlideBar{position: absolute; width:79px;height:25px; right: 15px;top: 12px; border: 1px solid #e9e9e9; border-right: none;}
.baordWrap .BannerSlider .SlideBar ul li{float: left;border-right: 1px solid #e9e9e9;}

/*bxSlider 버튼*/
.bx-wrapper .bx-prev{background:url(/images/kossa/main/left_B.png) no-repeat ;position: absolute; top:0px; right: 50px; width: 27px; height: 25px;}
.bx-wrapper .bx-next{background:url(/images/kossa/main/right_B.png) no-repeat;position: absolute; top: 0px; right:0px;width: 25px; height: 25px;}
.bx-wrapper .bx-controls-auto{position: absolute; width:25px; height: 25px;  top:0px; right:25px; border-left:1px solid #e9e9e9; border-right:1px solid #e9e9e9;width: 25px; height: 25px;}
.bx-wrapper .bx-controls-auto .bx-start{background: url(/images/kossa/main/start_B.png) no-repeat ;position: absolute; top:0px; right: 0px;width: 25px; height: 25px;}
.bx-wrapper .bx-controls-auto .bx-stop{ background: url(/images/kossa/main/pause_B.png) no-repeat ;position: absolute; top:0px; right: 0px; width: 25px; height: 25px;}
/*//bxSlider*/



/***************** 
*	//container   *
******************/


/* 자동완성 */
.keyword1 {position:absolute; left:0; top:127px; border:1px solid #ccc; background:#fff; z-index:100; padding:4px 0 0 0; color:#cecece; display:none; width:241px; height:246px; overflow:auto; overflow-x:hidden;}
.keyword1 li a {display:block; height:24px; padding:0 0 0 9px; font-size:13px; color:#666; line-height:24px;}
.keyword1 li a:hover {background:#eff6fa; text-decoration:none;}
.keyword1 li a strong {color:#216e9e;}
.selected {background:#eff6fa; text-decoration:none; }


/* Bottom Banner */
.relationCop {width:100%; height:40px; padding:30px 0; background:#fff;}
.relationCop .cont {overflow:hidden;}
.relationCop h3 {float:left; width:125px; font-family: 'Nanum Barun Gothic', serif; font-weight:700; font-size:16px; line-height:50px; color:#333;}
.relationCop .slideZone {overflow:hidden; float:left; position:relative; width:990px; height:40px;}
.relationCop .slideZone li {position:absolute; left:0; top:0; width:89px; height:40px; padding:0px 10px; text-align:center; line-height:40px;}
.relationCop .slideZone li a {display:block;}
.relationCop .slideZone li img {max-width:89px;}
.relationCop .controlBox {overflow:hidden; position:absolute; right:0; top:7px;}
.relationCop .controlBox a {float:left; font-size:0; line-height:0; margin-left:3px}
.relationCop .controlBox .btnPlay {display:none;}







/* Bottom Banner */
.relationCop2 {background:#fff;}
.relationCop2 .cont {overflow:hidden;}
.relationCop2 .slideZone {overflow:hidden; float:left; position:relative; width:1000px; height:104px;}
.relationCop2 .slideZone li {position:absolute; left:0; top:0; width:500px; height:104px; text-align:center;}
.relationCop2 .slideZone li a {display:block;}
.relationCop2 .controlBox {overflow:hidden; position:absolute; right:0; top:7px;}
.relationCop2 .controlBox a {float:left; font-size:0; line-height:0; margin-left:3px}
.relationCop2 .controlBox .btnPlay {display:none;}

.relationCop2 .type_txt {overflow:hidden; height:104px; text-align:left;}
.relationCop2 .type_txt .img_area {float:left; width:150px; margin-right:20px;}
.relationCop2 .type_txt .img_area img {max-width:150px; max-height:104px;}
.relationCop2 .type_txt .txt_area {float:left; width:330px;}
.relationCop2 .type_txt .txt_area .tit strong {font-size:18px; line-height:18px; color:#216e9e !important;}
.relationCop2 .type_txt .txt_area .txt {margin-top:15px;}
.relationCop2 .type_txt .txt_area .txt a {color:#666;}
.relationCop2 .btn_go {position:absolute; left:170px; top:78px;}