@charset "utf-8";
/* ********************************************************************
 * name : 동아대학교 고기능성밸브 기술지원센터
 * filename : base.css
 * author : JBieN 제이비엔
 * update : 2026-06-30
********************************************************************* */

@font-face {
  font-family: "Pretendard Variable";
  src: url("fonts/pretendard/PretendardVariable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Outfit";
  src: url("fonts/outfit/Outfit-VariableFont_wght.woff2") format("woff2"),
       url("fonts/outfit/Outfit-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  min-width: 320px;
  font-size: 15px;
  line-height: 1.5;
  scroll-behavior: auto;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,div,span,applet,object,iframe,p,blockquote,pre,a,abbr,acronym,
address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,
sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,
caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,
figcaption,footer,header,hgroup,main,menu,nav,output,ruby,section,summary,time,
mark,audio,video,h1,h2,h3,h4,h5,h6,button,input,textarea,select { margin: 0; padding: 0; }

body {
  min-width: 320px;
  font-family: "Outfit", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-weight: 400;
  word-break: keep-all;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section { display: block; }
ol,ul,li { list-style: none; }
table { width: 100%; border-collapse: collapse; border-spacing: 0; }
caption { overflow: hidden; width: 1px; height: 1px; font-size: 0; line-height: 0; white-space: nowrap; }
fieldset,img,button { border: 0; }
img,picture,video,canvas,svg { display: block; max-width: 100%; }
img { height: auto; vertical-align: top; }
address,em { font-style: normal; }
strong,b { font-weight: 700; }
button,input,textarea,select { font: inherit; color: inherit; background: transparent; }
button,input[type="button"],input[type="submit"],input[type="reset"] { cursor: pointer; }
button:disabled,input:disabled { cursor: default; }
textarea { overflow: auto; resize: vertical; }
select { border-radius: 0; }
button, a { color: #75757B; text-decoration: none; transition: all 0.5s ease; }
a:focus,button:focus,input:focus,textarea:focus,select:focus { outline: none; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline: 2px solid var(--main-color); outline-offset: 3px; }
hr { display: block; height: 1px; border: 0; background: var(--line-color, #e6e9ef); }
button:hover img, a:hover img { transition: all 0.5s ease; }

h1,h2,h3,h4,h5,h6 { font-size: inherit; font-weight: inherit; line-height: inherit; }
p { line-height: inherit; }
sub,sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }

/* ===============================================
   접근성 숨김 유틸리티
   - .blind와 .srOnly는 기능이 완전히 동일했기 때문에 .blind 하나로 통일
   - .cf와 .clearfix도 동일 사유로 .clearfix 하나로 통일
=============================================== */
.blind,
.hidden,
.sound_only{
  position: absolute !important;
  overflow: hidden !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.skipLink {
  position: absolute;
  left: 12px;
  top: -50px;
  z-index: 99999;
  padding: 10px 14px;
  border-radius: 8px;
  background: #fff;
  color: #000;
  font-size: 14px;
}
.skipLink:focus { top: 12px; }

.clearfix::after { content: ""; display: block; clear: both; }

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
input[type="url"],
textarea,
select {
  width: 100%;
  border: 1px solid #eee;
  background: #fff;
  color: #222;
}

input::placeholder,
textarea::placeholder { color: #aaa; }

*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-thumb { background-color: var(--main-color); border-radius: 999px; }
*::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.06); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* 팝업레이어 */
#hd_pop {z-index:10000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops img {max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject {background:#000;text-align:left}
.hd_pops_footer .hd_pops_close {background:#393939;position:absolute;top:0;right:0}

@media all and (max-width:1024px){
	.hd_pops {left: 50% !important;transform: translateX(-50%);}
}

@media all and (max-width:640px){
	.hd_pops{width: 90% !important;height: auto !important;}
	.hd_pops_con {width: 100% !important;height: auto !important;}
	.hd_pops_con p{}
	.hd_pops img{width:100%;}
}