@charset "utf-8";
#sub_default{line-height:160%; font-weight:300; font-size: 18px;}

/* 서브공통 */
.txt_wrap{padding:0 0 40px 28px;}
.txt_wrap strong {display: block; margin-bottom: 3px;}
.txt_wrap .dot > li {padding-bottom: 3px;}
.txt_wrap .dot .dash {padding: 0 0 0 13px;}
.txt_wrap .bold {font-weight: 500;}
.txt_wrap .blue {font-weight: 600; color: #445990}

.box_info {margin: 0 0 50px;padding: 25px 30px; background: #f6f8f1; border-radius: 10px; box-sizing: border-box; word-break: keep-all;}

@media all and (max-width:1024px) {
    #sub_default {font-size: 16px;}
}
@media all and (max-width:568px) {
    #sub_default {font-size: 15px;}
    .txt_wrap {padding: 0 0 30px 22px;}
    .box_info {padding: 20px; margin: 0 0 20px;}
}
@media all and (max-width:430px) {
	#sub_default {font-size: 14px;}
}


/* 의장 인사말, 약력 */
.intro .pic_wrap {position: relative; height: 350px;}
.intro .pic_wrap:after {content: '';display: block;position: absolute;top: 50px;left: 50px;width: 1350px;height: calc(100% - 50px);background: url(/images/kr/chairman/bg_chairman.jpg)no-repeat center;background-size: cover;z-index: -1;}
.intro .pic_wrap .txt {padding: 30px 20px 0 45px;width: 700px;height: 300px;background: rgba(255,103,96,0.7);color: #fff;box-sizing: border-box;}
.intro .pic_wrap .txt p {margin: 0 0 25px;font-size: 25px;line-height: 1.5;text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.35);}
.intro .pic_wrap .txt p em {font-size: 30px;font-weight: 600;color: #cbfee1;}
.intro .pic_wrap .txt span {display:block;margin: 0 0 15px;font-weight: 400;font-size: 16px;line-height:1.3;}
.intro .pic_wrap .txt span.small {display: block;margin: 3px 0 0;font-weight: 300;font-size: 12px;line-height: 1.3;letter-spacing: -0.025em;word-break: keep-all;}
.intro .pic_wrap .pic {position: absolute; bottom: 0; right: 0;}

#sub_greeting .greeting {margin: 49px 0 0; font-size: 18px; line-height: 1.6;}
#sub_greeting .greeting .name {margin: 50px 0 0; text-align: right; font-size: 25px; line-height: 1;}
#sub_greeting .greeting .name em {font-size:30px; font-weight:600;}

#sub_profile .dot {margin: 50px 0 0;}
#sub_profile .dot > li {float: left; width: 45.23%; margin: 0 0 15px; padding: 0 0 15px 142px; border-bottom: 1px dashed #ccc; line-height: 1;}
#sub_profile .dot > li:nth-child(2n) {float: right;}
#sub_profile .dot > li:before {top: 1px; width: 18px; height: 18px; border: 5px solid #445990; background: #fff;}
#sub_profile .dot > li em {position: absolute; top: 0; left: 27px; font-weight: 600;}
#sub_profile .dot > li.list {width: 100%; padding: 0; border: none;}
#sub_profile .ls2 {letter-spacing: 32px;}
#sub_profile .ls3 {letter-spacing: 7px;}
#sub_profile .career {margin: 33px 0 0; padding: 27px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;}
#sub_profile .career span {display: block; margin: 0 0 10px;}
#sub_profile .career .dash:not(:last-child) {margin: 0 0 35px;}
#sub_profile .career .dash > li {padding-bottom: 10px;}

@media all and (max-width:1024px) {
    .intro .pic_wrap {height: 320px;}
    .intro .pic_wrap .txt {padding: 25px 20px 0 40px;height: 270px;}
    .intro .pic_wrap .txt p {font-size: 22px;margin: 0 0 20px;}
    .intro .pic_wrap .txt p em {font-size: 26px;}
    .intro .pic_wrap .pic img {height: 320px;}
    
    #sub_greeting .greeting {font-size: 16px;}
}
@media all and (max-width:768px) {
    .intro .pic_wrap {height: 400px;}
    .intro .pic_wrap:after {top: 100px; width: 100%; height: calc(100% - 100px);}
    .intro .pic_wrap .txt {padding: 35px 4%;width: 75%;height: auto;}
    .intro .pic_wrap .txt p {margin:0;font-size: 18px;}
    .intro .pic_wrap .txt p em {font-size: 21px;}
    .intro .pic_wrap .pic img {height: 260px;}
	.intro .pic_wrap .txt span, .intro .pic_wrap .txt span.small {display:none;}
    
    #sub_greeting .greeting .name {font-size: 20px;}
    #sub_greeting .greeting .name em {font-size:25px;}
    
    #sub_profile .dot > li {width: 100%; padding-left: 130px;}
    #sub_profile .dot > li:before {top: 0; width: 15px; height: 15px; border-width: 4px;}
    #sub_profile .dot > li em {left: 20px; font-size: 17px;}
    #sub_profile .ls2 {letter-spacing: 31px;}
    #sub_profile .ls3 {letter-spacing: 6px;}
    #sub_profile .career {padding: 20px 25px;}
    #sub_profile .career .dash:not(:last-child) {margin: 0 0 20px;}
}
@media all and (max-width:568px) {
	.intro .pic_wrap {height: 390px;}
    .intro .pic_wrap .txt {padding: 25px 5%;width: 95%;}
    .intro .pic_wrap .txt p em{font-size: 20px;}
    .intro .pic_wrap .txt span.small br{display: none;}
    .intro .pic_wrap .pic img {height: 250px;}
    
    #sub_greeting .greeting .name {margin: 30px 0 0; font-size: 18px;}
    #sub_greeting .greeting .name em {display: block; margin: 5px 0 0; font-size:22px;}
    
    #sub_greeting .greeting {font-size: 15px;}
    #sub_profile .dot > li {padding-left: 115px;}
    #sub_profile .dot > li em {font-size: 16px;}
    #sub_profile .ls2 {letter-spacing: 28px;}
}
@media all and (max-width:430px) {
	.intro .pic_wrap {height:350px;}
    .intro .pic_wrap:after {left: 25px;}
    .intro .pic_wrap .txt {width: 98%;}
    .intro .pic_wrap .txt p {font-size: 15px;}
    .intro .pic_wrap .txt p em{font-size: 17px;}
    .intro .pic_wrap .pic img {height: 220px;}
    
    #sub_greeting .greeting .name {font-size: 17px;}
    #sub_greeting .greeting .name em {font-size:20px;}
    
    #sub_greeting .greeting {font-size: 14px;}
}

/* 의회연혁 */
#sub_history .tit_wrap {margin: 0 0 50px;width: 100%; height: 100px; text-align: center; background: url(/images/en/sub/bg_history.jpg)no-repeat center;}
#sub_history .history_wrap {position: relative;}
#sub_history .history_wrap:after {content: ''; display: block; position: absolute; top: 20px; left: 230px; width: 4px; height: calc(100% - 20px); background: #d8ecf4;}
#sub_history .history_wrap > li {position: relative;}
#sub_history .history_wrap > li:not(:first-child) {margin: 100px 0 0;}
#sub_history .history_wrap > li:after {content: ''; display: block; position: absolute; top: 5px; left: 220px; width: 24px; height: 24px; background: url(/images/kr/intro/ico_bl.png)no-repeat; z-index: 1;}
#sub_history strong {position: absolute; font-size: 30px; font-weight: 300; color: #3ba0c6; font-style: italic;}

#sub_history .list {padding: 0 0 0 290px;}
#sub_history .list li {position: relative; padding: 0 0 10px 167px;}
#sub_history .list li:last-child {padding-bottom: 0;}
#sub_history .list em {position: absolute; top: 0; left: 0; font-weight: 600;}

@media all and (max-width: 768px){
    #sub_history .history_wrap:after {left: 10px;}
	#sub_history .history_wrap > li:not(:first-child) {margin:50px 0 0;}
    #sub_history .history_wrap > li:after {top: 3px;left: 0;}
    #sub_history strong {left:35px; font-size: 26px;}
    #sub_history .list {padding: 50px 0 0 40px;}
    #sub_history .list li {padding-left: 140px;}
    
}
@media all and (max-width:568px){
    #sub_history .tit_wrap {margin: 0 0 35px;height: auto;}
    #sub_history .tit_wrap img {max-width:80%;}
    #sub_history .history_wrap > li:after {top: 0;}
    #sub_history strong {font-size: 24px;}
    #sub_history .list {padding-top: 40px;}
    #sub_history .list li {padding: 20px 0 10px;}
}
@media all and (max-width:430px){
    #sub_history strong {font-size: 22px;}
}

/* 의회구성도 */
.org {position: relative; margin: 0 0 50px; border: 1px solid #42907a; border-radius: 10px; box-sizing: border-box; overflow: hidden;}
.org1 em{position: relative; display: block; margin: 50px auto 0; width: 100px; height: 100px; line-height: 100px; font-size: 20px; font-weight: 500; color: #cbfde2; text-align: center; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.35); background: #445990; border-radius: 50%;}
.org2 em{margin-left: 55%; width: 200px; height: 60px; line-height: 60px; color: #fff; background: #2a9b94; border-radius: 10px;}
.org3 em{margin-left: auto;text-shadow: none; color: #333; background: #ccc;}

.org li:after {content: '';display: block;position: absolute;top: 154px;left: 50%;transform: translateX(-50%);width: 2px;height: 151px;background: #c4c4c4;z-index: -1;}
li.org2:after {top: 231px;left: 52.3%;width: 4.4%;height:2px;}
.org1 em:after {content: '';display: block;position: absolute;bottom: -6px;left: 50%;transform: translateX(-50%);width: 10px;height: 10px;border: 1px solid #8f8f8f;border-radius: 50%;background: #fff;box-sizing: border-box;z-index: -1;}
.org2 > em:after {left:0;bottom: 23px;}
.org3 > em:after {bottom: auto; top:-6px}

#sub_org .txt .dot {display: flex;flex-wrap: wrap;align-items: center;margin: 50px 0 0;padding: 0 19px;width: 100%;min-height: 60px;color: #fff;background: #42907a;box-sizing: border-box;}
#sub_org .txt .dot > li:first-child {margin:0 9.52% 0 0;}
#sub_org .txt .dot > li:before {top: 11px; background: #fff;}
#sub_org .txt .dot > li em {font-weight: 600;}

@media all and (max-width:768px){
    .org2 em {margin-left: 65%;width: 150px; height: 54px; line-height: 54px; font-size: 18px;}
    .org3 em {margin-left: auto;}
    
    li.org2:after {top: 225px;left: 57.3%;width: 14.4%;}
}
@media all and (max-width:568px){ 
    .org1 > em {width: 90px; height: 90px; line-height: 90px; font-size: 18px;}
    .org2 em, #sub_org2 .org1 > em {width: 130px;height: 48px;line-height: 48px;font-size: 15px;}
    
    .org li:after {top: 144px;height: 139px;}
    li.org2:after {top: 212px;height: 2px;}
    .org2 > em:after {bottom: 20px;}
    
}
@media all and (max-width:430px){
    .org2 > em {margin-left: 55%;}
}

/* 찾아오시는길 */
#sub_location .root_daum_roughmap .wrap_map {margin: 0 0 50px;}
#sub_location .root_daum_roughmap .map_border {display: none;}
#sub_location .root_daum_roughmap{position:relative; overflow:hidden; width:100%; font-size:0; line-height:0;}
#sub_location .roughmap_maker_label{border-radius:46px;}
#sub_location .roughmap_maker_label .roughmap_lebel_text{padding: 10px 22px;line-height:28px;font-family: 'score';font-size:0;font-weight: 600;letter-spacing:-1px;border-radius:46px;background:#fff;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:before, #sub_location .roughmap_maker_label .roughmap_lebel_text:after{content:''; display:inline-block; width:30px; height:30px; margin:0 5px 0 0; vertical-align:top; background-image:url(/images/common/ico_logo.png); background-repeat:no-repeat; background-size:contain;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:after {content: 'YEOJU CITY COUNCIL'; width: auto; height: auto; margin: 0; font-size: 22px; font-weight: 600; background: none;}

@media all and (max-width:768px) {
    #sub_location .root_daum_roughmap .wrap_map {height: 550px !important;}
}
@media all and (max-width:568px) {
    #sub_location .root_daum_roughmap .wrap_map {height: 500px !important;}
}
@media all and (max-width:430px) {
    #sub_location .root_daum_roughmap .wrap_map {height: 420px !important;}
}


/* 의원소개 */
#sub_active{float:left; width:100%;}
.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: 220px;}
.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 7px 13px;line-height:135%;box-sizing:border-box;}
.profile dd li *{display:inline-block; vertical-align:top;}
.profile dd li:before{left:3px;top: 9px;width: 4px;height: 4px;background:#d5525e;}
.profile dd li em{position:absolute;top:0;left: 11px;width:85px;}
.profile dd li span{width:100%; word-break:break-all;}
.profile dd li .colon{position:absolute;top: -2px;left: 83px;width:auto;}

@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;}
}
@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;}
	.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;}
}
@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 12px;}
	.profile dd li:before{top: 7px;}
	.profile dd li .colon{left:75px;}
}
@media all and (max-width:380px) {
	.profile dd li:first-child em{letter-spacing:12px;}
	.profile dd li .colon{left:72px;}
}
@media all and (max-width:357px) {
	.profile .name strong{font-size:20px;}
}