.unit-banner[text-color=white]{color:var(--white)}.unit-banner[text-color=white] .banner-bg .sticky-img:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--black-10)}.unit-banner[text-color=black]{color:var(--black)}.unit-banner .banner-container{position:relative;width:100%;aspect-ratio:1920/750;display:flex;flex-direction:column;justify-content:flex-end;padding:0 30px 50px;transition:.3s}.unit-banner .banner-container.page .unit-title{padding:105px 0}@media only screen and (max-width: 1200px){.unit-banner .banner-container{aspect-ratio:1024/670;padding:50px 30px}}@media only screen and (max-width: 767px){.unit-banner .banner-container{padding:50px 20px}}@media only screen and (max-width: 575px){.unit-banner .banner-container{min-height:500px;aspect-ratio:unset}.unit-banner .banner-container.page{padding:74px 20px 50px}.unit-banner .banner-container.page .unit-title{margin:auto 0 0;flex:1}}.unit-banner .banner-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-3;overflow:hidden}.unit-banner .banner-bg .sticky-img{position:sticky;width:100%;height:100%;top:0;z-index:-1;transform:scale(1.25);opacity:0;transition:opacity .6s ease-out,transform .6s ease-out .1s}.unit-banner .banner-bg .sticky-img img{width:100.015%;height:100.015%;object-fit:cover}.unit-banner .back-btn{position:absolute;top:50px;left:30px}@media only screen and (max-width: 767px){.unit-banner .back-btn{top:30px;left:20px}}.unit-banner .unit-title{width:50%;padding:75px 0;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:auto;opacity:0;transform:scale(.75);transition:.6s ease .3s}.unit-banner .unit-title .f-unit-title{font-size:2.5rem;font-weight:500;line-height:1.5;letter-spacing:5px}.unit-banner .unit-title .f-unit-subtitle{font-family:Sarabun;font-size:1.25rem;font-weight:700;line-height:1.2;letter-spacing:2px;margin-top:10px}.unit-banner .unit-title.aost-show{opacity:1;transform:scale(1);transition:opacity .5s ease-out .4s,transform .5s ease-out .4s}@media only screen and (max-width: 1200px){.unit-banner .unit-title{margin:auto;padding:70px 0}.unit-banner .unit-title .f-unit-title{font-size:2.375rem}.unit-banner .unit-title .f-unit-subtitle{font-size:1.125rem}}@media only screen and (max-width: 1024px){.unit-banner .unit-title{width:100%;margin:auto 0}}@media only screen and (max-width: 767px){.unit-banner .unit-title .f-unit-title{font-size:2.25rem}.unit-banner .unit-title .f-unit-subtitle{font-size:1rem}}@media only screen and (max-width: 575px){.unit-banner .unit-title{margin:auto 0 30px}}.unit-banner .content{width:620px;margin-left:auto;position:relative;text-align:right;align-self:flex-end}.unit-banner .content.aost-show{transition:opacity .5s ease-out .4s}@media only screen and (min-width: 1921px){.unit-banner .content{width:33.334%}}@media only screen and (max-width: 1200px){.unit-banner .content{width:80%}}@media only screen and (max-width: 575px){.unit-banner .content{width:100%;align-self:flex-start;text-align:left}}.unit-banner .banner-container.aost-show .banner-bg .sticky-img{opacity:1;transform:scale(1)}.article .container{padding-top:100px}@media only screen and (max-width: 1200px){.article .container{padding-top:0}}.article .container .article-block{grid-column:8/-2}@media only screen and (max-width: 1200px){.article .container .article-block{grid-column:3/-3}}@media only screen and (max-width: 767px){.article .container .article-block{grid-column:2/-2}}.article .container .article-block .article-inner .article-wrapper{display:flex;flex-direction:column}.article .container .article-block .article-inner .article-wrapper:after{margin:80px 0;content:"";width:100%;height:1px;background-color:var(--black-20)}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper:after{margin:50px 0}}.article .container .article-block .article-inner .article-wrapper .article-card{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px 6.53%}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card{flex-direction:column}}.article .container .article-block .article-inner .article-wrapper .article-card .content-box,.article .container .article-block .article-inner .article-wrapper .article-card .img-box,.article .container .article-block .article-inner .article-wrapper .article-card .more-btn-arrow{opacity:0;clip-path:polygon(0 0,0 0,0 100%,0 100%);transition:opacity .8s,clip-path .8s}.article .container .article-block .article-inner .article-wrapper .article-card.aost-show .content-box,.article .container .article-block .article-inner .article-wrapper .article-card.aost-show .img-box,.article .container .article-block .article-inner .article-wrapper .article-card.aost-show .more-btn-arrow{opacity:1;clip-path:polygon(0 0,110% 0,100% 100%,0 100%)}.article .container .article-block .article-inner .article-wrapper .article-card:not(.hasImg) .img-box{display:none}.article .container .article-block .article-inner .article-wrapper .article-card.hasImg .more-btn-arrow{display:none}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card.hasImg .more-btn-arrow{display:block}}.article .container .article-block .article-inner .article-wrapper .article-card:has(.more-btn-arrow:hover) .article-title,.article .container .article-block .article-inner .article-wrapper .article-card:has(.img-box:hover) .article-title{color:var(--red)}.article .container .article-block .article-inner .article-wrapper .article-card .content-box{display:flex;flex-direction:column;gap:20px;width:44.444%}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card .content-box{gap:15px;width:100%}}.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-title{width:fit-content;display:flex;gap:20px;transition:color .3s ease}.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-title:before{margin-top:12px;display:block;width:5px;height:5px;background:var(--red);flex-shrink:0;content:""}@media only screen and (min-width: 1201px){.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-title:hover{color:var(--red)}}@media only screen and (max-width: 1200px){.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-title:active{color:var(--red)}}.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-content{padding-left:30px;color:var(--grey);display:block;overflow:hidden;display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:3}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card .content-box .article-content{padding-left:25px}}.article .container .article-block .article-inner .article-wrapper .article-card .img-box{display:block;width:33.261%;flex-shrink:0;pointer-events:auto}@media only screen and (max-width: 1200px){.article .container .article-block .article-inner .article-wrapper .article-card .img-box{width:40%}}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card .img-box{width:100%}}.article .container .article-block .article-inner .article-wrapper .article-card .img-box .img{position:relative;width:100%;height:100%}.article .container .article-block .article-inner .article-wrapper .article-card .img-box .img:after{content:"";display:block;width:100%;height:100%;padding-bottom:61.853%}.article .container .article-block .article-inner .article-wrapper .article-card .img-box .img img{width:100%;height:100%;object-fit:cover;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}@media only screen and (max-width: 900px){.article .container .article-block .article-inner .article-wrapper .article-card .more-btn-arrow{margin-left:auto}}.article .container .more{grid-column:7/-2}@media only screen and (max-width: 1200px){.article .container .more{grid-column:3/-3}}@media only screen and (max-width: 767px){.article .container .more{grid-column:2/-2}}.article .container .more .more-btn{margin-left:auto;margin-top:20px}@media only screen and (max-width: 1200px){.article .container .more .more-btn{margin-top:0}}.article .container .no-content{grid-column:7/-2}@media only screen and (max-width: 1200px){.article .container .no-content{grid-column:3/-3}}@media only screen and (max-width: 767px){.article .container .no-content{grid-column:2/-2}}
