@charset "UTF-8";

/* Page Title */
 


  
.table { width: 100%; display: table;  word-break:normal;  }

.row {display: table-row; background: #fff; font-size:17px }
.row.th {font-weight:600; color: #fff; background:#333;}
.row.notice {background-color:#eff8fc}
 
.cell { padding:11px 12px; display:table-cell; vertical-align:middle;  text-align:Center;  border-bottom:1px solid #ddd; color:#666}
.cell a {color:#111}
.row.th .cell { color: #fff}

.cell.td_tit  {width:65%;  text-align:left; font-weight:500; line-height:1.3; font-size:1em}
.cell.td_tit a {display:flex; gap:10px; align-items:center}
.cell.td_tit a:hover {text-decoration:underline}
.cell.td_tit p  {
		width:100%;  
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		word-wrap: break-word;
 	 
}
.cell.td_tit div.thum  {width:100px; height:50px;  border:1px solid #ddd; box-sizing:border-box; }
.cell.td_tit div.thum.no_img {background:url('/common/img/ci.png') no-repeat center; background-size:50%}
.cell.td_tit span.new_icon {margin-left:5px; font-weight:300; color:red;  vertical-align:4px}

 


@media screen and (min-width:900px) {
  
   .cell.no {width:50px; }
   .cell.name {width:100px; white-space:nowrap;  }
   .cell.date {width:100px;  white-space:nowrap;   }
   .cell.hit {width:80px; white-space:nowrap;  }
   .cell.cate {width:100px; }
   	.mobile_link {display:none}


}
 
@media screen and (max-width:1100px) {
	 .cell.td_tit  {width:50%; }
 }


@media screen and (max-width:900px) {
	.table { display: block; font-size:1em;  }
	.table * {line-height:1.3}
	.row {padding:13px 0; display: block; position:relative;  font-size:1em; border-bottom:1px solid #ddd}
	.row.th {padding: 0; height: 2px; }
	.row.th .cell { display: none; }

	.row .cell:before { margin-bottom: 3px; content:attr(data-title); text-transform: uppercase;color:#555;}
	.cell { padding:0; padding-right:5px; display: inline-block; border-bottom:none; text-align:left;  font-size:.95em; }
	.cell_col {display:inline-block; width:auto; }

	.cell.td_tit  {width:100%; font-size:1.1em; margin-bottom:1px; display:inline-block}
	.cell.td_tit div {display:none}
	.cell.no {display:none}
	.cell.cate {font-weight:500; color:#000;  margin-bottom:1px}

	.mobile_link {  position:absolute; left:0; top:0; width:100%; height:100%}
}
 
 
/*뷰페이지*/
 
  
p.view_title {font-size:1.8em;  line-height:1.3;  font-weight:700; width:100%;   box-sizing:border-box; display:inline-block;  box-sizing:border-box;   }
div.view_info {font-size:1em; font-weight:400; color:#666; width:100%;  border-bottom:1px solid #ddd; padding-bottom:13px; padding-top:5px; display:inline-block; box-sizing:border-box; font-size:16px;  }

div.view_info span::after {width:1px; height:12px; vertical-align:middle;  content:''; display:inline-block; background-color:#888;  margin:0 5px 0 10px}
div.view_info span:last-child::after {display:none}
div.view_info a:hover {text-decoration:underline }
div.view_info span.file a {display:inline-block; border:1px solid #015bac; padding:0 10px; border-radius:2px; margin-left:3px; color:#015bac }

div.view_content {width:100%; display:inline-block;   padding:20px 0; }
div.view_content img {max-width:100%}
 
div.view_file {font-size:15px; width:100%; margin-bottom:20px;  padding:10px;  border-radius:5px;  box-sizing:border-box; display:flex; align-items:center; border:1px solid #ddd;  }
 div.view_file a {margin-left:auto; white-space:nowrap; font-size:15px;  color:#333; border-radius:5px; border:1px solid #ddd; padding:5px 10px}
 

.list_next  {width:100%; font-size:16px; display:inline-block;  padding:11px 0; box-sizing:border-box; border-top:1px solid #ddd; border-bottom:1px solid #ddd; line-height:0} 
.list_next p {width:100%; display:inline-block; font-size:1em; line-height:1; color:#999;  overflow: hidden;   text-overflow: ellipsis; margin:3px 0;  white-space: nowrap; }
.list_next p a {color:#222}
.list_next p:last-child {text-align:left; }
.list_next b {font-weight:600; color:#333; width:80px; display:inline-block}



  a.list_btn {
    text-align: center;
     padding:6px 20px;
    font-weight: 400;
     display:inline-block; 
 
   font-size:16px; 
    margin-left: 5px;
    background-color: #fff;
	border:1px solid #333; 
    border-radius: 3px;
    color: #222;
}




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

		p.view_title { font-size:1.3em; width:100%; padding:0;  padding-top:10px; padding-bottom:3px;  text-align:left; color:#333; background-color:#fff;  border-top:2px solid #333; }
 		div.view_info {padding-top:0; font-size:.9em; padding-bottom:10px}
 		div.view_info span::after {  margin:0 3px 0 6px}
 
		div.view_info span.file {width:100%; display:block;  }
		div.view_info span.file a {  border:none; padding:0}
		div.view_file {font-size:14px;  }
		div.view_file a {  font-size:14px; }


}

 
/*페이지*/


.page {text-align:center;   width:100%; margin-top:50px; display:inline-block; font-size:0}
.page ul { width:100%; text-align:center; }
.page li { display:inline-block; font-size:0.95rem; font-weight:500;  }
 
.page a {
	display:inline-block;
 	text-decoration:none; vertical-align:middle;
 	  width:29px; line-height:29px; height:29px;  color:#999; text-align:Center;
 }
.page li i {vertical-align:middle}
.page a.ov  {color:red; font-weight:600}

 
 
 @media screen and (max-width:900px) {
		.page { margin-top:30px;}
		.page li { font-size:12px}
		.page a {  width:25px; line-height:25px; height:25px; }
 
}

.list_btn + .page {margin-top:5px}
 

 
 



/*서치*/
.search_wrap {width:100%; gap:10px;  margin-bottom:20px; font-size:17px } 	
.search_wrap form {margin-left:auto; }
.search_wrap div { background-color:#ECECEC; border:1px solid #ECECEC; font-size:1em; padding:2px 15px 2px 15px; border-radius:50px;box-sizing:border-box   }
.search_wrap select {border:none; font-size:1em;background-color:#ECECEC; border:1px solid #ECECEC;  height:100%}
.search_wrap select:focus { border-radius: 0; }
.search { background-color:#ECECEC;    border-radius:50px; border:1px solid #ECECEC; box-sizing:border-box;  padding:0 17px; display:flex; }
.search  input  {width:100%; height:33px; background-color:#ECECEC; border:none; padding-left:10px; color:#666; }
.search a {  padding:0 5px; display:flex; align-items:center; }
 			
  @media all and (max-width:900px) {
		.search_wrap {gap:10px 0}
		.search_wrap div {order:2; width:auto; height:35px; margin-right:10px}
		 
		.search_wrap div  select {width:100%; font-size:14.5px;  }
		.search_wrap form {order:1; width:100%;  }
		.search_wrap form div {width:100%}
  
}

								   
									   
ul.gall {width:100%; display:flex; flex-wrap:wrap; gap:2% }
ul.gall li {width:32%; box-sizing:border-box}
ul.gall li:nth-child(n+4) {margin-top:30px}

ul.gall li div.img {width:100%; background-color:#ddd; padding-bottom:60%;  margin-bottom:10px;  overflow:hidden; position:relative;  }
ul.gall.insta li div.img {padding-bottom:125% }

 

 ul.gall li h4 { width:100%;   font-size:1.15em; font-weight:600; color:#222;
    word-break:normal;
	overflow: hidden; 
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	word-breal:break-all; 
	margin-bottom:3px;
 } 
  


 @media all and (max-width:900px) {
		ul.gall {justify-content:space-between} 
		ul.gall li {width:48%;  }
		ul.gall li:nth-child(n+3) {margin-top:20px}
		ul.gall li div.img {margin-bottom:6px}
		ul.gall li h4  {font-weight:600; font-size:1.07em;  margin-bottom:1px}
  
}


  



/**글쓰기폼**/


.write {width:100%; border-top:1px solid #ddd; }
.write li {width:100%; display:flex; gap:10px; font-size:16px}
.write li > p {width:145px; font-weight:600; display:flex; align-items:center; flex-shrink:0; border-bottom:1px solid #CBCBCB; padding:17px 0}
.write li > div {width:calc(100% - 145px); border-bottom:1px solid #CBCBCB; padding:17px 0}
.write.type2 {display:flex; flex-wrap:wrap; border-top:none}
.write.type2 li {width:50%}
.write.type2 li.li_100 {width:100%}
.write.type2 li > p {border-bottom:none; padding:10px 0}
.write.type2 li > div {border-bottom:none; padding:10px 0}


.write li > div p + p {margin-top:10px}
.write .flex.f_wrap.col-2 {gap:10px 0}
.write .flex.f_wrap.col-2 p + p {margin-top:0}



.write li > div input  { 
    height: 35px;
    font-size: 1rem;
	padding-left:5px; 
    border-radius: 5px;
 	border:1px solid #999;
	text-align:left; 
	box-sizing:border-box; 
 }
 .write li > div  select  { 
    max-width:100%;
	height: 35px;
	color:#666;
    font-size: 1rem;
    border-radius: 5px; 
	padding:0 3px; 
	border:1px solid #999;
	box-sizing:border-box; 
 }
 .write li > div  input[type="file"] { 
		border:none;
		text-indent: 0;
		font-size:.95rem;
		height:auto
 }
.write li > div  input.input100 {width:100%}
 
.write li > div.tel {display:flex; align-items:Center; gap:10px}
.write li > div.tel input {width:80px}
.write li  div.mail {display:flex; align-items:Center; gap:10px}
.write li  div.mail input {width:27%;  }
.write li > div.ad a {border:1px solid #363636; color:#333; margin-left:5px; line-height:35px; padding:0 10px; display:inline-block; border-radius:5px }
.write li > div.ad a img {vertical-align:-1px; margin-left:2px}

.write li > div input[type="time"] {  color:#333}
.write li > div input[type="date"] {  color:#333}
.write_box  textarea { 
    height: 150px;
	width:100%;
    font-size: 1rem;
    border-radius: 5px;
     padding:10px;  
	border:1px solid #999; box-sizing:border-box; 
 }

.radio_box { display:flex; }
.radio_box input[type="radio"] + label {
				display: inline-block;
				  white-space:nowrap;
				box-sizing:border-box; padding:8px 25px;  text-align:Center;
				border:1px solid #333;  margin-right:5px;
				cursor: pointer; border-radius:5px;  font-size:.97em;
			}
.radio_box input[type="radio"]:checked + label { background-color: var(--main_c); 	border:1px solid var(--main_c);  color:#fff }
.radio_box input[type="radio"] { display: none; }
.write button {font-size:14.5px}


textarea.basic { 
    height: 150px;
	width:100%;
    font-size: 1rem;
    border-radius: 5px;
     padding:10px;  
	border:1px solid #999; box-sizing:border-box; 
 }

 .agree_check {width:100%; text-align:center; margin-top:20px; }


  

@media all and (max-width:900px) {
		.write_box h4 {font-size:1.3em; margin-bottom:10px}
		.h4_tit + .write {padding-top:20px}

		.write li {flex-wrap:wrap;    padding-top:15px}
		.write li:first-child {padding-top:0}
		.write li > p {width:100%; border-bottom:none; padding:0}
		.write li > div {width:100%;  padding:0; border-bottom:none}
 		.write li > div.mail {flex-wrap:wrap; gap:5px}
		.write li > div.mail input {width:calc(50% - 20px)}
		.write li > div.mail select {width:auto; max-width:100%}

		
		.write li > div.plus_div {  padding:0;   }
		.write li > div.plus_div p {  display:flex; flex-wrap:wrap; gap:5px 5px; }
		.write li > div.plus_div  input[type="text"] {width:100%; }
		 
		.write li > div.tel { gap:5px}
		.write li > div.ad a {font-size:14px }


		.write li > div  input  {font-size:15px }
		.write li > div  select {font-size:15px }

		.write.type2 li {width:100%;}
		.write.type2 li > p {padding:0}
		.write.type2 li > div {padding:0}


		.write li > div input.m_input100 {width:100%}

		 textarea.basic {font-size:14px}



}