@charset "utf-8";
#sub_default{line-height:160%; font-weight:200; word-break:keep-all; letter-spacing:0px;}
br{font-family:"noto sans kr";}

.box_info{z-index:1; position:relative; width:100%; min-height:190px; margin:0 0 45px; padding:50px; border:1px solid #95d6ff; border-radius:20px; word-break:keep-all; box-sizing:border-box;}
.box_info:before,
.box_info:after{z-index:-1; content:''; display:block; position:absolute; bottom:-1px; left:-1px; width:340px; height:62px; background:#fff;}
.box_info:after{left:45px; width:135px; width:244px; height:7px; background:url(/images/kr/common/bg_pattern.jpg) repeat-x;}
.box_info:before{z-index:-2;}
.box_info .tit{display:inline-block; padding:4px 0 10px; font-size:23px; color:#000; font-weight:600; letter-spacing:0.5px;}
.box_info p{letter-spacing:-0.5px;}
@media all and (max-width:768px) {
	.box_info{padding:35px;}
}	
@media all and (max-width:568px) {
	.box_info{padding:25px;}
}	
@media all and (max-width:380px) {
	.box_info{padding:20px;}
}	

/* 의원소개 */
#sub_active{float:left; width:100%;}
#sub_active .normal_list img,
#sub_memberlist .normal_list img{max-width:119px;}
.profile{float:left; width:47.8%; margin:0 0 34px 0; padding:30px 0 0 0; color:#333; border-radius:10px;  border:1px solid rgba(41,46,68,0.15); box-sizing:border-box;}
.profile:hover{border-color:rgba(41,46,68,0.5);}
.profile.none{float:right;}
.profile dl{position:relative; float:left; width:100%; padding:0 0 0 41.9%; box-sizing:border-box;}
.profile dt{position: absolute; top:0; left:7.7%;}
.profile dt img{max-width:120px; border:1px solid #e5e5e5;min-width: 120px;}
.profile dd{float:left;width:100%;min-height: 240px;}
.profile .name {overflow:hidden; width:100%; padding:8px 0 20px 0;}
.profile .name strong{float:left; display:block; line-height:30px; font-size:27px; font-weight:900; color:#000; letter-spacing:-2px;}
.profile dd ul{clear:both; width:100%;}
.profile dd li{position:relative; padding:0 0 8px 15px; line-height:135%; box-sizing:border-box;}
.profile dd li *{display:inline-block; vertical-align:top;}
.profile dd li:before{left:3px; top:5px; width:5px; height:5px; background:#d5525e;}
.profile dd li .colon{padding:0 5px;}
.profile .btns{clear:both; overflow:hidden; width:100%; min-height:0; padding:0;}
.profile .btns a{position:relative; float:left; width:50%; height:60px; line-height:60px; font-weight:400; border-top:1px solid rgba(41,46,68,0.1); border-right:1px solid rgba(41,46,68,0.15); color:#292e45; border-radius:0 0 0 10px; background:#f3f3f8; text-align:center; text-decoration:none; box-sizing:border-box;}
.profile .btns a.end{width:calc(50% + 1px);  margin:0 0 0 -1px; border-right:none; border-left:1px solid rgba(41,46,68,0.15); border-radius:0 0 10px 0;}
.profile .btns a.end:after{content:''; display:inline-block; vertical-align:middle; width:14px; height:14px; margin:-3px 0 0 6px; background:url(/images/kr/member/ico_open.png) no-repeat 0 100%;}
.profile .btns a:hover{z-index:1; background-color:#fff; border-color:rgba(41,46,68,0.5);}

.profile .sns{float:left; padding:0 0 0 24px;}
.profile .sns a{float:left; width:28px; height:26px; font-size:0; text-indent:-9999px; background:url(/images/common/ico_sns_on.jpg) no-repeat 0 0;}
.profile .sns .tw{background-position:0 -26px;}
.profile .sns .bl{background-position:0 -52px;}
.profile .sns .kko{background-position:0 -78px;}
.profile .sns .insta{background-position:0 -104px;}
.profile .sns .channel{background-position:0 -130px;}
#sub_memberlist .profile .btns a:first-child{width:100%; border-right:none; border-radius:0 0 10px 10px;}

@media all and (max-width:1230px) {
	.profile dt{left:4.5%; width:35%; max-width:140px;}
	.profile .name{padding:3px 0 20px;}
	.profile .name strong{line-height:32px; font-size:23px;}
	.profile .sns{padding:0 0 0 7px;}
}
@media all and (max-width:1024px) {
	.profile{width:49%;}
	.profile dl{padding:0 0 0 38%;}
	.profile dt{left:4.5%; width:35%; max-width:155px;}
	.profile dt img{width:87%; max-width:119px;min-width: 0; height:auto;}
	.profile dd{min-height: 230px;}
	.profile .name{padding:0 0 15px;}
	.profile .name strong{font-size:25px;}
	.profile dd li{padding-bottom:7px;}
}
@media all and (max-width:768px) {
	.profile{overflow:hidden; width:100%; height:auto; padding:20px 0 0 0;}
	.profile dl{padding:0 0 27px 170px;}
	.profile dt{left:3.5%;}
	.profile dd{min-height:135px;}
	.profile .name strong{font-size:23px;}
	.profile .btns{margin:1em 0 0 0;}
}
@media all and (max-width:568px) {
	.profile dl{padding:0 0 23px 38%;}
	.profile .name{padding:0 0 12px;}
	.profile .name strong{font-size:21px;}
	.profile dd li{padding:0 0 5px 10px;}
	.profile dd li:before{top:5px;}
	.profile .btns a{height:47px; line-height:47px;}
}
@media all and (max-width:380px) {
	.profile dd li .colon{left:72px;}
}
@media all and (max-width:357px) {
	.profile .name strong{font-size:20px;}
	.profile .sns{width:100%; padding:5px 0 0 0;}
}


/*chairman*/
.intro{font-family:"gmarket"}
.intro .pic_wrap{position:relative; margin:0 0 60px; width:100%; min-height:390px;}
.intro .pic_wrap .txt_box{width:100%; height:100%; padding:40px 60px 160px 60px; box-sizing:border-box;}
.intro .pic_wrap .txt_box .tit{position:relative; padding:0 0 20px; }
.intro .pic_wrap .txt_box .tit li{font-size:25px; font-weight:900; word-break:keep-all; color:#777777; line-height:150%;}
.intro .pic_wrap .txt_box .tit:before{content:""; position:absolute; left:-45px; width:38px; height:36px; background:url("/images/kr/intro/bg_tit.png")no-repeat}
.intro .pic_wrap .txt_box .hasimg{position:relative;}
.intro .pic_wrap .txt_box .hasimg:after{content:""; position:absolute; right:-60px; top:-26px; width:71px; height:47px; background:url("/images/kr/intro/bg_tit2.png")no-repeat}
.intro .pic_wrap .txt_box .tit .color{color:#2d7dc7;}
.intro .pic_wrap .txt_box .para li{font-size:16px; font-weight:200; color:#000;}
.intro .pic_wrap .pic{position:absolute; right:0; bottom:-33px; z-index:5; width:391px; box-sizing:border-box;}
.intro .pic_wrap .pic:before{content:""; position:absolute; z-index:-3; top:100px; left:-100px; width:101px; height:119px; background:url("/images/kr/intro/bg_pic.png")no-repeat}
.intro .pic_wrap .btm{position:absolute; left:0; bottom:0; box-sizing:border-box; padding:36px 30% 36px 0; width:calc(100% - 100px); height:150px; text-align:right; background:url("/images/kr/intro/bg_sign.jpg")no-repeat;}
.intro .pic_wrap .btm .bgtxt{display:inline-block; padding:0 0 14px; font-family:"Jalnan"; font-size:33px; color:#fff; opacity:0.1; text-transform:uppercase; line-height:100%;}
.intro .pic_wrap .btm .sign{font-size:20px; font-weight:800; color:#fff;}
@media all and (max-width:1330px){
	.intro .pic_wrap .txt_box{padding:20px 45px 160px 45px;}
	.intro .pic_wrap .btm{padding:26px 25% 26px 0; width:calc(100% - 200px);}
	.intro .pic_wrap .pic{width:40%}
	.intro .pic_wrap .pic:before{left:-10%;}
}
@media all and (max-width:1220px){
	.intro .pic_wrap .txt_box{padding:10px 20px 160px 20px;}
	.intro .pic_wrap .txt_box .tit:before{left:-30px;}
	.intro .pic_wrap .btm{padding:20px 20% 20px 0;}
	.intro .pic_wrap .btm .bgtxt{padding:0;}
	.intro .pic_wrap .pic{width:36%}
}
@media all and (max-width:768px){
	.intro .pic_wrap .pic:before{top:50px;}
	.intro .pic_wrap .btm{padding:20px 30% 20px 0; width:calc(100% - 100px);}
	.intro .pic_wrap .btm .bgtxt{padding:0; font-size:28px;}
	.intro .pic_wrap .txt_box .tit li:last-child{padding-right:20%;}
	.intro .pic_wrap .txt_box .para li{font-size:15px; padding-right:30%;}
}
@media all and (max-width:680px){
	.intro .pic_wrap .txt_box{padding:10px 20px 128px 20px;}
	.intro .pic_wrap .txt_box .tit li{font-size:22px;}
	.intro .pic_wrap .txt_box .hasimg:after{right:-50px; top:-5px; width:61px; height:37px; background-size:cover;}
	.intro .pic_wrap .btm{padding:20px 30% 20px 0; height:120px; width:calc(100% - 100px);}
	.intro .pic_wrap .btm .bgtxt{padding:0; font-size:24px;}
	.intro .pic_wrap .btm .sign{font-size:16px;}
	.intro .pic_wrap .txt_box .para li{padding-right:40%; line-height:140%;}
	.intro .pic_wrap .pic{width:48%}
}
@media all and (max-width:480px){
	.intro .pic_wrap .txt_box .tit{padding:0;}
	.intro .pic_wrap .txt_box .tit li{font-size:20px; line-height:120%; padding:0 0 5px;}
	.intro .pic_wrap .txt_box .tit li:last-child{padding-right:0%;}
	.intro .pic_wrap .txt_box .hasimg:after{right:-40px;}
	.intro .pic_wrap .btm{padding:20px 25% 20px 10px; height:120px; width:calc(100% - 100px);}
	.intro .pic_wrap .btm .bgtxt{padding:0; font-size:24px;}
	.intro .pic_wrap .btm .sign{font-size:16px; line-height:120%;}
	.intro .blockoff{display:block;}
}
@media all and (max-width:420px){
	.intro .pic_wrap .btm .bgtxt{font-size:18px;}
	.intro .pic_wrap .txt_box .tit li{padding:0 0 10px;}
	.intro .pic_wrap .btm .sign{line-height:120%;}
	.intro .pic_wrap .txt_box .para li{padding-right:30%;}
}
@media all and (max-width:380px){
	.intro .pic_wrap .txt_box .tit{font-size:28px;}
	.intro .pic_wrap .btm .sign{font-size:15px;}
	.intro .pic_wrap .pic{width:56%}
	.intro .pic_wrap .btm{padding:20px 30% 20px 10px;}
}
@media all and (max-width:320px){
	.intro .pic_wrap .txt_box .para li{padding-right:10%;}
}
#sub_greeting .greeting p{font-size:17px; font-weight:200; padding:0 0 36px;}
#sub_greeting .greeting p span{display:block;}
#sub_greeting .greeting .bold{font-size:20px; font-weight:800;}
#sub_greeting .greeting .color{color:#2d7dc7; padding:0 0 5px;}

#sub_profile .pf:after{content:""; display:block; clear:both;}
#sub_profile .pf > li {float:left; position:relative; padding:15px 0 12px 130px; min-height:53px; box-sizing:border-box; border-bottom:1px solid #dddddd; width:47%;}
#sub_profile .pf > li:nth-child(2){float:right; padding:15px 0 12px 170px;}
#sub_profile .pf > li:nth-child(3){width:100%; padding:15px 0 12px 210px;}
#sub_profile .pf > li > em{position:absolute; left:30px; top:15px; font-weight:800; font-size:17px;}
#sub_profile .pf > li:before{content:""; position:absolute; left:10px; top:20px; width:10px; height:10px; background:#fff; border:3px solid #ffa7a9; border-radius:50%;}
#sub_profile .pf > li.career{width:100%; border:none; padding:15px 0 0 30px;}
#sub_profile .pf > li.career > em{position:static; font-size:17px;}
#sub_profile .pf > li.career > div{border:1px solid #ddd; margin:12px 0 0 -30px; padding:30px; box-sizing:border-box;}
#sub_profile .pf > li.career > div > ul > li{font-weight:200;}
#sub_profile .crr2 > li{display:flex;}
#sub_profile .crr2 > li > em{display:inline-block; width:20%; font-weight:800;}
@media all and (max-width:660px){
	#sub_profile .pf > li:nth-child(2){float:right; padding:15px 0 12px 130px;}
	#sub_profile .pf > li:nth-child(3){width:100%; padding:15px 0 12px 180px;}
	#sub_profile .crr2 > li > em{flex:0 0 auto; width:140px;}
}
@media all and (max-width:568px){
	#sub_profile .pf > li{padding:15px 0 12px 130px; width:100%;}
	#sub_profile .crr2 > li > em{display:block;}
	#sub_profile .pf > li > em{font-size:15px;}
	#sub_profile .crr2 > li{flex-direction:column;}
	#sub_profile .pf > li.career > div{padding:15px;}
}



/*연혁*/
#sub_history .his_box{margin:0 0 40px; padding:70px 55px; box-sizing:border-box; min-height:270px; border-radius:0 30px 0 0; background:url("/images/kr/intro/bg_his.jpg")no-repeat;}
#sub_history .his_box .tit{position:relative; display:inline-block; padding:0 0 24px; color:#fff; font-family:"Jalnan"; font-size:40px; text-transform:uppercase;}
#sub_history .his_box .tit:after{content:""; position:absolute; left:2px; bottom:0; width:60px; height:1px; background:#fff; opacity:0.2;}
#sub_history .his_box p{font-family:"gmarket"; padding:30px 0 0; font-size:17px; color:#fff; opacity:0.7; font-weight:200;}

#sub_history .his_wrap{position:relative; overflow:hidden;}
#sub_history .his_bar{position:absolute; left:270px; top:0; width:1px; height:100%; background:#a0c1ff;}
#sub_history .bar_active{position:absolute; transition:all .15s; left:-1px; top:0; width:3px; height:0; background:#4a74c6;}

#sub_history .timeline > li{display:flex; align-items:center; position: relative; padding: 40px 0 40px 65px; box-sizing: border-box;border-style: solid;border-width: 0px 0px 5px 0px;-moz-border-image: url("/images/kr/intro/brimg.png") 0 0 5 0 repeat repeat;-webkit-border-image: url("/images/kr/intro/brimg.png") 0 0 5 0 repeat repeat;-o-border-image: url("/images/kr/intro/brimg.png") 0 0 5 0 repeat repeat;border-image: url("/images/kr/intro/brimg.png") 0 0 5 0 repeat repeat;}
#sub_history .timeline .year{flex:0 0 auto; font-family:"gmarket"; position:relative; width:210px; box-sizing:border-box; font-size:40px; color:#293f69; font-weight:900;}
#sub_history .timeline .year:after{content:""; transition:all .8s; position:absolute; width:22px; height:22px; border:6px solid #9dbfff; border-radius:50%; background:#fff; right:-6.5px; top:50%; transform:translateY(-50%);}
#sub_history .timeline .year.active:after{border:6px solid #4a74c6;}
#sub_history .timeline > li > ul{padding:0 0 0 80px; box-sizing:border-box; width:100%;}
#sub_history .timeline > li > ul > li{font-family:"score"; font-weight:200; padding-bottom:10px;}
#sub_history .timeline > li > ul > li:before{top:10px; width:4px; height:4px; background:#ffa7a9;}
#sub_history .timeline .date{display:inline-block; width:155px; font-weight:400; flex:0 0 auto; font-size:16px;}
#sub_history .timeline .con{display:inline-block; vertical-align:top; width:calc(100% - 200px)}

@media all and (max-width:1280px){
	#sub_history .timeline .date{width:110px;}
	#sub_history .timeline .con{width:calc(100% - 150px)}
}
@media all and (max-width:768px){
	#sub_history .timeline > li{padding:30px 0 30px 35px;}
	#sub_history .timeline .year{width:160px; font-size:34px;}
	#sub_history .his_bar{left:190px;}
	#sub_history .timeline > li > ul{padding:0 0 0 40px;}
	#sub_history .timeline .date{width:90px;}
	#sub_history .timeline .con{width:calc(100% - 100px)}
}
@media all and (max-width:568px){
	#sub_history .his_box{padding:35px 25px; background-position:60%}
	#sub_history .his_box .tit{font-size:32px; line-height:140%;}

	#sub_history .timeline > li{padding:15px 0 15px 20px;}
	#sub_history .timeline .year{width:120px; font-size:28px;}
	#sub_history .his_bar{left:135px;}
	#sub_history .timeline > li > ul{padding:0 0 0 20px;}
	#sub_history .timeline .date{width:90px;}
	#sub_history .timeline .con{width:calc(100% - 100px)}
}
@media all and (max-width:480px){
	#sub_history .timeline .date{display:block;}
	#sub_history .timeline .con{display:block; width:100%;}
}
@media all and (max-width:380px){
	#sub_history .timeline > li{padding:10px 0 10px 10px;}
	#sub_history .timeline .year{width:90px; font-size:22px;}
	#sub_history .timeline .year:after{width:16px; height:16px; border:4px solid #9dbfff}
	#sub_history .timeline .year.active:after{border:4px solid #4a74c6}
	#sub_history .his_bar{left:98px;}
}

.txt_wrap:not(:last-child){padding:0 0 50px;}
.txt_wrap > ul,
.txt_wrap > p{padding:0 0 20px 18px;}
.txt_wrap > ul:last-child, .txt_wrap > p:last-child{padding:0 0 0 18px;}
.txt_wrap > div:not(:last-child){margin:0 0 30px;}
.txt_wrap > ul > li > ul{padding:0 0 25px 10px;}
.txt_wrap > ul > li:last-child > ul:last-child{padding:0 0 0 10px;}
.txt_wrap > .table_wrap{margin:0;}
@media all and (max-width:568px){
	.txt_wrap:not(:last-child){padding:0 0 35px;}
	.txt_wrap > ul, .txt_wrap > p{padding:0 0 15px 10px;}
	.txt_wrap > ul:last-child, .txt_wrap > p:last-child{padding:0 0 0 10px;}
	.txt_wrap > div:not(:last-child){margin:0 0 20px;}
	.txt_wrap > ul > li > ul{padding:0 0 15px 10px;}
}

/*구성조직*/
.sub_tit{position:relative; display:inline-block; padding:0 0 10px 16px; font-size:18px; color:#333333; font-family:"score"; font-weight:400;}
.sub_tit:before{content:""; position:absolute; left:0px; top:9px; width:8px; height:8px; border:3px solid #2d7dc7;}
@media all and (max-width:568px) {
	.sub_tit{padding:0 0 10px 20px; font-size:17px;}
	.sub_tit:before{left:4px;}
}		

#sub_org .box_info{padding:50px 85px 85px 85px;}
#sub_org .org{position:relative; height:660px;}
#sub_org li > span{position:absolute; z-index:5; display:flex; justify-content:center; align-items:center; text-align:center; line-height:120%; width:26.21%; height:55px; background-size:cover; background-position:center; background-repeat:no-repeat; color:#fff; font-weight:500; font-size:18px; border-radius:10px;}
#sub_org .org1 > span{left:50%; top:0; transform:translateX(-50%); width:194px; height:151px; background-image:url("/images/kr/intro/bg_org1.png");}
#sub_org .org2 > span{left:63.4%; top:145px; background-image:url("/images/kr/intro/bg_org2.jpg");}
#sub_org .org3 > span{top:240px; background-image:url("/images/kr/intro/bg_org3.jpg");}
#sub_org .org3:first-child > span{left:3.9%;}
#sub_org .org3:last-child > span{left:71.5%;}
#sub_org .org4 > span{left:3.9%; background-image:url("/images/kr/intro/bg_org4.jpg"); color:#333;}
#sub_org .org4 > span:nth-child(1){top:315px;}
#sub_org .org4 > span:nth-child(2){top:387px;}
#sub_org .org4 > span:nth-child(3){top:460px;}
#sub_org .org5 > span{left:50%; transform:translateX(-50%); top:400px; background-image:url("/images/kr/intro/bg_org5.jpg");}
#sub_org .org6 > span{left:63.78%; top:482px; background-image:url("/images/kr/intro/bg_org6.jpg");}
#sub_org .org7 > span{top:606px; width:24%; background-image:url("/images/kr/intro/bg_org4.jpg"); color:#333;}
#sub_org .org7 > span:nth-child(1){left:0;}
#sub_org .org7 > span:nth-child(2){left:25.47%;}
#sub_org .org7 > span:nth-child(3){left:50.50%;}
#sub_org .org7 > span:nth-child(4){left:75.64%;}

#sub_org li:after{content:""; position:absolute; background:#ddd;}
#sub_org .org1:after{left:50%; top:110px; width:1px; height:490px; z-index:0;}
#sub_org .org2:after{left:50%; top:174px; width:14%; height:1px;}
#sub_org .org3:after{left:16.75%; top:265px; width:60.97%; height:220px; background:#fff; border:1px solid #ddd; border-right:0; border-bottom:0;}
#sub_org .org4:after{left:50%; top:509px; width:14%; height:1px;}
#sub_org .org5:after{left:12.29%; top:578px; width:75.75%; height:60px; z-index:3; background:#fff; border:1px solid #ddd; border-bottom:0;}
#sub_org .org7 > span:nth-child(2):after{content:""; position:absolute; left:50%; top:-28px; width:1px; height:28px; background:#ddd;}
#sub_org .org7 > span:nth-child(3):after{content:""; position:absolute; left:50%; top:-28px; width:1px; height:28px; background:#ddd;}

@media all and (max-width:768px){
	#sub_org .box_info{padding:50px 60px;}
	#sub_org li > span{font-size:16px}
}
@media all and (max-width:590px){
	#sub_org .box_info{padding:50px 20px;}
	#sub_org li > span{font-size:15px}
}
@media all and (max-width:490px){
	#sub_org .org{height:790px;}
	#sub_org .org2 > span{width:35%;}
	#sub_org .org3:first-child > span{left:0%;}
	#sub_org .org3:nth-child(2) > span{left:55%;}
	#sub_org .org3 > span{width:45%;}
	#sub_org .org3:after{height:160px; left:22%;}
	#sub_org .org4 > span{left:0%; width:45%;}
	#sub_org .org4 > span:nth-child(1){top:300px;}
	#sub_org .org4 > span:nth-child(2){top:360px;}
	#sub_org .org4 > span:nth-child(3){top:420px;}
	#sub_org .org5 > span{top:490px; width:40%;}
	#sub_org .org1:after{height:530px;}
	#sub_org .org6 > span{top:550px; width:40%;}
	#sub_org .org4:after{top:575px; width:20%;}
	#sub_org .org5:after{display:none;}
	#sub_org .org7 > span{top:628px; width:70%; transform:translate(-50%); height:40px;}
	#sub_org .org7 > span:nth-child(1){left:50%;}
	#sub_org .org7 > span:nth-child(2){left:50%; top: 672px;}
	#sub_org .org7 > span:nth-child(3){left:50%; top:716px;}
	#sub_org .org7 > span:nth-child(4){left:50%; top:760px;}
	#sub_org .org7 > span:nth-child(2):after{display:none;}
	#sub_org .org7 > span:nth-child(3):after{display:none;}

}

/*오시는길 위치*/
#sub_location .roughmap_maker_label {border-radius:30px; overflow:hidden;}
#sub_location .roughmap_maker_label .roughmap_lebel_text {font-size:0; padding: 10px; box-sizing:border-box;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:before {content:''; display:inline-block; vertical-align:middle; margin:0 5px 0 0; width:30px; height:30px; background:url(/images/common/ico_logo.png)no-repeat; background-size:cover;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:after {content:'YANGCHEON-GU COUNCIL'; display:inline-block; vertical-align:middle; font-family:'score'; font-size:20px; font-weight:600;}

#sub_location .map_border{display:none;}
#sub_location .root_daum_roughmap{width:100%; font-size:0; line-height:0;}
#sub_location .map_wrap{position:relative; width:100%;}
#sub_location .map_info{position:absolute; left:0; bottom:0; z-index:5; box-sizing:border-box; padding:20px 50px; width:90.56%; height:85px; background:linear-gradient(45deg, #2d7dc7 70%, #477bd6); border-radius:0 20px 0 0;}
#sub_location .map_info ul{display:flex; justify-content:space-between; align-items:center; height:100%;}
#sub_location .map_info ul li{position:relative; display:flex; align-items:center; box-sizing:border-box; padding:0 0 0 60px; height:100%;}
#sub_location .map_info ul li span{color:#fff; font-size:16px; font-weight:400;}
#sub_location .map_info ul > li + li{margin:0 0 0 10px;}
#sub_location .map_info ul li:nth-child(2),
#sub_location .map_info ul li:nth-child(3){flex:1 0 auto;}
#sub_location .map_info ul li:before{content:""; position:absolute; left:0; top:0; width:48px; height:48px; background-repeat:no-repeat; background-size:cover; background-position:center;}
#sub_location .map_info ul li:nth-child(1):before{background-image:url("/images/kr/intro/ico_loca1.png")}
#sub_location .map_info ul li:nth-child(2):before{background-image:url("/images/kr/intro/ico_loca2.png")}
#sub_location .map_info ul li:nth-child(3):before{background-image:url("/images/kr/intro/ico_loca3.png")}
@media all and (max-width:1280px){
	#sub_location .map_info{padding:20px 25px;}
}
@media all and (max-width:768px){
	#sub_location .map_info ul li span{font-size:15px; line-height:120%}
}
@media all and (max-width:655px){
	#sub_location .map_info{height:120px; padding:5px 20px;}
	#sub_location .map_info ul{flex-direction:column; align-items:flex-start;}
	#sub_location .map_info ul li:nth-child(2),
	#sub_location .map_info ul li:nth-child(3){flex:1 1 auto;}
	#sub_location .map_info ul > li + li{margin:0;}
	#sub_location .map_info ul li{padding:0 0 0 40px;}
	#sub_location .map_info ul li:before{width:30px; height:30px;}
}
@media all and (max-width:445px){
	#sub_location .map_info{padding:5px 20px 5px 10px;}
	#sub_location .map_info ul li:nth-child(1) span{word-break:keep-all; width:95%;}
	#sub_location .map_info ul li:before{width:25px; height:25px;}
}
@media all and (max-width:400px){
	#sub_location .map_info ul li:nth-child(1) span{width:75%;}
}

#sub_location .box_border{position:relative; display:flex; padding:28px 0 28px 285px; border:1px solid #ddd; border-radius:20px; word-break:keep-all;}
#sub_location .box_border:before,
#sub_location .box_border:after{content:""; position:absolute; left:76px; top:50%; transform:translateY(-50%);}
#sub_location .box_border:before{background-repeat:no-repeat; background-size:cover; background-position:center;}
#sub_location .box_border:after{left:230px; width:1px; height:120px; background:#ddd;}
#sub_location .box_border .colon{padding:0 3px;}
#sub_location .box_border > ul > li{display:flex;}

#sub_location .bus1 > ul{width:100%;}
#sub_location .bus1 > ul > li + li{margin:10px 0 0;}
#sub_location .bus1 .color{color:#2d7dc7; font-weight:500; flex:0 0 auto;}

#sub_location .subway > ul{width:100%;}
#sub_location .subway strong{flex:0 0 auto;}

#sub_location .bus2 > ul{width:100%;}

#sub_location .bus1:before{width:80px; height:80px; background-image:url("/images/kr/intro/bg_bus1.png")}
#sub_location .subway:before{width:79px; height:81px; background-image:url("/images/kr/intro/bg_subway.png")}
#sub_location .bus2:before{width:78px; height:68px;  background-image:url("/images/kr/intro/bg_bus2.png")}

@media all and (max-width:768px){
	#sub_location .box_border{padding:20px 0 20px 27%}
	#sub_location .box_border:after{left:23%}
	#sub_location .box_border:before{left:6%;}
	#sub_location .bus1:before{width:60px; height:60px;}
	#sub_location .subway:before{width:59px; height:61px;}
	#sub_location .bus2:before{width:58px; height:49px;}

	#sub_location .bus1 > ul > li{flex-direction:column;}
	#sub_location .subway > ul > li{flex-direction:column;}

}
@media all and (max-width:568px){
	#sub_location .box_border:after{display:none;}
	#sub_location .box_border:before{position:static; margin:0 auto 15px auto; transform:none;}
	#sub_location .box_border{flex-direction:column; padding:20px;}
}