@charset "UTF-8";


/*********************************************
*  skip navi  
*********************************************/
.skipNav   { width: 100%; position: relative; top: 0;  left: 0; z-index: 1000;  }
.skipNav a   { text-align: center; background: #fff; border: 2px solid #ff2400; border-radius: 10px; color: #000; font-size: 1.1em; font-weight: 500; display: block; padding: 10px; } 
.skipNav li   { width: 100%; position: absolute; top: -100px; left: 0; transition: .3s; }
.skipNav li.focus   { top: 0; }


/************************************************************
    layout
*************************************************************/ 
body.mobileZoon    { overflow-x: hidden; position: relative; }
.lawTop_util .content ,
.headerWrap .content ,
.headerWrap .util  ,
.footerWrap .content  ,
#container ,
#Index #containerWrap ,
/* .sitemapWrap .content { width: 100%; max-width: 1400px; margin: 0 auto; } */
.sitemapWrap .content { width: 100%; max-width: 1100px; margin: 0 auto; }

.headerWrap ,
.headerWrap .content ,
.headerWrap .util ,
.headerWrap .util li ,
#gnbWrap ,
#gnbWrap .gnb , 
#gnbWrap .subDepth .head span , 
.lawTop_util ,
.lawTop_util .content  ,
.lawTop_util .nuri   { display: flex; flex-flow: row nowrap; align-items: center; } 

#gnbWrap ,
.headerWrap .util  { flex-grow: 1; justify-content: flex-end; } 

.lawTop_util  { height: 40px; background: #edf1f5; }  
/* .lawTop_util .nuri  { font-size: 14px; margin-left: 10px; } */
.lawTop_util .nuri  { font-size: 14px; }
.lawTop_util .nuri::before  { content: ''; width: 24px; height: 24px; background: url(../images/flag.svg) no-repeat 0 0; background-size: contain; margin-right: 5px; }

.headerWrap { height: var(--topHeader-height); position: relative; z-index: 10; background: #fff; border-bottom: 1px solid #fff; --border: #ccc; }
.headerWrap.fixedHead  { width: 100%; position: fixed; top: 0; left: 0; --topHeader-height: 70px; border-bottom-color: #053863; }
.headerWrap h1 { margin-left: 10px; }
.headerWrap .webMark { width: 56px; height: 40px; background: url(../images/logo_web.png) no-repeat 0 0; background-size: contain; margin-left: 15px; }
.headerWrap .util   { position: absolute; top: -35px; left: 50%; transform: translate(-50%, 0); }
.headerWrap .util li:not(.first):not(.user)::before  { content: ''; width: 5px; height: 5px; background: #909cb8; display: inline-flex; border-radius: 100%; margin-right: 2px; } 
.headerWrap .util a:hover  { color: var(--primary-deepcolor); text-decoration: underline; }
.headerWrap .util a:hover::before  { background-position-y: -20px; }
.headerWrap .util .user   { margin: 0 10px 0 05px; }
.headerWrap .util .user em   { color: #000; font-weight: 600; display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; margin-right: 5px; }
.headerWrap .util .user .icoCnt_user   { width: 24px; height: 24px; background: #d1d8e3; border-radius: 100%; display: inline-flex; align-content: center; justify-content: center; margin-right: 3px; }
.headerWrap .util .user .icoCnt_user::before   { top: 1px; transform: scale(.8); }

#gnbWrap .subDepth { --gap: 38%; width: 100%; min-height: 120px; position: absolute; top: var(--topHeader-height); left: 0; background: #fff; border-top: 1px solid var(--border); border-bottom: 2px solid #053863; display: grid; grid-template-columns: var(--gap) auto; align-items: stretch; }
.headerWrap.fixedHead #gnbWrap .subDepth  { margin-top: -1px; }
#gnbWrap .subDepth a  { text-underline-offset: 4px; }  

#gnbWrap .subDepth .gnb_sub { flex-grow: 1; }
/* #gnbWrap .subDepth .head { width: var(--gap); height: 100%; background: #e7f4fb; color: #053863; font-size: 34px; position: absolute; top: 0; left: 0; } */
#gnbWrap .subDepth .head { display: flex; align-items: flex-start; background: #e7f4fb; color: #053863; font-size: 30px; font-weight: 600; } 
#gnbWrap .subDepth .head span { width: 400px; min-height: 100px; margin: 35px 0 0 37%; position: relative; padding-left: 130px; }
#gnbWrap .subDepth .head span::before { position: absolute; z-index: 1; top: 15px; left: 10px; }
#gnbWrap .subDepth .head span::after { content: ''; width: 100px; height: 100px; background: #fff; border-radius: 40px; display: inline-flex; flex-shrink: 0; position: absolute; top: 0; left: 0; }

#gnbWrap .gnb  { height: var(--topHeader-height); justify-content: flex-end; }
#gnbWrap .gnb > li { padding: 5px 25px; }
#gnbWrap .gnb_sub   { border-left: 1px solid var(--border); --subWidth: 280px; }
#gnbWrap .gnb_sub > li  { display: grid; grid-template-columns: var(--subWidth) auto; align-items: stretch; border-top: 1px solid var(--border); }
#gnbWrap .gnb_sub > li:first-child  { border-top: none; }
#gnbWrap .depth_1 { font-size: 21px; font-weight: 600; position: relative; padding: 10px 5px; z-index: 2; }
#gnbWrap .depth_1:hover { text-decoration: none; }
 
#gnbWrap .depth_1::before { content: ''; width: 0px; height: 4px; background: var(--primary-color); position: absolute; top: 0; left: 50%; display: block; transform: translate(-50% , 0); transition: .2s; }  
#gnbWrap .depth_1.current  { color: var(--primary-deepcolor); }
#gnbWrap .depth_1.current::before  ,  #gnbWrap .depth_1:hover::before  { width: 100%; }

#gnbWrap .depth_2  { min-width: var(--subWidth); background: #f4f5f6; border-right: 1px solid var(--border); font-size: 18px; font-weight: 700; padding: 15px 25px; }  

#gnbWrap .gnb_sub ul  { display: flex; flex-flow: row wrap; align-items: flex-start; margin: 15px 25% 15px 25px; gap: 8px 45px; }
#gnbWrap .gnb_sub > li:last-child .depth_2  { padding-bottom: 25px; }  
#gnbWrap .gnb_sub ul > li a::before  { content: ''; width: 5px; height: 5px; background: #cdd1d5; display: inline-flex; border-radius: 5px; margin-right: 10px; vertical-align: middle; transition: .2s; }
#gnbWrap .depth_2.current ,
#gnbWrap .gnb_sub ul > li .current { color: var(--primary-deepcolor); text-decoration: underline; }
#gnbWrap .gnb_sub ul > li .current::before ,
#gnbWrap .gnb_sub ul > li a:hover::before  { width: 9px; background: var(--primary-deepcolor); margin-right: 6px; }

#sitemapOpen  { min-width: 120px !important; height: 40px; color: #003380; background: var(--second-color); border-radius: 10px; position: relative; padding: 0 45px 0 20px !important; margin: 0 10px 0 30px; }
#sitemapOpen:hover  { background: #e0e7f5; }
#sitemapOpen::before  { position: absolute; top: calc(50% - 10px); right: 10px; background-position-y: -20px; }
#sideGnbOpen , #sideGnbClose  { display: none; }
#sideGnbClose  { position: absolute; top: -35px; right: 5px; z-index: 101; }

#container   { display: grid; grid-template-columns: var(--sideCnt-width) calc(100% - var(--sideCnt-width) - 50px); align-items: flex-start; column-gap: 50px; margin-bottom: 70px; } 
#container.Full   { grid-template-columns: 100%; column-gap: 0; }
.sideWrap   { width: var(--sideCnt-width); }
.pathZoon ,  .headTitle  { width: 100%; grid-column: 1 / span 2; }


/*    Lnb   */
#sideGnb .lnb a   { display: flex; align-items: center; position: relative; }
#sideGnb .lnb a:hover  { text-decoration: none; }
#sideGnb .lnb a.current  { color: var(--primary-deepcolor); }
#sideGnb .lnb > li  { margin-bottom: 5px; }
#sideGnb .lnb .lnbDepth_1  { min-height: 50px; color: #222; font-size: 1.1em; font-weight: 700; background: #f0f3f5; border: 2px solid transparent; padding: 10px 15px; transition: .2s; }
#sideGnb .lnb .lnbDepth_1:hover , 
#sideGnb .lnb .lnbDepth_1.current  { color: var(--primary-deepcolor); background: #fff; border-color: var(--primary-color); }
#sideGnb .lnb .lnbDepth_1[role='button']  { padding-right: 30px; }
#sideGnb .lnb .lnbDepth_1[role='button']::after  { content: ''; width: 20px; height: 20px; display: block; background: url(../images/ico_cnt.png) no-repeat -280px -20px; position: absolute; top: calc(50% - 10px); right: 8px; filter: grayscale(100); opacity: .4; transform: rotate(-90deg); transition: .2s; }
#sideGnb .lnb .lnbDepth_1[role='button']:hover::after ,
#sideGnb .lnb .lnbDepth_1[role='button'].current::after  { filter: grayscale(0); opacity: 1; transform: rotate(0); }
#sideGnb .lnb .lnb_sub  { margin: 0 10px 20px; }
#sideGnb .lnb .lnb_sub a  { font-size: 1em; font-weight: 600; border-bottom: 1px solid #e3e3e3; padding: 8px 15px; }
#sideGnb .lnb .lnb_sub li:last-child a  { border-bottom: none; }
#sideGnb .lnb .lnb_sub a::before  { content: ''; width: 0; height: 5px; background: var(--primary-color); border-radius: 3px; display: block; position: absolute; top: 19px; left: -1px; transition: .2s; }
#sideGnb .lnb .lnb_sub a:hover::before  , 
#sideGnb .lnb .lnb_sub a.current::before  { width: 9px; }


/*    main 컨텐츠    */
.containerWrap   { min-height: 300px; }


/*    Footer     */
.footerWrap   { border-top: 1px solid #053863; }
.footerWrap .content  { position: relative; padding: 15px 10px 40px; }
.footerWrap .footer_privacy  ,  .footerWrap .footer_util   { display: flex; flex-flow: row nowrap; align-items: center; margin: 0 0 15px 5px;  }
.footerWrap .footer_privacy li ,  .footerWrap .footer_util li { display: inline-flex; align-items: center; }

.footerWrap .footer_privacy  { gap: 15px; }
.footerWrap .footer_privacy a  { font-weight: 600; }
.footerWrap .footer_privacy li::before  { content: ''; width: 5px; height: 5px; background: #aaa; display: inline-flex; border-radius: 100%; margin-right: 15px; }
.footerWrap .footer_privacy .privacy::before  { display: none; }
.footerWrap .footer_privacy .privacy a   { color: var(--primary-deepcolor); font-weight: 700; }

.footerWrap .familySite   { min-width: 250px; height: 50px; background: #f1f1f1; border-radius: 10px; border: none; position: relative; font-weight: 600; position: absolute; top: 10px; right: 5px; display: inline-flex; align-items: center; justify-content: space-between; padding: 0 10px 0 15px; }
.footerWrap .familySite:hover   { background: var(--second-color); }
.footerWrap .familySite .icoCnt_plus  { width: 34px; height: 34px; border-radius: 10px; background: #fff; border: 1px solid #b7b7b7; display: inline-flex; align-items: center; justify-content: center; margin-left: 30px; }

.footerWrap .footer_util    { column-gap: 30px;  }
.footerWrap .footer_util .icoCnt_phone  { width: 30px; height: 30px; border-radius: 100%; background: #fff; border: 1px solid #b9b9b9; display: inline-flex; align-items: center; justify-content: center; margin-right: 10px; }
.footerWrap .footer_util .guide  { position: relative; padding-right: 20px;  }
.footerWrap .footer_util .guide::after  { content: ''; width: 1px; height: 18px; background: #b6b9c2; position: absolute; top: calc(50% - 9px); right: -5px; }
.footerWrap .footer_util strong  { font-size: 1.25em; font-weight: 600; margin-left: 15px; }
.footerWrap address  ,  .footerWrap .copyright  { font-size: 14px; margin-left: 10px; }
.footerWrap .familySite_Panel  { width: 100%; height: calc(100% + 20px); background: #fff; position: absolute; top: 0; left: 0; z-index: 5; padding: 20px 50px 20px 10px; }
.footerWrap .familySite_Panel .btnClose  { border: none; position: absolute; top: 15px; right: 10px; }
.footerWrap .familySite_Panel ul  { display: flex; flex-flow: row wrap; align-items: center; gap: 15px; } 
.footerWrap .familySite_Panel ul li  { line-height: 1; } 
.footerWrap .familySite_Panel ul li a  { display: inline-flex; border: 1px solid #d1d1d1; border-radius: 10px; }
.footerWrap .familySite_Panel ul li a:hover  { border-color: var(--primary-deepcolor); }


/*    window popup */
.popWrap   { padding: 30px; }
.popHeader  { width: 100%; height: 60px; position: sticky; top: 0; left: 0; z-index: 10; background: #fff; display: flex; align-items: center; justify-content: space-between;  font-size: 1.5em; padding: 0 30px; box-shadow: 0 5px 10px -3px rgba(0, 0, 0, .1); }
@media only screen and (max-width: 600px) {
	.popWrap   { padding: 20px; }
}

/*      페이지 경로     */
.pathZoon   { display: flex; justify-content: flex-end; margin: 20px 0 -15px; padding-right: 10px; }
.pathZoon li   { display: inline-flex; height: 30px; align-items: center; justify-content: center; font-size: 14px; margin-left: 2px; } 
.pathZoon li:not(.icoCnt_home):not(#path_1)::before   { content: ''; width: 20px; height: 20px; background: url(../images/ico_cnt.png) no-repeat -180px 0px; display: inline-flex; margin-right: 2px; opacity: .6; transform: scale(.7); }  
.pathZoon li:empty  ,
.pathZoon #path_1:empty + li::before   { display: none; } 
.pathZoon .icoCnt_home   { width: 30px; height: 30px; border-radius: 100%; background: #f1f1f1; margin-right: 8px; }  


/*     head 타이틀    */
.headTitle   { min-height: 60px; background: url(../images/pattern.png) repeat-x 0 100%; display: flex; align-items: flex-end; padding-left: calc(var(--sideCnt-width) + 60px);  margin-bottom: 40px; }
.headTitle h2   { min-height: 30px; font-size: 2.2em; font-weight: 600; background: #fff;display: flex; align-items: flex-end; padding: 0 40px 5px 0; }
.headTitle h2::before   { margin: 0 35px -20px -20px; }

/*     sub 타이틀    */
.subTitle ,  .inlineTitle   { display: flex; flex-flow: row wrap; align-items: center; gap: 10px; margin-bottom: 10px; }
.subTitle h3  { flex-shrink: 0; flex-grow: 1; background: url(../images/bullet.png) no-repeat 0 50%; color: #000; font-size: 1.4em; font-weight: 600; padding-left: 30px; }
.subTitle h3 small  { font-size: .75em; font-weight: 500; display: inline-flex; margin-left: 5px; }
.subTitle .side  { display: inline-flex; justify-content: flex-end; } 
.subTitle .label_tit  { background: #f4f4f4; border: none; line-height: 1.3em; font-size: 15px; line-height: 1.5em; margin-right: 10px; } 

[class*='icoCnt_'].Title  { flex-shrink: 0; flex-grow: 1; color: #222; font-size: 1.2em; font-weight: 600; position: relative; padding-left: 25px; margin: 0 0 5px 10px; }
[class*='icoCnt_'].Title::before  { position: absolute; top: 5px; left: 0; transform: rotate(-90deg); }
@media only screen and (max-width: 1000px) {
	.subTitle .side { width: 100%; }   
	.subTitle .remark { margin-bottom: 0; }   
}


@media only screen and (max-width: 1800px) {
	#gnbWrap .subDepth { --gap: 30%; }  
	#gnbWrap .subDepth .head span  { margin-left: 27%; }
	#gnbWrap .gnb_sub ul  { margin-right: 20%; }
}
@media only screen and (max-width: 1600px) {
	#gnbWrap .subDepth { --gap: 26%; }  
	#gnbWrap .subDepth .head span  { margin-left: 10%; }
	#gnbWrap .gnb_sub ul  { margin-right: 10%; }
}
@media only screen and (max-width: 1280px) { 
	html	{ overflow-y: auto; } 
	html.sideGnb	{ overflow: hidden; }  
	.headerWrap  { height: 70px; }
	.headerWrap h1 img  { height: 40px; }
	.headerWrap .webMark  { width: 42px; height: 30px; }
	.headerWrap .util   { height: 40px; position: fixed; top: 0px; left: 0; transform: translate(0, 0) ; z-index: 101; background: #ebf2f8; justify-content: flex-start; border-bottom: 1px solid #053863; display: none; } 
	.sideGnb .headerWrap .util   { display: flex; } 
	#sitemapOpen , 	
	.sideGnb .headerWrap #sideGnbOpen , 
	#gnbWrap .subDepth .head ,
	#gnbWrap .depth_1::before ,
	.pathZoon ,
	.sideWrap  { display: none; }  

	#sideGnbOpen , .sideGnb .headerWrap #sideGnbClose  { display: inline-flex; } 
	#sideGnbOpen  { position: absolute; top: 20px; right: 10px; } 
	.sideGnb .headerWrap #sideGnbClose  { position: fixed; top: 5px; } 

	#gnbWrap  { width: 100%; height: 100%; overflow-y: auto; background: #fff; -webkit-overflow-scrolling: touch; position: fixed; top: 0; right: -150%; z-index: 100; transition: .2s; display: block; padding: 40px 0; } 
	.sideGnb .headerWrap #gnbWrap { right: 0; } 
	#gnbWrap .gnb { display: block; } 
	#gnbWrap .gnb > li  {  border-bottom: 1px solid #ccc; padding: 0 }  
	#gnbWrap .depth_1  { min-height: 45px; display: block; padding: 15px 20px; font-size: 18px; transition: .2s; }  
	#gnbWrap .depth_1.current ,
	#gnbWrap .depth_1:hover  { color: #fff; background: var(--primary-color); }    
	#gnbWrap .depth_1::after  { content: ''; width: 20px; height: 20px; background: url(../images/ico_cnt.png) no-repeat -440px 0px; display: block; position: absolute; top: calc(50% - 10px); right: 15px; opacity: .7;  }
	#gnbWrap .depth_1:hover::after ,
	#gnbWrap .depth_1.current::after  { background-position: -240px -40px; opacity: 1;   }
	#gnbWrap .subDepth  { min-height: auto; display: block; position: relative; top: 0; left: 0; border: none; }
	#gnbWrap .gnb_sub ,
	#gnbWrap .gnb_sub > li  ,
	#gnbWrap .gnb_sub ul  { display: block; border: none; }
	#gnbWrap .gnb_sub > li:last-child   { margin-bottom: 10px; }
	#gnbWrap .gnb_sub > li:last-child .depth_2 + ul  { margin-top: -15px; }
	#gnbWrap .depth_2  { min-width: auto; background: none; display: block; border-right: none; font-size: 16px; font-weight: 500; padding: 5px 30px; } 
	#gnbWrap .gnb_sub ul   { margin: 0 0 0 20px; } 
	#gnbWrap .gnb_sub ul > li a  { font-size: 14px; font-weight: 500; padding: 3px 25px; display: block; } 
	#gnbWrap .gnb_sub ul > li:last-child  { margin-bottom: 15px; } 

	#container   { grid-template-columns: 100%; gap: 0;	}
	.headTitle { padding-left: 30px; margin-top: 10px; } 
	.headTitle h2::before  { margin-right: 20px; }
	.containerWrap  { padding: 0 10px; } 
	
}
@media only screen and (max-width: 1100px) {
	.footerWrap .content  { padding: 0 0 20px; font-size: 0.9em; }
	.footerWrap .familySite ,
	.footerWrap .footer_privacy ,
	.footerWrap .footer_util  { border-bottom: 1px solid #ccc; }
	.footerWrap .familySite  { width: 100%; height: 40px; position: relative; top: 0; right: 0; border-radius: 0 }
	.footerWrap .familySite .icoCnt_plus  { width: 30px; height: 30px;  }
	.footerWrap .footer_privacy  ,  .footerWrap .footer_util { margin: 0; }
	.footerWrap .footer_privacy  { min-height: 40px; justify-content: center; }
	.footerWrap .footer_util  { flex-flow: column wrap; padding: 10px; align-items: flex-start; row-gap: 5px; margin-bottom: 10px; } 
	.footerWrap .footer_util li:not(.guide)   { padding-left: 40px; }
	.footerWrap .footer_util .guide   { padding-right: 0; }
	.footerWrap .footer_util .guide::after  { display: none; }
	.footerWrap address  ,  .footerWrap .copyright  { font-size: 12px; text-align: center; }
}
@media only screen and (max-width: 1000px) {
	.headTitle    { margin-top: 5px; }
	.headTitle h2   { padding: 0 20px 5px; }
	.headTitle h2::before ,  .headTitle .screenResize  { display: none; }


	.footerWrap .familySite_Panel .btnClose { transform: scale(.7); } 
	.footerWrap .familySite_Panel ul    { gap: 0; } 
	.footerWrap .familySite_Panel ul li   { transform: scale(.7); margin: -7px -25px;  } 
}
@media only screen and (max-width: 400px) {
	.footerWrap .footer_privacy  { gap: 10px; }
	.footerWrap .footer_privacy li::before  { margin-right: 8px; }
	.footerWrap .footer_util .icoCnt_phone  { display: none; }
	.footerWrap .footer_util li:not(.guide)   { padding-left: 0; }
}

/*    업무절차    */
.empPrdcnt   { position: relative; text-align: center; margin-bottom: 40px; } 
.empPrdcnt p  { font-size: 1.25em; text-align: left; margin-bottom: 10px; }
.empPrdcnt img  { max-width: 100%; margin-bottom: 30px; }
.empPrdcnt .emp  {color: var(--primary-deepcolor); font-weight: 700; text-decoration: #ff0000 underline; text-underline-offset: 5px; }
.empPrdcnt .icoCnt_arrRight  { margin: 0 15px; vertical-align: top; }
.empPrdcnt [class*='num_']  { width: 36px; height: 36px; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 1.1em; font-weight: 700; margin-right: 15px; }
.empPrdcnt .num_1   { background: #4a4b5c; }
.empPrdcnt .num_2   { background: #725bb8; }
.empPrdcnt .num_3   { background: #0b50d0; }
.empPrdcnt .info   { min-height: 40px; background: #eaeff2; padding: 5px 10px; font-size: 1.1em; position: absolute; bottom: -20px; right: 0; }
.empPrdcnt .info .icoCnt_phone  { width: 24px; height: 24px; background: #fff; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; margin-right: 5px; vertical-align: middle; }
.empPrdcnt .info em  { font-weight: 700; margin-left: 5px; }

@media only screen and (max-width: 800px) {  
	.empPrdcnt [class*='num_']  { width: 28px; height: 28px; font-size: .9em; }
	.empPrdcnt .info  { position: relative; bottom: auto; right: auto; margin-top: 20px; } 
}

/*   화면크기 reSize   */
.screenResize  { display: flex; align-items: center; gap: 5px; line-height: 1; background: #fff; padding-right: 30px; }
.screenResize button  { min-width: 30px; height: 30px; background: #fff; border: 1px solid #cad3e1; border-radius: 2em; display: inline-flex; align-items: center; justify-content: center; }
.screenResize button:hover  { background: var(--second-color); }
.screenResize .screen_reset   { min-width: 65px; text-align: center; }
.screenResize .screen_reset::before  { content: '100%'; font-size: 15px; font-weight: 600; display: inline-block;  }
.screenResize button:not(.screen_reset)::before  { margin-right: 0; }
.screenResize button.disabled  { background: var(--disabled-bgcolor); pointer-events: none; }
.screenResize button.disabled::before  { background-position-y: -40px; }
.screenResize #screen  { font-size: 13px; font-weight: 600; margin-left: 10px; }
.screenResize #screen:empty  { margin-left: 0; }




/*********************************************
*  Form
*********************************************/
label  { display: inline-flex; align-items: center; }
input[type='radio'] + label , 
input[type='checkbox'] + label { padding-left: 7px; flex-shrink: 0; }
input[type='radio'] , 
input[type='checkbox']   { width: 20px; height: 20px; flex-shrink: 0; background: #fff; border: 1px solid var(--input-bdcolor); }
input[type='radio']:checked ,
input[type='checkbox']:checked  { background-repeat: no-repeat; background-position: 50% 50%; border-color: var(--primary-color); }

/*   radio    */
input[type='radio']  { border-radius: 100%; }
input[type='radio']:checked  { background-image: url(../images/radioChecked.png); }
input[type='radio']:checked:disabled  { background-image: url(../images/radioChecked_disabled.png); }
.Radio input[type='radio']  ,
.checkCircle[type='checkbox']  { width: 24px; height: 24px; background-color: #edeeee; border: none; box-shadow: inset -1px 2px 2px 1px rgba(0, 0, 0, .1); }

.Radio input[type='radio'] + label ,
.checkLg[type='checkbox'] + label { font-size: 1.2em; font-weight: 700; padding-left: 10px; }
.Radio input[type='radio']:checked ,
.checkLg[type='checkbox']:checked ,
.checkCircle[type='checkbox']:checked  { background-color: var(--primary-color); background-image: url(../images/checked_whiteLg.png); }  

/*    checkbox    */
input[type='checkbox']:checked  { background-image: url(../images/checked.png); }
input[type='checkbox']:checked:disabled  { background-image: url(../images/checked_disabled.png); } 
.checkLg[type='checkbox']   { width: 26px; height: 26px; background: url(../images/checked_whiteLg.png) no-repeat 50% 50% #edeeee; border: none; border-radius: 5px; box-shadow: inset -1px 2px 2px 1px rgba(0, 0, 0, .1); } 
.checkCircle[type='checkbox']  { border-radius: 100%; }

/*    disabled */
input[type='radio']:disabled  ,
input[type='checkbox']:disabled  { background-color: #e1e2e5; }
input[type='radio']:checked:disabled ,
input[type='checkbox']:checked:disabled  { background-color: #f7f7f7; border-color: #3e434c; }


/*   radio  Tab 타입   */
.radioTab  { display: flex; flex-flow: row nowrap; align-items: center; }
.radioTab > li  { flex-grow: 1; position: relative; }
.radioTab > li ~ li  { margin-left: 15px; }
.radioTab input[type='radio'] ,
.radioTab input[type='radio'] + label  { width: 100%; height: 60px; display: inline-flex; flex-grow: 1; align-items: center; justify-content: center; cursor: pointer; }
.radioTab input[type='radio']  { background: #fff; border-radius: 10px; }
.radioTab input[type='radio'] + label  { font-size: 1.5em; position: absolute; top: 0; left: 0; padding: 0; font-weight: 600; }
.radioTab input[type='radio']:checked    { background: var(--primary-color); }
.radioTab input[type='radio']:checked + label  { color: #fff; }



/*     form common      */
select ,
textarea ,
input[type='text'] ,
input[type='password'] ,
input[type='search']    { height: var(--input-height); background-color: #fff; border: 1px solid var(--input-bdcolor); padding: 0 10px; }

/*    disabled     */
select:disabled ,
textarea:disabled ,
input[type='text']:disabled ,
input[type='password']:disabled ,
input[type='search']:disabled    { background-color: var(--disabled-bgcolor); color: var(--disabled-fontcolor); }


/*    select    */
select  { width: 100%; min-width: 80px; max-width: 250px; background-image: url(../images/searchMark.png); background-repeat: no-repeat; background-position: calc(100% - 10px) 50%; padding-right: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-basis: content; flex-grow: 1; } 
select:disabled  { background-image: url(../images/searchMark_disabled.png);  } 

/*    input search */
input[type='search']::-webkit-search-cancel-button { width: 17px; height: 17px; -webkit-appearance: none; background: url(../images/searchClear.png) no-repeat 0 0; margin: 0 -5px 0 5px; cursor: pointer; }

/*    switch  input    */
.switchToggle   { display: inline-flex; align-items: center; position: relative; }
.switchToggle input[type='checkbox']   { width: 40px; height: 22px; background: #cdd1d5; border-radius: 2em; border: none; display: inline-flex; cursor: pointer; }  
.switchToggle label::before  { content: ''; width: 20px; height: 20px; background-color:#fff; background-image: none; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 100%; position: absolute; left: 2px; top: calc(50% - 10px); transition: .2s; transform: scale(.8); } 
.switchToggle input[type='checkbox']:checked      { background: var(--primary-color) } 
.switchToggle input[type='checkbox']:checked + label::before    { left: 18px; background-image: url(../images/checked.png); }
.switchToggle input[type='checkbox']:disabled    { background-color: var(--disabled-bgcolor); cursor: default; }
.switchToggle input[type='checkbox']:disabled + label::before    { background-color: #6d7882; background-image: url(../images/ico_X_white.png); }
.switchToggle input[type='checkbox']:checked:disabled + label::before    { background-image: url(../images/checked_white.png); } 
.switchToggle.txt input[type='checkbox']:not(:disabled) + label     { cursor: pointer; }    /*    checked 텍스트  -  ex)관심법령 등록    */
.switchToggle.txt input[type='checkbox']:checked + label     { text-decoration: underline; text-underline-offset: 4px; } 
.switchToggle.txt input[type='checkbox']:not(:disabled):checked + label     { color: var(--primary-deepcolor);} 


/*   datepicker */
.datepicker  { width: 100%; max-width: 140px; background-image: url(../images/calendar.png); background-repeat: no-repeat; background-position: calc(100% - 5px) 50%; }
.datepicker:disabled   { background-image: url(../images/calendar_disabled.png); }


/*     Firefox에서 버튼 관련 간격 버그      */
/* button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner, 
input[type="submit"]::-moz-focus-inner, 
input[type="file"] > input[type="button"]::-moz-focus-inner  { padding: 0; border: 0; } */



/*********************************************
*  error
*********************************************/
.errorWrap   { height: 100vh; display: flex; justify-content: center; align-items: center; }
.errorPanel   { min-height: 200px; position: relative; padding-left: 240px; font-weight: 500; }
.errorPanel::before   { content: ''; width: 200px; height: 170px; background: url(../images/imgError.png) no-repeat 0 0; display: block; position: absolute; top: 0; left: 0; }
.errorPanel .code   { min-height: 60px; display: flex; flex-flow: row wrap; gap: 20px; padding: 10px 20px 0; line-height: 1em; align-items: baseline; font-size: 72px; font-weight: 700; }
.errorPanel .code span   { font-size: 24px; }
.errorPanel .codeTxt     { min-height: 45px; padding: 25px 20px 0; border-top: 1px solid #ababab; font-size: 20px; }
.errorPanel .goBack      { display: flex; flex-flow: row wrap; gap: 20px; margin-top: 40px; }
.errorPanel .goBack button     { min-width: 200px; }

@media only screen and (max-width: 1000px) {
	.errorPanel    { padding: 150px 0 0 0; margin: 0 30px; }
	.errorPanel::before   { width: 140px; height: 119px; background-size: contain; left: calc(50% - 70px); }
	.errorPanel .code  { font-size: 40px; gap: 10px; line-height: .6em; padding-bottom: 20px; }
	.errorPanel .code span  { font-size: 18px; }
	.errorPanel .code  , 	.errorPanel .goBack  { justify-content: center; }
	.errorPanel .codeTxt  { text-align: center; font-size: 16px; padding-top: 20px; }  
}



/*********************************************
*  content
*********************************************/ 
/*     Thin  Scrollbar       */
.thinScrollbar::-webkit-scrollbar , 
.sideGnb .headerWrap #gnbWrap::-webkit-scrollbar  { width: 10px; height: 10px; }  
.thinScrollbar::-webkit-scrollbar-track , 
.sideGnb .headerWrap #gnbWrap::-webkit-scrollbar-track  { background: transparent; } 
.thinScrollbar::-webkit-scrollbar-thumb , 
.sideGnb .headerWrap #gnbWrap::-webkit-scrollbar-thumb  { width: 10px; height: 10px; background: rgba(0,0,0,.3); border-radius: 10px; border: 2px solid #fff; }  


.a11y_hidden , table caption  { position: absolute; width: 1px;	height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; }
.btnClose  { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; background: url(../images/ico_close.png) no-repeat 0 0; border: none; }
.ellipsis   { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.ellipsisNone   { white-space: normal !important; overflow: visible !important; text-overflow: inherit !important; }
.enforce  { color: var(--primary-deepcolor); font-weight: 700; padding: 0 3px; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #ff0000; }
.required::after  { content: '*'; font-size: 17px !important; font-weight: 500 !important; color: #ff0000; display: inline-flex; position: relative; top: -8px; left: 5px; } 
.remark  { display: inline-flex; flex-grow: 1; gap: 5px; margin-bottom: -20px; }
.remark em { color: #ff0000; font-size: 18px; font-weight: 600; }
.split   { display: inline-flex; align-items: center; justify-content: center; }
.label_tit  { min-height: 25px; display: inline-flex; align-items: center; flex-shrink: 0; font-weight: 600; background: #f4f4f4; padding: 0 10px; } 
[class*='formAlign'].inputToggle .label_tit ,
.qnaState .label_tit  { height: var(--input-height); border: 1px solid var(--input-bdcolor); margin-right: -1px; } 
.output ,  .outTextarea  { background: #fff; border: 1px solid var(--input-bdcolor); flex-grow: 1; }
.output  { height: var(--input-height); padding: 0 10px; }
.outTextarea  { line-height: 1.5em; padding: 15px; overflow: auto; }
.bdTopLine   { padding-top: 30px; border-top: 1px solid var(--grid-bdcolor); }
.bdBotLine   { padding-bottom: 30px; border-bottom: 1px solid var(--grid-bdcolor); }

/*    null data   */
.nullData  { min-height: 300px; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; flex-grow: 1; color: #666; }
.nullData::before  { content: ''; width: 50px; height: 50px; background: url(../images/ico_app.png) no-repeat 0 0; margin-bottom: 20px; }
.gridCnt .nullData  { min-height: 200px; }

/*    dot line   */
.dottedLine   { position: relative; } 
.dottedLine::before  { content: ''; width: 100%; height: 1px; display: block; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: top; background-size: 8px 1px; background-repeat: repeat-x; position: absolute; top: 0; left: 0; } 


/*    아이콘마크 안내글  */ 
.infoGuide  { display: inline-block; line-height: 1.5em; color: #063a74;  }
.infoGuide.box  { display: block; padding: 10px; background: #ebf2f8; text-align: center; }
.infoGuide::before  { background-position-y: -20px; margin-right: 5px; vertical-align: text-bottom; }

/*   error  메세지   */
.errMsg   { color: #ff0000; display: inline-block; line-height: 1.3em; }
.errMsg::before   { background-position-y: -20px; margin-right: 3px; vertical-align: text-bottom; }
.errMsg:empty    { display: none; }


/*   ol + ul   타입   */ 
.listType_Dec   { padding-left: 30px; }
.listType_Dec > li    { list-style-type: decimal-leading-zero; }
.listType_Dec > li ~ li    { margin-top: 10px; }
[class*='listType_bullet'] li   { padding-left: 13px; position: relative; }
[class*='listType_bullet'] li:before   { content: ""; width: 5px; height: 5px; border-radius: 100%; background: #0095fa; position: absolute; top: 12px; left: 0; }
[class*='listType_bullet'] .none:before   { display: none; }


/*       */
[class*='formAlign']     { --gap: 5px; display: inline-flex; align-items: center; flex-flow: row wrap; gap: var(--gap); }
.formAlignCnt     { --gap: 15px; display: flex; } 
.formAlignCol  ,  .formAlignReply   { display: flex; flex-wrap: nowrap; flex-grow: 1; } 
.formAlignRow     { display: flex; flex-grow: 1; } 
[class*='formAlign'] > li   { display: inline-flex; align-items: center; } 
[class*='formAlign'].pdr10 > li   { padding-right: 10px; } 
[class*='formAlign'].pdr15 > li   { padding-right: 15px; } 
[class*='formAlign'].pdr20 > li   { padding-right: 20px; } 
[class*='formAlign'].mw200 > li   { min-width: 200px; } 
[class*='formAlign'].mw250 > li   { min-width: 250px; } 
[class*='formAlign'].mw260 > li   { min-width: 260px; } 
[class*='formAlign'].mw270 > li   { min-width: 270px; } 
[class*='formAlign'].mw280 > li   { min-width: 280px; } 
[class*='formAlign'].mw290 > li   { min-width: 290px; } 
[class*='formAlign'].mw300 > li   { min-width: 300px; } 
ul.formAlign[class*='col']    { display: flex; }
ul.formAlign[class*='col'] > li    { flex-shrink: 1; margin: 0; }
ul.formAlign.col > li    { flex-basis: auto; }  /*   auto   */
ul.formAlign.col0 > li    { flex-basis: 0%; flex-grow: 1; }  /*   flex-grow 비율 분할  */
ul.formAlign.col1 > li    { flex-basis: 100%;  }  /*   1열   */
ul.formAlign.col2 > li    { flex-basis: calc(100%/2 - var(--gap)); }  /*  2열   */
ul.formAlign.col3 > li    { flex-basis: calc(100%/3 - var(--gap)); }  /*  3열   */ 
ul.formAlign.col4 > li    { flex-basis: calc(100%/4 - var(--gap)); }  /*  4열   */ 
ul.formAlign.col5 > li    { flex-basis: calc(100%/5 - var(--gap)); }  /*  5열   */ 
[class*='formAlign'].inputToggle   { display: flex; gap: 5px 20px; }
[class*='formAlign'].inputToggle > li   { display: flex; flex-grow: 1; }
.formAlignDiv     { gap: 5px 15px; } 
.formAlignDiv > li ~ li::before    { content: '/'; display: inline-flex; align-items: center; color: #999; font-weight: 400; margin-right: 15px; } 
.formAlignDiv.gap5 > li ~ li::before    { margin-right: 5px; }  

.cntWrap    { display: flex; flex-grow: 1; flex-flow: row wrap; align-items: center; }   
@media only screen and (max-width: 700px) {
    .cntWrap [class*='btnArea_'] [class*='btnRefer_']  { min-width: auto; } 
    .cntWrap .remark  { margin-bottom: 0; }
}  


.numBuild  { display: inline-flex; align-items: center; flex-flow: row wrap; color: #444; font-size: 15px; position: relative; gap: 5px; }
.numBuild *  { height: 27px; }
.numBuild ~ .numBuild { margin-left: 15px; padding-left: 15px; }
.numBuild ~ .numBuild::before { content: ''; width: 1px; height: 12px; background: #b1b8be; display: inline-block; position: absolute; top: calc(50% - 6px); left: 0; }
.numBuild span	 { color: #000; font-weight: 600; }
.numBuild em	 { color: #e4022e; font-weight: 600; }
.numBuild em::after	 { content: '/'; color: #555; font-size: .8em; margin-left: 4px; }

/*     */
.catalogItem  { display: flex; flex-flow: row nowrap; gap: 5px 15px; align-items: flex-start; }
ul.catalogItem  { flex-flow: column wrap; row-gap: 10px; border-top: 1px solid #456696; padding-top: 10px; }
.catalogItem > li  { display: flex; align-items: flex-start; gap: 15px; }
.catalogItem .label_tit  { background: none; color: #000; }
.catalogItem .label_tit::before  { content: ''; width: 6px; height: 6px; background: var(--primary-color); border-radius: 100%; margin-right: 8px; }
.catalogItem .detailAttach  { margin-bottom: 0; }



/*  검색  영역 */
.searchWrap  { background: #eef8fe; border-top: 2px solid #053863; border-bottom: 1px solid #dde0e3; padding: 20px; margin-bottom: 30px; }
/* .searchWrap .option  { display: flex; flex-flow: row wrap; row-gap: 10px; align-items: center; }
.searchWrap .option > li { display: inline-flex; align-items: center; gap: 5px; padding-right: 50px; } */
.searchWrap .option  { display: flex; flex-flow: row wrap; gap: 10px 50px; align-items: center; }
.searchWrap .option li { display: inline-flex; align-items: center; gap: 5px; }

.searchWrap .option [class*='formAlign'] li  { gap: 5px; }
.searchWrap .option .label_tit  { min-height: auto; background: none; padding: 0; }
.searchWrap .option .btZoon  { flex-grow: 1; padding-right: 0; }
.searchWrap .option .btZoon button  { min-width: 80px; }
.searchWrap .option input[type='radio'] + label , 
.searchWrap .option input[type='checkbox'] + label  { padding-left: 3px; } 

@media only screen and (max-width: 700px) { 
	.searchWrap  { padding: 10px; } 
	/* .searchWrap .option > li   { padding-right: 0; } */
}


/*    목록넘기기    */
.pagination   { display: flex; margin-top: 30px; line-height: 1; } 
.pagination > ul ,  .pagination > ul li a { align-items: center; justify-content: center;  } 
.pagination > ul { display: flex; flex-flow: row wrap; flex-grow: 1; gap: 5px 0;  }
.pagination > ul { display: flex; flex-flow: row wrap; flex-grow: 1; gap: 5px 0;  }
.pagination > ul li   { margin-right: -1px; }
.pagination > ul li a { min-width: 35px; height: 35px; display: inline-flex; background: #fff; border: 1px solid var(--grid-bdcolor); position: relative; padding: 0 3px; }
.pagination > ul li a.current  { color: #fff; font-weight: 600; background: var(--primary-color); border-color: var(--primary-color); z-index: 1; }
.pagination > ul li a:hover  { border-color: var(--primary-color); z-index: 1;  }
.pagination > ul li a.move:hover   { background: #f4f8fb; }
.pagination > ul li a.move:hover:before   { background-position-y: -20px; }
.pagination > ul li a.move::before   { margin: 0; }
.pagination [class*='btnArea_']   { flex-grow: 0; }


/*      Btn Area      */
[class*='btnArea_']     { --gap: 5px; display: flex; flex-grow: 1; flex-flow: row wrap; align-items: center; gap: var(--gap); position: relative; z-index: 5; }  
.btnArea_wide > button   { flex-basis: calc(50% - var(--gap)); } 
.btnArea_center   { justify-content: center; } 
.btnArea_right   { justify-content: flex-end; } 
.btnArea_left   { justify-content: flex-start; }   
.btnArea_offset    { display: inline-flex; position: absolute; }    /*   [ top, bottom, left, right ] 인라인 지정~!   */ 
@media only screen and (max-width: 1000px) {
	.btnArea_offset    { display: flex; justify-content: flex-end; top: auto !important; right: auto !important; left: auto !important; bottom: auto !important; position: relative; margin-bottom: 10px; }  
}


/*   가이드 text box   */
.infomation  { min-height: 80px; background: #f1f1f1; position: relative; padding: 20px 20px 20px 120px; margin-bottom: 20px; word-break: keep-all; }
.infomation .icoApp_info  { width: 40px; height: 40px; background: #fff; border-radius: 100%; display: block; position: absolute; top: 30px; left: 50px; }
.infomation .icoApp_info::before  { position: relative; top: -15px; left: -18px; } 
@media only screen and (max-width: 400px) {
    .infomation    { padding-left: 70px; } 
	.infomation .icoApp_info  { transform: scale(.7); top: 20px; left: 25px; }
}


/*     Grid    */
[class*='gridCnt']   { border-top: 1px solid #456696; }  
[class*='gridCnt'] table  { width: 100%; table-layout: fixed; } 
[class*='gridCnt'] thead th ,  [class*='gridCnt'].tdC td    { text-align: center; } 
[class*='gridCnt'] thead th ,  [class*='gridCnt'] tbody th  { background: #f2f2f2; color: #001b42; word-break: keep-all; } 
[class*='gridCnt'] th ,  [class*='gridCnt'] td  { height: 50px; border-bottom: 1px solid var(--grid-bdcolor); } 
[class*='gridCnt'] td a:hover  { color: var(--primary-deepcolor); }  
[class*='gridCnt'] .bdl  { border-left: 1px solid var(--grid-bdcolor); }  
[class*='gridCnt'] .bdr ,
[class*='gridCnt'] td:not(.th)[rowspan]  { border-right: 1px solid var(--grid-bdcolor); }  
[class*='gridCnt'] .subject  { text-align: left; }   
[class*='gridCnt'] .keymark  { display: inline-flex; align-items: center; vertical-align: middle; margin-top: -2px; }   
[class*='gridCnt'] .detailAttach  { margin-bottom: 0; }   
[class*='gridCnt'] textarea  { margin-bottom: -7px; }   
[class*='gridCnt'] a  { color: #063a74; }   
[class*='gridCnt'] .th  { background: #f4f8fb; } 
[class*='gridCnt'] .rowspan  { display: none; } 
[class*='gridCnt'].tdC td  { text-align: center; } 
[class*='gridCnt'] .formAlignReply  { gap: 0; } 
[class*='gridCnt'] .formAlignReply .icoCnt_reply  { display: inline-flex; margin: -10px -5px 0 0; opacity: .7; } 

.gridCnt table { text-align: center; }    /*   list      */
.gridCnt tbody tr:not(.null):not(.notice):hover   { background: #f4f7fa; } 
.gridCnt.hoverOff tbody tr:hover   { background: inherit; } 
.gridCnt th , .gridCnt td  { padding: 10px; line-height: 1.5em; } 
.gridCnt td a  { max-width: calc(100% - 50px); display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }   /*  말줄임  */  
.gridCnt input[type='radio'] , .gridCnt input[type='checkbox']  { vertical-align: middle; }    
.gridCnt .notice  { background: #fdfdf1; }    
.gridCnt .notice a { color: #000; }       

.gridCnt_table table  { text-align: left; }   /*   table      */ 
.gridCnt_table th , .gridCnt_table td  { padding: 10px 20px; }
.gridCnt_table p  { line-height: 1.5em; }
.gridCnt_table .attachData  { margin: -7px 0; }
.gridCnt_table .examGuide  { margin-top: 5px; } 
.gridCnt_table .null ,  .detailAttach .null  { color: #595959; font-weight: 400; }

@media only screen and (max-width: 900px) {
	.gridCnt:not(.default) thead  ,
	[class*='gridCnt']:not(.default) colgroup ,
	[class*='gridCnt']:not(.default) .reHide ,
	[class*='gridCnt']:not(.default) .null td::before ,
	[class*='gridCnt']:not(.default) td.dthNull::before { display: none; }
	[class*='gridCnt']:not(.default) table tr { display: flex; flex-flow: row wrap; align-items: center; border-bottom: 1px solid var(--grid-bdcolor); } 	
	[class*='gridCnt']:not(.default) th ,  [class*='gridCnt']:not(.default) td , [class*='gridCnt']:not(.default) .rowspan  { height: auto; display: inline-flex; flex-wrap: wrap; border: none; }  
	[class*='gridCnt']:not(.default) th { align-items: center; }  
	[class*='gridCnt']:not(.default) td { align-items: flex-start; gap: 5px 10px; } 
	[class*='gridCnt']:not(.default) .null td , .gridCnt_table th ,  .gridCnt_table td  { width: 100%; }   
	[class*='gridCnt']:not(.default) td:not(.th)[rowspan]  { border-right: none; }
	[class*='gridCnt']:not(.default) textarea  { margin-bottom: 0; }  
	[class*='gridCnt']:not(.default) .keymark  { margin-top: 0; } 
	.gridCnt td::before  { content: attr(data-th); display: inline-flex; align-items: center; flex-shrink: 0; padding: 1px 7px; color: #001b42; font-size: 0.8em; font-weight: 600;  } 
	.gridCnt td:not(.subject):before  { background: url(../images/dot_vertical.png) no-repeat 100% 50%; padding-right: 12px; } 
	.gridCnt .subject  { width: 100%; flex-grow: 1; flex-wrap: nowrap; font-size: 1.1em; font-weight: 600; }  
	.gridCnt .subject::before  { background: #ededed; }  
	.gridCnt table tr { padding: 10px 0; gap: 5px 20px; } 
	.gridCnt th , .gridCnt td { padding: 3px 10px;  } 
	.gridCnt td.th  { background: none; }
	.gridCnt_table:not(.default) th   { justify-content: center; border-bottom: 1px solid var(--grid-bdcolor); border-top: 1px solid #456696; margin-top: -1px; }  
	.gridCnt_table td   { padding: 10px; } 
	.gridCnt_table textarea + .examGuide  { margin-top: 0; }
}


/*   상세화면   */
.subjectHead   { min-height: 60px; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: 5px; background: #eef8fe; border-top: 2px solid #053863; border-bottom: 1px solid #dde0e3; padding: 15px 100px 15px 20px; position: relative;  }
.subjectHead .subjectHead_tit   { line-height: 1.5em; color: #001b42; font-size: 1.15em; font-weight: 600; }  
.subjectHead .subjectHead_tit [class*='ogmark_']  { font-size: .7em; vertical-align: middle; margin-top: -3px; }
.subjectHead.sideTo     { padding-right: 20px; justify-content: space-between; }
.subjectHead.sideTo .subjectHead_tit   { flex-grow: 1; }
.subjectHead .rate   { position: absolute; bottom: 15px; right: 10px; color: #333; font-size: 87.5%; }
.subjectHead .rate em   { color: #053863; font-weight: 600; margin-left: 5px; display: inline-flex; } 
.subjectHead .keymark     { display: inline-flex; vertical-align: 8px; }
.subjectHead .keymark::before     { background-position-y: -20px; } 

@media only screen and (max-width: 500px) {
	.subjectHead   { padding-right: 20px; }
	.subjectHead .rate  { width: 100%; position: relative; bottom: auto; right: auto; text-align: right; margin-bottom: -10px; }
}

.detailMove ,  .detailInfo { display: flex; flex-flow: row wrap; align-items: center; }

.detailMove  { justify-content: flex-end; gap: 10px; margin: 15px 0; position: relative; }
.detailMove .md  { min-width: 150px; }
.detailMove .icoCnt_checkLg  { background: var(--second-color); border-color: var(--primary-color); color: var(--primary-deepcolor); top: -2px; box-shadow: 0px 9px 5px -5px rgba(0, 0, 0, .2); }
.detailMove .num  { min-width: 18px; height: 18px; background: var(--second-color); border: 1px solid #adbeed; border-radius: 10px;  padding: 0 5px; display: inline-flex; align-items: center; justify-content: center; color: #000; font-size: 11px; font-weight: 500; margin: -3px -5px 0 7px; }
/* .detailMove .num::after  { content: ''; width: 0; height: 0; display: block; border-top: 8px solid #c5dfff; border-right: 10px solid transparent; position: absolute; bottom: -4px; left: 2px; }
.detailMove .num:empty   { display: none; } */
.detailMove .icoCnt_checkLg .num  { background: #2f49bd; border: none; color: #fff; }
/* .detailMove .icoCnt_checkLg .num::after  { border-top-color: #2f49bd; } */


.detailInfo  { background: #f4f4f4; padding: 10px 20px; margin: 10px 0 20px; gap: 7px 50px; font-size: .95em; }
.detailInfo li span:not(.label_tit):not(.null)  { color: #053863; }
.detailInfo .label_tit  { min-width: 80px; line-height: 1.5em; background: #fff; border: 1px solid var(--grid-bdcolor); margin-right: 5px; justify-content: center; text-align: center; }
.detailInfo .null  { color: #595959; font-weight: 400; }

.detailContent   { margin-bottom: 40px; }
.detailContent img  { max-width: 100%; }
.detailAttach   { margin-bottom: 30px;}
.detailAttach button:not(.icoCnt_zoom):hover  { color: var(--primary-deepcolor); text-decoration: underline; }
.detailAttach button:not(.icoCnt_zoom):hover::before  { opacity: 1; background-position-y: -20px; }
.detailAttach button:not(.icoCnt_zoom)::before  { opacity: .8; margin-right: 10px; }
.detailAttach .icoCnt_download   { height: auto; line-height: 1.3em; padding-left: 30px; flex-shrink: 1; text-align: left; justify-content: flex-start; font-weight: 500; }
.detailAttach .icoCnt_download::before   { position: absolute; top: 0; left: 0; }
.detailAttach .formAlign     { flex-direction: column; align-items: flex-start; }
.detailAttach .formAlign > li   { gap: 5px; flex-wrap: wrap; }
.detailAttach .th small   { display: block; line-height: 1.3em; }


/*    나의 의견 공개   */
.myApply  { display: grid; grid-template-columns: 200px auto; background: #eef6f4; }
.myApply .cnt  { padding: 20px 30px; }
.myApply .cnt .formAlign  { --gap: 30px; margin-bottom: 10px; }
.myApply .head  { background: #e5eceb; align-items: center; justify-content: center; display: flex; flex-flow: column wrap; row-gap: 15px; font-size: 20px; font-weight: 700; }
.myApply .formAlign label  { font-size: 18px; font-weight: 700; }

/*    의견제출 작성   */
.commentEdit  { background: #f4f4f4; padding: 20px 25px; border-top: 1px solid #456696; margin-bottom: 30px; }
.commentEdit .text  { margin-bottom: 15px; }
.commentEdit textarea { width: 100%; height: 150px; min-height: 150px; background: #fff; border: 1px solid var(--input-bdcolor); padding: 10px; } 

/*     첨부파일 */
.attachData   { min-height: 30px; position: relative; padding-left: 140px; } 
.attachData input[type='file'] ,
.attachData input[type='file'] + label.icoCnt_attach { width: 120px; height: 30px; }
.attachData input[type='file']  { background: transparent; border: none; }
.attachData input[type='file'] + label.icoCnt_attach { position: absolute; top: 0; left: 0; z-index: 1; cursor: pointer; } 
.attachData input[type='file'] + label.icoCnt_attach::before  { margin: -2px 10px 0 0; } 
.attachData > li  { display: flex; align-items: center; gap: 10px; margin: 7px 0; }
.attachData > li p  { line-height: 1.3em; }
.attachData .attach  { position: absolute; top: -7px; left: 0; padding: 0; } 
.attachData .none  { opacity: .7; }
.attachData .icoCnt_xCircle  { width: 20px; height: 20px; margin-top: -2px; }
.attachData .icoCnt_xCircle:hover::before  { background-position-y: -20px; }

/*   보안문자    */
.securityCode   { display: grid; grid-template-columns: 1fr 2fr; background: #eff4f9; margin: 30px 0; }
.securityCode .head   { background: #e3edf3; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: 10px 20px; font-size: 20px; font-weight: 700; }
.securityCode .cnt   { max-width: 500px; display: grid; grid-template-columns: 2fr 1fr 1fr; align-items: stretch; gap: 10px; margin: 20px 30px;  }
.securityCode .cnt *   { display: inline-flex; align-items: center; }

.securityCode .cnt button   { max-width: 120px; width: 100%; } 
.securityCode .captcha    { grid-row: 1 / 3; background: #fff; line-height: 1; } 
.securityCode .captcha img   { width: 100%; height: 100%; } 
.securityCode .edit   { grid-column: 2 / 4; } 

@media only screen and (max-width: 800px) { 
	.detailMove  { justify-content: flex-start; gap: 0; }
	.detailMove a  { width: 50%; order: 1; margin: -1px -1px 0 0; position: relative; padding: 0 !important; }
	.detailMove a.icoCnt_checkLg  { top: 0; z-index: 1; }
	.detailMove a.icoCnt_checkLg::before  { margin-right: 5px; }
	.detailMove .remark  { order: 2; margin: 5px 0 -5px; }

	.formAlign.cDetail   { margin-top: 20px; } 

	.attachData { padding-left: 0; }
	.attachData .attach { position: relative; top: auto; }

	.myApply ,
	.securityCode  { grid-template-columns: 100%; }
	.myApply .head , 	.securityCode .head { padding: 5px; }
	.myApply .head   { flex-direction: row; column-gap: 20px; }
	.myApply .head .icoApp_myConfirm  { order: 1; }
	.myApply .head .required  { order: 2; }
	.myApply .formAlign  { display: flex; justify-content: center; }  
	.securityCode .cnt  { grid-template-columns: 1fr 1fr; margin: 20px auto; padding: 0 15px; }	
	.securityCode .captcha  { grid-row: 1 ; grid-column: 1 / 3; }
	.securityCode .edit  { grid-column: 1 / 3 ;  }
}


/*    Tab      */
.tabWrap ,
.tabWrap .tabPanel  { position: relative; }
.tabList  { --tabColor: #063a74; border-bottom: 1px solid var(--tabColor); position: relative; display: flex; flex-flow: row nowrap; align-items: center; margin-bottom: 30px; }
.tabList .tabItem  { min-width: 250px; height: 50px; display: inline-flex; align-items: center; justify-content: center; background: #eff0f2; border: 1px solid var(--grid-bdcolor); border-bottom-color: var(--tabColor); font-size: 17px; padding: 0 20px; margin-bottom: -1px; position: relative; }
.tabList a.tabItem    { color: inherit; text-decoration: none; }
.tabList .tabItem ~ .tabItem   { margin-left: -1px; }
.tabList .tabItem.current  ,
.tabList .tabItem[aria-selected='true']   { background: var(--tabColor); border-color: var(--tabColor); color: #fff; font-weight: 600; z-index: 1; }
@media only screen and (max-width: 1000px) { 
	.tabList .tabItem  { min-width: auto; }
}


/*      입법의견 보기    */
.formAlign.cDetail   { position: absolute; left: 0; bottom: -5px; font-weight: 600; column-gap: 20px; }
.comment_staff ,
.comment_user , 
.comment_user li   { display: flex; flex-flow: row wrap; align-items: center; gap: 5px 15px; color: #555; } 
.comment_user li.btnArea_right ,  .comment_staff li.btnArea_right   { gap: 5px; } 

.commentDetail  { background: #f4f4f4; padding: 20px 25px 25px; border-top: 1px solid #456696; margin-bottom: 40px; } 
.commentDetail:last-of-type  { margin-bottom: 0; } 
.commentDetail .text  { padding: 0 25px; height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 20px; }  
.commentDetail .private  { display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 15px; }
.commentDetail .private .icoCnt_key ,
.comment_user .user .icoCnt_user  { width: 30px; height: 30px; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; }
.commentDetail .private .icoCnt_key { background: #fbebeb; }
.comment_user .user .icoCnt_user  { background: #e9e9e9;  }
.commentDetail .comment  { background: #fff; padding: 15px 30px 30px; }  
.comment_user .user  { color: #111; font-size: 1.1em; letter-spacing: .3em; margin-right: 10px; } 
.comment_user .user .icoCnt_user  { font-size: 1.1em; } 
.comment_user .phone::after  { content: '/'; font-size: 13px; display: inline-flex; } 
.comment_text   { margin-top: 15px; }  

/*    관리자 답글 영역   */
.comment_admin   { margin-top: 30px; padding: 25px 0 0 35px; position: relative; } 
.comment_admin::before  { content: ''; width: 100%; height: 1px; display: block; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: top; background-size: 8px 1px; background-repeat: repeat-x; position: absolute; top: 0; left: 0; }
.comment_admin .icoCnt_reply  { position: absolute; top: 10px; left: 5px; } 
.comment_staff   { margin-bottom: 10px; } 
.comment_staff .staff    { display: inline-flex; align-items: center; gap: 10px; } 
.comment_staff .staff .icoCnt_logo  { width: 28px; height: 28px; background: #dee3ec; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; } 
.comment_attach  { display: flex; flex-flow: column wrap; align-items: flex-start; gap: 5px; margin-top: 15px; } 
.comment_attach .icoCnt_download  { line-height: 1.3em; color: #063a74; font-weight: 500; text-align: left; } 
.comment_attach .icoCnt_download:hover  { color: var(--primary-deepcolor); text-decoration: underline; } 
.comment_attach .icoCnt_download::before  { opacity: .8; margin-right: 10px; } 

/*    댓글 영역   */
.comment_reply  { margin-top: 50px; }
.comment_reply .head  { display: flex; align-items: center; gap: 10px; font-size: 1.05em;  }
.comment_reply .head em  { color: var(--primary-color); font-weight: 600; }
.comment_reply .attachData .none  { margin-top: 0;  }
.comment_reply .comment > li   { padding: 25px 0 30px; }
.comment_reply .comment > li ~ li  { border-top: 1px solid var(--grid-bdcolor);}
.comment_reply .comment_user .user   { font-size: 1em; letter-spacing: .2em; margin-right: 0; }
.comment_reply .comment_user .date   { font-size: .9em; }
.comment_reply .comment_text   { margin-top: 0; }
.comment_reply .null   { min-height: 150px; display: flex; align-items: center; justify-content: center; gap: 10px; color: #595959; font-weight: 400; }
.comment_reply .null *   {display: inline-flex; }
.comment_reply .null .icoCnt_comment   { width: 28px; height: 28px; background: #e9e9e9; border-radius: 100%; align-items: center; justify-content: center; }
#comment .comment_edit  { margin-top: 5px; }

/*   질의/답변  -  처리현황  */
.qnaState  { display: flex; flex-flow: row wrap; gap: 10px 25px; background: #ebf2f8; padding: 20px; margin-top: 40px; }
.qnaState > li  { display: inline-flex; align-items: center; }
.qnaState .label_tit  { min-width: 95px; }
.qnaState .output ,  .qnaState select  { min-width: 140px; } 
.qnaState .icoCnt_close::before    { transform: scale(.6); } 
@media only screen and (max-width: 1000px) { 
	.qnaState   { padding: 15px; }  
} 

/* .commentDetail  { padding: 15px 0; border-top: 1px solid #456696; margin-bottom: 40px; } 
.commentDetail:last-of-type  { margin-bottom: 0; } 
.commentDetail .text  { padding: 0 25px; height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 20px; } 
.commentDetail .private , .commentDetail .comment  { background: #f4f4f4; } 
.commentDetail .private  { min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 20px; }
.commentDetail .private .icoCnt_key ,
.commentDetail .comment_user .user .icoCnt_user  { width: 30px; height: 30px; background: #fff; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; }
.commentDetail .comment  { background: #f4f4f4; padding: 15px 30px 30px; } 
.commentDetail .comment_user::after  { content: ''; width: 100%; height: 1px; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: bottom; background-size: 8px 1px; background-repeat: repeat-x; padding-bottom: 15px; } 
.commentDetail .comment_user , 
.commentDetail .comment_user li  { display: flex; flex-flow: row wrap; align-items: center; gap: 5px 15px; } 
.commentDetail .comment_user .user  { color: #111; font-size: 1.1em; letter-spacing: .3em; margin-right: 10px; } 
.commentDetail .comment_user .user .icoCnt_user  { font-size: 1.1em; } 
.commentDetail .comment_user .phone::after  { content: '/'; font-size: 13px; display: inline-flex; } 
.commentDetail .comment_text   { margin-top: 15px; }   */



@media only screen and (max-width: 1100px) { 
	.formAlign.cDetail   { width: 100%; position: relative; left: auto; bottom: auto; order: 3; } 
} 
@media only screen and (max-width: 500px) { 
	.commentDetail   { padding: 15px; } 
	.commentDetail .text  { padding: 0 10px; margin-bottom: 10px; } 
	.commentDetail .comment  { padding: 15px; } 
} 

/*    불편법령신고     */
.opnInfo   { background: #f1f1f1; padding: 25px; margin-bottom: 30px; } 
.opnInfo p   { margin-top: 20px; }  
.opnInfo .epeople   { line-height: 1; background: #fff; border: 1px solid #d1d1d1; border-radius: 8px; margin: 0 5px; display: inline-flex; align-items: center; gap: 5px; padding: 2px 5px; vertical-align: middle; }  
.opnInfo .epeople img   { height: 22px; }   
.opnInfo .epeople:hover .icoCnt_openPop::before ,
.opnInfo #opnExamOpen.Active::before   { background-position-y: -20px; }  
.opnInfo .exam    { margin-top: 7px; }  
.opnInfo #opnExamOpen  { color: #063a74; font-size: 18px; font-weight: 700; text-decoration: underline; text-underline-offset: 5px;  text-decoration-color: var(--primary-color); }  
.opnInfo #opnExamOpen:hover   { color: var(--primary-deepcolor); }  
.opnInfo #opnExamOpen.Active  { color: var(--primary-color); } 
.opnInfo #opnExamClose  { width: 60px;height: 40px; background: #fff; position: absolute; top: -30px; right: 0; }
.opnExam  { background: #fff; position: relative; padding: 25px; margin-top: 15px; }
.opnExam .head  { text-align: center; font-size: 18px; font-weight: 600; color: #000; margin: -10px 0 20px; }
.opnExam .exam.btnRefer_icoFlat  { width: 40px; height: 40px; background-color: #063a74; border-radius: 100%; position: absolute; top: calc(50% - 20px); }
.opnExam .exam.btnRefer_icoFlat::before  { background-position-y: -40px; }
.opnExam .exam.icoCnt_arrNext  { right: -15px; }
.opnExam .exam.icoCnt_arrPrev  { left: -15px; }
.opnExam .swiper-slide  { min-height: 300px; display: flex; }


/*    작성예시    */
.examGuide  { position: relative; padding-left: 105px; }
.examGuide dt { position: absolute; top: 0; left: 0; display: flex; align-items: center; gap: 5px; color: #063a74; font-weight: 600; } 
.examGuide dt::before  { background-position-y: -20px; } 
.examGuide dd ~ dd  { margin-top: 5px; } 
.examGuide dd p   { line-height: 1.5em; } 

@media only screen and (max-width: 600px) {
	.examGuide  { padding-left: 0; }
	.examGuide dt { position: relative; } 
	.examGuide dd { margin-left: 10px; } 
}


/*   아이디어 공모제    */
.ideaInfo   { min-height: 100px; background: #f1f1f1; padding: 30px 25px 25px 120px; margin-bottom: 30px; position: relative; font-weight: 600; } 
.ideaInfo .icoApp_idea  { width: 40px; height: 40px; background: #fff; border-radius: 100%; display: block; position: absolute; top: 40px; left: 50px; } 
.ideaInfo .icoApp_idea::before  { position: relative; top: -15px; left: -9px; }
.ideaInfo .head   { color: #063a74; font-size: 24px; font-weight: 700; margin-bottom: 20px; } 
.ideaInfo .head::after   { content: ''; width: 32px; height: 26px; display: inline-block; background: url(../images/event.png) no-repeat 0 0; background-size: cover; margin-left: 10px; vertical-align: middle; position: relative; top: -15px; } 
.ideaInfo .formAlign   { margin-bottom: 10px; } 
.ideaInfo .formAlign > li  { align-items: flex-start; column-gap: 10px; } 
.ideaInfo .label_tit   { background: #fff; padding: 0 10px; font-size: .95em; font-weight: 700; } 
.ideaInfo [class*='btnArea_']   { margin-top: 25px; padding-top: 20px; position: relative; } 
.ideaInfo [class*='btnArea_']::before  { content: ''; width: 100%; height: 1px; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: top; background-size: 8px 1px; background-repeat: repeat-x; position: absolute; top: 0; left: 0; }  
.ideaInfo [class*='btnArea_'] button  { min-width: 120px; } 
.ideaInfo [class*='btnArea_'] button::before  { transform: scale(.8); margin-right: 10px; } 

@media only screen and (max-width: 800px) {
    .ideaInfo    { padding-left: 70px; } 
	.ideaInfo .icoApp_idea  { transform: scale(.7); top: 30px; left: 20px; }
	.ideaInfo .head  { font-size: 20px; }
	.ideaInfo .head::after    { display: none; }
	.ideaInfo [class*='btnArea_'] button  { min-width: auto; } 
	.ideaInfo .label_tit   { font-size: 1em; }
}


/*   법령안 정보 보기  */
.lawSubjct  { height: 80px; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } 
.lawSubjct.Active  { height: auto; overflow: visible; text-overflow: inherit; display: block; } 
#lawSubjctToggle { background: #f2f2f2; border-radius: 5px; } 
#lawSubjctToggle::before  { background-position-y: -20px; filter: grayscale(1); transition: .2s; }  
#lawSubjctToggle.Active  { color: var(--primary-deepcolor); background: var(--second-color); } 
#lawSubjctToggle:hover:before  { filter: grayscale(0); } 
#lawSubjctToggle.Active::before  { filter: grayscale(0); transform: rotate(180deg); bottom: -1px; } 


/*   입법현황 단계    */
.lawflowStep   { display: flex; flex-flow: row wrap; align-items: center; gap: 10px 24px; padding-left: 25px; }
.lawflowStep > li { height: 40px; display: inline-flex; align-items: center; background: #f3f3f3; border: 1px solid transparent; padding: 0 15px; position: relative; }
.lawflowStep > li:first-child  { margin-left: -20px; }
.lawflowStep > li:last-child  { background: #fff; border-color: var(--primary-deepcolor); color: var(--primary-deepcolor); font-weight: 600; }
.lawflowStep > li ~ li:before  { content: ''; width: 20px; height: 20px; display: inline-flex; background: url(../images/ico_cnt.png) no-repeat -860px 0; position: absolute; top: calc(50% - 10px); left: -24px; transform: scale(.6); }

/*   국회입법현황   상세   */
.nsmCnt   { position: relative; } 
.nsmCnt ~ .nsmCnt { margin-top: 15px; padding-top: 15px; }
.nsmCnt ~ .nsmCnt::before  { content: ''; width: 100%; height: 1px; display: block; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: top; background-size: 8px 1px; background-repeat: repeat-x; position: absolute; top: 0; left: 0; } 
.nsmCnt .head  { color: #063a74; font-size: 1.1em; font-weight: 600; margin-bottom: 3px; display: flex; align-items: center; }   
.nsmCnt .head::before  { transform: rotate(-90deg); margin-right: 3px; background-position-y: -20px; }   
.nsmCnt .tit  { color: #000; font-weight: 600; margin: 10px 0 0 15px; display: flex; align-items: center; } 
.nsmCnt .tit::before  { content: ''; width: 5px; height: 5px; background: #888; border-radius: 100%; display: inline-flex; margin-right: 7px; }  

/*   관심법령 등록   */
.lawFavorite  { display: flex; flex-flow: row nowrap; align-items: center; flex-shrink: 0; position: relative; font-weight: 600; cursor: pointer; } 
.lawFavorite input[type='checkbox']  { width: 20px; height: 20px; background: none; border: none; margin-right: -30px; }
.lawFavorite input[type='checkbox'] + label { gap: 4px; cursor: pointer; }
.lawFavorite input[type='checkbox']:checked + label   { color: var(--primary-deepcolor); text-decoration: underline; text-underline-offset: 4px; }
.lawFavorite input[type='checkbox']:checked + label::before  { background-position-y: -20px; } 


/*   단계   */
.statusStep  { display: flex; flex-flow: row nowrap; align-items: center; gap: 15px; margin-bottom: 40px; }
.statusStep li { height: 50px; display: inline-flex; align-items: center; justify-content: center; flex-grow: 1; font-size: 1.15em; background: #e7e7e7; border: 1px solid transparent; position: relative; padding: 0 10px; }
.statusStep li::after { content: ''; width: 14px; height: 14px; background: #e7e7e7; border: 1px solid transparent; position: absolute; top: calc(50% - 7px); right: -7px; transform: rotate(45deg); }
.statusStep li:last-child::after { display: none; }
.statusStep .current  { color: var(--primary-deepcolor); font-weight: 600; }
.statusStep .current  ,
.statusStep .current::after  { background: #fff; border-color: var(--primary-deepcolor); }
.statusStep .current::after  { border-left-color: transparent; border-bottom-color: transparent;  }


/*   법령해석 요청하기  -   확인  popup  */
.headConfirm  { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; gap: 20px; line-height: 1.3em; color: #063a74; font-size: 1.5em; font-weight: 600; margin-bottom: 40px; } 
.headConfirm.box  { background: #ebf2f8; padding: 10px; } 
.infoCheck .query { font-size: 1.1em; margin-bottom: 30px; }
.infoCheck .query::first-letter { font-size: 1.3em; font-weight: 600; }

/*   법령해석 다운로드    */
.lawDownload   { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: 5px 20px; background: #ebf2f8; padding: 20px; }

.fileDownload  { width: 100%; max-width: 350px; height: 50px; background: #454655; border-radius: 10px; padding: 0 20px; color: #fff; font-size: 17px; font-weight: 600; display: inline-flex; align-items: center; justify-content: space-between; }
.fileDownload::after  { content: ''; width: 35px; height: 30px; display: inline-flex; background: url(../images/ico_download.png) no-repeat 0 0; }
.fileDownload:first-of-type  { background: #053863; } 

/*    법령 추가하기   */
.inputAdd .inputToggle ~ .inputToggle  { margin-top: 10px; }
.inputAdd .inputToggle ~ .inputToggle::before  { content: ''; width: 100%; height: 1px; background-image: linear-gradient(to right, #aaa 40%, rgba(255,255,255,0) 0%); background-position: bottom; background-size: 8px 1px; background-repeat: repeat-x; margin-bottom: 5px; }

/*    정보공개활용    */
.apiCode em  { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #ff0000; font-weight: 700; }
.gridCnt_table.api tbody th    { font-size: 1.05em; font-weight: 600; justify-content: center; text-align: center; }

/*    서버장비 IP  추가   */
.ipAdd   { display: grid; grid-template-columns: 300px auto; align-items: flex-start; gap: 10px; }
.ipAdd .add > li   { min-height: 30px; background: #ebf2f8; border: 1px solid transparent; padding: 0 5px 0 10px; gap: 5px; } 
.ipAdd .add > li:hover   { background: #fff; border-color: var(--input-bdcolor); }
.ipAdd .add .icoCnt_xCircle:hover::before    { background-position-y: -20px; }
@media only screen and (max-width: 700px) {
    .ipAdd   { grid-template-columns: 100%;  }
}

/*    입법정보 발송설정     */ 
.setupCnt    { margin-bottom: 50px; } 
.setupCnt .head   { display: flex; align-items: center; border-bottom: 1px solid var(--input-bdcolor); padding: 0 0 15px 10px; margin-bottom: 20px; color: #000; font-size: 1.3em; font-weight: 600; } 
.setupCnt > .formAlign   { margin-left: 20px; column-gap: 0; row-gap: 20px; } 
.setupCnt input[type='checkbox'] + label   { flex-shrink: 1; } 



/*********************************************
*  member
*********************************************/ 
/*     약관동의    */
.agreeCnt  { border: 1px solid var(--input-bdcolor); }
.agreeCnt .head  { min-height: 50px; background: #ebf2f8; border-bottom: 1px solid var(--input-bdcolor); display: flex; flex-flow: row wrap; align-items: center; gap: 5px; padding: 10px 20px; }
.agreeCnt .head p ,
.agreeCnt p.head   { color: #063a74; font-size: 20px; font-weight: 700; }
.agreeCnt .agreeCnt_txt  { height: 300px; overflow: auto; padding: 20px; font-size: 0.9em; word-break: keep-all; }
.agreeCnt .agreeCnt_txt .h3 { font-size: 1.05em; font-weight: 700; margin-bottom: 15px; }
.agreeCnt .agreeCnt_txt .h4 { font-weight: 700; } 
.agreeCnt .agreeCnt_txt > p:not(.h3):not(.h4) { line-height: 1.6em; margin-bottom: 20px; }
.agreeCnt [class*='gridCnt']   { border-top-color: #aaa; }
.agreeCnt [class*='gridCnt'] th , .agreeCnt [class*='gridCnt'] td { height: auto; padding: 5px 10px; }


/*     로그인     */
.loginType ,
.loginCnt { display: flex; flex-flow: row wrap; margin: 40px auto; position: relative; }

.loginType  { --gap: 30px; gap: var(--gap); align-items: stretch; left: calc(var(--gap)/2); margin-top: 30px; }
.loginType .content  { width: calc(100%/4 - var(--gap)); background: #eef5f9; border-radius: 10px; font-size: 1.05em; padding: 0 25px 30px; border: 1px solid transparent; position: relative; top: 0; transition: .2s; cursor: pointer; display: flex; align-items: flex-start; flex-direction: column; }
.loginType .content:hover  { background: #fff; border-color: #d0d0d0; top: -5px; box-shadow: 0px 18px 15px -15px rgba(0, 0, 0, .3); text-decoration: none; color: inherit; } 
.loginType .content .head  { min-height: 90px; display: flex; align-items: center; justify-content: center; column-gap: 10px; font-size: 1.5em; }
.loginType .content p  { font-weight: 600; margin-top: 15px; text-align: left; }
.loginType .content p em  { color: var(--primary-deepcolor); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.loginType .content > a   { width: 100%; height: 100%; display: block; background: transparent; border: none; text-align: center; text-decoration: none !important; color: inherit !important; }
.loginType .content .btnArea_wide   { width: 100%; margin-top: 15px; --gap: 10px; }
.loginType .content .btnArea_wide button  { height: 40px; border: none; border-radius: 5px; top: 0; transition: .2s; }
.loginType .content .btnArea_wide button:hover  { top: -2px; }
.loginType .content .btnArea_wide .icoCnt_kakao  { background: #f9e000; }
.loginType .content .btnArea_wide .icoCnt_naver  { background: #06bd34; } 

@media only screen and (max-width: 1200px) {
    .loginType .content  { width: calc(100%/2 - var(--gap)); }
}
@media only screen and (max-width: 600px) {
    .loginType    { margin-top: 15px; left: 0; }
    .loginType .content  { width: 100%; }
}

.loginCnt  { max-width: 900px; margin: 70px auto; }
.loginCnt > div  { width: 50%; position: relative; }
.loginCnt .loginCnt_side  { border-right: 1px solid var(--grid-bdcolor); padding-right: 50px; font-size: 1.1em; }
.loginCnt .listType_bullet li ~ li  { margin-top: 20px; }
.loginCnt .listType_bullet li::before { background: #505050; }

.loginCnt .loginCnt_form  { width: 100%; max-width: 450px; padding-left: 50px; }
.loginCnt_form > li   { display: flex; flex-flow: column wrap; font-size: 1.1em; }
.loginCnt_form > li ~ li  { margin-top: 20px; }
.loginCnt_form > li label  { font-weight: 600; } 
.loginCnt_form > li input[type='text'] ,
.loginCnt_form > li input[type='password']  { width: 100%; height: 50px; border-color: #58616a; padding: 0 20px; } 
.loginCnt_form > li input[type='text'] ,
.loginCnt_form > li input[type='password']  ,
.loginCnt_form > li .btnRefer_primary { border-radius: 10px; }
.loginCnt_form .cntWrap  { flex-direction: row; justify-content: space-between; padding: 10px 30px; }
.loginCnt_form .errMsg  { font-size: .9em; }

@media only screen and (max-width: 1000px) {
	.loginCnt { flex-direction: column; align-items: center; margin: 0; }
	.loginCnt > div { width: 100%; max-width: 450px; }
    .loginCnt .loginCnt_form  { padding-left: 0; order: 1; border-bottom: 1px solid var(--grid-bdcolor); padding-bottom: 40px; margin-bottom: 40px; }
	.loginCnt .loginCnt_side  { border-right: none; padding-right: 0; order: 2; }
}

/*     회원가입     */
.containerWrap.Join  { max-width: 1200px; margin: 0 auto; }
.joinCnt  { max-width: 800px; display: flex; flex-flow: row wrap; --gap: 30px; gap: var(--gap); align-items: stretch; margin: 70px auto; }
.joinCnt .infoGuide  { background: #f1f1f1; word-break: keep-all; }
.joinCnt .content  { width: calc(100%/2 - var(--gap)); background: #eef5f9; border-radius: 10px; font-size: 1.05em; font-weight: 600; padding: 40px 20px; border: 1px solid transparent; position: relative; top: 0; transition: .2s; cursor: pointer; display: flex; flex-flow: column wrap; align-items: center; }
.joinCnt .content:first-of-type  { margin-left: calc(var(--gap)/2); } 
.joinCnt .content .head  { font-size: 1.25em; font-weight: 700; margin: 30px 0 10px; } 
.joinCnt .content:hover  { background: #fff; border-color: #d0d0d0; top: -5px; box-shadow: 0px 18px 15px -15px rgba(0, 0, 0, .3); text-decoration: none; color: inherit; } 

.joinConfirm  { max-width: 600px;  display: flex; flex-flow: column nowrap; row-gap: 40px; align-items: center; justify-content: center; margin: 70px auto; }
.joinConfirm .visual  { width: 100px; height: 100px; background: #e8f6fe; border-radius: 100%; position: relative; left: 20px; }
.joinConfirm .visual::before  { top: -20px; right: 40px; }
.joinConfirm .head  { line-height: 1.6em; font-size: 3em; font-weight: 300; }
.joinConfirm .head em  { font-weight: 700; }
.joinConfirm .text   { line-height: 1.6em; font-size: 1.85em; font-weight: 600; }
.joinConfirm .gridCnt_table   { margin: 0 30px; }


/*     아이디/비밀번호찾기     */
.idpwCnt   { max-width: 1000px; margin: 80px auto; }
.idpwCnt .radioTab  { margin-bottom: 60px; }
.idpwCnt .joinCnt  { max-width: 100%; margin: 0; }
.idpwCnt .joinCnt .content  { width: calc(100% / 3 - var(--gap)); } 


@media only screen and (max-width: 700px) {
    .joinCnt    { margin: 0; }
    .joinCnt .content  { width: 100%; }
	.joinCnt .content:first-of-type { margin-left: 0; }
	.joinConfirm  { row-gap: 25px; margin: 20px auto; }
	.joinConfirm .visual  { transform: scale(.8); left: 15px; }
	.joinConfirm .head  { font-size: 2.2em; }
	.joinConfirm .text  { font-size: 1.5em; }

	.idpwCnt   { margin: 20px auto;  } 
	.idpwCnt .radioTab   { margin-bottom: 30px;  } 
	.idpwCnt .joinCnt .content  { width: 100%; } 
}






/*********************************************
*  index
*********************************************/ 
#Index .lawTop_util   { background: #053863; }
#Index .lawTop_util .nuri  ,  html:not(.sideGnb) #Index .headerWrap .util li a  { color: #fff; }
#Index .headerWrap .util .div::before { background: #6988a1; }
#Index .headerWrap .util .user ,
#Index .headerWrap .util .user + li:before  { display: none; }
html:not(.sideGnb) #Index .headerWrap .util a::before { background-position-y: -40px !important; } 
/* #Index #container   { grid-template-columns: 100%; gap: 0; } */
#Index #containerWrap { margin: 30px auto 70px; }

/* [class*='mainCnt_']  { --gap: 50px; display: grid; grid-template-columns: 21% auto 25%; column-gap: var(--gap); row-gap: 70px; } */
.indexContent   { --lCnt: 21.5%; --rCnt: 25%; --gap: 50px; display: grid; grid-template-columns: var(--lCnt) calc(100% - var(--lCnt) - var(--rCnt) - var(--gap)*2) var(--rCnt); column-gap: var(--gap); row-gap: 70px; }
.mainContent   { grid-column: 1 / span 2; }

/*    통합 검색    */
.mainContent_search  { height: 90px; background: #b4d6fb; background: linear-gradient(67deg,#b4d6fb 0%, #bcddff 50%, #d8dcf9 100%); border-radius: var(--main-bdradius); display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: 10px; margin-bottom: 10px; }
.mainContent_search select  ,
.mainContent_search input[type='search']  { height: 50px; background-color: #fff; border: 1px solid #063a74; border-radius: var(--main-bdradius); font-weight: 600; }
.mainContent_search select  { max-width: 220px; padding: 0 50px 0 20px; font-size: 1.25em; background: url(../images/ico_arrDown.png) no-repeat calc(100% - 15px) 50% #fff; }
.mainContent_search .input  { width: 52%; font-size: 1.35em; padding: 0 60px 0 25px; }
.mainContent_search input[type='search']::-webkit-search-cancel-button { width: 30px; height: 30px; -webkit-appearance: none; background: url(../images/ico_close.png) no-repeat 0 0; margin: 0 -10px 0 5px; filter: grayscale(100); transform: scale(.5); opacity: .7; cursor: pointer; }
.mainContent_search .btSearch  { width: 42px; height: 42px; background: url(../images/ico_zoom.png) no-repeat 50% 50%; border-radius: var(--main-bdradius); margin-left: -58px; transition: .2s; }
.mainContent_search .input:hover + .btSearch ,
.mainContent_search .input:focus-within + .btSearch ,
.mainContent_search .btSearch:hover  { background-color: #e9f0fe; }

/*    메인 슬라이드    */
.mainContent_slide    { height: 210px; padding: 0 30px; background: #e5f3fe; border-radius: var(--main-bdradius); position: relative; text-align: center; }
.mainContent_slide .slideMove  { width: 46px; height: 46px; background: var(--primary-color); border-radius: 100%; display: flex; align-items: center; justify-content: center; position: absolute; top: calc(50% - 25px); z-index: 2; }
.mainContent_slide .slideMove:hover  { background: var(--primary-deepcolor); }
.mainContent_slide .slideMove::before  { background-position-y: -40px; }
.mainContent_slide .slideMove.icoCnt_arrNext  { right: -15px; }
.mainContent_slide .slideMove.icoCnt_arrPrev  { left: -15px; }
.mainContent_slide .page  { display: inline-flex; align-items: center; justify-content: center; position: relative; bottom: 5px; margin: 0 auto; z-index: 1; }
.mainContent_slide .swiper-pagination  { display: inline-flex; position: relative; background: #e5f3fe; border-radius: 0 0 10px 10px; padding: 10px 30px; }
.mainContent_slide .swiper-pagination-bullet  { width: 10px; height: 10px; background: #93a6cd; border-radius: var(--main-bdradius); opacity: 1; }
.mainContent_slide .swiper-pagination-bullet-active  { width: 20px; background: var(--primary-color); }
.mainContent_slide .swiper-slide  { width: 300px; height: 100%; padding: 25px 3px; }
.mainContent_slide .swiper-slide > a  { height: 160px; display: block; padding: 10px 30px; text-align: left; background: #fff; border: 1px solid transparent; border-radius: var(--main-bdradius); position: relative; top: 0; transition: .2s; } 
.mainContent_slide .swiper-slide .gov  { color: #555; padding-bottom: 5px; border-bottom: 1px solid #c5cfe4; }  
.mainContent_slide .swiper-slide .num  { color: #555; font-size: .8em; text-align: right; }  
.mainContent_slide .swiper-slide .subject  { height: 50px; justify-content: center; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.4em; font-size:1.1em; font-weight: 600; text-align: center; word-break: keep-all; margin-top: 15px; }   
.mainContent_slide .swiper-slide > a:hover  { text-decoration: none !important; border-color: #063a74; top: -3px; box-shadow: 0px 18px 10px -13px rgba(0, 0, 0, .3);  } 
.mainContent_slide .swiper-slide > a:hover p  { color: #000; }  
.mainContent_slide .swiper-slide > a:hover .subject  { text-decoration: underline; text-underline-offset: 4px; color: var(--primary-deepcolor); }  

/*     우측 로그인    */
[class*='mainContent_log']   { display: flex; flex-flow: column wrap; align-items: center; background: #fff; border: 1px solid var(--main-bdcolor); border-radius: var(--main-bdradius); padding: 30px; position: relative; }
[class*='mainContent_log'] > a  { width: 100%; border-radius: var(--main-bdradius);  }
.mainContent_login .text  { line-height: 1.5em; color: #555; font-size: 1.25em; font-weight: 600; text-align: center; word-break: keep-all; margin: 20px 0 15px; } 
.mainContent_login .cntWrap  { width: 100%; margin-top: 10px; padding: 0 5px; font-weight: 600; }

.mainContent_logout > *  { width: 100%; }
.mainContent_logout .user  { display: flex; align-items: center; gap: 5px; color: #555; }
.mainContent_logout .user em { color: #222; font-size: 1.85em; font-weight: 600; }
.mainContent_logout .user small { font-size: 1.25em; padding-top: 5px; }
.mainContent_logout .id   { padding-left: 55px; margin-top: -5px; color: #555; }
.mainContent_logout .myItem   { margin: 30px 0 20px; padding-right: 10px; }
.mainContent_logout .myItem > li  { display: flex; justify-content: space-between; font-size: 1.1em; font-weight: 600; }
.mainContent_logout .myItem > li a  { min-width: 50px; min-height: 35px; text-align: right; }
.mainContent_logout .myItem > li a:hover { text-decoration: none !important; }
.mainContent_logout .myItem > li a em { color: var(--primary-deepcolor); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; margin-right: 3px; }
.mainContent_logout .btnRefer_second { border: none; }

/*    기관별 입법예고    */
.mainContent_gover  { background: #f5f5f5; border-radius: var(--main-bdradius); padding: 20px; }
.mainContent_gover .head   { display: flex; align-items: center; gap: 15px; font-size: 1.5em; font-weight: 600; margin-bottom: 20px; }
.mainContent_gover .head .icoApp_gover   { width: 50px; height: 50px; background: #dbe0e7; border-radius: 100%; margin-left: 20px; }
.mainContent_gover .head .icoApp_gover::before   { position: relative; top: -7px; right: 15px; }
.mainContent_gover select  { width: 100%; height: 50px; padding: 0 50px 0 20px; color: #444; font-size: 1.1em; font-weight: 600; background: url(../images/ico_arrDown_s.png) no-repeat calc(100% - 15px) 50% #fff; border-color: #454655; border-radius: var(--main-bdradius); margin-bottom: 15px; }

/*    입법현황    */
.mainContent_board  {  }
.mainContent_board .tabList { display: flex; align-items: center; border: none; margin-bottom: 10px; } 
.mainContent_board .tabList .tabItem ~ .tabItem { margin-left: -13px; } 
.mainContent_board .tabList .tabItem  { background: none; border: none; flex-grow: 1; padding: 0; position: relative; } 

.mainContent_board .tabItem a:not(.btnRefer_icoFlat)  { height: 50px; display: flex; flex-grow: 1; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--main-bdcolor); border-radius: var(--main-bdradius); position: relative; color: #333; font-size: 1.25em; font-weight: 600; text-decoration: none !important; cursor: pointer; } 
.mainContent_board .tabItem .btnRefer_icoFlat  { width: 24px; height: 24px; display: none; align-items: center; justify-content: center; background: #92b1ec; border-radius: 100%; position: absolute; top: calc(50% - 12px); right: 15px; z-index: 1; } 
.mainContent_board .tabItem .btnRefer_icoFlat::before { background-position-y: -40px; }  
.mainContent_board .tabItem a[aria-selected='true'] { color: var(--primary-deepcolor); background: var(--second-color); border-color: var(--primary-deepcolor); z-index: 1; } 
.mainContent_board .tabItem a[aria-selected='true'] + .btnRefer_icoFlat  { display: inline-flex; }
.mainContent_board .tabPanel > li  { display: flex; align-items: center; gap: 5px; padding: 5px 0; }
.mainContent_board .tabPanel a.subject  { font-size: 1.1em; display: inline-block; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; }
.mainContent_board .tabPanel .organ  { width: 21%; color: #555; flex-shrink: 0; text-align: center; }


/* .mainContent_board .tabItem { height: 50px; flex-grow: 1; background: #fff; border: 1px solid var(--main-bdcolor); border-radius: var(--main-bdradius); position: relative; font-size: 1.25em; font-weight: 600; padding: 0 15px; cursor: pointer; } 
.mainContent_board .tabList .tabItem ~ .tabItem { margin-left: -13px; } 
.mainContent_board .tabItem[aria-selected='true'] { color: var(--primary-deepcolor); background: var(--second-color); border-color: var(--primary-deepcolor); z-index: 1; } 
.mainContent_board .tabItem .text { display: inline-flex; justify-content: center; flex-grow: 1; } 
.mainContent_board .tabItem .btnRefer_icoFlat  { width: 24px; height: 24px; display: none; align-items: center; justify-content: center; background: #92b1ec; border-radius: 100%; } 
.mainContent_board .tabItem .btnRefer_icoFlat::before { background-position-y: -40px; } 
.mainContent_board .tabItem[aria-selected='true'] .btnRefer_icoFlat  { display: inline-flex; } */

/*    법령안편집기    */
.mainContent_sideRight  { }

/*    우측  자주사용메뉴    */

/*    좌측  자주사용메뉴    */

/*    추진현황     */

/*    우측 하단 배너     */

/*    공지사항     */











/*********************************************
*  Sitemap (전체메뉴)
*********************************************/ 
.sitemapWrap  { width: 100%; height: 100vh; background: #fff; position: fixed; top: 0; left: 0; z-index: 30; overflow-y: auto; } 
.sitemapWrap .content  { display: block; position: relative; padding: 20px 0;  } 
.sitemapWrap .btnClose  { position: absolute; top: 20px; right: 10px; z-index: 2; } 

.sitemapWrap .sitemap > li  { padding: 25px 0; border-bottom: 1px solid #ccc; display: flex; flex-flow: row nowrap; gap: 50px; align-items: flex-start; color: #111; font-weight: 600; }
.sitemapWrap .sitemap > li:last-child  { border-bottom: none; }
.sitemapWrap .sitemap .depth_1  { width: 220px; min-height: 50px; padding: 10px 40px 10px 20px; background: #f1f3f4; font-size: 20px; position: relative; flex-shrink: 0; } 
.sitemapWrap .sitemap .depth_1::after  { content: ''; width: 20px; height: 20px; display: inline-block; background: url(../images/ico_cnt.png) no-repeat -180px 0; position: absolute; top: calc(50% - 10px); right: 10px; } 
.sitemapWrap .sitemap > li:hover .depth_1   { background: #e5f3fb; } 
.sitemapWrap .sitemap > li:hover .depth_1::after  { background-position-y: -20px; } 
.sitemapWrap .sitemap_gnb   { display: flex; flex-flow: row wrap; gap: 40px 80px; } 
.sitemapWrap .sitemap_gnb .depth_2  { min-height: 50px; display: flex; align-items: center; font-size: 18px; padding: 10px; } 
.sitemapWrap .sitemap_gnb ul   { margin-left: 25px; }  
.sitemapWrap .sitemap_gnb ul > li  { margin: 5px 0; position: relative; color: #555; }   
.sitemapWrap .sitemap_gnb ul > li a::before  { content: ''; width: 0; height: 5px; background: var(--primary-color); border-radius: 3px; display: block; position: absolute; top: calc(50% - 2px); left: -15px; transition: .2s; }
.sitemapWrap .sitemap_gnb ul > li a:hover::before    { width: 9px; }


/*********************************************
*  jquery ui  - datepicker
*********************************************/ 
.ui-widget    { font-family: inherit; --headColor: #063a74; }
.ui-widget.ui-widget-content  { background: transparent; border: none; border-radius: 0; padding: 0; }
.ui-widget-header , .ui-datepicker .ui-datepicker-title , .ui-datepicker .ui-icon::before   { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; } 
.ui-widget-header  { background:var(--headColor); border-width: 0; padding: 0; border-radius: 0; z-index: 5; }
.ui-widget-header .ui-corner-all  { width: 30px; height: 100%; line-height: 2.5em; z-index: 5; }
.ui-datepicker .ui-datepicker-title  { color: #fff; line-height: 1.5em; gap: 15px; }
.ui-datepicker .ui-datepicker-title select  { color: #fff; background-color: transparent; background-image: url(../images/searchMark_disabled.png); background-position: 100% 50%; border: none; padding: 0 20px 0 5px;  } 
.ui-datepicker .ui-datepicker-title select option  { color: #333; } 
.ui-datepicker .ui-datepicker-title .ui-datepicker-year  { width: 65px; } 
.ui-datepicker .ui-datepicker-title .ui-datepicker-month  { width: 60px; } 
.ui-datepicker .ui-icon     { width: 100%; height: 100%; background: none; text-indent: 0; white-space: nowrap; font-size: 1px; color: transparent; }
.ui-datepicker .ui-datepicker-prev  { left: 2px; }
.ui-datepicker .ui-datepicker-next  { right: 2px; }
.ui-datepicker .ui-datepicker-prev , 
.ui-datepicker .ui-datepicker-next    { width: 30px; height: 100%; top: 0; margin-top: 0; text-align: center; display: inline-flex; align-items: center; justify-content: center; }
.ui-datepicker .ui-icon::before     { content: ''; width: 20px; height: 20px; background-image: url(../images/ico_cnt.png); }
.ui-datepicker .ui-datepicker-prev .ui-icon:before   { background-position: -200px -40px; }
.ui-datepicker .ui-datepicker-next .ui-icon:before    { background-position: -180px -40px; }
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span  { left: 0; top: 0; margin-left: 0; margin-top: 0; display: inline-flex; align-items: center; justify-content: center; }
.ui-datepicker .ui-datepicker-prev.ui-state-hover , 
.ui-datepicker .ui-datepicker-next.ui-state-hover    { background: transparent; border: none; }
.ui-datepicker-calendar  { background:#fff; border: 1px solid var(--headColor); margin-top: -1px; }
.ui-datepicker-calendar th  { background: #f5f5f5; border-bottom: 1px solid #d5d5d5; color: #111; font-weight: normal; padding:1px 0; font-size: 13px; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default  { background: none; border: none; } 
.ui-datepicker-calendar td span  { text-align: center; }
.ui-datepicker-calendar td a   { width: 35px; min-height: 35px; line-height: 30px; margin: 0 auto; color: #444; font-weight: normal; text-align: center; border-radius: 100% !important;   }
.ui-datepicker-calendar td:first-child a   { color: #f31818; } 
.ui-datepicker-calendar .ui-state-highlight  { background: #e9f2f7 !important; color: #000; font-weight: 600; }
.ui-datepicker-calendar td .ui-state-hover   { background: #f0f0f0; }
.ui-datepicker-calendar .ui-datepicker-current-day .ui-state-active   { background: var(--primary-color) !important; color: #fff !important;  font-weight: bold !important; border-radius: 100% !important; }
.text-view { white-space: pre-line; } 
#containerWrap > div.detailContent > p.\33  { margin-top: 30px; margin-bottom: 30px; }
#containerWrap > div.detailContent > p.\32  { margin-top: 30px; margin-bottom: 30px; }
#containerWrap > div.detailContent > p.\31  { margin-top: 30px; margin-bottom: 30px; }

/* X 버튼 */
.btn-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 6px;        /* ← 파일명과의 간격 */
  border-radius: 50%;
  border: none;
  background: #000000;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: all 0.15s;
  vertical-align: middle;
}

.btn-x:active {
  transform: scale(0.95);
}

/* 파일 리스트 정렬(옵션) */
#fileList li{ display:flex; align-items:center; gap:8px; }

/* 상단 컨테이너를 플렉스 레이아웃으로 */
.headerWrap .content {
  display: flex;
  align-items: center;   /* 수직 가운데 정렬(선택) */
  gap: 12px;             /* 요소 간 간격(선택) */
}

/* p 기본 마진 제거 + 오른쪽으로 밀기 */
.sideUtil {
  margin: 0 0 0 auto;    /* ← 이게 핵심: 오른쪽 끝으로 */
}

/* 버튼 모양 조금 다듬기(선택) */
.sideUtil .btnRefer_icoFlatText.icoCnt_logout {
  display: inline-block;
  padding: 6px 12px;
  text-decoration: none;
}

.lawTop_util .content {
  display: flex;
  align-items: center; /* 수직 정렬 */
}

.lawTop_util .userName {
  margin-left: auto; /* 왼쪽 문장과 관리자 사이를 자동으로 벌림 */
  margin-right: 10px; /* 관리자와 로그아웃 간격 */
}

.lawTop_util .icoCnt_logout {
  text-decoration: none;
  color: black;
}

.attachBox {
  margin-top: 24px;
  padding: 20px 24px;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  background: #f9fafb;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* 제목 */
.attachBox h3 {
  margin: 0 0 14px;
  font-size: 17px;
  font-weight: 600;
  color: #1f2937;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* 리스트 */
.attachList {
  list-style: none;
  margin: 0;
  padding: 0;
}

.attachList li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  transition: background 0.15s;
}
.attachList li:last-child {
  border-bottom: none;
}
.attachList li:hover {
  background: #f3f4f6;
}

/* 파일명 */
.attachName {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #374151;
  font-size: 14px;
}
.attachName a {
  text-decoration: none;
  color: #2563eb;
  font-weight: 500;
}
.attachName a:hover {
  text-decoration: underline;
}

/* 확장자 뱃지 */
.attachExt {
  padding: 3px 8px;
  font-size: 12px;
  border-radius: 8px;
  background: #e0f2fe;
  color: #0369a1;
  border: none;
}

/* 메타 정보 */
.attachMeta {
  font-size: 12px;
  color: #6b7280;
  margin-left: 12px;
}

/* 파일 선택 버튼 */
.file-select {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  background: #2563eb;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s;
}
.file-select:hover {
  background: #1d4ed8;
}