@import url(morpheus-reset.min.css);
@import url(fonts.css);

* {
  font-family: 'Pretendard', sans-serif;
  font-size: 16px;
  color: #212529;
  font-weight: 400;
  line-height: 1.38;
}
body,
html {
  width: 100%;
}
.sr-only {
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  margin: -1px;
  position: absolute;
  left: 0;
  right: 0;
}
.no-scroll {
  overflow: hidden;
  height: 100%;
  position: relative;
}

/* font */
.fz-18 {
  font-size: 18px;
}
.fz-20 {
  font-size: 20px;
}
.bold {
  font-weight: 500;
}

/* color */
.c-blue {
  color: #1080fa;
}
.c-red {
  color: #ff4a4a;
}
.c-gray {
  color: #868e96;
}
.c-darkgray {
  color: #495057;
}
.bg-gray {
  background-color: #e9ecef;
}
.bg-light-red {
  background-color: #ffeded;
  color: #ff4a4a;
  font-weight: 500;
  padding: 7px;
  border-radius: 8px;
  text-align: center;
}

/* margin , padding */
.mt8 {
  margin-top: 8px;
}
.mt12 {
  margin-top: 12px;
}
.mt16 {
  margin-top: 16px;
}
.mt20 {
  margin-top: 20px;
}
.mt30 {
  margin-top: 30px;
}
.mt40 {
  margin-top: 40px;
}

.d-flex {
  display: flex;
}
.d-flex.js {
  justify-content: space-between;
}
.d-flex.jc {
  justify-content: center;
}
.d-flex.je {
  justify-content: flex-end;
}

img {
  width: 100%;
}

.wrapper {
  position: relative;
  width: 100%;
}
.content-wrap {
  position: relative;
  padding: 30px 20px;
}

.logo {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
.logo > img {
  width: 140px;
  height: auto;
  display: block;
}
.logo .branch-num {
  text-align: right;
}
 {
  width: 140px;
}
.logo .branch-num a {
  display: inline-block;
  padding: 6px 38px 6px 16px;
  border: 1px solid #1080fa;
  border-radius: 17px;
  color: #1080fa;
  font-weight: 500;
  background: url(../images/ic_arrow.png) no-repeat center right 10px / 20px
    20px;
}

.top-common .branch-num {
  text-align: right;
}
.top-common .branch-num a {
  display: inline-block;
  padding: 6px 38px 6px 16px;
  border: 1px solid #1080fa;
  border-radius: 17px;
  color: #1080fa;
  font-weight: 500;
  background: url(../images/ic_arrow.png) no-repeat center right 10px / 20px
    20px;
}
.top-common .tab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.top-common .tab button {
  flex: 1;
  padding: 8px 12px;
  border-radius: 8px;
}
.top-common .tab button.active {
  background-color: #ff4a4a;
  color: #fff;
  font-weight: 500;
}

.content {
  display: none;
}
.content.active {
  display: block;
}
.content .title {
  margin-top: 40px;
  margin-bottom: 12px;
  font-size: 18px;
  font-weight: 500;
}
.content .title:before {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 8px;
  border-radius: 2px;
  background: #495057;
}

.content .app-info {
  gap: 2rem;
}
.content .app-info .img-wrap {
  width: 82px;
  min-width: 82px;
}

.btn-down a {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border-radius: 8px;
  background: #034d7b;
  font-size: 18px;
  font-weight: 500;
  color: #fff;
  text-align: center;
}
.btn-down a:active {
  transform: scale(98%);
  background: #022f4c;
}
.btn-down a + a {
  margin-top: 8px;
}

.cont-img {
  width: 100%;
  max-width: 460px;
}

.bg-info {
  padding: 16px;
  border-radius: 8px;
  background: #f1f3f5;
}

/* popup */
.popup-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: none;
}
.popup-wrap .dim {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
}
.popup-wrap .popup {
  position: absolute;
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  height: 94%;
  background: #fff;
  border-radius: 8px;
  overflow-y: auto;
}
.popup-wrap .popup .pop-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid #e9ecef;
}
.popup-wrap .popup .pop-header h1 {
  font-size: 20px;
  font-weight: 500;
}
.popup-wrap .popup .pop-header .btn-close {
  width: 30px;
  height: 30px;
  background: url('../images/ic_close.png') no-repeat center right/ contain;
}
.popup-wrap .popup .pop-content {
  padding: 20px;
}

/* popup dtable */
.table table {
  width: 100%;
  border-top: 1px solid #495057;
}
.table table tr th,
.table table tr td {
  padding: 8px 4px;
  border-bottom: 1px solid #dee2e6;
  border-right: 1px solid #dee2e6;
  text-align: center;
  font-size: 15px;
  word-break: keep-all;
}
.table table tr th {
  background: #f1f3f5;
}
.table table tr th:last-child,
.table table tr td:last-child {
  border-right: 0;
}

.down-btn-wrapper {
  display: flex;
  gap: 1rem;
}
.down-btn-wrapper > .btn-down {
  flex-grow: 1;
}
.down-btn-wrapper > .btn-down a {
  display: block;
}
.down-btn-wrapper > .btn-down a > div {
  display: block;
  position: relative;
  font-size: 18px;
  line-height: 27px;
  color: #fff;
  font-weight: bold;
}
.down-btn-wrapper > .btn-down a > div.hidden {
  display: none;
}
.down-btn-wrapper > .btn-down a.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.down-btn-wrapper > .btn-down a small {
  display: block;
  color: #fff;
  font-size: 14px;
  margin: 2px auto 4px;
}