* { font-family : 'Pretendard'; scroll-behavior: smooth;}
body { overflow-x : hidden }
.mobile-area-view { display : none } 
.contentview { margin : 0 !important } 
.worldmap { position: relative; width: 945px; height: 491px; } 

.worldmap img { width: 945px; } 


.worldmap .wordbtn { border : 1px solid #873e0e; color : #888888; font-size: 14px; line-height: 1; border-radius: 20px; padding: 5px 14px 7px; position: absolute; background: #fff; } 
.worldmap .wordbtn:hover,
.worldmap .wordbtn.active { background-color: #873e0e; color : #fff } 
.navi-korea { top: 123px; margin-left: -116px; left: 50%; z-index: 2; } 
.navi-asia { top: 163px; margin-left: -192px; left: 50%; z-index: 2; } 
.navi-middleeast { top: 169px; margin-left: -277px; left: 50%; z-index: 2; } 
.navi-russia { top: 66px; margin-left: -225px; left: 50%; z-index: 2; } 
.navi-europe { top: 97px; margin-left: -393px; left: 50%; z-index: 2; } 
.navi-africa { top: 223px; margin-left: -379px; left: 50%; z-index: 2; } 
.navi-oceania { top: 329px; margin-left: -101px; left: 50%; z-index: 2; } 
.navi-northamerica { top: 106px; margin-right: -305px; right: 50%; z-index: 2; } 
.navi-southamerica { top: 276px; margin-right: -411px; right: 50%; z-index: 2; } 



.northamerica.on,
.northamerica:hover { width: 404px; height: 238px; background: url('/assets/images/constitution/search/m-northamerica.png') no-repeat; background-size: 297px 174px; position: absolute; top: 14px; right: 50%; margin-right: -509px; } 
.southamerica.on,
.southamerica:hover { width: 267px; height: 336px; background: url('/assets/images/constitution/search/m-southamerica.png') no-repeat; background-size: 204px 249px; position: absolute; top: 167px; right: 50%; margin-right: -500px; } 
.russia.on,
.russia:hover { width: 400px; height: 142px; background: url('/assets/images/constitution/search/m-russia.png') no-repeat; background-size: contain; position: absolute; top: 13px; left: 153px; /* margin-left: -434px; */ } 
.asia.on,
.asia:hover { width: 190px; height: 176px; background: url('/assets/images/constitution/search/m-asia.png') no-repeat; background-size: contain; position: absolute; top: 119px; left: 50%; margin-left: -221px; } 
.europe.on,
.europe:hover { width: 199px; height: 179px; background: url('/assets/images/constitution/search/m-europe.png') no-repeat; background-size: 154px 133px; position: absolute; top: 44px; left: 35px; /* margin-left: -589px; */ } 
.africa.on,
.africa:hover { width: 245px; height: 268px; background: url('/assets/images/constitution/search/m-africa.png') no-repeat; background-size: 192px 198px; position: absolute; top: 168px; left: 32px; /* margin-left: -584px; */ } 
.middleeast.on,
.middleeast:hover { width: 182px; height: 124px; background: url('/assets/images/constitution/search/m-middleeast.png') no-repeat; background-size: 136px 92px; position: absolute; top: 138px; left: 50%; margin-left: -324px; } 
.oceania.on,
.oceania:hover { width: 161px; height: 190px; background: url('/assets/images/constitution/search/m-oceania.png') no-repeat; background-size: 122px 141px; position: absolute; top: 264px; left: 50%; margin-left: -115px; } 
.korea.on,
.korea:hover { width: 21px; height: 34px; background: url('/assets/images/constitution/search/m-korea.png') no-repeat; background-size: 16px 21px; position: absolute; top: 157px; left: 50%; margin-left: -85px; }  

.p-header { height: 30px; font-size: 18px; font-weight: 500; color: #222; border-bottom: 1px solid #ddd; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding-bottom: 16px; } 

.close-pop { width: 23px; height: 23px; background: url('/assets/images/main/btn_close2.png') no-repeat; background-size: 23px 23px; cursor: pointer } 

.nation-list ul { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; } 

.nation-list ul li { font-size: 15px; padding: 10px 0 10px; width: 50%; color: #222 } 

.nation-list ul li:first-child { padding: 15px 0 10px; } 

.nation-list ul li span.checknum { position: relative; border: 1px solid #ddd; padding: 2px 10px 2px 29px; border-radius: 20px; font-size: 14px; margin-left: 5px; } 

.nation-list ul li span::before { content: ''; background: url('https:/lnp.nanet.go.kr/assets/images/main/icn_checknum.png') no-repeat; width: 19px; height: 13px; background-size: 19px 13px; position: absolute; top: 6px; left: 10px; } 

#popup_layer1 { position: absolute; top: 168px; left: 50%; line-height: 1; margin-left: -258px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer2 { position: absolute; top: 190px; left: 50%; line-height: 1; margin-left: 200px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer3 { position: absolute; top: 118px; left: 50%; line-height: 1; margin-left: -334px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer4 { position: absolute; top: 325px; left: 50%; line-height: 1; margin-left: 74px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer5 { position: absolute; top: 215px; left: 50%; line-height: 1; margin-left: -340px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer6 { position: absolute; top: 380px; left: 50%; line-height: 1; margin-left: -240px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer7 { position: absolute; top: 219px; left: 50%; line-height: 1; margin-left: -452px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer8 { position: absolute; top: 147px; left: 50%; line-height: 1; margin-left: -606px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer9 { position: absolute; top: 275px; left: 50%; line-height: 1; margin-left: -630px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

#popup_layer10 { position: absolute; top: 190px; left: 50%; line-height: 1; margin-left: -110px; z-index: 999; width: 360px; height: auto; padding: 20px 20px 10px; border-radius: 20px; border: 3px solid #ff9652; display: none; font-size: 14px; background: #fff; filter: drop-shadow(3px 3px 3px rgba(153,153,153,0.3)); } 

.nation-list li { display : flex; gap : 10px; cursor: pointer; } 
.nation-list li p { width : 30px; height : 20px } 
.nation-list li p img { display : block; width : 100%; height : 100% } 


.guide_content { border : 1px solid #eee; border-radius : 0 1rem 0 0; padding : 2rem; background : url('/assets/images/constitution/db/guid_watermark.png') no-repeat bottom -15px right -20px; display : flex; gap : 1rem; margin : 1.5rem 0 } 
.guide_content > p { position : relative; width : 200px; height : 260px; overflow : hidden; flex-shrink: 0; } 
.guide_content > p img { position : absolute; top : 50%; left : 50%; transform: translate(-50%, -50%); object-fit: cover; height : 100%; max-height: 100%; } 
.guide_content h2 { font-size : 20px; margin-bottom : 10px } 
.guide_content div { font-size : 14px } 
.guide_content div p { margin-bottom : 10px; font-size : 16px } 
.guide_content a { position : relative; display : inline-block; width : auto !important; height : 40px; line-height : 40px; padding : 0 45px 0 20px; border-radius : 50px; color :#fff; font-size : 16px; background-color: #0066a6; margin-top : 15px } 
.guide_content a i { position : absolute; top : 5px; right : 5px; display : inline-flex; width : 30px; height : 30px; align-items: center; justify-content: center; border-radius : 100%; background-color: #fff; } 












/* 테블릿 세로 (해상도 768px ~ 1023px)*/
@media all and (min-width: 768px) and (max-width:1195px){
 .worldmap { display: none } 

 .world-law { height: auto; padding: 30px 0 30px; } 

 .world-law-title { height: 60px; } 

 .mobile-area-view { width: 100%; display: block } 

 .mobile-area-view .mobile-world-law { width: 100%; } 

 .toggle-view .listtitle { position: relative; width: 100%; height: 44px; padding: 0 20px; font-size: 16px; font-weight: 400; background: #193a65; color: #fff; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; cursor: pointer } 

 .toggle-view .listtitle span::after { content: '\002B'; position: absolute; top: 10px; right: 20px } 

 .view .listtitle { background: #ff8a3d; } 

 .view .listtitle span::after { content: '\2012'; position: absolute; top: 10px; right: 20px; } 

 .toggle-view .contentview { padding: 10px 20px; background: #fff; color: #333; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; } 

 .toggle-view .contentview { display: none; } 

 .view .contentview { display: block } 

 .view .contentview ul li span::before { content: '\203A'; margin-right: 5px } 

 .view .contentview ul { display: flex; flex-direction: row; justify-content: start; align-items: center; flex-wrap: wrap; } 

 .view .contentview ul li { width: 50%; padding: 10px 0; cursor: pointer; } 
 }

/* 모바일 가로, 테블릿 세로 (해상도 220px ~ 479px)*/
@media screen and (max-width: 479px) { } 

/* 모바일 가로, 테블릿 세로 (해상도 480px ~ 767px)*/
@media all and (max-width: 767px){
 .worldmap { display: none } 

 .world-law { height: auto; padding: 40px 0; } 

 .world-law-title { height: 60px; } 

 .mobile-area-view { width: 100%; display: block } 

 .mobile-area-view .mobile-world-law { width: 100%; } 

 .toggle-view .listtitle { position: relative; width: 100%; height: 44px; padding: 0 20px; font-size: 16px; font-weight: 400; background: #193a65; color: #fff; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; cursor: pointer } 

 .toggle-view .listtitle span::after { content: '\002B'; position: absolute; top: 10px; right: 20px } 

 .view .listtitle { background: #ff8a3d; } 

 .view .listtitle span::after { content: '\2012'; position: absolute; top: 10px; right: 20px; } 

 .toggle-view .contentview { padding: 10px 20px; background: #fff; color: #333; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; } 

 .toggle-view .contentview { display: none; } 

 .view .contentview { display: block } 

 .view .contentview ul li span::before { content: '\203A'; margin-right: 5px } 

 .view .contentview ul { display: flex; flex-direction: row; justify-content: start; align-items: center; flex-wrap: wrap; } 

 .view .contentview ul li { width: 50%; padding: 10px 0; cursor: pointer; } 
 }

@media all and (max-width: 479px){
 .worldmap { display: none } 

 .mobile-area-view { width: 100%; display: block } 

 .mobile-area-view .mobile-world-law { width: 100%; } 

 .toggle-view .listtitle { position: relative; width: 100%; height: 44px; padding: 0 20px; font-size: 16px; font-weight: 400; background: #193a65; color: #fff; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; cursor: pointer } 

 .toggle-view .listtitle span::after { content: '\002B'; position: absolute; top: 10px; right: 20px } 

 .view .listtitle { background: #ff8a3d; } 

 .view .listtitle span::after { content: '\2012'; position: absolute; top: 10px; right: 20px; } 

 .toggle-view .contentview { padding: 10px 20px; background: #fff; color: #333; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border: 1px solid #ddd; } 

 .toggle-view .contentview { display: none; } 

 .view .contentview { display: block } 

 .view .contentview ul li span::before { content: '\203A'; margin-right: 5px } 

 .view .contentview ul { display: flex; flex-direction: row; justify-content: start; align-items: center; flex-wrap: wrap; } 

 .view .contentview ul li { width: 50%; padding: 10px 0; cursor: pointer; } 
 }





 @media ( max-width : 700px ){
 .guide_content { flex-direction: column; } 
 .guide_content > p { margin : 0 auto } 
 }




/* 기존사이트소스 외 추가 */
.svg { display : inline-block; width : 20px; height : 20px; background-color: #000; forced-color-adjust: none; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; } 

.svg_list { mask-image : url('/assets/images/constitution/link/svg_list.svg'); } 
.svg_map { mask-image : url('/assets/images/constitution/link/svg_map.svg'); } 
.svg_right { mask-image : url('/assets/images/constitution/link/svg_right.svg'); } 



.mini_link_wrap { display : flex; margin : 1rem 0; justify-content: flex-end; gap : 15px; align-items: center; } 
.mini_link_wrap .svg { background-color: #666; } 
.mini_link_wrap span { display : inline-block; width : 1px; height : 20px; background-color: #ccc; } 
.mini_link_wrap a { display : inline-flex; align-items: center; gap : 5px; width : auto; color : #666 } 
.mini_link_wrap a.active { color : #bf5814; font-weight: bold; } 
.mini_link_wrap a.active .svg { background-color: #bf5814; } 


.new_tab_wrap { display : flex; top : 2px; position : relative; z-index : 2 } 
.new_tab_wrap li { display : inline-flex; } 
.new_tab_wrap li a { display : block; width : 150px; border : 1px solid #ccc; border-bottom : 0; border-radius : 10px 10px 0 0; text-align: center; line-height : 45px; } 
.new_tab_wrap li a.active { border-color : #ff9752; border-width : 2px; font-weight: bold; background-color: #fff; } 
.new_db_wrap .tab_content { display : none; border : 2px solid #ff9752; padding : 20px 10px; height : 430px; overflow : hidden; } 
.new_db_wrap .tab_content.active { display : flex; gap : 20px } 
.new_db_wrap .list_area_btn { width : 150px; flex-shrink: 0; } 
.new_db_wrap .list_area_btn li + li { margin-top : 10px } 
.new_db_wrap .list_area_btn a { display : block; position : relative; line-height : 35px; font-size : 14px; background-color : #eee; text-align : center; border-radius : 50px; padding-right : 30px } 
.new_db_wrap .list_area_btn a.active { background-color: #963c00; color : #fff } 
.new_db_wrap .list_area_btn a span { position : absolute; top : 4px; right : 5px; width : 28px; line-height : 28px; border-radius : 100%; display : block; background-color: #fff; text-align: center; } 
.new_db_wrap .list_area_btn a span i { width : 12px; height : 12px; } 
.list_area_content,
.list_sort_abc { display : none } 
.list_area_content.active,
.list_sort_abc.active { display : block; width : 100%; height : 400px; overflow : auto; padding-top : 10px; } 
.list_area_content:after { content : ''; display : block; clear : both } 
.list_area_content a { display : flex; height : 40px; align-items: center; padding : 10px; width : 25%; margin-bottom : 50px; float : left; font-weight: 600;}
.list_sort_abc a { display : flex; height : 40px; align-items: center; padding : 10px; width : 20%; margin-bottom : 50px; float : left; font-weight: 600;}  
.list_sort_abc { overflow : auto } 
.list_sort_abc{ padding-top : 10px }
.list_area_content a img,
.list_sort_abc a img { display : inline-block; width : 70px; /*height : 40px ;*/ aspect-ratio: 70/40; border : 1px solid #eee; margin-right : 10px; object-fit: fill} 

.has_flag_list a { display : flex; align-items: center; }
.has_flag_list a span { flex-shrink: 0;} 
.has_flag_list a img {display : inline-block; width: 35px; margin-left: 5px; margin-right: 5px; height:25px; border : 1px solid #ccc;}  

.worldmap img { border : 1px solid #ccc } 

.db_content_wrap { display : grid; gap : 30px; margin-top : 40px; grid-template-columns: repeat(2, 1fr); } 
.db_content_wrap .inner { position : relative; border : 1px solid #e0e0e0; border-radius : 20px; padding : 0 30px 80px 30px } 
.db_content_wrap .logo_wrap { border-bottom : 1px solid #e0e0e0; height : 100px; display : flex; align-items: center; justify-content: center; } 
.db_content_wrap .logo_wrap img { display : block; width : auto; height : auto; max-width : 100% } 
.db_content_wrap h2 { padding : 20px 0 10px 0; font-size : 20px; color : #111 } 
.db_content_wrap h3 { font-size : 16px; color : #333; font-weight: normal; } 
.db_content_wrap a { position : relative; display : block; position : absolute; bottom : 20px; right : 20px; background-color: #0066a6; border-radius : 50px; width : 120px; height : 35px; line-height : 35px; text-align: center; color : #fff; padding-right : 20px; font-size : 15px } 
.db_content_wrap a span { position : absolute; top : 4px; right : 5px; width : 26px; height : 26px; background-color: #fff; border-radius : 100%; display : flex; align-items: center; justify-content: center; } 
.db_content_wrap a i { width : 15px; height : 15px; background-color: #0066a6; } 

.search_tab_wrap { max-width : 1300px; margin : 0 auto; padding : 0 15px } 
.search_tab_wrap ul { display : flex; border-radius : 10px; border : 1px solid #ccc; justify-content: space-between; } 
.search_tab_wrap ul li { flex-grow: 1; } 
.search_tab_wrap ul li + li { border-left: 1px solid #ccc } 
.search_tab_wrap a { display : block; line-height: 55px; text-align: center; width : 100%; font-weight: bold; font-size : 18px } 
.search_tab_wrap a.active { background-color: #873E0E; color : #fff } 
.search_tab_wrap a span { color : #ff9752; } 

.total_search_wrap { display : flex; max-width : 1300px; margin : 40px auto; padding : 0 15px; gap : 50px } 
.total_search_wrap aside { width : 280px; flex-shrink: 0; } 
.total_search_wrap aside h2 { border-bottom : 2px solid #6D7882; font-size : 26px; color : #222; padding-bottom : 12px } 
.total_search_wrap aside ul { margin : 0; } 
.total_search_wrap aside ul > li > a { display : flex; font-weight: bold; justify-content: space-between; align-items: center; } 
.total_search_wrap aside li a i { transform : rotate(90deg) } 
.total_search_wrap aside li.active a i { transform : rotate(-90deg); width : 18px; height : 18px } 

.total_search_wrap aside a { display : block; font-size : 18px; padding : 15px 0 } 
.total_search_wrap aside ol { display : none } 
.total_search_wrap aside ul > li.active ol { display : block } 
.total_search_wrap aside button { background-color: #873E0E; color : #fff; display : block; height : 48px; width : 100%; font-size : 16px; margin-top : 20px; border-radius : 3px } 

.search_title { position : relative; font-size : 32px; color : #222; } 
.search_title a { position : absolute; bottom : 0; right : 0; font-size : 18px; width : auto; color : #33363D; height : auto; font-weight: normal; } 
.search_title a.back_list img { transform : rotate(-180deg); margin-left : 5px } 
.search_title span { color : #FF9752 } 
.search_sorting { display : flex; justify-content: space-between;  padding : 20px 0; color : #333; font-weight: bold; border-bottom : 2px solid #6D7882; align-items: center;} 
.search_sorting p a { display : inline-block; width : auto; font-weight: 500; padding : 5px; margin-left : 5px; letter-spacing: -.5px; } 
.search_sorting p a.active { background-color: #FFECDF; text-decoration: underline; border-radius : 5px } 
.search_sorting div a { border : 1px solid #DFDFDF; display : inline-block; line-height : 50px; width : auto; border-radius : 10px; padding : 0 25px; color : #818181 } 
.search_sorting div a + a { margin-left : 5px } 
.search_sorting div a.active { color : #873E0E; border : 2px solid #873E0E; box-shadow: 0 0px 10px 4px #e4e4e4; } 
.search_sorting select { border : none; font-size : 18px; color : #333; font-weight: bold; padding : 0 10px; } 
.search_sorting i { display : inline-block; width : 1px; height : 15px; background-color: #888; margin : 0 10px } 


.total_search_wrap { display : none } 
.total_search_wrap.active { display : flex } 
.total_search_result { flex-grow: 1; } 
.total_search_result > ul { margin-bottom : 70px } 
.total_search_result > ul a { display : block; padding : 25px 0; border-bottom : 1px solid #ccc } 
.total_search_result > ul h2 { font-size : 18px; margin-bottom : 30px } 
.total_search_result > ul h2 b {background-color: #EEF2F7; padding : 0 5px; border-radius : 3px; color : #052B57 }
.total_search_result > ul dl { display : flex } 
.total_search_result > ul dl dt { width : 70px; font-weight: bold; } 
.total_search_result > ul dl dd { width : 120px } 



#loadingWrap { display : flex; align-items: center; justify-content: center; height : 100vh; padding : 20px } 
#loadingWrap .loading_wrap { width : 100%; max-width : 960px; } 
#loadingWrap .top { display : flex; justify-content: space-between; margin-bottom : 1.5rem; align-items: center; } 
#loadingWrap .loading_inner { border : 1px solid #D8E4EE; background : url(img/sub/loading_bg.png) no-repeat center center / cover; border-radius : 10px; overflow : hidden; height : 300px; display : flex; flex-direction: column; justify-content: center; align-items: center; } 
#loadingWrap .loading_inner h2 { color : #111; font-size : 30px; margin-bottom : 50px } 
#loadingWrap .loading_inner p { text-align: center; } 
#loadingWrap .loading_inner span { display: inline-block; width: 21px; height: 21px; margin: 0 5px; } 

:root { --duration: 3s; } 

.loading_square { display: flex; gap: 10px; align-items: center; justify-content: center; } 
.loading_square span { width: 21px; height: 21px; background: #138FAE; display: inline-block; animation: colorCycle var(--duration) linear infinite; } 
.loading_square span:nth-child(1) { animation-delay: 0s; } 
.loading_square span:nth-child(2) { animation-delay: calc(var(--duration) / 3); } 
.loading_square span:nth-child(3) { animation-delay: calc(var(--duration) * 2 / 3); } 

@keyframes colorCycle { 
 0% { background: #138FAE } 
 33% { background: #005596 } 
 66% { background: #B9E2E4 } 
 100% { background: #138FAE } 
 }


.guide_info { background : url(img/sub/guide_bg.png) no-repeat center center / cover; padding : 90px 20px 70px 20px; text-align: center; color : #fff }
.guide_info h2 { font-size : 48px; margin-bottom : 20px; letter-spacing: -1px; }
.guide_info p { font-size : 21px }

.guide_nav { background-color: #F1FAFF; border-bottom : 1px solid #ccc; text-align: center;}
.guide_nav a { display : inline-block; width : auto; line-height : 70px; color : #888; font-size : 21px; border-bottom : 3px solid transparent;  padding : 0 25px }
.guide_nav a.active { border-bottom-color : #0074CC; font-weight: bold; color : #0074CC }

.service_guide_content { max-width : 1400px; padding : 0 20px; margin : 80px auto; text-align: center;}
.service_guide_content sub { display : block; font-size : 48px; color : #138FAE; font-weight: bold; font-family: 'Pretendard';}
.service_guide_content .guide_title { font-size : 32px; color : #222; margin : 15px 0; }
.service_guide_content .guide_mini_title { font-size : 19px; color : #111111 }
.guide_download { display : flex; justify-content: space-between; gap : 50px; margin-top : 50px }
.guide_download a { display : block; box-shadow: 0 0 15px 5px #f1f1f1; border-radius : 20px; padding : 50px; text-align: left;}
.guide_download dl { display : flex; align-items: center; gap : 30px }
.guide_download strong { display : block; font-size : 27px; color : #111; margin-bottom : 20px }
.guide_download span {  padding-bottom : 3px; border-bottom : 1px solid #111}
.guide_notice { margin-top : 50px; border : 1px solid #D8E4EE; background-color: #F8F8F8; display : flex; padding : 25px; font-size : 19px; border-radius : 10px; gap : 10px; align-items: center; color : #111; text-align: left; }
.guide_notice img { width : 25px; height : 25px } 


.modal_title { color : #111; font-size : 36px } 
.flag_modal_top { border : 1px solid #D8E4EE; background-color: #eef2f7; border-radius : 15px; overflow : hidden; padding : 20px; margin : 10px 0 50px; display : flex; gap : 20px; color : #111 } 
.flag_modal_top ul { margin-top : 20px } 
.flag_modal_top li + li { margin-top : 10px; font-size : 16px } 
.flag_modal_top li {font-size : 16px } 
.flag_modal_top li:last-child{font-size : 14px}
.flag_modal_top img { width : 250px; /*height : 180px;*/ aspect-ratio: 250/180; max-width: 100%; object-fit: fill} 
#flagModalWrap .check-form { border : none } 
#flagModalWrap .list-group { border-top : 1px solid #eef2f7; margin-top : 20px } 
#flagModalWrap .list-contents { padding : 0 } 
#flagModalWrap .data-list ul.list-group>li { padding : 20px 0 } 


.guide_notice_tab { display : flex; justify-content: space-between; margin-top : 50px }
.guide_notice_tab a { width : 50%; text-align: center; font-size : 26px; color : #8B9AA5; font-weight: bold; letter-spacing: -1px; display : inline-flex; align-items: center; justify-content: center; border : 2px solid transparent; border-bottom-color : #0074CC; height : 90px; border-radius : 10px 10px 0 0; gap : 15px }
.guide_notice_tab .on { display : none }
.guide_notice_tab .off { display : block }

.guide_notice_tab a.active { border-color : #0074CC; border-bottom-color : #fff; color : #0074CC }
.guide_notice_tab a.active .on { display : block }
.guide_notice_tab a.active .off { display : none }

.guide_notice_content { display : none; padding : 100px 0 }
.guide_notice_content.active { display : block; }
.guide_notice_content .guide_mini_title { font-size : 27px; letter-spacing: -1.5px; font-weight: bold; line-height : 140% } 
.guide_notice_content > img { display : block; margin : 20px auto; max-width : 100%; height : auto }
.guide_notice_content .mini_txt { font-size : 19px; color : #111; font-weight: 500; line-height : 130%; margin-bottom : 70px }






.dis_wrap { position : relative; padding : 80px 20px;  }
.dis_wrap:before { content : ''; width : 200%; height : 100%; background-color: #F1FAFF; position : absolute; top : 0; left : -50%; z-index : -1 }

.disclosure_wrap { border : 1px solid #D8E4EE; border-radius : 15px; overflow : hidden }
.disclosure_wrap + .disclosure_wrap { margin-top : 20px }

.toggle_title { position : relative; display:flex; width:100%; padding : 20px 50px; background-color: #fff; font-size : 23px; font-weight: bold; gap : 15px; align-items: center; text-align: left;} 
.toggle_title i { position : absolute; top : 50%; right : 20px; transform : translateY(-50%) rotate(90deg)}
.toggle_title.active i { transform: translateY(-50%) rotate(-90deg);}

.toggle_content { max-height:0; overflow:hidden; transition:max-height 0.4s ease; background-color: #fff; } 
.toggle_content .padding { padding : 0 50px 50px 50px }
.toggle_content .padding img { display : block; max-width : 100%; height : auto }
.toggle_content dl { display : flex; align-items: center; gap : 50px}
.toggle_content dl dt { width : 50%; flex-shrink: 0;}
.toggle_content dl dd { flex-grow: 1;}
.toggle_content li { position : relative; padding-left : 30px; font-size : 20px; text-align: left; color : #111 }
.toggle_content li + li { margin-top : 15px }
.toggle_content li span { position : absolute; top : 0; left : 0; color : #0074CC; font-weight: bold; }
.toggle_content .inner_txt { border : 1px solid #D8E4EE; background-color: #F8F8F8; padding : 25px; font-size : 18px; text-align: left; border-radius : 10px; overflow : hidden; margin-top : 30px; color : #111 }
.toggle_content .inner_txt a { display : inline-block; color : #005596; margin-top : 20px; padding-bottom : 3px; border-bottom : 1px solid #005596; width : auto }
.toggle_content .flex { display : flex; gap : 50px }


.search_all_page.active { display : grid !important } 
.search_all_page { display : grid; grid-template-columns: repeat(2, calc(50% - 20px)); gap : 40px; width: 100%; } 
.search_all_page .inner { position : relative; border : 1px solid #CCD1D5; padding : 50px 20px 120px 20px; border-radius : 20px; } 
.search_all_page .inner h2 { color : #111; margin-bottom : 20px } 
.search_all_page .inner:last-child { border : none; padding : 0 } 
.search_all_page .inner .more_btn { position : absolute; bottom : -1px; left : -1px; width : calc(100% + 2px); border : 1px solid #873E0E; color : #873E0E; background-color: #FFF4EC; border-radius : 0 0 20px 20px; overflow: hidden; display : flex; height : 70px; align-items: center; justify-content: center; font-size : 18px; font-weight: bold; } 


.swiper-thumbs:before { content : ''; width : 100%; background-color : #B1B8BE; height : 2px; position : absolute; bottom : 0; left : 0; margin-top : 10px } 
.gallery-thumbs .swiper-slide { cursor: pointer; color : #464C53; border-bottom : 2px solid transparent; white-space: nowrap; text-align: center; height : 30px; margin : 0; width : auto; padding : 0 10px; font-size : 18px; color : #111 } 

.gallery-top .gallery-thumbs { padding-top : 10px } 
.gallery-top .gallery-thumbs:before { display : none } 
.gallery-top .gallery-thumbs .swiper-slide { border : 1px solid #DFDFDF; height : 40px; line-height : 40px; text-align: center; padding : 0 15px; border-radius : 10px } 
.gallery-top .gallery-thumbs .swiper-slide:first-child { padding : 0 15px } 
.gallery-top .gallery-thumbs .swiper-button-next, 
.gallery-top .gallery-thumbs .swiper-button-prev { top : 30px } 
.gallery-top .gallery-thumbs .swiper-slide-thumb-active { border : 1px solid #873E0E; color : #873E0E; } 

.gallery-thumbs .swiper-slide:first-child { padding : 0 } 
.gallery-thumbs .swiper-slide-thumb-active { border-bottom-color : #873E0E; color : #873E0E } 
.gallery-thumbs .swiper-button-next:after, 
.gallery-thumbs .swiper-button-prev:after,
.gallery-thumbs .swiper-button-disabled { display : none } 
.gallery-thumbs .swiper-button-next { right : 0; } 
.gallery-thumbs .swiper-button-prev { left : 0 } 

.gallery-top a { display : block; padding : 20px 0 } 
.gallery-top a + a { border-top : 1px solid #DFDFDF } 
.gallery-top a p { text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size : 18px; margin-bottom : 15px; height : 55px; color : #111 } 
.gallery-top a dl { display : flex; align-items: center; font-size : 16px } 
.gallery-top a dl dt { padding : 0 20px 0 0; color : #33363D; font-weight: bold; } 
.gallery-top a dl dd { padding : 0 20px } 

.total_search_link_wrap { display : flex; gap : 40px; justify-content: space-between; flex-wrap : wrap; height: 100%; } 
.total_search_link_wrap a { width : calc(50% - 20px); border : 1px solid #CCD1D5; height : calc(50% - 20px); display: block; border-radius : 15px; overflow : hidden; background: url('img/sub/bg_search_link.png') no-repeat right top; padding : 110px 20px 30px 30px } 
.total_search_link_wrap a h2 { font-size : 27px; margin-top : 10px } 
.total_search_link_wrap a p { font-size : 18px } 

div.page-title { display : flex; font-size: 36px;font-weight: 400;color:#333;line-height: 1;padding-bottom: 22px; justify-content: space-between; gap : 1rem; align-items: center; }
div.page-title::after { display : none }
div.page-title p { flex-shrink: 0;}
div.page-title .page-search { padding : 5px }
div.page-title .page-search button { white-space: nowrap;}


 
@media ( max-width : 1200px ){
 .search_tab_wrap a { line-height : 50px; font-size : 17px } 
 .search_sorting div a { padding : 0 15px } 
 .toggle_content li { font-size : 18px }
 .toggle_content .inner_txt,
 .toggle_content .inner_txt a { font-size : 17px } 


 .total_search_link_wrap,
 .search_all_page { gap : 20px } 
 .search_all_page .inner { grid-template-columns: repeat(2, calc(50% - 10px)); } 

 
 .gallery-top a p { font-size : 16px } 
 .gallery-top a dl { font-size : 15px } 
 .gallery-top a dl { flex-wrap : wrap } 
 .gallery-top a dl dt,
 .gallery-top a dl dd { padding : 0; margin : 2px 0 } 
 .gallery-top a dl dt { width : 80px } 
 .gallery-top a dl dd { width : calc(100% - 80px ) } 

 .gallery-thumbs .swiper-slide { font-size : 16px } 
 .search_all_page .inner .more_btn { height : 60px; line-height :60px } 

 .search_all_page .inner h2 { font-size : 24px } 
 .total_search_link_wrap a { width : calc(50% - 10px); height : calc(50% - 10px); padding : 110px 20px 20px 20px } 
 .total_search_link_wrap a p { font-size : 16px } 
 }

 @media ( max-width : 1100px ){
 .search_sorting { flex-direction: column; align-items: start; } 
 .search_sorting div { margin-bottom : 10px } 
 .guide_info h2 { font-size : 30px }
 .guide_info p { font-size : 17px }
 .guide_nav a { font-size : 18px }
 .service_guide_content sub { font-size : 40px }
 .service_guide_content .guide_title { font-size : 28px }
 .guide_download a { padding : 40px }
 .guide_download strong { font-size : 24px }
 .guide_download dt img { max-width : 110px; height : 110px }
 .guide_notice { font-size : 16px }
 div.page-title{ position : relative; flex-direction: column; align-items: start;}
 div.page-title p { background-color: #fff; padding : 0 20px 0 0; }
 div.page-title::after { display : block; content:'';flex-grow:1;background:#ddd;height:1px;font-size: 0px;line-height: 0px;margin-left: 20px; position : absolute; top : 25px; right : 0; width : 100%; z-index: -1; }
 div.page-title p + .page-search-box { width : 100% }
 }

 @media ( max-width : 1000px ){
 .toggle_content dl { flex-direction: column; } 
 .toggle_content dl dt { width : 100% } 
 .toggle_title { font-size : 20px } 

 .search_all_page { display : block } 
 .search_all_page .inner { margin : 20px 0 } 
 }

@media ( max-width : 900px ){
 .list_area_content a, .list_sort_abc a { width : 33% } 
 .search_tab_wrap a { font-size : 16px } 
.search_title { font-size : 28px } 
.total_search_wrap { gap : 30px } 
.total_search_wrap aside h2 { font-size : 24px } 
.total_search_wrap aside { width : 250px } 

.guide_download { flex-direction: column; } 
.guide_download a { padding : 30px } 
.guide_download strong { font-size : 20px } 
.guide_download dt img { max-width : 100px; height : 100px } 
.modal_title { font-size : 30px } 
.flag_modal_top { padding : 30px; gap : 15px } 
.flag_modal_top h2 { font-size : 22px } 
.flag_modal_top ul { margin-top : 10px; } 
.flag_modal_top li { font-size : 14px } 
.flag_modal_top li + li { margin-top : 5px; font-size : 14px } 
.flag_modal_top li .tit { font-weight: 600;} 
.flag_modal_top li .txt { color: #333;}
.flag_modal_top li:last-child{font-size : 12px} 

.guide_notice_tab a { font-size : 24px }

 }



@media ( max-width : 768px ){
 .list_area_content a, .list_sort_abc a { width : 33% } 
 .new_db_wrap .tab_content.active { flex-direction: column; } 
 .new_db_wrap .list_area_btn { width : 100%; white-space: nowrap; overflow : auto hidden; } 
 .new_db_wrap .list_area_btn li { display : inline-block; width : 130px } 
 .list_area_content a { margin-bottom : 20px } 

.db_content_wrap { grid-template-columns: repeat(1, 1fr); } 
.search_title { font-size : 26px } 
.search_title a { font-size : 16px }
.total_search_wrap aside h2 { font-size : 22px } 
.total_search_wrap aside { width : 210px } 
.total_search_wrap aside a { font-size : 16px; padding : 10px 0 } 

.total_search_wrap.active { display : block } 
.total_search_wrap aside { width : 100%; margin-bottom : 30px } 
#loadingWrap .top img { display : block; max-width : 120px } 
#loadingWrap .loading_inner { height : 200px } 
#loadingWrap .loading_inner h2 { font-size : 20px; margin-bottom : 30px } 
.flag_modal_top { flex-direction: column;}
.flag_modal_top img { margin : 0 auto }
.guide_notice_tab a { font-size : 20px }
.guide_notice_content.active { padding : 70px 0 }
.guide_notice_content .guide_mini_title { font-size : 20px } 
.guide_notice_content .mini_txt { font-size : 16px }

.toggle_title { padding : 20px 50px 20px 30px; font-size : 18px  }
.toggle_content .padding { padding : 0 30px 30px 30px }
.toggle_content li,
.toggle_content .inner_txt, .toggle_content .inner_txt a { font-size : 16px }

.toggle_content .flex { flex-direction: column;}
 
 }

@media ( max-width : 600px ){
 .list_area_content a, .list_sort_abc a { width : 50% } 
 .search_tab_wrap a { font-size : 15px; line-height : 120%; height : auto; padding : 5px } 
 .search_tab_wrap a b { display : block; } 
.search_title { font-size : 24px } 
.guide_notice_tab img { display : none !important } 

.search_all_page .inner h2 { font-size : 20px } 
 }


@media (max-width: 500px){
 .paging ul li label { width:23px; font-size:12px } 
.paging ul li.on label { width:23px; height:23px; } 
.table-top { flex-direction: column; align-items: start;}
  .circle-arrow-prev {background: url(https://lnp.nanet.go.kr/assets/images/icon/circle-chevron-left.svg) no-repeat;background-size: cover;width:24px;height:24px;margin-right:5px;min-width:24px;}
  .circle-arrow-next {background: url(https://lnp.nanet.go.kr/assets/images/icon/circle-chevron-right.svg) no-repeat;background-size: cover;width:24px;height:24px;margin-left:5px;min-width:24px;}
  .circle-arrowdouble-prev {background: url(https://lnp.nanet.go.kr/assets/images/icon/circle-chevrondouble-left.svg) no-repeat;background-size: cover;width:24px;height:24px;margin-right:5px;min-width:24px;}
  .circle-arrowdouble-next {background: url(https://lnp.nanet.go.kr/assets/images/icon/circle-chevrondouble-right.svg) no-repeat;background-size: cover;width:24px;height:24px;margin-left:5px;min-width:24px;}

 }