@charset "UTF-8";

/*!
  * 다산시리즈 공통 UI (2024.12 ~ )
  * px to vw (1200px)
  * 다산금융상 body.dasan-financial
  * 다산경영상 body.dasan-management
  * 다산경제학상 body.dasan-economy
  */

/* common */
body {font-family:'NanumSquareNeo',sans-serif}
button {border:none; border-radius:0; background:transparent}
a:hover {text-underline-offset:6px}

/* preloader */
#loader-wrapper {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; background-color: #fff}
#loader {display: block; position: relative; left: 50%; top: 50%; width: 90px; height: 90px; margin: -45px 0 0 -45px; border: 3px solid transparent; border-top-color: #333; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite}
#loader:before {content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border: 3px solid transparent; border-top-color: #444; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-animation: spin 3s linear infinite; animation: spin 3s linear infinite}
#loader:after {content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border: 3px solid transparent; border-top-color: #555; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-animation: spin 1.5s linear infinite; animation: spin 1.5s linear infinite}
@-webkit-keyframes spin {
  0%   {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}
@keyframes spin {
  0%   {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}   

.btn-top {position:fixed; right:20px; bottom:20px; z-index:999; display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:100%; background:#fff; box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.10); visibility:hidden; opacity:0}
.btn-top::before {content:''; display:block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23121212' d='M20.892 11.686 12.207 3 3 11.665l1.37 1.456 6.815-6.413v15.185h2V6.807l6.293 6.293 1.414-1.414Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain}
.scroll .btn-top {visibility:visible; opacity:1}

/* layout */
.hk__event-top {z-index:99}
.inner-top,
.layout-inner {max-width:1200px; margin:0 auto}
.layout-inner {padding:0 16px}
/* layout: table style */
.t-row {display:flex; flex-wrap:wrap}
.t-cell {flex:1 1 auto; padding:16px min(max(10px,2vw),20px)}
.t-cell-divide {display:flex}
.t-cell-divide.divide-column {flex-direction:column}
.t-cell-divide.divide-column > .t-cell:not(:first-child) {border-top:1px solid #E2E2E2}

.t-head {border-top:1px solid rgba(52, 107, 240, 0.20); border-bottom:1px solid rgba(52, 107, 240, 0.20);}
.t-head .t-cell {background:#EBF5FF}
.t-body {font-size:min(max(14px,2vw),18px)}

.t-body > div {height:100%}
.t-body > .t-cell {border-left:1px solid #E2E2E2}
.t-body > .t-cell:not(:only-child):first-child {border-left:none}

/* layout: card style */
.card-row-group {display:flex; flex-direction:column; gap:16px; word-break:break-all}
.card-row {padding:26px 30px; border-radius:20px; background:#fff}
.card-row > .tit {display:block; margin-bottom:16px; font-weight:800; font-size:min(max(22px,2vw),28px)}

/* visual */
.visual-top {position:relative; height:min(max(460px,55vw),660px); overflow:hidden}
.visual-top .visual-inner {position:relative; z-index:2; display:flex; flex-direction:column-reverse; align-items:center; justify-content:center; gap:min(max(30px,4vw),50px); height:100%; padding:20px}
.visual-top .event-title {color:#fff; font-weight:700; font-size:min(max(32px,5vw),62px); font-family:'GmarketSans', sans-serif; text-align:center; word-break:keep-all}
.visual-top .visual-logo {width:100%; height:min(max(220px,23vw),280px)}
.visual-top .visual-logo > img {width:100%; max-width:100%; height:100%; max-height:100%; object-fit:contain}
.visual-top .obj {position:absolute; top:0; left:50%; margin-left:-405px}
.mask {animation: fadeMask .8s .5s forwards}
.animated {stroke:url(#paintLinear); stroke-width:2; fill:none; clip-path:url(#fadeClip)}
@keyframes fadeMask {
  0% {
    width: 0;
  }
  100% {
    width: 1473px;
  }
}

/* header */
.header {z-index:999}
.header-inner {padding:8px 20px}
.header .logo-area {display:flex; align-items:center; justify-content:space-between; min-height:34px}
.header .logo {display:inline-flex; align-items:center; gap:10px; font-weight:800; font-size:min(max(19px,2vw),24px)}
.header .logo-img::before {content:''; display:inline-block; vertical-align:top}
.header .logo .text {line-height:1}
.header .btn-gnb {display:inline-flex; align-items:center; margin-right:-5px; padding:5px}
.header .btn-gnb::before {content:''; display:inline-block; width:22px; height:14px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='14' fill='none'%3E%3Cpath fill='%23222' d='M0 0h22v2H0zM0 6h22v2H0zM0 12h22v2H0z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top}
.gnb-inner {position:relative; padding:40px 0}
.gnb .btn-close {position:absolute; top:16px; right:16px}
.gnb-menu .mn {display:block; padding:8px 16px; font-size:20px}
.gnb-menu .mn.active {font-weight:700}
.scroll .header {box-shadow:0 1px 10px rgba(0, 0, 0, .1)} 

/* contents */
.contents {font-size:min(max(16px,2vw),18px); line-height:1.6}
.contents .section {padding:min(max(60px,7vw),80px) 0}
.contents .section > .section-cont + .section-cont {padding-top:min(max(60px,7vw),80px)}

.etc-desc {color:#666; font-size:min(max(14px,1vw),16px)}
.desc:has(.bullet) {display:flex; gap:4px}
.desc-sm {font-size:min(max(14px,1vw),16px)}

.bullet-list {display:flex; flex-direction:column; gap:10px}
.bullet-list > .item {position:relative; padding-left:16px; word-break:keep-all}
.bullet-list > .item::before {content:''; display:inline-block; position:absolute; top:min(max(9px,1vw),10px); left:0; width:4px; height:4px; border-radius:100%; background:#7CA0F7}
.bullet-list .item-tit {margin-right:6px}

.section-title {margin-bottom:min(max(20px,2vw),24px); font-weight:800; font-size:min(max(26px,3vw),30px); line-height:1.2}
.section-title-wrap {margin-bottom:min(max(20px,2vw),24px)}
.section-title-wrap > .section-title {margin:0}

.section-cont-title-wrap {margin-bottom:min(max(20px,3vw),30px); padding-bottom:20px; border-bottom:1px solid #000}
.section-cont-title {font-weight:800; font-size:min(max(22px,2vw),24px); line-height:1.2}
.section-cont-title-wrap .etc-desc {font-size:14px}


.award-category {border-bottom:1px solid #E2E2E2}
.award-category + .etc-desc {margin-top:15px}

.form-download {margin-top:30px; padding:20px min(max(20px,3vw),30px) 30px; border-radius:10px}
.download-btn-list {display:flex; gap:10px; flex-wrap:wrap; margin-top:15px}
.download-btn-list > .btn {flex:1; max-width:220px}
.btn-download::after {content:''; display:inline-block; width:18px; height:18px; margin-left:10px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='24' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21.5 21h-18m15-10-6 6m0 0-6-6m6 6V3'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:-3px}

.section-winner {background:linear-gradient(0deg, #EEEFF2 0%, #EEEFF2 100%), #F6F8FA}

.award-winner {font-size:min(max(14px,2vw),18px)}
.award-winner > .t-row {border-radius:10px; overflow:hidden}
.award-winner > .t-row + .t-row {margin-top:16px}
.award-winner .t-cell {padding-left:min(max(20px,3vw),30px); padding-right:min(max(20px,3vw),30px)}
.award-winner .year {background:#F7F8F9} 
.award-winner .year,
.award-winner .category {font-weight:700}
.award-winner .year strong,
.award-winner .category strong {font-weight:800}
.award-winner .category strong {margin-right:8px}
.award-winner .winner {background:#fff; font-size:min(max(14px,1vw),16px)}
.award-winner .winner strong {margin-right:10px}
.award-winner .winner > div + div {margin-top:10px}
.award-winner .winner:has(.d-flex:only-child) {display:flex; flex-direction:column; justify-content:center}
.award-winner .cont > .t-row:not(:last-child) {margin-bottom:2px}
.section-winner .btn-more {display:flex; align-items:center; justify-content:center; width:100%; max-width:240px; margin:30px auto 0; padding:16px; border-radius:10px; border:1px solid #ddd; background:#fff; font-weight:800; font-size:14px}
.section-winner .btn-more::after {content:''; display:inline-block; width:24px; height:24px; margin-left:6px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat 50% 50%/contain}
.winner-block {margin-top:30px}
.section-winner .btn-more.active::after {transform:rotate(180deg)}
.winner-block + .winner-block {margin-top:min(max(30px,5vw),60px)}

/* 다산금융상 */
.dasan-financial .header .logo-img::before {width:min(max(36px,5vw),56px); height:min(max(34px,4vw),53px); background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/logo-dasan-financial.svg') no-repeat 50% 50%/contain}
.dasan-financial .visual-top {background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/visual-financial.jpg') no-repeat 50% 50%/cover, linear-gradient(0deg, rgba(13, 13, 13, 0.20) 0%, rgba(13, 13, 13, 0.20) 100%), #1B4576}
.dasan-financial .visual-top .event-title > span {color:#A5DEFF}
.dasan-financial .txt-highlight,
.dasan-financial .gnb-menu .mn.active {color:#346BF0}
.dasan-financial .section-apply {background:#E0EEFD}
.dasan-financial .form-download {background:#F4F9FF}
.dasan-financial .award-winner .category {background:#EBF5FF}

/* 다산경영상 */
.dasan-management .header .logo-img::before {width:min(max(36px,5vw),56px); height:min(max(34px,4vw),53px); background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/logo-dasan-management.svg') no-repeat 50% 50%/contain}
.dasan-management .visual-top {background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/visual-management.jpg') no-repeat 50% 50%/cover, linear-gradient(0deg, rgba(13, 13, 13, 0.20) 0%, rgba(13, 13, 13, 0.20) 100%), #1B4576}
.dasan-management .visual-top .event-title > span {color:#86EFD5}
.dasan-management .txt-highlight,
.dasan-management .gnb-menu .mn.active {color:#21AFBF}
.dasan-management .section-apply {background:#E1F7F9}
.dasan-management .form-download {background:#F3FCFD}
.dasan-management .award-winner .category {background:#EEFBFC}
.dasan-management .t-head {border-top:1px solid rgba(33, 175, 191, 0.20); border-bottom:1px solid rgba(33, 175, 191, 0.20)}
.dasan-management .t-head .t-cell {background:#EEFBFC}
.dasan-management .bullet-list > .item::before {background:#84E0E8}


/* 다산경제학상 & 다산젊은경제학자상 */
.dasan-economy .logo-img {display:flex; gap:6px}
.dasan-economy .header .logo-img::before {width:min(max(36px,5vw),56px); height:min(max(34px,4vw),53px); background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/logo-dasan-economy.svg') no-repeat 50% 50%/contain}
.dasan-economy .header .logo-img::after {content:''; display:inline-block; vertical-align:top; width:min(max(36px,5vw),56px); height:min(max(34px,4vw),53px); background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/logo-dasan-economy2.svg') no-repeat 50% 50%/contain}
.dasan-economy .visual-top {background:url('https://static.hankyung.com/resource/www/event/seminar/dasan/img/visual-economy.jpg') no-repeat 50% 50%/cover, linear-gradient(0deg, rgba(13, 13, 13, 0.20) 0%, rgba(13, 13, 13, 0.20) 100%), #1B4576}
.dasan-economy .visual-top .event-title {font-size: min(max(28px, 5vw), 58px)}
.dasan-economy .visual-top .event-title > span {color:#C7AFFE}
.dasan-economy .visual-top .visual-logo {display:flex; width:auto}
.dasan-economy .visual-top .visual-logo > img {flex:1; width:50%}
.dasan-economy .txt-highlight,
.dasan-economy .gnb-menu .mn.active {color:#6E5EF8}
.dasan-economy .section-apply {background:#EEEDFE}
.dasan-economy .form-download {background:#F8F6FF}
.dasan-economy .t-head {border-top:1px solid rgba(110, 94, 248, 0.20); border-bottom:1px solid rgba(110, 94, 248, 0.20)}
.dasan-economy .t-head,
.dasan-economy .t-head .t-cell {background:#F4F0FE}
.dasan-economy .award-winner .name {min-width:40px}
.dasan-economy .bullet-list > .item::before {background:#B1A2FA}

@media (max-width: 1199px) {
  /* heaer */
  .header {position:sticky; top:0}
  .header::before {content:''; position:absolute; top:0; left:0; right:0; bottom:0; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); background:rgba(255,255,255,.9)}
  .header-inner {position:relative}

  .header .logo-img::before,
  .header .logo-img::after {background-color:#09297F !important}
  
}
@media (max-width: 767px) {
  /* layout */
  .t-body > .t-cell:only-child {border-left:none}

  .award-winner .year {margin-bottom:2px}
  .dasan-economy .award-winner .year {margin:0; border-right:2px solid #EEEFF2; word-break:keep-all}
}
@media (max-width: 551px) {
  .download-btn-list {flex-direction:column}
  .download-btn-list > .btn {max-width:none}
}
@media (max-width: 460px) {
  .dasan-economy .visual-top .visual-logo {width:100%; height:auto}
}
@media (max-width: 414px) {
  .dasan-economy .header .logo-img::before,
  .dasan-economy .header .logo-img::after {width:26px; height:24px}
  .dasan-economy .header .logo .text {font-size:17px}
}
@media (max-width: 359px) {
  .dasan-economy .logo-img {display:none}
  .dasan-economy .header .logo .text {font-size:16px}
}
@media (max-width: 320px) {
  .card-row {padding:26px 20px}
}

@media (min-width: 768px) {
  /* layout */
  .t-col {padding:24px 30px}
  .t-cell {word-break:keep-all}
  .card-row {display:flex; justify-content:space-between; padding:40px 30px}
  .card-row > .tit {flex:0 0 auto; width:min(22vw,260px); margin:0}
  .card-row > .cont {flex:1 1 auto; width:calc(100% - 260px); word-break:keep-all} 

  .bullet-list > .item {display:flex}
  .bullet-list > .item > .item-tit {flex:0 0 auto; min-width:90px}

  .award-winner .year {border-right:2px solid #EEEFF2}

  /* 다산경제학상 */
  .dasan-economy .visual-top .visual-inner {gap:20px}
}
@media (min-width: 1200px) {
  /* layout */
  .t-col {padding:24px 30px}
  /* heaer */
  .header {position:fixed; left:0; right:0; transition:all ease .25s}
  .header-inner {display:flex; align-items:center; justify-content:space-between; max-width:1200px; margin:0 auto; padding:40px 10px; transition:padding ease .25s}
  .gnb-inner {padding:0} 
  .gnb-menu {display:flex; align-items:center; gap:40px}
  .gnb-menu .mn {padding:16px 0}
  html:not(.scroll) .header .logo,
  html:not(.scroll) .gnb-menu .mn {color:#fff} 
  .scroll .header {top:0; background-color:#fff; background-color:rgba(255, 255, 255, 0.95); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px)} 
  .scroll .header-inner {padding:0 10px}

  .scroll .header .logo-img::before,
  .scroll .header .logo-img::after {background-color:#09297F}

  /* header */
  .visual-top .visual-inner {padding:80px 20px 20px}
}