@charset "UTF-8";
@import 'sanitize.css';

:root { --easeOutExpo:cubic-bezier(0.16, 1, 0.3, 1); }

body { margin: 0; padding: 0; font-family: "Montserrat", "游ゴシック体","Yu Gothic", "YuGothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", sans-serif;  font-size: 16px; line-height: 1.6667; color: #151515; background: #fff; }
h1,h2,h3,h4,h5,h6{ margin: 0; padding: 0; font-weight: normal; letter-spacing: normal; }
ul,li,ol{ margin: 0; padding: 0; list-style: none;}
a{ text-decoration: none; cursor: pointer; color: #707070; }
h1{text-align: center;}
.clr:after{ content:""; display:block; height:0; clear:both; visibility:hidden; }
header{ height: auto; }
.pc-only { display: block; }
.sp-only { display: none; }

.ENFont{ font-family: "Montserrat", sans-serif; }
.THFont{ font-family: "Sarabun", sans-serif; }
.THFont b{ font-weight: 800; }
.JPFont{ font-family: "Noto Sans JP", sans-serif; }

.THFont header,.THFont footer,.THFont h1,.THFont h2,.THFont h3,.THFont h4{ font-family: "Kanit", sans-serif; }
.THFont .Box2Column .Apply a,.THFont .GalleryList ul li .Title,.THFont .StickyNav,.ASEANJPHRD .BGGray .Subject{ font-family: "Kanit", sans-serif; }

/* HeaderMenu */
.HeaderMenu{ width: auto; height: 330px; margin: auto; position: relative; /*background-color: #fff;*/  background: #fff url(../images/page/bg-top.png) no-repeat top left; background-size: 56%; background-position-y: 10px; }
.HeaderMenuBox{ width: auto; max-width: 90%; height: auto; margin: auto; margin-top: 30px; }
.HeaderMenuBox a{ color: #707070; }
.HeaderMenuBox .SPNav{ width: auto; margin: auto; position: relative; display: flex; flex-wrap: nowrap; justify-content:space-between; align-items: center; }
.HeaderMenuBox .Logo{ width: auto; text-align: left; }
.HeaderMenuBox .Logo img{ width: auto; height: auto; max-width: 380px; }
/*.HeaderMenuBox .NavigationTP{ width: 100%; height: auto; order: 1; margin-right: auto; margin-top: 20px; }
.HeaderMenuBox .NavigationTP ul{ margin: auto; height: auto; display: flex; flex-wrap: nowrap; justify-content: right; align-items: center;}
.HeaderMenuBox .NavigationTP ul li{ margin: 0 15px; text-transform: uppercase; font-size: 20px; font-weight: 500; position: relative; z-index: 2; }
.HeaderMenuBox .NavigationTP ul li a{ color: #707070; }
.HeaderMenuBox .NavigationTP ul li:after { background: none repeat scroll 0 0 transparent; bottom: -8px; content: ""; display: block; height: 1px; left: 0%; position: absolute; background: #111; transition: width 0.3s ease 0s, left 0.3s ease 0s; width: 0; }
.HeaderMenuBox .NavigationTP ul li:hover:after { width: 100%; left: 0;  }
.HeaderMenuBox .NavigationTP ul li img{ width: 12px; height: auto;}
.HeaderMenuBox .NavigationTP ul li:last-child{ margin-right: 0; }
.HeaderMenuBox .NavigationTP ul li a:hover{ color: #707070; }
.HeaderMenuBox .NavigationTP ul li:hover .HeaderMenuBox .NavigationTP ul li a:hover:after { width: 100%; left: 0;  }
.HeaderMenuBox .NavigationTP ul li:hover .SubMenu ul{ display: block!important; }
.HeaderMenuBox .NavigationTP ul li:hover .SubMenu{ display: block!important; position: absolute; width: 180px; height: auto; left: 0; top: 17px; opacity: 1; padding: 35px 10px 10px 0px; transition: all .3s; z-index: -1;}
.HeaderMenuBox .NavigationTP ul li .SubMenu{ position: absolute; width: 180px; height: 0; top: 100px; opacity: 0; transition: all .3s; z-index: -1; }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul{ display: none; height: auto; padding: 0px 0px; }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li{ margin: 0; padding: 0; clear: both; position: relative; background-color: rgba(0, 0, 0, 0.6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li:after { background: none repeat scroll 0 0 transparent; bottom: -1px; content: ""; display: block; height: 0.5px; left: 0%; position: absolute; background: #ccc; transition: width 0.3s ease 0s, left 0.3s ease 0s; width: 0; }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li:hover:after { width: 100%; left: 0;  }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li a{ color: #707070; display: block; padding: 10px 15px; font-size: 15px; font-weight: 500; }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li a:hover{ color: #ccc; }
.HeaderMenuBox .NavigationTP ul li .SubMenu ul li a:before{content:'';}*/
.NavigationTP{ width: 100%; height: auto; order: 1; margin-right: auto; margin-top: 30px; }
.NavigationTP ul{ margin: auto; height: auto; display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;}
.NavigationTP ul li{ margin: 0 20px; text-transform: uppercase; font-size: 20px; font-weight: 500; position: relative; z-index: 2; }
.NavigationTP ul li a{ color: #363535; }
.NavigationTP ul li a:after { background: none repeat scroll 0 0 transparent; bottom: -8px; content: ""; display: block; height: 1px; left: 0%; position: absolute; background: #111; transition: width 0.3s ease 0s, left 0.3s ease 0s; width: 0; }
.NavigationTP ul li a:hover:after { width: 100%; left: 0;  }
.NavigationTP ul li img{ width: 12px; height: auto;}
.NavigationTP ul li:last-child{ margin-right: 0; }
.NavigationTP ul li:first-child{ margin-left: 0; }
.NavigationTP ul li a:hover{ color: #363535; }
.NavigationTPSub{ padding: 30px 0; background-color: #EFEFEF;}
.NavigationTPSub ul{ justify-content: space-between; align-items: center; max-width: 1180px; margin: auto; margin-top: 20px; }
.NavigationTPSub ul li a{ display: block; color: #363535; font-weight: 700; }
.NavigationTPSub ul li{ border-left: 2px solid #363535; margin: 0 0; width: 33.33%; text-align: center; font-weight: 700; }
.NavigationTPSub ul li img{ width: 100%; max-width: 46px; height: auto; vertical-align: middle; }
.NavigationTPSub ul li:nth-child(1) span{ display: block; padding: 14px 0; }
.NavigationTPSub ul li:nth-child(2) span{ display: block; padding: 14px 0; }
.NavigationTPSub ul li:nth-child(3) span{ display: block; padding: 14px 0; }
.NavigationTPSub ul li:nth-child(1) a{ padding: 14px 0;}
.NavigationTPSub ul li:nth-child(2) a{ padding: 14px 0;}
.NavigationTPSub ul li:nth-child(3) a{ padding: 14px 0;}
.NavigationTPSub ul li:nth-child(1){ width: 30%;}
.NavigationTPSub ul li:nth-child(2){ width: 40%;}
.NavigationTPSub ul li:nth-child(3){ width: 30%;}
.NavigationTPSub ul li:nth-child(1) img{ width: 100%; max-width: 46px; height: auto; vertical-align: middle; padding-right: 10px; padding-bottom: 8px; }
.NavigationTPSub ul li:nth-child(2) img{ width: 100%; max-width: 46px; height: auto; vertical-align: middle; padding-right: 10px; }
.NavigationTPSub ul li:nth-child(3) img{ width: 100%; max-width: 46px; height: auto; vertical-align: middle; padding-right: 10px; }
.NavigationTPSub ul li:last-child{ border-right: 2px solid #363535; }
.NavigationTPSub ul li a:hover:after { display: none; }
.NavigationTPSub ul li:hover .NavigationTPSub ul li a:hover:after { width: 100%; left: 0; }
.NavigationTPSub ul li:hover .SubMenu ul{ display: block!important; }
.NavigationTPSub ul li:hover .SubMenu{ display: block!important; position: absolute; width: 100%; height: auto; left: 1%; top: 15px; opacity: 1; padding: 35px 10px 10px 10px; transition: all .3s; z-index: -1;}
.NavigationTPSub ul li .SubMenu{ position: absolute; width: 100%; height: 0; top: 100px; opacity: 0; transition: all .3s; z-index: -1; }
.NavigationTPSub ul li .SubMenu ul{ display: none; height: auto; padding: 0px 0px; }
.NavigationTPSub ul li .SubMenu ul li{ margin: 0; padding: 0; clear: both; color: #eee; font-weight: 500; position: relative; width: 100%; background-color: rgba(0, 0, 0, 0.4); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-left: 0; border-right: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.NavigationTPSub ul li .SubMenu ul li p{ margin: 0; padding: 10px 15px;}
.NavigationTPSub ul li .SubMenu ul li:after { background: none repeat scroll 0 0 transparent; bottom: -1px; content: ""; display: block; height: 0.5px; left: 0%; position: absolute; background: #ccc; transition: width 0.3s ease 0s, left 0.3s ease 0s; width: 0; }
.NavigationTPSub ul li .SubMenu ul li:hover:after { width: 100%; left: 0;  }
.NavigationTPSub ul li .SubMenu ul li a{ color: #eee; display: block; padding: 10px 15px; font-size: 18px; font-weight: 500; }
.NavigationTPSub ul li .SubMenu ul li a:hover{ color: #fff; }
.NavigationTPSub ul li .SubMenu ul li a:before{content:'';}
.HeaderTop{ font-size: 25px; font-weight: 400; color: #777777;}
.SubMenuList ul{ margin: 0!important; padding-left: 40px;}
.HL{ padding: 10px 0;font-weight: 700; }
.SBody .SBodyBox ul li .Icon1{ width: 100%; max-width: 46px; height: auto; padding-right: 10px; }
.SBody .SBodyBox ul li .Icon2{ width: 100%; max-width: 46px; height: auto; padding-right: 10px; }
.SBody .SBodyBox ul li .Icon3{ width: 100%; max-width: 46px; height: auto; padding-right: 10px; }
.SBody .SBodyBox .SubMenuList ul li{ border-bottom: 1px solid transparent; font-weight: 400;}
.SBody .SBodyBox .SubMenuList ul li a{ padding: 5px 10px 5px 5px!important; font-weight: 400; }
.SBody .SBodyBox .SubMenuList ul li a:hover{ color: #F80000; }

.HeaderMenuBox .LangTP{ height: auto; position: relative; }

.NSCLBox{ display: block; text-align: right; /*flex-wrap: nowrap; justify-content: right; align-items: center;*/ }
.SCLBox{ width: auto; order: 2; display: flex; justify-content: right; align-items: center; }
.NavTPColor ul li a{  color: #707070!important; }
.NavTPColor ul li a:hover{  color: #707070!important; }

.polylang_langswitcher{ position: relative;}
.polylang_langswitcher ul{ display: flex; justify-content: center; align-items: center; }
.polylang_langswitcher ul li{ border-right: 1px solid #707070; padding: 0 10px; font-size: 20px; font-weight: 400; line-height: 20px;}
.polylang_langswitcher ul li a.active{ font-weight: 600; }
.polylang_langswitcher ul li a:hover{ font-weight: 600; }
.polylang_langswitcher ul li:last-child{ border-right: 0px; padding-right: 0; }
.polylang_langswitcher ul li.current-lang{ font-weight: bold;}

/*.PageMenu .HeaderMenuBox .NavigationTP ul li a{ color: #000; }
.PageMenu .HeaderMenuBox .Logo img{ mix-blend-mode: difference; }
.PageMenu .HeaderMenuBox .NavigationTP ul li img{ mix-blend-mode: difference!important; filter: invert(100);}
.PageMenu .HeaderMenuBox .NavigationTP ul li:after { background: #000;}*/

/* MobileMenu */
.MobileMenu{ display: none; top: 0; left: 0; width: 100%; height: 60px; position: relative; z-index: 9; background: rgba(0, 0, 0, 0);  backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px); flex-wrap: nowrap; justify-content: space-between; z-index: 999999; transition: all .3s; }
.MobileMenu .LogoMB{ display: flex; align-items: center; width: auto; margin-left: 15px;}
.MobileMenu .LogoMB span{ font-size: 10px; font-weight: 500; }
.MobileMenu .LogoMB img{ width: 100%; max-width: 150px; height: auto; }
.MobileMenu .PropertyBB{ width: 70%; display: flex; flex-wrap: wrap; justify-content: right; align-items: center;}
.activeMenu{ display: block!important; position: fixed; width: 100%; height: 100%; left: 0!important; opacity: 1!important; overflow: scroll; transition: all .3s;}

/* menuIcon */
.menuIcon { margin: 0; width: 50px; height: 50px; cursor: pointer; padding: 12px 4px; position: relative; }
.line1,.line2,.line3 { position: absolute; margin-top: 2px; left: 0; right: 0; margin: auto; width: 30px; height: 1px; border-radius: 100px;pointer-events: none; background-color: #fff; transition: all 300ms ease-out;}
.line1 { margin-top: 0px; }
.line2 { margin-top: 11px; }
.line3 { margin-top: 22px; }
.active .line1 { width: 28px; margin-top: 12px; transform: rotate(45deg); background-color:#fff; }
.active .line2 { width: 28px; opacity: 0; }
.active .line3 { width: 28px; margin-top: 12px; transform: rotate(-45deg); background-color: #fff; }
.HiddenNone{ display: block!important; opacity: 1!important; transition: all .3s;}

/* Menu Fixed Top */
.HeaderMenu { display: inline; position: fixed; left:0; top:0; width:100%; box-sizing:border-box; transition: top 0.6s; z-index: 999999; } /* z-index: 999999999999; */
.HeaderMenu.off-canvas { top: -350px; /*background-color: rgba(0, 0, 0, 0.6);*/ }
/*.HeaderMenu.off-canvas .HeaderMenuBox .Logo img{ max-height: 40px!important; }*/
.HeaderMenu.fixed { top:0; z-index: 999999999999;} 
/*.PageMenu{ background-color: #fff;}
.PageMenu.fixed{ background-color: #fff!important;}
.PageMenu.off-canvas{ background-color: rgba(255, 255, 255, 0.6)!important; }
.HeaderMenu.fixed .HeaderMenuBox .Logo img{ max-height: 40px!important; }*/
.HeaderMenu.fixedBox { position: fixed!important; top:0; z-index: 999999999999; }
/*.HeaderMenu.fixedBox .HeaderMenuBox .Logo img{ max-height: 40px!important; }*/
.FixedMenu { position: fixed!important; }
/*.FixedMenu .HeaderMenuBox .Logo img{ max-height: 40px!important; }*/
.LogoSP img{ width: 100%; height: auto; max-width: 300px; margin-bottom: 10px; }

.button { pointer-events: auto; cursor: pointer; background: #fff; margin: 0; position: relative; display: inline-block;}
.button::before,.button::after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.button--mimas { border-radius: 0.5rem; overflow: hidden; color: #fff; background: #fff; }
.button--mimas span { position: relative; mix-blend-mode: difference; }
.button--mimas::before { content: ''; background: #262626; width: 120%; left: -10%; transform: skew(30deg); transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1); }
.button--mimas:hover::before { transform: translate3d(100%,0,0); }
.button--mimas:hover span { color: #fff;}
.ContactBTN a.button--mimas:hover{border: 1px solid #000;}

/* Footer */
footer{ padding: 0; margin: 0; background-color: #F5F5F5; }
footer .FooterBox{ width: auto; height: auto; padding: 0; }
footer .FooterBox a{ color: #707070; transition: all .3s;}
footer .FooterBox a:hover{ color: #000; transition: all .3s;}
footer .FooterBox p{ margin: 0;}
footer .FooterMenu{ display: block; background-color: #EFEFEF; padding: 30px 0; font-size: 20px; }
footer .FooterMenu ul{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
footer .FooterMenu ul li{ padding: 0px 30px; border-left: 1px solid #090909; color: #707070; }
footer .FooterMenu ul li a{ color: #707070; }
footer .FooterMenu ul li a:hover{ color: #000; }
footer .FooterMenu ul li:last-child{ border-right: 1px solid #090909; }
footer .FooterBox .FoterLogoSNS{ padding: 30px 0; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
footer .FooterBox .FoterLogoSNS .LeftLogo{ width: 48%; text-align: left;}
footer .FooterBox .FoterLogoSNS .LeftLogo img{ width: 100%; height: auto; max-width: 450px;}
footer .FooterBox .FoterLogoSNS .RightSNS{ width: 48%; text-align: right; font-size: 25px; font-weight: 600; display: flex; justify-content: right; align-items: end; color: #000; }
footer .FooterBox .FoterLogoSNS .RightSNS p{ margin: 0; padding: 0;}
footer .FooterBox .FoterLogoSNS .RightSNS .Icons{ margin-left: 15px;}
footer .FooterBox .FoterLogoSNS .RightSNS .Icons img{ width: 100%; height: auto; max-width: 44px; margin-left: 15px; vertical-align: sub; }
footer .FooterBox .FooterCopyRights{ padding: 0 0 30px 0; color: #707070; text-align: center; font-size: 14px; }
footer .FooterBox .FooterCopyRights a{ color: #707070;}
footer .FooterBox .FooterCopyRights a:hover{ color: #000;}
footer .FooterBox .FooterCopyRights .CopyRights{ margin-top: 20px;}

/* AllPageBox */
.AllPageBox{ width: auto; max-width: 1180px; height: auto; margin: auto; margin-top: 330px; padding-top: 70px; padding-bottom: 70px; }
.AllPageWidth{ width: auto; height: auto; max-width: 1180px; margin: auto; }
.AllPageWide{ width: auto; height: auto; max-width: 1400px; margin: auto; position: relative; z-index: 9; }
.AllPageMiddle{ max-width: 1024px; margin: auto; margin-top: 40px; margin-bottom: 40px;}

/* BreadcrumbTopAll */
.BreadcrumbTopAll{ padding: 20px 0; font-size: 12px; color: #4c4c4c; margin-top: 100px;}
.BreadcrumbTopAll a{ color: #4c4c4c;}
.BreadcrumbTopAll img{ width: 15px; height: auto; vertical-align: sub;}
.BreadcrumbTopAll ul{ display: inline; }
.BreadcrumbTopAll ul li{ display: inline-block; margin-right: 20px; position: relative;}
.BreadcrumbTopAll ul li:after{ width: 10px; height: 10px; position: absolute; content: ''; right: -18px; top: 6px; background: url(../images/recruit/icon-arrow-right.svg) no-repeat center; background-size: contain; }
.BreadcrumbTopAll ul li:last-child:after{ display: none; }
.BreadcrumbTopAll ul li br{ display: none;}

/* StickyNavigation */
.StickyNav { position: fixed; top: 100px; right: 60px; width: auto; height: 180px; display: none; /*height: auto;*/ color: #231815; /*width: 63px; height: 63px;*/ z-index: 999999; opacity: 0;  transition: opacity 0.8s ease, top 0.8s ease; }
.StickyNav.sticky-active { opacity: 1;  top: 0px; display: block; }
.StickyNav p{ margin: 0;}
.fixed { position: fixed; top: 0; }
.fixed .line { stroke:#000; }
.fixed .Hamburger{ border: 0px solid #000;} /* 1 > 0 */

.Hamburger{ display: flex; justify-content: center; align-items: center; color: #fff; width: 63px; height: 63px; background-color: transparent; border: 1px solid #fff; overflow: hidden; border-radius: 100px; margin-top: 20px; z-index: 999; }
.ham { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
.hamRotate.active { transform: rotate(45deg); stroke:red; }
.hamRotate180.active { transform: rotate(180deg); stroke:red; }
.line { fill:none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke:#fff; stroke-width:2.5; stroke-linecap:round; }
.ham4 .top { stroke-dasharray: 40 121; }
.ham4 .bottom { stroke-dasharray: 40 121; }
.ham4.active .top { stroke-dashoffset: -68px;  stroke:red; }
.ham4.active .bottom { stroke-dashoffset: -68px; stroke:red; }
.ham4.active .middle { stroke:red; }
.ham8 .top { stroke-dasharray: 40 160; }
.ham8 .middle { stroke-dasharray: 40 142; transform-origin: 50%; transition: transform 400ms; }
.ham8 .bottom { stroke-dasharray: 40 85; transform-origin: 50%; transition: transform 400ms, stroke-dashoffset 400ms; }
.ham8.active .top { stroke-dashoffset: -64px; stroke:red; }
.ham8.active .middle { transform: rotate(90deg); stroke:red; }
.ham8.active .bottom { stroke-dashoffset: -64px; stroke:red; }

.StickyNavPage .Hamburger{  border: 0px solid #000; } /* 1 > 0 */
.StickyNavPage .line { stroke:#000; }

/*  StickyNavMenuBox */
.StickyNavMenu{ opacity: 0; position: fixed; width: 100%; height: auto; left: 0; top: -200%;  z-index: -1; background-color: #F4F4F4; transition: all .5s; }
.StickyNavMenu .StickyNavMenuBox{ position: relative; width: auto; max-width: 1180px; margin: auto; padding: 20px 0 40px 0; }
.StickyNavMenu.StickyNavMenuOpen{ display: block; }
.StickyNavMenuFixed{ position: fixed!important; display: block; opacity: 1!important; color: #fff; width: 100%!important; height: 100%!important; top: 0!important; right: 0!important; transition: all .3s; }
.HamburgerClose{ border: 1px solid red!important; }
.BodyHidden { overflow: hidden!important; }

/* SHeader */
.SHeader{ display: flex; justify-content: space-between; }
.SHeader .SLogo{ width: auto;}
.SHeader .SLogo img{ width: 100%; height: auto; max-width: 150px; }
.SBody{ margin-top: 20px; color: #231815; }
.SBody .polylang_langswitcher{ position: relative; margin-top: 30px;}
.SBody .SBodyBox{ color: #231815; margin-top: 20px; text-transform: uppercase; }
.SBody .SBodyBox .Title{ font-size: 22px; font-weight: 600;}
.SBody .SBodyBox a{ color: #231815; }
.SBody .SBodyBox .TitleLinks{ margin-bottom: 10px;}
.SBody .SBodyBox ul{ margin: 10px 0 10px 20px; }
.SBody .SBodyBox ul li{ margin: 0; font-size: 18px; position: relative; border-bottom: 1px solid #ccc; font-weight: bold; padding: 7px 10px 7px 10px;}
.SBody .SBodyBox ul li a{ display: block; }
.SBody .SBodyBox ul li a:hover{ color: #F80000; }

.TopBGFixed{ position: fixed; width: 60%; height: 238px; top: 10px; z-index: -1; background: url(../images/page/bg-top.png) no-repeat top center; background-size: contain;}
.FooterBGFixed{ position: fixed; width: 80%; height: 328px; right: 0; z-index: -1; bottom: 120px; background: url(../images/page/bg-footer.png) no-repeat right center; background-size: contain;}

.SectionBox{ display: block; position: relative; margin: 140px 0 40px 0;}
.FeatureImage{ margin: 0px;}
.FeatureImage img{ width: 100%; height: auto; max-width: 100%; }
.AboutAMEICC h1{ font-size: 35px; font-weight: bold; line-height: 45px; color: #151515; border-bottom: 1px solid #ccc; padding-bottom: 30px;}
.AboutAMEICC h1 span{ display: block; }
.AboutAMEICC h3{ color: #F80000; font-weight: 600; margin-top: 30px; margin-bottom: 0; }
.HeaderColor{ position: relative; font-weight: bold; font-size: 30px; padding-bottom: 50px; color: #151515; text-align: center; }
.HeaderColor:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.CaptionBG{ background-color: #F5F5F5; color: #151515; font-size: 23px; font-weight: 600; text-align: center; padding: 20px 20px; border-radius: 10px; }
.Caption{ text-align: center; font-size: 20px;}
.Center{ text-align: center;}
.CenterASEAN{ text-align: center;}
.WhatisAMEICCImage{ margin: 40px 0; text-align: center; }
.WhatisAMEICCImage img{ width: 100%; max-width: 600px; height: auto; }
.ObjectiveList{ margin: 20px 0;}
.ObjectiveList ul{ display: flex; justify-content: space-between; }
.ObjectiveList ul li{ width: 33.33%; padding: 15px; text-align: center; font-weight: 600; color: #151515; }
.ObjectiveList ul li img{ width: 100%; height: auto; max-width: 140px; }
.ObjectiveList ul li p{ margin: 0 0 20px 0;}
.MainMissions{ background-color: #F5F5F5; padding: 35px; border-radius: 10px; color: #010101;}
.MainMissions h2{ font-size: 30px; font-weight: bold; text-align: center; color: #151515; }
.MainMissions ul{ margin: 10px 0 0px 15px;}
.MainMissions ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px; font-weight: 500;}
.MainMissions ul li p{ margin: 0;}
.AEMMETIPicture{ margin: 40px; text-align: center; }
.AEMMETIPicture img{ width: 100%; height: auto; max-width: 500px; }
ul.AEMMETIList{ display: flex; justify-content: space-between; max-width: 800px; margin: auto; margin-bottom: 40px; }
ul.AEMMETIList li{ width: 30%;}
ul.AEMMETIList li img{ width: 100%; height: auto; max-width: 100%; }
.Title{ font-weight: 600;}
.THFont .Title{ font-weight: 700;}
.Transformation{ background-color: #F5F5F5; padding: 35px; border-radius: 10px; color: #010101; text-align: center;}
.Transformation h2{ font-size: 20px; font-weight: 700; text-align: center; color: #151515; }
.Transformation hr{ margin: 30px 0;  }
.Transformation .InnerBox{ max-width: 655px; margin: auto;}
.Transformation .InnerBox a{ display: inline-block; background-color: #000; color: #fff; padding: 8px 50px; font-weight: 600; }
.Transformation .InnerBox a:hover{ background-color: #F80000;}
.Transformation p.LastLink{ margin-bottom: 0;}
.MarGin30{ margin-top: 30px;}
.MarGin100{ margin-top: 100px;}

.ASEANJPHRD ul{ margin: 20px 0 20px 30px; }
.ASEANJPHRD ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px; font-weight: 500;}
.ASEANJPHRD h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 55px; padding-bottom: 60px; color: #151515; text-align: center; }
.ASEANJPHRD h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.ASEANJPHRD h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 50px; }
.ASEANJPHRD ol{ margin: 20px 0 20px 30px; counter-reset: my-sec-counter; }
.ASEANJPHRD ol ol{ margin-left: 30px; margin-top: 10px; }
.ASEANJPHRD ol ol ol{ margin-left: 30px; margin-top: 10px; }
.ASEANJPHRD ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.ASEANJPHRD ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.ASEANJPHRD ol li li{ margin-left: 20px;}
.ASEANJPHRD ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.ASEANJPHRD ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.ASEANJPHRD img{ width: auto; max-width: 100%; height: auto; }
.ASEANJPHRDLink a{ color: #F80000; text-decoration: underline!important;}
.ASEANJPHRD .BGGray{ margin: auto; margin-top: 40px; margin-bottom: 40px; background-color: #F5F5F5; padding: 30px; border-radius: 10px; }
.ASEANJPHRD .BGGray .Subject{ font-size: 30px; font-weight: bold; margin-top: 0; margin-bottom: 0;}

.Box2Column{ display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ccc; padding-bottom: 30px; margin-top: 40px!important; }
.Box2Column .SiteVistTitle{ width: 70%; text-align: left;}
.Box2Column .SiteVistTitle h1{ font-weight: bold; font-size: 35px; font-weight: bold; line-height: 40px; color: #151515; text-align: left; margin-bottom: 0; }
.Box2Column .SiteVistTitle .Date{ margin: 10px 0 0 0; font-size: 20px; font-weight: bold;}
.Box2Column .Apply{ width: 28%; text-align: right;}
.Box2Column .Apply a{ background-color: #000; color: #fff; font-size: 35px; font-weight: bold; padding: 10px 10px; display: block; text-align: center; }
.Box2Column .Apply a:hover{ background-color: #F80000; }
.SiteVist .TitleSubject{ font-size: 35px; font-weight: bold; color: #151515; }
.SiteVist ul{ margin: 20px 0 20px 40px; }
.SiteVist ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px; font-weight: 500;}
.SiteVist ul li p{ margin: 0;}
.SiteVist h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; }
.SiteVist h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.SiteVist h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 50px; }
.SiteVist ol{ margin: 20px 0 20px 40px; counter-reset: my-sec-counter; }
.SiteVist ol ol{ margin-left: 30px; margin-top: 10px; }
.SiteVist ol ol ol{ margin-left: 30px; margin-top: 10px; }
.SiteVist ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.SiteVist ol li p{ margin: 0;}
.SiteVist ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.SiteVist ol li li{ margin-left: 20px;}
.SiteVist ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.SiteVist ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.SiteVist .BGGray{ max-width: 900px; margin: auto; margin-top: 20px; margin-bottom: 20px; background-color: #F5F5F5; padding: 20px; border-radius: 10px; }
.SiteVist .PreviousSiteVisit{ max-width: 800px; margin: auto; margin-top: 20px; margin-bottom: 20px; background-color: #F5F5F5; padding: 30px; border-radius: 10px; }
.SiteVistToppage{ margin-top: 140px;}

.GalleryList{ margin: 0 0 20px 0; position: relative; }
.GalleryList ul{ margin: 0; position: relative; }
.GalleryList ul li{ list-style: none; text-align: left; }
.GalleryList ul li .Picture{ margin-bottom: 15px; width: 100%; height: 360px; overflow: hidden; }
.GalleryList ul li .Picture img{ display: block; width: 100%; max-width: 100%; height: 100%; max-height: 100%; object-fit: cover; transition: all .3s; }
.GalleryList ul li .Title{ font-size: 30px; font-weight: bold; margin: 15px 0; padding-right: 150px; }

.RoundCatgory{ margin: 20px 0 0 0; }
.RoundCatgory ul{ display: flex; justify-content: left; flex-wrap: wrap; gap: 2%; margin: 0; }
.RoundCatgory ul li{ width: 23.5%; background-color: #fff; list-style: none; text-align: center; font-size: 20px; margin: 10px 0 0 0; }
.RoundCatgory ul li a{ color: #151515; display: block; padding: 5px; border-radius: 5px;}
.RoundCatgory ul li a:hover{ background-color: #151515; color: #fff;}
.RoundCatgory ul li a.Active{ background-color: #151515; color: #fff; }

.GalleryList .slick-prev:before { background-image: url('../images/icon/icon-arrow-left.svg'); background-size: cover; display: inline-block; width: 46px!important; height: 47px!important; content:""; }
.GalleryList .slick-next:before { background-image: url('../images/icon/icon-arrow-right.svg'); background-size: cover; display: inline-block; width: 46px!important; height: 47px!important; content:""; }
.GalleryList .slick-prev,.GalleryList  .slick-next{ width: 46px!important; height: 47px!important; top: 400px!important; z-index: 9;}
.GalleryList .slick-track { float: left!important; }
.GalleryList .slick-next{ right: 0!important;}
.GalleryList .slick-prev{ left: auto!important; right: 65px!important;}

.OverviewBox{ margin: 60px 0 40px 0;}
.Box2ColumnOverview{ display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin-bottom: 20px; margin-top: 40px!important; }
.Box2ColumnOverview .Title{ width: 70%; text-align: left; padding-left: 40px;}
.Box2ColumnOverview .Title h1{ font-weight: bold; margin: 0; font-size: 35px; font-weight: bold; line-height: 40px; color: #151515; text-align: left; margin-bottom: 0; }
.Box2ColumnOverview .Apply{ width: 360px; text-align: right;}
.Box2ColumnOverview .Apply p{ margin: 0; background-color: #253861; color: #fff; font-size: 35px; font-weight: bold; padding: 0px 10px; display: flex; justify-content: center; align-items: center; text-align: center; }
.Box2ColumnOverview .Apply p span{ font-size: 60px; padding-left: 10px;}
/*.Box2ColumnOverview .Apply a{ background-color: #253861; color: #fff; font-size: 35px; font-weight: bold; padding: 0px 10px; display: flex; justify-content: center; align-items: center; text-align: center; }*/
/*.Box2ColumnOverview .Apply a span{ font-size: 60px; padding-left: 10px;}
Box2ColumnOverview .Apply a:hover{ background-color: #F80000; }*/
.SubCaptions{ text-align: center; color: #8E8D8D; font-size: 20px; font-weight: 600; margin-top: 0; }
.OverviewBox ul{ margin: 20px 0 20px 40px; }
.OverviewBox ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px; font-weight: 500;}
.OverviewBox ul li p{ margin: 0;}
.OverviewBox h2{ font-size: 35px; font-weight: bold; }
/*.Overview h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; }
.Overview h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }*/
.OverviewBox h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 70px; }
.OverviewBox ol{ margin: 20px 0 20px 40px; counter-reset: my-sec-counter; }
.OverviewBox ol ol{ margin-left: 30px; margin-top: 10px; }
.OverviewBox ol ol ol{ margin-left: 30px; margin-top: 10px; }
.OverviewBox ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.OverviewBox ol li p{ margin: 0;}
.OverviewBox ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.OverviewBox ol li li{ margin-left: 20px;}
.OverviewBox ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.OverviewBox ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.OverviewBox .BGGray{ max-width: 1024px; margin: auto; margin-top: 20px; margin-bottom: 20px; background-color: #F5F5F5; padding: 20px; border-radius: 0px; }
.WithLink{ /*font-size: 12px;*/ text-align: center;}
.WithLink .Links{ margin-top: 20px;}
.WithLink .Links a{ display: block; width: 100%!important; max-width: 540px; margin: auto; background-color: #151515; color: #fff; font-size: 20px; text-transform: uppercase; font-weight: bold; padding: 10px 20px; text-decoration: none; }
.WithLink .Links a:hover{ background-color: #F80000; }
.WithLink .Links span.Linksss{ display: block; width: 100%!important; max-width: 540px; margin: auto; background-color: #151515; color: #fff; font-size: 20px; text-transform: uppercase; font-weight: bold; padding: 10px 20px; text-decoration: none; }
.OverviewBox .VideoBox{ max-width: 800px; margin: auto; text-align: center; margin-top: 40px; margin-bottom: 20px; padding: 30px 0; border-radius: 0px; }
.OverviewBox .VideoBox p{ margin: 20px 0;}
.OverviewBox .VideoBox .VideoYT{ width: 100%; height: auto; overflow: hidden; position: relative; margin-bottom: 20px;}
.OverviewBox .VideoBox .VideoYT .YTIframe{ width: 100%; margin: 0; position: relative; padding-bottom: 54%; height: 0; overflow: hidden; text-align: center; }
.OverviewBox .VideoBox .VideoYT .YTIframe iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.iconPDF{ width: 100%; height: auto; max-width: 16px; vertical-align: middle; }
.OverviewBox .PDFDownload{ text-align: center; margin-bottom: 20px; margin-top: 20px; }
.OverviewBox .PDFDownload p{ margin: 10px 0;}
.OverviewBox .PDFDownload a{ display: block; width: 100%!important; max-width: 500px; margin: auto; background-color: #777777; color: #fff; font-size: 16px; font-weight: bold; padding: 10px 20px; }
.OverviewBox .PDFDownload a:hover{ background-color: #F80000; }
.THPage .Apply{ width: 570px; line-height: 50px; font-family: "Kanit", sans-serif;}
.THPage .Apply p{ padding: 30px 10px;}
.THPage .Apply p span{padding-left: 20px;}


.LinksInner{ margin-top: 20px; text-align: center;}
.LinksInner a{ display: block; width: 100%!important; max-width: 540px; margin: auto; background-color: #151515; color: #fff!important; font-size: 20px; text-transform: uppercase; font-weight: bold; text-decoration: none!important; padding: 10px 20px; text-decoration: none; }
.LinksInner a:hover{ background-color: #F80000; }
/*.LinksInner span.LinksInner{ display: block; width: 100%!important; max-width: 540px; margin: auto; background-color: #151515; color: #fff; font-size: 20px; text-transform: uppercase; font-weight: bold; padding: 10px 20px; text-decoration: none; }*/

.BannerLink{ text-align: center; margin: 20px 0;}
.BannerLink img{ width: auto; height: auto; max-height: 300px;}

/*.THPageFont b{ font-weight: 800;}*/

/* SubsidyTrainingProgramTable */
.SubsidyTrainingProgramTable{ margin: 20px 0 40px 0; position: relative; font-family: "Montserrat", sans-serif; }
.SubsidyTrainingProgramTable table thead{ background-color: #707070; color: #fff;}
.SubsidyTrainingProgramTable table thead th{ padding: 15px 8px; font-size: 14px; border: 2px solid #707070; border-left: 0; border-right: 0;}
.SubsidyTrainingProgramTable table .Number{ width: 5%;}
.SubsidyTrainingProgramTable table .Name{ width: 15%;}
.SubsidyTrainingProgramTable table a{ color: #000; font-weight: bold; text-decoration: underline; }
.SubsidyTrainingProgramTable table .Deadline{ width: 35%;}
.SubsidyTrainingProgramTable table .Target{ width: 20%;}
.SubsidyTrainingProgramTable table .Participation{ width: 15%;}
.SubsidyTrainingProgramTable table .ProjectOverview{ width: 10%;}
.SubsidyTrainingProgramTable table img.iconPDF2{ width: 100%; height: auto; max-width: 24px;}
.SubsidyTrainingProgramTable table img.iconVideo{ width: 100%; height: auto; max-width: 33px;}
.SubsidyTrainingProgramTable table tbody td{ padding: 0; text-align: left; border: 2px solid #707070; border-left: 0; border-right: 0; }
.SubsidyTrainingProgramTable table tbody td .Contry{ margin: 0; padding: 10px; font-size: 20px; font-weight: 500; }
.SubsidyTrainingProgramTable table tbody td table tbody .BL0{ border-left: 0!important;}
.SubsidyTrainingProgramTable table tbody td table tbody .BR0{ border-right: 0!important;}
.SubsidyTrainingProgramTable table tbody td table tbody .BT0{ border-top: 0px solid #707070; }
.SubsidyTrainingProgramTable table tbody td table tbody .BBT0{ border-bottom: 0!important;}
.SubsidyTrainingProgramTable table tbody td table tbody td{ border: 2px solid #ccc; padding: 5px 10px; border-left: 2px solid #707070; border-right: 2px solid #707070; }
.SubsidyTrainingProgramTable table tbody td table .Number{ width: 5%;}
.SubsidyTrainingProgramTable table tbody td table .Name{ width: 15%; line-height: 21px;}
.SubsidyTrainingProgramTable table tbody td table .Deadline{ width: 35%; line-height: 21px;}
.SubsidyTrainingProgramTable table tbody td table .Deadline p:first-child{ margin-top: 0;}
.SubsidyTrainingProgramTable table tbody td table .Deadline p:last-child{ margin-bottom: 0;}
.SubsidyTrainingProgramTable table tbody td table .Target{ width: 20%;}
.SubsidyTrainingProgramTable table tbody td table .Participation{ width: 15%; line-height: 21px;}
.SubsidyTrainingProgramTable table tbody td table .ProjectOverview{ width: 10%;}
.table-responsive { width: auto; text-align: center; }
.SubsidyTrainingProgramTable ul{ margin: 0 0 0 19px; padding: 0;}
.SubsidyTrainingProgramTable ul li{ line-height: 20px; margin-bottom: 6px; font-weight: 300; }

/* TrainingProgramScheduleTable */
.TrainingProgramScheduleTable{ margin: 20px 0 80px 0; position: relative;}
.TrainingProgramScheduleTable table{ width: 100%;}
.TrainingProgramScheduleTable table tbody td{ padding: 10px 10px; font-size: 20px; font-weight: bold; border: 1px solid #707070; }
.TrainingProgramScheduleTable table td.No{ width: 7%; text-align: center; }
.TrainingProgramScheduleTable table td.CompanyName{ width: 13%; text-align: center; }
.TrainingProgramScheduleTable table td.CompanyName p{ width: 110px; margin: 0; text-align: center;} 
.TrainingProgramScheduleTable table td.Month{ width: 80%;}
.TrainingProgramScheduleTable .BTL0{ border-top: 0!important; border-left: 0!important;}
.TrainingProgramScheduleTable .BRT0{ border-top: 0!important; border-right: 0!important;}
.TrainingProgramScheduleTable .BBTL0{ border-bottom: 0!important; border-left: 0!important; }
.TrainingProgramScheduleTable .BBTR0{ border-bottom: 0!important; border-right: 0!important;}
table.MonthList{ width: 100%; }
table.MonthList tbody tr{ position: relative;}
table.MonthList tbody tr td{ width: 5%; text-align: center; border: 0px solid #707070!important; padding: 8px 5px; }
.BorderDashBT{ border-bottom: 1px dashed #999; }
.BatchBox{ margin: 0; width: 100%; height: 23px; border-radius: 100px; }
.Batch1{ background-color: #FFFF01; }
.Batch2{ background-color: #EBD0D9; }
.Batch3{ background-color: #CFE2F3; }
.Batch4{ background-color: #B4D8AA; }
.Batch5{ background-color: #F7CAA0; }
.ColorList{ display: flex; justify-content: center; align-items: center; gap: 50px; font-size: 14px; margin-top: 20px; }
.ColorList span{ display: inline-block; width: 52px; height: 16px; border-radius: 100px; margin-right: 5px; vertical-align: middle;}
table.BorderTable1 tr td{ border: 0; height: 100%!important; padding: 9px 10px;}
table.BorderTable2 tr td{ border: 0; height: 100%!important; padding: 15px 10px;}
table.BorderTable3 tr td{ border: 0; height: 100%!important; padding: 3px 10px;}
.DivHeightBox{ /*background-color: #999;*/ height: 100%; display: block;}
ul.DivHeightBox { list-style: none; height: 100%; margin: 0; padding: 0; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; text-align: center;}
ul.DivHeightBox li{ margin: 0; display: block; height: 100%!important; /*background-color: #ccc;*/}

.SlideClick{ display: none;}

.tool-tip { position: relative; }
.tool-tip .tool-tip__info {
  display: none;
  background: #fff;
  
  border-radius: 5px;
  font-size: 14px;
  padding: 15px;
  position: absolute;
  left: -45%;
  top: 5px;
  width: 300px;
  z-index: 9; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2); text-align: left; }
.tool-tip .tool-tip__info .info { display: block; color: #707070; font-weight: 600; line-height: 19px; }
.tool-tip .tool-tip__info .BatchInfo{ display: inline-block; font-weight: 300; padding-top: 5px; color: #707070;}
.tool-tip:hover .tool-tip__info, .tool-tip:focus .tool-tip__info { display: inline-block; }
a:focus + .tool-tip .tool-tip__info { display: inline-block; }

.BoderBatch1{ border: 2px solid #FFFF01; }
.BoderBatch2{ border: 2px solid #EBD0D9; }
.BoderBatch3{ border: 2px solid #CFE2F3; }
.BoderBatch4{ border: 2px solid #B4D8AA; }
.BoderBatch5{ border: 2px solid #F7CAA0; }

/* CourseList */
.CourseList{ max-width: 1024px; margin: auto;  margin-top: 40px;}
.CourseList h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; margin-top: 60px; margin-bottom: 60px; }
.CourseList h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.CourseList ul{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6%; }
.CourseList ul li{ width: 47%; color: #808080; margin-bottom: 60px; }
.CourseList ul li .FeatureImage{ margin-bottom: 15px; }
.CourseList ul li .FeatureImage img{ width: 100%; height: auto; max-width: 100%; }
.CourseList ul li .Title{ font-size: 20px; font-weight: bold; line-height: 25px; margin: 15px 0; }
.CourseList ul li a .Title{ color: #000;}
.CourseList ul li .CompanyName{ margin: 0;}

/* CourseSingle */
.FeatureImageSingle img{ width: 100%; height: auto; max-width: 100%; }
.CourseSingle{ max-width: 800px; margin: auto; }
/*.CourseSingle h1{ font-size: 20px; font-weight: bold;}*/
.TitleFix{ font-size: 20px; font-weight: bold; text-align: center;}

.SingleApply{ display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ccc; padding-bottom: 30px; margin-top: 40px; }
.SingleApply .CompanyName{ width: 64%; text-align: left; font-weight: bold; font-size: 35px; font-weight: bold; line-height: 40px; color: #151515; text-align: left; margin-bottom: 0; padding-right: 20px;}
.SingleApply .Apply{ width: 36%; text-align: right;}
.SingleApply .Apply a{ background-color: #000; color: #fff; font-size: 29px; font-weight: bold; padding: 10px 10px; display: block; text-align: center; }
.SingleApply .Apply a:hover{ background-color: #F80000; }

.CourseInfos{ margin-top: 40x;}
.CourseInfos ul{ margin: 0; padding: 0;}
.CourseInfos{ border-bottom: 1px solid #ccc; padding: 30px 0; }
.CourseInfos ul li{ display: flex; justify-content: left; margin: 0; clear: both; }
.CourseInfos ul li p{ margin: 10px 0;}
.CourseInfos ul li p:nth-child(1){ min-width: 230px; font-weight: 600;}
.CourseInfos ul li p:nth-child(2){ margin-left: 20px; }
.CourseInfos ul li a{ text-decoration: underline; color: #000;}

.SingleDetail{ padding: 30px 0;}
.SingleDetail a{ text-decoration: underline; color: #000; }
.SingleDetail ul{ margin: 20px 0 20px 40px; }
.SingleDetail ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px;}
.SingleDetail ul li p{ margin: 0;}
.SingleDetail h2{ font-size: 35px; font-weight: bold; }
.SingleDetail h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 70px; }
.SingleDetail ol{ margin: 20px 0 20px 40px; counter-reset: my-sec-counter; }
.SingleDetail ol ol{ margin-left: 30px; margin-top: 10px; }
.SingleDetail ol ol ol{ margin-left: 30px; margin-top: 10px; }
.SingleDetail ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.SingleDetail ol li p{ margin: 0;}
.SingleDetail ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.SingleDetail ol li li{ margin-left: 20px;}
.SingleDetail ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.SingleDetail ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.SingleDetail .BGGray{ margin: auto; margin-top: 40px; margin-bottom: 40px; background-color: #F5F5F5; padding: 30px; border-radius: 10px; }
.SingleDetail .BGGray .Subject{ font-size: 30px; font-weight: bold; margin-top: 0; margin-bottom: 0;}
.ApplyBox{ display: flex; justify-content: space-between; align-items: center; font-weight: bold; }
.ApplyBox .Links a{ display: inline-block; text-decoration: none; padding: 10px 30px; width: 160px; text-align: center; background-color: #000; color: #fff; }
.ApplyBox .Links a:hover{ background-color: #F80000; }
.SeeAllProgram{ text-align: center; font-size: 25px; font-weight: bold; }
.cn-text-container a{ color: #fff!important; text-decoration: underline; }

/* pagination */
#pagination { padding: 0; margin: 60px 0 40px; overflow: hidden; }
#pagination ul { position: relative; padding: 0; margin: 0; text-align: center; }
#pagination li { display: inline-block; padding: 0; margin: 0 5px; text-align: center; list-style: none; }
#pagination li a { background: #f5f5f5; }
#pagination li a:hover { background: #151515; color: #fff; }
#pagination li:first-child:hover { opacity: .6; }
#pagination li span, #pagination li a { position: relative; letter-spacing: .5px; }
#pagination span, #pagination a { display: block; float: left; width: auto; padding: 15px 17px; margin: 2px 2px 2px 0; color: #000;  text-decoration: none; border-radius: 3px;}
#pagination .active { padding: 15px 17px; background: #151515; color: #fff; border-radius: 3px;}
#pagination li:first-child span:before, #pagination li:first-child a:before, #pagination li:last-child span:after, #pagination li:last-child a:after { position: absolute; display: block; width: 9px; height: 16px; margin-top: -7px; content: ""; }
#pagination li:first-child a, #pagination li:first-child span{ font-size: 15px; padding-left: 20px; background: none; }
#pagination li:first-child a:hover{ color: #151515; }
#pagination li:last-child a:hover{ color: #151515; }
#pagination li:first-child span:before, #pagination li:first-child a:before { top: 50%; left: 0; background: url(../images/icon/icon-arrowLeft.svg) no-repeat; background-size: 9px 16px; }
#pagination li:last-child:hover { opacity: .6; }
#pagination li:last-child a, #pagination li:last-child span { font-size: 15px; padding-right: 20px; margin: 2px 0px; background: none; }
#pagination li:last-child span:after, #pagination li:last-child a:after { top: 50%; right: 0; background: url(../images/icon/icon-arrowRight.svg) no-repeat; background-size: 9px 16px; }

.SectionBoxOthers{ margin: 80px 0;}
.ContentOthers ul{ margin: 20px 0 20px 30px; }
.ContentOthers ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px; font-weight: 500;}
.ContentOthers h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; }
.ContentOthers h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.ContentOthers h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 50px; }
.ContentOthers ol{ margin: 20px 0 20px 30px; counter-reset: my-sec-counter; }
.ContentOthers ol ol{ margin-left: 30px; margin-top: 10px; }
.ContentOthers ol ol ol{ margin-left: 30px; margin-top: 10px; }
.ContentOthers ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.ContentOthers ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.ContentOthers ol li li{ margin-left: 20px;}
.ContentOthers ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.ContentOthers ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }

.MarGT0{ margin-top: 0!important;}
.MarGB0{ margin-bottom: 20px!important;}

.FAQList{ margin: 0; padding: 0;}
.FAQList ul{ margin: 0; padding: 0;}
.FAQList ul li{ list-style-type: none; margin-bottom: 80px; }
.FAQList ul ul{ margin-left: 30px;}
.FAQList ul ul li{ list-style-type: disc; font-weight: 300; margin: 0;}
.FAQList .Question{ background-color: #EFEFEF; padding: 20px 10px; font-size: 20px; display: flex; justify-content: left; align-items: center; border-radius: 10px; font-weight: bold; }
.FAQList .Question p{margin: 0; }
.FAQList .Question span.Q{ width: 70px; font-weight: 800; color: #F80000; text-align: center; }
.FAQList .Answer{ max-width: 1000px; margin: auto; margin-top: 30px; margin-bottom: 30px; font-weight: 300; }

/* NewsList */
.NewsBox{ max-width: 1024px; margin: auto;  margin-top: 40px;}
.NewsBox h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; margin-top: 60px; margin-bottom: 40px; }
.NewsBox h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.NewsBox .CaptionsCenter{ text-align: center; margin-bottom: 30px;}
.NewsList{ margin-top: 140px;}
.NewsList ul{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6%; }
.NewsList ul li{ width: 47%; color: #808080; margin-bottom: 60px; }
.NewsList ul li .FeatureImage{ width: 100%; margin-bottom: 15px; height: 280px; overflow: hidden; border-radius: 10px; }
.NewsList ul li .FeatureImage img{ display: block; width: 100%; max-width: 100%; height: 100%; max-height: 100%; object-fit: cover; transition: all .3s; }
.NewsList ul li a:hover .FeatureImage img{ opacity: 0.8; transform: scale(1.05); transition: all .3s; }
.NewsList ul li .Title{ font-size: 20px; font-weight: bold; line-height: 25px; margin: 15px 0; }
.NewsList ul li a .Title{ color: #000;}
.NewsList ul li .ReadMore{ margin-top: 20px; text-align: right; font-weight: 600; position: relative; color: #000; padding-right: 30px; }
.NewsList ul li .ReadMore:after{ width: 117px; height: 13px; content: ''; position: absolute; right: 0px; bottom: -3px; background: url(../images/icon/icon-readmore.svg) no-repeat center; background-size: contain; }

.EventLR{ background-color: #EFEFEF; border-radius: 20px; margin-bottom: 30px;}
.EventLR a{ padding: 30px; width: 100%; height: auto; display: flex; justify-content: space-between; align-items: center; }
.EventLR .FeatureImageEvent{ width: 50%; height: 280px; border-radius: 15px; overflow: hidden; }
.EventLR .FeatureImageEvent img{ display: block; width: 100%; max-width: 100%; height: 100%; max-height: 100%; object-fit: cover; transition: all .3s; }
.EventLR a:hover .FeatureImageEvent img{ opacity: 0.8; transform: scale(1.05); transition: all .3s; }
.EventLR .DetailEvent{ width: 50%; padding: 30px; }
.EventLR .DetailEvent .Title{ color: #000; font-size: 25px; font-weight: 600; line-height: 30px; }
.EventLR a:hover .DetailEvent .Title{ color: #F80000; }
.EventLR .DetailEvent .Date{ font-weight: 300; font-size: 20px; margin-top: 20px; }
.EventLR .DetailEvent p{ margin: 0; padding: 0;}
.EventLR .DetailEvent .ReadMore{ margin-top: 10px; text-align: right; font-weight: 600; position: relative; color: #000; padding-right: 30px; }
.EventLR .DetailEvent .ReadMore:after{ width: 117px; height: 13px; content: ''; position: absolute; right: 0px; bottom: -3px; background: url(../images/icon/icon-readmore.svg) no-repeat center; background-size: contain; }

/* CourseSingle */
.NewsSingle{ max-width: 800px; margin: auto; }
.NewsSingle h1{ font-size: 25px; font-weight: bold; text-align: left; padding: 25px 0;}
.FeatureImageNewsSingle img{ width: 100%; height: auto; max-width: 100%; }
.EventDate{ font-weight: 500; font-size: 20px; margin-top: 0px; }
.NewsSingleDtail{ border-top: 1px solid #ccc; padding: 30px 0; }
/*.NewsSingleDtail a{ text-decoration: underline; color: #000; }
.NewsSingleDtail ul{ margin: 20px 0 20px 40px; }
.NewsSingleDtail ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px;}
.NewsSingleDtail ul li p{ margin: 0;}
.NewsSingleDtail h2{ font-size: 35px; font-weight: bold; }
.NewsSingleDtail h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 70px; }
.NewsSingleDtail ol{ margin: 20px 0 20px 40px; counter-reset: my-sec-counter; }
.NewsSingleDtail ol ol{ margin-left: 30px; margin-top: 10px; }
.NewsSingleDtail ol ol ol{ margin-left: 30px; margin-top: 10px; }
.NewsSingleDtail ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.NewsSingleDtail ol li p{ margin: 0;}
.NewsSingleDtail ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.NewsSingleDtail ol li li{ margin-left: 20px;}
.NewsSingleDtail ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.NewsSingleDtail ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.NewsSingleDtail .BGGray{ margin: auto; margin-top: 40px; margin-bottom: 40px; background-color: #F5F5F5; padding: 30px; border-radius: 10px; }
.NewsSingleDtail .BGGray .Subject{ font-size: 30px; font-weight: bold; margin-top: 0; margin-bottom: 0;}*/
.SeeAllNews{ border-top: 1px solid #ccc; padding: 30px 0; text-align: center; font-size: 25px; font-weight: bold; }
.SeeAllNews a{ text-decoration: underline; color: #000; }

.Privacy h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 55px; padding-bottom: 60px; color: #151515; text-align: center; }
.Privacy h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.Privacy p a{ text-decoration: underline; font-weight: bold; color: #000;}

/* AllSingleDetailStyle */
/*.AllSingleDetailStyle{ padding: 30px 0; }*/
.AllSingleDetailStyle a{ text-decoration: underline; color: #000; }
/*.AllSingleDetailStyle img{ width: auto; max-width: 100%; height: auto; }*/
.AllSingleDetailStyle ul{ margin: 20px 0 20px 40px; }
.AllSingleDetailStyle ul li{ list-style: disc; list-style-position: outside; margin-bottom: 10px;}
.AllSingleDetailStyle ul li p{ margin: 0;}
.AllSingleDetailStyle h2{ position: relative; font-weight: bold; font-size: 45px; font-weight: bold; line-height: 45px; padding-bottom: 60px; color: #151515; text-align: center; margin-top: 60px; margin-bottom: 40px; }
.AllSingleDetailStyle h2:after{ position: absolute; content: ''; bottom: 20px; width: 55px; height: 15px; left: 0; right: 0; margin: auto; background: url(../images/about/icon-colours.png) no-repeat center; background-size: contain; }
.AllSingleDetailStyle h3{ font-size: 30px; font-weight: bold; color: #151515; padding-left: 10px; border-left: 8px solid #F80000; margin-top: 70px; }
.AllSingleDetailStyle h4{ display: inline-block; border-bottom: 3px solid #F80000; padding-bottom: 5px; line-height: 40px; font-size: 25px; text-align: left; font-weight: 700; margin-top: 40px; }
.AllSingleDetailStyle ol{ margin: 20px 0 20px 40px; counter-reset: my-sec-counter; }
.AllSingleDetailStyle ol ol{ margin-left: 30px; margin-top: 10px; }
.AllSingleDetailStyle ol ol ol{ margin-left: 30px; margin-top: 10px; }
.AllSingleDetailStyle ol li{ list-style-type:decimal!important; position: relative; display: block!important; margin-bottom: 10px;font-weight: 500; }
.AllSingleDetailStyle ol li p{ margin: 0;}
.AllSingleDetailStyle ol li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.AllSingleDetailStyle ol li li{ margin-left: 20px;}
.AllSingleDetailStyle ol li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -15px; }
.AllSingleDetailStyle ol li li li:before { counter-increment: my-sec-counter; content: "" counter(my-sec-counter) ". "; margin-left: -27px; }
.AllSingleDetailStyle .BGGray{ margin: auto; margin-top: 40px; margin-bottom: 40px; background-color: #F5F5F5; padding: 30px; border-radius: 10px; }
.AllSingleDetailStyle .BGGray .Subject{ font-size: 30px; font-weight: bold; margin-top: 0; margin-bottom: 0;}
.AllSingleDetailStyle table{ margin: 40px 0;}
.AllSingleDetailStyle table tr td{ padding: 10px;}
.AllSingleDetailStyle .GuestSpeaker{ margin: 40px 0; }
.AllSingleDetailStyle .GuestSpeaker .Rows{ display: flex; justify-content: left; flex-wrap: nowrap; margin: 30px 30px; }
.AllSingleDetailStyle .GuestSpeaker .Rows div.Picture{ width: 100px!important; height: 100px; height: auto; }
.AllSingleDetailStyle .GuestSpeaker .Rows div.Picture img{ width: 100px!important; max-width: 100%; height: auto; border-radius: 100px; }
.AllSingleDetailStyle .GuestSpeaker .Rows div.Caption{ width: 100%; padding-left: 30px; text-align: left; font-size: 15px; }
.AllSingleDetailStyle .GuestSpeaker .Rows div.Caption p{ margin: 8px 0;}

.SectionTabs{ margin: 80px 0;}
.TabsForSV{ margin: 0 0 30px 0;}
.TabsForSV ul{ display: flex; justify-content: left; flex-wrap: nowrap; margin: 0; gap: 2%; }
.TabsForSV ul li{ width: 100%; padding: 10px 30px 8px 30px; background-color: #eee; border-radius: 10px 10px 0 0; list-style: none; font-size: 23px; text-align: center; cursor: pointer; }
.TabsForSV ul li.active{ font-weight: bold; border-bottom: 4px solid #3c95de; }
/*#DetailA{ display: block; }*/
.DetailTabs{ display: none; }
.DetailTabsDB{ display: block!important; }
.active{ font-weight: bold; border-bottom: 3px solid #000; }
.inactive{ font-weight: normal; border-bottom: 0px solid #000; }
.activeDetail{ display: block!important;}
.inactiveDetail{ display: none!important;}