@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;700;900&display=swap');
*,body,html {box-sizing: border-box;margin: 0 auto;padding: 0;font-family: 'Kanit', sans-serif;}
body{background-color:#E8EBE4;overflow-x: hidden;}
.page-wrapper{max-width: 1350px;margin:0 auto;width:auto;}
h1{font-size:75px;font-weight:bold;text-align: center;color: #47526E;z-index:10!important;position: relative;}
p.big{font-size:140px;opacity:0.07;white-space: nowrap;text-align: center;position: absolute;bottom:28%;left:0;right:0;z-index:9998;}
.white-section-first{background-color: #E8EBE4;padding-top:25%;padding-bottom:250px;text-align: center;position: relative;overflow: hidden;}
.white-section-first #one{position: absolute;top:7em;left: 4em;z-index:1;}
.white-section-first #two{position: absolute;right: 20%;top: 30%;height: 76px;z-index:1;}
h2,a{font-size:45px;font-weight:bold;color: #E8EBE4;position: relative;}
h2{padding-bottom:100px;}
a{text-align: right;float: right;text-decoration: none;z-index:9999;}
.blue-section .page-wrapper{position: relative;}
.blue-section{padding-top:350px;padding-bottom:550px;background: url('group5.svg');background-size:cover;background-repeat: no-repeat;    overflow: hidden;}
.blue-section p.big1{color:#C4C4C4;font-size:140px;opacity:0.07;white-space: nowrap;text-align: center;position: absolute;left: 0;top:-50%;}
.blue-section p.big2{color:#C4C4C4;font-size:140px;opacity:0.07;white-space: nowrap;text-align: center;position: absolute;right: 0;top:50%;}
.blue-section img{position: absolute;left: 0;right: 0;top:-50%;}
.white-section-two{background-color: #E8EBE4;padding-top: 300px;padding-bottom:40px;position: relative;overflow: hidden;}
.blue-section h2::before{content: '';position:absolute;left: 0;bottom:100px;width: 100px;height:4px;background-color: #E8EBE4;}
.blue-section a::before{content: '';position:absolute;right: 0;bottom:0;width: 100px;height:4px;background-color: #E8EBE4;}
footer a{color: #47526E;font-size:24px;font-weight: bold;float: none;z-index:9999;position: relative;}
footer p {font-size:24px;text-align: center;z-index:9999;position: relative;}
footer{position: relative;}
.white-section-two #three{position: absolute;bottom: -200px;left: -200px;height: 350px;}
.white-section-two #four{position: absolute;bottom: 50px;right: -200px;height: 250px;}

@media screen and (max-width: 1400px){
    .page-wrapper{max-width:1150px;padding-left:1em;padding-right:1em;}
    .blue-section{padding-bottom: 430px;}
}

@media screen and (max-width: 1300px){
    h1{font-size: 60px;}
    p.big{bottom:35%;}
    .white-section-first #two {top: 80%;}
}

@media screen and (max-width: 1200px){
    .page-wrapper{max-width:850px;}
}

@media screen and (max-width: 1000px){
    .white-section-first{padding-top:35%;}
    h1{font-size:45px;}
    footer p,footer a{font-size:18px;}
    h2,a{font-size:34px;}
    .white-section-first #one{top: -4em;}
}

@media screen and (max-width: 800px){
    .white-section-first{padding-top:35%;padding-bottom: 140px;}
    .white-section-first p.big{bottom:10%;}
}

@media screen and (max-width: 700px){
    .blue-section{padding-top: 350px;
        padding-bottom: 251px;}
    .blue-section #point{height:300px;}
    .white-section-two{padding-top:200px;}
    h1{font-size: 35px;}
    h2,a{font-size:26px;}
    .white-section-first #two{height:50px;}
    .white-section-first{padding-top:55%;}

}

@media screen and (max-width: 500px){
   
    .white-section-first p.big{bottom:20%;}
}