@charset "utf-8";

table.tBor_1 {width: 100%; max-width: 60rem;}

.pageTitBox {
  background-color: var(--c-secondBG);
  background-position: 50% 50%;
}

#overview table tr td:first-child {text-align: center;}

#procedure {background-color: var(--c-secondBG);}
  #procedure .tBor_1 thead > tr {background-color: #FFF;}

#noMargin .halfBoxes {gap: 3rem;}
  #noMargin .halfBoxes .toHalfImg {
    height: 25rem; border-radius: 0;
    background-position: 50% 100%;
    background-image: url(https://www.aaauhak.co.kr/img/freepik/photo/hoesaeg-e-golib-800x1200.jpg);
  }
    #noMargin table {margin-bottom: 2rem;}

#full-BG {background-size: cover;}
  #full-BG .halfBoxes {flex-direction: column-reverse;}
    #full-BG .tBor_1 thead > tr {background: var(--c-secondBG);}
    #full-BG .tBor_1 tbody > tr {background: #ffffffa1;}

#setsApart .flexBoxes {max-width: 75rem;}
  #setsApart .flexBox {
    align-items: flex-start; justify-content: flex-start;
    width: 100%;
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(0, 110, 184, 0.35);
    box-shadow: 0 4px 10px rgba(0, 110, 184, 0.15);
  }
    #setsApart .flexBox p.wspl {padding: 0; text-align: left;}

#ranking p.wspl {width: fit-content; margin: 0 auto; padding-top: 1rem;}
  #ranking table tr td:first-child {text-align: center;}

@media screen and (min-width: 375px) {
  .tabMenuPanel {gap: 0.25rem;}
}

@media screen and (min-width: 768px) {
  .tabMenuPanel {gap: 0.5rem;}

  #noMargin {padding: 0;}
    #noMargin .halfBoxes {
      flex-direction: row; align-items: center;
      justify-content: flex-end; gap: 1.5rem;
    }
      #noMargin .halfBoxes .toHalfImg {aspect-ratio: 1 / 2;}
      #noMargin .halfBoxes div.toHalfBox {margin: 0; width: calc(50% - 2rem);}
        #noMargin table {margin-bottom: 0;}

    #full-BG .halfBoxes {flex-direction: row;}
      #full-BG .toHalfBox {height: auto;}

  #setsApart .flexBox {width: calc(100% / 2 - 1.125rem);}
}

@media screen and (min-width: 1440px) {
  .tabMenuPanel {gap: 1rem;}
    #noMargin .halfBoxes {justify-content: space-between;}


  #full-BG .frame {max-width: 80rem; padding: 3rem 2rem;}

  #setsApart .flexBox {width: calc(100% / 3 - 1.125rem); padding: 1.5rem;}
    .flexBox h4 {font-size: 1.35rem;}
}