@charset "utf-8";
@font-face {font-family: 'S-CoreDream-3Light';src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');font-weight: normal;font-style: normal}
body{margin:0px;padding:0px;font-family: 'S-CoreDream-3Light';font-weight: normal;font-style: normal;font-size:16px;color:#aaa}
input,textarea,select{font-family: 'S-CoreDream-3Light';font-weight: normal;font-style: normal;font-size:14px;}

a{color:#555;text-decoration:none}
a:hover{color:#fff}
.sub_top{width:100%;height:130px;display:block}
/*
.sub_top{width:100%;height:130px;background-image:url('/images/pattern3.png'); background-repeat:repeat; background-attachment:scroll;display:block}
*/

.menu2 > a{color:#aaa;font-size:18px;font-weight:bold;display:block;text-align:center}
.menu2 > a:hover{color:#ffffff}

.bott_line1{font-size:13px;padding:0px 0 0px 0}
.bott_line1 > a{font-weight:bold;color:#888;text-decoration:none}
.bott_line1 > a:hover{color:#fff}

.input_text{margin:3px 0 3px 0;border:1px #ccc solid;border-radius:4px;padding:4px;width:100%;height:32px;font-size:14px}
.input_hp{margin:3px 0 3px 0;border:1px #ccc solid;border-radius:4px;padding:4px;width:50px;height:32px;font-size:14px;text-align:center}

.ibox{font-size:14px;border:1px solid #ccc;border-radius:4px;height:32px;text-align:center;}
.ibox1{font-size:14px;border:1px solid #ccc;border-radius:4px;height:32px;text-align:center;background:#f4f4f4}
.ibox2{font-size:13px;border:1px solid #ccc;border-radius:4px;height:25px;text-align:center;}

.btn0{font-size:12px;border:1px red solid;padding:4px 10px 4px 10px;line-height:30px;background:red;color:#fff;font-weight:bold}
.btn1{font-size:12px;border:1px #ccc solid;padding:4px 10px 4px 10px;line-height:30px;background:#f4f4f4}
.btn2{font-size:12px;border:1px #ccc solid;border-radius:3px;padding:2px 10px 2px 10px;font-weight:bold;margin:0 1px 0 1px;background:#f0fcff}
.btn3{font-size:12px;border:1px #ccc solid;border-radius:3px;padding:2px 5px 2px 5px;margin:0 1px 0 1px;background:#00ffff}
.btn4{font-size:13px;border:1px #ccc solid;padding:4px 8px 4px 8px;color:#333;font-weight:bold}
.btn5{font-size:12px;border:1px #ccc solid;border-radius:3px;padding:2px 5px 2px 5px;margin:0 1px 0 1px;background:yellow;}
.btn6{font-size:12px;border:1px red solid;border-radius:3px;padding:2px 5px 2px 5px;font-weight:bold;margin:0 1px 0 1px;background:red;color:#fff;animation:blink-effect 1s step-end infinite;}
.btn7{font-size:12px;border:1px #b3d465 solid;border-radius:3px;padding:2px 5px 2px 5px;font-weight:bold;margin:0 1px 0 1px;background:#b3d465}
.btn10{font-size:11px;border:1px #b3d465 solid;border-radius:3px;padding:2px 5px 2px 5px;font-weight:bold;margin:0 1px 0 1px;background:#fff}
.btn8{font-size:12px;border:1px #00a0e9 solid;color:#fff;border-radius:3px;padding:2px 5px 2px 5px;font-weight:bold;margin:0 1px 0 1px;background:#00a0e9;}
.btna{font-size:12px;border:1px #ccc solid;padding:4px 10px 4px 10px;line-height:30px;background:#f4f4f4;font-weight:bold}
.btn9{font-size:13px;border:1px #ccc solid;padding:4px 8px 4px 8px;color:#333;font-weight:bold}
.btn9 > a:hover{color:red;font-weight:bold;}
.btn9 > a{text-decoration:none;color:#000;}
.ti{border-radius:5px;background:navy;color:#fff;font-size:18px;font-weight:bold;padding:10px 40px 10px 40px;}
.mbt1{width:250px;background:rgba(0,0,0,.8);color:#fff;position:relative;border:1px #333 solid;border-radius:20px;box-shadow: 0px 0px 30px rgba(255,255,255,.2);right:10px;top:0px;padding:10px 20px 60px 20px;text-align:center;cursor:pointer;animation: slide1 1.5s ease-out forwards;}
.mbt2{width:250px;background:rgba(0,0,0,.8);color:#fff;position:relative;border:1px #333 solid;border-radius:20px;right:240px;top:0px;padding:10px 20px 60px 20px;text-align:center;cursor:pointer;box-shadow: 0px 0px 30px rgba(255,255,255,.2);animation: slide2 1.5s ease-out forwards;}
.mbt3{position:relative;width:1100px;margin:0 auto;background:rgba(0,0,0,.8);color:#fff;border:1px #333 solid;border-radius:20px;box-shadow: 0px 0px 30px rgba(255,255,255,.2);padding:60px;text-align:center;animation: slide3 1.5s ease-out forwards;}
.mbt4{position:relative;width:1100px;margin:0 auto;background:rgba(0,17,29,.8);color:#fff;border:1px #333 solid;border-radius:20px;box-shadow: 0px 0px 30px rgba(255,255,255,.2);padding:60px;text-align:center;animation: slide3 1.5s ease-out forwards;}
.pt_tit1{font-size:40px;color:#fff;margin:100 0 0 0;position:relative;text-shadow: 10px 10px 20px rgba(255,255,255,.3);display:inline-block;transform:translate(-50%, -50%);animation: pt_slide1 1s ease-out forwards;}

@-webkit-keyframes slide1{
	from{left:0px;opacity:0}
	to{left:190px;opacity:1}
}
@-webkit-keyframes slide2{
	from{right:-100px;opacity:0}
	to{right:70px;opacity:1}
}
@-webkit-keyframes slide3{
	from{top:20%;opacity:0}
	to{top:-10%;opacity:1}
}
@-webkit-keyframes pt_slide1{
	from{left:30%;opacity:0}
	to{left:50%;opacity:1}
}

.blink{font-weight:bold;color:red;animation:blink-effect 1s step-end infinite;}
@keyframes blink-effect {50% {opacity: .2;}}

.mbt1a{font-size:11px}
.mbt1b{font-size:22px;font-weight:bold;margin:10px 0 10px 0}
.mbt1c{font-size:15px;margin:10px 0 30px 0;font-weight:bold;opacity:.6}
.ipbox{font-size:14px;border:1px solid #ccc;background:#fff;border-radius:4px;width:100%;height:34px;text-align:center;color:blue;font-weight:bold}

.goBt{background:navy;border:2px solid #555;border-radius:50px;padding:6px 20px 6px 20px;color:white;font-weight:bold;font-size:16px;}
.goBt1{border-radius:50px;padding:6px 12px 6px 12px;color:white;font-weight:bold;font-size:13px;background:#cc0000}
.goBt1 > a{color:white;}
.goBt1 > a:hover{color:yellow;}

.goBt2{border-radius:50px;padding:6px 12px 6px 12px;color:white;font-weight:bold;font-size:13px;background:blue}
.goBt2 > a{color:white;}
.goBt2 > a:hover{color:yellow;}

.go_Btn{border:2px solid #777;border-radius:50px;background:navy;color:white;padding:5px 20px 5px 20px;text-align:center;font-weight:bold;cursor:pointer}
.go_Btn1{border:2px solid #555;border-radius:5px;background:navy;color:white;padding:3px 10px 3px 10px;text-align:center;font-weight:bold;font-size:11px;cursor:pointer;}

.bbtn{width:370px;margin:0 auto;border:5px solid #777;border-radius:50px;padding:10px 0 10px 0;color:white;font-weight:bold;font-size:20px;background:navy;text-align:center}
.bbtn > a{color:white;}
.bbtn > a:hover{color:yellow;}

.tdBd{border:#555 solid 1px;background:#191b2d}
.mbtn{font-size:13px;border:2px solid #777;border-radius:30px;padding:5px 15px 5px 15px;font-weight:bold;background:navy}
.sbtn{border:2px #777 solid;background:navy;border-radius:5px;padding:4px 10px 4px 10px;cursor:pointer;}
.pbtn1{font-size:11px;padding:3px 8px 3px 8px;border:2px solid #777;border-radius:30px;background:navy}
.tbtn{font-size:13px;border:2px solid #777;border-radius:30px;padding:5px 15px 5px 15px;font-weight:bold;background:#23203d}
.gbtn{font-size:13px;border:2px solid #777;border-radius:30px;padding:5px 15px 5px 15px;font-weight:bold;background:navy;color:#fff}
select {
  background-color: #111;   /* 검은 배경 */
  color: #ccc;           /* 밝은 글자색 */
  border: 1px solid #777;   /* 은은한 테두리 */
  padding: 2px 30px 2px 5px;
  border-radius: 4px;
  font-size: 14px;
  appearance: none;         /* 기본 화살표 제거 */
  cursor: pointer;
}

select:focus {
  outline: none;
  border-color: #888;       /* 포커스 시 테두리 강조 */
}

option {
  background-color: #111;   /* 옵션 배경도 동일하게 */
  color: #ccc;
}

input[type="text"],input[type="number"],input[type="password"],input[type="email"] {
  background-color: transparent;   /* 검은 배경 */
  color: #ccc;           /* 밝은 글자색 */
  border: 1px solid #555;   /* 은은한 테두리 */
  padding: 8px 12px;
  border-radius: 5px;
  font-size: 14px;
}

input:focus {
  outline: none;
  border-color: #777;       /* 포커스 시 테두리 강조 */
  box-shadow: 0 0 5px #777; /* 은은한 빛 효과 */
}

::placeholder {
  color: #aaa;              /* 플레이스홀더는 중간 밝기 */
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.tbox{border-top:1px #555 solid;border-bottom:1px #555 solid;padding:5px 5px 5px 5px}
.tbox_title{border-top:1px #777 solid;border-bottom:1px #777 solid;padding:3px 5px 3px 5px;color:#fff}

/* 기본 체크박스 숨기기 */
input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid #777; /* 테두리 */
  width: 14px;
  height: 14px;
  margin:7px 5px 0 0;
  cursor: pointer;
  position: relative;
}

/* 체크 상태 */
input[type="checkbox"]:checked {
  background-color: #00c853; /* 초록색 포인트 */
  border-color: #00c853;
}

/* 체크 표시 */
input[type="checkbox"]:checked::after {
  content: "✔";
  color: white;
  font-size: 12px;
  position: absolute;
  top: -3px;
  left: 2px;
}

textarea {
  width:100%;
  color:#ccc;
  background: transparent;   /* 짙은 검은 배경 */
  border: 1px solid #555;      /* 은은한 테두리 */
  padding: 10px;
  font-size: 14px;
  border-radius: 15px;          /* 모서리 둥글게 */
  overflow-y:auto; 
  resize: none;            /* 세로 크기만 조절 가능 */
  outline: none;               /* 포커스 시 기본 테두리 제거 */
}

textarea:focus {
  border-color: #777;          /* 포커스 시 테두리 강조 */
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.2);
}

textarea::-webkit-scrollbar { width: 10px;}
textarea::-webkit-scrollbar-track { background: #333; border-radius: 5px;}
textarea::-webkit-scrollbar-thumb { background: #555; border-radius: 5px;}
textarea::-webkit-scrollbar-thumb:hover { background: #666; } 

/* 기본 라디오 버튼 숨기기 */
input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  border: 2px solid #777;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  margin:0 7px 0 0;  
  cursor: pointer;
  position: relative;
  transition: border-color 0.3s ease;
}

/* hover 시 테두리 강조 */
input[type="radio"]:hover {
  border-color: #00c853;
}

/* 선택된 상태 */
input[type="radio"]:checked {
  border-color: #00c853; /* 포인트 컬러 */
}

/* 선택된 상태의 안쪽 점 */
input[type="radio"]:checked::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 10px;
  height: 10px;
  background-color: #00c853; /* 포인트 컬러 */
  border-radius: 50%;
}

label {
  cursor:pointer;
  margin:5px 0 0 0;
  line-height: 16px; /* 라디오 버튼 높이와 동일하게 */
  display: inline-flex;
  align-items: center; /* 글자와 버튼을 중앙 정렬 */
}