@charset "UTF-8";

/* Page Title */

ul.list {width:100%; border-top:1px solid #ddd;  margin-top:10px}
ul.list li {width:100%; display:inline-block; border-bottom:1px solid #ddd;  padding:10px 0; line-height:1.2;  }
ul.list li a {font-size:1.1rem; font-weight:600; color:#333; width:100%; display:inline-block;  margin-bottom:3px} 
ul.list li p {font-size:.93rem;  color:#555; width:100%; display:inline-block;  } 
ul.list li span {font-size:.93rem;  color:#777; width:100%; display:inline-block;  } 

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

.row {display: table-row;background: #fff; }
.row.header {font-weight:600; color: #fff; background:#333;}
 
.cell { padding: 10px 12px; display: table-cell; vertical-align:middle;  text-align:Center;  border-bottom:1px solid #ddd; color:#666}
.cell a {color:#333 !important}

.row.header .cell { color: #fff}

.tit  {width:60%; text-align:left; font-weight:600; line-height:1.3}
.tit a:hover {text-decoration:underline}
.cell.no {width:50px;  }

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


@media screen and (max-width:800px) {
	.table { display: block; }
    .table * {line-height:1.3}
	.row {padding:13px 2%; display: block;  border-bottom:1px solid #ddd}
	.row.header {padding: 0; height: 2px; }
	.row.header .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;  }
	.cell a {width:100%;  display:inline-block}
	.cell_col {display:inline-block; width:auto; font-size:.9em;  }
	 
	.tit  {width:100%; font-size:1.05em; }
	.row .tit:before { display:none }

	.no {display:none}
 

}
 
 
/*뷰페이지*/
 
  
p.view_title {font-size:1.05em;  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;  }
p.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; }

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

div.view_content {width:100%; display:inline-block;  border-bottom:1px solid #ddd; padding:20px 0; }
div.view_content img {max-width:100%}
 div.vedio_frame {width:100%; margin-top:20px}
div.chart_box {width:100%; margin-top:-1px; box-sizing:border-box;  border:1px solid #ddd; overflow:hidden}

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;}

div.reple {width:100%; display:flex; border-bottom:1px solid #ddd; padding:15px 10px; font-size:15.5px; color:#666;  background-color:#f9f9f9; box-sizing:border-box;}
div.reple  b {color:#333; font-weight:600; font-size:16px; width:90px}
div.reple  p {padding-left:30px;}

.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:800px) {

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

	p.view_info span.file {width:100%; display:block; }
	p.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 #555; background-color:#555;   color:#fff !important;}

 
 
 @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;  }

}


.write {width:100%; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; border-top:1px solid #333}
.write li {display:flex; width:50%; align-items:center;  padding:10px 0; border-bottom:1px solid #ddd}
.write li:nth-child(2n) p  {padding-left:20px}
.write li p {width:130px; } 
 
.write li  input[type="text"] {width: calc(100% - 130px);
    height: 35px;
    font-size: 1rem;
    border-radius: 5px;
    text-indent: 10px;
	border:1px solid #ddd; box-sizing:border-box; 
	}

	.write li  select { 
    height: 35px;
    font-size: 1rem;
    border-radius: 5px;
     padding-left: 5px; box-sizing:border-box; 
	border:1px solid #ddd; color:#666;
	}

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


 @media screen and (max-width:800px) {
.write li {width:100%}
.write li:nth-child(2n) p  {padding-left:0}
.write li p {width:20%;  } 
.write li  input[type="text"] {width:80%}
.write li.mail  div {width:80%;  }

}
/*서치*/
 						
.search     {margin-top:30px;  width:100%; display:flex;  justify-content:flex-end}
.search  input  {width:30%; height:33px !important; 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; height:33px !important;}
.search a {background-color:#333; border-radius:3px; box-shadow:1px 1px 2px #ddd; color:#fff !important; line-height:33px; font-size:0.95em; font-weight:500; padding:0 30px; display:inline-block; vertical-align:middle;}
									   
  
/*FAQ*/

.faq dl {width:100%; border-top:1px solid #ddd; margin-bottom:-1px;}
 
.faq  dt {
  background-color: #fff;
  border-bottom:1px solid #ddd;
  cursor: pointer;
  transition: 0.7s;   align-items:center;
  color: #333; width:100%; display:flex;  padding:10px; box-sizing:border-box; 
}

.faq   p.icon {width:30px; line-height:30px; background-color:#f1f1f1; text-align:center; border-radius:50%; margin-right:15px; vertical-align:middle} 

.faq  dt div {font-weight:600}
.faq  dt:hover { background: #f9f9f9; }

.faq  dt img {vertical-align:middle; margin-right:5px}
.faq  dd {
  background-color: #f9f9f9;
  display: none;
  border-bottom: 1px solid #ddd;
  line-height: 1.4;
  font-size:1em; color:#666;
  padding:10px;   
}

.faq  dd div.a  { width:100%; display:flex; align-items:center }
  


.report li {width:100%; display:flex; align-items:Center; border:1px solid #ddd; box-sizing:border-box;  margin-top:-1px; }
.report div.img {width:30%; line-height:0; height:200px; overflow:hidden; overflow:hidden; position:relative; }
.report div.img img  {min-height:100%; min-width:100%; position:absolute; top:50%; left:50%;  transform: translate(-50%, -50%);}


.report li div.img::after {width:100%; height:100%; background:rgba(0,0,0,.0); display:inline-block; position:absolute; left:0; top:0; z-index:9; content:''; color:#fff; font-size:4rem; letter-spacing:0px; font-weight:400;  line-height:200px; text-align:center; transition: all 0.3s ease-out;}
.report li:hover div.img::after { background:rgba(0,0,0,.5); content:'+'; }

.report div.img + div {width:65%; padding:10px; margin-left:auto; font-size:1rem; color:#555; line-height:1.3}
.report div.img + div h3 { transition: all 0.3s ease-out; font-size:1.4rem; font-weight:600;  color:#333; display:block; margin-bottom:15px}
.report li:hover div.img + div h3 {text-decoration:underline}

.report div.img + div p {font-size:1em;
width: 100%;
    margin-top: 5px;
    line-height: 1.3;
     color: #777;
    max-height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.report div.img + div span {font-size:.9em; display:block; margin-top:8px; font-weight:400;  color:#777; }

 @media all and (max-width:800px) {
	.report li {flex-wrap:wrap; margin-top:0}
	.report li:nth-child(n+2) {margin-top:20px}

	.report div.img {width:100%; height:auto; max-height:150px }
	.report div.img img {width:100%; position:static; transform: translate(0, 0);}
	.report li div.img::after {display:none;}

	.report div.img + div {width:100%; padding:5%; font-size:.90rem; }
	.report div.img + div h3 {font-size:1.2rem; margin-bottom:10px}
	.report div.img + div span { margin-top:3px; ; }



}