틀:애프터라이프 캐릭터 프로필/styles.css

.애프터라이프-캐릭터-프로필 {
  clear: right;
  float: right;
  max-width: 300px;
  width: 100%;
  margin: auto;
}

.애프터라이프-캐릭터-프로필--summary {
  display: inline-block;
  color: #ffffff;
  padding: 0 3em 0 1.2em;
  font-size: 0.75rem;
  line-height: 2.2em;
}

.애프터라이프-캐릭터-프로필--name {
  font-size: 1.4em;
  padding: 0 1.2rem 0.7rem;
  font-weight: bold;
}

.애프터라이프-캐릭터-프로필--CV {
  padding: 0 0.7rem 0.5rem;
}

.애프터라이프-캐릭터-프로필 tr:first-child {
  border-top: 2px solid #001233;
}

.애프터라이프-캐릭터-프로필 td {
  width: 50%;
  border: none;
  border-bottom: 1px solid #001233;
  font-size: 0.8rem;
}

.애프터라이프-캐릭터-프로필 tr td:nth-child(2) {
  border-left: 1px solid #001233;
}

.애프터라이프-캐릭터-프로필--아침조 .애프터라이프-캐릭터-프로필--name {
  color: #00c0ff;
}
.애프터라이프-캐릭터-프로필--아침조 .애프터라이프-캐릭터-프로필--summary {
  background-color: #00c0ff;
}

.애프터라이프-캐릭터-프로필--낮조 .애프터라이프-캐릭터-프로필--name {
  color: #ff8a00;
}
.애프터라이프-캐릭터-프로필--낮조 .애프터라이프-캐릭터-프로필--summary {
  background-color: #ff8a00;
}

.애프터라이프-캐릭터-프로필--황혼조 .애프터라이프-캐릭터-프로필--name {
  color: #af2845;
}
.애프터라이프-캐릭터-프로필--황혼조 .애프터라이프-캐릭터-프로필--summary {
  background-color: #af2845;
}

.애프터라이프-캐릭터-프로필--밤조 .애프터라이프-캐릭터-프로필--name {
  color: #3057ff;
}
.애프터라이프-캐릭터-프로필--밤조 .애프터라이프-캐릭터-프로필--summary {
  background-color: #3057ff;
}

.애프터라이프-캐릭터-프로필--새벽조 .애프터라이프-캐릭터-프로필--name {
  color: #8330ff;
}
.애프터라이프-캐릭터-프로필--새벽조 .애프터라이프-캐릭터-프로필--summary {
  background-color: #8330ff;
}

@media screen and (max-width: 480px) {
  .애프터라이프-캐릭터-프로필 {
    float: none;
    margin: auto;
  }
}