@charset "utf-8";

/****************** Common Layout *************************************/
#wrap{width: 100%; overflow: hidden;}
.overHidden{width: 100%; height: 100%; overflow: hidden;}



/****************** Header 헤더 메뉴 *************************************/
/* 헤더 */
#header{background-color: white; height: 100px;}
#header .inner{width: 100%; height: 100%; max-width: 1420px; margin: 0 auto; padding-left: 20px; padding-right: 20px; display: flex; flex-wrap: wrap; align-items: center;}

#header .logo a{display: block;}
#header .logo .white{display: none;}

#header nav{margin-left: auto;}
#gnb{display: flex; gap: 110px;}
#gnb > li > a{display: block; line-height: 100px; font-size: 16px; font-weight: 400; color: var(--black4); transition: .25s;}
#gnb > li > a:focus,
#gnb > li > a:hover{text-decoration: underline; font-weight: 600;}
#gnb > li.on > a{color: var(--primary-blue); font-weight: 600;}


/* 메인 헤더 */
#header.main-hd{position: fixed; left: 0; top: 0; width: 100%; z-index: 500; background-color: transparent; opacity: 0.4s; transition: .25s;}
#header.main-hd .logo .white{display: block;}
#header.main-hd .logo .black{display: none;}
#header.main-hd #gnb > li > a{color: white}
/* 메인 헤더 스크롤 - down */
#header.main-hd.down{background-color: white; border-bottom: 1px solid #eee;}
#header.main-hd.down .logo .white{display: none;}
#header.main-hd.down .logo .black{display: block;}
#header.main-hd.down #gnb > li > a{color: var(--black4);}
/* 메인 헤더 스크롤 - 모바일 */
#header.main-hd .mobile_menu_btn{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24'%3E%3Cpath fill='%23ffffff' d='M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z'/%3E%3C/svg%3E");}
#header.main-hd.down .mobile_menu_btn{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24'%3E%3Cpath fill='%23000000' d='M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z'/%3E%3C/svg%3E");}

.mobile_back_btn{display: none; background-image: url("../images/ic_arrow_back.svg"); overflow: hidden; width: 40px; height: 40px; text-indent: -9999px; text-align: left; background-repeat: no-repeat; background-position: center center;}

/* 모바일 메뉴 */
#header .mobile_menu_btn{display: none; margin-left: auto;}
.mobile-menu-wrapper{display: none;}


@media screen and (max-width: 1050px) {
	
	#header{height: 60px;}
	
	#header nav{display: none;}
	
	#header .logo a{display: block; width: 110px;}
	#header .logo .white{display: none;}


	#header .mobile_menu_btn{display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24'%3E%3Cpath d='M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z'/%3E%3C/svg%3E"); overflow: hidden; width: 40px; height: 40px; text-indent: -9999px; text-align: left; background-repeat: no-repeat; background-position: center center;}
	
	
	/* 모바일 메뉴 팝업 */
	.mobile-menu-wrapper{display: block; transform: translateY(-100%); position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1000; overflow: hidden; transition: 0s .4s;}
	.mobile-menu-wrapper.show{transform: translateY(0); transition: 0s 0s;}
	.mobile-menu-wrapper.show::after{opacity: 1;}
	.mobile-menu-wrapper.show .inner{transform: translateY(0);}

	.mobile-menu-wrapper::after{content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-color: rgba(0, 0, 0, .3); opacity: 0; transition: .25s;}

	.mobile-menu-wrapper .inner{position: absolute; width: 100%; max-height: 90%; overflow: auto; left: 0; top: 0; background-color: white; z-index: 5; border-radius: 0 0 20px 20px; box-shadow: 0 10px 10px rgba(0, 0, 0, .03); padding: 20px 20px 40px; transform: translateY(-100%); transition: .4s;}

	.mobile-menu-wrapper .top_box{display: flex; align-items: center;}
	.mobile-menu-wrapper .top_box .logo{width: 110px;}
	.mobile-menu-wrapper .top_box .mobile_menu_close{margin-left: auto; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24'%3E%3Cpath d='m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z'/%3E%3C/svg%3E"); overflow: hidden; width: 40px; height: 40px; text-indent: -9999px; text-align: left; background-repeat: no-repeat; background-position: center center;}
	
	.mobile-menu-wrapper nav{margin-top: 20px;}
	.mobile_gnb{text-align: center;}
	.mobile_gnb > li{padding: 25px 0; position: relative;}
	.mobile_gnb > li::after{content: ""; position: absolute; left: 50%; bottom: 0; width: 20px; height: 1px; background-color: #ccc; transform: translate(-50%, 0);}
	.mobile_gnb > li:last-of-type:after{background-color: transparent;}
	.mobile_gnb > li > a{font-size: 16px; color: var(--black4);}
}









/****************** App *************************************/
#app_section{background-color: var(--gray-bg-app);}
#app_section .inner{width: 100%; max-width: 1200px; padding: 0 20px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 20px; align-items: center;}
#app_section .text_box{flex: 1; padding: 30px 0;}
#app_section h2{font-family: var(--font-sCoreDream); font-size: 35px; font-weight: 500; color: var(--black3); margin-bottom: 10px;}
#app_section h2 b{font-weight: 600; color: var(--primary-blue);}
#app_section h3{font-size: 15px; color: var(--black7);}
#app_section .btn_box{margin-top: 22px;}
#app_section .btn_box .btn_app{margin-right: 10px;}
#app_section .btn_app{height: 45px; background-color: white; transition: .25s; padding: 0 25px 0 60px; border-radius: 30px; font-weight: 500; color: var(--black2); font-size: 15px; letter-spacing: -0.05em; background-repeat: no-repeat; background-position: left 25px center;}
#app_section .btn_app:hover,
#app_section .btn_app:focus{background-color: #f0f0f0;}
#app_section .btn_app.google{background-image: url('../images/ic_google_store.svg');}
#app_section .btn_app.apple{background-image: url('../images/ic_apple_store.svg'); background-position: left 25px top 40%;}
#app_section .img_box{flex-shrink: 0; align-self: flex-end; margin-top: 45px;}


@media screen and (max-width:1050px) {
	#app_section .inner{gap: 0px;}
	#app_section .text_box{flex: 1 1 100%; padding: 50px 0 30px; width: 100%; text-align: center;}
	#app_section h2{font-size: 20px; margin-bottom: 8px;}
	#app_section h3{font-size: 13px;}
	#app_section .btn_box{margin-top: 15px;}
	#app_section .btn_box .btn_app{margin-right: 3px;}
	#app_section .btn_app{height: 40px; padding: 0 18px 0 38px; font-size: 12px; background-size: 15px; background-position: left 15px center;}
	#app_section .btn_app.apple{background-position: left 15px top 45%;}

	#app_section .img_box{margin-top: 0px; flex-shrink: 1; justify-self: center; width: 100%; text-align: center;}
}





/****************** Footer *************************************/
#footer{background-color: var(--black2); padding: 55px 0 100px;}
#footer .inner{width: 100%; max-width: 1440px; padding: 0 20px; margin: 0 auto;}
#footer .top_box{border-bottom: 1px solid var(--black4);}
#footer .ft_menu{margin-bottom: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px;}
#footer .ft_menu > li{display: flex; align-items: center;}
#footer .ft_menu > li::after{content: ""; display: block; width: 1px; height: 12px; background-color: var(--black4); margin: 0 20px; flex-shrink: 0;}
#footer .ft_menu > li:last-of-type:after{display: none;}
#footer .ft_menu > li > a{font-size: 14px; font-weight: 400; color: white;}
#footer .ft_menu > li > a:hover,
#footer .ft_menu > li > a:focus{text-decoration: underline;}
#footer .ft_menu > li:first-of-type > a{font-weight: 600;}

#footer .bott_box{padding-top: 20px;}
#footer .inquiry{font-size: 14px; font-weight: 400; color: white; margin-bottom: 20px;}
#footer address{font-size: 13px; color: var(--gray-text2); line-height: 1.5;}
#footer address span{display: block;}


@media screen and (max-width:1050px) {
	#footer{padding: 40px 0 80px;}
	#footer .ft_menu{margin-bottom: 15px;}
	#footer .ft_menu > li::after{height: 10px; margin: 0 10px;}
	#footer .ft_menu > li > a{font-size: 12px;}

	#footer .bott_box{padding-top: 15px;}
	#footer .inquiry{font-size: 12px; margin-bottom: 15px;}
	#footer address{font-size: 12px;}
}
















/****************** Main Layout *************************************/
#container {position:relative;}





/****************** Sub Layout *************************************/

/*** Sub Top layout ***/
.sub-top-section{width: 100%; height: 300px; position: relative; overflow: hidden;}
.sub-top-section .text_box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 20px; text-align: center;}
.sub-top-section .text_box h2{font-size: 40px; color: white; font-family: var(--font-sCoreDream); font-weight: 500; text-shadow: 0 0 5px rgba(0,0,0,.4);}
.sub-top-section .text_box h3{font-size: 18px; color: white; font-family: var(--font-sCoreDream); font-weight: 300; text-shadow: 0 0 5px rgba(0,0,0,.4); margin-top: 3px;}
.sub-top-section .img_box{position: relative; width: 100%; height: 100%;}
.sub-top-section .img_box img{width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.sub-top-section .img_box::after{content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; background: linear-gradient(180deg, rgba(0,0,0,.34) 0%, rgba(0,0,0,0) 100%);}



@media screen and (max-width: 1050px) {
	.sub-top-section{height: 150px;}
	.sub-top-section .text_box{padding: 20px 30px;}
	.sub-top-section .text_box h2{font-size: 20px;}
	.sub-top-section .text_box h3{font-size: 13px;}
	.sub-top-section .img_box{position: relative; width: 100%; height: 100%;}
}





/*** Sub Contents layout ***/
.sub-contents{padding: 80px 0 170px;}
.sub-contents > .inner{width: 100%; max-width: 1240px; padding-left: 20px; padding-right: 20px; margin: 0 auto;}
.sub-contents:has(.tab_normal_wrapper){padding-top: 60px;}


@media screen and (max-width: 1050px) {
	.sub-contents{padding: 40px 0 80px;}
	.sub-contents:has(.tab_normal_wrapper){padding-top: 30px;}
}




/*** Sub Title, content ***/
/* 타이틀 */
.sub-title{font-size: 30px; font-weight: 600; color: black; letter-spacing: -0.05em; margin-bottom: 40px;}
.sub-title:has(+ .sub-title-desc) {margin-bottom: 15px;}
.sub-title-desc {margin-bottom: 60px; font-size: 17px; font-weight: 400; color: #555;}
.sub-title-desc b{color: #111; font-weight: 600;}
.sub-title-sub{font-size: 20px; color: #333; letter-spacing: -0.05em; line-height: 1.5; margin-bottom: 30px;}
.sub-title-cate{text-align: center; margin-bottom: 10px; color: #99a8c4; font-size: 15px;}

.sub-bullet-title{margin: 60px 0 15px; position: relative; padding-left: 20px; font-size: 16px; font-weight: 700; color: #111; line-height: 1.5; min-height: 17px; background: url('../images/ic_bullet.svg') no-repeat left top 6px;}
.sub-bullet-title:first-of-type{margin-top: 0;}
.sub-bullet-title b{color: var(--primary-blue);}

.sub-bullet-title-sub{font-size: 15px; line-height: 1.6; color: #444;}

.sub-alert-text{font-size: 14px; color: var(--red-color); margin-top: 10px;}

.check-txt{font-size: 15px; color: #454545; line-height: 1.5; text-indent: -11px;}
.check-txt b{color: #222; font-weight: 600;}
.check-txt::before{content: "\e86c"; display: inline-block; font-family: var(--font-material); vertical-align: middle; margin: -2px 4px 0 0; font-size: 1.15em; color: #677ff4;}



@media screen and (max-width: 1050px) {
	.sub-title{font-size: 20px; margin-bottom: 20px;}
	.sub-title:has(+ .sub-title-desc) {margin-bottom: 10px;}
	.sub-title-desc {margin-bottom: 25px; font-size: 15px;}
	.sub-title-sub{font-size: 15px; margin-bottom: 20px;}
	.sub-title-cate{margin-bottom: 5px; font-size: 12px;}
	
	.sub-bullet-title{margin: 40px 0 12px; padding-left: 18px; font-size: 15px; min-height: 15px; background-position: left top 5px;}
	
	.sub-bullet-title-sub{font-size: 14px;}

	.sub-alert-text{font-size: 12px; margin-top: 6px;}

	.check-txt{font-size: 13px; text-indent: -10px;}
}





/*** sub Tab ***/
.tab_normal_wrapper{width: 100%; margin-bottom: 70px;}
.tab_normal{width: 100%; display: flex; flex-wrap: wrap;}
.tab_normal > li{flex: 1 0 1px;}
.tab_normal > li > a{display: block; height: 100%; padding: 14px 15px 17px; text-align: center; border-bottom: 1px solid #ddd; color: #888; font-weight: 400; font-size: 18px;}
.tab_normal > li.on > a{font-weight: 600; color: black; border-bottom: 2px solid black;}


@media screen and (max-width: 1050px) {
	/* 타이틀 */
	.tab_normal_wrapper{margin-bottom: 30px;}
	.tab_normal > li > a{padding: 10px 10px 13px; font-size: 15px;}
}






/*** TABLE ***/
.tbl_normal{width: 100%; border-collapse: collapse; table-layout: fixed; vertical-align: middle; text-align: center;}
.tbl_normal th{background-color: var(--gray-bg-table); border: 1px solid #ddd; vertical-align: middle; padding: 20px 15px 20px; font-weight: 600; color: #111; font-size: 15px;}
.tbl_normal td{border: 1px solid #ddd; vertical-align: middle; padding: 20px 15px; color: #444; font-size: 15px;}
.tbl_normal strong{color: var(--primary-blue); font-weight: 600; font-size: 1.04em;}


@media screen and (max-width: 1050px) {
	.tbl_normal th{padding: 15px 10px 15px; font-size: 13px;}
	.tbl_normal td{padding: 15px 10px; font-size: 13px;}
}












/****************** BOARD Layout (게시판) *************************************/

/*** Search box ***/
.board-search-wrap{background-color: #F7F8F9; text-align: center; padding: 25px 15px; margin-bottom: 30px;}
.board-search-wrap .select_nor.minW{min-width: 150px;}
.board-search-wrap .txt_nor.search{min-width: 220px;}
.board-search-wrap .txt_nor.wide{min-width: 400px;}
.board-search-wrap label{font-size: 16px; font-weight: 500; margin: 5px 10px;}


/*** Board Top Info ***/
.board-top-info{padding: 0 5px 20px;}
.board-top-info .count{font-size: 16px; color: #666666;}
.board-top-info .count b{font-weight: 600; color: var(--primary);}
.board-top-info .sbj{font-size: 22px; font-weight: 600;}


/*** Pagination ***/
.paging_wrap{display: flex; flex-wrap: wrap; margin: 30px 0; justify-content: center; gap: 5px;}
.paging_wrap > a{display: block; min-width: 24px; height: 24px; line-height: 23px; font-size: 15px; color: #666666; text-align: center; padding: 0 5px; border-radius: 4px; border: 1px solid transparent; transition: .25s;}
.paging_wrap > a:not(.btn, .on):hover,
.paging_wrap > a:not(.btn, .on):focus{text-decoration: underline; color: var(--primary-blue); font-weight: 500;}
.paging_wrap > a.on{border-color: var(--primary-blue); color: var(--primary-blue);}
.paging_wrap > .btn{width: 20px; transition: .25s; padding: 0;}
.paging_wrap > .btn::before{text-align: center; content: "\e315"; font-family: var(--font-material); color: #ccc; font-size: 1.2em; transition: .25s;}
.paging_wrap > .btn:hover,
.paging_wrap > .btn:focus{background-color: #fafafa;}
.paging_wrap > .btn:hover::before,
.paging_wrap > .btn:focus::before{color: var(--primary-light);}
.paging_wrap > .prevAll::before{content: "\eac3";}
.paging_wrap > .prev::before{content: "\e314";}
.paging_wrap > .next::before{content: "\e315";}
.paging_wrap > .nextAll::before{content: "\eac9";}


/*** Board List - 리스트 ***/
.table-board-list-wrap{width: 100%;}
.tbl_board{width: 100%; border-top: 1px solid #000000; text-align: center; table-layout: fixed;}

.tbl_board tr.notice{background-color: #f7f7f7;}
.tbl_board tr.notice td{color: #333; font-weight: 500;}

.tbl_board th{padding: 18px 5px; background-color: #fafbfc; border-bottom: 1px solid #ddd; font-size: 15px; font-weight: 600; color: #444; position: relative; border-right: 1px solid #fff; word-break: break-all;}
.tbl_board th:last-of-type{border-right: none;}

.tbl_board td{padding: 18px 5px; border-bottom: 1px solid #ddd; font-size: 15px; color: #666; position: relative; border-top: 1px solid transparent; word-break: break-all;}
.tbl_board td.title{text-align: left; padding-left: 20px; padding-right: 20px;}
.tbl_board td.title > a{color: #333; display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tbl_board td.title > a:hover,
.tbl_board td.title > a:focus{text-decoration: underline;}
.tbl_board td.title > a:has(.new){display: flex;}
.tbl_board td.title .text{flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; 
-webkit-line-clamp: 1; -webkit-box-orient: vertical; max-width: 100%; min-width: 0; white-space: normal;}
.tbl_board td.title .new{display: inline-block; vertical-align: middle; width: 19px; height: 19px; line-height: 19px; text-align: center; background-color: red; color: white; border-radius: 50%; font-size: 12px; font-weight: 700; margin-left: 7px; flex-shrink: 0;}





/*** Board Detail - 상세화면 ***/
.board-detail-view .top-info{padding: 27px 15px; border-bottom: 1px solid #E1E1E1; background-color: #fafbfc; border-top: 2px solid #000;}
.board-detail-view .top-info:not(:has(.title)){padding: 20px 15px;}
.board-detail-view .top-info .cate{font-size: 14px; font-weight: 500; color: var(--primary-light); margin: 0 0 8px 5px;}
.board-detail-view .top-info .title{display: block; width: 100%; font-size: 22px; font-weight: 600; color: #333; padding: 0 5px; line-height: 1.5; text-align: center; margin-bottom: 15px;}
.board-detail-view .top-info .info_dl{display: inline-flex; padding: 5px; align-items: center; vertical-align: middle; margin-right: 10px; gap: 5px 12px;}
.board-detail-view .top-info .info_dl dt{font-size: 14px; font-weight: 400; color: #333; flex-shrink: 0;}
.board-detail-view .top-info .info_dl dd{font-size: 15px; color: #111; font-weight: 600;}
.board-detail-view .top-info .infos_box{display: flex; flex-wrap: wrap; gap: 5px 10px; justify-content: space-between;}

.board-detail-view .link-box{background-color: #F6F7FB; border-bottom: 1px solid #e1e1e1; padding: 23px 30px; font-size: 15px; color: #555;}
.board-detail-view .link-box > a{font-size: 15px; color: #555; display: block; padding-left: 25px; position: relative; word-break: break-all;}
.board-detail-view .link-box > a::before{content: "\e226"; font-family: var(--font-material); position: absolute; left: 0; top: -2px; font-size: 1.25em; color: #000;}
.board-detail-view .link-box > a:hover,
.board-detail-view .link-box > a:focus{color: #222; text-decoration: underline;}

.board-detail-view .conetent-box{padding: 30px 30px 40px; border-bottom: 1px solid #E1E1E1;}
.board-detail-view .conetent-box p{font-size: 15px; line-height: 1.5; color: #444;}

.board-detail-view .attach-box{padding: 25px 30px; background-color: #F6F7FB; border-bottom: 1px solid #E1E1E1;}
.board-detail-view .attach-box .a_download{display: flex; align-items: center; font-size: 15px; color: #444; margin-top: 10px;}
.board-detail-view .attach-box .a_download:first-of-type{margin-top: 0;}
.board-detail-view .attach-box .a_download img{flex-shrink: 0; margin-right: 10px;}
.board-detail-view .attach-box .a_download:hover,
.board-detail-view .attach-box .a_download:focus{text-decoration: underline; color: #111;}

.board-detail-view .btns-box{text-align: center; padding: 25px 20px;}
.board-detail-view .btns-box .btn_list{margin: 2px}

.board-detail-view .next-list{margin-top: 30px;}
.board-detail-view .next-list > ul{border-top: 1px solid #E1E1E1;}
.board-detail-view .next-list > ul > li{border-bottom: 1px solid #E1E1E1; display: flex;}
.board-detail-view .next-list > ul > li .sbj{width: 200px; text-align: center; padding: 25px; background-color: #F6F7FB; color: #333; font-weight: 500;}
.board-detail-view .next-list > ul > li .sbj::after{content: "\e5ce"; font-family: var(--font-material); display: inline-block; vertical-align: middle; margin-left: 25px; font-size: 1.2em; color: #666666;}
.board-detail-view .next-list > ul > li .sbj.prev::after{content: "\e5ce";}
.board-detail-view .next-list > ul > li .sbj.next::after{content: "\e5cf";}
.board-detail-view .next-list > ul > li .cont{flex: 1; padding: 27px 25px 24px; min-width: 0;}
.board-detail-view .next-list > ul > li .cont a{display: block; width: 100%; word-break: break-all; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.board-detail-view .next-list > ul > li .cont a:hover,
.board-detail-view .next-list > ul > li .cont a:focus{text-decoration: underline;}



/* 댓글 - comment */
.view-detail-comment-wrapper{margin: 60px 0 85px;}
.view-detail-comment-wrapper .count{font-size: 15px; margin: 0 0 10px 10px; color: #666666;}
.reply_comment_list{border-top: 1px solid #DDDDDD;}
.reply_comment_list > li{border-bottom: 1px solid #ddd;}
.reply_comment_list > li > div:last-of-type{border-bottom: none;}

.reply_comment_list .re_comment_view_box{border-bottom: 1px solid #ddd; padding: 27px 27px 25px; display: flex; align-items: center; gap: 15px 20px;}
.reply_comment_list .re_comment_view_box .info_box{flex-grow: 1; min-width: 0;}
.reply_comment_list .re_comment_view_box .name{font-size: 20px; margin-bottom: 10px;}
.reply_comment_list .re_comment_view_box .name b{font-weight: 700; margin-right: 5px;}
.reply_comment_list .re_comment_view_box .date{font-size: 14px; font-weight: 500; color: var(--primary-light); margin-bottom: 10px;}
.reply_comment_list .re_comment_view_box .date span{font-size: 15px; margin-left: 15px; color: var(--black2-text);}
.reply_comment_list .re_comment_view_box .cont{font-size: 16px; color: #666666; line-height: 1.5;}
.reply_comment_list .re_comment_view_box .row{display: flex; flex-wrap: wrap; align-items: center; gap: 10px 15px; margin-top: 15px;}
.reply_comment_list .re_comment_view_box .a_btn{font-size: 15px; color: var(--primary-light);}
.reply_comment_list .re_comment_view_box .a_btn:hover,
.reply_comment_list .re_comment_view_box .a_btn:focus{text-decoration: underline;}

.review_btn{font-size: 14px; color: #444444; display: flex; align-items: center; transition: .25s;}
.review_btn::before{content: ""; flex-shrink: 0; margin-right: 5px; width: 17px; height: 17px; background: url('../images/common/ic_thumb_up.svg') no-repeat center center / 100%; transition: .25s;}
.review_btn.up::before{background-image: url('../images/common/ic_thumb_up.svg');}
.review_btn.up.active::before{background-image: url('../images/common/ic_thumb_up_blue.svg');}
.review_btn.down::before{background-image: url('../images/common/ic_thumb_down.svg');}
.review_btn.down.active::before{background-image: url('../images/common/ic_thumb_down_red.svg');}

.reply_comment_list .re_comment_view_box .btns{flex-shrink: 0; display: flex; flex-direction: column; gap: 3px;}
.reply_comment_list .btn_re{height: 32px; border-radius: 4px; font-size: 14px; text-align: center; background-color: white; border: 1px solid #ddd; min-width: 60px; transition: .25s;}
.reply_comment_list .btn_re:hover,
.reply_comment_list .btn_re:focus{background-color: #f0f0f0;}

.reply_comment_list .re_comment_view_box.depth2{padding-left: 65px; background: #F6F7FB url('../images/common/ic_comment_reply.svg') no-repeat left 34px top 26px;}


.reply_comment_list .re_comment_write_box{border-bottom: 1px solid #ddd; background-color: #F6F7FB; padding: 22px 22px 22px;}
.reply_comment_list .re_comment_write_box .btn_reply{padding: 5px 10px 5px; text-align: center; width: 100%; font-size: 15px; color: #666666; transition: .25s; margin-top: 13px;}
.reply_comment_list .re_comment_write_box .btn_reply:hover{background-color: #edeff6;}






@media screen and (max-width: 1050px) {

	/*** Search box ***/
	.board-search-wrap{padding: 20px 15px; margin-bottom: 20px;}
	.board-search-wrap .search-flex{display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; align-items: center;}
	.board-search-wrap .search-flex > *{margin: 0;}
	.board-search-wrap .search-flex .txt_nor.date{flex: 1 1 120px;}
	.board-search-wrap .select_nor.minW{flex: 2 1 120px; min-width: 0;}
	.board-search-wrap .mGrow{flex: 1 1 60px;}
	.board-search-wrap .btn_nor.search{flex: 1 0 60px; padding: 0 5px;}
	.board-search-wrap .txt_nor.search{min-width: 0; flex: 2 1 120px; padding: 0 12px;}
	.board-search-wrap .txt_nor.wide{min-width: 0; flex: 2 1 120px;}
	.board-search-wrap .search-flex label{font-size: 13px; margin: 5px 10px;}



	/*** Board Top Info ***/
	.board-top-info{padding: 0 5px 15px;}
	.board-top-info .count{font-size: 14px;}
	.board-top-info .sbj{font-size: 17px;}


	/*** Pagination ***/
	.paging_wrap{margin: 20px 0;}
	.paging_wrap > a{min-width: 22px; height: 22px; line-height: 20px; font-size: 13px; padding: 0 4px; border-radius: 3px;}
	.paging_wrap > .btn{width: 18px;}
	.paging_wrap > .btn::before{font-size: 1.1em;}


	/*** Board List - 리스트 ***/
	.tbl_board colgroup{display: none;}

	.tbl_board th{padding: 13px 5px; font-size: 12px;}
	.tbl_board th::after{display: none;}

	.tbl_board td{padding: 13px 5px; font-size: 12px; word-break: break-all;}
	.tbl_board td.title{padding-left: 0; padding-right: 0;}
	.tbl_board td.title > a{color: #333; display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; align-items: center;}
	.tbl_board td.title .text{height: 17px;}
	.tbl_board td.title .new{width: 15px; height: 15px; line-height: 15px; font-size: 9px; margin-left: 5px;}

	.tbl_board .num{width: 15%;}
	.tbl_board .cate{display: none;}
	.tbl_board .title{}
	.tbl_board .attach{display: none;}
	.tbl_board .date{width: 23%;}



	/*** Board Detail - 상세화면 ***/
	.board-detail-view .top-info{padding: 20px 10px;}
	.board-detail-view .top-info:not(:has(.title)){padding: 15px 10px;}
	.board-detail-view .top-info .cate{font-size: 13px;}
	.board-detail-view .top-info .title{margin-bottom: 10px; font-size: 16px; padding: 0 3px;}
	.board-detail-view .top-info .info_dl{padding: 3px; margin-right: 20px; gap: 5px 10px;}
	.board-detail-view .top-info .info_dl dt{font-size: 13px;}
	.board-detail-view .top-info .info_dl dd{font-size: 13px;}

	.board-detail-view .link-box{padding: 18px 15px; font-size: 13px;}
	.board-detail-view .link-box > a{font-size: 13px; padding-left: 20px; line-height: 1.4;}
	.board-detail-view .link-box > a::before{top: -2px; font-size: 1.15em;}

	.board-detail-view .conetent-box{padding: 20px 10px 30px;}
	.board-detail-view .conetent-box p{font-size: 14px;}

	.board-detail-view .attach-box{padding: 20px 10px;}
	.board-detail-view .attach-box .a_download{font-size: 13px; margin-top: 7px;}
	.board-detail-view .attach-box .a_download img{margin-right: 7px; width: 15px;}

	.board-detail-view .btns-box{padding: 20px 15px;}

	.board-detail-view .next-list{margin-top: 15px;}
	.board-detail-view .next-list > ul > li .sbj{width: auto; flex-shrink: 0; padding: 20px 12px 20px 20px; font-size: 13px;}
	.board-detail-view .next-list > ul > li .sbj::after{margin-left: 10px; font-size: 1em;}
	.board-detail-view .next-list > ul > li .cont{padding: 20px 10px 20px 15px;}
	.board-detail-view .next-list > ul > li .cont a{font-size: 13px;}

	/* 뉴스 리스트 */
	.board_news_title{margin: 20px 0; font-size: 20px;}
	.board_news_title + .board_news_sbj{margin-top: 10px;}
	.board_news_sbj{margin: 30px 0 8px; font-size: 16px;}
	.board_news_list > li{padding: 20px 15px;}
	.board_news_list .sbj{font-size: 16px; margin-bottom: 10px;}
	.board_news_list .info{font-size: 13px; margin-right: 20px;}
	.board_news_list .a_more{font-size: 14px; color: var(--primary-light); font-weight: 500;}
	.board_news_list .cont{font-size: 14px;}


	/* 댓글 - comment */
	.view-detail-comment-wrapper{margin: 40px 0 40px;}
	.view-detail-comment-wrapper .count{font-size: 13px;}

	.reply_comment_list .re_comment_view_box{padding: 20px 20px 20px; display: block;}
	.reply_comment_list .re_comment_view_box .name{font-size: 16px; margin-bottom: 8px;}
	.reply_comment_list .re_comment_view_box .date{font-size: 13px; margin-bottom: 8px;}
	.reply_comment_list .re_comment_view_box .date span{font-size: 14px; margin-left: 12px;}
	.reply_comment_list .re_comment_view_box .cont{font-size: 14px;}
	.reply_comment_list .re_comment_view_box .row{margin-top: 10px;}
	.reply_comment_list .re_comment_view_box .a_btn{font-size: 14px;}

	.review_btn{font-size: 13px;}

	.reply_comment_list .re_comment_view_box .btns{display: block; margin-top: 12px;}
	.reply_comment_list .btn_re{height: 30px; font-size: 13px;}

	.reply_comment_list .re_comment_view_box.depth2{padding-left: 40px; background-position: left 15px top 20px; background-size: 14px;}


	.reply_comment_list .re_comment_write_box{border-bottom: 1px solid #ddd; background-color: #F6F7FB; padding: 22px 22px 22px;}
	.reply_comment_list .re_comment_write_box .btn_reply{padding: 5px 10px 5px; text-align: center; width: 100%; font-size: 15px; color: #666666; transition: .25s; margin-top: 13px;}
	.reply_comment_list .re_comment_write_box .btn_reply:hover{background-color: #edeff6;}


}












/****************** Form Layout *************************************/
.txt_nor{height: 50px; border: 1px solid #ddd; padding: 0 20px; font-size: 16px; vertical-align: middle; margin: 2px; border-radius: 4px; color: #444;}
.txt_nor::placeholder{color: #cacaca;}
.txt_nor.date{background: white url('../images/ic_calendar.svg') no-repeat right 10px center; min-width: 0; padding-right: 42px;}

.txt_nor.sm{height: 40px;}
.txt_nor.md{height: 50px;}
.txt_nor.lg{height: 83px;}


.select_nor{height: 50px; border: 1px solid #ddd; padding-left: 20px; font-size: 16px; vertical-align: middle; margin: 2px;border-radius: 4px; color: #666666;}

.select_nor.sm{height: 40px;}
.select_nor.md{height: 50px;}
.select_nor.lg{height: 83px;}


.txtarea_nor{height: 200px; border: 1px solid #ddd; padding: 20px; font-size: 16px; vertical-align: middle; margin: 5px;}

.td_line{display: inline-block; vertical-align: middle; font-size: 15px; padding: 0 10px;}
.td_line b{color: #F79600;}

.w10{width: 10%;}
.w20{width: 20%;}
.w30{width: 30%;}
.w40{width: 40%;}
.w50{width: 50%;}
.w60{width: 60%;}
.w70{width: 70%;}
.w80{width: 80%;}
.w90{width: 90%;}
.w100{width: 100%;}

.wEmail{width: 300px;}
.wPhone{width: 150px;}




.form-box{display: flex; gap: 5px; align-items: center;}
.form-box.wrap{flex-wrap: wrap;}
.form-box .grow{flex: 1; min-width: 0;}
.form-box .z-sh{flex-shrink: 0;}
.form-box .phone_box{display: flex; align-items: center; gap: 5px;}
.form-box .phone_box :is(input, select){flex: 1; width: 80px;}
.form-box.birth{flex-wrap: nowrap;}
.form-box.birth input{min-width: 0; width: 30px; flex: 1 0 1px;}
.form-box.birth .tx{font-size: 15px;}

.certification{display: flex; height: 50px; align-items: center; padding: 10px 20px; border-radius: 5px; border: 1px solid #ddd; flex: 1;}
.certification input{flex: 1; font-size: 15px; color: #555;}
.certification input::placeholder{color: #cacaca;}
.certification .time{font-weight: 300; color: #888; font-size: 14px; letter-spacing: 0.5px;}

.f-wrapper .title{display: flex; margin-bottom: 10px;}
.f-wrapper .title .sbj{margin-bottom: 0; display: inline-block;}
.f-wrapper .sbj{font-size: 16px; font-weight: 600; color: black; margin-bottom: 10px; display: block; margin-left: 5px;}
.f-wrapper .sbj em{font-size: 14px; font-weight: 400;}
.f-wrapper .la_check{margin-left: auto; font-size: 14px; font-weight: 400; color: #555;}
.f-wrapper .la_check input{margin-right: 5px; vertical-align: middle;}
.f-wrapper .form-box{margin-bottom: 5px;}





@media screen and (max-width: 1050px) {
	.txt_nor{height: 40px; font-size: 13px;}
	.txt_nor.date{padding-right: 34px; background-size: 20px; background-position: right 8px center;}

	.txt_nor.sm{height: 38px;}
	.txt_nor.md{height: 40px;}
	.txt_nor.lg{height: 50px;}


	.select_nor{height: 40px; font-size: 13px; padding-left: 10px; padding-right: 22px; background-size: 10px;}

	.select_nor.sm{height: 38px;}
	.select_nor.md{height: 40px;}
	.select_nor.lg{height: 50px;}


	.txtarea_nor{height: 150px; font-size: 13px;}

	.td_line{font-size: 13px; padding: 0 5px;}


	.w10{width: 50%;}
	.w20{width: 50%;}
	.w30{width: 100%;}
	.w40{width: 100%;}
	.w50{width: 100%;}
	.w60{width: 100%;}
	.w70{width: 100%;}
	.w80{width: 100%;}
	.w90{width: 100%;}
	.w100{width: 100%;}

	.wEmail{width: 100%;}
	.wPhone{width: 80px;}

	.form-box{flex-wrap: wrap;}
	.form-box .phone_box{gap: 3px;}
	.form-box .phone_box select{width: auto; min-width: 60px;}
	.form-box .phone_box input{width: 50px; padding: 0 5px;}
	.form-box.birth .tx{font-size: 13px;}

	.certification{height: 40px;}
	.certification input{font-size: 13px;}
	.certification .time{font-size: 12px;}

	.f-wrapper .title{margin-bottom: 7px;}
	.f-wrapper .sbj{font-size: 14px; margin-bottom: 8px;}
	.f-wrapper .sbj em{font-size: 12px;}
	.f-wrapper .la_check{font-size: 12px;}
}




/****************** Button Layout *************************************/
.bottom_btn_box{margin-top: 60px; text-align: center;}
.bottom_btn_box.mgTBig{margin-top: 150px;}

.btn_nor{height: 55px; border: 1px solid transparent; padding: 0 30px; font-size: 16px; vertical-align: middle; margin: 2px; border-radius: 30px; font-weight: 500; background-color: #ddd; color: #555; transition: .25s; line-height: 55px; display: inline-block;}
.btn_nor.search::before{content: "\e8b6"; font-family: var(--font-material); vertical-align: middle; font-size: 1.35em; margin-right: 4px;}
.btn_nor.primary{background-color: var(--primary-blue); color: white;}
.btn_nor.primary:hover,
.btn_nor.primary:focus{background-color: #0523b7; color: white;}
.btn_nor.line{background-color: white; border-color: #ddd;}
.btn_nor.line:hover,
.btn_nor.line:focus{background-color: #f5f5f5;}
.btn_nor.blueLine{border-color: var(--primary-light); color: var(--primary-light); background-color: white;}
.btn_nor.blueLine:hover,
.btn_nor.blueLine:focus{background-color: var(--primary-light); color: white;}
.btn_nor.round{border-radius: 8px;}
.btn_nor.squre{border-radius: 0px;}

.btn_nor.sm{height: 40px;}
.btn_nor.md{height: 50px;}
.btn_nor.lg{height: 83px;}


.btn_excel{padding: 6px 20px; background-color: white; border-radius: 5px; font-size: 13px; border: 1px solid #ddd; min-width: 300px; text-align: center; margin: 0 0 5px; color: #444444; transition: .25s;}
.btn_excel::before{content: ""; width: 15px; height: 15px; display: inline-block; vertical-align: middle; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='15 15 70 70'%3E%3Cpath fill='%23222222' d='M28,20v14H18v36h10v10h52V20H28z M28,44h5.3l2.7,4l2.7-4H44l-5.3,8l5.3,8h-5.3L36,56l-2.7,4H28l5.3-8L28,44z M76,76H32v-6 h22V58h16v-4H54v-4h16v-4H54v-4h16v-4H54v-4H32V24h44V76z'/%3E%3C/svg%3E"); background-size: 100%; background-position: center center; margin: 0 5px 0;}
.btn_excel:hover{background-color: #fafafa;}


.btn_list{height: 50px; border: 1px solid #ddd; padding: 0 15px; min-width: 100px; font-size: 16px; color: #666; transition: .25s; display: inline-flex; justify-content: center; align-items: center; text-align: center;}
.btn_list.rn{border-radius: 5px;}
.btn_list.blue{border-color: transparent; background-color: var(--primary-light); color: white;}
.btn_list.blueLine{border-color: var(--primary-light); color: var(--primary-light);}
.btn_list:hover,
.btn_list:focus{border-color: var(--primary-light); color: var(--primary-light); background-color: #edf3ff;}
.btn_list.blueLine:hover,
.btn_list.blueLine:focus{background-color: var(--primary-light); color: white;}
.btn_list.blue:hover,
.btn_list.blue:focus{background-color: #1a66f4; color: white;}


.btn_squre{width: 35px; height: 35px; background-color: white; border-radius: 8px; border: 1px solid #ddd; box-shadow: 1.5px 1.5px 1px rgba(0, 0, 0, .03); overflow: hidden; text-indent: -9999px; position: relative; transition: .5s;}
.btn_squre::before{content: "\e408"; color: #666; font-family: var(--font-material); text-indent: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 1.4em;}
.btn_squre:hover,
.btn_squre:focus{background-color: #ddd; border-color: transparent;}
.btn_squre:hover::before,
.btn_squre:focus::before{color: white;}
.btn_squre.prev::before{content: "\e408";}
.btn_squre.next::before{content: "\e409";}
.btn_squre.plus::before{content: "\e145";}
.btn_squre.minus::before{content: "\e15b";}



.btn_nor2{padding: 15px 30px; background-color: var(--primary-blue); color: white; font-size: 15px; font-weight: 500; display: inline-block; border-radius: 10px; transition: .25s;}
.btn_nor2:hover{background-color: #1a66f4;}

.btn_nor2.line{background-color: white; border: 1px solid #aaa; color: #555;}
.btn_nor2.line:not(:disabled):hover{background-color: #f5f5f5;}

.btn_nor2.lineBlue{background-color: white; border: 1px solid var(--primary-blue); color: var(--primary-blue);}
.btn_nor2.lineBlue:not(:disabled):hover{background-color: #eff2ff;}

.btn_nor2.lg{padding: 18px 50px; font-size: 16px; min-width: 300px; text-align: center;}
.btn_nor2.md{padding: 16px 30px; font-size: 16px; min-width: 180px; text-align: center;}


.btn_nor2:disabled{background-color: #eee; color: #aaa; cursor: inherit; border-color: transparent;}



@media screen and (max-width: 1050px) {
	.bottom_btn_box{margin-top: 30px;}
	.bottom_btn_box.mgTBig{margin-top: 80px;}
	
	.btn_nor{ padding: 12px 20px; height: auto; line-height: 1.5; font-size: 13px;}

	.btn_excel{padding: 6px 15px; font-size: 12px; min-width: auto; text-align: center; width: 100%;}
	
	.btn_nor.sm{height: 34px;}
	.btn_nor.md{height: 40px;}
	.btn_nor.lg{height: 50px;}
	
	.btn_list{height: 40px; font-size: 13px; min-width: 90px;}
	
	.btn_squre{width: 30px; height: 30px;}
	.btn_squre::before{font-size: 1.2em;}
	
	
	.btn_nor2{padding: 13px 25px; font-size: 13px; border-radius: 5px;}
	
	.btn_nor2.lg{padding: 13px 30px; font-size: 14px; min-width: auto;}
	.btn_nor2.md{padding: 12px 30px; font-size: 13px; min-width: 90px;}
}



/************************** Check, Radio ******************/

/*** CHECK Box ***/
.check_squre{border: 1px solid red; margin-right: 5px; margin-right: -20px; width: 15px; height: 15px;}
.check_squre + label{display: inline-flex; font-size: 16px; font-weight: 400; color: #666; align-items: center; white-space: nowrap;}
.check_squre + label::before{content: "✓"; width: 20px; height: 20px; border: 1px solid #ccc; line-height: 20px; border-radius: 5px; margin-right: 10px; background-color: white; text-align: center; color: #ccc; flex-shrink: 0;}
.check_squre:checked + label{color: #111; font-weight: 500;}
.check_squre:checked + label::before{border-color: var(--primary-light); color: var(--primary-light); font-weight: 600;}

.check_squre:focus-visible {outline: 5px solid #000;}

/* 마우스, 터치로 버튼에 포커스 시 */
/*.check_squre:focus:not(:focus-visible) {outline: none; opacity: 0;}
.check_squre:not(:focus-visible) {outline: none; margin-right: 5px; opacity: 0;}*/



@media screen and (max-width: 1050px) {
	.check_squre{display: none; margin-right: 0;}
	.check_squre + label{font-size: 14px; word-break: break-all; white-space: normal;}
	.check_squre + label::before{width: 15px; height: 15px; line-height: 15px; margin-right: 8px;}
}






.gap-h-20{height: 35px;}


@media screen and (max-width: 1050px) {
	.gap-h-20{height: 20px;}
}

















