@font-face {
    font-family: 'MaplestoryOTFBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/MaplestoryOTFBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

:root {
  --main_c1 : #ed6751;
}
:root {
  --main_c2 : #40b374;
}
:root {
  --main_c3 : #3fbacb;
}  

:root {
  --main_c4 : #EE8C9C;
}  

:root {
  --main_c5 : #654195;
}

.inner {width:100%;   max-width:1300px;  margin:0 auto; }

.fa-classic,.fa-regular,.fa-solid,.far,.fas {  font-family: "Font Awesome 6 Free" !important}


.flex {display:flex}
.js {justify-content:space-between; }
.t_color1 {color:#17355f}
.p_t {font-family: 'MaplestoryOTFBold';}
.p_t  * {font-family: 'MaplestoryOTFBold';}


a.basic_btn {width:200px; line-height:55px; display:flex; box-sizing:border-box; padding:0 20px; align-items:center;  justify-content:space-between; font-size:19px; border-radius:50px; background-color:#F89B41; color:#fff;  transition: all 0.3s ease-out;}
a.basic_btn:hover {background-color:var(--main_c5)}
a.basic_btn:after {  content: "\f101"; font: var(--fa-font-solid);}


@media screen and (max-width:1300px){
  .inner {padding:0 4%; box-sizing:border-box}
  .inner img {max-width:100%}


}

@media screen and (max-width:640px){
  .flex {flex-wrap:wrap}


}