@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&family=Noto+Sans+KR:wght@400;500;700;900&display=swap');

@font-face {
	font-family: 'SpoqaHanSansNeo-Regular';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/* 요소(element) 여백 초기화  */
html, body,
div, span,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
blockquote, p, address, pre, cite,
form, fieldset, input, textarea, select{
	margin:0;
	padding:0;
	}


caption{display:none}

/* 목록 */
ol, ul,li { list-style:none;padding:0;margin:0 }

/* 테두리 없애기 */
fieldset, img, abbr,acronym { border:0 none; } 


/* 테이블 - 마크업에 'cellspacing="0"' 지정 함께 필요 */
table {
	border-collapse: separate;
	}

/* 텍스트 관련 요소 초기화 */
address, caption, em, cite, th {
	font-weight:normal;
	font-style:normal;
	}
ins { text-decoration:none; }
del { text-decoration:line-through; }

/* body 스타일 */
* {
	font-size:14px;
	font-family: 'SpoqaHanSansNeo-Regular', sans-serif;
	font-weight:400;
}


/* 링크 */
a, a:link {color:#4e4e4e;text-decoration:none;} 
a:visited {color:#4e4e4e;text-decoration:none;}
a:hover {color:#31456f;text-decoration:none;}
a:focus {color:#4e4e4e;text-decoration:underline;}
a:active {color:#4e4e4e;text-decoration:none;} 

/* 탑메뉴 */
.tmenu{color:#f0f0f0;font-size:14px; line-height:37px}
A.tmenu:link {color:#f0f0f0; text-decoration:none;}
A.tmenu:visited {color:#f0f0f0; text-decoration:none;}
A.tmenu:hover {color:#ffffff; text-decoration:none;}

.thm7{font-size:11px; font-family:tahoma;letter-spacing: 0px}
.dod8_{font-size:12px; font-family:돋움;letter-spacing: -1px}
.dod8{font-size:12px; font-family:돋움;letter-spacing: 0px}
.n{letter-spacing: 0px}


.input_,select{padding:10px;border:1px solid #D8D8D8;margin:1px 0;box-sizing:border-box;border-radius:5px}
textarea{box-sizing:border-box;}
.width_50{width:50px}
.width_100{width:100px}
.width_200{width:200px}
.width_300{width:300px}
.width_400{width:400px}
.width_500{width:500px}
.width_600{width:600px}
.width_1000{width:100%}


/* 검색박스 */
.search_box{border:4px solid #C1C1C1;padding:10px}
.search_box_line{border-bottom:1px solid #F0F0F0;padding:5px}
.search_box_spacing{padding-right:20px}

/* 리스트 테이블 스타일 */
.h2_title{font-size:18px;padding:12px 25px;background-color:#444655;color:#ffffff;margin-bottom:10px;display:flex;justify-content:space-between;background:rgba(68,70,85,1) url(../img/icon_point3.gif);background-repeat:no-repeat;background-Position:0% 0%;align-items:center}
.h2_title > div{font-size:18px;color:#ffffff}

.tb_list_title{padding:13px 0 13px 14px;color:#444655;font-size:17px;background:url(../img/icon_point2.png);background-repeat:no-repeat;background-Position:0% 50%;font-weight:bolder}
.tb_list_wrap{border-top:3px solid #444655;padding:10px 0 10px 0;margin-bottom:20px}

.tb_list_main {border-collapse:collapse;border-style:none;border-top:2px solid #8a8a8a}
.tb_list_main th{border:1px solid #dddddd;padding:10px;font-weight:bolder;background-color:#ebebeb}
.tb_list_main td{border:1px solid #dddddd;padding:10px;text-align:center}

/* 글쓰기 테이블 스타일 */
.tb_write_form{border-collapse:collapse;border-style:none}
.tb_write_form td{border-bottom:1px solid #dddddd;padding:10px;text-align:left}
.tb_write_form .td1{width:120px;font-weight:bolder}

/* 테이블속 테이블 스타일 */
.tb_list_main_in {margin:0;padding:0}
.tb_list_main_in td{border:0;padding:0;margin:0;}

/* 설명용 폰트타입 */
.guide_text{color:#2484b7}

/* 리스트 넘버박스 */
.list_number_box{padding:10px;text-align:center}

/* 버튼박스 */
.list_button_box{padding:20px;text-align:center}

/* 상품등록옵션 테이블 */
.optable{border-collapse:collapse;border-style:none;border:1px solid #bbbbbb}
.optable td{border:1px solid #bbbbbb}

.sp_ba{padding:0 5px;color:#8a8a8a}

/* 닫기모션 */
.close_ani:hover{
		transform:rotate(360deg);
        transition:all 0.8s;
}
.close_ani{
		transform:rotate(0deg);
        transition:all 0.8s;
}

/* 닫기모션 */
.bt_ani:hover{
		transform:translate(1px,1px);
        transition:all 0.2s;
}
.bt_ani{
		transform:translate(0px,0px);
        transition:all 0.2s;
}

/* 팝업용 타이틀스타일 */
.popup_h1{padding:15px;background-color:#272727;color:#ffffff;font-size:18px;text-align:center;}
.popup_body{padding:20px;background-color:#eeeeee}
.popup_body_wrap{background-color:#FFF;padding:30px;border:1px solid #d3d3d3;border-radius:15px}}

/*모바일전용 아닐경우 기능제한*/
.not_mobile_alert{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.4);font-weight:bolder;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:#ffffff;z-index:10000;text-align:center;}
.not_mobile_alert > div{color:#ffffff}
.not_mobile_alert > div > a{margin-top:5px}


/* 라디오버튼 스타일 */
.radiostyle input[id^="radiobt"]{display:none}
.radiostyle label{display:inline-block;padding:10px 20px;border:1px solid #dddddd;cursor:pointer;border-radius:30px}
.radiostyle input:checked + .bt{background-color:#4565B8;color:#ffffff}


/* 설명 */
div.mess{margin-top:10px;color:#838383;line-height:1.3em}
span.mess{margin-left:10px;color:#838383}
div.guid{margin-top:10px;padding:10px;background-color:#efefef;border:1px solid #dddddd;border-radius:10px}

/* 작성폼레이아웃 */
.tb_list_wrap > ul{}
.tb_list_wrap > ul > li{padding:10px;border-bottom:1px solid #dddddd;display:flex;flex-wrap:wrap;box-sizing:border-box;line-height:1.5em;min-height:50px}
.tb_list_wrap > ul > li > dl{display:flex;align-items:center;width:100%}
.tb_list_wrap > ul > li > dl > dt{width:120px;font-weight:bolder;}
.tb_list_wrap > ul > li > dl > dd{padding-right:20px;flex:1;box-sizing:border-box;}
.tb_list_wrap > ul > li > dl > dd input{vertical-align:middle}

.tb_list_wrap > ul > li > dl > dd > dl{display:flex;align-items:center;width:100%}
.tb_list_wrap > ul > li > dl > dd > dl > dt{width:100px}
.tb_list_wrap > ul > li > dl > dd > dl > dd{flex:1}

.file_wrap{display:flex;align-items:center;margin-top:10px}
.file_wrap input{margin-left:15px}


/* 좌측메뉴가 있는 레이아웃 */
.layer_wrap{display:flex;}
.layer_wrap > .left_wrap{width:160px;margin-right:25px;position:relative;}
.layer_wrap > .body_wrap{flex:1}
.layer_wrap .left_menu_wrap {position:relative;height:100%}
.layer_wrap .left_menu_wrap > div{position:sticky;position: -webkit-sticky;top:0}
.layer_wrap .left_menu_wrap > div > ul > li{margin-bottom:1px}
.layer_wrap .left_menu_wrap > div h3{background-color:#444655;color:#ffffff;padding:7px 15px;cursor:pointer}
.layer_wrap .left_menu_wrap a.bts{width:100%;border-bottom:0;box-sizing:border-box;}


/* 모바일전용 아닐경우 기능제한 & 쇼핑몰전용 기능제한*/
.not_mobile_alert2{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.4);font-weight:bolder;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:#ffffff;z-index:10000;text-align:center}
.not_mobile_alert2 > div{color:#ffffff}
.not_mobile_alert2 > div > a{margin-top:5px}



/* 로딩 스피너 */
.loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.loading-spinner {
  border: 4px solid #f3f3f3; /* 스피너 테두리 색상 */
  border-top: 4px solid #3498db; /* 스피너의 윗면 색상 */
  border-radius: 50%; /* 원형 스피너를 위해 반지름 지정 */
  width: 25px; /* 스피너의 너비 */
  height: 25px; /* 스피너의 높이 */
  animation: spin 1s linear infinite; /* 회전 애니메이션 적용 */
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* 세부설정 기본 off (불필요한 기능 노출 off) */
.detail_on{display:none}