@font-face {
  font-family: 'scdream';
  font-weight: 100;
  font-style: normal;
  src: url(/font/SCDream1.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 200;
  font-style: normal;
  src: url(/font/SCDream2.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 300;
  font-style: normal;
  src: url(/font/SCDream3.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 400;
  font-style: normal;
  src: url(/font/SCDream4.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 500;
  font-style: normal;
  src: url(/font/SCDream5.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 600;
  font-style: normal;
  src: url(/font/SCDream6.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 700;
  font-style: normal;
  src: url(/font/SCDream7.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 800;
  font-style: normal;
  src: url(/font/SCDream8.woff) format('woff');
}

@font-face {
  font-family: 'scdream';
  font-weight: 900;
  font-style: normal;
  src: url(/font/SCDream9.woff) format('woff');
}


/*--------------------------------------------------------------
# Basic
--------------------------------------------------------------*/


:root {
  --fsize-small: 0.7rem;
  --fsize-bsmall: 0.8rem;
  --fsize-sbasic: 0.9rem;
  --fsize-basic: 1.1rem;
  --fsize-mid: 1.3rem;
  --font-menu: 1.3rem;
  --font-title: 3.6rem;
  --font-stitle: 2.2rem;
  --font-body: 1.15rem;
  --font-xtitle: 2rem;
  --font-body: 1.15rem;
  --font-badge: 0.8rem;
  --font-table: 0.9rem;
  --font-basic: 1.1rem;
  --font-ztitle: 1.5rem;
  --font-basic-line: 2.2rem;
  --input-size: 1rem;

  --color-reds: #E81A20;
  --color-yellows: #FFE618;
  --color-blues: #255DC3;
  --color-greens: #00BCA1;
  --color-violet: #5B5AAA;
  --color-primary: #2136ac;
  --color-point-blues: #2136ac;


  --color-basic: #121212;
  --color-second: #353535;
  --color-third: #5f5f5f;
  --color-good: #29CC97;
  --color-bad: #E71A20;
  --color-point: #0f864b;
  --color-border: #cfcfcf;

  --color-normal: #255DC3;
  --color-seat: #F63707;
  --color-night: #000000;
  --color-village: #3A8810;
  --color-out: #000000;
  --color-lim: #9f14ac;

  --color-atag: #020202;
  --color-tbheader: #353535;

  --color-tbbg: #f1f3fd;
  --color-tbbgtop: #142064;
  --color-tbtxt: #020202;

  --color-tbbg-gray: #ebebeb;
  --color-tbbgtop-gray: #444444;
}




html {
  font-size: 14px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  font-family: 'scdream' !important;
}

body {
  font-family: 'scdream' !important;
  font-weight: 400;
  font-size: 14px;
}

.container-full {
  width: 100%;
}


h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "scdream", sans-serif;
  margin-bottom: 0px;
}

p {
  line-height: 1.55;
  color: #333;
  font-size: 400;
  font-family: "scdream", sans-serif;
}

h1 {
  font-size: 5rem;
}

h2 {
  font-size: 3.5rem;
}

h3 {
  font-size: 2.8rem;
}

h4 {
  font-size: 1.6rem;
}

a {
  transition: 0.5s;
  text-decoration: none;
  color: var(--color-atag);
}

p {
  font-size: 1.1rem;
}


ul.ulnum {
  list-style: decimal;
}

ul.cjk {
  list-style-type: cjk-decimal;
}

ul.alpha {
  list-style-type: lower-alpha;
}

.box-gray {
  background-color: #f5f5f5;
}

.point {
  color: var(--color-primary) !important;
}

.alert h6 {
  margin-bottom: 0px !important;
}

.kontainer {
  width: 100%;
  padding: 0 10%;
}

@media screen and (max-width: 1281px) {
  .kontainer {
    width: 100%;
    padding: 0 3%;
  }
}

hr.no-margin {
  margin: 0 !important;
}

/*--------------------------------------------------------------
# 버튼
--------------------------------------------------------------*/
.btn-mid-area {
  width: 100%;
  text-align: center;
  margin: 10px 0 100px 0;
}

.btns {
  display: inline-block;
  padding: 9px 34px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 4px;
  font-weight: 500;
}

.btns-wide {
  display: inline-block;
  padding: 15px 80px;
  margin-bottom: 0;
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 4px;
  font-weight: 500;
}


.btns-big {
  display: inline-block;
  padding: 12px 100px;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 4px;
  font-weight: 500;
}

.btns-full {
  display: inline-block;
  padding: 15px 34px;
  margin-bottom: 0;
  font-size: 1.1rem;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 4px;
  font-weight: 500;
  width: 100%;
}

.btns-primary {
  color: #fff;
  background-color: var(--color-primary);
  border: 2px solid var(--color-primary);
}

.btns-primary:hover {
  color: var(--color-primary);
  background-color: rgba(255, 255, 255, 0);
  border: 2px solid var(--color-primary);
}

.btns-black {
  color: #fff;
  background-color: #000000;
  border: 2px solid var(--color-point);
}

.btn {
  display: inline-block;
  padding: 6px 25px !important;
  margin-bottom: 0;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 0.25rem;
  margin: 0 5px;
}

.btn-primary {
  color: #fff;
  background-color: var(--color-primary);
  border: 2px solid var(--color-primary);

}

.btn-wide {
  display: inline-block;
  width: 100%;
  padding: 12px 26px !important;
  margin-bottom: 0;
  font-size: 1.1rem;
  font-weight: 500 !important;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 6px;
}

.btn-small {
  display: inline-block;
  padding: 6px 26px !important;
  margin-bottom: 0;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 4px;
  min-width: 105px;
}

.btn-mid {
  display: inline-block;
  padding: 16px 70px !important;
  margin-bottom: 0;
  font-size: 1.4rem !important;
  font-weight: 500 !important;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 6px;
}

.btn-big {
  display: inline-block;
  padding: 12px 70px !important;
  margin-bottom: 0;
  font-size: 1.3rem !important;
  font-weight: 400 !important;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 6px;
}

.btn-xbig {
  display: inline-block;
  padding: 20px 70px !important;
  margin-bottom: 0;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: 6px;
}

.btn-black {
  color: #fff !important;
  background-color: #000000;
  border: 2px solid #000;
}

.btn-black:hover {
  color: #000 !important;
  background-color: rgba(255, 255, 255, 0);
  border: 2px solid #000;
}

.btn-white {
  color: #000 !important;
  background-color: #fff;
  border: 2px solid #000;
}

.btn-white:hover {
  color: #fff !important;
  background-color: #000;
  border: 2px solid #000;
}

.btn-black {
  color: #fff !important;
  background-color: #000000;
  border: 2px solid #000;
}

.btn-blue {
  color: #fff !important;
  background-color: #2136ac;
  border: 2px solid #2136ac;
}

.btn-dark {
  color: #fff !important;
  background-color: #3f3f3f;
  border: 2px solid #3f3f3f;
}

.btn-red {
  color: #fff !important;
  background-color: #E85D1C;
  border: 2px solid #E85D1C;
}

.btn-green {
  color: #fff !important;
  background-color: #0c7566;
  border: 2px solid #0c7566;
}

.btn-green:hover {
  color: #fff !important;
  background-color: #0a8a77;
  border: 2px solid #0c7566;
}

.btn-violet {
  color: #fff !important;
  background-color: #3a398b;
  border: 2px solid #3a398b;
}

.btn-out {
  color: #b80101 !important;
  font-weight: 600;
}


.btn-in {
  display: inline-block;
  font-weight: 500;
  color: #fff;
  text-align: center;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  padding: 6px 25px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  margin: 0 5px;
}

.btn-warning {
  --bs-btn-color: #000;
  --bs-btn-bg: #ffc107;
  --bs-btn-border-color: #ffc107;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #ffca2c;
  --bs-btn-hover-border-color: #ffc720;
  --bs-btn-focus-shadow-rgb: 217, 164, 6;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #ffcd39;
  --bs-btn-active-border-color: #ffc720;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #000;
  --bs-btn-disabled-bg: #ffc107;
  --bs-btn-disabled-border-color: #ffc107;
}













hr {
  margin: 1rem 0;
  color: #d6d6d6;
  border: 0;
  border-top: var(--bs-border-width) solid;
  opacity: .5;
}

/*--------------------------------------------------------------
  # Common
  --------------------------------------------------------------*/
a.a_primary {
  color: var(--color-primary);
  font-weight: 400;
  text-decoration: none;
}

a.a_primary:hover {
  color: var(--color-primary);
  font-weight: 600;
  text-decoration: none;
}

.fw700 {
  font-weight: 700;
}

.fw600 {
  font-weight: 600;
}

.fw200 {
  font-weight: 200;
}

.mt-110 {
  margin-top: 110px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mt-100 {
  margin-top: 100px !important;
}

.mlr-20 {
  margin: 0 20px;
}

.pr-20 {
  padding-right: 20px;
}

.form-group {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.fl-col {
  display: flex;
  flex-direction: column !important;
}

.fl-row {
  display: flex;
  flex-direction: row !important;
}

.fl-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.fl-al {
  display: flex;
  flex-direction: row;
  align-items: center;
}


.txt-center {
  text-align: center;
}

.txt-right {
  text-align: right;
}

.txt-left {
  text-align: left;
}


.badge-red {
  font-size: var(--font-badge);
  background-color: rgb(161, 22, 22);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 73px;
  display: inline-block;
}

.badge-gray {
  font-size: var(--font-badge);
  background-color: rgb(61, 61, 61);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 73px;
  display: inline-block;
}

.badge-green {
  font-size: var(--font-badge);
  background-color: rgb(2, 121, 41);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 73px;
  display: inline-block;
}

.badge-blue {
  font-size: var(--font-badge);
  background-color: rgb(46, 48, 170);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 73px;
  display: inline-block;
}

.badge-wide-red {
  font-size: var(--font-badge);
  background-color: rgb(161, 22, 22);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 90px;
  display: inline-block;
}

.badge-wide-gray {
  font-size: var(--font-badge);
  background-color: rgb(61, 61, 61);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 90px;
  display: inline-block;
}

.badge-wide-green {
  font-size: var(--font-badge);
  background-color: rgb(2, 121, 41);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 90px;
  display: inline-block;
}

.badge-wide-blue {
  font-size: var(--font-badge);
  background-color: rgb(46, 48, 170);
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  border-radius: 3px;
  min-width: 90px;
  display: inline-block;
}


.label-red {
  font-size: var(--font-badge);
  background-color: rgb(161, 22, 22);
  color: #fff;
  padding: 3px 5px;
  text-align: center;
  border-radius: 2px;
  display: inline-block;
  margin-right: 5px;
}

.label-gray {
  font-size: var(--font-badge);
  background-color: rgb(61, 61, 61);
  color: #fff;
  padding: 3px 5px;
  text-align: center;
  border-radius: 2px;
  display: inline-block;
  margin-right: 5px;
}

.label-green {
  font-size: var(--font-badge);
  background-color: rgb(2, 121, 41);
  color: #fff;
  padding: 3px 5px;
  text-align: center;
  border-radius: 2px;
  display: inline-block;
  margin-right: 5px;
}

.label-blue {
  font-size: var(--font-badge);
  background-color: rgb(46, 48, 170);
  color: #fff;
  padding: 3px 5px;
  text-align: center;
  border-radius: 2px;
  display: inline-block;
  margin-right: 5px;
}

.tip {
  font-size: 0.9rem;
  margin-bottom: 10px;
}

.tip em {
  font-style: normal;
  margin-right: 20px;
}

.help {
  font-size: 0.9rem;
  margin-bottom: 5px;
  font-weight: 600;
  color: var(--color-reds);
}




/*반응형게시판*/

.cell-blank {
  width: 100%;
  text-align: center;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.txt_left {
  text-align: left !important;
  justify-content: flex-start !important;
}

.grid-col-4 {
  display: grid !important;
  grid-template-columns: 20% 20% 20% 40%;
}

.grid-col-8 {
  grid-template-columns: 5% 1fr 10% 15% 10% 10% 10% 10%;
}

.grid-col-7 {
  grid-template-columns: 5% 1fr 12% 17% 12% 12% 12%;
}

.grid-col-6 {
  grid-template-columns: 10% 1fr 15% 15% 15% 20%;
}

.grid-col-5 {
  grid-template-columns: 5% 1fr 20% 20% 20%;
}

.grid-col-bbs {
  display: grid !important;
  grid-template-columns: 5% 45% 10% 15% 10% 15%;
}

@media only screen and (min-width : 748px) {
  .grid-col-bbs2 {
    display: grid !important;
    grid-template-columns: 5% 55% 10% 15% 15%;
  }
}

.grid-col-driving {
  grid-template-columns: 10% 10% 10% 15% 10% 15% 15% 15%;
}

.grid-col-driving2 {
  grid-template-columns: 5% 10% 10% 15% 10% 10% 15% 10% 15%;
}

.drivingtb-list2 {
  display: grid !important;
  grid-template-columns: 5% 10% 10% 15% 10% 10% 15% 10% 15%;
}

.drivingtb-list2 li.cel9 {
  border-right: 1px solid #ddd;
}

.grid-col-nobbs {
  display: grid !important;
  grid-template-columns: 10% 55% 10% 10% 15%;
}

.bbstb-list2 {
  display: grid !important;
  grid-template-columns: 5% 45% 10% 15% 10% 15%;
}

.bbstb-list2 li.cel6 {
  border-right: 1px solid #ddd;
}

.cell-last {
  border-right: 1px solid #ddd;
}


.grid-col-procedure {
  grid-template-columns: 20% 8% 15% 8% 8% 1fr;
}

.grid-col-score {
  grid-template-columns: 5% 20% 20% 1fr 10% 15% 10% 10%;
}


.table-section {
  display: grid;
  grid-auto-rows: minmax(20px, auto);
  gap: 0px;
  background-color: #ddd;
  border-right: 1px solid #ddd;
}



.table-section .header {
  padding: 10px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-tbbg);
  text-align: center;
  padding: 10px 5px;
  font-weight: 500;
  border-top: 2px solid var(--color-tbbgtop);
  border-left: 1px solid #ddd;
}

.table-section .tbtop {
  border-top: 1px solid #ddd !important;
}

.thbg-dark {
  background-color: var(--color-tbheader);
  color: #fff;
}

.thbg-basic {
  background-color: var(--color-tbbg);
  color: var(--color-tbtxt);
  border-top: 2px solid var(--color-tbbgtop);
}



.table-section .cell {
  background-color: #fff;
  color: #000;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.table-section .cell-left {
  background-color: #fff;
  padding: 10px 10px 10px 25px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.span-2-rows {
  grid-row: span 2;
}

.span-2-cols {
  grid-column: span 2;
}

.span-5-cols {
  grid-column: span 5;
  padding: 15px 0;
  text-align: center;
  background-color: #fff;
}

.span-6-cols {
  grid-column: span 6;
  padding: 15px 0;
  text-align: center;
  background-color: #fff;
}

.span-6-rows {
  grid-row: span 6;
}

@media (max-width: 768px) {

  .table-section .header,
  .cell {
    flex: 1 0 50%;
    padding: 10px;
    border: none;
    border-bottom: 1px solid #ddd;
  }

  .table-section .header {
    background-color: #f0f0f0;
    font-weight: bold;
  }

  .table-section .header:last-child {
    border-bottom: none;
  }

}


.fl-sw {
  justify-content: space-between !important;
  align-items: flex-end !important;
}

/*게시판*/
.list-search-area {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: end;
  width: 100%;
  margin-bottom: 5px;
}

.list-search-area form input {
  width: 60%;
  font-size: 13px;
}

.list-search-area-box {
  width: 100%;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 10px;
  background-color: #fff;
}

.list-search-area-box form {
  width: 100%;
}

.list-search-area-box form ul {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.list-search-area-box form ul li {
  list-style: none;
  display: flex;
  flex-direction: row;
  width: 50%;
  font-size: var(--font-table);
}

.list-search-area-box form ul li bold {
  font-size: var(--input-size);
  color: #000;
  font-weight: 500;
  width: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.list-search-area-box form ul li select {
  width: 40%;
}

.list-search-area-box form ul li input {
  width: 40%;
  ;
}



.list-search-area-one {
  width: 100%;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 10px;
  background-color: #fff;
}

.list-search-area-one form {
  width: 100%;
}

.list-search-area-one form ul {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.list-search-area-one form ul li {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  font-size: var(--font-table);
}

.list-search-area-one form ul li bold {
  font-size: var(--input-size);
  color: #000;
  font-weight: 500;
  width: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.list-search-area-one form ul li select {
  width: 40%;
}

.list-search-area-one form ul li input {
  width: 20%;
  ;
}


.score-search-area-box {
  width: 100%;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 10px;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
}

.score-search-area-box form:nth-child(1) {
  width: 30%;
}

.score-search-area-box form:nth-child(2) {
  width: 70%;
  text-align: right;
}

.score-search-area-box form ul {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.score-search-area-box form ul li {
  list-style: none;
  display: flex;
  flex-direction: row;
  width: 50%;
  font-size: var(--font-table);
}

.score-search-area-box form ul li bold {
  font-size: var(--input-size);
  color: #000;
  font-weight: 500;
  width: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.score-search-area-box form ul li select {
  width: 50%;
}

.score-search-area-box form ul li input {
  width: 60%;
}

.list-area-box {
  width: 100%;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 10px;
  background-color: #fff;
}

.list-area-box form {
  width: 100%;
}

.list-area-box form ul {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.list-area-box form ul li {
  list-style: none;
  display: flex;
  flex-direction: row;
  font-size: var(--font-table);
  margin-left: 15px;
}



.fl-right {
  justify-content: flex-end;
}


/* .ik-card{border:1px solid #ddd; border-radius: 10px; padding:30px; background-color: #fff;} */
.ik-card-white {
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 0px;
  background-color: #fff;
  padding: 20px;
}

.ik-card {
  border: 0px solid #ddd;
  border-radius: 10px;
  padding: 0px;
  background-color: #fff;
}

.ik-card dl dd {
  min-height: 46px;
}

dd.memtype span {
  padding: 0 18px 0px 5px !important;
}

dd.memtype strong {
  padding: 0 0 0 20px;
  font-size: 0.8rem;
  color: #0c7566;
}

.ik-card dl dd strong {
  font-weight: 500;
  margin-left: 10px;
  color: rgb(155, 49, 49);
}

.ik-card .card-body-layout {
  width: 100%;
  display: flex;
  flex-direction: row;
}

.ik-card .card-body-layout .card-left {
  width: 50%;
}

.ik-card .card-body-layout .card-right {
  width: 50%;
}

form textarea.memo {
  height: 160px;
}

input[type='radio'] {
  margin-left: 20px;
  margin-right: 3px;
}

.ik-card h5 {
  margin-top: 30px;
}

.let-sp-2 {
  letter-spacing: 10px;
  text-align: center;
  font-style: normal;
}

.let-sp-3 {
  letter-spacing: 10px;
  font-style: normal;
}

.ik-card2 {
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 0px;
  background-color: #fff;
  width: 100%;
}

.ik-card2 .card-header {
  background-color: var(--color-tbbg);
  padding: 20px 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.ik-card2 .card-header h5 {
  margin: 0px;
  font-size: 1.1rem;
  font-weight: 400;
  color: #000;
}

.ik-card2 .card-header span {
  font-size: 0.9rem;
  color: #363636;
}

.ik-card2 .card-header span bold {
  color: #000;
  font-weight: 600;
  padding: 0 10px 0 30px;
}

.ik-card2 .card-body {
  padding: 20px 0px;
}

.ik-card2 .card-body ul {
  display: flex;
  flex-direction: row;
  width: 100%;
  margin: 0px;
  font-size: 1.0rem;
  padding: 15px 20px;
  list-style: none;
  border: 1px solid #ddd;
  border-radius: 4px;
  margin-bottom: 20px;
}

.ik-card2 .card-body ul li strong {
  width: 30%;
  margin-right: 20px;
}

.ik-card2 .card-body ul li {
  font-size: 1.0rem;
  width: 25%;
}

.ik-card2 .card-body .card-text {
  font-size: 1.0rem;
  color: #2c2c2c;
  padding: 20px 40px;
  margin: 0px;
  width: 100%;
  line-height: 2.1rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: rgba(238, 238, 238, 0.5);
}


/*하단페이징*/
.bot_paging {
  margin-top: 20px;
}

.bot_paging nav div:nth-child(1) {
  display: flex;
  flex-direction: row;
}

.bot_paging nav div:nth-child(1) span {
  min-width: 120px !important;
  width: 120px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #333 !important;
  color: #fff;
}

.bot_paging nav div:nth-child(1) a {
  min-width: 120px !important;
  width: 120px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px;
  background-color: #2136ac !important;
  color: #fff;
}

/* .bot_paging nav div:nth-child(2) {display: block; }
.bot_paging nav div:nth-child(2) span:nth-child(1){display: flex; flex-direction: row; flex-direction: row;} */
/* .bot_paging nav div span{min-width: 120px !important; display: flex; justify-content: center;}
.bot_paging nav div a{min-width: 120px !important;display: flex; justify-content: center;} */

/*table*/
table.basic {
  font-size: var(--font-table);
  border-top: 2px solid var(--color-tbbgtop);
  margin-top: 10px;
}

table.basic caption {
  display: none;
}

table.basic th {
  background-color: var(--color-tbbg);
  text-align: center;
  padding: 10px 5px;
  font-weight: 500;
}

table.basic td {
  padding: 10px 15px;
}

table.oper td {
  text-align: center;
}

table.mem td {
  text-align: center;
}


/*반응형게시판 table-res edutb-list*/

.edu_list_area {
  display: flex;
  flex-direction: column;
}

.memo-view textarea {
  height: 350px;
}

@media only screen and (min-width : 542px) {
  .ik-card dl dd.full {
    width: 80% !important;
  }

  .ik-card .card-body-twocell {
    width: 100%;
  }

  .ik-card .card-body-twocell dl {
    display: flex;
    flex-direction: row;
    font-size: var(--font-table);
    color: var(--color-tbtxt);
    width: 100%;
    margin: 0px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }

  .ik-card .card-body-twocell dl dt {
    width: 20%;
    background-color: var(--color-tbbg);
    text-align: center;
    padding: 8px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
  }

  .ik-card .card-body-twocell dl dt strong {
    color: #c00000;
    margin-left: 3px;
    font-weight: 600;
  }

  .ik-card .card-body-twocell dl dd {
    width: 30%;
    padding: 8px 15px;
    margin: 0;
    display: flex;
    align-items: center;
  }

  /*display: flex; align-items: center; */
  .ik-card .card-body-twocell dl dd.nofl {
    display: block !important;
  }

  .ik-card .card-body-twocell dl dd.full {
    width: 80%;
  }

  .ik-card .card-body-twocell dl dd.w-full {
    width: 100%;
  }

  .ik-card .card-body-twocell dl dd bold {
    font-weight: 500;
    margin-left: 10px;
  }

  .ik-card .card-body-twocell dl dd em {
    font-style: normal;
    text-wrap: nowrap;
    margin: 0 20px 0 10px;
  }

  .ik-card .card-body-twocell dl.tb-top {
    border-top: 2px solid var(--color-tbbgtop);
  }

  .ik-card .card-body-twocell dl dd.memo-view img {
    width: 90% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
  }


  .ik-card2 {
    padding: 30px;
    margin-bottom: 50px;
  }

  .ik-card2 dl dd.full {
    width: 80% !important;
  }

  .ik-card2 .card-body-twocell {
    width: 100%;
  }

  .ik-card2 .card-body-twocell dl {
    display: flex;
    flex-direction: row;
    font-size: var(--font-table);
    color: var(--color-tbtxt);
    width: 100%;
    margin: 0px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }

  .ik-card2 .card-body-twocell dl dt {
    width: 20%;
    background-color: var(--color-tbbg-gray);
    text-align: center;
    padding: 12px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
  }

  .ik-card2 .card-body-twocell dl dt strong {
    color: #c00000;
    margin-left: 3px;
    font-weight: 600;
  }

  .ik-card2 .card-body-twocell dl dd {
    width: 30%;
    padding: 8px 15px;
    margin: 0;
    display: flex;
    align-items: center;
  }

  /*display: flex; align-items: center; */
  .ik-card2 .card-body-twocell dl dd.nofl {
    display: block !important;
  }

  .ik-card2 .card-body-twocell dl dd.full {
    width: 80%;
  }

  .ik-card2 .card-body-twocell dl dd.w-full {
    width: 100%;
  }

  .ik-card2 .card-body-twocell dl dd bold {
    font-weight: 500;
    margin-left: 10px;
  }

  .ik-card2 .card-body-twocell dl dd em {
    font-style: normal;
    text-wrap: nowrap;
    margin: 0 20px 0 10px;
  }

  .ik-card2 .card-body-twocell dl.tb-top {
    border-top: 2px solid var(--color-tbbgtop-gray);
  }

  .ik-card2 .card-body-twocell dl dd.memo-view img {
    width: 90% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
  }



  ul.table-res {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: row;
    width: 100%;
  }

  ul.table-res li {
    list-style: none;
    background-color: #fff;
    color: #000;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
  }

  .edutb-list li.cel1 {
    width: 5.05%;
  }

  .edutb-list li.cel2 {
    width: 29.64%;
    justify-content: flex-start !important;
    padding-left: 20px;
  }

  .edutb-list li.cel3 {
    width: 12.1%;
  }

  .edutb-list li.cel4 {
    width: 17.0%;
  }

  .edutb-list li.cel5 {
    width: 12.1%;
  }

  .edutb-list li.cel6 {
    width: 12.05%;
  }

  .edutb-list li.cel7 {
    width: 12.15%;
    border-right: 1px solid #ddd;
  }

  /* .edutb-list li.cel8{width:10.1%;} */


  .scoretb-list li.cel1 {
    width: 5.05%;
  }

  .scoretb-list li.cel2 {
    width: 20.05%;
    justify-content: flex-start !important;
    padding-left: 20px;
  }

  .scoretb-list li.cel3 {
    width: 20.0%;
  }

  .scoretb-list li.cel4 {
    width: 9.65%;
  }

  .scoretb-list li.cel5 {
    width: 10.05%;
  }

  .scoretb-list li.cel6 {
    width: 15.05%;
  }

  .scoretb-list li.cel7 {
    width: 10.05%;
  }

  .scoretb-list li.cel8 {
    width: 10.1%;
    border-right: 1px solid #ddd;
  }


  .bbstb-list li.cel1 {
    width: 5.05%;
  }

  .bbstb-list li.cel2 {
    width: 44.70%;
    justify-content: flex-start !important;
    padding-left: 20px;
  }

  .bbstb-list li.cel3 {
    width: 10.05%;
  }

  .bbstb-list li.cel4 {
    width: 15.05%;
  }

  .bbstb-list li.cel5 {
    width: 10.05%;
  }

  .bbstb-list li.cel6 {
    width: 15.10%;
    border-right: 1px solid #ddd;
  }

  .drivingtb-list li.cel1 {
    width: 10.1%;
  }

  .drivingtb-list li.cel2 {
    width: 10.1%;
  }

  .drivingtb-list li.cel3 {
    width: 10.1%;
  }

  .drivingtb-list li.cel4 {
    width: 15.1%;
  }

  .drivingtb-list li.cel5 {
    width: 10.2%;
  }

  .drivingtb-list li.cel6 {
    width: 15.1%;
  }

  .drivingtb-list li.cel7 {
    width: 15.1%;
  }

  .drivingtb-list li.cel8 {
    width: 15.0%;
    border-right: 1px solid #ddd;
  }

  /*
  .grid-col-bbs{  grid-template-columns: 5% 1fr 15% 15% 10% 15%;} */

  .grid-col-state {
    grid-template-columns: 5% 1fr 20% 20% 10% 15%;
  }

  .list-search-area form {
    width: 30%;
    display: flex;
    flex-direction: row;
    justify-content: end;
  }

  .grid-col-customer {
    grid-template-columns: 5% 10% 10% 1fr 10% 10%;
  }
}


@media only screen and (max-width : 541px) {

  .edu_list_top {
    display: none;
  }

  .score_list_top {
    display: none;
  }

  .bbs_list_top {
    display: none;
  }

  ul.table-res {
    border: 1px solid #ddd;
    padding: 20px 10px;
    border-radius: 15px;
    display: inline-block;
    width: 100%;
  }

  ul.table-res li {
    list-style: none;
    color: #000;
    padding: 4px 10px;
  }

  .edutb-list li.cel1 {
    display: none;
  }

  .edutb-list li.cel2::before {
    content: '교육명 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel3::before {
    content: '일정표 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel4::before {
    content: '교육기간 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel5::before {
    content: '컨소시엄교육비 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel6::before {
    content: '사업주위탁교육비 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel7::before {
    content: '접수인원/정원 : ';
    font-weight: 500;
    color: #000;
  }

  .edutb-list li.cel8 span {
    font-size: 1.0rem;
    color: #fff;
    padding: 4px 10px;
    text-align: center;
    border-radius: 3px;
    min-width: 100%;
    display: inline-block;
  }

  .scoretb-list {
    display: grid;
    grid-template-columns: 30% 1fr;
  }

  .scoretb-list li.cel1 {
    display: none;
  }

  .scoretb-list li.cel2::before {
    content: '교육명 : ';
    font-weight: 500;
    color: #000;
  }

  .scoretb-list li.cel3::before {
    content: '교육기간 : ';
    font-weight: 500;
    color: #000;
  }

  .scoretb-list li.cel2 {
    grid-column: auto / span 2;
  }

  .scoretb-list li.cel3 {
    grid-column: auto / span 2;
  }

  .scoretb-list li.cel4 {
    grid-row: auto / span 2;
    text-align: center;
  }

  .scoretb-list li.cel5 {
    display: flex;
    align-items: center;
  }

  .scoretb-list li.cel6 {
    display: flex;
    align-items: center;
  }

  .scoretb-list li.cel7 {
    text-align: center;
  }

  /* .scoretb-list li.cel8{} */

  ul.bbstb-list {
    padding-bottom: 10px;
    display: inline-block;
    width: 100%;
  }

  .bbstb-list li.cel1 {
    display: none;
  }

  /* .bbstb-list li.cel2::before{content: '제목 : ';} */
  /* .bbstb-list li.cel3::before{content: '글쓴이 : ';} */
  .bbstb-list li.cel4::before {
    content: ' 조회 : ';
  }

  .bbstb-list li.cel5::before {
    content: ' 작성일 : ';
  }

  .bbstb-list li.cel3 {
    width: 27%;
    clear: both;
    display: inline;
    float: left;
  }

  .bbstb-list li.cel4 {
    width: 27%;
    display: inline;
    float: left;
  }

  .bbstb-list li.cel5 {
    width: 46%;
    display: inline;
    float: left;
  }

  .bbs_area .ik-card {
    padding: 20px 0px !important;
  }

  .bbs_area .ik-card .card-body-twocell dl.tb-top {
    border-top: 0px solid var(--color-tbbgtop);
  }

  .bbs_area .ik-card .card-body-twocell {
    padding: 0 15px;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(1) {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border: 1px solid #ddd;
    background-color: #f1f3fd;
    border-bottom: 0px;
    align-items: center;
    line-height: 2.4rem;
    padding: 5px 15px 2px 15px;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(2) {
    border: 1px solid #ddd;
    background-color: #f1f3fd;
    padding: 5px 15px 2px 15px;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(1) dt {
    width: 25%;
    font-weight: 600;
    justify-content: center;
    border-bottom: 1px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(1) dd {
    width: 75%;
    border-bottom: 1px solid #eee;
  }

  /* .bbs_area .ik-card .card-body-twocell dl {border-left: 1px solid #eee;} */
  .bbs_area .ik-card .card-body-twocell dl {
    border-left: 0px solid #eee;
    border-right: 0px solid #eee;
    border-bottom: 0px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(2) {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border: 1px solid #ddd;
    border-top: 0px;
    border-bottom: 0px;
    align-items: center;
    line-height: 1.4rem;
    padding: 1px 15px 5px 15px;
    background-color: #f1f3fd;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(2) dt {
    width: 25%;
    font-weight: 600;
    justify-content: center;
    border-bottom: 1px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(2) dd {
    width: 75%;
    border-bottom: 1px solid #eee;
    margin-bottom: 0px;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(3) {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-color: #f1f3fd;
    padding: 5px 15px 2px 15px;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(3) dt {
    display: none;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(3) dt {
    width: 25%;
    font-weight: 600;
    justify-content: center;
    border-bottom: 1px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(3) dd {
    width: 75%;
    border-bottom: 1px solid #eee;
  }

  /* .bbs_area .ik-card .card-body-twocell dl:nth-child(4) dt{width:25%; font-weight:600;justify-content: center; } */
  .bbs_area .ik-card .card-body-twocell dl:nth-child(4) dt {
    display: none;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(5) {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(5) dt {
    width: 25%;
    font-weight: 600;
    justify-content: center;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl:nth-child(5) dd {
    width: 75%;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
  }

  .bbs_area .ik-card .card-body-twocell dl dd.memo-view {
    border: 1px solid #ddd;
    padding: 15px;
  }

  .mo-no {
    display: none !important;
  }

  .grid-col-state {
    grid-template-columns: 40% 1fr;
  }

  .list-search-area form {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: end;
  }

  .grid-col-customer {
    grid-template-columns: 30% 70%;
  }

  .grid-col-customer .header {
    display: none;
  }

  .grid-col-customer .cust1 {
    display: none;
  }

  .grid-col-customer .cust2 {
    display: none;
  }

  .reply-item-header {
    flex-direction: column !important;
    padding: 15px 10px !important;
  }

  .reply-content {
    padding: 20px 10px !important;
  }

  .reply-item-header h6 {
    width: 100%;
  }

  .reply-item-header span {
    width: 100%;
  }

  .bbs_area ul.table-res li.cel2 a {
    font-weight: 500;
  }










}





@media only screen and (min-width : 768px) {
  .ik-1 {
    width: 6.3333% !important;
  }

  .ik-1-0 {
    width: 10% !important;
  }

  .ik-2 {
    width: 16.6666% !important;
  }

  .ik-3 {
    width: 24.9999% !important;
  }

  .ik-4 {
    width: 33.3332% !important;
  }

  .ik-5 {
    width: 41.6665% !important;
  }

  .ik-6 {
    width: 49.9998% !important;
  }

  .ik-7 {
    width: 58.3331% !important;
  }

  .ik-8 {
    width: 66.6664% !important;
  }

  .ik-9 {
    width: 74.9997% !important;
  }

  .ik-10 {
    width: 83.3330% !important;
  }

  .ik-11 {
    width: 91.6663%;
  }

  .ik-12 {
    width: 99.9996%;
  }
}

@media only screen and (max-width : 767px) {
  .ikm-0 {
    width: 100%;
  }

  .ikm-1 {
    width: 8.3333%;
  }

  .ikm-2 {
    width: 16.6666%;
  }

  .ikm-3 {
    width: 24.9999%;
  }

  .ikm-4 {
    width: 33.3332%;
  }

  .ikm-5 {
    width: 41.6665%;
  }

  .ikm-6 {
    width: 49.9998%;
  }

  .ikm-7 {
    width: 58.3331%;
  }

  .ikm-8 {
    width: 66.6664%;
  }

  .ikm-9 {
    width: 74.9997%;
  }

  .ikm-10 {
    width: 83.3330%;
  }

  .ikm-11 {
    width: 91.6663%;
  }

  .ikm-12 {
    width: 99.9996%;
  }
}




/*--------------------------------------------------------------
  # 폼
  --------------------------------------------------------------*/

.form-control {
  display: block;
  width: 100%;
  min-height: calc(1.8em + 0.75rem + 2px);
  padding: 0.65rem 0.75rem;
  font-size: var(--input-size);
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #ffffff;
  background-clip: padding-box;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control-mid {
  display: block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 0.8rem !important;
  font-weight: 500;
  line-height: 1.5;
  color: #242424 !important;
  background-color: #ffffff;
  background-clip: padding-box;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control-small {
  display: block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0;
  font-size: 0.6rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #ffffff;
  background-clip: padding-box;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.table-basic {
  font-size: var(--font-table);
  color: var(--color-tbtxt);
}

.table-basic th {
  padding: 0.6rem 0.8rem;
  border-top: 2px solid var(--color-tbbgtop);
}

.table-basic td {
  padding: 0.6rem 0.8rem;
}

.table-basic thead tr th {
  background-color: var(--color-tbbg);
  text-align: center;
  font-size: var(--basic-size);
}

.table-basic tbody tr td {
  font-size: var(--basic-size);
}

.table-basic td.tb_num {
  background-color: rgba(238, 238, 238, 0.5) !important;
}

.table-basic td.center input {
  margin: 0 auto;
}

.table-basic tbody tr td {
  text-align: center;
}

.table-basic td em {
  font-style: normal;
  text-wrap: nowrap;
  margin-left: 20px;
}


.m-label {
  margin-right: 5px;
  font-weight: 500;
  width: 20%;
  font-size: 0.9rem;
}

@media screen and (min-width: 480px) {
  .m-label {
    display: none;
  }

  dd.m-flex {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100% !important;
  }


}

/*--------------------------------------------------------------
  # table  background: rgba(238, 238, 238, 0.5)
  --------------------------------------------------------------*/
@media screen and (min-width: 542px) {
  .table-dl-form {
    display: flex;
    flex-direction: column;
    border-top: 2px solid var(--color-tbbgtop);
    padding: 0;
  }

  .table-dl-form dl {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding: 0;
    border-bottom: 1px solid #eee;
    margin: 0px !important;
  }

  .table-dl-form dl dt {
    width: 16%;
    background-color: var(--color-tbbg);
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: var(--font-table);
    /* justify-content: flex-end; padding:14px 5% 14px 0; */
    justify-content: flex-start;
    padding: 14px 10px 14px 2%;
    color: rgb(49, 50, 51);
  }

  .table-dl-form dl dd {
    width: 34%;
    padding: 8px 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 500;
    color: #3f3f3f;
    margin-bottom: 0px !important;
    font-size: var(--font-table);
  }

  /* .table-dl-form dl dd.full input{width:33%;} */
  .table-dl-form dl dd.full {
    width: 84% !important;
    padding: 8px 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 400;
    color: #3f3f3f;
  }

  .table-dl-form dl dd input[type="radio"] {
    margin-right: 8px;
    margin-bottom: 0px;
  }

  .table-dl-form dl dd span {
    padding: 0 12px;
    color: #3f3f3f;
  }


  .table-dl-form dl dd.tel-form input {
    width: 28%;
  }

  .table-dl-form dl dd.tel-form select {
    width: 28%;
  }

  .table-dl-form dl dd.cm-form {
    width: 80%;
  }

  .table-dl-form dl dd.cm-form span {
    font-weight: 600;
  }

  .table-dl-form dl dd.cm-form input {
    width: 20%;
  }

  .table-dl-form dl dd.cm-form span.cm-form-cm {
    margin-right: 20%;
  }

  .table-dl-form dl dd.grade-form {
    width: 80%;
  }

  .table-dl-form dl dd.grade-form span {
    font-weight: 600;
  }

  .table-dl-form dl dd.grade-form input {
    width: 22%;
    margin-right: 40px;
  }

  .table-dl-form dl dd.grade-form select {
    width: 22%;
  }

  .table-dl-form dl dd.histroy-form {
    width: 80%;
    display: flex;
    justify-content: space-between;
  }

  .table-dl-form dl dd.histroy-form div {
    display: flex;
    flex-direction: row;
    font-weight: 400;
  }

  .table-dl-form dl dd.histroy-form div span {
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
  }

  .table-dl-form dl dd.histroy-form div select {
    width: 120px;
  }

  .table-dl-form dl dd.histroy-form div input {
    margin-left: 20px;
    font-weight: 400;
  }

  .table-dl-form dl dd.pic-form {
    width: 80%;
  }

  .table-dl-form dl dd.pic-form img {
    height: 46px;
    width: auto;
  }

  .table-dl-form dl dd.pic-form input {
    width: 50%;
    margin-left: 30px;
  }

  .table-dl-form dl dd.pw-form {
    width: 80%;
  }

  .table-dl-form dl dd.pw-form input {
    width: 40%;
  }

  .table-dl-form dl dd.pw-form span {
    width: 60%;
  }

  .table-dl-form dl dd.name-form {
    width: 80%;
  }

  .table-dl-form dl dd.name-form input {
    width: 40%;
  }

  .table-dl-form dl dd.email-form {
    width: 80%;
  }

  .table-dl-form dl dd.email-form input {
    width: 20%;
  }

  .table-dl-form dl dd.email-form select {
    width: 20%;
    margin-left: 10px;
  }

  .table-dl-form dl dd.web-form {
    width: 80%;
  }

  .table-dl-form dl dd.web-form input {
    width: 50%;
  }

  .table-dl-form dl dd.birth-form {
    width: 80%;
  }

  .table-dl-form dl dd.birth-form input {
    width: 10%;
  }

  .table-dl-form dl dd.sex-form input {
    margin-left: 20px;
  }

  .table-dl-form dl dt strong {
    color: rgb(226, 0, 0);
    font-weight: 800;
    width: 10px;
    margin-left: 5px;
  }

  .table-dl-form dl dd.address {
    width: 80% !important;
  }

  .table-dl-form dl dd.address div {
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: 5px 0;
  }

  .table-dl-form dl dd.address div.add-zip input {
    width: 15%;
  }

  .table-dl-form dl dd.address div.add-zip span {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .table-dl-form dl dd.address div.add-detail input:nth-child(1) {
    margin-right: 15px;
  }

  .table-dl-form dl dd.address div.add-detail input:nth-child(2) {
    margin-left: 15px;
  }

  .table-dl-form dl dd.address div.add-zip .btn-zip-find {
    height: 46px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    background-color: var(--blue-color);
    border: 1px solid var(--dblue-color);
    box-shadow: none;
    border-radius: 6px;
    padding: 5px 25px;
    line-height: 33px;
    margin-left: 10px;
  }




}