@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');
@import url('https://fonts.googleapis.com/css2?family=Carter+One&family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap')
@import url("https://cdn.jsdelivr.net/gh/moonspam/NanumBarunGothic@latest/nanumbarungothicsubset.css");
@import url("http://mapoo.net/font/d2coding.css" ) ;

h1, h3, h4, div, p, a, ul, li { font-family: 'GmarketSans', sans-serif; }
h2 { font-family: 'Carter One', sans-serif; }
body, h5, h6, span { font-family: 'NanumBarunGothic', sans-serif; }
code { font-family: 'D2Coding', monospace; }

.footer p, footer a { 
  font-family: 'NanumBarunGothic', sans-serif; 
  font-size: 16px;
}

.wp-block-code code {
    font-family: 'D2Coding', monospace;
}

.top-btn:hover {
  background: #fff;
}

.top-btn a:hover {
  color: #284ADE !important;
  border: 2px solid transparent !important;
}

.g-line {
  max-width: 1200px;
  height: 2px !important;
  background: black;
  margin-top: 50px;
  margin-bottom: 50px;
}

.circle1 {
  width: 68px;
  height: 50px;
  border-radius: 50%;
  background: #284ADE;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  padding-top: 18px;
  font-family: 'GmarketSans', sans-serif;
  margin-left: 70px;
  margin-top: 10px !important;
}

.circle2 {
  width: 68px;
  height: 50px;
  border-radius: 50%;
  background: #284ADE;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  padding-top: 18px;
  font-family: 'GmarketSans', sans-serif;
  margin-left: 70px;
  margin-top: 0px !important;
}

.circle3 {
  width: 68px;
  height: 50px;
  border-radius: 50%;
  background: #284ADE;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  padding-top: 18px;
  font-family: 'GmarketSans', sans-serif;
  margin-left: 70px;
  margin-top: 0px !important;
}

.h-link {
  text-decoration: underline;
  text-underline-offset : 10px;
}

.h-link:hover {
  color: #284ADE;
}

.mt-0 {
  margin-top: 0 !important;
}
.mt-8 {
  margin-top: 8px !important;
}
.mt-10 {
  margin-top: 10px !important;
}
.mt-40 {
  margin-top: 40px !important;
}
.ml-20 {
  margin-left: 20px !important;
}
.mb-10 {
  margin-bottom: 10px !important;
}
.mb-20 {
  margin-bottom: 20px !important;
}
.mb-40 {
  margin-bottom: 40px !important;
}
.mb-100 {
  margin-bottom: 100px !important;
}

.left-intro {
  margin-top: 260px !important;
}

@media (max-width: 767px) {
  .left-intro {
    margin-top: 20px !important;
  }
  .circle1, .circle2, .circle3 {
    margin: 0 !important;
  }
  .mb-20 {
    margin-bottom: 0 !important;
  }
  .mb-40 {
    margin-bottom: 20px !important;
  }
  .mb-100 {
    margin-bottom: 20px !important;
  }
  .mt-40 {
    margin-top: 20px !important;
  }
  .mt-65 {
    margin-top: 20px !important;
  }
}