@charset "utf-8";

/* 서브공통 */
h4 + .txt_wrap {padding: 0 0 0 32px;margin: 0 0 45px;box-sizing: border-box;}

.line_box {position: relative; margin: 0 0 45px; padding: 40px 5.6%; border: 1px solid #b3bed0; box-sizing: border-box; border-radius: 20px;}
.line_box:before, .line_box:after{content: ''; display: block; position: absolute; bottom: -1px; left: -1px; background: #fff; width: 20px; height: 60px;}
.line_box:after {bottom: -3px; width: 342px; height: 7px; background: #fff url(/images/kr/common/bg_linebox.png)no-repeat center;}
.line_box .txt {position: relative; padding: 0 0 0 155px; box-sizing: border-box;}
.line_box .txt:before {content: ''; display: block; position: absolute; top: 0; left: 0; width: 104px; height: 104px; background:#f5f5f5 url(/images/kr/intro/ico_fun1.png)no-repeat center; border-radius: 32px;}
.line_box .txt {font-size: 15px; line-height: 1.6;}
.line_box .txt h5 {margin: 0 0 15px;font-size: 23px; font-weight: 500; color: #000;}
.line_box .txt ul li {padding-bottom: 3px;}
.line_box .txt em {color: #3e5477;}

.dot > li:before{content:''; display:block; position:absolute; top:6px; left:0; height:11px; width:11px; border-radius:50%; background:#fff; border: 3px solid #3e5477;}

h4 + .box_info {margin: 0 0 40px;}


@media all and (max-width:1024px){
    .line_box .txt {padding: 0 0 0 140px;}
    .line_box .txt h5 {font-size: 21px;}
}
@media all and (max-width:768px){
    .line_box .txt {padding: 0 0 0 120px;}
    .line_box .txt:before {width: 94px; height: 94px; border-radius: 25px;}
}
@media all and (max-width:568px){
    h4 + .txt_wrap {padding: 0 0 0 3px; margin: 0 0 30px;}
    
    .line_box {margin: 0 0 35px; padding: 30px 5%;}
    .line_box .txt {padding: 0;}
    .line_box .txt:before {display: none;}
    .line_box .txt h5 {font-size: 20px;}
    
    .dot > li:before{width: 8px; height: 8px; top: 7px; border-width: 2px;}
}

/* 의장 인사말, 약력 */
#sub_greeting .pic_wrap {position: relative; height: 290px; background: #f2f2f2 url(/images/kr/intro/bg_greeting.png)no-repeat bottom right; border-radius: 6.5px; box-sizing: border-box;}
#sub_greeting .txt {position: relative;float: left;padding: 60px 0 0 90px;z-index: 1;}
#sub_greeting .txt:after {content: '';display: block;position: absolute;top: 53px;left: 58px;width: 50px;height: 36px;background: url(/images/kr/intro/bg_tit.png)no-repeat;z-index: -1;}
#sub_greeting .txt strong {font-size: 28px;font-weight: 300;}
#sub_greeting .txt strong em{font-weight: 500; color: #0e336f;}
#sub_greeting .txt p {margin: 20px 0 0;font-size: 15px;color: #555;line-height: 1.6;}
#sub_greeting .pic {position: absolute; bottom: 0; right: 164px;}
#sub_greeting .name {position: absolute;bottom: -29px;right: 100px;display: flex;flex-wrap: wrap;flex-direction: column;justify-content: center;padding: 0 24px;width: 184px;height: 88px;background: #3e5477;border-radius: 10px;font-size: 14px;color: #fff;box-sizing: border-box;text-align: left;}
#sub_greeting .name em {display: block;margin: 5px 0 0;font-size: 16px;font-weight: 600;}

#sub_greeting .txt_wrap {margin: 70px 0 0; line-height: 1.6;}
#sub_greeting .sign {display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin: 42px 0 0;font-size: 18px;}
#sub_greeting .sign img {margin: 0 0 0 10px;}

@media all and (max-width:1440px){
    #sub_greeting .txt {padding: 60px 0 0 70px;}
    #sub_greeting .txt:after {left: 38px;}
    #sub_greeting .pic {right: 100px;}
    #sub_greeting .name {right: 60px;}
}
@media all and (max-width:1340px){
    #sub_greeting .pic {right: 70px;}
    #sub_greeting .pic img {width: 300px;}
    #sub_greeting .name {right: 50px;}
}
@media all and (max-width:870px){
    #sub_greeting .pic_wrap {height: 260px;}
    #sub_greeting .txt {padding: 50px 0 0 40px;}
    #sub_greeting .txt:after {top: 40px; left: 30px;}
    #sub_greeting .txt strong {font-size: 24px;}
    #sub_greeting .pic {right: 40px;}
    #sub_greeting .pic img {width: 260px;}
    #sub_greeting .name {right: 20px;}
}
@media all and (max-width:768px){
    #sub_greeting .pic_wrap {height: auto;}
    #sub_greeting .txt {padding: 45px 10px 20px;width: 100%;text-align: center;box-sizing: border-box;}
    #sub_greeting .txt:after {left: 34%;}
    #sub_greeting .txt p {margin: 15px 0 0;}
    #sub_greeting .pic {position: static; text-align: center;}
	#sub_greeting .name {right:20%;}
}
@media all and (max-width:568px){
	#sub_greeting .txt:after {left: 24%;}
	#sub_greeting .txt strong {font-size:22px;}
	#sub_greeting .txt p {font-size:14px;}
	#sub_greeting .pic img {width:240px;}
	#sub_greeting .name {right:20%;padding: 0 15px;width: auto;height: 80px;font-size: 12px;}
	#sub_greeting .name em {font-size: 14px;}
    
    #sub_greeting .sign {font-size: 16px;}
    #sub_greeting .sign img {width: 90px;}
}
@media all and (max-width:420px){
	#sub_greeting .txt:after {width:40px; background-size:contain;}
	#sub_greeting .txt strong {font-size:20px;}
	#sub_greeting .txt p {word-break:keep-all;}
	#sub_greeting .txt p br{display:none;}
}
@media all and (max-width:340px){
	#sub_greeting .txt p {font-size:13px;}
	#sub_greeting .pic img {width:220px;}
}

/* 의회연혁 */
#sub_history .tit_wrap {padding: 65px 90px;height: 220px;color: #fff;text-align: right;background: url(/images/kr/intro/bg_history.jpg)no-repeat center;background-size: cover;box-sizing: border-box;border-radius: 10px;}
#sub_history .tit_wrap span {font-size: 20px; color: #ffdda6; letter-spacing: 0.11em;}
#sub_history .tit_wrap strong {display: block; margin: 6px 0 14px; font-size: 25px;font-weight: 500;}

#sub_history .his_wrap {position: relative; margin: 50px 0 0; overflow: hidden;}
#sub_history ul {position: relative;box-sizing: border-box;}
#sub_history .bar, #sub_history .bar2 {position: absolute; width: 3px; height: 100%; top: 0;  left: 23.8%;}
 #sub_history .bar2{left: 23.86%;width: 1px; height: 100%; background: #a0c1ff; z-index: -1;}
#sub_history ul li {position: relative; display: flex; flex-wrap: wrap; align-items: center;}
#sub_history ul li:after, #sub_history ul li:before{content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: url(/images/kr/intro/bg_line.png);}
#sub_history ul li:before {bottom: 50%;left: 22.9%;transform: translateY(50%);width: 22px;height: 22px;border-radius: 50%;background: #fff;border: 6px solid #9dbfff;box-sizing: border-box;z-index: 1;}
#sub_history ul li.on:before {border-color: #4a74c6;}
#sub_history ul li em {display: block;width: 23.86%;font-family: 'gmarket';font-size: 40px;font-weight: 900;color: #293f69;text-align: center;}

#sub_history .right {padding: 40px 0 40px 6.6%; width: 75.94%; box-sizing: border-box;}
#sub_history .txt h5{font-size: 25px; font-weight: 500; color: #333;}
#sub_history .txt p {padding: 0 20px 0 0;font-size: 15px; font-weight: 200; word-break: keep-all; box-sizing: border-box;}
#sub_history .pic_wrap {display: flex; flex-wrap: wrap; margin: 20px 0 0;}
#sub_history .pic_wrap > div {position: relative; width: 41.14%; height: 190px; border-radius: 10px; overflow: hidden;}
#sub_history .pic_wrap > div:first-child {margin: 0 40px 0 0;}
#sub_history .pic_wrap > div img {width: 100%; height: 100%; object-fit: cover;}
#sub_history .pic_wrap > div p {position: absolute; bottom: 0; left: 0; display: flex; flex-wrap: wrap; align-items: center; padding: 0 2px 0 20px; width: 100%; height: 36px; font-size: 14px; font-weight: 400; color: #fff; background: rgba(21,42,83,0.8); z-index: 1; box-sizing: border-box;}

@media all and (max-width:1024px){
    #sub_history ul li em {font-size: 34px;}
}
@media all and (max-width:768px){
	#sub_history .tit_wrap {padding: 40px;height: auto;}
	#sub_history .tit_wrap span {font-size:16px;}
	#sub_history .tit_wrap strong {font-size:23px;}
	#sub_history ul {padding:0 0 0 50px;}
	#sub_history ul:after {left:20px}
	#sub_history ul li {display: block;padding: 25px 0 30px;}
    #sub_history ul li:before {bottom: auto; top: 18px; left: -40px; border-color: #4a74c6;}
	#sub_history ul li em {width: 100%;text-align: left;font-size:30px;}
	#sub_history .right {padding: 10px 0 0;width: 100%;}
	#sub_history .txt h5 {font-size:23px;}
	#sub_history .pic_wrap > div {width:47%;}
	#sub_history .pic_wrap > div:first-child {margin:0 3% 0 0;}
	#sub_history .bar, #sub_history .bar2 {left:19.5px; height: 100% !important;}
}
@media all and (max-width:568px){
	#sub_history .tit_wrap {padding: 25px 30px;}
	#sub_history .tit_wrap span {font-size:14px;}
	#sub_history .tit_wrap strong {margin: 5px 0 10px;font-size:20px;}
	#sub_history ul li:before {top:16px;}
	#sub_history ul li em {font-size:26px;}
	#sub_history .txt h5 {font-size:20px; margin:0 0 5px;}
	#sub_history .pic_wrap > div {width:100%;}
	#sub_history .pic_wrap > div:first-child {margin:0 0 10px;}
}




/* 의회구성 */
#sub_org .line_box .txt:before{background-image: url(/images/kr/intro/ico_org.png);}
.org {position: relative;height: 550px;margin: 0 0 50px;}
.org li:after {content: '';display: block;position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 1px;height: 270px;background: #ddd;z-index: -1;}
.org .org2:after {top: 178px;left: 35%;width: 30%;height: 1px;}
.org .org3:after {top: 269px;left: 55%;width: 65%;height: 1px;}
.org .org4:after {top: 365px;left: 24.5%;width: 23%;height: 34px;background:none;border: 1px solid #ddd;border-bottom: none;}
.org .org4_2:after {top:270px; left: 24.5%; width: 1px; height:96px;}
.org .org6:after {top: 288px;left: 88.5%;width: 1px;height: 30px;}

.org li > em, .org .wrap {position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 18%;}
.org li > em, .org .wrap > em {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;height: 56px;font-size: 17px;color: #fff;border-radius: 10px;background: #496da6 url(/images/kr/intro/bg_org2.png)no-repeat bottom right;}
.org .org1 > em {width: 116px;height: 116px;border-radius: 50%;font-size: 18px;background: #1a335b;}
.org .org1 > em:before, .org .org1 > em:after {content: '';display: block;position: absolute;top: 0;left: -35%;width: 285px;height: 120px;background: url(/images/kr/intro/bg_org1.png)no-repeat;z-index: 1;}
.org .org1 > em:after {top: -14px;left: -14px;width: 146px;height: 146px;border-radius: 50%;background: transparent;border: 2px solid #e9ecf3;z-index: -1;}
.org .org2 > em {top: 149px;left: 25%;}
.org .org3 > em {top: 239px; left:25%; background-color: #519ba2;}
.org .org4 em {background-color: #a3b1b2;}
.org .org5 em {background-color: #51a26c;}
.org .org6 em {background-color: #9eb1a4;}
.org .wrap {border:1px solid #cedadb;border-radius:10px;overflow: hidden;}
.org .org4 .wrap {top: 399px;left: 12%;}
.org .org4_2 .wrap {left: 36%;}
.org .org4_3 .wrap {top: 470px;left: 12%;}
.org .org4_4 .wrap {top: 470px;left:36%;}
.org .org5 .wrap {top: 239px;left: auto;right: 0;transform: translateX(0);border-color:#c8d4cb;}
.org .org6 .wrap {top: 312px;left: auto;right: 0;border-color:#c8d4cb;}

.org .wrap div {padding: 15px 8.32%;min-height:180px;box-sizing:border-box;background: #fff;}
.org .org5 > .wrap div {min-height:78px;}
.org .wrap em {border-radius:10px 10px 0 0;}

.org .dash > li {position: relative;font-size: 15px;padding-bottom: 2px;}
.org .dash > li:after {display: none;}

@media all and (max-width:800px){
	.org, .org_2 {height:auto; margin: 0 0 50px;}
	.org li > em, .org .wrap {position:static;transform:translateX(0);width:100%;margin: 25px 0 0;}
	.org .org1 > em {margin: 0 auto 40px;}
	.org .org4 .wrap {width: 100%;}
	.org .org4 .wrap, .org .org6 .wrap {margin:10px 0 0;}
	.org .wrap div, .org .org5 > .wrap div{padding: 20px; min-height:auto;}

	.org li:not(.org1):after {display:none;}
	.org li:after {height:100%}
}
@media all and (max-width:568px){
	.org li > em, .org .wrap > em {height:46px;font-size: 15px;}
	.org .wrap div, .org .org5 > .wrap div{padding:10px 15px;}
	.org .dash > li {font-size:14px;}
}

/* 찾아오시는길 */
#sub_location .root_daum_roughmap_landing {border-radius: 10px 10px 0 0;}
#sub_location .root_daum_roughmap .map_border {display: none;}
#sub_location .roughmap_maker_label {border-radius: 25px;}
#sub_location .roughmap_maker_label .roughmap_lebel_text {padding: 0 20px 15px 20px; font-size: 0; border-radius: 25px;}
#sub_location .map {position: relative; margin: 0 0 90px;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:after {content:'江南区議会'; display: block; font-family: 'score'; font-weight: 600; font-size: 20px;}
#sub_location .addr {position: absolute; bottom: -50px; right: 30px; padding: 20px 30px; width: 454px; height: 133px; border-radius: 10px 10px 50px 10px; background: #a58558; z-index: 2; box-sizing: border-box;}
#sub_location .addr li {position: relative;display: flex;flex-wrap: wrap;align-items: center;margin: 0 0 10px;padding: 0 0 0 50px;height: 40px;color: #fff;}
#sub_location .addr li:before {content: '';display: block;position: absolute;top: 50%;left: 0;transform: translateY(-50%);width: 40px;height: 40px;border-radius: 50%;background: #735d3d url(/images/kr/intro/ico_map.png)no-repeat center;}
#sub_location .addr li:nth-child(2):before {background-image: url(/images/kr/intro/ico_call.png);}

#sub_location .dot em {color: #3e5477;}

@media all and (max-width:768px){
    #sub_location .root_daum_roughmap .wrap_map {height: 350px !important;}
}
@media all and (max-width:568px){
    #sub_location .root_daum_roughmap .wrap_map {height: 300px !important;}
    #sub_location .map {margin: 0 0 35px;}
    #sub_location .addr {position: static;width: 100%;height: auto;border-radius: 0 0 20px 0;padding: 15px 5% 5px;}
	#sub_location .addr li:before {width:30px;height:30px;background-size: auto 14px;}
}
@media all and (max-width:420px){
    #sub_location .root_daum_roughmap .wrap_map {height: 280px !important;}
}

/* 의원소개 */
#sub_active{float:left; width:100%;}
#sub_active .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: 180px;}
.profile .name {overflow:hidden; width:100%; padding:8px 0 20px 0; display:block;line-height:30px;font-size: 25px;font-weight:900;color:#000;letter-spacing:-2px;}
.profile dd ul{clear:both; width:100%;}
.profile dd li{position:relative;padding: 0 0 4px 10px;line-height:135%;box-sizing:border-box;}
.profile dd li *{display:inline-block; vertical-align:top;}
.profile dd li:before{border:none;background: #ff9f00;top: 8px;width: 4px;height: 4px;}
.profile dd li span{word-break:break-all;}
.profile .btns {display: none;}


@media all and (max-width:1230px) {
	.profile dt{left:4.5%; width:35%; max-width:140px;}
	.profile .name{padding:3px 0 20px; line-height:32px; font-size:23px;}
	.profile .name strong{}
}
@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:187px;}
	.profile .name{padding:0 0 15px; font-size:25px;}
	.profile .name strong{}
	.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 {font-size:23px;}
}
@media all and (max-width:568px) {
	.profile dl{padding:0 0 23px 38%;}
	.profile .name{padding:0 0 12px;}
	.profile .name{font-size:21px;}
	.profile dd li:before{top:7px;}
}
@media all and (max-width:357px) {
	.profile .name {font-size:20px;}
}