/*html {font-size:100%;}
body {font-size:62.5%}*/

body {
	font-family: 'Roboto', sans-serif;
	color: #4d4d4d;
	overflow-x: hidden;
	font-size: 16px;
}

h1 {
	font-size: calc(1.7857142857142856vw + 42.285714285714285px);
	line-height: calc(-0.2976190476190476vw + 62.95238095238095px);
	color: #FFF;
	font-weight: 300;
}

h2 {
	font-size: calc(2.6785714285714284vw + 21.428571428571427px);
	line-height: 1;
	color: #666666;
	font-weight: 300;
}

@media screen and ( max-width: 320px) {
	h2 {
		line-height: 1.3;
		text-align: center;
	}
	h3 {
		text-align: center;
	}
}

h3 {
	font-size: calc(0.8928571428571428vw + 21.142857142857142px);
	line-height: calc(0.744047619047619vw + 28.61904761904762px);
	color: #666666;
	font-weight: 400;
}

h4 {
	font-size: calc(0.5952380952380952vw + 18.095238095238095px);
	line-height: calc(1.1904761904761905vw + 24.19047619047619px);
	color: #666666;
	font-weight: 400;
}

h5 {
	font-size: calc(0.2976190476190476vw + 17.047619047619047px);
	line-height: calc(-0.4464285714285714vw + 24.428571428571427px);
	font-weight: 400;
}

p {
	font-size: calc(0.2976190476190476vw + 15.047619047619047px);
	line-height: calc(0.744047619047619vw + 19.61904761904762px);
	/* color: #666666; */
	font-weight: 300;
}

a {
	font-weight: 400;
}

#topnavarea.affix,
#topnavarea.affix-top {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 50;
}

#footerarea ul {
	list-style-image: none;
}

.container-fluid {
	padding: 0;
}

.rl-row-1440 {
	max-width: 1440px;
	margin: 0 12.1%;
	padding-right: 15px;
	padding-left: 15px;
}

.rl-row-1540 {
	max-width: calc( 1540px + 30px);
	margin: 0 8.7%;
	padding-right: 15px;
	padding-left: 15px;
}

@media screen and ( max-width: 768px) {
	#Ctu-img1 {
		width: 50%;
	}
	#Ctu-img2 {
		width: 50%;
	}
	#ctu-height-mask {
		display: none;
	}
	.mobile-pb90 {
		padding-bottom: calc(2.125vw + 49.2px);
	}
}

@media screen and ( max-width: 991px) {
	.rl-row-1440 {
		padding-right: 15px !important;
		padding-left: 15px !important;
		margin: 0 auto;
	}
	.rl-row-1540 {
		padding-right: 15px;
		padding-left: 15px;
		margin: 0 auto;
	}
}

@media screen and ( min-width: 992px) {
	h1 {
		font-size: 60px;
		line-height: 1;
		font-weight: 300;
	}
	h2 {
		font-size: 48px;
		line-height: 1;
		font-weight: 300;
	}
	h3 {
		font-size: 30px;
		line-height: 1.2;
		font-weight: 400;
	}
	h4 {
		font-size: 24px;
		line-height: 1.2;
		font-weight: 400;
	}
	h5 {
		font-size: 20px;
		line-height: 1;
		font-weight: 400;
	}
	p {
		font-size: 18px;
		line-height: 1.5;
		font-weight: 300;
	}
}

@media screen and ( max-width: 1440px) {
	.rl-row-1440 {
		margin: 0 4.17%;
	}
	.rl-row-1540 {
		margin: 0 4.17%;
	}
}

.nss-img {
	fill: #fff;
	max-width: 200px;
	max-height: 200px;
	margin: 0 auto;
	background-color: #929292;
}

.pb-left-0 {
	padding-left: 0;
}

.button-default {
	white-space: nowrap;
	line-height: calc(40px + 0.5vw);
	background-color: #36a6e9;
	padding: 0 30px;
	color: #FFF;
	border: 0;
	font-weight: 300;
	font-size: 20px;
}

.button-default:hover {
	background-color: #666;
}

.button-default[disabled],
.button-default:disabled{
	background-color: #dadada;
	cursor: not-allowed;
}



.button-default-NL-subscribe {
	white-space: nowrap;
	line-height: calc(40px + 0.5vw);
	background-color: #36a6e9;
	padding: 0 30px;
	color: #FFF;
	border: 0;
	font-weight: 300;
	font-size: 20px;
}

.button-default-NL-subscribe:hover {
	background-color: #666;
}

.button-default-NL-subscribe[disabled],
.button-default-NL-subscribe:disabled{
	background-color: #c8c8c8;
	cursor: not-allowed;
}





.title-bg {
	background-color: #36a6e9;
	line-height: 1;
	color: #FFF;
	padding-top: calc(3.75vw + 58px);
	/*130*/
	padding-bottom: calc(1.5625vw + 25px);
	/*55*/
}

.title-weight {
	font-weight: 300;
}

.navi-custom {
	overflow: hidden;
	height: 70px;
	line-height: 1;
	padding-top: 20px;
	padding-bottom: 10px;
}

.navi-line {
	border-bottom: 1px solid #cccccc;
}

.navi-custom li {
	text-align: center;
	color: #36a6e9;
	margin-bottom: calc(0.375vw + 7.8px);
	/*15px;*/
}

.navi-custom li a {
	color: #666666;
}

.navi-custom li a:hover {
	color: #36a6e9;
	text-decoration: underline;
}

.navi-custom-select {
	text-decoration: underline;
}

.navi-li-weight {
	font-weight: 400;
}

.button-img-spacing {
	padding-left: 25px;
}

.hr {
	border-bottom: 1px solid #CCC;
}

.style-modal-text {
	text-align: center;
	color: #666666;
	font-weight: 300;
}

.style-modal-box {
	border-radius: 0;
}

.style-modal-body {
	margin-top: 8%;
}

.style-modal-button {
	background-color: #36a6e9;
	border-radius: 0;
	color: #FFF;
	border: 0;
	margin-bottom: 50px;
	padding: 10px 50px;
}

.style-modal-button:hover {
	background-color: #666666;
	color: #FFF;
}

.style-modal-dialog {
	overflow: auto;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	background-color: rgba(0, 0, 0, 0.6);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.modal-content {
	width: 600px;
	margin: 0 auto;
	-webkit-box-shadow: none;
	        box-shadow: none;
}

.text-link,
.text-link a,
.text-link a:hover {
	color: #36a6e9;
	text-decoration: underline;
}

.style-clear {
	clear: both;
}

.spacing-pb3 {
	padding-bottom: calc(0.125vw + 0.6px);
	/*3px;*/
}

.spacing-pt10 {
	padding-top: calc(0.25vw + 5.2px);
	/*10px;*/
}

.spacing-pt20 {
	padding-top: calc(0.5vw + 10.4px);
	/*20px;*/
}

.spacing-pt15 {
	padding-top: calc(0.375vw + 7.8px);
	/*15px;*/
}

.spacing-pt25 {
	padding-top: calc(0.625vw + 13px);
	/*25px;*/
}

.spacing-pt35 {
	padding-top: calc(0.8750000000000001vw + 18.2px);
	/*35px;*/
}

.spacing-pt40 {
	padding-top: calc(0.9375vw + 22px);
	/*40px;*/
}

.spacing-pt45 {
	padding-top: calc(1.0625vw + 24.6px);
	/*45px;*/
}

.spacing-pt67 {
	padding-top: calc(1.625vw + 35.8px);
	/*67px;*/
}

.spacing-pt73 {
	padding-top: calc(1.7500000000000002vw + 39.4px);
	/*73px;*/
}

.spacing-pt85 {
	padding-top: calc(2vw + 46.6px);
	/*85px;*/
}

.spacing-pt95 {
	padding-top: calc(2.25vw + 51.8px);
	/*95px;*/
}

.spacing-pb4 {
	padding-bottom: calc(0.125vw + 1.6px);
	/*4px;*/
}

.spacing-pb7 {
	padding-bottom: calc(0.1875vw + 3.4px);
	/*7px;*/
}

.spacing-pb10 {
	padding-bottom: calc(0.25vw + 5.2px);
	/*10px;*/
}

.spacing-pb15 {
	padding-bottom: calc(0.375vw + 7.8px);
	/*15px;*/
}

.spacing-pb20 {
	padding-bottom: calc(0.5vw + 10.4px);
	/*20px;*/
}

.spacing-pb23 {
	padding-bottom: calc(0.5625vw + 12.2px);
	/*23px;*/
}

.spacing-pb30 {
	padding-bottom: calc(0.75vw + 15.6px);
	/*30px;*/
}

.spacing-pb37 {
	padding-bottom: calc(0.8750000000000001vw + 20.2px);
	/*37px;*/
}

.spacing-pb40 {
	padding-bottom: calc(0.9375vw + 22px);
	/*40px;*/
}

.spacing-pb45 {
	padding-bottom: calc(1.0625vw + 24.6px);
	/*45px;*/
}

.spacing-pb47 {
	padding-bottom: calc(1.125vw + 25.4px);
	/*47px;*/
}

.spacing-pb50 {
	padding-bottom: calc(1.1875vw + 27.2px);
	/*50px;*/
}

.spacing-pb57 {
	padding-bottom: calc(1.375vw + 30.6px);
	/*57px;*/
}

.spacing-pb70 {
	padding-bottom: calc(1.6875vw + 37.6px);
	/*70px;*/
}

.spacing-pb75 {
	padding-bottom: calc(1.8124999999999998vw + 40.2px);
	/*75px;*/
}

.spacing-pb90 {
	padding-bottom: calc(2.125vw + 49.2px);
	/*90px;*/
}


/*調整標題後的padding*/


/* .spacing-title1{
	padding-top:calc(2.1875vw + 23px);
	padding-bottom:calc(0.625vw + 13px);
} */


/*標題一*/


/* .spacing-title2{
	padding-top:calc(2.1875vw + 23px);
	padding-bottom:calc(0.375vw + 7.8px);
} */


/*標題一*/

.spacing-title1 {
	padding-top: calc(2.5vw + 32px);
	padding-bottom: calc(2.1875vw + 28px);
}

.spacing-title2 {
	padding-top: calc(2.1875vw + 28px);
	padding-bottom: 25px;
}

.spacing-ml-17-mb-2 {
	margin-left: calc(-0.43750000000000006vw + -8.6px);
	/*-17px;*/
	margin-bottom: -2px;
}

.spacing-mr80 {
	margin-right: calc(1.875vw + 44px);
	/*80px;*/
}

.spacing-ml40 {
	margin-left: calc(0.9375vw + 22px);
	/*40px;*/
}


/*-----80 px------ */
.rl-row-80 {
	padding-top: calc(2.5vw + 32px);
	padding-bottom: calc(2.5vw + 32px);
}

.rl-row-top-80 {
	padding-top: calc(2.5vw + 32px);
}

.rl-row-bottom-80 {
	padding-bottom: calc(2.5vw + 32px);
}

/*-----40 px------ */
.rl-row-40 {
	padding-top: calc(1.5vw + 10px);
	padding-bottom: calc(1.5vw + 10px);
}

.rl-row-top-40 {
	padding-top: calc(1.5vw + 10px);
}

.rl-row-bottom-40 {
	padding-bottom: calc(1.5vw + 10px);
}

#rl-about-nav.affix,
#rl-about-nav.affix-top {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 50;
}

@media screen and ( max-width: 768px) {
	.nss-img {
		margin-bottom: 30px;
	}
}