
body {height:100%;  }
html {height:100%}

 

#wrap {height:100%; position:relative; width:100%;   display:inline-block; }
.in {width:100%; margin:0 auto;   max-width:1300px;  }
.in2 {width:100%; margin:0 auto;   max-width:1550px;  }

@media all and (max-width:1500px) {
	  .in2 {padding:0 4%; box-sizing:border-box  }
 
}


@media all and (max-width:1300px) {
	  .in {padding:0 4%; box-sizing:border-box  }
 
}

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

header {height:90px;  position:fixed; z-index:99999; width:100%;  display:flex; align-items:center;  transition: all 0.3s ease-out;}
header * { transition: all 0.3s ease-out; }
header .flex.in {align-items:center;  box-sizing:border-box; padding:0 3.5%; max-width:100%; }
header h1 {width:200px; line-height:0}
header ul {width:1100px;  display:flex; align-items:center;  justify-content:flex-end;  }
header ul li {font-size:21px;  width:16.66666%; font-weight:500;  text-align:center; position:relative; color:#fff}
header ul li:last-child {padding-right:5px}
header ul li:after {content:' '; width:3px; height:3px; background-color:#fff;  position:absolute; right:-1px; top:50%;   transform:translateY(-50%);
  }
header ul li:last-child:after {display:none}

 

header div.drop_menu {overflow:hidden;   width:100%; position:absolute; background-color:#fff;  z-index:999;  top:90px; left:0; box-sizing:border-box; height:0;  }
header ul:hover div.drop_menu  {height:auto }
header div.drop_menu:after {content:''; width:100%; height:1px; background-color:#ddd; position:absolute; left:0; top:0; }
header div.drop_menu:before {content:''; width:100%; height:1px; background-color:#ddd; position:absolute; left:0; bottom:0; }
header div.drop_menu ul {width:1100px; border-left:1px solid #ddd;    align-items:stretch; margin-left:calc(3.5% + 200px) }
header div.drop_menu ul li {width:100%; border-right:1px solid #ddd; font-size:16px; font-weight:500;  padding:25px 0 }
  
header div.drop_menu ul li a {width:100%; color:#222; font-weight:300;  margin-bottom:7px; display:inline-block; text-align:center }
header div.drop_menu ul li a:hover {text-decoration:underline}
header div.drop_menu ul li:after {display:none}

header div.last_div {gap:30px; margin-left:auto;}
header div.lang {border:1px solid #fff; padding:10px 20px; border-radius:50px;}
header div.lang a {color:#fff;  display:flex;  align-items:center; justify-content:flex-end; gap:6px; }
header div.lang a span {font-size:15px; line-height:1}

header div.call {color:#fff}
header div.call b {font-weight:800;   display:block; line-height:1; letter-spacing:0; font-size:21px}
header div.call span {  font-weight:300;  margin-top:5px;  display:block; line-height:1; letter-spacing:0; font-size:15px}
header div.call .call_icon {width:40px; border-radius:50%; margin-right:10px;  height:40px; display:flex; align-items:center; justify-content:center;    font-size:20px; }
header div.call:hover .call_icon { background-color: var(--main_c); color:#fff}

header p.ham {  width:35px; height:35px;   align-items:center; justify-content:center; color:#fff; display:none }


header:hover {background-color:#fff}
header:hover ul li { color:#111}
header:hover div.call {color:#111}
header:hover div.lang {border:1px solid #111;  }
header:hover div.lang a {color:#111;  }
header:hover ul li:after { background-color:#555;  }

header.over {background-color:#fff}
header.over ul li { color:#111}
header.over div.call {color:#111}
header.over div.lang {border:1px solid #111;  }
header.over div.lang a {color:#111;  }
header.over ul li:after { background-color:#555;  }
header.over p.ham {color:#333 }


@media all and (max-width:1400px) {
		header {height:65px}
		header h1 {width:100px; }
      
		header ul {display:none}
		header p.ham {display:flex}
}


 @media all and (max-width:900px) {
	  header div.call {display:none}
	  header div.drop_menu {display:none}

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



 
.fixed_q { position:fixed; right:25px; bottom:150px;  transition: all 0.6s ease-out; display:flex; flex-direction:column; gap:12px; text-align:center; z-index:9999999999}
 
.fixed_q a div { color:#fff; width:60px; height:60px; display:flex; align-items:center; justify-content:center;  z-index:9999; font-size:15px; color:#555; box-sizing:border-box;  background-color:red; border-radius:50%; transition: all 0.1s ease-out; }
.fixed_q a div img {width:40px}
.fixed_q a div  i {color:#fff; font-size:25px}
.fixed_q .insta div { 
   background: #833ab4; /* 보라색 (호환성을 위한 단색 설정) */
  background: linear-gradient(45deg, #405de6, #5851db, #833ab4, #c13584, #e1306c, #fd1d1d);

} 
.up_btn {width:60px; height:60px; display:flex; align-items:center; justify-content:center; box-shadow:2px 2px 10px rgba(0,0,0,.15);  border-radius:50%;  position:fixed; right:25px; bottom:70px; background-color:#fff; z-index:9999999999}

.m_plus {display:none}

 @media all and (max-width:900px) {
  .up_btn {width:40px; height:40px; right:10px; bottom:50px}
  .fixed_q { right:10px; height:0; overflow:hidden; gap:8px}
  .fixed_q.over { right:10px; height:auto }
  .fixed_q a div  {width:40px; height:40px}
  .fixed_q a div i {font-size:17px}
  .fixed_q a div img {width:25px}


  .m_plus {width:40px; height:40px; display:flex; align-items:center; justify-content:center; box-shadow:2px 2px 10px rgba(0,0,0,.15);  border-radius:50%;  position:fixed; right:10px; bottom:100px; background-color:#fff; z-index:9999999999; font-size:23px}
 
}
.logo-slider2 {
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
  background: #fff;
 }

.logo-slider2 .logo-track {
  display: flex;
  width: calc(280px * 27);
  animation: scroll-left 50s linear infinite;
}

.logo-slider2 .logo-slide {
  display: flex;
  gap:10px;
   

}
.logo-slider2 .logo-slide p {  box-sizing:border-box; padding:20px; width:280px; height:100px; gap:10px;  display:flex;   align-items:Center; justify-content:center;   }
.logo-slider2 .logo-slide img {
	max-width:90%; 
	max-height:90%; 
	object-fit: contain;
	transition: all 0.3s ease;
 }

 

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}




.logo-slider2.type2  .logo-slide div {box-sizing:border-box; padding:0; width:300px; height:250px;  display:flex;   align-items:Center; justify-content:center; flex-direction:column;}
.logo-slider2.type2 .logo-track {width: calc(300px * 9); animation: scroll-left 20s linear infinite; }

@media all and (max-width:900px) {
 
	.logo-slider2 .logo-track { width: calc(250px * 27); }
	.logo-slider2.type2 .logo-slide div {width:250px; gap:10px}
	.logo-slider2.type2 .logo-slide div img {width:70%}
	.logo-slider2.type2 .logo-track {width: calc(250px * 9); }

}


.acodian {width:100%; box-shadow: 3px 3px 6px rgba(0, 0, 0, .05);}
.acodian +  .acodian {margin-top:15px; }
.acodian dt {cursor:pointer; width:100%; display:flex; align-items:center; background-color:#fff; box-sizing:border-box; padding:20px 40px 20px 40px; border-radius:5px; font-size:18px;  color:#000; font-weight:400;  }
.acodian dt i {margin-left:auto; font-size:23px;  transition: all 0.3s ease-out;}
.acodian.on dt   {border-radius:10px 10px 0 0;  }
.acodian.on dt i {transform: rotate(180deg);   }
.acodian dd { height:0; overflow:hidden; opacity:0;  transition: all 0.2s ease-out; background-color:#f9f9f9; border-top:none;  width:100%;   box-sizing:border-box;  padding:0 40px 0 40px  }

.acodian.on dd {  height:auto; opacity:1; padding:30px 40px 30px 40px }
.acodian dd div {width:100%}
.acodian dd * { word-break: break-all;}
.acodian dd table td {background-color:#fff }
.acodian dd img {max-width:100%}
 
.acodian span:first-child {width:50px; line-height:1;  flex-shrink:0; color:var(--main_c); font-size:25px; font-weight:600}

@media all and (max-width:900px) {
		.acodian {}
		.acodian dt { padding:20px; font-size:1.05em}
		.acodian dd { padding:0 20px}
		.acodian.on dd { padding:20px; }
		.acodian dd  div.flex { flex-wrap:nowrap }
		.acodian span:first-child  {width:30px; font-size:20px}
}



.status {position:relative; padding-top:100px}
.status  .in {position:relative; z-index:99}

.status .logo-slider {
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
 
 }

.status .logo-slider .logo-track {
  display: flex;
  width: calc(340px * 11);
  animation: scroll-left 20s linear infinite;
}

.status .logo-slider .logo-slide {
  display: flex;
  gap: 40px;
   

}
.status .logo-slider .logo-slide p { box-sizing:border-box;  width:300px; height:419px;  display:flex; align-items:Center; justify-content:center}
.status .logo-slider .logo-slide img {  width:100%;  object-fit: contain; transition: all 0.3s ease; }

 

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}


 @media all and (max-width:900px) {
		.status .logo-slider .logo-slide p {width:200px; height:319px}
		.status .logo-slider .logo-track { width: calc(200px * 11); }
}


footer {width:100%; background-color:#fff; border-top:1px solid #ddd;  display:inline-block;  font-size:15px;  font-weight:300;  padding:43px 0 50px 0; box-sizing:border-box; line-height:1.5;   color:#444 }
footer .in {align-items:center; gap:40px}
footer h2 {margin-bottom:10px;   }
footer div div {  box-sizing:border-box; width:100%; display:inline-block  }
footer div + p {margin-left:auto}
footer b {font-weight:500; color:#222}
footer p.copy {color:#666; font-size:15.5px}


@media all and (max-width:900px) {
  footer h2 img {width:100px}
  footer .in {gap:20px}
  footer div + p {margin-left:0}


}
 


   