body{font-family: "Sarabun", sans-serif;font-weight: 400;font-style: normal;}

a {text-decoration: none;color: #000;display: initial;}

ul {margin: 0;padding: 0;}

ul li {list-style: none;}

.clear{clear: both;}

.readMore2 {overflow: hidden;-webkit-box-orient: vertical;display: block;display: -webkit-box;overflow: hidden !important;text-overflow: ellipsis;-webkit-line-clamp: 2;}



#headerDes{position: fixed;z-index: 1000;width: 100%;top: 0;box-shadow: 0px 0 10px #2f2f2f;}

#headerDes .boxTop{background-color: #fff;height: 82px;}

#headerDes .boxBottom{background-color: #005cb9;height: 82px;}

#headerDes .boxRight{float: right;margin: 16px 0 0 0;}

#headerDes .boxRight .faceHeader{float: left;}

#headerDes .boxRight .telHeader{float: left;margin: 7px 0 0 15px;}

#headerDes .boxRight .textTel{float: left;color: #005cb9;font-size: 25px;margin: 6px 0 0 7px;font-weight: 600;}

#headerDes .boxRight .boxLang {float: right;padding: 0px 17px 3px;background-color: #005cb9;line-height: 1.4;margin: 7px 0 0 35px;}

#headerDes .boxRight .boxLang div{float: left;font-size: 26px;font-weight: 600;}

#headerDes .boxRight .boxLang .sl{margin: -2px 11px 0;color: #fff;}

#headerDes .boxRight .boxLang .lg{color: #fff;}

#headerDes .boxRight .boxLang .lg.active{color: #ffc821;}

#headerDes .boxBottom .boxLogo{position: absolute;left: 5px;top: -53px;}

#headerDes .boxBottom .boxLogo .logoHeader{float: left;}

#headerDes .boxBottom .boxLogo .name{float: left;font-size: 22px;margin: 79px 0 0 0;color: #fff;}

#headerDes .boxBottom .menu {padding: 0;margin: 27px 0 0 0;float: right;font-size: 20px;}

#headerDes .boxBottom .menu li {float: left;margin: 0 14px 0;}

#headerDes .boxBottom .menu li a.active {color: #ffea00;font-weight: 500;}

#headerDes .boxBottom .menu li a {color: #fff;}

#headerDes .boxBottom .menuBar{display: none;}

#popupMenu{width: 100%;background: rgba(0,0,0,0.5);position: fixed;top: 0;z-index: 10001;height: 100%;display: none;overflow-y: scroll;}

#popupMenu .container{max-width: 820px;min-height: 100%;background: #005cb9;}

#popupMenu .icon-close{cursor: pointer;float: right;width: 35px;height: 35px;color: #fff;}

#popupMenu .mr100px{margin-right: 30px;}

#popupMenu ul{font-size: 18px;color: #fff;}

#popupMenu ul li{list-style: none;}

#popupMenu ul li ul{font-size: 16px;display: none;}

#popupMenu ul li ul.active{display: block;}

#popupMenu .ml100px{margin-left: 30px;}

#popupMenu ul li.active{color: #fff;font-weight: bold;text-decoration: underline;}

#popupMenu ul li.active i{border: solid #fff;border-width: 0 3px 3px 0;display: inline-block;padding: 3px;margin: 0px 0px 4px 3px;}

#popupMenu ul a{color: #fff;}

.clickPay{position: fixed;z-index: 1000;right: 0;top: 25%;width: 150px;filter: drop-shadow(5px 5px 10px #000000);cursor: pointer;display: none;}

#main .bx-wrapper .bx-controls-direction a{z-index: 500;}

#main{overflow: hidden;margin-top: 164px;}

#main .boxOut{max-width: 2550px;width: 100%;display: block;margin: auto;}

#main .imageTop{width: 100%;position: relative;}

#main .logoCenter {position: relative;display: block;margin: -510px auto 0;max-width: 730px;width: 57%;}

#main .boxArticle .fLeft {position: absolute;max-width:608px;left: -233px;top: -495px;width: 26%;}

#main .boxArticle .Fright {position: absolute;max-width: 839px;right: -236px;top: -500px;width: 36%;}

#main .boxArticle{background-color: #005cb9;position: relative;padding-bottom: 200px;margin-top: -1px;}

#main .boxArticle .articleTop{margin-top: 42px;color: #fff;text-align: center;font-size: 43px;line-height: 1.7;}

#main .boxDoate{position: relative;background-color: #fff;padding: 50px 0 340px;color: #005cb9;}

#main .boxDoate .fBottom{z-index: 10;max-width: 2329px;position: absolute;left: 50%;margin-right: -50%;-ms-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);display: block;width: auto;margin: 0 auto;top: -125px;}

#main .boxDoate .boxDetailTop{position: relative;font-size: 30px;text-align: center;padding-top: 350px;line-height: 1.9;}

#main .boxDoate .boxDetailTop2{position: relative;font-weight: 600;font-size: 48px;text-align: center;margin-top: 45px;}

#main .boxDoate .boxInDoate{position: relative;text-align: center;padding: 24px 96px 30px;box-shadow: 0 0 10px #858585;margin: 50px auto 0;width: max-content;border-radius: 25px;}

#main .boxDoate .boxInDoate .line1{font-size: 57px;font-weight: 500;}

#main .boxDoate .boxInDoate .line2{font-size: 25px;line-height: 1.4;margin-top: 15px;}

#main .boxDoate .cloudLeft{position: absolute;left: -543px;bottom: 0;z-index: 0;}

#main .boxDoate .cloudRight{position: absolute;right: -511px;bottom: 0;z-index: 0;}



#main .boxSlide .slideHeight{height: 850px;}

#main .boxSlide .listSlide{width: 100%;background-size: cover;width: 100%;background-position: center;}

#main .boxSlide .bx-wrapper {box-shadow: none;border: none;margin-bottom: 0;}

#main .boxSlide .bx-wrapper .bx-pager{bottom: 15px;}

#main .boxSlide .boxDetail{position: absolute;text-align: right;width: 100%;bottom: 90px;padding: 0 30px;}

#main .boxSlide .boxDetail .line1{font-size: 38px;text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;}

#main .boxSlide .boxDetail .line2{font-size: 20px;text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;}



#main .boxProject{position: relative;padding: 90px 0 110px;background-color: #fff;}

#main .boxProject .item{margin-top: 30px;text-align: center;}

#main .boxProject .item .imgProject{width: 100%;max-width: 326px;display: block;margin: auto;border: 5px solid #fff;border-radius: 180px;box-shadow: 0 0 5px #858585;}

#main .boxProject .item .linkProject{font-size: 21px;margin-top: 15px;font-weight: 600;word-wrap: break-word;}

#main .boxProject .item .linkProject a{color:#005cb9;}

#main .boxProject .item .linkProject a:hover{text-decoration: underline;}

#main .boxProject .fLeft {position: absolute;max-width:299px;left: 0;bottom: 0;}

#main .boxProject .Fright {position: absolute;max-width: 245px;right: 0;top: 0;}

#main .boxProject .aBtnAll{display: table;margin:50px auto 0;}

#main .boxProject .boxBtnAll{font-size: 24px;font-weight: 600;color: #005cb9;border: 1px solid #005cb9;width: max-content;padding: 10px 25px 7px;}

#main .boxShowImage img{width: 100%;max-width: 100%;margin: auto;display: block;}

#main .boxNews{position: relative;padding-bottom: 230px;}

#main .boxNews .borderTop{height: 12px;width: 100%;background-color: #ffd600;box-shadow: 0 10px 10px #858585;}

#main .boxNews .itemVDO{position: relative;z-index: 10;;background-color: #ffd600;box-shadow: 0 0px 20px #4b4848;padding: 25px 20px 36px;position: relative;color: #005cb9;border-bottom-left-radius: 15px;border-bottom-right-radius: 15px;}

#main .boxNews .itemVDO .top{height: 12px;position: absolute;top: -12px;left: 0;width: 100%;background: #ffd600;}

#main .boxNews .itemVDO .yL{position: absolute;left: -37px;top: -13px;}

#main .boxNews .itemVDO .yR{position: absolute;right: -32px;top: -12px;}

#main .boxNews .itemVDO .title{font-size: 79px;font-weight: 600;text-align: center;}

#main .boxNews .itemVDO .titleLine2{font-size: 47px;line-height: 0.4;font-weight: 500;text-align: center;}

#main .boxNews .boxVideo{position: relative;margin: 50px 0 0 ;}

#main .boxNews .boxVideo .imgVDO{width: 100%;}

#main .boxNews .boxVideo .text{position: absolute;text-shadow:0 0 5px #4b4848;font-size: 125px;color: #fff;top: 20px;right: 20px;line-height: 0.7;}

#main .boxNews .itemNews{margin-top: 20px;position: relative;z-index: 10;}

#main .boxNews .itemNews .boxImg{position: relative;background-position: center;background-size: cover;border-radius: 20px;border: 15px solid #fff;box-shadow: 0 0 5px #858585;}

#main .boxNews .itemNews .boxImg .op{width: 100%;opacity: 0;}

#main .boxNews .itemNews .nameNews{font-size: 16px;line-height: 1.5;}

#main .boxNews .itemNews .dateNews{font-size: 16px;}

#main .boxNews  .aItemNews:hover{text-decoration: underline;}

#main .boxNews .bgBoxNews{position: absolute;left: -200px;bottom: 0;}

#main .boxArticle2{position: relative;padding-bottom: 230px;}

#main .boxArticle2 .borderTop{height: 12px;width: 100%;background-color: #005cb9;box-shadow: 0 10px 10px #858585;position: relative;z-index: 10;}

#main .boxArticle2 .itemTitle{position: relative;z-index: 10;;background-color: #005cb9;box-shadow: 0 0px 20px #4b4848;padding: 25px 20px 36px;position: relative;color: #005cb9;border-bottom-left-radius: 15px;border-bottom-right-radius: 15px;width: max-content;margin-bottom: 70px;}

#main .boxArticle2 .itemTitle .top{height: 12px;position: absolute;top: -12px;left: 0;width: 100%;background: #005cb9;}

#main .boxArticle2 .itemTitle .bL{position: absolute;left: -29px;top: -12px;}

#main .boxArticle2 .itemTitle .bR{position: absolute;right: -32px;top: -12px;}

#main .pageNewsDetail .boxArticle2 .itemTitle{background-color: #ffd600;}

#main .pageNewsDetail .boxArticle2 .itemTitle .bL{position: absolute;left: -37px;top: -12px;}

#main .pageNewsDetail .boxArticle2 .itemTitle .bR{position: absolute;right: -32px;top: -12px;}

#main .boxHis{display: block;margin: auto;max-width: 1920px;width: 100%;height: 573px;background-image: url('../images/frontend/bgHis.jpg');background-size: cover;background-position: center top;}

#main .boxHis .textHis{margin: 65px auto 0;max-width: 897px;width: 100%;display: block;}

#main .boxHis .boxImgClick{width: 189px;height: 134px;display: block;margin: 15px auto 0;position: relative;transition: 0.5s ease;}

#main .boxHis .boxImgClick .click{position: absolute;width: 100%;}

#main .boxHis .boxImgClick .click2{opacity: 0;z-index: 10;animation: fadeIn 3s infinite; }

#main .boxHis:hover .boxImgClick{

-webkit-transform: scale(1.15);

-ms-transform: scale(1.15);

transform: scale(1.15);

transition: 0.5s ease;

}

@keyframes fadeIn {

  0% { opacity: 1; }

  25% { opacity: 0; }

  50% { opacity: 1; }

  75% { opacity: 0; }

  100% { opacity: 1; }

}







#main .pageNewsDetail .boxTopDetail{background-color: #005cb9;padding: 40px 0 40px;position: relative;box-shadow: 0px 0 10px #2f2f2f;}

#main .pageNewsDetail .boxTopDetail .titleNewsDetail{line-height: 1.9;font-weight: bold;font-size: 36px; color: #fff;text-shadow: 5px 5px 5px #2f2f2f;}

#main .pageNewsDetail .imgNews{position: relative;border-radius: 10px;border: 10px solid #fff;box-shadow: 0px 0 10px #2f2f2f;}

#main .pageNewsDetail .boxArticle2 .itemTitle.pageArticle{padding-top: 0;padding-bottom: 15px;}



#main .boxArticle2 .itemTitle .title{font-weight: bold;color: #fff;font-size: 60px;line-height: 0.8;margin: 20px 0 0px 0;}

#main .boxArticle2 .itemTitle .title .pin{margin: -45px 0 0 0;}

#main .boxArticle2 .itemArticle{ margin: 20px 0 0; position: relative; z-index: 10; padding: 20px; background-color:#fff; box-shadow: 0 0 5px #858585; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; color: #002284;}

#main .boxArticle2 .itemArticle .boxImg{width: 100%;background-size: cover;background-position: center;}

#main .boxArticle2 .itemArticle .boxImg .op{width: 100%;opacity: 0;}

#main .boxArticle2 .itemArticle .boxName{color:#002284;font-size: 20px;font-weight: 500;margin-top: 15px;height: 60px;padding-bottom: 80px;border-bottom: 1px solid #002284;margin-bottom: 15px;}

#main .boxArticle2 .itemArticle .date{float: left;font-size: 14px;}

#main .boxArticle2 .itemArticle .readMore{float: right;font-size: 14px;}

#main .boxArticle2 .itemArticle:hover .readMore{text-decoration: underline;}

#main .boxArticle2 .itemArticle:hover .boxName{text-decoration: underline;}

#main .boxArticle2 .abtnAll{display: table;margin:50px auto 0;position: relative;z-index: 10;}

#main .boxArticle2 .btnAll{font-size: 24px;font-weight: 600;color: #005cb9;border: 1px solid #005cb9;width: max-content;padding: 10px 25px 7px;}

#main .boxArticle2 .btnAll:hover{color: #fff;background-color: #005cb9;}

#main .boxArticle2 .imgL{position: absolute;bottom: 0;left: 0;height: 100%;}

#main .boxArticle2 .imgR{position: absolute;bottom: 0;right: 0;height: 100%;}



#main .pageAbout .titleAbout{margin-bottom: 35px;color: #004f9f;font-size: 54px;text-align: center;font-weight: 600;padding: 50px 0;background-color: #fff118;line-height: 1.8;}

#main .pageAbout .title2About{font-size: 29px;color: #004f9f;line-height: 1.8;}

#main .pageAbout .title2About span{font-weight: 600;}

#main .pageAbout .detailAbout{font-size: 23px;color: #004f9f;line-height: 1.8;}

#main .pageAbout .detailAbout span{font-weight: 600;}

#main .pageAbout .boxCenterAbout{padding: 50px 0;background-color: #005cb9;text-align: center;line-height: 1.8;color: #ffd801;font-size: 30px;margin: 50px 0 50px;}

#main .pageAbout .boxCenterAbout span{font-weight: 600;}

#main .pageAbout .detailAboutCenter{font-size: 23px;color: #004f9f;line-height: 1.8;text-align: center;max-width: 670px;width: 100%;display: block;margin:70px auto 50px;}

#main .pageAbout .detailAboutCenter span{font-weight: 700;}

#main .pageAbout .detailAboutCenter .textTop{font-size: 32px;}

#main .pageAbout .detailAboutLeft{text-align: center;font-size: 38px;font-weight: 700;color: #004f9f;line-height: 2;width: 100%;}

#main .pageAbout .boxAboutBottom{height: 750px;width: 100%;overflow: hidden;margin: 40px 0 0;position: relative;}

#main .pageAbout .boxAboutBottom img{position: absolute;right: -150px;top: 0;height: 120%;}



#main .pageContact{background-color: #fff;padding: 80px 0 0;color: #2d2d2d;position: relative;}

#main .pageContact .logo {position: absolute;top: -20px;right: -150px;}

#main .pageContact .title{font-size: 36px;font-weight: 500;position: relative;}

#main .pageContact .detail{font-size: 20px;margin-top: 25px;position: relative;}

#main .pageContact .boxIcon{max-width: 800px;font-size: 24px;margin-top: 50px;position: relative;}

#main .pageContact .boxIcon img{max-width: 52px;width: 100%;display: block;margin: auto;}

#main .pageContact .boxIcon .boxItem{margin-top: 22px;}

#main .pageContact .boxIcon .boxItem .text{margin: 5px 0 0;}

#main .pageContact .boxBank{background-color: #005cb9;padding: 32px 0 75px;margin: 50px 0 0;position: relative;}

#main .pageContact .boxBank .footerTitle{padding: 0 0 25px;border-bottom: 1px solid #fff;width: 100%;font-size: 33px;text-align: center;font-weight: 500;color: #fff;line-height: 1.5;margin: 0 0 35px;}

#main .pageContact .boxBank .boxBank{background-color: #fff;border-radius: 20px;padding: 22px 20px 25px;color: #004eb9;font-weight: 500;font-size: 27px;}

#main .pageContact .boxBank .boxBank .boxBankIn{border:5px #004eb9 solid;border-radius: 25px;width: 100%;padding: 25px 15px;margin: 30px 0 0;text-align: center;}

#main .pageContact .boxBank .boxBank .boxBankIn img{margin: auto;max-width: 100%;display: block;}

#main .pageContact .boxBank .boxBank .boxBankIn .number{font-size: 38px;font-weight: bold;margin: 15px 0 0;color: #25458c;}

#main .pageContact .boxBottom{position: relative;background-color: #fff;overflow: hidden;height: 800px;}

#main .pageContact .boxBottom .logoB{position: absolute;bottom: -200px;width: 900px;left: 0;right: 700px;margin: auto;}

.footerContact{box-shadow: -6px 0 10px #8f8f8f;position: relative;}



#footer{background-color: #005cb9;padding: 65px 0 100px;position: relative;z-index: 500;}

#footer .logo{display: block;max-width: 243px;margin:165px auto 0;width: 100%;}

#footer .boxItem{margin-bottom: 20px;}

#footer .boxItem .icon{display: block;margin: auto;}

#footer .boxItem .text{font-size: 22px;color: #fff;word-break: break-word;line-height: 1.5;margin-top: 5px;}

#footer .boxItem .text a{color: #fff;}

#footer .boxItem .text a:hover{color: #fff;text-decoration: underline;}

#footerB{background-color: #fff;padding: 10px 0;font-size: 24px;color: #005cb9;text-align: center;}

#footer .footerTitle{padding: 0 0 25px;border-bottom: 1px solid #fff;width: 100%;font-size: 29px;text-align: center;font-weight: 500;color: #fff;line-height: 1.7;margin: 0 0 35px;}

#footer .boxBank{background-color: #fff;border-radius: 20px;padding: 22px 20px 25px;color: #004eb9;font-weight: 500;font-size: 27px;}

#footer .boxBank .boxBankIn{border:5px #004eb9 solid;border-radius: 25px;width: 100%;padding: 25px 15px;margin: 30px 0 0;text-align: center;}

#footer .boxBank .boxBankIn img{margin: auto;max-width: 100%;display: block;}

#footer .boxBank .boxBankIn .number{font-size: 38px;font-weight: bold;margin: 15px 0 0;color: #25458c;}



#main .logoOther{position: absolute;bottom: 50px;left: -150px;}

#main .boxArticle2PageArticleDetail{position: relative;z-index: 10;}

#main .boxArticle2 .itemTitle.pageArticle{display: block;margin: auto;width: 100%;}

#main .boxArticle2 .itemTitle.pageArticle .title{font-size: 41px;line-height: 1.9;}

#main .boxArticle2 .itemTitle.pageArticle .title .pin{margin: -35px 0 0 0;width: 41px;}

#main .boxArticle2 .articleTitle{font-size: 37px;color: #005cb9;line-height: 1.5;margin: 35px 0 0;font-weight: 500;}

#main .boxArticle2 .articlePic{max-width: 100%;display: block;margin:35px auto 0;}

#main .boxArticle2 .articleDetailPage{margin:35px auto 200px;}

#main .boxArticle2 .articleDetailPage img{max-width: 100%;height: auto;}



#main .pageProject{font-family: "Noto Serif Thai", serif;}

#main .pageProject .boxTop{padding: 0px 0 0;position: relative;}

#main .pageProject .boxTop .boxL{position: absolute;left: 0;width: 50%;height: 100%;background-color: #ffd925;}

#main .pageProject .boxTop .title{font-size: 40px;color: #005cb9;line-height: 1.5;font-weight: 700;margin-top: 60px;}

#main .pageProject .boxTop .title .small{font-size: 24px;}

#main .pageProject .boxTop .imgR{margin-top: 40px;width: 100%;float: right;max-width: 255px;display: block;border: 8px solid #fff;border-radius: 180px;box-shadow: 0 0 5px #858585;}

#main .pageProject .boxTop .listItemAll{position: relative;z-index: 10;margin:  -75px 0 40px 0;}

#main .pageProject .boxTop .listItemAll .listItem{font-size: 18px;overflow: hidden;margin-top: 11px;}

#main .pageProject .boxTop .listItemAll .listItem img{margin-top: 0px;max-width: 33px;}

#main .pageProject .boxTop .listItemAll .listItem .detail{margin: 13px 0 0 11px;line-height: 1.8;}

#main .pageProject .boxImg{margin: 0 0 120px;}

#main .pageProject .boxImg .imgFirst {width: 100%;margin-bottom: 25px;position: relative;z-index: 10;}

#main .pageProject .boxImg .itemImg{background-size: cover;background-position: center;margin-bottom: 25px;}

#main .pageProject .boxImg .bgProject{width: 100%;opacity: 0;}





.shrink{

transition: 0.5s ease;

}



.shrink:hover{

-webkit-transform: scale(1.15);

-ms-transform: scale(1.15);

transform: scale(1.15);

transition: 0.5s ease;

}

@media (min-width: 1200px){

    .container {max-width: 1200px;}

    #headerDes .container{max-width: 1750px;}

}





@media (max-width: 1600px) {

#main .logoCenter {margin: -403px auto 0;width: 50%;}

#main .boxArticle .fLeft {left: -98px;top: -326px;width: 28%;}

#main .boxArticle .Fright {right: -160px;top: -281px;width: 38%;}

#main .boxArticle .articleTop{font-size: 41px;}

#main .boxDoate .cloudLeft {width: 800px;left: -378px;}

#main .boxDoate .cloudRight {width: 800px;right: -350px;}

#main .boxProject .Fright{display: none;}

#main .boxProject .fLeft{display:none;}

.clickPay{width: 120px;}

#headerDes .boxBottom .boxLogo .name{font-size: 17px;}

#headerDes .boxBottom .menu {font-size: 16px;}

}



@media (max-width: 1199px) {

#headerDes .boxRight .faceHeader {width: 42px;}

#headerDes .boxRight .telHeader {margin: 7px 0 0 15px;width: 22px;}

#headerDes .boxRight .textTel{font-size: 22px;}

#headerDes .boxRight .boxLang div{font-size: 23px;}

#headerDes .boxRight .boxLang{margin: 4px 0 0 35px;}

#headerDes .boxBottom .menu{display: none;}

#headerDes .boxTop,#headerDes .boxBottom{height: 72px;}

#headerDes .boxBottom .boxLogo .logoHeader {width: 118px;}

#headerDes .boxBottom .boxLogo .name {font-size: 21px;margin: 74px 0 0 0;}

#headerDes .boxBottom .menuBar {position: absolute;right: 0;top: 11px;width: 45px;color: #fff;cursor: pointer;right: 5px;display: block;}

#main {margin-top: 143px;}

#main .logoCenter {margin: -390px auto 0;}

#main .boxArticle .fLeft {left: -125px;top: -295px;}

#main .boxArticle .Fright {right: -127px;top: -270px;}

#main .boxArticle .articleTop {font-size: 38px;}

#main .boxDoate .fBottom {max-width: 1680px;}

#main .boxDoate .boxDetailTop {font-size: 24px;padding-top: 200px;}

#main .boxDoate .boxDetailTop2 {font-size: 42px;margin-top: 40px;}

#main .boxDoate .boxInDoate .line1 {font-size: 51px;}

#main .boxDoate .boxInDoate .line2 {font-size: 23px;}

#main .boxSlide .slideHeight {height: 580px;}

#main .boxProject .item .linkProject {font-size: 19px;}

#main .boxProject .boxBtnAll {font-size: 22px;}

#main .boxProject {padding: 90px 0 80px;}

#main .boxNews {padding-bottom: 150px;}

#main .boxNews .itemVDO .title {font-size: 69px;}

#main .boxNews .itemVDO .titleLine2 {font-size: 40px;}

#main .boxNews .boxVideo .text{font-size: 100px;}

#main .boxArticle2 .itemTitle .title {font-size: 45px;}

#main .boxArticle2 .itemTitle .title .pin {margin: -34px 0 0 0;width: 55px;}

#main .boxArticle2 .itemArticle .boxName{font-size: 18px;}

#main .boxArticle2 .btnAll {font-size: 22px;}

#main .boxArticle2 .imgL{width: 450px;}

#main .boxArticle2 .imgR{width: 520px;}

#main .boxArticle2 {padding-bottom: 155px;}

#footer .footerTitle {font-size: 21px;}

#footer .logo {margin: 130px auto 0;}

#footer .boxItem .icon {width: 37px;}

#footer .boxItem .text {font-size: 20px;margin-top: 1px;}

#footerB {background-color: #fff;padding: 10px 0;font-size: 20px;}

#main .boxArticle2 .itemTitle.pageArticle .title {font-size: 36px;line-height: 1.4;}

#main .boxArticle2 .itemTitle.pageArticle .title .pin {margin: -35px 0 0 0;width: 30px;}

#main .pageNewsDetail .boxTopDetail .titleNewsDetail{font-size: 31px;}

#main .boxArticle2 .articleTitle {font-size: 31px;}

#main .logoOther {width: 800px;}

#main .boxArticle2 {padding-bottom: 110px;}

#main .boxArticle2 .articleDetailPage {margin: 35px auto 180px;}

#footer .boxBank .boxBankIn .number {font-size: 34px;}

#main .pageAbout .boxAboutBottom {height: 545px;}

#main .pageContact .logo {top: -20px;right: -150px;width: 700px;}

#main .pageContact .boxBottom{height: 600px;}

#main .pageContact .boxBottom .logoB{width: 750px;}

#main .pageProject .boxTop .title {font-size: 31px;}

}





@media (max-width: 992px) {/*ipad*/

#headerDes .boxRight .faceHeader {width: 35px;}

#headerDes .boxRight .telHeader {margin: 7px 0 0 15px;width: 19px;}

#headerDes .boxRight .textTel {font-size: 21px;}

#headerDes .boxRight .boxLang div {font-size: 21px;}

#headerDes .boxRight .boxLang {margin: 3px 0 0 27px;}

#headerDes .boxBottom .boxLogo .logoHeader {width: 105px;}

#headerDes .boxTop, #headerDes .boxBottom {height: 60px;}

#headerDes .boxBottom .boxLogo {top: -45px;}

#headerDes .boxBottom .boxLogo .name {font-size: 20px;margin: 61px 0 0 0;}

#headerDes .boxBottom .menuBar {top: 7px;}

#main {margin-top: 120px;}

#main .logoCenter {margin: -211px auto 0;}

#main .boxArticle .fLeft {left: -63px;top: -165px;}

#main .boxArticle .Fright {right: -109px;top: -148px;}

#main .boxArticle .articleTop {font-size: 30px;}

#main .boxDoate .fBottom {max-width: 1373px;}

#main .boxDoate .boxDetailTop {font-size: 19px;padding-top: 150px;}

#main .boxDoate .boxDetailTop2 {font-size: 37px;}

#main .boxDoate .boxInDoate {padding: 24px 60px 30px;}

#main .boxDoate .boxInDoate .line1 {font-size: 43px;}

#main .boxDoate .boxInDoate .line2 {font-size: 21px;}

#main .boxDoate .cloudLeft {width: 642px;left: -304px;}

#main .boxDoate .cloudRight {width: 642px;right: -279px;}

#main .boxSlide .boxDetail{bottom: 40px;}

#main .boxSlide .boxDetail .line1 {font-size: 29px;}

#main .boxSlide .boxDetail .line2 {font-size: 17px;}

#main .boxSlide .slideHeight {height: 400px;}

#main .boxProject {padding: 50px 0 50px;}

#main .boxNews .itemVDO .title {font-size: 60px;}

#main .boxNews .itemVDO .titleLine2 {font-size: 32px;margin-top: 7px;}

#main .boxArticle2 .itemArticle .boxName {font-size: 17px;}

#main .boxArticle2 .itemTitle .title {font-size: 40px;}

#main .boxArticle2 .itemTitle .title .pin {margin: -31px 0 0 0;width: 46px;}

#main .boxArticle2 .btnAll {font-size: 20px;}

#footer .logo {width: 275px;}

#footer .boxItem .icon {width: 38px;}

#footer .boxItem .text {font-size: 20px;margin-top: 3px;}

#footer {padding: 80px 0 70px;}

#footerB{font-size: 21px;}

.clickPay{width: 75px;}

#footer .boxBank {max-width: 320px;display: block;margin: auto;}

#footer .logo {margin: 60px auto 0;}

#main .boxArticle2 .itemTitle.pageArticle .title {font-size: 33px;line-height: 1.4;}

#main .boxArticle2 .itemTitle.pageArticle .title .pin {margin: -31px 0 0 0;width: 30px;}

#main .pageNewsDetail .boxTopDetail .titleNewsDetail{font-size: 29px;}

#main .boxArticle2 .articleTitle {font-size: 27px;}

#main .logoOther {bottom: 50px;left: -190px;}

#main .pageAbout .titleAbout {font-size: 46px;}

#main .pageAbout .title2About {font-size: 26px;}

#main .pageAbout .detailAbout,#main .pageAbout .detailAboutCenter {font-size: 21px;}

#main .pageAbout .boxCenterAbout{font-size: 28px;}

#main .pageAbout .detailAboutCenter .textTop {font-size: 29px;}

#main .pageAbout .detailAboutLeft {font-size: 32px;}

#main .pageContact .boxBottom .logoB {width: 715px;right: 193px;left: inherit;}

#main .pageContact .boxBottom {height: 550px;}

#main .pageProject .boxTop .title {font-size: 30px;margin-top: 74px;}

#main .pageProject .boxTop .listItemAll {margin: 5px 0 40px 0;}

#main .boxHis .boxImgClick {width: 140px;}

#main .boxHis{height: 500px;}

}





@media (max-width: 767px) {/*mobile*/

.clickPay {width: 65px;}

#headerDes .boxBottom .boxLogo .name {font-size: 20px;margin: 6px 0 0 10px;}

#headerDes .boxBottom .boxLogo .logoHeader {width: 50px;}

#headerDes .boxBottom .boxLogo {top: 7px;}

#main .logoCenter {margin: -160px auto 0;width: 65%;}

#main .boxArticle .fLeft {left: -63px;top: -114px;}

#main .boxArticle .Fright {right: -109px;top: -106px;}

#main .boxArticle .articleTop {font-size: 23px;}

#main .boxDoate .fBottom {max-width: 1038px;top: -92px;}

#main .boxArticle {padding-bottom: 160px;}

#main .boxDoate .cloudLeft {width: 520px;left: -304px;}

#main .boxDoate .cloudRight {width: 520px;right: -279px;}

#main .boxDoate .boxDetailTop2 {font-size: 34px;}

#main .boxDoate .boxInDoate .line1 {font-size: 37px;}

#main .boxDoate .boxDetailTop {padding-top: 105px;}

#main .boxProject .item .linkProject {font-size: 17px;}

#main .boxProject .boxBtnAll {font-size: 20px;}

#main .boxProject .aBtnAll {margin: 25px auto 0;}

#main .boxNews .itemVDO .title {font-size: 45px;}

#main .boxNews .itemVDO .titleLine2 {font-size: 26px;}

#main .boxNews .boxVideo .text {font-size: 80px;}

#main .boxNews .bgBoxNews {width: 500px;}

#main .boxNews {padding-bottom: 70px;}

#main .boxArticle2 .imgL {width: 320px;}

#main .boxArticle2 .imgR {width: 379px;}

#main .boxArticle2 {padding-bottom: 85px;}

#footerB{font-size: 18px;}

#footer .boxItem .text {font-size: 18px;}

#footer .logo {width: 45%;margin: 0 auto 40px;}

#headerDes .boxLang{display: ;}

.hidMo{display: none;}

.showMo{display: block;}

#main .boxSlide .boxDetail .line2{display: none;}

#main .boxSlide .boxDetail .line1 {font-size: 16px;}

#main .boxProject .item .linkProject {font-size: 15px;}

#main .boxArticle2 .itemTitle .title {font-size: 34px;}

#footer .footerTitle2{margin-top: 50px;}

#footer .logo {margin: 60px auto 0;}

#main .boxArticle2 .itemTitle.pageArticle .title .pin {margin: -16px 0 0 0;width: 24px;display: inline-block;}

#main .boxArticle2 .itemTitle.pageArticle .title {font-size: 29px;line-height: 1.4;}

#main .boxArticle2 .itemTitle.pageArticle .title {margin-top: 10px;}

#main .pageNewsDetail .boxTopDetail .titleNewsDetail{font-size: 26px;}

#main .boxArticle2 .articleDetailPage {margin: 27px auto 180px;}

#main .boxArticle2 .itemTitle .title {font-size: 30px;}

#main .boxArticle2 .itemArticle{padding: 10px;}

#main .pageAbout .titleAbout {font-size: 34px;}

#main .pageAbout .title2About {font-size: 25px;}

#main .pageAbout .detailAbout, #main .pageAbout .detailAboutCenter {font-size: 19px;}

#main .pageAbout .boxCenterAbout {font-size: 23px;}

#main .pageAbout .detailAboutCenter .textTop {font-size: 25px;}

#main .pageAbout .detailAboutLeft {font-size: 29px;}

#main .pageAbout .boxAboutBottom {height: 390px;}

#main .boxNews .itemNews .boxImg{border: 10px solid #fff;}

#main .pageContact .boxBottom {height: 470px;}

#main .pageContact .boxBottom .logoB {width: 555px;right: 92px;bottom: -100px;left: inherit;}

#main .pageProject .boxTop .title {font-size: 22px;margin-top: 51px;}

#main .boxHis .boxImgClick {width: 130px;}

#main .boxHis {height: 350px;}

#main .boxHis .textHis {margin: 34px auto 0;max-width: 443px;width: 100%;display: block;}

#main .boxHis .boxImgClick {width: 101px;}



}





@media (max-width: 575px) {/*mobile small*/

#main .boxArticle .articleTop {font-size: 20px;}

#main .boxArticle .articleTop {margin-top: 20px;}

#main .boxDoate .fBottom {max-width: 946px;}

#main .boxDoate .boxDetailTop2 {font-size: 28px;}

#main .boxDoate .boxInDoate .line1 {font-size: 33px;}

#main .boxDoate .cloudLeft {width: 470px;left: -304px;}

#main .boxDoate .cloudRight {width: 470px;right: -279px;}

#main .boxArticle2 .itemTitle .title {font-size: 28px;}

#main .boxArticle2 .itemTitle .title .pin {margin: -31px 0 0 0;width: 38px;}

#main .boxArticle2 .itemTitle {padding: 19px 20px 33px;display: block;margin: 0 auto 50px;}

#main .pageAbout .titleAbout {font-size: 26px;}

#main .pageContact {padding: 50px 0 0;}

#main .pageContact .logo {top: 26px;right: -160px;width: 550px;}

#main .pageContact .boxIcon{font-size: 20px;}

#main .pageContact .detail {font-size: 18px;}

#main .pageContact .title {font-size: 29px;}

#main .pageContact .boxBank .footerTitle{font-size: 29px;}

#main .pageContact .title {font-size: 27px;}

#main .pageContact .boxBank .boxBank .boxBankIn .number {font-size: 33px;}

#main .pageProject .boxTop .title {font-size: 25px;margin-top: 40px;text-align: center;}

#main .pageProject .boxTop .imgR{float: none;display: block;margin: 21px auto 16px;max-width: 230px;}

#main .pageProject .boxTop .listItemAll .listItem img {margin-top: 0px;}

#main .pageProject .boxTop .listItemAll .listItem {font-size: 17px;margin-top: 16px;}

#main .boxHis{background-image: url('../images/frontend/bgHis2.jpg');height: 320px;}

#footer .footerTitle {font-size: 19px;}

}