.header-container{position:relative;z-index:9999}.header{font-size:3.2rem;margin:3rem}.header>*{display:inline-block;vertical-align:top;margin-right:30rem}@media screen and (max-width:1200px){.header>*{margin-right:15rem}}@media screen and (max-width:600px){.header>*{display:block;margin:0 0 1rem}}.header .name-sub{margin-top:7px;font-weight:300;font-size:2.7rem}.header .name-sub p{line-height:1.2}.header .name-sub p:first-child{color:#ff4040}.header .name-sub p:nth-child(2){color:#4090ff}.header .name-sub p:nth-child(3){color:#33d445}@font-face{font-family:"Hand";src:url(https://ashleyheo-portfolio.s3.ap-northeast-2.amazonaws.com/hand-2.otf)}.index{overflow:hidden}.index .message-container{position:relative;margin-left:3rem;margin-top:7rem;z-index:2}.index .message-container h2{font-family:"Hand";font-size:5rem;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:rotate(-1.5deg);transform:rotate(-1.5deg);-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:crosshair}.index #defaultCanvas0{position:absolute;top:0;z-index:1;cursor:crosshair}.index .index-image{position:absolute;top:0;width:100vw;pointer-events:none;z-index:0}@media screen and (max-width:600px){.index .index-image{top:23vh;width:115vw;right:0}}.information-container{-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:crosshair}.information-container .information{position:relative;top:10rem;width:70%;margin:0 3rem;font-size:3rem;z-index:99}@media screen and (max-width:600px){.information-container .information{top:5rem}}@media screen and (max-width:1200px){.information-container .information{width:calc(100vw - 6rem)}}.information-container .information .information-text{margin-bottom:3rem}.information-container .information .information-links{display:-webkit-flex;display:flex;width:60%;margin-top:7rem;-webkit-justify-content:space-between;justify-content:space-between}@media screen and (max-width:600px){.information-container .information .information-links{width:calc(100vw - 5rem);margin-top:5rem;font-size:3rem}}.information-container .information .information-links a{color:inherit;text-decoration:underline}.information-container #defaultCanvas0{position:absolute;top:0;z-index:0}.works-container{position:relative;top:20rem;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin:3rem}@media screen and (max-width:600px){.works-container{top:5rem}}.works-container .work{margin-bottom:8rem}@media screen and (max-width:600px){.works-container .work{margin-bottom:6rem}}.works-container .work img{width:calc(33.33333vw - 4rem)}@media screen and (max-width:600px){.works-container .work img{width:calc(100vw - 6rem)}}.works-container .work video{width:calc(33.33333vw - 4rem)}@media screen and (max-width:600px){.works-container .work video{width:calc(100vw - 6rem)}}.works-container .information{margin-top:1rem}.works-container .information *{font-size:2.4rem}@media screen and (max-width:1400px){.works-container .information *{font-size:2.2rem}}@media screen and (max-width:600px){.works-container .information *{font-size:3rem}}.works-container .information .work-name{margin-bottom:5px}@media screen and (max-width:600px){.works-container .information .work-name{margin-bottom:3px}}.works-container .information .work-info{color:#737373}.project-container{position:relative;top:7rem;margin:3rem}@media screen and (max-width:600px){.project-container{top:5rem}}.project-container .image{width:100%}.project-container .image:not(:last-child){margin-bottom:5rem}.project-container header{margin-bottom:7rem}.project-container header .project-title{font-size:7rem;font-weight:500;margin-bottom:3.5rem}@media screen and (max-width:1200px){.project-container header .project-title{font-size:6rem;margin-bottom:3rem}}@media screen and (max-width:600px){.project-container header .project-title{margin-bottom:2.5rem}}.project-container header .project-info-container{display:-webkit-flex;display:flex}@media screen and (max-width:600px){.project-container header .project-info-container{-webkit-flex-wrap:wrap;flex-wrap:wrap}}.project-container header .project-info-container .project-desc{font-size:2.4rem;line-height:1.4;width:60%;margin-right:20rem}@media screen and (max-width:600px){.project-container header .project-info-container .project-desc{width:calc(100vw - 6rem);margin-right:0;font-size:3rem;margin-bottom:5rem}}.project-container header .project-info-container .coders-desc{margin-right:16rem}.project-container header .project-info-container .project-infos .project-info{font-size:2rem;font-weight:500;margin-bottom:7px}@media screen and (max-width:600px){.project-container header .project-info-container .project-infos .project-info{width:calc(100vw - 6rem);font-size:2.8rem;margin-bottom:1rem}}.project-container header .project-info-container .project-infos .heading{font-weight:600}.project-container header .project-info-container .project-infos .info{color:#737373;font-weight:400}.project-container header .project-info-container .project-infos :nth-child(2){margin-bottom:2.4rem}.project-container header .project-info-container a{text-decoration:underline}.project-container header .project-logo{width:27mm;margin-left:7rem}.project-container .cover-image{width:calc(100vw - 6rem);margin-bottom:15rem}@media screen and (max-width:600px){.project-container .cover-image{margin-bottom:7rem}}.project-container main{position:relative}.project-container main .thesis-thumb-image{width:calc(33.33333vw - 4rem)}@media screen and (max-width:600px){.project-container main .thesis-thumb-image{width:calc(100vw - 6rem)}}.project-container main .center{position:relative;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:65%}@media screen and (max-width:1200px){.project-container main .center{width:calc(100vw - 6rem)}}.project-container main .heading{font-size:4.5rem;font-weight:500;margin-bottom:3.6rem}@media screen and (max-width:1200px){.project-container main .heading{font-size:3.6rem;margin-bottom:3rem}}@media screen and (max-width:600px){.project-container main .heading{font-size:5rem}}.project-container main .heading2{font-size:2.4rem;font-weight:600;margin-bottom:3.6rem}@media screen and (max-width:600px){.project-container main .heading2{font-size:3.2rem}}.project-container main .desc{font-size:2rem;line-height:1.5}@media screen and (max-width:600px){.project-container main .desc{font-size:2.8rem}}.project-container main .container{margin-bottom:15rem}@media screen and (max-width:600px){.project-container main .container{margin-bottom:7rem}}.project-container main .container1 .problem p{margin-bottom:7rem}.project-container main .container1 .solution h5{font-weight:600;font-size:2.2rem;margin-bottom:1rem}@media screen and (max-width:600px){.project-container main .container1 .solution h5{font-size:3.2rem}}.project-container main .container2{position:relative;width:100vw;left:-3rem}.project-container main .container2 .product-container{padding-top:13rem;width:65%;margin-left:2rem}@media screen and (max-width:1200px){.project-container main .container2 .product-container{width:80vw}}@media screen and (max-width:600px){.project-container main .container2 .product-container{width:calc(100vw - 6rem);margin-left:0;padding-top:3rem}}.project-container main .container2 .product-container .product{position:relative;width:100%;padding-bottom:10rem}.project-container main .container2 .product-container .product video{width:45%;height:auto}@media screen and (max-width:600px){.project-container main .container2 .product-container .product video{width:calc(100vw - 6rem)}}.project-container main .container2 .product-container .product-desc{width:50%;height:unset}@media screen and (max-width:600px){.project-container main .container2 .product-container .product-desc{width:calc(100vw - 6rem)}}.project-container main .container2 .product-container .product h4{margin-top:3rem;font-weight:700}@media screen and (max-width:600px){.project-container main .container2 .product-container .product h4{margin-top:0}}.project-container main .container2 .product-container .product p{margin-bottom:15rem}@media screen and (max-width:600px){.project-container main .container2 .product-container .product p{margin-bottom:0}}.project-container main .container2 .product-container .product h4,.project-container main .container2 .product-container .product p{position:relative;bottom:0}.project-container main .container2 .product-container .product:last-child{padding-bottom:13rem}@media screen and (max-width:600px){.project-container main .container2 .product-container .product:last-child{padding-bottom:7rem}}.project-container main .container2 .product-container .product1{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;-webkit-flex-direction:row;flex-direction:row;-webkit-align-items:flex-end;align-items:flex-end}@media screen and (max-width:600px){.project-container main .container2 .product-container .product1{display:block}.project-container main .container2 .product-container .product1:nth-child(2n){padding-bottom:4rem}.project-container main .container2 .product-container .product1:nth-child(2n) p{margin-bottom:2rem}}.project-container main .container2 .product-container .product2{position:relative;padding-bottom:0}.project-container main .container2 .product-container .product2 p{text-align:center;font-size:2.4rem}.project-container main .container2 .product-container .product2 .product-image1{width:45%}.project-container main .container2 .product-container .product2 .product-image2{width:100%}.project-container main .container2 .product-container .product2 .product-image3{position:relative;width:40%;z-index:3;pointer-events:none}.project-container main .container2 .product-container .product2 video{margin-top:10rem}.project-container main .container2 .product-container .product2 .caption{color:#737373;margin-top:1rem;text-align:center;font-size:1.6rem}.project-container main .container2 .product-container .product2:nth-child(2) p:first-child{margin-top:4rem;margin-bottom:0}.project-container main .container2 .product-container .product2:last-child{padding-bottom:15rem}.project-container main .container2 .product-container .product2 a{text-decoration:underline}.project-container main .container3{position:relative}.project-container main .container3 .interview-container{margin:10rem 0}@media screen and (max-width:600px){.project-container main .container3 .interview-container{margin:7rem 0}}.project-container main .container3 .interview-container .question{font-size:2.2em;margin-bottom:2rem;font-weight:500}@media screen and (max-width:600px){.project-container main .container3 .interview-container .question{font-size:2.4rem}}.project-container main .container3 .interview-container .answer{font-size:3.2rem;line-height:1.4;font-weight:600;margin-bottom:1rem}.project-container main .container3 .interview-container .demographic{margin-bottom:7rem;color:#737373}@media screen and (max-width:600px){.project-container main .container3 .interview-container .demographic{font-size:2.2rem}}.project-container main .container3 .interview-container :last-child{margin-bottom:0}.project-container main .container3 .target-container{margin-bottom:10rem}.project-container main .container3 .insight-container{position:relative;left:-3rem;width:100vw;margin-bottom:10rem}@media screen and (max-width:600px){.project-container main .container3 .insight-container{margin-bottom:7rem}}.project-container main .container3 .insight-container .insights{padding:10rem 0 10rem 2rem}@media screen and (max-width:1200px){.project-container main .container3 .insight-container .insights{padding-left:0}}@media screen and (max-width:600px){.project-container main .container3 .insight-container .insights{padding:7rem 0}}.project-container main .container3 .insight-container .insights ol{list-style-position:inside;font-size:2.8rem}.project-container main .container3 .insight-container .insights ol :not(:last-child){margin-bottom:3.2rem}.project-container main .container3 .persona-container .desc{margin-bottom:7rem}.project-container main .container3 .persona-container .persona{width:100%;border-radius:2rem}.project-container main .container3 .persona-container .persona1{margin-bottom:5rem}.project-container main .container3 .flow-container,.project-container main .container3 .ia-container,.project-container main .container3 .journey-container{margin-top:10rem}.project-container main .container3 .journey-map,.project-container main .container3 .site-map,.project-container main .container3 .user-flow{width:100%}.project-container main iframe{position:relative;left:-3rem;width:100vw;height:56.4971751412vw}.project-container main .poster-container{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between}.project-container main .poster-container img{-webkit-align-self:start;align-self:start;width:calc(20vw - 3.6rem)}.project-container main .coders-bg-1{background-color:#95d2fe}@media screen and (max-width:1400px){.project-container main .coders-bg-1{background-color:#91cffc}}.project-container main .coders-bg-2{background-color:#e4f2ff}.project-container main .coders-color{color:#0d6eff}.project-container main .craigslist-bg-1{background-color:#9800cc}@media screen and (max-width:1400px){.project-container main .craigslist-bg-1{background-color:#8200be}}.project-container main .craigslist-bg-2{background-color:#f8edfd}.project-container main .craigslist-color{color:#9800cc}.project-container main .websites-container{position:relative;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}.project-container main .websites-container .website{margin-bottom:8rem;margin-right:2.9rem}.project-container main .websites-container .website:nth-child(3n){margin-right:0}@media screen and (max-width:600px){.project-container main .websites-container .website{margin-bottom:6rem}}.project-container main .websites-container .website video{width:calc(33.33333vw - 4rem)}@media screen and (max-width:600px){.project-container main .websites-container .website video{width:calc(100vw - 6rem)}}.project-container main .websites-container .website img{width:calc(33.33333vw - 4rem);aspect-ratio:1061/672}@media screen and (max-width:600px){.project-container main .websites-container .website img{width:calc(100vw - 6rem)}}.project-container main .websites-container .information{margin-top:1rem}.project-container main .websites-container .information *{font-size:2.4rem}@media screen and (max-width:1400px){.project-container main .websites-container .information *{font-size:2.2rem}}@media screen and (max-width:600px){.project-container main .websites-container .information *{font-size:3rem}}.project-container main .websites-container .information .website-name{margin-bottom:5px}@media screen and (max-width:1200px){.project-container main .websites-container .information .website-name{width:calc(33.33333vw - 4rem)}}@media screen and (max-width:600px){.project-container main .websites-container .information .website-name{margin-bottom:3px;width:calc(100vw - 6rem)}}.project-container main .websites-container .information .website-info{color:#737373}.project-container .no-margin{margin:0}*,:after,:before{margin:0;padding:0;box-sizing:inherit}html{font-size:62.5%}@media screen and (max-width:600px){html{font-size:40%}}@media screen and (min-width:1800px){html{font-size:75%}}body,html{overflow-x:hidden;height:100%}body{box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;font-size:1.8rem;font-weight:400}a{text-decoration:none;color:#000}.black-bg{background-color:#000}.white-txt{color:#fff}.footer-container{padding-bottom:3rem;position:relative;width:calc(100vw - 6rem);margin-top:15rem}.footer-container .project-links{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;margin-bottom:10rem}.footer-container .project-links .projects{display:-webkit-flex;display:flex;font-size:4.5rem}.footer-container .project-links .projects :nth-child(2n){margin-left:2rem}@media screen and (max-width:600px){.footer-container .project-links .projects{font-size:2.4rem}}.footer-container .project-links a:last-child{text-align:right}.footer-container .footer{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between}.footer-container .footer .footer-block{display:inline-block;font-size:2rem}.footer-container .footer .footer-block a:not(:last-child){margin-right:2.5rem}.footer-container .footer .top{cursor:pointer}.footer-container .footer .icons a:first-child:hover{color:#2867b2}.footer-container .footer .icons a:nth-child(2):hover{color:#053eff}.footer-container .footer .icons a:nth-child(3):hover{color:purple}.footer-container .footer .icons a:nth-child(4):hover{color:#ff3d3d}.footer-container .footer .copyright{cursor:default}
/*# sourceMappingURL=main.cf1bad58.chunk.css.map */