@charset "utf-8";

/* **************************************** *
 * SWIPER
 * **************************************** */
/* navigation */
.swiper_navigation {width:100%;height: 30rem;margin-top:-15rem;position:absolute;top: 50%;display: inline-block;}
.swiper_navigation > button {position:absolute;width: 48rem;height: 100%;padding:0;background: none;border: none;line-height: 1;cursor: pointer;z-index: 2;opacity:1;-webkit-transition: opacity .3s;transition: opacity .3s;text-shadow: 2rem 0 2rem rgba(0,0,0,0.17);overflow:visible;}
.swiper_navigation > button:after {font-family: 'rb-font';font-weight: normal;font-size: 20rem;line-height: 20rem;text-align: center;color: #fff;opacity:1;-webkit-transition: opacity .3s;transition: opacity .3s;text-shadow: 2rem 0 2rem rgba(0,0,0,0.17);}
.swiper_navigation > button > span {font-size:13rem;color:#fff;font-weight:600;line-height: 1;opacity:0;-webkit-transition: opacity .3s;transition: opacity .3s;display: block;position: absolute;top: 50%; letter-spacing:0.05em;}
.swiper_navigation .swiper_button_prev {left:0}
.swiper_navigation .swiper_button_next {right:0;}
.swiper_navigation .swiper_button_prev > span {left:5rem;}
.swiper_navigation .swiper_button_next > span {right:5rem;}
.swiper_button_prev {left: 50rem;}
.swiper_button_prev:after {content: '\e948';}
.swiper_button_next {right: 50rem;}
.swiper_button_next:after {content: '\e949';}


/* **************************************** *
 * A11Y
 * **************************************** */
.sr_only {position: absolute;height: 1rem;width: 1rem;overflow: hidden;clip: rect(1rem 1rem 1rem 1rem);clip: rect(1rem, 1rem, 1rem, 1rem); font-size:1rem}


/* **************************************** *
 * PAGINATION
 * **************************************** */
.pagination {display: block;width: 100%;margin-top: 20rem;font-size: 0;text-align: center;}
.pagination:empty {margin-top: 0;}
.pagination .page_numbers {display: inline-block;margin: 0 10rem;position: relative;font-size: 12rem;font-weight: 400;line-height: 24rem;text-align: center;vertical-align: top;color: #666;-webkit-transition:all 0.2s;transition: all 0.2s;}
html:not(.mobile) .pagination .page_numbers:hover {}
.pagination .page_numbers.current {font-weight: 500;}
.pagination .page_numbers.current:after {content: '';display: block;width: 100%;height: 1rem;position: absolute;background: #999;bottom: 1rem;left: 0;border: 1rem solid transparent;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;z-index:-1;}
.pagination .page_numbers.first, .pagination .page_numbers.prev, .pagination .page_numbers.next, .pagination .page_numbers.last {font-size: 0;line-height: 24rem;margin: 0;border:none;}
html:not(.mobile) .pagination .page_numbers.first:hover, html:not(.mobile) .pagination .page_numbers.prev:hover, html:not(.mobile) .pagination .page_numbers.next:hover, html:not(.mobile) .pagination .page_numbers.last:hover { background:none; border:none;}
html:not(.mobile) .pagination .page_numbers.first:hover:before, html:not(.mobile) .pagination .page_numbers.prev:hover:before, html:not(.mobile) .pagination .page_numbers.next:hover:before, html:not(.mobile) .pagination .page_numbers.last:hover:before {}
.pagination .page_numbers.first {margin-right: 15rem;}
.pagination .page_numbers.prev {margin-right: 15rem;margin-left: 5rem;}
.pagination .page_numbers.last {margin-left: 17rem;}
.pagination .page_numbers.first:before, .pagination .page_numbers.prev:before, .pagination .page_numbers.next:before, .pagination .page_numbers.last:before {position:absolute;top:0;left:0;width:100%;height:100%;font-size:22rem;font-family: 'rb-font';font-weight:normal;color:#999;-webkit-transition:all 0.2s;transition: all 0.2s;}
.pagination .page_numbers.first:before { content:'\e904';}
.pagination .page_numbers.prev:before {content: '\e903';font-size: 18rem;}
.pagination .page_numbers.next:before {content:'\e902';font-size: 18rem;}
.pagination .page_numbers.last:before { content:'\e901';}



/* **************************************** *
 * TABLE
 * **************************************** */
/* list */
.basic_table {margin-top: 20rem;width: 100%;position: relative;table-layout: fixed;}
.basic_table caption {width: 1rem;height: 1rem;position: absolute;top: 0;left: 0;font-size: 0;line-height: 0;overflow: hidden;}
.basic_table thead tr {box-shadow: 0rem 1px 2rem rgb(0 0 0 / 30%);}
.basic_table tr {width: 100%;}
.basic_table th {padding: 18rem 0;position: relative;font-size: 14rem;text-align: center;font-weight: 500;color: #252525;vertical-align: middle;border-top: 1rem solid #d3d3d3;border-bottom: 1rem solid #d3d3d3;background: #fff;}
.basic_table th:before {content: '';display: block;width: 1rem;height: 16rem;position: absolute;top: 50%;left: 0;margin-top: -8rem;background: #d3d3d3;}
.basic_table th:first-child {border-left:1rem solid #d3d3d3}
.basic_table th:first-child:before {display: none;}
.basic_table th:last-child {border-right:1rem solid #d3d3d3;}
.basic_table tr.sticky_post {background:rgba(211,211,211,0.2)}
.basic_table td {padding: 15rem 25rem;font-size: 14rem;font-weight: 400;text-align: center;color: #252525;vertical-align: middle;border-bottom: 1rem solid #d3d3d3;-webkit-transition: background 300ms;transition: background 300ms;}
.basic_table td.tit {text-align:left;}
.basic_table td.tit a {display:block;}
.basic_table td.tit a .icon_new {width:15rem;height:15rem;background:#f80013;font-size:10rem; font-weight:600; text-align:center; color:#fff;display:block;border-radius:50%;display: inline-block;vertical-align: middle;margin-left: 7rem;}
.basic_table .title_wrap {width: auto;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.basic_table .title_wrap * {vertical-align: middle;}
.basic_table .title_wrap a {font-size: 16rem; color:#666; }

/* view */
.board_view_type_01 {margin-top:30rem;}
.board_view_type_01 .board_view_header { margin-top:30rem; border-top:1rem solid #d3d3d3; border-bottom:1rem solid #929292; padding:15rem 0; font-size:0; font-weight:500; color:#252525; text-align:center;}
.board_view_type_01 .board_view_header > * {display:inline-block;padding: 0 10rem;}
.board_view_type_01 .board_view_header .category {width: 12%;font-size:14rem;}
.board_view_type_01 .board_view_header .title {width: 64%;font-size:14rem;text-align:left;}
.board_view_type_01 .board_view_header .name {width: 12%;font-size:14rem;}
.board_view_type_01 .board_view_header .date {width: 12%;font-size:14rem;}

.board_view_type_02 {margin-top:30rem;}
.board_view_type_02 .info_top {border-bottom: 1rem solid #929292;font-size:14rem;padding-bottom: 10rem;margin-bottom: 20rem;overflow: hidden;}
.board_view_type_02 .info_top .category {float:left;}
.board_view_type_02 .info_top .name {float:right;}
.board_view_type_02 .board_view_header {margin-top:30rem;border-bottom: 1rem solid #d3d3d3;padding:15rem 0;font-size:0;font-weight:500;color:#252525;overflow: hidden;}
.board_view_type_02 .board_view_header .title {margin-bottom: 30rem;font-size: 30rem;text-align:left;letter-spacing: -0.05em;}
.board_view_type_02 .board_view_header .info_left {float: left;position: relative;}
.board_view_type_02 .board_view_header .info_left li {font-size:14rem; display:inline-block;}
.board_view_type_02 .board_view_header .info_left li.origin_link {margin-left:10rem;}
.board_view_type_02 .board_view_header .info_left li.origin_link a {display:block; border:1rem solid #ddd; background:#fff; padding:1rem 6rem 2rem 6rem; }
.board_view_type_02 .board_view_header .info_left li.share {padding-left:10rem;transform: translateY(-50%);position: absolute;top: 50%;}
.board_view_type_02 .board_view_header .info_left li.share button {background:none;border:none;position:relative;padding: 0;display: block;width: 18rem;height: 20rem;}
.board_view_type_02 .board_view_header .info_left li.share button:before {content:'\e908';font-family: 'rb-font';font-size:20rem;color:#252525;}
.board_view_type_02 .board_view_header .info_right {float:right;}
.board_view_type_02 .board_view_header .info_right li {font-size:14rem;display:inline-block;padding-left: 25rem;position: relative;}
.board_view_type_02 .board_view_header .info_right li + li {margin-left: 18rem;}
.board_view_type_02 .board_view_header .info_right li:before {font-family: 'rb-font';font-size:20rem;color:#252525;position: absolute;left: 0;top: calc(50% + 1rem);transform: translateY(-50%);}
.board_view_type_02 .board_view_header .info_right li.like:before {content:'\e951'; color:#f80013;}
.board_view_type_02 .board_view_header .info_right li.comment:before {content:'\e93d';}
.board_view_type_02 .board_view_header .info_right li span {display:block;}

.board_view_body {padding:30rem 0;}
.board_view_content {padding:0 0 60rem;font-size:14rem;line-height: 1.7;letter-spacing:-0.025em;}
.board_view_body img + .board_view_content {margin-top:30rem;}
.ad_banner + .board_view_content {padding-top:30rem;}

.btn_recommend {text-align:center; font-size:0;}
.btn_recommend > button {font-size:14rem;font-weight:400;border:1rem solid #d3d3d3;background:#fff;padding: 0;padding: 4rem 15rem 5rem;}
.btn_recommend > button.active {border:2rem solid #f80013; padding:3rem 15rem 4rem;}
.btn_recommend > button.active > span {color:#f80013;}
.btn_recommend > button + button {margin-left:20rem;}

.comment_wrap {margin-top:60rem;}
.comment_write_wrap {}
.comment_write {background:#f6f6f6;border:1rem solid #d3d3d3;padding: 30rem;font-size: 0;display: flex;}
.comment_write .user_info {display:inline-block;text-align: center;width: 85rem;margin-right: 20rem;}
.comment_write .user_info .user_level_wrap {position:relative;}
.comment_write .user_info .user_level {font-size:21rem;font-weight:700;position:absolute;top:50%;left: 50%;transform: translate(-50%, -50%);display: block;}
.comment_write .user_info .user_id {font-size:15rem;font-weight:500;margin-top: 3rem;}
.comment_write .user_info .user_level_wrap:before {width:69rem; height:80rem;}
.comment_write_field_wrap {display:inline-block;vertical-align:top;width: calc(100% - 220rem); position:relative;}
.comment_write_field {border:1rem solid #d3d3d3;width:100%;height: 100rem;padding: 0;font-size: 14rem; resize:none;}
.comment_write_submit {width:100rem;height: 100rem;margin-left:15rem;background:#fff;border:1rem solid #d3d3d3;font-size:16rem;font-weight:500;}
.textarea_count {font-size:14rem;position: absolute;right: 11rem;bottom: 13rem;display: inline-block;}

.comment_list {margin-bottom:30rem;}
.comment_list_wrap {margin-top:30rem;}
.comment_list_title {font-size:14rem; font-weight:500; margin-bottom:10rem; display:block;}
.comment_list_title span { color:#f80013;}
.comment_list {border-top:1rem solid #d3d3d3;}
.comment_list_item {border-bottom:1rem solid #d3d3d3;padding: 30rem 20rem;font-size: 0;position:relative; display:none;}
.comment_list_item .user_info {display:inline-block;vertical-align: top;text-align: center;width: 85rem;margin-right: 25rem;}
.comment_list_item .user_info .user_level_wrap {position:relative;}
.comment_list_item .user_info .user_level {font-size:21rem;font-weight:700;position:absolute;top:50%;left: 50%;transform: translate(-50%, -50%);display: block;}
.comment_list_item .user_info .user_level_wrap:before {width:69rem; height:80rem;}

.user_comment_wrap {display: inline-block;vertical-align: top;width: calc(100% - 110rem);}
.user_comment_top { position: relative;}
.user_comment_author {font-size:16rem;font-weight: 500;}
.user_comment_date {font-size:14rem;margin-left: 15rem;}
.user_comment_btn_wrap {position:absolute;right: 0;top: 1rem;}
.user_comment_bottom {}
.user_comment_text {margin-top:20rem;font-size:14rem;line-height: 1.8;}
.user_comment_btn_like {border:none;background:none;padding-left: 18rem;padding-right: 0;font-size:14rem;position:relative;display: inline-block;vertical-align: middle;}
.user_comment_btn_like:before {font-family: 'rb-font';font-size:15rem;content: '\e952';color:#f80013;position:absolute;left: 0;top:50%;transform:translateY(-50%);}
.user_comment_btn_like.active:before {content:'\e951';}
.user_comment_btn_util {background:none;border:none;position:relative;padding: 10rem 10rem;margin-left: 10rem;display: inline-block;text-align: center;vertical-align: middle;}
.user_comment_btn_util:before {font-family: 'rb-font';font-size:15rem;font-weight: 500;color:#252525;position:absolute;top:50%;left: 50%;transform: translate(-50%, -50%);content:'\e905';}

.comment_util_box {display:none;position:absolute;right: 10rem;top: 30rem;background: #fff;width: 100rem;padding: 10rem 5rem;box-shadow: 1rem 3rem 7rem rgb(0 0 0 / 25%);}
.comment_util_box li a {font-size:14rem;display:block;padding: 5rem 10rem;}
.comment_util_box.active {display:block;}

.comment_list_wrap .btn_more_wrap {text-align:center; }
.comment_list_wrap .btn_more {padding: 0;background:none;border:none;text-align: center;}
.comment_list_wrap .btn_more span {position:relative;font-size: 14rem;font-weight: 500;color: #252525;}
.comment_list_wrap .btn_more span:after {padding-left:5rem; font-family: 'rb-font'; content:'\e947'; font-size:10rem;font-weight: 600;color:#252525;position:absolue;}

.board_view_pagination {padding:15rem 0;border-top:1rem solid #929292;border-bottom:1rem solid #d3d3d3;font-size:0;text-align: center;position: relative;}
.board_view_pagination > a { display:inline-block; font-size:14rem; font-weight:500;}
.board_pagination_link { position: absolute;}
.board_pagination_link:before {font-family: 'rb-font'; font-size:15rem; color:#929292; position:absolute; top:50%; transform:translateY(-50%);}
.board_pagination_prev {left: 0; padding-left: 20rem;}
.board_pagination_prev:before {content:'\e948'; left:0;}
.board_pagination_next {right: 0; padding-right: 20rem;}
.board_pagination_next:before {content:'\e949'; right:0;}
.board_pagination_list {padding-left:25rem; position:relative;}
.board_pagination_list:before {content:'\e954';font-family: 'rb-font'; font-size:18rem; color:#929292; position:absolute; top:50%; left:0; transform:translateY(-50%); }



/* **************************************** *
 * SWIPER
 * **************************************** */
 .swiper-container-horizontal>.swiper-pagination-bullets, 
 .swiper-pagination-custom, .swiper-pagination-fraction {margin-top:30rem;}
 .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin:0 5rem;}
 .swiper-pagination {display: inline-block;position: relative;}
 .swiper-pagination-bullet {display: inline-block;width: 10rem;height: 10rem;position: relative;cursor: pointer;background: transparent;opacity: 1;vertical-align: middle;}
 .swiper-pagination-bullet:after {content: '';display: block;width: 10rem;height: 10rem;position: absolute;left: 50%;top: 50%;background: #d3d3d3;border-radius: 50%;-webkit-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transition: opacity 0.4s;transition: opacity 0.4s;}
 .swiper-pagination-bullet-active:after {opacity: 1;background: #f80013;}
