@charset "utf-8"; 

/*  공통스타일   ==================================================================================== */
.newicon				{position:relative;display:inline-block;top:3px; width:18px; height:18px;  background:url('../img/guava/icon_new.png') no-repeat right 52%;}  /* 새 게시물 표시*/
.notibox					{position:relative; border:1px solid #dbdee1; border-bottom:5px solid #eee; padding:35px 40px; text-align:justify; margin-bottom:40px; line-height:1.6;}
.notibox:after			{position:absolute; top:-1px; left:-0; width:35px; height:7px; background:#4d75c3; content:'';}
.notibox:before		{position:absolute; top:0; left:-1px; width:7px;  height:30px;  background:#4d75c3; content:'';}
.notibox1				{border:1px solid #ebebeb; background:#f8f8f8; padding:25px; margin-bottom:20px; line-height:1.4;}
.notibox2				{background:#f8f8fb; padding:25px; margin-bottom:20px; line-height:1.4;}
.notibox3				{border:10px solid #f7f7f7; padding:25px; margin-bottom:20px;}

.txtline				{display:inline-block; box-shadow: inset 0 -10px 0 #ddecff; font-weight:500; padding:0 3px; color:#111;}
.txtline1				{display:inline-block; box-shadow: inset 0 -10px 0 #fbe3cd; font-weight:500; padding:0 3px; color:#111;}
.txtline2				{display:inline-block; box-shadow: inset 0 -10px 0 #d7edd7; font-weight:500; padding:0 3px; color:#111;}
.txtline3				{display:inline-block; box-shadow: inset 0 -10px 0 #ecdff0; font-weight:500; padding:0 3px; color:#111;}
.txtline4				{display:inline-block; box-shadow: inset 0 -10px 0 #a1f9fe; font-weight:500; padding:0 3px; color:#002759;}

.sub_list01				{position:relative; list-style:none; padding:3px 0 3px 12px;}
.sub_list01:after		{position:absolute; content:''; display:block; left:0; top:14px; width:3px; height:3px; background:#425ad4;}
.sub_list02				{position:relative; list-style:none; padding:2px 0 2px 12px;}
.sub_list02:after		{position:absolute; content:''; display:block; left:0; top:16px; width:5px; height:1px; background:#222;}

.nolist					{text-align:center; border-bottom:1px solid #ddd; padding:100px 0; color:#999;}

.ab_copy				{position:relative; display: inline-block; cursor: pointer; text-align:center; white-space:nowrap; vertical-align:middle; touch-action:manipulation; user-select:none; border-radius:2px; padding: 0 10px;   line-height:28px;  border:1px solid #ccc; background:#fff;color:#464c51; font-size:0.95em; } 
.ab_copy:hover			{border-color:#000; background:#444; color:#fff;}
.ab_copied				{border-color:#278adf !important; background:#278adf !important; color:#fff;}

.input_form[disabled],
.textarea_form[disabled] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

#ui-datepicker-div		{z-index:1000 !important;}

.list_btn_wrap			{padding-top:40px ; display: grid; grid-template-columns:1fr; gap:20px;  }			/* 1:1문의 등 리스트 버튼 스타일 */


.gsorting				{position:relative;line-height:1.5 !important;}
.gsorting span			{display:inline-block; padding-right:20px; line-height:1; cursor:pointer; position:relative;}
.gsorting::before,
.gsorting::after		{position:absolute; display:block; top:0px; opacity:.3;font-weight: 900; font-family:"Font Awesome 6 Free";}
.gsorting::before		{right:0.6em;content:"\f30c"; }
.gsorting::after		{right:0;content:"\f309"; }
.gsorting_asc::before,
.gsorting_desc::after	{opacity:1;}


.gtable thead th a		{color:#ffde00 !important;}


/*  최고관리자 표시  ==============*/
.icon_user					{position:relative;top:3px;margin-left:5px;padding-right:2px; display:inline-block;  overflow:hidden; font-weight:600;font-size:0.7em; border-width:1px;border-style:solid; width:17px; height:17px; line-height:16px; border-radius:50%;    }  
.icon_user.main			{ color:#fb586b; border-color:#fb586b;}
.icon_user.sub			{ color:#4871f8; border-color:#4871f8; }
/*  최고관리자 표시  ==============*/
 

 
/*  새창 스타일 (담당자 정보, 컨텐츠 수정 등)  ==================================================================================== */
.newwin_wrap					{position:relative;}
.newwin_top						{position:relative;padding:18px  20px;background:#1c2940;  }  
.newwin_top .tit				{position:relative; color:#bfcadf; font-size:1.4em;font-weight:400;letter-spacing:-1px; }
.newwin_wrap .inner		{padding:20px;}
.newwin_subtit					{position:relative;font-size:1.3em;line-height:1.3;font-weight:600; padding:0 0 15px 3px; color:#111; letter-spacing:-1px; } 
.newwin_top .newwin_close			{position:absolute; right:10px;top:5px;width:50px;height:50px;  }
.newwin_top .newwin_close span			{display:inline-block;width:50px;height:50px; cursor:pointer; transform: rotate(45deg); -webkit-transform: rotate(45deg); }
.newwin_top .newwin_close span:before			{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:35px; height:1px; background:#bfcadf;}
.newwin_top .newwin_close span:after				{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%);height:35px; width:1px;  background:#bfcadf;}





/*  파일 프로그레스 첨부  ==================================================================================== */
.file_box	.up_file_progress			{display:none;}
.file_box	.file_progress				{position:absolute;float:left;width: 0px; height: 40px; border-radius:6px; overflow: hidden; background: #000;}
 

 

/*  게시글 리스트  ==================================================================================== */
.gtable tbody td .icon_notice							{display:inline-block;width:30px;height:30px; border-radius:50%;vertical-align:middle;background:url('../img/guava/icon_notice.png') no-repeat center 50% #a3a6b2;background-size:100% auto;margin-right:5px;}




/*  게시글 뷰  ==================================================================================== */
#bwriteview_box											{margin:0 auto;}
#bwriteview_box .tit_wrap								{padding:15px; border-top:1px solid #fff; border-bottom:1px solid #dfdfdf;} 
#bwriteview_box .tit_wrap .tit							{font-size:1.4em; letter-spacing:-1px; line-height:140%; COLOR:#333; font-weight:700;padding:0 0 10px 0;} 
#bwriteview_box .tit_wrap .tit span						{display:inline-block; padding:0px 10px; height:31px; line-height:31px; color:#ff6600; border:1px solid #ff6600; margin-right:5px; font-size:0.8em; background-color:#fff; }
#bwriteview_box .tit_wrap .tit .info					{display:inline-block; padding:2px 8px; line-height:18px; color:#444; border:1px solid #ddd; margin-left:20px; font-size:0.7em; border-radius:5px; }
#bwriteview_box .tit_wrap .tit .info i					{margin-right:5px;}
#bwriteview_box .tit_wrap .name							{color:#999;  font-size:1em; }
#bwriteview_box .tit_wrap .name span					{position:relative; padding-right:23px;}
#bwriteview_box .tit_wrap .name span:after				{content:''; position:absolute; top:0; right:12px; bottom:0; width:1px; height:1em; margin:auto; background:#ddd;}
#bwriteview_box .tit_wrap .name span:last-child			{padding:0;}
#bwriteview_box .tit_wrap .name span:last-child:after	{display:none;}

#bwriteview_box .content_wrap			{overflow:hidden;padding:30px 20px; word-break:break-all; min-height:300px; }
#bwriteview_box .content_wrap img		{max-width:100%; }

#bwriteview_box .video_wrap						{text-align:center;margin-bottom:40px;}
#bwriteview_box .video_wrap .youtube_iframes		{width:720px; height:480px; }

#bwriteview_box .file_wrap 				{padding:10px; border-top:1px solid #ddd; overflow:hidden; }
#bwriteview_box .file_wrap li			{font-size:0.95em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:90%; }
#bwriteview_box .file_wrap .tit			{float:left; width:140px; }
#bwriteview_box .file_wrap .tit span	{display:inline-block; margin-left:10px; width:120px; font-size:1em; font-weight:bold; text-align:center; line-height:40px; border:1px solid #ccc; }
#bwriteview_box .file_wrap .txt			{float:right; width:calc(100% - 140px); line-height:180%; }

#bwriteview_box .btn_wrap				{padding:10px 0; overflow:hidden; }

#bwriteview_box .pn_wrap					{position:relative; border-top:1px solid #ddd; }
#bwriteview_box .pn_wrap li				{position:relative;overflow:hidden; padding:12px 0; border-bottom:1px solid #ddd; } 
#bwriteview_box .pn_wrap li:last-child	{border-bottom:1px solid #ddd; } 
#bwriteview_box .pn_wrap li a			{display:block; color:#555; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;   }
#bwriteview_box .pn_wrap li a span		{display:inline-block; text-align:left; text-indent:20px; margin-right:20px; width:13%; color:#333333; border-right:1px solid #e8e8e8; }
#bwriteview_box .pn_wrap li.next span:after		{content:''; position:absolute; top:42%; left:80px; border:solid #555; border-width:1px 1px 0 0;  padding:3px; transform: rotate(135deg); -webkit-transform: rotate(-45deg);}
#bwriteview_box .pn_wrap li.prev span:after		{content:''; position:absolute; top:42%; left:80px; border:solid #555; border-width:1px 1px 0 0;  padding:3px; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
#bwriteview_box .bwrite_cm				{padding-top:20px;}

 


@media screen and (max-width:1024px) {

	#bwriteview_box .tit_wrap			{padding:20px;} 
	#bwriteview_box .tit_wrap .tit		{font-size:1.2em;}
	#bwriteview_box .tit_wrap .name		{font-size:0.85em;}

	#bwriteview_box .content_wrap		{padding:30px 10px;}
	.btn_wrap							{padding:20px 0; }

}

@media screen and (max-width:768px) {

	#bwriteview_box .file_wrap li		{font-size:0.8em; }
	#bwriteview_box .file_wrap .tit		{display:none; }
	#bwriteview_box .file_wrap .txt		{float:none; width:100%; }

	#bwriteview_box .pn_wrap li			{overflow:hidden; padding:12px 0; border-bottom:1px solid #ddd; } 
	#bwriteview_box .pn_wrap li a		{font-size:0.8em; }
	#bwriteview_box .pn_wrap li a span	{text-indent:10px; }

}



/*  게시글 폼  ==================================================================================== */
#bwriteform_box								{margin:40px auto;}
#bwriteform_box .tit						{color:#111; font-weight:bold; padding:15px 10px; text-align:center; background-color:#eeeeee; border-top:2px solid #5e5e5e; font-size:1.1em; }
#bwriteform_box	table						{border-collapse:collapse; width:100%; table-layout:fixed; }
#bwriteform_box table tbody th				{padding:10px 8px; background:#cdcfd4; border:1px solid #aaa;}
#bwriteform_box table tbody th:first-child	{border-left:0;}
#bwriteform_box table tbody th:last-child	{border-right:0;}
#bwriteform_box table tbody th span			{display:block;font-size:0.85em;color:#ec0b0b;}
#bwriteform_box table tbody td				{background:#fff; padding:8px 6px;  word-break:break-all; border-right:1px solid #ddd; border-bottom:1px solid #ddd; border-left:1px solid #ddd; height:48px;} 
#bwriteform_box table tbody td:first-child	{border-left:0;}
#bwriteform_box table tbody td:last-child	{border-right:0;}
#bwriteform_box table tbody tr:hover td		{background:#f9f9f9;}

#bwriteform_box .btn_wrap					{padding:40px 0; overflow:hidden; text-align:center; }



/*  약관  ==================================================================================== */
#rule_box								{margin:40px auto;}



/*  팝업  ==================================================================================== */
#popup_box .cont						{background-color:#ffffff;}
#popup_box .bottom						{position:fixed; bottom:0; width:100%; background-color:#000000; height:32px; padding:5px 0; text-align:center; color:#ffffff; }



/* 관리자 팝업 상단 */
#guava_win_title							{padding:15px 15px 15px 20px;background:#2b2f36;letter-spacing:-0.5px; overflow:hidden;display:flex;justify-content: space-between; }
#guava_win_title .tit						{position:relative; font-size:1.45em; font-weight:500;color:#fff; display: flex; flex-direction: column; justify-content:center;  }
#guava_win_title .close				{position:relative; cursor:pointer;color:#fff; background:#e52150;width:40px;height:40px;   border-radius:50%;transition:all 0.3s ease;opacity:1 !important;}
#guava_win_title .close:before,
#guava_win_title .close:after		{position:absolute;top:9px;left:calc(50% - 1px);content:'';height:22px;width:2px;background-color:#fff;}
#guava_win_title .close:before		{transform:rotate(45deg);}
#guava_win_title .close:after		{transform:rotate(-45deg);}
#guava_win_title .close:hover		{transform: scale(1.07);  }

.guava_win_fix							{position:fixed;width:100%;z-index:999;background:#fff;}
#guava_win_wrap							{padding:90px 15px 15px 15px;}
 


/*  QR 스타일 (여기 스타일은 수정하지마세요 큐알디자인은 고정으로 갑니다. 대신 아이콘 위치변경시에는 layout.css에 그부분만 써주세요.)  ==================================================================================== */

#guava_qrcode_btnwrap						{position:absolute; top:25px; right:0;z-index:9;}
#guava_qrcode_btnwrap span				{display:inline-block;border:1px solid #c0c0c0;text-align:center;color:#848b9a; border-radius:0px;width:29px;height:29px; cursor:pointer; background:url('../img/guava/icon_qr.png') no-repeat center 50%; opacity:0.75; transition:all 0.3s ease;}
#guava_qrcode_btnwrap span:hover			{opacity:1;} 

#guava_qrcode_infowrap						{display:none;position:absolute; top:70px; right:0;z-index:999999999;border:1px solid #ddd;border-radius:0;background:#f8f8f8; width:280px;padding:20px; }
#guava_qrcode_infowrap::after			{position:absolute;content:''; right:6px; top:-10px; width:15px; height:10px; background:url('../img/guava/icon_qr_arrow.png') no-repeat top right ;}
#guava_qrcode_infowrap .url				{width:100%;font-size:0.75em; line-height:36px; padding:0 8px;color:#888;margin:20px 0 10px 0; border:1px solid #d8dadf;  }  
#guava_qrcode_infowrap input:focus						{background:#f0f0f0; }
#guava_qrcode_infowrap .qr_img				{text-align:center; background:#fff; padding:20px;}
#guava_qrcode_infowrap .qr_img img		{width:150px;}

#guava_qrcode_infowrap .qr_btn						{position:relative;text-align:center; margin:10px 0 0 0; background-color:#6f7788; color:#fff; padding:11px;width:100%; font-size:0.95em;  }
#guava_qrcode_infowrap .qr_btn a					{ display:block;color:#fff; background:url('../img/guava/icon_qr_down.png')  no-repeat 83% 50% ; }
#guava_qrcode_infowrap .qr_btn:hover			{background-color:#202020; } 
#guava_qrcode_fade										{position:fixed; top:0%; left:0%; width:100%; height:100%; background:transparent; z-index:999999998; }
#guava_qrcode_infowrap .qr_close			{position:absolute;right:10px;top:10px;}
#guava_qrcode_infowrap .qr_close span	{display:block; height:20px;width:20px;cursor:pointer; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);} 
#guava_qrcode_infowrap .qr_close span::after	{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:18px; height:1px; background:#444;}
#guava_qrcode_infowrap .qr_close span::before	{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); height:18px; width:1px; background:#444;}

@media screen and (max-width:1400px) {
#guava_qrcode_btnwrap						{right:20px;}
}
@media screen and (max-width:1024px) {
#guava_qrcode_btnwrap						{top:15px;}
}

/*  QR 스타일  ==================================================================================== */


 

/*  게시글 블라인드  ==================================================================================== */
.blind_box					{margin:0 auto; max-width:640px;padding:60px;text-align:center; } 
.blind_box i				{font-size:3em;margin-bottom:30px;}
.blind_box .txt				{font-weight:600; font-size:1.35em; color:#444; letter-spacing:-1.5px; line-height:1.5;}
.blind_box .txt span		{display:block; font-size:1.1rem; letter-spacing:-1px; color:#797979; line-height:1.6; margin:10px 0 0 0;}





/*  이미지 미리보기  ==================================================================================== */

#img_preview_fade								{position:absolute;top:0%;left:0%;width:100%;height:100%;background:#000;opacity:.2;z-index:100000 !important;}
#img_preview_layer								{position:absolute;max-width:600px;width:100%;background:#fff;box-shadow: 0 0 10px rgba(0,0,0,0.1);border-radius: 10px;overflow: hidden;z-index:100001 !important;}
#img_preview_imgfade							{position:absolute;top:0%;left:0%;width:100%;height:100%;background:#000;opacity:.2;z-index:100002 !important;}
#img_preview_img								{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100003 !important;}

#img_preview_layer .top							{display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; background: #333;color: #fff;}
#img_preview_layer .top .tit					{font-size: 1.2em;font-weight: 500;}
#img_preview_layer .top .btn_close				{position:relative;float:right;width:20px;height:20px;cursor:pointer;}
#img_preview_layer .top .btn_close:before,
#img_preview_layer .top .btn_close:after		{position:absolute;left:calc(50% - 1px);content:'';height:20px;width:2px;background:#fff;}
#img_preview_layer .top .btn_close:before		{transform:rotate(45deg);}
#img_preview_layer .top .btn_close:after		{transform:rotate(-45deg);}
#img_preview_layer .top .btns					{position:absolute;right:50px;}
#img_preview_layer .top .btns div				{display:inline-block;background:rgba(256,256,256,.05);margin-right: 10px;border-radius: 5px;}
#img_preview_layer .top .btns button			{padding: 5px 15px;	border:1px solid rgb(255,255,255,.13);color: #eeeeee;border-radius: 5px;cursor: pointer;}
#img_preview_layer .top .btns button i			{margin-right:6px;}

#img_preview_layer .preview						{text-align:center;}
#img_preview_layer .preview iframe				{width:100%;height:600px;}

/*  이미지 미리보기  ==================================================================================== */