﻿*,*::before,*::after{margin:0;padding:0;box-sizing:inherit}html{box-sizing:border-box;font-size:62.5%}@media only screen and (max-width: 75em){html{font-size:58%}}@media only screen and (max-width: 800px){html{font-size:55%}}@media only screen and (max-width: 37.5em){html{font-size:55%}}@media only screen and (max-width: 350px){html{font-size:48%}}body{font-family:"Noto Sans SC",sans-serif;color:#f9f7f6;background-color:#1e3163;font-weight:300;line-height:1.6}.container{display:grid;grid-template-rows:minmax(2rem min-content) repeat(3, min-content max-content);grid-template-columns:[full-start] minmax(6rem, 1fr) [center-start] repeat(8, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end]}.heading-4,.heading-3,.heading-2,.heading-1{font-family:"Noto Sans SC",sans-serif;font-weight:300}.heading-1{font-size:6rem;line-height:1.2;letter-spacing:.5rem;font-weight:normal}@media only screen and (max-width: 360px){.heading-1{font-size:5rem;line-height:1}}.heading-2{font-size:2.8rem}@media only screen and (max-width: 360px){.heading-2{font-size:2.3rem}}.heading-3{font-size:2rem;letter-spacing:.2rem}.heading-4{font-size:1.9rem}.btn{background-color:#f2be24;color:#000;border:none;border-radius:30px;font-family:"Josefin Sans",sans-serif;font-size:2rem;text-transform:uppercase;padding:1rem 6.5rem;cursor:pointer;transition:all .2s}.btn:hover{background-color:rgba(242,190,36,.8)}@media only screen and (max-width: 37.5em){.btn{padding:2rem 5.5rem}}@media only screen and (max-width: 350px){.btn{padding:1rem 4.5rem}}.rectangle{width:3rem;height:6rem;background-color:#fff}.mb-sm{margin-bottom:2rem}.mb-md{margin-bottom:3rem}.mb-lg{margin-bottom:4rem}.mb-hg{margin-bottom:8rem}.cta_btn{margin-top:2rem;text-decoration:none;font-weight:normal;text-align:center}.sidebar{grid-column:full-start/full-end;height:6rem;background-color:#fff;color:#000;font-size:4rem}#loading{position:fixed;left:0;right:0;top:0;bottom:0;z-index:999999;opacity:.98;background:#fff;display:flex}#loading .dot{position:relative;top:48%;left:calc(50% - ((2.5em + 0.8em * 2) * 2));transform:translateX(-50%);width:2.5em;height:2.5em;margin:.8em;border-radius:50%}#loading .dot::before{position:absolute;content:"";width:100%;height:100%;background:inherit;border-radius:inherit;animation:wave 2s ease-out infinite}#loading .dot:nth-child(1){background:#7ef9ff}#loading .dot:nth-child(1)::before{animation-delay:.2s}#loading .dot:nth-child(2){background:#89cff0}#loading .dot:nth-child(2)::before{animation-delay:.4s}#loading .dot:nth-child(3){background:#4682b4}#loading .dot:nth-child(3)::before{animation-delay:.6s}#loading .dot:nth-child(4){background:#0f52ba}#loading .dot:nth-child(4)::before{animation-delay:.8s}#loading .dot:nth-child(5){background:navy}#loading .dot:nth-child(5)::before{animation-delay:1s}@keyframes wave{50%,75%{transform:scale(2.5)}80%,100%{opacity:0}}.header{padding-top:3rem;grid-column:full-start/full-end;grid-row:1/2;text-align:center}@media only screen and (max-width: 350px){.header{padding-top:1rem}}.header img{max-width:100%}.header__company-name{display:flex;justify-content:center;align-items:center;margin-top:1.2rem;margin-bottom:3rem}@media only screen and (max-width: 350px){.header__company-name{margin:1.5rem 0}}.header__logo{height:4rem}.header__logo-text{padding:1rem}.header__describe{margin:1rem 0 5rem 0}@media only screen and (max-width: 36em){.header__describe{width:60%;margin:2.5rem auto;font-size:2.2rem}}@media only screen and (max-width: 462px){.header__describe{width:70%}}@media only screen and (max-width: 395px){.header__describe{width:80%}}@media only screen and (max-width: 350px){.header__describe{width:100%;padding:0 1rem}}.header_hero{display:grid;grid-template-columns:.5fr 1fr .5fr}@media only screen and (max-width: 800px){.header_hero{grid-template-columns:.4fr 1.2fr .4fr;justify-content:center}}@media only screen and (max-width: 33.75em){.header_hero{grid-template-columns:.2fr 1fr .2fr;justify-content:center}}.header_hero__center{text-align:center}.header_hero__center img{max-width:90%}.header_hero__service-text{margin-top:4rem;display:grid;grid-template-columns:1fr max-content 1fr;grid-column-gap:2.5rem;align-items:center;font-size:2.5rem}.header_hero__service-text::before,.header_hero__service-text::after{content:"";height:1px;display:block;background-color:currentColor}.header_hero__services{margin-top:1rem;display:grid;grid-template-columns:repeat(2, 1fr);font-size:2.5rem}@media only screen and (max-width: 37.5em){.header_hero__services{grid-template-columns:1fr}}.header_hero__service::before{font-family:"Font Awesome 5 Free";font-weight:900;content:"";color:#f037a5;margin-right:1rem}.about{margin:10rem 0;grid-column:1/center-end;display:grid;grid-template-columns:.6fr 1fr;grid-gap:4rem}@media only screen and (max-width: 800px){.about{margin:8rem 0}}@media only screen and (max-width: 37.5em){.about{margin:6rem 0}}@media only screen and (max-width: 62.5em){.about{grid-column:1/-1}}@media only screen and (max-width: 48em){.about{grid-template-columns:.4fr 1fr;grid-gap:2rem}}@media only screen and (max-width: 37.5em){.about{display:block}}.about__image{width:100%}@media only screen and (max-width: 37.5em){.about__image{float:left;width:20%;padding-right:1rem}}.about__content{padding:0 2rem 0 0}@media only screen and (max-width: 37.5em){.about__content{padding:0 3rem}}.about__content-title{font-size:5rem;font-weight:normal;margin-bottom:4rem}@media only screen and (max-width: 23.5em){.about__content-title{margin-bottom:2rem;font-size:4rem}}.about__content-text{font-size:2.5rem;margin-bottom:4rem}@media only screen and (max-width: 23.5em){.about__content-text{font-size:2.3rem}}.about__content-text p{margin-bottom:2.8rem}.about__content img{width:100%}.about__btn{text-decoration:none;font-weight:normal}.about__line{transform:translateY(-3.5rem);position:relative;z-index:-1}@media only screen and (max-width: 37.5em){.about__line{transform:translateY(0rem)}}.service_web_design{grid-column:center-start/center-end;margin-top:5rem}@media only screen and (max-width: 820px){.service_web_design{margin-top:0rem}}.service_web_design__title{font-size:5rem;font-weight:normal;text-align:center}@media only screen and (max-width: 360px){.service_web_design__title{font-size:4rem}}.service_web_design__subtitle{font-size:5rem;text-align:center;font-size:2.5rem;letter-spacing:.2rem}.service_web_design__content{margin-top:2.5rem;display:grid;grid-template-columns:repeat(2, 1fr);grid-gap:5rem}@media only screen and (max-width: 800px){.service_web_design__content{margin-top:3rem;grid-template-columns:1fr;justify-content:center}}.service_web_design__content img{width:100%}@media only screen and (max-width: 350px){.service_web_design__content img{width:110%}}.service_web_design__content-right{align-self:center}@media only screen and (max-width: 800px){.service_web_design__content-right{justify-self:center}}.service_web_design__feature{display:grid;grid-template-columns:min-content 1fr;margin-bottom:3rem}.service_web_design__feature-rectangle-1{background-color:#0096c7}.service_web_design__feature-rectangle-2{background-color:#00b4d8}.service_web_design__feature-rectangle-3{background-color:#48cae4}.service_web_design__feature-rectangle-4{background-color:#90e0ef}.service_web_design__feature-rectangle-5{background-color:#ade8f4}.service_web_design__feature-content{margin-left:2rem}.service_web_design__feature-title{font-size:2.5rem;line-height:1.2;letter-spacing:.2rem}.service_web_design__feature-describe{font-size:2rem;line-height:1.2;letter-spacing:.1rem}.steps{grid-column:center-start/center-end;margin:20rem 0;display:grid;justify-content:center;grid-gap:5rem}@media only screen and (max-width: 37.5em){.steps{grid-column:full-start/full-end}}@media only screen and (max-width: 810px){.steps{margin:10rem 0}}@media only screen and (max-width: 37.5em){.steps{margin:6rem 0}}.steps__left{display:grid;grid-template-columns:min-content max-content minmax(min-content, max-content) 1fr;align-items:center;grid-gap:2rem}@media only screen and (max-width: 37.5em){.steps__left{grid-template-columns:repeat(3, max-content);grid-row-gap:.5rem;justify-content:center}}@media only screen and (max-width: 20em){.steps__left{grid-template-columns:repeat(2, max-content)}}.steps__right{display:grid;grid-template-columns:1fr minmax(min-content, max-content) max-content min-content;align-items:center;grid-gap:2rem}@media only screen and (max-width: 37.5em){.steps__right{grid-template-columns:minmax(min-content, max-content) max-content min-content;grid-row-gap:0rem}}@media only screen and (max-width: 20em){.steps__right{grid-template-columns:repeat(2, max-content);justify-content:center}}.steps .step_no{font-size:6rem;font-weight:normal;justify-self:end}@media only screen and (max-width: 20em){.steps .step_no{grid-area:1/1/2/2;width:40%}}.steps .step_line::before{content:"";height:3px;width:10rem;display:block;background-color:currentColor}@media only screen and (max-width: 37.5em){.steps .step_line::before{height:2px}}@media only screen and (max-width: 20em){.steps .step_line::before{display:none}}.steps .step_img{width:80%;justify-self:center}@media only screen and (max-width: 37.5em){.steps .step_img{width:60%}}@media only screen and (max-width: 20em){.steps .step_img{grid-area:1/2/2/-1;width:40%}}@media only screen and (max-width: 37.5em){.steps .step_content{grid-area:2/1/2/-1}}.steps .step_content-title{font-size:2.5rem;font-weight:normal}.steps .step_content-describe{font-size:2rem}.steps .step_content_right{text-align:right}@media only screen and (max-width: 20em){.steps .step_content_right{text-align:inherit}}.service_software{grid-column:center-start/center-end}.gallery{margin-top:2rem;grid-column:full-start/full-end;display:grid;grid-template-columns:repeat(8, 1fr);grid-template-rows:repeat(7, 5vw);grid-gap:1.5rem;padding:1.5rem}@media only screen and (max-width: 800px){.gallery{grid-gap:1rem;grid-template-rows:repeat(15, 5vw)}}@media only screen and (max-width: 37.5em){.gallery{grid-gap:.5rem;grid-template-rows:repeat(23, 5vw)}}.gallery__img{width:100%;height:100%;object-fit:cover;object-position:center 5%;display:block}.gallery__item{cursor:pointer;transition:all .2s}.gallery__item:hover{transform:scale(1.05);-webkit-filter:drop-shadow(12px 12px 7px rgba(128, 128, 128, 0.7));filter:drop-shadow(12px 12px 7px rgba(128, 128, 128, 0.7))}.gallery__item--1{grid-area:1/1/4/3}.gallery__item--2{grid-area:1/3/4/6}.gallery__item--3{grid-area:5/7/-1/8}.gallery__item--4{grid-area:1/7/5/-1}.gallery__item--5{grid-area:1/6/-3/7}.gallery__item--6{grid-area:4/2/-1/5}.gallery__item--7{grid-area:4/5/-1/6}.gallery__item--8{grid-area:6/6/-1/7}.gallery__item--9{grid-area:5/8/-1/-1}.gallery__item--10{grid-area:4/1/-1/2}@media only screen and (max-width: 800px){.gallery__item--1{grid-area:1/1/5/4}.gallery__item--2{grid-area:1/4/5/6}.gallery__item--3{grid-area:10/7/-1/-1}.gallery__item--4{grid-area:1/-4/8/-1}.gallery__item--5{grid-area:10/5/-1/7}.gallery__item--6{grid-area:5/3/10/6}.gallery__item--7{grid-area:10/3/-1/5}.gallery__item--8{grid-area:13/1/-1/3}.gallery__item--9{grid-area:8/6/10/-1}.gallery__item--10{grid-area:5/1/-4/3}}@media only screen and (max-width: 37.5em){.gallery__item--1{grid-area:1/1/5/6}.gallery__item--2{grid-area:1/6/8/-1}.gallery__item--3{grid-area:5/1/13/4}.gallery__item--4{grid-area:12/-4/19/-1}.gallery__item--5{grid-area:5/4/15/6}.gallery__item--6{grid-area:13/1/-5/4}.gallery__item--7{grid-area:15/4/-1/6}.gallery__item--8{grid-area:20/1/-1/4}.gallery__item--9{grid-area:8/6/12/-1}.gallery__item--10{grid-area:19/6/-1/-1}}.faq{grid-column:center-start/center-end}@media only screen and (max-width: 800px){.faq{grid-column:1/-1}}.faq__content{margin:5rem 0;display:grid;grid-row-gap:5rem;justify-content:center}.messages{display:grid;grid-template-columns:repeat(6, min-content);grid-template-rows:repeat(2, 1fr);font-size:2rem}@media only screen and (max-width: 57em){.messages{grid-row-gap:2rem}}.messages .message_pic_border{background:-webkit-linear-gradient(150deg, #22c1c3 0%, #66bf95 31%, #b7bd5d 68%, #fdbb2d 100%);width:100%;height:92%;border-radius:100%;padding:5px}@media only screen and (max-width: 420px){.messages .message_pic_border{background:none}}.messages .message_pic_border_a{background:linear-gradient(90deg, #c093df 0%, #fd1d1d 50%, #fc7535 80%, #fc8a3b 87%, #fcb045 100%)}@media only screen and (max-width: 420px){.messages .message_pic_border_a{background:none}}.messages .message_pic{width:6rem;height:6rem;border-radius:100%;align-self:center}@media only screen and (max-width: 420px){.messages .message_pic{background:-webkit-linear-gradient(150deg, #22c1c3 0%, #66bf95 31%, #b7bd5d 68%, #fdbb2d 100%)}}@media only screen and (max-width: 420px){.messages .message_pic_a{background:linear-gradient(90deg, #c093df 0%, #fd1d1d 50%, #fc7535 80%, #fc8a3b 87%, #fcb045 100%)}}.messages .body_a{grid-area:2/4/3/5;margin-left:5rem}@media only screen and (max-width: 57em){.messages .body_a{grid-area:2/3/3/5}}@media only screen and (max-width: 37.5em){.messages .body_a{grid-area:2/1/3/4;justify-self:end}}.messages .arrow_a{grid-area:2/5/3/6;width:12px;height:30px;overflow:hidden;position:relative;top:6px;left:-1px}.messages .arrow_a .inner{width:0;height:0;border-left:15px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;top:0;right:2px}.messages .message_pic_border_a{grid-area:2/6/3/-1}.messages .arrow{width:12px;height:30px;overflow:hidden;position:relative;top:6px;right:-1px}.messages .arrow .inner{width:0;height:0;border-right:15px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;top:0;left:2px}.messages .message-body{float:left;width:50rem;background-color:#fff;padding:6px 8px;-webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;border-radius:5px;color:#000}@media only screen and (max-width: 87.5em){.messages .message-body{width:40rem}}@media only screen and (max-width: 75em){.messages .message-body{width:35rem}}@media only screen and (max-width: 62.5em){.messages .message-body{width:30rem}}@media only screen and (max-width: 57em){.messages .message-body{width:50rem}}@media only screen and (max-width: 48em){.messages .message-body{width:45rem}}@media only screen and (max-width: 36em){.messages .message-body{width:38rem}}@media only screen and (max-width: 500px){.messages .message-body{width:35rem}}@media only screen and (max-width: 460px){.messages .message-body{width:30rem}}@media only screen and (max-width: 420px){.messages .message-body{width:28rem}}@media only screen and (max-width: 24.6em){.messages .message-body{width:25rem}}@media only screen and (max-width: 23.5em){.messages .message-body{width:22rem}}@media only screen and (max-width: 350px){.messages .message-body{width:20rem}}@media only screen and (max-width: 325px){.messages .message-body{width:17rem}}@media only screen and (max-width: 300px){.messages .message-body{width:14rem}}.messages .message-body p{margin:0}.footer{grid-column:full-start/full-end;padding:3rem;background-color:#101d2c}.footer .copyright{text-align:center;font-size:1.8rem;letter-spacing:1px}:root{--delay: 0}:root .animate{animation-play-state:paused;animation-delay:calc((var(--scroll) - var(--delay)) * -1s);animation-iteration-count:1;animation-fill-mode:both}.scale-in-hor-left{opacity:0;animation:scale-in-hor-left .5s cubic-bezier(0.25, 0.46, 0.45, 0.94) .1s both}@keyframes scale-in-hor-left{0%{transform:scaleX(0);transform-origin:0% 0%;opacity:0}100%{transform:scaleX(1);transform-origin:0% 0%;opacity:1}}.scale-in-hor-right{opacity:0;animation:scale-in-hor-right .5s cubic-bezier(0.25, 0.46, 0.45, 0.94) .1s both}@keyframes scale-in-hor-right{0%{transform:scaleX(0);transform-origin:100% 100%;opacity:0}100%{transform:scaleX(1);transform-origin:100% 100%;opacity:1}}.slide-in-left{opacity:0;animation:slide-in-left .5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both}@keyframes slide-in-left{0%{transform:translateX(-100px);opacity:.2}50%{transform:translateX(0);opacity:1}}.slide-in-fwd-center{opacity:0;animation:slide-in-fwd-center 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) both}@keyframes slide-in-fwd-center{0%{transform:translateZ(-1400px);opacity:0}100%{transform:translateZ(0);opacity:1}}.scale-in-hor-left_text{animation:scale-in-hor-left_text 1s cubic-bezier(0.19, 1, 0.22, 1) .5s both}@keyframes scale-in-hor-left_text{0%{transform:scaleX(0);transform-origin:0% 0%;opacity:1}100%{transform:scaleX(1);transform-origin:0% 0%;opacity:1}}.swing-in-top-bck{animation:swing-in-top-bck 2.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) both}@keyframes swing-in-top-bck{0%{transform:rotateX(70deg);transform-origin:top;opacity:0}100%{transform:rotateX(0deg);transform-origin:top;opacity:1}}.swing-in-bottom-fwd{animation:swing-in-bottom-fwd 2.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) both}@keyframes swing-in-bottom-fwd{0%{transform:rotateX(100deg);transform-origin:bottom;opacity:0}100%{transform:rotateX(0);transform-origin:bottom;opacity:1}}.fade-in{animation:fade-in .5s cubic-bezier(0.39, 0.575, 0.565, 1) both}@keyframes fade-in{0%{opacity:0}40%{opacity:1}}.rotate-in-2-cw{animation:rotate-in-2-cw 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) both}@keyframes rotate-in-2-cw{0%{transform:rotate(-45deg);opacity:0}20%{transform:rotate(0);opacity:.8}50%{transform:rotate(0);opacity:1}}.swing-in-top-fwd{animation:swing-in-top-fwd 2.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) both}@keyframes swing-in-top-fwd{0%{transform:rotateX(-300deg);transform-origin:top;opacity:0}45%{transform:rotateX(0deg);transform-origin:top;opacity:1}}.fade-in-left{animation:fade-in-left 2s cubic-bezier(0.39, 0.575, 0.565, 1) both}@keyframes fade-in-left{0%{transform:translateX(-200px);opacity:0}30%{transform:translateX(0)}40%{opacity:1}}.scale-up-top{animation:scale-up-top 1.5s cubic-bezier(0.39, 0.575, 0.565, 1) both}@keyframes scale-up-top{0%{transform:scale(0);transform-origin:50% 0%;opacity:0}60%{transform:scale(1);transform-origin:50% 0%;opacity:1}}.tracking-in-expand{animation:tracking-in-expand 2s cubic-bezier(0.215, 0.61, 0.355, 1) both}@keyframes tracking-in-expand{0%{letter-spacing:-10em;opacity:0}50%{opacity:1;letter-spacing:0}}.line{cursor:pointer;width:7rem;position:fixed;bottom:2rem;right:2rem;animation:beat .8s infinite alternate;transform-origin:center}.line img{width:100%}@keyframes beat{to{transform:scale(1.1)}}/*# sourceMappingURL=style.css.map */
