#container{line-height:1.1; word-break:keep-all;}
#container *{box-sizing:border-box;}

@media only screen and (max-width:1220px){
    :not(.header) .wrap{width:calc(100% - 40px); margin:0 auto;}
}
@media only screen and (max-width:768px){
    :not(.header) .wrap{width:calc(100% - 20px);}
}

.rowgroup1{position:relative; padding:30px 0; background-color:#e5e8f0;}
.rowgroup1:before,
.rowgroup1:after{display:block; position:absolute; background:url(../images/main/main_sprite.png) no-repeat;}
.rowgroup1:before{bottom:0; left:0; width:290px; height:105px; background-position:-10px -245px;}
.rowgroup1:after{top:375px; left:calc(50% + 720px); width:141px; height:106px; background-position:-311px -244px;}
.rowgroup1 .wrap{z-index:10;}
@media only screen and (max-width:1220px){
	.rowgroup1:after{left:auto; right:0;}
}
@media screen and (max-width:768px){
	.rowgroup1{padding:15px 0;}
	.rowgroup1:before,
	.rowgroup1:after{display:none;}

}

/* rogroup1 메인비주얼팝업 */
.rowgroup1 .visual{float:left; position:relative; width:720px; height:620px;}
.rowgroup1 .visual .list{position:relative; height:302px;}
.rowgroup1 .visual .list .slide a{display:block;}
.rowgroup1 .visual .control{position:absolute; bottom:0; right:0;}
.rowgroup1 .visual .control button{display:block; position:relative; float:left; width:45px; height:45px; margin-left:1px; background-color:rgba(0,0,0,0.8); text-align:center; line-height:45px;}
.rowgroup1 .visual .control button.play{display:none;}
.rowgroup1 .visual .control button:before{display:inline-block; background:url(../images/main/main_sprite.png) no-repeat; vertical-align:middle;}
.rowgroup1 .visual .control button.prev:before{width:27px; height:24px; background-position:-55px -10px;}
.rowgroup1 .visual .control button.pause:before{width:10px; height:21px; background-position:-111px -12px;}
.rowgroup1 .visual .control button.play:before{width:12px; height:21px; background-position:-156px -12px;}
.rowgroup1 .visual .control button.next:before{width:27px; height:24px; background-position:-194px -10px;}

@media only screen and (max-width:1220px){
	.rowgroup1 .visual{float:none; margin:0 auto;}
}
@media screen and (max-width:768px){
	.rowgroup1 .visual{width:100%; max-width:720px; height:auto;}
	.rowgroup1 .visual .list{height:auto;}
}

/* 공지사항, 팝업 그룹 */
.rowgroup1 .colgroup{float:right; width:480px; height:620px;}

@media only screen and (max-width:1220px){
	.rowgroup1 .colgroup{float:none; width:720px; margin:0 auto;}
}
@media screen and (max-width:768px){
	.rowgroup1 .colgroup{width:100%; max-width:720px; height:auto; margin-top:16px;}
}

/* rogroup1 공지사항 */
.rowgroup1 .board{position:relative; height:290px; padding:35px 40px; background-color:#fff;}
.rowgroup1 .board .list{position:relative;}
.rowgroup1 .board .list > li{display:inline; float:left; padding:0;}
.rowgroup1 .board .list > li > a{display:block; position:relative; margin-right:16px; padding-left:16px; font-size:18px; color:#596275; text-decoration:none;}
.rowgroup1 .board .list > li:first-child > a{ padding-left:0;}
.rowgroup1 .board .list > li:not(:first-child) > a:before{display:block; position:absolute; top:0; left:1px; width:1px; height:20px; background-color:#bebebe; transform:rotate(30deg);}
.rowgroup1 .board .list > li.active > a {font-weight:600; color:#000;}
.rowgroup1 .board .list > li.active > a:after{display:block; width:9px; height:5px; margin:10px auto 0; background:url(../images/main/main_sprite.png) no-repeat -10px -10px;}
.rowgroup1 .board .tabcontent{position:absolute; top:55px; left:0; width:100%; padding:0;}
.rowgroup1 .board .tabcontent ul li{margin:14px 0;}
.rowgroup1 .board .tabcontent ul li:first-child{margin-top:0;}
.rowgroup1 .board .tabcontent ul li span{display:inline-block; width:60px; font-size:18px; color:#e53032; vertical-align:middle;}
.rowgroup1 .board .tabcontent ul li a{display:inline-block; width:calc(100% - 70px); font-size:16px; color:#596275; vertical-align:middle; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rowgroup1 .board .tabcontent .more{position:absolute; top:-90px; right:-40px; font-size:0; color:transparent;}
.rowgroup1 .board .tabcontent .more a{display:block; position:relative; width:55px; height:55px; background-color:#596275; text-align:center; line-height:55px;}
.rowgroup1 .board .tabcontent .more a:before{display:inline-block; width:14px; height:14px; background:url(../images/main/main_sprite.png) no-repeat -28px -10px; vertical-align:middle;}

@media screen and (max-width:900px){
	.rowgroup1 .board .tabcontent ul li span{font-size:14px;}
	.rowgroup1 .board .tabcontent ul li a{font-size:14px;}
}
@media screen and (max-width:768px){
	.rowgroup1 .board {height:238px; padding:22px 21px;}
	.rowgroup1 .board .list > li > a{margin-right:13px; padding-left:13px; font-size:16px;}
	.rowgroup1 .board .list > li.active > a {font-size:17px;}
	.rowgroup1 .board .tabcontent{top:51px;}
	.rowgroup1 .board .tabcontent ul li{margin:11px 0;}

	.rowgroup1 .board .tabcontent .more{top:-74px; right:-20px;}
	.rowgroup1 .board .tabcontent .more a{width:49px; height:49px; line-height:49px;}

}


/* 팝업 */
.rowgroup1 .popup{position:relative; height:332px; padding:30px; background-color:#596275;}
.rowgroup1 .popup .section_title{position:relative; padding-left:30px; font-size:18px; font-weight:600; color:#fff; line-height:24px;}
.rowgroup1 .popup .section_title:before{display:block; position:absolute; top:0; left:0; width:21px; height:24px; background:url(../images/main/main_sprite.png) no-repeat -236px -10px;}
.rowgroup1 .popup .list{position:relative; width:420px; height:226px; margin:20px auto 0;}
.rowgroup1 .popup .list .slide a{display:block; overflow:hidden; height:226px;}
.rowgroup1 .popup .list .slide img{display:block; width:100%;}
.rowgroup1 .popup .control{position:absolute; top:31px; right:30px;}
.rowgroup1 .popup .control button{display:inline-block; width:15px; height:15px; text-align:center; line-height:15px;}
.rowgroup1 .popup .control button.play{display:none;}
.rowgroup1 .popup .control button:before{display:inline-block; height:15px; background:url(../images/main/main_sprite.png) no-repeat; vertical-align:middle;}
.rowgroup1 .popup .control button.prev:before{width:9px; background-position:-273px -10px;}
.rowgroup1 .popup .control button.pause:before{width:9px; background-position:-294px -10px;}
.rowgroup1 .popup .control button.play:before{\width:10px; background-position:-318px -10px;}
.rowgroup1 .popup .control button.next:before{width:10px; background-position:-338px -10px;}

@media screen and (max-width:768px){
	.rowgroup1 .popup{width:100%; max-width:720px; height:auto; padding:22px 22px 20px;}
	.rowgroup1 .popup .section_title{font-size:17px;}
	.rowgroup1 .popup .list{width:100%; max-width:420px; height:auto;}
	.rowgroup1 .popup .list .slide a{height:auto;}
}

/* .rowgroup1 아이콘 링크 */
.rowgroup1 .icon_link{float:left; width:100%; padding:60px 0 50px;}
.rowgroup1 .icon_link li{float:left; position:relative; width:16.66666%; text-align:center;}
.rowgroup1 .icon_link li:not(:first-child):before{display:block; position:absolute; top:47%; left:-12px; width:24px; height:4px; background:url(../images/main/main_sprite.png) no-repeat -361px -10px;}
.rowgroup1 .icon_link li a{display:inline-block; position:relative; padding-top:130px; color:#202e51;}
.rowgroup1 .icon_link li a:before{display:block; position:absolute; top:0; left:calc(50% - 51px); width:102px; height:102px; background:url(../images/main/main_sprite.png) no-repeat;}
.rowgroup1 .icon_link li a.icon1:before{height:109px; margin-top:-7px; background-position:-10px -52px;}
.rowgroup1 .icon_link li a.icon2:before{background-position:-138px -59px;}
.rowgroup1 .icon_link li a.icon3:before{background-position:-267px -59px;}
.rowgroup1 .icon_link li a.icon4:before{background-position:-392px -61px;}
.rowgroup1 .icon_link li a.icon5:before{background-position:-517px -59px;}
.rowgroup1 .icon_link li a.icon6:before{background-position:-636px -63px;}
.rowgroup1 .icon_link li:nth-child(even) a:before{top:16px;}
.rowgroup1 .icon_link li span{display:block; margin-top:11px; font-size:20px;}
.rowgroup1 .icon_link li span br{display:none;}


@media screen and (max-width:900px){
	.rowgroup1 .icon_link li a{padding-top:90px;}
	.rowgroup1 .icon_link li a:before{transform:scale(0.71); transform-origin:center top;}
	.rowgroup1 .icon_link li span{font-size:15px;}
}
@media screen and (max-width:768px){
	.rowgroup1 .icon_link{width:calc(100% + 20px); margin-left:-10px; padding:28px 0 24px;}
	.rowgroup1 .icon_link li{width:33.3333333%;}
	.rowgroup1 .icon_link li:nth-child(n + 4){margin-top:27px;}
	.rowgroup1 .icon_link li:before{top:39% !important;}
	.rowgroup1 .icon_link li:nth-child(4):before{display:none;}
}

.rowgroup2{padding:95px 0 84px; background:url(../images/main/rowgroup2_bg.jpg) no-repeat center top;}

@media screen and (max-width:768px){
	.rowgroup2{padding:18px 0 35px; background-size:cover ;}
}

/* 프로그램 현황 */
.rowgroup2 .program{position:relative; height:176px;}
.rowgroup2 .program .title_area{float:left; position:relative; z-index:0; width:320px; height:100%; padding:42px 10px 0 84px;}
.rowgroup2 .program .title_area:before{display:block; position:absolute; right:0; top:0; z-index:-1; width:800px; height:100%; background-color:#ca1259; opacity:0.8;}
.rowgroup2 .program .title_area:after{display:block; position:absolute; top:calc(50% - 35px); left:13px; width:49px; height:57px; background:url(../images/main/main_sprite.png) no-repeat -10px -175px;}
.rowgroup2 .program .title_area .section_title{font-size:30px; font-weight:normal; color:#fff; letter-spacing:-0.05em;}
.rowgroup2 .program .title_area .text{margin-top:14px; font-size:16px; color:#fff; line-height:21px;}
.rowgroup2 .program .list{float:right; width:calc(100% - 340px);}
.rowgroup2 .program .list .slide{margin-right:20px;}
.rowgroup2 .program .list .slide a{display:block; position:relative; width:280px; height:176px; padding:27px; border:1px solid #fff; color:#fff; text-decoration:none;}
.rowgroup2 .program .list .slide .title{overflow:hidden; height:47px; font-size:18px; line-height:24px;}
.rowgroup2 .program .list .slide a:hover .title,
.rowgroup2 .program .list .slide a:focus .title{text-decoration:underline;}
.rowgroup2 .program .list .slide .period{margin-top:21px; font-size:15px; line-height:24px;}
.rowgroup2 .program .list .slide .more{position:absolute; right:0; bottom:0; width:35px; height:35px; background-color:#b21e57; text-align:center; line-height:35px;}
.rowgroup2 .program .list .slide .more:before{display:inline-block; width:17px; height:17px; background:url(../images/main/main_sprite.png) no-repeat -401px -10px; vertical-align:middle;}

@media screen and (max-width:900px){
	.rowgroup2 .program .title_area .section_title{font-size:18px;}
	.rowgroup2 .program .title_area .text{margin-top:9px; font-size:15px; line-height:20px;}
	.rowgroup2 .program .list .slide .title{font-size:15px; line-height:21px;}
	.rowgroup2 .program .list .slide .period{ font-size:14px; line-height:20px;}
}
@media screen and (max-width:768px){
	.rowgroup2 .program{height:auto;}
	.rowgroup2 .program .title_area{float:none; width:100%; max-width:340px; height:129px; padding:32px 10px 0 104px;}
	.rowgroup2 .program .title_area:after{top:calc(50% - 32px); left:45px; transform:scale(0.75);}
	.rowgroup2 .program .list{float:none; width:calc(100% + 10px); margin-top:20px;}
	.rowgroup2 .program .list .slide a{width:237px; height:150px; padding:23px;}
	.rowgroup2 .program .list .slide .period{margin-top:13px;}

}

/* 지금 부천 여성청소년 센터는? */
.rowgroup3 {padding:67px 0;}

@media screen and (max-width:768px){
	.rowgroup3 {padding:34px 0 42px;}
}

.gallery .section_title{width:373px; height:31px; background:url(../images/main/main_sprite.png) no-repeat -10px -357px;}
.gallery .control{position:absolute; top:-6px; right:0;}
.gallery .control button{display:block; float:left; position:relative; width:144px; height:44px; border:1px solid #e6e6e6; border-left-width:0; font-size:17px; color:#2c2c2c;}
.gallery .control button:first-child{border-left-width:1px;}
.gallery .control button.active{border-color:#b11d57; background-color:#b11d57; font-weight:600; color:#fff;}
.gallery .control button.active:before{display:block; position:absolute; bottom:-7px; left:calc(50% - 7px); width:14px; border-top:7px solid #b11d57; border-right:7px solid transparent; border-left:7px solid transparent; box-sizing:border-box;}

.gallery .control button.facebook.active{border-color:#002d93; background-color:#002d93;}
.gallery .control button.facebook.active:before{border-top-color:#002d93;}
.gallery .control button.blog.active{border-color:#008b24; background-color:#008b24;}
.gallery .control button.blog.active:before{border-top-color:#008b24;}

.gallery .list{margin-top:63px;}
.gallery .list .slide a{display:block; position:relative; height:320px; margin-top:20px; border:1px solid #d8d8d8; border-left-width:0; text-decoration:none;}
.gallery .list .slide.slick-current a{border-left-width:1px;}
.gallery .list .slide:not(.activity) .tag{position:absolute; top:-20px; left:0; width:50px; height:44px; background:url(../images/main/main_sprite.png) no-repeat;}
.gallery .list .slide.facebook .tag{background-position:-424px -183px;}
.gallery .list .slide.blog .tag{background-position:-490px -183px;}
.gallery .list .slide .img_area{overflow:hidden; height:198px;}
.gallery .list .slide .img_area img{display:block; width:100%;}
.gallery .list .slide .text_area{padding:23px;}
.gallery .list .slide .text_area .title{overflow:hidden; height:45px; font-size:18px; color:#323232; line-height:23px;}
.gallery .list .slide a:hover .text_area .title,
.gallery .list .slide a:focus .text_area .title{text-decoration:underline;}
.gallery .list .slide .text_area .date{margin-top:20px; font-size:15px; color:#7e7e7e;}

.gallery .more{margin-top:25px;}
.gallery .more a{display:block; width:142px; height:44px; margin:0 auto; border:1px solid #e6e6e6; font-size:16px; color:#454545; text-align:center; line-height:42px;}
.gallery .more a:after{display:inline-block; width:13px; height:13px; margin:-2px 0 0 10px; background:url(../images/main/main_sprite.png) no-repeat -433px -10px; vertical-align:middle;}

@media screen and (max-width:1220px){
	.gallery .list .slide{width:306px;}
	.gallery .list .slide a{width:100%;}
}
@media screen and (max-width:900px){
	.gallery .control{top:2px;}
	.gallery .control button{width:113px; height:35px; font-size:15px; line-height:35px;}
	.gallery .list{width:calc(100% + 20px);}
	.gallery .list .slide{width:245px;}
	.gallery .list .slide a{height:255px;}
	.gallery .list .slide .img_area{height:159px;}
	.gallery .list .slide .text_area {padding:10px;}
	.gallery .list .slide .text_area .title{height:39px; font-size:15px; line-height:20px;}
	.gallery .list .slide .text_area .date{margin-top:16px; font-size:14px;}
}
@media screen and (max-width:768px){
	.gallery .section_title{transform:scale(0.67); transform-origin:left top;}
	.gallery .control{position:static; width:100%; max-width:339px; margin:22px auto 0;}
	.gallery .list {margin-top:25px;}
	.gallery .list .slide a{margin-top:10px;}
	.gallery .list .slide:not(.activity) .tag{top:-10px; transform:scale(0.76); transform-origin:left top;}
	.gallery .more a{width:130px; height:40px; margin-top:21px; font-size:15px; line-height:38px;}
}

/* 퀵메뉴 */
#floating{position:fixed; left:calc(50% + 650px); top:254px; z-index:100;}
#floating ul.quick{width:117px;}
#floating ul.quick li a{display:block; position:relative; height:112px; padding-top:85px; background-color:#596275; font-size:16px; color:#fff; text-align:center; text-decoration:none;}
#floating ul.quick li:not(:last-child) a{border-bottom:1px solid #757c8c;}
#floating ul.quick li a:hover,
#floating ul.quick li a:focus{border-color:#3639b6; background-color:#3639b6;}
#floating ul.quick li a:before{display:block; position:absolute; top:30px; background:url(../images/main/main_sprite.png) no-repeat;}
#floating ul.quick li a.icon1:before{left:calc(50% - 16px); width:33px; height:33px; background-position:-79px -189px;}
#floating ul.quick li a.icon2:before{left:calc(50% - 15px); width:30px; height:33px; background-position:-154px -189px;}
#floating ul.quick li a.icon3:before{left:calc(50% - 15px); width:30px; height:34px; background-position:-227px -188px;}
#floating ul.quick li a.icon4:before{left:calc(50% - 16px); width:32px; height:31px; background-position:-299px -190px;}
#floating ul.quick li a.icon5:before{left:calc(50% - 14px); width:39px; height:23px; background-position:-369px -194px;}

@media screen and (max-width:1220px){
	#floating,#floating .quick{display:none}
}