@media screen and (min-width: 1600px) {
	
	.trans-bg { padding: 20px 0 130px;}
	.banner h2 { font-size: 6em;}
	.btn-block a { margin: 360px 6px 0;}
	.text-slider { margin-top: -130px;}
	
}
@media screen and (max-width: 1440px) {
	.banner { background: url(../images/xl-slide.jpg) top center no-repeat;}
	.banner h2 { font-size: 6.3em;}
	.btn-block a { margin: 380px 6px 0;}
	.text-slider { margin-top: -135px;}
	
	.sign-header > h1 { padding-left: 3em;}

}
@media screen and (max-width: 1360px) {
	.banner { background: url(../images/l-slide.jpg) top center no-repeat;}
	.trans-bg { padding: 15px 0 90px;}
	.banner h2 { font-size: 5.8em;}
	.btn-block a { margin: 290px 6px 0;}
	.text-slider { margin-top: -125px;}
	
	.sign-header > h1 { padding-left: 2em;}

}
@media screen and (max-width: 1024px) {
	.intro-list > li {
		font-size: 1.6em;
		letter-spacing: 0;
	}
	
	.feature-list-left .feature-icon {
		width: 36px;
		height: 36px;
	}
	.feature-list-left .feature-icon, .feature-list-right .feature-icon {
		width: 36px;
		height: 36px;
		line-height: 34px;
	}
	.feature-list-left .fa, .feature-list-right .fa {
		font-size: 21px;
		line-height: 34px;
	}
	.feature-detail p { font-size: 1.4em;}
	.feature-list-right .feature-icon {
		width: 36px;
		height: 36px;
	}
	
	.less-txt2 { padding-bottom: 3.2em;}
	
	.superior-block > span.text1::before{ left: 2.4em;}
	.superior-block > span.text1::after{ right: 2.4em;}
	.superior-block > span.text2::before{ left: 2em;}
	.superior-block > span.text2::after{ right: 2em;}
	.superior-block > span.text3::before{ left: 0;}
	.superior-block > span.text3::after{ right: 0;}
	
	.sign-header > h1 {
		font-size: 3em;
		padding-left: 1em;
	}
	.sign-header > h1::before {
		letter-spacing: 0.2em;
		left: 15%;
	}
}

@media screen and (max-width: 992px) {
	#logo-bar {
		width:100%;
		height:56px;
	}
	.submenu { display: none;}
	header .nav > li > a { padding: 5px 8px;}
	header .navbar-default .sign { padding-top: 0;}
	
	.btn-block a { margin: 320px 6px 0;}
	
	.intro-word {
		font-size: 1.4em;
		font-weight: 400;
	}
	
	.dt-panel, .mb-panel { display: none;}
	.pad-panel { display: block;}
	
	.checkmark {
		height: 32px;
		width: 32px;
	}
	.checkmark:after {
		border-right: 6px solid #005cac;
		border-top: 6px solid #005cac;
		left: 0;
		top: 15px;
	}
	
	.feature-list-left li:first-child > span, .feature-list-right li:first-child > span {
		font-size: 1.5em;
		letter-spacing: 0;
		padding: 6px 15px;
	}
	.feature-list-left li, .feature-list-right li { margin-bottom: 25px;}
	.feature-detail p {
		font-size: 1.2em;
		letter-spacing: 0;
	}
	
	.superior-word { font-size: 1.4em;}
	.superior-block { padding: 20px;}
	.superior-block > h3 { font-size: 1.4em;}
	.superior-block > p { font-size: 1.2em;}
	.less-txt2 { padding-bottom: 1.6em;}
	.superior-block > span {
		font-size: 0.8em;
		letter-spacing: 0.1em;
	}
	.superior-block > span::before{ width: 25px;}
	.superior-block > span::after{ width: 25px;}
	
   .contact .nav-tabs li { margin:0 5% 25px;}
	
	.sign-header > h1 { font-size: 2.4em;}
	.sign-header > h1::before { font-size: 12px;}

}
@media screen and (max-width: 768px) {
	
	.nav-brand { display: inline-block;}
	header .navbar-default .navbar-collapse { border: none;}

	h1 { font-size: 40px;}
	h2 { font-size: 26px;}
	h3 { font-size: 18px;}
	h4 { font-size: 18px;}
 
	.trans-bg { padding: 20px 0 60px;}
	.banner h2 { font-size: 5.3em;}
	.btn-block a { margin: 320px 6px 0;}
	.text-slider { margin-top: -115px;}

	.train, .process, .note { padding: 60px 0;}
	
	section.contact > .container { margin-top: -180px;}
	
	.sign-header > h1 { font-size: 2.1em;}
	.sign-header > h1::before { left: 10%;}

}

@media only screen and (min-width : 481px) and (max-width : 767px) {
	body { font-size: 12px;}
	
	#logo-bar {
		background:#009be4 url(../images/ltopbar.png) 0 0 no-repeat;
		width:100%;
		height:70px;
	}

	header .nav > li > a {
		padding: 10px;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	
	header .navbar-default .sign {
		display: block;
		padding: 20px 10px 5px;
	}
	header .navbar-default .sign > a > i { display: none;}
	
	.banner { background: url(../images/m-slide.jpg) top center no-repeat;}
	.banner h2 { font-size: 5.6em;}
	.btn-block a { margin: 220px 6px 0;}
	.text-slider { margin-top: -105px;}
	
	.intro { padding: 100px 0 50px;}
	.train, .process, .note { padding: 50px 0;}
	
	.intro-word { letter-spacing: 0.05em;}
	.intro-list > li { font-size: 1.5em;}
	
	@-webkit-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@-moz-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@-ms-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	.checkmark {
		height: 25px;
		width: 25px;
		margin-right: 10px;
	}
	.checkmark:after {
		border-right: 5px solid #005cac;
		border-top: 5px solid #005cac;
		height: 20px;
		left: 3px;
		top: 15px;
		width: 10px;
	}
	
	.list-word {
		font-size: 1.6em;
		font-weight: 600;
	}
	
	.feature-list-left li:first-child, .feature-list-right li:first-child { margin-bottom: 20px;}
	.feature-list-left li {
		text-align: center;
		padding-right: 0;
	}
	.feature-list-right li {
		text-align: center;
		padding-left: 0;
	}
	.feature-list-left li, .feature-list-right li { margin-bottom: 0;}
	.feature-list-left .feature-icon, .feature-list-right .feature-icon { display: none;}
	.feature-detail p {
		font-size: 1.8em;
		letter-spacing: 0.2em;
	}
	.feature-list-right { margin-top: 30px;}
	
	.subtitle span { font-size: 1.6em;}

	#train > div:first-child {
		border-right: none;
		border-bottom: 1px solid #09384e;
		-webkit-border-radius: 20px 20px 0 0;
		-moz-border-radius: 20px 20px 0 0;
		-ms-border-radius: 20px 20px 0 0;
		-o-border-radius: 20px 20px 0 0;
		border-radius: 20px 20px 0 0;
	}
	#train > div:last-child {
		border-left: none;
		border-top: 1px solid #09384e;
		-webkit-border-radius: 0 0 20px 20px;
		-moz-border-radius: 0 0 20px 20px;
		-ms-border-radius: 0 0 20px 20px;
		-o-border-radius: 0 0 20px 20px;
		border-radius: 0 0 20px 20px;
	}
	#train > div.nextstep > .fa {
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
		top: -20px;
		left: 45%;
	}
	
	#process { margin-top: 0;}
	.process-panel:first-child { margin-top: 10px;}
	.process-panel { margin: 30px auto;}
	.process-panel > span { color:#FF6F3F;}
	#process div.nextstep > .fa {
		top: -33px;
		left: 48%;
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	.process-panel::after { display: none;}
	
	.superior-block > h3 { font-size: 1.6em;}
	.superior-block > p { font-size: 1.4em;}
	.less-txt, .less-txt2 { padding-bottom: 1.6em;}
	.superior-block > span {
		font-size: 1.2em;
		letter-spacing: 0.2em;
	}
	.superior-block > span::before{ width: 50px;}
	.superior-block > span::after{ width: 50px;}
	.superior-block > span.text1::before{ left: 11.4em;}
	.superior-block > span.text1::after{ right: 11.4em;}
	.superior-block > span.text2::before{ left: 10.8em;}
	.superior-block > span.text2::after{ right: 10.8em;}
	.superior-block > span.text3::before{ left: 8.8em;}
	.superior-block > span.text3::after{ right: 8.8em;}
	
	.note-title {
		font-size: 1.4em;
		padding: 10px 30px;
		margin-bottom: 20px;
	}
	.note-info li { font-size: 1.4em;}
	
}

@media screen and (max-width: 480px) {
	body { font-size: 10px;}
	
	#logo-bar {
		background:#009be4 url(../images/topbar.png) 0 0 no-repeat;
		width:100%;
		height:64px;
	}
	
	header {
		height: auto;
		padding: 0;
	}
	
	header h1{ margin: 10px 0;}
	
	header .nav-brand img { width: 120px;}
	.lg-logo img { width: 50px;}
	header .navbar-default .navbar-toggle { margin-top: 5px;}
	header .navbar-default .navbar-nav > li > a {
		font-size: 1.6em;
		margin-bottom: 10px;
	}
	
	header .navbar-default .sign {
		font-size: 1.15em;
		display: block;
		padding: 20px 10px 5px;
	}
	header .navbar-default .sign > a > i { display: none;}
	
	.trans-bg { padding: 50px 0 80px;}
	.banner h2 { font-size: 5.8em;}
	.btn-block a {
		margin: 360px 6px 0;
		font-size: 1.5em;
		font-weight: 600;
		padding: 12px 50px;
	}
	.text-slider { margin-top: -105px;}
	
	.mb-panel { display: block;}
	.dt-panel, .pad-panel { display: none;}
	
	.title h2, h2 {
		font-size: 2.8em;
		padding: 0 0px 10px;
	}
	
	.intro { padding: 60px 0;}
	.train, .process, .note { padding: 30px 0;}
	
	section.banner { padding: 0;}
	
	.intro-word { letter-spacing: 0;}
	
	.intro-list > li { font-size: 1.6em;}
	
	@-webkit-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@-moz-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@-ms-keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	@keyframes check {
		0% {
			height: 0;
			width: 0;
		}
		60% {
			width: 10px;
			height: 0;
		}
	}
	.checkmark {
		height: 20px;
		width: 20px;
		margin-right: 10px;
	}
	
	.checkmark:after {
		border-right: 3px solid #005cac;
		border-top: 3px solid #005cac;
		height: 20px;
		left: 2px;
		top: 10px;
		width: 10px;
	}
	
	.list-word, .about-word, .subtitle span, .superior-word, .address {
		font-size: 1.7em;
		letter-spacing: 0.1em;
	}
	
	.feature-list-left li:first-child > span, 
	.feature-list-right li:first-child > span { font-size: 1.8em;}
	
	.feature-list-left li:first-child, .feature-list-right li:first-child { margin-bottom: 20px;}
	.feature-list-left li {
		text-align: center;
		padding-right: 0;
	}
	.feature-list-right li {
		text-align: center;
		padding-left: 0;
	}
	.feature-list-left li, .feature-list-right li { margin-bottom: 0;}
	.feature-list-left .feature-icon, .feature-list-right .feature-icon { display: none;}
	.feature-detail p {
		font-size: 1.8em;
		letter-spacing: 0.2em;
	}
	.feature-list-right { margin-top: 30px;}
	
	.sub-txt { font-size: 1.5em;}
	
	#train > div:first-child {
		border-right: none;
		border-bottom: 1px solid #09384e;
		-webkit-border-radius: 20px 20px 0 0;
		-moz-border-radius: 20px 20px 0 0;
		-ms-border-radius: 20px 20px 0 0;
		-o-border-radius: 20px 20px 0 0;
		border-radius: 20px 20px 0 0;
	}
	#train > div:last-child {
		border-left: none;
		border-top: 1px solid #09384e;
		-webkit-border-radius: 0 0 20px 20px;
		-moz-border-radius: 0 0 20px 20px;
		-ms-border-radius: 0 0 20px 20px;
		-o-border-radius: 0 0 20px 20px;
		border-radius: 0 0 20px 20px;
	}
	#train > div.nextstep > .fa {
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
		top: -20px;
		left: 45%;
	}
	
	#process { margin-top: 0;}
	.process-panel:first-child { margin-top: 10px;}
	.process-panel { margin: 30px auto;}
	.process-panel > span { color:#FF6F3F;}
	#process div.nextstep > .fa {
		top: -33px;
		left: 48%;
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	.process-panel::after { display: none;}
	
	.superior-block { margin-bottom: 50px;}
	.superior-block:last-child { margin-bottom: 0;}
	.superior-block > h3 { font-size: 2em;}
	.superior-block > p { font-size: 1.6em;}
	.superior-block > span { font-size: 1.4em;}
	.superior-block > span::before{ width: 50px;}
	.superior-block > span::after{ width: 50px;}
	.superior-block > span.text1::before{ left: 7.6em;}
	.superior-block > span.text1::after{ right: 7.6em;}
	.superior-block > span.text2::before{ left: 6.8em;}
	.superior-block > span.text2::after{ right: 6.8em;}
	.superior-block > span.text3::before{ left: 5em;}
	.superior-block > span.text3::after{ right: 5em;}
	
	
	section.contact { padding-bottom:10px;}
	.contact .nav-tabs li { margin: 0 4% 10px;}
	
	.contact .contact-info h2 { margin-bottom: 20px;}
	
	#map { height: 250px;}
	
	.note-title {
		font-size: 1.5em;
		padding: 10px 30px;
		margin-bottom: 20px;
	}
	.note-info li { font-size: 1.6em;}

	#footer {
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.copyright p { margin: 20px 0;}
	
	.sign-header > h1 { letter-spacing: 0;}
	.sign-header > h1::before {
		font-size: 12px;
		left: 5%;
	}
	
	.confirm { width: 90%;}	

}

@media screen and (max-width: 414px) {
	
	.banner { background: url(../images/s-slide.jpg) top center no-repeat;}
	.trans-bg { padding: 20px 0 80px;}
	.banner h2 { font-size: 4.8em;}
	.banner h2 span { margin-bottom: 0.1em;}
	.btn-block {
		display: block;
		margin-top: 300px;
	}
	.btn-block a {
		margin: 20px auto 0;
		display: block;
		
	}
	.text-slider { margin-top: -95px;}
	
	.intro-word { margin-bottom: 2em;}
	.intro-word > span, .list-word > span, .about-word > span, 
	.info-holder p > span, .copyright p > span { display: block;}
	
	.superior-block > span.text1::before{ left: 5em;}
	.superior-block > span.text1::after{ right: 5em;}
	.superior-block > span.text2::before{ left: 4.2em;}
	.superior-block > span.text2::after{ right: 4.2em;}
	.superior-block > span.text3::before{ left: 2.5em;}
	.superior-block > span.text3::after{ right: 2.5em;}
	
	section.contact > .container { margin-top: -170px;}
	.contact .nav-tabs li .fa {
		width: 80px;
		height: 80px;
		font-size: 40px;
		-webkit-box-shadow: 0px 0px 0px 16px rgb(255, 255, 255);
		-moz-box-shadow: 0px 0px 0px 16px rgb(255, 255, 255);
		box-shadow: 0px 0px 0px 16px rgb(255, 255, 255);
	}
	.contact .nav-tabs li .fa:hover,
	.contact .nav-tabs > li.active > a .fa,
	.contact .nav-tabs > li.active > a:hover .fa,
	.contact .nav-tabs > li.active > a:focus .fa {
		-webkit-box-shadow: 0px 0px 0px 16px rgba(255, 255, 255,0.75);
		-moz-box-shadow: 0px 0px 0px 16px rgba(255, 255, 255,0.75);
		box-shadow: 0px 0px 0px 16px rgba(255, 255, 255,0.75);
	}
	
	.info-holder p > span { margin-bottom: 20px;}
	
	.copyright p > span { margin-left: 0;}
	.copyright p { margin: 10px 0;}
	
}

@media screen and (max-width: 375px) {
	
	body { font-size: 9px;}
	
	#logo-bar {
		background:#009be4 url(../images/mtopbar.png) 0 0 no-repeat;
		width:100%;
		height:52px;
	}
	
	.text-slider { margin-top: -88px;}
	
	#process div.nextstep > .fa { top: -30px;}

	#map { height: 200px;}
	
	.confirm {
		min-height: 450px;
		margin: 30px auto;
	}
	.confirm-body {
		height: 350px;
		max-height: 400px;
	}

}

@media screen and (max-width: 360px) {
	
	.superior-block > span.text1::before{ left: 4em;}
	.superior-block > span.text1::after{ right: 4em;}
	.superior-block > span.text2::before{ left: 3.2em;}
	.superior-block > span.text2::after{ right: 3.2em;}
	.superior-block > span.text3::before{ left: 2em;}
	.superior-block > span.text3::after{ right: 2em;}
	
	.confirm {
		min-height: 350px;
		margin: 20px auto;
	}
	.confirm-body {
		height: 250px;
		max-height: 300px;
	}

}

@media screen and (max-width: 320px) {
   
	body { font-size: 8px;}
	
	.banner h2 { font-size: 4.6em;}
	.btn-block { margin-top: 280px;}
	.btn-block a { margin: 10px auto 0;}
	.text-slider { margin-top: -80px;}
	
	.superior-block > span.text1::before{ left: 2.8em;}
	.superior-block > span.text1::after{ right: 2.8em;}
	.superior-block > span.text2::before{ left: 2em;}
	.superior-block > span.text2::after{ right: 2em;}
	.superior-block > span.text3::before{ left: 0.6em;}
	.superior-block > span.text3::after{ right: 0.6em;}
	
	.superior { padding: 40px 0 80px;}
	
	section.contact > .container { margin-top: -160px;}
	.contact .nav-tabs li .fa {
		width: 60px;
		height: 60px;
		font-size: 30px;
		-webkit-box-shadow: 0px 0px 0px 10px rgb(255, 255, 255);
		-moz-box-shadow: 0px 0px 0px 10px rgb(255, 255, 255);
		box-shadow: 0px 0px 0px 10px rgb(255, 255, 255);
	}
	.contact .nav-tabs li .fa:hover,
	.contact .nav-tabs > li.active > a .fa,
	.contact .nav-tabs > li.active > a:hover .fa,
	.contact .nav-tabs > li.active > a:focus .fa {
		-webkit-box-shadow: 0px 0px 0px 10px rgba(255, 255, 255,0.75);
		-moz-box-shadow: 0px 0px 0px 10px rgba(255, 255, 255,0.75);
		box-shadow: 0px 0px 0px 10px rgba(255, 255, 255,0.75);
	}
	
	.contact .nav-tabs li { margin: 0 3%;}
	
	.address { letter-spacing: 0;}
	
	.confirm {
		min-height: 300px;
		margin: 20px auto;
	}
	.confirm-body {
		height: 200px;
		max-height: 300px;
	}
	
	.btn { padding: 6px 15px;}

}
