﻿/* @font-face {
  font-family: 'Prompt-Regular';
  src: url('../fonts/Prompt-Regular.eot?#iefix') format('embedded-opentype'),  url('../fonts/Prompt-Regular.woff') format('woff'), url('../fonts/Prompt-Regular.ttf')  format('truetype'), url('../fonts/Prompt-Regular.svg#Prompt-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
} */

/* html{ font-size:62.5%;} */
/* body{ font-size: 1.4em; font-family: 'Prompt-Regular'; font-weight: normal; font-style: normal;} */
/* a, button{ transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in; text-decoration: none;}
img { max-width: 100%; width: 100%; outline: 0; height: auto;}
figure{ margin: 0;}
p{ margin: 0;}
h1, h2, h3, h4, h5, h6{ margin-top: 0; line-height: 1.4; font-weight: normal; margin-bottom: 0; color: #555; white-space: initial;} */
body *:is(h1, h2, h3, h4, h5, h6) {
	font-family: "DB-HeaventRounded" !important;
}
.label-cursor{ font-weight: normal; cursor: pointer; margin-bottom: 0;}
.modal-content{ border: 0; border: 0 rgba(0,0,0,0);}

.grayscale{ -webkit-filter: grayscale(50%); filter: grayscale(50%);}
/*.height-search{ height: 32.6px;}*/
.width-search{ width: 90%;}

@media (max-width: 480px){
	.height-search{ height: auto;}
}

/*แจ้งเตือนตรงโปรไฟล์ว่ามีอะไรมาใหม่*/
.circle-red{ position: absolute; top: -5px; z-index: 99; right: 5px; font-size: var(--font12); background: #d40101; border-radius: 50%; min-width: 20px; padding: 4px; 
	color: #fff; text-align: center;}

@media (max-width:767px){
	.circle-red{ right: 15px;}
}

.overflow-hidden{ overflow: hidden;}
.display-inline{ display: inline-block;}
.jobbkk-mobile{ display: none;}
.float-l{ float: left;} .float-r{ float: right;}
.margin-top{ margin-top: 20px;} .margin-top-4{ margin-top: 40px;} .margin-bottom{ margin-bottom: 20px;} .margin-bottom-1{ margin-bottom: 10px;} 
.margin-bottom-4{ margin-bottom: 40px;}
.margin-bottom-6{ margin-bottom: 60px;}

@media (max-width:576px){
	.margin-bottom-4, .margin-bottom-6{ margin-bottom: 20px;}
}

.border-bottom{ border-bottom: 1px solid #D40101; display: inline-block;} .border-bottom-grey{ border-bottom: 1px solid #ebebeb;}
.border-top{ border-top: 1px solid #ebebeb;}
.text-align-c{ text-align: center;}
.pagination{ font-size: var(--font18); margin-top: 0;}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{ background: #d40101; color: #fff; border: 1px solid #d40101;}
.pagination>li>a, .pagination>li>span{ color: #555;}
.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, 
.pagination>li>span:hover{ background: #d40101; color: #fff;}

@media (max-width:576px){
	.pagination{ font-size: var(--font22);}
}

@media (max-width:380px){
	.pagination{ font-size: var(--font18);}
}

@media (max-width:767px){
	.jobbkk-pc{ display: none;}
	.jobbkk-mobile{ display: block;}
}

/*สี background*/
.bg-whtie{ background: #FFFFFF;}
.bg-red{ background: #D40101;}
.bg-grey-young{ background: #ebebeb;}
.bg-black{ background: #000000;}
.bg-gray{ background: #ebebeb;}

/*สีfont*/
.text-white{ color: #FFFFFF;}
.text-red{ color: #D40101;}
.text-blue{ color: #3680BC;}
.text-black{ color: #555;}

/*popup เข้าสู่ระบบ ผู้สมัครงาน ผู้ประกอบการ*/
.modal-content{ border-radius: 7px;}
.login-header{ border-radius: 6px 6px 0 0; background: #D40101;}
.close-login{ font-size: var(--font30); color: #FFFFFF; opacity: 0.5;}
.text-login{ color: #FFFFFF; text-align: center;}
.enter-name{ font-size: var(--font14); text-align: center;}
/*.fade.in{ z-index: 9999;}
.modal-open .modal{ z-index: 10001;} */

ul.checkbox-forget{ margin: 0; padding: 0; list-style: none; overflow: hidden; text-align: center;}
ul.checkbox-forget li{ font-size: var(--font14); padding: 0 15px; display: inline-block;}

button.enter-register{ border-radius: 10px; padding: 10px; background: #D40101; border:1px solid #D40101; color: #FFFFFF; text-decoration: none; display: block; 
	text-align: center; width: 100%; transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; 
	-ms-transition:all 0.3s ease-in;}
button.enter-register:hover{ background: #eee; color: #d30102; border:1px solid #eee;}
.enter-register a{ border-radius: 10px; background: #D40101; color: #FFFFFF; padding: 10px; text-decoration: none; display: block; text-align: center;}
.enter-register a:hover{ background: #eee; color: #d30102;}

.register-member a{ border-radius: 10px; padding: 10px; border: 1px solid #D40101; background: #FFFFFF; color: #D40101; text-decoration: none; display: block; 
	text-align: center;}
.register-member a:hover{ background: #eee; color: #D40101; border: 1px solid #eee;}

.jobbkk-line{ border-right: 1px solid #ebebeb;}
.social-enter a{ display: block; text-decoration: none; color: #555; padding: 8px; border-radius: 10px; border:1px solid #555; text-align: center; 
	margin-bottom: 20px; background: #FFFFFF;}
.social-enter a i{ font-size: var(--font22); }

.social-enter a:hover i.color-fb, .social-enter a:hover i.color-gplus, .social-enter a:hover i.color-linkedin{ color: #FFFFFF;}
.social-enter a i.color-fb{ color: #4267b2;}
.social-enter a.fb:hover{ background: #4267b2; color: #FFFFFF; border: 1px solid #4267b2;}

.social-enter a i.color-gplus{ color: #db4437;}
.social-enter a.gplus:hover{ background: #db4437; color: #FFFFFF; border: 1px solid #db4437;}

.social-enter a i.color-linkedin{ color: #287bbc;}
.social-enter a.linkedin:hover{ background: #287bbc; color: #FFFFFF; border: 1px solid #287bbc;}

.jobbkk-border-regis{ border-right: 1px solid #ebebeb;}
.jobbkk-alert .alert-name{ border-radius: 10px; border: 1px solid #D40101; color: #D40101; padding: 15px; text-align: center;}
.alert-name h5{ color: #D40101;}

@media (max-width: 767px){
	.modal-content{ margin-top: 0;}
}

@media (min-width: 767px){
	.modal-dialog { width: 750px;}
}

/*fix menu*/
.fix-top{ position: fixed; top: 0; left: 0; right:0; z-index: 1001; width: 100%;}

/*logo-login*/
.jobbkk-logo-login-1{ padding: 10px 0; display: inline-block; width: 100%;}
.jobbkk-logo-login{ padding:10px 0; width: 100%; align-items: center; display: flex}
.logo-jobbkk{ float: left;}
.login-flag{ float: right;}

.logo-jobbkk{ margin-top: 5px;}
.logo-jobbkk img{ max-width: 250px;}
.logo-jobbkk a{ display: block; text-decoration: none;}
.logo-jobbkk .text-logo{ font-size: var(--font14);}

.jobbkk-logo-mobile{ text-align: center;}
.jobbkk-logo-mobile img{ max-width: 100px;}

@media (max-width:767px){
	.jobbkk-logo-mobile{ margin-top: 12px;}
}

@media (max-width:400px){
	.jobbkk-logo-mobile{ margin-top: 8px;}
}

/*เปลี่ยนภาษา pc ล็อคอินผู้สมัครงาน ผู้ประกอบการ*/
.login-flag ul{ margin: 7px 0 0; padding: 0; list-style-type: none;}
.login-flag ul li{ float: left; margin: 0 5px;}
.login-flag ul li.dropdown-flag{ margin-top: 0;}
.login-flag ul li a{ display: block; color: #D40101; padding: 5px 10px; text-decoration: none; border-radius: 10px; border: 1px solid #D40101; background: #FFFFFF;}
.login-flag ul li a:hover{ background: #d30102; color: #FFFFFF;}
.login-flag ul li a.bg-red{ background: #D40101; color: #FFFFFF; border-radius: 10px;}
.login-flag ul li a.bg-red:hover{ background: #eee; color: #D40101; border: 1px solid #eee;}
.login-flag ul li a.jobbkk-flag{ border:0; border-left: 1px solid #bfbfbf; border-radius: 0; padding-right: 0; background: 0;}
.login-flag ul li.dropdown-flag a{ color: #555;}
.login-flag ul li ul.dropdown-menu li a{ background:0;}
.login-flag ul li ul.dropdown-menu li a:hover{ background: #ebebeb;}

.login-flag ul.dropdown-menu{ min-width: 100%; left: 0; z-index: 10000; font-size: var(--font12);}
.login-flag ul.dropdown-menu li{ float: none;}
.login-flag ul.dropdown-menu li a{ border:0; border-radius: 0; color: #000000;}

/*menu-pc*/
.navbar{ margin-bottom: 0; border: 0; border-radius: 0;}
.nav ul.jobbkk-dropdown li a{ color: #000000;}

.jobbkk-menu ul li.main-menu a:hover{ color: #D40101;}
.navbar ul.navbar-nav{ width: 100%; display: flex; text-align:center; white-space: nowrap;}
.navbar ul.navbar-nav li.main-menu{ width: 12.5%; text-align: center; float: left;}
.navbar ul.navbar-nav li a{ color: #FFFFFF;}
.navbar ul.navbar-nav li a:hover, .navbar ul.navbar-nav li a:focus, .navbar ul.navbar-nav li a:active{ color: #D40101;}
.navbar-nav ul.dropdown-menu li a{ color: #000000;}
.navbar-nav>li>.dropdown-menu{ border-radius: 4px;}
.navbar-nav .dropdown-menu{ min-width: 100%;}
.navbar .dropdown-menu>li>a:hover{ background: #ebebeb;}
.dropdown-submenu { position:relative;}
.dropdown-submenu>.dropdown-menu { top:0; left:100%; margin-top:-6px; margin-left:-1px;}
.dropdown-submenu > a:after { border-color: transparent transparent transparent #333; border-style: solid; border-width: 5px 0 5px 5px; content: " "; 
	display: block; float: right; height: 0; margin-right: -10px; margin-top: 5px; width: 0;}
.dropdown-submenu:hover>a:after { border-left-color:#555;}
.dropdown-menu > li > a:hover, .dropdown-menu > .active > a:hover { text-decoration: none;}

/*carousel*/
.carousel-control.left, .carousel-control.right{ background-image: -webkit-linear-gradient(left,rgba(0,0,0,.000) 0,rgba(0,0,0,0) 100%);
    background-image: -o-linear-gradient(left,rgba(0,0,0,.0000) 0,rgba(0,0,0,.0) 100%); background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.000)),to(rgba(0,0,0,0))); background-image: linear-gradient(to right,rgba(0,0,0,.000) 0,rgba(0,0,0,.0) 100%);}
.carousel-indicators .active{ opacity: 0.5;}

@media (min-width: 767px) {
  ul.nav li:hover > ul.dropdown-menu {display: block;}
} 

@media (max-width:1452px){
	.login-flag ul li, .navbar ul.navbar-nav li.main-menu, .navbar ul.navbar-nav li.main-menu a{font-size: var(--font12);}
}

@media (max-width:1170px){
	.navbar ul.navbar-nav li.main-menu{ white-space: normal; display: flex;}
}

/*menu-mobile*/
.jobbkk-mobile{ box-shadow: 0 6px 12px rgba(0,0,0,.175); -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);}
.slide-menu{ z-index: 99999; overflow-y: scroll; padding-bottom: 9999px !important;}
.slide-menu ul li a.menu-mobile img{ max-width: 30px; margin-right: 5px;}
.row-register{ margin-top: 17px; text-align: right;}
.row-register ul{ margin: 0 -10px; padding: 0; list-style: none;}
.row-register ul li{ padding: 0 10px;}
.row-register ul li ul.dropdown-menu-mobile{ left: 0; min-width: 100%;}
.row-register ul li ul.dropdown-menu-mobile li{ float: none; text-align: left;}
.row-register ul li a{ border-radius: 10px; border: 1px solid #D40101; background: #D40101; padding: 3px 7px; color: #FFFFFF; text-decoration: none;}
.row-register ul li a.register{ border-radius: 10px; border: 1px solid #D40101; background: #FFFFFF; color: #D40101; display: inline-block; text-align: center;}

@media (max-width:767px){
	.row-register{ margin-top: 15px;}
}

@media (max-width:576px){
	.row-register{ margin-top: 16px;}
	.row-register ul li a.register{ font-size: var(--font12);}
}

@media (max-width:380px){
	.row-register{ margin-top: 10px;}
	.row-register ul li ul.dropdown-menu-mobile{ left: -30px;}
	main .btn{ padding:8px 12px;}
}

@media (max-width:330px){
	.row-register{ margin-top: 11px;}
	main .btn{ padding:6px 10px;}
}

ul.dropdown-menu-mobile{ margin-top: 10px; left: -100%; }
ul.dropdown-menu-mobile li a{ border:0; border-radius: 0; color: #000000; background: #FFFFFF;}

/*เปลี่ยนภาษา มือถือ*/
.controls .flag{ border: 0; border-left: 1px solid #bfbfbf; background: transparent; color: #555;}
.controls .flag.nonborder{ border-left: 0;}



/*หัว content และ ปุ่มอ่านต่อ*/
.jobkk-read{ text-align: right; margin-top: 10px;}
a.read-more{ font-size: var(--font12); background: #FFFFFF; border: 1px solid #d30102; color: #D40101; padding: 10px; text-decoration: none; display: inline-block;
	text-align: center; border-radius: 4px; transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
a.read-more:hover{ background: #D40101; color: #FFFFFF;}

@media (max-width:991px){
	.jobkk-read{ padding-top: 5px;}
}

@media (max-width:576px){
	.jobbkk-head h1{ font-size: var(--font22); }
	a.read-more{ padding: 5px;}
	.jobkk-read{ margin-top: 5px; padding-top: inherit;}
}

/*premium company*/
.logo-company{ border-radius: 10px; text-align: center; padding: 10px; margin: 1px; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
    -o-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.logo-company:hover{ -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2); -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2); -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);}
.logo-company img { max-width: 100%;}

/*ขนาดแบบที่คิดว่าสมดุล หากกล้าไม่ชอบ ให้ใช้อันล่าง*/
@media (max-width:1170px){
	.row-jobbkk{ margin-right: 0; margin-left: 0;}
	.premium-company{ display: flex; white-space: nowrap; overflow-x: scroll;}
	.jobbkk-logo-company{ min-width: 28%; padding-bottom: 15px; padding-left: 0;}
}

@media (max-width:768px){
	.jobbkk-logo-company{ min-width: 35%;}
}

@media (max-width:576px){
	.jobbkk-logo-company{ min-width: 60%;}
}

@media (max-width:380px){
	.jobbkk-logo-company{ min-width: 70%;}
}

/*แนะนำ*/
.sell-ad{ position: relative; z-index: 99;}
.sell-ad .position-ad{ position: absolute; top: 0; right: 0; background: #f47920; padding: 10px 5px 15px; border-radius: 0 4px 0 0;  
	text-align: center; width: 40px; height: auto;}
.sell-ad .position-ad:after{ content: ""; width: 0; height: 0; left: 0; bottom: -10px; border-style: solid; position: absolute; border-width: 10px 20px 10px; 
	border-color: transparent #f47920;}
.sell-ad .position-ad h6{ font-size: var(--font12); color: #ffffff; white-space: initial;}

.jobbkk-worktab{ border: 0; width: 100%;}
.nav-tabs>li{ border: 1px solid #bfbfbf; border-left: 0;}
.nav-tabs>li:first-child{ border-left: 1px solid #bfbfbf;}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{ color: #FFFFFF; border: 1px solid #D40101; border-bottom-color: transparent;
	background-color: #D40101;}
.nav-tabs>li>a{ border-radius: 0; color: #898989; margin-right:0; padding: 15px;}

@media (max-width:991px){
	.nav-tabs>li{ min-width: 30%; text-align: center;}
	.jobbkk-worktab{ display: flex; white-space: nowrap; overflow-x: scroll; padding-bottom: 10px;}
}

@media (max-width:767px){
	.nav-tabs>li{ min-width: 45%;}
}

@media (max-width:576px){
	.nav-tabs>li{ min-width: 70%;}
	.nav-tabs>li>a{ padding: 10px 0;}
}

/*ตัดคำ*/
div.example:after { content: ''; display: block; clear: both;}
div.box { height: 40px; overflow: hidden;}

/*content ตำแหน่งงานใหม่ และ หางานตามภาค*/
.jobbkk-content a{ color: #000000; text-decoration: none; display: block;}
/*.block-content{ border: 1px solid #bfbfbf; border-radius: 10px; padding:10px;}
.block-content-1{  border: 1px solid #bfbfbf; border-radius: 10px 10px 0 0; border-bottom: 0;}
.text-content-1{ background: #f6f3f2; border: 1px solid #bfbfbf; padding: 10px; border-radius: 0 0 10px 10px; border-top: 0;}*/

.block-content{ border-radius: 10px; padding:10px; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
    -o-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.block-content-1{ border-radius: 10px 10px 0 0; border-bottom: 0; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
    -o-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.text-content-1{ background: #f6f3f2; padding: 10px; border-radius: 0 0 10px 10px; border-top: 0; -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2); 
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.2); -o-box-shadow: 0 0 5px rgba(0,0,0,0.2); box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}

.block-blur{ margin: 1px; display: block;}
.block-blur:hover{ -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.1); -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.1); -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.1);
	box-shadow: 0 1px 10px 1px rgba(0,0,0,0.1); border-radius: 10px;}
.block-content-business{ margin: 1px 1px;}

.pic-content{ margin-bottom: 10px;}
.pic-content img{ width: 100%; height: 150px; object-fit: cover;}

.jobbkk-pic-content{ text-align: center; height: 180px; position: relative;}
.jobbkk-pic-content .jobbkk-pic-absolute{ max-height: 100%;}
.jobbkk-pic-content img{ max-width: 100%; height: 100%; object-fit: scale-down; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px;}

.jobbkk-pic-content-cus{ height: 120px;}

@media (max-width:1199px){
	.jobbkk-pic-content{ height: 160px;}
	.jobbkk-pic-content-cus{ height: 100px;}
}

@media (max-width:1170px){
	.jobbkk-pic-content-cus{ height: 120px;}
}

/*บริษัทแนะนำ*/
.company-re img{ max-width: 100%; height: 120px; object-fit: scale-down;}

@media (max-width:1170px){
	.jobbkk-company-re{ min-width: 22%;}
}

@media (max-width:991px){
	.jobbkk-company-re{ min-width: 28%;}
}

@media (max-width:767px){
	.jobbkk-company-re{ min-width: 30%;}
}

@media (max-width:576px){
	.jobbkk-company-re{ min-width: 40%;}
}

@media (max-width:480px){
	.jobbkk-company-re{ min-width: 45%;}
}

@media (max-width:380px){
	.jobbkk-company-re{ min-width: 60%;}
}

@media (max-width:320px){
	.jobbkk-company-re{ min-width: 70%;}
}

@media (max-width:1170px){
	.row-jobbkk-content{ margin-right: 0; margin-left: 0; margin-right: -15px\0/; margin-left: 0\0/;}
	.block-jobbkk-content{ display: flex; white-space: nowrap; overflow-x: scroll; margin-right: 0\0/;}
	.jobbkk-content{ min-width: 22%; padding-bottom: 15px; padding-left: 0; min-width: 33.333333333%\0/;}
}

@media (max-width:991px){
	.jobbkk-content{ min-width: 30%;}
	.jobbkk-pic-content{ height: 120px;}
	.jobbkk-pic-content img{ max-height: 120px;}
	.pic-content img{ height: 120px;}
}

@media (max-width:767px){
	.jobbkk-content{ min-width: 40%;}
}

@media (max-width:576px){
	.jobbkk-content{ min-width: 65%;}
	.jobbkk-pic-content img{ max-width: 100%;}
}

/*rightpage*/
.block-jobbkk-rightpage{ margin-top: 0;}
.jobbkk-head.head-rightpage{ visibility: hidden;}

@media (max-width:1170px){
	.row-jobbkk-content{ margin-right: 0; margin-left: 0;}
	.block-jobbkk-rightpage{ display: flex; white-space: nowrap; overflow-x: scroll;}
	.jobbkk-rightpage{ min-width: 22%; padding-bottom: 15px; padding-left: 0;}
}

@media (max-width:991px){
	.jobbkk-rightpage{ min-width: 30%; padding-bottom: 15px; padding-left: 0;}
}

@media (max-width:767px){
	.jobbkk-rightpage{ min-width: 40%;}
}

@media (max-width:576px){
	.jobbkk-rightpage{ min-width: 75%;}
}

/*อ่าน content เพิ่มเติม*/
.jobbkk-content a.jobbkk-pluse:hover{ -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);}
.jobbkk-pluse-banner, .jobbkk-pluse-screen-ad{ transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in;
	-moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.jobbkk-pluse-banner:hover{ -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);}
.jobbkk-pluse-screen-ad:hover{ -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);}

@media (max-width:1170px){
	.jobbkk-content a.jobbkk-pluse:hover{ -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}
	.jobbkk-pluse-banner:hover{ -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}
}

.jobbkk-read-content{ text-align: right; overflow: hidden;}
button.read-content{ color: #D40101; background: #FFFFFF; border: 1px solid #D40101; border-radius: 10px; padding: 0 10px; display: inline-block;
	transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
button.read-content:hover{ background: #D40101; color: #FFFFFF;}

/*อ่าน content อันใหญ่*/
.block-jobbkk-content-big{ width: 100%;}
div.box-8 { height: 130px; overflow: hidden;}

.block-jobbkk-content-big{ width: 100%;}
.pic-content.pic-content-big img{ width: 100%; height: 244px; object-fit: cover;}

/*ใช้ตอน content มากกว่า6 เป็นตัวซ่อน content บุคคลแรงบันดาจใจ และ hr society*/
/*.display-pc{ display: block;}
.display-mobile{ display: none;}*/

.human-favorite, .hr-society{ display: none;}

/*ใช้ตอน content มากกว่า6*/
@media (max-width:1170px){
	/*.display-pc{ display: none;}
	.display-mobile{ display: block;}*/
	.block-jobbkk-content-big{ display: flex; white-space: nowrap; overflow-x: scroll;}
	.block-jobbkk-content-big .jobbkk-content{ min-width: 40%;}
}

/*life style*/
@media (max-width:1170px){
	.row-jobbkk-content{ margin-right: 0; margin-left: 0;}
	.block-jobbkk-lifestyle{ display: flex; white-space: nowrap; overflow-x: scroll;}
	.jobbkk-content{ min-width: 22%; padding-bottom: 15px; padding-left: 0;}
}

@media (max-width:991px){
	.jobbkk-content{ min-width: 28%; padding-bottom: 15px; padding-left: 0;}
}

@media (max-width:767px){
	.jobbkk-content{ min-width: 30%;}
}

@media (max-width:576px){
	.jobbkk-content{ min-width: 40%;}
}

@media (max-width:480px){
	.jobbkk-content{ min-width: 45%;}
}

@media (max-width:380px){
	.jobbkk-content{ min-width: 60%;}
}

@media (max-width:320px){
	.jobbkk-content{ min-width: 70%;}
}

/*express หางานด่วน*/
@media (max-width:1170px){
	.block-jobbkk-express{ display: flex; white-space: nowrap; overflow-x: scroll; margin-right: 0\0/;}
	.jobbkk-content{ margin-bottom: 0;}
}

/*express partner มหาวิทยาลัย*/
@media (max-width:1170px){
	.block-jobbkk-university{ display: flex; white-space: nowrap; overflow-x: scroll; margin-right: 0\0/;}
}

/*หางานตามสาขาอาชีพ*/
.height-career{ height: 300px; overflow-y: scroll;}

@media (max-width:767px){
	.height-career{ height: 250px;}
}

/*Partner มหาวิทยาลัย*/
.university{ text-align: center;}

/*หางานงานตามสาขาอาชีพ*/
.work-career{ color: #D40101; padding: 15px;}
.text-work-career ul{ margin: 0; padding: 0; list-style: none;}
.text-work-career ul li{ padding: 3px 0;}
.text-work-career ul li a{ color: #555;}

.work-area, .about{ color: #D40101; padding: 15px;}
.text-about ul{ margin: 0; padding: 0; list-style: none;}
.text-about ul li{ padding: 3px 0;}
.text-about ul li a{ color: #555;}

@media (max-width:767px){
	.jobbkk-work-area{ display: none;}
}

@media (max-width:576px){
	.text-work-career ul li, .text-about ul li{ font-size: var(--font12); }
}

/*footer*/
.jobbkk-footer, .jobbkk-social{ margin-top: 20px;}
.adress-footer, .customer-footer{ color: #FFFFFF;}

@media (max-width:991px){
	.adress-footer{ margin-bottom: 0;}
}

@media (max-width:576px){
	.logo-footer a img{ max-width: 100px;}
	.adress-footer p, .customer-footer p, .copy-right p{ font-size: var(--font12); }
}

.social ul, .app ul{ margin: 0; padding: 0; list-style: none;}
.social ul li, .app ul li{ float: left; padding: 0 5px;}

/* .social ul li a{ display: block; width: 33px; height: 33px; background-size: cover;}
.social ul li a.icon-fb{ background: url(../images/social-1.png) no-repeat;}
.social ul li a.icon-twis{ background: url(../images/social-2.png) no-repeat;}
.social ul li a.icon-youtube{ background: url(../images/social-3.png) no-repeat;}
.social ul li a.icon-intragram{ background: url(../images/social-4.png) no-repeat;}
.social ul li a.icon-in{ background: url(../images/social-5.png) no-repeat;}
.social ul li a.icon-line{ background: url(../images/social-6.png) no-repeat;}

.social ul li a.icon-fb:hover{ background: url(../images/social-1-1.png) no-repeat;}
.social ul li a.icon-twis:hover{ background: url(../images/social-2-2.png) no-repeat;}
.social ul li a.icon-youtube:hover{ background: url(../images/social-3-3.png) no-repeat;}
.social ul li a.icon-intragram:hover{ background: url(../images/social-4-4.png) no-repeat;}
.social ul li a.icon-in:hover{ background: url(../images/social-5-5.png) no-repeat;}
.social ul li a.icon-line:hover{ background: url(../images/social-6-6.png) no-repeat;} */
.social ul li a img, .app ul li a img{ max-width: 33px; transition: all 0.5s ease-in; -webkit-transition: all 0.5s ease-in;}
.app ul{ margin-top: 3px;}
.app ul li a img{ max-width: 100px;}
.app ul li a img.dbd{ max-width: 60px;}
.app ul li a:hover img{ -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1);}

@media (max-width:991px){
	.head-footer{ text-align: center;}
	.logo-footer img{ max-width: 200px; margin-bottom: 20px;}
	.adress-footer{ margin-bottom: 20px;}
	.social{ text-align: right; padding-right: 0;}
	.social ul{ display: inline-block; float: none;}
	.app{ padding-left: 0; text-align: center;}
}

@media (max-width:767px){
	.social{ text-align: center; padding-right: 15px;}
	.social ul, .app ul{ display: inline-block; float: none;}
	.app{ padding-left: 15px;}
	.app ul{ margin-top: 0;}
}

@media (max-width:335px){
	.app ul li a img{ max-width: 80px;}
	.app ul li a img.dbd{ max-width: 47px;}
}

.copy-right p{ text-align: center; padding: 15px; color: #ffffff;}
.copy-right p span{ margin-left: 10px;}
.copy-right p span a img{ max-width: 15px;}

/*backTOtop*/
.cd-top { display: inline-block; height: 40px; width: 40px; position: fixed; bottom: 40px; right: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  overflow: hidden; text-indent: 100%; white-space: nowrap; background: rgba(232, 98, 86, 0.8) url(../images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s; z-index: 99999;}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; 
	-moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s;}
.cd-top.cd-is-visible { /* the button becomes visible */ visibility: visible; opacity: 1;}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: 1}
.no-touch .cd-top:hover { background-color: #e86256; opacity: 1;}

@media only screen and (min-width: 768px) {
  .cd-top { right: 20px; bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top { height: 60px; width: 60px; right: 30px; bottom: 30px;}
}

.swal-button{ padding: 5px 15px; border-radius: 4px; background: #D40101; font-size: var(--font14); border: 1px solid #D40101; text-shadow: none; 
	transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}

.nong-job{ position: absolute; top: 10%; right: 0; left: 20%; margin: 0 auto; text-align: center;}
.nong-job p.head-jb{ font-size: var(--font24); color: #D40101;}
.nong-job p.middle-jb{ background: #D40101; padding: 10px; color: #ffffff; width: 230px; margin: 0 auto; border-radius: 10px;}
.nong-job p.text-jb{ width: 230px; margin: 0 auto; font-size: 12px; margin-top: 10px; color: #555;}

a.custom-service{ color: #FFC600; text-decoration: none;}
.sub-list li a{ padding: 5px 15px; display: block; text-decoration: none;}
.focus-member{ background: #ebebeb;}

/*รูป ล็อคอินผู้ประกอบการ ผู้สมัครงาน*/
.applicant-dropdown{ float: right; margin-top: 0;}
.dropdown-menu-applicant li a{ color: #555;}
.pic-applicant{ margin-top: 4px; border-right: 1px solid #d1d1d1; padding: 0; padding-right: 10px; border-radius: 0; position: relative;}
.pic-applicant:active{ box-shadow: none; -webkit-box-shadow: none;}
.pic-applicant img{ max-width: 35px; height: 35px; border-radius: 50%; border: 1px solid #555; object-fit: cover;}
.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.dropdown-toggle.btn-default.focus, .open>.dropdown-toggle.btn-default:focus, .open>.dropdown-toggle.btn-default:hover{ background-color: transparent;
    border-color: none; box-shadow: none;}
.btn-default.active, .btn-default:active, .open>.dropdown-toggle.btn-default{ background-color: transparent;}
.pic-applicant, .dropdown-flag-1{float: left;}

.dropdown-flag-1{ font-size: var(--font12); margin-top: 12px; padding-left: 10px;}
.dropdown-flag-1 a{ text-decoration: none; color: #555;}
.dropdown-flag-1 ul{ min-width: 100%; right: -100%;}
.dropdown-flag-in li{ text-align: center; font-size: var(--font12);}
.dropdown-flag-in li a{ padding: 3px 5px;}

.dropdown-menu-applicant{ left: -250px; min-width: 100%; right: 0;}
.dropdown-menu-applicant li a{ white-space: normal;}

.pic-in-applicant img{ border-radius: 50%; border: 1px solid #555; max-width: 75px; height: 75px; object-fit: cover;}
ul.sub-text-pic{ margin: 0; padding: 0; list-style: none;}
ul.sub-text-pic li{ color: #555;}
ul.sub-text-pic li.text-pic-img a{ background: #f47920; color: #ffffff; border-radius: 4px; padding: 0 5px; text-decoration: none; 
	display: inline-block; transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
ul.sub-text-pic li.text-pic-img a:hover{ background: #D40101;}

@media (max-width:767px){
	.pic-applicant{ border-right: 0; margin-top: 10px;}
	.pic-in-applicant img{ max-width: 100%;}
}

@media (max-width:576px){
	ul.dropdown-menu-applicant li{ font-size: var(--font12);}
}

@media (max-width:380px){
	.pic-applicant{ margin-top: 5px;}
	.pic-in-applicant img{ max-width: 50px; max-height: 50px;}
	.dropdown-menu-applicant{ left: -200px;}
}

.focus-member{ background: #ebebeb;}

.jobbkk-caret{display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 8px dashed; border-top: 4px solid\9; 
	border-right: 6px solid transparent; border-left: 6px solid transparent;}

/*ปุ่มกระพริบ*/
.sale-wab {
	animation: beat 1s ease infinite alternate; display: inline-block;
}

@keyframes beat {
	from { transform: scale(1); }
	to { transform:  scale(1.1); }
}

.jobbkk-register h2{ font-size: var(--font24);}
.jobbkk-register-social{ text-align: right; margin-top: 5px;}
.jobbkk-share-social ul{ list-style: none; padding: 0;}
.jobbkk-share-social ul li{ display: inline-block; padding: 0 10px 5px;}
.jobbkk-share-social ul li a{ display: block; width: 33px; height: 33px;}
.jobbkk-share-social ul li a.icon-fb{ background: url(../images/social-1-1.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-youtube{ background: url(../images/social-3-3.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-line{ background: url(../images/social-6-6.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-twis{ background: url(../images/social-2-2.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-skype{ background: url(../images/social-7-7.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-intragram{ background: url(../images/social-4-4.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-copylink{ background: url(../images/social-8-8.png) no-repeat; background-size: 100%;}
.jobbkk-share-social ul li a.icon-qrcode{ background: url(../images/code.png) no-repeat; background-size: 100%;}

.cre-resume a{ background: #d40101; padding: 5px 10px; color: #fff; border-radius: 4px;
	display: inline-block; text-decoration: none;}
.cre-resume-right{ text-align: right;}
.cre-resume-right a{ background: #d40101; padding: 5px 10px; color: #fff; border-radius: 4px;
	display: inline-block; text-decoration: none;}
.apply-mail{ text-align: right;}
/*input.table-table[type=checkbox]{ margin-right: 5px;}*/
.th-position{ text-align: center;}

/*บันทึก ยกเลิก*/
.mem-cancel{ text-align: center;}
.mem-cancel ul{ display: inline-block; margin: 0 -10px; padding: 0; list-style: none;}
.mem-cancel ul li{ float: left; padding: 0 10px;}
.mem-cancel ul li button{ background: #d40101; border: 0; color: #fff; border-radius: 4px; padding: 5px 10px;
	transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.mem-cancel ul li:last-child button{ background: #fff; border: 1px solid #bfbfbf; color: #555;}
.mem-cancel ul li button:hover{ background: #ebebeb; color: #555; color: #d40101;}
.mem-cancel ul li:last-child button:hover{ border: 1px solid #ebebeb;}

/*เจาะแบนเนอ*/
.banner-flag{ float: right;}
.job-banner{ float: left; margin-right: 10px; text-align: right;}
.job-banner img{ max-width: 100%; width: auto;}

@media (max-width:1424px){
	.job-banner img{ max-width: 576px;}
}

@media (max-width:1240px){
	.job-banner img{ max-width: 480px;}
}

@media (max-width:1128px){
	.job-banner{ margin-top: 5px;}
	.job-banner img{ max-width: 400px;}
}

/*head pc home*/
.pc-logo img{ width: auto;}
.banner-register{ text-align: right;}
.top-zero{ margin-top: 0;}
.pc-banner a img{ width: auto;}

@media (max-width:991px){
	.top-zero{ margin-top: 0;}
}

.pc-register{ padding-left: 0;}
.register-flag ul{ margin: 0 -10px; padding: 0; list-style: none; display: inline-block;}
.register-flag ul li{ float: left; padding: 0 10px; border-right: 1px solid #bfbfbf;}
.register-flag ul li:last-child{ border-right: 0;}
.register-flag ul li button{ background: #fff; border: 1px solid #bfbfbf; border-radius: 4px; 
	transition: all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;}
.register-flag ul li button.active{ background: #d40101; border: 1px solid #d40101; color: #fff;}
.register-flag ul li button:hover{ background: #ebebeb; color: #d40101; border: 1px solid #ebebeb;}

@media (max-width:1199px){
	.register-flag ul li{ font-size: var(--font12);}
}

@media (max-width:991px){
	.pc-register{ margin-top: 0;}
}

@media (max-width:767px){
	.pc-banner{ margin-bottom: 8px;}
}

.applicant-pro{ left: -10px; margin: 0 auto;}
.applicant-only{ border-right: 0; padding-right: 0; float: none;}
.applicant-only:focus, .applicant-only:hover{ background-color: transparent; border-color: transparent;}

.dropdown-menu li a.active-search{ color: #d40101; background: #ebebeb;}
.controls .flag.active{ background: #d40101; color: #fff; border-radius: 4px;}

.background-id{ background: #ebebeb; padding: 5px; display: inline-block; border-radius: 4px; margin-top: 5px;}

@media (max-width:991px){
	.background-id{ display: none;}
}

/* เมนู user ตรงกลางเว็ป */
.navbarUser{ display: flex; align-items: center; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); z-index: 1;}
.menuUser > ul{ margin: 0 -15px; padding: 0; list-style: none; display: flex; align-items: center; justify-content: center;}
.menuUser ul li{ float: left; text-align: center; position: relative;}
.menuUser ul li a{ color: #555555; display: block; padding: 15px; text-decoration: none;}
.menuUser ul li a:hover, .menuUser ul li a.active{ background: #555555; color: var(--bg-white);}
.menuUser ul.dropdown-menu{ min-width: 250px;}
.menuUser ul.dropdown-menu li{ text-align: left; float: initial;}
.menuUser ul.dropdown-menu li a{ color: var(--bg-black-gray);}
.menuUser button{ background: transparent; border: 0; display: block; transition: 0.5s ease-in-out; padding: 15px;}
.menuUser button:hover{ background: #555; color: var(--bg-white);}

.tabNew{ position: absolute; top: 3px; right: 3px; font-size: var(--font12); border-radius: 4px; background: #d40101; color: #fff; padding: 1px 2px;}

@media (max-width:991px){
	.menuUser ul li a{ font-size:  var(--font14);}
}

.modalApplicant{ display: inline-block;}
.easyResume{ background: var(--bg-gray-young); display: block; padding: 15px; text-align: center; border-radius: 10px;}
.easyResume h2{ font-size: var(--font24); margin-bottom: 15px;}
.easyResume span{ font-weight: 900; color: var(--bg-red);}
.easyResume a{ display: inline-block; padding: 5px 15px; font-size: var(--font24); border-radius: 4px; 
	color: var(--bg-white); background: var(--bg-red);}
.easyResume a:hover{ background: var(--bg-dark-red);}
