@charset "UTF-8";
/************************************************************************************/
/************************************* variable *************************************/
/************************************************************************************/
:root {
  --inner:1440px;
  --contents-inner:1044px;
}

/************************************************************************************/
/************************************* Colors *************************************/
/************************************************************************************/
:root {
  --black:#000;
  --white:#fff;
  --footer:#141415;
  --gray-d1:#d1d1d1;
  --gray-7c:#7c7c7c;
  --gray-ec:#ececec;
  --gray-9a:#9a9a9a;
  --gray-81:#818181;
  --gray-f0:#f0f0f0;
  --gray-f8:#f8f8f8;
  --border-color:var(--gray-d1);
  --link-color:var(--black);
  --date-color:var(--gray-81);
  --dtaq-label-color:var(--white);
  --dtaq-label-1-color:#406cff;
  --dtaq-label-2-color:#ff634a;
  --dtaq-label-3-color:#342d35;
  --dtaq-label-4-color:#cb14eb;
  --dtaq-label-5-color:#13aa1a;
  --link-active-color:#e9e9e9;
  --headline-color:#eceff8;
  --point-color:#406dff;
  --slogan-color:#919191;
  --mini-interview-point-color:#2e3192;
  --bulletin-border-color:var(--gray-d1);
  --bulletin-point-color:#243287;
}

html {
  font-size: 62.5%;
}

body {
  font-family: "pretendard", sans-serif;
  font-size: 1.8rem;
}
body:has(#page_header.fixed) {
  padding-top: 58px;
}

pre {
  font-family: "pretendard", sans-serif;
}

.btn {
  font-size: 1em;
}

.txt-center {
  text-align: center;
}

.txt-right {
  text-align: right;
}

.btn {
  border-radius: 0;
  padding: 0.5em 1em;
}

.btn-success {
  background: var(--point-color);
}

.form-control,
.form-select {
  font-size: 1em;
}

.modal .modal-header h2 {
  font-weight: 600;
}

.modal-subscribe .modal-content {
  background: var(--gray-f0);
}
.modal-subscribe .modal-header {
  border-bottom: none;
  padding: 2em 0;
  justify-content: center;
}
.modal-subscribe .modal-header .modal-title {
  font-size: 1em;
  color: var(--white);
  background: var(--point-color);
  padding: 1rem 3rem;
}
.modal-subscribe .modal-header .btn-close {
  margin: 0;
  position: absolute;
  top: 2rem;
  right: 1rem;
}
.modal-subscribe .modal-body > div {
  background: var(--white);
  padding: 1rem;
  margin-bottom: 1em !important;
}
.modal-subscribe .modal-body > div > label, .modal-subscribe .modal-body > div > div:first-child {
  font-weight: 500;
  margin-bottom: 1em;
}
.modal-subscribe .modal-body > div.subscribe-terms {
  margin-bottom: 0 !important;
}
.modal-subscribe .modal-body > div.subscribe-terms > div {
  font-weight: 500;
  margin-bottom: 1em;
}
.modal-subscribe .modal-body > div.form-check {
  padding-left: 1rem;
}
.modal-subscribe .modal-body .form-check {
  padding-left: 0;
}
.modal-subscribe .modal-body .form-check .form-check-input {
  border-color: var(--black);
  margin-left: 0;
  float: none;
}
.modal-subscribe .modal-footer {
  border-top: none;
  padding-bottom: 2em;
  justify-content: center;
}

.quick {
  width: 100%;
  background: var(--white);
  border-top: 1px solid var(--border-color);
  position: fixed;
  bottom: 0;
  z-index: 600;
}
.quick div {
  background: var(--white);
  padding: 0.5em 0;
  display: flex;
  justify-content: space-between;
}
.quick div button {
  width: calc(20% - 3rem);
  margin: 0 1.5rem;
}
.quick div button::before {
  content: "";
  border: none;
  border-radius: 1rem;
  background-color: var(--white);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 40%;
  padding-top: 100%;
  display: block;
}
.quick div button:disabled {
  cursor: default;
}
.quick div button span {
  display: none;
}
.quick div button.share::before {
  background-image: url("/images/layouts/dtaq/common/share.svg");
}
.quick div button.share-active::before {
  background-color: var(--link-active-color);
}
.quick div button.print::before {
  background-image: url("/images/layouts/dtaq/common/print.svg");
}
.quick div button.subscription::before {
  background-image: url("/images/layouts/dtaq/common/subscription.svg");
}
.quick div button.push-active::before {
  background-image: url("/images/layouts/dtaq/common/notifications_active.svg");
}
.quick div button.push-off::before {
  background-image: url("/images/layouts/dtaq/common/notifications_off.svg");
}
.quick div button.brochure::before {
  background-image: url("/images/layouts/dtaq/common/brochure.svg");
}
.quick div.share-list {
  width: 100%;
  border: 1px solid var(--border-color);
  border-width: 1px 0;
  border-radius: 2rem 2rem 0 0;
  background: var(--white);
  padding: 1em 0;
  margin-bottom: 1em;
  justify-content: center;
  position: absolute;
  top: 0;
  transition: all 0.4s ease;
  transform: translateY(300%);
  opacity: 0;
  animation-fill-mode: forwards;
}
.quick div.share-list.--close {
  animation-duration: 3s;
  animation-name: quick-share-close;
}
.quick div.share-list.--open {
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-name: quick-share-open;
}
.quick div.share-list button {
  width: calc(20% - 2rem);
  flex: none;
}
.quick div.share-list button::before {
  border: none;
  border-radius: 50%;
}
.quick div.share-list button.kakao::before {
  background-color: #FFC20E;
  background-image: url("/images/layouts/dtaq/common/kakao.svg");
  background-size: 20%;
}
.quick div.share-list button.facebook::before {
  background-color: #00549E;
  background-image: url("/images/layouts/dtaq/common/facebook.svg");
  background-size: 20%;
}
.quick div.share-list button.blog::before {
  background-color: #3BAC37;
  background-image: url("/images/layouts/dtaq/common/blog.svg");
  background-size: 50%;
}
.quick div.share-list button.x::before {
  border: 1px solid var(--border-color);
  background-image: url("/images/layouts/dtaq/common/x.svg");
}
.quick div.share-list button.link::before {
  border: 1px solid var(--border-color);
  background-image: url("/images/layouts/dtaq/common/link.svg");
}

.top-header {
  width: 100%;
  border-bottom: 1px solid var(--border-color);
  margin-bottom: 1em;
  transition: all 0.3s ease;
  z-index: 500;
}
.top-header.fixed {
  position: fixed;
  top: 0;
  left: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(6px);
  padding-bottom: 1em;
}

.logo-wrap {
  padding: 1rem;
  display: flex;
  align-items: center;
}
.logo-wrap .burger {
  width: 2%;
  min-width: 20px;
  margin-right: 2rem;
  cursor: pointer;
  position: relative;
  z-index: 110;
}
.logo-wrap .burger::before {
  content: "";
  padding-top: 80%;
  display: block;
}
.logo-wrap .burger span {
  width: 100%;
  height: 2px;
  background: var(--black);
  display: block;
  position: absolute;
  transform-origin: center center;
  transition: all 0.4s ease;
}
.logo-wrap .burger span:nth-child(1) {
  top: 0;
}
.logo-wrap .burger span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}
.logo-wrap .burger span:nth-child(3) {
  bottom: 0;
}
.logo-wrap .burger.--open span {
  background: var(--white);
}
.logo-wrap .burger.--open span:nth-child(1) {
  top: 50%;
  transform: rotate(45deg);
}
.logo-wrap .burger.--open span:nth-child(2) {
  opacity: 0;
}
.logo-wrap .burger.--open span:nth-child(3) {
  top: 50%;
  transform: rotate(-45deg);
  bottom: auto;
}
.logo-wrap .logo {
  width: 9.5%;
  max-width: 180px;
  min-width: 100px;
}
.logo-wrap .logo a {
  height: 100%;
  background: url("/images/layouts/dtaq/common/logo.png") no-repeat;
  background-size: 100%;
  padding-top: 26%;
  display: block;
}
.logo-wrap .util-wrap {
  width: 43%;
  margin-left: auto;
  display: flex;
  align-items: center;
}
.logo-wrap .util-wrap .search-box {
  font-size: 0.9em;
  border: 2px solid var(--black);
  border-radius: 3rem;
  padding: 0.2em 1em;
  position: relative;
}
.logo-wrap .util-wrap .search-box input {
  width: 90%;
  border: none;
}
.logo-wrap .util-wrap .search-box button {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  right: 1rem;
  transform: translateY(-65%);
}
.logo-wrap .util-wrap .subscription {
  font-size: 0.9em;
  border-radius: 3rem;
  padding: 0.5em 1em;
  margin-left: 1rem;
  display: none;
}

.nav {
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: -100%;
  transition: all 0.4s ease;
  z-index: 100;
}
.nav nav {
  width: 100%;
}
.nav nav a {
  color: var(--white);
  text-decoration: none;
  display: block;
}
.nav nav .depth-1-container {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.nav nav .depth-1-container > li {
  font-size: 4vh;
  text-align: center;
}
.nav nav .depth-1-container > li:hover a {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 1px;
}
.nav nav .depth-1-container > li:nth-child(3) {
  display: flex;
  justify-content: center;
  align-items: center;
}
.nav nav .depth-1-container > li:nth-child(3)::after {
  content: "";
  width: 35px;
  height: 25px;
  background: url("/images/layouts/dtaq/common/icon_youtube.svg") no-repeat;
  margin-left: 9px;
  display: block;
}

.logo-wrap:has(.burger.--open) ~ .nav {
  left: 0;
}
.logo-wrap:has(.burger.--open) ~ .nav > nav {
  display: block;
}

footer {
  font-size: 0.9em;
  color: var(--white);
  background: var(--footer);
  padding: 5em 0 10em 0;
}
footer .info-wrap {
  margin-bottom: 2em;
}
footer .copy {
  color: var(--gray-9a);
}
footer .aside-wrap {
  display: flex;
  align-items: center;
}
footer .aside-wrap a {
  display: block;
}
footer .aside-wrap .dtaq {
  display: flex;
  align-items: center;
}
footer .aside-wrap .dtaq img {
  width: 150px;
}
footer .aside-wrap .dtaq::after {
  content: "";
  width: 1px;
  height: 20px;
  border-right: 1px solid var(--white);
  margin: 0 3rem;
  display: block;
}
footer .aside-wrap .youtube img {
  width: 30px;
}

.dtaq-label {
  font-size: 0.85em;
  font-weight: 500;
  color: var(--dtaq-label-color);
  border-radius: 0.5em;
  padding: 0.5em 1em;
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 1;
}
.dtaq-label-6, .dtaq-label-10, .dtaq-label-27 {
  background: var(--dtaq-label-1-color);
}
.dtaq-label-7, .dtaq-label-11, .dtaq-label-28 {
  background: var(--dtaq-label-2-color);
}
.dtaq-label-8, .dtaq-label-12, .dtaq-label-29 {
  background: var(--dtaq-label-3-color);
}
.dtaq-label-9, .dtaq-label-13, .dtaq-label-30 {
  background: var(--dtaq-label-4-color);
}
.dtaq-label-14, .dtaq-label-31 {
  background: var(--dtaq-label-5-color);
}

div {
  margin: 0;
}

button.btn-icon {
  font-family: "Material Symbols Outlined";
  font-size: 2.4rem;
  line-height: 1;
}
button.btn-icon-basic {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
}

.youtube-modal-wrap {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 200;
  top: 0;
  left: 0;
}
.youtube-modal-wrap .youtube-modal-inner {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
}
.youtube-modal-wrap .youtube-modal-inner .youtube-play-area {
  position: relative;
  width: calc(100% - 20px);
  max-width: 1200px;
  background: #fff;
}
.youtube-modal-wrap .youtube-modal-inner .youtube-play-area:before {
  display: block;
  content: "";
  width: 100%;
  padding-top: 56.25%;
}
.youtube-modal-wrap .youtube-modal-inner .youtube-play-area > .content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.youtube-modal-wrap .youtube-modal-inner .youtube-play-area iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.youtube-modal-wrap .youtube-modal-inner .close {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}
.youtube-modal-wrap .youtube-modal-inner .close span {
  width: 50px;
  height: 2px;
  background: #fff;
  display: block;
  position: absolute;
  top: 20px;
  transform: rotate(45deg);
}
.youtube-modal-wrap .youtube-modal-inner .close span:last-child {
  transform: rotate(-45deg);
}

@media screen and (min-width: 640px) {
  body:has(#page_header.fixed) {
    padding-top: 63px;
  }
  .top-header {
    margin-bottom: 0;
    padding-bottom: 1rem;
  }
  .logo-wrap .util-wrap {
    width: auto;
  }
  .logo-wrap .util-wrap .subscription {
    display: block;
  }
  .quick {
    width: 50px;
    border: none;
    background: none;
    position: fixed;
    right: 10px;
    bottom: 10vh;
  }
  .quick > div {
    background: none;
    padding: 0;
    display: block;
  }
  .quick > div button {
    width: 100%;
    margin: 0 0 1rem 0;
  }
  .quick > div button span {
    font-size: 0.65em;
    display: block;
  }
  .quick > div button::before {
    border: 1px solid var(--border-color);
    border-radius: 50%;
  }
  .quick > div.share-list {
    width: auto;
    border: none;
    background: none;
    padding: 0;
    margin-bottom: 0;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateX(-100%);
    opacity: 1;
  }
  .quick > div.share-list button {
    transform: translateX(600%);
    opacity: 0;
    animation-fill-mode: both;
  }
  .quick > div.share-list.--open {
    animation: none;
  }
  .quick > div.share-list.--open button {
    animation-duration: 1s;
    animation-name: quick-share-open-pc;
  }
  .quick > div.share-list.--open button.facebook {
    animation-delay: 0.1s;
  }
  .quick > div.share-list.--open button.x {
    animation-delay: 0.25s;
  }
  .quick > div.share-list.--open button.link {
    animation-delay: 0.5s;
  }
  .quick > div.share-list.--close {
    animation: none;
  }
  .quick > div.share-list.--close button {
    opacity: 1;
    animation-duration: 1s;
    animation-name: quick-share-close-pc;
  }
  .quick > div.share-list.--close button.x {
    animation-delay: 0.2s;
  }
  .quick > div.share-list.--close button.facebook {
    animation-delay: 0.4s;
  }
  .quick > div.share-list.--close button.blog {
    animation-delay: 0.6s;
  }
  .quick > div.share-list button {
    width: 50px;
    margin-right: 1rem;
  }
  footer {
    padding: 5em 0;
  }
  footer > .inner {
    display: flex;
    align-items: center;
  }
  footer .info-wrap {
    margin-bottom: 0;
  }
  footer .aside-wrap {
    margin-left: auto;
  }
}
@media screen and (min-width: 768px) {
  #modal_subscribe.show {
    display: flex !important;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (min-width: 940px) {
  body:has(#page_header.fixed) {
    padding-top: 182px;
  }
  .top-header {
    border-bottom: none;
  }
  .logo-wrap {
    padding: 2em;
  }
  .logo-wrap .burger {
    display: none;
  }
  .logo-wrap .util-wrap .search-box {
    width: 25rem;
    font-size: 0.9em;
    border: 2px solid var(--black);
    border-radius: 3rem;
    padding: 0.5em 1em;
    position: relative;
  }
  .logo-wrap .util-wrap .search-box input {
    display: block;
  }
  .logo-wrap .util-wrap .subscription {
    font-size: 0.9em;
    border-radius: 3rem;
    padding: 0.5em 1em;
    margin-left: 1rem;
  }
  .nav {
    width: auto;
    height: auto;
    background: none;
    position: relative;
    left: auto;
  }
  .nav nav {
    display: flex;
  }
  .nav nav > .depth-1-container {
    width: auto;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    position: relative;
    top: auto;
    left: auto;
    transform: none;
  }
  .nav nav > .depth-1-container > li {
    font-size: 1.1em;
    font-weight: 500;
    margin-right: 3em;
  }
  .nav nav > .depth-1-container > li:last-child {
    margin-right: 0;
  }
  .nav nav > .depth-1-container > li:nth-child(3)::after {
    width: 25px;
    height: 17px;
    margin-left: 9px;
  }
  .nav nav > .depth-1-container > li > a {
    text-decoration: none;
    color: var(--black);
  }
}
@media screen and (min-width: 950px) {
  body:has(#page_header.fixed) {
    padding-top: 153px;
  }
}
@media screen and (min-width: 1280px) {
  .logo-wrap .logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
}
.highlighted {
  background-color: rgb(255, 255, 145);
  color: rgb(33, 37, 41);
}

div:where(.swal2-container) {
  position: fixed !important;
}

@keyframes quick-share-open {
  from {
    transform: translateY(0);
    opacity: 0;
  }
  to {
    transform: translateY(-100%);
    opacity: 1;
  }
}
@keyframes quick-share-close {
  from {
    transform: translateY(-100%);
    opacity: 1;
  }
  to {
    transform: translateY(300%);
    opacity: 0;
  }
}
@keyframes quick-share-open-pc {
  0% {
    transform: translateX(600%);
    opacity: 0;
  }
  20% {
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes quick-share-close-pc {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  80% {
    opacity: 0;
  }
  100% {
    transform: translateX(600%);
    opacity: 0;
  }
}
#scroll_trigger {
  height: 1px;
}

.visual {
  max-width: 1740px;
  padding: 0 1rem;
  margin: 0 auto 4vh auto;
  position: relative;
}
.visual .slogun-wrap .date {
  font-family: "Poppins", sans-serif;
  font-size: 2em;
  font-weight: 300;
  line-height: 80%;
  letter-spacing: -0.4rem;
  margin-bottom: 0.2em;
}
.visual .slogun-wrap .date span {
  font-size: 0.3em;
  letter-spacing: 0;
  color: var(--gray-7c);
  display: block;
}
.visual .slogun-wrap .slogun {
  font-family: "NotoHanSemiBold", serif;
  font-size: 1.5em;
  margin-bottom: 1rem;
  display: block;
}
.visual .slogun-wrap .slogun img {
  width: 2.5rem;
  margin-bottom: 1rem;
  display: block;
}
.visual .slogun-wrap .slogun br {
  display: none;
}
.visual .slogun-wrap .visual-arrow {
  display: none;
}

@media screen and (min-width: 1280px) {
  .visual {
    margin: 10rem auto;
    display: flex;
  }
  .visual .slogun-wrap {
    width: 45%;
  }
  .visual .slogun-wrap .date {
    font-size: 4.5em;
    margin-bottom: 1em;
  }
  .visual .slogun-wrap .slogun {
    font-family: "NotoHanSemiBold", serif;
    font-size: 2.5em;
    margin-bottom: 2em;
    position: absolute;
    bottom: 0;
  }
  .visual .slogun-wrap .slogun img {
    width: 4.5rem;
    margin-bottom: 4rem;
    display: block;
  }
  .visual .slogun-wrap .slogun br {
    display: block;
  }
  .visual .slogun-wrap .visual-arrow {
    width: 20%;
    display: block;
    position: absolute;
    top: 40%;
    right: 0;
    transform: translateY(-50%);
  }
  .visual .main-visual {
    width: 53.325%;
    margin-left: auto;
  }
}
input.error,
select.error,
textarea.error {
  border-color: var(--bs-danger) !important;
}
input.valid,
select.valid,
textarea.valid {
  border-color: var(--bs-success) !important;
}
.input-container > label.error, input.error ~ label.error,
select.error ~ label.error,
textarea.error ~ label.error {
  position: absolute;
  width: auto;
  top: 100%;
  z-index: 5;
  display: block;
  max-width: 100%;
  padding: 0.25rem 0.5rem;
  margin-top: 0.1rem;
  font-size: 1.4rem !important;
  color: #fff;
  background-color: var(--bs-danger);
  border-radius: var(--bs-border-radius);
}

h3 {
  font-size: 1.2em;
  font-weight: 600;
  word-break: keep-all;
}

.marginB {
  margin-bottom: 4em;
}

.row > * {
  padding-right: 0;
  padding-left: 0;
}

.inner {
  max-width: var(--inner);
  padding: 0 1rem;
  margin-right: auto;
  margin-left: auto;
}
.inner header {
  margin-bottom: 2em;
  position: relative;
}
.inner header h2 {
  font-family: "Paperlogy", sans-serif;
  font-weight: 700;
  font-size: 1.6em;
  margin-bottom: 0;
}
.inner header h2 span {
  font-family: "pretendard", sans-serif;
  font-size: 0.5em;
  font-weight: normal;
  display: block;
  opacity: 0.4;
}
.inner header.line-header {
  border-bottom: 2px solid var(--black);
  padding-bottom: 1rem;
}
.inner header .more {
  color: var(--black);
  text-decoration: none;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.inner header .more:hover {
  text-decoration: underline;
}
.inner header .more img {
  height: 12px;
  margin-left: 1rem;
}

.ai-keyword {
  padding: 2.5em 1rem;
  background: #243287;
}
.ai-keyword header {
  margin-bottom: 2em;
}
.ai-keyword header h2 {
  color: var(--white);
}
.ai-keyword .ai-keyword-img {
  width: 90%;
  max-width: 647px;
  opacity: 0.2;
  position: absolute;
  right: 0;
  bottom: 0;
}
.ai-keyword .keyword-wrap {
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  --gap: .5rem;
  gap: var(--gap);
  z-index: 10;
}
.ai-keyword .keyword-wrap > div {
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  gap: var(--gap);
  min-width: 100%;
  user-select: none;
}
.ai-keyword .keyword-wrap > div > figure {
  height: 40px;
  border-radius: 1rem;
  margin: 0 1rem 2rem;
  display: block;
  overflow: hidden;
}
.ai-keyword .keyword-wrap > div > figure img {
  height: 100%;
}
.ai-keyword .keyword-wrap > div a {
  font-size: 0.9em;
  font-weight: 700;
  color: var(--black);
  text-decoration: none;
  border-radius: 3rem;
  background: var(--white);
  padding: 0.5em 1em;
  margin: 0 1rem 2rem;
  display: flex;
  align-items: center;
  z-index: 10;
}

.slick-arrow {
  width: 30px;
  height: 30px;
  text-indent: -990px;
  border-radius: 50%;
  background: center center/20% no-repeat url("/images/layouts/dtaq/default/slide_next.svg"), var(--gray-ec);
  background-size: 20%;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
}
.slick-arrow:hover, .slick-arrow:focus {
  background: center center/23% no-repeat url("/images/layouts/dtaq/default/slide_next.svg"), var(--gray-ec);
}
.slick-arrow.slick-prev {
  background-image: url("/images/layouts/dtaq/default/slide_prev.svg");
  left: 0;
}
.slick-arrow.slick-prev:hover, .slick-arrow.slick-prev:focus {
  background-image: url("/images/layouts/dtaq/default/slide_prev.svg");
}

.slide-contents {
  padding-top: 3rem;
}
.slide-contents a {
  text-decoration: none;
  display: block;
  position: relative;
}
.slide-contents a .img-wrap {
  padding-top: 68.75%;
  margin-bottom: 1em;
}
.slide-contents a .img-wrap figure {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
.slide-contents a .img-wrap figure img {
  transition: all 0.4s ease;
}
.slide-contents a:hover .img-wrap figure img {
  transform: scale(1.05);
}
.slide-contents a .date {
  color: var(--gray-7c);
}
.slide-contents a h3 {
  color: var(--black);
}

/* 카드뉴스(s) */
.cardnews a .img-wrap {
  padding-top: 64.2592592593%;
}

/* 카드뉴스(e) */
/* 기술로 품질로(s) */
.dtaq-magazine a {
  text-decoration: none;
  margin-bottom: 2em;
  display: block;
  position: relative;
}
.dtaq-magazine a .img-wrap {
  padding-top: 68.75%;
  margin-bottom: 1em;
}
.dtaq-magazine a .img-wrap figure {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
.dtaq-magazine a .img-wrap figure img {
  transition: all 0.4s ease;
}
.dtaq-magazine a:hover .img-wrap figure img {
  transform: scale(1.05);
}
.dtaq-magazine a h3 {
  color: var(--black);
}

/* 기술로 품질로(e) */
/* 카드뉴스(s) */
.cardnews-wrap {
  margin-bottom: 4em;
}

.cardnews img {
  width: 100%;
}

/* 카드뉴스(e) */
/* dqs 연구논집(s) */
.journal-dqs a {
  padding-right: 2rem;
}
.journal-dqs a .img-wrap {
  padding-top: 141.3580246914%;
}

/* dqs 연구논집(e) */
/* banner(s) */
.banner {
  background: center center/cover no-repeat url("/images/layouts/dtaq/default/banner_bg.jpg");
}
.banner .inner {
  font-size: 0.8em;
  padding-top: 5em;
  padding-bottom: 5em;
}
.banner .inner h2 {
  text-align: center;
}
.banner .inner div {
  max-width: 90%;
  word-break: keep-all;
  border-radius: 5rem;
  background: var(--white);
  padding: 10px 120px 10px 10px;
  margin: 0 auto;
  display: table;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.banner .inner div span {
  width: 100px;
  height: 100%;
  color: var(--white);
  background: var(--black);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  right: 0;
}

/* banner(e) */
.cardnews-modal-wrap {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 200;
  top: 0;
  left: 0;
}
.cardnews-modal-wrap .cardnews-modal-inner {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal {
  width: 100%;
  max-width: 1140px;
  max-height: 100%;
  padding: 0 10px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 900;
  justify-content: center;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal.modal-show {
  display: flex;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal > div {
  width: 100%;
  height: fit-content;
  border-radius: 1rem;
  background: #fff;
  overflow: hidden;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap {
  width: 100%;
  position: relative;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider {
  width: 100%;
  height: 100%;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider .slick-slide {
  margin-right: 0;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider img {
  width: 100%;
  max-height: 100%;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider button {
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  text-indent: -999px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  overflow: hidden;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider button.slick-prev {
  background-image: url("/images/board/cardnews_modal_prev.png");
  left: 10px;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap .cardnews-slider button.slick-next {
  background-image: url("/images/board/cardnews_modal_next.png");
  right: 10px;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .text-wrap {
  font-size: 1.4rem;
  padding: 2rem;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .text-wrap .writer {
  margin-bottom: 2rem;
  display: flex;
  align-items: center;
}
.cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .text-wrap .writer::before {
  content: "";
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid #d1d1d1;
  border-radius: 50%;
  background: url("/images/layouts/dtaq/common/tq.svg") no-repeat center center/80%;
  margin-right: 0.5rem;
}

@media screen and (min-width: 580px) {
  .banner .inner {
    font-size: 1em;
  }
  .ai-keyword .keyword-wrap > div > figure {
    height: 57px;
  }
  .ai-keyword .keyword-wrap > div a {
    border-radius: 2rem;
    padding: 1em 2em;
  }
  .ai-keyword .ai-keyword-img {
    width: 33.6979%;
    max-width: 647px;
    top: 2.5em;
    bottom: auto;
  }
}
@media screen and (min-width: 640px) {
  .marginB {
    margin-bottom: 6em;
  }
  .slide-contents a {
    margin-right: 2rem;
  }
  .dtaq-magazine {
    display: flex;
    flex-wrap: wrap;
  }
  .dtaq-magazine a {
    width: calc(50% - 1rem);
    margin-right: 2rem;
  }
  .dtaq-magazine a:nth-child(even) {
    margin-right: 0;
  }
}
@media screen and (min-width: 768px) {
  .inner header h2 {
    font-size: 2em;
  }
  .inner header h2 span {
    margin-left: 1rem;
    display: inline-block;
  }
  .dtaq-magazine a {
    width: calc(33.3333333333% - 1.3333333333rem);
    margin-right: 2rem;
  }
  .dtaq-magazine a:nth-child(even) {
    margin-right: 2rem;
  }
  .dtaq-magazine a:nth-child(-n+2) {
    width: calc(50% - 1rem);
  }
  .dtaq-magazine a:nth-child(-n+2) .img-wrap {
    margin-bottom: 0;
  }
  .dtaq-magazine a:nth-child(-n+2) h3 {
    width: 100%;
    font-size: 1.5em;
    color: var(--white);
    background: rgba(0, 0, 0, 0.5);
    padding: 1rem;
    margin: 0;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .dtaq-magazine a:nth-child(2), .dtaq-magazine a:last-child {
    margin-right: 0;
  }
  .row > * {
    width: calc(50% - 1em);
  }
  .row > *:first-child {
    margin-right: 2em;
  }
  /* DTaQ TV(s) */
  .cardnews-wrap {
    margin-bottom: 0;
  }
  /* DTaQ TV(e) */
  /* banner(s) */
  .banner .inner {
    padding-top: 8em;
    padding-bottom: 8em;
  }
  .banner .inner h2 {
    text-align: left;
  }
  .banner .inner div {
    margin: 0;
  }
  /* banner(e) */
}
@media screen and (min-width: 992px) {
  .cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .img-slider-wrap {
    width: calc(100% - 350px);
    height: 100%;
  }
  .cardnews-modal-wrap .cardnews-modal-inner .cardnews-view-modal .text-wrap {
    width: 350px;
  }
}
@media screen and (min-width: 1024px) {
  .ai-keyword .keyword-wrap > div > figure {
    height: 81px;
  }
  .ai-keyword .keyword-wrap > div a {
    font-size: 1.3em;
  }
}
@media screen and (min-width: 1440px) {
  .inner header h2 {
    font-size: 2.2em;
  }
}
@media screen and (min-width: 1472px) {
  .slick-arrow {
    width: 52px;
    height: 52px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
  }
  .slick-arrow.slick-next {
    transform: translate(calc(50% - 20px), -50%);
  }
  .slide-contents {
    padding-top: 0;
  }
  .dtaq-news .slick-arrow,
  .magazine .slick-arrow {
    top: 38%;
  }
}
.right-to-left .keyword-container {
  animation: scroll-left linear infinite;
}

.left-to-right .keyword-container {
  animation: scroll-right linear infinite;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes scroll-right {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}
