:root {
  --text-color: #f08279;
  --color: #d88079;
  --color1: #fff;
  --color2: #000;
  --color3: rgb(59 59 59);
  --bg-color: #fcd6d3;
  --header-bg-color1: #f5c4c0;
  --header-bg-color2: #f3bdb9;
  --header-bg-color3: #f5beba;
  --box-shadox:rgb(218, 133, 248);
  --link-button-color: #f4aea9;
  --link-button-color1: #f18981;
  --button-color: #ee7e76;
  --button-color1: #eec383;
  --line-color: #fe5142;
  --line-button-color: transparent;
  --line-border-color: #ee7e76;
  --line-box-shadow: #0000001a;
  --notice-bg: transparent;
  --notice-color: #3e2d2d;
  --notice-box-color:#0000001a;
  --custom-button-color: #f8a965;
  --custom-button-color1: #ee7e76;
  --custom-box-color: #fcedcd;
  --custom-box-color1: #f8dec8;
  --activity-color: #f8b378;
  --activity-border: #f39f56;
  --activity-table-border-color: #fbdabf;
  --activity-button-color: #f7b47b;
  --activity-button-color1: #ee7e76;
  --activity-title-color: #f5f5f5;
  --activity-title-color1: #f4f66b;
  --activity-submit-color: linear-gradient( to right, var(--activity-color),var(--activity-button-color));
  --apply-button-color: #f49d5e;
  --apply-shadow-color: #f3e3a1;
  --apply-button-color1: #ec4d3a;
  --apply-shadow-color1: #f2f492;
}
.com-main {
  margin: 0 auto;
  height: 100%;
  width: 100%;
  background: var(--bg-color);
  overflow-y: scroll;
  overflow-x: hidden;
}
.com-main::-webkit-scrollbar {
  width: 0;
}
.loading {
  padding-top: 35%;
}
.activity-content, .apply-desc {
  font-size: 0.875rem;
  line-height: 1.5;
}
.activity-content table, .apply-desc table {
  margin-top: 1rem;
  border: 1px solid var(--activity-border);
  width: 100%;
  table-layout: fixed;
}
.activity-content table tr th, .apply-desc table tr th {
  vertical-align: middle;
  border: 1px solid var(--activity-border);
}
.activity-content table tr td, .apply-desc table tr td {
  padding: 0.5rem 0;
  vertical-align: middle;
  border: 1px solid var(--activity-border);
  font-size: 0.75rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
.header-box {
    max-width: 100%;
    width: 100%;
}
.header-box .container {
    width: 100%;
    margin: 0;
}
.header-box .container .logo-box {
    width: 100%;
}
.header-box .container .logo-box img {
    width: 100%;
}
}
