@charset "utf-8";
/* common.css삭제 */
#sub_default h4{background: none;}
#sub_default h4{padding:0 0 0 24px;}



/* 의회소개 > 환영인사 */
/* 의장인사 bg */
#sub_greeting > .chgre_bg{position:relative; margin:50px 0 0 0; padding:62px 43px 55px 718px; box-sizing: border-box; width: 100%; background:url(../../images/ch/sub/ch_chairmanbg.png) no-repeat;}
#sub_greeting > .chgre_bg > .img{position: absolute; top:-50px; left:0;}
#sub_greeting > .chgre_bg > .img > img{border-radius: 0 300px 300px 0;}
#sub_greeting .chgrebg_txt{position: relative;}
#sub_greeting .chgrebg_txt > .txt01{font-size: 40px; color: #fff; line-height:100%; font-weight: 800; font-family: 'gmarket';}
#sub_greeting .chgrebg_txt > .txt01:before{content: ''; display: block; position: absolute; top:16px; left: -199px; width:188px; height: 1px; background:#fff;}
#sub_greeting .chgrebg_txt > .txt02{margin:58px 0 0 0; font-size: 40px; color: #fff; font-weight: 200; line-height: 148%; font-family: 'gmarket';}
#sub_greeting .chgrebg_txt > .txt02 > span{font-weight: 800;padding:7px 4px 0px; margin:0 1px 0 0; background: #fff; color:#307ed3;}
#sub_greeting .chgrebg_txt > .txt03{margin:51px 0 0 0; font-size: 20px; color:#fff; line-height: 150%;}

/* 텍스트 */
#sub_greeting > .chggr_txt{margin:100px 0 0 0;}
#sub_greeting > .chggr_txt >.chtxt_tit{font-size: 30px; color:#333; text-align:center; font-weight:800; font-family: 'gmarket';}
#sub_greeting > .chggr_txt >.chtxt_tit *{display: inline-block;}

#sub_greeting > .chggr_txt >.chtxt_tit > .dot_gr,
#sub_greeting > .chggr_txt >.chtxt_tit .dot_bl{position: relative;}
#sub_greeting > .chggr_txt >.chtxt_tit > .dot_gr:before,
#sub_greeting > .chggr_txt >.chtxt_tit .dot_bl:before{content:''; display: block; position: absolute; top:-10px; left: 9px; width: 5px; height: 5px; border-radius: 100%;}
#sub_greeting > .chggr_txt >.chtxt_tit > .dot_gr:before{background:#65d291;}
#sub_greeting > .chggr_txt >.chtxt_tit .dot_bl:before{background:#307ed3;}

#sub_greeting > .chggr_txt > .greeting{margin:50px 0 0 0;}
#sub_greeting > .chggr_txt > .greeting > ul > li{font-size: 18px; margin:30px 0 0 0; line-height: 30px; word-break: keep-all;}
#sub_greeting > .chggr_txt > .greeting > ul > li:nth-child(1){margin:0;}

@media all and (max-width:1420px){
#sub_greeting > .chgre_bg{margin:75px 0 0 0;}
#sub_greeting > .chgre_bg > .img{top:-75px;}
#sub_greeting .chgrebg_txt > .txt01{font-size: 35px;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 38px;}
#sub_greeting .chgrebg_txt > .txt03{font-size: 19px;}
#sub_greeting > .chggr_txt > .greeting > ul{padding: 0 15px; box-sizing: border-box;}
}

@media all and (max-width:1170px){
#sub_greeting > .chgre_bg{margin: 69px 0 0 0; padding:62px 43px 55px 685px;}
#sub_greeting > .chgre_bg > .img{top:-64px;}
#sub_greeting > .chgre_bg > .img > img{width: 95%;}
#sub_greeting .chgrebg_txt > .txt01:before{top: 16px; left: -178px; width: 165px;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 36px;}
#sub_greeting > .chggr_txt > .greeting > ul > li{margin:20px 0 0 0;}
}

@media all and (max-width:1155px){
#sub_greeting > .chgre_bg{padding:62px 43px 55px 560px; margin:29px 0 0 0;}
#sub_greeting > .chgre_bg > .img{top:-28px;}
#sub_greeting > .chgre_bg > .img > img{width: 75%;}
#sub_greeting .chgrebg_txt > .txt01:before{top:14px;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 30px; margin:33px 0 0 0;}
#sub_greeting .chgrebg_txt > .txt03{margin: 34px 0 0 0;}
}

@media all and (max-width:1009px){
#sub_greeting > .chgre_bg > .img{top:-12px;}
#sub_greeting > .chgre_bg > .img > img{width: 70%;}
#sub_greeting .chgrebg_txt > .txt01{font-size: 30px;}
#sub_greeting .chgrebg_txt > .txt03{font-size: 18px;}
}

@media all and (max-width:954px){
#sub_greeting > .chgre_bg{padding:62px 43px 55px 505px;}
#sub_greeting > .chgre_bg > .img{top:-13px;}
#sub_greeting .chgrebg_txt > .txt01:before{top:9px;}
#sub_greeting > .chggr_txt > .greeting > ul > li{font-size: 16px;}
#sub_greeting > .chggr_txt >.chtxt_tit{font-size: 26px;}
#sub_greeting > .chggr_txt > .greeting{margin: 35px 0 0 0;}
}

@media all and (max-width:900px){
#sub_greeting > .chgre_bg{padding:62px 43px 55px 475px;}
#sub_greeting > .chgre_bg > .img > img{width: 66%;}
#sub_greeting > .chgre_bg > .img{top:-16px;}
#sub_greeting .chgrebg_txt > .txt01{font-size: 25px;}
#sub_greeting .chgrebg_txt > .txt01:before{top:9px;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 25px;}
#sub_greeting .chgrebg_txt > .txt03{font-size: 16px;}
#sub_greeting > .chggr_txt >.chtxt_tit{font-size: 22px;}
#sub_greeting > .chggr_txt > .greeting{margin:35px 0 0 0;}
#sub_greeting > .chggr_txt > .greeting > ul > li{margin:10px 0 0 0; font-size: 15px;line-height: 30px;}
}

@media all and (max-width:820px){
#sub_greeting > .chgre_bg{padding:62px 43px 55px 411px;}
#sub_greeting > .chgre_bg > .img{width:76%; top:-20px;}
#sub_greeting .chgrebg_txt > .txt01:before{content: none;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 28px;}
#sub_greeting .chgrebg_txt > .txt03{display: none;}
}

@media all and (max-width:740px){
#sub_greeting > .chgre_bg{padding:0; background:none;}
#sub_greeting > .chgre_bg > .img{margin:0 auto; position: static;}
#sub_greeting > .chgre_bg > .img > img{width:100%; border-radius: 0 10px 10px 0;}
#sub_greeting .chgrebg_txt{text-align: center; margin:35px 0 0 0;}
#sub_greeting > .chggr_txt{margin:55px 0 0 0;}
#sub_greeting .chgrebg_txt > .txt01{color:#000; font-size: 25px;}
#sub_greeting .chgrebg_txt > .txt02{padding: 0 0 30px 0; margin:9px 0 0 0; font-size: 34px; border-bottom:1px solid #c8c8c8; color: #000;}
#sub_greeting .chgrebg_txt > .txt02 > span{background-color:#307ed3; color:#fff;}
#sub_greeting > .chggr_txt > .greeting{margin:20px 0 0 0;}
}

@media all and (max-width:467px){
#sub_greeting .chgrebg_txt > .txt02{font-size: 25px;}
#sub_greeting > .chggr_txt{margin: 33px 0 0 0;}
#sub_greeting > .chggr_txt >.chtxt_tit{line-height: 180%; font-size: 18px;}
#sub_greeting > .chggr_txt >.chtxt_tit > .dot_gr:before,
#sub_greeting > .chggr_txt >.chtxt_tit .dot_bl:before{top:-2px; width:4px; height: 4px;}
#sub_greeting .chgrebg_txt > .txt01{color:#000; font-size:22px;}
#sub_greeting .chgrebg_txt > .txt02{font-size: 28px;}
#sub_greeting > .chggr_txt > .greeting{margin: 15px 0 0 0;}
#sub_greeting > .chggr_txt > .greeting > ul > li{margin:0; font-size: 14px;}
}

/* 의회구성 */
#sub_org > .org_linebox > .summary{padding:44px 50px; border-radius:50px 0 0 0; box-sizing: border-box; background:url('/council/council/images/ch/sub/orgt_bg.jpg')no-repeat;     background-size: cover;}
#sub_org > .org_linebox > .summary > h3{font-size: 40px; font-weight: 100; color:#fff; font-family: 'gmarket';}
#sub_org > .org_linebox > .summary > h3 > span{color:#FFF6BD; font-weight: 600;}
#sub_org > .org_linebox > .summary >p{margin:14px 0 0 0;}
#sub_org > .org_linebox > .summary > img{bottom:0; right:37px;}
#sub_org > .org_linebox > .org1{position:relative; width:100%; height:960px; border:1px solid #0a9ce2; border-top: none; border-radius: 0 0 20px 20px; box-sizing: border-box;}

/*직위*/
/* 공통 */
#sub_org .org1 strong{position:absolute; transform:translateX(-50%); width:200px; height:80px; font-size: 25px; font-weight:600; line-height:80px; color:#fff; box-shadow:0px 2px 11px 2px rgb(0 0 0 / 15%); text-align:center; border-radius:35px;}
/* 의장 */
#sub_org .org1 > li > strong{width:150px; height:150px; left:30%; top:80px; line-height:150px; border:1px solid #fff; border-radius:100%; background:url(../../images/ch/sub/orgb_chairbg.jpg); background-size: cover;}
/* 부의장 */
#sub_org .org2 > li > strong{top:278px; left:30%; border:1px solid #fff; background:url(../../images/ch/sub/orgb_vi.jpg); background-size: cover;}
/* 상임위원회,특별위원회 */
#sub_org .org3_1 > strong{top:408px; left:17.5%;}
#sub_org .org3_1 > ul,
#sub_org .org3_2 > ul{position: absolute; top:540px; left:17%;}
#sub_org .org3_2 > strong{top:408px; left:42.5%;}
#sub_org .org3_1 > strong,
#sub_org .org3_2 > strong{background:url(../../images/ch/sub/orgb_comm.png)repeat;}

#sub_org .org3_2 > ul{left:42.5%;}

/*상임위원회,사무국장 ul>li 공통*/
#sub_org .org3 ul{transform: translateX(-50%);}
#sub_org .org3 ul:after{content:''; display: block; clear: both;}
#sub_org .org3 ul li {position:relative; padding:16px 0 0 0; width:60px; height:350px; font-size: 22px; border: 1px solid #0CA5C5; background:#F9F9F9; border-radius:10px; line-height: 120%; text-align: center; box-sizing: border-box; float: left;}
#sub_org .org3 ul li + li{margin:0 0 0 10px;}
#sub_org .org3_1 ul li{padding:75px 0 0;}

/* 사무국장 */
#sub_org .org3_3 > strong{top:408px; left:82% !important; background:url(../../images/ch/sub/orgb_sg.png);}
#sub_org .org3_3 > ul{position: absolute; top:540px; left:82%; width:200px;}
#sub_org .org3_3 > ul > li:nth-child(1),
#sub_org .org3_3 > ul > li:nth-child(2){padding:126px 0 0 0;}
#sub_org .org3_3 > ul > li:nth-child(2)::before{top:-52px; left:50%; width: 1px; height: 52px; background:#ccc;}
#sub_org .org3_3 > ul > li:nth-child(3){padding:104px 0 0 0;}
/* 전문위원 */
#sub_org .org3_4 > strong{top:480px; left:87.5%; background:url(../../images/ch/sub/orgb_ecm.png);}
/*라인*/
#sub_org .org1 li:before,
#sub_org ul:before{content: ''; position: absolute; transform: translateX(-50%);}
#sub_org .org1 > li:before{top:231px; left:30%; width:1px; height:17.5%; background:#ccc}
#sub_org .org3_1:before{width:25.4%; height:157px; top:383px; left:30%; background:#fff; border:1px solid #ccc; border-bottom: 0;}
#sub_org .org3_1 > ul:before{top:-25px; left:50%; width:78%; height:12%; border:1px solid #ccc; border-bottom: 0;}
#sub_org .org3_1 > ul > li:nth-child(2):before{top:-26px; left:113%; width:129%; height:25px; border:1px solid #ccc; border-bottom:none; background:#fff;}
#sub_org .org3_3:before{top:254px; left:56%; width:52%; height:156px; background:#fff; border:1px solid #ccc; border-bottom: 0; border-left: 0; z-index: -1;}
#sub_org .org3 li:not(.org3_1) > ul:before{top:-25px; left:50%; width:71%; height:12%; border:1px solid #ccc; border-bottom: 0;}
#sub_org .org3_4:before{width:17%; height:1px; top:502px; left:76%; background:#ccc;}
/*조직도 밑 텍스트*/
#sub_org > .org_linebox > .org1_txt{margin:50px 0; font-size: 20px; color:#333;}
#sub_org > .org_linebox > .org1_txt > p{padding:0 0 24px 22px;position: relative;}
#sub_org > .org_linebox > .org1_txt > p:last-child{padding:0 0 0 22px;}
#sub_org > .org_linebox > .org1_txt > p::before{content: ''; display: block; position:absolute; top:7px; left:0; width:10px; height:10px; background:#307ed3; border-radius: 100%;}

/* 테이블 */
#sub_org  > .org_grpinfo .specom_tabl{margin:25px 0 0 0;}
#sub_org  > .org_grpinfo .specom_tabl th, .specom_tabl td{font-size:20px;}
#sub_org  > .org_grpinfo .specom_tabl td{text-align: left;padding:8px 20px; box-sizing: border-box;}

/* 상임위원회 */
#sub_org > .org_grpinfo .commbox{display:flex; justify-content:space-between; flex-wrap:wrap; padding:28px 0px 0 0;}
#sub_org > .org_grpinfo .commbox > div{width:21.7%;}
#sub_org > .org_grpinfo .commbox > div > .tit{padding:0; margin:0; height:80px; line-height:80px; font-size:25px; font-weight:600; text-align:center; border-radius:30px; color:#fff; text-shadow:1px 1px rgba(0,0,0,0.3);box-sizing:border-box; background:url(../../images/ch/sub/orgbb_stan.png);}
#sub_org > .org_grpinfo .commbox > div > ul{margin:5px 0 50px 0; width:100%; box-sizing:border-box; border:1px solid #07B5B0; border-radius: 10px;}
#sub_org > .org_grpinfo .commbox > div > ul > li{padding:3px 0; font-size: 22px; border-bottom: 1px dashed #ccc; text-align: center;}
#sub_org > .org_grpinfo .commbox > div > ul > li:last-child{border-bottom: none;}

@media all and (max-width:1149px){
#sub_org > .org_linebox > .summary > img{display: none;}
#sub_org > .org_linebox > .org1_txt{padding:0 10px;}
}

@media all and (max-width:1024px){
#sub_org > .org_linebox > .summary > h3{font-size: 34px;}
#sub_org > .org_linebox > .summary >p{font-size: 17px;}
#sub_org > .org_linebox > .summary > h3{font-size: 30px;}
#sub_org > .org_linebox > .summary >p{padding:0; font-size: 15px;}
#sub_org > .org_linebox > .org1_txt{font-size: 17px; margin: 22px 0;}
#sub_org > .org_linebox > .org1_txt > p{padding: 0 0 15px 12px;}
#sub_org > .org_linebox > .org1_txt > p::before{width: 6px; height: 6px; top:8px;}
#sub_org > .org_linebox > .org1_txt > p:last-child{padding:0 0 0 12px;}
#sub_org > .org_grpinfo > .dotted > li > p{font-size: 18px;}
#sub_org > .org_grpinfo .commbox > div > .tit{font-size: 18px;}
#sub_org > .org_grpinfo .commbox > div > ul > li{font-size: 18px;}
#sub_org > .org_grpinfo .specom_tabl th, .specom_tabl td{font-size: 17px;}
    
#sub_org > .org_linebox > .org1{height: 835px;}
#sub_org .org1 strong{width:165px; height:65px; line-height:65px; font-size:18px;}
#sub_org .org1 > li > strong{top:50px; width:130px; height:130px; line-height: 130px;}
#sub_org .org1 > li:before{top:181px; height: 24%;}
#sub_org .org2 > li > strong{top:254px;}
#sub_org .org3_1:before{top:363px;height:142px;}
#sub_org .org3 ul{top:505px;}
#sub_org .org3 strong{top:388px;}
#sub_org .org3 li:not(.org3_1) > ul:before{height:15%;}
#sub_org .org3 ul li{width:50px; height:279px; font-size:17px;}
#sub_org .org3_1 ul li{padding:65px 0 0;}
#sub_org .org3_3:before{top:217px; height: 170px;}
#sub_org .org3_4 > strong{top:432px;}
#sub_org .org3_4:before{top:467px;}
#sub_org .org3_3 > ul{width:170px;}
#sub_org .org3_3 > ul > li:nth-child(1), #sub_org .org3_3 > ul > li:nth-child(2){padding:107px 0 0 0;}
#sub_org .org3_3 > ul > li:nth-child(3){padding:88px 0 0 0;}
}

@media all and (max-width:886px){
#sub_org > .org_linebox > .org1{height: 695px;}
#sub_org .org1 > li:before{height: 27%;}
#sub_org .org3 ul{top:483px;}
#sub_org .org3_3 > ul{width:auto;}
#sub_org .org3 ul li{float:none; width:145px; height:auto; padding:10px 0 !important; font-size:15px; word-break:keep-all;} 
#sub_org .org3 ul li + li{margin:5px 0 0;}
    
#sub_org .org3_1:before{height:260px;}
#sub_org .org3_3:before{height:380px;}
    
#sub_org .org3 ul li br,
#sub_org .org3 ul:before,
#sub_org .org3 ul li:before{display:none !important;}
}

@media all and (max-width:768px){
#sub_org > .org_linebox > .org1{height:839px;}
    
#sub_org > .org_linebox > .org1_txt{font-size: 15px;}
#sub_org > .org_linebox > .summary > h3{font-size:25px;}
#sub_org > .org_grpinfo > .dotted > li > p{font-size: 16px;}
#sub_org > .org_linebox > .org1_txt > p{padding:0 0 10px 12px;}
#sub_org > .org_grpinfo .commbox > div{width:48%;}
#sub_org > .org_grpinfo .commbox > div > .tit{font-size: 16px; height: 64px; line-height: 64px;}
#sub_org > .org_grpinfo .commbox > div > ul > li{font-size: 15px;}
#sub_org > .org_grpinfo .specom_tabl th, .specom_tabl td{font-size: 16px;}
#sub_org > .org_grpinfo .specom_tabl th, .specom_tabl td{font-size: 15px;}    
    
#sub_org .org1 > li > strong{width:110px; height:110px; line-height:110px;}
#sub_org .org1 strong{width:125px; height:55px; line-height:55px;}
#sub_org .org2 > li > strong{top:211px;}
#sub_org .org3 strong{top:305px; left:30%;}
#sub_org .org3 .org3_2 strong{top:575px;}
#sub_org .org3 ul{top:370px;}
#sub_org .org3_1 > ul{left:30%;}
#sub_org .org3_2 > ul{top:640px; left:30%;}
    
#sub_org .org1 > li:before{top:150px; height:75%;}
#sub_org .org3_1:before{display:none;}
#sub_org .org3_3:before{top:185px; height:290px;}
}

@media all and (max-width:620px){
#sub_org .org1 strong{font-size:15px;}
#sub_org .org3 ul li{font-size:14px;}

#sub_org > .org_linebox > .summary{padding: 30px 34px;}
#sub_org > .org_linebox > .org1_txt{font-size: 14px;}
#sub_org > .org_grpinfo > .dotted > li > p{font-size: 15px;}
#sub_org > .org_grpinfo .commbox > div{width: 100%; margin:0}
#sub_org > .org_grpinfo .commbox > div > .tit{height: 48px; line-height: 48px; background-size: cover;}
#sub_org > .org_grpinfo .commbox > div > ul{margin: 5px 0 28px 0;}
#sub_org .specom_tabl > .table_wrap{margin:0 0 23px 0;}
#sub_org > .org_grpinfo > .dotted > li > p{font-size: 14px;}
#sub_org > .org_grpinfo .specom_tabl th, .specom_tabl td{font-size: 14px;}
.specom_tabl > p{display: none;}
}

@media all and (max-width:480px){
#sub_org .org3 ul li{width:120px;}
#sub_org .org3_3 > strong,
#sub_org .org3_3 > ul{left:75% !important;}
#sub_org .org3_3:before{left:53%; width:45%;}
}

@media all and (max-width:380px){
#sub_org > .org_linebox > .summary{background-size: cover;}
}





/* 의회연혁 */
/* 탭 */
#sub_history > .tabmenu{position: relative;}
#sub_history > .tabmenu:before{content:''; display:block; width:100%; border-bottom: 1px solid #65D291; position: absolute; top:60px; left:0;}
#sub_history > .tabmenu > li > a{display: block; position:absolute; top:0; left:0; width:50%; height:60px; line-height:60px; background:#F5F5F5; color:#333; font-size: 22px; text-align: center;}
#sub_history > .tabmenu > li:nth-child(2) > a{left:50%;}
#sub_history > .tabmenu > li.on > a{background:#65D291; color:#fff;}
#sub_history > .tabmenu > li > a:hover{text-decoration: none;}
#sub_history .section{display:none;}
#sub_history .on .section{display: block;}

/* 탭 내용 */
#subContent{overflow: hidden;}
#sub_history > .tabmenu > li > .section{margin:0;}
#sub_history > .tabmenu > li > .frssection{padding:102px 0 0 0;}
#sub_history > .tabmenu > li > .section > p{ margin:0 auto; width:200px; height: 200px; border:1px solid #fff; box-shadow:0 0 10px 0 rgba(0,0,0,0.5); border-radius:100%; position:relative; text-align: center; background:url(../../images/ch/sub/history_bg.png)no-repeat;}
#sub_history > .tabmenu > li:nth-child(2) > .section > p{background: url(../../images/ch/sub/history_bg2.png)no-repeat;}
#sub_history > .tabmenu > li:nth-child(2) > .section > p > span{width: 100%;}
#sub_history > .tabmenu > li > .section > p > span{font-size: 40px; line-height:75%; color:#fff; position: absolute; top:58px; left:50%; transform:translateX(-50%);}
#sub_history > .tabmenu > li > .section > h4:before{content:none;}
#sub_history > .tabmenu > li > .section > .yearwrap{position: relative; padding:36px 0 0 0;}
#sub_history > .tabmenu > li > .section > .sht_line{padding:36px 0 100px 0;}
#sub_history > .tabmenu > li > .section > .yearwrap:before{content: ''; display: block; position: absolute; top:0; left:50%; width: 1px; height:calc(100% + 120px); background:#ccc;}

/* left & right 공통 */
#sub_history .section > .yearwrap > li{position: relative;}
#sub_history .section > .yearwrap > li > p:nth-child(1){position:relative;}
#sub_history .section > .yearwrap > li > p:nth-child(2){font-size: 18px;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(2){line-height: 150%;}
#sub_history .section > .yearwrap > li > p > span{font-size: 18px; font-weight: 600; display:block;}
/* left */
#sub_history .section > .yearwrap > li:nth-child(odd){margin-right:calc(50% + 101px);text-align: right;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1){padding:0 27px 0 0;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(2){padding:0 26px 0 0;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1):after{content: ''; display: block; position: absolute; right:-101px; top:13px; width: 101px; height:1px; background:#ccc;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1) > span:after{content:''; display: block; position: absolute; right:0; top:5px; width: 17px; height:17px; background:url(../../images/ch/sub/history_mark.jpg)no-repeat;}
/* right */
#sub_history .section > .yearwrap > li:nth-child(2n){margin-left:calc(50% + 101px); text-align:left;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(2){padding:0 0 0 26px;}
#sub_history .section > .yearwrap > li:nth-child(2n){text-align: left;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1){padding:0 0 0 27px;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1):before{content: ''; display: block; position: absolute; left:-101px; top:13px; width: 101px; height:1px; background:#ccc;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1) > span:before{content:''; display: block; position: absolute; left:0; top:5px; width: 17px; height:17px; background:url(../../images/ch/sub/history_mark.jpg)no-repeat;}

@media all and (max-width:840px){
#sub_history > .tabmenu > li > .section > p{width: 180px; height: 180px; background-size: contain;}
#sub_history > .tabmenu > li:nth-child(2) > .section > p{background-size: contain;}
#sub_history > .tabmenu > li > .section > p > span{top:52px; font-size:35px;}
#sub_history > .tabmenu > li > .section > .yearwrap > li:nth-child(odd){margin-right: calc(50% + 61px);}
#sub_history .section > .yearwrap > li:nth-child(2n){margin-left: calc(50% + 61px);}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1):after{width:60px; right:-60px;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1):before{width: 60px; left:-60px;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(2){word-break: keep-all;}
#sub_history .section > .yearwrap > li > p > span{font-size: 16px;}
#sub_history .section > .yearwrap > li > p:nth-child(2){font-size: 15px;}
}

@media all and (max-width:650px){
#sub_history > .tabmenu > li > a{font-size: 20px;}
#sub_history > .tabmenu > li > .section > p{width: 170px; height: 170px;}
#sub_history > .tabmenu > li > .section > p > span{top:52px; font-size:32px;}
#sub_history > .tabmenu > li > .section > .yearwrap > li:nth-child(odd){margin-right: calc(50% + 28px);}
#sub_history .section > .yearwrap > li:nth-child(2n){margin-left: calc(50% + 28px);}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1):after{width:29px; right:-29px;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1):before{width: 29px; left:-29px;}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1) > span:after,
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1) > span:before {width: 14px; height: 14px; background-size: contain;}
}

@media all and (max-width:568px){
#sub_history > .tabmenu > li > a{font-size: 17px;}
#sub_history > .tabmenu > li > .section > p{width: 160px; height: 160px;}
#sub_history > .tabmenu > li > .section > p > span{top:47px; font-size: 30px;}
}

@media all and (max-width:380px){
#sub_history > .tabmenu > li > a{font-size: 17px;}
#sub_history > .tabmenu > li > .section > p{width: 150px; height: 150px;}
#sub_history > .tabmenu > li > .section > p > span{top:46px; font-size: 27px;}
#sub_history > .tabmenu > li > .section > .yearwrap > li:nth-child(odd){margin-right: calc(50% + 20px);}
#sub_history .section > .yearwrap > li:nth-child(2n){margin-left: calc(50% + 20px);}
#sub_history .section > .yearwrap > li:nth-child(odd) > p:nth-child(1):after{width:20px; right:-20px;}
#sub_history .section > .yearwrap > li:nth-child(2n) > p:nth-child(1):before{width: 20px; left:-20px;}
}




/* 찾아오시는길 */
#sub_location .roughmap_maker_label .roughmap_lebel_text{display:block; padding:5px 15px; line-height:30px; font-weight:600; font-family:'score'; border-radius:30px; background-color:#fff; font-size:20px;}
#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/common/ico_council.png); background-repeat:no-repeat; background-size:contain;}

#sub_location > .map_wrap > .map > .address{width:100%; padding:39px 50px;border-radius: 0 0 20px 20px; box-sizing:border-box; background:#307ed3;}
#sub_location > .map_wrap > .map > .address > span{font-size:25px; color:#fff; line-height: 100%; font-weight:600; display:inline-block; position: relative;font-family: 'gmarket';}
#sub_location > .map_wrap > .map > .address > span:nth-child(1){padding:0 0 0 39px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2){padding:0 0 0 50px; margin:0 0 0 50px;}
#sub_location > .map_wrap > .map > .address > span:before{content:''; display:block; position: absolute; left:0;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{width:29px; height:40px; top:-10px; background:url(../../images/ch/sub/loc.png)no-repeat;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2):before{width:40px; height:40px; top:-7px; background:url(../../images/ch/sub/tel.png)no-repeat;}
#sub_location > .traf_tip {margin: 40px 0 0 0;}
#sub_location > .traf_tip > div{padding:27px 0 27px 135px; position: relative;}
#sub_location > .traf_tip > div:nth-child(1){padding-top:0; background:url(../../images/ch/sub/circle_car.png)no-repeat;}
#sub_location > .traf_tip > div:nth-child(1):after{content:''; display:block;position:absolute; bottom:0; left:0; background:url(../../images/ch/sub/line.png)repeat; width:100%; height:1px;}
#sub_location > .traf_tip > div:nth-child(2){background:url(../../images/ch/sub/circle_bus.png)no-repeat; background-position: 0% 50%;}
#sub_location > .traf_tip > div > dl:nth-child(2){margin:24px 0 0 0;}
#sub_location > .traf_tip > div > dl > dt{padding:0 0 0 15px; font-size:18px; color:#307ed3 ; font-weight:600; position: relative;}
#sub_location > .traf_tip > div > dl > dt::before{content: ''; display:block; position: absolute; top:12px; left:0; width:6px; height: 6px; background:#307ed3; border-radius: 100%;}
#sub_location > .traf_tip > div > dl > dd{padding:0 0 0 14px; margin:2px 0 0 0; font-size:18px; color:#000;}

@media all and (max-width:922px){
#sub_location > .map_wrap > .map > .address > span{font-size: 19px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1){padding:0 0 0 33px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{width: 23px; background-size: contain;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2){padding:0 0 0 40px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2):before{width: 30px; background-size: contain; }
#sub_location > .traf_tip{padding:0 15px; box-sizing: border-box;}
}

@media all and (max-width:768px){
#sub_location > .map_wrap > .map > div:nth-child(1){height: 450px!important;}
#sub_location > .map_wrap > .map > .address{padding:35px 29px;}
#sub_location > .map_wrap > .map > .address > span{font-size: 18px; display:block;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2){padding:0 0 0 34px; margin:20px 0 0 0;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{width: 21px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2):before{width: 25px;}
#sub_location > .traf_tip{margin:30px 0 0 0;}
#sub_location > .traf_tip > div > dl > dt{font-size: 16px; padding:0 0 0 12px;}
#sub_location > .traf_tip > div > dl > dt::before{width:5px; height:5px; top:10px;}
#sub_location > .traf_tip > div > dl > dd{font-size: 15px;}
}

@media all and (max-width:568px){
#sub_location .roughmap_maker_label .roughmap_lebel_text:before{height:25px; margin:1px 2px 0 0;}
#sub_location .roughmap_maker_label .roughmap_lebel_text{font-size:19px;}

#sub_location > .map_wrap > .map > div:nth-child(1){height: 300px!important;}
#sub_location > .map_wrap > .map > .address > span{line-height: 140%;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{background-position:0 50%;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2):before{background-position:0 30%;}

#sub_location > .traf_tip > div{padding:22px 0 22px 0px;}
#sub_location > .traf_tip > div:nth-child(1){background:none;}
#sub_location > .traf_tip > div:nth-child(2){background:none;}
#sub_location > .traf_tip > div > dl > dt{font-size: 15px;}
#sub_location > .traf_tip > div > dl > dd{font-size: 14px;}
}

@media all and (max-width:480px){
#sub_location .roughmap_maker_label .roughmap_lebel_text{font-size:18px;}
}

@media all and (max-width:444px){
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{background-position:0 100%;}
}

@media all and (max-width:380px){
#sub_location > .map_wrap > .map > div:nth-child(1){height: 250px!important;}
#sub_location > .map_wrap > .map > .address{padding:25px 23px;}
#sub_location > .map_wrap > .map > .address > span{font-size: 16px; line-height: 140%;}
#sub_location > .map_wrap > .map > .address > span:nth-child(1):before{background-position:0 100%; width:20px;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2){padding:0 0 0 34px; margin:15px 0 0 0;}
#sub_location > .map_wrap > .map > .address > span:nth-child(2):before{background-position:0 21%; width:25px;}
#sub_location > .traf_tip{margin:20px 0 0 0;}
#sub_location > .traf_tip > div{padding:17px 0 17px 0px}
#sub_location > .traf_tip > div > dl:nth-child(2){margin:15px 0 0 0;}
}



/* 숙제도우미 공통 */
.summary{width:100%; position:relative; background:url(../../images/ch/sub/subtop_bg.png)no-repeat; background-size: cover;}
.summary > p{font-size:18px; line-height:170%; font-weight:200; color:#fff; display: inline-block; box-sizing: border-box;}
.summary > img{position: absolute;}
.section{margin: 45px 0 0 0;}
.section h4{margin:21px 0 0 0;font-size: 23px; position: relative;}
.section h4:before{content:''; display:block; position: absolute; top:5px; left:0; width:18px; height:18px;background:url(../../images/ch/sub/submark.png)no-repeat;}
.section .dotted > li:nth-child(1) > h4 {margin-top:0;}
.section .dotted p{padding:0 0 0 27px; margin:10px 0 0 0; font-size: 20px;}
.section .dotted .dash{padding:0 0 0 27px; margin:8px 0 0 0;}
.section .dotted .dash > li {font-size: 20px;}
.section .dotted .dash > li > span{font-weight: 600;}
.section .nodotted{font-size: 20px;}

@media all and (max-width:1160px){
.summary > p{font-size: 18px;}
.section{padding:0px 10px;}
.section .dotted h4{font-size: 21px;}
.section .dotted p{font-size: 18px;}
.section .dotted .dash > li{font-size:17px;}
.section .nodotted{font-size: 18px;}
}

@media all and (max-width:924px){
.summary > p{font-size: 17px;}
.section h4:before{top:5px;}
.section .dotted h4{font-size: 19px;}
.section .dotted p{font-size: 16px;}
.section .nodotted{font-size: 16px;}
}

@media all and (max-width:800px){
.summary > p{font-size: 17px;}
}

@media all and (max-width:716px){
.summary > p{font-size: 16px; padding:34px 39px 34px 39px;}
.section .dotted h4{font-size: 18px; top:5px;}
.section .dotted p{font-size: 15px;}
}

@media all and (max-width:568px){
.summary > p{font-size: 15px;}
.section h4:before{top:3px;}
.section .dotted p{font-size: 14px; padding:0 0 0 22px; margin:7px 0 0 0;}
.section .dotted .dash > li {font-size: 14px;}
.section .nodotted{font-size: 14px;}
}



/* 숙제도우미 > 회의원칙 */
/* 상단 bg */
.sub_rule > .summary > p{padding:74px 0 74px 50px;}
.sub_rule > .summary > img{position: absolute; bottom:0; right: 9px;}


@media all and (max-width:1160px){
.sub_rule > .summary > p{width:100%; padding:44px 49px 44px 49px;}
.sub_rule > .summary > img{display: none;}
.sub_rule > .section .dotted h4{padding:0 0 0 24px;}
.sub_rule > .section .dotted h4:before{top:5px;}
}

@media all and (max-width:924px){
.sub_rule > .summary > img{width:250px;}
.sub_rule > .summary > p{padding:44px 49px 44px 49px;}
.sub_rule > .section{margin:35px 0 0 0;}
.sub_rule > .section .dotted h4:before{top:3px;}
}

@media all and (max-width:800px){
.sub_rule > .summary > p{padding:44px 49px 44px 49px; width:100%;}
}

@media all and (max-width:716px){
.sub_rule > .summary > img{display: none;}
.sub_rule > .summary > p{padding:34px 39px 34px 39px; width: 100%;}
.sub_rule > .section{margin:30px 0 0 0;}
.sub_rule > .section .dotted h4{padding:0 0 0 23px;}
.sub_rule > .section .dotted h4:before{top:2px;}
}



/* 숙제도우미 > 의회의필요성 */
/* 상단 bg */
.sub_need > .summary > p{padding:51px 0 51px 50px;}
.sub_need > .summary > img{bottom:0; right: 26px;}

@media all and (max-width:1146px){
.sub_need > .summary > img{width:170px; right: 0;}
}

@media all and (max-width:1024px){
.sub_need > .summary > p{width:100%; padding:60px 49px 60px 49px;}
.sub_need > .summary > img{display: none;}
}
    
@media all and (max-width:924px){
.sub_need > .summary > img{width:230px;}
.sub_need > .summary > p{padding:44px 49px 44px 49px; width: 100%;}
.sub_need > .section{margin:35px 0 0 0;}
}
    
@media all and (max-width:800px){
.sub_need > .summary > img{width:220px;}
.sub_need > .summary > p{padding:44px 49px 44px 49px; width:100%;}
}
    
@media all and (max-width:716px){
.sub_need > .summary > p{padding:34px 39px 34px 39px; width: 100%;}
.sub_need > .section{margin:30px 0 0 0;}
}



/* 숙제도우미 > 의회에서 하는 일 */
/* 상단 bg */
.sub_work > .summary > img{bottom:0; right: 0px;}
.sub_work > .summary > p{padding:74px 0px 74px 49px;}

@media all and (max-width:1164px){
.sub_work > .summary > img{width:200px; right:0;}
}

@media all and (max-width:1024px){
.sub_work > .summary > img{display: none;}
.sub_work > .summary > p{padding:60px 49px 60px 49px;}
}

@media all and (max-width:924px){
.sub_work > .summary > p{padding:44px 49px 44px 49px;}
}

@media all and (max-width:716px){
.sub_work > .summary > p{padding:50px 49px 50px 49px}
}



/* 숙제도우미 > 회의진행과정 */
/* 상단 bg */
.sub_process > .summary > img{bottom:0; right: 0px;}
.sub_process > .summary > p{padding:88px 383px 88px 49px;}
/* 탭 */
.sub_process > .tabmenu{position: relative;}
.sub_process > .tabmenu:before{content:''; display:block; width:100%; border-bottom: 1px solid #65D291; position: absolute; top:60px; left:0;}
.sub_process > .tabmenu > li > a{display:block; position:absolute; top:0; left:0; width:20%; height:60px; line-height:60px; font-size:22px; color:#333;background:#F5F5F5; text-align: center; }
.sub_process > .tabmenu > li.on > a{background:#65D291; color:#fff;}
.sub_process > .tabmenu > li > a:hover{text-decoration: none;}
.sub_process > .tabmenu > li:nth-child(2) > a {left: 20%;}
.sub_process .section {display:none; padding:92px 0 0 0;} 
.sub_process .on .section {display:block;}
/* 탭 내용 */
.sub_process .section > p {font-size: 20px; padding:0 0 0 27px;}
.sub_process .section > .wrap{margin:23px 0 0 0; padding: 0 0 0 27px;}
.sub_process .section > .wrap > .step > li { margin:28px 0 0 0;}
.sub_process .section > .wrap > .step > li > .green{color:#2e9c9b;}
.sub_process .section > .wrap > .step > li > strong{font-size: 20px;}
.sub_process .section > .wrap > .step > li > p{font-size: 18px; color:#333;margin:7px 0 0 0;}
.sub_process .section > .wrap > .step > li > ul > li{font-size: 18px; color:#333;margin:7px 0 0 0;}


@media all and (max-width:1199px){
.sub_process > .summary > img{width:200px; right:0;} 
.sub_process > .summary > p{padding:88px 0px 88px 49px;}
}

@media all and (max-width:1138px){
.sub_process > .summary > img{display:none;}
.sub_process > .summary > p{padding:60px 49px;}
.sub_process .section{padding:92px 10px 0 10px;}
}

@media all and (max-width:1024px){
.sub_process > .tabmenu > li > a{width:35%; font-size: 20px;}
.sub_process > .tabmenu > li:nth-child(2) > a{left:35%;}
.sub_process .section{padding:75px 10px 0 10px;}
.sub_process .section > p{padding:10px 0 0 27px; font-size: 18px;}
.sub_process .section > .wrap > .step > li{margin:18px 0 0 0;}
.sub_process .section > .wrap > .step > li > strong{font-size:19px;}

}

@media all and (max-width:716px){
.sub_process > .summary > p{padding:50px 49px;}
.sub_process .section > p{font-size: 16px;}
.sub_process .section > .wrap > .step > li{margin:14px 0 0 0;}
.sub_process .section > .wrap > .step > li > strong{font-size: 17px;}
.sub_process .section > .wrap > .step > li > p{font-size: 16px;}
.sub_process .section > .wrap > .step > li > ul > li{font-size: 16px;}
}

@media all and (max-width:568px){
.sub_process > .tabmenu > li > a{width:50%; font-size: 17px;}
.sub_process > .tabmenu > li:nth-child(2) > a{left:50%;}
.sub_process .section > p{font-size: 15px;}
.sub_process .section > .wrap{margin:20px 0 0 0;}
.sub_process .section > .wrap > .step > li > strong{font-size: 16px;}
.sub_process .section > .wrap > .step > li > p{font-size: 15px;}
.sub_process .section > .wrap > .step > li > ul > li{font-size: 15px;}
}

@media all and (max-width:380px){
.sub_process .section > p{font-size: 14px;}
.sub_process .section > .wrap{margin:15px 0 0 0;}
.sub_process .section > .wrap > .step > li > p{font-smooth: 14px;}
.sub_process .section > .wrap > .step > li > strong{font-size: 15px;}
.sub_process .section > .wrap > .step > li > ul > li{font-size: 14px;}
}




/* 숙제도우미 > 의회의 생성 */
/* 상단 bg */
.sub_creat > .summary > img{bottom:0; right: 0px;}
.sub_creat > .summary > p{padding:90px 369px 90px 49px;}

@media all and (max-width:1100px){
.sub_creat > .summary > img{width:260px;}
}

@media all and (max-width:1040px){
.sub_creat > .summary > p{padding:95px 310px 95px 49px;}
}

@media all and (max-width:1024px){
.sub_creat > .summary > img{display: none;}
.sub_creat > .summary > p{padding:60px 49px 60px 49px; width:100%;}
}

@media all and (max-width:924px){
.sub_creat > .summary > img{width: 210px;}
.sub_creat > .summary > p{padding:44px 49px 44px 49px;}
}

@media all and (max-width:716px){
.section{margin:30px 0 0 0;}
.sub_creat > .summary > p{padding:34px 39px 34px 39px;}
}



/* 숙제도우미 > 지방의회의 발전,생성 */
/* 상단 bg */
.sub_grow > .summary > img{bottom:0; right: 3px;}
.sub_grow > .summary > p{padding:50px 0 50px 49px;}

@media all and (max-width:1120px){
.sub_grow > .summary > img{width:200px; right:10px;}
}

@media all and (max-width:1024px){
.sub_grow > .summary > p{width:100%; padding:60px 49px 60px 49px;}
.sub_grow > .summary > img{display: none;}
}
@media all and (max-width:924px){
.sub_grow > .summary > img{width:230px;}
.sub_grow > .summary > p{padding:44px 49px 44px 49px; width: 100%;}
.sub_grow > .section{margin:35px 0 0 0;}    
}
        
@media all and (max-width:800px){
.sub_grow > .summary > img{width:220px;}
.sub_grow > .summary > p{padding:44px 49px 44px 49px; width:100%;}
}
        
@media all and (max-width:716px){
.sub_grow > .summary > p{padding:34px 39px 34px 39px; width: 100%;}
.sub_grow > .section{margin:30px 0 0 0;}
}



/* 유용한 사이트 */
.sub_site > .section{width:100%; background:#f3f3f3; box-sizing: border-box;}
.sub_site > .section > .sitelink{padding:70px 26px 40px;}
.sub_site > .section > .sitelink:after{content: ''; display:block; clear: both;}
.sub_site > .section > .sitelink > li{padding:0 7px 30px 0; width:24.5%; float:left; text-align: center; box-sizing: border-box;}

@media all and (max-width:970px){
.sub_site > .section > .sitelink{padding: 45px 26px 15px;}
.sub_site > .section > .sitelink > li{width:33.333%;}
}

@media all and (max-width:568px){
.sub_site > .section > .sitelink > li{width:50%;}
}

@media all and (max-width:400px){
.sub_site > .section > .sitelink{padding:45px 26px 25px;}
.sub_site > .section > .sitelink > li{padding:0 7px 20px 0;}
}

/* 의회용어사전 */
.line_box{position:relative; margin:0 0 40px;}
.line_box:before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box; border-radius:20px; border:30px solid transparent; 
    border-image:url(../../images/common/bg_info1.gif) 30; -webkit-border-image:url(../../images/common/bg_info1.gif) 30; border-image-repeat:repeat; -webkit-border-image-repeat:repeat;}
.line_box:after{content:''; position:absolute; top:0; right:0; width:23.4%; height:40%; border-radius:0 20px 0 0; border-top:3px solid #2b425b; border-right:3px solid #2b425b;}
.line_box > div{z-index:1; position:relative; box-sizing:border-box; padding:50px; word-break:keep-all;}
.line_box > div:before,
.line_box > div:after{z-index:-1; content:''; position:absolute; bottom:-1px; right:0; width:calc(70% + 17px); height:5px; background:#fff url(../../images/common/bg_info2.gif) no-repeat bottom left;}
.line_box > div:after{bottom:0; width:70%; height:60%; border-radius:0 0 20px 0; border-bottom:3px solid #295daa; border-right:3px solid #295daa; background:none;}
.line_box > div img{max-width:100%;}

.tit_txt{background-image:url(../../images/ch/sub/submark.png); background-position:top 4px left;}

@media all and (max-width:1024px) {
    .line_box > div{padding:35px;}
}

@media all and (max-width:768px) {
    .line_box > div{padding:25px !important;}
	.tit_txt{background-position:top 3px left;}
}

@media all and (max-width:380px) {
    .line_box > div{padding:20px;}
}

.sch_txt,
#sub_voca .indexArea .index_word{position:relative; box-sizing:border-box; padding:50px 0 50px 111px; background-image:linear-gradient(to right, #ddd 75%, rgba(255,255,255,0) 0%); background-position:bottom; background-size:15px 1px; background-repeat:repeat-x;}
#sub_voca .indexArea .index_word{padding-bottom:45px;}
.sch_txt .tit, #sub_voca .indexArea .tit{position:absolute; top:50%; transform:translateY(-50%); left:22px; font-size:20px; font-weight:800;}
.sch_txt input[type="text"]{height:50px; line-height:48px; border-radius:25px; padding:0 0 0 49px;}
.sch_txt button{position:absolute; top:50px; right:0; width:100px; height:50px; line-height:50px; box-sizing:border-box; padding:0 19px 0 0; border-radius:25px; font-weight:400; color:#fff; box-shadow:3px 0 5px rgba(119,119,119,0.5);
    background:rgb(47,162,171);
    background: -moz-linear-gradient(95deg, rgba(47,162,171,1) 0%, rgba(43,127,171,1) 50%, rgba(41,92,170,1) 100%);
    background: -webkit-linear-gradient(95deg, rgba(47,162,171,1) 0%, rgba(43,127,171,1) 50%, rgba(41,92,170,1) 100%);
    background: linear-gradient(95deg, rgba(47,162,171,1) 0%, rgba(43,127,171,1) 50%, rgba(41,92,170,1) 100%);} 
.sch_txt button:before,
.sch_txt button:after{content:''; top:16px; right:25px; position:absolute; width:14px; height:14px; box-sizing:border-box; border:1px solid #fff; border-radius:50%;}
.sch_txt button:after{top:33px; right:21px; width:8px; height:1px; border:none; transform:rotate(45deg); transform-origin:100% 100%; background:#fff;}

#sub_voca .line_box{margin:0 0 27px;}
#sub_voca .indexArea{padding:0 50px 46px;}
#sub_voca .indexArea form{padding-right:20px;}
#sub_voca .indexArea form button{right:20px;}
#sub_voca .index_word ul:after,
#sub_voca .search_result ul:after{content:''; display:block; clear:both;}
#sub_voca .index_word ul li{float:left; margin:0 10px 5px 0;}
#sub_voca .index_word ul li a{display:block; width:50px; height:50px; line-height:50px; border-radius:50%; background:#f5f5f5; font-size:20px; text-align:center;}
#sub_voca .index_word ul li.current_on a{background:#2b425b; font-weight:800; color:#fff;}

#sub_voca .search_result ul{box-sizing:border-box; padding:43px 22px 0;}
#sub_voca .search_result ul li{float:left; width:20%; padding:0 0 12px 15px; word-break:break-all;}

#sub_voca #pagingNav a{z-index:1; width:25px; height:25px; line-height:25px; border:none; margin:0 4px;}
#sub_voca #pagingNav a:not(.btn_num):before{opacity:0; visibility:hidden; z-index:-1; content:''; position:absolute; bottom:2px; left:0; width:100%; height:8px; border-radius:25px; background:#fef0be;}
#sub_voca #pagingNav a.num_current:before{opacity:1; visibility:visible;}
#sub_voca #pagingNav a:hover,
#sub_voca #pagingNav a:focus,
#sub_voca #pagingNav a.num_current{background-color:transparent; color:#222;}

#sub_voca #pagingNav .btn_num{opacity:0.7; background-position:center 6px;}
#sub_voca #pagingNav .btn_num.first{margin:0 -3px 0 0; background-position:center -38px;}
#sub_voca #pagingNav .btn_num.prev{background-position:center 5px;}
#sub_voca #pagingNav .btn_num.last{margin:0 0 0 -3px; background-position:center -37px;}

#sub_voca .word_defined dd{padding:0 0 0 32px;}

@media all and (max-width:1024px) {
    .sch_txt, #sub_voca .indexArea .index_word{padding:30px 0 30px 111px;}
    .sch_txt .tit, #sub_voca .indexArea .tit{font-size:18px;}
    .sch_txt button{top:30px;}
    
    #sub_voca .indexArea .index_word{padding-bottom:25px;}
    #sub_voca .search_result ul{padding-top:25px;}
    #sub_voca .index_word ul li a{width:36px; height:36px; line-height:36px; font-size:1em;}
}

@media all and (max-width:768px) {
    #sub_voca .indexArea{padding:0 35px 30px !important;}
    #sub_voca .index_word ul li a{width:30px; height:30px; line-height:30px;}
    #sub_voca .search_result ul li{width:25%;}
    #sub_voca #pagingNav .btn_num.first{background-position:center -35px;}
    #sub_voca #pagingNav .btn_num.last{background-position:center -34px;}
    #sub_voca .word_defined dd{padding:0 0 0 25px;}
}

@media all and (max-width:568px) {
    .sch_txt, #sub_voca .indexArea .index_word{padding-left:80px;}
    .sch_txt .tit, #sub_voca .indexArea .tit{left:0; font-size:1.067em;}
    .sch_txt input[type="text"]{padding:0 0 0 20px !important;}
    .sch_txt button{width:70px; padding:0;}
    .sch_txt button:before, .sch_txt button:after{display:none;}
    
    #sub_voca .indexArea form{padding-right:0;}
    #sub_voca .indexArea form button{right:0;}
    #sub_voca .search_result ul{padding:25px 0 0;}
    #sub_voca .search_result ul li{width:33.33%;}
    #sub_voca #pagingNav .btn_num.first{margin-top:-3px; background-position:center -28px;}
    #sub_voca #pagingNav .btn_num.prev{margin-top:-3px;}
    #sub_voca #pagingNav .btn_num.last{background-position:center -27px;}
    #sub_voca .word_defined dd{padding:0 0 0 20px;}
}

@media all and (max-width:380px) {
    .sch_txt .tit, #sub_voca .indexArea .tit{position:static; padding:0 0 5px; transform:none;}
    .sch_txt, #sub_voca .indexArea .index_word{padding:20px 0 10px;}
    .sch_txt button{top:47px;}
    
    #sub_voca .indexArea{padding:0 25px 15px;}
    #sub_voca .indexArea .index_word{padding-bottom:5px;}
    #sub_voca .search_result ul li{width:50%;}
}