html {
	scroll-behavior: smooth;
  }
@font-face {
	font-family: 'Product Sans Regular';
	src: url('../fonts/Product Sans Regular.ttf');
	font-style: normal;
}
@font-face {
	font-family: 'Roboto Bold';
	src: url('../fonts/Roboto-Bold.eot');
	src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/Roboto-Bold.woff2') format('woff2'),
		 url('../fonts/Roboto-Bold.woff') format('woff'),
		 url('../fonts/Roboto-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Roboto Regular';
	src: url('../fonts/Roboto-Regular.eot');
	src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/Roboto-Regular.woff2') format('woff2'),
		 url('../fonts/Roboto-Regular.woff') format('woff'),
		 url('../fonts/Roboto-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat Regular';
	src: url('../fonts/Montserrat-Regular.eot');
	src: url('../fonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/Montserrat-Regular.woff2') format('woff2'),
		 url('../fonts/Montserrat-Regular.woff') format('woff'),
		 url('../fonts/Montserrat-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Times New Roman';
	src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Kanit-Medium';
	src: url('../fonts/Kanit-Medium.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Kanit-Light';
	src: url('../fonts/Kanit-Light.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Esthetique';
	src: url('../fonts/esthetique.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
:focus {
	outline: 0;
	outline-offset: -2px;
}
a:focus {
	outline: 0;
	outline-offset: -2px;
}
body{
	background-color: #000;
}
.rojob3-vmiddle {
	display: inline-block;
	vertical-align: middle;
	float: none;
}
.slick-dots{
	bottom: -60px;
}
.slick-dots li {
	position: relative;
	display: inline-block;
	width: 13px;
	height: 13px;
	margin: 0 7px;
	padding: 0;
	cursor: pointer;
}
.slick-dots li button:before{
	background-color: transparent;
	border: 1px solid #d0000d;
	/*border-radius: 50%;*/
	opacity: 1;
	content: '';
	transform: rotate(45deg);
	width: 13px;
	height: 13px;
}
.slick-dots li.slick-active button:before{
	background-color: #d0000d;
	opacity: 1;
	color: unset;
	/*border-radius: 50%;*/
	transform: rotate(45deg);
}
/*=================================================================== ANI ==================================================================*/
.px-0{
	padding:0px;
}
.menu-16-1 {
    position: absolute;
    bottom: -1vw;
    width: 100%;
    padding: 0 26vw;
    z-index: 2;
    transition: all 0.5s ease; 
    opacity: 1;
    transform: translateY(0);
}

.menu-fixed-top {
    position: fixed !important;
    top: 0;
    bottom: auto;
    left: 0;
    width: 100%;
    z-index: 3;
    background-color: rgba(0,0,0,0.5);
    backdrop-filter: blur(8px);
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.5s ease;
}

/* aktifkan fade + slide */
.menu-fixed-top.active {
    opacity: 1;
    transform: translateY(0);
}
/* Shrink */
.rojob3-hov-shrink {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px transparent;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}
.rojob3-hov-shrink:hover, .rojob3-hov-shrink:focus, .rojob3-hov-shrink:active {
	-webkit-transform: scale(0.97);
	transform: scale(0.97);
}
/* Shrink*/

.error{
	color:#ff4b4b;
}

.hidden-sm{
	display:block;
}
.hidden-lg{
	display:none;
}
@media(max-width: 992px){
	.hidden-sm{
		display:none;
	}	
	.hidden-lg{
		display:block;
	}	
}

.modal-custom{
	background: url(/episode15/assets/images/layout/global/modal-sec1.png) no-repeat center top;
	background-size:100%;
	height:725px;
	padding: 70px 255px 0px;
	color:#1b8ed1;
	box-shadow: none;
    border: unset;
}
.modal-xxl{
	width: 1200px;
}
.modal-custom .modal-header{
	border-bottom:unset;
}
.modal-custom .close{
    color: #2c9fe3;
    opacity: 0.9;
	font-size: 50px;
	font-family: auto;
}
.modal-custom .close:hover{
	opacity:1;
}
.modal-custom .modal-body{
	margin-top: 315px;
    padding: 0px 75px;
}
.modal-custom .x{
	padding-left:0px;
	padding-right: 0px;
	border-left:1px solid #3a6780;
	background:black;
}
.modal-custom .custom-input{
	background:transparent;
	border: unset;
	color: #2c9fe3;
	border-radius: 0px;
}
.modal-custom .custom-input:focus{
	box-shadow: unset;
}
.modal-custom .form-group{
	border:1px solid #3a6780;
	background:black;
	margin-bottom:30px;
}

.modal-custom .error{
    position: absolute;
    padding-left: 0px;
    margin-top: 5px;
    font-size: 13px;
    left: 12px;
}
.modal-custom .btn-submit{
	background: #ff4da9;
    border: 1px solid #2f2c32;
    border-radius: 0px;
    width: 35%;
    font-size: 18px;
	margin-top:5px;
}
.modal-custom .btn-submit:active{
	background: #fc2896;
}
.p-relative{
	position: relative;
}
@media(max-width: 768px){
	.btn{
		white-space: unset;
	}
	.modal-custom{
		background: url(/episode15/assets/images/layout/global/modal-sec1-m.png) no-repeat center top;
		background-size: 100%;
		height: 150vw;
		padding: 6.5vw 0vw;
		background-size: 100%;
		background-position: initial;
	}
	.modal-custom .custom-input{
		padding: 2px 12px;
		height: 30px;
	}
	.modal-custom .form-group {
		margin-bottom: 20px;
	}
	.modal-xxl{
		width: 100%;
		margin: 0px;
	}	
	.modal-custom .close {
		font-size: 10vw;
	}
	.modal-custom .modal-body {
		margin-top: 47vw;
		padding: 0px 8vw;
	}
	.modal-custom .control-label{
		padding:5px 0px 0px;
	}
	.modal-custom .error {
		position: absolute;
		padding-left: 0;
		margin-top: 2px;
		font-size: 12px;
		left: 13px;
	}
	.modal-custom .btn-submit {
		background: #ff4da9;
		border: 1px solid #2f2c32;
		border-radius: 0px;
		width: 50%;
		font-size: 14px;
		margin-top: 0px;
	}
}
/*================================================================= END ANI ==================================================================*/

/*=================================================================== MAINMENU ==================================================================*/
.navbar{
	border: 0;
}
.navbar-nav > li{
	float: unset;
}
.nav > li > a{
	border-top: 1px solid transparent;
	padding: 10px 25px;
}
.navbar-inverse {
	background-color: transparent;
	border-color: transparent;
}
.navbar-fixed-top {
	top: 20px;
	border-width: 0 0 0;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:focus,
.navbar-inverse .navbar-nav > .active > a:hover{
	color: #fff;
	background-color: transparent;
}
.navbar-inverse .navbar-nav > li > a{
	color: #fff;
}
ul.navbar-nav{
	list-style-type: none;
	padding: 0;
	margin: 0;
	width: 100%;
	display: table;
	text-align: center;
	font-family: 'Roboto Regular';
	font-size: 0;
}
ul.navbar-nav li{
	display: inline-table;
	padding: 0 10px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	font-size: 17px;
	min-height: 45px;
}
ul.navbar-nav li:first-child{
	padding-left: 0;
}
ul.navbar-nav li:last-child{
	padding-right: 0;
}
ul.navbar-nav li a:hover,
ul.navbar-nav li.active a {
	color: #fff;
	border-top: 1px solid #a0afc1;
	transition: all .5s;
}
ul.navbar-nav li:last-child a:hover,
ul.navbar-nav li.active:last-child a {
	color: #fff;
	border-top: 1px solid transparent;
	transition: all .5s;
}
ul.navbar-nav li.active a:before,
ul.navbar-nav li a:hover:before{
	content: '';
	position: absolute;
	left: 40%;
	top: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8px 10px 0 10px;
	border-color: #fff transparent transparent transparent;
}
ul.navbar-nav li.active:last-child a:before,
ul.navbar-nav li:last-child a:hover:before{
	content: '';
	position: unset;
	left: unset;
	top: unset;
	width: unset;
	height: unset;
	border-style: unset;
	border-width: unset;
	border-color: unset;
}
.navbar-inverse .navbar-toggle{
	border-color: transparent;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus{
	background-color: transparent;
}
.navbar-toggle {
	position: relative;
	/* float: left; */
	padding: 15px 15px;
	margin-top: 5px;
	margin-right: unset;
	margin-left: 8px;
	margin-bottom: 8px;
	background-color: transparent;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 4px;
}
.navbar-toggle .icon-bar + .icon-bar {
	margin-top: 6px;
}
.navbar-toggle .icon-bar {
	display: block;
	width: 28px;
	height: 3px;
	border-radius: 1px;
}
@media(max-width: 768px){
	.navbar-fixed-top {
		top: 0;
		border-width: 0 0 0;
	}
}
/*================================================================= END MAINMENU ==================================================================*/

/*=================================================================== SIDE NAV ====================================================================*/
div#judulmenu{
	float: left;
	display: block;
	width: 100%;
	background-color: #011f34;
	color: #fff;
}
.rojob3-nav-overlay {
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 1111;
}
.rojob3-nav-sidenav {
	font-family: 'Montserrat Regular';
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 11112;
	top: 0;
	left: 0;
	background-color: #0f829b;
	overflow-x: hidden;
	transition: 0.5s;
	padding-bottom: 20px;
}
#rojob3-nav-judulmenu{
	background-color: #0f829b;
	height: 59px;
	color: #ce8b13;
	margin-bottom: 10px;
}
.rojob3-nav-sidenav a img{
	margin-right: 20px;
	position: relative;
	left: 5px;
}
.rojob3-nav-sidenav #judulmenu span{
	padding: 22px 21px;
	float: left;
	font-size: 14pt;
	width: 100%;
	display: block;
}
.rojob3-nav-sidenav a:hover, .offcanvas a:focus{
	color: #fff;
}
.rojob3-nav-sidenav a.closebtn:hover, .offcanvas a:focus{
	color: #fff;
}
.rojob3-nav-sidenav a.selected, .offcanvas a.selected{
	color: #fff;
}
.rojob3-nav-sidenav a.closebtn {
	color: #fff;
	position: absolute;
	right: 25px;
	font-size: 36px;
	font-weight: bold;
	top: 8px;
}
.rojob3-navbar-mobile{
	list-style-type: none;
	padding-left: 0;
	float: left;
	width: 100%;
}
.rojob3-navbar-mobile li{
	display: block;
	padding-left: 0;
}
.rojob3-navbar-mobile li a{
	padding: 15px 30px;
	text-decoration: none;
	font-size: 12pt;
	color: #fff;
	display: block;
	transition: 0.3s;
}
.rojob3-nav-separator{
	border-left: 1px solid #fff;
	float: left;
	margin: 10px 15px 0 0;
	height: 40px;
	width: 1px;
}
/*================================================================= END SIDE NAV ==================================================================*/

/*====================================================================== SECTION 1 =====================================================================*/
#tab1 .p-relative .nav-tabs{
	/* position: absolute;
    z-index: 99;
    left: 10vw;
    top: 22vw;
    width: 15vw;
	border-bottom:0px; */
	border-bottom:unset;
	padding-right: 4vw;
}
#tab1 .p-relative .nav-tabs .active a{
	/* background-color: #250202; */
	background-image: linear-gradient(#250202, #000000);
	border: 1px solid #f3fbad !important;
}
#tab1 .nav-stacked > li + li {
    margin-top: 0px;
}
#tab1 .p-relative .nav-tabs li a{
    border-radius: 0px;
    color: #8d806e;
    font-size: 1vw;
    font-weight: 600;
	/* background-color: #031328; */
	background-image: linear-gradient(#031b3b, #000000);
	border: 1px solid #f3fbad !important;
	font-family: 'Esthetique';
    letter-spacing: 1.5px;
}
#tab1 .p-relative .nav-tabs a:hover{
	/* background-color: #250202; */
	background-image: linear-gradient(#250202, #000000);
	border: 1px solid #f3fbad !important;
}
#tab1 .p-relative .nav-stacked li{
 text-align: center;
}
#tab3 .p-relative .nav-tabs{
	/* position: absolute;
    z-index: 99;
    left: 10vw;
    top: 22vw;
    width: 15vw;
	border-bottom:0px; */
	border-bottom:unset;
}
#tab3 .p-relative .nav-tabs .active a{
	/* background-color: #250202; */
	background-image: linear-gradient(#250202, #000000);
	border: 1px solid #f3fbad !important;
}
#tab3 .nav-stacked > li + li {
    margin-top: 0px;
}
#tab3 .p-relative .nav-tabs li a{
    border-radius: 0px;
    color: #8d806e;
	font-size: 1vw;
    font-weight: 600;
	/* background-color: #031328; */
	background-image: linear-gradient(#031b3b, #000000);
	border: 1px solid #f3fbad !important;
	font-family: 'Esthetique';
    letter-spacing: 1.5px;
}
#tab3 .p-relative .nav-tabs a:hover{
	/* background-color: #250202; */
	background-image: linear-gradient(#250202, #000000);
	border: 1px solid #f3fbad !important;
}
#tab3 .p-relative .nav-stacked li{
 text-align: center;
}
.rojob3-section1{
	background: url(../images/layout/section1/bg.jpg) no-repeat center top;
	height: 55vw;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	/* padding: 35vw 20.5vw 0vw; */
	padding: 0vw 0vw 0vw;
}
.btn-img-sec1 {
    width: 17vw;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    top: 48vw;
    left: 14vw;
}
.btn-img-sec1:hover {
    transform: scale(1.05);
	filter: grayscale(1);
}
.episode-17{
	background: url(../images/layout/global/bg-all.jpg) repeat center top;
	height: auto;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	padding: 5vw 12vw;
}
.tab1-sec1{
	padding: 0vw 2vw 3vw 5vw;
    width: 100%;
}
.tab2-sec1{
	padding: 0vw 4vw;
	width: 100%;
}
.rojob3-section1 .nav-tabs {
    border-bottom: none !important;
	display: flex;
}
.tab1-sec2{
	background: url(../images/layout/tab1/tab/bg.jpg) no-repeat center top;
	height: auto;
    background-size: 100%;
    position: relative;
    margin: 0 auto;
    padding: 20vw 8vw 12vw;
	/* top:-1vw; */
	/* padding: 35vw 20.5vw 0vw; */
	/* padding: 0vw 0vw 0vw; */
}
.tab3-sec1{
	/* background: url(../images/layout/tab3/bg-tab3-sec1.png) no-repeat center top; */
	background-image: linear-gradient(to bottom, rgb(0 0 0 / 0%), #000000), url(../images/layout/tab3/bg-tab3-sec1.png);
	height: auto;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	padding: 0vw 18vw 5vw;
	/* top:-1vw; */
	/* padding: 35vw 20.5vw 0vw; */
	/* padding: 0vw 0vw 0vw; */
}
.tab3-title-sec1{
	padding: 0vw 6vw;
	width: 100%;
}
.tab3-title-sec2 {
    padding: 0vw 3vw 2vw;
    width: 100%;
}
.tab3-sec1 .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
    width: 25%;
    text-align: center;
	margin-bottom: 5vw;
}
.tab3-sec2{
	background: url(../images/layout/tab3/bg-tab3-sec2-old.jpg) no-repeat center top;
	height: auto;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	padding: 15vw 25vw 5vw;
	/* top:-1vw; */
	/* padding: 35vw 20.5vw 0vw; */
	/* padding: 0vw 0vw 0vw; */
}
.tab3-sec2 .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
    width: 33%;
    text-align: center;
	margin-bottom: 5vw;
}

.rojob3-section1 .btn-abu{
	background-color: #e0e4ff2f;
	border: 1px solid #cfcfcf;
	color: #cfcfcf;
	cursor: no-drop;
}

.rojob3-section1 .btn-blue{
    background-color: transparent;
    /* border: 1px solid #f3fbad; */
    color: #fff;
	text-decoration: unset !important;
}

.rojob3-section1 .btn-blue:hover , .rojob3-section1 .btn-blue:active , .rojob3-section1 .btn-blue:focus{
	background: url(../images/layout/section1/bg-tab.png) no-repeat center top;
    height: 8.5vw;
    background-size: 100%;
	border: unset !important;
	box-shadow: unset !important;
	outline: unset !important;
	filter: hue-rotate(45deg);
	transition: 0.5s;
	/* padding: 1vw; */
}

.rojob3-section1 .btn-pink{
	background-color: #ff70a02f;
	border: 1px solid #f33d80;
	color: #f33d80;
}

.rojob3-section1 .btn-pink:hover , .rojob3-section1 .btn-pink:active , .rojob3-section1 .btn-pink:focus{
	background-color: #f33d80;
	border: 1px solid #f33d80;
	color: white;
}

.rojob3-section1 button{
	width: 100%;
	font-size:1vw;
	padding: 0.3vw 0.5vw;
	font-family: "Product Sans Regular";
	/* word-spacing: 0.25vw; */
    letter-spacing: 0.05vw;
}
.rojob3-section1 .font1{
	font-size: 1vw;
    padding: 0vw 0vw;
    font-weight: 600;
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
	font-family: 'Esthetique';
	filter: drop-shadow(1px 1px 0px black);
	/* margin-top: 1vw; */
}
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: 0vw auto -webkit-focus-ring-color;
    outline-offset: 0vw;
}

.rojob3-section1 .btn-left{
	padding-left:0vw;
	padding-right:0.5vw;
}

.rojob3-section1 .btn-right{
	padding-left:0.5vw;
	padding-right:0vw;
}

.rojob3-section1 .btr-0{
	border-radius:0px;
}

.rojob3-section1 .btl-0{
	border-radius:0px;
}

.rojob3-section1 .mb-2{
	margin-bottom:0.5vw;
}

.rojob3-section1 .p-0{
	padding:0vw;
	flex: 1;
    /* border: solid; */
	background-color: black;
    /* border: 1px solid #f3fbad; */
    /* color: #8f8572; */
	background: url(../images/layout/section1/bg-tab.png) no-repeat center top;
    height: 8.5vw;
    background-size: 100%;
}

.row{
	margin-left:0vw;
	margin-right:0vw;
}
.tab4-sec1{
	/* padding: 0vw 6vw; */
	padding: 0vw 4vw 1vw 9vw;
	width: 100%;
}
.tab4-button-area {
    position: relative;
    width: 100%;
    margin-top: 4vw;
    left: 0;
    transform: translateY(-10%);
    text-align: center;
    margin-bottom: 0vw;
}
.btn-row {
    margin: 15px 0;
}
.btn-img {
    width: 220px;
    margin: 0 15px;
    cursor: pointer;
    transition: 0.3s;
}
.btn-img:hover {
    transform: scale(1.05);
}

/* OUTLINE MODAL */
.custom-modal .modal-content {
    border: 4px solid #5c2d91;   /* ungu */
    border-radius: 10px;
    overflow: hidden;
}

/* HEADER UNGU */
.custom-header {
    background: #4b1e78; /* warna ungu */
    color: #fff;
    border-bottom: none;
    padding: 15px;
}

.custom-header .modal-title {
    font-weight: bold;
}

.close-white {
    color: #fff !important;
    opacity: 1;
}

/* BODY SCROLL */
.custom-body {
    max-height: 70vh;
    overflow-y: auto;
    padding: 20px;
    background: #f9f9f9;
	display: grid;
    align-items: center;
    height: 100%;
    justify-content: center;
}

/* SCROLLBAR CUSTOM */
.custom-body::-webkit-scrollbar {
    width: 8px;
}

.custom-body::-webkit-scrollbar-thumb {
    background: #5c2d91;
    border-radius: 10px;
}
.img-secglobal {
    padding: 3vw 10vw;
    /* padding: 3vw 14vw 1vw 10vw; */
    width: 100%;
}
.img-secglobal2 {
    padding: 3vw 17vw;
    width: 100%;
    filter: drop-shadow(2px 4px 5px black);
}
.menu-hide{
    opacity:0 !important;
    transform:translateY(-80px) !important;
    visibility:hidden !important;
    pointer-events:none !important;
}
.menu-16-1{
	transition:all .35s ease;
}

@media(max-width: 768px){
	.rojob3-section1{
		background: url(../images/layout/section1/mobile/bg.jpg) no-repeat center top;
		background-size: 100%;
		height: 265vw;
		position: relative;
		margin: 0 auto;
		padding: 0vw 0vw 0vw;
	}
	.rojob3-section1 .p-0{
		padding:0vw;
		flex: 1;
		/* border: solid; */
		background-color: black;
		/* border: 1px solid #f3fbad; */
		/* color: #8f8572; */
		background: url(../images/layout/section1/mobile/bg-tab.png) no-repeat center top;
		height: 8.5vw;
		background-size: 100%;
	}
	.rojob3-section1 .menu-16-1{
		position: absolute;
        bottom: 0vw;
        width: 100%;
        display: flex;
        justify-content: center;
        padding: 0vw 0vw;
	}
	.rojob3-section1 .menu-16-1, .menu-fixed-top, .menu-fixed-top.active {
        position: relative !important;
        top: 192vw;
        bottom: 0vw;
        padding: 0 0vw;
        backdrop-filter: none;
        background-color: transparent;
        opacity: 1;
        transform: translateY(0);
        transition: none;
    }
	.episode-17 {
		padding: 5vw 2vw;
	}
	.btn-img-sec1 {
		width: 50vw;
		top: 172vw;
		left: 24vw;
	}

	.rojob3-section1 .nav-tabs{
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		height: 75vw;
	}

	.rojob3-section1 .nav-tabs > div{
		width: 70%; /* lebar tombol */
		margin-bottom: 3vw;
	}

	.rojob3-section1 button{
		width: 100%;
		font-size: 3.5vw;
	}
	

	.rojob3-section1 button{
		font-size:3.5vw;
		padding: 1vw 1vw;
	}

	.rojob3-section1 .mb-2{
		margin-bottom:2vw;
	}

	.rojob3-section1 .btn-left{
		padding-left:0vw;
		padding-right:0vw;
		margin-bottom: 2.5vw;
	}

	.rojob3-section1 .btn-right{
		padding-left:0vw;
		padding-right:0vw;
		margin-bottom: 2.5vw;
	}

	.rojob3-section1 .btn-abu{
		margin-top: 2vw;
	}

	.rojob3-section1 .font1 {
		font-size: 4.7vw;
		padding: 1vw 0vw;
		color: #000;
        filter: brightness(1);
	}

	#tab1 .p-relative .nav-tabs{
		margin-bottom:8vw;
	}
	#tab1 .p-relative .nav-tabs li{
		width: 33%;
		text-align: center;
	}
	#tab1 .p-relative .nav-tabs li:nth-child(4){
		margin-left:15vw;
	}
	#tab1 .p-relative .nav-tabs li a{
		font-size: 3vw;
		padding: 2vw;
	}
	.tab3-sec1 .nav-tabs > li {
		float: left;
		width: 50%;
		text-align: center;
		margin-bottom: 1.5vw;
	}
	#tab3 .p-relative .nav-tabs li a {
		font-size: 2.1vw;
		letter-spacing: 1.5px;
		padding: 2.5vw;
	}
	.rojob3-section1 .btn-blue:hover , .rojob3-section1 .btn-blue:active , .rojob3-section1 .btn-blue:focus{
		background: url(../images/layout/section1/mobile/bg-tab.png) no-repeat center top;
		height: 12.5vw;
		background-size: 100%;
		border: unset !important;
		box-shadow: unset !important;
		outline: unset !important;
		filter: hue-rotate(263deg);
		transition: 0.5s;
		/* padding: 1vw; */
	}
	.tab1-sec2{
		background: url(../images/layout/tab1/tab/mobile/bg.jpg) no-repeat center top;
		height: 220vw;
		background-size: 100%;
		position: relative;
		margin: 0 auto;
		padding: 20vw 2vw 0vw;
		/* top:-1vw; */
		/* padding: 35vw 20.5vw 0vw; */
		/* padding: 0vw 0vw 0vw; */
	}
	.tab2-sec1 {
		padding: 0vw 3vw;
	}
	.tab3-title-sec1 {
		padding: 0vw 4vw;
		width: 100%;
	}
	.tab3-sec1{
		background-image: linear-gradient(to bottom, rgb(0 0 0 / 0%), #000000), url(../images/layout/tab3/bg-tab3-sec1.png);
		height: auto;
		background-size: cover;
		position: relative;
		margin: 0 auto;
		padding: 0vw 5vw 5vw;
	}
	.tab3-sec2{
		background: url(../images/layout/tab3/bg-tab3-sec2-old.jpg) no-repeat center top;
		height: auto;
		background-size: cover;
		position: relative;
		margin: 0 auto;
		padding: 28vw 5vw 5vw;
	}
	.tab4-button-area {
        margin-top: 12vw;
        margin-bottom: 5vw;
    }
	.btn-img {
		width: 31vw;
		margin: 0 0px;
	}
	.img-secglobal2 {
		padding: 8vw 2vw;
		width: 100%;
		filter: drop-shadow(2px 4px 5px black);
	}
}

/*==================================================================== END SECTION 1 =====================================================================*/


/*====================================================================== SECTION 2 =====================================================================*/
.rojob3-section2{
	background: url(../images/layout/global/bg-blacksmith.jpg) no-repeat center top;
	height: auto;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	/* padding-bottom: 5vw; */
}

@media(max-width: 768px){
	.rojob3-section2{
		background: url(../images/layout/global/bg-blacksmith.jpg) no-repeat center top;
		height: auto;
		background-size: 100%;
		position: relative;
		margin: 0 auto;
		/* padding-bottom: 5vw; */
	}
}
/*====================================================================== END SECTION 3 =====================================================================*/

/*====================================================================== FOOTER =====================================================================*/
.rojob3-footer{
	background: url(../images/layout/global/bg-footer.jpg) no-repeat center top;
	background-size: 100%;
	position: relative;
	margin: 0 auto;
	/* background-color: white; */
	height: auto;
	padding: 20px 0;
}
.rojob3-footer a{
	font-size: 16px;
    text-decoration: none;
    font-family: 'Times New Roman';
    color: #793949;
    font-weight: bold;
}
.rojob3-footer a:hover{
	color: #212529;
	text-decoration: none;
}
.footer-copyright{
	text-align: center;
	font-size: 14px;
    text-decoration: none;
    font-family: 'Times New Roman';
    color: #793949;
}
.pd-top-footer{
	margin-top:12px;
}
.pd-footer{
	padding: 0px 450px;
}
.rojob3-footer p{
	color: #cecece;
	font-family: 'Roboto Regular';
	font-size: 9pt;
	margin: 0;
	letter-spacing: 1px;
}
@media(max-width: 768px){
	.rojob3-footer{
		background: url(../images/layout/global/bg-footer.jpg) no-repeat center top;
		background-size: cover;
		position: relative;
		margin: 0 auto;
		/* background-color: white; */
		height: auto;
		padding: 0px;
	}
	.pd-footer {
		padding: 3vw 17vw 0vw 17vw;
	}
	.container {
		padding-right: 5vw;
		padding-left: 5vw;
		margin-right: auto;
		margin-left: auto;
		padding-bottom: 5vw;
	}
	.footer-copyright{
		font-size: 3vw;
	}
	.pd-top-footer {
		margin-top: 0vw;
	}
	.rojob3-footer a {
		font-size: 3.5vw;
	}
}
/*====================================================================== END FOOTER =====================================================================*/
.float-sosmed{
	position: fixed;
    right: 38px;
    top: 300px;
    z-index: 9;
}
ul.sosmed-list{
	list-style-type: none;
    padding: 0px 9px;
    margin: 0px;
}
ul.sosmed-list li img{
	width: 40px;
	margin-bottom: 10px;
}
.float-sosmed2{
	position: fixed;
    right: 1px;
    top: 165px;
    z-index: 9;
}
ul.sosmed-list2{
	list-style-type: none;
    padding: 0px 9px;
    margin: 0px;
}
ul.sosmed-list2 li img{
	width: 115px;
}
@media(max-width: 768px){
	.float-sosmed{
		position: fixed;
		right: 23px;
		top: 188px;
		z-index: 9;
	}
	.float-sosmed2{
		position: fixed;
		right: -8px;
		top: 85px;
		z-index: 9;
	}
	ul.sosmed-list li img{
		width: 30px;
	}
	ul.sosmed-list2 li img{
		width: 100px;
	}
}

.rojob3-btn-fixed-bottom{
	background-color: rgb(19, 123, 151);
	padding: 10px 45px;
	position: fixed;
	bottom: 0;
	z-index: 999;
}
.btn-playnow{
	position: absolute;
	left: 16vw;
	bottom: 6vw;
	width: 13.594vw;
}
@media(max-width: 768px){
	.btn-playnow {
	    position: absolute;
	    left: 0;
	    bottom: 9vw;
	    width: 100%;
	    padding: 0 29vw;
}
}