.wrap-filter-height{height:80px}.ft-sidebar{display:none}.form-col{max-width:100%}.wrap-filter{max-width:50%}.wrap-filter .group_ul .ul_box{min-width:200px;left:unset !important;right:0}.filter-btn{cursor:pointer;background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-43px -7px;width:19px;height:13px;margin-left:auto}.filter-bar{font-size:0;display:flex;align-items:center;padding:28px 40px;height:80px;background:white;width:100%;transition:transform .3s ease}.filter-bar.fixed{position:fixed;top:80px;left:0;z-index:97}.filter-bar.fixed.hide{transform:translateY(-100px)}.filter-bar .ft-title{line-height:24px;align-items:flex-end;position:relative;top:-3px}[lang=en] .filter-bar .ft-title{font-size:20px}[lang=th] .filter-bar .ft-title{font-size:32px}.chn .filter-bar .ft-title{font-size:21px}.filter-bar .ft-desc{margin-left:12px;position:relative;top:-1px;line-height:24px;color:#9B9B9B}[lang=en] .filter-bar .ft-desc{font-size:13px}[lang=th] .filter-bar .ft-desc{font-size:20px}.chn .filter-bar .ft-desc{font-size:13px}.filter-bar .wrap-filter{display:flex;margin-left:auto}.wrap-loadmore{display:flex;justify-content:center;padding:60px 0}.wrap-loadmore .loadmore-btn{cursor:pointer;display:flex;align-items:center;padding:0 43px;line-height:22px;height:42px;background:black;color:white;border-radius:35px}[lang=en] .wrap-loadmore .loadmore-btn{font-size:13px}[lang=th] .wrap-loadmore .loadmore-btn{font-size:20px}.chn .wrap-loadmore .loadmore-btn{font-size:13px}.tab-menu{padding:15px 0;display:flex;align-items:center;cursor:pointer;flex-flow:row wrap;border-bottom:1px solid #eeeeee}.tab-menu.active .tab-ic{transform:rotate(180deg)}.tab-menu.active .wrap-tab-select{opacity:1;visibility:visible;padding-top:15px;padding-bottom:10px;max-height:1000px}.tab-menu .tab-title{line-height:26px}[lang=en] .tab-menu .tab-title{font-size:15px}[lang=th] .tab-menu .tab-title{font-size:23px}.chn .tab-menu .tab-title{font-size:15px}.tab-menu .clear-btn{line-height:24px;margin-top:2px;margin-left:10px;color:#9B9B9B;cursor:pointer}[lang=en] .tab-menu .clear-btn{font-size:10px}[lang=th] .tab-menu .clear-btn{font-size:16px}.chn .tab-menu .clear-btn{font-size:11px}.tab-menu .tab-ic{margin-left:auto;background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-12px -10px;width:11px;height:6px}.tab-menu .wrap-tab-select{visibility:hidden;transition:all .3s;opacity:0;padding:0;max-height:0;flex-basis:100%}.tab-menu .wrap-tab-select .tab-select{display:flex;align-items:center;line-height:26px;color:#9B9B9B;padding:2px 0}[lang=en] .tab-menu .wrap-tab-select .tab-select{font-size:13px}[lang=th] .tab-menu .wrap-tab-select .tab-select{font-size:20px}.chn .tab-menu .wrap-tab-select .tab-select{font-size:13px}.tab-menu .wrap-tab-select .tab-select.more{margin-top:15px}.tab-menu .wrap-tab-select .tab-select.more .text{position:relative}.tab-menu .wrap-tab-select .tab-select.more .text:after{position:absolute;content:"";width:100%;height:1px;bottom:2px;left:0;border-bottom:1px solid}.tab-menu .wrap-tab-select .tab-select:hover{color:#22252A}.tab-menu .wrap-tab-select .tab-select.selected{color:#22252A}.tab-menu .wrap-tab-select .tab-select.selected:before{content:"";background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-12px -26px;margin-right:8px;min-width:13px;height:10px}.ul_box{z-index:10;left:0 !important;padding:20px;box-shadow:0 2px 8px -2px rgba(0,0,0,0.4);background:white;top:100% !important}.ul_box .li_box{cursor:pointer;margin-bottom:5px;display:flex;align-items:center;color:#9B9B9B}.ul_box .li_box.active,.ul_box .li_box:hover{color:#22252A}.ul_box .li_box.active.active:after,.ul_box .li_box:hover.active:after{content:"";background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-12px -26px;margin-left:auto;min-width:13px;height:10px}.ul_box .li_box:last-child{margin-bottom:0}.dropdown{cursor:pointer;margin-right:40px;display:flex;align-items:center;padding:0;line-height:24px;max-width:100%;position:relative}[lang=en] .dropdown{font-size:13px}[lang=th] .dropdown{font-size:20px}.chn .dropdown{font-size:13px}.dropdown .lb{color:#9B9B9B;margin-right:12px;white-space:nowrap}.dropdown .ul_text{line-height:24px;max-height:100%;opacity:1;height:auto;visibility:visible;transform:none;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:calc(100% - 15px)}[lang=en] .dropdown .ul_text{font-size:13px}[lang=th] .dropdown .ul_text{font-size:20px}.chn .dropdown .ul_text{font-size:13px}.dropdown.group_ul.active .ul_box{top:calc(100% + 10px) !important}.dropdown .ul_ic{margin-left:10px;background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-12px -10px;min-width:11px;height:6px}.dropdown.active .ul_ic{transform:rotate(180deg)}.dropdown:last-child{margin-right:0}.dropdown .ul_box .li_box{color:#9B9B9B}.dropdown .ul_box .li_box.active,.dropdown .ul_box .li_box:hover{color:#22252A}.dropdown .ul_box .li_box.active.active:after,.dropdown .ul_box .li_box:hover.active:after{content:none}.dropdown .ul_box .li_box.active.active:before,.dropdown .ul_box .li_box:hover.active:before{content:"";background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-12px -26px;margin-right:8px;min-width:13px;height:10px}.primary-btn{cursor:pointer;display:flex;align-items:center;padding:0 20px;min-width:120px;line-height:22px;height:42px;background:black;justify-content:center;color:white}[lang=en] .primary-btn{font-size:13px}[lang=th] .primary-btn{font-size:20px}.chn .primary-btn{font-size:13px}.form-input{position:relative;border-bottom:2px solid #222222;width:100%;color:#222222;height:56px;line-height:24px;margin-bottom:30px;padding-top:23px;padding-bottom:7px;padding-left:20px;padding-right:20px}.form-input.group_ul{cursor:pointer}.form-input.group_ul.active .ul_ic{transform:translateY(-50%) rotate(180deg)}.form-input.group_ul.active .ul_box{z-index:99;top:100% !important;left:0 !important}.form-input.group_ul.selected .ul_text{opacity:1;visibility:visible;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(100% - 15px)}.form-input.textarea{padding-top:18px;height:auto}.form-input textarea:focus::placeholder{opacity:0}.form-input textarea:focus::-webkit-input-placeholder{opacity:0}.form-input .ul_ic{pointer-events:none;position:absolute;right:20px;top:50%;background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-109px -10px;width:14px;height:8px;transform:translateY(-50%)}[lang=en] .form-input{font-size:14px}[lang=th] .form-input{font-size:22px}.chn .form-input{font-size:15px}.form-input .validate-box{position:absolute;top:100%;left:0;margin-top:10px;display:flex;align-items:center}.form-input .validate-box .valid-ic{background:url('https://modernform.cdnboost.com/images/project-detail/sprite.svg') no-repeat;background-position:-71px -180px;width:13px;height:13px;margin-right:4px}.form-input .validate-box .valid-text{color:#E44746;line-height:18px}[lang=en] .form-input .validate-box .valid-text{font-size:10px}[lang=th] .form-input .validate-box .valid-text{font-size:16px}.chn .form-input .validate-box .valid-text{font-size:11px}.form-input.invalid{border-color:#E44746 !important;background:rgba(228,71,70,0.1);margin-bottom:40px}.form-input.invalid .lb{color:#E44746}.form-input .ul_text{visibility:hidden;opacity:0}.form-input input,.form-input textarea{background-color:transparent;line-height:24px;width:100%;padding:0;height:100%}[lang=en] .form-input input,[lang=en] .form-input textarea{font-size:14px}[lang=th] .form-input input,[lang=th] .form-input textarea{font-size:22px}.chn .form-input input,.chn .form-input textarea{font-size:15px}.form-input input.textarea,.form-input textarea.textarea{overflow:auto}.form-input input::placeholder,.form-input textarea::placeholder{color:#9B9B9B}.form-input input:focus~.lb,.form-input textarea:focus~.lb,.form-input input:not([value=""])~.lb,.form-input textarea:not([value=""])~.lb{line-height:18px;transform:translateY(-10px)}[lang=en] .form-input input:focus~.lb,[lang=en] .form-input textarea:focus~.lb,[lang=en] .form-input input:not([value=""])~.lb,[lang=en] .form-input textarea:not([value=""])~.lb{font-size:10px}[lang=th] .form-input input:focus~.lb,[lang=th] .form-input textarea:focus~.lb,[lang=th] .form-input input:not([value=""])~.lb,[lang=th] .form-input textarea:not([value=""])~.lb{font-size:15px}.chn .form-input input:focus~.lb,.chn .form-input textarea:focus~.lb,.chn .form-input input:not([value=""])~.lb,.chn .form-input textarea:not([value=""])~.lb{font-size:10px}.form-input input.time-picker:focus~.wrap-timepicker,.form-input textarea.time-picker:focus~.wrap-timepicker{max-height:500px;overflow-y:auto;opacity:1;visibility:visible;-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;-o-transition:all 0.2s ease;transition:all 0.2s ease}.form-input .wrap-timepicker{display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:flex-start;padding:25px;width:100%;box-shadow:0 6px 20px 0 rgba(0,0,0,0.2);visibility:hidden;opacity:0;max-height:0;background:white;z-index:3;position:absolute;top:100%;-webkit-transition:0.1s all 0.2s ease-out;-moz-transition:0.1s all 0.2s ease-out;-ms-transition:0.1s all 0.2s ease-out;-o-transition:0.1s all 0.2s ease-out;transition:0.1s all 0.2s ease-out}.form-input .wrap-timepicker .time{cursor:pointer;justify-content:center;display:flex;height:36px;align-items:center;width:calc(25% - 10px);margin:5px;border-radius:3px;border:1px solid #DFE1E5;background:white;line-height:22px}[lang=en] .form-input .wrap-timepicker .time{font-size:13px}[lang=th] .form-input .wrap-timepicker .time{font-size:20px}.chn .form-input .wrap-timepicker .time{font-size:13px}.form-input .wrap-timepicker .time.disabled{color:#CCCCCC;pointer-events:none}.form-input .wrap-timepicker .time.disabled:hover{background:white;border-color:#DFE1E5;color:#CCCCCC}.form-input .wrap-timepicker .time:hover,.form-input .wrap-timepicker .time.active{color:white}.form-input .lb{pointer-events:none;transition:all .2s ease;color:rgba(34,34,34,0.4);line-height:24px;position:absolute;top:17px;left:20px;max-width:calc(100% - 60px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[lang=en] .form-input .lb{font-size:14px}[lang=th] .form-input .lb{font-size:22px}.chn .form-input .lb{font-size:15px}.form-input #ui-datepicker-div{font-family:'db_helvethaica_xregular';font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;font-weight:normal;top:52px !important;left:0 !important;background:white;width:100%;padding:25px 30px;border-radius:0;z-index:999 !important;border:none;box-shadow:0 6px 20px 0 rgba(0,0,0,0.2)}.form-input #ui-datepicker-div .ui-datepicker-calendar{margin:0}.form-input #ui-datepicker-div .ui-selectmenu-menu{width:auto !important;min-width:150px}.form-input #ui-datepicker-div ul{box-shadow:0 6px 20px 0 rgba(0,0,0,0.2);margin:0 !important;padding:20px !important}.form-input #ui-datepicker-div ul li{line-height:24px}[lang=en] .form-input #ui-datepicker-div ul li{font-size:14px}[lang=th] .form-input #ui-datepicker-div ul li{font-size:22px}.chn .form-input #ui-datepicker-div ul li{font-size:15px}.form-input #ui-datepicker-div ul li:last-child div{margin-bottom:0 !important}.form-input #ui-datepicker-div ul li div{padding:0 !important;margin-bottom:10px !important}.form-input #ui-datepicker-div .ui-widget{font-family:'db_helvethaica_xregular';font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;font-weight:normal;border:0;line-height:32px;background:white;-webkit-appearance:none;margin-right:5px;width:auto;padding:0}[lang=en] .form-input #ui-datepicker-div .ui-widget{font-size:20px}[lang=th] .form-input #ui-datepicker-div .ui-widget{font-size:32px}.chn .form-input #ui-datepicker-div .ui-widget{font-size:21px}.form-input #ui-datepicker-div .ui-widget .ui-selectmenu-text{margin-right:0}.form-input #ui-datepicker-div select.ui-datepicker-month{font-family:'db_helvethaica_xregular';font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;font-weight:normal;border:0;line-height:32px;background:white;width:auto;-webkit-appearance:none;margin-right:5px}[lang=en] .form-input #ui-datepicker-div select.ui-datepicker-month{font-size:20px}[lang=th] .form-input #ui-datepicker-div select.ui-datepicker-month{font-size:32px}.chn .form-input #ui-datepicker-div select.ui-datepicker-month{font-size:21px}.form-input #ui-datepicker-div select.ui-datepicker-year{font-family:'db_helvethaica_xregular';font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;font-weight:normal;border:0;line-height:32px;background:white;width:auto;-webkit-appearance:none}[lang=en] .form-input #ui-datepicker-div select.ui-datepicker-year{font-size:20px}[lang=th] .form-input #ui-datepicker-div select.ui-datepicker-year{font-size:32px}.chn .form-input #ui-datepicker-div select.ui-datepicker-year{font-size:21px}.form-input #ui-datepicker-div .ui-datepicker-prev{right:37px !important;position:absolute;font-size:0;left:unset !important;width:7px;height:12px;background:url('https://modernform.cdnboost.com/images/project-detail/sprite.svg') no-repeat;background-position:-7.5px -95.5px}.form-input #ui-datepicker-div .ui-datepicker-next{position:absolute;right:0;font-size:0;width:7px;height:12px;background:url('https://modernform.cdnboost.com/images/project-detail/sprite.svg') no-repeat;background-position:-24.5px -95.5px}.form-input #ui-datepicker-div .ui-widget-header{border:0;background:white;position:relative;padding:0;display:flex;align-items:center;line-height:28px}[lang=en] .form-input #ui-datepicker-div .ui-widget-header{font-size:14px}[lang=th] .form-input #ui-datepicker-div .ui-widget-header{font-size:22px}.chn .form-input #ui-datepicker-div .ui-widget-header{font-size:15px}.form-input #ui-datepicker-div .ui-widget-header .ui-datepicker-title{margin:0 !important;margin-right:auto !important}.form-input #ui-datepicker-div .ui-datepicker-calendar{margin-top:20px;width:100%;text-align:center}.form-input #ui-datepicker-div .ui-datepicker-calendar thead{margin-bottom:10px}.form-input #ui-datepicker-div .ui-datepicker-calendar thead tr th{width:35px}.form-input #ui-datepicker-div .ui-state-disabled .ui-state-default{color:#CCCCCC !important}.form-input #ui-datepicker-div .ui-datepicker-today.ui-datepicker-days-cell-over .ui-state-default{color:white}.form-input #ui-datepicker-div .ui-state-default,.form-input #ui-datepicker-div .ui-widget-content .ui-state-default{display:block;color:#222222;background:white;border:0;width:35px;margin:3px auto;height:35px;border-radius:50%;text-align:center;line-height:35px}.form-input #ui-datepicker-div .ui-state-default.ui-state-hover,.form-input #ui-datepicker-div .ui-widget-content .ui-state-default.ui-state-hover,.form-input #ui-datepicker-div .ui-state-default.ui-state-active,.form-input #ui-datepicker-div .ui-widget-content .ui-state-default.ui-state-active{color:white}[lang=en] .form-input #ui-datepicker-div .ui-state-default,[lang=en] .form-input #ui-datepicker-div .ui-widget-content .ui-state-default{font-size:14px}[lang=th] .form-input #ui-datepicker-div .ui-state-default,[lang=th] .form-input #ui-datepicker-div .ui-widget-content .ui-state-default{font-size:22px}.chn .form-input #ui-datepicker-div .ui-state-default,.chn .form-input #ui-datepicker-div .ui-widget-content .ui-state-default{font-size:15px}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.dropdown .ul_text{max-width:100% !important}}@media (max-width:767px){.filter-bar{padding-left:15px;padding-right:15px}.filter-bar.fixed{top:55px}.filter-bar .ft-title{line-height:32px}[lang=en] .filter-bar .ft-title{font-size:18px}[lang=th] .filter-bar .ft-title{font-size:28px}.chn .filter-bar .ft-title{font-size:19px}.ft-sidebar{display:none;position:fixed;width:calc(100% - 75px);height:100%;top:0;left:0;transform:translateX(-100%);transition:all .5s ease;background:white;z-index:999}.ft-sidebar.ready{display:block}.ft-sidebar.active{transform:translateX(0)}.ft-sidebar.active+.sidebar-dim{opacity:1;visibility:visible}.ft-sidebar .ft-wrapper{overflow-y:auto;padding:35px 30px;width:100%;height:calc(100% - 70px)}.ft-sidebar .ft-btn-wrap{padding:15px;align-items:center;border-top:1px solid #eee;display:flex;justify-content:space-between}.ft-sidebar .ft-btn-wrap .btn-reset{cursor:pointer;display:flex;align-items:center}.ft-sidebar .ft-btn-wrap .btn-reset .reset-ic{background:url('https://modernform.cdnboost.com/images/collection/sprite.svg');background-position:-79px -7px;width:18px;height:15px;margin-right:10px}.ft-sidebar .ft-btn-wrap .btn-reset .txt{line-height:22px;color:#9b9b9b}[lang=en] .ft-sidebar .ft-btn-wrap .btn-reset .txt{font-size:13px}[lang=th] .ft-sidebar .ft-btn-wrap .btn-reset .txt{font-size:20px}.chn .ft-sidebar .ft-btn-wrap .btn-reset .txt{font-size:13px}.sidebar-dim{z-index:98;position:fixed;top:0;left:0;opacity:0;width:100%;height:100%;visibility:hidden;transition:all .3s ease;background:rgba(0,0,0,0.5)}.form-input{margin-bottom:15px;padding-left:15px;padding-right:15px}.form-input .lb{left:15px}.form-input .ul_ic{right:15px}.form-input.invalid{margin-bottom:40px}.form-input .wrap-timepicker .time{margin:4px;width:calc(33.33% - 8px)}}@media (max-width:360px){.form-input #ui-datepicker-div{padding:20px 10px}}@media (max-width:320px){.primary-btn{min-width:unset !important}}
#sustainable-page { width:100%; } #sustainable-page .title-page { max-width:1280px; margin:0 auto; padding:0 40px; line-height:80px; color:#22252A; text-align:center; padding:60px 0; } [lang=en] #sustainable-page .title-page { font-size:64px; } [lang=th] #sustainable-page .title-page { font-size:100px; } .chn #sustainable-page .title-page { font-size:67px; } #sustainable-page .sustainable-list { max-width:1280px; margin:0 auto; padding:0 40px; position:relative; width:100%; height:100%; } #sustainable-page .sustainable-list .wrap-list .sustainable-item { display:-ms-flexbox; display:-webkit-flex; display:flex; flex-wrap:wrap; margin-top:30px; padding-bottom:30px; border-bottom:1px solid #DFE1E5; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list { width:calc(100% - 260px); display:table; margin:auto 0; color:#22252A; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { line-height:36px; display:-webkit-box; max-height:72px; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; visibility:visible; text-overflow:ellipsis; } [lang=en] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:20px; } [lang=th] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:32px; } .chn #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:21px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate { line-height:24px; color:#9B9B9B; } [lang=en] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate { font-size:13px; } [lang=th] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate { font-size:20px; } .chn #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate { font-size:13px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate .date { margin-right:15px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .date-cate .cate { display:inline-block; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .img-list { width:240px; margin-left:auto; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .img-list img { display:block; width:100%; } #sustainable-page .sustainable-list .wrap-list .sustainable-item:hover .txt-list .title-sustainable { color:#233388; } #sustainable-page .sustainable-list .wrap-list.download_file { position:relative; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news { display:-ms-flexbox; display:-webkit-flex; display:flex; flex-wrap:wrap; padding:30px 0; border-bottom:1px solid #DFE1E5; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .ic-ir { margin:auto 30px auto 0; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text { width:calc(100% - 30px); max-width:720px; display:table; margin:auto auto auto 0; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .news-title { color:#22252A; line-height:30px; } [lang=en] #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .news-title { font-size:17px; } [lang=th] #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .news-title { font-size:26px; } .chn #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .news-title { font-size:17px; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .date { color:#9B9B9B; line-height:24px; } [lang=en] #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .date { font-size:13px; } [lang=th] #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .date { font-size:20px; } .chn #sustainable-page .sustainable-list .wrap-list.download_file .box-news .text .date { font-size:13px; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .icon { height:18px; width:25px; margin:auto 0 auto auto; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .icon .ic-arrow { background-image:url('https://modernform.cdnboost.com/images/ir/sprite_ir.svg'); background-repeat:no-repeat; background-position:-228px 0; display:inline-block; width:10px; height:100%; float:right; position:relative; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news .icon .ic-arrow:after { content:""; position:absolute; display:block; top:50%; width:24px; height:2px; margin-top:-1px; border-radius:1px; background-color:#233388; right:10px; opacity:0; -webkit-transition:all 0.2s; -moz-transition:all 0.2s; -ms-transition:all 0.2s; -o-transition:all 0.2s; transition:all 0.2s; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news:hover .text .news-title { color:#233388; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news:hover .icon .ic-arrow { background-position:-210px 0; } #sustainable-page .sustainable-list .wrap-list.download_file .box-news:hover .icon .ic-arrow:after { right:1px; opacity:1; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir { background-image:url('https://modernform.cdnboost.com/images/ir/sprite_ir.svg'); background-repeat:no-repeat; display:inline-block; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.ir { background-position:0px 0px; width:26px; height:26px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.corp { background-position:-36px 0px; width:26px; height:26px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.finan { background-position:-72px 0px; width:26px; height:26px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.share { background-position:-108px 0px; width:26px; height:26px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.nroom { background-position:-144px 0px; width:26px; height:26px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.sh-list { background-position:-246px -36px; width:60px; height:60px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.sh-meet { background-position:-42px -36px; width:60px; height:60px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.an-report { background-position:-574px -36px; width:60px; height:60px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.arrow { background-position:-228px 0px; width:10px; height:18px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.arrow.blue { background-position:-210px 0px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.arrow.ccc { background-position:-177px 0px; height:17px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.pdf { background-position:0px -36px; width:34px; height:42px; } #sustainable-page .sustainable-list .wrap-list.download_file .ic-ir.page { background-position:-712px -36px; width:34px; height:42px; } #sustainable-page .sustainable-list .wrap-loadmore { display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:center; padding:60px 15px; } #sustainable-page .sustainable-list .wrap-loadmore .loadmore-btn { cursor:pointer; display:flex; align-items:center; padding:0 43px; line-height:22px; height:42px; background:black; color:white; } [lang=en] #sustainable-page .sustainable-list .wrap-loadmore .loadmore-btn { font-size:13px; } [lang=th] #sustainable-page .sustainable-list .wrap-loadmore .loadmore-btn { font-size:20px; } .chn #sustainable-page .sustainable-list .wrap-loadmore .loadmore-btn { font-size:13px; } #sustainable-page .sustainable-list .no-data { text-align:center; padding:30px 15px; } @media (max-width:767px) { #sustainable-page .title-page { padding:0 15px; font-size:60px; line-height:50px; padding-top:40px; padding-bottom:40px; } #sustainable-page .sustainable-list { padding:0 15px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item { padding-bottom:20px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list { display:block; width:100%; order:2; -webkit-box-ordinal-group:2; -moz-box-ordinal-group:2; -ms-flex-order:2; -webkit-order:2; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { line-height:30px; max-height:60px; } [lang=en] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:17px; } [lang=th] #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:26px; } .chn #sustainable-page .sustainable-list .wrap-list .sustainable-item .txt-list .title-sustainable { font-size:17px; } #sustainable-page .sustainable-list .wrap-list .sustainable-item .img-list { width:100%; margin-bottom:15px; order:1; -webkit-box-ordinal-group:1; -moz-box-ordinal-group:1; -ms-flex-order:1; -webkit-order:1; } #sustainable-page .sustainable-list .wrap-loadmore { padding-top:40px; padding-bottom:40px; } }