@charset "utf-8";

/* 
 * Main CSS Document 
 */

/* 스프라이트 이미지 */
.sprh_main,
.main_wrap .ctg_area h2:after,
.main_wrap .popupzone .bx-controls a,
.main_wrap .spotzone .bx-controls a,
.main_wrap .spotzone .more a,
.main_wrap .spotzone .member_info li a:before,
.main_wrap .news_area .bx-controls a:after,
.main_wrap .section04 .banzone .bx-controls a,
.main_wrap .section04 .banzone .more a{display:inline-block; overflow:hidden; background:url(../images/main/sp_main.png) no-repeat 0 0; vertical-align:middle; text-indent:-9999em;}

#container{padding:0;}
/* 팝업존 */
.main_wrap .section01{background:#fff;}
.main_wrap .section01:after{content:''; display:block; clear:both;}
.main_wrap .popupzone{float:left; position:relative; width:620px; height:460px;}
.main_wrap .popupzone .bx-controls a{position:absolute; z-index:20;}
.main_wrap .popupzone .bx-controls a.bx-prev{top:50%; left:0; width:50px; height:93px; margin-top:-47px; background-position:0 -230px;}
.main_wrap .popupzone .bx-controls a.bx-next{top:50%; right:0; width:50px; height:93px; margin-top:-47px; background-position:-60px -230px;}
.main_wrap .popupzone .bx-controls a.bx-start{bottom:30px; left:30px; width:29px; height:29px; background-position:-190px -230px;}
.main_wrap .popupzone .bx-controls a.bx-stop{bottom:30px; left:30px; width:29px; height:29px; background-position:-160px -230px;}
/* 스팟존 */
.main_wrap .spotzone{float:left; position:relative; width:380px; height:460px;}
.main_wrap .spotzone h2{margin:30px 0 0; font-size:1.85em; text-align:center; letter-spacing:-1px;}
.main_wrap .spotzone h2+p{margin:10px 0 0; font-size:1.39em; text-align:center; color:#596982; letter-spacing:-1px;}
.main_wrap .spotzone h2+p strong{font-size:1.67em; color:#f35353; vertical-align:sub;}
.main_wrap .spotzone .lst_wrap{position:relative; width:310px; margin:30px auto 0;}
.main_wrap .spotzone .lst .item a{display:block; width:310px; text-align:center;}
.main_wrap .spotzone .lst .item .img{display:block; position:relative; overflow:hidden; width:180px; height:180px; margin:0 auto; border-radius:50%; text-align:center;}
.main_wrap .spotzone .lst .item .img span{position:absolute; top:0; left:50%; width:500px; height:179px; margin-left:-250px; text-align:center;}
.main_wrap .spotzone .lst .item .img img{max-height:100%;}
.main_wrap .spotzone .lst .item .txt{display:block; margin:10px 0 0; font-size:1.08em; text-decoration:underline;}
.main_wrap .spotzone .bx-controls a{position:absolute; z-index:20;}
.main_wrap .spotzone .bx-controls a.bx-prev{top:75px; left:0; width:18px; height:35px; background-position:-120px -230px;}
.main_wrap .spotzone .bx-controls a.bx-next{top:75px; right:0; width:18px; height:35px; background-position:-140px -230px;}
.main_wrap .spotzone .bx-controls a.bx-start{bottom:-38px; left:50px; width:29px; height:29px; background-position:-190px -230px;}
.main_wrap .spotzone .bx-controls a.bx-stop{bottom:-38px; left:50px; width:29px; height:29px; background-position:-160px -230px;}
.main_wrap .spotzone .bx-pager{position:absolute; bottom:-30px; left:130px;}
.main_wrap .spotzone .bx-pager *{float:left;}
.main_wrap .spotzone .bx-pager .bx-pager-link{position:relative; width:10px; height:10px; margin:0 5px 0 0; border-radius:50%; background:#ccc;}
.main_wrap .spotzone .bx-pager .bx-pager-link.active{background:#83c21e;}
.main_wrap .spotzone .more{position:absolute; bottom:-38px; left:85px;}
.main_wrap .spotzone .more a{background-position:-220px -230px; width:29px; height:29px;}
.main_wrap .spotzone .member_info{position:absolute; bottom:0; left:0; width:100%;}
.main_wrap .spotzone .member_info li{float:left; width:50%;}
.main_wrap .spotzone .member_info li a{display:block; height:64px; line-height:64px; background:#596982; font-weight:bold; font-size:1.08em; color:#fff; text-align:center;}
.main_wrap .spotzone .member_info li a:before{content:''; display:inline-block; width:29px; height:35px; margin:0 10px 0 0; background-position:0 -100px;}
.main_wrap .spotzone .member_info li+li a{background:#ebedef; color:#888;}
.main_wrap .spotzone .member_info li+li a:before{width:35px; height:30px; background-position:-40px -100px;}
/* 뉴스존 */
.main_wrap .news_area .notice,
.main_wrap .news_area .member{position:relative;}
.main_wrap .news_area{clear:both; height:64px; background:#666; color:#fff;}
.main_wrap .news_area:after{content:''; display:block; clear:both;}
.main_wrap .news_area .notice{float:left; width:50%;}
.main_wrap .news_area .member{float:right; width:50%;}
.main_wrap .news_area>div h2{float:left; height:27px; margin:15px 0 0 10px; padding:0 5px; border-radius:10px; background:#545353; font-size:1.385em; line-height:27px; color:#fff; letter-spacing:-1px;}
.main_wrap .news_area .lst_area{float:left; width:320px; margin:15px 0 0 5px;}
.main_wrap .news_area .lst_area .item{height:27px; line-height:27px;}
.main_wrap .news_area .lst_area a{display:inline-block; overflow:hidden; width:240px; color:#fff; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}
.main_wrap .news_area .lst_area .date{display:inline-block; margin:0 0 0 10px; vertical-align:middle;}
.main_wrap .news_area .bx-controls a{display:inline-block; position:absolute; top:20px; overflow:hidden; width:24px; height:21px; border-left:1px solid #828282; text-indent:-9999em;}
.main_wrap .news_area .bx-controls a.bx-prev{right:53px;}
.main_wrap .news_area .bx-controls a.bx-next{right:5px;}
.main_wrap .news_area .bx-controls a.bx-start{right:29px;}
.main_wrap .news_area .bx-controls a.bx-stop{right:29px;}
.main_wrap .news_area .bx-controls a:after{content:''; position:absolute; top:50%; left:50%; margin:-7px 0 0 -4px;}
.main_wrap .news_area .bx-controls a.bx-prev:after{width:7px; height:13px; background-position:-120px -270px;}
.main_wrap .news_area .bx-controls a.bx-next:after{width:7px; height:13px; background-position:-130px -270px;}
.main_wrap .news_area .bx-controls a.bx-start:after{width:7px; height:13px; background-position:-150px -270px;}
.main_wrap .news_area .bx-controls a.bx-stop:after{width:8px; height:13px; background-position:-140px -270px;}
/* 조합원 영업점 카테고리 */
.main_wrap .ctg_area{height:151px; margin:50px 0 0; background:url(../images/main/bg_ctg.jpg) no-repeat 0 0;}
.main_wrap .ctg_area:after{content:''; display:block; clear:both;}
.main_wrap .ctg_area h2{overflow:hidden; float:left; position:relative; width:169px; height:114px; margin:20px 0 0 25px; border-radius:50%; background:rgba(29,44,67,.55); text-indent:-9999em;}
.main_wrap .ctg_area h2:after{content:''; position:absolute; top:50%; left:50%; width:113px; height:70px; margin:-35px 0 0 -56px; background-position:0 -150px;}
.main_wrap .ctg_area .lst{float:left; margin:30px 0 0 10px;}
.main_wrap .ctg_area .lst li{float:left; width:110px;}
.main_wrap .ctg_area .lst li a{display:block; text-align:center; color:#fff;}
.main_wrap .ctg_area .lst li .ico{width:72px; height:72px;}
.main_wrap .ctg_area .lst li.car .ico{background-position:0 0;}
.main_wrap .ctg_area .lst li.mar .ico{background-position:-100px 0;}
.main_wrap .ctg_area .lst li.mus .ico{background-position:-200px 0;}
.main_wrap .ctg_area .lst li.pri .ico{background-position:-300px 0;}
.main_wrap .ctg_area .lst li.edu .ico{background-position:-400px 0;}
.main_wrap .ctg_area .lst li.fod .ico{background-position:-500px 0;}
.main_wrap .ctg_area .lst li.etc .ico{background-position:-600px 0;}
.main_wrap .ctg_area .lst li .tit{display:block; margin:8px 0 0; font-weight:bold; font-size:1.08em; white-space:nowrap;}
/* 샵리스트 */
.main_wrap .lst_shop{overflow:hidden; margin:53px 0 30px -20px;}
.main_wrap .lst_shop:after{content:''; display:block; clear:both;}
.main_wrap .lst_shop>li{float:left; position:relative; box-sizing:border-box; width:235px; height:320px; margin:0 0 25px 20px; border:1px solid #d8d8d8; background:#fff;}
.main_wrap .lst_shop>li dt{position:absolute; top:-9999em; white-space:nowrap;}
.main_wrap .lst_shop>li .ctg dd{position:absolute; top:139px; left:-1px; z-index:10; height:20px; padding:0 5px; background:#333; font-size:0.85em; line-height:20px; color:#fff;}
.main_wrap .lst_shop>li .ctg_car dd{background:#52940d;}
.main_wrap .lst_shop>li .ctg_mak dd{background:#fc8513;}
.main_wrap .lst_shop>li .ctg_mus dd{background:#3270a9;}
.main_wrap .lst_shop>li .ctg_pri dd{background:#9057c6;}
.main_wrap .lst_shop>li .ctg_edu dd{background:#b83c65;}
.main_wrap .lst_shop>li .ctg_foo dd{background:#a9900c;}
.main_wrap .lst_shop>li .ctg_etc dd{background:#714435;}
.main_wrap .lst_shop>li .photo{margin:-1px -1px 0; border-top:3px solid #4c4c4c;}
.main_wrap .lst_shop>li .photo dd{position:relative; overflow:hidden; height:157px; background:#4c4c4c;}
.main_wrap .lst_shop>li .photo dd span{position:absolute; top:0; left:50%; width:600px; height:100%; margin-left:-300px; text-align:center;}
.main_wrap .lst_shop>li .photo dd span img{height:100%; max-height:100%;}
.main_wrap .lst_shop>li .tit dd{overflow:hidden; margin:12px 15px 5px;font-weight:bold; font-size:1.231em; white-space:nowrap; text-overflow:ellipsis;}
.main_wrap .lst_shop>li .desc dd{overflow:hidden; height:36px; margin:0 15px 0; line-height:18px;}
.main_wrap .lst_shop>li .tel dd{margin:5px 15px 0;}
.main_wrap .lst_shop>li .btn{position:absolute; left:0; bottom:0; width:100%;}
.main_wrap .lst_shop>li .btn dd{float:left; position:relative; width:50%; height:46px; background:#f7f6f6; font-weight:bold; font-size:1.08em; line-height:46px; text-align:center;}
.main_wrap .lst_shop>li .btn dd:before{content:''; display:inline-block; position:absolute; top:0; left:-1px; width:1px; height:100%; background:#d8d8d8;}
.main_wrap .lst_shop>li .btn dd a{display:block; position:relative; z-index:10;}
.main_wrap .lst_shop>li .btn dd a:before{content:''; display:inline-block; margin-right: 5px; background:url(../images/common/sp_com.png) no-repeat 0 0; vertical-align: middle;}
.main_wrap .lst_shop>li .btn dd.btn_view a:before{width: 14px; height: 17px; background-position: 0 -100px;}
.main_wrap .lst_shop>li .btn dd.btn_map a:before{width: 14px; height: 17px; background-position: -20px -100px;}
/* 관련사이트 */
.main_wrap .section04{position:relative; margin:0 0 50px; border:1px solid #d8d8d8; background:#fff;}
.main_wrap .section04 h2{padding:10px 0 10px 20px; border-bottom:1px solid #d8d8d8; font-size:1.69em;}
.main_wrap .section04 .banzone{}
.main_wrap .section04 .banzone .lst:after{content:''; display:block; clear:both;}
.main_wrap .section04 .banzone .lst>li:before{content:''; display:inline-block; position:absolute; top:50%; left:-1px; width:1px; height:25px; margin-top:-13px; background:#d8d8d8;}
.main_wrap .section04 .banzone .bx-controls a{position:absolute; z-index:20;}
.main_wrap .section04 .banzone .bx-controls a.bx-prev{top:80px; left:10px; width:18px; height:35px; background-position:-120px -230px;}
.main_wrap .section04 .banzone .bx-controls a.bx-next{top:80px; right:10px; width:18px; height:35px; background-position:-140px -230px;}
.main_wrap .section04 .banzone .bx-controls a.bx-start{top:8px; right:54px; width:29px; height:29px; background-position:-190px -230px;}
.main_wrap .section04 .banzone .bx-controls a.bx-stop{top:8px; right:54px; width:29px; height:29px; background-position:-160px -230px;}
.main_wrap .section04 .banzone .more{position:absolute; top:8px; right:20px;}
.main_wrap .section04 .banzone .more a{width:29px; height:29px; background-position:-220px -230px;}