@charset "utf-8";

.master-container input{
	
}

.widthToggle {
	padding: 0 10px 10px 10px;
	width: 20%;
}

.row {
	display: flex;
}

.column {
	padding: 10px;
	height: auto;
	width: 1180px;
}

.member-container input.required::placeholder {
	color: #E4005C;
}

.member-container * {
	font-family: "Noto Sans KR", sans-serif";
}

.member-container input[type="radio"] {
	display: none;
}

.member-container  input[type="radio"]+label {
	width: 37px;
	height: 36px;
	line-height: 24px;
	padding-left: 20px;
	display: inline-block;
	background: url(../../img/check_off.png) no-repeat 0 0;
	background-size: 24px 24px;
	vertical-align: middle;
	cursor: pointer;
}

.member-container input[type="radio"]:checked+label {
	width: 37px;
	height: 36px;
	line-height: 24px;
	padding-left: 20px;
	display: inline-block;
	background: url(../../img/check_on.png) no-repeat 0 0;
	background-size: 24px 24px;
	vertical-align: middle;
	cursor: pointer;
}

.memberList-container .memberList {
	width: 100%;
	border-collapse: collapse;
	font-family: "NotoKrL", sans-serif;
	color: #ffffff;
}

.memberList-container .memberList tr {
	background-color: #222d3e;
	height: 60px !important;
	font-size: 16px;
	text-align: center;
}

.memberList-container .memberList tr:hover:not(.notHover){
	background-color: rgb(49, 65, 87);
	color: #fff;
}

.memberList-container .memberList tr th {
	background-color: #354053;
	height: 56px;
	font-size: 15px;
	color: #ffffff;
}

.memberList-container .memberList tr td {
	padding: 2px;
	cursor: pointer;
}

.memberSelectBox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 380px;
	background-color: transparent;
	padding: 10px;
	height: auto;
}

.memberSelectBox select, .memberSelectBox select option {
	font-size: 14px;
	padding: 20px 6px;
	color: #ffffff;
	background-color: #1E2126;
	text-align: center;
}

.memberSelectBox button {
	padding: 20px 26px;
	color: #ffffff;
	background-color: transparent;
	font-size: 16px;
	border-bottom: #A0A1A1 4px solid;
}

.btn-box {
	display: flex;
	justify-content: space-around;
	width: 1180px;
	align-items: center;
	padding: 10px;
	height: auto;
}

.blue-btn {
	width: 100px;
	height: 36px;
	color: #fff;
	font-size: 14px;
	font-family: "NotoKrM", sans-serif;
	padding: 0;
	margin: 0;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	border-radius: 50px;
	background-color: #354557;
}

.member-container input {
	color: #231815;
	padding: 0 10px;
	box-shadow: inset 2px 2px 0 0 #fff !important;
	border-radius: 0 !important;
}
.member-container #memberWrite{
	position: relative;
}
.font_L {
	font-size: 24px;
}

.font_M {
	font-size: 20px;
}

.font_S {
	font-size: 12px;
}

.text_left {
	text-align: left;
}

input:disabled {
/* 	background-color: #ffffff; */
	/* background-color: red; */
}

.member-container {
	background-color: #F5F5F5;
	width: 100%;
	height: 100%;
	border-radius: 26px;
}

/* memberInfo-top */
.memberInfo-top {
	width: 100%;
	height: 100px;
	display: flex;
	justify-content: space-around;
	align-items: center;
	border-bottom: solid #A0A1A1 3px;
	border-width: 20%;
}

.memberInfo-top .member_num {
	flex-grow: 1;
	text-align: center;
}

.memberInfo-top .member_num * {
	margin: 6px 0;
}

.memberInfo-top img {
	margin: 20px 20px 0 20px;
}

.member_point {
	display: flex;
	margin: auto 5px;
}

.member_point div {
	padding: 11px 20px;
	background-color: #C2B59B;
	color: #F5F5F5;
}

.member_point input[type="text"] {
	margin: auto 0;
	width: 126px;
	height: 36px;
	border: #C2B59B 1px solid;
	text-align: center;
}

.memberInfo-top .hoverBtn {
	display: flex;
	align-items: center;
	flex-grow: 1;
	justify-content: center;
}

.memberInfo-top .hoverBtn button {
	padding: 20px 30px;
	border: none;
	border-bottom: solid #A0A1A1 4px;
	border-radius: 0%;
	background-color: transparent;
	cursor: pointer;
}

.memberInfo-middle {
	display: flex;
	margin-top: 40px;
}
/* memberInfo-aside */
.memberInfo-aside {
	display: flex;
	flex-direction: column;
	/* justify-content: center; */
	align-items: center;
	width: 30%;
}

.memberInfo-aside:first-child {
	
}

.memberInfo-aside>* {
	margin-top: 50px;
	margin: 10px 0px 10px 15px;
	text-align: center;
}

.memberInfo-aside .member_img label {
	padding: 5px;
	color: #000000;
	cursor: pointer;
}

.memberInfo-aside .imgBox {
	width: 180px;
	height: 180px;
	border: 6px solid #F9BE00;
	border-radius: 15%;
	margin-bottom: 10px;
	overflow: hidden;
}

.memberInfo-aside .imgBox>img {
	width: 100%;
	height: auto;
	margin: auto 0;
}

.memberInfo-aside .member_status {
	display: flex;
	flex-direction: row;
}

.memberInfo-aside .member_status :first-child {
	border: #C2B59B 1px solid;
	padding: 16px 12px;
	margin: auto 0;
}

.memberInfo-aside .member_status select {
	width: 120px;
	height: 52px;
	background-color: #33AD37;
	color: #F5F5F5;
	border: none;
	border-radius: 0%;
	text-align: center;
}

.memberInfo-main {
	margin: 0px 20px 0px 20px;
}

.memberInfo-main table {
	width: 100%;
	text-align: center;
	font-size: 12px;
}

.memberInfo-main table tr {
	height: 40px;
}

.memberInfo-main .title {
	background-color: #D2DFE6;
}

.memberInfo-main .memberInfo_name {
	display: flex;
	justify-content: space-between;
	align-content: center;
}

.memberInfo-main .memberInfo_name input[type="text"] {
	width: 70%;
	height: 40px;
	border: 1px solid #C2B59B;
}

.date-box {
	display: flex;
	justify-content: space-between
}

.date-box input[type="text"] {
	width: 83%;
	height: 40px;
	margin: 0;
	border: 1px solid #C2B59B;
}

.date-box img {
	width: 38px;
}

.input-box {
	width: 100% !important;
	height: 40px !important;
	color: #000000 !important;
	border: 1px solid #C2B59B !important;
	border-radius:0 !important;
	box-shadow: inset 2px 2px 0 0 #fff !important;
	font-size: 12px !important;
	padding: 0 10px !important;
}

.memberInfo-main .genderCheck {
	display: flex;
	margin-left: 7px;
}

.memberInfo-main .genderCheck * {
	position: relative;
	top: 20%;
}

.memberInfo-main input[type="text"]:not(.memberInfo_name *,.post *){
width:97%;
height:40px;
border:1px solid #C2B59B;
}
.select-box {
	width: 100% !important;
	height: 40px !important;
	border: 1px solid #C2B59B !important;
	font-size: 12px !important;
	padding: 0 10px !important;
}

.memberInfo-main .contact td:first-child {
	background-color: #C2B59B;
	color: #F5F5F5;
}

.memberInfo-main .contact select {
	border: none;
	background-color: #C2B59B;
	color: #F5F5F5;
	text-align: center;
}

.memberInfo-main .text_left {
	margin-left: 15px;
}

.memberInfo-main .post {
	width: 98%;
	border: 1px solid #C2B59B;
	background-color: #ffffff;
	/* text-align: center; */
}

.memberInfo-main .post_text {
	display: flex;
	align-items: center;
	justify-content: space-around;
	width: 100%;
}

.memberInfo-main .post_text input[type="text"] {
	width: 20%;
	height: 40px;
	border: none;
	text-align: center;
}

.memberInfo-main .post_text #addr1 {
	width: 50%;
	height: 40px;
	border: none;
	text-align: center;
}

.memberInfo-main .post_text button {
	width: 20%;
	height: 34px;
	background-color: #C2B59B;
	border-style: none;
	border-radius: 3px;
	color: #F5F5F5;
}

.memberInfo-main .post_detail {
	width: 100%;
	height: 40px;
	margin-top: 4px;
	border-style: none;
	padding: 0 10px;
}

.memberInfo-main .btnImg {
	margin: 0 auto;
	text-align: center;
}

.memberInfo-main .btnImg button {
	border: none;
	background-color: transparent;
	cursor: pointer;
	margin-top: 10px;
}

.memberInfo-main .btnImg img {
	width: 200px;
}

.memberInfo-main .weekday-box {
	background-color: #ffffff;
	border: 1px solid #C2B59B;
}

.memberInfo-main .weekday-box input[type="checkbox"] {
	height: 20px;
	width: 37px;
	position: relative;
	box-shadow: inset 0px 0px 0 0 #fff !important;
	margin: 0 auto;
}

.memberInfo-main .weekday-box span {
	width: 40px;
}

.remark {
	width: 100%;
	height: 140px;
	border: 1px solid #C2B59B;
	resize: none;
	color: rgb(59, 59, 59);
	padding: 10px;
}

.memberInfo-main .memberInfo-title {
	display: inline-block;
	float: right;
	margin: -10px 50px 5px 0;
	text-align: end;
	color: #C2B59B;
	font-size: 24px;
	border-bottom: 4px solid #E4005C;
}
/* memberInfo-detail */
.memberInfo-detail {
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-bottom: 20px;
}

.memberInfo-detail .nev-bar * {
	margin: 0;
	padding: 0;
}

.memberInfo-detail .nev-bar {
	display: flex;
	justify-content: center;
}

.memberInfo-detail .nev-bar ul li {
	list-style: none;
	display: inline-block;
}

.memberInfo-detail .nev-bar ul li button {
	background-color: #5E5E60 !important;
	color: #ffffff;
	display: inline-block;
	width: 120px;
	height: 60px;
	margin: 0 1px 10px 1px;
	border: none;
	border-radius: 0%;
	font-size: 14px;
}

.detail-contents {
	border: #E4005C 2px solid;
	border-radius: 10px;
	padding-bottom:30px;
	margin: 0 20px;
}

.detail-contents .btnImg button {
	border: none;
	background-color: transparent;
	cursor: pointer;
}

.detail-contents .btnImg img {
	width: 130px;
}

.detail-contents-top {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	margin-top: 30px;
}

.detail-contents-bottom {
	width: 100%;
	margin: 0 auto;
	margin-top: 15px;
}

.detail-contents-bottom table {
	width: 1050px;
	margin: 0 auto;
	margin-top: 5px;
}

.detail-contents-bottom tr {
	height: 40px;
}

/* .detail-contents-bottom td input[type="text"] {
	width: 95%;
	height: 40px;
	border: 1px solid #C2B59B;
} */
/* .detail-contents-bottom td select{
    width: 99%;
    height: 40px;
    border: 1px solid #C2B59B;
    font-size: 12px;
} */
/* .detail-contents-bottom td input[type="date"]{
    width: 98%;
    height: 40px;
    border: 1px solid #C2B59B;
    font-size: 12px;
} */
.detail-contents-bottom .title {
	background-color: #D2DFE6;
}

.detail-contents-bottom .contents {
	background-color: #ffffff;
	border: 1px solid #C2B59B;
}

.detail-contents-bottom table, tr, td {
	/* border: #000000 1px solid; */
	font-size: 14px;
	text-align: center;
}

.detail-contents-bottom button {
	width: 75px;
	height: 38px;
	border: none;
	cursor: pointer;
	color: #F5F5F5;
}

.detail-contents-bottom .GuideBtn {
	background-color: #26698c;
	width: 100%;
}

.detail-contents-bottom .modifyBtn {
	background-color: #F2BF00;
	/* 	width: 100%; */
}

.detail-contents-bottom .deleteBtn {
	background-color: #DF0515;
	/* 	width: 100%; */
}
.detail-contents-bottom .charge-table{
	border-collapse: collapse;
}
.detail-contents-bottom .charge-table tr:hover:not(.title) {
	background-color: #EDE8D4;
}
/* counsel-contents */
.counsel-contents {
	height: 80px;
}
/* pagination */
.pagination {
	display: inline-block;
	margin-top: 20px;
	margin-left: 35%;
}

.pagination a {
	color: #000000;
	padding: 8px 16px;
	text-decoration: none;
}

.pagination a.active {
	background-color: #E4005C;
	color: white;
}

.pagination a:hover:not(.active)
{
background-color:#ffffff;
}
button.active {
/* 	border-bottom: #E4005C 4px solid !important; */
}

.flex-cnt {
	display: flex;
}

.box-color-red {
	background-color: red;
	color: white;
	width: 40px;
	height: 40px;
}

.box-color-green {
	background-color: #00C900;
	color: white;
	width: 40px;
	height: 40px;
}

.box-color-yellow {
	background-color: #FBBA3D;
	color: white;
	width: 40px;
	height: 40px;
}
.pay-title{
	border-bottom: 4px solid #E4005C;
    position: absolute;
    right: -149px;
    top: -85px;
    height: 37px;
    line-height: 30px;
    color: white;
    width: 7%;
    font-size: 20px;
    text-align: center;
    padding: 5px 14px;
}
.pay{
	width: 20%;
    float: left;
    position: absolute;
    top: -20px;
    right: -276px;
    margin-top: -7px;
    height: 750px;
    border-radius: 10px;
    color: #ffffff;
}
.pay table{
	border-collapse: collapse;
}
.pay table tr{
	height: 40px;
}
.pay table tr:hover{
	background-color: #4C4646;
}

.pay table tr:first-child td{
	border-top: #9E9E9F 2px solid;
}
.pay table td{
	border-bottom: #9E9E9F 2px solid;
}
.calender-top{
	width: 100%;
	height: 100px;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.fixBox{
	width: 240px;
	display: flex;
	
}
.fixBox>div{
	width:80px;
    font-size: 15px;
    font-family: "NotoKrL", sans-serif;
    color: #f7f7fb;
    margin: auto 0;
}
.fixCol{
	position: sticky;
	left:0;
}

.infoTitleLe {
	width: 80px;
    height: 100%;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 5px;
}

.infoTitle {
	color: white;
    border-top: 0px;
    font-size: 14px;
    text-align: right;
    padding-right: 5px;
    width: 100px;
    height: 42px;
}

.infoDetail {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 170px;
}

.inputBorder {
	border: 1px solid #969797!important;
	color: black!important;
}

.midInfoTable {
	width: 98%;
}

.midInfoTable .title {
	color: white;
    font-size: 14px;
    text-align: right;
    padding-right: 5px;
    width: 100px;
    height: 45px;
}

.midInfoTable .contents {
	width: 140px;
}

.botInfoTable {
	width: 855px;
}

.botInfoTable .title {
	color: white;
    font-size: 14px;
    text-align: right;
    padding-right: 5px;
    width: 100px;
    height: 45px;
}

.botInfoTable .contents {
	width: 140px;
}

.infoSelect {
	width:150px;
	height: 30px;
}

.infoMemoTitle {
	width: 100%;
    text-align: center;
    font-size: 14px;
    color: white;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.infoMemo {
    padding: 10px;
    width: 260px;
    height: 164px;
    color: black;
    font-size: 14px;
}

.infoMemoArea {
	border: 3px solid white;
    border-radius: 20px;
    position: absolute;
    width: 276px;
    height: 220px;
    top: 485px;
    right: 245px;
}