@charset "utf-8";

.hide {visibility: hidden; overflow: hidden; position: absolute; left: -9999em; top: -9999em; width: 0px; height: 0px; border: none; background: none; font-size: 0px; line-height: 0px; opacity: 0;}

/* Flex */
.flex_area {display: flex;}

.ff_rr {flex-flow: row-reverse;}

/* Text Align */
.ta_l {text-align: left !important;}
.ta_r {text-align: right !important;}
.ta_c {text-align: center !important;}

/* Justify Content */
.jc_c {justify-content: center !important;}
.jc_sb {justify-content: space-between !important;}

/* Float */
.fl_l {float: left !important;}
.fl_r {float: right !important;}

/* Font Size */
.fz11 {font-size: 11px !important;}
.fz12 {font-size: 12px !important;}
.fz13 {font-size: 13px !important;}
.fz14 {font-size: 14px !important;}
.fz15 {font-size: 15px !important;}
.fz16 {font-size: 16px !important;}
.fz17 {font-size: 17px !important;}
.fz18 {font-size: 18px !important;}
.fz19 {font-size: 19px !important;}
.fz20 {font-size: 20px !important;}

/* Padding, Margin */
.pt0   {padding-top: 0px !important;}   .pr0   {padding-right: 0px !important;}   .pb0   {padding-bottom: 0px !important;}   .pl0   {padding-left: 0px !important;}
.pt5   {padding-top: 5px !important;}   .pr5   {padding-right: 5px !important;}   .pb5   {padding-bottom: 5px !important;}   .pl5   {padding-left: 5px !important;}
.pt10  {padding-top: 10px !important;}  .pr10  {padding-right: 10px !important;}  .pb10  {padding-bottom: 10px !important;}  .pl10  {padding-left: 10px !important;}
.pt15  {padding-top: 15px !important;}  .pr15  {padding-right: 15px !important;}  .pb15  {padding-bottom: 15px !important;}  .pl15  {padding-left: 15px !important;}
.pt20  {padding-top: 20px !important;}  .pr20  {padding-right: 20px !important;}  .pb20  {padding-bottom: 20px !important;}  .pl20  {padding-left: 20px !important;}
.pt25  {padding-top: 25px !important;}  .pr25  {padding-right: 25px !important;}  .pb25  {padding-bottom: 25px !important;}  .pl25  {padding-left: 25px !important;}
.pt30  {padding-top: 30px !important;}  .pr30  {padding-right: 30px !important;}  .pb30  {padding-bottom: 30px !important;}  .pl30  {padding-left: 30px !important;}
.pt35  {padding-top: 35px !important;}  .pr35  {padding-right: 35px !important;}  .pb35  {padding-bottom: 35px !important;}  .pl35  {padding-left: 35px !important;}
.pt40  {padding-top: 40px !important;}  .pr40  {padding-right: 40px !important;}  .pb40  {padding-bottom: 40px !important;}  .pl40  {padding-left: 40px !important;}
.pt45  {padding-top: 45px !important;}  .pr45  {padding-right: 45px !important;}  .pb45  {padding-bottom: 45px !important;}  .pl45  {padding-left: 45px !important;}
.pt50  {padding-top: 50px !important;}  .pr50  {padding-right: 50px !important;}  .pb50  {padding-bottom: 50px !important;}  .pl50  {padding-left: 50px !important;}
.pt55  {padding-top: 55px !important;}  .pr55  {padding-right: 55px !important;}  .pb55  {padding-bottom: 55px !important;}  .pl55  {padding-left: 55px !important;}
.pt60  {padding-top: 60px !important;}  .pr60  {padding-right: 60px !important;}  .pb60  {padding-bottom: 60px !important;}  .pl60  {padding-left: 60px !important;}
.pt65  {padding-top: 65px !important;}  .pr65  {padding-right: 65px !important;}  .pb65  {padding-bottom: 65px !important;}  .pl65  {padding-left: 65px !important;}
.pt70  {padding-top: 70px !important;}  .pr70  {padding-right: 70px !important;}  .pb70  {padding-bottom: 70px !important;}  .pl70  {padding-left: 70px !important;}
.pt75  {padding-top: 75px !important;}  .pr75  {padding-right: 75px !important;}  .pb75  {padding-bottom: 75px !important;}  .pl75  {padding-left: 75px !important;}
.pt80  {padding-top: 80px !important;}  .pr80  {padding-right: 80px !important;}  .pb80  {padding-bottom: 80px !important;}  .pl80  {padding-left: 80px !important;}
.pt85  {padding-top: 85px !important;}  .pr85  {padding-right: 85px !important;}  .pb85  {padding-bottom: 85px !important;}  .pl85  {padding-left: 85px !important;}
.pt90  {padding-top: 90px !important;}  .pr90  {padding-right: 90px !important;}  .pb90  {padding-bottom: 90px !important;}  .pl90  {padding-left: 90px !important;}
.pt95  {padding-top: 95px !important;}  .pr95  {padding-right: 95px !important;}  .pb95  {padding-bottom: 95px !important;}  .pl95  {padding-left: 95px !important;}
.pt100 {padding-top: 100px !important;} .pr100 {padding-right: 100px !important;} .pb100 {padding-bottom: 100px !important;} .pl100 {padding-left: 100px !important;}

.mt0   {margin-top: 0px !important;}   .mr0   {margin-right: 0px !important;}   .mb0   {margin-bottom: 0px !important;}   .ml0   {margin-left: 0px !important;}
.mt5   {margin-top: 5px !important;}   .mr5   {margin-right: 5px !important;}   .mb5   {margin-bottom: 5px !important;}   .ml5   {margin-left: 5px !important;}
.mt10  {margin-top: 10px !important;}  .mr10  {margin-right: 10px !important;}  .mb10  {margin-bottom: 10px !important;}  .ml10  {margin-left: 10px !important;}
.mt15  {margin-top: 15px !important;}  .mr15  {margin-right: 15px !important;}  .mb15  {margin-bottom: 15px !important;}  .ml15  {margin-left: 15px !important;}
.mt20  {margin-top: 20px !important;}  .mr20  {margin-right: 20px !important;}  .mb20  {margin-bottom: 20px !important;}  .ml20  {margin-left: 20px !important;}
.mt25  {margin-top: 25px !important;}  .mr25  {margin-right: 25px !important;}  .mb25  {margin-bottom: 25px !important;}  .ml25  {margin-left: 25px !important;}
.mt30  {margin-top: 30px !important;}  .mr30  {margin-right: 30px !important;}  .mb30  {margin-bottom: 30px !important;}  .ml30  {margin-left: 30px !important;}
.mt35  {margin-top: 35px !important;}  .mr35  {margin-right: 35px !important;}  .mb35  {margin-bottom: 35px !important;}  .ml35  {margin-left: 35px !important;}
.mt40  {margin-top: 40px !important;}  .mr40  {margin-right: 40px !important;}  .mb40  {margin-bottom: 40px !important;}  .ml40  {margin-left: 40px !important;}
.mt45  {margin-top: 45px !important;}  .mr45  {margin-right: 45px !important;}  .mb45  {margin-bottom: 45px !important;}  .ml45  {margin-left: 45px !important;}
.mt50  {margin-top: 50px !important;}  .mr50  {margin-right: 50px !important;}  .mb50  {margin-bottom: 50px !important;}  .ml50  {margin-left: 50px !important;}
.mt55  {margin-top: 55px !important;}  .mr55  {margin-right: 55px !important;}  .mb55  {margin-bottom: 55px !important;}  .ml55  {margin-left: 55px !important;}
.mt60  {margin-top: 60px !important;}  .mr60  {margin-right: 60px !important;}  .mb60  {margin-bottom: 60px !important;}  .ml60  {margin-left: 60px !important;}
.mt65  {margin-top: 65px !important;}  .mr65  {margin-right: 65px !important;}  .mb65  {margin-bottom: 65px !important;}  .ml65  {margin-left: 65px !important;}
.mt70  {margin-top: 70px !important;}  .mr70  {margin-right: 70px !important;}  .mb70  {margin-bottom: 70px !important;}  .ml70  {margin-left: 70px !important;}
.mt75  {margin-top: 75px !important;}  .mr75  {margin-right: 75px !important;}  .mb75  {margin-bottom: 75px !important;}  .ml75  {margin-left: 75px !important;}
.mt80  {margin-top: 80px !important;}  .mr80  {margin-right: 80px !important;}  .mb80  {margin-bottom: 80px !important;}  .ml80  {margin-left: 80px !important;}
.mt85  {margin-top: 85px !important;}  .mr85  {margin-right: 85px !important;}  .mb85  {margin-bottom: 85px !important;}  .ml85  {margin-left: 85px !important;}
.mt90  {margin-top: 90px !important;}  .mr90  {margin-right: 90px !important;}  .mb90  {margin-bottom: 90px !important;}  .ml90  {margin-left: 90px !important;}
.mt95  {margin-top: 95px !important;}  .mr95  {margin-right: 95px !important;}  .mb95  {margin-bottom: 95px !important;}  .ml95  {margin-left: 95px !important;}
.mt100 {margin-top: 100px !important;} .mr100 {margin-right: 100px !important;} .mb100 {margin-bottom: 100px !important;} .ml100 {margin-left: 100px !important;}

.mt105 {margin-top: 105px !important;} .mr105 {margin-right: 105px !important;} .mb105 {margin-bottom: 105px !important;} .ml105 {margin-left: 105px !important;}
.mt110 {margin-top: 110px !important;} .mr110 {margin-right: 110px !important;}	.mb110 {margin-bottom: 110px !important;} .ml110 {margin-left: 110px !important;}
.mt115 {margin-top: 115px !important;} .mr115 {margin-right: 115px !important;}	.mb115 {margin-bottom: 115px !important;} .ml115 {margin-left: 115px !important;}
.mt120 {margin-top: 120px !important;} .mr120 {margin-right: 120px !important;}	.mb120 {margin-bottom: 120px !important;} .ml120 {margin-left: 120px !important;}
.mt125 {margin-top: 125px !important;} .mr125 {margin-right: 125px !important;}	.mb125 {margin-bottom: 125px !important;} .ml125 {margin-left: 125px !important;}
.mt130 {margin-top: 130px !important;} .mr130 {margin-right: 130px !important;}	.mb130 {margin-bottom: 130px !important;} .ml130 {margin-left: 130px !important;}
.mt135 {margin-top: 135px !important;} .mr135 {margin-right: 135px !important;}	.mb135 {margin-bottom: 135px !important;} .ml135 {margin-left: 135px !important;}
.mt140 {margin-top: 140px !important;} .mr140 {margin-right: 140px !important;}	.mb140 {margin-bottom: 140px !important;} .ml140 {margin-left: 140px !important;}
.mt145 {margin-top: 145px !important;} .mr145 {margin-right: 145px !important;}	.mb145 {margin-bottom: 145px !important;} .ml145 {margin-left: 145px !important;}
.mt150 {margin-top: 150px !important;} .mr150 {margin-right: 150px !important;}	.mb150 {margin-bottom: 150px !important;} .ml150 {margin-left: 150px !important;}
.mt155 {margin-top: 155px !important;} .mr155 {margin-right: 155px !important;}	.mb155 {margin-bottom: 155px !important;} .ml155 {margin-left: 155px !important;}
.mt160 {margin-top: 160px !important;} .mr160 {margin-right: 160px !important;}	.mb160 {margin-bottom: 160px !important;} .ml160 {margin-left: 160px !important;}
.mt165 {margin-top: 165px !important;} .mr165 {margin-right: 165px !important;}	.mb165 {margin-bottom: 165px !important;} .ml165 {margin-left: 165px !important;}
.mt170 {margin-top: 170px !important;} .mr170 {margin-right: 170px !important;}	.mb170 {margin-bottom: 170px !important;} .ml170 {margin-left: 170px !important;}
.mt175 {margin-top: 175px !important;} .mr175 {margin-right: 175px !important;}	.mb175 {margin-bottom: 175px !important;} .ml175 {margin-left: 175px !important;}
.mt180 {margin-top: 180px !important;} .mr180 {margin-right: 180px !important;}	.mb180 {margin-bottom: 180px !important;} .ml180 {margin-left: 180px !important;}
.mt185 {margin-top: 185px !important;} .mr185 {margin-right: 185px !important;}	.mb185 {margin-bottom: 185px !important;} .ml185 {margin-left: 185px !important;}
.mt190 {margin-top: 190px !important;} .mr190 {margin-right: 190px !important;}	.mb190 {margin-bottom: 190px !important;} .ml190 {margin-left: 190px !important;}
.mt195 {margin-top: 195px !important;} .mr195 {margin-right: 195px !important;}	.mb195 {margin-bottom: 195px !important;} .ml195 {margin-left: 195px !important;}
.mt200 {margin-top: 200px !important;} .mr200 {margin-right: 200px !important;}	.mb200 {margin-bottom: 200px !important;} .ml200 {margin-left: 200px !important;}

/* Motion */
._motion {opacity: 0; transform: translateY(50px); transition: opacity 700ms ease-out, transform 700ms ease-out;}
._motion._r {transform: translateX(50px);}
._motion._l {transform: translateX(-50px);}
._motion._t {transform: translateY(-50px);}
._motion._d50 {transition-delay: 50ms;}
._motion._d100 {transition-delay: 100ms;}
._motion._d150 {transition-delay: 150ms;}
._motion._d200 {transition-delay: 200ms;}
._motion._d250 {transition-delay: 250ms;}
._motion._d300 {transition-delay: 300ms;}
._motion._d350 {transition-delay: 350ms;}
._motion._d400 {transition-delay: 400ms;}

._motion._loaded {opacity: 1; transform: translate(0);}

@media screen and (max-width: 768px) {
	._motion {transition-delay: 0ms !important;}
}

/* Lazyload */
._rivets {opacity: 0;}
._rivets._loaded {opacity: 1;}

/* Button */
:root {
	--button-color1: #1a1f40; /* 확인, 저장 */
	--button-color1-hover: #1a1f40;
	--button-color2: #dc3545; /* 취소, 삭제 */
	--button-color2-hover: #bb2d3b; /* 취소, 삭제 */
	--button-disabled: #cccccc;
}

.btn_area {display: flex;}
.btn_area .btn:not(:first-child) {margin-left: 6px;}

.btn {display: inline-flex; max-width: 100%; min-width: 100px; height: 30px; border: 1px solid; border-radius: 3px; font-size: 14px; line-height: 28px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-appearance: none; cursor: pointer; text-align: center; transition: border-color 150ms, background 150ms, color 150ms; white-space: nowrap;}
.btn.c1 {border-color: var(--button-color1); background: var(--button-color1); color: #ffffff;}
.btn.c1:not(:disabled):hover {border-color: var(--button-color1-hover); background: var(--button-color1-hover);}
.btn.c2 {border-color: var(--button-color2); background: var(--button-color2); color: #ffffff;}
.btn.c2:not(:disabled):hover {border-color: var(--button-color2-hover); background: var(--button-color2-hover);}
.btn.e1 {border-color: var(--button-color1); background: #ffffff; color: var(--button-color1);}
.btn.e1:not(:disabled):hover {border-color: var(--button-color1); background: var(--button-color1); color: #ffffff;}
.btn.e2 {border-color: var(--button-color2); background: #ffffff; color: var(--button-color2);}
.btn.e2:not(:disabled):hover {border-color: var(--button-color2); background: var(--button-color2); color: #ffffff;}
.btn:disabled {border-color: var(--button-disabled); background: var(--button-disabled); color: #ffffff; cursor: default;}

.btn.l {min-width: 100px; height: 30px; padding: 0 12px; font-size: 15px; line-height: 28px; border-radius: 15px;} /* large */
.btn.m {min-width: 80px; height: 30px; padding: 0 10px; font-size: 14px; line-height: 28px;} /* medium */
.btn.s {min-width: 60px; height: 20px; padding: 0 8px; font-size: 12px; line-height: 18px;} /* small */

.txt_btn {text-decoration: underline;}
.txt_btn.gray {color: #707070;}
.txt_btn.blue {color: #26a1ff;}

/* Tab */
:root {
	--tab-color1: #0d6efd;
}

.tab_style_1 {display: flex;}
.tab_style_1 button {height: 40px; padding: 0 30px; white-space: nowrap;}
.tab_style_1 button.on {border-bottom: 2px solid var(--tab-color1); color: var(--tab-color1);}

.tab_style_2 {display: flex;}
.tab_style_2 button {height: 40px; padding: 0 30px; border: 1px solid var(--tab-color1); white-space: nowrap;}
.tab_style_2 button:not(:first-child) {margin-left: -1px;}
.tab_style_2 button.on {background: var(--tab-color1); color: #ffffff;}

/* Checkbox */
.checkbox {display: inline-block; position: relative;}
.checkbox input {position: absolute; top: 0; left: 0; z-index: 1; width: 1px; height: 1px; opacity: 0;}
.checkbox input + span {display: block; position: relative; padding-left: 40px; line-height: 40px; cursor: pointer;}
.checkbox input + span:before {display: block; content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 40px; border-radius: 50%; background: #ffffff; transition: background 300ms;}
.checkbox input:not(:disabled) + span:before,
.checkbox input:not(:disabled) + span:after {cursor: pointer;}
.checkbox input:not(:disabled):hover + span:before {background: #f1f1f1;}
.checkbox input + span:after {display: block; content: ''; position: absolute; top: 11px; left: 11px; width: 18px; height: 18px; background: url(/images/common/checkbox.png) 0 0 no-repeat;}
.checkbox input:checked + span:after {background-position-y: -23px;}
.checkbox input:disabled + span:after {background-position-y: -46px;}
.checkbox input:checked:disabled + span:after {background-position-y: -69px;}

/* Radio */
.radio {display: inline-block; position: relative;}
.radio input {position: absolute; top: 0; left: 0; z-index: 1; width: 1px; height: 1px; opacity: 0;}
.radio input + span {display: block; position: relative; padding-left: 40px; line-height: 40px; cursor: pointer;}
.radio input + span:before {display: block; content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 40px; border-radius: 50%; background: #ffffff; transition: background 300ms;}
.radio input:not(:disabled) + span:before,
.radio input:not(:disabled) + span:after {cursor: pointer;}
.radio input:not(:disabled):hover + span:before {background: #f1f1f1;}
.radio input + span:after {display: block; content: ''; position: absolute; top: 11px; left: 11px; width: 18px; height: 18px; background: url(/images/common/radio.png) 0 0 no-repeat;}
.radio input:checked + span:after {background-position-y: -23px;}
.radio input:disabled + span:after {background-position-y: -46px;}
.radio input:checked:disabled + span:after {background-position-y: -69px;}

/* Swiper */
.swiper-container {}
.swiper-button-prev {font-family: 'Material Icons'; font-size: 40px; margin-top: -20px;}
.swiper-button-next {font-family: 'Material Icons'; font-size: 40px; margin-top: -20px;}
.swiper-button-prev:after {content:'navigate_before';}
.swiper-button-next:after {content:'navigate_next';}
.swiper-pagination {font-size: 0;}

/* Loading Spinner */
.loading-spinner-outer {position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9997; display: flex; justify-content: center; align-items: center;}
.loading-spinner-inner {display: inline-block; position: relative; width: 80px; height: 80px;}
.loading-spinner-inner div {animation: loadingSpinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; transform-origin: 40px 40px;}
.loading-spinner-inner div:after {content: ''; display: block; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #000000; margin: -4px 0 0 -4px;}
.loading-spinner-inner div:nth-child(1) {animation-delay: -0.036s;}
.loading-spinner-inner div:nth-child(1):after {top: 63px; left: 63px;}
.loading-spinner-inner div:nth-child(2) {animation-delay: -0.072s;}
.loading-spinner-inner div:nth-child(2):after {top: 68px; left: 56px;}
.loading-spinner-inner div:nth-child(3) {animation-delay: -0.108s;}
.loading-spinner-inner div:nth-child(3):after {top: 71px; left: 48px;}
.loading-spinner-inner div:nth-child(4) {animation-delay: -0.144s;}
.loading-spinner-inner div:nth-child(4):after {top: 72px; left: 40px;}
.loading-spinner-inner div:nth-child(5) {animation-delay: -0.18s;}
.loading-spinner-inner div:nth-child(5):after {top: 71px; left: 32px;}
.loading-spinner-inner div:nth-child(6) {animation-delay: -0.216s;}
.loading-spinner-inner div:nth-child(6):after {top: 68px; left: 24px;}
.loading-spinner-inner div:nth-child(7) {animation-delay: -0.252s;}
.loading-spinner-inner div:nth-child(7):after {top: 63px; left: 17px;}
.loading-spinner-inner div:nth-child(8) {animation-delay: -0.288s;}
.loading-spinner-inner div:nth-child(8):after {top: 56px; left: 12px;}

@keyframes loadingSpinner {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}

.form_area {}
.form_area .form_row:not(:first-child) {margin-top: 15px;}
.form_area .form_head {}
.form_area .form_label {font-size: 16px; color: #000000;}
.form_area .form_body {margin-top: 5px;}
.form_area .form_invalid {margin-top: 5px; font-size: 12px; color: #000000;}

.form_area .form_row.invalid input:focus,
.form_area .form_row.invalid textarea:focus,
.form_area .form_row.invalid select:focus {border-color: rgba(254, 134, 183, 1); box-shadow: 0 0 0 0.25rem rgba(253, 13, 110, 0.25);}
.form_area .form_row.invalid .form_invalid {margin-top: 5px; font-size: 12px; color: #dc3545;}

/* Pagination */
:root {
	--pagination-color1: #000000;
}

.pagination {display: flex; justify-content: center; margin-top: 50px;}
.pagination .navi {display: flex;}
.pagination .navi a,
.pagination .navi button {display: block; width: 30px; height: 30px; padding: 5px; color: #707070;}
.pagination .navi a:focus,
.pagination .navi a:hover,
.pagination .navi button:focus,
.pagination .navi button:hover {color: var(--pagination-color1);}
.pagination .navi i {font-size: 20px; line-height: 1;}
.pagination .pages {display: flex; padding: 0 10px;}
.pagination .pages a,
.pagination .pages button {display: block; width: 30px; height: 30px; text-align: center; font-size: 12px; line-height: 30px; color: #707070;}
.pagination .pages a:focus,
.pagination .pages a:hover,
.pagination .pages button:focus,
.pagination .pages button:hover {color: var(--pagination-color1);}
.pagination .pages a.on,
.pagination .pages button.on {color: var(--pagination-color1); text-decoration: underline;}

.board_search {position: relative;}
.board_search input[type=search] {padding-right: 40px;}
.board_search .btn_search {position: absolute; top: 0; right: 0; width: 40px; height: 40px; border-radius: 3px; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;}
.board_search .btn_search .material-icons {font-size: 21px;}
.board_search .btn_search:hover {border-color: #86b7fe; box-shadow: inset 0 0 0 0.25rem rgba(13 110 253 / 25%);}

.board_list_01 {}
.board_list_01 ul {}
.board_list_01 ul li {border-bottom: 2px solid #f9f9f9;}
.board_list_01 ul li:first-child {border-top: 2px solid #f9f9f9;}
.board_list_01 ul li a {display: block; position: relative; padding: 10px 10px 10px 104px;}
.board_list_01 ul li a .num {position: absolute; top: 10px; left: 0; width: 104px; text-align: center; font-size: 14px; line-height: 24px; color: #000000;}
.board_list_01 ul li a .tit {font-weight: 700; font-size: 16px; line-height: 24px; color: #000000; overflow: hidden; white-space: nowrap; word-break: break-all; text-overflow: ellipsis;}
.board_list_01 ul li a .info {display: flex; flex-wrap: wrap; margin-top: 5px; font-size: 14px; color: #707070;}
.board_list_01 ul li a .info > div {white-space: nowrap;}
.board_list_01 ul li a .info > div:not(:first-child):before {display: inline-block; content: '·'; margin: 0 5px; color: #000000;}

.board_list_01 ul li a:hover {background: #f9f9f9;}

.board_empty {display: flex; justify-content: center; align-items: center; height: 100px; color: #707070;}

.board_detail {}
.board_detail .board_head {padding: 20px 10px; border-bottom: 2px solid #f9f9f9;}
.board_detail .board_head .board_tit {font-weight: 700; font-size: 20px; color: #000000;}
.board_detail .board_head .board_info {display: flex; flex-wrap: wrap; margin-top: 30px; font-size: 14px; color: #707070;}
.board_detail .board_head .board_info > div {white-space: nowrap;}
.board_detail .board_head .board_info > div:not(:first-child):before {display: inline-block; content: '·'; margin: 0 5px; color: #000000;}
.board_detail .board_body {min-height: 200px; padding: 20px 10px; border-bottom: 2px solid #f9f9f9; white-space: pre-wrap;}

.board_table_01 {}
.board_table_01 table {border-top: 2px solid #898b9c; border-bottom: 2px solid #898b9c;}
.board_table_01 table colgroup col.no {width: 100px;}
.board_table_01 table colgroup col.tit {width: auto; text-align: left;}
.board_table_01 table colgroup col.date {width: 220px;}
.board_table_01 table thead tr th {border-bottom: 2px solid #898b9c; padding: 19px 0; font-weight: 700; font-size: 15px;}
.board_table_01 table tbody tr td {padding: 14px 0; font-size: 15px; color: #30475e; cursor: pointer;}
.board_table_01 table tbody tr td.tit {padding: 0 20px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; text-align: left;}
.board_table_01 table tbody tr:not(:first-child) td {border-top: 2px solid #e1e2e6;}
.board_table_01 table tbody tr:hover td {background: #f7f7f7;}

@media screen and (max-width: 768px) {
	.board_table_01 table colgroup col.no {width: 50px;}
	.board_table_01 table colgroup col.date {width: 100px;}
	.board_table_01 table thead tr th {font-size: 14px; padding: 10px 0;}
	.board_table_01 table tbody tr td {font-size: 12px; padding: 12px 0;}
}

.board_detail_wrap {}
.board_detail_wrap .board_detail_head {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 30px; padding-bottom: 22px; border-bottom: 2px solid #e1e2e6;}
.board_detail_wrap .board_detail_head .tit {padding-right: 20px; font-weight: 700; font-size: 20px; color: #000000;}
.board_detail_wrap .board_detail_head .datetime {flex: 0 0 auto; font-size: 14px; color: #1a1f40;}
.board_detail_wrap .board_detail_body {min-height: 500px; padding-bottom: 30px; border-bottom: 2px solid #e1e2e6; font-size: 16px; line-height: 24px;}
.board_detail_wrap .board_detail_body img {max-width: 100%;}

@media screen and (max-width: 768px) {
	.board_detail_wrap .board_detail_head {display: block;}
	.board_detail_wrap .board_detail_head .datetime {margin-top: 5px;}
}