﻿
.imgMax{max-width:100%; margin:0 auto; display:block;}

.bankList ul:after{content:''; display:block; visibility:hidden; clear:both;}
.bankList ul li{float:left;}

.faqTitle{max-width:100%; margin:0 auto; display:block;}

.reList01 li{ padding:5px 0 0px 0; border-top:1px dotted #ccc; position:relative;}
.reList01 li:first-of-type{ border-top:none; margin-top:50px;}
.reList01 li .reNum{ position:absolute; top:30px; left:20px; display:inline-block; background:#eb8017; color:#fff; border-radius:50%; text-align:center; font-weight:bold;}

/*ALL Using CSS*/
@media screen and (max-width:767px) {   
    .bankList ul {width:100%;}
    .bankList ul li{width:25%; padding:3px; box-sizing:border-box;}
    .bankList ul li a{border-radius:10px; border:1px solid #eee; display:block; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1); box-sizing:border-box; padding:10px 0px; text-align:center; font-size:14px; font-weight:bold; }
    .bankList ul li a:hover, .bankList ul li a.active{background:#dce9f3 }
    .bankList ul li a img{width:50%; display:block; margin:0 auto 5px auto;}
    
    .resourcesSearch:after{content:''; display:block; visibility:hidden; clear:both;}
    .resourcesSearch{width:100%; margin:25px auto; height:42px; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15); vertical-align:top;}
    .resourcesSearch input{width: calc(100% - 40px); border:none; float:left; line-height:40px; padding-left:10px; box-sizing:border-box; font-size:16px;}
    .resourcesSearch a{display:inline-block; float:left; padding:10px;}
    .resourcesSearch a img{width:20px;}
    
    .faqList ul li  {margin-bottom:10px; border:1px solid #eee; border-radius:15px; }
    .faqList ul li.active { background:url(/images/23resources/ans.png) no-repeat right -10px bottom -5px; box-shadow:#ccc 3px 3px 10px; background-size:100px; }
    .faqList ul li > a {display:block; padding:10px 35px 10px 35px; font-size:16px; line-height:24px; background:url(/images/23resources/faqQ.png),url(/images/23resources/option1.png); background-repeat:no-repeat; background-position: 12px 13px, 97% 14px; font-weight:bold; background-size:17px;}
    .faqList ul li.active > a{ background:url(/images/23resources/faqQ.png),url(/images/23resources/X.png);  background-repeat:no-repeat; background-position: 12px 13px, 97% 14px; background-size:17px;}
    .faqList ul li .answer { display:none; padding:0px 20px 50px 35px; line-height:22px; font-size:14px; background:url(/images/23resources/faqA.png) no-repeat 12px 3px; background-size:17px;}
    
    .reList01 li .reNum{ width:25px; line-height:25px; font-size:18px; top:20px;}
    .reList01 li img{ margin: 0 auto; max-width:100%; width:230px; display:block;}
    .reList01 li article h5{ color:#eb8017; font-size:20px; line-height:28px; font-weight:bold; margin-bottom: 10px; text-align:center; }
    .reList01 li article p{ line-height:21px; font-size:15px; padding-bottom:5px; text-align: center;}
    /*순환원리*/

    .grayBox2Img{display: grid; padding: 20px;}
    .grayBox2Img img{margin: 0 auto 15px auto; width: calc(100% - 50px);}
    .grayBox2Img div> ul{margin-top: 20px; padding-left: 0 !important;}
    .grayBox2Img div> ul> li{font-size: 16px; line-height: 22px;}
    .grayBox2Img .imgW{width: 175px;}
    /*환경오염방지*/

    .reList02 h5{margin: 0 0 20px 0 !important;}
    .reList02 li article p span{font-weight: bold; display: block; margin-bottom: 5px; font-size: 18px;}
    /*폐기물관리*/

    .h3Ma{margin-bottom: -20px !important;}
    /*자료실*/

    .reList01_m> li{margin-top: 0 !important;}
    /*자원순환센터 필요성*/

    .emiSBox{display: grid; grid-template-columns: 100%; padding-left: 0 !important;}
    .emiSBox> li{padding-left: 0 !important; background: none !important; text-align: center;}
    .emiSBox> li img{max-width: 350px; width: 100%;}
    /*배출기준*/
}
/*mobile*/

@media screen and (min-width:768px) and (max-width:1240px) { 
    .bankList ul {width:720px; margin:0 auto;}
    .bankList ul li{width:20%; padding:10px; box-sizing:border-box;}
    .bankList ul li a{border-radius:15px; border:1px solid #eee; display:block; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1); box-sizing:border-box; padding:20px 10px; text-align:center; font-size:18px; font-weight:bold; }
    .bankList ul li a:hover, .bankList ul li a.active{background:#dce9f3 }
    .bankList ul li a img{width:65px; display:block; margin:0 auto 10px auto;}
    
    .resourcesSearch:after{content:''; display:block; visibility:hidden; clear:both;}
    .resourcesSearch{width:700px; margin:35px auto; height:62px; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15); vertical-align:top;}
    .resourcesSearch input{width: calc(100% - 68px); border:none; float:left; line-height:60px; padding-left:25px; box-sizing:border-box; font-size:20px;}
    .resourcesSearch a{display:inline-block; float:left; padding:18px;}
    
    
    .faqList ul li  {margin-bottom:17px; border:1px solid #eee; border-radius:20px; }
    .faqList ul li.active { background:url(/images/23resources/ans.png) no-repeat right -23px bottom -15px; box-shadow:#ccc 3px 3px 10px; background-size:150px; }
    .faqList ul li > a {display:block; padding:20px 65px 20px 65px; font-size:18px; line-height:30px; background:url(/images/23resources/faqQ.png),url(/images/23resources/option1.png); background-repeat:no-repeat; background-position: 30px 22px, 98% 23px; font-weight:bold;}
    .faqList ul li.active > a{ background:url(/images/23resources/faqQ.png),url(/images/23resources/X.png);  background-repeat:no-repeat; background-position: 30px 22px, 98% 23px; }
    .faqList ul li .answer { display:none; padding:5px 80px 30px 65px; line-height:30px; font-size:17px; background:url(/images/23resources/faqA.png) no-repeat 30px 12px; }
    
    .reList01 li .reNum{ width:25px; line-height:25px; font-size:18px; top:20px;}
    .reList01 li img{ margin: 0 auto; max-width:100%; width:230px; display:block;}
    .reList01 li article h5{ color:#eb8017; font-size:20px; line-height:28px; font-weight:bold; margin-bottom: 10px; text-align:center; }
    .reList01 li article p{ line-height:21px; font-size:15px; padding-bottom:5px; text-align: center;}
    /*순환원리*/

    .grayBox2Img{display: grid;}
    .grayBox2Img img{margin: 0 auto 25px auto;}
    .grayBox2Img div> ul{margin-top: 20px; padding-left: 0 !important;}
    .grayBox2Img div> ul> li{font-size: 16px; line-height: 22px;}
    /*환경오염방지*/

    .reList02 h5{margin: 0 0 20px 0 !important;}
    .reList02 li article p span{font-weight: bold; display: block; margin-bottom: 5px; font-size: 18px;}
    /*폐기물관리*/

    .h3Ma{margin-bottom: -30px !important;}
    /*자료실*/

    .reList01_m> li{margin-top: 0 !important;}
    /*자원순환센터 필요성*/

    .emiSBox{display: grid; grid-template-columns: 50% 50%; padding-left: 0 !important;}
    .emiSBox> li{padding-left: 0 !important; background: none !important; text-align: center;}
    .emiSBox> li img{width: 100%;}
    .emiSBox> li:nth-child(3), .emiSBox> li:nth-child(4),.emiSBox> li:nth-child(5), .emiSBox> li:nth-child(6){margin-top: 10px}
    /*배출기준*/
}
/*tablet*/
@media screen and (min-width:1241px) { 
        
    .bankList ul {width:950px; margin:0 auto;}
    .bankList ul li{width:20%; padding:10px; box-sizing:border-box;}
    .bankList ul li a{border-radius:15px; border:1px solid #eee; display:block; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1); box-sizing:border-box; padding:20px 10px; text-align:center; font-size:18px; font-weight:bold; }
    .bankList ul li a:hover, .bankList ul li a.active{background:#dce9f3 }
    .bankList ul li a img{width:65px; display:block; margin:0 auto 10px auto;}
    
    .resourcesSearch:after{content:''; display:block; visibility:hidden; clear:both;}
    .resourcesSearch{width:700px; margin:35px auto; height:62px; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15); vertical-align:top;}
    .resourcesSearch input{width: calc(100% - 68px); border:none; float:left; line-height:60px; padding-left:25px; box-sizing:border-box; font-size:20px;}
    .resourcesSearch a{display:inline-block; float:left; padding:18px;}
    
    
    .faqList ul li  {margin-bottom:17px; border:1px solid #eee; border-radius:20px; }
    .faqList ul li.active { background:url(/images/23resources/ans.png) no-repeat right -23px bottom -15px; box-shadow:#ccc 3px 3px 10px;}
    .faqList ul li > a {display:block; padding:20px 65px 20px 65px; font-size:18px; line-height:30px; background:url(/images/23resources/faqQ.png),url(/images/23resources/option1.png); background-repeat:no-repeat; background-position: 30px 22px, 98% 23px; font-weight:bold;}
    .faqList ul li.active > a{ background:url(/images/23resources/faqQ.png),url(/images/23resources/X.png);  background-repeat:no-repeat; background-position: 30px 22px, 98% 23px; }
    .faqList ul li .answer { display:none; padding:5px 280px 30px 65px; line-height:30px; font-size:17px; background:url(/images/23resources/faqA.png) no-repeat 30px 12px; }    
    /*자주묻는질문*/  

    .reList01 li.liH{margin-bottom: 30px !important;}
    .reList01 li .reNum{ width:30px; line-height:30px; font-size:20px;}
    .reList01 li img{ margin-left:30px;}
    .reList01 li article{ position:absolute; top:30px; right:20px; width:calc(100% - 380px); }
    .reList01 li article h5{ color:#eb8017; font-size:22px; font-weight:bold; margin:40px 0 25px 0; }
    .reList01 li article p{ line-height:25px; font-size:17px; }
    /*순환원리*/

    .grayBox2Img{display: flex; justify-content: center; align-items: center; padding: 30px;}
    .grayBox2Img img{padding-right: 30px;}
    .grayBox2Img div> ul{margin-top: 20px; padding-left: 0 !important;}
    .grayBox2Img div> ul> li{font-size: 16px; line-height: 22px;}

    /*환경오염방지*/

    .reList02 h5{margin: 0 0 20px 0 !important;}
    .reList02 li article p span{font-weight: bold; display: block; margin-bottom: 5px; font-size: 18px;}
    /*폐기물관리*/

    .h3Ma{margin-bottom: -50px !important;}
    /*자료실*/

    .reList01_m> li{margin-top: 0 !important;}
    .reList01_m> li img{margin-left: 0 !important;}
    .reList01_m> li article{width: calc(100% - 310px) !important;}
    /*자원순환센터 필요성*/

    .emiSBox{display: grid; grid-template-columns: 33.3% 33.3% 33.3%; padding-left: 0 !important;}
    .emiSBox> li{padding-left: 0 !important; background: none !important; text-align: center;}
    .emiSBox> li:nth-child(4),.emiSBox> li:nth-child(5), .emiSBox> li:nth-child(6){margin-top: 20px}
    /*배출기준*/

}