@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);
* {font-family: 'Spoqa Han Sans Neo', 'sans-serif';  word-break:keep-all;  letter-spacing:-.5px}
 
  
body {height:100%; min-width:960px}
html {height:100%}

 
.ac {align-items:center !important; }
.as {align-items:flex-start !important; }
.ad {align-items:flex-end !important; }
.jt {justify-content:flex-start !important; }
.jc {justify-content:center !important; }
.js {justify-content:space-between !important; }

#wrap {height:100%; position:relative; width:100%; min-width:1100px;  display:inline-block; }
.sian_tab {min-width:960px; }

  
#container {  width:100%; display:inline-block;  }




/* Header */
#header_wrap {width:100%; display:inline-block; border-bottom:1px solid #ddd;  position:fixed; z-index:99999; top:0;  background-color:#fff  }
#header_wrap * {transition: all 0.3s ease-out;}

 
header#header { width:100%; max-width:1100px; margin:0 auto;   display:flex; align-items:center}



 
header#header nav#gnb {
	   display:inline-block; 
	  margin-left:auto; 
	  margin-right:30px;
 }
 header#header nav#gnb > ul > li {
	 display:inline-block;  box-sizing:border-box; text-align:center; position:relative;  padding:0 35px; z-index:99999999999; white-space:nowrap
	  
}
  
header#header nav#gnb > ul > li > a {
	display: inline-block;
	
	font-size: 1.3rem;
	line-height:80px;
 
	font-weight: 500;
	color: #000;
}
header#header nav#gnb > ul > li > a:hover {color:#111} 
header#header nav#gnb > ul > li > ul { display:none;  width:200px; background-color:#fff;  position:absolute; left:50%; transform: translate(-50%, 0);   padding:20px 0 }
header#header nav#gnb > ul > li > ul > li {width:100%; padding:5px 5px; box-sizing:border-box; white-space:nowrap; }
header#header nav#gnb > ul > li > ul > li > a{display:inline-block;width:100%; font-size:1.05em; color:#333}
header#header nav#gnb > ul > li > ul > li:hover a {color:var(--main_c); text-decoration:underline} 

#header_wrap  > div.util_wrap  {background-color:var(--main_c);  height:45px}
#header_wrap.over > div.util_wrap {margin-top:-45px}
.util  {justify-content:center;  font-weight:300;  line-height:53px; color:#333;  font-size:15px;   gap:25px; }


.main_con {width:100%;  margin:0 auto; min-width:960px;  font-size:16.5px;  font-weight:300; line-height:1.4}
.in {width:100%; margin:0 auto;  min-width:1100px;  max-width:1100px;  }
.flex {display:flex}
.main_con h2 {font-size:1.9em; margin-bottom:30px}
.main_con h2:before {content:' '; width:10px;height:3px; margin:0 10px; margin-top:-1px; vertical-align:middle;  background-color:#111; display:inline-block;  }
.main_con h2:after {content:' ';  width:10px;height:3px; margin:0 10px; margin-top:-1px;  vertical-align:middle;  background-color:#111; display:inline-block;  }

hr {height:100px}
h3 {font-size:2em}

section {}

.arrow { position: absolute;   }
.arrow::after {
	position: absolute;
    right:0; 
	top: 30%;
	content: '';
	width: 35%;  
	height: 35%; 
	border-top: 2px solid #fff; 
	border-right: 2px solid #fff; 
		transform: rotate( 45deg );

} 
.arrow::before {
  content:'';
  width:80%;
  height:2px;
  position:absolute;
  top:50%;
  right:0;
  transform:translateY(-50%);
  background:#fff
}




.bottom_site_map {background-color:#fff; box-shadow:3px 3px 14px rgba(0,0,0,.12);  width:100%; margin-top:80px; display:inline-block;  z-index:99; position:relative;   }
.bottom_site_map div ul {width:25%; padding:28px 30px;   }
 
.bottom_site_map div ul li {color:rgba(255,255,255,.8); text-align:center;   font-size:15px; font-weight:300;  padding-bottom:4px} 
.bottom_site_map div ul li:last-child {padding-bottom:0; } 
.bottom_site_map div ul li.li_tit {font-size:1.15em; color:#111;  font-weight:500; padding-bottom:15px}
.bottom_site_map div ul li img {width:100%}
.bottom_site_map div ul li a {color:#333  }
.bottom_site_map div ul li a:hover {  text-decoration:underline }

 

.up_btn   { position: fixed; z-index:999999999;  right:20px; bottom:130px; display: flex; align-items: center; justify-content: center; width:85px; height:85px;   background-color: #fff; border-radius: 10px; box-shadow: 0 0 15px 0 rgba(0,0,0,0.15); cursor: pointer; }
.up_btn svg { width: 35%; height:35%; object-fit: contain; transition: transform 0.3s, fill 0.3s; }
.up_btn2   { position: fixed; z-index:999999999;  right:20px; bottom:230px;   display: flex; flex-direction:column; align-items: center; justify-content: center; width:85px; height:85px;   background-color:var(--main_c); color:#fff; border-radius: 10px; box-shadow: 0 0 15px 0 rgba(0,0,0,0.15); cursor: pointer; }
 
footer {width:100%; background-color:#fff; display:inline-block;  font-size:14.5px;  font-weight:300;  padding:43px 0 50px 0; box-sizing:border-box; line-height:1.4;   color:#444 }
footer h2 {margin-bottom:10px; font-size:1.2em;  }
footer .top_link {width:60px;  line-height:60px; background-color:#ffa00b; text-align:Center; font-size:1rem; display:inline-block; color:#fff; margin-right:4%;  float:right; }
footer div {  padding:0 4%; box-sizing:border-box; width:100%; display:inline-block  }
footer b {font-weight:500; color:#222}
 

a.basic_btn {border:1px solid var(--main_c); font-size:18px; color:var(--main_c); border-radius:50px;  padding:11px 50px; display:inline-block}
a.basic_btn2 {background-color: var(--main_c); font-size:18px; color:#fff; border-radius:50px;  padding:11px 50px; display:inline-block}

 
.board * {transition: all 0.3s ease-out; word-break: normal}

.board ul.flex {width:100%; flex-wrap:wrap;  gap:30px 30px}
.board ul.flex li {width:calc(33% - 17px);   position:relative; cursor:pointer }
.board ul.flex li img {width:100%;   }
.board ul.flex li .img {position:relative;  overflow:hidden; cursor:pointer;/*   box-shadow:3px 3px 10px rgba(0,0,0,.1); */}
.board ul.flex li span {z-index:999;   position:absolute; left:20px; top:20px; background-color:var(--main_c);  color:#fff; border-radius:5px; padding:7px 20px; display:inline-block; font-size:16px}

.board ul.flex li  div.img_bg {width:100%; height:100%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);   }
.board ul.flex li:hover  div.img_bg {border:1px solid red; width:115%; height:115%}
 

.board ul.flex li h5 {font-size:1.2em; color:#222; font-weight:400; margin-bottom:10px; overflow: hidden;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-line-clamp: 1;
			-webkit-box-orient: vertical;
			word-wrap: break-word; 
			}
.board ul.flex li h5  b {font-weight:700}
.board ul.flex li .text { margin-top:20px; box-sizing:border-box; color:#666; font-size:15px;    box-sizing:border-box;}
.board ul.flex li p + p {font-size:15px; letter-spacing:0;  color:#999; font-weight:200}


.contactus {/*  box-shadow:2px 2px 5px rgba(0,0,0,.1);   */ background-color:#fff; position:relative }
.contactus .link {width:100%; height:33%; transition: all 0.3s ease-out;  display:flex;   position:relative; z-index:99;  cursor:pointer;  align-items:center; justify-content:flex-start; gap:10px; padding:0 15px; box-sizing:border-box  }
/* .contactus .link:hover {background-color:red; color:#fff}
 */ 
.contactus .link .icon {font-size:20px; flex-shrink:0; width:40px; height:40px;   display:flex;    justify-content: center;   align-items: center; background-color:var(--main_c); border:1px solid var(--main_c); color:#fff; border-radius:50%; transition: all 0.1s ease-out; }
/*   .contactus .link:after {content:''; width:70%; height:1px; background-color:red; position:absolute; left:15%; bottom:0}
  .contactus .link:last-child:after {display:none}
   */
.contactus h3.tit {font-size:3.5em; margin-bottom:20px;  line-height:1.1; font-weight:600 }
.contactus .right_box {width:100%; padding:70px 10px  }
.contactus .right_box ul {width:100%; display:flex; flex-wrap:wrap;  gap:10px}
.contactus .right_box ul li {width:100%; display:flex; align-items:center;  }
.contactus .right_box ul li:nth-child(2n) {margin-left:auto}
.contactus .right_box ul li input { height:50px; padding:10px; box-sizing:border-box; border:none;  color:#333; background-color:#fff; 
font-size:15px}
.contactus .right_box ul li input::placeholder {color:#333}
.contactus .right_box form {position:relative; z-index:99}
.contactus .right_box ul li label {margin-right:10px}
.contactus .right_box ul li.li_100 {width:100%}
.contactus .right_box  textarea {width:100%; font-size:15px; height:150px; padding:10px; box-sizing:border-box; border:none;  color:#111; background:rgba(255,255,255,1);  }

.contactus .check_div input {margin-right:5px}

.check_div {width:100%; display:flex; align-items:center;   font-size:17px; }
.check_div a {margin-left:auto; color:#111; border:1px solid #111;   padding:8px 25px; font-size:15.5px; transition: all 0.3s ease-out;}