body{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.sub_con{padding:180px 0; box-sizing:border-box;     flex-grow: 1;}
.sub_con h3{font-size:3.5em; margin-bottom:40px;}
.sub_vi{}

.tab{margin-bottom:60px;} 
.tab ul{display:flex; flex-wrap:wrap; gap:20px;}
.tab li{}
.tab li a{padding:20px 45px; box-sizing:border-box; color:#bbb; font-size:1.3em; border:1px solid #bbb; display:inline-block;}
.tab li.ov a{border:1px solid var(--main_c); color:var(--main_c); }
.tab li a:hover{border:1px solid var(--main_c); color:var(--main_c);}

@media screen and (max-width:900px) {
	.sub_con{padding:130px 0 100px 0;}
	.sub_con h3{font-size:2em; margin-bottom:20px;}

	.tab{margin-bottom:30px;}
	.tab ul{gap:10px;}
	.tab li a{padding:15px 25px; font-size:1em;}
}



.product table{width:100%; border-collapse: collapse; }
.product .tb_wrap{ overflow:auto;}
.product th, .product td{padding:10px; box-sizing:border-box; text-align:center; border:1px solid #ddd;     }
.product th{background:var(--main_c); color:#fff; font-weight:600; padding:20px 10px; font-size:1.1em;}
.product td{line-height: 1.5;}
.product td img{cursor:pointer; max-width:100px;}
.product td:nth-of-type(7) img{cursor:initial;}
.product table a{color:#333; display:flex; background:#e1ecf7; border-radius:5px; padding:10px;  align-items:center; gap:5px; text-align:left; box-sizing: border-box; font-size:.9em; justify-content:center;}
.product table a:hover{text-decoration:underline;}
.product table a img{width:25px;}

.product .popup {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 30px;
	background: white;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	z-index: 1000;
	text-align: center;
	z-index:9999999;
	box-sizing:border-box;
	max-width: 500px;
}

.product .popup .imgbox {max-height:500px; overflow-y:auto;}
.product .popup img {
	width:100%;
}
.product .overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	z-index: 999999;
}

.product button{position:absolute; right:0; top:-45px; font-size:2em; color:#fff;}

@media screen and (max-width:1300px) {
	.product th:nth-of-type(6) {min-width:160px;}
}

@media screen and (max-width:900px) {
	.product table{font-size:.8em;}
	.product th, .product td{padding:7px; }
	.product th{font-size:1em;}
	.product td{font-size:.9em;}
	.product td img{max-width:70px;}
	.product .popup {width:90%;}

	.product table a {white-space: nowrap;}
	.product table a img{width:20px;}
	
}




/* 제품문의 */
.write {width:100%; display:flex;  justify-content:space-between; flex-wrap:wrap; border-top:1px solid #333}
.write li  input[type="file"]{font-size:1em;}
.write input[type="radio"]{width:20px; height:20px;}
.write li { width:100%;  display:flex; align-items:center;  padding:15px 0; border-bottom:1px solid #ccc}
.write li.col-2 {width:50%}
.write li.right p  {padding-left:30px; }
.write li p {width:130px; font-size:1.1em; font-weight:600; color:#333} 
 .write li  input[type="text"] {width: calc(100% - 130px);
    height: 38px;
    font-size:1em;
    border-radius: 5px;
    text-indent: 10px;  
	box-sizing:border-box; 
	border:none;
	background:#f3f3f3;
}

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

.write li.phone div{width: calc(100% - 130px);display:flex;align-items:center}
.write li.phone select {width:40%}
.write li.phone span {margin:0 5px}

.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.phone div{width: 100%}
	.write li.phone select {width:auto}
	.write li.mail  input[type="text"] {width:50%;}
    .write li textarea {width:100%; height:150px !important }

	.write li.mail  div {width:100%;  }

} 

@media screen and (max-width:600px) {
	.write li.mail div{ flex-wrap:wrap}
	.write li.mail input[type="text"] {width: calc(50% - 10px - 0.3em);}
    .write li.mail select{margin:10px 0 0 0;width:100%;}
 }

.textarea1 {
    font-size: 0.95em;
    line-height: 1.4em;
    width: 100%;
    height: 200px;
    box-sizing: border-box;
    color: #666;
    border: 1px solid #ddd;
    background-color: #fff;
    padding: 15px;
}


 .privacy_check {
	width: 100%;
    display: inline-block;
    padding: 10px;
    box-sizing: border-box;
    background-color: #f9f9f9;
    text-align: center;
    font-size: 1em;
    color: #666;
	font-weight:600
}

.inquiry h4{font-size:1.3em; font-weight:500;}
.privacy_check label	{display: flex; align-items: center; gap: 5px; justify-content: center;}
.privacy_check input {vertical-align:middle;width:17px;height:17px;}
.check input[type=checkbox]{width:20px;height:20px;margin-right:3px}


.btnbox{margin-top:60px;}
.btn {
	display:inline-block;
	background-color: var(--main_c);
	padding:25px 50px;
	font-size:1.2em;
	color:#fff !important;
	font-weight:600;
	border-radius:5px;
	transition:all ease .2s;
	border:none;
	cursor:pointer;
 }
.btn:hover {
	background-color: #000;
	transition:all ease .2s
}
.btn input{border:none;background:none;	font-size:1em;	color:#fff;	font-weight:700;cursor:pointer}
.btn i{color:#fff;}
@media screen and (max-width:800px) {
	.btn{	padding:20px 30px;font-size:1.1em}
}



/* 공지사항,자료실 */

.table { width: 100%; display: table;  font-size:1.1em;}

.row {display: table-row; background: #fff; font-size:1em; }
.row.th {font-weight:600; color: #fff; background:#333;}
.row.notice {background-color:#eef5ff}
 
.cell { padding:11px 12px; display:table-cell; vertical-align:middle;  text-align:Center;  border-bottom:1px solid #ddd; color:#666}
.cell a {    display: flex;    gap: 5px;}
.cell p {color:#111; 
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cell span{color:var(--main_c);}
.cell i{
	color: var(--main_c);
    font-size: 1em;
    animation: opacity 2s infinite linear;
    margin-left: 10px;
}
.cell a.s_btn2 {color:#fff}
.row.th .cell { color: #fff; padding:15px 12px;}

.cell.tit  {width:55%; text-align:left; font-weight:500; line-height:1.3; font-size:1em}
.cell.no {width:50px; }
 
.none_list {width:100%; display:inline-block; text-align:center; background-color:#f9f9f9; font-size:1em; padding:10px 0 }
.row.notice * {color:#333}
.cell .arrow_btn {width:10px; display:inline-block; line-height:0; vertical-align:-2px}
.cell .arrow_btn i {line-height:0; font-size:18px;  }
.cell .arrow_btn a i {color:rgba(255,255,255,.5); }
.cell .arrow_btn a i.over {color:#fff}

@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;  }
   .cell span{white-space: nowrap;}

   .table.type2 {border-left:1px solid #ddd}
   .table.type2 .cell {border-right:1px solid #ddd; padding:7px}
   .table.type2 .row.th .cell {padding:9px; font-weight:600}

	.cell.tit{width:70%;}
}
 
 

@media screen and (max-width:900px) {
	.table { display: block; font-size:1em }
    .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:inline-block; border-bottom:none; text-align:left; font-size:.95em}
 	 
	.cell.tit  {width:100%; font-size:1.06em; font-weight:600; margin-bottom:2px;  display:inline-block}
    .cell.no {display:none}
	.cell.m_tit {width:100%; font-size:1.06em; margin-bottom:2px;  display:inline-block; color:#000; font-weight:600}
    .type2 .cell br {display:none}
 
	.board05 .cell a { display: block; }

}
 
 
/*뷰페이지*/
 
  
p.view_title {font-size:1.2em;  line-height:1.3;  font-weight:600; color:#fff; width:100%; padding:15px 2%; box-sizing:border-box; display:inline-block; text-align:Center; box-sizing:border-box; background-color:#333;  }
div.view_info {ffont-weight:400; color:#666; width:100%;  border-bottom:1px solid #ddd; padding:10px 0; 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{display:inline-block; margin:5px 0;}
div.view_info span.file a {display:inline-block;  color:#666; box-sizing:border-box; border:1px solid; padding:5px; margin-right:5px;}
div.view_info span.file a:hover {text-decoration:underline }

div.view_content {width:100%; display:inline-block; 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;}

div.comment {width:100%; display:flex; background-color:#f1f1f1; box-sizing:border-box; padding:20px }
div.comment b {width:50px; flex-shrink:0; }

.list_next  {width:100%; display:inline-block;  border-top:1px solid #ddd; 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}
.list_next.border_top_none {border-top:none }
.list_next a{color:#666;}


@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:1px; 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:60px; display:inline-block; font-size:0}
.page ul { width:100%; display:flex; align-items:center; justify-content:center; }
.page li { display:inline-block; font-size:0.95rem; font-weight:500; margin:0 8px;}
  
.page a {
	display:inline-block;
 	text-decoration:none; vertical-align:middle;
   color:#999; text-align:Center; font-size:1.4em;
   }
.page li.angle {margin:0 3px}
.page li.angle a {border:1px solid #999; border-radius:50%; padding:0; width:30px;   height:30px; display:flex; align-items:center; justify-content:center; font-size:.8em;}
.page a.ov  {color:var(--main_c); font-weight:600; }
.page li.angle a.ov  {border:1px solid var(--main_c)}

@media screen and (max-width:900px) {
   .page li.angle a  {  width:25px;   height:25px; font-size:13px}

}
 

/*search*/			
.search {margin-top:30px;  width:100%; display:flex;  justify-content:flex-end}
.search input  {width:30%; border:1px solid #c9c9c9; padding-left:10px; font-size:0.93em; color:#666; margin:0 5px}
.search select  { font-size:0.93em; color:#666; border:1px solid #c9c9c9;  vertical-align:middle; width:100px;  }
.search a {background-color:#333; border-radius:3px; box-shadow:1px 1px 2px #ddd; color:#fff; line-height:33px; font-size:0.95em; font-weight:500; padding:0 30px; display:inline-block; vertical-align:middle;}

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


.company *{line-height:1.8; color:#333;}
.company b{color:var(--main_c); font-weight:600;}


.company01 {margin-bottom:0; padding-bottom:0;}
.company01 .wrap{font-size:1.1em; background:url(/common/img/building.png) center right / cover no-repeat, rgb(255 255 255 / 70%); background-blend-mode: hue; padding:100px 0; box-sizing:border-box;}
.company01 h4{font-size:2em; margin-bottom:40px; font-weight:600; line-height:1.4}
.company01 b{margin-bottom:5px; display:inline-block; width:100%; font-weight:600; font-size:1.2em; }

.company01 .flex{gap:50px; margin-bottom:80px;}
.company01 .flex:first-of-type{margin-top:60px; }
.company01 .f_center{align-items:center;}
.company01 .flex div{width:50%; /* background:rgb(255 255 255 / 61%); */ }
.company01 .imgbox{max-height:350px; overflow:hidden;}
.company01 img{width:100%; }

.company01 span{font-weight:600; font-size:1.2em;}
.company01 .last{font-size:1.1em; text-align:right;}

@media all and (max-width:900px) {
	.company01 .wrap{padding:60px 0; font-size:1em;}
	 .company01 .flex{flex-direction:column; margin-bottom:60px;}
	 .company01 .flex div{width:100%;}
	 .company01 h4{font-size:1.4em;}
}



.company02 {margin-bottom:0; padding-bottom:0;}
.company02 .wrap{font-size:1.5em; background:url('/common/img/bg_.jpg') right center / cover no-repeat, rgba(0, 0, 0, 0.7); background-blend-mode: multiply;}
.company02 div * {color:#fff;}
.company02 .flex{ padding:120px 0; box-sizing:border-box;}
.company02 h4{font-size:1.3em; font-weight:600; width:40%;}
.company02 span{font-style:italic; color:var(--main_c); }
.company02 b{color:var(--main_c); }
.company02 p{width:60%; color:#ddd; font-size:.85em;}

.company02 img{width:280px;}

@media all and (max-width:900px) {
	.company02 .wrap{font-size:1.2em;}
	 .company02 .flex{flex-direction:column; gap:20px; padding:60px 2%;}
	 .company02 h4{width:100%;}
	 .company02 p{width:100%;}
	 .company02 img{width:180px;}
}

.company03{font-size:1.3em; color:#333;}
.company03 iframe{display:block; height:450px}
.company03 ul{display:flex; gap:40px; background:#f1f1f1; padding:40px; box-sizing:border-box;}
.company03 li{display:flex; gap:10px; line-height:1.4;}
.company03 b{color:var(--main_c); font-weight:800;}

@media all and (max-width:1300px) {
	 .company03 iframe{height:300px;}
	 .company03 ul{flex-direction:column; gap:20px; padding:20px; font-size:.8em;}
	 .company03 b{flex-shrink:0; width:10%;}
}

@media all and (max-width:900px) {
	.company03 b{width: 22%;}
}