:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.font--primary {
  font-family: "NotoSansKR-Regular", sans-serif;
  font-weight: 400;
}

.font--secondary {
  font-family: "NotoSansKR-Medium", sans-serif;
  font-weight: 500;
}

.font--tertiary {
  font-family: "NotoSansKR-Bold", sans-serif;
  font-weight: 700;
}

body,
figure {
  width: 100%;
  margin: 0;
  word-break: keep-all;
  letter-spacing: -0.5px;
  font-family: "NotoSansKR-Regular";
}

h1,
h2,
h3 {
  margin: unset;
  line-height: 1.3;
}

button {
  display: inline-block;
  background-color: transparent;
  border-color: inherit;
  border-style: inherit;
  padding: inherit;
}

button:focus {
  outline: none;
}

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}

input:focus {
  outline: none;
}

input::-ms-clear {
  display: none;
}

figure {
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-margin-start: 0;
  -webkit-margin-end: 0;
}

a,
a:hover,
a:visited {
  text-decoration: none;
}

* {
  box-sizing: border-box;
}

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.flex {
  display: flex;
}

.flex--wrap {
  flex-wrap: wrap;
}

.flex--align-items-base {
  align-items: baseline;
}

.flex--align-items-end {
  align-items: flex-end;
}

.flex--align-items-center {
  align-items: center;
}

.flex--align-self-center {
  align-self: center;
}

.flex--justify-center {
  justify-content: center;
}

.flex--justify-space-between {
  justify-content: space-between;
}

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

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.separator-container {
  width: 100%;
}

.text--black {
  color: #222;
}

.text--grey-80 {
  color: #707070;
}

.text--blue {
  color: #126ccd;
}

.text--line-height-1\.5 {
  line-height: 1.5;
}

.article-print-sty2:has(.radius--50) {
  border-radius: 50%;
}

.article-print-sty2:has(.radius--16) {
  border-radius: 16px;
}

.article-print-sty2:has(.radius--8) {
  border-radius: 8px;
}

.article-print-sty2:has(.radius--6) {
  border-radius: 6px;
}

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.box--display-block {
  display: block;
}

.box--display-inline-flex {
  display: inline-flex;
}

.box--position-relative {
  position: relative;
}

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.box--bg-white {
  background-color: #fff;
}

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.box--border {
  border: 1px;
  border-color: #222;
  border-style: solid;
}

.box--border-black {
  border-color: #222;
}

.box--border-grey-40 {
  border-color: #d7d7d7;
}

.box--border-xs {
  border-width: 1px;
}

.box--border-horizontal {
  border-left: 0;
  border-right: 0;
}

.box--border-horizontal-top {
  border-bottom: 0;
}

.box--border-horizontal-bottom {
  border-top: 0;
}

.box--pointer {
  cursor: pointer;
}

.box--margin-top-xs {
  margin-top: 8px;
}

.box--margin-top-xl {
  margin-top: 24px;
}

.box--margin-right-sm {
  margin-right: 12px;
}

.box--margin-bottom-xs {
  margin-bottom: 8px;
}

.box--margin-left-md {
  margin-left: 16px;
}

.box--pad-top-md {
  padding-top: 16px;
}

.box--pad-top-xl {
  padding-top: 24px;
}

.box--pad-bottom-xs {
  padding-bottom: 8px;
}

.box--pad-bottom-sm {
  padding-bottom: 12px;
}

.box--pad-bottom-md {
  padding-bottom: 16px;
}

.box--pad-bottom-lg {
  padding-bottom: 20px;
}

.box--pad-bottom-xl {
  padding-bottom: 24px;
}

:root {
  --modal-mask-top-offset: 134px;
  --modal-layer-top-offset: 25px;
  --fixed-nav-top-offset: 48px;
}

.width--100 {
  width: 100%;
}

.cover {
  -o-object-fit: cover;
  object-fit: cover;
}

.article-body {
  overflow: auto;
  word-break: break-all;
}

.article-body :host(.powa) {
  word-break: keep-all;
}

.article-body
  :not(td):not(a):not(.rel-heading-tt):not(.rel-tt):not(
    .link-list-title
  ):first-child {
  margin-top: 0;
}

.article-body img {
  display: block;
  height: auto;
}

.article-body a {
  color: #126ccd;
  border-bottom: 1px solid #c8c8c8;
}

.article-body a:visited,
.article-body a:active {
  color: #126ccd;
}

.article-body a:hover {
  color: #107ef3;
}

.article-body__content {
  margin-bottom: 24px;
}

.article-body__content-text {
  font-size: 18px;
  line-height: 1.67;
}

.article-dateline {
  margin-bottom: 12px;
  padding-bottom: 14px;
}

.article-dateline .dateBox {
  position: relative;
}

.article-dateline .dateBox .inputDate {
  padding-bottom: 2px;
  opacity: 0;
}

.article-dateline .dateBox .upDate {
  position: absolute;
}

.article-tags {
  word-break: break-all;
}

.article-tags a {
  line-height: 26px;
  border-bottom: solid 1px #c8c8c8;
}

.article-tags a:hover {
  color: #107ef3;
}

.article-tags .tag-item-last {
  margin-right: 12px;
}

.comment-area {
  padding-left: 2px;
}

.cursorPointer {
  cursor: pointer;
}

.author-card {
  border: 1px solid #d7d7d7;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05);
  padding: 24px 20px;
}

.author-card--content .heading-container a {
  color: #222;
}

.author-card--content-image.rad100 img {
  border-radius: 100%;
  border: 0.5px solid #d7d7d7;
}

.author-card--content-header {
  padding-right: 16px;
}

.author-card--content-header .author-name-box .byline {
  font-size: 24px;
  line-height: 32px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.author-card--content-header .author-name-box .byline .spacer {
  display: inline-block;
  width: 8px;
}

.author-card--content-header .author-name-box:hover {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
}

.author-card--content-header .author-name-box:hover .spacer {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
}

.author-card--content-header .bio-text {
  font-size: 14px;
  color: #999;
  font-family: "NotoSansKR-Regular";
  line-height: 20px;
  word-break: break-all;
}

.author-card--content-social {
  margin-top: 8px;
}

.author-card--content-social .icon:hover g circle {
  stroke: #222;
}

.author-card--content-social .icon:hover g use.handle {
  fill: #222;
}

.author-card--content-right {
  border-left: 1px solid #eaeaea;
  padding-left: 16px;
}

input::-moz-placeholder {
  color: #999;
  font-family: "NotoSansKR-Regular";
}

input:focus {
  border-color: #222;
  outline: none;
}

input:hover {
  border-color: #222;
  outline: none;
}

.story-feed:has(.showHeadingFalse) .timeline-refresh {
  margin-bottom: 16px;
  justify-content: flex-end;
  position: relative;
  right: inherit;
  top: inherit;
}

.story-feed:has(.story-feed__timeline) {
  position: relative;
}

.story-feed:has(.story-feed__timeline) .heading-title {
  padding-bottom: 16px;
  font-size: 16px;
}

.layout--mypage:not(:has(.mypage--renewal-menu-tab)) .mypage--topper-container {
  margin-bottom: 32px;
}

.layout--mypage:not(:has(.mypage--renewal-menu-tab))
  .mypage--topper.fixed:after {
  border-bottom: unset;
}

.layout--mypage:not(:has(.mypage--renewal-menu-tab)) .mypage--topper:after {
  position: absolute;
  content: "";
  width: 99vw;
  height: 82px;
  box-shadow: 0 9px 10px -4px rgba(0, 0, 0, 0.16);
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

.layout--mypage:has(.mypage--topper.fixed) .mypage--renewal-menu-tab {
  display: none;
}

.layout--mypage:has(.mypage--topper.fixed) .mypage--renewal-menu-tab.scrollUp {
  display: inherit;
}

.layout--mypage:has(.mypage--topper.fixed)
  .mypage--renewal-menu-tab.scrollUp
  .my_nav__bar {
  border-top: unset;
  position: fixed;
  top: 130px;
}

.author-card-list .author-card.only {
  padding: 16px 0;
}

.author-card-list .author-card {
  border: none;
  box-shadow: unset;
}

.author-card-list .author-card--content-header {
  padding-right: 12px;
}

.author-card-list .author-card--content-header .author-name-box .byline {
  font-size: 18px;
  line-height: 27px;
}

.author-card-list .author-card--content-header .author-name-box .byline:hover {
  text-decoration: underline;
}

.author-card-list .author-card--content-right {
  padding: 0 8px 0 16px;
  border-left: 1px solid #eaeaea;
}

article:has(.live-blog-timeline) .article-control-bar {
  display: none;
}

.sub-card-btn {
  font-family: "NotoSansKR-Medium";
  font-size: 14px;
  font-weight: 500;
  width: 59px;
  padding: 4px 10px;
  border-radius: 16px;
  color: #126ccd;
  background: #fff;
  border: 1px solid #126ccd;
  cursor: pointer;
}

.sub-card-btn svg {
  margin-left: 2px;
}

.sub-card-btn:hover {
  background: #126ccd;
  color: #fff;
}

.sub-card-btn:hover path {
  fill: #fff;
}

.layout__article-col {
  padding: 0 calc((16) * 1px);
}

footer .box--position-relative:has(.sitemap) {
  max-width: 1280px;
  margin: auto;
}

ul {
  padding-left: 10px;
}

li {
  display: block;
}

.article-body__content-rawhtml:has(script[src*="cdn.flowplayer"]) {
  min-height: 56px;
}

@media only screen and (min-width: 690px) {
  .font--size-md-18 {
    font-size: 18px;
  }

  .font--size-md-14 {
    font-size: 14px;
  }

  .font--size-md-12 {
    font-size: 12px;
  }

  .grid__col--md-12 {
    flex-basis: 100%;
    max-width: 100%;
  }

  .box-md--margin-top-xxl-2 {
    margin-top: 32px;
  }

  .box--hidden-md {
    display: none;
  }

  .article-body__content {
    margin-top: 32px;
    margin-bottom: 32px;
  }

  .article-body .text {
    margin-top: 0;
    margin-bottom: 24px;
  }

  .article-dateline {
    margin-bottom: 24px;
  }

  .article-tags {
    margin-top: 32px;
  }

  .article-tags a {
    line-height: 20px;
  }

  .article-menu-bar-inner svg path {
    fill: #999;
  }

  .article-menu-bar-inner svg:hover path {
    fill: #222;
  }
}

@media only screen and (min-width: 690px) and (max-width: 985px) {
  .box--hidden-md-only {
    display: none;
  }

  .flex-chain-wrapper.lg {
    display: none;
  }

  .article-menu-bar-inner svg path {
    fill: #999;
  }

  .layout__article-col {
    width: 616px;
    max-width: 616px;
    flex-basis: 616px;
    padding: 0;
  }
}

@media only screen and (min-width: 986px) {
  .grid__col--lg-8-1 {
    flex-basis: 65.67%;
    max-width: 65.67%;
  }

  .grid__col--lg-12 {
    flex-basis: 100%;
    max-width: 100%;
  }

  .box--hidden-lg {
    display: none;
  }

  .layout--mypage:has(.mypage--topper.fixed)
    .mypage--renewal-menu-tab.scrollUp
    .my_nav__bar {
    top: 122px;
  }

  .layout__article-main {
    padding-left: 72px;
    padding-right: 24px;
    border-right: 1px solid #eaeaea;
  }
}

@media only screen and (min-width: 1280px) {
  .layout__article-main {
    max-width: calc(((616 + 187) / 1280) * 100%);
    flex-basis: calc(((616 + 187) / 1280) * 100%);
    padding: 50px 70px 0 calc((116) * 1px);
    border-right: 1px solid #eaeaea;
  }
}

@media only screen and (max-width: 689px) {
  .font--size-sm-18 {
    font-size: 18px;
  }

  .font--size-sm-14 {
    font-size: 14px;
  }

  .font--size-sm-12 {
    font-size: 12px;
  }

  .flex--sm {
    display: flex;
  }

  .grid__col--sm-12 {
    flex-basis: 100%;
    max-width: 100%;
  }

  .box-sm--pad-right-xs {
    padding-right: 8px;
  }

  .box--hidden-sm {
    display: none;
  }

  .flex-chain-wrapper.lg {
    display: none;
  }

  .article-tags {
    margin-top: 24px;
  }

  .author-card {
    padding: 16px;
  }

  .author-card--content-image {
    margin-right: 8px;
  }

  .author-card--content-header .author-name-box .byline {
    font-size: 18px;
    line-height: 25px;
  }

  .author-card--content-right {
    padding-left: 12px;
  }

  .layout--mypage:not(:has(.mypage--renewal-menu-tab))
    .mypage--topper-container {
    margin-bottom: 24px;
  }

  .layout--mypage:not(:has(.mypage--renewal-menu-tab)) .mypage--topper:after {
    height: 59px;
  }

  .layout--mypage:has(.mypage--topper.fixed)
    .mypage--renewal-menu-tab.scrollUp
    .my_nav__bar {
    top: 107px;
  }

  .author-card-list .author-card--content-header .author-name-box .byline {
    font-size: 16px;
    line-height: 24px;
  }

  .author-card-list .author-card--content-right {
    padding: 0 8px 0 12px;
  }

  .sub-card-btn {
    font-family: "NotoSansKR-Bold";
    font-size: 12px;
    width: 55px;
    padding: 4px 8px;
  }

  .layout__article-header:has(.lb-sub) .article-header__headline-container {
    text-align: left;
  }

  .article-body__content-rawhtml:has(script[src*="cdn.flowplayer"]) {
    min-height: 64px;
  }
}

@media screen and (min-width: 986px) {
  .trc_elastic_thumbnails-a
    :nth-child(3n + 1 of .videoCube):not(:nth-child(1 of .videoCube)) {
    clear: both;
  }
}

@media screen and (min-width: 986px) {
  .trc_elastic_thumbnails-b
    :nth-child(3n + 1 of .videoCube):not(:nth-child(1 of .videoCube)) {
    clear: both;
  }
}

.block-info {
  color: rgb(50, 50, 50);
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.comment {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.comment-content {
  display: flex;
  flex-direction: column;
}

.comment-block {
  margin-top: 1rem;
  display: flex;
  justify-content: flex-start;
  border-top: 1px solid rgba(118, 125, 132, 0.235);
  padding-top: 0.5rem;
}

.comment-block-answer {
  margin-left: 4rem;
}

.block-avatar {
  margin-right: 1rem;
}

.block-avatar img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  object-fit: cover;
}

.block-info {
  width: 100%;
}

.block-info-comment {
  position: relative;
}

.block-info-comment__svg {
  position: absolute;
  top: 0px;
  right: 0px;
  border-radius: 50%;
  font-size: 10px;
}

.block-info-comment__svg svg {
  background-color: rgba(98, 98, 98, 0.216);
  border-radius: 50%;
  fill: rgb(48, 48, 48);
  width: 20px;
  padding: 5px;
}

.block-info-comment__name {
  font-weight: 700;
  color: #1327a9;
  padding-bottom: 1rem;
}

.block-info-comment__name span {
  font-size: 0.8rem;
  font-weight: normal;
  color: rgba(48, 48, 48, 0.576);
  padding-left: 0.5rem;
}

.block-info-line {
  display: flex;
  flex-direction: column;
}

.block-info-line__like {
  display: flex;
  justify-content: flex-end;
  color: rgb(98, 98, 98);
  font-weight: normal;
  font-size: 0.7rem;
}

@media (max-width: 710px) {
  .comment-block-answer .block-info-comment {
    width: 83%;
  }

  .comment-block-answer {
    margin-left: 1.6rem;
  }

  .block-info-comment__name {
    font-size: 0.85rem;
  }

  .comment-block-answer img {
    width: 100%;
  }

  .comment-block-answer .block-info-comment__svg {
    margin-right: -2rem;
  }

  .block-info-comment__name span {
    padding-left: 0px;
    display: block;
  }
}

.block-info {
  font-weight: 400;
}
