:root {
	--color-1: #111719;
	--color-2: #257564;
	--color-3: #3A9884;
	--color-4: #333F43;
	--color-5: #06316C;
	--color-6: #EEF5E6;
	--color-7: #51859B;
	--color-8: #EA8B66;
	--color-9: #76483B;
	--color-10: #101719;
	--box-shadow-1: 0px 6px 12px rgba(0, 0, 0, 0.16);
}

body{
	font-size: 14px;
	line-height: 22px;
	font-family: "Source Sans 3", sans-serif;
  	font-weight: 400;
  	font-style: normal;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	color: var(--color-1);
	background: var(--bs-white);
}

a,
a::after,
a::before,
.btn,
.btn > span,
.btn::before,
.btn::after,
.twAnimate,
.twAnimate::before,
.twAnimate::after{
	-webkit-transition: all ease .3s;
	-moz-transition: all ease .3s;
	-ms-transition: all ease .3s;
	-o-transition: all ease .3s;
	transition: all ease .3s;
}
button:focus, .btn:focus,
button:active, .btn:active{
	outline: none;
	box-shadow: none;
}
.custom-file-input:focus~.custom-file-label{
	border: none;
	box-shadow: none;
}
a{
	text-decoration: none !important;
	color: var(--color-1);
}
a.active, a:hover{
	color: var(--color-2);
}
a.active:hover{
	color: var(--color-2);
}
h1, .h1{
	font-size: 30px;
	line-height: 36px;
	font-weight: 400;
}
h2, .h2{
	font-size: 28px;
	line-height: 34px;
	font-weight: 400;
}
h3, .h3{
	font-size: 22px;
	line-height: 28px;
	font-weight: 400;
}
h4, .h4{
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
}
.twTitle{
	font-family: "Julius Sans One", sans-serif;
}
.twSubTitle{
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
}
/* header */
header{
	width: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	padding-top: 30px;
	padding-bottom: 30px;
	z-index: 9;
	& a.logo, & a.logo img{
		position: relative;
		text-align: center;
	}
}
header:not(.sticky) a.logo::before{
	content: '';
	position: absolute;
	width: 182px;
	height: 182px;
	background: var(--color-2);
	border-radius: 100%;
	z-index: 0;
	left: 0px;
	top: -66px;
}
a.btnMenu{
	width: 40px;
	height: 40px;
	display: block;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	background: var(--color-2);
	position: absolute;
	top: 20px;
	right: 0px;
	z-index: 99;
	& span{
		background: var(--bs-white);
		height: 3px;
		display: block;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		width: 14px;
		position: absolute;
		top: 13px;
		left: calc(50% - 7px);
		&:nth-child(2){
			top: 19px;
		}
		&:last-child{
			top: 25px;
		}
	}
	&:hover{
		background-color: var(--color-2);
	}
}
header.sticky a.btnMenu{
	top: 10px;
}
.mainmenu{
	align-items: center;
	gap: 40px;
	& a:not(.btn){
		color: var(--color-4);
		font-weight: bold;
		display: inline-block;
		font-size: 12px;
		line-height: 18px;
		text-transform: uppercase;
		position: relative;
		&::after{
			width: 0px;
			height: 3px;
			background: var(--color-2);
			display: block;
			content: '';
			margin: 5px auto 0 auto;
		}
		&:hover{
			color: var(--color-10);
			&::after{
				width: 30px;
			}
		}
	}
}
header a.logo img.logoSticky,
header.sticky a.logo img:not(.logoSticky){
	display: none;
}
header.sticky{
	position: fixed;
	animation: headerSticky 0.9s;
	background: var(--bs-white);
	box-shadow: var(--box-shadow-1);
	padding-top: 25px;
	padding-bottom: 25px;
	& a.logo img.logoSticky{
		display: block;
	}
}
.twHeader{
	display: grid;
	grid-template-columns: 182px 1fr;
}
/* footer */
footer{
	background: var(--color-4);
	padding-top: 50px;
	padding-bottom: 60px;
	& *{
		color: var(--bs-white);
	}
	& .twBoxFooter a.logo{
		display: block;
		text-align: center;
		margin-bottom: 40px;
	}
	& ul{
		list-style: none;
		margin: 0px;
		padding: 0px;
		& li{
			margin-bottom: 20px;
			&:last-child{
				margin-bottom: 0px;
			}
		}
		& a:hover{
			color: #D5E0E2;
		}
	}
	& .footer-widget{
		margin-top: 60px;
	}
}
/* content */
#mainContent{
	overflow: hidden;
}
.twSubTitle{
	text-transform: uppercase;
}
.twListPreview{
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	& .container{
		display: flex;
		justify-content: center;
	}
	& .twListPreviewDetail{
		max-width: 347px;
		background: var(--bs-white);
		text-align: left;
		margin-top: 235px;
		margin-bottom: 145px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		overflow: hidden;
		box-shadow: var(--box-shadow-1);
		& > *{
			padding: 30px;
		}
		& .boxHeader{
			background: var(--color-2);
			& .twTitle{
				margin: 0px;
			}
			& .twSubTitle{
				margin-bottom: 5px;
			}
		}
		& ul li{
			margin-bottom: 20px;
			font-weight: bold;
		}
	}
}
ul.checkList li{
	display: flex;
	align-items: center;
	gap: 10px;
	&::before{
		font-family: "Font Awesome 5 Pro";
		content: "\f058";
		font-weight: 400;
		font-size: 23px;
		color: var(--color-2);
	}
}
.twIconChild .thumb{
	width: 100px;
	height: 100px;
	background: var(--color-2);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	margin-bottom: 20px;
}
.wpb_text_column.twBoxBorder{
	padding: 40px 50px;
}
table.table, .wpb_text_column table{
	& th{
		color: var(--color-7);
		font-weight: 400;
	}
	& th, & td{
		border: none;
	}
	& tr:nth-of-type(even) td{
		background: #CBE7F0;
	}
}
.twImageIcon .row{
	margin-left: 0px;
	margin-right: 0px;
	& [class*='col-']{
		padding-left: 0px;
		padding-right: 0px;
	}
}
.twImageIconChild{
	display: flex;
	background: var(--bs-white);
	height: 100%;
	align-items: center;
	flex-wrap: wrap;
	&.twStyle_icon{
		padding: 30px;
		& .thumb{
			margin-bottom: 20px;
		}
	}
}
.twImages.twStyle_one .thumb{
	margin-bottom: 5px;
	&:last-child{
		margin-bottom: 0px;
	}
}
.twImages.twStyle_two .row{
	margin-left: -8px;
	margin-right: -8px;
	& [class*='col-']{
		padding-left: 8px;
		padding-right: 8px;
	}
}
.twListItems ul.checkList li{
	padding: 25px 30px;
	&:nth-of-type(even){
		background: #F2F6F7;
	}
}
.twVideo a{
	display: block;
	min-width: 350px;
	position: relative;
	overflow: hidden;
	&::before{
		font-family: "Font Awesome 5 Pro";
	    font-weight: 900;
		content: "\f04b";
		display: inline-flex;
		width: 50px;
		height: 50px;
		background: var(--color-2);
		color: var(--bs-white);
		position: absolute;
		left: calc(50% - 25px);
		top: calc(50% - 25px);
		align-items: center;
		justify-content: center;
		border-radius: 100%;
		-moz-border-radius: 100%;
		-webkit-border-radius: 100%;
		z-index: 2;
		font-size: 10px;
		line-height: 10px;
	}
	&:hover img{
		transform: scale(1.05);
	}
}
.twListItems ul.custom li{
	margin-bottom: 30px;
	display: grid;
	grid-template-columns: 24px 1fr;
	gap: 10px;
	& > span{
		display: block;
		text-align: center;
	}
	&:last-child{
		margin-bottom: 0px;
	}
}
.twListItems ul.default li{
	margin-bottom: 30px;
	position: relative;
	padding-left: 39px;
	&:last-child{
		margin-bottom: 0px;
	}
	&::before{
		content: '';
		width: 29px;
		height: 30px;
		background: url(img/icon.svg) no-repeat center / cover;
		position: absolute;
		left: 0px;
		top: 5px;
	}
}
.ppOption{
	max-width: 994px;
	& .twSubTitle{
		color: var(--color-2);
	}
	& h3{
		font-size: 18px;
		line-height: 26px;
		font-weight: bold;
	}
	& .colRight{
		border: 2px solid var(--color-5);
		padding: 30px;
		background: #DBEFF6 url(img/optionpp.svg) no-repeat right bottom / 168px 172px;
	}
}
.ppThankyou{
	max-width: 590px;
	& .twSubTitle{
		color: var(--color-2);
	}
	& .blockContent{
		margin-top: 30px;
	}
}
.fancybox-slide--iframe .fancybox-content iframe{
	width: 100%;
	height: 100%;
}
/* common */
.thumb{
	overflow: hidden;
}
.twPagination span,
.twPagination a{
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	color: var(--bs-white);
	border: 1px solid var(--color-1);
	padding: 5px 10px;
	font-size: 12px;
	font-weight: 700;
	margin: 0 2px;
}
.twPagination span,
.twPagination a:hover{
	background: var(--color-1);
}
.btnDisabled{
	pointer-events: none;
	opacity: 0.5;
}
.btn{
	height: 50px;
	display: inline-flex;
	align-items: center;
	padding: 0 40px;
	position: relative;
	background: var(--color-2);
	border: 2px solid var(--color-2);
	box-sizing: border-box;
	justify-content: center;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	font-size: 12px;
	line-height: 18px;
	font-weight: bold;
	color: var(--bs-white);
	gap: 5px;
	text-transform: uppercase;
}
.btn:hover{
	background-color: var(--color-3);
	color: var(--bs-white);
	border-color: var(--color-3);
}
.btn.btn1{
	background-color: var(--bs-white);
	color: var(--color-2);
}
.btn.btn1:hover{
	background-color: var(--color-6);
	border-color: var(--color-2);
	color: var(--color-2);
}
.btn.btn2{
	background-color: var(--color-5);
	border-color: var(--color-5);
}
.btn.btn2:hover{
	background-color: var(--color-7);
	border-color: var(--color-7);
}
.btn.btn3{
	background-color: var(--color-8);
	border-color: var(--color-8);
}
.btn.btn3:hover{
	background-color: var(--color-9);
	border-color: var(--color-9);
}
.btnLink{
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	color: var(--color-5);
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	cursor: pointer;
	&::after{
		font-family: "Font Awesome 5 Pro";
	    font-weight: 900;
		content: "\f054";
		font-size: 10px;
	}
	&::before{
		position: absolute;
		left: 0px;
		bottom: 0px;
		border-bottom: 1px solid var(--color-5);
		width: 0;
		content: '';
	}
	&:hover{
		color: var(--color-5);
		&::before{
			width: calc(100% - 10px);
		}
		&::after{
			transform: translateX(2px);
		}
	}
}
.form-label{
	font-weight: 400;
	color: var(--color-4);
	margin-bottom: 0px;
	font-size: 12px;
	line-height: 18px;
}
.form-control{
	height: 50px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	font-weight: 400;
	color: var(--color-4);
	font-size: 12px;
	line-height: 18px;
	background: var(--bs-white);
	border: 1px solid #D5E0E2;
	padding: 0px 20px;
}
.form-control[readonly] {
	background: rgba(255,255,255,0.1);
}
.form-select{
	height: 50px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	font-weight: 400;
	color: var(--color-4);
	font-size: 12px;
	line-height: 18px;
	background-color: var(--bs-white);
	border: 1px solid #D5E0E2;
}
textarea.form-control{
	min-height: 120px;
	padding: 12px;
}
.form-control::-moz-placeholder{
	color: var(--color-4);
}
.form-control:-ms-input-placeholder{
	color: var(--color-4);
}
.form-control::-webkit-input-placeholder{
	color: var(--color-4);
}
.form-control:focus{
	background: var(--bs-white);
	outline: none;
	border-color: var(--color-8);
	box-shadow: none;
}
.custom-file{
	position: relative;
}
.custom-file .file_name{
	margin-left: 10px;
	color: var(--color-4);
}
.custom-file input[type="file"]{
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	visibility: hidden;
}
.custom-file label{
	margin-bottom: 5px;
	margin-left: 10px;
	cursor: pointer;
}
.form-check{
	padding-left: 0px;
}
.form-check input.form-check-input, .wpcf7-list-item input{
	visibility: hidden;
	display: none;
}
.form-check label.form-check-label, .wpcf7-list-item .wpcf7-list-item-label{
	font-weight: 400;
	position: relative;
	padding-left: 25px;
	font-size: 12px;
	line-height: 18px;
	cursor: pointer;
	color: var(--color-4);
}
.form-check label.form-check-label::after,
.wpcf7-list-item .wpcf7-list-item-label::after{
	position: absolute;
	left: 6px;
	top: 3px;
	font-family: "Font Awesome 5 Pro";
	font-weight: 300;
	font-size: 10px;
	line-height: 10px;
	color: var(--color-4);
}
.form-check label.form-check-label::before,
.wpcf7-list-item .wpcf7-list-item-label::before{
	content: '';
	width: 20px;
	height: 20px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border: 1px solid #D5E0E2;
	display: inline-block;
	background: var(--bs-white);
	position: absolute;
	left: 0px;
	top: -2px;
}
.form-check.form-radio label.form-check-label::before{
	border-radius: 100%;
}
.form-check input:checked~label::after,
.wpcf7-list-item input:checked~.wpcf7-list-item-label::after{
	content: '\f00c';
}
.form-check.form-radio input:checked~label::after{
	background: var(--color-1);
	content: '';
	width: 10px;
	height: 10px;
	border-radius: 100%;
}
.twBlock,
.wpb_text_column .blockContent.twBlock,
.vc_row-flex{
	margin-bottom: 30px;
}
.vc_row-no-padding .twBlock{
	margin: 0px;
}
.vc_row:not(.vc_row-no-padding){
	padding-top: 30px;
}
.vc_row-has-fill+.vc_row-full-width+.vc_row>.vc_column_container>.vc_column-inner, 
.vc_row-has-fill>.vc_column_container>.vc_column-inner,
.vc_row .vc_row{
	padding-top: 0px !important;
}
.vc_row-fluid.vc_row-no-padding .twImage img{
	object-fit: cover;
	width: 100%;
}
.formPopup{
	background: var(--bs-white);
	padding: 30px 60px;
}
.formPopup.ppOption, .formPopup.ppThankyou{
	padding: 30px;
}
.ppResult{
	max-width: 500px;
	text-align: center;
}
.not-loading{
	position:absolute;
	bottom:-20px;
	font-size:20px
}
.btn .not-loading{
	position:initial;
	font-size:13px;
	margin-left:4px;
}
.not-loading,
.not-loading::before,
.not-loading::after{
	display: none !important;
}
.not-loading.loading{
	display: inline-block !important;
}
.not-loading.failed,
.not-loading.success{
	display: inline-block !important;
}
.not-loading.failed i,
.not-loading.success i{
	animation:none;
	margin-left:3px;
}
.not-loading.success i::before{
	content:'\f00c';
}
.not-loading.failed i::before{
	content:'\f00d';
}
.position-relative .wpcf7-spinner{
	position: absolute;
	left: 0px;
	top: calc(50% - 12px);
}
/* effect */
@keyframes headerSticky{
	0% {
		position: fixed;
		top: -100%;
	}
	100% {
		position: fixed;
		top: 0;
	}
}
/* Responsive */
@media (min-width: 1400px){
	.container{
		max-width: 1200px;
	}
	footer .container{
		max-width: 994px;
	}
	.vc_row.twMaxWidthRowVc:not(.vc_row-no-padding),
	.twImageIcon{
		max-width: 994px;
		margin-left: auto;
		margin-right: auto;
	}
	.fancybox-slide--iframe .fancybox-content{
		max-width: 994px;
		height: 560px !important;
	}
}

@media (min-width: 900px){
	
}

@media (min-width: 768px){
	footer .container > .row .col-md-4:last-child ul{
		display: inline-block;
		text-align: left;
	}
	.twListPreview.text-md-end .container{
		justify-content: flex-end;
	}
	.twListPreview.text-md-start .container{
		justify-content: flex-start;
	}
}

@media (max-width: 767px){
	h1, .h1{
		font-size: 25px;
		line-height: 31px;
	}
	h2, .h2{
		font-size: 23px;
		line-height: 29px;
	}
	h3, .h3{
		font-size: 18px;
		line-height: 24px;
	}
	.ppOption h3{
		font-size: 16px;
		line-height: 22px;
	}
	.twHeader{
		display: block;
		position: relative;
	}
	header a.logo{
        width: 182px;
		display: block;
    }
	#twMainMenu{
		display: none;
		& .mainmenu{
			display: block;
			padding: 10px 15px;
			& li{
				margin-bottom: 10px;
				&:last-child{
					margin-bottom: 0px;
				}
			}
		}
	}
	header:not(.sticky) #twMainMenu{
		background: var(--bs-white);
		margin-top: 50px;
	}
	.twListPreview .twListPreviewDetail{
		margin-top: 200px;
		margin-bottom: 100px;
	}
	.fancybox-slide--iframe .fancybox-content{
		height: 400px !important;
	}
	.wpb_text_column.twBoxBorder, 
	.formPopup,
	.formPopup.ppOption,
	.formPopup.ppThankyou{
		padding: 15px;
	}
	.twImages.twStyle_two .thumb{
		margin-bottom: 5px;
		&:last-child{
			margin-bottom: 0px;
		}
	}
	.twIconChild .thumb{
		margin-left: auto;
		margin-right: auto;
	}
	.twIconChild .twSubTitle{
		text-align: center;
	}
	.formPopup.ppOption .colRight{
		margin-top: 30px;
	}
}

@media (max-width:467px){
	
}