@font-face { font-family: 'YESMyoungjo'; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_13@1.0/YESMyoungjo-Regular.woff") format("woff"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'YESMyoungjo'; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_13@1.0/YESMyoungjo-Bold.woff") format("woff"); font-weight: bold; font-style: normal; }

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
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, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; }

html { font-size: 16px; }

body { font-family: 'OpenSans', 'Noto Sans KR', sans-serif; color: #000; min-height: -webkit-fill-available; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

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

a { text-decoration: none; }

button { cursor: pointer; border: 0; border-radius: 0; outline: 0; -webkit-appearance: none; appearance: none; }

input[type=text], input[type=email], input[type=password] { border: 0; border-radius: 0; -webkit-appearance: none; appearance: none; }

.preload * { -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important; transition: none !important; }

.hidden { position: absolute; width: 1px; height: 1px; clip: rect(0, 0, 0, 0); overflow: hidden; z-index: -1; }

.img-box img { display: block; }

.main { position: relative; margin-bottom: 300px; background-color: #fff; z-index: 10; }

.btn-close-popup { position: absolute; top: -36px; right: 0; width: 26px; height: 26px; text-indent: -9999px; border: 0; background: none; outline: 0; }

.btn-close-popup::before, .btn-close-popup::after { content: ''; position: absolute; top: 50%; left: 50%; margin-left: -15px; width: 30px; border-top: 2px solid #fff; }

.btn-close-popup::before { transform: rotate(-45deg); }

.btn-close-popup::after { transform: rotate(45deg); }

.is-loading { position: relative; }

.is-loading::after { content: ''; position: absolute; top: 0; left: 50%; margin: 100px 0 0 -2.5em; font-size: 10px; border-radius: 50%; width: 5em; height: 5em; border: 8px solid rgba(0, 0, 0, 0.1); border-left-color: rgba(0, 0, 0, 0.5); animation: spinner 1.1s infinite linear; }

.sns-links a { display: block; text-indent: -9999px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 100%; transition: opacity 0.3s cubic-bezier(0.17, 0.67, 0.21, 1); opacity: .5; }

.sns-links a:hover { opacity: 1; }

.sns-links a.youtube { width: 32px; height: 25px; background-image: url(../images/icons/icon_youtube.svg); }

.sns-links a.insta { width: 25px; height: 25px; background-image: url(../images/icons/icon_insta.svg); }

.sns-links a.facebook { width: 13px; height: 26px; background-image: url(../images/icons/icon_facebook.svg); }

@media (max-width: 800px) { .main { margin-bottom: 250px; }
  .btn-close-popup { top: 10px; right: 10px; }
  .btn-close-popup::before, .btn-close-popup::after { border-color: #000; } }

@media (min-width: 801px) and (max-height: 640px) { .gnb-container .sns-links a.youtube { background-image: url(../images/icons/icon_youtube_w.svg); }
  .gnb-container .sns-links a.insta { background-image: url(../images/icons/icon_insta_w.svg); }
  .gnb-container .sns-links a.facebook { background-image: url(../images/icons/icon_facebook_w.svg); } }

@keyframes spinner { 0% { -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@supports (position: sticky) or (position: -webkit-sticky) { .sticky { position: -webkit-sticky !important; position: sticky !important; } }

.main-header { position: fixed; top: 0; left: 0; width: 100%; height: 80px; background-color: #fff; z-index: 90; transition: transform 0.3s cubic-bezier(0.17, 0.67, 0.21, 1); }

.main-header.hide { transform: translateY(-100%); }

.main-header .logo { position: absolute; top: 50%; left: 60px; margin-top: -16px; width: 220px; height: 33px; background: url(../images/logo.svg) no-repeat; background-size: 100%; z-index: 111; transition: left 0.5s cubic-bezier(0.17, 0.67, 0.21, 1), opacity 1s; transition-delay: 0s, 3s; }

.main-header .logo a { display: block; height: 100%; text-indent: -9999px; }

.main-header .gnb-container { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: #fff; visibility: hidden; z-index: 100; }

.main-header .gnb-bg { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(../images/gnb_brush.png) no-repeat 50% 100%; background-size: cover; }

.main-header .gnb-links-wrapper { position: absolute; top: 18.5vh; left: 50%; width: 50%; height: 55vh; max-height: 500px; }

.main-header .gnb-links { font-family: 'Lora', 'YESMyoungjo', serif; box-sizing: border-box; flex: 1; display: flex; height: 100%; flex-direction: column; justify-content: space-between; }

.main-header .gnb-links::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; border-left: 1px solid #ddd; }

.main-header .gnb-links > li { position: relative; margin-left: -267px; width: 267px; transform: translateY(100%); opacity: 0; z-index: 2; }

.main-header .gnb-links > li:first-child .gnb-sublinks { display: flex; flex-wrap: wrap; }

.main-header .gnb-links > li:first-child .gnb-sublinks > li { min-width: 65px; }

.main-header .gnb-links > li:first-child .gnb-sublinks > li:last-child { position: relative; left: -12px; }

.main-header .gnb-links > li > a { position: relative; display: inline-block; font-size: 3rem; font-weight: 700; line-height: normal; color: #999; transition: .5s; }

.main-header .gnb-links > li > a:hover { color: #000; }

.main-header .gnb-links > li > a:hover::before { opacity: 1; transition: opacity 1s; }

.main-header .gnb-links > li > a::before { content: ''; position: absolute; top: -60px; left: -70px; width: 140px; height: 140px; background: url(../images/gnb_hover.png) no-repeat; opacity: 0; }

.main-header .gnb-links > li > a span { position: relative; z-index: 1; }

.main-header .gnb-sublinks { position: absolute; top: 0; left: 268px; box-sizing: content-box; padding-left: 39px; width: 340px; }

.main-header .gnb-sublinks > li > a { position: relative; font-size: 1.5rem; line-height: 2em; color: #999; }

.main-header .gnb-sublinks > li > a::before { content: ''; position: absolute; top: -10px; left: -24px; width: 49px; height: 49px; background: url(../images/gnb_hover.png) no-repeat; background-size: 100%; opacity: 0; }

.main-header .gnb-sublinks > li > a:hover::before { opacity: 1; transition: opacity 1s; }

.main-header .gnb-sublinks > li > a:hover { color: #000; }

.main-header .gnb-sublinks > li > a span { position: relative; z-index: 1; }

.main-header .sns-links { position: fixed; top: 50%; right: 60px; transform: translateY(-50%); z-index: 111; }

.main-header .sns-links li + li { margin-top: 30px; }

.main-header .sns-links li a { margin: 0 auto; }

.main-header .select-lang { position: absolute; top: 50%; right: 140px; transform: translateY(-50%); z-index:110;}

.main-header .select-lang.on{display:block;}

.main-header .select-lang a { margin: 0 5px; color: #000; text-transform: uppercase; opacity: 0.5; }

.main-header .select-lang a.on { border-bottom: 2px solid #000; opacity: 1; }

.main-header .gnb-toggle { position: absolute; top: 50%; right: 50px; display: block; margin-top: -15px; width: 50px; text-align: center; z-index: 101; transition: opacity 1s; transition-delay: 3s; }

.main-header .gnb-toggle .btn-hamburger { display: block; width: 30px; height: 30px; border: none; background: none; padding: 0; font-family: 'Open Sans', sans-serif; font-size: 1rem; text-align: center; position: relative; transition: all 1s; cursor: pointer; margin: 0 auto; }

.main-header .gnb-toggle .btn-hamburger:focus { outline: none; }

.main-header .gnb-toggle .btn-hamburger:before, .main-header .gnb-toggle .btn-hamburger:after { content: ""; display: block; width: 100%; height: 2px; background: #000; position: absolute; transition: all 0.2s ease-out; }

.main-header .gnb-toggle .btn-hamburger:before { top: 0; }

.main-header .gnb-toggle .btn-hamburger:after { bottom: 0; }

.main-header .gnb-toggle .btn-hamburger-center { display: block; height: 2px; position: relative; transition: all 0.2s ease-out; overflow: hidden; }

.main-header .gnb-toggle .btn-hamburger-center:before, .main-header .gnb-toggle .btn-hamburger-center:after { content: ''; display: block; width: 100%; height: 1px; background: #000; position: absolute; }

.main-header .gnb-toggle .btn-hamburger-center:before { top: 0px; }

.main-header .gnb-toggle .btn-hamburger-center:after { bottom: 0px; }

.main-header .gnb-toggle .btn-hamburger-text { display: block; line-height: 26px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: all 0.2s ease-out; }

.main-header .gnb-toggle .btn-hamburger:hover { width: 50px; height: 30px; }

.main-header .gnb-toggle .btn-hamburger:hover .btn-hamburger-center { height: 28px; }

.main-header .gnb-toggle .btn-hamburger:hover .btn-hamburger-text { opacity: 1; }

body.open-gnb { overflow: hidden; }

body.open-gnb .main-header { transform: none !important; }

body.open-gnb .main-header .logo { filter: invert(0) !important; }

body.open-gnb .main-header .gnb-container { visibility: visible; transition: 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); transition-property: opacity, visibility, left; }

body.open-gnb .main-header .gnb-links > li { transform: translateY(0) !important; opacity: 1; transition: all 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

body.open-gnb .main-header .gnb-links > li:nth-child(1) { transition-delay: .1s; }

body.open-gnb .main-header .gnb-links > li:nth-child(2) { transition-delay: .2s; }

body.open-gnb .main-header .gnb-links > li:nth-child(3) { transition-delay: .3s; }

body.open-gnb .main-header .gnb-links > li:nth-child(4) { transition-delay: .4s; }

body.open-gnb .main-header .gnb-links > li:nth-child(5) { transition-delay: .5s; }

body.open-gnb .main-header .gnb-toggle .btn-hamburger { animation-name: hamburger; animation-duration: 1s; animation-fill-mode: forwards; }

body.open-gnb .main-header .gnb-toggle .btn-hamburger:before { animation-name: hamburger-before; animation-duration: 1s; animation-fill-mode: forwards; background: #000 !important; }

body.open-gnb .main-header .gnb-toggle .btn-hamburger:after { animation-name: hamburger-after; animation-duration: 1s; animation-fill-mode: forwards; background: #000 !important; }

body.open-gnb .main-header .gnb-toggle .btn-hamburger .btn-hamburger-center { animation-name: hamburger-center; animation-duration: 1s; animation-fill-mode: forwards; }

body.open-write .main-header .logo { left: calc(370px + 50px); }

body.open-write .main-header .gnb-container { left: 370px; }

body.init .main-header .logo, body.init .main-header .gnb-toggle { opacity: 1; }

@media (max-width: 800px) { body.open-gnb .main-header .gnb-toggle { margin-top: -10px; }
  body.open-gnb .main-header .gnb-toggle .btn-hamburger { width: 20px; height: 20px; font-size: 0.625rem; }
  body.open-gnb .main-header .gnb-toggle .btn-hamburger:active { width: 30px; height: 20px; }
  body.open-gnb .main-header .gnb-toggle .btn-hamburger:active .btn-hamburger-center { height: 19px; }
  .main-header { height: 60px; }
  .main-header .logo { margin-top: -10px; left: 15px; width: 130px; height: 20px; }
  .main-header .gnb-container .gnb-bg { display: none; }
  .main-header .gnb-container .gnb-links-wrapper { position: static; margin: 80px 0 0 50px; width: auto; height: 60vh; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links::after { display: none; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links > li { margin-left: 0; width: auto; transform: translateY(50px); }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links > li:first-child .gnb-sublinks > li { min-width: 44px; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links > li:first-child .gnb-sublinks > li:last-child { left: -9px; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links > li > a { font-size: 1.875rem; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-links > li > a::before { display: none; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-sublinks { position: static; margin-top: 1vh; padding-left: 20px; width: 230px; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-sublinks > li > a { font-size: 1.125rem; }
  .main-header .gnb-container .gnb-links-wrapper .gnb-sublinks > li > a::before { display: none; }
  .main-header .sns-links { top: auto; bottom: 30px; left: 50px; display: flex; transform: none; }
  .main-header .sns-links li + li { margin: 0 0 0 30px; }
  .main-header .select-lang { right: 50px; }
  .main-header .select-lang a { font-size: 13px; }
  .main-header .gnb-toggle { margin-top: -10px; right: 10px; width: 30px; }
  .main-header .gnb-toggle .btn-hamburger { width: 20px; height: 20px; font-size: 0.625rem; }
  .main-header .gnb-toggle .btn-hamburger:hover { width: 20px; height: 20px; }
  .main-header .gnb-toggle .btn-hamburger:hover .btn-hamburger-center { height: 2px; } }

@media (max-height: 860px) { .main-header .gnb-links-wrapper { height: 65vh; } }

@media (max-height: 640px) { .main-header .gnb-links-wrapper { height: 60vh; }
  .main-header .gnb-links > li > a { font-size: 2.125rem; }
  .main-header .gnb-links > li > a::before { top: -25px; left: -60px; width: 90px; height: 90px; background-size: cover; }
  .main-header .gnb-sublinks > li > a { font-size: 1.125rem; }
  .main-header .gnb-sublinks > li > a::before { top: -15px; left: -24px; width: 40px; height: 40px; }
  .main-header .sns-links { top: auto; bottom: 40px; right: 40px; display: flex; justify-content: space-between; width: 140px; transform: none; }
  .main-header .sns-links li + li { margin-top: 0; } }

@keyframes hamburger { 50% { width: 30px;
    height: 30px; }
  75% { width: 30px;
    height: 30px; }
  100% { width: 30px;
    height: 30px; } }

@keyframes hamburger-before { 50% { top: 50%;
    transform: translateY(-1px); }
  75% { top: 50%;
    transform: translateY(-1px) rotate(45deg); }
  100% { top: 50%;
    transform: translateY(-1px) rotate(45deg); } }

@keyframes hamburger-after { 50% { top: 50%;
    transform: translateY(-1px); }
  75% { top: 50%;
    transform: translateY(-1px); }
  100% { top: 50%;
    transform: translateY(-1px) rotate(135deg); } }

@keyframes hamburger-center { 50% { height: 0; }
  75% { height: 0; }
  100% { height: 0; } }

.main-footer { position: fixed; bottom: 0; left: 0; right: 0; height: 300px; background-color: #f5f5f5; transition: left 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

.main-footer .wrapper { position: relative; margin: 0 140px; padding-top: 75px; }

.main-footer .wrapper .logo { display: block; margin-bottom: 10px; width: 220px; }

.main-footer .wrapper .title { font-family: 'Lora', 'YESMyoungjo', serif; margin-bottom: 30px; padding-bottom: 67px; font-size: 0.875rem; letter-spacing: 1px; line-height: 1; border-bottom: 1px solid #000; }

.main-footer .wrapper .copy { display: inline; font-size: 0.875rem; line-height: 1; }

.main-footer .wrapper .sns-links { position: absolute; bottom: 0; right: 0; display: flex; align-items: center; }

.main-footer .wrapper .sns-links li + li { margin-left: 19px; }

.main-footer .wrapper .sns-links a { transform: scale(0.9); transform-origin: 100% 100%; }

.main-footer .wrapper .login-menu { display: inline; margin-left: 29px; background: none; text-decoration: underline; line-height: 1; }

body.open-write .main-footer { left: 370px; }

@media (min-width: 801px) and (max-width: 1440px) { .main-footer .wrapper { margin: 0 70px; } }

@media (max-width: 800px) { .main-footer { height: 250px; }
  .main-footer .wrapper { margin: 0 15px; padding-top: 50px; }
  .main-footer .wrapper .logo { width: 130px; }
  .main-footer .wrapper .title { margin-bottom: 30px; font-size: 0.6875rem; }
  .main-footer .wrapper .sns-links { bottom: 70px; left: 0; right: auto; }
  .main-footer .wrapper .copy { margin-top: 20px; }
  .main-footer .login-menu { display: none !important; } }

.index > section { position: relative; }

.index .content .title { font-family: 'Lora', 'YESMyoungjo', serif; font-size: 2.5rem; line-height: 1.375em; white-space: pre-line; }

.index .content .sub-title { display: inline-block; margin-top: 40px; font-size: 1.5625rem; color: #aaa; white-space: pre-line; max-width:540px;}

.index .content .description { margin-top: 60px; max-width: 590px; font-size: 1.25rem; line-height: 1.8em; text-align: justify; white-space: pre-line; }

.index .section-top .bg-trigger { position: absolute; top: 1000px; }

.index .section-top .media { position: absolute; top: 0; right: 0; width: 50%; height: 100vh; overflow: hidden; z-index: 2; opacity: 0; transform: translateY(30px); }

.index .section-top .media video { position: absolute; top: 0; right: 0; width: 100%; height: 100%; object-fit: cover; }

.index .section-top .content { position: relative; display: flex; justify-content: center; align-items: center; height: 100vh; }

.index .section-top .text1 { box-sizing: border-box; padding: 0 60px; width: 50%; z-index: 1; }

.index .section-top .text1 .content-inner { transform: translateY(-50px); opacity: 0; }

.index .section-top .text1 .logo { margin-bottom: 20px; }

.index .section-top .text1 .logo img { display: block; width: 404px; }

.index .section-top .text2 { box-sizing: border-box; margin-left: 50%; width: 50%; z-index: 3; }

.index .section-mid { padding: 265px 0; }

.index .section-mid .media { position: absolute; top: 265px; left: 50%; margin-top: 143px; width: 500px; height: 750px; transform: translateX(-550px); }

.index .section-mid .media .sunghak-book img { display: block; }

.index .section-mid .media .sunghak-book img + img { margin-top: 100px; }

.index .section-mid .content { margin-left: 50%; padding-left: 50px; box-sizing: border-box; width: 50%; }

.index .section-mid .content + .content { margin-top: 50vh; }

.index .section-mid .content .description { margin-right: 60px; max-width: 540px; }

.index .section-mid .content .link { display: inline-block; margin-top: 80px; color: #000; text-transform: uppercase; }

.index .section-mid .text2 { margin-top: 100px !important; }

.index .section-bot .media { top: 0; height: 100vh; }

.index .section-bot .media video { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; object-fit: cover; }

.index .section-bot .media .video-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; background-color: #000; opacity: .5; }

.index .section-bot .content { position: relative; display: flex; justify-content: center; align-items: center; padding: 20vh 0; width: 50%; z-index: 1; }

body.init .index .section-top .media { opacity: 1; transform: none; transition: width 0.2s cubic-bezier(0.17, 0.67, 0.21, 1), opacity 0.5s, transform 0.5s; transition-delay: 0s, .3s, .3s; }

body.init .index .section-top .text1 .content-inner { transform: none; opacity: 1; transition: .5s; }

@supports (position: sticky) or (position: -webkit-sticky) { .index .section-top .sticky { top: 0; }
  .index .section-top .text2 { padding: 150vh 60px; }
  .index .section-top .text2 .title, .index .section-top .text2 .description { color: #fff; }
  .index .section-mid .media { transition: left 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }
  .index .section-mid .media.sticky { top: 50%; transform: translate(-550px, -50%); margin-bottom: -375px; }
  .index .section-mid .media.sticky ~ .text1 { margin-top: calc(-143px + -750px); }
  .index .section-mid .media .sunghak-book img { position: absolute; top: 0; left: 0; transform: scale(0.94) translate(8%, 0); opacity: 0; transition-duration: 1s; transition-property: transform, opacity; }
  .index .section-mid .media .sunghak-book img + img { margin: 0; }
  .index .section-mid .media .sunghak-book img.prev { transform: translate(-50%, 0); opacity: 0; transition-duration: .5s; z-index: 4; }
  .index .section-mid .media .sunghak-book img.on { transform: scale(1) translate(0, 0); opacity: 1; box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); z-index: 3; }
  .index .section-mid .media .sunghak-book img.on + img { transform: scale(0.98) translate(3%, 0); opacity: 0.5; z-index: 2; }
  .index .section-mid .media .sunghak-book img.on + img + img { transform: scale(0.96) translate(6%, 0); opacity: 0.4; z-index: 1; }
  .index .section-bot .content { padding: 0 60px 100vh; }
  .index .section-bot .title, .index .section-bot .description { color: #fff; } }

@media (max-width: 1000px) { .index .section-mid .media.sticky { transform: translate(calc(-550px + (500px - (100vw - var(--scrollbar-width)) / 2)), -50%); } }

@media (min-width: 801px) and (max-width: 1440px) { .index .content .title { font-size: 2.125rem; }
  .index .content .sub-title { margin-top: calc(0.02778 * 100vw); font-size: 1.25rem; }
  .index .content .description { margin-top: calc(0.04167 * 100vw); font-size: 1rem; }
  .index .section-top .text1 .logo { margin-bottom: calc(0.01389 * 100vw); }
  .index .section-top .text1 .logo img { width: 20.33333vw; } }

@media (max-width: 800px) { .index .content .title { font-size: 1.25rem; }
  .index .content .sub-title { margin-top: 30px; font-size: 1.125rem; }
  .index .content .description { margin-top: 40px; font-size: 1rem; }
  .index .section-top .bg-trigger { top: 620px; }
  .index .section-top .content { margin-left: 0; padding: 70px 25px 70px; width: 100%; height: auto; }
  .index .section-top .text1 .logo { margin-bottom: 31px; }
  .index .section-top .text1 .logo img { width: 238px; }
  .index .section-top .text2 { /*padding-bottom: 150vh;*/ }
  .index .section-top .text2 .content-inner { position: relative; }
  .index .section-top .text2 .video-trigger { position: absolute; bottom: -20vh; }
  .index .section-top .media { position: -webkit-stickys; position: static; width: 100%; height:50vh;}
  .index .section-top .media video{position:static;}
  .index .section-mid { padding-top: 20px; padding-bottom: 130px; }
  .index .section-mid .bg-plate { position: absolute; bottom: 0; left: calc(50% - 115px); right: calc(50% - 115px); height: 89.5%; background-color: #f5f5f5; }
  .index .section-mid .media { position: sticky; top: 0; margin-top: 0; width: 100%; height: 375px; transform: none; }
  .index .section-mid .media .sunghak-book { position: absolute; top: 60px; left: 50%; width: 500px; height: 750px; transform-origin: 50% 0; transform: translateX(-50%) scale(0.38); }
  .index .section-mid .content { margin-left: 0; padding: 0 25px 30vh; width: 100%; }
  .index .section-mid .content + .content { margin-top: 0; }
  .index .section-mid .content + .content .content-inner { padding-top: 30px; }
  .index .section-mid .content:last-child { position: relative; padding-bottom: 0; }
  .index .section-mid .content:last-child .content-inner { position: absolute; left: 30px; right: 30px; }
  .index .section-mid .content .description { margin-right: 0; }
  .index .section-top .text2 .title, .index .section-top .text2 .description{color:#000;}
  .index .section-mid .text1 { margin-top: 70px; }
  .index .section-bot .media{height:50vh;position:static!important;}
  .index .section-bot .media video{position:static;width:100%;height:100%;object-fit: cover;}
  .index .section-bot .media .video-cover{display:none;}
  .index .section-bot .title, .index .section-bot .description{color:#000;}
  .index .section-bot .content { box-sizing: border-box; width: 100%; padding: 0 25px 120px; }
  .index .section-bot .content .content-inner { position: relative; margin-top:70px;}
  .index .section-bot .content .video-trigger { position: absolute; bottom: -20vh; } }

.project .video-container { position: fixed; top: 0; left: 0; width: 100vw; max-width: 100%; height: 100vh; max-width: 100%; overflow: hidden; }

.project .video-container.is-playing { cursor: wait; }

.project .video-container video { display: block; width: 100%; height: 100%; object-fit: cover; }

.project .image-container { position: fixed; top: 0; left: 0; width: 100vw; max-width: 100%; height: 100vh; overflow: hidden; }

.project .image-container img { display: block; width: 100%; height: 100%; object-fit: cover; }

.project .section-top { position: relative; background-color: #fff; z-index: 1; }

.project .section-top .bg-plate { position: absolute; top: 80px; bottom: 0; left: 0; right: 0; background-color: #f5f5f5; transform-origin: 50% 100%; transform: scale(0.84, 1); }

.project .section-top .content { position: relative; margin: 0 auto; width: 82%; z-index: 2; }

.project .section-top .header { position: -webkit-stickyS; position: sticky; top: 210px; }

.project .section-top .title { font-family: 'Lora', 'YESMyoungjo', serif; margin-bottom: 40px; font-size: 4.5rem; text-align: center; white-space: pre-line; transform: translateY(100%); opacity: 0; }
.project .section-top .title.en{font-size:3rem;}

.project .section-top .sub-title { font-family: 'Lora', 'YESMyoungjo', serif; font-size: 2.5rem; text-align: center; white-space: pre-line; transform: translateY(200%); opacity: 0; }
.project .section-top .sub-title.en{font-size:2.5rem;}

.project .section-top .description-wrapper { margin: 300vh 0 -100vh; width: 50%; height: 100vh; }

.project .section-top .description { display: flex; align-items: center; margin: 0 auto; width: 70%; height: 100%; font-size: 1.25rem; line-height: 1.6em; white-space: pre-line; text-align: justify;}

.project .section-top .sticky { position: relative; height: 100vh; bottom: 0; overflow: hidden; z-index: 1; }

.project .section-top .sticky .img-wrapper { position: absolute; top: 46vh; left: 0; right: 0; width: 78.6vw; max-width: 1180px; margin: 0 auto; z-index: 1; }

.project .section-top .sticky .img-wrapper img { display: block; width: 100%; transform: scale(1.05); }

.project .section-top .sticky .img-wrapper .mask { display: none; position: absolute; top: 0; left: 0; right: 0; height: 100%; background-image: radial-gradient(transparent 40%, #fff 65%); background-position: 50% 0; background-repeat: no-repeat; background-size: 200% 150vh; }

.project .section-mid .slogan { font-family: 'Lora', 'YESMyoungjo', serif; position: relative; display: flex; justify-content: center; align-items: center; margin-bottom: 130vh; height: 100vh; white-space: pre-line; font-size: 2.3rem; line-height:1.6; text-align: center; background-color: #fff; overflow: hidden; z-index: 1; }

.project .section-mid .slogan-inner { position: relative; width:1180px; margin:0 auto; }

.project .section-mid .slogan-inner .mask { position: absolute; top: -100%; left: -100%; width: 200%; height: 200%; background-image: linear-gradient(165deg, rgba(255, 255, 255, 0) 20%, #fff 60%); }

.project .section-mid .media-description { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 20vh 0 30vh; background-color: #fff; overflow: hidden; z-index: 1; }

.project .section-mid .media-description p { width: 90%; max-width: 1180px; font-size: 1.375rem; line-height: 1.63636em; white-space: pre-line; /*word-wrap: break-word; word-break: keep-all;*/ text-align: justify; }

.project .section-mid .media-description .link { display: block; margin: 115px auto 0; width: 200px; height: 25px; text-indent: -9999px; background: #fff url(../images/icons/icon_link_youtube.png) no-repeat 50% 50%; background-size: cover; }

.project .section-bot { position: relative; padding-bottom: 150px; background-color: #fff; z-index: 1; }

.project .section-bot .description { font-family: 'Lora', 'YESMyoungjo', serif; display: flex; justify-content: center; align-items: center; margin: 0 auto 10vh; width: 90%; max-width: 1180px; height: 100vh; white-space: pre-line; font-size: 1.875rem; line-height: 1.6em; word-wrap: break-word; word-break: keep-all; text-align: center; overflow: hidden; }

.project .section-bot .description-inner { position: relative; }

.project .section-bot .description-inner .mask { position: absolute; top: -100%; left: -100%; width: 200%; height: 200%; background-image: linear-gradient(165deg, rgba(255, 255, 255, 0) 20%, #fff 60%); }

.project .section-bot .content { margin: 0 auto; width: 90%; max-width: 1180px; }

.project .section-bot .content h2 { position: absolute; width: 1px; height: 1px; clip: rect(0, 0, 0, 0); overflow: hidden; z-index: -1; }

.project .section-bot .vr-item { height: 170vh; }

.project .section-bot .vr-item:nth-of-type(even) .img-container { flex-direction: row-reverse; }

.project .section-bot .img-container { position: sticky; top: 0; display: flex; justify-content: space-between; align-items: center; min-height: 100vh; }

.project .section-bot .img-container .img { width: 57.6%; max-width: 680px; overflow: hidden; transform: scale(0.85); }

.project .section-bot .img-container .img-wrapper { position: relative; padding-top: 108%; }

.project .section-bot .img-container .img-wrapper img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

.project .section-bot .img-container .caption { width: 33.8%; max-width: 400px; height: calc(103.68%); font-size: 1.125rem; line-height: 1.66667em; /*word-wrap: break-word; word-break: keep-all; text-align:justify;*/ opacity: 0; transform: translateY(50px); }

body.init .project .section-top .header .title, body.init .project .section-top .header .sub-title { transform: none; opacity: 1; transition: 1.5s cubic-bezier(0.17, 0.67, 0.21, 1); transition-delay: .5s; }

body.init .project .section-top .sticky .img-wrapper img { transform: none; transition: 1.5s ease; }

/* @media (max-height: 800px) { .project .section-top .header { top: 17vh; }
  .project .section-top .header .title { margin-bottom: 30px; font-size: 3.75rem; }
  .project .section-top .header .sub-title { font-size: 2rem; }
  .project .section-top .sticky .img-wrapper { top: 60vh; }
  .project .section-top .description { font-size: 1rem; }
  .project .section-mid .media-description p { font-size: 1.25rem; }
  .project .section-bot .description { font-size: 1.5rem; } } */

@media (max-height: 960px) {
  .project .section-top .title { margin-bottom: 30px; font-size: 3rem; }
}
@media (max-height: 800px) {
  .project .section-top .header { top: 17vh; }
}

@media (min-width: 801px) and (max-width: 1500px) {
  .project .section-top .header { top: 22vh; }
  .project .section-top .header .title { margin-bottom: 10px; font-size: 3rem; }
  .project .section-top .header .sub-title { font-size: 2rem; }
  .project .section-top .sticky .img-wrapper { top: 50vh; }
}

@media (max-width:1200px){
  .project .section-mid .slogan{font-size:2rem;}
  .project .section-mid .slogan-inner{width:95%; max-width:860px;}
  .project .section-mid .media-description p{font-size:1.2rem;}
  .project .section-bot .description{font-size:1.3rem;}
}

@media (max-width: 800px) { .project .section-top { background-color: #f5f5f5; z-index: 2; }
  .project .section-top .bg-plate { display: none; }
  .project .section-top .content { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 80px 0 20px; width: 100%; height: 100%; }
  .project .section-top .header { position: sticky; top: 0; padding-bottom: 20px; }
  .project .section-top .title { margin-bottom: 17px; font-size: 1.5rem; }
  .project .section-top .title.en{font-size:1.5rem; padding:0 20px;}
  .project .section-top .sub-title { font-size: 1.125rem; }
  .project .section-top .sub-title.en{font-size:1.125rem;}
  .project .section-top .sticky { top: 60px; bottom: auto; height: auto; box-sizing: border-box; overflow: visible; opacity: 0; }
  .project .section-top .sticky .img-wrapper { position: static; width: 296px; }
  .project .section-top .description-wrapper { margin: 0; width: 100%; height: auto; background-color: #fff; }
  .project .section-top .description { display: block; margin: 0; box-sizing: border-box; padding: 25px; width: 100%; font-size: 1rem; }
  .project .section-mid .slogan { padding: 0 25px; font-size: 1.625rem; }
  .project .section-mid .media-description p { font-size: 1rem; }
  .project .section-mid .media-description .link { font-size: 1rem; }
  .project .section-mid .media-description .link::after { display: block; margin: 10px auto 0; }
  .project .section-bot .description { margin: 0 25px 10vh; width: auto; font-size: 1.375rem; }
  .project .section-bot .content { width: 100%; }
  .project .section-bot .content h2 { margin: 0 25px 80px; font-size: 1.5rem; }
  .project .section-bot .vr-item:nth-of-type(even) .img-container { flex-direction: column; }
  .project .section-bot .img-container { top: 60px; flex-direction: column; justify-content: flex-start; }
  .project .section-bot .img-container .img { width: 100%; }
  .project .section-bot .img-container .caption { margin: 30px 25px 0; width: auto; font-size: 1.125rem; } }

@media (max-width: 800px) and (max-height: 640px) {
  .project .section-top .sticky .img-wrapper { width: 240px; }
}

@media (max-width: 380px) { .project .section-top .description { padding-bottom: 20px; } }

@media (max-width: 320px) {
  .project .section-top .title { font-size: 1.2rem; }
  .project .section-top .description { margin-bottom: -560px; } }

.board { margin: 0 auto; padding: 170px 0 170px; width: calc(100% - 50px); max-width: 1180px; }

.board-title { font-family: 'Lora', 'YESMyoungjo', serif; position: relative; margin-bottom: 130px; height: 70px; font-size: 4.5rem; line-height: 1; }

.board-title::after { position: absolute; bottom: -20px; left: 0; width: 100px; border-bottom: 2px solid #000; }

.board-tab { display: flex; margin-bottom: 40px; border-bottom: 1px solid #ddd; }

.board-tab li { margin-bottom: -1px; color: #ddd; }

.board-tab li.on { color: #000; border-bottom: 2px solid #000; }

.board-tab li + li { margin-left: 10px; }

.board-tab li > span, .board-tab li > a { font-family: 'Lora', 'YESMyoungjo', serif; display: block; box-sizing: border-box; padding: 0 20px; color: inherit; font-size: 1.5rem; line-height: 1.25em; text-transform: uppercase; }

.board-container { position: relative; }

.board-filter-h { position: relative; display: flex; flex-wrap: wrap; margin: 0 -12px; padding-top: 30px; min-height: 99px; }

.board-filter-h::after { content: ''; position: absolute; top: 0; right: 12px; left: 12px; border-top: 1px solid #ddd; }

.board-filter-h li { margin: 0 12px; }

.board-filter-h .filter-item { position: relative; }

.board-filter-h .filter-item input { position: absolute; opacity: 0; visibility: hidden; }

.board-filter-h .filter-item input:checked + .filter-item-label { color: #000; }

.board-filter-h .filter-item-label { display: inline-block; font-size: 1.25rem; font-weight: 600; line-height: 1.5em; color: #999; overflow: hidden; cursor: pointer; }

.board-filter-h .filter-item-label.en{display:none;}

.board-filter-h .filter-item-label::before { content: '#'; }

.board-filter-v { position: absolute; top: 10px; right: -50px; padding: 50px 0 120px; width: 0; border-left: 1px solid #ddd; }

.board-filter-v li + li { margin-top: 20px; }

.board-filter-v .filter-item { position: relative; left: -1px; }

.board-filter-v .filter-item input { position: absolute; opacity: 0; visibility: hidden; }

.board-filter-v .filter-item input:checked + .filter-item-label { color: #000; }

.board-filter-v .filter-item-label { padding: 0 0 0 20px; height: 30px; font-size: 1.25rem; font-weight: 600; color: #999; overflow: hidden; white-space: nowrap; cursor: pointer; }

.board-filter-v .filter-item-label::before { content: '#'; }

.board-filter-v .filter-item-label::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; border-left: 2px solid #000; opacity: 0; transition: opacity .3s; }

.board-masonry { margin: 5px -5px -5px; padding-top: 10px; overflow: hidden; }

.board-masonry .board-item { float: left; position: relative; box-sizing: border-box; width: 50%; padding-top: 33.33%; transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

.board-masonry .board-item a:hover .img-box { transform: scale(1.1); }

.board-masonry .board-item figure { position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 5px; overflow: hidden; }

.board-masonry .board-item figure .img-box { position: relative; height: 100%; transition: transform 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

.board-masonry .board-item figure img { position: absolute; top: 0; left: 50%; transform: translateX(-50%); }

.board-masonry .board-item .text { position: absolute; bottom: 0; left: 0; right: 0; padding: 60px 20px 20px; background-image: linear-gradient(rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, 0.6) 50%); }

.board-masonry .board-item .text .head { margin-bottom: 24px; font-size: 1rem; color: #ddd; line-height: 1.4; }

.board-masonry .board-item .text .title { font-size: 1.5rem; color: #fff; font-weight: 600; line-height: 1.4; white-space: pre-line; }

.board-card { margin: 5px -5px -5px; display: flex; flex-wrap: wrap; }

.board-card .board-item { box-sizing: border-box; margin: 5px; width: calc(100% - 10px); color: #333; }

.board-card .board-item a { display: block; box-sizing: border-box; padding: 30px; height: 100%; color: inherit; border: 1px solid #ddd; border-radius: 5px; overflow: hidden; transition: box-shadow .3s; }

.board-card .board-item a:hover { box-shadow: 0 5px 15px #bbb; }

.board-card .board-item .title { display: -webkit-box; margin-bottom: 16px; height: 60px; font-size: 1.25rem; line-height: 1.5em; font-weight: 500; white-space: pre-line; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.board-card .board-item .author, .board-card .board-item .info { font-size: 1.125rem; }

.board-card .board-item .author { margin-bottom: 26px; }

.board-card .board-item .summary { font-family: 'OpenSans', 'Noto Sans KR', sans-serif; display: -webkit-box; margin: 25px 0; padding-top: 45px; height: 72px; border-top: 1px solid #ddd; font-size: 1rem; line-height: 1.5em; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.board-pin { margin: 5px -5px -5px; overflow: hidden; }

.board-pin .board-item { float: left; position: relative; box-sizing: border-box; width: 50%; padding-top: 33.33%; transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

.board-pin .board-item:hover, .board-pin .board-item a:hover { cursor: pointer; }

.board-pin .board-item:hover .text, .board-pin .board-item a:hover .text { transform: scale(1); opacity: 1; }

.board-pin .board-item figure { position: absolute; top: 5px; right: 5px; bottom: 5px; left: 5px; border-radius: 5px; overflow: hidden; }

.board-pin .board-item figure .img-box { position: relative; height: 100%; }

.board-pin .board-item figure .img-box:not(:first-child) { display: none; }

.board-pin .board-item figure .img-box img { position: relative; top: 0; left: 50%; transform: translateX(-50%); }

.board-pin .board-item .text { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 40px 20px 20px; background-image: linear-gradient(rgba(0, 0, 0, 0.3) 0, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.9) 100%); opacity: 0; transition: opacity 0.3s cubic-bezier(0.17, 0.67, 0.21, 1); }

.board-pin .board-item .text .head { margin-bottom: 7px; font-size: 1rem; color: #ccc; line-height: 1; }

.board-pin .board-item .text .title { font-size: 1.5rem; color: #fff; font-weight: 600; white-space: pre-line; }

@media (min-width: 801px) and (max-width: 1440px) { .board-title { margin-bottom: calc(0.09028 * 100vw); }
  .board-filter-h { padding-top: calc(0.02083 * 100vw); }
  .board-filter-v { position: relative; left: 0; display: flex; flex-wrap: wrap; margin: 0 -12px; padding: calc(0.02083 * 100vw) 0 0; min-height: 99px; border: 0; width: auto; }
  .board-filter-v::after { content: ''; position: absolute; top: 0; right: 12px; left: 12px; border-top: 1px solid #ddd; }
  .board-filter-v li { margin: 0 12px; }
  .board-filter-v li + li { margin-top: 0; }
  .board-filter-v .filter-item { position: relative; }
  .board-filter-v .filter-item input { position: absolute; opacity: 0; visibility: hidden; }
  .board-filter-v .filter-item-label { display: inline-block; padding: 0; height: auto; line-height: 1.5em; } }

@media (max-width: 800px) { .board { padding: 120px 0; width: calc(100% - 30px); }
  .board-title { margin-bottom: 90px; height: 30px; font-size: 1.875rem; }
  .board-filter-h, .board-filter-v { position: relative; top: 0; left: 0; display: flex; flex-wrap: wrap; margin: 0 -10px; padding: 20px 0 0; min-height: 39px; border: 0; width: auto; }
  .board-filter-h::after, .board-filter-v::after { content: ''; position: absolute; top: 0; right: 10px; left: 10px; border-top: 1px solid #ddd; }
  .board-filter-h li, .board-filter-v li { margin: 0 12px; }
  .board-filter-h li + li, .board-filter-v li + li { margin-top: 0; }
  .board-filter-h .filter-item, .board-filter-v .filter-item { position: relative; }
  .board-filter-h .filter-item input, .board-filter-v .filter-item input { position: absolute; opacity: 0; visibility: hidden; }
  .board-filter-h .filter-item-label, .board-filter-v .filter-item-label { display: inline-block; padding: 0; height: auto; font-size: 0.875rem; line-height: 1.71429em; }
  .board-filter-v { margin-top: 20px; min-height: 39px; }
  .board-card .board-item { width: calc(100% - 20px); }
  .board-card .board-item a { padding: 16px; }
  .board-card .board-item .title { display: block; margin-bottom: 14px; height: auto; font-size: 0.875rem; }
  .board-card .board-item .author, .board-card .board-item .info { margin-bottom: 14px; font-size: 0.75rem; }
  .board-card .board-item .summary { margin-bottom: 0; padding-top: 14px; font-size: 0.75rem; }
  .board-masonry .board-item { width: 100%; padding-top: 100%; }
  .board-masonry .board-item.col-2, .board-masonry .board-item.col-3 { width: 100%; }
  .board-masonry .board-item .text .head { margin-bottom: 10px; }
  .board-pin .board-item { width: 100%; padding-top:70%; }
  .board-pin .board-item .text { transform: scale(1); opacity: 1; background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.9) 100%); }
  .board-pin .board-item .text .title { font-size: 1rem; }
  /*.board-pin .board-item figure { position: relative; top: 0; right: 0; bottom: 0; left: 0; margin: 5px; }*/
  /*.board-pin .board-item figure img { opacity: 0.7; }*/
  .board-pin .board-item figure img:not(:first-child) { display: none; } }

.article { padding-bottom: 170px; }

.article-wrapper { box-sizing: border-box; margin: 0 auto; padding: 0 25px; width: 100%; max-width: 1012px; }

.article-header { top: 0; position: relative; padding-top: 170px; color: #fff; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; text-shadow: 1px 1px 1px #2a2a2a; }

.article-header::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.6); }

.article-header .article-wrapper { position: relative; z-index: 1; }

.article-header .article-wrapper .title { min-height: 230px; }

.article-header .article-wrapper .info { min-height: 100px; }

.article-header h2 { font-family: 'Lora', 'YESMyoungjo', serif; position: relative; margin-bottom: 30px; font-size: 2.625rem; }

.article-header p { font-size: 1.125rem; line-height: 1.66667em; }

.article-header ul { display: flex; }

.article-header ul.year { margin-top: 10px; }

.article-header ul li { font-size: 0.875rem; line-height: 1; }

.article-header ul li::before { content: '#'; }

.article-header ul li + li { margin-left: 16px; }

.article-content { position: relative; background-color: #fff; z-index: 1; }

.article-body p { margin-bottom: 2em; line-height: 30px; }

.article-body .media-wrapper { margin: 60px 0; text-align: center; }

.article-body .media-wrapper img, .article-body .media-wrapper iframe { display: inline-block; max-width: 100%; }

.article-actions { display: flex; justify-content: flex-end; margin-top: 70px; padding-top: 21px; border-top: 1px solid #e5e5e5; }

.article-actions a { text-align: center; line-height: 28px; transition: box-shadow .2s; }

.article-actions .btn { display: block; box-sizing: border-box; width: 80px; height: 30px; border: 1px solid #bbb; font-size: 0.875rem; color: #999; outline: 0; }

.article-actions .btn:hover { box-shadow: 0 2px 5px #ddd; }

.article-actions .btn.delete { color: #000; border-color: #000; }

.article-actions .btn + .btn { margin-left: 10px; }

.exhibition-detail .article-body { padding: 100px 0 0; }

.exhibition-detail .article-body > * { transform: translateY(50px); opacity: 0; transition: .5s ease-out; }

.exhibition-detail .article-body > *.on { transform: translateY(0); opacity: 1; }

@media (max-width: 800px) { .article { padding-bottom: 120px; }
  .article-header { padding-top: 120px; }
  .article-header .article-wrapper .title { min-height: 220px; }
  .article-header .article-wrapper .info { min-height: 60px; }
  .article-header h2 { font-size: 1.625rem; }
  .exhibition-detail .article-body { padding: 50px 0 0; } }

.board-new { margin: 0 auto 30px; padding: 80px 0; width: 100%; max-width: 1180px; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }

.board-new-wrapper { margin: 0 auto; width: 100%; max-width: 980px; }

.board-new-wrapper::after { content: ''; display: block; clear: both; }

.board-new .new-block { margin: 20px 0; padding: 10px 15px; border: 1px solid #e5e5e5; }

.board-new .new-block.input-wrapper { display: flex; align-items: flex-end; padding: 0; border: 0; }

.board-new .new-block.input-wrapper > label, .board-new .new-block.input-wrapper input[type=text], .board-new .new-block.input-wrapper input[type=file] { flex: 1; box-sizing: border-box; display: block; padding: 0 15px; font-size: 1rem; line-height: 2.375em; border: 1px solid #e5e5e5; }

.board-new .new-block.input-wrapper input[type=file]:not(:last-child) { margin-right: 20px; }

.board-new .new-block.input-wrapper > label { padding-left: 15px !important; color: #777; flex: none; margin-right: 10px; margin-left: 10px;}

.board-new .new-block.input-wrapper > label::before { display: none; }

.board-new .new-block.input-wrapper > label::before + input[type=file] { margin-left: 0; border-left: 0; }

.board-new .new-block.input-wrapper .thumb { margin-right: 20px; width: 120px; height: 90px; text-align: center; background-color: #ddd; }

.board-new .new-block.input-wrapper .thumb img { max-width: 100%; max-height: 100%; }

.board-new .new-block.input-wrapper .thumb img[src=""] { display: none; }

.board-new .new-block .btn-del-item { margin-left: 20px; width: 40px; height: 40px; padding: 0; border: 1px solid #e5e5e5; background: none; }

.board-new .new-block input[type=radio], .board-new .new-block input[type=checkbox] { position: absolute; opacity: 0; }

.board-new .new-block input[type=radio]:checked + label::after, .board-new .new-block input[type=checkbox]:checked + label::after { content: ''; position: absolute; top: 7px; left: 3px; width: 14px; height: 11px; background: url(../images/icons/icon_checked.png) no-repeat; }

.board-new .new-block label { position: relative; padding-left: 30px; cursor: pointer; }

.board-new .new-block label::before { content: ''; position: absolute; top: 50%; left: 0; margin-top: -9px; box-sizing: border-box; width: 20px; height: 20px; border: 1px solid #bbb; }

.board-new .new-block label ~ label { margin-left: 30px; }

.board-new .new-block .inline-title { margin-right: 50px; }

.board-new .new-block .block-title { margin-bottom: 10px; padding: 10px 0 20px; font-size: 1.25rem; font-weight: 700; line-height: 1; border-bottom: 1px solid #e5e5e5; }

.board-new .new-block .check-list { margin: 0 -15px; }

.board-new .new-block .check-list label { display: inline-block; margin: 10px 15px; }

.board-new .add-new-block { margin-top: 20px; padding-top: 20px; display: flex; justify-content: flex-end; border-top: 1px solid #e5e5e5; }

.board-new .add-new-block .btn-add-item { width: 40px; height: 40px; padding: 0; border: 1px solid #e5e5e5; background: none; }

.new-submit { float: right; display: block; width: 80px; height: 30px; border: 1px solid #bbb; font-size: 0.875rem; color: #999; background: none; transition: box-shadow .2s; outline: 0; }

.new-submit:hover { box-shadow: 0 2px 5px #ddd; }

.new-submit.dark { border-color: #000; color: #000; }

.new-submit + .new-submit { margin-right: 10px; }

.publication-view { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.8); backdrop-filter: blur(4px); z-index: 200; opacity: 0; visibility: hidden; transition: 0.3s cubic-bezier(0.17, 0.67, 0.21, 1); }

.publication-view.on { opacity: 1; visibility: visible; }

.publication-view-wrapper { position: relative; display: flex; flex-direction: column; padding: 40px 0; box-sizing: border-box; width: 95%; max-width: 1180px; border: 1px solid #bbb; background-color: #fff; cursor: default; }

.publication-view .article-publication { display: flex; flex-direction: column; height: 100%; }

.publication-view .article-header { padding: 0 60px 20px; background: none; text-shadow: none; }

.publication-view .article-header::before { display: none; }

.publication-view .article-header h2 { margin-bottom: 40px; font: inherit; font-size: 2rem; line-height: 1.3125em; color: #000; }

.publication-view .article-header p, .publication-view .article-header ul { margin: 0; color: #bbb; line-height: 1; }

.publication-view .article-header p { margin-bottom: 65px; }

.publication-view .article-header li { font-size: 0.875rem; line-height: 1.71429em; }

.publication-view .article-content-wrapper { border: solid #bbb; border-width: 1px 0; }

.publication-view .article-content { padding: 50px 60px; overflow-x: hidden; overflow-y: auto; }

.publication-view .article-content .simplebar-scrollbar::before { background-color: #bbb; }

.publication-view .article-content-actions { display: flex; justify-content: flex-end; padding-top: 21px; }

.publication-view .article-content-actions a { text-align: center; line-height: 28px; transition: box-shadow .2s; }

.publication-view .article-content-actions .btn { display: block; box-sizing: border-box; min-width: 80px; height: 30px; border: 1px solid #bbb; font-size: 0.875rem; color: #999; outline: 0; }

.publication-view .article-content-actions .btn:hover { box-shadow: 0 2px 5px #ddd; }

.publication-view .article-content-actions .btn.down, .publication-view .article-content-actions .btn.delete, .publication-view .article-content-actions .btn.del { color: #000; border-color: #000; }

.publication-view .article-content-actions .btn.down { padding: 0 25px; text-transform: uppercase; }

.publication-view .article-content-actions .btn + .btn { margin-left: 10px; }

.publication-view .article-info { margin-bottom: 30px; padding: 15px 0; border: 1px solid #e5e5e5; vertical-align: top; width: auto !important; height: auto !important; }

.publication-view .article-info .info-item { display: flex; padding: 7px 0; }

.publication-view .article-info .info-item dt { width: 116px; }

.publication-view .article-info .info-item dd { width: 150px; }

.publication-view .article-info th { padding: 7px 0; width: 116px; text-align: left; }

.publication-view .article-info td:first-child { padding: 7px 30px; width: auto; border-right: 1px solid #e5e5e5; white-space: nowrap; }

.publication-view .article-info td:last-child { padding: 7px 30px; width: auto; white-space: nowrap; }

.publication-view .article-body { margin: 0 0 21px; }

.publication-view .article-body .title { margin-bottom: 30px; font-size: 1.5rem; }

.publication-view .article-body p { margin: 2em 0; line-height: 30px; }

.publication-view .article-content-actions { padding: 0; }

.publication-view-footer { box-sizing: border-box; margin-right: 8%; padding-top: 40px; height: 98px; border-top: 1px solid #e5e5e5; }

.publication-view-footer .logo { display: block; margin-bottom: 10px; width: 191px; opacity: .2; }

.publication-view-footer .title { font-family: 'Lora', 'YESMyoungjo', serif; font-size: 0.875rem; font-weight: 600; line-height: 1; opacity: .2; }

@media (max-width: 800px) { .publication-view-wrapper { padding: 40px 0 60px!important; width: 100%; height: 100%; }
  .publication-view .article-header { padding: 0 25px 20px; }
  .publication-view .article-header h2 { font-size: 1.125rem!important; }
  .publication-view .article-header p { margin-bottom: 40px; }
  .publication-view .article-content-wrapper { flex-grow: 1; overflow-y: auto; }
  .publication-view .article-content { padding: 30px 25px 50px; }
  .publication-view .article-info { padding: 10px!important; width: 100% !important; }
  .publication-view .article-info td { font-size: 14px; }
  .publication-view .article-info td:first-child { padding: 5px 15px 5px 15px; }
  .publication-view .article-info td:last-child { white-space: normal; } }

@media (max-height: 800px) { .publication-view-wrapper { padding: 20px 0; }
  .publication-view .article-header h2 { margin-bottom: 20px; font-size: 1.5rem; }
  .publication-view .article-header p { margin-bottom: 30px; } }

.news-view { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.8); backdrop-filter: blur(4px); z-index: 200; opacity: 0; visibility: hidden; transition: 0.3s cubic-bezier(0.17, 0.67, 0.21, 1); }

.news-view.on { opacity: 1; visibility: visible; }

.news-view-wrapper { position: relative; display: flex; width: 95%; height: 80vh; max-height: 600px; max-width: 1180px; background-color: #fff; cursor: default; }

.news-view-images { width: calc(100% - 400px); height: 100%; overflow: hidden; background-color: #222;}

.news-view-images .img { position: relative; height: 600px; /*background-color: #222;*/ outline: 0; overflow: hidden; }

.news-view-images .img img { position: absolute; top: 0; left: 50%; height: 100%; transform: translateX(-50%); }

.news-view-images .slick-prev { left: 25px; z-index: 1; text-shadow: 1px 1px 1px #333; }

.news-view-images .slick-next { right: 25px; z-index: 1; text-shadow: 1px 1px 1px #333; }

.news-view .article-news { display: flex; flex-direction: column; width: 400px; }

.news-view .article-header { padding: 20px 20px 10px; background: none; text-shadow: none; border-bottom: 1px solid #e5e5e5; }

.news-view .article-header::before { display: none; }

.news-view .article-header h2 { margin-bottom: 14px; font: inherit; font-size: 1.125rem; color: #000; }

.news-view .article-header p { margin-bottom: 40px; font-size: 0.875rem; color: #bbb; }

.news-view .article-header ul li { font-size: 0.75rem; color: #bbb; }

.news-view .article-content { flex-grow: 1; padding: 0 20px; height: calc(100% - 50px); font-size: 0.875rem; line-height: 1.71429em; overflow-x: hidden; overflow-y: auto; }

.news-view .article-content .simplebar-scrollbar::before { background-color: #bbb; }

.news-view .article-content p { margin: 2em 0; line-height: inherit; }

.news-view .article-content-actions { display: flex; justify-content: flex-end; padding: 20px 20px 0 0; height: 70px; border-top: 1px solid #e5e5e5; }

.news-view .article-content-actions a { text-align: center; line-height: 28px; transition: box-shadow .2s; }

.news-view .article-content-actions .btn { display: block; box-sizing: border-box; min-width: 80px; height: 30px; border: 1px solid #bbb; font-size: 0.875rem; color: #999; outline: 0; }

.news-view .article-content-actions .btn:hover { box-shadow: 0 2px 5px #ddd; }

.news-view .article-content-actions .btn.del { color: #000; border-color: #000; }

.news-view .article-content-actions .btn + .btn { margin-left: 10px; }

@media (max-width: 800px) { .news-view-wrapper { display: block; width: 100%; height: 100%; max-height: 100%; }
  .news-view-wrapper .btn-close-popup::before, .news-view-wrapper .btn-close-popup::after { border-color: #fff; }
  .news-view-images { width: 100%; height: 300px; }
  .news-view-images .img { height: 300px; }
  .news-view .article-news { width: 100%; height: calc(100% - 300px); }
  .news-view .article-content-actions { padding: 10px 10px 0 0; min-height: 40px; } }

.team .board { position: relative; margin-bottom: -100vh; color: #fff; z-index: 1; }

.team .board-container { padding-top: 129px; }

.team .board-container .board-filter-v { top: 129px; }

.team .board-container .board-filter-v .filter-item input:checked + .filter-item-label { color: #fff; }

.team .board .names-list { display: flex; flex-wrap: wrap; margin: -5px; }

.team .board .names-list li { box-sizing: border-box; margin: 5px; padding: 30px 30px 20px; width: calc(50% - 10px); line-height: 1; background-color: rgba(255, 255, 255, 0.08); }

.team .board .names-list li .name { margin-bottom: 18px; font-size: 1.875rem; }

.team .board .names-list li .career { padding-left: 10px; color: #aaa; }

.team .board .names-list li .career-item { font-size: 1rem; }

.team .board .names-list li .career-item + .career-item { margin-top: 14px; }

.team .board .names-list li .career p { font-size: 1rem; line-height: 1.875em; }

.team .bg-media { position: -webkit-sticky; position: sticky; bottom: 0; width: 100%; height: 100vh; background-color: #000; }

.team .bg-media > img, .team .bg-media > video { width: 100%; height: 100%; object-fit: cover; opacity: 0.5; }

.team .collabo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 50px 0 20px; }

.team .collabo li { margin: 30px 0; }

.team .collabo li img { display: block; /*height: 50px;*/ }

.team .team-subtitle { font-family: 'Lora', 'YESMyoungjo', serif; padding-bottom: 30px; font-size: 2rem; border-bottom: 1px solid #ddd; text-transform: uppercase; }

.team .section-top .team-subtitle { margin-top: -60px; }

.team .section-bot { margin: 0 auto; width: calc(100% - 50px); max-width: 1180px; padding-bottom:100px;}

.team .section-bot .team-subtitle { padding-top: 150px; }

@media (min-width: 801px) and (max-width: 1440px) { .team .board-container { padding-top: 0; border-top: 0; }
  .team .board-container .board-filter-v { top: 0; } }

@media (max-width: 800px) { .team .board-container { padding-top: 0; border-top: 0; }
  .team .board-container .board-filter-v { top: 0; }
  .team .board .names-list { padding-top: 20px; }
  .team .board .names-list li { padding: 15px 15px 10px; width: 100%; }
  .team .board .names-list li .name { margin-bottom: 15px; font-size: 1.25rem; }
  .team .board .names-list li .career-item { font-size: 0.875rem; }
  .team .board .names-list li .career-item + .career-item { margin-top: 10px; }
  .team .section-bot { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 100px 0; }
  .team .collabo { display: block; height: auto; }
  .team .collabo li { margin: 0; }
  .team .collabo li + li { margin-top: 50px; }
  .team .collabo li img { /*height: 30px;*/ }
  .team .team-subtitle { font-family: 'Lora', 'YESMyoungjo', serif; padding-bottom: 15px; font-size: 1.125rem; }
  .team .section-top .team-subtitle { border-bottom: 0; }
  .team .section-bot .team-subtitle { width: 100%; padding-top: 0; } }

.team-new-actions { display: flex; justify-content: flex-end; margin-bottom: 10px; }

.team-new-actions a { text-align: center; line-height: 28px; }

.team-new-actions .btn { display: block; box-sizing: border-box; min-width: 80px; height: 30px; font-size: 0.875rem; color: #999; background: none; border: 1px solid #bbb; outline: 0; }

.team-new-actions .btn:hover { box-shadow: 0 2px 5px #ddd; }

.team-new-actions .btn.btn-accent { color: #000; border-color: #000; }

.team-new-actions .btn + .btn { margin-left: 10px; }

.team-new-card { margin: 0 -5px; display: flex; flex-wrap: wrap; }

.team-new-item { box-sizing: border-box; margin: 5px; padding: 30px; width: calc(50% - 10px); border: 1px solid #ddd; border-radius: 5px; }

.team-new-item .add-new { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 1.5rem; color: #999; background: none; text-transform: uppercase; }

.team-new-item .add-new i { position: relative; display: block; margin: 0 auto 15px; width: 50px; height: 50px; }

.team-new-item .add-new i::before, .team-new-item .add-new i::after { content: ''; position: absolute; top: 50%; left: 50%; margin: -2px 0 0 -25px; width: 50px; border-top: 4px solid #000; }

.team-new-item .add-new i::after { transform: rotate(90deg); }

.team-new-item .detail { display: flex; margin-top: 10px; }

.team-new-item .detail-col { flex: 1; }

.team-new-item .detail-col + .detail-col { margin-left: 20px; width: calc(50% - 20px); }

.team-new-item .logo-inner { position: relative; overflow: hidden; }

.team-new-item .logo-inner .place-holder { font-family: 'Lora', 'YESMyoungjo', serif; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; justify-content: center; align-items: center; font-size: 1.5rem; color: #999; background-color: #e5e5e5; text-transform: uppercase; }

.team-new-item .logo-inner img { float: right; position: relative; display: block; height: 100%; z-index: 1; }

.team-new-item .logo-inner img[src=""] + .place-holder { display: flex; }

.team-new-item .logo { box-sizing: border-box; padding: 9px; border: 1px solid #e5e5e5; }

.team-new-item .logo .logo-inner { height: 50px; }

.team-new-item .logo img { float: left; height: 50px; }

.team-new-item input[type=text], .team-new-item input[type=file] { display: block; margin-top: 10px; box-sizing: border-box; padding: 0 5px; width: 100%; line-height: 28px; border: 1px solid #e5e5e5; }

.team-new-item textarea { display: block; box-sizing: border-box; padding: 5px; width: 100%; border: 1px solid #e5e5e5; resize: none; }

.team-new-item textarea.name-text { height: 74px; font-size: 1.25rem; }

.team-new-item textarea.career-text { margin-bottom: 10px; height: 143px; font-size: 1rem; line-height: 2.125em; }

.team-new-item .selectric-wrapper { border: 1px solid #e5e5e5; }

.team-new-item .selectric-wrapper .selectric { border: 0; background: none; }

.team-new-item .selectric-wrapper .selectric .label { height: 28px; font-size: 0.875rem; line-height: 2em; }

.team-new-item .selectric-wrapper .selectric .button { height: 28px; line-height: 28px; background: none; }

.team-new-item .selectric-wrapper .selectric-items { border-color: #e5e5e5; background-color: #fff; }

.team-new-item .selectric-wrapper .selectric-items ul, .team-new-item .selectric-wrapper .selectric-items li { font-size: 0.875rem; line-height: 2.14286em; }

.team-new-item .selectric-wrapper .selectric-items li { padding: 0 10px; }

.team-new-item .selectric-wrapper .selectric-items li.highlighted, .team-new-item .selectric-wrapper .selectric-items li.selected, .team-new-item .selectric-wrapper .selectric-items li:hover { background-color: #f5f5f5; }

.team-new-item .condition { display: flex; margin-top: 10px; }

.team-new-item .condition .selectric-wrapper, .team-new-item .condition select { flex: 1; display: block; box-sizing: border-box; height: 30px; border: 1px solid #e5e5e5; }

.team-new-item .condition .selectric-wrapper + select, .team-new-item .condition .selectric-wrapper + .selectric-wrapper, .team-new-item .condition select + select, .team-new-item .condition select + .selectric-wrapper { margin-left: 20px; }

.team-new-item .tag-block { box-sizing: border-box; height: 100%; border: 1px solid #e5e5e5; }

.team-new-item .tag-block .title { padding-left: 10px; color: #bbb; font-size: 0.875rem; line-height: 2em; border-bottom: 1px solid #e5e5e5; }

.team-new-item .tag-block .check-list { height: 152px; overflow-y: auto; }

.team-new-item .tag-block .check-list li { padding-left: 16px; line-height: 35px; }

.team-new-item .tag-block .check-list input[type=radio], .team-new-item .tag-block .check-list input[type=checkbox] { position: absolute; opacity: 0; }

.team-new-item .tag-block .check-list input[type=radio]:checked + label::after, .team-new-item .tag-block .check-list input[type=checkbox]:checked + label::after { content: ''; position: absolute; top: 7px; left: 3px; width: 14px; height: 11px; background: url(../images/icons/icon_checked.png) no-repeat; }

.team-new-item .tag-block .check-list label { position: relative; padding-left: 30px; cursor: pointer; }

.team-new-item .tag-block .check-list label::before { content: ''; position: absolute; top: 50%; left: 0; margin-top: -9px; box-sizing: border-box; width: 20px; height: 20px; border: 1px solid #bbb; }

.team-new-item .tag-block .check-list label ~ label { margin-left: 30px; }

.team-new-item .team-new-actions { margin-top: 20px; padding-top: 20px; border-top: 1px solid #ddd; }

.contact { padding-bottom: 170px; }

.contact .board { padding-bottom: 100px; }

.contact .info-send { display: flex; justify-content: space-between; padding-top: 129px; border-top: 1px solid #ddd; }

.contact .info-send .info li { padding-left: 80px; height:70px; line-height: 70px; font-weight: 500; background-repeat: no-repeat; background-position: 0 50%; }

.contact .info-send .info li + li { margin-top: 50px; }

.contact .info-send .info li.email { background-image: url(../images/icons/icon_email.png); }

.contact .info-send .info li.point { background-image: url(../images/icons/icon_point.png); background-position: 7px 50%; display:flex; align-items: center;}

.contact .info-send .info li.point .address{ display:inline-block; line-height:1.6; }

.contact .info-send .info li.tel { background-image: url(../images/icons/icon_tel.png); }

.contact .info-send .send { box-sizing: border-box; padding-left: 10px; width: 50%; }

.contact .info-send .send .send-form { position: relative; }

.contact .info-send .send .send-form + .send-form { margin-top: 30px; }

.contact .info-send .send .send-form label { position: absolute; top: 12px; left: 0; display: block; color: #ddd; font-size: 1.125rem; font-weight: 700; text-transform: uppercase; }

.contact .info-send .send .send-form input, .contact .info-send .send .send-form textarea { padding: 0; width: 100%; font-size: 1.125rem; border: solid #e5e5e5; border-width: 0 0 1px 0; outline: 0; }

.contact .info-send .send .send-form input:focus, .contact .info-send .send .send-form input:active, .contact .info-send .send .send-form textarea:focus, .contact .info-send .send .send-form textarea:active { border-bottom-color: #000; }

.contact .info-send .send .send-form input { height: 54px; }

.contact .info-send .send .send-form textarea { display: block; box-sizing: border-box; padding: 15px 0; height: 180px; }

.contact .info-send .send .submit { display: block; margin: 27px 0 0 calc(100% - 180px); width: 180px; color: #999; font-size: 0.875rem; font-weight: 500; line-height: 2em; background: none; border: 1px solid #999; text-transform: uppercase; cursor: pointer; }

.contact .map { height: 500px; overflow: hidden; }

.contact .map iframe { display: block; margin-top: -150px; }

@media (max-width: 800px) { .contact { padding-bottom: 120px; }
  .contact .info-send { display: block; padding-top: 20px; }
  .contact .info-send .info li { padding: 55px 0 10px 60px; line-height: 1; background-size: 40px; background-position: 0 100% !important; }
  .contact .info-send .info li + li { margin-top: 0; }
  .contact .info-send .send { margin-top: 92px; padding-left: 0; width: 100%; }
  .contact .info-send .send .send-form label { top: 8px; font-size: 1rem; }
  .contact .info-send .send .send-form input { height: 40px; }
  .contact .info-send .send .send-form textarea { height: 170px; }
  .contact .info-send .send .submit { margin: 20px auto 0; } }

.contact-user-card { margin: 0 -10px; display: flex; flex-wrap: wrap; }

.contact-user-item { display: flex; flex-direction: column; box-sizing: border-box; margin: 10px; padding: 30px; width: calc(50% - 20px); height: 380px; border: 1px solid #000; border-radius: 10px; }

.contact-user-item p { margin-bottom: 10px; padding-bottom: 0; font-size: 1.125rem; line-height: 1.66667em; color: #333; }

.contact-user-item .message { flex-grow: 1; padding: 15px 15px 15px 0; font-size: 1rem; line-height: 1.5em; border-top: 1px solid #ddd; overflow-x: hidden; overflow-y: auto; }

.contact-user-item .message .simplebar-scrollbar::before { background-color: #bbb; }

.login-dimm { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 9000; display: none; backdrop-filter: blur(4px); }

.login-dimm.on { display: block; }

.login { width: 360px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 20px #222; }

.login-title { height: 50px; line-height: 50px; background: #f5f5f5; font-weight: bold; text-align: center; color: #000; position: relative; }

.login-close { width: 24px; height: 24px; background: none; border: 0; padding: 0; position: absolute; top: 13px; right: 13px; cursor: pointer; }

.login-close > span { display: block; text-indent: -99999em; }

.login-close:before, .login-close:after { content: ""; display: block; width: 100%; height: 2px; background: #000; position: absolute; top: 50%; }

.login-close:before { transform: translateY(-50%) rotate(45deg); }

.login-close:after { transform: translateY(-50%) rotate(-45deg); }

.login-form { padding: 0 40px 40px; background: #fff; }

.login-form .contact-input-container { width: 100%; position: relative; }

.login-form .contact-input-container:after { content: ""; display: block; width: 0; height: 1px; background: #333; position: absolute; bottom: 0; left: 0; transition: width 0.5s; }

.login-form .contact-input-container.active:after { width: 100%; }

.login-form .contact-input { width: 100%; height: 32px; line-height: 32px; border: 0; border-bottom: 1px solid #ddd; margin-top: 30px; padding: 0; }

.login-form .contact-input:focus { outline: none; background: #fafafa; }

.login-form .contact-input::placeholder { color: #ddd; }

.login-button { width: 100%; height: 50px; line-height: 50px; background: #333; font-weight: bold; text-align: center; color: #fff; border: none; }

.write { position: fixed; top: 0; bottom: 0; left: -370px; padding: 80px 0 0; width: 370px; color: #fff; background-color: #111; transition: transform 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); z-index: 110; }

.write-title { padding-left: 30px; font-size: 1.5rem; line-height: 1.66667em; color: #fff; background-color: #333; text-transform: uppercase; }

.write-section-container { padding: 0 25px; height: calc(100% - 40px); overflow-x: hidden; overflow-y: auto; }

.write-section { padding-top: 50px; }

.write-section:last-child { padding-bottom: 50px; }

.write-section.folded .title::after { content: '+'; }

.write-section.folded .body { max-height: 0; transition: none; }

.write-section .title { display: flex; justify-content: space-between; padding-bottom: 6px; font-size: 1.5rem; line-height: 1; border-bottom: 1px solid #fff; text-transform: uppercase; cursor: pointer; }

.write-section .title::after { content: '-'; position: block; }

.write-section .title.no-sub { cursor: default; pointer-events: none; }

.write-section .title.no-sub::after { display: none; }

.write-section .body { max-height: 6500px; overflow: hidden; transition: max-height 1s linear; }

.write-section .form-group { padding-left: 10px; max-height: 6500px; transition: max-height 1s linear; overflow: hidden; }

.write-section .form-group:first-child { margin-top: 50px; }

.write-section .form-group:last-child .form-group-action { padding-bottom: 40px; border-bottom: 1px solid #fff; }

.write-section .form-group + .form-group { margin-top: 40px; }

.write-section .form-group.folded { max-height: 20px; transition: none; }

.write-section .form-group.folded .form-group-title::after { content: '+'; }

.write-section .form-group-title { display: flex; justify-content: space-between; margin-bottom: 20px; padding-bottom: 3px; font-size: 1rem; line-height: 1; text-transform: uppercase; border-bottom: 1px solid #fff; cursor: pointer; }

.write-section .form-group-title::after { content: '-'; position: block; }

.write-section .form-group-title ~ .form-block .form-label { position: relative; padding-left: 15px; }

.write-section .form-group-title ~ .form-block .form-label::before { content: ''; position: absolute; top: 6px; left: 0; width: 4px; height: 4px; border-radius: 50%; background-color: #fff; }

.write-section .form-group-action { display: flex; justify-content: flex-end; padding-top: 20px; }

.write-section .form-group-action button { display: block; width: 50%; font-size: 1rem; line-height: 1.875em; text-align: center; color: #fff; background-color: #333; text-transform: uppercase; outline: 0; }

.write-section .form-block + .form-block { margin-top: 20px; }

.write-section .form-block.with-thumb { position: relative; padding-right: 134px; }

.write-section .form-block.with-thumb .thumb { position: absolute; bottom: 0; right: 0; width: 129px; height: 110px; text-align: center; background-color: #333; }

.write-section .form-block.with-thumb .thumb img { max-width: 100%; max-height: 100%; }

.write-section .form-label { display: block; margin-bottom: 10px; font-size: 1rem; line-height: 1; text-transform: uppercase; }

.write-section textarea, .write-section input { display: block; padding: 3px; box-sizing: border-box; width: 100%; color: #000; background-color: #ddd; }

.write-section textarea { height: 70px; }

.write-section .form-list-block { padding-bottom: 30px; border-bottom: 1px solid #fff; }

.write-section .form-list-block li { display: flex; justify-content: space-between; }

.write-section .form-list-block li + li { margin-top: 20px; }

.write-section .form-list-block li input, .write-section .form-list-block li button { height: 30px; }

.write-section .form-list-block li button { margin-left: 10px; min-width: 30px; }

.write-section .form-select-type { display: flex; }

.write-section .form-select-type input[type=radio], .write-section .form-select-type input[type=checkbox] { position: absolute; opacity: 0; visibility: hidden; }

.write-section .form-select-type input[type=radio]:checked + label::after, .write-section .form-select-type input[type=checkbox]:checked + label::after { content: ''; position: absolute; top: 6px; left: 3px; width: 14px; height: 11px; background: url(../images/icons/icon_checked.png) no-repeat; }

.write-section .form-select-type label { position: relative; padding-left: 30px; height: 20px; line-height: 20px; cursor: pointer; }

.write-section .form-select-type label::before { content: ''; position: absolute; top: 50%; left: 0; margin-top: -9px; box-sizing: border-box; width: 20px; height: 20px; border: 1px solid #bbb; background-color: #fff; }

.write-section .form-select-type label ~ label { margin-left: 30px; }

.write-section .submit-section, .write-section .btn-add-item, .write-section .link-section { display: block; margin-top: 40px; width: 100%; font-size: 1rem; line-height: 30px; text-align: center; color: #fff; background-color: #333; text-transform: uppercase; outline: 0; }

.write-section .actions-section { display: flex; justify-content: space-between; margin: 0 -5px; padding-top: 30px; }

.write-section .actions-section > a, .write-section .actions-section > button { margin: 0 5px; }

.write-toggle { position: absolute; top: 80px; right: -40px; width: 40px; height: 50px; background: #333 url(../images/icons/icon_bracket.png) no-repeat 50% 50%; text-indent: -9999px; z-index: 110; outline: 0; transform: rotate(180deg); }

body { transition: margin 0.5s cubic-bezier(0.17, 0.67, 0.21, 1); }

body.open-write { margin-left: 370px; }

body.open-write .write { transform: translateX(100%); }

body.open-write .write-toggle { transform: rotate(0); }

body.open-write .index .section-mid .media.sticky { left: calc(25% + 370px); }

.simplebar-scrollbar::before { right: auto; width: 5px; background-color: #777; border-radius: 0; }

@media (max-width: 800px) { .write { width: 300px; } }

.mce-container { border-color: #e5e5e5 !important; }

.mce-container .mce-panel { background-image: none; border-color: #e5e5e5 !important; background-color: #fafafa; }

.mce-container .mce-toolbar-grp { padding-bottom: 0; }

.mce-container .mce-btn { background: none; box-shadow: none !important; border-radius: 0 !important; border: 0 !important; }

.mce-container .mce-btn:hover { background: #ddd !important; }

.mce-container .mce-btn i { text-shadow: none; }

.mce-container .mce-btn button { padding: 5px 7px; }

.mce-container .mce-open { height: 30px; }

.mce-container .mce-menubtn.mce-fixed-width.mce-btn-small span { width: auto; padding-right: 14px; }

.mce-container .mce-container-body .mce-resizehandle { display: none; }

.check-default{display:flex;}
.write-section input.check-default-checkbox{
  width:auto;
  position: absolute;
  opacity: 0;
}
.check-default-label{
  display: inline-block;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  margin-bottom:20px;
}
.check-default-label::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -9px;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border: 1px solid #bbb;
  background:#fff;
}
.check-default-checkbox:checked + label::after {
  content: '';
  position: absolute;
  top: 7px;
  left: 3px;
  width: 14px;
  height: 11px;
  background: url(../images/icons/icon_checked.png) no-repeat;
}

.youtube-video{
  display:block;
  margin-top:500px;
}

.pdf-thumb{
  width: 50%;
  height: 300px;
  object-fit: cover;
  object-position: top;
  background:#ccc url(/project/images/pdf.png) no-repeat center;
}