@charset "utf-8";
@media (max-width:599px) {
    :root {font-size: 12px;}
}
@media (min-width:600px) and (max-width:799px) {
    :root {font-size: 14px;}
}
@media (min-width:800px) {
    :root {font-size: 16px;}
}

:root {--main-color01:#28b165;--sub-color01:#8e938e;}

/* xeicon */
@import url(/css/fonts/xeicon.otf);
@font-face {font-family: 'xeicon'; font-style: normal;font-weight: 100;src:/* url(./css/fonts/xeicon.woff2) format('woff2'),url(./css/fonts/xeicon.woff) format('woff'),*/url(./css/fonts/xeicon.otf) format('opentype');}

/* 본고딕 */
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 100;src: url(./font/NotoSansKR-Thin.woff2) format('woff2'),url(./font/NotoSansKR-Thin.woff) format('woff'),url(./font/NotoSansKR-Thin.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;src: url(./font/NotoSansKR-Light.woff2) format('woff2'),url(./font/NotoSansKR-Light.woff) format('woff'),url(./font/NotoSansKR-Light.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(./font/NotoSansKR-Regular.woff2) format('woff2'),url(./font/NotoSansKR-Regular.woff) format('woff'),url(../font/NotoSansKR-Regular.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(./font/NotoSansKR-Medium.woff2) format('woff2'),url(./font/NotoSansKR-Medium.woff) format('woff'),url(../font/NotoSansKR-Medium.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(./font/NotoSansKR-Bold.woff2) format('woff2'),url(./font/NotoSansKR-Bold.woff) format('woff'),url(../font/NotoSansKR-Bold.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 900;src: url(./font/NotoSansKR-Black.woff2) format('woff2'),url(./font/NotoSansKR-Black.woff) format('woff'),url(./font/NotoSansKR-Black.otf) format('opentype');}

@font-face {font-family: 'GmarketSans';font-style: normal;font-weight: 900;src: url(./font/GmarketSansBold.otf);}
@font-face {font-family: 'GmarketSans';font-style: normal;font-weight: 500;src: url(./font/GmarketSansMedium.otf);}
@font-face {font-family: 'GmarketSans';font-style: normal;font-weight: 300;src: url(./font/GmarketSansLight.otf);}

* {margin: 0; padding: 0; }
html {height: 100%; position: relative;min-height: 100vh;}
body {margin: 0px;  font-family: 'GmarketSans','SEBANG','DAON',"Noto Sans KR", sans-serif; line-height: 1.2; color: #666; font-weight: 400; min-width: 1240px; letter-spacing: 0em;}
li {list-style: none;}
a {color: #444; text-decoration: none;}

@media (max-width:1024px) {
    body {min-width: auto;}
}

/* root */
div {box-sizing: border-box; }

table {border: 0px solid; border-spacing: 0; width:100%; box-sizing: border-box;border-collapse: collapse; margin: 10px 0; font-size: inherit; line-height: inherit;}
tr {border-bottom: 1px solid #babcbe;}
th {background: #f1f1f1; border-top: 1px solid #babcbe;}
th, td { height: 20px;padding: 10px 2px 8px; }
td { vertical-align: middle;}
th:last-child, td:last-child {}

input {background: #fff; border: 1px solid #c7c7c7; border-radius: 5px;}
input[type=text] { height: 32px; vertical-align: middle; padding: 2px 5px; box-sizing: border-box; margin: 0px;}
input[type=number] { height: 32px;vertical-align: middle;padding: 2px 5px; box-sizing: border-box;}
input[type=password] { height: 32px;vertical-align: middle;padding: 2px 5px; box-sizing: border-box;}
input[type=checkbox] { height: 20px; vertical-align: middle; zoom:1.5; margin: -2px 3px 0 3px;}
input[type=radio] { height: 20px;vertical-align: middle;  zoom:1.5;}

/*i {vertical-align: middle;}*/
svg[class*='fa'] {vertical-align: middle;}
img {vertical-align: middle;}

select { -webkit-appearance: none;-moz-appearance: none; appearance: none; background: #fff url(../images/select.png) no-repeat  ; background-position:  right 10px top 50%; ;min-width: 10px; padding: 2px 20px 2px 5px; box-sizing: border-box; min-height: 36px; margin: 0px; vertical-align: middle;border-radius: 0px; box-sizing: border-box;text-overflow: ellipsis; min-width: 200px; border-radius: 4px; border:1px solid  #c7c7c7;}
select::-ms-expand { display: none;}
option {height: 30px;padding: 10px;min-height: 2em;}

textarea {height: auto; resize: none; overflow:visible; padding: 10px; box-sizing: border-box; border: 1px solid #eee;}

.text_ov {max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space : nowrap;}

section {padding: 10px; border-bottom: 1px solid #eee;}

/* 스크롤 안보이게 */
/*div {-ms-overflow-style: none;scrollbar-width: none; }
div::-webkit-scrollbar { display: none; }*/

/* 페이징 */
.page { width: auto; display: flex; height: 40px; margin: 0 auto; text-align: center; margin: 70px 0;align-items: center; justify-content: center;}
.page a {font-size: 14px;display: inline-block;}
.page .bt_at {color: #bcd5c7;; font-size: 30px; margin: 5px}
.page ul {display: inline-block; margin: 0 3px;}
.page ul ol {display: inline-block;}
.page span {width: 34px; height: 34px; text-align: center; display: inline-block;  border: 0px solid #28b165; vertical-align: middle; margin: 0 2px; border-radius: 50%; overflow: hidden;}
.page span a {display: block; width: 100%; height: 100%; line-height: 36px; color: #b9b9b9;border: 1px solid #fff;}
.page span a.on {border: 1px solid #bcd5c7; border-radius:  50%; color: #74aa8c;}
.page span a:hover {border: 1px solid #bcd5c7; border-radius:  50%; color: #74aa8c;}

@media (max-width:767px) {
    
    .page .bt_at {color: #7e7e7e; font-size: 20px; margin: 2px}
    .page span {width: 28px; height: 28px; text-align: center; display: inline-block; line-height: 26px;  vertical-align: middle; margin: 0 2px; border-radius: 50%; overflow: hidden;}
    .page span a {line-height: 28px; font-size: 12px}
}


/* 버튼 */
.but_area {text-align: center; margin: 20px 0;}
.but_area.right {text-align: right;}
.but_area button {height: 40px;}

.tb_bottom {display: flex; justify-content: end;}
.tb_bottom>* {margin-left: 10px;}

[class*="btnty"] {border-radius: 2px; }
[class*="btnty"]:hover {opacity: 0.8; }
.btnco01 {background: #28b165;color: #fff; border: 1px solid #28b165;}
.btnco02 {background: #fff ;color: #28b165; border: 1px solid #28b165;}
.btnco03 {background: #eaeaea ;color: #999; border: 1px solid #999;}
.btnty01 {padding: 7px 5px;}
.btnty02 {padding: 7px 15px;}
.btnsi10 {width: 100px;}
.btnsi11 {width: 110px;}
.btnsi15 {width: 150px;}
.btnsifull {width: 100%;}


@media (max-width:500px) {
    .tb_bottom>* {margin-left: 5px;}
    .btnty01 {padding: 5px 5px;}
    .btnty02 {padding: 5px 5px;}
    .btnsi10 {width: 60px;}
    .btnsi15 {width: 100px;}
    
}

.flex {display: flex;}



/* header */
header {width: 100%; margin: 0 auto; display: block; border-bottom: 1px solid #cecece; z-index: 20; background: #fff;position: fixed; top: 0;} 
#header {position: relative; z-index: 10;} 
.bot_line {border-bottom: 1px solid #cecece;}
.header_top {width: 100%; max-width: 1280px; display: block; margin: 0 auto; height: 30px; line-height: 30px; background: #fff;}
.header_top ul {float: right;}
.header_top ul li {float: left; padding: 0px 10px; padding-top: 1px;}
.header_top ul li a {}
.header_top .user_name {color: #28b165; font-weight: 500; cursor: pointer;}
.header_top .log_out {background: #b0b0b0; color: #fff; margin-right: 5px; padding-top: 2px; box-sizing: border-box; height: 30px;}
.header_top .log_out a{ color: #fff;}
.header_top .lang {vertical-align: middle; width: 60px; padding: 0; vertical-align: middle;padding-top: 1px; text-align: center; font-size: 0.8em; }
.header_top .lang a {color: #858dcc; display: block;}
.header_top .lang a:hover {text-decoration: underline;}

.header {width: 100%; max-width: 1280px; height: 70px; margin: 0 auto; display: block; background: #fff;} 
.header .logo {width:330px; height: 70px; float: left;padding: 15px;}    
.header .logo a {vertical-align: middle;display: block; height: 100%;}    
.header .logo img{width:100%; vertical-align: middle;  }    

.jbFixed { position: fixed; top: 0px;}

nav.web {}
nav.web>ul {float: right; width: 850px; display: flex; }
nav.web>ul>li {flex: 1; font-size: 1.4em; font-weight: 500; height: 70px; display: flex; justify-content: center;align-items: center; position: relative;}
nav.web li a {display: block; text-align: center; }
nav.web .sub_menu {position: absolute; top: 70px; left: 0; width: 100%; font-size: 0.7em; font-weight: 500; height: 200px;z-index: 1; display: none; padding-bottom: 10px;}
nav.web .sub_menu li {min-height: 30px; display: flex; align-items: center; justify-content: center; padding: 2px;}
nav.web .sub_menu li:hover a {color: #28b165 }
.menu_bg {position: absolute;z-index: 0; width: 100%; height: 180px;background: rgba(255, 255, 255, 0.9); box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2); display: none;;}

input[id="menuicon"] {display: none;}
input[id="menuicon"] + label {display: block; margin: 23px; width: 30px; height: 26px; position: fixed; cursor: pointer; right: 0; top: 30px;}
input[id="menuicon"] + label span{display: block; position: absolute; width: 100%; height: 3px; border-radius: 30px; background: #000; transition: all .35s;}
input[id="menuicon"] + label span:nth-child(1){top: 0; }
input[id="menuicon"] + label span:nth-child(2){top: 50%; transform: translateY(-50%);}
input[id="menuicon"] + label span:nth-child(3){bottom: 0;}
input[id="menuicon"]:checked + label {z-index: 11;}
input[id="menuicon"]:checked + label span {background: #28b165;}
input[id="menuicon"]:checked + label span:nth-child(1) {top: 50%; transform: translateY(-50%) rotate(45deg)}
input[id="menuicon"]:checked + label span:nth-child(2) {opacity: 0;}
input[id="menuicon"]:checked + label span:nth-child(3) {bottom: 50%; transform: translateY(50%) rotate(-45deg)}

div[class="sidebar"] {width: 300px; height: 100%; background: #fff; position: fixed; top: 0; right: -300px; z-index: 5; transition: all .35s;box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.2);}
input[id="menuicon"]:checked + label + div {right: 0;}

.sidebar {}
.sidebar .accordion {margin: 70px 0px 0; padding: 30px;}
.sidebar .accordion>li {font-size: 18px;margin-bottom: 10px;}
.sidebar .accordion>li>a {color: #0d7f40; font-weight: 500;}
.sidebar .sub_menu>li {font-size: 16px;padding: 5px 0px 5px 20px;}
.sidebar .sub_menu>li a{color: #0b3c21;}

@media (max-width:1200px) {
    nav.web>ul {width: 600px;}
    nav.web>ul>li {font-size: 1.2em;}
}
@media (min-width:1025px) {
    .mobiel_nav {display: none !important;;}
}
@media (max-width:1024px) {
    header {position: fixed; top: 0;}
    nav.web {display: none;}
    nav.main {display: block !important;}
}
@media (max-width:500px) {
    .header { height: 50px; } 
    .header .logo {width:230px; height: 50px; float: left;padding: 15px;}
    input[id="menuicon"] + label { margin: 13px 20px; width: 30px; height: 26px; position: fixed; cursor: pointer; right: 0; top: 30px;}
}


/*메인 스와이퍼*/
.swiper {width: 100%; height: 400px; margin-bottom: 50px;}
.swiper-slide {text-align: center;font-size: 1.2em;background: #fff;
/* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; background: var(--main-color01);}
/*.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover;}*/

.banner1 {width: 100%; height: 100%; background: url(../images/main/banim01_bg.png); background-position: center; background-size: cover}
.banner1>*[class*="bn1"] {position: absolute;} 
.banner1 .bn1_im1 {opacity: 0.0; left: 50%; margin-left: -380px; bottom: -118px; animation: fadeIn1 0.6s;animation-delay: 0s;animation-fill-mode: forwards;} 
.banner1 .bn1_im2 {opacity: 0.0; left: 50%; margin-left: -1000px;  bottom: -0px;  animation: fadeIn2 2s; animation-delay: 0s;animation-fill-mode: forwards;} 
.banner1 .bn1_im3 {opacity: 0.0; right: 50%; margin-right: -2000px; top: 70px; animation: fadeIn3 1.8s; animation-delay: 0.5s;animation-fill-mode: forwards;} 
.banner1 .bn1_im4 {opacity: 0; right: 50%; margin-right: -1100px; bottom: -10px; animation: fadeIn4 1.5s; animation-delay: 0.7s;animation-fill-mode: forwards;} 

.textbox {opacity: 0;  position: absolute; padding: 30px; background: rgba(255, 255, 255, 0.85); width: 480px; height: 170px; left: 50%; margin-left: -530px; top: 60px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.4);animation: fadeIn5 0.5s; animation-delay: 1.5s;animation-fill-mode: forwards;}
.textbox p {text-align: left; font-weight: 500; line-height: 1.5em;}
.textbox p b {text-align: left; font-size: 1.3em; color: #487455}

@keyframes fadeIn1 {
    0% {opacity: 0; transform: scale(0); bottom: -418px;}
    25% { transform: scale(1.1,1);}
    40% {transform: scale(1,1.1);bottom: -118px;}
    50% {transform: scale(1.1,1);}
    60% {transform: scale(1,1.05);}
    70% {transform: scale(1.05,1);}
    80% {transform: scale(1,1.01);}
    90% {transform: scale(1.01,1);}
    100% {transform: scale(1,1);opacity: 1;}
}
@keyframes fadeIn2 {
    0% {margin-left: -1500px; opacity: 0;}
    100% {margin-left: -1000px; opacity: 0.35;}
}
@keyframes fadeIn3 {
    0% {margin-right: -2000px;}
    100% {margin-right: -1000px;opacity: 0.1;}
}
@keyframes fadeIn4 {
    0% {bottom: -200px;}
    100% {bottom: -10px;opacity: 0.15;}
}

@keyframes fadeIn5 {
    0% {transform: scale(3);opacity: 0;filter: blur(100px);}
    70% {opacity: 0.2;}
    100% {transform: scale(1);opacity: 1;filter: blur(0px);}
}

@media (max-width:1024px) {
    .swiper {width: 100%; height: 400px; margin-bottom: 30px;}
    .banner1 .bn1_im2,.banner1 .bn1_im3,.banner1 .bn1_im4 {display: none;}
    .textbox {padding: 30px; height: 180px; left: 30px; margin-left: 0px; top: 60px; }
}

@media (max-width:768px) {
    .swiper {width: 100%; height: 300px; margin-bottom: 30px;}
    .banner1 .bn1_im1 {width: 350px;left: unset; right: 30px; bottom: -60px; margin-left: 0;}
    .textbox {padding: 15px; width: 340px; height: 120px; left: 50px; margin-left: 0px; top: 30px; font-size: 0.8em;}
    .textbox p {line-height: 2em;}
}
@media (max-width:420px) {
    .textbox {left: 10px;}
}


/* 메인 */
.main_cont {display: flex; flex-direction: column; max-width: 1000px; margin: 0 auto;}
.main_cont>.box {width: 100%; }
.main_cont .box {position: relative; border: 1px solid #eee; padding: 20px 10px; min-height: 250px}
.main_cont .box:after {content: ""; position: absolute; width: calc(100% + 2px); height: 8px; background: #469a7d; top: 0;left: -1px;  }

.main_cont .main_left.box {flex-wrap: wrap; display: flex;padding: 0; border: none;}
.main_cont .main_left.box:after {display: none;}
.main_cont .main_left .box {width: 100%; margin-bottom: 30px;  padding: 30px 30px 20px;}
.main_cont .main_left .box table {}
.main_cont .main_left .box.box2 {width: 100%; margin-bottom: 0px;}

.main_cont .box.fl05 { width: calc(50% - 15px);  background: linear-gradient(0deg, #cde3da, transparent);}

.main_cont .box h2 {font-size: 1.6em; margin-bottom: 30px; text-align: center;}
.main_cont .box.box2 h2 {color: #498865;}
.main_cont .box h2 i {font-size: 1.2em; margin-right: 5px; vertical-align: bottom; transition: 0.3s; vertical-align: middle;}
.main_cont .box h2 .more {position: relative;float: right; width: 20px;opacity: 1; margin-right: 30px;}
.main_cont .box h2 .more span {position: absolute; width: 60px; left: -15px; text-align: center;top: 8px; font-size: 14px;  color: var(--main-color01); opacity: 0; }
.main_cont .box h2 .more:hover i {opacity: 0;transition: 0.3s;}
.main_cont .box h2 .more:hover span {opacity: 1; transition: 0.3s;}

.main_notice { width: 100%;}
.main_notice tr{cursor: pointer; border-bottom: none;}
.main_notice tr:hover td:nth-child(1){color: #28b165;}
.main_notice td{max-width: 200px; height: 30px; vertical-align: bottom; border: none; overflow: hidden; text-overflow: ellipsis; white-space : nowrap; font-weight: 500; font-size: 1em; padding: 5px;}
.main_notice td:nth-child(2) {text-align: center; color: #7c7c7c}

.member_intr {background-image:url(../images/member_intr.png); background-repeat:  no-repeat; background-position:  center;; height: 170px; display: block; margin: 0 auto;}

.main_cont .main_right.box {margin-bottom: 30px; background: #f7fbfb;}
.main_cont .main_right.box:after {background: #7096a6;}

.main_cont .main_right.box h2 {text-align: center; color: #466c7c}
.main_cont .main_right.box h2 span {position: relative; z-index: 1; width: auto;display: inline-block;}
.main_cont .main_right.box h2 span:before {content: "";position: absolute; left: -10px; bottom: -2px; width: calc(100% + 20px); height: 7px; background: #c7e1ec; z-index: -1;}

.main_cont .main_right.box ul {display: flex; margin: 30px 0 0; flex-wrap: wrap;}
.main_cont .main_right.box ul li{width: 25%; text-align: center; }
.main_cont .main_right.box ul li a {display: flex; flex-direction: column;transition: 1.5s; margin-bottom: 10px;}
.main_cont .main_right.box ul li a img {width: 75px; margin: 10px auto;}
.main_cont .main_right.box ul li a p { display: flex; height: 40px; align-items: center; margin: 0 auto; font-weight: 500; font-size: 1.1em; color: #6f6f6f;}
.main_cont .main_right.box ul li a p span { width: 100%;}
.main_cont .main_right.box ul li a:hover img  {transition: 0.3s; filter: contrast(0);}
.main_cont .main_right.box ul li a:hover p {color: #466c7c; transition: 0.3s; transform: scale(1.1); font-weight: bold;}

/*가로형 */
.main_cont {display: flex; flex-direction: column; max-width: 1000px; margin: 0 auto; flex-direction: row-reverse}
.main_cont .main_left.box {width: 400px;  margin-right: 20px;}
.main_cont .main_left.box .box {padding: 20px 20px;}
.main_cont .main_left.box table tr td:nth-child(2) {display: none; }

@media (min-width:1025px) {
    .main_cont .box.fl05 {margin-bottom: 0px;}

}
@media (max-width:1024px) {
    .main_cont {flex-direction: column; }
    .main_cont .main_right.box {margin-left: 0;}
    .main_cont .main_left.box {width: 100%;}
    .main_notice td {max-width: 400px;}
}

@media (max-width:768px) {
    .main_cont .main_left .box {margin-bottom: 20px;}
    .main_cont .box.fl05 { width: calc(50% - 10px);}
}
@media (max-width:500px) {
    .main_cont .box {padding: 30px 15px;}
    .main_cont .box.fl05 { width: 100%;}
    .main_cont .main_right.box ul li {width: 33.33%;}
}
@media (max-width:420px) {
    .main_cont .main_right.box ul li {width: 50%;}
}



/* 콘텐츠 탑 */
.cont_top {position: relative;height: 300px; margin-bottom: 50px; }
.cont_top:before { content: "";position: absolute; bottom: 0; width: 100%; height: 100px; background: #7fcf9c; z-index: 0;}
.area_tit {width: 100%; max-width: 1280px; margin: 0 auto; display: flex; justify-content: space-evenly; align-items: center;}
.area_tit h2 {flex: 0.8 ; height: 70px; border: 7px  solid #277f51; border-radius: 5px; padding: 0 20px; font-size: 1.8em; line-height: 60px; color: #277f51; box-sizing: border-box;}
.area_tit h2 span { font-size: 0.8em; color: #5ab585; margin-left: 10px; display: inline-block; vertical-align: bottom;}
.banner_crt {position: relative; width: 300px; }

@media (max-width:900px) {
    .cont_top {position: relative;height: 250px;}
    .area_tit { align-items: flex-end;}
    .area_tit h2 {position: absolute; z-index: 10; background: #fff; margin-bottom: 15px; width: calc(100% - 30px); font-size: 20px; height: 55px; line-height: 45px;}
    .banner_crt {width: 250px;}
}

@media (max-width:500px) {
    .area_tit h2 span {display: none;}
}

/* 공통 */
#wrap {width: 100%; height: auto; min-height: calc(100% - 150px); background: #fff; margin-top: 101px; min-height: calc(100vh - 251px);}
#container {width: 1240px;  margin: 0 auto 50px;  height: auto; min-height: 300px; padding: 0 10px;}

.cont_tit {text-align: center;  margin: 50px auto; }
.cont_tit h2 {position: relative; display: inline-block; font-size: 2em; z-index: -0;}
.cont_tit h2:before {content: "";position: absolute; left: -100px; bottom: 3px; width: calc(100% + 200px); height: 7px; background: linear-gradient(90deg, transparent, #b5ebb2, transparent); z-index: -1;}

.summernote {background: #fff;}

@media (max-width:1024px) {
    #wrap {margin-top: 102px;}
    #container {width: 100%; padding:0 15px;}
}

@media (max-width:768px) {
  
}

@media (max-width:500px) {
    #wrap {margin-top: 80px;}
    .cont_tit {  margin: 30px auto; }
    .cont_tit h2 { font-size: 1.5em;}
    .cont_tit h2:before { left: -20px; bottom: 2px; width: calc(100% + 40px); background: #b5ebb2;}
}



/* --- user ---------------------------------------------------------------------------------------------------------------- */
.user_form { min-height: 600px; display: flex; flex-direction: column; max-width: 1000px; align-items: center; margin: 0 auto;}
.user_form.login {max-width: 400px;}
.user_form.login .form {padding: 30px 20px 30px;}
.user_form .cont_tit {padding: 50px 0 0;}

.user_form .form { padding: 50px 200px 30px; background: #f2fff9; border-top: 3px solid #28b165; border-bottom: 1px solid #28b165; width: 100%; max-width: 1000px;}
.user_form .form ul {width: 100%; border: 1px solid #ccc; border-radius: 5px; background: #fff; margin-bottom: 10px;}
.user_form .form ul li{position: relative; width: 100%;border-bottom: 1px solid #f1f1f1; padding: 5px 15px; }
.user_form .form ul li .op_txt {position: relative; display: block; font-size: 12px; margin-left: 30px; color: #f11;}
.user_form input[type="text"], input[type="password"] {width: calc(100% - 30px); border: none; }
.user_form .form ul li>i{color: #fff;vertical-align: middle; margin-top: 7px; margin-right: 5px; }
.user_form .form ul li>i.xi-check {vertical-align: middle;color: #f11; margin-top: 0px; margin-right: 5px;}
.user_form .id_heck {position: absolute; width: 80px; height: 26px; right: 10px; top: 8px;line-height: 28px; text-align: center; border-radius: 5px; background: #28b165; color: #fff; vertical-align: middle;}

.user_form p {margin: 10px 0 10px;}
.user_form input[type="checkbox"] {zoom:1; width: 20px; height: 20px; margin-right: 10px;}

#subData select {width: calc(100% - 30px); border:none;}

.user_form input[type="radio"] {zoom:1; width: 20px; height: 20px; margin-right: 5px;vertical-align: sub;}
.user_form p.selec {padding-left: 10px;}
.user_form p.selec span {vertical-align: bottom; margin-right: 10px;}

.user_form textarea.input {border: none;padding: 7px 5px; width: calc(100% - 30px); min-height: 60px;}

.user_form .flexbt {display: flex; justify-content: space-around;}
.user_form .flexbt a {color: #999; border: 1px solid #ededed; width: 100%; text-align: center; margin: 5px; padding: 5px; border-radius: 5px; font-size: 0.8em;}
.user_form .flexbt a:hover {background: #fff;transition: 0.5s;}

.mddown {background: none; float: right;padding: 1px 4px;}
.mddown i.on{transform: rotateX(180deg);}
textarea[class*="terms0"] {display: none;}

@media (max-width:1024px) {
    .user_form .form { padding: 50px 20PX; 30px; max-width: 600px;}
    .user_form .form ul li{position: relative; width: 100%;border-bottom: 1px solid #f1f1f1; padding: 2px 5px; }
}




/* -------------협동조합 소개 ------------------------------------------------------------------------------------------------ */
/* 인사말,소개 */
.cont_ed { padding: 20px; max-width: 1000px; margin: 0 auto 100px; }
.cont_ed h1 {margin-bottom: 50px;}
.cont_ed h2 {margin-bottom: 20px; font-size: 1.3em; font-weight: 400;}
.cont_ed .justify {text-align: justify;}
.cont_ed p {margin-bottom: 10px; font-size: 1.4em;line-height: 1.8em;}

@media (max-width:768px) {
    .cont_ed,.cont_ed_img { padding: 0px;}
}

/* 조직도 */
.organization_chart_img {width: 100%; max-width: 1000px; display: block; margin: 0 auto 50px;}
.organization_chart_img img {width: 100%;}

.organizationTel {max-width: 800px; margin: 0px auto 0;}
.organizationTel p {font-weight: 600;font-size: 1.2em;}

table.organization {border-top: 5px solid #85c682; width: 100%; max-width: 800px; margin: 0 auto; text-align: center; font-weight: 500; font-size: 1em;}
table.organization tr {border-bottom: 1px solid #babcbe;}
table.organization th,table.organization td {border-right: 1px solid #babcbe; height: 50px;padding: 0 5px; font-size: 1.2em; color: #666; }
table.organization th:last-child,table.organization td:last-child {border-right: none;}
table.organization th {background: #f8f8f8; }
table.organization td:nth-child(1) {width: 30%;}
table.organization td:nth-child(2) {width: 20%;}
table.organization td:nth-child(3) {width: 50%;}

/*연혁*/
.history { width: 100%; max-width: 600px; margin: 0 auto 0px; padding: 0 0 100px; }
.history h2 {position: relative; margin: 50px 0 30px; border-left: 5px solid #28b165; padding: 10px 20px; line-height: 1;z-index: 2; color: #fff;}
.history h2:before {content: ""; position: absolute; width: 100%; height: 100%; background: linear-gradient(90deg, #aacdb9, transparent); top: -0px; left: 0px; z-index: -1;}

.history ul {margin-left: 50px;}
.history ul li {position: relative; margin-bottom: 15px; display: flex;}
.history ul li:after {content: ""; position: absolute; width: 2px; height: 100%; background: linear-gradient(180deg, #aacdb9, transparent);; top: 40px; left: 19px;}
.history p {font-size: 1.4em;}
.history .month {position: relative; margin-right: 10px; width: 40px; height: 40px; background: #aacdb9; color: #fff; display: inline-block; border-radius: 50%; text-align: center;  font-size: 0.8em;  vertical-align: top; white-space: nowrap;line-height: 40px;}
.history .cont { flex: 1; padding-top: 7px; font-size: 1.3em; line-height: 1.5em; color: #666;}

.history .month select {min-width: 50px; min-height: 30px; margin-left: -5px; padding: 0;}
.history .cont input[type="text"] {width: calc(100% - 120px); height: 30px;margin-top: -4px;}

.history h2 .add {border: 1px solid #999; padding: 3px 10px; border-radius: 3px; margin-left: -5px; font-size: 16px;}
.history .ead {position: absolute; top: 10px; right: 0;}
.history .ead button {border: 1px solid #999; padding: 3px; border-radius: 3px; }

.history ul li.edit{}

@media (max-width:500px) {
    .history ul {margin-left: 10px;}
}


/* 오시는 길*/
.map {margin: 0 auto 100px;; display: block;width: 100%; max-width: 1000px; }
.waytocome {margin: 50px 0; font-size: 1.2em; font-weight: 500; }
.waytocome p {display: flex; margin-bottom: 5px;}
.waytocome p b {width: 100px; }
.waytocome p span {flex:1; }

@media (max-width:600px) {
    .waytocome p b {width: 80px;}
}

/* --- 조합원 소개 ---------------------------------------------------------------------------------------------------------------*/
.MembershipStatus {}
.MembershipStatus table {position: relative; width: 100%; max-width: 800px; margin: 0 auto; text-align: center; margin-bottom: 50px;  }
.MembershipStatus table tr:nth-child(2n) {background: #f9f9f9;}
.MembershipStatus table th {font-size: 1.2em; background: #dbede3;}
.MembershipStatus table td {border-right: 1px solid #eee; font-size: 1.1em;}
.MembershipStatus table td:nth-child(3) {cursor: pointer;}
.MembershipStatus table td:nth-child(3):hover {color:#7fcf9c;}
.MembershipStatus table td:last-child {border-right: none;}

.MembershipStatus .meb_more {font-size: 12px; position: absolute; right: 10px; padding: 6px; vertical-align: middle; color: #224c90; font-weight: 500; opacity: 0.5}
.MembershipStatus .meb_more:hover {text-decoration: underline; opacity: 1; transition: 0.3s;}

.tb_hd {display: flex; justify-content: space-between; align-items: center;}
.tb_hd select {max-width: 250px;}
.tb_hd p {display: inline-block; font-weight: 500; color: #3252bf; font-size: 1.2em; padding: 0 10px;}

.ceri_area {overflow-y: hidden; overflow-x: auto; white-space: nowrap; vertical-align: text-top; margin: 10px 0px 50px ; padding: 0; clear: both; }
.ceri_award { width: 100%; height: auto; white-space: normal; line-height: 1.6; vertical-align: top; text-align: center;  }
.ceri_area::-webkit-scrollbar {height: 5px;}
.ceri_area::-webkit-scrollbar-thumb {background-color: #a2a2a2; border-radius: 5px; background-clip: padding-box;}
.ceri_area::-webkit-scrollbar-track {background-color: #f1f1f1; border-radius: 5px;}

.ceri_award table {width: 100%;min-width: 1000px; margin: 0 auto;}
.ceri_award table th,.ceri_award table td {padding: 10px;
font-size: 1.1em;}
.ceri_award table td {vertical-align: top;}
.ceri_award.partner table td:nth-child(3) {text-align: left;}
.ceri_award.corporation table td:nth-child(2),.ceri_award.corporation table td:nth-child(3) {text-align: left;}
.ceri_award.corporation table td:nth-child(4) {cursor: pointer;}
.ceri_award.corporation table td:nth-child(4):hover {color:#7fcf9c;}
@media (max-width:600px) {
    .MembershipStatus table th {text-align: left; padding-left: 20px;}
    .ceri_award table {min-width: 800px;}
}

/* --- 주요사업 ----------------------------------------------------------------------------------------------------------- */
/*주요사업분야*/
.business.nom { margin: 20px; padding: 220px 0; background: url(../images/business_bg.png); background-repeat: no-repeat; background-position: center; position: relative; background-size: 70%;}

.business [class*="box"] {width: 400px; height: 250px; border-radius: 20px; padding: 30px; font-size: 1.1em; color: #6b6f6d; position: absolute; line-height: 1.75em;}
.business.nom [class*="box"]:hover {transform: scale(1.1); transition: 0.43s;z-index: 10;}
.business.nom .sm_tit {text-align: center;margin-bottom: 10px; font-size: 1.3em; font-weight: bold;}
.business.nom .list {vertical-align: middle; height: 200px; display: flex; align-items: center; height: 150px; }
.business.nom .box1 {background:rgba(255, 208, 208, 0.7); box-shadow:5px 5px 30px rgba(148, 53, 53, 0.5); top: 0; left: 0;z-index: 0;}
.business.nom .box1 .sm_tit {color: #ba2c2c;}
.business.nom .box2 {background:rgba(210, 228, 253, 0.7); box-shadow:5px 5px 30px rgba(29, 65, 116, 0.5); top: 0; right: 0;z-index: 0; }
.business.nom .box2 .sm_tit {color: #174b93;}
.business.nom .box3 {background:rgba(255, 203, 254, 0.7); box-shadow:5px 5px 30px rgba(122, 36, 120, 0.5); bottom: 0 ;left: 0; }
.business.nom .box3 .sm_tit {color: #ce48cb;}
.business.nom .box4 {background:rgba(255, 246, 184, 0.7); box-shadow:5px 5px 30px rgba(175, 162, 66, 0.5); bottom: 0 ;right: 0;}
.business.nom .box4 .sm_tit {color: #beaf4a;}
.business.nom .center_bus {position: relative; z-index: 1; display: block;  padding: 80px 50px 90px;; width: 500px; height: auto; background: rgba(127, 207, 156, 0.7); box-shadow:5px 5px 30px rgba(43, 118, 71, 0.5); margin: 0px auto; display: block; border-radius: 20px; font-size: 1.2em; line-height: 1.5; color: #0d6233;}
.business.nom .center_bus h2 {font-size: 1.3em; margin: 10px 0 10px; }

@media (max-width:1024px) {
    .business.nom { padding: 20px;}
    .business.nom [class*="box"] {position: relative; height: auto; margin:0 auto 30px; border-radius: 10px;}
    .business.nom .list {height: auto;}
    .business.nom .center_bus {width: 400px; padding: 20px; border-radius: 10px;}
}
@media (max-width:500px) {
    .business.nom {padding: 0; margin: 10px;}
    .business.nom [class*="box"] {width: 100%;}
    .business.nom .center_bus {width: 100%; }
}


/*원자로 계통 설계 기술*/
.technology {display: flex; width: 100%; justify-content: space-evenly; flex-wrap: wrap;justify-content: flex-start}
.technology li { width: 16.66%; text-align: center; font-size: 0.9em;  background: linear-gradient(0deg, #e4e8e7, #edffeb); color: #464646; border: 1px inset #28b165;padding: 10px 2px; cursor: pointer; border-top: 3px solid #177422; transition: 1s; font-weight: 500;align-items: center;}
.technology li p { margin: 1px;}
.technology li:hover {background: linear-gradient(180deg, #94d0bb, #e4f7f7); transition: 1s; box-shadow: inset 1px 1px 3px rgba(92, 92, 92, 0.5);text-shadow: -1px -1px 1px rgba(255, 255, 255, 1);}
.technology li.on {background: linear-gradient(180deg, #94d0bb, #e4f7f7); box-shadow: inset 1px 1px 3px rgba(92, 92, 92, 0.5);text-shadow: -1px -1px 1px rgba(255, 255, 255, 1)}

.technology_area {position: relative; width: 100%; /*max-width: 1000px;*/ margin: 50px auto; font-size: 1.2em; line-height: 1.8em;}
.technology_area h2 { position: relative;text-align: center; margin-bottom: 30px; z-index: 1;}
.technology_area h2:before {content: ""; position: absolute; bottom: 0px; left: 0; width: 100%; height: 10px; background: #d4efe9; z-index: -1; }

.technology_area p {text-align: justify; margin-bottom: 30px; }
.technology_area ul {padding-left: 30px; margin: 20px 0 30px;}
.technology_area ul ul{padding-left: 30px; margin: 5px 0 5px;}
.technology_area img {position: relative; width: 100%;}
.technology_area:after {content: ""; position: absolute; bottom: -20px; left: 0; width: 100%; height: 10px; background: #d4efe9; z-index: 1; }

@media (max-width:1024px) {
    .technology li { width: 25%;}
}
@media (max-width:850px) {
    .technology li { width: 33.33%;}
}
@media (max-width:500px) {
    .technology li { width: 50%;}
}

/* 사업 수행실적 */
.business.performance {}
.business.performance ul { max-width: 900px; margin: 0 auto;}
.business.performance ul li {position: relative; padding: 30px 10px 10px 60px; border-bottom: 1px dotted #111; display: flex; flex-wrap: wrap; align-items: flex-start;}
.business.performance ul li .number {position: absolute; top: 24px; left: -0px; width: 50px;  font-size: 2em; font-weight: bold; color: #1fa059;}
.business.performance ul li p.tit {font-size: 1.5em; display: block; color: #28b165; width: 100%;}
.business.performance ul li p.tit a {margin-left: 10px; color: #afccbc; vertical-align: middle; transition: 0.3s;}
.business.performance ul li p.tit a:hover:after {display: block; transition: 0.3s;}
.business.performance ul li .period { display: block; width: 100%;  color: #7fcf9c; }
.business.performance ul li p.cont {padding: 5px 0; width: 100%;}
.business.performance ul li .bot {width: 100%; text-align: right; padding: 0px 0 10px; color: #999;}
.business.performance ul li .bot span {min-width: 80px; display: inline-block; text-align: center; margin-left: 20px;}

@media (max-width:500px) {
    .business.performance ul li {position: relative; padding: 30px 10px 10px 40px;}
    .business.performance ul li .number {width: 40px;}
}


/* --- 커뮤니티 ----------------------------------------------------------------------------------------------------------- */
.board_area {max-width: 1000px; margin: 0 auto; padding: 10px 0;}
.imp {color: #f71414;}

.board_area .right {text-align: right}

.board_area .summary {border: 1px solid #eee; background: #f9fffc; padding: 20px 30px;width: 100%; max-width: 600px; border-radius: 10px; margin: 0 auto;}
.board_area .summary p {color: #28b165;}
.board_area .summary p span {color: #909090;; font-size: 0.8em;}
.board_area .summary p span b{color: #ea1515;}

.board_area .summary + div {background: #fefefe; border: 1px solid #eee; padding: 30px 50px; width: 100%; max-width: 600px; margin: 30px auto; border-radius: 20px; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.3); line-height: 2;}
.board_area .summary + div h2 {color: #111;}

.board_area .tb_hd {justify-content: flex-end;}
.board_area .search {margin-right: 10px;}
.board_area .search input[type="text"] {border: none; border-radius:  0;border-bottom: 2px solid #28b165; height: 28px;padding-left: 10px;}
.board_area .search button {width: 33px; height: 32px; display: inline-block; border-top-right-radius: 2px;border-bottom-right-radius: 2px;}

table.notice {position: relative;margin-top: 30px;z-index: 1;}
table.notice:after {position: absolute; content: ""; width: calc(100% + 40px); height: calc(100% + 20px); top: -10px; left: -20px; border-radius: 10px;; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);z-index: -1;}
table.notice thead tr {background: linear-gradient(45deg, #d5f4e2, #dff0e7);}
table.notice tbody tr:hover {background: #fafafa;}
table.notice tbody tr.important {font-weight: bold; }
table.notice th{background: transparent; }
table.notice th,table.notice td { padding: 15px 0;}
table.notice td {text-align: center; cursor: pointer;}
table.notice td:nth-child(2) {text-align: left; padding-left: 20px;max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space : nowrap;}
table.notice td i {font-size: 1.25em; vertical-align: bottom; margin-left: 5px; color: #28b165;}
table.notice td i.xi-flag {color: #ff8b8b; margin-left: 0;}

table.view { margin: 10px auto 30px;}
table.view th {background: inherit; font-size: 1.4em;}
table.view tr:first-child th {border-top: 5px solid #28b165;}
table.view th,table.view td {padding: 15px;}
table.view  .writing_infor {display: flex; justify-content: center; font-weight: 400;}
table.view  .writing_infor li {position: relative; padding: 0 20px;}
table.view  .writing_infor li:after {position: absolute; content: ""; width: 1px; height: 16px; background: #a8a8a8; right: 0; top: 50%; margin-top: -7px;}
table.view  .writing_infor li:last-child:after {display: none;}
table.view  .writing_infor li span {color: #bcbcbc;}
table.view  .writing_infor li i {font-size: 1.2em; vertical-align: middle; color: #bcbcbc ;}
table.view .baco {background: #f9fffc;}
table.view .baco td:first-child {text-align: center; font-weight: 600;}
table.view .baco td:nth-child(n+1) {border-left: 1px solid #eee;}

table.writing { margin: 10px auto 30px;}
table.writing tr:first-child th {border-top: 5px solid #28b165;}
table.writing th {background: inherit;}
table.writing td {padding: 10px 5px; height: 50px;}
table.writing th:nth-child(2){text-align: left;}
table.writing .baco td:first-child {text-align: center; }
table.writing .baco td:nth-child(n+1) {border-left: 1px solid #eee; padding-left: 20px;}
table.writing .baco {background: #f9fffc;}
table.writing input[type="text"] {width: 100%;}
table.writing input[type="radio"] {margin: 0 30px 0 5px;}
table.writing input[type="checkbox"] {margin: 0 30px 0 5px;}

.download {}
.download:hover {text-decoration: underline;}
.download i {font-size: 1.2em; vertical-align: middle;margin: -3px 5px 0; color: #6792c4;}

textarea.terms {width: 100%; min-height: 100px; background: #fff;}

@media (max-width:1024px) {
    table.notice:after {display: none;}
}
@media (max-width:600px) {
    .writing_infor i,.writing_infor span {display: none; }
}


/* 파일업로드 */
.fileup { width: 100%; max-width: 300px; background:none;}
.filebox { display: flex; margin: 5px 0;}
.filebox .upload-name {padding: 5px; border-radius: 0px;}
.filebox .file_nomal { display: inline-block; width: 100px; height: 32px; line-height: 32px; text-align: center;  vertical-align: middle; cursor: pointer; border-radius: 0px; margin-top: 0px;background: #28b165; color: #ffffff; border-radius: 0; font-size: 1em;} 
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.fileup button.nomal {vertical-align: middle; margin: -1px 0 0 2px; width: 30px;}

.filebox .delete {margin-left: 5px;}
.filebox .delete svg {zoom:2;}


/* 댓글 */
.comment_area table.comment {border-top: 2px solid #28b165; margin-top: 50px; }
.comment_area table.comment tr {border-top: }
.comment_area table.comment th {background: #f9fffc; border-right: 1px solid #eee;}
.comment_area table.comment td { padding: 10px 10px;}
.comment_area table.comment .name { display: block; margin-bottom: 5px; padding: 5px; color: #8b8787; display: inline-block; margin-right: 20px;}
.comment_area table.comment .name+span {color: #aaa; font-size: 0.8em; margin-right: 10px;}
.comment_area table.comment .name i { font-size: 1.6em; vertical-align: middle; color: #9fe5be; margin-right:5px; }
.comment_area table.comment .writing_flex {display: flex;}
.comment_area table.comment textarea.writing { display: block; width: calc(100%); resize: vertical; min-height: 80px;}
.comment_area table.comment .com_bt {margin-left: 20px; width: 70px; }
.comment_area table.comment .com_bt button { width: 70px; margin-bottom: 5px; border: none;}
.comment_area table.comment p.writing {padding: 5px 10px; font-family: "Noto Sans KR", "tahoma", "dotum", 맑은고딕, 돋움, sans-serif;}
.comment_area .manag {display: inline-block; vertical-align: middle;}
.comment_area .manag button {background: none; width: 60px; border: 1px solid #9f9f9f; color: #9f9f9f; margin-right: 5px; border-radius: 15px; padding: 3px}



/* --- 관리자 ----------------------------------------------------------------------------------------------------------- */
.admin_hd {background: var(--main-color01); color: #fff; padding: 10px 10px 5px; border-bottom: 10px solid #6dd199; letter-spacing: 0.05em;}
.admin_hd span {font-size: 0.8em; color: #e0e0e0; margin-left: 10px;  display: inline-block; font-weight: 500;}

#admin_area {width: 100%; min-height: calc(100vh - 210px); min-width: 1280px; display: flex; background: #f7f7f7;}
.left_menu {width: 200px; background: #3c835b;border-right: 2px solid #cbcbcb;}
.left_menu svg[class*='fa'] {vertical-align: -0.2em; font-size: 22px; width: 20px; margin-right: 10px; color: #7dc49c;}
.adm_accordion {margin: 0px 0px 0; padding: 0px;}
.adm_accordion>li {font-size: 16px;padding: 5px 0 0; border-top: 1px solid #83ebb2; box-shadow: 0px -1px  1px rgba(11, 65, 35, 0.4); }
.adm_accordion>li:first-child { box-shadow: none; border-top:none;; }
.adm_accordion>li>a {color: #fff; font-weight: 500;padding: 10px 10px 10px; display: block;}
.adm_accordion>li>a:hover {color: #a5debe; }
.adm_accordion .sub_menu>li {font-size: 16px;padding: 6px 0px 6px 10px; background: #e5f5eb;}
.adm_accordion .sub_menu>li:hover {background: #c0e3d0;}
.adm_accordion .sub_menu>li a{color: #28b165; display: block;padding: 5px;font-weight: 500;}
.adm_accordion .sub_menu>li a:hover{}

.admin_cont {padding: 30px; flex: 1;}
.admin_cont h2{padding: 10px 20px; flex: 1; color: #a3a3a3;}


.adm_hd {background: #d8eae0; border-radius: 10px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);}
.adm_hd ul {width: 100%;  padding: 10px 20px;}
.adm_hd ul li {display: inline-block; margin-right: 20px;}
.adm_hd ul li select {min-width: 150px; border: none;}
.adm_hd ul li span { margin-right: 5px; font-weight: 500; vertical-align: middle;}

.adm_hd .search {display: inline-block;background: #fff; padding: 2px;border-radius: 5px; margin-left: 5px;}
.adm_hd .search input[type="text"] {display: inline-block;border: none; border-radius: 0; }
.adm_hd .search button {position: relative; width: 35px; height: 32px; vertical-align: middle; border: none; font-size: 20px; background: #fff; color: #28b165;}
.adm_hd .search button i{position: absolute;top: 5px; left: 8px;}

.adm_tb {width: calc(100% - 40px); position: relative;z-index: 1; margin-left: 20px; margin-top: 20px;}
table.adm_tb:after {position: absolute; content: ""; width: calc(100% + 40px); height: calc(100% + 20px); top: -10px; left: -20px; border-radius: 10px;; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);z-index: -1;}
.adm_tb tbody tr {cursor: pointer;}
.adm_tb td{text-align: center;}
b.ty01 {color: #67c34b}
b.ty02 {color: #bc2c2c}
b.ty03 {color: #eee}

.popbg {display: none; position: fixed;top: 0; left: 0;  width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 999; justify-content:center; align-items: center;}
.adm_popupcont { width: 100%; max-width: 700px; height:auto; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);}
.pop_hd {width: 100%; padding: 10px 20px; background: #28b165; font-size: 24px; font-weight: 500; letter-spacing: 2px; color: #fff;}
.pop_hd span {padding-top: 5px; display: inline-block;}
.pop_hd .popupclose{float: right; font-size: 28px; margin-top: 3px; background: none; color: #fff;}

.popupcont_ar {padding: 20px 10px; max-height: calc(100% - 160px); overflow: auto;}
.popupcont_ar li {margin-bottom: 5px; vertical-align: text-top; vertical-align: top;}
.popupcont_ar li>* { vertical-align: top;}
.popupcont_ar li span {width: 150px; display: inline-block; text-align: right; margin-right: 10px;margin-top: 0.5em;}
.popupcont_ar li select,.popupcont_ar li input[type="text"],.popupcont_ar li input[type="password"] {min-width: 495px;}
.popupcont_ar li select {margin-left: 4px;}
.popupcont_ar li textarea {width: 495px;border: 1px solid #c7c7c7; height: 100px; border-radius: 5px;}
.popupcont_ar li .alarm {font-family:  "Noto Sans KR", "tahoma", "dotum", 맑은고딕, 돋움, sans-serif; font-size: 0.8em; color: red; margin-left: 170px; margin-top: 3px;}
.adm_popupcont .btn_area {margin: 10px 20px; text-align: right; padding: 0px 0 20px;}
.adm_popupcont .btn_area button:nth-child(n+1) {margin-left: 5px;}

.field_management {height: 100%; max-height: calc(100% - 200px); align-items: flex-start;}
.field_management .left {width: 700px; padding: 5px;height: 100%;  border: 1px solid #d7d8d9; border-radius: 5px; margin: 0 20px;}
.field_management .left table{margin: 0;}
.field_management .left .mCscrollbar{height: calc(100% - 50px); }
.field_management .left .mCscrollbar tr {cursor: pointer;}
.field_management .left .mCscrollbar tr:hover{background: #fff;}
.field_management .left table {text-align: center; position: relative; top: 3px }
.field_management .left table tr td:last-child{ text-align: left;}

.field_management>.right { width: 500px; display: flex; flex-direction: column; justify-content: center;}
.field_management .right .codeinput {margin: 0  20px ; background: #fff; border-radius: 10px; padding: 30px 20px; width: 100%; box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);}
.field_management .right .codeinput li{margin: 5px; }
.field_management .right .codeinput li span {width: 100px; display: inline-block; text-align: right; margin-right: 10px;}
.field_management .right .codeinput li input {width: 330px;}
.field_management .right .btn_area {text-align: right; padding: 20px 0px; width: 100%; margin: 0 20px;}

.adm_popupcont .btn_area .btnty02 {padding: 7px 5px;}
.adm_popupcont .btn_area .btnsi10 {width: 110px;}

@media (max-width:768px) {
    .popupcont_ar li span {text-align: left}
    .popupcont_ar li select,.popupcont_ar li input[type="text"],.popupcont_ar li input[type="password"]  {min-width: 0px; width: 100%;}
    .popupcont_ar li textarea {width: 100%;}
    .popupcont_ar li .alarm {margin-left: 5px;}
}

/*사업수행*/
.field_management table.performance {}
.field_management table.performance td:last-child { padding-right: 10px;}

.field_management .codeinput.performance {}
.field_management .codeinput.performance li {width: 100%;}
.field_management .codeinput.performance li span { max-width: 100px; min-width:100px; vertical-align: top;padding-top: 5px;}
.field_management .codeinput.performance li .inp_period {width: calc(100% - 120px); display: inline-block;}
.field_management .codeinput.performance li .inp_period input {width: 155px;}
.field_management .codeinput.performance li textarea {width: 330px; height: 133px;}
.field_management .codeinput.performance input[type="file"] {padding: 2px;}

/* 비밀번호 변경 */
.passForm input[type="password"]{ width: 150px;   background: #fff;   border: 1px solid #c7c7c7;    border-radius: 5px;}


/*error*/
.error {padding: 0px 20px 100px;}
.error_img {display: block; margin: 0 auto; width: 100%; max-width: 600px;}
.error button {height: 50px; margin: 0 10px}

.data_popup {color: #d92c2c;}
.data_popup label{color: #111;}
.data_popup .btn_area.right {text-align: center; }
.data_popup .btn_area.right button {width: 150px; height: 50px; line-height: 40px; font-size: 20px;}

/* 썸머노트 */
.note-btn {height: 30px;}

/* footer */
a#MOVE_TOP_BTN {position: fixed;right: 2%;bottom: 3%;display: none;z-index: 999;background:#28b165 ; width: 50px; height: 50px; box-sizing: border-box;  text-align: center; color: #fff; font-size: 26px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius: 3px;}
a#MOVE_TOP_BTN i {vertical-align: middle; line-height: 50px;}

footer {height: 150px; background: #8c8c8c;position: relative; bottom: 0px;}
#footer {width: 100%; max-width: 1280px; margin: 0 auto; padding: 10px;box-sizing: border-box;background: #8c8c8c; height: 100%; display: flex; align-items: center;}

footer .logo {float: left; width: 300px; margin-right: 50px; padding: 10px; }
footer .logo img{width:100%; vertical-align: middle; }  
footer .add {float: left;}
footer .add p {display: inline-block; color: #fff; margin-right: 20px;}
footer .add p a {display: inline-block; color: #fff;}

@media (max-width:1024px) {
    #footer {flex-direction: column; align-items: flex-start; padding-left: 20px;}
    footer .add {padding-left: 10px;}
}

@media (max-width:768px) {
    footer {height: 180px; overflow: hidden;}
}

@media (max-width:500px) {
    
}

.note-btn {line-height: 1;}





/* majorCode background */
.selectedCode{
	background-color: #fff;
}