.yun-notice{border:1px solid var(--va-c-text);width:calc(100% - 2rem);display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:var(--va-font-serif);font-weight:700;padding:1rem;max-width:var(--yun-post-card-max-width);background-color:#c8c8c81a}.say{color:var(--va-c-text);display:block;text-align:center;font-family:var(--va-font-serif);font-weight:700;padding:.5rem;border-top:var(--va-border-width) solid var(--va-c-text-light);border-bottom:var(--va-border-width) solid var(--va-c-text-light)}.say .say-content,.say .say-from{display:block}.go-down{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;position:absolute;bottom:1rem;z-index:var(--yun-z-go-down);animation:float 2s ease-in-out infinite;font-size:2.5rem;color:var(--va-c-primary);transition:color var(--va-transition-duration)}.go-down:hover{color:rgba(var(--va-c-primary-rgb),.6)}@keyframes float{0%{opacity:1;transform:translateY(0)}50%{opacity:.8;transform:translateY(-.8rem)}to{opacity:1;transform:translateY(0)}}.yun-cloud{display:flex;width:100%;position:absolute;bottom:0;left:0;right:0;z-index:var(--yun-z-cloud);box-sizing:border-box;mix-blend-mode:overlay}.yun-cloud .waves{display:flex;position:relative;width:100%;height:100px}@media screen and (min-width: 768px){.yun-cloud .waves{height:40px}}.yun-cloud .parallax>use{animation:move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite}.yun-cloud .parallax>use:nth-child(1){opacity:.7;animation-delay:-2s;animation-duration:7s}.yun-cloud .parallax>use:nth-child(2){opacity:.5;animation-delay:-3s;animation-duration:10s}.yun-cloud .parallax>use:nth-child(3){opacity:.3;animation-delay:-4s;animation-duration:13s}.yun-cloud .parallax>use:nth-child(4){animation-delay:-5s;animation-duration:20s}@keyframes move-forever{0%{transform:translate3d(-90px,0,0)}to{transform:translate3d(85px,0,0)}}#yun-banner{--banner-line-height: 0;--line-animation-duration: .4s;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:var(--banner-container-height, 100vh)}.banner-char-container{display:flex;flex-direction:column;align-items:center}.banner-line-container{position:relative;display:flex;flex-direction:column;align-items:center;height:var(--banner-line-height);transition:height 2s}.banner-line-container.bottom{justify-content:end}.vertical-line-top,.vertical-line-bottom{display:flex;background-color:var(--banner-line-color);width:1px;height:0;animation-name:extend-line;animation-duration:var(--line-animation-duration);animation-fill-mode:forwards;animation-timing-function:ease-in;animation-iteration-count:1}.vertical-line-bottom{flex-direction:column-reverse}.vertical-line.active{animation-name:extend-line;animation-duration:var(--line-animation-duration);animation-fill-mode:forwards;animation-timing-function:ease-in;animation-iteration-count:1}@keyframes extend-line{0%{height:0}to{height:var(--banner-line-height)}}.char{font-family:var(--va-font-serif);font-weight:900;font-size:var(--banner-char-size, 1rem);background-color:var(--banner-char-bg-color);line-height:1;transition:all .3s ease-in-out;transition-delay:0s}.char:hover{color:var(--banner-char-hover-color);background-color:var(--banner-char-color)}.char-left,.char-right{display:flex;color:var(--banner-char-color);opacity:0}.char-left{border-left:1px solid var(--banner-line-color);border-right:0 solid rgba(var(--va-c-primary-rgb),.1);border-right-width:0;animation-name:char-move-left;animation-duration:.4s;animation-delay:var(--line-animation-duration);animation-fill-mode:forwards;animation-timing-function:ease-out}.char-right{border-left:0 solid rgba(var(--va-c-primary-rgb),.1);border-right:1px solid var(--banner-line-color);border-left-width:0;animation-name:char-move-right;animation-duration:.4s;animation-delay:var(--line-animation-duration);animation-fill-mode:forwards;animation-timing-function:ease-out}@keyframes char-move-left{0%{opacity:0;border-right-width:0}to{opacity:1;border-right-width:var(--banner-empty-border-size, var(--banner-char-size))}}@keyframes char-move-right{0%{opacity:0;border-left-width:0}to{opacity:1;border-left-width:var(--banner-empty-border-size, var(--banner-char-size))}}:root{--banner-line-color: black;--banner-char-color: black;--banner-char-bg-color: rgba(255, 255, 255, .5);--banner-char-hover-color: white}.dark{--banner-line-color: white;--banner-char-color: white;--banner-char-bg-color: rgba(0, 0, 0, .5);--banner-char-hover-color: black}
