/* -------------------------------------  1440px  ------------------------------------- */
@media(max-width:1440px)
{
    .SliderTreeType .slick-next{ right: 45%; }
    .SliderTreeType .slick-prev{ left: 45%;  }
}

/* -------------------------------------  1280px  ------------------------------------- */
@media(max-width:1280px)
{
    /* HeaderMenu */
    .HeaderMenu{ height: 110px;}
    .HeaderMenuBox .Logo img{ max-width: 140px;}
    .HeaderMenuBox .Logo .LogoText{ font-size: 9px; }
    .HeaderMenuBox .Logo .LogoText span{ font-size: 17px;}
    .HeaderMenuBox .Logo .LogoText img{ max-width: 200px;}
    .HeaderMenuBox .NavigationTP ul li{ font-size: 14px; margin: 0 0px;}
    .HeaderMenuBox .NavigationTP ul li a{ padding: 10px 10px;}
    .ShopLink img{ max-width: 18px!important;}
    .ViewMoreBTNTop2--mimas svg{ width: 18px; }
    .ContactLink img{ max-width: 18px!important;}
    .HeaderMenuBox .NavigationTP ul li:hover .SubMenu{ top: 41px; left: -150px; width: 463px;}
    .HeaderMenuBox .NavigationTP ul li .SubMenu ul li a{ font-size: 14px;}
    .HeaderMenuBox .NavigationTP ul li:last-child{ margin-left: 5px;}

    .KVSlide{margin-top: 110px;}

    /* Footer */
    footer .FooterBox{ max-width: 100%; margin: auto; margin-left: 60px; margin-right: 60px; }
    footer .CopyRightBox{ max-width: 100%; margin: auto; margin-left: 60px; margin-right: 60px; }

    /* AllPageWidth */
    .AllPageWidth{ max-width: 100%; margin-left: 60px; margin-right: 60px; }
    .AllPageWidth990{ max-width: 100%; margin-left: 60px; margin-right: 60px; }

    /* ViewMoreBox */
    .ViewMoreBTNTop{ font-size: 14px;}
    .ContactLink{ padding: 10px 15px; }
    .LangRight{ padding: 8px 15px !important;}

    /* TopKV */
    .TopKV h1{ font-size: 35px;}
    
    /* CaptionTP */
    .CaptionTP{ font-size: 25px; }

    .NewsBoxList .parent-div h3 .HeaderNews .Title{ padding-right: 80px;}
    
    .container_ProundAchievement1 > div > ul { max-width: 100%; }
    .ProundAchievement1{ max-width: 100%; margin-left: 60px; margin-right: 60px;}
    .LeftPictureAbout img{ max-width: 33%;}

    .SectionTypeArea .HeaderBox p{ font-size: 60px; }
    .SectionTypeArea .HeaderBox h2{ font-size: 20px;  }
    .SectionTypeInfo .Captions{ padding-left: 30px; font-size: 20px; }
    .SectionTypeInfo .LogoT{ width: 110px; height: 110px;}
    .Type01{ background-position: center right -180px;}

    .SectionLRBox .SectionRBox p.Title{ font-size: 25px;}
    .SectionTypeInfo .CaptionsLarge{ font-size: 35px;}

    /* ServiceFlow */
    .IMFFlowBox{ margin: auto; margin-left: 60px; margin-right: 60px; }
    .IMFlowCurcle{ max-width: 850px; margin: auto; margin-top: 100px; margin-bottom: 200px; }
    .IMFlowCurcle .CurcleCenter{ max-width: 770px; /*max-width: 85%;*/ }
    .Curcle1{ top: -15%; }
    .Curcle2 { top: 8%; right: -6%;}
    .Curcle3 { top: 50%; right: -6%; }
    .Curcle4{ bottom: -18%; }
    .Curcle5 { top: 50%; left: -6%; }
    .Curcle6 { top: 8%; left: -6%; }

    .SliderTreeType .slick-next{ right: 44%; }
    .SliderTreeType .slick-prev{ left: 44%;  }
    .SliderTreeType .slick-slider .slick-slide { margin: 15px; }
    .SliderTreeType .slick-slider .slick-slide.slick-current .InnerBox .Picture, .SliderTreeType .slick-slider .slick-slide.slick-center .InnerBox .Picture{ height: 230px;}
    .SliderTreeType .slick-slider .slick-slide.slick-current .Description, .SliderTreeType .slick-slider .slick-slide.slick-center .Description{ font-size: 15px;}
    .SliderTreeType .slick-slider .slick-slide.slick-current,.SliderTreeType .slick-slider .slick-slide.slick-slick-active, .SliderTreeType .slick-slider .slick-slide.slick-center {transform: scale(1.04); }
    
    /* KVSlide */
    .KVSlide ul li{ height: 450px;}
    .KVSlide ul li:nth-child(1) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(2) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(3) .Title p{ padding: 40px 20px; font-size: 29px; }

    .MapSlide .HeaderBox h2{ font-size: 25px;}
    .MapSubject{ top: 0%; }
    .MapSlideLR .MapSlideLRRight{ padding-right: 50px;}
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagRight .Title{ font-size: 18px; }
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagRight .Country{ font-size: 18px;}
    .LRBox .FlagRight .Title{ font-size: 15px;}
    .LRBox .FlagRight .Country{ font-size: 15px;}
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li{ margin: 20px 0; padding: 25px;}

    .WorkPlaceAreaLR .WorkPlaceAreaL{ width: 50%; }
    .WorkPlaceAreaLR .WorkPlaceAreaR{ width: 45%; }
    .BGWorkPlace1::before { clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%); }
    .BGWorkPlace3::before { clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%); }
    
    .RecruitmentList .Description{ font-size: 14px;}
    .RecruitmentList .TagsCat{ font-size: 16px;}

    .RecruitDetailPopup{ width: 800px; }
    .RecruitDetailPopup .Title{ font-size: 24px;}
    .RecruitDetailPopup{ padding: 50px;}
    .RecruitDetailPopup .DRows{ margin: 0 0 5px 0;}
    .RecruitDetailPopup .ClosePopup{ margin-left: 650px;}

    .TopKV:before{ top: 45%; width: 260px; height: 4px; }
    .TopKV:after{ top: 45%; width: 260px; height: 4px; }
    .TopKV h1:before{ left: -110px; top: -60px; width: 200px;  height: 200px; }

}

/* -------------------------------------  1023px  ------------------------------------- */
@media(max-width:1023px)
{
    .KVSlide{margin-top: 50px;}
    /* MobileMenu */
    .MobileMenu{ display: flex!important; }
    .MobileMenu .LogoMB a{ position: absolute; width: 100%; text-align: left; left: 10px; /*top: 10px;*/ }
    .MobileMenu .LogoMB img{ max-width: 100px; position: relative; z-index: 1; margin-top: -2px; }
    .HeaderMenu.fixed .HeaderMenuBox .SPNav{ margin-top: 0px!important;}
    /* HeaderMenu */
    .HeaderMenu{ height: 50px;}
    .HeaderMenuBox{ /*display: none;*/ display: none; width: 100%; max-width: 100%!important; height: 100vh; margin-top: 0; }
    .HeaderMenuBox .Logo{ display: none; }
    .HeaderMenuBox .LangTP{ display: none; }
    .NavigationTP{ display: none;}
    .SPNav{ /*background-color: #1e1a16;*/ background: rgba(0, 80, 196, .8); backdrop-filter: blur(15px); width: 100%; margin: auto; margin-top: 0px!important; position: relative; flex-wrap: wrap; justify-content: space-between; align-items: center; }
    .activeMenu .NavigationTP{ display: block; max-width: 90%; margin: auto; margin-top: 30px; margin-bottom: 30px; }
    .activeMenu .NavigationTP ul{ height: auto; display: block; }
    .activeMenu .NavigationTP ul li{ font-size: 18px; font-weight: 500; margin-bottom: 0px; }
    .activeMenu .NavigationTP ul li a{ color: #fff; display: block; margin: auto; text-align: center; padding: 10px 10px 10px 10px!important; }
    .activeMenu .NavigationTP ul li a:hover{ color: #fff;}
    .activeMenu .NavigationTP ul li:last-child{ border-bottom: 0; margin-top: 10px; background-color: transparent; box-shadow: 0px 0px 5px rgba(0,0,0,0);  }
    .activeMenu .NavigationTP ul li:nth-last-child(2){ background-color: transparent; box-shadow: 0px 0px 5px rgba(0,0,0,0);  }
    .activeMenu .NavigationTP ul li a.currentmenu:after { bottom: -1px;}
    .ContactIcon:before{ left: 0;}
    .ShoppingIcon:before{ left: 0;}
    .BusiesssIcon:before{ left: 0;}
    .ResultIcon:before{ left: 0;}
    .activeMenu .LangTP{ display: block; width: 90%; text-align: center!important; margin: auto;}
    .activeMenu .LangTP ul{ justify-content: center!important;}
    .activeMenu .LangTP ul li{ border-bottom: 0px solid #2e2a26;}
    .activeMenu .LangTP ul li a{ padding: 0!important;}
    .activeMenu .LangTP ul li:last-child{ border-bottom: 0; margin-top: 0px; }
    .HeaderMenuBox .NavigationTP ul li .SubMenu{ position: relative!important; display: block!important; width: 100%!important; }
    .NavigationTP ul li:hover .SubMenu{ display: block!important; margin: auto; position: relative!important; width: 100%!important; left: 0; top: 0; height: auto; padding: 0px 0px 0px 0px; z-index: -1;}
    .HeaderMenuBox .NavigationTP ul li:hover .SubMenu{ top: 0px!important; left: 0px!important; background-color: transparent; box-shadow: 0px 0px 0px rgba(0,0,0,0); position: relative!important; }
    .HeaderMenuBox .NavigationTP ul li .SubMenu ul li a:hover{ background-color: transparent!important; color: #3e3a39!important;}
    .NavigationTP ul li .SubMenu{ display: block; margin: auto; /*z-index: 1;position: absolute; width: 100%; left: 0; top: 45px; height: auto; background-color: #fff; padding: 15px;*/ }
    .NavigationTP ul li .SubMenu ul{ display: block; height: auto; box-shadow: 1px 1px 7px rgba(0,0,0,0)!important; padding: 5px 10px; background: transparent!important;}
    .NavigationTP ul li .SubMenu ul li{ display: block!important; margin: 0; padding: 0; clear: both; padding: 0; border-bottom: 0px solid #425a89; }
    .activeMenu .NavigationTP ul li .SubMenu ul li:hover:last-child{ background-color: #fff; box-shadow: 0px 0px 5px rgba(0,0,0,0.2);  }
    .activeMenu .NavigationTP ul li .SubMenu ul li:hover:nth-last-child(2){ background-color: #fff; box-shadow: 0px 0px 5px rgba(0,0,0,0.2);  }
    .NavigationTP ul li .SubMenu ul li a{ color: #adc009; padding: 5px 0!important; }
    .NavigationTP ul li .SubMenu ul li a:hover{ color: #adc009; }
    .HeadSub{ border-radius: 100px!important; background-color: transparent!important; box-shadow: 0px 0px 0px rgba(0,0,0,0)!important;}
    .NavTPColor ul li a{  color: #adc009!important; }
    .NavTPColor ul li a:hover{  color: #fff!important; }
    .ContactIcon:before{ width: 110px; height: 80px; top: -85px; }
    .ContactIcon:hover:before{ width: 110px; height: 80px; top: -85px; }
    .ShoppingIcon:before{ width: 110px; height: 80px; top: -85px; }
    .ShoppingIcon:hover:before{ width: 110px; height: 80px; top: -85px; }
    .BusiesssIcon:before{ width: 110px; height: 80px; top: -85px; }
    .BusiesssIcon:hover:before{ width: 110px; height: 80px; top: -85px; }
    .ResultIcon:before{ width: 110px; height: 80px; top: -85px; }
    .ResultIcon:hover:before{ width: 110px; height: 80px; top: -85px; }
    .HeaderMenuBox .NavigationTP ul li a{margin: 0 auto; display: inline-block}
    .HeaderMenuBox .NavigationTP ul li .SubMenu ul li a{ font-size: 16px;}

    .ContactLink { padding: 10px 35px; }
    .LangRight{ padding: 8px 20px!important; }
    
    /* Footer */
    footer .FooterBox{ width: 90%; margin: auto;}
    footer .CopyRightBox{ width: 90%; margin: auto;}
    footer .CopyRight{ font-size: 11px; }

    /* AllPageWidth */
    .AllPageWidth{ max-width: 90%; margin: 0 auto; }
    .AllPageWidth990{ max-width: 90%; margin: 0 auto; }

    /* ContactBox */
    .ContactBox{ width: 90%; margin: auto; }

    /* TopKV */
    .TopKV{ max-width: 90%; margin: auto; margin-top: 80px; margin-bottom: 40px;}
    .TopKV h1{ font-size: 25px; }
    .TopKV img{ max-width: 100px; }

    .TopKV:before{ left: -6%; top: 45%; width: 260px; height: 3px; }
    .TopKV:after{ right: -5%; top: 45%; width: 260px; height: 3px; }
    .TopKV h1:before{ left: -110px; top: -60px; width: 200px;  height: 200px; }

    /* CaptionTP */
    .CaptionTP{ max-width: 90%; margin: auto; margin-top: 50px; margin-bottom: 50px; font-size: 23px; line-height: 50px; }

    .container_ProundAchievement1 > div > ul { width: 100%; max-width: 100%; }
    .container_ProundAchievement1 > div > ul > li { width: 100%; }
    .ProundAchievement1 { display: block; max-width: 90%; margin: auto;}
    .ProundAchievement1 .Box1{ width: 100%;}
    .ProundAchievement1 .Box2{ width: 100%;}
    .LeftPictureAbout{ display: none;}
    .LeftPictureAbout2{ display: block; position: relative; width: 100%; max-width: 100%; left: 0; margin-top: -18%; display: flex; flex-wrap: nowrap; margin-top: 20px; }
    .LeftPictureAbout2 img{ width: 100%; height: auto; max-width: 33.33%; }

    .SectionTypeArea .HeaderBox p{ font-size: 50px; }
    .SectionTypeArea .HeaderBox h2{ font-size: 18px;  }
    .SectionTypeInfo .Captions{ padding-left: 30px; font-size: 20px; }
    .SectionTypeInfo .LogoT{ width: 110px; height: 110px;}
    .Type01{ background-position: center right -270px;}
    .SectionLRBox .SectionRBox p.Title br{ display: none;}
    .SectionTypeInfo .CaptionsLarge{ font-size: 30px;}

    /* IMFFlowBox */
    .IMFlowCurcle{ max-width: 90%; }
    .IMFFlowBox{ max-width: 90%; margin: auto;  }
    .IconCurcle{ width: 80px; height: 80px; }
    .Curcle1{ max-width: 260px; }
    .Curcle1 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px; margin-top: -15px;}
    .Curcle1 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .Curcle2{ max-width: 260px; margin-top: 30px; top: 5%; right: -9%; }
    .Curcle2 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px;margin-top: -15px; }
    .Curcle2 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .Curcle3{ max-width: 260px; top: 52%; margin-top: 30px; top: 45%; right: -9%; }
    .Curcle3 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px;margin-top: -15px; }
    .Curcle3 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .Curcle4{ max-width: 260px; margin-top: 30px; }
    .Curcle4 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px;margin-top: -15px; }
    .Curcle4 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .Curcle5{ max-width: 260px; top: 52%; margin-top: 30px; top: 45%; left: -9%; }
    .Curcle5 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px;margin-top: -15px; }
    .Curcle5 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .Curcle6{ max-width: 260px; margin-top: 30px; top: 5%; left: -9%; }
    .Curcle6 .Title{ font-size: 18px; min-height: 100px; padding: 20px 15px;margin-top: -15px; }
    .Curcle6 .Captions{ font-size: 13px; line-height: 23px; padding: 0 25px;}
    .IMFlowCurcle .CurcleCenter .CenterText{ font-size: 50px; line-height: 50px;}

    .SliderTreeType .slick-next{ right: 41%; }
    .SliderTreeType .slick-prev{ left: 41%;  }

    /* KVSlide */
    .KVSlide ul li{ height: 350px;}
    .KVSlide ul li:nth-child(1) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(2) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(3) .Title p{ padding: 40px 20px; font-size: 22px; letter-spacing: 2px; }

    .MapSlide .HeaderBox h2{ font-size: 22px;}
    .MapSlide .HeaderBox p{ font-size: 18px;}
    .MapSubject{ top: -10%; }
    .MapSlideLR .MapSlideLRLeft{ padding-top: 10%;}
    .MapSlideLR .MapSlideLRRight{ padding-right: 50px;}
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagLeft{ min-width: 80px; width: 80px; }
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagRight .Title{ font-size: 14px; }
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagRight .Country{ font-size: 14px;}
    .LRBox .FlagRight .Title{ font-size: 14px;}
    .LRBox .FlagRight .Country{ font-size: 14px;}
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li{ margin: 20px 0; padding: 25px;}
    .SlideOurExpertise .slider{ margin-right: 30px;}

    .SlideOurExpertise .slide.active .LRBox .FlagLeft{ min-width: 80px; width: 80px; height: auto; }
    .LRBox .FlagLeft{ min-width: 60px; width: 60px; height: auto; }
    .SlideOurExpertise .arrow img{ max-width: 90px;}
    .LRBox .FlagRight .Descriptions{ font-size: 13px;}
    .SlideOurExpertise .slide{ margin: 15px 0;}
    .BTNViewmoreBlue{ margin-top: 100px;}

    .TopHeaderBox{ height: 220px; padding-right: 0px;}
    .TopHeaderBox .LeftT{ height: 220px; }
    .TopHeaderBox .CenterT{ height: 220px; }
    .TopHeaderBox .CenterT::before{ height: 220px;  }
    .TopHeaderBox .CenterT::after{ height: 220px; } 
    .TopHeaderBox .RightT{ height: 220px; }
    .TopHeaderBox .Title{ font-size: 30px; }
    .TopHeaderBox img{ max-width: 180px;}
    .TopHeader{ margin-top: 50px;}

    .MessageAreaLR .MessageAreaL { font-size: 15px; line-height: 33px; }
    .MessageAreaLR .MessageAreaR { width: 40%; }
    .MessageLiine img{ max-width: 260px;}
    
    .WorkPlaceAreaLR .WorkPlaceAreaL .Title{ font-size: 23px; line-height: 43px;}
    .WorkPlaceAreaLR .WorkPlaceAreaL .SubTitle{ font-size: 23px; line-height: 43px;}
    .WorkPlaceAreaLR .WorkPlaceAreaL .Captions{ font-size: 16px;}
    .WorkPlaceAreaLR .WorkPlaceAreaR .TagsPicture{ font-size: 16px;}

    .RecruitDetailPopup{ width: 700px; }
    .RecruitDetailPopup .Title{ font-size: 24px;}
    .RecruitDetailPopup{ padding: 50px;}
    .RecruitDetailPopup .DRows{ margin: 0 0 5px 0;}
    .RecruitDetailPopup .ClosePopup{ margin-left: 550px;}

    .TopBreadcrumbsForPage{ margin-top: 50px; padding-bottom: 10px;}

}   

/* -------------------------------------  768px  ------------------------------------- */
@media(max-width:768px)
{
    .SliderTreeType .slick-slider .slick-slide { margin: 25px; }
    .SliderTreeType .Description{ padding: 0 20px 15px 20px; }
    .SliderTreeType .slick-current.slick-active .Description{ padding: 0 20px 15px 20px;}
}

/* -------------------------------------  767px  ------------------------------------- */
@media(max-width:767px)
{
    /* TopKV */
    .TopKV h1{ font-size: 22px; }
    .TopKV img{ max-width: 80px; }

    /* KVSlide */
    .KVSlide ul{ display: block; }
    .KVSlide ul li{ width: 100%; height: 300px; }

    /* SectionLRBox */
    .SectionLRBox{ padding: 100px 0; display: block; }
    .SectionLRBox .SectionLBox{ width: 100%; max-width: 100%; margin-bottom: 30px; }
    .SectionLRBox .SectionRBox{ margin-left: 0px; width: 100%; line-height: 35px; }

    /* IMFlowCurcle */
    .IMFlowCurcle{ display: block; margin-top: 0; margin-bottom: 100px; }
    .Curcle1{ max-width: 310px; position: relative; left: 0; right: 0;}
    .Curcle2{ max-width: 310px; position: relative; left: 0; right: 0;}
    .Curcle3{ max-width: 310px; position: relative; left: 0; right: 0;}
    .Curcle4{ max-width: 310px; position: relative; left: 0; right: 0;}
    .Curcle5{ max-width: 310px; position: relative; left: 0; right: 0;}
    .Curcle6{ max-width: 310px; position: relative; left: 0; right: 0;}
    .CurcleCenter{ display: none;}

    .MapSlideLR{ display: block;  }
    .MapSlideLR .MapSlideLRLeft{ display: none; }
    .MapSlideLR .MapSlideLRRight{ width: 90%; margin: auto; padding-right: 0;}
    .BTNViewmoreBlue{ margin-top: 80px;}

    .TopHeaderBox{ height: 200px; }
    .TopHeaderBox .LeftT{ height: 200px; }
    .TopHeaderBox .CenterT{ height: 200px; }
    .TopHeaderBox .CenterT::before{ height: 200px;  }
    .TopHeaderBox .CenterT::after{ height: 200px; } 
    .TopHeaderBox .RightT{ height: 200px; }
    .TopHeaderBox .Title{ font-size: 20px; }
    .TopHeaderBox img{ max-width: 160px;}

    .MessageArea .MessageAreaBox h1{ font-size: 30px; line-height: 60px; }
    .MessageLiine img{ max-width: 220px;}

    .WorkPlaceAreaLR{ display: block; }
    .WorkPlaceAreaLR .WorkPlaceAreaL{ width: 100%;}
    .WorkPlaceAreaLR .WorkPlaceAreaL .Title{ font-size: 23px; line-height: 43px;}
    .WorkPlaceAreaLR .WorkPlaceAreaL .SubTitle{ font-size: 23px; line-height: 43px;}
    .WorkPlaceAreaLR .WorkPlaceAreaL .Captions{ font-size: 16px;}
    .WorkPlaceAreaLR .WorkPlaceAreaR{ width: 100%; padding-top: 30px; padding-bottom: 40px;}
    .WorkPlaceAreaLR .WorkPlaceAreaR .TagsPicture{ font-size: 16px;}

    .RecruitmentList .TagsCat{ font-size: 12px; }
    .RecruitmentList .Title{ font-size: 18px;}
    .RecruitmentList .Description{ line-height: 25px;}
    .RecruitmentList .Salary{ font-size: 17px;}
    .accordion-item{ padding: 30px 30px 0 30px; }
    .RecruitmentList .HeaderApply{ padding-right: 25px;}
    .DRows .DRowsTitle{ font-size: 18px;}
    .DRows .DRowsDetail{ font-size: 15px; line-height: 30px; }

    .RecruitDetailPopup{ width: 100%; }
    .RecruitDetailPopup .Title{ font-size: 18px;}
    .RecruitDetailPopup{ padding: 30px;}
    .RecruitDetailPopup .DRows{ margin: 0 0 5px 0;}
    .RecruitDetailPopup .ClosePopup{ margin-left: 0; right: 10%;}
    .RecruitDetailPopup .HeaderBox p{ font-size: 26px;}
    .RecruitDetailPopup .HeaderBox h2{ font-size: 18px;}
    .RecruitDetailPopup .ClosePopup img{ width: 24px;}

    .SlideOurExpertise .slide.active .LRBox .FlagLeft{ min-width: 70px; width: 70px; height: auto; }
    .LRBox .FlagLeft{ min-width: 50px; width: 50px; height: auto; }
    .SlideOurExpertise .arrow img{ max-width: 80px;}
    .LRBox .FlagRight .Descriptions{ font-size: 13px;}
    .SlideOurExpertise .slide{ margin: 10px 0; padding: 15px;}
    .BTNViewmoreBlue{ margin-top: 100px;}
    .SlideOurExpertise .slider{ width: 45%;}

}

/* -------------------------------------  640px  ------------------------------------- */
@media(max-width:640px)
{
    /* Footer */
    footer .FooterBox{ padding: 50px 0; display: block; }
    footer .FooterBox .FooterBoxLeft{ max-width: 100%; text-align: left; }
    footer .FooterBox .FooterBoxRight{ max-width: 100%; text-align: center; margin-top: 20px; }
    footer .FooterBox .FooterBoxRight p{ margin-bottom: 0;}
    footer .CopyRightBox .PrivacyPolicyLink{ position: relative; padding-bottom: 10px;}
    footer .CopyRightBox .CR span{ display: block;}

    .HeaderBox p{ font-size: 20px;}
    .HeaderBox h2{ font-size: 30px;}

    .OutlineList{ padding-top: 20px; padding-bottom: 20px; }
    .OutlineList .RowsList p:nth-child(1){ min-width: 130px; max-width: 130px; font-size: 15px; margin: 0; padding: 8px 0 8px 0;  }
    .OutlineList .RowsList p:nth-child(2){ width: calc(100% - 130px); font-size: 15px; }

    .GoogleMap .YoutubeIframe{ padding-bottom: 70%; }

    .OurVisionBox .HeaderBox p { font-size: 55px; }
    .OurVisionBox .HeaderBox h2 { font-size: 20px; }

    /* TopKV */
    .TopKV h1{ font-size: 16px; }
    .TopKV img{ max-width: 60px; }

    /* CaptionTP */
    .CaptionTP{ font-size: 20px; line-height: 40px; }

    .NewsBoxList .parent-div h3 .HeaderNews .Title{ padding-right: 60px; padding-left: 0px; font-size: 18px;}
    .NewsBoxList .parent-div h3 .HeaderNews{ display: block;}
    .NewsBoxList .parent-div h3 .HeaderNews .Country { text-align: left; font-size: 16px; }


    .container_ProundAchievement1 .HeaderBox p{ font-size: 55px; }
    .container_ProundAchievement1 .HeaderBox h2{ font-size: 20px;  }
    .container_ProundAchievement1 .HeaderBox{ padding-bottom: 20px;}
    .ProundAchievement1 .Box2{ padding-top: 0; }
    .ProundAchievement1 .Box2 .Title{ font-size: 24px;}

     
    .SectionTypeArea .HeaderBox p{ font-size: 50px; }
    .SectionTypeArea .HeaderBox h2{ font-size: 18px;  }
    .SectionTypeInfo .Captions{ padding-left: 30px; font-size: 20px; }
    .SectionTypeInfo .LogoT{ width: 110px; height: 110px;}
    .Type01{ background-position: center left 55%; border-left: 40px solid #003ba0;}
    .SectionTypeInfo .Captions br{ display: none;}
    .SectionTypeInfo .CaptionsLarge{ font-size: 20px;}
    .SectionLRBox .SectionRBox p.Title{ line-height: 45px; }
    .SectionLRBox{ padding: 50px 0;}

    .SliderTreeType .slick-next{ right: 38%; }
    .SliderTreeType .slick-prev{ left: 38%;  }

    /*.TopHeaderBox{ height: 200px;}
    .TopHeaderBox .Title{ font-size: 20px; }
    .TopHeaderBox img{ max-width: 180px;}
    .TopHeader{ background-position: center right -260px; }*/

    /*.TopHeaderBox{ height: 200px; }
    .TopHeaderBox .LeftT{ height: 200px; }*/
    .TopHeaderBox .CenterT{ /*height: 200px;*/ width: 60%; padding-right: 10px; z-index: 1; }
    .TopHeaderBox .CenterT::after{ clip-path: polygon(0 100%, 0 0, 80% 0); }
    .TopHeaderBox img{ margin-bottom: -20px; }
    /*.TopHeaderBox .CenterT::before{ height: 200px;  }
    .TopHeaderBox .CenterT::after{ height: 200px; }*/
    .TopHeaderBox .RightT{ /*height: 200px;*/ z-index: 0; } 
    .TopHeaderBox .Title{ font-size: 20px; }
    .TopHeaderBox img{ max-width: 160px;}

    .TopBreadcrumbsBox .Inners li{ font-size: 14px;}
    .TopBreadcrumbsBox .Inners li:after{ top: 5px; }

    .MessageArea .MessageAreaBox h1{ font-size: 26px; }
    .MessageAreaLR{ display: block; }
    .MessageAreaLR .MessageAreaL{ width: 100%; }
    .MessageAreaLR .MessageAreaR{ width: 100%; }

    .RecruitmentList .accordion-heading{ display: block;}
    .RecruitmentList .TagsCat{ margin: auto; font-size: 12px; margin-top: 15px; }
    .RecruitmentList .Title{ font-size: 18px;}
    .RecruitmentList .Description{ line-height: 25px;}
    .RecruitmentList .Salary{ font-size: 17px;}
    .accordion-item{ padding: 30px 30px 0 30px; }
    .RecruitmentList .HeaderApply{ width: 100%; padding-right: 0px;}
    .DRows{ display: block; }
    .DRows .DRowsTitle{ font-size: 18px;}
    .DRows .DRowsDetail{ font-size: 15px; line-height: 30px; margin-left: 0; margin-top: 5px; }

    .SlideOurExpertise .slider-wrapper { display: block; margin-top: 0px;}
    .SlideOurExpertise .map { width: 100%; display: none;}
    .SlideOurExpertise .slider { width: 90%; margin: auto; }
    .SlideOurExpertise .slide{ margin: 20px 0; height: auto;}
    .BTNViewmoreBlue{ margin-top: 50px;}
    
    .NewsBoxList .accordion-body{ display: none; padding: 25px 25px 25px 0px;  }

    .TopKV:before{ left: -5%; top: 50%; width: 210px; height: 2px; }
    .TopKV:after{ right: -5.3%; top: 50%; width: 210px; height: 2px; }
    .TopKV h1:before{ left: -110px; top: -60px; width: 200px;  height: 200px; }

}



/* -------------------------------------  480px  ------------------------------------- */
@media(max-width:480px)
{
    .OurVisionDetail{ padding-top: 30px;}
    .OurVisionDetail .Title{ font-size: 25px; }
    .OurVisionDetail .Descriptions { margin-top: 80px; font-size: 18px; line-height: 35px; }
    
    /* TopKV */
    .TopKV h1{ font-size: 25px; }
    .TopKV span{ display: block; }
    .TopKV img{ max-width: 60px; }

    .SectionTypeArea{ padding: 50px 0;}
    .SectionTypeArea .HeaderBox{ padding-bottom: 20px;}
    .SectionTypeArea .HeaderBox p{ font-size: 30px; }
    .SectionTypeArea .HeaderBox h2{ font-size: 16px;  }
    .SectionTypeInfo .Captions{ padding-left: 20px; font-size: 16px; }
    .SectionTypeInfo .LogoT{ width: 100px; height: 100px;}
    .Type01{ background-position: center left 55%; border-left: 40px solid #003ba0;}
    .SectionLRBox .SectionLBox .PicL{ max-width: 250px!important; }

    .SliderTreeType .slick-slider .slick-slide.slick-current .InnerBox .Picture, .SliderTreeType .slick-slider .slick-slide.slick-center .InnerBox .Picture{ height: 200px!important;}
    .SliderTreeType .slick-slider .slick-slide.slick-current .Description, .SliderTreeType .slick-slider .slick-slide.slick-center .Description{ font-size: 12px;}
    .SliderTreeType .slick-slider .slick-slide { margin: 15px; }
    .SliderTreeType .InnerBox .Picture{ height: 200px; }
    .SliderTreeType .Description{ padding: 0 20px 15px 20px; font-size: 12px; }
    .SliderTreeType .slick-next{ right: 32%; }
    .SliderTreeType .slick-prev{ left: 32%;  }
    .BTNViewmore a{ padding: 15px 30px; }

    /* KVSlide */
    .KVSlide ul li{ height: 250px;}
    .KVSlide ul li:nth-child(1) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(2) .Title p{ padding: 40px 20px; font-size: 35px; }
    .KVSlide ul li:nth-child(3) .Title p{ padding: 40px 20px; font-size: 30px; letter-spacing: 4px; }

    .MapSlide{ padding: 0 0 100px 0;}
    .MapSubject{ position: relative; max-width: 90%; margin: auto;}
    .MapSlide .HeaderBox h2{ font-size: 19px;}
    .MapSlideLR .MapSlideLRRight{ padding-top: 0;}
    .BTNViewmoreBlue a{ padding: 15px 30px; }
    /*.LRBox .FlagRight .Descriptions{ display: block; }*/
    .LRBox .FlagRight .Descriptions{ font-size: 14px;}
    .LRBox .FlagLeft img{ border: 2px solid #fff; border-radius: 5px; }
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active{ background-color: #fff; color: #3e3a39;}
    .MapSlideLR .MapSlideLRRight .MapSlideList ul li.active .LRBox .FlagRight .Country{ color: #003ba0; }

    .MessageArea .MessageAreaBox h1{ font-size: 20px; line-height: 41px; }
    .MessageAreaLR{ display: block; }
    .MessageAreaLR .MessageAreaL{ width: 100%; }
    .MessageAreaLR .MessageAreaR{ width: 100%; margin-top: 30px; }
    .SlideOurExpertise .slides { height: 450px; }
    .SlideOurExpertise .slide.active .LRBox .FlagRight{ padding-left: 10px;}

    .TopHeaderBox .Title{ font-size: 19px; }

    .Page404 h1{ font-size: 26px!important; }
    
}