html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, etails, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, button {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font-family: inherit; }

main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

br {
  font-family: "Noto Sans KR", sans-serif !important; }

body {
  min-width: 360px;
  width: 100%;
  font-size: 18px;
  color: #333;
  font-weight: 300;
  line-height: 1.6;
  word-break: keep-all;
  box-sizing: border-box;
  font-family: 'NanumSquare', sans-serif;
  padding-top: 149px; }
  body *, body *::before, body *::after {
    box-sizing: border-box; }
  @media (max-width: 1024px) {
    body {
      padding-top: 79px;
      font-size: 16px; } }

hr {
  display: block;
  border: 0;
  margin: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

input, select, textarea {
  font-family: inherit;
  outline: none; }

a, button {
  color: #000;
  cursor: pointer;
  border: 0;
  padding: 0;
  outline: none;
  text-decoration: none;
  background: none; }
  a:hover, button:hover {
    color: #000; }

.container {
  display: block;
  width: 100%;
  max-width: 1230px;
  padding: 0 15px;
  margin: 0 auto; }

.container-fluid {
  display: block;
  width: 100%;
  padding: 0 15px; }

/* common */
section {
  padding: 100px 0 200px; }
  @media (max-width: 1024px) {
    section {
      padding: 60px 0 160px; } }

/* page-header */
.page-header.opinion-header {
  background-color: rgba(20, 85, 162, 0.8); }
.page-header.commentary-header {
  background-color: rgba(204, 225, 146, 0.8); }
  .page-header.commentary-header .container-fluid > div.details small {
    color: #80993a; }
  .page-header.commentary-header .container-fluid > div.details h3 {
    color: #333; }
    .page-header.commentary-header .container-fluid > div.details h3 i {
      font-size: 26px;
      font-style: normal; }
    .page-header.commentary-header .container-fluid > div.details h3 b {
      font-weight: 900; }
  .page-header.commentary-header .container-fluid > div.details hr {
    background-color: #333; }
  .page-header.commentary-header .container-fluid > div.details p {
    color: #333; }
  .page-header.commentary-header .container-fluid > div.details span {
    color: #333; }
  @media (max-width: 1024px) {
    .page-header.commentary-header .container-fluid > div.details h3 i {
      font-size: 16px; } }
.page-header.prompt-header {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover; }
  .page-header.prompt-header .container-fluid > div.details {
    text-align: center; }
    .page-header.prompt-header .container-fluid > div.details small {
      color: #fff; }
    .page-header.prompt-header .container-fluid > div.details h3 {
      color: #fff; }
    .page-header.prompt-header .container-fluid > div.details hr {
      width: 100px;
      height: 2px;
      margin-left: auto;
      margin-right: auto; }
    .page-header.prompt-header .container-fluid > div.details span {
      color: #fff; }

/* action-wrap */
.action-wrap {
  overflow: hidden;
  padding-top: 200px;
  background-color: #90b1b6; }
  .action-wrap .container {
    max-width: 930px; }
    .action-wrap .container .section-top {
      padding-bottom: 60px; }
      .action-wrap .container .section-top h3 {
        font-size: 0; }
        .action-wrap .container .section-top h3 span {
          position: relative;
          left: 40px;
          opacity: 0;
          display: block; }
          .action-wrap .container .section-top h3 span img {
            display: inline-block;
            vertical-align: top;
            height: 80px; }
          .action-wrap .container .section-top h3 span ~ span {
            margin-top: 100px; }
          .action-wrap .container .section-top h3 span:nth-of-type(2), .action-wrap .container .section-top h3 span:nth-of-type(3) {
            text-align: center; }
          .action-wrap .container .section-top h3 span:nth-of-type(1) {
            -webkit-transition-property: all;
            transition-property: all;
            -webkit-transition-duration: 0.4s;
            transition-duration: 0.4s;
            -webkit-transition-timing-function: linear;
            transition-timing-function: linear;
            -webkit-transition-delay: 0s;
            transition-delay: 0s; }
          .action-wrap .container .section-top h3 span:nth-of-type(2) {
            -webkit-transition-property: all;
            transition-property: all;
            -webkit-transition-duration: 0.4s;
            transition-duration: 0.4s;
            -webkit-transition-timing-function: linear;
            transition-timing-function: linear;
            -webkit-transition-delay: 0.2s;
            transition-delay: 0.2s; }
          .action-wrap .container .section-top h3 span:nth-of-type(3) {
            -webkit-transition-property: all;
            transition-property: all;
            -webkit-transition-duration: 0.4s;
            transition-duration: 0.4s;
            -webkit-transition-timing-function: linear;
            transition-timing-function: linear;
            -webkit-transition-delay: 0.4s;
            transition-delay: 0.4s; }
          .action-wrap .container .section-top h3 span:nth-of-type(4) {
            -webkit-transition-property: all;
            transition-property: all;
            -webkit-transition-duration: 0.4s;
            transition-duration: 0.4s;
            -webkit-transition-timing-function: linear;
            transition-timing-function: linear;
            -webkit-transition-delay: 0.6s;
            transition-delay: 0.6s; }
          .action-wrap .container .section-top h3 span:last-child {
            text-align: right; }
    .action-wrap .container .section-content {
      padding-top: 100px;
      padding: 60px 100px 100px; }
      .action-wrap .container .section-content p {
        font-weight: bold; }
  .action-wrap.show .container .section-top h3 span {
    left: 0;
    opacity: 1; }
  @media (max-width: 1024px) {
    .action-wrap {
      padding-top: 100px; }
      .action-wrap .container {
        max-width: 100%; }
        .action-wrap .container .section-top {
          padding-bottom: 40px; }
          .action-wrap .container .section-top h3 span img {
            height: 50px; }
          .action-wrap .container .section-top h3 span ~ span {
            margin-top: 40px; }
        .action-wrap .container .section-content {
          padding: 40px 30px 60px; } }

/* opinion */
.opinion .container article {
  display: table;
  width: 100%;
  height: 100%;
  table-layout: fixed; }
  .opinion .container article > div {
    display: table-cell;
    vertical-align: middle;
    height: 100%; }
  .opinion .container article h3 {
    font-size: 30px;
    font-weight: 900; }
  .opinion .container article p {
    margin-top: 30px; }
  .opinion .container article .article-content {
    width: 400px; }
    .opinion .container article .article-content > figure img {
      display: block;
      width: 100%; }
  .opinion .container article ~ article {
    margin-top: 60px; }
  .opinion .container article:nth-of-type(2n + 1) > div.article-header {
    padding-right: 60px; }
  .opinion .container article:nth-of-type(2n + 1) > div.article-content {
    border-left: 1px solid #000;
    padding-left: 60px; }
  .opinion .container article:nth-of-type(2n + 2) > div.article-header {
    padding-left: 60px; }
  .opinion .container article:nth-of-type(2n + 2) > div.article-content {
    border-right: 1px solid #000;
    padding-right: 60px; }
  .opinion .container article:last-child {
    text-align: center; }
.opinion .container .summary {
  text-align: center;
  padding: 100px 0 40px; }
  .opinion .container .summary strong {
    font-size: 30px;
    font-weight: 900;
    line-height: 2;
    color: #2a6b78;
    text-underline-offset: 10px;
    text-decoration: underline; }
@media (max-width: 1024px) {
  .opinion .container article {
    display: flex;
    flex-direction: column; }
    .opinion .container article h3 {
      font-size: 20px; }
    .opinion .container article p {
      margin-top: 20px; }
      .opinion .container article p br {
        display: none; }
    .opinion .container article > div {
      width: 100% !important;
      padding: 0 !important; }
    .opinion .container article .article-header {
      margin-top: 30px;
      text-align: center; }
    .opinion .container article .article-content {
      border: 0 !important; }
    .opinion .container article:nth-of-type(2n + 1) {
      flex-direction: column-reverse; }
    .opinion .container article ~ article {
      margin-top: 40px; }
  .opinion .container .summary {
    padding: 60px 0 20px; }
    .opinion .container .summary strong {
      font-size: 20px; } }

/* commentary */
.commentary .container > ul {
  font-size: 0;
  text-align: center; }
  .commentary .container > ul > li {
    display: inline-block;
    vertical-align: top;
    width: 50%; }
    .commentary .container > ul > li .box {
      padding: 0 60px 45px;
      border-bottom: 10px solid #80993a;
      border-bottom-left-radius: 200px;
      border-bottom-right-radius: 200px; }
      .commentary .container > ul > li .box h4 {
        font-size: 26px;
        font-weight: 900;
        color: #80993a; }
      .commentary .container > ul > li .box span {
        display: block;
        color: #333;
        font-weight: bold;
        font-size: 18px;
        margin-top: 5px; }
      .commentary .container > ul > li .box p {
        font-size: 18px;
        color: #333;
        margin-top: 30px;
        letter-spacing: -1px; }
    .commentary .container > ul > li:nth-of-type(2n + 1) {
      padding-right: 30px; }
    .commentary .container > ul > li:nth-of-type(2n + 2) {
      padding-left: 30px; }
    .commentary .container > ul > li:nth-of-type(2) ~ li {
      margin-top: 60px; }
@media (max-width: 1024px) {
  .commentary .container > ul > li {
    display: block;
    width: 100%;
    padding: 0 !important; }
    .commentary .container > ul > li .box {
      padding: 0 30px 30px;
      border-bottom-left-radius: 100px;
      border-bottom-right-radius: 100px; }
      .commentary .container > ul > li .box h4 {
        font-size: 20px; }
      .commentary .container > ul > li .box span {
        font-size: 16px; }
      .commentary .container > ul > li .box p {
        font-size: 14px; }
    .commentary .container > ul > li ~ li {
      margin-top: 60px; } }

/* interview-header */
.interview-header {
  color: #000;
  text-align: center;
  padding: 100px 0;
  background-color: #86d0ca; }
  .interview-header .container small {
    display: block;
    font-size: 22px;
    font-weight: 900; }
  .interview-header .container h3 {
    display: block;
    font-size: 40px;
    font-weight: 900;
    margin-top: 20px; }
  .interview-header .container p {
    display: block;
    font-size: 20px;
    font-weight: 500;
    margin-top: 30px; }
  .interview-header .container span {
    display: block;
    font-size: 18px;
    font-weight: 400;
    margin-top: 20px; }
    .interview-header .container span b {
      font-weight: 900; }
  @media (max-width: 1024px) {
    .interview-header {
      padding: 60px 0; }
      .interview-header .container small {
        font-size: 14px; }
      .interview-header .container h3 {
        font-size: 25px;
        margin-top: 20px; }
      .interview-header .container p {
        font-size: 16px; }
        .interview-header .container p br {
          display: none; }
      .interview-header .container span {
        font-size: 14px; } }

/* interview */
.interview {
  padding: 0; }
  .interview article {
    padding: 100px 0; }
    .interview article .container > div.details .title-wrap {
      text-align: center;
      padding-bottom: 60px; }
      .interview article .container > div.details .title-wrap .icon {
        display: block;
        width: 60px;
        margin: 0 auto; }
        .interview article .container > div.details .title-wrap .icon img {
          display: block;
          width: 100%; }
      .interview article .container > div.details .title-wrap h3 {
        font-size: 30px;
        color: #333;
        font-weight: 900;
        margin-top: 20px; }
      .interview article .container > div.details .title-wrap > ul {
        font-size: 0;
        margin-top: 30px; }
        .interview article .container > div.details .title-wrap > ul > li {
          display: inline-block;
          font-size: 20px;
          color: #fff;
          font-weight: 900;
          line-height: 48px;
          vertical-align: top;
          padding: 0 30px;
          border-radius: 100%; }
          .interview article .container > div.details .title-wrap > ul > li ~ li {
            margin-left: -20px; }
          .interview article .container > div.details .title-wrap > ul > li:nth-of-type(1) {
            background-color: rgba(102, 135, 51, 0.8); }
          .interview article .container > div.details .title-wrap > ul > li:nth-of-type(2) {
            background-color: rgba(43, 137, 175, 0.8); }
      .interview article .container > div.details .title-wrap > figure {
        margin-top: 60px; }
        .interview article .container > div.details .title-wrap > figure img {
          overflow: hidden;
          display: block;
          max-width: 100%;
          margin: 0 auto;
          border-radius: 20px; }
    .interview article .container > div.details .contents > ul > li > dl {
      display: flex; }
      .interview article .container > div.details .contents > ul > li > dl > dt {
        position: relative;
        width: 160px;
        font-weight: 900;
        flex-shrink: 0;
        padding-right: 60px; }
        .interview article .container > div.details .contents > ul > li > dl > dt:after {
          position: absolute;
          top: 20px;
          right: 12px;
          width: 50px;
          height: 1px;
          content: '';
          background-color: #333; }
    .interview article .container > div.details .contents > ul > li:nth-of-type(2n + 1) > dl > dt {
      color: #7e9b51; }
    .interview article .container > div.details .contents > ul > li:nth-of-type(2n + 2) > dl > dt {
      color: #2496c4; }
    .interview article .container > div.details .contents > ul > li ~ li {
      margin-top: 30px; }
    .interview article ~ article {
      background-color: #f0f0f0;
      padding-bottom: 200px; }
  @media (max-width: 1024px) {
    .interview {
      overflow: hidden; }
      .interview article {
        padding: 60px 0; }
        .interview article .container > div.details .title-wrap {
          padding-bottom: 30px; }
          .interview article .container > div.details .title-wrap .icon {
            width: 40px; }
          .interview article .container > div.details .title-wrap h3 {
            font-size: 25px;
            margin-top: 15px; }
          .interview article .container > div.details .title-wrap > ul {
            margin-top: 20px; }
            .interview article .container > div.details .title-wrap > ul > li {
              font-size: 18px;
              line-height: 38px; }
          .interview article .container > div.details .title-wrap > figure {
            max-width: calc(100% + 30px);
            margin: 30px -15px 0; }
            .interview article .container > div.details .title-wrap > figure img {
              border-radius: 0; }
        .interview article .container > div.details .contents > ul > li > dl {
          display: block; }
          .interview article .container > div.details .contents > ul > li > dl > dt {
            display: inline;
            padding-right: 40px; }
            .interview article .container > div.details .contents > ul > li > dl > dt:after {
              right: 2px;
              width: 30px;
              top: calc(100% - 3px); }
          .interview article .container > div.details .contents > ul > li > dl > dd {
            display: inline; }
        .interview article .container > div.details .contents > ul > li ~ li {
          margin-top: 15px; }
        .interview article ~ article {
          padding-bottom: 160px; } }

/* prompt */
.prompt .container article {
  display: flex;
  align-items: center; }
  .prompt .container article .article-header {
    text-align: center;
    padding-bottom: 40px; }
    .prompt .container article .article-header > dl dt {
      font-size: 30px;
      font-weight: 900; }
    .prompt .container article .article-header > dl dd {
      font-size: 20px;
      margin-top: 30px; }
  .prompt .container article .article-content {
    flex-shrink: 0;
    width: 500px; }
    .prompt .container article .article-content > figure img {
      display: block;
      max-width: 100%;
      margin: 0 auto; }
  .prompt .container article:nth-of-type(2n + 1) .article-header {
    padding-right: 60px; }
  .prompt .container article:nth-of-type(2n + 2) .article-header {
    padding-left: 60px; }
  .prompt .container article ~ article {
    margin-top: 100px;
    flex-direction: row-reverse; }
.prompt .container .tip-summary {
  max-width: 1000px;
  margin: 100px auto 0; }
  .prompt .container .tip-summary dl dt {
    display: inline-block;
    color: #fff;
    font-size: 26px;
    font-weight: bold;
    line-height: 2;
    padding: 0 45px;
    margin-left: 40px;
    background-color: #000;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px; }
  .prompt .container .tip-summary dl dd {
    border: 5px solid #000;
    padding: 30px 45px; }
    .prompt .container .tip-summary dl dd > ol > li {
      position: relative;
      padding-left: 30px; }
      .prompt .container .tip-summary dl dd > ol > li span {
        position: absolute;
        top: 4px;
        left: 0;
        font-size: 14px;
        color: #000;
        width: 20px;
        font-weight: bold;
        text-align: center;
        height: 20px;
        line-height: 18px;
        border-radius: 50%;
        border: 1px solid #000; }
      .prompt .container .tip-summary dl dd > ol > li ~ li {
        margin-top: 5px; }
@media (max-width: 1024px) {
  .prompt {
    overflow: hidden; }
    .prompt .container article {
      display: block; }
      .prompt .container article > div.article-header {
        padding: 0 !important; }
        .prompt .container article > div.article-header > dl dt {
          font-size: 26px; }
        .prompt .container article > div.article-header > dl dd {
          font-size: 16px;
          margin-top: 20px; }
      .prompt .container article > div.article-content {
        width: 100%;
        margin-top: 30px; }
        .prompt .container article > div.article-content > figure {
          width: calc(100% + 30px);
          margin: 0 -15px; }
      .prompt .container article ~ article {
        margin-top: 60px; }
    .prompt .container .tip-summary {
      margin-top: 60px; }
      .prompt .container .tip-summary > dl dt {
        font-size: 18px;
        padding: 0 20px;
        margin-left: 20px; }
      .prompt .container .tip-summary > dl dd {
        border-width: 3px;
        padding: 20px 15px; }
        .prompt .container .tip-summary > dl dd > ol > li {
          padding-left: 20px; }
          .prompt .container .tip-summary > dl dd > ol > li span {
            width: 16px;
            height: 16px;
            font-size: 12px;
            line-height: 16px; } }

/*# sourceMappingURL=action.css.map */