@charset "UTF-8";

@media screen  and (max-width:1014px){
    .test-nav{
      display: none;
    }
  }
  @media screen and (min-wdth:1014px) {
    .test-nav{
     display: inline-block;
    }
    
  }
  @media screen  and (max-width:1014px){
    .test-nav2{
      display: inline-block;
    }
  }
  @media screen  and (min-width:1014px){
    .test-nav2{
      display: none;
    }
  }
/*navbar dropdown start*/
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .nav-link{   }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
	.navbar .nav-item .dropdown-menu{ margin-top:0; }
}	
/* ============ desktop view .end// ============ */
@media all and (max-width: 992px){
	.dropdown-menu{
		border: none;
		background-color: rgba(0,0,0,0.00);
	}
	.dropdown-item{
/*		color: white;*/
		color: #212529;
		font-weight: 600;
	}
}
/*navbar dropdown end*/
.ntnu-bg{
/*    background-image: url('../images/pageBg.png');*/
    background-repeat: no-repeat;
    background-position: top;
/*    background-color: #f2f2f2;*/
    background-size: 100%;
}

/* header */
.ntnu-nav-top{
    height: 60px;
    background: #4E070B;
}
.ntnu-nav-dark{
    background: #4E070B;
}
.school-nav-orange{
/*    background: #eca355;*/
	background: #009da0;
}

.school-nav-light{
    background: #ffffff;
}

.ntnu-nav-brick{
    background: #840000;
}

.ntnu-nav-brick .nactive{
    background: #990000;
}
.ntnu-h-top{
	font-size: 20px;
	line-height: 2;
}
/* 蓋掉bs預設 */
.navbar-dark .navbar-nav .nav-link{
    color: white;
}

.navbar-light .navbar-nav .nav-link{
    color: #000000;
}
a{
    color:#009da0 ;
    text-decoration: none;
}
a:hover{
    color: #f3bb32;
}

/*lesson card */
.lesson-card{
/*	border-radius:5px;*/
	box-shadow:0px 0px 5px 1px #3333333d;
}
.lesson-card-img{
	height:210px;
	overflow:hidden;
	display: flex;
	align-items: center;
	background: #f9f9f9;
}
.lesson-card>.lesson-card-img>img{
	width: 100%
}


/*media card */
.media-card{
/*	border-radius:5px;*/
/*	box-shadow:0px 0px 5px 1px #3333333d;*/
}
.media-title{
	color: #939393;
}
.media-title2{
	height: 2.5em;
	overflow: hidden;
	word-break: break-all;
}
.media-card:hover .media-title{
	color: #009da0;
}
.media-badge{
	display:inline-block;
/*	padding: 0.35em 0.65em;*/
	font-size: 0.75em;
	font-weight: 700;
	line-height: 1;
	color: #858585;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 0.25rem;
/*	background: #858585;*/
	margin-bottom: 2px;
	
}
.media-card:hover .media-title>.media-badge{
	color: #009da0;
}
.media-card-img{
	height:320px;
	overflow:hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	background: #f9f9f9;
	border: solid 0.8px #bbd4d5;
}
.media-card>.media-card-img>img{
	width: 100%
}



.nav-pills .nav-link.active, .nav-pills .show > .nav-link{
/*    background-color: #840000;*/
/*	background-color: #f3bb32;*/
	background-color: #fac449;
	font-weight: 600;
}

.school-btn-y{
/*	background-color: #f3bb32;*/
	background-color: #fac449;
	font-weight: 600;
	font-size: 22px;
	border-radius: 50px;
	padding-left: 30px;
	padding-right: 30px;
	border:none;
	color: white;
}

.nav-link{
    color: #840000;
}
/*蓋掉bs 預設*/
.dropdown-item.active, .dropdown-item:active{
/*	background-color:#990000;*/
	background-color:#eca355;
}
/*蓋掉bs 預設 banner*/
.carousel .carousel-item{
	max-height: 388px;
/*	max-height: 550px;*/
}

.carousel-inner>.carousel-item>img{
	position: absolute;
	top:0;
	left: 0;
	min-width: 100%;
	height: 388px;
}
/*index 系統連結*/
.link-img{
	width: 100%;
	transition: box-shadow 0.6s,filter 0.6s;
}
.link-img:hover{	
	box-shadow: 5px 5px 20px 5px rgba(0,0,0,0.3);
    filter: brightness(1.1);
}
.link-up{
	display: inline-block; 
	height: 150px;
	width: 150px;
	border-radius: 50%;
	transition-duration: 0.6s;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.link-up:hover{
/*	transform:  scale(1.2);*/
	transform: translate(0,-10px);
	color: greenyellow;
}
/* news */
.ntnu-news{
    border: 1px solid;
    border-radius: 5px;
    padding: 15px;
    background-color: white;
}

.school-news{
/*    border: 1px solid;*/
/*    border-radius: 5px;*/
    padding: 15px;
    background-color: #ededed;
}



/*蓋掉bs預設 手風琴*/
.accordion-button:not(.collapsed){
    color:#4E070B ;
    background-color: #fbeeee;
}
.accordion-button:focus{
    border-color: #840000;
    box-shadow: 0 0 0 0.25rem rgb(119 12 18 / 29%);
}
/*蓋掉bs預設 list-group-flush*/
.list-group-flush > .list-group-item:last-child{
	border-bottom-width: 1px;
}
.list-group-item{
	background-color: #ededed;
}

/*asideleft*/
.ntnu-asidel{
	color:#840000;
	font-size: 20px;
}
.ntnu-asidel.active{
	background: #840000;
	color: white;
	width: 85%;
/*	padding-left:20%;*/
/*	padding-right: 20%;*/
	font-size:20px;
}

/* form law */
.ntnu-formspan{
	display: inline-block; 
	width: 60%;
	font-size: 18px;
	color: #555
}
.ntnu-formfile{
	display: inline-block;
	float: right
}
.ntnu-formfileimg{
	width: 45px;
}

.ntnu-law{
	min-height: 62px
}
.ntnu-lawlink{
	font-size: 18px;
	color: #555
}
/*a mailto*/
a.mailto{
	color: white;
}
a.mailto:hover{
	color: white;
}

/*蓋掉bs預設 pagination */
.page-link{
	color: #009da0;
}
.page-link:focus{
	color: #009da0;
	box-shadow: 0 0 0 0.25rem rgb(0 157 160 / 20%);
}
.page-link:hover{
	color: #009da0;
}
.page-item.active .page-link{
	background-color:#009da0;
	border-color: #006a73;
}

/*alert*/
.alert-light a{
	color: #333333;
}
.alert-light:hover {
	box-shadow: 0 0 12px 1px #9e9e9e70;
}
.alert-light:hover a{
	color: #009da0;
}


/*首頁 宣傳文字區*/
.school-atext{
	font-weight: 600;
	color: #006a73;
	
}
.school-aicon{
	font-size: 60px;
	display: block;
	transition: 0.8s;
}
.school-ablock{
	background: #f7f9fb;
	border: solid 1px #e3e3e3;
}
.school-ablock:hover {
	background: white;
	
}

.school-ablock:hover .school-aicon{
	transform: translateY(-10px);
}

.school-aniblock{
  position: relative;
  flex: 1 1 33.333%;
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
  align-items: flex-start;
  padding: 180px 30px;
  background: #fac449;
  color: #FFFFFF;
  overflow: hidden;
}

.school-aniblock::after{
  animation:slide 10s ease-in-out infinite alternate;
/*  background-image: linear-gradient(-70deg, #fac449 50%, #372C2C 50%);*/
  background-image: linear-gradient(-70deg, #fac449 50%, #b5a58c 50%);
  bottom:0;
  left:-50%;
  opacity:.3;
  position:absolute;
  right:-50%;
  top:0;
  z-index:1;
  content: '';	
	
}

.school-aniblock::before{
  animation:slide 5s ease-in-out infinite alternate;
/*  background-image: linear-gradient(-70deg, #fac449 50%, #372C2C 50%);*/
  background-image: linear-gradient(-70deg, #fac449 50%, #b5a58c 50%);
  bottom:0;
  left:-50%;
  opacity:.2;
  position:absolute;
  right:-50%;
  top:0;
  z-index:1;
  content: '';
	
}
/*aniblock 藍黃配色*/
/*
.school-aniblock::before{
  animation:slide 5s ease-in-out infinite alternate;
  background-image: linear-gradient(-70deg, #009da0 50%, #fac449 50%);
  bottom:0;
  left:-50%;
  opacity:0;
  position:absolute;
  right:-50%;
  top:0;
  z-index:1;
  content: '';
	
}

.school-aniblock::after{
  animation:slide 10s ease-in-out infinite alternate;
  background-image: linear-gradient(-70deg, #ffffff 50%, #c5c5c5 50%);
  bottom:0;
  left:-50%;
  opacity:.3;
  position:absolute;
  right:-50%;
  top:0;
  z-index:1;
  content: '';	
	
}

*/
@keyframes slide {
  0% {
    transform:translateX(-25%);
  }
  100% {
    transform:translateX(25%);
  }
}
/* btn zzgr */
.btn-zzgr{
	color: #fff;
	background-color:#389f93;
	border-color:#389f93;	
}
.btn-zzgr:hover{
	color: #fff;
	background-color:#006a73;
	border-color:#006a73;
}
.btn-check:checked + .btn-zzgr, .btn-check:active + .btn-zzgr, .btn-zzgr:active, .btn-zzgr.active, .show > .btn-zzgr.dropdown-toggle{
	color: #fff;
	background-color:#006a73;
	border-color:#006a73;
}
.btn-check:checked + .btn-zzgr:focus, .btn-check:active + .btn-zzgr:focus, .btn-zzgr:active:focus, .btn-zzgr.active:focus, .show > .btn-zzgr.dropdown-toggle:focus{
	box-shadow:0 0 0 0.25rem rgba(56, 159, 147, 0.5);
}
/*videobox*/
.videobox{
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}
.videobox iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}