@font-face {
    font-family: 'RIDIBatang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.0/RIDIBatang.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face{
font-family: "210 SupilMyeongjo";
src:url('210supil/210supil020.eot');
src:local(※),
	url('210supil/210supil020.woff') format('woff');
}

@font-face{
font-family: "210 Gulim";
src:url('210gulim/210gulim.eot');
src:local(※),
	url('210gulim/210gulim.woff') format('woff');
}

html {
  scroll-behavior: smooth;
}

* {
  list-style: none!important
}

h1, h2, h3, h4 {
  font-weight: bold!important
}

p {
  font-family: "210 Gulim"
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body, img {
  animation: fadein 2000ms ease-out;
  -moz-animation: fadein 2000ms ease-out; /* Firefox */
  -webkit-animation: fadein 2000ms ease-out; /* Safari and  Chrome */
  -o-animation: fadein 2000ms ease-out; /* Opera */
}

@keyframes fadein {
  from {opacity:0;}
  to {opacity:1;}
}
@-moz-keyframes fadein { /* Firefox */
  from {opacity:0;}
  to {opacity:1;}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
  from {opacity:0;}
  to {opacity:1;}
}
@-o-keyframes fadein { /* Opera */
  from {opacity:0;}
  to {opacity: 1;}
}


/*scrollbar*/
::-webkit-scrollbar {
  width: 8px;  /* 세로축 스크롤바 길이 */
  height: 8px;  /* 가로축 스크롤바 길이 */
}
::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}
::-webkit-scrollbar-track-piece {
  background-color: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #999;
}
::-webkit-scrollbar-button {
  background-color: #f1f1f1;
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-button:start {
  background-color: #f1f1f1; /* Top, Left 방향의 이동버튼 */
}
::-webkit-scrollbar-button:end {
  background-color: #f1f1f1; /* Bottom, Right 방향의 이동버튼 */
}
::-webkit-scrollbar-button:vertical:increment {
}
::-webkit-scrollbar-button:vertical:decrement {
}
::-webkit-scrollbar-corner {
  background-color: #f1f1f1; /* 우측 하단의 코너 부분 */
}

.ftco-section {
  background-repeat: no-repeat!important;
  background-size: cover!important
}

.masthead {
  background-size: cover!important;
  background-position: center center!important;
  background-repeat: no-repeat!important;
  height: 100vh;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  margin-top: 0!important
}

.masthead2 {
  background-image: url('../images/bg_1_m.png');
  background-size: cover!important;
  background-position: center center!important;
  background-repeat: no-repeat!important;
  height: 50vh;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  align-items: center!important
}

.btn, .download, .download2{
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

  .download {
    border: solid 2px #01bbd2;
    padding: 1rem 1rem .5rem 1rem;
    border-radius: .5rem;
    color: #01bbd2;
  }
  .download:hover {
    background: #01bbd2;
    /*background: linear-gradient(135deg, #29f19c, #02a1f9);
    border: solid 2px #fff;*/
    color: #fff;
  }
  .btn-sky {
    background-color: #01bbd2!important;
    color: #fff;
  }
  .btn-sky:hover {
    background-color: #007ba9!important;
    color: #fff;
  }
  .btn-darkblue {
    background-color: #4c65a2;
    color: #fff;
  }
  .btn-darkblue:hover {
    background-color: #081535;
    color: #fff;
  }
  .download2 {
    border: solid 2px #4c65a2;
    padding: 1rem 1rem .5rem 1rem;
    border-radius: .5rem;
    color: #4c65a2;
  }
  .download2:hover {
    background-color: #4c65a2!important;
    /*background-image: linear-gradient(135deg, #09bbfe, #5a42ec);
    border: solid 2px #fff;*/
    color: #fff;
  }


    @media (max-width: 993px){
      #myTab {
        display: none
      }
      .card {
        font-size: 90%
      }
      .card-header {
        padding: .5rem 1.25rem .5rem 1.25rem;
      }
    }
    @media (min-width: 992px){
      #myTab2 {
        display: none
      }
    }

    .ftco-footer img {
    transition: all .2s ease
    }
    .ftco-footer img:hover {
      opacity: .75
    }
