@charset "utf-8";
/*
 * File       : sub.css
 */


/* **************************************** *
 * GLOBAL
 * **************************************** */
.col2 >* {max-width:50%;}

.board-banner__wrap {position: relative;border-radius:16rem;overflow: hidden;margin-bottom: 50rem;}
.board-banner__wrap figure {overflow:hidden;position:relative;padding-top: 8.492%;}
.board-banner__wrap figure img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.board-banner__wrap p {position:absolute; top:50%; left:60rem; transform:translateY(-50%);font-size:22rem; font-weight:600; color:#fff;}

.survey-banner__wrap {position: relative;border-radius:16rem;overflow: hidden;margin-bottom: 50rem;}
.survey-banner__wrap figure {overflow:hidden;position:relative;padding-top: 8.334%;}
.survey-banner__wrap figure img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.survey-banner__wrap p {position:absolute; top:50%; left:60rem; transform:translateY(-50%);font-size:22rem; font-weight:600; color:#fff;}

.article-header { display: flex; align-items: center; padding: 0 0 15rem; margin-bottom:30rem; border-bottom: 1rem solid var(--border-color);}
.article-header b { display: inline-block; vertical-align: middle; font-size:20rem; font-weight:600;margin-right:6rem;}
.article-header__desc { font-size:14rem; color:var(--gray-text-color); margin-top:-20rem; margin-bottom:30rem;}

.btn-tooltip__wrap {position:relative; margin-left:5rem;}
.btn-tooltip {position:relative;border:none;background: none;width: 30rem;height: 30rem;padding: 5rem;text-align: center;cursor: pointer;position: absolute;top: calc(50% + 1rem);transform: translateY(-50%);}
.btn-tooltip:before {font-family:'bluewave';content:'\e93a';font-size: 10rem;font-weight:normal;font-style:normal;color:#fff;display:block;width: 18rem;height: 18rem;line-height: 18rem;background: #004EA1;border-radius: 50%;/* position:absolute; */left: 50%;top: 50%;/* transform: translate(-50%, -50%); */}
.tooltip-guide {display:none;width: max-content;position: absolute;top: calc(50% + 1rem);left: 42rem;background-color:#636363;border-radius: 6rem;color: #fff;padding: 10rem 15rem;transform:translateY(-50%);box-shadow: 0 2rem 8rem rgba(0,0,0,0.16);}
.tooltip-guide:before {content:'';display:block;border-style: solid;border-width: 4rem 10rem 4rem 0;border-color: transparent #636363 transparent transparent;position: absolute;top: 50%;left: -9rem;transform: translateY(-50%);-webkit-filter: drop-shadow(1rem 1rem 1rem rgba(0,0,0,.5));filter: drop-shadow(0 2rem 8rem rgba(0,0,0,0.16));}
.btn-tooltip__wrap.active .tooltip-guide {display:block;}

.sub-menu {overflow:hidden;}
.sub-menu .swiper-container {overflow:visible;}
.sub-menu { background:var(--body-bg);border-bottom: 1rem solid var(--border-color);}
.sub-menu__inner {overflow:hidden;}
.sub-menu .sub-menu__ul {display:flex;}
.sub-menu .sub-menu__ul > li {position:relative;width: auto;display: inline-block;vertical-align: top;font-size: 0;}
.sub-menu .sub-menu__ul > li:first-child > a {padding-left:0;}
.sub-menu .sub-menu__ul > li > a {display: block;font-size:16rem;color:var(--gray-text-color);padding: 0 18rem;position: relative;font-weight: 400;-webkit-transition: color .3s;transition: color .3s;}
.sub-menu .sub-menu__ul > li > a > span {display: block;position: relative;padding: 14rem 6rem;}
.sub-menu .sub-menu__ul > li > a > span:after {content: '';display: block;width: 100%;height: 3rem;position: absolute;bottom: 0;left: 0;background: #0084B5;opacity: 0;transition: opacity .3s;}
.sub-menu .sub-menu__ul > li.active > a {color:var(--blue-text-color);}
.sub-menu .sub-menu__ul > li.active > a > span:after {opacity:1}
.sub-menu .sub-menu__ul > li.my-active > a {color: var(--blue-text-color);}
.sub-menu .sub-menu__ul > li.my-active > a > span {background: var(--blue-bg);}
.sub-menu .sub-menu__ul > li.my-active > a > span:after {opacity:1}
.sub-menu ul > li > ul {opacity:1; visibility:hidden; text-align: center;position:absolute;top: 53rem;left: 50%;border: 1rem solid var(--border-color);background:#fff;box-shadow:0 3rem 6rem rgba(0,0,0,0.16);border-radius: 5rem;z-index: 10;transform: translateX(-50%);}
.sub-menu ul > li:first-child > ul {left:calc(50% - 10rem);}
.sub-menu ul > li > ul > li > a {display: block;font-size:14rem;color: var(--black-text-color);padding: 10rem 15rem;white-space: nowrap;}
.sub-menu .swiper-navigation {position: absolute;top: 50%;margin-top: -15rem;width: 100%;}
.sub-menu .swiper-navigation > button {position:absolute;width: 30rem;height: 30rem;line-height:30rem;background:var(--card-bg);border-color:var(--border-color);-webkit-box-shadow: 0 2rem 3rem rgba(0,0,0,.16);box-shadow: 0 2rem 3rem rgba(0,0,0,.16);}
.sub-menu .swiper-navigation > button:before {font-size:10rem;}
.sub-menu .swiper-button-prev {left: -15rem;}
.sub-menu .swiper-button-next {right: -15rem;}
.sub-menu .swiper-button-next.swiper-button-disabled, .sub-menu .swiper-button-prev.swiper-button-disabled {opacity:0; visibility:hidden;}
html.desktop .sub-menu .sub-menu__ul > li:hover > ul {opacity:1; visibility:visible; }
html.desktop .sub-menu li a:hover {color: var(--blue-text-color);}
html.desktop .sub-menu li a:hover > span:after {opacity:1}

.sub-menu-child{ border-bottom: 1rem solid var(--border-color); background:var(--body-sub-bg)}
.sub-menu-child > div > ul {display:flex;}
.sub-menu-child > div > ul > li {position:relative;padding: 8rem 0;}
.sub-menu-child > div > ul > li + li {margin-left:5rem;}
.sub-menu-child > div > ul > li:first-child > a {padding-left:0;}
.sub-menu-child > div > ul > li > a {display: block;font-size:14rem;color:var(--gray-text-color);padding: 0;position: relative;font-weight: 400;-webkit-transition: color .3s;transition: color .3s;}
.sub-menu-child > div > ul > li > a > span {display: block;position: relative;padding: 7rem 13rem;}
.sub-menu-child > div > ul > li.active > a {font-weight: 600;color: #0084B5;background:#E7F3F8;border-radius: 30rem;}
[data-theme="dark"] .sub-menu-child > div > ul > li.active > a, .dark-mode .sub-menu-child > div > ul > li.active > a {background:#323847; color:#fff;}

.board-main__container {display:flex; gap:30rem; }
.contents-left { width: calc(100% - 380rem); }
.contents-right {width:100%; max-width:350rem;}
.contents-right .component-box__head {padding-top:15rem; padding-bottom:15rem;}
.contents-right .component-box__item {padding-top:10rem; padding-bottom:10rem;}
.contents-right .component-box .meta {margin-top:2rem;}
.contents-right .btn-write  {display:block;background:#004EA1;text-align:center;color:#fff;font-size: 18rem;border-radius:6rem;padding: 16rem;margin: 0 0 30rem;}

.sub-tabs {display:flex;flex-wrap: wrap;margin: -4rem;}
.sub-tabs li {margin: 4rem;}
.sub-tabs li a {display: block;border:1rem solid var(--border-color);background:var(--btn-bg);padding:8rem 14rem;font-size:14rem;color:var(--btn-text-color);border-radius:30rem;}
.sub-tabs li.active a {border-color:#0084B5; background:#0084B5; color:#fff;}

.board-pagination + .sub-section, .sub-section + .sub-section {margin-top:30rem;}
.component-box__warp { display: flex; gap:30rem;}
.component-box__top {display:flex; align-items: center; margin-bottom:15rem;}
.component-box__top .btn-basic {margin-left:auto; }
.component-box {background:var(--card-bg); border-radius:16rem; border:1rem solid var(--border-color); width:100%;overflow:hidden;}
.component-box__item > a {position:relative;display:flex;align-items: center;flex-grow: 1;}
.component-box__item:nth-child(1) .component-box__num {color:#0070E8;}
.component-box__item:last-child {margin-bottom:-1rem;}
.component-box__item.notice {background:var(--blue-bg);}
.component-box__item.notice .component-box__info p b {padding-left:26rem; position:relative;}
.component-box__item.notice .component-box__info p b:before {font-family:'bluewave';content:'\e92f';font-size: 17rem;font-weight:normal;font-style:normal;color:#0084B5;display:block;position:absolute;left: 0;top:calc(50% + 1rem);transform:translateY(-50%);}
.component-box__item.alarm-item.check {background:var(--btn-gray-bg);}
.component-box__head {position:relative;display: flex;align-items: center;border-bottom: 1rem solid var(--border-color);padding: 18rem 25rem;}
.component-box__title {display:flex; align-items:center; font-size: 18rem;font-weight: 600;line-height: 1.26;}
.component-box__title i {margin-left:6rem; }
.component-box__title .desc {margin-left:10rem; font-size:14rem; font-weight:normal;color:var(--gray-text-color);}
.component-box__head .btn-view {margin-left:auto; font-size:15rem; color:var(--basic-text-color);}
.component-box__head .btn-view span:after {content:'\e909'; font-size:10rem; color:var(--basic-text-color);}
.component-box__head .list-type {margin-left:auto; display:flex;    align-items: center;}
.component-box__head .sorting-type {display:flex;}
.component-box__head .sorting-type li {position:relative;}
.component-box__head .sorting-type li button {border:none; background:none; padding:3rem 12rem; font-size:13rem;color:var(--gray-text-color); cursor:pointer;}
.component-box__head .sorting-type li.active button {color:#0084B5; font-weight:500;}
.component-box__head .sorting-type li + li {}
.component-box__head .sorting-type li + li:before {width:1rem; height:10rem; background: var(--border-color); content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.component-box__head .filter-type {display:flex; align-items: center; margin-left:18rem;}
.component-box__head .filter-type li + li {margin-left:-1rem;}
.component-box__head .filter-type li button {cursor:pointer;width: 32rem;height: 32rem;line-height: 30rem;padding: 0;border:1rem solid var(--border-color);background:transparent;}
.component-box__head .filter-type li button:before {font-family:'bluewave'; font-weight:normal; font-size:18rem; color:var(--gray-text-color);}
.component-box__head .filter-type li.filter-type__list button:before {content:'\e935';}
.component-box__head .filter-type li.filter-type__thumb button:before {content:'\e934';}
.component-box__head .filter-type li.active button {background:var(--blue-bg);}
.component-box__head .filter-type li.active button:before {color:var(--blue-text-color);}

.component-box__info {width: calc(100% - 68rem); display:grid; flex-grow: 1;}
.component-box__info .category {display:block; font-size:14rem; color:var(--gray-text-color); margin-bottom:5rem;}
.component-box__info .component-box__text {font-size:16rem;display: flex;align-items: center;}
.component-box__info .component-box__text p.desc {margin-right:5rem;}
.component-box__info .title {display:block;font-weight:normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.component-box__info .desc {font-size:15rem; color:var(--gray-text-color); display:block;font-weight:normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.component-box__info > a {display:grid; width: calc(100% - 20rem);}
.component-box__info p {font-size:16rem;display: flex;align-items: center;min-width: 0;}
.component-box__info p b {display:block;font-weight:normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.component-box__info p span { margin-left: 8rem; color: #0084B5;}
.component-box__info .icon-new {position:relative;width: 18rem;height:18rem;background:#0084B5;border-radius:50%;margin-left: 5rem;margin-top: 1rem;display: block; flex-shrink: 0;}
.component-box__info .icon-new:before {font-family:'bluewave';content:'\e912';font-size: 16rem;font-weight:normal;font-style:normal;color:#fff;display:block;position:absolute;left: 0.5rem;top:50%;transform:translateY(-50%);}
.component-box__info .icon-lock {position:relative;margin-left: 5rem;display: block; flex-shrink: 0;width: 18rem; height: 100%;}
.component-box__info .icon-lock:before {font-family:'bluewave';content:'\e913';font-size: 15rem;font-weight:normal;font-style:normal;color:#A0A0A0;display:block;position:absolute;left: 0.5rem;top:50%;transform:translateY(-50%);}
.component-box__info .icon-file {position:relative;margin-left: 5rem;display: block; flex-shrink: 0;width: 18rem; height: 100%;}
.component-box__info .icon-file:before {font-family:'bluewave';content:'\e937';font-size: 15rem;font-weight:normal;font-style:normal;color:#A0A0A0;display:block;position:absolute;left: 0.5rem;top:50%;transform:translateY(-50%);}
.component-box__info .icon-img {position:relative;margin-left: 5rem;display: block; flex-shrink: 0;width: 18rem; height: 100%;}
.component-box__info .icon-img:before {font-family:'bluewave';content:'\e932';font-size: 15rem;font-weight:normal;font-style:normal;color:#A0A0A0;display:block;position:absolute;left: 0.5rem;top:50%;transform:translateY(-50%);}
.component-box .meta {display:flex; margin-top:5rem; font-size:0;}
.component-box .meta > li {position:relative; display:inline-block; vertical-align:middle; font-size:0;}
.component-box .meta > li + li {margin-left:12rem;}
.component-box__info .meta > li + li {margin-left:12rem; padding-left:12rem;}
.component-box .meta > li + li:before {width:1rem; height:10rem; background:var(--border-color); content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.component-box .meta > li span, .component-box .meta > li time {font-size:14rem; color:var(--gray-text-color);vertical-align:middle;}
.component-box .meta > li span i {position:relative;padding-left:20rem; color:var(--gray-text-color); font-style:normal;display: inline-block;}
.component-box .meta > li span i:before {font-family:'bluewave';font-size: 15rem;font-weight:normal;color:#B1B1B1;display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.component-box .meta > li span.comment i:before {content:'\e900'; font-size:16rem; color:#777;}
.component-box .meta > li span.like i:before {content:'\e901';}
.component-box .meta > li span.like.active i:before {color:#FC7474;}
.component-box .meta > li span.view i:before {content:'\e936';  font-size:16rem; color:#777;}
.component-box__img {margin-left: auto}
.component-box__item figure {border-radius:6rem;overflow:hidden;position:relative;padding-top: 100%;width: 54rem;margin:-8rem 0;}
.component-box__item figure img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}

.component-box__item {position:relative;display:flex;align-items: center;padding: 14rem 25rem;border-bottom:1rem solid var(--border-color); flex-grow: 1;}
.component-box__info .btn-author {border:none; background:none; padding:0;cursor:pointer;}

.component-box .board-pagination {margin-bottom:50rem;}

.guide-text {margin-top:10rem; color:var(--gray-text-color); font-size:16rem;}

/* **************************************** *
 * NOTICE ROLLING
 * **************************************** */
.notice-rolling {height:64rem;margin-top: 30rem;background: var(--blue-bg);border: 1rem solid var(--border-blue-color);border-radius:10rem;padding:20rem 30rem;display: flex;}
.notice-rolling__wrapper { flex-direction: column;}
.notice-rolling__title {margin-right: 56rem; color:var(--black-text-color)}
.notice-rolling__slider {padding-right:30rem;text-align:left;margin: 0;flex-grow: 1;padding-left: 26rem;}
.notice-rolling__slider:before{font-family:'bluewave';content:'\e92f';font-size: 18rem;font-weight:normal;font-style:normal;color:var(--blue-text-color);display:block;position:absolute;left: 0;top:calc(50% + 1rem);transform:translateY(-50%);}
.notice-rolling__item {}
.notice-rolling__item p {font-size:16rem;display:flex;}
.notice-rolling__item p b {display:block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 16rem;color: var(--blue-text-color);}
.notice-rolling__item p span {margin-left:8rem; color:var(--blue-text-color)}

.notice-rolling .swiper-navigation {position:absolute;right: 5rem;top: 50%;transform: translateY(-50%);margin-top: -3rem;}
.notice-rolling .swiper-navigation > button {width: 8rem;height: 6rem;display: block;border: none;margin: 0;cursor: pointer;z-index: 10;padding: 6rem;}
.notice-rolling .swiper-navigation > button:before {left: 0;right: 0;transform: none;position: relative;width:auto;height:auto;}
.notice-rolling .swiper-navigation > .swiper-button-prev {top:0;}
.notice-rolling .swiper-navigation > .swiper-button-prev:before {content: '';border-style: solid;border-width: 0 4rem 6rem 4rem;border-color: transparent transparent var(--basic-text-color) transparent;}
.notice-rolling .swiper-navigation > .swiper-button-next {bottom:0;}
.notice-rolling .swiper-navigation > .swiper-button-next:before {content:'';border-style: solid;border-width: 6rem 4rem 0 4rem;border-color: var(--basic-text-color) transparent transparent transparent;}



/* **************************************** *
 * BOARD MAIN
 * **************************************** */
.page-board-main .footer-bottom {background:var(--footer-sub-bg);}


/* RANKING */
.component-box__rank .component-box__body {padding: 0 20rem;}
.component-box__rank .component-box__item {display:flex;align-items: center;padding: 14rem 0;}
.component-box__rank .component-box__item i {display: block;width: 30rem;text-align: center;font-style:normal;font-size:18rem;font-weight: 600;color:var(--gray-text-color);flex-shrink: 0;}
.component-box__rank .component-box__item .component-box__img {margin-left:0;}
.component-box__rank .component-box__item figure {width:34rem;height:34rem;border-radius:50%;overflow:hidden;margin: 0;}
.component-box__rank .component-box__item p {font-size: 14rem;font-weight: 500;margin-left: 10rem;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.component-box__rank .component-box__item .like {margin-left:auto;border:none;text-align:center;width: 70rem;flex-shrink: 0;}
.component-box__rank .component-box__item .like span {position:relative;padding-left:18rem;font-size: 14rem;}
.component-box__rank .component-box__item .like span:before {font-family: 'bluewave';content: '\e901';font-weight: normal;font-size: 14rem;color: #B1B1B1;position:absolute;left:0;top: 50%;transform:translateY(-50%);}
.component-box__rank .component-box__item .like.active span:before {color:#FC7474;}

/* ALL LIST */
.component-box__all {overflow:visible;}
.component-box__all .component-box__img { padding-right:14rem;}
.component-box__all .component-box__info { width: calc(100% - 164rem);}
.component-box__all .component-box__info p {margin-right:30rem;}
.component-box__all .component-box__info + .meta li + li:before {display:none;}

.component-box__all--type2 .component-box__info {display:flex;}
.component-box__all--type2 .component-box__info > a {display: grid; flex: 1; margin-right:15rem;}
.component-box__all--type2 .component-box__info .meta {display:flex; margin-left:auto; margin-right:15rem; font-size:0;}
.component-box__all--type2 .component-box__info .meta > li + li { margin-left: 6rem; padding-left: 8rem;}
.component-box__all--type2 .meta > li + li {margin-left:5rem; padding-left:5rem;}
.component-box__all--type2 .meta {margin-top:0;}

/* BANNER */
.board-main__contents-banner {margin-top:30rem; margin-bottom:30rem; z-index:0; border-radius: 16rem; overflow:hidden;}
.board-main__contents-banner figure {position: relative; }
.board-main__contents-banner img {position:absolute; top:0; display: block; width: 100%; max-width: 100%; height: 100%; object-fit: cover; }

.contents-left .board-main__contents-banner figure {padding-top: 13.208%;}
.contents-right .board-main__contents-banner figure {padding-top: 100%;}


/* **************************************** *
 * BOARD WRITE
 * **************************************** */
.board-write__box {background:var(--card-bg); padding:50rem; border-radius:16rem; border:1rem solid var(--border-color); width:100%; overflow:hidden;}
.board-write__head h2 {font-size:20rem; font-weight:500; padding-bottom:10rem; border-bottom:2rem solid var(--border-black-color);}
.board-write__body {margin-top:12rem;}
.board-write__body .form-input__wrap iframe {background:#fff;}
.board-title-wrap {display:flex;gap:10rem;}
.board-title-wrap .form-title {flex-grow:1;}
.board-title-wrap .form-select {width:210rem;flex-shrink: 0;}
.board-select-wrap {display:flex; margin:0 -5rem ;}
.board-select-wrap .form-select {width:calc(25% - 10rem); margin:0 5rem; flex-shrink: 0;}
.board-write .selectric-above .selectric-items {bottom: auto;}

#file-upload {visibility: hidden; position: absolute;}
.custom-file .btn-file {background:var(--btn-bg);border:1rem solid var(--border-color);border-radius:4rem;padding:10rem;font-size: 14rem;width: 135rem;cursor: pointer; color:var(--basic-text-color);}
.custom-file .btn-file span {position:relative;padding-left: 26rem;}
.custom-file .btn-file span:before {font-family: 'bluewave';content: '\e924';font-weight: normal;font-size:16rem;color:var(--basic-text-color);position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
.file-list {margin: 6rem -4rem -4rem;display:inline-block;font-size: 0;}
.file-list:empty {display:none;}
.file-list li {margin:4rem; display: inline-block;background:var(--btn-gray-bg);border-radius:4rem;padding: 5rem 10rem 5rem 15rem;}
.file-list li p {font-size:14rem;color:var(--black-text-color);display: inline-block;vertical-align: middle;}
.file-list li button {display: inline-block;vertical-align: middle;position:relative;border:none;background:none; padding:5rem; margin-left:20rem;cursor: pointer;}
.file-list li button:before {border-radius:50%;background:#A0A0A0;width:18rem;height:18rem; content:''; display:block;}
.file-list li button:after {font-family: 'bluewave';content: '\e929';font-weight: normal;font-size:12rem;color:#fff;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}

.form-field-wrap.form-tag {margin-top:50rem;}
.tag-list:empty {display:none;}
.tag-list {margin:6rem -4rem -4rem;display:inline-block;font-size: 0;}
.tag-list li {margin:4rem;display: inline-block;background:var(--btn-gray-bg);border-radius:4rem;padding: 5rem 10rem 5rem 15rem;}
.tag-list li p {font-size:14rem;color:var(--black-text-color);display: inline-block;vertical-align: middle;}
.tag-list li button {display: inline-block;vertical-align: middle;position:relative;border:none;background:none; padding:5rem; margin-left:20rem;cursor: pointer;}
.tag-list li button:before {border-radius:50%;background:#A0A0A0;width:18rem;height:18rem; content:''; display:block;}
.tag-list li button:after {font-family: 'bluewave';content: '\e929';font-weight: normal;font-size:12rem;color:#fff;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}



/* **************************************** *
 * BOARD VIEW
 * **************************************** */
.board-view__box {background:var(--card-bg); padding:40rem 50rem 50rem; border-radius:16rem; border:1rem solid var(--border-color); width:100%;}
.board-view__head {padding-bottom:15rem; border-bottom:1rem solid var(--border-color);}
.board-view__head .category {font-size:13rem; color:#0084B5;}
.board-view__head .category span {position:relative;padding-right: 16rem;}
.board-view__head .category span:after {font-family: 'bluewave';content: '\e91c';font-weight: normal;font-size: 15rem;color:#0084B5;position: absolute;right:0;top: 50%;transform: translateY(-50%);}
.board-view__head .title {font-size:24rem; font-weight:500;}
.board-view__head-info {display:flex;align-items: end;margin-top: 15rem;}
.board-view__head-info .author-wrap {display:flex;align-items: center;gap: 10rem;}
.board-view__head-info .author-img figure {position:relative;padding-top: 100%;width: 36rem;border-radius: 50%;overflow: hidden;margin: 0;}
.board-view__head-info .author-img figure img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.board-view__head-info .btn-author {display:block; cursor:pointer; font-size:14rem;border:none; background:none; padding:0;} 
.board-view__head-info .btn-author > span {vertical-align:middle;}
.board-view__head-info .author-meta {font-size:0;margin-top: 3rem;}
.board-view__head-info .author-meta > li { display:inline-block; font-size:12rem; color:var(--gray-text-color)}
.board-view__head-info .author-meta > li + li {position:relative; padding-left:10rem; margin-left:10rem;}
.board-view__head-info .author-meta > li + li:before {width:1rem; height:8rem; background:var(--border-color); content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%)}
.board-view__head-info .util-info {margin-left:auto;display: flex;}
.board-view__head-info .util-info li {position: relative;font-size:13rem;color:var(--black-text-color); padding-left:20rem;}
.board-view__head-info .util-info li + li {margin-left: 20rem;}
.board-view__head-info .util-info li:before {font-family: 'bluewave';font-weight: normal;font-size: 16rem;color:var(--black-text-color);position: absolute;left:0;top: 50%;transform: translateY(-50%);}
.board-view__head-info .util-info li.comment:before {content:'\e925'} 
.board-view__head-info .util-info li.recommend:before {content:'\e927'} 

.author-name { position:relative;}
.author-tooltip {display:none;width: 120rem;position:absolute;top: 28rem;padding:16rem;background:var(--card-bg);border:1rem solid var(--border-color);border-radius:8rem;box-shadow:0 4rem 10rem rgba(0,0,0,0.16);z-index: 10;} 
.author-name.active .author-tooltip {display:block;}
.author-tooltip li {font-size:13rem;}
.author-tooltip li + li {margin-top:10rem;}
.author-tooltip li a {color:var(--black-text-color);}

.board-view__body {padding:30rem 0 12rem;}
.board-view__contents {font-size:16rem; line-height:1.8; word-break: break-all;}
.board-view__contents p + p {margin-top:20rem;}
.board-view__contents .video-container {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;} 
.board-view__contents .video-container iframe {position:absolute;top:0;left:0;width:100%;height:100%;} 

.board-view__tag {display:flex; gap:5rem; flex-wrap: wrap;}
.board-view__tag li a {padding: 2rem 7rem; background-color:var(--btn-gray-bg);}

.board-view__contents-banner {margin-top:100rem; z-index:0;}
.board-view__contents-banner figure {position: relative; padding-top: 12.533%;}
.board-view__contents-banner img {position:absolute; top:0; display: block; width: 100%; max-width: 100%; height: 100%; object-fit: cover; }
.board-view__contents-bottom {display:flex;align-items: center;margin-top:30rem;position:relative;}
.board-view__emotion {display:flex; gap:6rem;}
.board-view__emotion li button {display:block; font-size:11rem; color:var(--black-text-color); padding:9rem 10rem; border:none; background:var(--btn-bg); border:1rem solid var(--border-color); border-radius:7rem; cursor:pointer;}
.board-view__emotion li span {position:relative; padding-left:25rem;}
.board-view__emotion li span:before {width:18rem; height:18rem; background-size:100% 100%; background-repeat:no-repeat; background-position:center; position:absolute; top:calc(50% + 1rem); left:0; transform:translateY(-50%); display:block; content:'';}
.board-view__emotion li.emotion-great span:before {background-image:url(../images/icon/icon-happy.svg);}
.board-view__emotion li.emotion-best span:before {background-image:url(../images/icon/icon-laughing.svg);}
.board-view__emotion li.emotion-sad span:before {background-image:url(../images/icon/icon-crying.svg);}
.board-view__emotion li.emotion-not-good span:before {background-image:url(../images/icon/icon-sad.svg);}
.board-view__emotion li.active button {background:#0084B5; border-color:#0084B5; color:#fff;}

.board-view__contents-bottom .contents-util__box { margin-left:auto;}
.board-view__contents-bottom .contents-util {display:flex; margin-left:auto;}
.board-view__contents-bottom .contents-util > li {position:relative;}
.board-view__contents-bottom .contents-util > li + li {margin-left:10rem; padding-left:10rem;}
.board-view__contents-bottom .contents-util > li + li:before {display:block; content:''; background:#BFBFBF; width:1rem; height:8rem; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.board-view__contents-bottom .contents-util > li > button {display:block; font-size:12rem; color:var(--black-text-color); border:none; padding:0; background:none; cursor:pointer; cursor:pointer;}
.board-view__contents-bottom .contents-util span {position:relative;}
.board-view__contents-bottom .contents-util span:before {font-family: 'bluewave';font-weight: normal;color:var(--black-text-color);position: absolute;left:0;top: 50%;transform: translateY(-50%);}
.board-view__contents-bottom .contents-util li.btn-share button span {padding-left:20rem;}
.board-view__contents-bottom .contents-util li.btn-share button span:before {font-size: 14rem; content:'\e928';}
.board-view__contents-bottom .contents-util li.btn-more button span {padding-left:18rem;}
.board-view__contents-bottom .contents-util li.btn-more button span:before {font-size: 12rem; content:'\e92c';}
html.desktop .board-view__contents-bottom .contents-util button:hover span {text-decoration:underline;}

.btn-share .share-list {display:none;}
.btn-share.active .share-list {display:block;}
.btn-share .share-list__head {display:none;}
.btn-share .share-list ul {display: flex;gap:12rem;position:absolute;left: 50%;top: -90rem;background:var(--btn-bg);padding: 15rem 20rem;border-radius: 10rem;transform: translateX(-50%);box-shadow: 0 3rem 10rem rgba(0,0,0,0.16);}
.btn-share .share-list ul:after {content:'';display:block;border-style: solid;border-width: 12rem 7rem 0 7rem;border-color: var(--btn-bg) transparent transparent transparent;position: absolute;bottom: -12rem;left: 50%;transform: translateX(-50%);-webkit-filter: drop-shadow(1rem 1rem 1rem rgba(0,0,0,.5));filter: drop-shadow(0 3rem 3rem rgba(0,0,0,0.16));}
.btn-share .share-list li {position:relative;width:34rem;height:34rem;border-radius: 50%;}
.btn-share .share-list li.share-facebook {background:#576CA7;}
.btn-share .share-list li.share-twitter {background:#6BAFF8;}
.btn-share .share-list li.share-kakao {background:#EED63D;}
.btn-share .share-list li.share-naver {background:#03C75A;}
.btn-share .share-list li.share-url {background:#0084B5;}
.btn-share .share-list li a {position:relative; display:block;width: 100%;height: 100%;}
.btn-share .share-list li a:before {font-family:'bluewave';font-style:normal;font-size: 18rem;color: #fff;position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.btn-share .share-list li.share-facebook a:before {content:'\e919';}
.btn-share .share-list li.share-twitter a:before {content:'\e91f';}
.btn-share .share-list li.share-kakao a:before {content:'\e918'; color:#5D5050}
.btn-share .share-list li.share-naver a:before {content:'\e92a'; font-size:14rem;}
.btn-share .share-list li.share-url a:before {content:'\e926'; font-size:15rem;}

.board-view .more-tooltip {display:none;width: 80rem;position:absolute;left: 50%;bottom:30rem;padding:16rem;background:var(--btn-bg);border:1rem solid var(--border-color);border-radius:8rem;box-shadow:0 4rem 10rem rgba(0,0,0,0.16);z-index: 10;transform: translateX(-50%);} 
.board-view .btn-more.active .more-tooltip {display:block;}
.board-view .more-tooltip li {font-size:13rem;}
.board-view .more-tooltip li + li {margin-top:10rem;}
.board-view .more-tooltip li a {display:block;color:var(--black-text-color);}

/*.util-button {margin-top:50rem;display:flex;gap: 14rem;justify-content: center;}
.util-button__item {position:relative;}
.util-button__item button {text-align: center;width:76rem;height:76rem;padding: 0;background: #fff;border: 1rem solid #E2E2E2;border-radius:50%;cursor: pointer;}
.util-button__item button span {position:relative;display: block;padding-top: 37rem;font-size:12rem;}
.util-button__item button span:before  {font-family: 'bluewave';font-weight: normal;color:#444;position: absolute;left: 50%;top: 8rem;transform: translateX(-50%);}
.util-button__recommend span:before {content:'\e927'; font-size:26rem;}
.util-button__share button span:before {content:'\e928'; font-size:22rem;}
.util-button__recommend.active button {border-color:#0084B5; background:#0084B5; color:#fff;}
.util-button__recommend.active button span:before {color:#fff;}*/

.comment-box {padding-top:24rem; border-top:1rem solid var(--border-color);}
.comment-title {font-size:17rem; font-weight:500; color:var(--black-text-color);}
.comment-write .form-wrap {margin-top:14rem;}
.comment-write .comment-info-wrap {display:flex; gap:10rem;}
.comment-write .comment-info-wrap .form-field-item {max-width:200rem;}
.comment-write textarea.form-input {height:147rem;}
.comment-box .btn-wrap {margin-top:10rem;align-items: center;}
.comment-box .btn-basic { margin-left: auto;}

.comment-list {margin-bottom:40rem;}
.comment-primary {display:flex; margin-top:20rem; padding-bottom:14rem; border-bottom:1rem solid var(--border-color);}
.comment-contents {width:100%; margin-left:14rem;}
.comment-author-img {flex-shrink: 0;position:relative;width: 36rem; height:36rem;border-radius: 50%;overflow: hidden;margin: 0;}
.comment-author-img img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.comment-author {display:flex; align-items: center; font-size:13rem; margin-bottom:10rem;}
.comment-author > span {color:#777; margin-left:10rem;}
.comment-author .btn-author {border:none; background:none; padding:0; font-size:13rem; font-weight:600;cursor:pointer;}
.comment-author .btn-author > span {vertical-align:middle; }
.comment-text {font-size:13rem; color:var(--black-text-color);word-break: break-all;}
.comment-bottom {display:flex; margin-top:10rem; align-items: end;}
.comment-bottom .board-view__emotion li button {background:var(--btn-gray-bg); border:none;}
.comment-bottom .board-view__emotion li.active button {background:#0084B5; border:none;}
.comment-bottom__util {display:flex;margin-left:auto; font-size:13rem; color:var(--black-text-color); }
.comment-bottom__util > li + li {position:relative; margin-left:16rem;}
.comment-bottom__util button {background:none;border:none;padding: 0; cursor:pointer;font-size:13rem; color:var(--black-text-color);}
.comment-secondary {margin-left:50rem;}
.comment-secondary__item {display:flex; padding:20rem 0; border-bottom:1rem solid var(--border-color);}
.comment-send {margin-bottom:3rem; font-size:13rem; color:#a0a0a0;}
.comment-send span {color:#2E93FF;}

.comment-reply {display:none;position:relative;margin-left: 50rem;margin-top: 10rem;border: 1rem solid var(--border-color);border-radius: 5rem;height: 122rem;padding: 40rem 19rem 30rem;}
.comment-reply.active {display:block;}
.reply-name {position:absolute;top: 15rem;left: 19rem;font-size: 12rem;font-weight: 600;}
.comment-reply textarea::-webkit-scrollbar {display: none;}
.comment-reply textarea.form-input {height: 50rem;padding: 0;font-size: 14rem;border: none;}
.comment-reply textarea.form-input::-webkit-input-placeholder {font-size: 14rem;} 
.comment-reply textarea.form-input::-moz-placeholder {font-size: 14rem;} 
.comment-reply textarea.form-input:-ms-input-placeholder {font-size: 14rem;} 
.reply-btn {display:flex;position:absolute;bottom: 14rem;right:19rem;}
.reply-btn li + li {margin-left:16rem;}
.reply-btn li + li:last-child button {color:#0084B5;}
.reply-btn button {background:none;border:none;font-size: 13rem;padding: 0; cursor:pointer;}

.report-popup {display:none; position:fixed;top: 0;left: 0;width: 100%;height: 100%; z-index:999;overflow-y: scroll;}
.report-popup .overlay {position:fixed;width:100%;height:100%;background: #000;opacity:0.6;}
.report-popup__box {position: absolute;left: 50%;top: 50%;width: 720rem;background:var(--card-bg);border:1rem solid var(--border-color);border-radius:20rem;padding:20rem 20rem 30rem;transform: translate(-50%, -50%);}
.report-popup__box > b {font-size:22rem;font-weight: 500;color:var(--black-text-color);text-align:center;display:block;}
.report-form {margin-top:20rem;}
.report-form__item {display:flex; padding:10rem 0; border-top:1rem solid var(--border-color);}
.report-form__item > b {font-size:14rem; font-weight:500; width:110rem; flex-shrink: 0;}
.report-form__item > p {font-size:14rem;}
.report-form__item .report-radio {margin:-5rem;}
.report-form__item .custom-radio {margin:5rem;font-size:14rem;}
.report-form__item .custom-radio + .custom-radio {margin-left:5rem;}
.report-text {padding-bottom:0;}
.report-text label {width:100%}
.report-text textarea.form-input {height:200rem;}
.report-text textarea::-webkit-scrollbar {display: none;}
.report-guide {margin-top:14rem; background:var(--btn-gray-bg); border-radius:5rem; padding:20rem; font-size:13rem; color:var(--gray-text-color)}
.report-popup__box .btn-confirm {margin-top: 18rem;width: 100%;max-width: 100%;}
.report-popup__box .btn-close {position:absolute; right:20rem; top:30rem; background:none; border:none; cursor:pointer;}
.report-popup__box .btn-close:before {font-family: 'bluewave';font-size:18rem; font-weight: normal;color:var(--black-text-color); content:'\e920';}

.board-view__btn {display:block; text-align:center; padding-top: 24rem; padding-bottom:24rem; border-top:1rem solid var(--border-color);}

.board-view-pagination {margin-top:60rem; border-top:1rem solid var(--border-color);}
.board-view-pagination__item { display:flex; align-items:center; padding:25rem 10rem;border-bottom:1rem solid var(--border-color); }
.board-view-pagination__item > b {font-weight:normal;color:var(--gray-text-color);width: 10%;flex-shrink: 0; font-size:14rem;}
.board-view-pagination__item > a {display: grid;margin-right: 30rem; font-size:14rem;}
.board-view-pagination__item > p {font-size:14rem;}
.board-view-pagination__item > a > p {align-items: center;min-width: 0;display: flex;flex-grow: 1; }
.board-view-pagination__item > a > p > span {font-weight: normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: block;}
.board-view-pagination__item ul.meta {display:flex;color:var(--gray-text-color);font-size:0;margin-left:auto;}
.board-view-pagination__item ul.meta > li {position:relative; font-size:14rem;}
.board-view-pagination__item ul.meta > li + li { margin-left: 6rem; padding-left: 8rem; }
.board-view-pagination__item ul.meta > li + li:before {width:1rem; height:10rem; background:var(--border-color); content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.board-view-pagination__item .btn-author {border:none; background:none; font-size: 14rem; color:var(--gray-text-color); padding:0; cursor:pointer;}
.board-view-pagination--no {color:var(--gray-text-color); }

.board-view-pagination__type2 {border-top:none; margin-top:40rem;}
.board-view-pagination__type2 .board-view-pagination__item {padding:25rem; background: var(--card-bg);border:1rem solid var(--border-color); border-radius:16rem;}
.board-view-pagination__type2 .board-view-pagination__item + .board-view-pagination__item {margin-top:15rem;}

.icon-photo {position:relative;margin-left: 5rem;display: block;flex-shrink: 0;}
.icon-photo:before {font-family:'bluewave';content:'\e930';font-size: 15rem;font-weight:normal;font-style:normal;color:#A0A0A0;display:block;position:absolute;left: 0.5rem;top:50%;transform:translateY(-50%);}


/* **************************************** *
 * BOARD SEARCH
 * **************************************** */
.board-search-result .component-box__item:last-child {border-bottom:none;}



/* **************************************** *
 * GALLERY
 * **************************************** */
.gallery-list {margin:-17rem -17rem -17rem; font-size:0;}
.gallery-item {display:inline-block; vertical-align:top;width:calc(33.33% - 34rem); margin:17rem; border-radius:10rem; overflow:hidden;}
.gallery-item figure { position: relative;padding-top: 69.315%;}
.gallery-item img {display:block; width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; display: block;}
.gallery-text {background:var(--card-bg); border:1rem solid var(--border-color); border-top:none; padding:30rem 40rem 40rem; border-radius:0 0 10rem 10rem; overflow:hidden;}
.gallery-text b {font-size:24rem;font-weight:600;line-height: 1.4;color:var(--black-text-color);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.gallery-text p {margin-top: 20rem;font-size:16rem;line-height: 1.6;color:var(--gray-text-color);display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.gallery .gallery-list {margin-top:23rem;}
.gallery .board-pagination {margin-top:60rem;}

.board-main .gallery-list { margin: -15rem;}
.board-main .gallery-item { width: calc(33.33% - 30rem); margin: 15rem;}
.board-main .gallery-text {padding: 20rem 25rem 25rem;}
.board-main .gallery-text b { font-size: 18rem;}
.board-main .gallery-text p { margin-top: 10rem;}


/* **************************************** *
 * MAGAZINE
 * **************************************** */
.magazine-list {margin-top:40rem;}
.magazine-item a {display:flex; border-radius:10rem; overflow:hidden;}
.magazine-item + .magazine-item {margin-top:40rem;}
.magazine-item figure {position: relative;padding-top: 25%;width: 100%;max-width: 320rem;flex-shrink: 0;}
.magazine-item img {display:block; width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; display: block;}
.magazine-text {background:var(--card-bg);border:1rem solid var(--border-color);border-left: none;padding: 50rem;border-radius: 0 10rem 10rem 0;overflow:hidden;}
.magazine-text b {font-size: 28rem;font-weight:600;line-height: 1.4;color:var(--black-text-color);display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.magazine-text p {margin-top: 20rem;font-size:16rem;line-height: 1.6;color:var(--gray-text-color);display: -webkit-box;-webkit-line-clamp: 6;-webkit-box-orient: vertical;overflow: hidden;}
.magazine .board-pagination {margin-top:60rem;}

.board-main .magazine-list {margin-top:0;}
.board-main .magazine-item + .magazine-item { margin-top: 30rem;}
.board-main .magazine-item figure {padding-top:29.8%;}
.board-main .magazine-text {padding: 30rem;}
.board-main .magazine-text b { font-size: 22rem;}
.board-main .magazine-text p { margin-top: 10rem;}



/* **************************************** *
 * SURVEY
 * **************************************** */
 /* .poll-list.masonry .survey-box-wrap {display:block; margin:0;}
 .poll-list.masonry .survey-box {width: 25%}
 .poll-list.masonry .survey-box {width: calc(25% - 20rem); margin:10rem; position:absolute;} 
 .poll-list.masonry .main-component-box {overflow:visible; height:100%;}
 .poll-list.masonry .main-component-box__body {display:block; height:100%;}*/

/*.poll-list.masonry .survey-box-wrap { display:block; column-count: 4; font-size: 0; gap: 30rem; margin:0;}
.poll-list.masonry .survey-box-wrap > form { width: 100%; margin:0 0 30rem 0; }
.poll-list.masonry .survey-box { height:auto;}*/


.grid-item {width: 80rem;
    height: 100%;
    float: left;
    background: #D26;
    border: 2rem solid #333;
    border-color: hsla(0, 0%, 0%, 0.5);
    border-radius: 5rem;
}


.poll-list.masonry .survey-box-wrap { display:block; column-count: 3; font-size: 0; gap: 30rem; margin:0;}
.poll-list.masonry .main-component-box { width: 100%; margin:0 0 30rem 0; }
.poll-list.masonry .survey-box { height:auto;}
.poll-list.masonry .survey-list label {word-break: break-word;}


/* **************************************** *
 * MY PAGE
 * **************************************** */
.mypage-box .component-box__body {padding:30rem 40rem 50rem;}
.mypage-user {display:flex;align-items: center;margin-bottom: 30rem;}
.mypage-user__info {display:flex;align-items: center;}
.mypage-user__info figure {border-radius:50%;overflow:hidden;position:relative;width: 78rem; height:78rem; }
.mypage-user__info figure img {display:block;width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.mypage-user__info p {font-size:20rem;font-weight: 600;margin-left: 17rem;}
.mypage-user .btn-modify {margin-left:auto;}

.maypage-modify .form-field-item {width:50%;}




/* **************************************** *
 * FAQ
 * **************************************** */
.accordion-list {margin-top:40rem;}
.accordion-item {border: 1rem solid var(--border-color);background:var(--card-bg);border-radius: 16rem;}
.accordion-item + .accordion-item {margin-top:8rem;}
.accordion-title {display:flex;padding: 23rem 70rem 23rem 30rem;position:relative;font-size: 16rem;cursor:pointer;}
.accordion-title p b {margin-right:12rem;}
.accordion-control {background:none;border:none;padding: 0;width: 26rem;height: 26rem;position: absolute;right: 25rem;top: 50%;transform: translateY(-50%);}
.accordion-control:after {display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;font-family: 'bluewave';content: '\e910';font-size: 12rem;line-height: 26rem;text-align: center;color: var(--black-text-color);-webkit-transition: -webkit-transform 300ms;transition: -webkit-transform 300ms;transition: transform 300ms;transition: transform 300ms, -webkit-transform 300ms;}
.accordion-item.accordion-item--active .accordion-control:after {-webkit-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg);}
.accordion-content {background: var(--card-bg);border-top:1rem solid var(--border-color);position: relative;overflow: hidden;padding: 24rem 30rem;display:none;border-radius: 0 0 16rem 16rem;font-size: 14rem;color: var(--black-text-color);line-height:1.6;}
.accordion-item--active .accordion-title {color: #0084B5;font-weight: 600;}