@charset "utf-8";

.gnb-wrap {height: 80px;background: #4f3fa3;}
.offscreen{ overflow: hidden; position: absolute; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(1px 1px 1px 1px); /* for Internet Explorer */ clip: rect(1px, 1px, 1px, 1px); }
#mainGnb{ height: 80px; background: #4f3fa3; }
#mainGnb:hover{ background: rgba(255, 255, 255, 0.1); background-color: #5d56a1; border-bottom: 1px solid #fff; }
.header-top{ height: 80px; line-height: 80px; }
.gnb-wrap h1{  width: 300px; transition: 0.3s linear; -webkit-transition: 0.3s linear; -moz-transition: 0.3s linear; -ms-transition: 0.3s linear; -o-transition: 0.3s linear; top: 19px; }
.drop-wrap{ padding-top: 80px;}
.container{ width: 100%; top: 0; }

/* site-navi style */
.site-navi{ display: flex; width: 100%; height: 60px; border-bottom: 1px solid #ddd; }
.site-navi::after{ display: block; content: ''; clear: both; }
.home{ display: block; float: left; width: 60px; border-right: 1px solid #ccc; line-height: 60px; text-align: center; font-weight: 700;  color: #4f3fa3; }
/* The container must be positioned relative: */
.custom-select{ display: block; float: left; position: relative; border-right: 1px solid #ccc; flex: 0 0 auto; }
.custom-select select{ display: none; /*hide original SELECT element: */}
.select-selected{ background-color: #fff; }
.custom-select.depth1{ padding: 0 32px 0 0; min-width: 200px; }
.custom-select.depth1 > .select-selected{ font-weight: 700;  color: #4f3fa3; }
.custom-select.depth2{ padding: 0 32px 0 0; min-width: 200px; }
.custom-select.depth2 > .select-selected{ font-weight: 700;  color: #4f3fa3; }

.custom-select.depth3{ padding: 0 80px 0 0; min-width: 200px; }
.custom-select.depth3 > .select-selected { font-weight: 700; color: #4f3fa3; }

/* Style the arrow inside the select element: */
.select-selected:after{ position: absolute; width: 0; height: 0; content: ""; border: 6px solid transparent; border-color: #222 transparent transparent transparent; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; top: 27px; right: 10px; }

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after{ border-color: transparent transparent #222 transparent; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; top: 21px; }

/* style the items (options), including the selected item: */
.select-items a, .select-selected { display:block; padding: 17px 16px; border: 1px solid transparent; border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent; color: #333 !important; cursor: pointer; }

/* Style items (options): */
.select-items{ position: absolute; z-index: 99; background-color: #fff; top: 100%; left: 0; right: 0; }

/* Hide the items when the select box is closed: */
.select-hide{ display: none; }

.same-as-selected, .select-items a:hover{ font-weight: 800; background-color: rgb(249, 248, 255); color: #4f3fa3; }

/* page title wrap style*/
.page-title-wrap{ width: 100%; padding: 50px 0 20px; background: #f9f9f9; text-align: center;}
.page-title-wrap > .inner{ margin: 0 auto; width: 1024px;  }
.page-title-wrap > .inner > img{ margin-bottom: 10px; }
.page-title-wrap > .inner > h4{ margin-bottom: 10px; font-size: 2em; font-weight: 900; line-height: 75px; color: #222; }
.page-title-wrap > .inner > .page-subtext{ display: block;  font-size: 17px; line-height: 34px; color: #8c8c8c; }

/* page title wrap : board style */
.page-title-wrap.board-title > .inner > h4{ font-size: 20px; color: #4f3fa3; }
.page-title-wra.board-title > .inner > .page-subtext{ display: none; }
.page-title-wrap.board-title .board-view-title{ color: #666; }
.page-title-wrap.board-title .board-view-title h5{ font-size: 40px; font-family: 'Noto Sans KR', sans-serif !important; color: #333; }

.type-view1 .board-view-title .view-title{ display: block; margin: -20px 0 10px; }
.type-view2 .board-view-title .view-title{ display: block; margin: 10px 0; }
.board-view-title .view-category{ display: inline-block; padding: 0.3em 1em; border-radius: 3px; font-weight: bold; background: #797979; color: #fff; }
.board-view-title .view-date{ margin-right: 2%; color: #666; letter-spacing: 1.5px; }
.board-view-title .view-view{ margin-left: 2%; color: #666; letter-spacing: 1.5px; }
.type-view3 p.company{ margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #ccc; font-weight: bold; font-size: 1.5em; text-align: center; }
.type-view3 .view-table dl{ width: 50%; margin: 0 auto; line-height: 2.5em; }
.type-view3 .view-table dl::after{ display: block; content: ''; clear: both; }
.type-view3 .view-table dl dt{ float: left; width: 30%; font-weight: bold; color: #666; text-align: left; }
.type-view3 .view-table dl dd{ float: left; width: 70%; color: #222; text-align: center; }
.type-view3 .view-table dl.recruitment-contents{ width: 100%; }
.type-view3 .view-table dl.recruitment-contents dt{ width: 100%; }
.type-view3 .view-table dl.recruitment-contents dt p{ display: none; }
.type-view3 .view-table dl.recruitment-contents dt > div{ padding: 3%; font-weight: normal; line-height: 2em; background: #fbfbfb; color: #222; }
.type-view3 .view-table dl.recruitment-contents dt > div div{ width: 100% !important; }
.type-view3 .company span{ display: inline-block; margin-left: 10px; padding: 0.3em 0.5em; border-radius: 3px; -webkit-border-radius: 3px; font-size: 0.7em; color: #fff; }
.type-view3 .company span.ing{ background: #fd9802; }
.type-view3 .company span.fin{ background: #999; }
.view-table.write input{ width: 100%; height: 40px; padding-left: 15px; border: 1px solid #ccc; font-size: 0.9em; line-height: 40px; }
.view-table.write select{ width: 100%; height: 40px; padding-left: 15px; border: 1px solid #ccc; font-size: 0.9em; line-height: 40px; background: #fff; }
.view-table.write dl{ width: 100%; }
.view-table.write dl.recruitment-contents{ margin-bottom: 20px; }
.view-table.write dl dt{ width: 12%; }
.view-table.write dl dd{ width: 85.5%; }
.view-table.write .half-write{ float: left; width: 50%; }
.view-table.write .half-write dt{ width: 24%; font-size: 0.9em; }
.view-table.write .half-write dd{ width: 71%; }
.view-table.write .recruitment-contents textarea{ width: 97.5%; height: 500px; border: 1px solid #ccc; font-size: 0.8em; font-family: 'NanumSquare','Noto Sans KR','돋움',dotum,sans-serif !important; }
.view-table.write .recruitment-contents span.cke_browser_ie{ width:97.5% !important; }
.type-view3 .view-table.write dl.recruitment-contents dt div{ padding: 0; }
.type-view3 .view-table.write .add{ margin-bottom: 2px; }
.type-view3 .view-table.write .add::after{ display: block; content: ''; clear: both; }
.type-view3 .view-table.write .add > input{ float: left; width: 41.5%; }
.type-view3 .view-table.write .add > a{ float: left; margin-left: 10px; padding: 0 1em; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; line-height: 39px; background: #333; color: #fff; text-align: center; }
.type-view3 .view-table.write dl:last-child dd:last-child input{ margin-left: 14%; margin-top: 3px; }
.view-table.edit{ margin: 0 24%; margin-bottom: 50px; padding: 37px; background: #f1f1f1; }
.view-table.edit dl{ width: 100%; margin: 0 auto; }
.view-table.edit dl input{ width: 80%; height: 40px; padding-left: 15px; border: 1px solid #ccc; font-size: 0.9em; line-height: 40px; }
.edit-tt{ margin-bottom: 30px; font-weight: bold; font-size: 1em; color: #666; }

/* content style */
.content{ width: 1024px; margin: 0 auto; padding: 85px 0; background: #fff; text-align: center; }
.content::after{ display: block; content: ''; clear: both; }
.content .isc{ margin-bottom: 100px; }
.content .isc::after{ display: block; content: ''; clear: both; }
.content .isc:last-child{ margin-bottom: 100px; }
.content .isc h5.sc-title{ display: inline-block; margin-bottom: 25px; background: url('../images/images/sub_text_bg.png') 0 24px repeat-x; font-weight: 900; font-size: 24px; color: #4f3fa3; }
.content .isc p.sc-text{ padding: 0 20px; font-weight: 700; font-size: 16px; line-height: 33px; color: #494949; }
#myBtn:hover{ background-color: #fd9802;/* Add a dark-grey background on hover */}
.content .isc h6.btntitle{ display: block; width: 200px; margin: 0 auto; font-weight: bold; font-size: 19px; color: #616161; }
 .content .isc .btnbox{ display: flex; width: 100%; margin-top: 20px; justify-content: center; flex-wrap: wrap; }
.content .isc .btnbox::after{ display: block; content: ''; clear: both; }
/*.content .isc .btnbox h6{ display: block; }
.content .isc .btnbox.col3 > a{ display: inline-block; margin: 0 1% 2%; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; text-align: center; flex: 0 0 40%; }
.content .isc .btnbox.col2 > a{ margin: 0 2% 2%; } */
.content .isc .btnbox a.btn-down-grey{ position: relative; width: 235px; height: 60px; margin: 10px; font-size: 14px; background: #666; color: #fff; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.content .isc .btnbox a.btn-down-grey:hover{ background: #222; }
.content .isc .btnbox a.btn-down-grey span{ position: absolute; width: 80%; line-height: 60px; transition: 0.2s linear; left: 3%; }
.content .isc .btnbox a.btn-down-grey span:hover{ text-decoration: underline; }
.content .isc .btnbox a.btn-down-grey span.line2{ margin-top: 8px; line-height: 22px; }
.content .isc .btnbox a.btn-down-grey > i{ display: inline-block; position: absolute; width: 20px; height: 41px; margin-right: 20px; border-bottom: 1px solid #ccc; font-size: 14px; line-height: 60px; right: 0; }
.content .isc .btnbox a.btn-style1 { position: relative; width: 260px; height: 60px; margin: 0 10px 30px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-size: 18px; line-height: 60px; background: #4f3fa3; color: #fff; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -ms-transition: all 0.5s linear; -o-transition: all 0.5s linear; }
.content .isc .btnbox a.btn-style1:hover{ background: #d43d56; text-decoration: underline; }
.content .isc .btnbox a.btn-style1 span.line2{ margin-top: 8px; line-height: 22px; }
.content .isc .btnbox a.btn-style2{ position: relative; margin: 1%; padding: 12px 1%; border: 3px solid #afafaf; border-radius: 3px; font-size: 16px; line-height: 30px; background: #777777; color: #fff; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; flex: 0 0 350px; }
.content .isc .btnbox a.btn-style2:hover{ background: #3f3f3f; color: #fdf902; }
.content .isc a.btn-indiv{ display: inline-block; padding: 10px 20px; border-radius: 3px; font-weight: bold; background: #333; color: #fff; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.content .isc .btnbox a.btn-style3{ position: relative; width: 260px; height: 60px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-size: 18px; line-height: 60px; background: #6e9c1f; color: #fff; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -ms-transition: all 0.5s linear; -o-transition: all 0.5s linear; }
.content .isc a.btn-indiv:hover{ background: #fd9802; }
.content .isc a.btn-mini{ display: inline-block; padding: 5px 10px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-weight: bold; font-size: 0.8em; background: #666; color: #fff; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.content .isc a.btn-mini:hover{ background: #fd9802; }
.board-btn-area{ display: flex; width: 100%; justify-content: center; text-align: center;}
.board-btn-area::after{ display: block; content: ''; clear: both; }
.board-btn-area a.boardbtn{ display: inline-block; margin: 40px 2% 0; padding: 0; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-size: 1.1em; line-height: 64px; color: #fff; flex: 0 0 250px; transition: 0.4s linear; -webkit-transition: 0.4s linear; -moz-transition: 0.4s linear; -ms-transition: 0.4s linear; -o-transition: 0.4s linear; }
.board-btn-area a.boardbtn.list{ background: #4f3fa3; }
.board-btn-area a.boardbtn.list:hover{ font-weight: bold; background: #6a59bd; }
.board-btn-area a.boardbtn.edit, .del{ background: #808080; }
.board-btn-area a.boardbtn.edit, .board-btn-area a.boardbtn.write, .del:hover{ background: #636363; }
.board-btn-area a.boardbtn.write:hover{ background: #444; }
.board-btn-area a.boardbtn.save{ background: #d43d56; }
.board-btn-area a.boardbtn.save:hover{ background: #bb4b5e; }

/* contents box style */
.content .isc .referencebox{ line-height: 30px; color: #666; }
.linebox{ width: 100%; padding: 30px 20px; border: 2px solid #D9E6FF; text-align: left; }
.linebox::after{ display: block; content: ''; clear: both; }
.linebox h6.tt{ font-weight: bold; font-size: 19px; color: #7D8DD4; }
.linebox p{ line-height: 33px; text-align: left; }
.linebox p.innertext{ padding-left: 20px; font-size: 15px; line-height: 28px; color: #555; }
p.text-pdl{ padding-left: 15px; }
.nolinebox{ width: 100%; }
.nolinebox::after{ display: block; content: ''; clear: both; }
.nolinebox h6.tt{ font-weight: bold; font-size: 19px; color: #7780d6; }
.nolinebox p{ font-size: 17px; line-height: 33px; color: #8a8a8a; }
.nolinebox p.innertext{ font-size: 15px; line-height: 28px; color: #222; }
.nolinebox p span{ margin-right: 4px; font-weight: bold; }
.inner-grey-box{ padding: 4%; background: #f9f9f9; text-align: left; color: #696969; }
.inner-grey-box::after{ display: block; content: ''; clear: both; }
.inner-grey-box h6{ font-weight: bold; font-size: 16px; color: #191919; }
.inner-grey-box p{ margin-top: 20px; font-weight: bold; font-size: 15px; }
.inner-grey-box p:first-child{ margin-top: 0; }
.inner-grey-box span{ display: block; margin-top: 9px; padding-left: 2%; font-size: 15px; line-height: 25px; }

/* tab style */
.pc-2dep-tab{ display: flex; position: absolute; width: 1310px; right: 50%; transform: translate(50%,15px); justify-content: center; }
/*.pc-2dep-tab{ display: flex; position: relative; width: 1310px; margin: 20px auto 0; justify-content: center; top: 27px; }*/
.pc-2dep-tab > button{ display: inline-block; padding: 15px 9px; border-bottom: 3px solid #fff; font-weight: bold; font-size: 15px; font-family: 'NanumSquare','Noto Sans KR','돋움',dotum,sans-serif !important; background: #eaeef1; flex: 1; color: #000; }
.pc-2dep-tab > button.active{ font-weight: bold; background: #4a78cc; color: #ffdb21; }
.pc-3dep-tab{ display: flex; width: 1000px; margin: 0 auto 75px; justify-content: center; }
.pc-3dep-tab > a{ display: inline-block; margin: 0 3px; padding: 10px 0; border:3px solid #919191; font-weight: bold; font-size: 15px; color: #919191; flex: 1; }
.pc-3dep-tab > a.active{ border:3px solid #4a78cc; font-weight: bold; color: #4a78cc; }
.aw-ylw-tab{ display: flex; width: 80%; margin: 20px auto 40px; justify-content: center; }
.aw-ylw-tab > button{ display: inline-block; padding-bottom: 10px; border-bottom: 3px solid #fff; font-weight: 700; font-size: 17px; font-family: 'NanumSquare','Noto Sans KR','돋움',dotum,sans-serif !important; color: #444; flex: 0 0 20%; }
.aw-ylw-tab > button.active{ border-bottom: 3px solid #e07415; color: #e07415; }
.aw-ylw-tab-box h6{ font-weight: bold; font-size: 17px; color: #D9E6FF; }
.aw-ylw-tab.board{ display: flex; width: 100%; margin: 22px auto 0; flex-wrap: wrap; justify-content: center; }
.aw-ylw-tab.board > button{ display: inline; margin: 1em; padding-top: 0; padding-bottom: 0.8em; border-bottom: 3px solid #f9f9f9; font-weight: 700; font-size: 19px; font-family: 'NanumSquare','Noto Sans KR','돋움',dotum,sans-serif !important; Color: #444; flex: 0 0 4.7em; letter-spacing: -1px; }
.aw-ylw-tab.board > button.active{ border-bottom: 3px solid #e07415; color: #e07415; }
.tab.step{ display: flex; overflow: hidden; border: 2px solid #D9E6FF; background-color: #edf0ff; }

/* Style the buttons inside the tab */
.tab.step > button{ float: left; padding: 14px 16px; border: none; border-right: 2px solid #D9E6FF; font-weight: bold; font-size: 16px; font-family: 'NanumSquare','Noto Sans KR','돋움',dotum,sans-serif !important; flex: 1;/* outline: none; */background-color: inherit; cursor: pointer; transition: 0.3s; color: #6671d7; }
.tab.step button:last-child{ border-right: none; }
span.step-arrow{ display: block; width: 35px; margin: 0 auto; border-radius: 3px; font-size: 11px; line-height: 20px; background: #999; color: #fff; text-align: center; }

/* Change background color of buttons on hover */
.tab.step button:hover{ background-color: #d9e0ff; }

/* Create an active/current tablink class */
.tab.step button.active{ background-color: #7780d6; color: #fff; }

/* Style the tab content */
.tabcontent.stepbox{ display: none; padding: 30px; border: 2px solid #D9E6FF; border-top: none; text-align: left; }
.tabcontent.stepbox > h6{ margin: 0 0 10px; font-weight: bold; text-align: left; color: #7D8DD4; }
.tabcontent.stepbox > p{ line-height: 28px; color: #333; text-align: left; }
p.bgtext{ display: inline-block; margin-bottom: 6px; padding: 0 10px; font-weight: 600; font-size: 14px; line-height: 32px; background: #eeeeee; color: #6d6d6d; }
span.bgtext{ display: inline-block; margin-bottom: 6px; padding: 0 15px; font-weight: 600; font-size: 13px!important; line-height: 32px; background: #eeeeee; color: #f11651; }
p.bgtext span{ display: block; margin-bottom: 4px; font-weight: normal; line-height: 20px; }
p.bgtext > span.nextstep{ display: inline-block; margin: 0 3px; }
.vertical-step-box{ display: flex; flex-wrap: wrap; justify-content: space-around; }
.vertical-step-box > div{ padding: 10px 0; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; flex: 0 0 23%; background: #e3e8ff; }
.vertical-step-box > div > p{ font-weight: bold; }
.arrow-down{ line-height: 60px; color: #888; }

/* toggle */
.faq > ul{ width: 100%; }
.faq ul > li.questionbox{ width: 100%; margin-bottom: 10px; border: 2px solid #4f3fa3; }
.faq ul > li.questionbox > a.que{ display: block; width: 100%; line-height: 60px; }
.faq ul > li.questionbox > a.que::after{ display: block; content: ''; clear: both; }
.faq ul > li.questionbox > a.que:hover > p{ text-decoration: underline; }
.faq ul > li.questionbox > a.que.active > p{ background: #4f3fa3; color: #fff; }
.faq ul > li.questionbox > a.que > span{ display: block; float: left; width: 55px; height: 100%; font-size: 2em; line-height: 60px; background: #4f3fa3; color: #fff; }
.faq ul > li.questionbox > a.que > p{ float: right; width: calc(100% - 55px); padding-left: 15px; font-size: 1.1em; font-weight: 400; text-align: left; }
.faq ul > li.questionbox ul.ans{ display: none; }
.faq ul > li.questionbox ul.ans li.answerbox{ width: 100%; padding: 2%; }
.faq ul > li.questionbox ul.ans li.answerbox::after{ display: block; content: ''; clear: both; }
.faq ul > li.questionbox ul.ans li.answerbox span{ float: left; width: 55px; font-size: 2em; font-weight: bold; color: #4f3fa3; }
.faq ul > li.questionbox ul.ans li.answerbox > div{ float: right; width: calc(100% - 55px); margin-top: 4px; padding-left: 15px; font-size: 1.1em; text-align: left; }

/* sub content table style */
.table-con{ width: 100%; line-height: 30px; table-layout: fixed; }
.table-con.law tbody td{ font-size: 14px; line-height: 21px; }
.table-con caption{ overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; border: 0; clip: rect(1px, 1px, 1px, 1px); clip: rect(1px 1px 1px 1px); /* for Internet Explorer */ }
.table-con thead{ background: #4a78cc; color: #fff; }
.table-con thead th{ padding: .5% 2%; border-right: 1px solid #B6CBF3; vertical-align: middle; text-align: center; }
.table-con thead th:last-child{ border-right: 1px solid #4a78cc; }
.table-con tbody th{ background: #698DCE; border-right: 1px solid #B6CBF3; border-bottom: 1px solid #698DCE; color: #fff; vertical-align: middle; text-align: center; }
.table-con tbody tr:last-child th{ border-bottom: 1px solid #D9E6FF; }
.table-con tbody td{ padding: .5% 2%; border-right: 1px solid #B6CBF3; border-top: 1px solid #698DCE; border-bottom: 1px solid #B6CBF3; vertical-align: middle; }
.table-con thead .bdb{ border-bottom: 1px solid #D9E6FF; }
.table-con tbody .bdl{ border-left: 1px solid #D9E6FF; }
.table-con tbody th.bdl{ border-left: 1px solid #aebaec; }
.table-con span{ font-size: 15px; }
.table-con span.innertext{ display: inline-block; padding-left: 2%; }
.innertable{ display: flex; width: 100%; flex-wrap: wrap; justify-content: center; }
.innertable ul{ flex: 1; }
.innertable ul li{ border: 1px solid #ccc; text-align: center; }
.innertable ul li.th{ font-weight: bold; background: #f1f1f1; }
.innertable .colspan{ height: 64px; }
.innertable .tbody .colspan{ line-height: 64px; }

/* 2025추가 예술활동증명 리뉴얼 */
/* 예술활동증명-공통 */
h5 { margin: 25px 0; font-weight: 900; font-size: 24px; color: #4a78cc !important; }
#bodyT { text-align: center; font-family: 'NanumGothicWEB','굴림',Gulim,'돋움',Dotum,'맑은 고딕','Malgun Gothic',Arial,Verdana,Geneva,sans-serif; font-size:15px; }
p.sc-text { padding: 0 20px; font-weight: 700; line-height: 33px; color: #494949; }
.blue { font-weight: 600; color: #4a78cc; }

.linebox { width: calc(100% - 44px); border: 2px solid #4a78cc; }
.sub-con { margin: 30px auto; }
span.highlight { line-height: 24px; font-weight:600; border-bottom: 1px solid; }
span.label { display: inline-block; min-width: 110px; height: 22px; padding: 5px 0; text-align: center; font-weight: 600; border-radius: 100px; background: #D9E6FF; }
.right ul li { display: flex; gap: 10px; margin-bottom: 10px; }
.right ul li span + span { margin-top: 5px; }
.tooltip { position: relative; display: inline-block; cursor: pointer; }
.tooltip .tooltip-text { visibility: hidden; position: absolute; top: 107%; left: 0; z-index: 1; opacity: 0;  width: auto; min-width: 350px; max-width: 380px; margin-bottom: 5px; padding: 10px; font-size: 14px; line-height: normal; font-weight:500; text-align:left; word-wrap: break-word; white-space: normal; background-color: #222; background-color: rgba(85,85,85, 1);  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); -moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); color: #fff; transition: opacity 0.3s; }
.tooltip:hover .tooltip-text { visibility: visible; opacity: 1; }
[data-tooltip-text]:hover { position: relative; }
[data-tooltip-text]:hover:after { z-index: 9999; position: absolute; top: 107%; left: 0; width: auto; min-width: 350px; max-width: 380px; margin-bottom: 5px; padding: 10px; font-size: 14px; font-weight:500; text-align:left; line-height: normal;  word-wrap: break-word; white-space: normal; background-color: #222; background-color: rgba(85,85,85, 1); color: #fff; content: attr(data-tooltip-text); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); -moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4); transition: opacity 0.3s; }
.tit-p { display: inline-block; font-weight: 600; color: #4a78cc; }
.down-file { display: block; position: relative; max-width: 270px; margin: 30px auto; padding: 10px 0 10px 20px; border: 2px solid #4a78cc; border-radius: 10px; text-align: left; font-weight: bold; background: #fff; transition: 0.3s; color: #333 !important; }
.down-file:hover { background: #4a78cc; color:#fff; }
.down-file:hover span{ color:#fff; }
.down-file::after { display: inline-block; position: absolute; top: 12px; right: 20px; width: 20px; height: 20px; background: url(../../../../../resources/web/hkor/images/common/file-down.png) no-repeat; background-size: cover; content: ''; }
.down-file:hover::after { width: 20px; height: 20px; background-image: url(../../../../../resources/web/hkor/images/common/file-down-hover.png); }
/* quickMenu */
#quickMenuWrap { position: fixed; top: 50%; right: 30px; transform: translateY(-50%); z-index: 20; }
#quickMenuWrap .quick-menu { display: flex; flex-direction: column; position: relative; padding: 20px 15px; margin-bottom:10px; background: #f6f6f6; border: 1px solid #777; border-radius: 3px; gap: 25px; }
#quickMenuWrap .quick-menu li { padding-bottom:10px; border-bottom: 1px solid #777; }
#quickMenuWrap .quick-menu li:last-child { padding-bottom: 0; border-bottom: 0; }
#quickMenuWrap .quick-menu li a { display: flex; align-items: center; flex-direction: column; gap: 10px; font-size: 13px; text-align: center; line-height: normal; transition: 0.3s; }
#quickMenuWrap .quick-menu li a span { font-weight: 500; color: #222; }
#quickMenuWrap .quick-menu li a img { width: 30px; }

#quickMenuWrap .quick-menu li.on a { color: #0170b5; }

#quickMenuWrap .quick-top { display: flex; justify-content: center; }
#quickMenuWrap .quick-top a { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; height: 46px; border-radius: 3px; background: #111; color: #fff; }


/* 예술활동증명-제도안내 */
/* 관련법령 */
.btn-box { display: flex; gap: 5px; justify-content: space-between; width: 100%; }
.btn-box a { display: block; position: relative; width: 24%; padding: 10px; border: 2px solid #4a78cc; border-radius: 10px; font-size: 14px; text-align: left; font-weight: bold; background: #fff; transition: 0.3s; color: #333; }
.btn-box a:hover { background: #4a78cc; color:#fff !important; }
.btn-box a:hover span { color:#fff !important; }
.btn-box a::after { display: inline-block; position: absolute; top: 12px; right: 5px; width: 20px; height: 20px; background: url(../../../../../resources/web/hkor/images/common/file-down.png) no-repeat; background-size: cover; content: ''; }
.btn-box a:hover::after { width: 20px; height: 20px; background-image: url(../../../../../resources/web/hkor/images/common/file-down-hover.png); }

/* 예술활동증명-증명방법안내 */
/* 증명방법 */
.card-container { display: flex; gap: 10px; justify-content: space-between; align-items: center; }
.card { width: 33%; padding: 20px 10px; border: 2px solid #4a78cc; border-radius: 10px; text-align: center; background: #f3f6fd; }
.card-container .card-text { display: flex; flex-wrap: wrap; justify-content: center; width: 100%; margin: 0 auto; color: #4a78cc; }
.card-container .card-text span { width: 100%; }
.card-container .card-text span:first-child { display: block; width: 100%; margin-bottom: 10px; font-family: 'Gmarket Sans'; font-size: 24px; }

/* 예술활동증명 신청 종류*/ 
.target-con { display: flex; gap: 30px; align-items: baseline; justify-content: space-between; width: 100%; }
.target-con .target-con-wrap { display: flex; flex-wrap: wrap; width: 50%; }
.target-con .target-con-wrap img { width: 100%; }
.target-box:last-child .target-con .target-con-wrap { width: 100%; }
.target-con .target-con-wrap div.bg-p { width: 100%; }
.target-con-wrap .bg-p { display: flex; justify-content: center; align-items: center; gap: 20px; border-radius: 10px; background: #EEF2FA; }
.target-con-wrap .bg-p span { height: 35px; line-height: 40px; font-family: 'Gmarket Sans' !important; font-weight: 400; color: #4a78cc; }

.target-ex { padding-top: 20px; }
.target-ex ul { display: flex; flex-wrap: wrap; }
.target-ex ul li { width: 100%; text-align: left; }

.target-tab-box-wrap { display: none; }
.target-tab-box-wrap.active { display: block; }
.target-tabnav { display: flex; justify-content: center; width: 100%; gap: 5px; margin-top: 20px; }
.target-tabnav li { width: 100%; }
.tab.etc .target-tabnav li, .tab.inta-etc .target-tabnav li { width: 50%; }
.normal .target-tabnav li a { max-width: 94px; }
.inta-etc .target-tabnav li a, .etc .target-tabnav li a { max-width: 150px; }
.etc .target-tabnav{ max-width: 331px; }
.target-tabnav li a { display: inline-block; width: 100%; padding: 5px; border: 2px solid #4a78cc; border-radius: 10px; line-height: 20px; text-align: center; font-size: 14px; font-weight: 600; color: #4a78cc; background: #EEF2FA; }
.target-tabnav li a.active { color: #fff; background: #4a78cc; }


/* 예술활동증명 실적산정기간*/ 
.target-wrap { padding: 20px 0; }
.target-wrap > .con-list .right { display:flex; width: 100%; }
.target-wrap .con-list .right dl { display: grid; justify-content: center; row-gap: 10px; width: 50%; border-right: 1px solid #ddd; }
.target-wrap .con-list .right dl:last-child { border-right: none; }
.target-wrap .con-list .right dl dt { width: 125px; padding: 5px 0; text-align: center; font-weight: 600; border-radius: 100px; background: #4a78cc; color: #fff; }

.target-wrap > p { margin-bottom: 10px; text-align: left; }


/* 예술활동증명-분야별기준안내 */
/* 아코디언 공통 */
.accordion { border-top: 1px solid #ddd; }
.accordion-con { display: block; width: calc(100% - 30px); padding: 15px; text-align: left; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.accordion-con li { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }

.accordion-title { display: flex; position: relative; width: calc(100% - 40px); padding: 14px 20px; cursor: pointer; gap: 8px; font-size: 18px; font-weight: bold; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.accordion-title:hover, .accordion-title.on  { color: #4a78cc; background: #f6f6f6; }
.accordion-title:after { display: block; position: absolute; top: 45%; right: 20px; width: 10px; height: 10px; border: solid #222; border-width: 2px 2px 0 0; transform: translateY(-45%) rotate(135deg); transition: 0.2s; content: ''; }
.accordion-title.on::after { transform: rotate(-45deg); }

.accordion-con-txt { border-bottom: 1px solid #ddd; }
.accordion-con-txt:last-child { border-bottom: none; }
.accordion-con-txt span + span { margin-top: 5px; }
.accordion-con-txt > span { position: relative; display: inline-block; margin: 10px; font-size: 17px; font-weight: 600; text-align: left; color: #4a78cc; }
.accordion-con-txt > span::after { display: block; position: absolute; right: -8px; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: #8B99D8; content: '';}
  
/* 15개 예술분야 */
.keyword-wrap { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; padding: 20px; }
.keyword-wrap:last-child { padding-bottom: 30px; }
.keyword-wrap ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin: 0; padding: 0; }
.keyword-wrap ul li { display: flex; align-items: center; text-align: center; width: 80px; height: 100px; border: 2px solid #4a78cc; border-radius: 100px; }
.keyword-wrap ul li a { width: 100%; }
.keyword-wrap figure { margin: 0; text-align: center; }
.keyword-wrap img { display: block; width: 40px; height: 40px; margin: 0 auto; }
.keyword-wrap span { display: inline-block; width: 100%; font-size: 12px; font-weight: bold; color: #4a78cc; }
.keyword-wrap figure { display: inline-block; margin: 0 auto; text-align: center; background-size: contain; }
.keyword-wrap ul li:hover { background:#4a78cc; }
.keyword-wrap ul li:hover a span { color: #fff; }


.keyword-wrap figure.art-field01 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field01.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field01 { background: url('../../../../../resources/web/hkor/images/common/art-field01-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field02 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field02.png') no-repeat center center;  background-size: contain; }
.keyword-wrap li:hover figure.art-field02 { background: url('../../../../../resources/web/hkor/images/common/art-field02-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field03 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field03.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field03 { background: url('../../../../../resources/web/hkor/images/common/art-field03-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field04 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field04.png') no-repeat center center;  background-size: contain; }
.keyword-wrap li:hover figure.art-field04 { background: url('../../../../../resources/web/hkor/images/common/art-field04-hover.png') no-repeat center center; background-size: contain;}
.keyword-wrap figure.art-field05 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field05.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field05 { background: url('../../../../../resources/web/hkor/images/common/art-field05-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field06 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field06.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field06 { background: url('../../../../../resources/web/hkor/images/common/art-field06-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field07 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field07.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field07 { background: url('../../../../../resources/web/hkor/images/common/art-field07-hover.png') no-repeat center center; background-size: contain;}
.keyword-wrap figure.art-field08 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field08.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field08 { background: url('../../../../../resources/web/hkor/images/common/art-field08-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field09 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field09.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field09 { background: url('../../../../../resources/web/hkor/images/common/art-field09-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field10 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field10.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field10 { background: url('../../../../../resources/web/hkor/images/common/art-field10-hover.png') no-repeat center center;  background-size: contain;}
.keyword-wrap figure.art-field11 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field11.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field11 { background: url('../../../../../resources/web/hkor/images/common/art-field11-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field12 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field12.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field12 { background: url('../../../../../resources/web/hkor/images/common/art-field12-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field13 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field13.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field13 { background: url('../../../../../resources/web/hkor/images/common/art-field13-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field14 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field14.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field14 { background: url('../../../../../resources/web/hkor/images/common/art-field14-hover.png') no-repeat center center; background-size: contain; }
.keyword-wrap figure.art-field15 { width: 40px; height: 40px; background: url('../../../../../resources/web/hkor/images/common/art-field15.png') no-repeat center center; background-size: contain; }
.keyword-wrap li:hover figure.art-field15 { background: url('../../../../../resources/web/hkor/images/common/art-field15-hover.png') no-repeat center center; background-size: contain; }

/*분야별 제출 자료 안내*/ 
.con-list > li { display: flex; padding: 30px 0; align-items: center; border-bottom: 1px solid #ddd; }
.con-list > li:last-child { border-bottom: none; }
.con-list li.top-type { align-items: flex-start; }
.con-list li > strong { display: flex; width: 130px; text-align: left; font-size: 16px; line-height: 24px; font-weight: bold; }
.con-list li > .right { width: 100%; }
.con-list li > .right p, .con-list li > .right .txt-type { font-size: 16px; line-height: 24px; text-align: left; }
.con-list li > .right p.bgtext { font-size: 14px!important; }
.con-list .table-con tbody td{ padding: .5% 1%; }
.proof-method-wrap .right ul li:first-child { margin-bottom: 10px; }

.min-criteria-con { display: none; }
.min-criteria-con-txt .right ul li { display: list-item; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid #ddd; }
.min-criteria-con-txt .right ul li:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.min-criteria-con-txt .right .site { display: block; }
.min-criteria-con-txt .right .site .label { margin-right: 10px; }
.min-criteria-con-txt .right .site > p { margin-bottom: 10px; }
.min-criteria-con-txt span.tit-p { position: relative; margin-bottom: 10px; }
.min-criteria-con-txt span.tit-p::after { display: block; position: absolute; right: -8px; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: #D9E6FF; content: ''; }
.min-criteria-con-txt .con-list li.top-type:last-child { border-bottom: none; }
.min-criteria-con-txt .table-con, .tab-cont .table-con { border: 1px solid #698DCE; }
.min-criteria-con-txt .table-con tbody td, .tab-cont tbody td {border-left: 1px solid #B6CBF3;}
.min-criteria-con-txt .table-con tbody th:last-child, .tab-cont .table-con tbody th:last-child { border-right: 1px solid #698DCE; }
.min-criteria-con-txt .table-con .highlight { border-bottom: none; }

.tab-cont .right span.tit-p { position: relative; margin-bottom: 10px; }
.tab-cont .right span.tit-p::after { display: block; position: absolute; right: -8px; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: #9ebddd; content: ''; }

.tabs { width: 100%; max-width:1024px; } 
.tab_nav { display: flex; justify-content: center; align-items: center; gap: 20px; }
.tab_nav li { width: 130px; height: 130px; border-radius: 100%; text-align: center; background: #d9d9d9; color: #555; cursor: pointer; }

.sub_tab_nav { display: flex; gap: 15px; justify-content: center; align-items: center; position: relative; } 
.sub_tab_nav li { display: flex; align-items: center; position: relative; padding: 5px 10px; border: 1px solid #4a78cc; border-radius:10px; } 
.sub_tab_nav { margin: 20px 0; } 

.tab_nav li a { display: inline-block; width: 100%; line-height: 130px; font-size: 24px; font-weight: 500; font-family: 'Gmarket Sans'; }
.sub_tab_nav li a { z-index: 0; display: block; position: relative; padding: 5px 10px; font-size: 16px; font-weight: 600; color: #222; } 

.tab_nav li.active { border: 2px solid #4a78cc !important; background: #f3f6fd !important; }
.tab_nav li.active a { font-weight: 600; color: #4a78cc; }

.sub_tab_nav li.active { font-weight: 600; border: 2px solid #4a78cc!important; background: #4a78cc!important; } 
.sub_tab_nav li.active a { color: #fff; }

.double-tab, .sub_tab { display: none; } 
.tab-cont { padding: 20px; text-align: left; border: 1px solid #4a78cc; border-radius: 10px; }
.tab-cont .tit-p { margin-bottom: 20px; }

.double-tab.active, .sub_tab.active { display: block; } 


/* 예술활동증명-신청절차안내 */
.sub-con-box-wrap p { margin-bottom:10px; }
.proof-accor-con { position: relative; border-radius: 10px; }
.proof-accor-img-wrap > li  { padding: 0; }
.proof-accor-img-wrap > li:nth-child(2n) { margin:20px auto; }
.proof-accor-img-wrap .proof-accor-box li { display: flex; gap: 20px; align-items: center; padding: 0 30px; margin-bottom: 10px; text-align:left; }
.proof-accor-img-wrap .proof-accor-box li:last-child { margin-bottom:0; }
.proof-accor-img-wrap li span { text-align:center; line-height: 30px; }
.proof-accor-img-wrap li img { position: relative; width:100%; margin:0 auto; }
.proof-accor-img-wrap { padding: 20px; border: 2px solid #999; border-radius: 10px; }
.img-wrap { display: flex; justify-content: center; width: 100%; }
.img-wrap .tooltip .tooltip-text { top: 40%; }
.proof-accor-con .img-wrap-mo { display: none; }


/* 예술활동증명-쉽게이해하기 */
/* 안내책자 */
.ebook { display: block; width: 180px; height: 180px; margin: 0 auto; border-radius: 100px; background: url(../../../../../resources/web/hkor/images/common/ebook.png) center no-repeat; }
.ebook:hover { box-shadow:0px 0px 3px 1px rgba(50, 50, 50, 0.4); transition: opacity 0.3s; }
/* 설명영상 */
.guide-wrap { display: flex; justify-content: center; gap: 20px; width: 100%; margin-top: 30px; }
.guide-wrap a { width: 180px; height: 180px; border-radius: 100px; }
.guide-wrap a:hover { box-shadow:0px 0px 3px 1px rgba(50, 50, 50, 0.4); transition: opacity 0.3s; }
.sys-guide { background: url(../../../../../resources/web/hkor/images/common/explan01.png) center no-repeat; }
.apply-guide { background: url(../../../../../resources/web/hkor/images/common/explan02.png) center no-repeat; }
.key-guide { background: url(../../../../../resources/web/hkor/images/common/explan03.png) center no-repeat; }


/* 분야별 제출 자료 설명 영상 */
.submi-wrap { display: flex; gap: 20px; justify-content: center; width: 100%; margin-bottom: 30px; }
.submi-wrap > li { display: flex; align-items: center; text-align: center; width: 160px; height: 180px; }

.submi-wrap li figure.submi-ico01 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico01.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico01 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico01-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico02 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico02.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico02 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico02-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico03 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico03.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico03 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico03-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico04 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico04.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico04 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico04-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico05 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico05.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico05 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico05-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico06 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico06.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico06 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico06-hover.png') no-repeat center center; background-size: contain; }
.submi-wrap li figure.submi-ico07 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico07.png') no-repeat center center; background-size: contain; }
.submi-wrap li:hover figure.submi-ico07 { width: 160px; height: 180px; background: url('../../../../../resources/web/hkor/images/common/submi-ico07-hover.png') no-repeat center center; background-size: contain; }

.submi-wrap .category-wrap { width: 130px; }
.submi-wrap .category { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; width: 100%; margin: 5px auto; }
.submi-wrap .category01 { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; width: 100%; margin: 5px auto; }


/* sub1-1-2 */
.art-field > div .art-field-period{ font-weight: bold; color: #8c8c8c; }
.art-field > div .standard{ margin-bottom: 10px; }
.art-field > div .standard > h6{ margin-top: 10px; font-size: 18px; line-height: 30px; text-align: left; }
.art-field > div .standard p{ padding-left: 1%; line-height: 30px; text-align: left; }
.art-field > div .standard p::after{ display: block; content: ''; clear: both; }
.art-field > div .standard p > span{ float: left; }
.art-field > div .standard p span.job{ margin-right: 10px; font-weight: bold; }
.art-field > div .standard p span.innertext{ display: block; padding-left: 1%; clear: both; }


/* sub1-8 */
.bus8-step{ display: flex; margin-bottom: 40px; flex-wrap: wrap; justify-content: space-around; }
.bus8-step::after{ display: block; content: ''; clear: both; }
.bus8-step dl{ flex: 0 0 24%; }
.bus8-step dl dt{ background: #606db3; color: #fff; }
.bus8-step dl dd{ border: 1px solid #606db3; color: #666; }

/* board style */
.board-wrap{ width: 100%; }
.board-wrap::after{ display: block; content: ''; clear: both; }
.board-wrap .board-header{ width: 100%; margin: 0 auto; font-size: 17px; }
.board-wrap .board-header::after{ display: block; content: ''; clear: both; }
.board-wrap .board-header .count{ float: left; width: 10%; font-weight: bold; text-align: left; }
.board-wrap .board-header .board-select-wrap{ float: right; display: flex; width: 50%; flex-wrap: wrap; justify-content: flex-end; }
.board-wrap.type-list3 .board-header .board-select-wrap{ width: 90%; }
.board-wrap .board-header .board-select-wrap .selectbox{ flex: 1; }
.board-wrap .board-header .board-select-wrap .searchbox{ position: relative; }
.board-wrap .board-header .board-select-wrap .searchbox input{ position: absolute; left: 0; }
.board-wrap .board-header .board-select-wrap .searchbox a{ position: absolute; right: 9px; top: 3px; }
.board-wrap .board-header input[type=text]{ width: 90%; margin-left: 1em; padding: 0.5em 0.3em; border-bottom: 1px solid #222; font-weight: bold; font-size: 16px; font-family: inherit; background: #fff; color: #111; -webkit-transition: width 0.4s ease-in-out; transition: width 0.4s ease-in-out; -moz-transition: width 0.4s ease-in-out; -ms-transition: width 0.4s ease-in-out; -o-transition: width 0.4s ease-in-out; }
/* When the input field gets focus, change its width to 100% */
.board-wrap .board-header input[type=text]:focus{ width: 90%; font-family: inherit; background: #fff; }
.board-wrap .board-header input[type=text]::placeholder{ color: #111; }
.board-wrap .board-header select{ width: 90%; margin-left: 1.1em; padding: 0.5em 0.3em; border: none; border-bottom: 1px solid #222; border-radius: 0; font-weight: bold; font-size: 16px; font-family: inherit; background: url("../images/images/selectbox_icon.png") no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.board-wrap .board-header select::-ms-expand{ display: none; }

/* board - list type1*/
.board-list{ width: 100%; margin-top: 20px; }
.board-list ul li{ width: 100%; padding: 1em 0; border-bottom: 1px solid rgb(209, 209, 209); font-size: .93em; }
.board-list ul li:first-child{ padding: 0; font-size: 1em; }
.board-list ul li::after{ display: block; content: ''; clear: both; }
.board-list ul li p{ float: left; }
.board-list ul li .cg{ font-weight: bold; color: #888; }
.board-list ul li p.number{ width: 8%; text-align: center; }
.board-list ul li p.number span.ctgr{ display: inline-block; padding: 0.3em 0.7em; border-radius: 3px; font-size: .8em; background: #f11651; color: #fff; }
.board-list ul li p.title{ font-family: 'Noto Sans KR', sans-serif !important; text-align: left; }
/* .board-list ul li p.title a {
display: inline-block;
font-size: 1.1em;
} */
.board-list ul li p.date{ width: 15%; text-align: center; color: #777; }
.board-list ul li:hover p.title{ text-decoration:none; color:#999; }
.board-list ul li:hover p.title a{ font-size: 1em; color: #4f3fa3; font-weight: bold; text-decoration:underline ; }
.board-list ul li:first-child{ border-top: 2px solid #999; font-weight: bold; line-height: 50px; background: #f2f2f2; }
.board-list ul li:first-child p{ padding: 0; }
.board-list ul li:first-child p.title{ text-align: center; }

.type-list1 .board-list ul li p.title{ width: 77%; font-size: 1em; }

/* board - list type2*/
.type-list2 .inner-tab .board-tab{ display: flex; width: 100%; margin: 0 0 40px; flex-wrap: wrap; justify-content: center; }
.type-list2 .inner-tab .board-tab button{ margin: 0.4em 0.8em; padding: 0.8em 0.35em; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; font-weight: bold; font-size: 1.2em; line-height: 1em; flex: 0 0 16em; background: #e8e8e8; color: rgb(77, 77, 78); letter-spacing: -1px; transition: 0.3s linear; -webkit-transition: 0.3s linear; -moz-transition: 0.3s linear; -ms-transition: 0.3s linear; -o-transition: 0.3s linear; }
.type-list2 .inner-tab .board-tab button:hover{ font-weight: bold; background: #888; color: #fff; }
.type-list2 .inner-tab .board-tab button.active{ font-weight: bold; background: #4f3fa3; color: #fff; }

/* board - list type1*/
.type-list3 .inner-tab .board-tab{ display: flex; width: 100%; margin: 0 0 40px; flex-wrap: wrap; justify-content: center; }
.type-list3 .inner-tab .board-tab button{ margin: 0.4em 0.8em; padding: 0.8em 6.5em; border-radius: 3px; font-size: 1.2em; line-height: 1em; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; background: #dedede; letter-spacing: -1px; color: rgb(120, 116, 133); flex: 0 0 25em; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.type-list3 .inner-tab .board-tab button:hover{ font-weight: bold; background: #D9E6FF; color: #fff; }
.type-list3 .inner-tab .board-tab button.active{ font-weight: bold; background: #4f3fa3; color: #fff; }
.type-list3 .board-list ul li p{ font-size: 1em; }
.type-list3 .board-list ul li p.number{ display: none; }
.type-list3 .board-list ul li p.state{ width: 8%; }
.type-list3 .board-list ul li p.company{ width: 15%; font-weight: bold; }
.type-list3 .board-list ul li p.job{ width: 10%; }
.type-list3 .board-list ul li p.title{ width: 57%; font-size: 1em; }
/* .type-list3 .board-list ul li p.title a {
font-size: 1em;
} */
.type-list3 .board-list ul li p.date{ width: 10%; }
.type-list3 .board-list ul li p.state span{ display: inline-block; padding: 0.3em 0.5em; border-radius: 3px; font-size: 0.8em; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; color: #fff; }
.type-list3 .board-list ul li p.state span.ing{ background: #e07415; }
.type-list3 .board-list ul li p.state span.fin{ background: #999; }

/* board - view type1*/
.board-wrap .view-con{ width: 100%; padding-bottom: 30px; border-bottom: 1px solid #ccc; font-size: 1.1em; text-align: left; }
.board-wrap .view-con::after{ display: block; content: ''; clear: both; }
.view-con .attachment{ margin: 70px 1% 30px; padding: 10px 20px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; line-height: 1em; background: #eee; }
.view-con .attachment i{ font-size: 0.8em; color: #747474; }
.view-con .attachment a{ margin-left: 10px; font-size: 0.9em; }
.view-con .attachment a:hover{ text-decoration: underline; }
.view-footer{ padding: 50px 0; }
.next, .page-control .prev{ font-size: 1.1em; line-height: 2em; }
.page-control a i{ font-size: 1em; }
.page-control a span{ margin: 0 5px; }
.pagination{ display: flex; width: 50%; margin: 50px auto 0; }
.pagination::after{ display: block; content: ''; clear: both; }
.pagination a{ margin: 0 2%; font-size: 1.1em; flex: 0 0 3%; color: #555; }
.end, .next, .pagination .first, .prev{ color: #888; }
.pagination a:hover{ border-bottom: 3px solid #777; font-weight: bold; color: #777; }
.pagination a.active{ border-bottom: 3px solid #4f3fa3; font-weight: bold; color: #4f3fa3; }

/* sub 1-4 : card type list */
.card-type-list{ display: flex; width: 100%; justify-content: center; flex-wrap: wrap; }
.card-type-list li{ margin: 50px 4%; flex: 0 0 250px; }
.card-type-list li > div > img{ display: block; width: 100%; height: 300px; background: #000; }
.card-type-list li > div > p{ padding: 20px 6%; font-weight: bold; font-size: 18px; transition: 0.5s linear; }
.card-type-list li > div > a{ display: block; width: 100%; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; line-height: 60px; background: #333; color: #fff; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.card-type-list li:hover > div > p{ color: #4f3fa3; }
.card-type-list li:hover > div > a{ background: #4f3fa3; }

/* sub 2-1 style */
.contract-title{ width: 100%; padding: 5%; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; background: #EEF2FA; }
.contract-title .head{ font-style: italic; font-weight: bold; font-size: 2em; color: #5d6db5; }
.contract-title .head span{ color: #afb1bd; }
.contract-title .txt{ margin-top: 15px; padding: 0 35px; font-size: 1em; line-height: 2em; color: #555; }
.contract li{ width: 100%; margin-top: 15px; padding: 0.5em 0; border: 3px solid #ddd; background: #fff; transition: 0.3s linear; -webkit-transition: 0.3s linear; -moz-transition: 0.3s linear; -ms-transition: 0.3s linear; -o-transition: 0.3s linear; }
.contract li:first-child{ margin-top: 0; }
.contract li:hover{ background: #f1f1f1; }
.contract li > div::after{ display: block; content: ''; clear: both; }
.contract li > div > p{ float: left; margin-left: 2%; font-weight: bold; line-height: 2.5em; color: #555; }
.contract li > div > a{ float: right; margin-right: 2%; padding: 0.5em 0.8em; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; background: #555; color: #fff; transition: 0.3s linear; -webkit-transition: 0.3s linear; -moz-transition: 0.3s linear; -ms-transition: 0.3s linear; -o-transition: 0.3s linear; }
.contract li > div > a:hover{ background: #222; }
.contract li > span{ display: block; padding-left: 2em; }
.design-area{ display: flex; width: 100%; margin: 120px auto 50px; justify-content: center; flex-wrap: wrap; }
.des-circle{ height: 250px; margin-left: -32px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border: 6px solid #cdd1e6; background: rgba(151, 160, 204, 0.1); flex: 0 0 250px; }
.design-area div:first-child{ margin-left: 40px; margin-right: -40px; }
.design-area div:nth-child(2){ margin-top: -120px; margin-bottom: 120px; }
.design-area div:nth-child(3){ margin-right: 40px; margin-left: -80px; }
.des-circle p{ padding: 100px 30px; font-weight: bold; font-size: 1.1em; line-height: 1.5em; color: #606db3; }

/* sub 2-2 table style */
.center-info-table{ width: 100%; }
.center-info-table li{ margin-bottom: 20px; }
.center-info-table li:last-child{ margin-bottom: 0; }
.center-info-table li::after{ display: block; content: ''; clear: both; }
.center-info-table li p.th{ font-weight: bold; }
.center-info-table li p.td{ margin-top: 10px; padding-left: 1%; }
.center-info-table li p span.innertext{ padding-left: 1%; font-size: 15px; }

/* sub 2-7 table style */
.isc .edu p{ width: 100%; }
.isc .edu p::after{ display: block; content: ''; clear: both; }
.isc .edu p span{ display: inline-block; }
.isc .edu p span.left{ float: left; margin-right: 3%; }
.isc .edu p span.right{ float: left; }

/* sub 4-1 style */
.intro1 > img{ position: absolute; min-width: 360px; width: 20%; right: 18%; bottom: 50%; transform: translateY(50%); }
.intro1 .ceoN{ position: absolute; right: 22%; bottom: 30%; }
.intro1 .ceoN span{ display: block; margin: 20px auto; font-weight: bold; color: #666; }
.intro1 p.intro{ width: 68%; padding: 2em; font-size: 1.1em; line-height: 1.8em; text-align: left; }
.intro1 p.intro img{ width: 118px; }

/* sub 4-2 style */
.intro2{ padding: 0 5%; }
.intro2 .inner-top span{ font-size: 2.2em; font-weight: bold; color: #4f3fa3; }
.intro2 .inner-top p{ width: 100%; font-size: 1.1em; line-height: 2em; }
.intro2 .mission{ float: left; width: 44%; }
.intro2 .vision{ float: right; width: 46%; }
.intro2 > div > .in{ width: 100%; padding: 4em 2em; background: #f8f8f8; }
.intro2 > div > img{ width: 89px; }
.intro2 > div > .in p{ margin-top: 10px; padding: 0 2.5em; font-size: 1.1em; line-height: 2em; }
.intro2 > div.vision > .in p{ margin-top: 30px; }
.intro2 > div.slogan{ width: 100%; clear: both; }
.intro2 > div.slogan p{ padding: 40px 0; font-size: 2.7em; background: #4f3fa3; color: #fff; }
.intro2 > div.slogan p span{ display: block; font-weight: bold; }
.intro2 > div.slogan > p > span:first-child{ font-weight: normal; }
.intro2 .purpose > div{ display: flex; font-weight: 600; flex-wrap: wrap; justify-content: space-between; }
.intro2 .purpose > div > span{ padding: 1.3em .5em; font-size: 1.1em; background: #f8f8f8; flex: 0 0 22%; }

/* sub 4-3 style */
.intro3 > ul{ margin-left: 50px; }
.intro3 > ul > li p.year{ display: inline-block; width: 60%; margin-top: 40px; margin-bottom: 10px; font-weight: bold; font-size: 1.8em; color: #5d6db5; text-align: left; }
.intro3 > ul > li > ul{ width: 60%; margin: 0 auto; }
.intro3 > ul > li > ul > li{ line-height: 40px; }
.intro3 > ul > li > ul > li::after{ display: block; content: ''; clear: both; }
.intro3 > ul > li > ul > li > span.bl{ float: left; display: block; width: 5px; height: 5px; margin-top: 17px; margin-left: 10px; margin-right: 10px; border-radius: 50%;; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; background: #afafaf; }
.intro3 > ul > li > ul > li > span.date{ float: left; width: 25%; padding: 10px 0; font-weight: bold; font-size: 1em; line-height: 21px; color: #888; text-align: left; }
.intro3 > ul > li > ul > li > p{ float: left; width: 65%; padding: 10px 0; line-height: 21px; text-align: left; }
.intro3 > ul > li > ul > li > p.nobl{ margin-left: 30%; }
.intro3 .report{ display: flex; flex-wrap: wrap; justify-content: space-around; }
.intro3 .report > div{ margin-bottom: 30px; padding: 2em 1em; background: #f8f8f8; flex: 0 0 19%; }
.intro3 .report > div p{ margin-bottom: 20px; font-weight: bold; font-size: 1.1em; }

/* sub4-4 style */
.intro4 .tabcontent span{ display: block; line-height: 30px; color: #666; }
.intro4 .tabcontent p{ margin: 10px 0; font-weight: bold;  text-align: left; }
.intro4 .tabcontent.stepbox > h6{ font-size: 1.2em; }
.intro4 #tab2 span, .intro4 #tab3 span{ text-align: center; }
.intro4 #tab2 span{ padding-left: 30px; }

/* sub4-5 style */
.orgchart-wrap{ width: 100%; background: url('../images/images/sub4_5_orgbg.png')0 0 no-repeat; background-size: 100%; }
.orgchart{ display: flex; margin-top: 40px; justify-content: space-around; flex-wrap: wrap; }
.orgchart a{ font-weight: bold; background: #fff; transition: .3s linear; -webkit-transition: .3s linear; -moz-transition: .3s linear; -ms-transition: .3s linear; -o-transition: .3s linear; }
.orgchart a:hover{ background: #f1f1f1; }
.orgchart.sc1 a{ display: inline-block; padding: 1em 0; border: 3px solid #b1a0cc; flex: 0 0 28%; }
.orgchart.sc1 a.directorate{ margin-left: 33.3%; border: 3px solid #8a70b4; font-weight: bold; background: #8a70b4; color: #fff; }
.orgchart.sc2{ margin-top: 20px; }
.orgchart.sc2 a{ display: inline-block; padding: 1em 0; border: 3px solid #b1a0cc; flex: 0 0 28%; }
.orgchart.sc3{ margin-top: 20px; }
.orgchart.sc3 a{ display: inline-block; padding: 1em 0; flex: 0 0 28%; }

.orgchart.sc3 #org04Open { margin-left: 33.4%; border: 3px solid #b1a0cc; }
.orgchart.sc3 #org05Open { margin-left: 1%; border: 3px solid #cdcdcd; transform: translateY(52px); }

.orgchart.sc3half{ margin-top: 100px; }
.orgchart.sc3half a{ padding: .5em 0; background: #555; flex: 0 0 24.7%; color:#fff; cursor: unset; }
.orgchart.sc3half a:first-child{ margin-left: 44%; }
.orgchart.sc3half a:last-child{ margin-left: 6%; }
.orgchart.sc4 { margin-top: 45px; }
.orgchart.sc4 a{ display: inline-block; padding: 2.5em 0; border: 3px solid #cdcdcd; line-height: 46px; flex: 0 0 11.5%; color: #777; }
.modal.md-org{ min-width: 800px; }
.org-title{ border-bottom: 1px dashed #ccc; font-size: 1.3em; font-weight: bold; line-height: 44px; color: #4f3fa3; }
.org-title .tel-common{ margin-left: 15px; font-size: .8em; color: #555; }
.md-org table{ font-size: .9em; text-align: center; }
.md-org table.md-table tbody th{ border-bottom: 1px solid #D9E6FF; border-right: 1px solid #aebaec; border-left: 1px solid #aebaec; font-weight: bold; background: #fff; color: #333; }

/* sub4-6 style */
.content .isc.intro6 .btnbox > a{ flex: 0 0 50%; }

/* sub4-7 style */
#map{ width: 100%; border: 1px solid #ccc; }
.intro7 .linebox p{ margin-left: 15px; font-weight: bold; }
.intro7 .linebox p span{ display: inline-block; width: 20px; margin-right: 8px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; font-weight: bold; line-height: 20px; text-align: center; }
.intro7 .linebox p span.subway{ background: #0d99da; color: #fff; }
.intro7 .linebox p span.bus{ background: #8d8d8d; color: #fff; }
.intro7 .linebox p.bgtext{ margin-left: 40px; }

/* sitemap */
.sitemap{ width: 100%; }
.sitemap > li{ float: left; width: 33.3%; margin-bottom: 50px; padding: 0 1%; }
.sitemap > li:nth-child(4){ clear: both; }
.sitemap > li > h5{ display: block; width: 100%; font-weight: bold; font-size: 1.1em; line-height: 3em; background: #4f3fa3; color: #fff; }
.sitemap > li > ul > li{ background: #edf0ff; }
.sitemap > li > ul > li:hover{ background: #ffc349; }
.sitemap > li > ul > li > a{ display: block; padding: 0.5em; border-bottom: 1px solid #ccc; font-weight: bold; font-size: 1em; }
.sitemap > li > ul > li > ul{ padding: 0.5em 0; border-bottom: 1px solid #ccc; background: #f1f1f1; }
.sitemap > li > ul > li > ul > li > a{ display: block; padding: 0.3em 0; }
.sitemap > li > ul > li > ul > li > a:hover{ font-weight: bold; text-decoration: underline; }

/* privacy guide */
.guide-align { width: 100%; margin-bottom: 60px; padding: 2em; border: 3px solid #ddd; text-align: left; }
.guide-align h5{ margin-bottom: 10px; font-weight: 600; font-size: 1.5em; }
.guide-align .law-section{ margin-bottom: 20px; }
.guide-align .inner-1depth{ margin: 10px 0; padding-left: 2em; }
.guide-align .inner-1depth h6{ font-weight: bold; }
.guide-align .inner-1depth p{ padding-left: 1.3em; }
.guide-align .inner-2depth p{ padding-left: 2.6em; }
.guide-align table{ width: 100%; margin: 10px 0; border: 1px solid #ccc; text-align: center; }
.guide-align table thead{ background: #eee; color: #555; }
.guide-align table thead th{ border-right: 1px solid #ccc; font-weight: bold; line-height: 30px; vertical-align: middle; }
.guide-align table tbody th{ border-right: 1px solid #ccc; vertical-align: middle; }
.guide-align table tbody tr{ border-bottom: 1px solid #ccc; vertical-align: middle; }
.guide-align table tbody td{ border-right: 1px solid #ccc; line-height: 30px; vertical-align: middle; }
.map{ width: 100%; }
.map a img{ width: 100%; }
.sub1_9 .fL{ width: 50%; padding: 40px; background: #f2f2f2; }
.sub1_9 .fL p{ margin-bottom: 30px; text-align: left; }
.sub1_9 .fR{ width: 50%; }
.sub1_9 .fR ul li{ width: 90%; height: 180px; margin-left: 10%; margin-bottom: 42px; padding: 8%; border: 1px solid #ccc; text-align: center; transition: .3s linear; }
.sub1_9 .fR ul li:hover{ border: 1px solid #5c3ab2; }
.sub1_9 .fR ul li p{ font-weight: bold; font-size: 20px; line-height: 1.6; }
.sub1_9 .fR ul li a{ display: block; width: 60%; margin: 20px auto; border-radius: 3px; line-height: 40px; background: #666; color: #fff; transition: .3s linear; }
.sub1_9 .fR ul li:hover a{ background: #5c3ab2; }
.processbox{ display: flex; width: 100%; justify-content: center; flex-wrap: wrap; }
.processbox li{ font-size:14px; line-height: 22px; text-align: center; flex: 0 0 33%; }
.processbox li::after{ display: block; content: ''; clear: both; }
.processbox li .processbox-top{ display: flex; width: 100%; justify-content: space-between; flex-wrap: inherit; }
.processbox li .processbox-top > p{ position: relative; float: left; width: 100%; border: 2px solid #8b99db; font-weight: bold; color: #8b99db; line-height: 22px; text-align: center; flex: 0 0 48%; }
.processbox li .processbox-top > p > .nextstep{ position: absolute; z-index: 2; width: 20px; height: 20px; border: 2px solid #8b99db; border-radius: 50%; line-height: 14px; background: #fff; top: 13px; right: -16px; }
.processbox li .processbox-top::after{ display: block; content: ''; clear: both; }
.processbox li .processbox-bt{ display: flex; width: 100%; justify-content: space-between; flex-wrap: inherit; }
.processbox li .processbox-bt > p{ float: left; width: 50%; line-height: 22px; background: #8b99db; text-align: center; flex: 0 0 48%; color: #fff; }
.processbox li .processbox-bt > p.w100p{ flex: 0 0 98%; }
.processbox li .processbox-top> p.lh38{ line-height: 38px; }
.processbox li .processbox-bt::after{ display: block; content: ''; clear: both; }

/* 공공누리 이미지 */
.gonggong1{margin:40px 0 0;}
.gonggong2{margin:10px 0 0;}

/* 20211101 추가 */
.table-ethics tbody th, .table-ethics tbody td { width:7.14% !important; }
.table-ethics .bd-none { border: 1px solid #fff !important; background:red; }
.table-ethics .tx-strong { font-weight:bold; }
.table-ethics .tx-left { text-align: left; font-size:14px; }
.table-ethics .bg-strong { background:#edf0ff; }

@media (max-width:1200px) {
    /* sub 4-1 style */
    .intro1 > img{ position: relative; margin-bottom: 20px; top: -35px; right: 0; bottom: 0; transform: translateY(0); }
    .intro1 .ceoN{ top: 40%; right: 50%; transform: translateX(50%); }
    .intro1 p.intro{ width: 100%; text-align: center; }
}

@media (max-width:640px) {
    /* sub 4-1 style */
    .intro1 .ceoN{ font-size: 14px; top: 29%; }

}