:root {
  --bs-border-radius: 0.275rem;
  --theme-color:#1c3f95;
  --border-color:#dadce0;
  --border-radius:8px;
  --box-padding:24px;
  --box-small-padding:24px;
}

@media (max-width: 769px) {
  :root {
    --box-small-padding:12px;
  }
}


* { font-family:'Noto Sans KR', '맑은 고딕', 'Source Sans Pro', 'Roboto Condensed', 'Nanum Gothic','Noto Sans KR', 'Noto Sans', sans-serif; }

body { padding:20px 0px; background-color: rgb(230, 241, 240);}
img { max-width:100%; }
.header { background:var(--theme-color); margin-bottom:20px; position:relative; border-radius:var(--border-radius); display:flex;align-items: center !important; padding:30px 10px; }
.header .logo { display: inline-block; width:200px; padding:10px 20px; }
.header h1 { text-align:center; color:#86efff; font-size:1.2em; line-height:1.6; font-weight:600; }
.header.bg { background:url('../images/science_bg.jpg') center center no-repeat; background-size:cover; }

@media (max-width: 769px) {
  .header { display:block; text-align:center; padding:10px 10px;}
  .header .logo { margin-bottom:10px; }
  .header .logo img { max-height:80px; }
}

.btn {
  --bs-btn-padding-x: 2rem;
}

.smallpadding .btn {
  --bs-btn-padding-x: 1rem;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #1c3f95;
  --bs-btn-border-color: #1c3f95;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0b5ed7;
  --bs-btn-hover-border-color: #0a58ca;
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0a58ca;
  --bs-btn-active-border-color: #0a53be;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #1c3f95;
  --bs-btn-disabled-border-color: #1c3f95;
}

.btn-box { display:flex; gap:10px; justify-content: center !important; margin-top:20px; }

.inner-content p:last-child { margin-bottom:0; }
.footer { margin-top:50px; text-align:center; font-size:0.8em; }

input::placeholder {
  color: #888;        /* placeholder 글자 색상 */
  font-size: 14px;    /* placeholder 글자 크기 */
}

.required { display:inline-block; margin-left:5px; color: #d0021b; }

.choice-box {
  display:flex;
  gap:20px;
}
@media (max-width: 769px) {
  .choice-box {
    gap:10px;
  }
}

.choice-box .btn {
  min-height:100px;
  width:100%;
}

.choice-box .btn i {
  display:block;
  font-size:2em;
}

.guide .inner-content {
  background-color: #fff;
  border: 1px solid var(--border-color);
  border-radius:var(--border-radius);
  margin-bottom: 12px;
  padding: var(--box-padding);
  position: relative;
}

.guide .inner-content p:last-child { margin-bottom:0; }


.top-edge-box .inner-content {
  background-color: #fff;
  border-left: 1px solid var(--border-color);
  border-right: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
  margin-bottom: 12px;
  padding: var(--box-padding);
  position: relative;
}

.top-edge-box .inner-content.smallspace {
  padding: var(--box-small-padding) !important;
}

.top-edge-box .top-edge {
  background-color: var(--theme-color);
  border-top-left-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
  height: 10px;
}

.top-edge-box .top-edge.danger {
  background-color: var(--bs-danger);
}

.top-edge-box .top-edge.warning {
  background-color: var(--bs-warning);
}



.top-edge-box .inner-content p:last-child { margin-bottom:0; }

.input-label { font-weight:500; margin-bottom:10px; }

.form-comment {
  font-size: 0.9em;
  margin-top: 5px;
  color: #b50000;
}

.inner-content label { display:block; margin-bottom:5px;  }

.input-box { margin-bottom:30px; }
.text-box { margin-bottom:30px; padding-bottom:5px; border-bottom:1px solid var(--border-color); }
.text-box:last-child { margin-bottom:0; }
.result-open .text-box {  }
.result-open .text-box .text-bg-warning { margin-top:5px; border-radius:5px; font-weight:400; font-size:0.9em; padding:2px 10px;}

.input-box .form-control {
  border-top:0;
  border-left:0;
  border-right:0;
}

.input-box input[type='text'].form-control,
.input-box input[type='email'].form-control {
  padding-left:0;
  padding-right:0;
}

.input-box .form-control:focus {
  box-shadow: none;
}

.default-box .top-edge {
  border-top-left-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
  background-color: var(--theme-color);
  color: rgba(255, 255, 255, 1);
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  padding: 12px 24px;
}


.default-box .inner-content {
  background-color: #fff;
  border-left: 1px solid var(--border-color);
  border-right: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);

  padding: var(--box-padding);
  position: relative;
}


.input-label { }

.subject-comment { font-size:0.9em; margin:0 0 5px 18px; padding:2px 10px; background-color: var(--bs-info-bg-subtle); border:1px solid var(--bs-info-border-subtle); }

.checkitem { margin:5px 0 5px 18px; border:1px solid #ddd; background-color:#eee; padding:5px; font-size:0.9em;}

.checkoption { margin:5px 0 5px 18px; border:1px solid #ddd; background-color:#eee; padding:5px; display:none; }
.checkoption label { font-size:0.9em; margin-bottom:0; }

.scoretext {
margin:5px 0 5px 18px;
padding:5px; font-size:0.9em;
color: #000 !important;
background-color: RGBA(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important;
}