@charset "utf-8";
/* CSS Document */
body {
	background:#18242e;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font-family: '微軟正黑體', sans-serif;
	position:relative;
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;}
h1, h2, h3, h4, h5 {
	font-weight:bold;}
h4 {
	font-size:36px;}
img {
	margin:0 auto;}
.frame-content {
	position:fixed;
	width:100%;
	height: auto;
	z-index:1000;
	box-sizing:border-box;}
.frame-content iframe {
	width:100%;
	height:100%;}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;}
.video-container iframe, .video-container object, .video-container embed {
	position: absolute;
	top: 0;
	bottom:0;
	left: 0;
	right:0;
	margin:0 auto;
	width: 80%;
	height: 80%;}
.hr-unpinned {
	top:-66px;}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
	background-color:transparent;}
.navbar-default {
	background:url(../images/top_bg.png) no-repeat center bottom;
	background-color:#000;}
.navbar {
	min-height:66px;
	margin-bottom:0px;}
.navbar-header {
	margin-top:0px;}
.navbar-header span a{
	display:none;
	color:#fff;
	font-size:20px;
	float:right;
	margin:10px 13px 0 3px;
	text-decoration:none;}
.navbar-header span a:hover{
	color:#FC3;}
.navbar-fixed-top {
	border-width:0;}
.navbar-header {
	margin-top:0px;}
.navbar-brand {
	padding:0;}
#bs-example-navbar-collapse-1 .nav li:nth-child(4) {
	display:none;}
.nav .vline {
	color:#FFF;
	font-weight:bold;
	margin-top:-2px;}
@media (min-width: 768px) {
	.navbar > .container-fluid .navbar-brand {
	margin-left:0;}
	.navbar-nav {
		margin: 10px 15px 0 0;}
	.carousel-indicators {
		bottom:-40px;}
	.nav-tabs.nav-justified > li > a{
		border-bottom:1px solid #00fff0;}
	.nav-tabs.nav-justified > li > a:hover{
		border-bottom:1px solid #00fff0;}
	.dropdown:hover .dropdown-menu {
		display: block;}}
.container-fluid {
	padding-right:0px;
	padding-left:0px;}
.slogon {
	float:left;
	width:246px;
	height:66px;
	margin-left:10px;
	background:url(../images/nusoft_title.png) no-repeat;
	animation:slogon 1s linear none;}
@keyframes slogon{0%{transform:scale(1) rotateX(0)}50%{transform:scale(2) rotateX(-180deg)}100%{transform:scale(1) rotateX(-360deg)}}
.navbar-default .navbar-nav > li > a {
	color:#FFF;}
.navbar-nav > li > a {
	padding-top: 20px;
  	padding-bottom: 0px;}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	color:#ffc600;}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
	color:#ffc600;
	background-color:#000;}
/*.navbar {
	margin-bottom:0;}
.navbar-nav {
	float:right;}
.navbar-fixed-top .navbar-collapse {
	max-height:none;}
.navbar-default {
	background:#000;
	opacity:0.7;
	width:95%;
	margin:0 auto;
	border-bottom:none;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;}
.navbar-collapse {
	border-top:none;
	-web-kit-box-shadow:none;
	box-shadow:none;}
.navbar-default .navbar-collapse {
	border-color:transparent;}
.dropdown-menu {
	background-color:#000;}
.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover {
	background-color:transparent;}
.navbar-default .navbar-nav li a {
	color:#FFF;}
.navbar-default .navbar-nav li a:hover {
	color:#FC3;}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus {
	color:#FFF;
	background-color:transparent;}
.navbar-default .navbar-nav .open .dropdown-menu li a {
	color:#FFF;}
.navbar-default .navbar-nav .open .dropdown-menu li a:hover {
	color:#FC3;}*/
#top {
	background:url(../images/app_theme.png) fixed no-repeat;
	background-size:contain;
	width:100%;
	height:536px;
	position:relative;
	z-index:20;}
#tab1 {
	width:100%;
	height:100%;
	background:#18242e;
	padding:7% 0 10% 0;}
.feature {
	width:80%;
	margin:0 auto;}
.feature .wow {
	color:#fff;
	padding:6% 0;
	float:right;
	transition:all 0.5s;}
.feature .wow:hover {
	color:#00fff0;
	transform:scale(1.1);}
.feature .wow:nth-child(1) {
	background:url(../images/feature_bg1.png) no-repeat left center;}
.feature .wow:nth-child(2) {
	background:url(../images/feature_bg2.png) no-repeat left center;}
.feature .wow:nth-child(3) {
	background:url(../images/feature_bg3.png) no-repeat left center;}
.feature .wow:nth-child(4) {
	background:url(../images/feature_bg4.png) no-repeat left center;}
.feature .wow:nth-child(5) {
	background:url(../images/feature_bg5.png) no-repeat left center;}
.feature .wow h2 {
	float:right;
	width:53%;}
.feature .wow p {
	width:53%;
	font-size:2.5vmin;
	float:right;
	clear:both;
	text-align:justify;}
/*.service {
	padding:2%;
	margin:5% 10%;
	border:5px solid #00ffe4;
	border-radius:10px;
	color:#FFF;
	transition:all 0.5s;}
.service:hover {
	transform:scale(1.2);
	color:#00ffe4;
	box-shadow:0px 0px 15px #00ffe4;}
.service h3 {
	text-align:center;
	margin:10px 0;}
.service span {
	display:block;
	margin:10px;}*/
#tab2, #tab3, #tab4, #tab5, #tab6, #tab7 {
	width:100%;
	height:100%;
	background:url(../images/app_index_bgtransition1.png) repeat-x top #1f516e;
	padding:25% 0 15% 0;}
#tab2 .intro, #tab3 .intro, #tab4 .intro, #tab5 .intro, #tab6 .intro, #tab7 .intro {
	padding:5%;
	margin:10% 0 5% 0;
	background:#a0b7ec38;
	font-size:2vmin;
	min-height:200px;}
#tab2 .wow-img:nth-child(1), #tab3 .wow-img:nth-child(1), #tab4 .wow-img:nth-child(1), #tab5 .wow-img:nth-child(1), #tab6 .wow-img:nth-child(1), #tab7 .wow-img:nth-child(1) {
	position:absolute;
	z-index:1;
	margin: -25% 0 0 10%;}
#tab2 .wow-img:nth-child(2), #tab3 .wow-img:nth-child(2), #tab4 .wow-img:nth-child(2), #tab5 .wow-img:nth-child(2), #tab6 .wow-img:nth-child(2), #tab7 .wow-img:nth-child(2) {
	position:absolute;
	z-index:0;
	margin: 6% -12% 0 0;}
.service-title {
	color:#fff;
	font-size:4vmin;}
.carousel-inner {
	color:#fff;}
.carousel-indicators {
	left:4%;}
#tab3 {
	background:url(../images/app_index_bgtransition2.png) repeat-x top #44235a;}
#tab3 .intro {
	background:#dfa0ec38;}
#tab4 {
	background:url(../images/app_index_bgtransition3.png) repeat-x top #541f3f;}
#tab4 .intro {
	background:#eca0c738;}
#tab5 {
	background:url(../images/app_index_bgtransition4.png) repeat-x top #1f516e;}
#tab6 {
	background:url(../images/app_index_bgtransition2.png) repeat-x top #44235a;}
#tab6 .intro {
	background:#eca0c738;}
#tab7 {
	background:url(../images/app_index_bgtransition3.png) repeat-x top #541f3f;}
#tab7 .intro {
	background:#eca0c738;}
.link a {
	width:30%;
	height:35%;
	color:#fff;
	font-weight:bold;
	font-size:3vmin;
	position:absolute;
	right: 2%;
    bottom: -40%;
	transition:all 0.3s;
	background:url(../images/service_linkbtn_bg.png) no-repeat right;
	background-size:contain;
	opacity:0.5;}
.link a:hover, #tab3 .link a:hover {
	color:#fff;
	text-decoration:none;
	opacity:1;}
#caseshare .nav li a:after {
	content:"";
	display:none;}
#caseshare .nav li a:hover:after {
	content:"";
	display:none;}
#caseshare-top {
	background:url(../images/app_caseshare_topbg.png) no-repeat center;
	background-size:cover;
	height:248px;
	margin-top:46px;}
#caseshare {
	width:80%;
	color:#000;
	padding:5%;}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	color:#00fff0;
	background-color:transparent;}
.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
	border:1px solid #00fff0;
	border-bottom:none;}
.nav-tabs > li.active > a {
	color:#00fff0;}
.nav-tabs > li > a {
	border:none;}
.nav-tabs > li > a:hover {
	color:#00fff0;
	background-color:transparent;}
.nav-justified > li > a {
	color:#6e7b86;}
#caseshare .caret {
	border-top:8px dashed #36a57d;
	border-right:5px solid transparent;
	border-left:5px solid transparent;
	margin-left:7px;}
#caseshare #web a:hover {
	cursor:default;}
#caseshare h2 {
	margin-top:0;
	color:#0CF;}
#caseshare p {
	font-size:2.5vmin;
	color:#FFF;
	text-align:justify;
	margin-bottom:7%;}
#myTabContent {
	width:100%;
	margin-top:3%;
	padding:1% 4%;
	font-size:1.6vmin;}
#myTabContent .wow {
	margin:2% 4%;
	text-align:center;
	color:#FFF;
	text-decoration:none;
	padding:0 0 5px 0;
	border:1px solid #979b9e;
	transition:all 0.5s;}
#myTabContent .wow:hover {
	transform:scale(1.05);}
#myTabContent a img {
	width:100%;}
#myTabContent a {
	color:#fff;}
#myTabContent a:hover {
	color:#ffc600;
	text-decoration:none;}
#myTabContent a:before {
	content:"";
	border:1px solid #ffc600;
	background:#ffc6002e;
	display: block;
    position: absolute;
    width: 100%;
    height: 100%;
	opacity:0;
	transition:all 0.5s;}
#myTabContent a:hover:before {
	opacity:1;}
#case-top {
	background:url(../images/app_caseshare_casebg.png) no-repeat center;
	background-size:cover;
	height:248px;
	margin-top:46px;}
.case-name {
	display:block;
	color:#fff;
	font-size: 4vmin;
    letter-spacing: 1vmin;
    font-weight: bold;
    float: left;
    margin: 11% 0 0 7%}
#case {
	width:70%;
	margin:5% auto;}
#case img {
	width:100%;}
.footer {
	background:#000;
	color:#FFF;
	text-align:center;
	padding:2% 0 4% 0;}
.fb_btn a{
	width:59px;
	height:60px;
	background:url(https://www.nusoft.com.tw/images/fb_btn.png) no-repeat;
	background-size:contain;
	display:block;
	float:left;
	margin:2% 0 0 4%;
	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;}
.fb_btn a:hover {
	opacity:0.6;}
.mail_btn a{
	width:59px;
	height:60px;
	background:url(https://www.nusoft.com.tw/images/mail_btn.png) no-repeat;
	background-size:contain;
	display:block;
	float:left;
	margin:2% 0;
	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;}
.mail_btn a:hover {
	opacity:0.6;}
.tel_btn a{
	width:44px;
	height:44px;
	background:url(../../images/tel_btn.png) no-repeat;
	background-size:cover;
	display:none;
	float:right;
	position:relative;
	top:3px;
	margin:0 10px 0 0;
	-webkit-border-radius: 44px;
	-moz-border-radius: 44px;
	border-radius: 44px;
	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;}
.tel_btn a:hover {
	background-color:#43bf00;}
.contactus {
	width:66px;
	height:66px;
	background:url(https://www.nusoft.com.tw/tw/product_info/app/images/contactus.png) no-repeat;
	background-size:cover;
	cursor: pointer;
	opacity:0.7;
	position:fixed;
	z-index:20;
	right: 5%;
	bottom: 15%;
	display: none;
	transition:all 0.3s;}
.toTop-arrow {
	width:66px;
	height:66px;
	background:url(https://www.nusoft.com.tw/tw/product_info/app/images/gototop.png) no-repeat;
	background-size:cover;
	cursor: pointer;
	opacity:0.7;
	position:fixed;
	z-index:10;
	right: 5%;
	bottom: 5%;
	display: none;
	transition:all 0.3s;}
@media (min-width: 1400px){
	#top {
		background:url(../images/app_theme.png) fixed no-repeat top center;
		background-size:auto;}
	#tab1 {
		width:80%;}
	#tab2, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7 {
		padding:10% 0;}
	#tab2 .intro, #tab3 .intro, #tab4 .intro, #tab5 .intro, #tab6 .intro, #tab7 .intro {
		font-size:3vmin;}
	#tab2 .wow-img:nth-child(1), #tab3 .wow-img:nth-child(1), #tab4 .wow-img:nth-child(1), #tab5 .wow-img:nth-child(1), #tab6 .wow-img:nth-child(1), #tab7 .wow-img:nth-child(1) {
		margin: -5% 0 0 17%;}
	#tab2 .wow-img:nth-child(2), #tab3 .wow-img:nth-child(2), #tab4 .wow-img:nth-child(2), #tab5 .wow-img:nth-child(2), #tab6 .wow-img:nth-child(2), #tab7 .wow-img:nth-child(2) {
		margin: 22% 0% 0 0;}
	.link a {
		font-size:4vmin;
		right: 2%;}
	#caseshare-top, #case-top {
		background-size:contain;}
	#caseshare {
		width:70%;}
	#case {
		width:60%;}
	.case-name {
		margin: 8% 0 0 21%;}
	#case img {
		width:auto;}}
@media (min-width: 1200px) and (max-width: 1599px){
	}
@media (min-width: 1081px) and (max-width: 1199px){
	#tab7 .row div {
		font-size:3vmin;
		height:263px;}}
@media (min-width: 992px) and (max-width: 1080px){
	}
@media (min-width: 768px) and (max-width: 991px){
	}
@media (max-width: 767px) {
	.navbar-nav {
		float:left;}
	.navbar-header span a{
		display:block;}
	.nav>.nav_contact {
		display:none;}
	.dropdown-submenu .dropdown-menu>li>a{
		margin-left:20px;}
	.navbar-default .navbar-nav>li>a {
		line-height:1.5em;}
	.navbar-nav .open .dropdown-menu>li>a {
		line-height:1.5em;}
	.nav .vline {
		display:none;}
	.navbar-default .navbar-nav .open .dropdown-menu > li > a {
		color:#fff3b9;}
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
		color:#b9f2ff;}
	.tel_btn a{
		display:block;}
	.contactus {
		bottom:14%;}
	}
@media (max-width: 480px) {
	.navbar-nav {
		font-size:20px;}
	.dropdown-menu {
		font-size:18px;}
	.fb_btn a {
		float:none;
		margin:77px auto 0 auto;}
	.mail_btn a {
		float:none;
		margin:14px auto 0 auto;}
	nav .mail_btn a {
		float:right;
		margin:0;}
	.tel_btn a{
		display:block;}
	}