/* 타이틒 - 모든 시민이 존중 받는 행복한 인권도시 수원 */
.system_tit{padding:10px;word-break:keep-all;background:url(/resources/web/www_new/images/humanright/system_tit_bg.jpg) no-repeat;background-size:cover;text-align:center;border-radius:100px;}
.system_tit .heading{font-size:31px;font-weight:600;color:#fff;}
.system_tit span{color:#f7d033;}
.system_tit p{font-size:20px;font-weight:300;color:#fff;margin-top:5px;}

@media screen and (max-width:640px){
	.system_tit{height:auto;}
	.system_tit .heding{font-size:28px;color:#fff;margin-right:5%;margin-left:5%;width:90%;}
	.system_tit p{font-size:16px;font-weight:300;color:#fff;margin-top:16px;width:80%;margin-right:10%;margin-left:10%;}
}


/* 인권보장 시스템 구축 과정 */
.process_list > ul > li{width:25%;float:left;margin-bottom:20px;}
.process_list > ul > li > div{position:relative;margin-right:20px;height:100%;}
.process_list > ul > li:nth-child(4n+4) > div{margin-right:0;}
.process_list > ul > li > div p{padding:5px 0;margin-bottom:5px;text-align:center;color:#e7eaf0;font-size:16px;font-weight:bold;background:#5a6a8a;}
.process_list > ul > li:first-child span{padding-top:19px;padding-bottom:13px;}
.process_list > ul > li > div > ul{padding:5px;min-height:190px;background:#efefef;}
.process_list > ul > li > div > ul > li{padding-left:10px;position:relative;font-size:13px;margin:10px 0;word-break:keep-all;}
/*.process_list > ul > li > div > ul > li:nth-child(2){margin-top:30px;}*/
.process_list .process_cts > li:nth-child(2){margin-top:7px;}
.process_list > ul > li > div > ul > li:before {content:"";position:absolute;left:3px;top:6px;width:3px;height:3px;border-radius:3px;background:#000;}
.process_list > ul > li > div > ul > li > ul > li{padding-left:10px;position:relative;margin-top:3px;}
.process_list > ul > li > div > ul > li > ul > li:before{content:"";position:absolute;left:2px;top:8px;width:5px;height:1px;background:#3d3d3d;}

.process_list > ul:nth-child(2) > li{width:33.3%;}
.process_list > ul:nth-child(2) > li > div{margin-left:20px;margin-right:0;}
.process_list > ul:nth-child(2) > li > div > ul{min-height:270px;}

.arrow_ret_right{position:absolute;top:12px;right:-15px;}
.arrow_ret_right > .ret{float:left;margin-top:4px;width:5px;height:4px;background:#5a6a8a;}
.arrow_ret_right > .arrow{float:left;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #5a6a8a;border-right:0 none;}
.arrow_ret_right:after{content:'';display:block;clear:both;}

.process_list > ul:nth-child(2) .arrow_ret_right{left:-15px;right:auto;}

@media screen and (max-width:640px){
	.process_list > ul > li{width:100%;height:auto;float:none;margin-right:0;margin-left:0;}
	.process_list > ul > li > div{padding-bottom:10px;margin-right:0;}
	.process_list > ul > li > div > ul{min-height:auto;}
	.process_list > ul > li > div > ul > li{padding-left:20px;font-size:15px;}
	.process_list > ul > li > div > ul > li:before {left:10px;top:8px;}

	.process_list > ul:nth-child(2) > li{width:100%;}
	.process_list > ul:nth-child(2) > li > div{margin-left:0;}
	.process_list > ul:nth-child(2) > li > div > ul{min-height:auto;}

	.process_list .hide_640{display:none;}

	.arrow_ret_right{top:auto;bottom:-10px;right:auto;left:50%;margin-left:-5px;}
	.arrow_ret_right > .ret{display:none;}
	.arrow_ret_right > .arrow{float:none;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #5a6a8a;border-bottom:0 none;}
}

.process_list2 > ul > li{border:2px solid #e5e5e5;width:165px;height:227px;float:left;margin-top:39px;margin-right:19px;}
.process_list2 > ul > li:nth-child(2){border:none;width:361px;background:#0f2c64;}
.process_list2 > ul > li:last-child{margin-right:0;}
.process_list2 > ul > li p{text-align:center;color:#e7eaf0;font-size:16px;background:#404f6b;padding-top:30px;padding-bottom:27px;}
.process_list2 > ul > li:nth-child(2) p{background:#0f2c64;}
.process_list2 > ul > li > ul > li{padding-left:10px;position:relative;font-size:13px;margin-top:7px;}
.process_list2 > ul > li:nth-child(2) > ul > li{padding-left:35px;color:#fff;}
.process_list2 > ul > li > ul > li:before {content:"";position:absolute;left:3px;top:6px;width:3px;height:3px;border-radius:3px;background:#000;}
.process_list2 > ul > li:nth-child(2) > ul > li:before{left:20px;background:#fff;}
.process_list2 > ul > li > ul > li > ul > li{padding-left:10px;position:relative;margin-top:2px;}
.process_list2 > ul > li > ul > li > ul > li:before{content:"";position:absolute;left:2px;top:8px;width:5px;height:1px;background:#3d3d3d;}

@media screen and (max-width:640px){
	.process_list2 > ul > li{width:100%;height:255px;float:none;margin-top:0;margin-right:0;margin-bottom:20px;}
	.process_list2 > ul > li:nth-child(2){width:100%;height:255px;}
	.process_list2 > ul > li > ul > li{padding-left:20px;font-size:15px;}
	.process_list2 > ul > li > ul > li:before {left:10px;top:8px;}
	.process_list2 > ul > li:nth-child(2) > ul > li{padding-left:20px;}
	.process_list2 > ul > li:nth-child(2) > ul > li:before{left:10px;}
}



/* 연혁 */
.hitory_title {margin-top:20px; padding-bottom:25px; border-bottom:2px solid #000; color:#000; font-size:23px; font-weight:600; line-height:25px; text-align:center;}
.history_area {background:url('/resources/web/www_new/images/humanright/history_line.gif') repeat-y 68px top;}
.history_area .cell {position:relative; margin-bottom:13px; padding-left:77px;}
.history_area .cell.first {margin-top:10px;}
.history_area .cell p {position:absolute; left:0; top:0; width:77px; background:url('/resources/web/www_new/images/humanright/history_h4bg.gif') no-repeat right top; color:#062663; font-size:20px; font-weight:600; line-height:22px;}
.history_area .cell.first p {height:39px; background-image:url('/resources/web/www_new/images/humanright/history_h4_first.jpg'); background-position:right -18px;}
.history_area .cell ol {position:relative; padding-left:26px;}
.history_area .cell ol li {display:table; position:relative; padding-bottom:4px; clear:both;}
.history_area .cell ol li:before{display:none;}
.history_area .cell ol li span.date {display:table-cell; width:87px; padding-right:39px; color:#353535; font-size:13px; font-weight:500; line-height:20px;}
.history_area .cell ol li span.text {display:table-cell; color:#3d3d3d; font-size:13px; line-height:18px;}
@media screen and (max-width:640px) {
	.history_area {background-position:5px top !important;}
	.history_area .cell {padding-left:18px;}
	.history_area .cell ol {margin-top:10px; padding-left:0;}
	.history_area .cell p {position:static; height:auto; margin-left:-20px; padding-left:20px; background-position:-5px -20px !important; }
	.history_area .cell.first p{ height:auto; background-position:-5px -20px !important;}
	.history_area .cell ol li {padding-top:3px; padding-left:0;}
}



/* 인권정책 소개 */
.introduce_vision .introduce_vision_tit{margin-top:80px;font-size:20px;color:#000;font-weight:500;position:relative;}
.introduce_vision .introduce_vision_tit:before{content:"";position:absolute;left:0;top:-10px;width:37px;height:3px;background:#0f2c64;}
.introduce_vision p{background:#0f2c64;border:1px solid #0f2c64;border-radius:25px;max-width:600px;height:59px;font-size:20px;display:block;text-align:center;margin:20px auto 0 auto;}
.introduce_vision span{color:#fff;display:inline-block;margin-top:14px;}
.introduce_vision .up_arrow{margin:30px auto 0 auto;text-align:center;}

@media screen and (max-width:640px) {
	.introduce .introduce_cts{margin-right:0;margin-left:0;}
	.introduce_vision p{height:auto;padding:20px;font-size:18px;margin-left:0;}
	.introduce_vision span{margin-top:0;}
	.introduce_vision .up_arrow{display:none;}
}

.introduce_direction .introduce_direction_tit{margin-top:30px;font-size:18px;color:#000;font-weight:500;position:relative;}
.introduce_direction .introduce_direction_tit:before{content:"";position:absolute;left:0;top:-10px;width:37px;height:3px;background:#0f2c64;}
.introduce_direction ul{max-width:600px;margin:0 auto;}
.introduce_direction li{float:left;text-align:center;margin-right:54px;margin-top:32px;}
.introduce_direction li span{display:inline-block;margin-top:40px;line-height:30px;font-size:20px;color:#0f2c64;font-weight:500;}
.introduce_direction li:nth-child(1){width:138px;height:138px;border-radius:9999px;border:7px solid #2d6da7;margin-left:20px;}
.introduce_direction li:nth-child(2){width:138px;height:138px;border-radius:9999px;border:7px solid #3d589a;}
.introduce_direction li:nth-child(3){width:138px;height:138px;border-radius:9999px;border:7px solid #44506b;margin-right:0;background:none;}

@media screen and (max-width:640px) {
	.introduce_direction .introduce_direction_tit{margin-top:80px;}
	.introduce_direction ul{vertical-align:center;max-width:140px;}
	.introduce_direction li{float:none;margin-right:0;margin-top:22px;}
	.introduce_direction li:nth-child(1){margin-left:0;}
}

.introduce_goal .introduce_goal_tit{margin-top:117px;font-size:20px;color:#000;font-weight:500;position:relative;}
.introduce_goal .introduce_goal_tit:before{content:"";position:absolute;left:0;top:-10px;width:37px;height:3px;background:#0f2c64;}
.goal_cts{max-width:600px;margin:43px auto 0 auto;}
.goal_cts > li{border:2px solid #e5e5e5;width:178px;height:280px;float:left;border-radius:15px;margin-right:13px;}
.goal_cts > li:first-child{margin-left:10px;}
.goal_cts > li:last-child{margin-right:0;}
.goal_cts p{background:#f5f7fb;width:100%;height:90px;text-align:center;border-bottom:2px solid #e5e5e5;border-radius:15px 15px 0 0;}
.goal_cts span{display:block;padding-top:20px;color:#163267;font-size:18px;font-weight:500;font-size:18px;}
.goal_cts > li > ul > li{position:relative;padding-left:20px;font-size:15px;line-height:18px;margin-left:9px;margin-top:5px;}
.goal_cts span.num{position:absolute;top:0px;left:0px;padding:0;font-size:15px;font-weight:normal;color:inherit;}
.goal_cts2{max-width:600px;margin:43px auto 0 auto;}
.goal_cts2 > li{border:2px solid #e5e5e5;width:178px;height:262px;float:left;border-radius:15px;margin-right:13px;}
.goal_cts2 > li:first-child{margin-left:100px;}
.goal_cts2 > li:last-child{margin-right:0;}
.goal_cts2 p{background:#f5f7fb;width:100%;height:90px;text-align:center;border-bottom:2px solid #e5e5e5;border-radius:15px 15px 0 0;}
.goal_cts2 span{display:block;padding-top:20px;color:#163267;font-size:18px;font-weight:500;font-size:18px;}
.goal_cts2 > li > ul > li{position:relative;padding-left:20px;font-size:15px;line-height:18px;margin-left:9px;margin-top:5px;}
.goal_cts2 span.num{position:absolute;top:0px;left:0px;padding:0;font-size:15px;font-weight:normal;color:inherit;}

@media screen and (max-width:640px) {
	.introduce_goal .introduce_goal_tit{margin-top:95px;}
	.goal_cts{margin-top:20px;vertical-align:center;margin-left:10%;}
	.goal_cts > li{width:85%;height:280px;float:none;margin-right:0;margin-bottom:15px;}
	.goal_cts > li:first-child{margin-left:0;}
	.goal_cts > li:last-child{margin-right:0;}
	.goal_cts > li > ul > li{margin-left:15px;margin-top:8px;}
	.goal_cts > li > ul > li br{display:none;}
	.goal_cts2{margin-top:15px;vertical-align:center;margin-left:10%;}
	.goal_cts2 > li{width:85%;height:262px;float:none;margin-right:0;margin-bottom:15px;}
	.goal_cts2 > li:first-child{margin-left:0;}
	.goal_cts2 > li:last-child{margin-right:0;}
	.goal_cts2 > li > ul > li{margin-left:15px;margin-top:8px;}
	.goal_cts2 > li > ul > li br{display:none;}
}

.introduce_wrap{width:1200px; margin:50px auto 0;}
.introduce_wrap .box{display:inline-block; width:100%; margin-bottom:50px;}
.introduce_wrap .box.n1{position:relative; margin-bottom:180px;}
.introduce_wrap .box.n1:after{position:absolute; display:block; content:''; bottom:-150px; left:56%; width:111px; height:142px; background:url('/resources/web/www_new/images/humanright/policy_img.jpg') no-repeat;}
.introduce_wrap .box div{display:inline-block; float:left; text-align:center; box-sizing:border-box;}
.introduce_wrap .box .box_name{width:240px; min-height:100px; line-height:100px; padding-top:24px; margin-right:20px; border-radius:16px; background-color:#ebebeb; font-size:24px; font-weight:600;}
.introduce_wrap .box .box_name p{display:inline-block; line-height:24px;}
.introduce_wrap .box .box_name em{font-size:18px; font-weight:400; color:#807f7f;}
.introduce_wrap .box .box_detail{width:calc(100% - 260px); min-height:124px;}
.introduce_wrap .box .box_detail .title{width:100%; padding-top:46px; color:#000; font-size:24px;}
.introduce_wrap .box .box_detail .title p{position:relative;}
.introduce_wrap .box .box_detail .title p:after{position:absolute; display:block; content:''; width:70%; height:4px; left:15%; bottom:-20px; background-color:#ff8499; border-radius:3px;}
.introduce_wrap .box .box_detail .title .bold_point{color:#e00d5a; font-size:32px; font-weight:600;}

.introduce_wrap .box .box_detail ul{display:inline-block; width:100%;}
.introduce_wrap .box .box_detail ul .list_item{width:calc(25% - 10px); float:left; margin-right:13px;}
.introduce_wrap .box .box_detail ul .list_item:last-child{margin-right:0;}

.introduce_wrap .box.n2 ul .list_item span{position:relative; display:inline-block; width:124px; height:124px; line-height:94px; border:14px solid #fee179; border-radius:50%; background-color:#fff; color:#000; box-sizing:border-box; font-size:18px; font-weight:600;}
.introduce_wrap .box.n2 ul .list_item:nth-child(2) span{border-color:#5dc6d9;}
.introduce_wrap .box.n2 ul .list_item:nth-child(3) span{border-color:#4c8b09;}
.introduce_wrap .box.n2 ul .list_item:nth-child(4) span{border-color:#fda262;}

.introduce_wrap .box.n3 ul .list_item{position:relative; display:table; height:124px; border-bottom:3px solid #fee179; box-sizing:border-box;}
.introduce_wrap .box.n3 ul .list_item:after{position:absolute; display:block; width:16px; height:16px; line-height:16px; content:'▼'; font-size:18px; color:#000; bottom:-36px; left:calc(50% - 8px);}
.introduce_wrap .box.n3 ul .list_item:nth-child(2){border-color:#5dc6d9;}
.introduce_wrap .box.n3 ul .list_item:nth-child(3){border-color:#4c8b09;}
.introduce_wrap .box.n3 ul .list_item:nth-child(4){border-color:#fda262;}
.introduce_wrap .box.n3 ul .list_item span{display:table-cell; vertical-align:middle; font-weight:600;}

.introduce_wrap .box.n4 .box_detail ul .list_item{display:table; height:124px; border:1px solid #ddd; border-radius:16px; box-sizing:border-box; text-align:left;}
.introduce_wrap .box.n4 .box_detail ul .list_item ul.bu{display:table-cell; vertical-align:middle;}

@media all and (max-width:1200px){
	.introduce_wrap{width:100%;}
	.introduce_wrap .box .box_name{width:140px;}
	.introduce_wrap .box .box_detail{width:calc(100% - 160px);}
	.introduce_wrap .box.n4 .box_detail ul .list_item ul.bu{padding:2px 0 5px 10px;}
}

@media all and (max-width:960px){
	.introduce_wrap .box .box_detail .title p:after{width:92%; left:4%;}
	.introduce_wrap .box .box_detail ul .list_item{width:calc(50% - 10px); float:left; margin-right:10px; margin-bottom:10px;}
	.introduce_wrap .box .box_detail ul .list_item:nth-child(2n){margin-right:0;}	
	.introduce_wrap .box.n3 ul .list_item:after{display:none;}
	.introduce_wrap .box.n4 .box_detail ul .list_item ul.bu{padding:2px 0 5px 25px;}
	.introduce_wrap .box.n4 .box_detail ul .list_item{border:3px solid #fee179;}
	.introduce_wrap .box.n4 .box_detail ul .list_item:nth-child(2){border-color:#5dc6d9;}
	.introduce_wrap .box.n4 .box_detail ul .list_item:nth-child(3){border-color:#4c8b09;}
	.introduce_wrap .box.n4 .box_detail ul .list_item:nth-child(4){border-color:#fda262;}
}

@media all and (max-width:700px){
	.introduce_wrap .box div{display:block; float:none;}
	.introduce_wrap .box .box_name{width:100%; line-height:80px; margin-right:0; margin-bottom:20px;}
	.introduce_wrap .box .box_detail{width:100%;}
	.introduce_wrap .box.n1:after{left:calc(50% - 55px);}
	.introduce_wrap .box .box_detail .title{font-size:18px; padding-top:16px;}
	.introduce_wrap .box .box_detail .title p{line-height:28px;}
	.introduce_wrap .box .box_detail .title em{font-size:22px;}
}

@media all and (max-width:460px){
	.introduce_wrap .box .box_detail .title em{display:block;}
	.introduce_wrap .box.n4 .box_detail ul .list_item{width:100%; margin-right:0;}
}