.service03 h3.sub_tit { color:#000;  width:100%; box-sizing:border-box;  display:inline-block;font-size:1.5em;}
.service03 ul {width:100%; display:flex; flex-wrap:wrap; border-top:1px solid #ddd; margin-top:10px}
.service03 ul li {width:100%; display:flex; align-items:center; padding:10px 0; box-sizing:border-box;   border-bottom:1px solid #ddd;  color:#333; line-height:1.5}
.service03 ul li.col-2 {width:50%; padding-right:10px}
.service03 ul li.col-2:nth-child(2n) {padding-right:0; padding-left:10px}

.service03 ul li h3 {font-size:1em; margin-bottom:0; font-weight:500; color:#333; width:150px; flex-shrink:0; line-height:1.1}
.service03 ul li h3 span {font-size:.9rem; color:#666; font-weight:400; }
.service03 ul li >  div {width:100%; display:flex; align-items:Center}
.service03 ul li >  div.flex_none {display:inline-block}
.service03 ul li >  div > div {width:100%}

.service03 ul li input {vertical-align:middle}
.service03 ul li select {height:37px; font-size:.95em; padding:0 5px; box-sizing:border-box; color:#333; border:1px solid #ddd; border-radius:5px}
.service03 ul li a.s_btn {margin-left:5px}

.service03 ul li  input[type="text"] { 
    height: 37px;
    font-size: 1em;
    border-radius: 5px;
    text-indent: 10px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
.service03 ul li  input[type="password"] { 
    height: 37px;
    font-size: 1em;
    border-radius: 5px;
    text-indent: 10px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
.service03 ul li  input[type="date"] { 
    height: 37px;
    font-size: 1em;
    border-radius: 5px;
    padding:0 7px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
	.service03 ul li  input[type="time"] { 
    height: 37px;
    font-size: 1em;
    border-radius: 5px;
    padding:0 7px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
.service03 ul li textarea { 
    height: 150px;
	width:100%;
    font-size: 1rem;
    border-radius: 5px;
     padding:10px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
.service03 ul li div.tel select {width:30%; max-width:130px}
.service03 ul li div.tel input {width:30%; max-width:130px}

.service03 ul li div.check_div  {flex-wrap:wrap; border-top:1px solid #ddd; border-left:1px solid #ddd;}
.service03 ul li div.check_div p {width:50%; border-bottom:1px solid #ddd;  border-right:1px solid #ddd; box-sizing:border-box; padding:10px; }
.service03 ul li div.check_div p b {font-weight:500; margin-right:15px}
 
.service03 ul li div.email input[type="text"] {width:30%; max-width:300px; margin-right:5px}
.service03 ul li div.email input[type="text"]:nth-child(2) {margin-left:5px}

.service03 .agreebox{display: flex;align-items: center;justify-content: center;}
.service03 .agreebox input{width: 16px;height: 16px;margin-right: 5px;}

.service03 ul li > .security_box > div{width:auto;}
.service03 .security_box img{width:100%;}
.service03 .security_box input{width:100%;margin-left:15px;}
@media screen and (max-width:800px) {
	.service03 ul li {flex-wrap:wrap; padding:13px 0}
	.service03 ul li.col-2 {width:100%; padding-right:0}
	.service03 ul li.col-2:nth-child(2n) {padding-right:0; padding-left:0}
	.service03 ul li h3 {width:100%; margin-bottom:10px }
	.service03 ul li >  div {width:100%; }
}
pre.info_pre {width:100%; height:200px; overflow-y:auto;  border:1px solid #ddd; box-sizing:border-box; padding:15px; margin-top:10px; font-size:.97rem; line-height:1.6; color:#444; }
pre.info_pre + div {background-color:#f9f9f9; font-size:1em; text-align:center; padding:10px; box-sizing:border-box; color:#444}




.support01 .table { width: 100%; display: table;  }

.row {display: table-row; background: #fff; font-size:1em; }
.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.tit  {width:55%; text-align:left; font-weight:400; line-height:1.3; font-size:1.05em;}
.cell.tit a:hover {text-decoration:underline}
.cell.tit p  {width:100%;  font-weight:400; margin-top:2px; line-height:1.2; font-size:.97rem;
     overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
	color:#555;
}
.cell.tit .new{color:var(--main_c);margin-left:5px;margin-top:6px;vertical-align:text-bottom;}
.cell.tit span {color:var(--main_c); font-weight:600; font-size:1em; margin-right:10px; }
.cell.no {width:50px; }
.cell.class {width:100px; }
.cell.tit span.new_icon {margin-left:5px; font-family:'Montserrat'; font-weight:700; font-size:18px; vertical-align:4px}

.cell_select select  { font-size:.97em; color:#111; border:1px solid #ddd;width:100px; height:30px; }



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

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


@media screen and (max-width:900px) {
	.support01 	.table { display: block; font-size:1em }
	.support01 .table * {line-height:1.3}
	.row {padding:13px 2%; display: block;  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: block; border-bottom:none; text-align:left}
	.cell_col {display:inline-block; width:auto; font-size:.9em;  }

	.cell.tit  {width:100%; font-size:1.05em;  display:inline-block}
	.cell.no {display:none}
	.cell_col.cell_select {width:100%; margin-bottom:8px }
}
 
 
/*뷰페이지*/  
p.view_title {font-size:1.1em;  line-height:1.3;  font-weight:600; color:#fff; width:100%; padding:10px 2%; box-sizing:border-box; display:inline-block; text-align:Center; box-sizing:border-box; background-color:#333;  }
div.view_info {font-size:0.95em; font-weight:400; color:#666; width:100%;  border-bottom:1px solid #ddd; padding-bottom:13px; padding-top:13px; display:inline-block; box-sizing:border-box; }

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;  border-bottom:1px solid #ddd; padding:20px 0; }
div.view_content img {max-width:100%}
 
div.view_file {width:100%; padding:12px 0 8px 0;  border-bottom:1px solid #ddd; }
div.view_file ul {width:100%; display:flex; flex-wrap:wrap;}
div.view_file ul li {display:inline-block; margin-bottom:5px; }
div.view_file ul li a {display:inline-block; font-size:0.90rem; background-color:#2478be; color:#fff; padding:4px 15px; border-radius:5px; margin-right:10px;}

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

@media screen and (max-width:900px) {
	p.view_title { width:100%; padding:0;  padding-top:10px;  text-align:left; color:#333; background-color:#fff;  border-top:2px solid #333; }
	div.view_info span::after {  margin:0 3px 0 6px}
	div.view_info {padding-top:5px; font-size:.9em; padding-bottom:10px}
	div.view_info + div.view_info {padding-top:10px}

	div.view_info span.file {width:100%; display:block; }
	div.view_info span.file a {margin-top:3px}
}

  
/*페이지*/
.page {text-align:center;   width:100%; margin-top:30px; display:inline-block; font-size:0}
.page ul { width:100%; text-align:center; }
.page li { display:inline-block; font-size:0.9rem; font-weight:500;  }
.page a {
	display:inline-block;
 	text-decoration:none; vertical-align:middle;
 	border:1px solid #d1d1d1; background-color:#fff;  width:29px; line-height:29px; height:29px;  margin-left:-1px; color:#999; text-align:Center;
   }
.page img {width:29px; height:29px; vertical-align:top;  }
.page a.ov  {border:1px solid #777; background-color:#777; color:#fff;}

 @media screen and (max-width:800px) {
	.page a {
	display:inline-block;
	text-decoration:none; vertical-align:middle;
	border:1px solid #d1d1d1; background-color:#fff;  width:25px; line-height:25px; height:25px;  margin-left:-1px;   color:#999; text-align:Center;
	}
	.page img {width:25px; height:25px; vertical-align:top;  }
}

 
/*search*/
.search {margin-top:30px;  width:100%; display:flex;  justify-content:flex-end}
.search input  {width:30%;  border:1px solid #ddd; padding-left:10px; font-size:0.93em; color:#666; margin:0 5px}
.search select  { font-size:0.93em; color:#666; border:1px solid #ddd;  vertical-align:middle; width:100px;  }
.search a {background-color:#333; border-radius:3px; box-shadow:1px 1px 2px #ddd; color:#fff; line-height:35px; font-size:0.95em; font-weight:500; padding:0 30px; display:inline-block; vertical-align:middle;}
			
.btn_wrap {width:100%; display:inline-block }
 a.list_btn {
    text-align: center;
    line-height: 31px;
    padding: 0 20px;
    font-weight: 400;
    font-size: 0.95rem;
    float: right;
    margin-top: 15px;
    margin-left: 5px;
    background-color: #333;
    border-radius: 3px;
    color: #fff;
}
.btn_wrap a.list_btn:nth-child(n+2) { float: left; background-color: #fff; border:1px solid #333; color:#333; box-sizing:border-box;}
a.write_btn{ background-color: var(--main_c);margin-top:0;margin-bottom:10px;font-size:1.05em;padding:5px 25px;}
 @media screen and (max-width:800px) {
	a.write_btn{display:inline-block;width:100%;box-sizing: border-box;font-size:1.1rem;padding:10px 20px;margin-bottom:20px;}	
 } 
 
  

 ul.gall {width:100%; display:flex; flex-wrap:wrap;   }
 ul.gall li {width:32%; margin-right:2%; text-align:center;}
 ul.gall li:nth-child(3n) {margin-right:0}
 ul.gall li:nth-child(n + 4) {margin-top:20px}

 ul.gall li * {width:100%; display:inline-block; line-height:1.35em;  }
 ul.gall li div {width:100%; padding-bottom:60%; border:1px solid #ddd;  overflow:hidden; position:relative; }
 ul.gall li img {width:100%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);  transition: all 0.3s ease-out;min-height:100%;} 
 ul.gall li:hover img {width:120%;min-height:120%;}
 ul.gall li div.none {border:1px solid #ddd; box-sizing:border-box; } 
 ul.gall li div.none img {width:60%}
 ul.gall li:hover div.none  img {width:60%; }
 ul.gall li h3 { width:100%; margin-top:12px; font-size:1.2em; font-weight:600; color:#222;
  overflow: hidden; 
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
   word-breal:break-all;  margin-bottom:3px;
 
 }
 ul.gall li p {font-size:.98em; font-weight:400; color:#555;
 overflow: hidden; 
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word; 
 }
 ul.gall li span {font-size:.88em;   font-weight:400; color:#999}

 @media all and (max-width:1000px) {
		ul.gall {justify-content:space-between} 
		ul.gall li {width:48%; margin-right:0}
		ul.gall li:nth-child(3n) {margin-right:0}
		ul.gall li:nth-child(n + 3) {margin-top:20px}
		ul.gall li h3 { font-size:1.1em; }


}


/*글쓰기*/
.write {width:100%; display:flex;  justify-content:space-between; flex-wrap:wrap; border-top:1px solid #333}
.write li { width:100%;  display:flex; align-items:center;  padding:11px 0; border-bottom:1px solid #ddd}
.write li.col-2 {width:50%}
.write li.right p  {padding-left:20px; }
.write li p {width:130px; font-size:1em; font-weight:500; color:#333} 
 
  .write li  input[type="text"] {width: calc(100% - 130px);
    height: 38px;
    font-size: .97em;
    border-radius: 5px;
    text-indent: 10px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
	 .write li  input[type="password"] {width: calc(100% - 130px);
    height: 38px;
    font-size: .97em;
    border-radius: 5px;
    text-indent: 10px;  
	border:1px solid #ddd; box-sizing:border-box; 
	}
	.write li  input[type="date"]  {
    height: 38px;
    font-size: .97em;
    border-radius: 5px;
    text-indent: 5px;
	border:1px solid #ddd; box-sizing:border-box; 
	}
.write li  input[type="file"] {font-size:.97em; width:calc(100% - 130px); box-sizing:border-box;  }

.write li  select { 
    height: 38px; padding-right:5px;
    font-size:.97em;
    border-radius: 5px;
     padding-left: 5px; box-sizing:border-box; 
	border:1px solid #ddd; color:#666;
	}
  .write li textarea {width: calc(100% - 130px); }


.write li.mail  div {width: calc(100% - 130px); display:flex; align-items:center}
.write li.mail  input[type="text"] {width:20%;}
.write li.mail span {margin:0 5px}
.write li.mail select {margin-left:5px}

 
.write li.tell  input[type="text"] {width:30%;}

 @media screen and (max-width:800px) {
	.write li {width:100%;  flex-wrap:wrap;}
	.write li.col-2 {width:100%; flex-wrap:wrap;}
	.write li.right p  {padding-left:0}
	.write li p {width:100%; margin-bottom:5px} 
	.write li  input[type="text"] {width:100%}
	.write li.mail  input[type="text"] {width:50%;}
	.write li textarea {width:100%; height:150px !important }
	.write li.mail  div {width:100%;  }
	.write li  input[type="password"] {width: 100%}
}