/* Original layout layer (from loannowth frontend CSS, without webpack JS) */
*{box-sizing:border-box}*,div{padding:0;margin:0}div{border-spacing:0;border-collapse:collapse}dl,ol,ul{list-style:none;line-height:normal;margin:0}p{margin:0}a{text-decoration:none;color:inherit}table{border-collapse:collapse}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin:0;font-weight:400}body{max-width:1920px}.gm,body{margin:0 auto}.gm{max-width:1450px;width:95%}@media screen and (max-width:770px){.gm{max-width:1450px;width:100%;padding:0 20px}}
.nav-bar .hamburger-m,.small-munu{display:none}.scrolled{background-color:#338fe8}.nav-view{position:fixed;width:100%;left:0;top:0;z-index:10}.nav-view .menu li a{display:block;line-height:42px;height:42px;padding:0 20px;font-weight:700;font-size:22px;transition:.5s;position:relative;z-index:1;color:#fff}.nav-view .menu li{position:relative;margin-right:20px}.nav-view .menu li:last-child{margin-right:0}.nav-view .menu li .select-button:after{content:"";width:100%;height:100%;background:#fff;position:absolute;top:0;left:0;border-radius:50px;opacity:0;transition:.5s;z-index:-1}.nav-view .menu li:hover a:after{opacity:1}.nav-view .menu li .select-button{color:#5700e4}.nav-view .menu li .select-button:after{opacity:1}.nav-view .nav-bar{max-width:1460px;width:100%;margin:0 auto;height:65px}.menu ul,.nav-view .nav-bar{justify-content:space-between}.menu ul,.nav-view .nav-bar,.nav-view .nav-bar .logo{display:flex;align-items:center}.nav-view .nav-bar .logo img{width:50px;height:50px;margin-right:25px}.nav-view .nav-bar .logo p{color:#333;font-family:Roboto;font-size:30px;font-weight:700;line-height:120%}.nav-view .nav-bar .logo .foot_logo_img{width:200px;height:106px;margin-top:10px}@media screen and (max-width:1200px){.nav-view .nav-bar{height:79px;padding:0 20px}.menu{display:none}.nav-bar .hamburger-m{display:flex;flex-wrap:wrap;align-content:space-between;height:25px;width:34px}.nav-bar .hamburger-m .line{width:34px;height:2.6px;background-color:#fff;border-radius:1.4px;transition:.4s}.nav-bar .hamburger-m .changeLine{transform:translateY(11.5px) rotate(-45deg);opacity:1;transition:.4s}.nav-bar .hamburger-m .changeLine2{transform:rotate(180deg);opacity:0;transition:.4s}.nav-bar .hamburger-m .changeLine3{transform:translateY(-9.5px) rotate(45deg);opacity:1;transition:.4s}.small-munu{display:block;flex-wrap:wrap;padding:16px 0;background-color:#fff;transition:.4s}.small-munu li{display:flex;align-items:center;justify-content:center;width:100%;height:60px;margin-bottom:16px}.small-munu li a{color:#333;font-family:Roboto;font-size:22px;font-weight:700;line-height:120%}.small-munu li .click-a{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%;background-color:#f2ebff;color:#5700e4;padding-bottom:10px}.small-munu li .click-a:after{content:"";width:20px;height:2px;background-color:#5700e4;position:absolute;top:80%;left:49%;border-radius:50px}}@media screen and (max-width:600px){.nav-view .nav-bar .logo img{width:35px;height:35px;margin-right:15px}.nav-view .nav-bar .logo p{font-size:26px}.nav-view .nav-bar .logo .foot_logo_img{margin-left:-20px}}@media screen and (max-width:400px){.nav-view .nav-bar .logo .foot_logo_img{margin-left:-20px}.nav-bar .hamburger-m{display:flex;flex-wrap:wrap;align-content:space-between;height:19px;width:20px}.nav-bar .hamburger-m .line{width:20px;height:2.6px;background-color:#fff;border-radius:1.3px}.nav-bar .hamburger-m .changeLine{transform:translateY(9px) rotate(-45deg);opacity:1}.nav-bar .hamburger-m .changeLine2{transform:rotate(180deg);opacity:0;transition:.4s}.nav-bar .hamburger-m .changeLine3{transform:translateY(-6.5px) rotate(45deg);opacity:1}}
.nav-view2 .nav-bar .hamburger-m,.nav-view2 .small-munu{display:none}.nav-view2{position:fixed;width:100%;left:0;top:0;z-index:10;background-color:#fff}.nav-view2 .menu li a{display:block;line-height:42px;height:42px;padding:0 20px;font-weight:700;font-size:22px;transition:.5s;position:relative;z-index:1;color:#333}.nav-view2 .menu li{position:relative;margin-right:20px}.nav-view2 .menu li:last-child{margin-right:0}.nav-view2 .menu li .select-button:after{content:"";width:100%;height:100%;background:#5700e4;position:absolute;top:0;left:0;border-radius:50px;opacity:0;transition:.5s;z-index:-1}.nav-view2 .menu li:hover a:after{opacity:1}.nav-view2 .menu li .select-button{color:#fff}.nav-view2 .menu li .select-button:after{opacity:1}.nav-view2 .nav-bar{max-width:1460px;width:100%;margin:0 auto;height:65px}.nav-view2 .menu ul,.nav-view2 .nav-bar{display:flex;justify-content:space-between;align-items:center}.nav-view2 .nav-bar .logo{display:flex;align-items:center}.nav-view2 .nav-bar .logo img{width:50px;height:50px;margin-right:25px}.nav-view2 .nav-bar .logo p{color:#333;font-family:Roboto;font-size:30px;font-weight:700;line-height:120%}.nav-view2 .nav-bar .logo .foot_logo_img{width:200px;height:106px;margin-top:10px}@media screen and (max-width:1200px){.nav-view2 .nav-bar{height:79px;padding:0 20px;border-bottom:1px solid #e2e2e2}.nav-view2 .menu{display:none}.nav-view2 .nav-bar .hamburger-m{display:flex;flex-wrap:wrap;align-content:space-between;height:25px;width:34px}.nav-view2 .nav-bar .hamburger-m .line{width:34px;height:2.6px;background-color:#5700e4;border-radius:1.4px;transition:.4s}.nav-view2 .nav-bar .hamburger-m .changeLine{transform:translateY(11.5px) rotate(-45deg);opacity:1;transition:.4s}.nav-view2 .nav-bar .hamburger-m .changeLine2{transform:rotate(180deg);opacity:0;transition:.4s}.nav-view2 .nav-bar .hamburger-m .changeLine3{transform:translateY(-9.5px) rotate(45deg);opacity:1;transition:.4s}.nav-view2 .small-munu{display:block;flex-wrap:wrap;padding:16px 0;background-color:#fff;transition:.4s}.nav-view2 .small-munu li{display:flex;align-items:center;justify-content:center;width:100%;height:60px;margin-bottom:16px}.nav-view2 .small-munu li a{color:#333;font-family:Roboto;font-size:22px;font-weight:700;line-height:120%}.nav-view2 .small-munu li .click-a{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%;background-color:#f2ebff;color:#5700e4;padding-bottom:10px}.nav-view2 .small-munu li .click-a:after{content:"";width:20px;height:2px;background-color:#5700e4;position:absolute;top:80%;left:49%;border-radius:50px}}@media screen and (max-width:600px){.nav-view2 .nav-bar .logo img{width:35px;height:35px;margin-right:15px}.nav-view2 .nav-bar .logo p{font-size:26px}.nav-view2 .nav-bar .logo .foot_logo_img{margin-left:-20px}}@media screen and (max-width:400px){.nav-view2 .nav-bar .hamburger-m{display:flex;flex-wrap:wrap;align-content:space-between;height:19px;width:20px}.nav-view2 .nav-bar .hamburger-m .line{width:20px;height:2.6px;background-color:#5700e4;border-radius:1.3px}.nav-view2 .nav-bar .hamburger-m .changeLine{transform:translateY(9px) rotate(-45deg);opacity:1}.nav-view2 .nav-bar .hamburger-m .changeLine2{transform:rotate(180deg);opacity:0;transition:.4s}.nav-view2 .nav-bar .hamburger-m .changeLine3{transform:translateY(-6.5px) rotate(45deg);opacity:1}.nav-view2 .nav-bar .logo .foot_logo_img{margin-left:-20px}}
.foot{background:#11110f;height:auto;padding-top:119px;padding-bottom:20px}.foot_top{text-align:center;padding-bottom:90px;border-bottom:1px solid #818181}.foot_top h2{font-size:50px;font-weight:700;line-height:120%;margin-bottom:76px}.foot_top h2,.foot_top p{color:#333;font-family:Roboto}.foot_top p{text-align:center;font-size:22px;font-weight:500;line-height:154%}.foot_bom{margin-top:80px}.foot_bom,.foot_menu ul{display:flex;justify-content:space-between;align-items:center}.foot_menu ul li a{font-weight:700;border-bottom:1px solid #333}.foot_menu ul li a,.foot_menu ul li span{color:#333;font-family:Roboto;font-size:22px;line-height:120%}.foot_menu ul li span{font-weight:400}.foot_menu{max-width:933px;width:90%;margin-right:auto}.foot_text p{color:#333;font-family:Roboto;text-align:center;font-size:14px;font-weight:400;line-height:154%}.foot_text{margin-top:40px}.foot_logo_img{width:250px;height:133px}.phone-logo{display:none}.rights{width:100%;text-align:center}@media screen and (max-width:1200px){.foot_logo{display:none}.phone-logo{display:flex;align-items:center;margin-top:50px}.phone-logo img{margin-right:15px}.phone-logo P{color:#333;font-family:Roboto;font-size:20px;font-weight:700;line-height:120%}}@media screen and (max-width:950px){.foot{padding:64px 0 60px;height:auto}.foot_bom{margin-top:25px}.foot_top h2{margin-bottom:15px}.foot_top{padding-bottom:70px}.foot_menu ul{flex-wrap:wrap}.foot_menu ul li{width:100%;margin-bottom:25px}}@media screen and (max-width:450px){.foot_top h2{font-size:28px}.foot_menu ul li a,.foot_menu ul li span,.foot_top p{font-size:18px}.foot_text p{font-size:10px}}
.rich_foot{padding:50px 0 0;display:flex;flex-direction:column;align-items:flex-start}.rich_foot .title{font-size:26px!important}.rich_foot p{width:100%;font-size:16px;margin-bottom:20px}.rich_foot p a{text-decoration:underline;margin-right:20px}@media screen and (max-width:400px){.rich_foot p a{display:block}}
.richchiangmai_container{background:#fffdf4;padding-top:80px}.richchiangmai_container .richchiangmai_banner{width:100%;height:529px;background-image:url(/2c60e61/img/banner.34d3871.png);background-size:120% 120%;background-repeat:no-repeat;background-position:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}.richchiangmai_container .richchiangmai_banner .mask{width:100%;height:100%;background-color:#1d1e20;opacity:.51;position:absolute;left:0;top:0;z-index:0}.richchiangmai_container .richchiangmai_banner_title{width:800px;color:#fff;font-size:64px;text-align:center;z-index:1;font-weight:700}.richchiangmai_container .richchiangmai_banner_desc{width:800px;color:#fff;font-size:16px;text-align:center;z-index:1;margin-top:25px;line-height:22px}.richchiangmai_container .richchiangmai_secetion1{margin-top:100px;display:flex;padding:0 120px}.richchiangmai_container .richchiangmai_secetion1 .left{flex:1;margin-top:30px}.richchiangmai_container .richchiangmai_secetion1 .title{color:#2874a6;font-size:48px;line-height:1.3;font-weight:700}.richchiangmai_container .richchiangmai_secetion1 p{color:#56585e;font-size:16px;line-height:1.5;margin-top:30px;width:81%}.richchiangmai_container .richchiangmai_secetion1 .right{position:relative;flex:1}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container{background-color:#a3e4d7;width:520px;height:160px;position:absolute;right:50px;bottom:-100px;display:flex}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc{width:350px;font-size:18px;position:absolute;left:100px;top:80px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto{font-size:48px;position:absolute;left:80px;top:50px}.richchiangmai_container .richchiangmai_secetion1 .right .post{border-radius:25px}.richchiangmai_secetion2{margin-top:250px;padding:0 120px;display:flex;flex-direction:column;align-items:center}.richchiangmai_secetion2 .title{width:100%;font-size:48px;line-height:1.3;color:#2874a6;text-align:center;font-weight:700}.richchiangmai_secetion2 .desc{font-size:16px;line-height:1.5;width:600px;text-align:center;color:#0d141a;margin-top:20px;margin-bottom:20px}.richchiangmai_secetion2 ul{display:flex;flex-wrap:wrap}.richchiangmai_secetion2 li{display:flex;flex-direction:column;background-color:#a3e4d7;width:32%;height:auto;padding:50px;margin-bottom:70px}.richchiangmai_secetion2 li h6{font-size:18px;margin-bottom:15px}.richchiangmai_secetion2 li p{font-size:16px;line-height:1.5;color:#56585e}.richchiangmai_secetion3{margin-top:50px;padding:0 120px;display:flex;justify-content:space-between}.richchiangmai_secetion3 .left{flex:1;margin-top:30px}.richchiangmai_secetion3 .left .title{color:#2874a6;font-size:48px;line-height:1.3;font-weight:700}.richchiangmai_secetion3 .left p{color:#56585e;font-size:16px;line-height:1.5;margin-top:30px;width:81%}.richchiangmai_secetion3 .left a{display:flex;justify-content:center;align-items:center;background-color:#a3e4d7;color:#000;border-radius:28px;width:194px;height:56px;font-weight:700;margin-top:40px}.richchiangmai_secetion3 .left a:hover{background-color:#2874a6;color:#fff}.richchiangmai_secetion3 .right{display:flex}.richchiangmai_secetion3 .right .img1{width:293px;height:584px}.richchiangmai_secetion3 .right .img2_container{display:flex;flex-direction:column}.richchiangmai_secetion3 .right .img2_container .img2{width:297px;height:424px;margin-bottom:10px;border-radius:20px}.richchiangmai_secetion3 .right .img2_container .img3{width:297px;height:144px;border-radius:20px}@media screen and (min-width:1600px){.richchiangmai_secetion1,.richchiangmai_secetion2,.richchiangmai_secetion3{padding:0 300px}}@media screen and (max-width:1450px){.richchiangmai_container .richchiangmai_secetion1,.richchiangmai_secetion2{padding:0}.richchiangmai_secetion2 ul{margin-top:30px;padding-left:10px;width:70%}.richchiangmai_secetion2 li{margin-bottom:30px;height:auto;width:32%}.richchiangmai_secetion3{margin-top:0;padding:0}}@media screen and (max-width:986px){.richchiangmai_container .richchiangmai_banner_title{font-size:40px;width:100%}.richchiangmai_container .richchiangmai_banner_desc{width:100%}.richchiangmai_container .richchiangmai_secetion1{display:flex;padding:0 20px;margin-top:20px}.richchiangmai_container .richchiangmai_secetion1 .title{font-size:32px}.richchiangmai_container .richchiangmai_secetion1 .right .post{width:328px;height:248px;margin-top:50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container{width:306px;height:144px;position:absolute;right:18px;bottom:-50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto{position:absolute;left:10px;top:10px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc{position:absolute;left:40px;top:40px;width:220px}.richchiangmai_secetion2{margin-top:100px;padding:0 20px}.richchiangmai_secetion2 .title{font-size:32px}.richchiangmai_secetion2 .desc{width:100%}.richchiangmai_secetion2 ul{margin-top:30px}.richchiangmai_secetion2 li{width:32%;padding:20px;margin-bottom:30px}.richchiangmai_secetion3{margin-top:0;padding:0 20px}.richchiangmai_secetion3 .left p{width:100%;margin-top:20px}.richchiangmai_secetion3 .left a{margin-top:20px}.richchiangmai_secetion3 .right{margin-top:30px}.richchiangmai_secetion3 .right .img1{width:158px;height:320px}.richchiangmai_secetion3 .right .img2_container .img2{width:158px;height:224px}.richchiangmai_secetion3 .right .img2_container .img3{width:164px;height:88px}}@media screen and (max-width:700px){.richchiangmai_container .richchiangmai_banner_title{font-size:40px;width:100%}.richchiangmai_container .richchiangmai_banner_desc{width:100%}.richchiangmai_container .richchiangmai_secetion1{display:flex;flex-direction:column;padding:0 20px;margin-top:20px}.richchiangmai_container .richchiangmai_secetion1 .title{font-size:32px}.richchiangmai_container .richchiangmai_secetion1 .right .post{width:328px;height:248px;margin-top:50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container{width:306px;height:144px;position:absolute;right:18px;bottom:-50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto{position:absolute;left:10px;top:10px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc{position:absolute;left:40px;top:40px;width:220px}.richchiangmai_secetion2{margin-top:100px;padding:0 20px}.richchiangmai_secetion2 .title{font-size:32px}.richchiangmai_secetion2 .desc{width:100%}.richchiangmai_secetion2 ul{margin-top:30px}.richchiangmai_secetion2 li{width:100%;height:auto;padding:20px;margin-bottom:30px}.richchiangmai_secetion3{margin-top:0;padding:0 20px;flex-direction:column}.richchiangmai_secetion3 .left p{width:100%;margin-top:20px}.richchiangmai_secetion3 .left a{margin-top:20px}.richchiangmai_secetion3 .right{margin-top:30px}.richchiangmai_secetion3 .right .img1{width:158px;height:320px}.richchiangmai_secetion3 .right .img2_container .img2{width:158px;height:224px}.richchiangmai_secetion3 .right .img2_container .img3{width:164px;height:88px}}@media screen and (max-width:470px){.richchiangmai_container .richchiangmai_banner_title{font-size:40px;width:100%}.richchiangmai_container .richchiangmai_banner_desc{width:100%}.richchiangmai_container .richchiangmai_secetion1{display:flex;flex-direction:column;padding:0 20px;margin-top:20px}.richchiangmai_container .richchiangmai_secetion1 .title{font-size:32px}.richchiangmai_container .richchiangmai_secetion1 .right .post{width:328px;height:248px;margin-top:50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container{width:306px;height:144px;position:absolute;right:18px;bottom:-50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto{position:absolute;left:10px;top:10px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc{position:absolute;left:40px;top:40px;width:220px}.richchiangmai_secetion2{margin-top:100px;padding:0 20px}.richchiangmai_secetion2 .title{font-size:32px}.richchiangmai_secetion2 .desc{width:100%}.richchiangmai_secetion2 ul{margin-top:30px}.richchiangmai_secetion2 li{width:100%;height:auto;padding:20px;margin-bottom:30px}.richchiangmai_secetion3{margin-top:0;padding:0 20px;flex-direction:column}.richchiangmai_secetion3 .left p{width:100%;margin-top:20px}.richchiangmai_secetion3 .left a{margin-top:20px}.richchiangmai_secetion3 .right{margin-top:30px}.richchiangmai_secetion3 .right .img1{width:158px;height:320px}.richchiangmai_secetion3 .right .img2_container .img2{width:158px;height:224px}.richchiangmai_secetion3 .right .img2_container .img3{width:164px;height:88px}}@media screen and (max-width:768px){.richchiangmai_container .richchiangmai_banner_title{font-size:40px;width:100%}.richchiangmai_container .richchiangmai_banner_desc{width:100%}.richchiangmai_container .richchiangmai_secetion1{display:flex;flex-direction:column;padding:0 20px;margin-top:20px}.richchiangmai_container .richchiangmai_secetion1 .title{font-size:32px}.richchiangmai_container .richchiangmai_secetion1 .right .post{width:328px;height:248px;margin-top:50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container{width:306px;height:144px;position:absolute;right:18px;bottom:-50px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto{position:absolute;left:10px;top:10px}.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc{position:absolute;left:40px;top:40px;width:220px}.richchiangmai_secetion2{margin-top:100px;padding:0 20px}.richchiangmai_secetion2 .title{font-size:32px}.richchiangmai_secetion2 .desc{width:100%}.richchiangmai_secetion2 ul{margin-top:30px}.richchiangmai_secetion2 li{width:100%;height:auto;padding:20px;margin-bottom:30px}.richchiangmai_secetion3{margin-top:0;padding:0 20px;flex-direction:column}.richchiangmai_secetion3 .left p{width:100%;margin-top:20px}.richchiangmai_secetion3 .left a{margin-top:20px}.richchiangmai_secetion3 .right{margin-top:30px}.richchiangmai_secetion3 .right .img1{width:158px;height:320px}.richchiangmai_secetion3 .right .img2_container .img2{width:158px;height:224px}.richchiangmai_secetion3 .right .img2_container .img3{width:164px;height:88px}}
.gm3{max-width:1450px;width:95%;margin:0 auto}@media screen and (max-width:770px){.gm3{max-width:1450px;width:100%;padding:0 20px}}.box3{width:100%;padding:240px 0 10px;text-align:center}.box3 h2{color:#5700e4}.box3 h2,.gm3 h4{font-family:Roboto;font-size:50px;font-weight:700;line-height:120%}.gm3 h4{color:#333;margin-top:110px}.gm3 h5{color:#5700e4;font-size:35px;line-height:120%;margin-top:90px}.gm3 h5,.gm3 h6{font-family:Roboto;font-weight:700}.gm3 h6{color:#333;font-size:25px;line-height:150%}.clearfix-box3{width:100%;height:400px;background-color:hsla(0,0%,100%,0)}@media screen and (max-width:800px){.box3{padding:160px 0 0}.box3 h2,.gm3 h4{font-size:28px}.gm3 h4{margin-top:60px}.gm3 h5{font-size:20px;line-height:185%;margin:35px 0 10px}.gm3 h6{font-size:18px;line-height:200%}.blank-h{font-size:18px;line-height:185%}.clearfix-box3{height:101px}}@media screen and (max-width:380px){.box3{width:215px;margin:0 auto}}
.gm1{max-width:1450px;width:95%;margin:0 auto}@media screen and (max-width:770px){.gm1{max-width:1450px;width:100%;padding:0 20px}}.box1{width:100%;padding:100px 0 50px 10px;text-align:center}.box1 h2{font-size:50px}.box1 h2,.gm1 h4{color:#5700e4;font-family:Roboto;font-weight:700;line-height:120%}.gm1 h4{font-size:35px;margin-top:100px}.gm1 h5{color:#333;font-size:25px;line-height:150%;margin:50px 0 20px}.gm1 h5,.gm1 h6{font-family:Roboto;font-weight:700}.gm1 h6{color:#666;font-size:22px;line-height:230%}.gm1 .blank-h{color:#333!important;line-height:195%}.clearfix-box1{width:100%;height:400px;background-color:hsla(0,0%,100%,0)}.gm1 h6 a{color:#336df4}.h6-25{margin-bottom:25px}@media screen and (max-width:800px){.box1{padding:160px 0 0}.box1 h2{font-size:28px}.gm1 h4{margin-top:60px;font-size:20px}.gm1 h5{font-size:18px;line-height:185%;margin:35px 0 10px}.gm1 h6{font-size:16px;line-height:200%}.gm1 .blank-h{font-size:18px;line-height:185%}.clearfix-box1{height:101px}.h6-25{margin-bottom:15px}}
.gm2{max-width:1450px;width:95%;margin:0 auto}@media screen and (max-width:770px){.gm2{max-width:1450px;width:100%;padding:0 20px}}.box2{width:100%;padding:240px 0 10px;text-align:center}.box2 h2{font-size:50px}.box2 h2,.gm2 h4{color:#5700e4;font-family:Roboto;font-weight:700;line-height:120%}.gm2 h4{font-size:35px;margin-top:100px}.gm2 h5{color:#333;font-size:25px;line-height:150%;margin:50px 0 20px}.gm2 h5,.gm2 h6{font-family:Roboto;font-weight:700}.gm2 h6{color:#666;font-size:22px;line-height:230%}.gm2 .blank-h{color:#333!important;line-height:195%}.clearfix-box2{width:100%;height:400px;background-color:hsla(0,0%,100%,0)}@media screen and (max-width:800px){.box2{padding:160px 0 0}.box2 h2{font-size:28px}.gm2 h4{margin-top:60px;font-size:20px}.gm2 h5{font-size:18px;line-height:185%;margin:35px 0 10px}.gm2 h6{font-size:16px;line-height:200%}.gm2 .blank-h{font-size:18px;line-height:185%}.clearfix-box2{height:101px}}

:root {
  --brand-ink: #11110f;
  --brand-olive: #232619;
  --brand-muted: #6f7568;
  --brand-lime: #d5ff35;
  --brand-lime-deep: #9fdb18;
  --brand-gold: #ffb21a;
  --brand-coral: #fb7185;
  --brand-paper: #fffdf4;
  --brand-soft: #f7f8ed;
  --brand-line: #e4e8d4;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-size: 16px;
  font-family: "Roboto", "Noto Sans Thai", Arial, sans-serif;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

.nav-view .nav-bar,
.nav-view2 .nav-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.nav-view .menu ul,
.nav-view2 .menu ul {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.nav-view .hamburger-m,
.nav-view2 .hamburger-m {
  display: none !important;
  width: 34px !important;
  height: 25px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: stretch !important;
}

.nav-view .hamburger-m .line,
.nav-view2 .hamburger-m .line {
  display: block !important;
  width: 100% !important;
  height: 3px !important;
  border-radius: 999px !important;
  transition: transform 0.24s ease, opacity 0.24s ease !important;
}

.nav-view .hamburger-m .changeLine,
.nav-view2 .hamburger-m .changeLine {
  transform: translateY(11px) rotate(-45deg) !important;
}

.nav-view .hamburger-m .changeLine2,
.nav-view2 .hamburger-m .changeLine2 {
  opacity: 0 !important;
}

.nav-view .hamburger-m .changeLine3,
.nav-view2 .hamburger-m .changeLine3 {
  transform: translateY(-11px) rotate(45deg) !important;
}

.small-munu {
  display: none !important;
}

.small-munu.is-open {
  display: block !important;
}

.foot_bom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.foot_menu ul {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.phone-logo {
  display: none !important;
}

.product-app-page {
  overflow: hidden;
  background: linear-gradient(180deg, #fffdf4 0%, #ffffff 42%, #f7f8ed 100%);
  color: var(--brand-ink);
}

.product-shell {
  width: calc(100% - 64px);
  max-width: 1180px;
  margin: 0 auto;
}

.product-hero {
  position: relative;
  min-height: 720px;
  padding: 158px 0 98px;
  background:
    linear-gradient(112deg, rgba(17, 17, 15, 0.96) 0%, rgba(35, 38, 25, 0.94) 58%, rgba(247, 248, 237, 0.96) 58%, rgba(255, 253, 244, 1) 100%);
}

.product-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0.06) 1px, transparent 1px, transparent 18px);
  opacity: 0.42;
}

.product-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 84px;
  align-items: center;
}

.product-eyebrow {
  margin: 0 0 18px;
  color: var(--brand-lime-deep);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

.product-hero .product-eyebrow {
  color: var(--brand-lime);
}

.product-hero h1,
.product-section-head h2,
.product-trust-band h2,
.product-bottom-cta h2 {
  margin: 0;
  font-weight: 700;
  letter-spacing: 0;
}

.product-hero h1 {
  max-width: 680px;
  color: #ffffff;
  font-size: 56px;
  line-height: 1.12;
}

.product-lead {
  max-width: 660px;
  margin: 28px 0 0;
  color: rgba(248, 250, 243, 0.82);
  font-size: 19px;
  line-height: 1.76;
}

.product-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 22px;
  margin-top: 38px;
}

.product-store-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  box-shadow: 0 18px 34px rgba(17, 17, 15, 0.22);
}

.product-store-link img {
  width: 168px;
  height: auto;
  border-radius: 8px;
}

.product-text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  border-bottom: 1px solid rgba(213, 255, 53, 0.6);
}

.product-hero-visual {
  position: relative;
  display: flex;
  justify-content: center;
}

.product-hero-visual::before {
  content: "";
  position: absolute;
  inset: 50px 8px 46px auto;
  width: 112px;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(213, 255, 53, 0.42), rgba(255, 178, 26, 0.38));
  box-shadow: none;
}

.product-phone {
  position: relative;
  z-index: 1;
  padding: 10px 9px 12px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 32px;
  background: linear-gradient(145deg, #2d3129 0%, #11130f 52%, #070806 100%);
  box-shadow:
    0 28px 52px rgba(17, 17, 15, 0.2),
    inset 0 1px 1px rgba(255, 255, 255, 0.22),
    inset 0 -8px 14px rgba(0, 0, 0, 0.28);
}

.product-phone::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 50%;
  z-index: 2;
  width: 50px;
  height: 5px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
}

.product-phone::after {
  display: none;
}

.product-phone-screen {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 293 / 584;
  border-radius: 23px;
  background: #fffdf4;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    0 10px 18px rgba(0, 0, 0, 0.22);
}

.product-phone-screen img {
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.product-phone-hero {
  width: 310px;
}

/* Keep the product hero device identical to the Android model on the homepage. */
.product-phone-hero.android-phone {
  isolation: isolate;
  overflow: visible;
  width: 316px;
  padding: 15px 14px 19px;
  border-radius: 40px;
  background: linear-gradient(145deg, #2d3129 0%, #080908 46%, #171916 100%);
  box-shadow:
    0 34px 68px rgba(17, 17, 15, 0.2),
    inset 0 1px 1px rgba(255, 255, 255, 0.22),
    inset 0 -10px 18px rgba(0, 0, 0, 0.3);
}

.product-phone-hero.android-phone::before {
  top: 8px;
  width: 66px;
  height: 6px;
}

.product-phone-hero.android-phone::after {
  content: "";
  position: absolute;
  top: 12px;
  right: calc(50% - 55px);
  z-index: 2;
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #050605;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.08);
}

.product-phone-hero .android-phone-screen {
  z-index: 1;
  width: 288px;
  max-width: 100%;
  aspect-ratio: auto;
  border-radius: 28px;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    0 12px 22px rgba(0, 0, 0, 0.28);
}

.product-phone-hero .android-phone-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(17, 17, 15, 0.14);
}

.product-phone-hero .android-phone-screen img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
}

.product-phone-hero .android-phone-button {
  position: absolute;
  z-index: 0;
  display: block;
  width: 4px;
  background: linear-gradient(180deg, #454a42, #11130f);
  box-shadow: inset 1px 0 rgba(255, 255, 255, 0.16);
}

.product-phone-hero .android-phone-button-volume {
  top: 112px;
  left: -4px;
  height: 72px;
  border-radius: 4px 0 0 4px;
}

.product-phone-hero .android-phone-button-power {
  top: 204px;
  right: -4px;
  height: 48px;
  border-radius: 0 4px 4px 0;
}

@media screen and (max-width: 560px) {
  .product-phone-hero.android-phone {
    width: min(100%, 304px);
    padding: 14px 12px 18px;
    border-radius: 36px;
  }

  .product-phone-hero .android-phone-screen {
    width: 100%;
    border-radius: 25px;
  }
}

.product-section {
  padding: 102px 0;
}

.product-section-head {
  max-width: 760px;
  margin-bottom: 42px;
}

.product-section-head h2 {
  color: var(--brand-ink);
  font-size: 40px;
  line-height: 1.18;
}

.product-section-head p:not(.product-eyebrow) {
  margin: 18px 0 0;
  color: var(--brand-muted);
  font-size: 17px;
  line-height: 1.78;
}

.product-info-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.product-info-card,
.product-screen-card {
  border: 1px solid var(--brand-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 32px rgba(17, 17, 15, 0.08);
}

.product-info-card {
  min-height: 220px;
  padding: 26px 24px;
}

.product-info-card span,
.product-screen-card span {
  color: var(--brand-muted);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.product-info-card strong {
  display: block;
  margin-top: 18px;
  color: var(--brand-ink);
  font-size: 34px;
  line-height: 1.08;
}

.product-info-card p {
  margin: 18px 0 0;
  color: var(--brand-muted);
  font-size: 15px;
  line-height: 1.62;
}

.product-flow {
  background: linear-gradient(135deg, #11110f 0%, #232619 100%);
}

.product-flow-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(420px, 1fr);
  gap: 78px;
  align-items: start;
}

.product-flow .product-eyebrow {
  color: var(--brand-lime);
}

.product-flow .product-section-head h2 {
  color: #ffffff;
}

.product-flow .product-section-head p:not(.product-eyebrow) {
  color: rgba(248, 250, 243, 0.76);
}

.product-flow-list {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-flow-list li {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  padding: 24px;
  border: 1px solid rgba(213, 255, 53, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.065);
}

.product-flow-list span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 8px;
  color: var(--brand-ink);
  background: linear-gradient(135deg, var(--brand-lime), var(--brand-gold));
  font-size: 16px;
  font-weight: 700;
}

.product-flow-list h3,
.product-screen-card h3 {
  margin: 0;
  color: var(--brand-ink);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.34;
  letter-spacing: 0;
}

.product-flow-list h3 {
  color: #ffffff;
}

.product-flow-list p,
.product-screen-card p,
.product-trust-band p,
.product-bottom-cta p {
  margin: 10px 0 0;
  color: var(--brand-muted);
  font-size: 15px;
  line-height: 1.7;
}

.product-flow-list p {
  color: rgba(248, 250, 243, 0.7);
}

.product-screens {
  background: var(--brand-soft);
}

.product-screen-grid {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: 18px;
}

.product-screen-card {
  display: grid;
  grid-template-columns: 164px minmax(0, 1fr);
  gap: 30px;
  align-items: center;
  padding: 28px;
}

.product-screen-card-large {
  grid-row: span 2;
  grid-template-columns: minmax(220px, 0.82fr) minmax(0, 1fr);
  padding: 34px;
}

.product-phone-card {
  width: 224px;
  margin: 0 auto;
  padding: 9px 8px 11px;
  border-radius: 30px;
}

.product-phone-card .product-phone-screen {
  border-radius: 21px;
}

.product-screen-shot {
  width: 164px;
  margin: 0 auto;
  border: 1px solid rgba(35, 38, 25, 0.08);
  border-radius: 8px;
  background: #fffdf4;
  box-shadow: 0 16px 30px rgba(17, 17, 15, 0.1);
}

.product-screen-shot-wide {
  width: 192px;
}

.product-screen-card span {
  display: block;
  margin-bottom: 12px;
  color: var(--brand-lime-deep);
}

.product-clarity-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1fr);
  gap: 22px;
  align-items: stretch;
}

.product-clarity-panel {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  padding: 36px;
  border: 1px solid rgba(35, 38, 25, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(140deg, rgba(17, 17, 15, 0.96), rgba(35, 38, 25, 0.94)),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0.08) 1px, transparent 1px, transparent 18px);
  box-shadow: 0 18px 42px rgba(17, 17, 15, 0.16);
}

.product-clarity-panel::after {
  content: "";
  position: absolute;
  right: -74px;
  bottom: -74px;
  width: 220px;
  height: 220px;
  border: 1px solid rgba(213, 255, 53, 0.28);
  border-radius: 50%;
  background: rgba(213, 255, 53, 0.08);
}

.product-clarity-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  color: var(--brand-ink);
  background: linear-gradient(135deg, var(--brand-lime), var(--brand-gold));
  font-size: 24px;
  font-weight: 800;
  font-family: Arial, sans-serif;
}

.product-clarity-panel h3 {
  position: relative;
  z-index: 1;
  margin: 34px 0 0;
  color: #ffffff;
  font-size: 30px;
  line-height: 1.25;
}

.product-clarity-panel p {
  position: relative;
  z-index: 1;
  margin: 18px 0 0;
  color: rgba(248, 250, 243, 0.76);
  font-size: 16px;
  line-height: 1.75;
}

.product-clarity-panel ul {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.product-clarity-panel li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  color: rgba(248, 250, 243, 0.82);
  font-size: 14px;
  line-height: 1.55;
}

.product-clarity-panel li::before {
  content: "";
  width: 8px;
  height: 8px;
  margin-top: 8px;
  border-radius: 50%;
  background: var(--brand-lime);
  box-shadow: 0 0 0 5px rgba(213, 255, 53, 0.12);
  flex: 0 0 auto;
}

.product-clarity-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.product-clarity-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  min-height: 198px;
  padding: 28px 26px;
  border: 1px solid var(--brand-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 32px rgba(17, 17, 15, 0.08);
}

.product-clarity-card span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  color: var(--brand-lime-deep);
  background: rgba(213, 255, 53, 0.14);
  border: 1px solid rgba(159, 219, 24, 0.22);
  font-size: 14px;
  font-weight: 800;
}

.product-clarity-card h3 {
  margin: 0;
  color: var(--brand-ink);
  font-size: 21px;
  line-height: 1.34;
}

.product-clarity-card p {
  margin: 12px 0 0;
  color: var(--brand-muted);
  font-size: 15px;
  line-height: 1.7;
}

.product-trust {
  padding: 96px 0 0;
  background: #ffffff;
}

.product-trust-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 56px;
  align-items: center;
  padding: 48px;
  border-radius: 8px;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(17, 17, 15, 0.96), rgba(35, 38, 25, 0.95)),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0.08) 1px, transparent 1px, transparent 18px);
}

.product-trust-band .product-eyebrow {
  color: var(--brand-lime);
}

.product-trust-band h2 {
  color: #ffffff;
  font-size: 38px;
  line-height: 1.18;
}

.product-trust-band p {
  color: rgba(248, 250, 243, 0.76);
}

.product-trust-list {
  display: grid;
  gap: 12px;
}

.product-trust-list p {
  margin: 0;
  padding: 16px 18px;
  border: 1px solid rgba(213, 255, 53, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.07);
  color: #f8faf3;
  font-weight: 700;
}

.product-bottom-cta {
  padding: 88px 0 108px;
  text-align: center;
  background: #ffffff;
}

.product-bottom-cta h2 {
  color: var(--brand-ink);
  font-size: 38px;
  line-height: 1.18;
}

.product-bottom-cta p {
  max-width: 620px;
  margin: 16px auto 28px;
  color: var(--brand-muted);
  font-size: 17px;
}

.product-bottom-cta .product-store-link {
  margin: 0 auto;
}

@media screen and (max-width: 1200px) {
  .nav-view .menu,
  .nav-view2 .menu {
    display: none !important;
  }

  .nav-view .hamburger-m,
  .nav-view2 .hamburger-m {
    display: flex !important;
  }

  .small-munu ul {
    margin: 0 !important;
    padding: 16px 0 !important;
    list-style: none !important;
  }

  .product-static-nav .small-munu li {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 58px !important;
  }

  .product-static-nav .small-munu a {
    width: 100% !important;
    padding: 18px 20px !important;
    color: #f8faf3 !important;
    text-align: center !important;
    font-size: 20px !important;
    font-weight: 700 !important;
  }

  .phone-logo {
    display: flex !important;
    align-items: center !important;
    margin-top: 28px !important;
  }

  .foot_logo {
    display: none !important;
  }
}

@media screen and (max-width: 1020px) {
  .product-hero {
    min-height: auto;
    padding: 132px 0 88px;
    background: linear-gradient(180deg, rgba(17, 17, 15, 0.97) 0%, rgba(35, 38, 25, 0.95) 64%, #fffdf4 64%, #fffdf4 100%);
  }

  .product-hero-grid,
  .product-flow-grid,
  .product-screen-grid,
  .product-trust-band {
    grid-template-columns: 1fr;
  }

  .product-hero-grid {
    gap: 64px;
  }

  .product-hero h1 {
    font-size: 44px;
  }

  .product-lead {
    font-size: 17px;
  }

  .product-hero-visual {
    justify-content: center;
  }

  .product-hero-visual::before {
    inset: 42px auto 40px 50%;
    width: 88px;
    transform: translateX(38px);
  }

  .product-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-flow-grid {
    gap: 32px;
  }

  .product-screen-card-large {
    grid-row: auto;
  }

  .product-trust-band {
    gap: 32px;
  }
}

@media screen and (max-width: 720px) {
  .product-shell {
    width: calc(100% - 40px);
  }

  .product-hero {
    padding: 112px 0 72px;
  }

  .product-hero h1 {
    font-size: 34px;
    line-height: 1.18;
  }

  .product-lead {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.68;
  }

  .product-hero-actions {
    gap: 18px;
    margin-top: 30px;
  }

  .product-text-link {
    min-height: auto;
    font-size: 15px;
  }

  .product-phone-hero {
    width: 258px;
  }

  .product-section {
    padding: 72px 0;
  }

  .product-section-head {
    margin-bottom: 30px;
  }

  .product-section-head h2,
  .product-trust-band h2,
  .product-bottom-cta h2 {
    font-size: 29px;
    line-height: 1.24;
  }

  .product-section-head p:not(.product-eyebrow),
  .product-bottom-cta p {
    font-size: 15px;
  }

  .product-info-grid {
    grid-template-columns: 1fr;
  }

  .product-info-card {
    min-height: auto;
    padding: 24px;
  }

  .product-info-card strong {
    font-size: 30px;
  }

  .product-flow-list li {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 16px;
    padding: 20px;
  }

  .product-flow-list span {
    width: 46px;
    height: 46px;
    font-size: 14px;
  }

  .product-flow-list h3,
  .product-screen-card h3 {
    font-size: 18px;
  }

  .product-screen-card,
  .product-screen-card-large {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 24px;
  }

  .product-phone-card {
    width: 224px;
  }

  .product-screen-shot,
  .product-screen-shot-wide {
    width: min(100%, 260px);
  }

  .product-trust {
    padding-top: 72px;
  }

  .product-trust-band {
    padding: 30px 24px;
  }

  .product-bottom-cta {
    padding: 72px 0 88px;
  }

  .foot_bom,
  .foot_menu ul {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 18px !important;
  }
}

@media screen and (max-width: 420px) {
  .nav-view .hamburger-m,
  .nav-view2 .hamburger-m {
    width: 24px !important;
    height: 20px !important;
  }

  .nav-view .hamburger-m .changeLine,
  .nav-view2 .hamburger-m .changeLine {
    transform: translateY(8.5px) rotate(-45deg) !important;
  }

  .nav-view .hamburger-m .changeLine3,
  .nav-view2 .hamburger-m .changeLine3 {
    transform: translateY(-8.5px) rotate(45deg) !important;
  }

  .product-phone-hero {
    width: 238px;
  }

  .product-store-link img {
    width: 154px;
  }
}

.product-static-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 10 !important;
  width: 100% !important;
}

.product-static-nav .nav-bar {
  width: 100% !important;
  margin: 0 auto !important;
}

.product-static-nav .logo {
  display: flex !important;
  align-items: center !important;
}

.product-static-nav .menu li {
  position: relative !important;
  margin-right: 20px !important;
}

.product-static-nav .menu li:last-child {
  margin-right: 0 !important;
}

.product-static-nav .menu li a {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  font-weight: 700 !important;
}

.product-static-nav .menu li a::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  opacity: 0 !important;
  transition: opacity 0.24s ease !important;
}

.product-static-nav .menu li:hover a::after,
.product-static-nav .menu li .select-button::after {
  opacity: 1 !important;
}

.product-static-nav .menu li .select-button {
  color: var(--brand-ink) !important;
}

.product-static-nav .hamburger-m {
  appearance: none !important;
}

.product-static-nav .small-munu,
.nav-view .small-munu {
  width: 100% !important;
}

.product-static-nav .small-munu ul {
  margin: 0 !important;
  padding: 16px 0 !important;
  list-style: none !important;
}

.product-static-nav .small-munu li {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 60px !important;
}

.product-static-nav .small-munu a {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 18px 20px !important;
  color: #f8faf3 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.product-static-nav .small-munu .click-a {
  color: var(--brand-lime) !important;
  background: rgba(213, 255, 53, 0.14) !important;
}

html,
body {
  background: linear-gradient(180deg, #fbfff0 0%, #ffffff 46%, #fff8e2 100%) !important;
  color: var(--brand-ink) !important;
}

body {
  max-width: none !important;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(35, 38, 25, 0.58) !important;
  border: 2px solid rgba(251, 255, 240, 0.9) !important;
  border-radius: 999px !important;
}

::-webkit-scrollbar {
  width: 9px !important;
}

::-webkit-scrollbar-track {
  background-color: rgba(17, 17, 15, 0.04) !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(17, 17, 15, 0.72) !important;
}

a:focus-visible,
button:focus-visible {
  outline: 3px solid rgba(213, 255, 53, 0.75);
  outline-offset: 3px;
}

.gm,
.gm1,
.gm2,
.gm3,
.gm7,
.nav-view .nav-bar,
.nav-view2 .nav-bar {
  max-width: 1180px !important;
}

.nav-view,
.nav-view2,
.nav-view.scrolled {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 10 !important;
  width: 100% !important;
  background: rgba(17, 17, 15, 0.95) !important;
  border-bottom: 1px solid rgba(213, 255, 53, 0.18) !important;
  box-shadow: 0 16px 34px rgba(17, 17, 15, 0.16) !important;
  backdrop-filter: blur(14px);
}

.nav-view .nav-bar,
.nav-view2 .nav-bar {
  height: 76px !important;
  padding: 0 24px !important;
}

.nav-view .nav-bar .logo .foot_logo_img,
.nav-view2 .nav-bar .logo .foot_logo_img,
.nav-view .nav-bar .logo img,
.nav-view2 .nav-bar .logo img {
  width: 52px !important;
  height: 52px !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 5px !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16) !important;
}

.nav-view .menu li,
.nav-view2 .menu li {
  position: relative !important;
}

.nav-view .menu li a,
.nav-view2 .menu li a {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  height: 40px !important;
  line-height: 40px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  color: #f8faf3 !important;
  font-size: 16px !important;
}

.nav-view .menu li a::after,
.nav-view2 .menu li a::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: -1 !important;
  opacity: 0 !important;
  transition: opacity 0.5s !important;
  border-radius: 8px !important;
  background: var(--brand-lime) !important;
}

.nav-view .menu li:hover a::after,
.nav-view2 .menu li:hover a::after,
.nav-view .menu li .select-button::after,
.nav-view2 .menu li .select-button::after {
  opacity: 1 !important;
}

.nav-view .menu li:hover a,
.nav-view2 .menu li:hover a {
  color: var(--brand-lime) !important;
  background: transparent !important;
}

.nav-view .menu li .select-button,
.nav-view2 .menu li .select-button {
  color: var(--brand-ink) !important;
}

.nav-view .hamburger-m .line,
.nav-view2 .hamburger-m .line,
.nav-bar .hamburger-m .line {
  background-color: var(--brand-lime) !important;
}

.small-munu,
.nav-view2 .small-munu {
  background: var(--brand-ink) !important;
  border-top: 1px solid rgba(213, 255, 53, 0.18) !important;
}

.small-munu li a,
.nav-view2 .small-munu li a {
  color: #f8faf3 !important;
}

.small-munu li .click-a,
.nav-view2 .small-munu li .click-a {
  background: rgba(213, 255, 53, 0.14) !important;
  color: var(--brand-lime) !important;
}

.small-munu li .click-a::after,
.nav-view2 .small-munu li .click-a::after {
  background: var(--brand-lime) !important;
}

.richchiangmai_container {
  padding-top: 76px !important;
  background: linear-gradient(180deg, #fffdf4 0%, #ffffff 55%, #f7f8ed 100%) !important;
}

.richchiangmai_container .richchiangmai_banner {
  width: 100% !important;
  height: clamp(620px, calc(100vh - 116px), 820px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  position: relative !important;
  background-image: url("/2c60e61/img/banner.34d3871.png") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.richchiangmai_container .richchiangmai_banner .mask {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  background: linear-gradient(90deg, rgba(17, 17, 15, 0.9), rgba(35, 38, 25, 0.62)) !important;
  opacity: 1 !important;
}

.richchiangmai_container .richchiangmai_banner_app {
  z-index: 1 !important;
  margin-bottom: 18px !important;
  color: var(--brand-lime) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

.richchiangmai_container .richchiangmai_banner_title {
  z-index: 1 !important;
  max-width: 980px !important;
  width: calc(100% - 40px) !important;
  color: #ffffff !important;
  font-size: 52px !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
  text-align: center !important;
}

.richchiangmai_container .richchiangmai_banner_desc {
  z-index: 1 !important;
  max-width: 820px !important;
  width: calc(100% - 40px) !important;
  margin-top: 25px !important;
  color: #eef4df !important;
  font-size: 18px !important;
  line-height: 1.65 !important;
  text-align: center !important;
}

.richchiangmai_container .richchiangmai_banner_note {
  z-index: 1 !important;
  margin-top: 24px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  color: rgba(248, 250, 243, 0.86) !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  text-shadow: 0 2px 12px rgba(17, 17, 15, 0.48) !important;
}

.richchiangmai_container .richchiangmai_banner_note::before,
.richchiangmai_container .richchiangmai_banner_note::after {
  content: "" !important;
  display: block !important;
  width: 42px !important;
  height: 1px !important;
  background: rgba(213, 255, 53, 0.48) !important;
}

.richchiangmai_container .richchiangmai_secetion1 .title,
.richchiangmai_secetion2 .title,
.richchiangmai_secetion3 .left .title,
.ina_tit h2,
.inb_tit h2,
.inc_tit h2,
.ind_tit h2,
.box1 h2,
.box2 h2,
.box3 h2,
.gm1 h4,
.gm2 h4,
.gm3 h4 {
  color: var(--brand-ink) !important;
}

.ina_txt p,
.inb_txt p,
.inc_txt p,
.ind_item p,
.gm1 h6,
.gm2 h6,
.gm3 h6 {
  color: var(--brand-muted) !important;
}

.richchiangmai_container .richchiangmai_secetion1,
.richchiangmai_secetion3 {
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.richchiangmai_container .richchiangmai_secetion1 {
  display: grid !important;
  grid-template-columns: minmax(0, 1.16fr) minmax(380px, 0.84fr) !important;
  gap: 60px !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding: 112px 32px 124px !important;
}

.richchiangmai_container .richchiangmai_secetion1 .left {
  margin-top: 0 !important;
}

.richchiangmai_container .richchiangmai_secetion1 .title,
.richchiangmai_secetion3 .left .title {
  font-size: 38px !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  max-width: 680px !important;
}

.richchiangmai_container .richchiangmai_secetion1 .left::before,
.richchiangmai_secetion3 .left::before {
  content: "" !important;
  display: block !important;
  width: 64px !important;
  height: 6px !important;
  margin-bottom: 24px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--brand-lime), var(--brand-gold)) !important;
}

.richchiangmai_container .richchiangmai_secetion1 p,
.richchiangmai_secetion3 .left p {
  width: 100% !important;
  max-width: 620px !important;
  margin-top: 22px !important;
  color: var(--brand-muted) !important;
  font-size: 17px !important;
  line-height: 1.78 !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right {
  width: 100% !important;
  min-height: 460px !important;
  position: relative !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right::before {
  content: "" !important;
  position: absolute !important;
  inset: 28px 0 0 42px !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, rgba(213, 255, 53, 0.86), rgba(255, 178, 26, 0.7)) !important;
  z-index: 0 !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right .post {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, 520px) !important;
  height: 390px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  box-shadow: 0 28px 58px rgba(17, 17, 15, 0.2) !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right .desc_container {
  position: absolute !important;
  z-index: 2 !important;
  right: auto !important;
  left: 0 !important;
  bottom: 0 !important;
  width: min(410px, 86%) !important;
  height: auto !important;
  min-height: 116px !important;
  padding: 26px 30px 26px 82px !important;
  display: block !important;
  background: var(--brand-ink) !important;
  color: #ffffff !important;
  border: 1px solid rgba(213, 255, 53, 0.28) !important;
  border-radius: 8px !important;
  box-shadow: 0 22px 44px rgba(17, 17, 15, 0.25) !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto {
  position: absolute !important;
  left: 26px !important;
  top: 18px !important;
  color: var(--brand-lime) !important;
  font-size: 46px !important;
  line-height: 1 !important;
}

.richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc {
  position: static !important;
  width: auto !important;
  color: #f8faf3 !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

.richchiangmai_secetion2 {
  width: 100% !important;
  max-width: none !important;
  margin-top: 0 !important;
  padding: 96px max(32px, calc((100vw - 1180px) / 2)) 104px !important;
  display: block !important;
  background: linear-gradient(135deg, #11110f 0%, #232619 64%, #10110d 100%) !important;
}

.richchiangmai_secetion2 .title {
  width: 100% !important;
  color: #ffffff !important;
  font-size: 44px !important;
  line-height: 1.1 !important;
  text-align: left !important;
}

.richchiangmai_secetion2 .title::after {
  content: "" !important;
  display: block !important;
  width: 72px !important;
  height: 6px !important;
  margin-top: 24px !important;
  border-radius: 999px !important;
  background: var(--brand-lime) !important;
}

.richchiangmai_secetion2 .desc {
  width: 100% !important;
  max-width: 720px !important;
  margin: 22px 0 42px !important;
  color: rgba(248, 250, 243, 0.78) !important;
  text-align: left !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
}

.richchiangmai_secetion2 ul {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.richchiangmai_secetion2 li,
.richchiangmai_secetion2 li[style] {
  width: auto !important;
  min-height: 245px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  background: rgba(255, 255, 255, 0.065) !important;
  border: 1px solid rgba(213, 255, 53, 0.18) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.richchiangmai_secetion2 li h6 {
  position: relative !important;
  margin: 0 0 18px !important;
  padding-top: 44px !important;
  color: #ffffff !important;
  font-size: 20px !important;
  line-height: 1.25 !important;
}

.richchiangmai_secetion2 li h6::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, var(--brand-lime), var(--brand-gold)) !important;
  box-shadow: 0 10px 20px rgba(213, 255, 53, 0.18) !important;
}

.richchiangmai_secetion2 li p {
  color: rgba(248, 250, 243, 0.7) !important;
  font-size: 15px !important;
  line-height: 1.68 !important;
}

.richchiangmai_secetion3 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.72fr) !important;
  gap: clamp(64px, 7vw, 112px) !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding: 112px 32px 126px !important;
}

.richchiangmai_secetion3 .left {
  margin-top: 0 !important;
  max-width: 560px !important;
}

.richchiangmai_secetion3 .left p {
  max-width: 540px !important;
  font-size: 17px !important;
  line-height: 1.86 !important;
}

.richchiangmai_secetion3 .left .product-store-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  margin-top: 34px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: inherit !important;
  font-weight: inherit !important;
  text-decoration: none !important;
  box-shadow: 0 18px 34px rgba(17, 17, 15, 0.22) !important;
}

.richchiangmai_secetion3 .left .product-store-link:hover {
  background: transparent !important;
  color: inherit !important;
}

.richchiangmai_secetion3 .right {
  position: relative !important;
  isolation: isolate;
  overflow: visible !important;
  width: 316px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: center !important;
  margin-right: clamp(0px, 2vw, 22px) !important;
  padding: 15px 14px 19px !important;
  border-radius: 40px !important;
  background:
    linear-gradient(145deg, #2d3129 0%, #080908 46%, #171916 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    0 34px 68px rgba(17, 17, 15, 0.2),
    inset 0 1px 1px rgba(255, 255, 255, 0.22),
    inset 0 -10px 18px rgba(0, 0, 0, 0.3) !important;
}

.richchiangmai_secetion3 .right::before {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  left: 50% !important;
  width: 66px !important;
  height: 6px !important;
  transform: translateX(-50%) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.16) !important;
  z-index: 2 !important;
}

.richchiangmai_secetion3 .right::after {
  content: "" !important;
  position: absolute !important;
  top: 12px !important;
  right: calc(50% - 55px) !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #050605 !important;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.08) !important;
  z-index: 2 !important;
}

.richchiangmai_secetion3 .right .img1 {
  display: none !important;
}

.richchiangmai_secetion3 .right .android-phone-screen {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 288px !important;
  max-width: 100% !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: #fffdf4 !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    0 12px 22px rgba(0, 0, 0, 0.28) !important;
}

.richchiangmai_secetion3 .right .android-phone-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(17, 17, 15, 0.14);
}

.richchiangmai_secetion3 .right .android-phone-screen .img1 {
  position: relative !important;
  z-index: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: top center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.richchiangmai_secetion3 .right .android-phone-button {
  position: absolute;
  z-index: 0;
  display: block;
  width: 4px;
  background: linear-gradient(180deg, #454a42, #11130f);
  box-shadow: inset 1px 0 rgba(255, 255, 255, 0.16);
}

.richchiangmai_secetion3 .right .android-phone-button-volume {
  top: 112px;
  left: -4px;
  height: 72px;
  border-radius: 4px 0 0 4px;
}

.richchiangmai_secetion3 .right .android-phone-button-power {
  top: 204px;
  right: -4px;
  height: 48px;
  border-radius: 0 4px 4px 0;
}

.richchiangmai_secetion3 .right .img2_container {
  display: none !important;
  grid-template-rows: auto auto !important;
  gap: 14px !important;
}

.richchiangmai_secetion3 .right .img2_container .img2,
.richchiangmai_secetion3 .right .img2_container .img3 {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin: 0 !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 14px 24px rgba(0, 0, 0, 0.18) !important;
}

.richchiangmai_secetion3 .right .img2_container .img2 {
  min-height: 0 !important;
  aspect-ratio: 297 / 424 !important;
}

.richchiangmai_secetion3 .right .img2_container .img3 {
  min-height: 0 !important;
  aspect-ratio: 297 / 144 !important;
}

.richchiangmai_container .richchiangmai_secetion1 p,
.richchiangmai_secetion3 .left p,
.ina_txt p,
.inb_txt p,
.inc_txt p,
.ind_item p,
.gm1 h6,
.gm2 h6,
.gm3 h6 {
  color: var(--brand-muted) !important;
}

.inb_list ul li,
.ind_item {
  border: 1px solid var(--brand-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 14px 32px rgba(17, 17, 15, 0.08) !important;
}

.ina_txt h2,
.inb_txt h2,
.inc_txt h2 {
  color: var(--brand-ink) !important;
}

.richchiangmai_secetion3 .left .product-store-link {
  background: transparent !important;
  color: inherit !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 34px rgba(17, 17, 15, 0.22) !important;
}

.richchiangmai_secetion3 .left .product-store-link:hover {
  background: transparent !important;
  color: inherit !important;
}

.main-container {
  background: linear-gradient(116deg, #fffdf4 0%, #fffdf4 47%, #d5ff35 47%, #d5ff35 49%, #11110f 49%, #232619 100%) !important;
  padding-top: 12px !important;
}

.ban_r img {
  filter: drop-shadow(0 24px 42px rgba(17, 17, 15, 0.22)) !important;
}

.ban_l h2 {
  color: var(--brand-ink) !important;
  font-size: 58px !important;
  line-height: 1.12 !important;
}

.ban_l p {
  color: var(--brand-muted) !important;
}

.ban_l a img,
.inc_play img {
  border-radius: 8px !important;
  box-shadow: 0 12px 24px rgba(17, 17, 15, 0.14) !important;
}

.main-container .swiper-pagination-bullet {
  background: rgba(159, 219, 24, 0.38) !important;
}

.main-container .swiper-pagination-bullet-active {
  background: var(--brand-lime) !important;
}

.ina,
.inc,
.ind {
  background: #ffffff !important;
}

.ina_tit {
  border-color: var(--brand-line) !important;
}

.ina_num span,
.ind_bt h2,
.gm1 h5,
.gm2 h5,
.gm3 h5 {
  color: var(--brand-lime-deep) !important;
}

.inb {
  background: var(--brand-soft) !important;
}

.inc_ico::before,
.inc_ico::after,
.inc_menu ul::after {
  background: linear-gradient(180deg, var(--brand-lime), var(--brand-gold)) !important;
}

.box1,
.box2,
.box3 {
  background: var(--brand-paper) !important;
}

.box1 {
  min-height: 48vh !important;
  padding-top: 96px !important;
}

.box3 {
  padding: 160px 0 10px !important;
  text-align: center !important;
}

.box3 h2 {
  font-size: 50px !important;
  font-weight: 700 !important;
  line-height: 120% !important;
}

.gm3 {
  max-width: 1180px !important;
  width: 95% !important;
  margin: 0 auto 80px !important;
}

.gm3 h5 {
  font-size: 35px !important;
  line-height: 120% !important;
  margin-top: 90px !important;
  font-weight: 700 !important;
}

.gm3 h6 {
  font-size: 25px !important;
  line-height: 150% !important;
  font-weight: 700 !important;
}

@media screen and (max-width: 800px) {
  .box3 {
    padding: 140px 0 0 !important;
  }

  .box3 h2 {
    font-size: 28px !important;
  }

  .gm3 h5 {
    font-size: 18px !important;
    margin: 35px 0 10px !important;
  }

  .gm3 h6 {
    font-size: 16px !important;
    line-height: 200% !important;
  }
}

.gm1,
.gm2,
.gm3 {
  color: var(--brand-ink) !important;
}

.gm1 h6 a,
.gm2 h6 a,
.gm3 h6 a,
.rich_foot p a {
  color: var(--brand-lime-deep) !important;
}

.foot {
  background: linear-gradient(180deg, var(--brand-ink) 0%, var(--brand-olive) 100%) !important;
  padding: 76px 0 28px !important;
}

.foot .gm {
  max-width: 1180px !important;
}

.foot_top {
  padding-bottom: 34px !important;
  border-bottom: 0 !important;
}

.rich_foot {
  width: 100% !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px 16px !important;
  align-items: stretch !important;
}

.rich_foot .title {
  grid-column: 1 / -1 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.rich_foot .title strong {
  display: block !important;
  color: #ffffff !important;
  font-size: 30px !important;
  line-height: 1.15 !important;
}

.rich_foot p {
  width: auto !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  text-align: left !important;
  line-height: 1.55 !important;
  background: rgba(255, 255, 255, 0.055) !important;
  border: 1px solid rgba(213, 255, 53, 0.18) !important;
  border-radius: 8px !important;
}

.rich_foot p:nth-child(4) {
  grid-column: 1 / -1 !important;
}

.rich_foot p:nth-child(5) {
  grid-column: 1 / -1 !important;
}

.rich_foot p a + a {
  display: none !important;
}

.rich_foot .title strong,
.rich_foot p strong {
  color: var(--brand-lime) !important;
}

.rich_foot p,
.rights,
.foot_menu ul li a,
.foot_menu ul li span {
  color: #f8faf3 !important;
}

.rich_foot p a {
  text-decoration-color: rgba(213, 255, 53, 0.55) !important;
}

.foot_menu ul li a {
  border-color: rgba(213, 255, 53, 0.55) !important;
}

.foot_bom {
  margin-top: 10px !important;
  padding-top: 30px !important;
  border-top: 1px solid rgba(213, 255, 53, 0.16) !important;
}

.foot_menu {
  max-width: none !important;
  width: auto !important;
}

.foot_menu ul {
  gap: 26px !important;
  justify-content: flex-start !important;
}

.foot_menu ul li a {
  font-size: 17px !important;
}

.foot_logo .foot_logo_img,
.phone-logo .foot_logo_img {
  width: 64px !important;
  height: 64px !important;
  object-fit: contain !important;
  padding: 6px !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  margin: 0 !important;
}

.rights {
  margin-top: 32px !important;
  color: rgba(248, 250, 243, 0.68) !important;
}

@media screen and (max-width: 1200px) {
  .nav-view .nav-bar,
  .nav-view2 .nav-bar {
    height: 72px !important;
  }

  .phone-logo {
    justify-content: center !important;
  }
}

@media screen and (max-width: 770px) {
  .richchiangmai_container .richchiangmai_banner {
    height: clamp(560px, calc(100vh - 108px), 680px) !important;
  }

  .richchiangmai_container .richchiangmai_banner_app {
    font-size: 18px !important;
    margin-bottom: 14px !important;
  }

  .richchiangmai_container .richchiangmai_banner_title {
    font-size: 36px !important;
  }

  .richchiangmai_container .richchiangmai_banner_desc {
    font-size: 15px !important;
  }

  .richchiangmai_container .richchiangmai_banner_note {
    max-width: calc(100% - 40px) !important;
    text-align: center !important;
    font-size: 15px !important;
  }

  .ban_l h2 {
    font-size: 34px !important;
  }
}

@media screen and (max-width: 560px) {
  .nav-view .nav-bar,
  .nav-view2 .nav-bar {
    padding: 0 18px !important;
  }

  .nav-view .nav-bar .logo .foot_logo_img,
  .nav-view2 .nav-bar .logo .foot_logo_img,
  .nav-view .nav-bar .logo img,
  .nav-view2 .nav-bar .logo img {
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  .richchiangmai_container .richchiangmai_banner_title {
    font-size: 29px !important;
  }

  .richchiangmai_container .richchiangmai_banner_desc {
    line-height: 1.58 !important;
  }

  .richchiangmai_container .richchiangmai_banner_note {
    font-size: 14px !important;
    gap: 10px !important;
  }

  .richchiangmai_container .richchiangmai_banner_note::before,
  .richchiangmai_container .richchiangmai_banner_note::after {
    width: 24px !important;
  }

  .ban_l h2 {
    font-size: 24px !important;
    line-height: 1.28 !important;
  }

  .ban_l p {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .foot {
    padding-top: 56px !important;
  }
}

@media screen and (max-width: 986px) {
  .richchiangmai_container .richchiangmai_secetion1,
  .richchiangmai_secetion3 {
    grid-template-columns: 1fr !important;
    gap: 58px !important;
    padding: 84px 24px 92px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .title,
  .richchiangmai_secetion3 .left .title {
    max-width: 760px !important;
    font-size: 38px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 p,
  .richchiangmai_secetion3 .left p {
    max-width: 760px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right {
    max-width: 680px !important;
    margin: 0 auto !important;
  }

  .richchiangmai_secetion2 {
    padding: 82px 24px 88px !important;
  }

  .richchiangmai_secetion2 ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .richchiangmai_secetion3 .right {
    width: 316px !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }
}

@media screen and (max-width: 720px) {
  .richchiangmai_secetion2 ul {
    grid-template-columns: 1fr !important;
  }

  .richchiangmai_secetion2 li,
  .richchiangmai_secetion2 li[style] {
    min-height: auto !important;
  }

  .rich_foot {
    grid-template-columns: 1fr !important;
  }

  .rich_foot p:nth-child(4) {
    grid-column: auto !important;
  }

  .foot_bom {
    display: block !important;
  }

  .foot_menu {
    width: 100% !important;
  }

  .foot_menu ul {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .foot_menu ul li {
    width: auto !important;
    margin-bottom: 0 !important;
  }

  .phone-logo {
    margin-top: 28px !important;
  }
}

@media screen and (max-width: 560px) {
  .richchiangmai_container .richchiangmai_secetion1,
  .richchiangmai_secetion3 {
    gap: 34px !important;
    padding: 64px 20px 72px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .title,
  .richchiangmai_secetion2 .title,
  .richchiangmai_secetion3 .left .title {
    font-size: 30px !important;
    line-height: 1.16 !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .left::before,
  .richchiangmai_secetion3 .left::before,
  .richchiangmai_secetion2 .title::after {
    width: 54px !important;
    height: 5px !important;
    margin-bottom: 18px !important;
  }

  .richchiangmai_secetion2 .title::after {
    margin-top: 18px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 p,
  .richchiangmai_secetion2 .desc,
  .richchiangmai_secetion2 li p,
  .richchiangmai_secetion3 .left p {
    font-size: 15px !important;
    line-height: 1.72 !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right {
    min-height: 0 !important;
    display: block !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right::before {
    display: none !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right .post {
    width: 100% !important;
    height: 248px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right .desc_container {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    width: calc(100% - 24px) !important;
    margin: -28px auto 0 !important;
    padding: 22px 20px 22px 62px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right .desc_container .quto {
    left: 20px !important;
    top: 18px !important;
    font-size: 34px !important;
  }

  .richchiangmai_container .richchiangmai_secetion1 .right .desc_container .desc {
    font-size: 15px !important;
  }

  .richchiangmai_secetion2 {
    padding: 64px 20px 70px !important;
  }

  .richchiangmai_secetion2 li,
  .richchiangmai_secetion2 li[style] {
    padding: 24px !important;
  }

  .richchiangmai_secetion2 li h6 {
    font-size: 18px !important;
  }

  .richchiangmai_secetion3 .left .product-store-link {
    width: auto !important;
    height: auto !important;
  }

  .richchiangmai_secetion3 .right {
    min-height: 0 !important;
    width: min(100%, 304px) !important;
    padding: 14px 12px 18px !important;
    border-radius: 36px !important;
  }

  .richchiangmai_secetion3 .right .img1 {
    display: none !important;
  }

  .richchiangmai_secetion3 .right .android-phone-screen {
    width: 100% !important;
    border-radius: 25px !important;
  }

  .richchiangmai_secetion3 .right .img2_container {
    grid-template-rows: auto auto !important;
    gap: 10px !important;
  }

  .richchiangmai_secetion3 .right .img2_container .img2 {
    min-height: 0 !important;
  }

  .richchiangmai_secetion3 .right .img2_container .img3 {
    min-height: 0 !important;
  }

  .rich_foot .title strong {
    font-size: 24px !important;
  }

  .rich_foot p {
    padding: 14px 16px !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
  }
}

.product-page-foot .phone-logo {
  display: none !important;
}

.product-page-foot .gm {
  width: calc(100% - 64px) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.product-page-foot .foot_bom {
  width: 100% !important;
  margin-top: 50px !important;
  padding-top: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-top: 1px solid rgba(213, 255, 53, 0.16) !important;
}

.product-page-foot .foot_menu {
  width: auto !important;
  max-width: none !important;
  margin-right: 0 !important;
}

.product-page-foot .foot_menu ul {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.product-page-foot .foot_menu ul li {
  width: auto !important;
  margin: 0 !important;
}

.product-page-foot .foot_logo {
  display: block !important;
  margin-left: auto !important;
}

.product-page-foot .foot_logo .foot_logo_img {
  margin: 0 !important;
}

.product-page-foot .rights {
  width: 100% !important;
  margin-top: 30px !important;
  text-align: center !important;
}

@media screen and (max-width: 720px) {
  .product-page-foot .foot_bom {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  .product-page-foot .foot_menu ul {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }

  .product-page-foot .foot_logo {
    margin-left: 0 !important;
  }
}

.product-screen-carousel {
  --product-screen-gap: 18px;
  width: 100%;
}

.product-screen-window {
  width: 100%;
  overflow: hidden;
}

.product-screen-track {
  display: flex;
  gap: var(--product-screen-gap);
  align-items: stretch;
  will-change: transform;
  transition: transform 0.58s ease;
}

.product-screen-carousel .product-screen-card {
  flex: 0 0 calc((100% - var(--product-screen-gap)) / 2);
  min-height: 430px;
  display: grid;
  grid-template-columns: minmax(180px, 0.78fr) minmax(0, 1fr);
  gap: 26px;
  align-items: center;
  padding: 30px;
}

.product-screen-media {
  height: 318px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-screen-carousel .product-phone-card {
  width: 192px;
}

.product-screen-carousel .product-screen-shot {
  width: min(100%, 210px);
  max-height: 284px;
  object-fit: contain;
}

.product-screen-carousel .product-screen-shot-wide {
  width: min(100%, 244px);
}

.product-screen-dots {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin-top: 24px;
}

.product-screen-dots span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(159, 219, 24, 0.32);
  transition: width 0.24s ease, background 0.24s ease;
}

.product-screen-dots span.is-active {
  width: 24px;
  background: var(--brand-lime-deep);
}

@media screen and (max-width: 900px) {
  .product-screen-carousel .product-screen-card {
    grid-template-columns: 1fr;
    min-height: 520px;
  }
}

@media screen and (max-width: 640px) {
  .product-screen-carousel .product-screen-card {
    flex-basis: 100%;
    min-height: 500px;
    padding: 24px;
  }
}

@media screen and (max-width: 980px) {
  .product-clarity-grid {
    grid-template-columns: 1fr;
  }

  .product-clarity-panel {
    min-height: auto;
  }
}

@media screen and (max-width: 680px) {
  .product-clarity-cards {
    grid-template-columns: 1fr;
  }

  .product-clarity-panel {
    padding: 28px 24px;
  }

  .product-clarity-panel h3 {
    font-size: 24px;
  }

  .product-clarity-card {
    min-height: auto;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 16px;
    padding: 24px;
  }

  .product-clarity-card span {
    width: 42px;
    height: 42px;
    font-size: 13px;
  }

  .product-clarity-card h3 {
    font-size: 18px;
  }
}

@keyframes motion-fade-up {
  from {
    opacity: 0;
    transform: translateY(22px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes motion-kenburns {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(1.08);
  }
}

@keyframes motion-float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-12px);
  }
}

@keyframes motion-drift {
  from {
    background-position: 0 0;
  }

  to {
    background-position: 72px 72px;
  }
}

.richchiangmai_container .richchiangmai_banner_app,
.richchiangmai_container .richchiangmai_banner_title,
.richchiangmai_container .richchiangmai_banner_desc,
.richchiangmai_container .richchiangmai_banner_note {
  animation: motion-fade-up 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.richchiangmai_container .richchiangmai_banner_app {
  animation-delay: 0.08s;
}

.richchiangmai_container .richchiangmai_banner_title {
  animation-delay: 0.18s;
}

.richchiangmai_container .richchiangmai_banner_desc {
  animation-delay: 0.3s;
}

.richchiangmai_container .richchiangmai_banner_note {
  animation-delay: 0.42s;
}

.product-hero-copy > * {
  animation: motion-fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.product-hero-copy .product-eyebrow {
  animation-delay: 0.06s;
}

.product-hero-copy h1 {
  animation-delay: 0.14s;
}

.product-hero-copy .product-lead {
  animation-delay: 0.24s;
}

.product-hero-copy .product-hero-actions {
  animation-delay: 0.34s;
}

.product-hero-visual {
  animation: motion-fade-up 0.95s 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
}

html.motion-ready .richchiangmai_container .richchiangmai_banner {
  overflow: hidden !important;
  background-image: none !important;
}

html.motion-ready .richchiangmai_container .richchiangmai_banner::before {
  content: "";
  position: absolute;
  inset: -8%;
  z-index: 0;
  background-image: url("/2c60e61/img/banner.34d3871.png");
  background-size: cover;
  background-position: center;
  animation: motion-kenburns 22s ease-out forwards;
}

html.motion-ready .product-hero::before {
  animation: motion-drift 28s linear infinite;
}

html.motion-ready .product-phone-hero,
html.motion-ready .richchiangmai_secetion3 .right.is-visible {
  animation: motion-float 5.4s ease-in-out infinite;
}

.motion-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 0.72s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.72s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.28s ease,
    border-color 0.28s ease,
    background-color 0.28s ease,
    color 0.28s ease;
  transition-delay: var(--motion-delay, 0ms);
}

.motion-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.richchiangmai_secetion2 li,
.product-info-card,
.product-clarity-card,
.product-flow-list li,
.product-clarity-panel,
.product-trust-list p,
.rich_foot p {
  transition:
    transform 0.32s ease,
    box-shadow 0.32s ease,
    border-color 0.32s ease,
    background-color 0.32s ease;
}

html.motion-ready .richchiangmai_secetion2 li.is-visible:hover,
html.motion-ready .product-info-card.is-visible:hover,
html.motion-ready .product-clarity-card.is-visible:hover,
html.motion-ready .product-flow-list li.is-visible:hover,
html.motion-ready .product-trust-list p.is-visible:hover,
html.motion-ready .rich_foot p.is-visible:hover {
  transform: translateY(-8px);
}

html.motion-ready .richchiangmai_secetion2 li.is-visible:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(213, 255, 53, 0.42) !important;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.22);
}

html.motion-ready .product-info-card.is-visible:hover,
html.motion-ready .product-clarity-card.is-visible:hover {
  border-color: rgba(159, 219, 24, 0.42);
  box-shadow: 0 22px 40px rgba(17, 17, 15, 0.12);
}

html.motion-ready .product-flow-list li.is-visible:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(213, 255, 53, 0.38);
}

.richchiangmai_secetion3 .left .product-store-link,
.product-store-link,
.product-text-link {
  transition:
    transform 0.28s ease,
    box-shadow 0.28s ease,
    background-color 0.28s ease,
    color 0.28s ease,
    border-color 0.28s ease;
}

.richchiangmai_secetion3 .left .product-store-link:hover,
.product-store-link:hover {
  transform: translateY(-3px);
}

.product-text-link:hover {
  border-bottom-color: var(--brand-lime);
}

.nav-view,
.nav-view2,
.nav-view.scrolled {
  transition:
    background-color 0.28s ease,
    box-shadow 0.28s ease,
    border-color 0.28s ease !important;
}

.foot_menu ul li a {
  transition: color 0.24s ease, border-color 0.24s ease, opacity 0.24s ease;
}

.foot_menu ul li a:hover {
  color: var(--brand-lime) !important;
  border-color: var(--brand-lime) !important;
}

@media screen and (max-width: 1200px) {
  html.motion-ready .small-munu,
  html.motion-ready .nav-view .small-munu,
  html.motion-ready .nav-view2 .small-munu {
    display: block !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px);
    transition:
      max-height 0.36s ease,
      opacity 0.28s ease,
      transform 0.28s ease,
      visibility 0.28s ease;
  }

  html.motion-ready .small-munu.is-open,
  html.motion-ready .nav-view .small-munu.is-open,
  html.motion-ready .nav-view2 .small-munu.is-open {
    max-height: 520px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  .motion-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* The supplied artwork includes the physical device frame, so it is presented directly. */
.app-device {
  position: relative;
  isolation: isolate;
}

.app-device-image {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 28px 32px rgba(0, 0, 0, 0.24));
  transform: translateZ(0);
  will-change: transform;
}

.product-phone-hero.app-device {
  flex: 0 0 auto;
  width: 500px;
  max-width: calc(100% + 160px);
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.product-phone-hero.app-device::before,
.product-phone-hero.app-device::after {
  display: none;
}

.product-phone-hero.app-device .app-device-image {
  width: 100%;
}

.richchiangmai_secetion3 .right.app-device {
  width: 520px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.richchiangmai_secetion3 .right.app-device::before,
.richchiangmai_secetion3 .right.app-device::after {
  display: none !important;
}

.richchiangmai_secetion3 .right.app-device .app-device-image {
  width: 100% !important;
  max-width: none !important;
}

@media screen and (max-width: 986px) {
  .richchiangmai_secetion3 .right.app-device {
    width: min(100%, 520px) !important;
  }

  .product-phone-hero.app-device {
    width: 460px;
    max-width: calc(100% + 120px);
  }
}

@media screen and (max-width: 720px) {
  .product-hero-visual {
    margin-top: 8px;
  }

  .product-phone-hero.app-device {
    width: min(100%, 420px);
    max-width: 100%;
  }
}

@media screen and (max-width: 560px) {
  .richchiangmai_secetion3 .right.app-device {
    width: min(100%, 390px) !important;
    margin-top: 0 !important;
  }

  .product-phone-hero.app-device {
    width: min(100%, 360px);
  }
}