@charset "utf-8";

.box_info{z-index:1; position:relative; width:100%; min-height:100px; margin:0 0 45px; padding:50px 20px 50px 50px; border:1px solid #bfdadf; 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:block; padding:0 0 7px; font-size:23px; font-weight: 700; color: #19305a;}
.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;}
}	

.box_gray{margin:0 0 45px; padding:35px 20px 35px 41px; background:#eff3f7;}
@media all and (max-width:768px) {
    .box_gray{padding:25px 5px 21px 5%;}
}

.tabmenu{position:relative; overflow:hidden; width:100%; box-sizing:border-box;}
.tabmenu:after{z-index:1; content:''; display:block; position:absolute; top:58px; left:0; height:2px; width:100%; background:#003964;}
.tabmenu > li > a{z-index:1; display:block; position:absolute; top:0; left:0; width: 20%; height:60px; line-height:61px; font-weight:600; font-size:18px; color:#565b71; border:2px solid #e4e5eb; border-left-color:#fff; border-bottom:none; background:#e4e5eb; text-align:center; box-sizing:border-box; text-decoration:none;}
.tabmenu > li:nth-child(2) > a{left:20%;}
.tabmenu > li:nth-child(3) > a{left:40%;}
.tabmenu > li:nth-child(4) > a{left:60%;}
.tabmenu > li:nth-child(5) > a{left:80%;}
.tabmenu > li.on > a{z-index:2; color:#004273; border-color:#003964; background:#fff; transition:font-size 0.2s ease-in-out;}
.tabmenu > li > .con{display:none; padding:100px 0 0 0;}
.tabmenu > li.on > .con{display:block;}
@media all and (max-width:768px) {
	.tabmenu:after{top:53px;}
	.tabmenu > li > a{height:55px; line-height:54px; font-size:15px;}
}
@media all and (max-width:568px) {
    .tabmenu:after{top:45px;}
	.tabmenu > li > a{width:33.33%; height:47px; line-height:46px; font-size:14px;}
	.tabmenu > li.on > a{font-size:15px;}
	.tabmenu > li:nth-child(2) > a{left:33.33%;}
	.tabmenu > li:nth-child(3) > a{left:66.66%;}
	.tabmenu > li:nth-child(4) > a{top:47px; left:0;}
	.tabmenu > li:nth-child(5) > a{top:47px; left:33.33%;}

	.tab5 > li > .con,
	.tab6 > li > .con{padding:120px 0 0 0;}
}

/* 의원 인사말 */
#sub_greeting{position:relative; float:left; width:100%; box-sizing:border-box;}
#sub_greeting .pic {position:relative; float:left; width:43%; height:588px; padding:32px 7.8% 0 4.579%; box-sizing:border-box; background:url(../../images/ch/sub/bg_pic.jpg) no-repeat 0 0 / 75% auto;}
#sub_greeting .pic img{overflow:hidden; max-width:100%; border-radius:14px;}
#sub_greeting .name{padding:17px 0 0 20px; color: #222;}
#sub_greeting .name p{padding:0 0 10px; line-height:100%; color:#1a315b; font-weight:500; letter-spacing:4px;}
#sub_greeting .name strong{display: block; line-height:100%; font-weight:600; font-size:24px; letter-spacing: 12px;}
#sub_greeting .txt {float:left; width:57%; padding:38px 0 0 0; word-break:keep-all;}
#sub_greeting .tit{padding:36px 0 33px; line-height:150%; font-size:24px; background:url(../../images/ch/sub/ico_quot.png) no-repeat;}
#sub_greeting .tit strong{color:#1a305b; font-weight: 600;}
@media all and (max-width:1024px) {
    #sub_greeting .txt {font-size:1.1em;}
}
@media all and (max-width:768px) {
    #sub_greeting .pic {float:none; height: inherit; width:320px; margin:0 auto; padding:32px 30px 30px; background-size: contain;}
    #sub_greeting .txt {float:none; width:100%; padding:40px 0 0 0;}
    #sub_greeting .tit{font-size:21px;}
}

/* 의회조직*/
.org{width:100%; height:788px; font-weight:600; color:#222;}
.org span{z-index:2; position:absolute; left:50%; top:89px; display:block; width:190px; height:56px; line-height:56px; border-radius:5px; font-weight: 600; font-size:18px; color:#fff; text-align:center; transform:translateX(-50%); box-sizing:border-box; background:#314b7b; background-size:cover;}
.org1 > span{height:140px; width:140px; line-height:140px; font-weight:700; color:#222; border-radius:0; background:url(../../images/kr/intro/bg_org1.png) no-repeat; background-size:contain;}
.org2 span{top:250px; left:67%; background-color:#2a9b94;}
.org3 span{top:346px; left:28%; background-color:#3c789a;}
.org3_2 span{left:72%; background-color:#58529f;}
.org3 ul{display: flex; gap:27px; position: absolute; top:460px; left:28%; transform:translateX(-50%);}
.org3 ul li{top:435px; display: flex; writing-mode: vertical-rl; align-items:center; width:66px; height:230px; padding:22px 0 0 0; letter-spacing:6px; margin:0 0 3px; border:1px solid #bdd8e7; border-radius:10px; background:#f2f7f9; text-align:center; box-sizing:border-box;}

.org li:after{z-index:-1; content:''; display:block; position:absolute; top:190px; left:50%; width:1px; height:25%; background:#ddd;}
.org .org1:after{z-index:-2;}
.org .org2:after{top:280px; width:20%; height:1px;}
.org .org3:after{top:375px; left:28%; width:50%; height:60px; background:#fff; border:1px solid #ddd; border-bottom:none; border-right: none;}
.org .org3 li:after{top:-30px; left:34px; width:calc(100% - 68px); height:60px; background:#fff; border:1px solid #ddd; border-bottom:none;}
.org .org3 li:nth-child(2):after{top:-30px; left:50%; width:1px; background:#ddd; border:none;}
.org .org3 li:nth-child(3):after,
.org .org3 li:nth-child(4):after{display: none;}

@media all and (max-width:768px){
	.org2 span{width:150px; font-size:17px;}
    .org2 > span{left:70%;}
    .org3 ul{gap:10px;}
}
@media all and (max-width:568px){
    .org{height:740px;}
    .org2 span{width:100px; font-size:16px;}
    .org2 > span{left:75%;}
    .org3 span{left:22%;}
    .org3_2 span{left:78%;}
    .org3 ul{display: block; left:22%; top:430px;}
    .org3 ul li{writing-mode:inherit; justify-content: center; width:120px; height:50px; margin:0 0 5px; padding:0; letter-spacing: -1px;}
    .org .org3:after{left:22%;}
    .org .org3 li:after{display: none;}
}

/* 의회연혁 */
#sub_history .info{height:303px; padding:70px 0 0 68px; margin:0 0 45px; letter-spacing: 0; font-size:18px; font-weight: 400; font-family: "NanumSquare"; color:#fff; border-radius:5px; background: url(../../images/kr/intro/bg_history.jpg) no-repeat 50% 0; box-sizing: border-box; word-break: keep-all;}
#sub_history .info strong{display: block; line-height:120%; padding:18px 0 26px; font-size:30px; color: #feffdb;}
#sub_history .info p{opacity:0.7;}
#sub_history .info .en{opacity:0.5; line-height:100%; text-transform: uppercase; letter-spacing: 2px; font-size:14px; font-weight: 200; font-family: "gmarket";}

#sub_history .dot{margin:0 0 45px; padding:35px 0 31px 41px; background:#eff3f7;}
#sub_history .dot li{display:grid; grid-template-columns:121px 1fr; margin:0 0 4px;}

@media all and (max-width:768px) {
    #sub_history .info{height:auto; padding:50px 5% 45px 6%; font-size:1em;}
    #sub_history .info strong{padding:10px 0 20px; font-size:1.5em;}
    #sub_history .info .en{font-size:12px;}
    #sub_history .info br{display: none;}
    #sub_history .dot{padding:25px 5px 21px 5%;}
    #sub_history .dot li{grid-template-columns:100px 1fr;}
}

/* 찾아오시는길 */
#sub_location .map_wrap{position:relative; margin:0 0 68px; box-shadow:0 0 10px rgba(85,85,85,0.2);}
#sub_location .root_daum_roughmap{position:relative; overflow:hidden; width:100%;}
#sub_location .roughmap_maker_label{border-radius:30px;}
#sub_location .roughmap_maker_label .roughmap_lebel_text{padding:8px 15px 8px; line-height:32px; font-size:20px; font-weight:600; font-family:"score"; letter-spacing:-1px; border-radius:30px; background-color:#fff;}
#sub_location .roughmap_maker_label .roughmap_lebel_text:before{content:''; display:inline-block; width:30px; height:30px; margin:0 5px 0 0; vertical-align:top; background-image:url(../../images/kr/common/ico_logo.png); background-repeat:no-repeat; background-size:contain;}
#sub_location .roughmap_maker_label:after{height:auto; border-top:10px solid #fff; border-left:10px solid transparent; border-right:10px solid transparent; background:none;}

#sub_location .map_info{z-index:1; position: absolute; right:0; bottom:0; width:59.43%; height:98px; box-sizing:border-box;  border-radius:30px 0 0 0; background:linear-gradient(90deg, #0a6f7d 0%, #0e4778 100%);}
#sub_location .map_info ul{display:flex; flex-wrap: wrap; justify-content:space-evenly; align-items:center; height:100%; width:100%;}
#sub_location .map_info li{position:relative; display:flex; align-items:center; box-sizing:border-box; padding:0 0 0 48px; word-break:keep-all; color:#fff; font-weight: 500;}
#sub_location .map_info li a{color:#fff;}
#sub_location .map_info li:before{content:""; position:absolute; left:0; top:50%; width:37px; height:37px; background:url("../../images/kr/intro/ico_loc1.png") no-repeat 50% 50% / cover; transform:translateY(-50%);}
#sub_location .map_info li:nth-child(2):before{background-image:url("../../images/kr/intro/ico_loc2.png");}

@media all and (max-width:1280px){
    #sub_location .map_info{width:70%;}
}
@media all and (max-width:1024px){
	#sub_location .root_daum_roughmap .wrap_map{height:400px !important;}
}
@media all and (max-width:768px){
    #sub_location .map_info{width:90%;}
	#sub_location .root_daum_roughmap .wrap_map{height:350px !important;}
}
@media all and (max-width:568px){
    #sub_location .map_wrap{margin:0 0 55px;}
    #sub_location .map_info{position: relative; height:auto; width:100%; padding:20px; border-radius:0 0 0 20px;}
    #sub_location .map_info ul{display: block;}
    #sub_location .map_info li{padding:0 0 0 30px;}
    #sub_location .map_info li + li{margin:10px 0 0 0;}
    #sub_location .map_info li:before{width:25px; height:25px; background-size: contain;}
    
	#sub_location .root_daum_roughmap .wrap_map{height:300px !important;}
	#sub_location .roughmap_maker_label .roughmap_lebel_text{font-size:19px;}
	#sub_location .roughmap_maker_label .roughmap_lebel_text:before{height:25px; margin:0 2px 0 0;}
}
@media all and (max-width:380px){
	#sub_location .root_daum_roughmap .wrap_map{height:250px !important;}
	#sub_location .roughmap_maker_label .roughmap_lebel_text{font-size:18px;}
}

/* 의회용어사전 */
#sub_voca a{color:#222;}
#sub_voca .indexArea{float:left; width:100%; padding:40px 60px 35px; box-sizing:border-box; }
#sub_voca .index_word,
#sub_voca .indexArea form{overflow:hidden; position:relative; width:100%; margin:0 0 1em 0; padding:0 0 1em 110px; border-bottom:1px dashed #ccc; box-sizing:border-box;}
#sub_voca .search_result{padding-left:0 !important;}
#sub_voca .indexArea form *{float:left;}
#sub_voca .indexArea fieldset{width:100%;}
#sub_voca .indexArea #word {width:100%; padding:0 150px 0 20px; font-weight:600; color:#111; border:1px solid #ddd; border-radius:3px; box-sizing:border-box; background:#fff;}
#sub_voca .indexArea button[type="submit"]{position:absolute; top:0; right:0; width:120px; height:42px; padding:0 0 0 20px; font-weight:400; color:#fff; border-radius:0 3px 3px 0; box-sizing:border-box; background:#33589c;}
#sub_voca .indexArea button:before,
#sub_voca .indexArea button:after{content:''; display:block; position:absolute; top:10px; left:25px; width:17px; height:17px; border:2px solid #fff; border-radius:50%; box-sizing:border-box;}
#sub_voca .indexArea button:after{left:37px; top:26px; width:8px; height:2px; border:none; border-radius:2px; transform:rotate(45deg); background:#fff;}
#sub_voca .indexArea form label,
#sub_voca .index_word .titTxt{position:absolute; top:12px; left:0; font-weight:600; color:#222; font-size:19px;}
#sub_voca .index_word ul {width:100%;}
#sub_voca .index_word li {display:inline-block; vertical-align:top; margin:0 1px 5px 0; text-align:center;}
#sub_voca .index_word li a{display:block; width:42px; height:42px; line-height:40px; font-size:24px; font-weight:600; text-decoration:none; border-radius:50%; box-sizing:border-box; border:1px solid #ddd; background:#fff;}
#sub_voca .index_word li.current_on a,
#sub_voca .index_word li a:focus,
#sub_voca .index_word li a:hover{color:#fff; border-color:#f05952; background:#f05952;}
#sub_voca .search_result ul{overflow:hidden; width:100%;}
#sub_voca .search_result li {float:left; width:20%; margin:0; padding:0 0 10px 10px; letter-spacing:-1px; box-sizing:border-box; word-break:break-all;}
#sub_voca .none,#sub_voca .word_defined{width:100%;}
#sub_voca #pagingNav{margin:40px 0 0 0;}
@media all and (max-width:1000px) {
	#sub_voca .indexArea{padding:35px 50px 30px; margin:0 0 30px;}
	#sub_voca .index_word li a{width:45px; height:45px; line-height:43px;}
	#sub_voca .search_result ul{padding:0 0 0 2%; box-sizing:border-box;}
}
@media all and (max-width:768px) {
	#sub_voca .indexArea{padding:30px; margin:0 0 25px;}
	#sub_voca .indexArea #word{padding-right:110px;}
	#sub_voca .indexArea form label, #sub_voca .index_word .titTxt{font-size:18px;}
	#sub_voca .indexArea button[type="submit"]{height:42px; width:100px;}
	#sub_voca .indexArea button:before{left:20px;}
	#sub_voca .indexArea button:after{left:32px;}
	#sub_voca .index_word, #sub_voca .indexArea form{padding:0 0 12px 100px; margin-bottom:12px;}
	#sub_voca .index_word li{margin:0 1px 3px 0;}
	#sub_voca .index_word li a{height:40px; width:40px; line-height:38px; font-size:21px;}
}
@media all and (max-width:660px) {
	#sub_voca .search_result li{width:25%;}
}
@media all and (max-width:568px) {
	#sub_voca .indexArea{padding:23px; margin:0 0 20px;}
	#sub_voca .index_word, #sub_voca .indexArea form{padding-left:0;}
	#sub_voca .indexArea form label, #sub_voca .index_word .titTxt{position:static; width:100%; margin:0 0 10px; text-align:center;}
	#sub_voca .indexArea button[type="submit"]{top:auto; bottom:12px; height:38px; width:85px;}
	#sub_voca .indexArea button:before{left:15px;  width:15px; height:15px; }
	#sub_voca .indexArea button:after{left:26px; top:24px;}
	#sub_voca .index_word li a{height:35px; width:35px; line-height:33px; font-size:20px;}
	#sub_voca .search_result li{width:33.33%;}
	#sub_voca .indexArea #word {height:37px; line-height:37px; padding-right:95px;}
	#sub_voca #pagingNav{margin:25px 0 0 0;}
}
@media all and (max-width:380px) {
	#sub_voca .indexArea{padding:20px; margin:0 0 17px;}
	#sub_voca .indexArea form label, #sub_voca .index_word .titTxt{font-size:17px;}
	#sub_voca .index_word li a{height:32px; width:32px; line-height:30px; font-size:19px;}
	#sub_voca .search_result li{width:50%;}
	#sub_voca #pagingNav{margin:20px 0 0 0;}
}

/* 유용한사이트 */
#sub_site .tit_wrap {text-align: center; color: #19305a;}
#sub_site .tit_wrap p {margin: 0 0 7px; font-size: 23px; font-weight:600;}
#sub_site .txt_box {position: relative;padding: 55px 9.5% 51px;background: #ecf4f8; border:1px solid #cbeeee; box-sizing: border-box;border-radius: 5px;overflow: hidden;z-index: 1;}  
#sub_site .txt_box ul {margin: 40px 0 0 ;display: flex; flex-wrap: wrap; justify-content: space-between;}
#sub_site .txt_box li {display: table;width:31%;height: 51px;margin: 0 0 15px;} 
#sub_site .txt_box li a {position: relative;display: block;display: table-cell;vertical-align: middle;padding: 0 40px 0 30px;line-height: 1.2;text-decoration: none; box-sizing: border-box;border-radius: 25px;border: 1px solid #dde5ed;background: #fff;}
#sub_site .txt_box li a:after {content: '';display: block;position: absolute;top: 18px;right: 10%;width: 10px;height: 10px;background: url(../../images/common/ico_open.png)no-repeat 0 100%;}
#sub_site .txt_box li a:hover,
#sub_site .txt_box li a:focus{background:#243d99; border-color:#243d99; color:#fff;}
#sub_site .txt_box li a:hover:after,
#sub_site .txt_box li a:focus:after{background-position:0 0;}
@media all and (max-width: 1024px) {
	#sub_site .tit_wrap span {font-size:15px;}
	#sub_site .txt_box {padding: 55px 5% 51px;}
	#sub_site .txt_box li {width:30%;}
}
@media all and (max-width: 768px) {
	#sub_site .tit_wrap p {font-size:21px;}
	#sub_site .txt_box li {width:44%;}
}
@media all and (max-width: 568px) {
	#sub_site .tit_wrap p {font-size:19px;}
	
	#sub_site .txt_box li {width:49%;}
	#sub_site .txt_box li a {padding: 0 25px 0 10%;font-size: 14px;}
}
