@import url(common.css);

main{background: #fff;display: block;}
main section{display: flex;height: 100vh;overflow: hidden;width: 100%;min-width: 1500px;}

.fp-tableCell{vertical-align: bottom;}

@media screen and (max-width: 1500px) {
    
}

/* 사이드 퀵메뉴 */
#fp-nav.right{position:fixed;right: 0;top: 60%;transform: translateY(-50%);z-index: 150;}
#fp-nav ul li{height: 60px;width: 150px;margin: 0;margin-bottom: 8px;}
#fp-nav ul li:last-child{margin-bottom: 0;}
#fp-nav ul li a{line-height: 60px;color: #fff;font-size: 14px;display: block;position: relative;padding-left: 36px;width: 100%;height: 100%;background-color: rgba(4, 15, 33, .5);transition: background-color .4s;border-radius: 0;left: 0;top: 0;margin: 0;}
#fp-nav ul li a:before{content: '';width: 6px;height: 6px;background-color: #b5bdc0;position: absolute;left: 20px;top: 27px;border-radius: 50%;}
#fp-nav ul li a:hover{width: 100%;height: 100%;margin: 0;}
#fp-nav ul li a.active, #fp-nav ul li:hover a.active{position: relative;height: 100%;width: 100%;border-radius: 0;margin: 0;color: #111;background-color: #fff;border: 1px solid #ddd;}
#fp-nav ul li a.active:before{background-color: #f54305;}
#fp-nav ul li a:after{content: '';width: 100%;height: 100%;position: absolute;left: 0;top: 0;padding-left: 36px;}
#fp-nav ul li:first-child a:after{content: 'Main';}
/*#fp-nav ul li:nth-child(2) a:after{content: 'With KOCRC';}*/
#fp-nav ul li:nth-child(2) a:after{content: 'With KOCRC';} /*old KOCRC Service */
#fp-nav ul li:nth-child(3) a:after{content: 'KOCRC News';}
#fp-nav ul li:nth-child(3){margin-bottom: 0;}
#fp-nav ul li:nth-child(4){display: none;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{display: none;}

/* 컨텐츠공통 */
.main_title{text-align: center;margin: 38px 0 40px;}
.main_title h3{font-size: 18px;font-weight: 600;margin-bottom: 14px;}
.main_title p{font-size: 34px;line-height: 34px;color: #222;font-weight: 500;letter-spacing: -0.5px;}
.main_title p em{font-weight: 600;}
/* 탭메뉴 */
.tabM{margin-left: 20px;position: relative;display: flex;}
.tabM>li{margin-right: 1px;}
.tabM>li:last-child{margin-right:0;}
.tabM>li>a{display: block;color:#333;font-weight: 500;border:1px solid #ccc;border-bottom:0;background-color:#fff;padding: 9px 10px;text-align: center;transition: background .4s;}
.tabM>li.on>a{color:#e72e36;text-decoration: underline;position: relative;}
/* .tabM>li>a:before{content: '';width: 11px;height: 11px;position: absolute;left: 50%;bottom: -6px;margin-left:-5px;transform: rotate(45deg);transition:opacity .4s;transition-delay: .1s;opacity: 0;} */
/* .tabM>li.on>a:before{opacity: 1;} */
.tabM .tab_content{position: absolute;left:0;top:40px;width: 100%;display: none;}
.tabM .tab_content div:nth-child(n+5){margin-top: 15px;}
.tabM .tab_content div a{font-size: 14px;color:#333;padding-top:93px;position: relative;display: block;}
.tabM .tab_content div a:before{content: '';width: 88px;height: 88px;border-radius: 50%;background-color:#ddd;position: absolute;left:50%;top:0;margin-left: -44px;transition: background .4s;}
.tabM .tab_content div a:after{content: '';width: 76px;height: 76px;border-radius: 50%;background-color:#fff;position: absolute;left:50%;top:6px;margin-left: -38px;background-position: center;background-repeat: no-repeat;transition: background .4s;background-size: contain;}
.tabM .tab_content div a:hover:before, .tabM .tab_content div a:focus:before{background-color:#fff;border:2px solid #33b6ef;}
.tabM .tab_content div a:hover:after, .tabM .tab_content div a:focus:after{background-color:#33b6ef}
.tabM .tab_content.current{display: flex;flex-wrap: wrap;}

/* section1 Main */
.ctn01{background: url(../images/main/visual01.jpg)center top no-repeat;background-size: 1920px;}
.ctn01 .wrap{display: flex;justify-content: space-between;flex-direction: column;height: 100%;padding: 130px 0 60px 0;}
.ctn01 .top{padding-left: 60px;padding-top: 220px;}
.ctn01 .top .titleT{font-size: 25px;font-weight: 600;color: #002060;}
.ctn01 .top .title{font-size: 58px;font-weight: 600;color: #002060;}
.ctn01 .top strong{font-size: 37px;font-weight: 600;letter-spacing: -1px;color: #002060;text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);padding: 4px 0 18px;display: inline-block;}
.ctn01 .top p{font-size: 22px;color: #002060;line-height: 28px;}
.ctn01 .site_link{background: rgba(0, 0, 0, 0.6);padding: 25px 100px;border-radius: 15px;position: relative;}
.site_link .slick-arrow{position: absolute;top: 37px;width: 36px;height: 36px;background: url(../images/common/circle_arrow.png)center no-repeat;font-size: 0;line-height: 0;}
.site_link .slick-arrow.slick-prev{left: 34px;}
.site_link .slick-arrow.slick-next{right: 34px;transform: rotate(180deg);}
.site_link li{height: 60px;margin:0 10px;background-repeat: no-repeat;}
.site_link li a{line-height: 0;font-size: 0;}


/* section2 With KEWIC */
/* section2 With KEWIC */

/* section3 KEWIC Service */
/*.ctn03{background: url(../images/main/ctn03_bg.jpg)center top no-repeat;background-size: 1920px;color: #000;}*/

.ctn03 .wrap{padding: 0 0 30px 0;}
.ctn03 .main_title h3{font-size: 0;line-height: 0;text-indent: -9999px;background: url(../images/main/ctn_ico2.png)center no-repeat;width: 236px;height: 32px;margin: 0 auto 20px;}
.ctn03 .main_title p{color: #404040;}
.ctn03 .main_title .tit01{font-weight: 600;color: #00a63a;}
.ctn03 .main_title .tit02{font-weight: 600;color: #eb7f13;}

.ctn03 .wrap{display: flex;justify-content: space-between;flex-direction: column;height: 100%;padding: 130px 0 300px 0;}
.ctn03 .main_title h3{color: #0000FF;}
.ctn03 .main_title p{color: #000;}
.ctn03 .main_title p em{color: #FF8C00;}
/* KEWIC서비스영역 */
.ctn03 .kewic_service01{display: flex;}
.ctn03 .kewic_service01 li{width: calc(25% - 22.5px);height: 335px; margin-right: 30px;display: flex;flex-direction: column;padding-top: 160px;}
.ctn03 .kewic_service01 li:hover .more{border: 1px solid #eb7f13;background-color: #eb7f13;}
.ctn03 .kewic_service01 li:last-child{margin-right: 0;}
.ctn03 .kewic_service01 .service_01{background: url(../images/main/service_bg01.jpg)left top no-repeat;}
.ctn03 .kewic_service01 .service_02{background: url(../images/main/service_bg02.jpg)left top no-repeat;}
.ctn03 .kewic_service01 .service_03{background: url(../images/main/service_bg03.jpg)left top no-repeat;}
.ctn03 .kewic_service01 .service_04{background: url(../images/main/service_bg04.jpg)left top no-repeat;}
.ctn03 .kewic_service01 .title{font-size: 18px;font-weight: 500;margin:20px 0 10px;}
.ctn03 .kewic_service01 .text{font-size: 13px;line-height: 1.4em;display: block;margin-bottom: 22px;}
.ctn03 .kewic_service01 .more{display: inline-block;width: 120px;border: 1px solid #000;text-align: center;min-height: 36px;line-height: 36px;font-size: 13px;color: #000;transition: all .4s;}
/* section3 KEWIC Service */

/* section4 KEWIC News */
.ctn04{background: #f2f2f2 url(../images/main/ctn04_bg01.png)center top no-repeat;;flex-direction: column;justify-content: space-between;padding:0;}
.ctn04 .main_title h3{color: #ed1b24;}
.ctn04 .main_title p em{color: #0c6de5;}
/* 다양한 소식 탭메뉴 */
.ctn04 .top{height: 100%;min-height: 440px;max-height: 440px;}
.ctn04 .board{margin-left: 0;}
.ctn04 .board>li{margin-right: 20px;margin-left: 20px;}
.ctn04 .board>li:first-child{margin-left: 0;}
.ctn04 .board>li>a{text-align: left;background: none;border: none;color: #222;font-size: 18px;padding: 0;position: relative;}
.ctn04 .board>li.on>a{color: #e72e36;}
.ctn04 .board>li>a:after{content: '';width: 3px;height: 3px;position: absolute;right: -19px;top: 8px;background-color: #e72e36;}
.ctn04 .board>li:last-child>a:after{display: none;}
.ctn04 .board .tab_content.current{flex-wrap: nowrap;}
.ctn04 .board .tab_content article{width: calc(25% - 30px);margin-right: 40px;background: #fff;border-radius: 10px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);height: 350px;position: relative;}
.ctn04 .board .tab_content article:last-child{margin-right: 0;}
.ctn04 .board .tab_content article:before{content: attr(data-name);display: inline-block;width: 76px;height: 30px;line-height: 30px;text-align: center;font-weight: 500;color: #fff;border-radius: 15px;position: absolute;top: 30px;left: 40px;}
.ctn04 .board article[data-name="공지사항"]:before{background-color: #e5840c;}
.ctn04 .board article[data-name="조합동향"]:before{background-color: #9044cb;}
.ctn04 .board article a{display: flex;height: 100%;padding: 30px 40px 45px;flex-direction: column;border-radius: 10px;overflow: hidden;transition: box-shadow .2s;}
.ctn04 .board article a:hover{box-shadow: 0 0 0 3px #e72e36 inset;}
.ctn04 .board article h4{padding: 48px 0 28px;font-size: 18px;letter-spacing: -0.8px;font-weight: 400;}
.ctn04 .board article .text{padding-top: 28px;border-top: 2px solid #000;color: #555;}
.ctn04 .board article .date{color: #555;margin-top: auto;}
.ctn04 .board article a.img_board{padding: 0 0 45px;}
.ctn04 .board article .img_board h4{padding: 18px 40px 28px;}
.ctn04 .board article .img_board .date{padding: 0 40px;}
.ctn04 .board article .img_board img{border-radius: 10px 10px 0 0;width: 100%;height: 190px;transition: border .2s;}
.ctn04 .board article a.img_board:hover img{border: 3px solid #e72e36;border-bottom: 0;}
.ctn04 .board article .img_board:hover h4{padding: 18px 40px 26px;}

/* 재활용실적 == 20230829 추가 메인페이지 재활용 실적을 위해서 */
.ctn04 .purchase{width: 800px;margin-left:500px;color: #fff;}
.ctn04 .purchase_inner{padding: 30px 40px 0;height: 370px; background: #292828;}
.ctn04 .purchase_inner .title{font-size: 22px;font-weight: 600;letter-spacing: -0.5px;padding-bottom: 14px;}
.ctn04 .purchase_inner .title span{color: #2a9ff9;}
.ctn04 .purchase_inner>div{display: flex;flex-direction: column;align-items: flex-end;position: relative;}
.ctn04 .purchase_inner>div .text{position: absolute;top: -40px;right: 0;}
.ctn04 .purchase .purchase_t{margin-bottom: 10px;}
.ctn04 .purchase .purchase_t th{height: 52px;background: #f7f7f7;color: #222;font-size: 15px;letter-spacing: -0.5px;border: 5px solid #292828;}
.ctn04 .purchase .purchase_t th:first-child{border-left: none;}
.ctn04 .purchase .purchase_t th:last-child,.ctn04 .purchase .purchase_t td:last-child{border-right: none;}
.ctn04 .purchase .purchase_t thead th{border-top: none;}
.ctn04 .purchase .purchase_t tr:last-child th, .ctn04 .purchase .purchase_t tr:last-child td{border-bottom: none;}
.ctn04 .purchase .purchase_t td{height: 42.5px;background: #484848;font-size: 15px;letter-spacing: -0.5px;text-align: center;border: 5px solid #292828;}
.ctn04 .purchase .more{height: 50px;background: #ed1b24;color: #fff;display: block;text-align: center;line-height: 50px;font-size: 20px;}

/* 유관기관 */
.ctn04 .btm{background: url(../images/main/ctn04_bg02.jpg)center top no-repeat;padding:38px 0 60px;}
.ctn04 .btm h4{font-size: 26px;color: #fff;margin-bottom: 24px;}
.interagency .slick-arrow{position: absolute;top: -60px;width: 36px;height: 36px;background: url(../images/common/circle_arrow.png)center no-repeat;font-size: 0;line-height: 0;}
.interagency .slick-arrow.slick-prev{right: 45px;}
.interagency .slick-arrow.slick-next{right: 0;transform: rotate(180deg);}
.interagency li{height: 70px;background-repeat: no-repeat;margin:0 6px;}
.interagency li a{font-size: 0;line-height: 0;}
.interagency .site01{background-image: url(../images/main/org_banner01.jpg);}
.interagency .site02{background-image: url(../images/main/org_banner02.jpg);}
.interagency .site03{background-image: url(../images/main/org_banner03.jpg);}
.interagency .site04{background-image: url(../images/main/org_banner04.jpg);}
.interagency .site05{background-image: url(../images/main/org_banner05.jpg);}
.interagency .site06{background-image: url(../images/main/org_banner06.jpg);}
.interagency .site07{background-image: url(../images/main/org_banner07.jpg);}
.interagency .site08{background-image: url(../images/main/org_banner08.jpg);}
.interagency .site09{background-image: url(../images/main/org_banner02.jpg);}

/* 230830 섹션 추가 kocrc news */
.ctn_new23 .wrap{padding: 0 0 30px 0;}
.ctn_new23 .main_title h3{font-size: 0;line-height: 0;text-indent: -9999px;background: url(../images/main/ctn_ico.png)center no-repeat;width: 236px;height: 32px;margin: 0 auto 20px;}
.ctn_new23 .main_title p{color: #404040;}
.ctn_new23 .main_title .tit01{font-weight: 600;color: #00a63a;}
.ctn_new23 .main_title .tit02{font-weight: 600;color: #eb7f13;}
.ctn_new23 .top{display: flex;justify-content: space-between;}
.ctn_new23 .top .titleA{margin-bottom:0px; text-align: center;font-size: 28px;color: #fff;font-weight: 600;line-height: 58px;}
.ctn_new23 .btm{margin-top: 25px;display: flex;justify-content: space-between;}
.ctn_new23 .btm .link_list{width: calc((100% - 90px) / 3);height: 88px;}
.ctn_new23 .btm .link_list a{display: block;width: 100%;height: 100%;font-size: 0;line-height: 0;text-indent: -9999px;border-radius: 14px;background-position: center;background-repeat: no-repeat;background-size: contain;}
.ctn_new23 .btm .link_list.list01 a{background-image: url(../images/main/banner_img01.jpg);}
.ctn_new23 .btm .link_list.list02 a{background-image: url(../images/main/banner_img02.jpg);}
.ctn_new23 .btm .link_list.list03 a{background-image: url(../images/main/banner_img03.jpg);}

.ctn_new23 .ctn_slide{width: calc((100% - 90px) / 3);position: relative;height: 100%;padding: 0 10px 45px;}
.ctn_new23 .ctn_slide li{height: calc(100% - 50px);}
.ctn_new23 .ctn_slide li .inner{padding: 30px;width: 100%;height: 400px!important;background: #fff;display: inline-block;}
.ctn_new23 .ctn_slide img{width: 100%;max-width: 100%;max-height: 200px;min-height: 100px;}
.ctn_new23 .ctn_slide .control{position: absolute;bottom: 0;left: 0;height: 45px;width: 100%;}
.ctn_new23 .ctn_slide .control .cur_paging{color: #fff;line-height: 20px;display: inline-block;padding-top: 12px;padding-left: 30px;font-size: 18px;font-weight: 600;}
.ctn_new23 .ctn_slide .control .ctr_btn{width: 20px;height: 20px;font-size: 0;line-height: 0;position: absolute;right:54px;top:12px;background-image: url(../images/common/ctr_btn.png);background-repeat: no-repeat;}
.ctn_new23 .ctn_slide .control .ctr_btn.pause{background-position: right center;}
.ctn_new23 .ctn_slide .control .ctr_btn.play{background-position:  left center;}
.ctn_new23 .ctn_slide .slick-arrow{font-size: 0;line-height: 0;position: absolute;bottom: 13px;width: 20px;height: 20px;background-image: url(../images/common/ctr_arrow.png);background-repeat: no-repeat;z-index: 1;}
.ctn_new23 .ctn_slide .slick-arrow.prev_btn{right: 84px;}
.ctn_new23 .ctn_slide .slick-arrow.next_btn{right: 24px;transform: rotate(180deg);}
.ctn_new23 .ctn_slide .title{font-size: 17px;font-weight: 600;line-height: 52px;color: #fff;text-align: center;padding: 0 10px;margin-bottom: 10px;}
.ctn_new23 .ctn_slide .title .ellipsis1{max-width: 100%;}
.ctn_new23 .ctn_slide .text{font-size: 16px!important;line-height: 1.6!important;color: #222;word-break: normal;height: calc(100% - 120px);overflow: hidden;padding: 16px 8px 0;}
.ctn_new23 .ctn_slide .down{display: block;background: #f2f2f2;height: 50px;padding: 16px 10px 16px 45px;position: relative;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;overflow: hidden;}
.ctn_new23 .ctn_slide .down:before{content: '';background: url(../images/main/down_ico.png)left center no-repeat;width: 20px;height: 17px;position: absolute;left: 14px;}
.ctn_new23 .ctn_slide .down:hover{color: #ed1b24;text-decoration: underline;}
.ctn_new23 .ctn_slide .date{text-align: right;font-size: 15px;padding-top: 8px;}
.ctn_new23 .ctn_slide .slick-list, .ctn_new23 .ctn_slide .slick-track, .ctn_new23  .ctn_slide .slick-track div, .ctn_new23  .ctn_slide .slick-slider{height: 100%;}
.ctn_new23 .ctn_slide li{background-position:top center;background-repeat: no-repeat;}

.ctn_new23 .ctn_slide.notice,.ctn_new23 .ctn_slide.notice .title{background: #002060;}
.ctn_new23 .ctn_slide.trends,.ctn_new23 .ctn_slide.trends .title{background: #00a63a;}
.ctn_new23 .ctn_slide.recycle,.ctn_new23 .ctn_slide.recycle .title{background: #eb7f13;}

.ctn_new23 .ctn_slide.trends .text{text-align: center;height: auto;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;/* 라인수 */-webkit-box-orient: vertical;line-height: 1.6em!important;max-height: calc(3.2em + 16px);}
.ctn_new23 .ctn_slide.trends li>div{padding: 30px 30px 15px;}
.ctn_new23 .ctn_slide table{border-top: 2px solid #676767;border-bottom: 2px solid #676767;font-size: 14px;color: #404040;}
.ctn_new23 .ctn_slide table th{background: #fdf3ed;text-align: center;font-weight: 400;border-top: 1px solid #b3b3b3;padding: 8px 10px 7px;}
.ctn_new23 .ctn_slide table th:not(:first-child){border-left: 1px solid #b3b3b3;}
.ctn_new23 .ctn_slide table thead th{font-weight: 600;}
.ctn_new23 .ctn_slide table thead tr:first-child th{border-top: 0;}
.ctn_new23 .ctn_slide table td{text-align: center;border-top: 1px solid #b3b3b3;}
.ctn_new23 .ctn_slide table td:not(:first-child){border-left: 1px solid #b3b3b3;}
.ctn_new23 .ctn_slide table .bl{border-left: 1px solid #b3b3b3;}