@charset "utf-8";

#sub_default {font-size:20px;}
@media all and (max-width:1024px) {#sub_default {font-size:18px;}}
@media all and (max-width:768px) {#sub_default {font-size:1.063em;}}

/* 환영인사 */
#sub_greeting .pic_wrap {position:relative; width:100%; height:500px; margin:0 0 42px; box-sizing:border-box; padding:82px 0 0 42.7%; background:url(/images/ch/sub/bg_greeting.jpg) no-repeat center; background-size:cover; text-align:center; word-break:keep-all;}
#sub_greeting .pic_wrap .pic {position:absolute; bottom:0; left:78px;}
#sub_greeting .pic_wrap .txt {position:relative; font-size:22px; font-weight:400;}
#sub_greeting .pic_wrap .txt1 {font-family:'gmarket'; font-size:45px; font-weight:800;}
#sub_greeting .pic_wrap .txt1 span {display:block; padding:18px 0 42px;}
#sub_greeting .pic_wrap .txt1 span img {margin:-4px 0 0;}
#sub_greeting .pic_wrap .txt2 {line-height:160%; text-shadow:-1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;}

#sub_greeting .greeting {line-height:190%; font-size:17px; word-break:keep-all;}
#sub_greeting .greeting .name {padding:43px 0 0; text-align:right;}
#sub_greeting .greeting .name img {display:inline-block; padding:0 0 0 5px; vertical-align:middle;}

@media all and (max-width:1200px){
    #sub_greeting .pic_wrap {padding-left:35%;}
    #sub_greeting .pic_wrap .pic {left:0;}
}
@media all and (max-width:1024px){
    #sub_greeting .pic_wrap {height:auto; margin:0 0 30px; padding:50px 0 50px 30%;}
    #sub_greeting .pic_wrap .pic {left:50px; width:250px;}
    #sub_greeting .pic_wrap .txt {font-size:1em;}
    #sub_greeting .pic_wrap .txt1 {font-size:30px;}
    #sub_greeting .pic_wrap .txt1 span {padding:5px 0 20px;}
    #sub_greeting .pic_wrap .txt1 span img {height:28px;}
}
@media all and (max-width:768px){
    #sub_greeting .pic_wrap {padding:35px 0 35px 220px;}
    #sub_greeting .pic_wrap .pic {left:35px; width:200px;}
    #sub_greeting .pic_wrap .txt1 {font-size:23px;}
    #sub_greeting .pic_wrap .txt1 span img {height:21px;}
    
    #sub_greeting .greeting {line-height:130%; font-size:1em;}
    #sub_greeting .greeting .name img {width:60px;}
}
@media all and (max-width:568px){
    #sub_greeting .pic_wrap {margin:0 0 20px; padding:30px 10px 30px 180px; text-align:left;}
    #sub_greeting .pic_wrap .pic {left:0; width:180px;}
    #sub_greeting .pic_wrap .txt1 span {padding:3px 0 10px;}
    #sub_greeting .pic_wrap .txt2 {line-height:130%;}
}
@media all and (max-width:380px){
    #sub_greeting .pic_wrap {padding:20px 10px 20px 120px;}
    #sub_greeting .pic_wrap .pic {width:140px;}
    #sub_greeting .pic_wrap .txt1 {font-size:19px;}
    #sub_greeting .pic_wrap .txt1 span img {height:17px;}
    
    #sub_greeting .greeting .name img {width:50px;}
}

/* 의회구성 */
.org{position:relative; padding:60px 10px 58px 10px; box-sizing:border-box; border:1px solid #ccc; margin:0 0 45px;}
.org div{position:relative; z-index:1; display:inline-block; width:198px; height:56px; line-height:56px; margin:0 0 0 30%; color:#fff; font-size:17px; font-weight:400; border-radius:20px 0 0 0; transform:translate(-50%); background:#0a427a; text-align:center; box-sizing:border-box;}
.org div a{font-size:15px; font-weight:200;}
.org2 div{margin:6px 0 8px 69%; background:#375999;}
.org3 div{background:#357ca6;}
.org4 div{margin:5px 0 0 69%; background:#6a5198;}
.org5 div{background:#2f999e;}

.org li:before{content:''; display:block; position:absolute; top:70px; left:30%; width:1px; height:68%; background:#ddd;}
.org .org2:before{top:150px; width:35%; height:1px;}
.org .org3:before{top:274px; width:35%; height:1px;}

@media all and (max-width:768px){
    .org {margin:0 0 25px;}
	.org div{width:170px;}
}
@media all and (max-width:568px){
	.org{padding:40px 10px;}
	.org li:before{left:27%;}
	.org div{width:150px; margin-left:27%; font-size:16px;}
	.org2 div,
	.org4 div{margin-left:73%;}
	.org4 div{margin-bottom:8px;}
	.org .org2:before{top:130px;}
	.org .org3:before{top:256px;}
}
@media all and (max-width:380px){
	.org{padding:35px 10px;}
	.org div{width:130px; margin-left:24%; font-size:15px;}
	.org2 div,
	.org4 div{margin-left:76%;}
	.org div a{font-size:14px;}
	.org .org2:before{top:125px;}
	.org .org3:before{top:251px;}
}

#sub_org .table_wrap {margin:10px 0 27px;}
#sub_org .normal_list {border-top:2px solid #2897a8; font-size:18px;}
#sub_org .normal_list th {padding:8px 5px; border-color:#cdcdcd; background:#f0f9fa;}
#sub_org .normal_list td {padding:14px 5px; border-color:#cdcdcd;}

@media all and (max-width:1024px) {
    .sub_org .normal_list {font-size:1em;}
}

/* 의회 구성*/
#sub_history * {display:block; box-sizing:border-box;}
#sub_history > ul {position:relative; padding:16px 0 0 12px; word-break:keep-all;}
#sub_history > ul:before {content:''; position:absolute; top:0; left:0; width:102px; height:91%; border:2px solid #375999; border-radius:50px 0 0 0; border-right:none; border-bottom:none;}

#sub_history > ul > li {position:relative;}
#sub_history > ul > li:first-child:before,
#sub_history > ul > li:last-child:before {content:''; position:absolute; top:-20px; left:90px; width:10px; height:10px; border:2px solid #375999; border-radius:50%; background:#fff;}
#sub_history > ul > li:last-child:before {top:33%; left:-16px;}

#sub_history .year {overflow:hidden; position:relative; width:270px; height:100px; margin:0 0 23px; padding:20px 0 0; border-radius:45px; background:#e5f1ff; font-family:'gmarket'; font-size:25px; font-weight:800; color:#375999; text-align:center;}
#sub_history .year:before {content:''; position:absolute; top:-8px; left:50%; transform:translateX(-50%); border-radius:50px; width:60px; height:15px; background:#375999;}
#sub_history .year span {padding:7px 0 0; font-size:1.200em; color:#333;}
#sub_history ul li + li {padding:63px 0 0;}
#sub_history ul li ul {position:relative; padding-left:17px; margin-left:41px}
#sub_history ul li ul:before {content:''; position:absolute; top:50%; transform:translateY(-50%); left:0; width:7px; height:89%; border:1px solid #375999;}
#sub_history ul li ul li {position:relative; padding:0 0 3px 147px;}
#sub_history ul li ul li:last-child {padding-bottom:0;}
#sub_history ul li ul li .date {position:absolute; top:0; left:0; padding-left:16px; font-weight:400;}
#sub_history ul li ul li .date:before {content:''; position:absolute; top:12px; left:0; width:5px; height:5px; border-radius:50%; background:#375999;}
#sub_history ul li ul li span {position:relative; padding-left:11px;}
#sub_history ul li ul li span:before {content:''; position:absolute; top:11px; left:0; width:5px; height:1px; background:#333;}

@media all and (max-width:1024px) {
    #sub_history > ul:before {height:90%;}
    #sub_history > ul > li:last-child:before {top:26%;}
    
    #sub_history ul li + li {padding:35px 0 0;}
    #sub_history ul li ul {margin-left:20px;}
    #sub_history .year {width:180px; height:75px; margin:0 0 10px; padding:15px 0 0; font-size:1em;}
    #sub_history .year span {padding:5px 0 0;}
    #sub_history ul li ul li {padding-left:130px;}
    #sub_history ul li ul li .date:before {top:10px;}
}

@media all and (max-width:768px) {
    #sub_history .year {width:160px; height:70px;}
    #sub_history ul li ul li .date:before {top:9px;}
}

@media all and (max-width:568px) {
    #sub_history > ul:before {height:89%;}
    #sub_history > ul > li:last-child:before {top:22%;}
    
    #sub_history .year {width:145px; height:60px; padding:10px 0 0;}
    #sub_history .year:before {top:-5px; height:10px;}
    
    #sub_history ul li ul {margin-left:0;}
    #sub_history ul li ul:before {display:none;}
    #sub_history ul li ul li {padding-left:110px;}
    #sub_history ul li ul li .date {padding-left:10px;}
    #sub_history ul li ul li .date:before {top:6px;}
    #sub_history ul li ul li span {padding-left:8px;}
    #sub_history ul li ul li span:before {top:7px;}
}

@media all and (max-width:380px) {
    #sub_history > ul:before {height:88%;}
    #sub_history > ul > li:last-child:before {top:14%;}
    
    #sub_history ul li + li {padding:25px 0 0;}
    #sub_history .year {height:55px;}
    #sub_history ul li ul li {padding-left:0;}
    #sub_history ul li ul li .date {position:relative;}
}

/* 숙제도우미 */
.box_info {box-sizing:border-box; padding:45px 300px 51px 50px; margin:0 0 45px; background:#375999 url(/images/ch/sub/bg_info.png) no-repeat top right; color:#fff; word-break:keep-all; text-shadow:0 0 5px rgba(0,0,0,0.75);}
.box_info dt {padding:0 0 19px; font-size:1.100em; font-weight:800;}
.box_info dd {line-height:160%; font-size:18px;}

#sub_default h4, .tit_txt {padding:0 0 2px 30px; background:url(/images/ch/sub/ico_h4.gif) no-repeat top 3px left; font-weight:400; font-size:1em;}
#sub_default h4 + p {line-height:150%; padding:0 0 19px 30px; word-break:keep-all;}
#sub_default h4 + ul {margin-top:0 !important;}
#sub_default h4 ~ ul {margin:-15px 0 22px; padding:0 0 0 30px; word-break:keep-all;}
#sub_default h4 ~ ul li:before {top:13px;}
#sub_default h4 ~ ul li em {font-weight:400;}

.tabmenu {position:relative;}
.tabmenu:before {content:''; display:block; position:absolute; top:60px; left:0; width:100%; height:1px; background:#218ca0;}
.tabmenu > li > a {display:block; position:absolute; top:0; left:251px; width:250px; height:60px; line-height:60px; border-radius:20px 20px 0 0; font-weight:400; transition:0.3s; text-align:center; background:#f5f5f5; text-decoration:none; font-size:1.100em;}
.tabmenu > li:first-child > a {left:0;}
.tabmenu > li > a:hover,
.tabmenu > li > a:focus,
.tabmenu > li > a:active,
.tabmenu > li.on > a {color:#fff; background-color:#218ca0;}
.tabmenu > li > .tab_con {display:none; padding-top:87px;}
.tabmenu > li.on > .tab_con {display:block;}

.tabmenu .tab_con ol {padding-left:30px;}
.tabmenu .tab_con ol > li {padding:0 0 20px;}
.tabmenu .tab_con ol li em {display:block; padding:0 0 4px; font-weight:400;}
.tabmenu .tab_con ol li em span {position:relative;}
.tabmenu .tab_con ol li em span:before {z-index:-1; content:''; position:absolute; bottom:2px; left:-4px; width:calc(100% + 8px); height:10px; background:#d3e8ec;}

.tabmenu > li:last-child .tab_con ol li em span {color:#2e9c9b;}
.tabmenu .tab_con ol li em ~ p,
.tabmenu .tab_con ol li em ~ ul {font-size:18px;}
.tabmenu .tab_con ol li ul li:not(:last-of-type) {padding-bottom:4px;}

@media all and (max-width:1024px) {
    .box_info {margin:0 0 30px;}
    .box_info dd {font-size:1em;}
    
    .tabmenu .tab_con ol li em ~ p,
    .tabmenu .tab_con ol li em ~ ul {font-size:1em;}
}

@media all and (max-width:768px) {
    .box_info {padding:25px 150px 31px 30px; background-size:300px;}
    .box_info dt {padding:0 0 10px;}
    
    #sub_default h4, .tit_txt {padding-left:23px; background-size:16px;}
    #sub_default h4 + p {padding:0 0 15px 23px;}
    #sub_default h4 ~ ul {margin-top:-10px; padding:0 0 0 23px;}
    
    .tabmenu:before {top:51px;}
	.tabmenu > li > a {left:180px; width:180px; height:51px; line-height:51px;}
	.tabmenu > li > .tab_con {padding-top:75px;}
    .tabmenu .tab_con ol {padding-left:23px;}
}
@media all and (max-width:568px) {
    .box_info {padding-right:100px; margin:0 0 20px; background-size:200px;}
    .box_info dd {line-height:130%;}
    
    #sub_default h4, .tit_txt {padding-left:20px; background-size:14px; background-position:top 1px left;}
    #sub_default h4 + p,
    #sub_default h4 ~ ul,
    .tabmenu .tab_con ol {padding-left:20px;}
    .dash > li:before {top:7px !important;}
    
    .tabmenu:before {top:35px;}
    .tabmenu > li > a {left:140px; width:140px; height:35px; line-height:35px; border-radius:10px 10px 0 0; font-size:1em;}
    .tabmenu > li > .tab_con {padding-top:55px;}
    .tabmenu .tab_con ol > li {padding:0 0 10px;}
    .tabmenu .tab_con ol li em span:before {left:-2px; width:calc(100% + 4px); height:7px;}
}

@media all and (max-width:380px) {
    .box_info {padding:20px 30px 20px 20px; background-size:150px;}
}

/* 의회용어사전 */
#sub_voca .indexArea{overflow:hidden; width:100%; padding:2em 0; border:1px solid #d9d9d9; box-sizing:border-box;}
#sub_voca .index_word,
#sub_voca .indexArea form,
#sub_voca .search_result{overflow:hidden; width:90%; margin:0 auto 1em auto; padding:0 0 1em 0; border-bottom:1px solid #dbdbdb; box-sizing:border-box;}
#sub_voca .indexArea form *{float:left;}
#sub_voca .indexArea fieldset{width:100%;}
#sub_voca .indexArea input {vertical-align:top; margin:0 3px 0 0;}
#sub_voca .indexArea #word {width:440px; height:40px; line-height:40px; border:1px solid #dcdcdc;}
#sub_voca .indexArea button[type="submit"]{width:74px; height:40px; background:#1086ad; color:#fff;}
#sub_voca .indexArea form label,
#sub_voca .index_word .titTxt{float:left; padding:8px 2em 0 0; font-weight:800; color:#000; font-size:105%;}
#sub_voca .index_word ul {float:left;}
#sub_voca .index_word li {float:left; margin:0 3px 0 0; text-align:center;}
#sub_voca .index_word li a{display:block; width:40px; height:40px; line-height:40px; font-size:120%; font-weight:800; color:#000; text-decoration:none; background:#e0e0e0;}
#sub_voca .index_word li.current_on a,
#sub_voca .index_word li a:focus,
#sub_voca .index_word li a:hover{color:#fff; background:#1086ad;}
#sub_voca .search_result li {float:left; width:25%; padding:0 0 15px 10px; letter-spacing:-1px;}
#sub_voca .search_result li:before {top:11px;}
#sub_voca .none,#sub_voca .word_defined{width:100%; padding:20px 0 0 0;}

@media all and (max-width:1024px) {
	#sub_voca .indexArea #word{width:71%;}
	#sub_voca .search_result ul{width:98%; padding:0 0 0 2%;}
    #sub_voca .search_result li:before {top:10px;}
}
@media all and (max-width:768px) {
	#sub_voca .indexArea{padding:1em 0;}
	#sub_voca .index_word, #sub_voca .indexArea form, #sub_voca .search_result{width:90%; padding:0 0 0.7em; margin-bottom:0.7em;}
	#sub_voca .indexArea form label, #sub_voca .index_word .titTxt{width:100%; margin:0 0 3px 0; padding:0;}
	#sub_voca .index_word ul{width:100%;}
	#sub_voca .index_word li{/*width:6.5%;*/ margin:0 1px 1px 0;}
	#sub_voca .index_word li a{width:100%; height:25px; line-height:25px;}
    
    #sub_voca .search_result li:before {top:8px;}
}
@media all and (max-width:568px) {
	#sub_voca .search_result li{width:31%;}
    #sub_voca .search_result li:before {top:5px;}
}
@media all and (max-width:400px) {
	#sub_voca .search_result li{width:47.5%;}
}

/* 유용한 사이트 */
#sub_site .box_info {padding:36px 30px 0; border:10px solid #ebeef5; background:#f1f1f1; text-shadow:none;}
#sub_site .box_info:after {content:''; display:block; clear:both;}
#sub_site .box_info li {float:left; width:25%; padding:0 5px 32px;}
#sub_site .box_info li:before{display:none;}
#sub_site .box_info li a {display:block; text-align: center;}

@media all and (max-width:768px) {
    #sub_site .box_info {padding:20px 30px 5px;}
    #sub_site .box_info li {width:33.333%; padding:0 5px 15px;}
    
}
@media all and (max-width:568px) {
    #sub_site .box_info {padding:20px 25px 5px;}
    #sub_site .box_info li {width:49.5%;}
}

@media all and (max-width:500px) {
    #sub_site .box_info {padding:20px 5px 10px;}
    #sub_site .box_info li {padding-bottom:8px;}
}