@font-face{font-family:sonamu;src:url(../fonts/a소나무M.ttf) format("truetype")}*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:'Fira Sans', sans-serif}.container{max-width:1600px;margin:0 auto;padding-left:120px;padding-right:120px}@media (max-width: 1024px){.container{padding-left:64px;padding-right:64px}}@media (max-width: 767px){.container{padding-left:32px;padding-right:32px}}section h2{text-align:center;text-transform:uppercase;margin-bottom:12px;font-size:48px;color:#222}section h2 i{color:#ff9fdb}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;display:inline-block;color:white;border:2px solid #ff9fdb;padding:12px 16px;border-radius:3px;text-decoration:none;text-transform:uppercase;font-size:20px;font-weight:700;cursor:pointer;-webkit-transition:all 0.2s;transition:all 0.2s}@media (max-width: 767px){.button{font-size:18px}}.button:hover{color:#ff9fdb;text-decoration:underline}.underline{width:250px;height:1px;background-color:#666;margin:0 auto;margin-bottom:64px}.img{max-width:70%}.progress{position:fixed;width:4px;height:140px;top:40%;left:20px;z-index:9998;border-radius:5px;background:rgba(0,0,0,0.8)}.progress .progressBar{position:absolute;width:4px;height:0;background:#ff9fdb;z-index:9999;border-radius:5px;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out}.loading{display:none;position:absolute;width:100vw;height:100vh;background:#333;z-index:10000;opacity:0.9;text-align:center}.loading span{color:white;font-size:2rem;font-family:'a-light';font-weight:700;-webkit-animation:flash 2s infinite;animation:flash 2s infinite}.loading .loader{font-size:10px;margin:250px auto;text-indent:-9999em;width:20em;height:20em;border-radius:50%;background:#ffffff;background:-webkit-gradient(linear, left top, right top, color-stop(10%, #fff), color-stop(42%, rgba(255,255,255,0)));background:linear-gradient(to right, #fff 10%, rgba(255,255,255,0) 42%);position:relative;-webkit-animation:load3 1.4s infinite linear;animation:load3 1.4s infinite linear;-webkit-transform:translateZ(0);transform:translateZ(0)}.loading .loader:before{width:50%;height:50%;background:#ffffff;border-radius:100% 0 0 0;position:absolute;top:0;left:0;content:''}.loading .loader:after{background:#333;width:75%;height:75%;border-radius:50%;content:'';margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}@-webkit-keyframes load3{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load3{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.loading.active{display:block}header{color:white;position:fixed;top:0;left:0;width:100%;z-index:99}header .container{padding-top:15px;padding-bottom:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}header .container h2{color:inherit;font-size:32px;font-weight:900}header .container h2 span{font-weight:400}header .container nav{display:-ms-grid;display:grid;grid-gap:16px;-ms-grid-columns:(auto)[5];grid-template-columns:repeat(5, auto);-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width: 767px){header .container nav{display:none}}header .container nav a{color:inherit;font-size:20px;text-decoration:none}header .container nav a:hover{text-decoration:underline}header.is-scrolling{background-color:#12002f}header.is-scrolling .container{padding-top:16px;padding-bottom:16px}main section.banner{color:white;position:relative;min-height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:url(../images/bg.jpg);background-attachment:fixed;background-position:top right;background-size:cover}main section.banner::after{content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;background-color:#12002f;opacity:0.8}main section.banner .container{position:relative;z-index:1}main section.banner .container h1{font-size:72px;margin-top:32px}main section.banner .container h1 span{color:#ff9fdb}@media (max-width: 767px){main section.banner .container h1{font-size:32px}}main section.banner .container h3{font-family:sonamu;font-size:36px;font-weight:400;margin-top:32px;margin-bottom:32px}@media (max-width: 767px){main section.banner .container h3{font-size:24px}}main section.banner .container a{margin-right:30px}main section.about{position:relative;background:#fff;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.2);box-shadow:0px 6px 12px rgba(0,0,0,0.2)}main section.about .about-bg{width:100vw;height:1000px;position:absolute;bottom:0;right:0;background:url(../images/coding-kid.png) no-repeat;background-position:bottom right;background-size:450px}@media (max-width: 1024px){main section.about .about-bg{background:none}}main section.about .container{position:relative;padding-top:64px;padding-bottom:64px;z-index:1}main section.about .container .card-wrapper{background-color:#fff;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.2);box-shadow:0px 6px 12px rgba(0,0,0,0.2);border-radius:8px;padding:32px;width:100%;max-width:1200px;display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3, 1fr);-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 auto;margin-bottom:64px}@media (max-width: 1024px){main section.about .container .card-wrapper{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr)}}@media (max-width: 767px){main section.about .container .card-wrapper{-ms-grid-columns:1fr;grid-template-columns:1fr}}main section.about .container .card-wrapper .card{font-size:48px;padding:24px;width:100%}main section.about .container .card-wrapper .card .card-info-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}main section.about .container .card-wrapper .card .card-info-wrapper i{width:70px;font-size:36px}main section.about .container .card-wrapper .card .card-info-wrapper .card-info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:10px}main section.about .container .card-wrapper .card .card-info-wrapper .card-info h6{font-size:24px;color:#222}main section.about .container .card-wrapper .card .card-info-wrapper .card-info span{font-size:18px;color:#222}main section.about .container .card-wrapper .card .card-info-wrapper .card-info a{text-decoration:none;font-size:18px;color:#222}main section.about .container .card-wrapper .card .card-info-wrapper .card-info a:hover{color:#ff9fdb;text-decoration:underline}main section.about .intro{padding-top:0}main section.about .intro .intro-wrapper{padding-top:32px}main section.about .intro .intro-wrapper h3{font-size:36px;padding-bottom:32px}main section.about .intro .intro-wrapper p{margin-left:65px;margin-bottom:25px;font-family:sonamu;font-size:24px}@media (max-width: 1024px){main section.about .intro .intro-wrapper p{margin-left:0}}@media (max-width: 767px){main section.about .intro .intro-wrapper p{margin-left:0;font-size:18px}}main .skills{background-color:#f9de59;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.2);box-shadow:0px 6px 12px rgba(0,0,0,0.2)}main .skills .container{padding-top:64px;padding-bottom:64px}main .skills .container .skills-gird{padding-top:32px;padding-bottom:32px;display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4, 1fr);grid-gap:24px}@media (max-width: 1024px){main .skills .container .skills-gird{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr)}}@media (max-width: 767px){main .skills .container .skills-gird{-ms-grid-columns:1fr;grid-template-columns:1fr}}main .skills .container .skills-gird .skill{margin-bottom:32px;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.1);box-shadow:0px 6px 12px rgba(0,0,0,0.1);border-radius:16px;overflow:hidden;background:#fff}main .skills .container .skills-gird .skill .img-box{display:block;width:100%;height:200px;border-bottom:5px solid #ff9fdb;padding-bottom:16px;background-color:#fff}main .skills .container .skills-gird .skill .img-box .img{display:block;width:150px;height:auto;-o-object-fit:cover;object-fit:cover;margin:0 auto;margin-top:50px}main .skills .container .skills-gird .skill .content{text-align:center;padding:16px;background-color:white;border-bottom-left-radius:16px;border-bottom-right-radius:16px}main .skills .container .skills-gird .skill .content h3{margin-bottom:12px}main .skills .container .skills-gird .skill .content p{font-family:sonamu}main .skill:hover{-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transition:all 0.1s linear;transition:all 0.1s linear}main .projects{padding:64px 0}main .projects .projects-gird{display:-ms-grid;display:grid;-ms-grid-columns:1fr 30%;grid-template-columns:1fr 30%;grid-gap:32px;margin-bottom:64px;margin-top:64px}@media (max-width: 1024px){main .projects .projects-gird{-ms-grid-columns:1fr;grid-template-columns:1fr}}main .projects .projects-gird .swiper-container{width:100%;height:100%;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.2);box-shadow:0px 6px 12px rgba(0,0,0,0.2)}main .projects .projects-gird .swiper-container .swiper-wrapper .swiper-slide img{width:100%;height:100%}main .projects .projects-gird .project{width:100%;height:auto;-webkit-box-shadow:0px 6px 12px rgba(0,0,0,0.2);box-shadow:0px 6px 12px rgba(0,0,0,0.2);border-radius:16px}main .projects .projects-gird .project .content{width:100%;height:100%;color:white;padding:20px;background-color:rgba(64,39,68,0.8)}main .projects .projects-gird .project .content h3{font-size:30px;margin-bottom:16px}@media (max-width: 1024px){main .projects .projects-gird .project .content h3{font-size:24px}}main .projects .projects-gird .project .content span{display:block;font-size:18px;margin-bottom:16px}@media (max-width: 1024px){main .projects .projects-gird .project .content span{font-size:16px}}main .projects .projects-gird .project .content p{font-family:sonamu;font-size:16px;margin-bottom:16px}@media (max-width: 1024px){main .projects .projects-gird .project .content p{font-size:14px}}main .projects .projects-gird .project .content .btn-box{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:24px}main .projects .projects-gird .project .content .btn-box a{font-size:16px;margin-right:15px}main .contact{background-color:#9b75d7}main .contact .container{padding:64px 0}main .contact .container h2{color:white}main .contact .container form{margin:0 auto;max-width:600px}@media (max-width: 767px){main .contact .container form{padding:0 32px}}main .contact .container form .form-grid{display:-ms-grid;display:grid;grid-gap:16px;-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr);margin-bottom:16px}@media (max-width: 767px){main .contact .container form .form-grid{-ms-grid-columns:1fr;grid-template-columns:1fr}}main .contact .container form .form-grid .form-element,main .contact .container form .form-grid .form-area{display:block;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;background-color:white;border-radius:8px;padding:16px;font-size:20px;color:#313131}main .contact .container form .form-grid .form-element::-webkit-input-placeholder,main .contact .container form .form-grid .form-area::-webkit-input-placeholder{color:#aaa}main .contact .container form .form-grid .form-element:-ms-input-placeholder,main .contact .container form .form-grid .form-area:-ms-input-placeholder{color:#aaa}main .contact .container form .form-grid .form-element::-ms-input-placeholder,main .contact .container form .form-grid .form-area::-ms-input-placeholder{color:#aaa}main .contact .container form .form-grid .form-element::placeholder,main .contact .container form .form-grid .form-area::placeholder{color:#aaa}main .contact .container form .form-grid .form-area{grid-column:1/-1}main .contact .container form .rignt-align{text-align:center}main .contact .container form .rignt-align .button{background:transparent}@media (max-width: 767px){.hide-mob{display:none}}
/*# sourceMappingURL=main.css.map */