header {
  width: 100%;
  height: 80px;
  position: fixed;
  z-index: 99;
  top: 0;
}
header .navi {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: background-color 0.4s ease;
  transition: background-color 0.4s ease;
  background-color: rgba(255, 255, 255, 0.801);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(50px);
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
header .gnb {
  width: 1320px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
header .gnb .logoLeft {
  margin-top: 8px;
  width: 160px;
  height: 50px;
  background-image: url(../images/logoWhite.svg);
  background-repeat: no-repeat;
}
header .gnb .depth1UlLeft span {
  font-size: 16px;
  font-weight: 600;
  color: #000;
  text-align: center;
}
header .gnb .depth2UlRight .menuButtonWrap {
  gap: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
header .gnb .depth2UlRight .menuButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40px;
  height: 40px;
  background: url(../images/topMenu.svg) no-repeat center;
}
header .gnb .depth2UlRight span {
  font-size: 14px;
  color: #fff;
  text-align: center;
  cursor: pointer;
}
header .gnb ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 60px;
}
header .gnb ul li {
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
header .gnb ul li.active span, header .gnb ul li:hover span {
  color: #365cb3;
}
header .gnb ul li:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
}
header .gnb .depth1UlLeft span,
header .gnb .depth2UlRight span {
  color: #000;
}
header .gnb .logoLeft {
  background-image: url(../images/logoBlack.svg);
}

.rightNavWrap {
  display: none;
}
.rightNavWrap.active {
  display: block;
}
.rightNavWrap .rightNav {
  position: fixed;
  z-index: 99;
  top: 19%;
  right: 0%;
}
.rightNavWrap .rightNav ul li {
  position: relative;
  width: 150px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.rightNavWrap .rightNav ul li .returnTop {
  font-size: 30px;
  background-color: #1b3b86;
}
.rightNavWrap .rightNav ul li .returnTop:hover {
  background-color: #2b4fa5;
}
.rightNavWrap .rightNav ul li a {
  color: #fff;
  line-height: 1;
  font-size: 14px;
  font-weight: 600;
  background-color: #535353;
  padding: 20px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  white-space: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  width: 60px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.rightNavWrap .rightNav ul li a.moveA svg {
  width: 40px;
  height: 40px;
  fill: #fff;
  background-position: center;
  background-repeat: no-repeat;
}
.rightNavWrap .rightNav ul li a.moveA svg.intro {
  background-image: url(../images/introIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.schedule {
  background-image: url(../images/scheduleIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.subcom {
  background-image: url(../images/subcomIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.active {
  background-image: url(../images/activeIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.donate {
  background-image: url(../images/donateIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.board {
  background-image: url(../images/boardIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA svg.donationStatus {
  background-image: url(../images/donationStatusIcon.svg);
}
.rightNavWrap .rightNav ul li a.moveA span {
  color: #fff;
  display: none;
}
.rightNavWrap .rightNav ul li a.moveA:hover {
  width: 150px;
  background-color: #1b3b86;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.rightNavWrap .rightNav ul li a.moveA:hover span {
  display: block;
}

footer {
  width: 100%;
  background-color: #333;
}
footer .footerBottom {
  background-color: #292929;
}
footer .footerBottom .copyright {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 20px 0;
}
footer .footerBottom .copyright span {
  color: #999;
  font-weight: 300;
  font-size: 14px;
}
footer .footerContents .footerLinkWrap {
  max-width: 1320px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 30px 0;
}
footer .footerContents .footerLinkWrap .footerMiddle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
footer .footerContents .footerLinkWrap .footerMiddle .teamLogo {
  width: 150px;
  height: 50px;
  background-image: url(../images/logoWhite.svg);
  background-repeat: no-repeat;
  background-position: center;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo {
  margin-top: 20px;
  color: #999;
  font-size: 14px;
  text-align: center;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li {
  position: relative;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li a, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li a {
  color: #ebebeb;
  font-size: 16px;
  text-decoration: underline;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li a:hover, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li a:hover {
  color: #fff;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li:first-child span::before, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li:first-child span::before {
  display: none;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li:first-child a::before, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li:first-child a::before {
  display: none;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li span, footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li a, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li span, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li a {
  display: block;
  margin: 0 0 10px 10px;
  padding-left: 10px;
}
footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li span::before, footer .footerContents .footerLinkWrap .footerMiddle .locationInfo ul li a::before, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li span::before, footer .footerContents .footerLinkWrap .footerMiddle .anotherHpinfo ul li a::before {
  content: "";
  position: absolute;
  top: 10%;
  left: 10px;
  width: 1px;
  height: 16px;
  background-color: #585858;
}
footer .footerContents .footerLinkWrap .LinkWrap ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 30px;
}
footer .footerContents .footerLinkWrap .LinkWrap ul li a {
  color: #fff;
  font-size: 16px;
}

.topSection {
  width: 100%;
  min-height: 250px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
}
.topSection .bgDeco .rightDeco {
  position: absolute;
  z-index: -1;
  right: 56px;
  top: 250px;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
}
@-webkit-keyframes floatUpDown1 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-14px);
            transform: translateY(-14px);
  }
}
@keyframes floatUpDown1 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-14px);
            transform: translateY(-14px);
  }
}
@-webkit-keyframes floatUpDown2 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
}
@keyframes floatUpDown2 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
}
@-webkit-keyframes floatUpDown3 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-25px);
            transform: translateY(-25px);
  }
}
@keyframes floatUpDown3 {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-25px);
            transform: translateY(-25px);
  }
}
@-webkit-keyframes floatImage {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-18px);
            transform: translateY(-18px);
  }
}
@keyframes floatImage {
  0%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-18px);
            transform: translateY(-18px);
  }
}
.topSection .bgDeco .rightDeco .circle1 {
  position: absolute;
  background-color: #0d1c3d;
  width: 380px;
  height: 380px;
  top: -390px;
  left: -421px;
  border-radius: 50%;
  -webkit-animation: floatUpDown1 9s ease-in-out infinite;
          animation: floatUpDown1 9s ease-in-out infinite;
}
.topSection .bgDeco .rightDeco .circle1::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: rgba(24, 67, 131, 0.231372549);
  z-index: 1;
}
.topSection .bgDeco .rightDeco .circle1.intro {
  background: url(../images/intromain.jpg) center/cover;
  position: relative;
}
.topSection .bgDeco .rightDeco .circle1.donate {
  background: url(../images/donateMainPic.jpg) center/cover;
  position: relative;
}
.topSection .bgDeco .rightDeco .circle1.schedule {
  background: url(../images/notice.jpg) center/cover;
  position: relative;
}
.topSection .bgDeco .rightDeco .circle1.subcommittee {
  background: url(../images/subcommittee.jpg) center/cover;
  position: relative;
}
.topSection .bgDeco .rightDeco .circle1.membership {
  background: url(../images/membership.jpg) center/cover;
  position: relative;
  right: 10px;
}
.topSection .bgDeco .rightDeco .circle1.notice {
  background: url(../images/schedule.jpg) center/cover;
  position: relative;
  right: 10px;
}
.topSection .bgDeco .rightDeco .circle1.donationStatus {
  background: url(../images/donationStatus.jpg) center/cover;
  position: relative;
  right: 10px;
}
.topSection .bgDeco .rightDeco .circle2,
.topSection .bgDeco .rightDeco .circle3 {
  position: absolute;
  border-radius: 50%;
  opacity: 0.2;
}
.topSection .bgDeco .rightDeco .circle2 {
  background-color: #97598f;
  width: 80px;
  height: 80px;
  top: -284px;
  left: -462px;
  z-index: 1;
  -webkit-animation: floatUpDown2 4s ease-in-out infinite;
          animation: floatUpDown2 4s ease-in-out infinite;
}
.topSection .bgDeco .rightDeco .circle3 {
  background-color: #b2c0ff;
  width: 150px;
  height: 150px;
  top: -142px;
  left: -135px;
  -webkit-animation: floatUpDown3 5s ease-in-out infinite;
          animation: floatUpDown3 5s ease-in-out infinite;
}
.topSection .bgDeco .rightDeco .bgDecoImg {
  position: absolute;
  top: -83px;
  left: -183px;
  -webkit-animation: floatImage 7s ease-in-out infinite;
          animation: floatImage 7s ease-in-out infinite;
}
.topSection .bgDeco .leftLogo {
  position: absolute;
  width: 400px;
  height: 400px;
  top: -45px;
  left: -64px;
  z-index: -1;
  opacity: 0.1;
  display: none;
}
.topSection .sectionInfoWrap {
  min-width: 1320px;
  gap: 80px;
  padding-bottom: 10px;
}
.topSection .sectionInfoWrap .titleInfo {
  display: none;
}
.topSection .sectionInfoWrap .menuTabWrap {
  margin-top: 155px;
}
.topSection .sectionInfoWrap .menuTabWrap ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.topSection .sectionInfoWrap .menuTabWrap ul li {
  padding-right: 50px;
}
.topSection .sectionInfoWrap .menuTabWrap ul li a {
  font-size: 22px;
  color: #bbb;
  font-weight: 600;
  -webkit-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}
.topSection .sectionInfoWrap .menuTabWrap ul li a.active {
  color: #3d3d3d;
  padding-bottom: 6px;
  border-bottom: 3px solid #1b3b86;
}
.topSection .sectionInfoWrap .menuTabWrap ul li a:hover {
  color: #3d3d3d;
}
.topSection .sectionInfoWrap span {
  color: #1b3b86;
  font-weight: 700;
  font-size: 24px;
}
.topSection .sectionInfoWrap h4 {
  font-size: 18px;
  color: #3d3d3d;
  margin-top: 24px;
  font-weight: 600;
}
.topSection .sectionInfoWrap h1 {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.2;
}
.topSection .sectionInfoWrap h1 span {
  font-size: 44px;
  font-weight: 800;
  letter-spacing: -1px;
  color: transparent;
  background: -webkit-gradient(linear, left top, right top, from(#152c63), to(#4965a7));
  background: linear-gradient(to right, #152c63, #4965a7);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  position: relative;
}
.topSection .sectionInfoWrap h1 span::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  width: 0;
  margin-bottom: -10px;
  background: -webkit-gradient(linear, left top, right top, from(#152c63), to(#4965a7));
  background: linear-gradient(to right, #152c63, #4965a7);
  border-radius: 2px;
  -webkit-animation: underlineSlide 1.5s forwards;
          animation: underlineSlide 1.5s forwards;
}
@-webkit-keyframes underlineSlide {
  to {
    width: 100%;
  }
}
@keyframes underlineSlide {
  to {
    width: 100%;
  }
}

.contentSection {
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.contentSection span {
  color: #1b3b86;
}
.contentSection .firstSection,
.contentSection .thirdSection {
  max-width: 1320px;
  margin: 0 auto;
  padding: 50px 0px;
}
.contentSection .secondSection {
  background-color: #f5f7fa;
  width: 100%;
  padding: 50px 0px;
}
.contentSection .secondSection .contentInner {
  max-width: 1320px;
  margin: 0 auto;
}
.contentSection .contentTitle h2 {
  display: none;
  font-size: 36px;
  font-weight: 700;
  color: #333;
  margin-bottom: 50px;
}
.contentSection .contentTitle h2 span {
  color: #1b3b86;
}
.contentSection .contentTitle .topTitleWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding-bottom: 30px;
  line-height: 1;
}
.contentSection .contentTitle .topTitleWrap .titleLeftText {
  color: #1b3b86;
  font-weight: 700;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  font-size: 20px;
}
.contentSection .contentTitle .topTitleWrap .titleLeftText::after {
  content: "";
  position: relative;
  top: 0;
  width: 92px;
  height: 1px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  background-color: #1b3b86;
}
.contentSection .contentTitle .topTitleWrap .titleRightText {
  color: #1b3b86;
  font-size: 60px;
  font-weight: 700;
  opacity: 0.1;
}
.contentSection .contentMain {
  min-width: 1320px;
  height: auto;
}