/*
[Reference]
http://www.nicdarkthemes.com/themes/children/wp/demo/
http://kiddy.cwsthemes.com/
https://demo.themeum.com/wordpress/kidzy/
http://demo.hot-themes.com/wordpress/kindergarten/
http://demo.cmssuperheroes.com/themeforest/wp-kindergarten/
https://www.uihere.com/free-cliparts/search?q=children
*/


html,
body { height: 100%; }
body {
	background-attachment: fixed;
	background-color: #54c9ff;
	background-image: url(../img/bg.jpg);
	background-position: right bottom -10px;
	background-repeat: no-repeat;
	background-size: 100% auto;
	color: #555;
	font-family: 'Sniglet', 'Microsoft JhengHei', cursive;
	font-weight: 500;
	overflow-x: hidden;
	position: relative;
}
body[data-controller=home] { background-attachment: scroll; }
/* general */
.btn { border-radius: 1rem; }
.btn-primary { border-bottom: solid 5px rgba(0,0,0,.2); }
.well,
.card,
.img-thumbnail { border-radius: 10px; }
.card-header { border-radius: 10px 10px 0 0; }
.card-footer { border-radius: 0 0 10px 10px; }
.img-thumbnail { border: solid 1px #ddd; }
table:not(.table-condensed) th,
table:not(.table-condensed) td { padding: 10px; }
/* breadcrumb */
ul.breadcrumb {
	background: none;
	font-size: 2rem;
	padding: 0;
}
ul.breadcrumb li:first-child,
ul.breadcrumb li:nth-child(2)::before { display: none; }
ul.breadcrumb li::before {
	content: ' > ';
	display: inline-block;
	margin: 0 .4rem 0 .2rem;
}
ul.breadcrumb li,
ul.breadcrumb li.active,
ul.breadcrumb li::before { color: #555; }
ul.breadcrumb li,
ul.breadcrumb li > a {
	border: 0;
	text-decoration: none;
	text-shadow: 
		-1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white,
		-1px  0px 0 white, 0px -1px 0 white,  0px 1px 0 white, 1px 0px 0 white,
		-2px  0px 0 white, 0px -2px 0 white,  0px 2px 0 white, 2px 0px 0 white,
		-2px -2px 0 white, 2px -2px 0 white, -2px 2px 0 white, 2px 2px 0 white;
}
/* heading */
h1 { font-size:  3.2rem; }
h2 { font-size:  2.4rem; }
h3 { font-size:  1.6rem; }
h4 { font-size:  1.2rem; }
h5 { font-size:    1rem; }
h6 { font-size:   .8rem; }




/**
 *
 *  HEADER
 *
 **/
#header {
	background: transparent !important;
	border: none;
	display: block;
	font-size: 1.8rem;
	padding: 0;
	position: relative;
	z-index: 10;
}
/* brand */
#header { float: none; }
#header .navbar-brand {
	display: block;
	height: 100px;
	left: 50%;
	position: relative;
	transform: translateX(-50%);
	width: 750px;
	z-index: 1;
}
/* brand : logo */
#header .navbar-brand::after {
	background-image: url(../img/logo_green.png);
	background-size: 100% 100%;
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 100%;
	bottom: -15px;
	content: '';
	display: block;
	height: 105px;
	left: 0;
	position: absolute;
	width: 105px;
	z-index: 1;
}
/* brand : chinese name */
#header .navbar-brand .chi-name {
	background-image: url(../img/logo_name_c_wide.png);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: bottom center;
	bottom: 22px;
	content: '';
	color: rgba(255,255,255,.0001);
	display: block;
	font-size: 1px;
	height: 70px;
	left: 40px;
	position: absolute;
	width: 100%;
	z-index: 1;
}
/* brand : english name */
#header .navbar-brand .eng-name {
	background-image: url(../img/logo_name_e_nowrap.png);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: bottom center;
	bottom: -10px;
	content: '';
	color: rgba(255,255,255,.0001);
	font-size: 1px;
	display: block;
	height: 24px;
	left: 40px;
	position: absolute;
	width: 100%;
	z-index: 1;
}




/**
 *
 *  NAV
 *
 **/
#nav,
#nav .navbar-nav { flex-direction: column; }
#nav a {
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}
/* main nav */
#nav .navbar-nav.left { 
	display: block;
	background: white;
	box-shadow: 0 1px 3px rgba(0,0,0,.1);
	float: none;
	font-size: 1.1rem;
	margin-bottom: 0 !important;
	width: 100%;
	text-align: center;
}
#nav .navbar-nav.left > li {
	display: inline-block;
	margin-right: -3px !important;
}
#nav .navbar-nav.left > li > a {
	border-color: transparent;
	border-style: solid;
	border-width: 0 0 3px 0;
	color: #337ab7;
	display: block;
	font-weight: 500;
	height: 80px;
	padding: 30px .75rem 0 .75rem;
}
#nav .navbar-nav.left > li > a:hover { background-color: #eee; }
#nav .navbar-nav.left > li.active > a { border-color: #337ab7; }
/* special notice */
#nav .navbar-nav.right {
	display: block;
	font-size: 1rem;
	margin: .75rem 0 0 0 !important;
	text-align: right;
	width: 1100px;
}
#nav .navbar-nav.right > li {
	display: inline-block;
	vertical-align: bottom;
}
#nav .navbar-nav.right > li > a {
	background: #fb6b47;
	border-bottom: solid 5px rgba(0,0,0,.2);
	border-radius: .5rem;
	color: white;
	padding: .25rem .75rem;
	position: relative;
}
#nav .navbar-nav.right > li > a:hover { background: #eb5b37; }




/**
 *
 *  SIDEBAR
 *
 **/
.tab-layout .tab-nav { padding-left: 0; }
.tab-layout .tab-nav > .nav {
	background-image: url(../img/roll_middle.png);
	background-repeat: repeat-y;
	background-position: bottom left;
	background-size: 100% auto;
	padding-top: 40px;
	position: relative;
	top: 0;
}
.tab-layout .tab-nav > .nav::before,
.tab-layout .tab-nav > .nav::after {
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 100% auto;
	content: '';
	display: block;
	left: 0;
	position: absolute;
	width: 100%;
}
.tab-layout .tab-nav > .nav::before {
	background-image: url(../img/roll_top.png);
	background-position: top left;
	height: 40px;
	top: -2px;
}
.tab-layout .tab-nav > .nav::after {
	background-image: url(../img/roll_bottom.png);
	background-position: top left;
	bottom: -55px;
	height: 55px;
}
.tab-layout .tab-nav > .nav > li { margin: 0 !important; }
.tab-layout .tab-nav > .nav > li > a {
	background: none;
	color: #555;
	font-size: 1.8rem;
	font-weight: 500;
	padding: .5rem 0 .5rem 2rem;
	position: relative;
}
.tab-layout .tab-nav > .nav > li > a:active,
.tab-layout .tab-nav > .nav > li > a:focus,
.tab-layout .tab-nav > .nav > li > a:hover,
.tab-layout .tab-nav > .nav > li > a.active { color: #c00; }
.tab-layout .tab-nav > .nav > li > a.active { background: url(../img/underline.png) no-repeat 1.9rem bottom; }




/**
 *
 *  PAGE HEADER
 *
 **/
#content .page-header,
#album-view header {
	font-weight: bold;
	border: 0;
	color: #337ab7;
	margin-top: 0;
	text-shadow: 
		-1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white,
		-1px  0px 0 white, 0px -1px 0 white,  0px 1px 0 white, 1px 0px 0 white;
}
.page-header.fa-4x { font-size: 7rem; }
.page-header.fa-3x { font-size: 6rem; }
.page-header.fa-2x { font-size: 5rem; }
.page-header.fa-lg { font-size: 4rem; }




/**
 *
 *  CONTENT
 *
 **/
#content {
	font-size: 1.4rem;
	min-height: calc(100vh - 180px - 81px); /* window - header - footer */
	padding-bottom: 5rem;
}
body[data-controller=home] #content { padding-bottom: 0; }
/* carousel */
#home-slider {
	height: calc(100vh - 180px);
	position: relative;
}
#home-slider > .carousel-inner { height: 100%; }
#home-slider > .carousel-inner > .carousel-item {
	height: 100%;
	padding: 30px 0 50px 0;
}
#home-slider > .carousel-inner > .carousel-item img {
	height: 100%;
	max-height: calc(100vh - 280px);
}
#home-slider .carousel-control-prev,
#home-slider .carousel-control-next { text-shadow: 0 0 3px rgba(0,0,0,.5); }
#home-slider .carousel-control-prev-icon,
#home-slider .carousel-control-next-icon {
	height: auto;
	top: 50%;
	transform: translateY(-50%);
	width: auto;
}
/* cover : children */
#home-cover {
	height: calc(100vh - 180px);
	position: relative;
}
#home-cover-children {
	bottom: calc(100vw * .6 * .34 / 3.2);
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
}
/* cover : ray */
#home-cover::before {
	animation-name: shining, rotating;
	animation-duration: 8s;
	animation-iteration-count: infinite;
	background: url(../img/ray.png) no-repeat bottom center;
	background-size: 100% auto;
	bottom: calc(100vw * .6 * .35 / 2);
	content: '';
	display: block;
	height: calc(100% + 180px);
	left: -10%;
	opacity: .2;
	position: absolute;
	transform-origin: bottom center;
	width: 120%;
}
@keyframes shining {
	0%   { opacity: .3; }
	50%  { opacity: .1; }
	100% { opacity: .3; }
}
@keyframes rotating {
	0%   { transform: rotate( 1.2deg); }
	25%  { transform: rotate(-1.2deg); }
	50%  { transform: rotate( 1.2deg); }
	75%  { transform: rotate(-1.2deg); }
	100% { transform: rotate( 1.2deg); }
}
/* home */
#home-index {
	background: url(../img/bg_cloud.jpg) center top;
	position: relative;
	-webkit-animation: slide 45s linear infinite;
}
@-webkit-keyframes slide {
	  0% { background-position:     0 0; }
	 50% { background-position: 120px 0; }
	100% { background-position:     0 0; }
}
/* home : zigzag */
#home-index { margin-top: 20px; }
#home-index::before,
#home-index::after {
	background-position: top left;
	background-repeat: repeat-x;
	background-size: 20px 30px;
	content: '';
	display: block;
	height: 20px;
	position: absolute;
	left: 0;
	top: -20px;
	width: 100%;
	z-index: 2;
}
#home-index::before {
	background-image: linear-gradient(-45deg, #aaa 20px, transparent 0), linear-gradient( 45deg, #aaa 20px, transparent 0);
	left: 1px;
	width: calc(100% - 1px);
}
#home-index::after { background-image: linear-gradient(-45deg, #bbe8fa 20px, transparent 0), linear-gradient( 45deg, #bbe8fa 20px, transparent 0); }
/* home : album */
#home-album .caption { min-height: 5rem; }
#home-album .caption .title { margin-bottom: 0; }
#home-album a { text-decoration: none; }
#home-album .album-item .card { background: #8ac53f; }
#home-album .caption { text-shadow: 1px 1px 1px rgba(0,0,0,.4); }
#home-album .label { box-shadow: 1px 1px 0 rgba(0,0,0,.3); }
#home-album .label-default { background: #999; }
/* home : pop */
#home-popup-modal {
	background: #148487;
	border-radius: 0;
}
#home-popup-modal .modal-body { color: white; }
#home-popup-modal .modal-body h2,
#home-popup-modal .modal-body h3 { color: yellow; }
#home-popup-modal hr { border-color: white; }
/* facility */
#campus-facility .card-header {
	color: white;
	padding-bottom: 0;
	padding-top: 1.5rem;
	text-shadow: 1px 1px 0 rgba(0,0,0,.3);
}
/* album : index */
#album-index .album-item {
	height: 120px;
	padding: 2px;
}
#album-index .album-item > a {
	background: rgba(0,0,0,0);
	color: white;
	display: block;
	height: 100%;
	position: relative;
	text-decoration: none;
	text-shadow: 1px 1px 0 rgba(0,0,0,.3);
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
#album-index .album-item > a[disabled] {
	color: rgba(255,255,255,.2);
	text-shadow: none;
}
#album-index .album-item > a::before {
	content: '';
	display: block;
	height: 100%;
	position: absolute;
	width: 100%;
	z-index: -1;
}
#album-index .album-item > a[href]:active,
#album-index .album-item > a[href]:focus,
#album-index .album-item > a[href]:hover { background: rgba(0,0,0,.3); }
/* album : list */
#album-header { margin-bottom: 3rem; }
#album-header-mobile .form-control { border-radius: 2rem; }
#album-header-mobile .input-group .form-control {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
#album-header-mobile .input-group-addon {
	border: none;
	border-top-left-radius: 2.4rem;
	border-bottom-left-radius: 2.4rem;
	background: #337ab7;
}
#album-header-mobile .input-group-addon a { color: white; }
#album-list .card,
#album-list .card a,
#album-list .card small,
#album-list .card .small {
	color: white;
	text-shadow: 1px 1px 0 rgba(0,0,0,.3);
}
#album-list .card img { box-shadow: 1px 1px 3px rgba(0,0,0,.2); }
#album-list .card hr { border-color: rgba(255,255,255,.7); }
#album-list .col-left .card > * { margin: 0; }
#album-list .col-right { padding-right: 0; }
/* course */
#course-index .course-item > h2 { font-weight: bold; }
#course-index .course-item { margin-bottom: 2rem; }
#course-index .course-item:last-child { margin-bottom: 0; }
/* resource : link */
#resource-link .link-item img { max-height: 130px; }
/* resource : song */
.resource-list .resource-item .card,
.resource-list .resource-item .card-header { border-radius: 1.2rem; }
.resource-list .resource-item .card-header { text-shadow: 1px 1px 0 rgba(0,0,0,.3); }
/* intranet (parent area) */
[id^="intranet-"] .card,
[id^="intranet-"] .card-header {
	border-radius: 1.2rem;
	margin-bottom: 2rem;
}
[id^="intranet-"] .card-header {
	color: white;
	text-shadow: 1px 1px 0 rgba(0,0,0,.3);
}




/**
 *
 *  FOOTER
 *
 **/
#footer {
	background: white;
	margin-top: 3rem;
	padding: 2rem;
	position: relative;
	width: 100%;
	z-index: 2;
}
body[data-controller=home] #footer { margin-top: 0; }
/* zigzag */
#footer::before,
#footer::after {
	background-position: top left;
	background-repeat: repeat-x;
	background-size: 20px 30px;
	content: '';
	display: block;
	height: 20px;
	position: absolute;
	left: 0;
	top: -20px;
	width: 100%;
	z-index: 2;
}
#footer::before { background-image: linear-gradient(-45deg, #999 20px, transparent 0), linear-gradient( 45deg, #999 20px, transparent 0);
	left: 1px;
	width: calc(100% - 1px);
}
#footer::after { background-image: linear-gradient(-45deg, white 20px, transparent 0), linear-gradient( 45deg, white 20px, transparent 0); }
/* alternate color */
body[data-controller=home] #footer {
	background: #e1b712;
	text-shadow: 0 1px 1px #777;
}
body[data-controller=home] #footer,
body[data-controller=home] #footer .text-muted { color: white !important; }
body[data-controller=home] #footer::after { background-image: linear-gradient(-45deg, #e1b712 20px, transparent 0), linear-gradient( 45deg, #e1b712 20px, transparent 0); }




/**
 *
 *  RANDOM COLOR
 *
 **/
/* nav */
#nav .navbar-nav.left > li.admissions > a { color: #2ab0ba; }
#nav .navbar-nav.left > li.about      > a { color: #e1b712; }
#nav .navbar-nav.left > li.campus     > a { color: #ed117d; }
#nav .navbar-nav.left > li.course     > a { color: #92278f; }
#nav .navbar-nav.left > li.activity   > a { color: #00a651; }
#nav .navbar-nav.left > li.album      > a { color: #e67e22; }
#nav .navbar-nav.left > li.contact    > a { color: #92278f; }
#nav .navbar-nav.left > li.community  > a { color: #666666; }
#nav .navbar-nav.left > li.resource   > a { color: #8ac53f; }
/* nav : active */
#nav .navbar-nav.left > li.active.admissions > a { border-color: #2ab0ba; }
#nav .navbar-nav.left > li.active.about      > a { border-color: #e1b712; }
#nav .navbar-nav.left > li.active.campus     > a { border-color: #ed117d; }
#nav .navbar-nav.left > li.active.course     > a { border-color: #92278f; }
#nav .navbar-nav.left > li.active.activity   > a { border-color: #00a651; }
#nav .navbar-nav.left > li.active.album      > a { border-color: #e67e22; }
#nav .navbar-nav.left > li.active.contact    > a { border-color: #92278f; }
#nav .navbar-nav.left > li.active.community  > a { border-color: #666666; }
#nav .navbar-nav.left > li.active.resource   > a { border-color: #8ac53f; }
/* page header */
body[data-controller=admissions] #content .page-header { color: #2ab0ba; }
body[data-controller=about]      #content .page-header { color: #e1b712; }
body[data-controller=campus]     #content .page-header { color: #ed117d; }
body[data-controller=course]     #content .page-header { color: #92278f; }
body[data-controller=activity]   #content .page-header { color: #00a651; }
body[data-controller=album]      #content .page-header { color: #e67e22; }
body[data-controller=contact]    #content .page-header { color: #92278f; }
body[data-controller=resource]   #content .page-header { color: #8ac53f; }
body[data-controller=community]  #content .page-header { color: #666666; }
body[data-controller=special]    #content .page-header { color: #fb6b47; }
body[data-controller=schedule]   #content .page-header .feature-news { color: #db5896; }
body[data-controller=schedule]   #content .page-header .schedule-calendar { color: #2196f3; }
body[data-controller=schedule]   #content .page-header small { position: relative; top: -5px; }
#home-album .page-header { color: #8e67b6; }
/* home : album */
#home-album .album-item:nth-child(6n+1) .card { background: #fb6b47; }
#home-album .album-item:nth-child(6n+2) .card { background: #ffa41b; }
#home-album .album-item:nth-child(6n+3) .card { background: #e1b712; }
#home-album .album-item:nth-child(6n+4) .card { background: #abcd52; }
#home-album .album-item:nth-child(6n+5) .card { background: #5bc4db; }
#home-album .album-item:nth-child(6n+6) .card { background: #8e67b6; }
/* card */
.card .card-header {
	background: none;
	border: none;
	padding: .75rem 1rem 0 1rem !important;
}
/* page */
.page-view .card {
	background: #148487;
	border: solid 1em #148487;
	color: white;
	text-shadow: 1px 1px 0 rgba(0,0,0,.6);
}
.page-view .card a { color: yellow; }
.page-view .card table,
.page-view .card th,
.page-view .card td { border: solid 2px white; }
.page-view .card-body > :first-child { margin-top: 0; }
/* news */
#news-index .news-item:nth-child(5n+1) .news-date { color: #00aeef; }
#news-index .news-item:nth-child(5n+2) .news-date { color: #92278f; }
#news-index .news-item:nth-child(5n+3) .news-date { color: #8ac53f; }
#news-index .news-item:nth-child(5n+4) .news-date { color: #ed117d; }
#news-index .news-item:nth-child(5n+5) .news-date { color: #e1b712; }
/* campus */
#campus-facility .facility-item:nth-child(6n+1) .card { background: #ffa41b; }
#campus-facility .facility-item:nth-child(6n+2) .card { background: #e1b712; }
#campus-facility .facility-item:nth-child(6n+3) .card { background: #abcd52; }
#campus-facility .facility-item:nth-child(6n+4) .card { background: #5bc4db; }
#campus-facility .facility-item:nth-child(6n+5) .card { background: #8e67b6; }
#campus-facility .facility-item:nth-child(6n+6) .card { background: #fb6b47; }
/* course */
#course-index .course-item:nth-child(8n+2) > h2 { color: #2ab0ba; }
#course-index .course-item:nth-child(8n+3) > h2 { color: #e1b712; }
#course-index .course-item:nth-child(8n+4) > h2 { color: #8ac53f; }
#course-index .course-item:nth-child(8n+5) > h2 { color: #00aeef; }
#course-index .course-item:nth-child(8n+6) > h2 { color: #ed117d; }
#course-index .course-item:nth-child(8n+7) > h2 { color: #00a651; }
#course-index .course-item:nth-child(8n+8) > h2 { color: #92278f; }
/* activity */
#activity-view[data-index='1'] .card { background: #e1b712; }
#activity-view[data-index='2'] .card { background: #92278f; }
#activity-view[data-index='3'] .card { background: #00a651; }
#activity-view[data-index='4'] .card { background: #2ab0ba; }
#activity-view[data-index='5'] .card { background: #ed117d; }
/*#activity-view[data-index='6'] .card { background: #92278f; }
#activity-view[data-index='7'] .card { background: #00aeef; }
#activity-view[data-index='8'] .card { background: #8ac53f; }*/
/* album */
#album-index .album-item:nth-child(6n+1) > a::before { background: #ffa41b; }
#album-index .album-item:nth-child(6n+2) > a::before { background: #e1b712; }
#album-index .album-item:nth-child(6n+3) > a::before { background: #abcd52; }
#album-index .album-item:nth-child(6n+4) > a::before { background: #5bc4db; }
#album-index .album-item:nth-child(6n+5) > a::before { background: #8e67b6; }
#album-index .album-item:nth-child(6n+6) > a::before { background: #fb6b47; }
/* album : list */
#album-list .row:nth-child(6n+1) .card { background: #abcd52; }
#album-list .row:nth-child(6n+2) .card { background: #8e67b6; }
#album-list .row:nth-child(6n+3) .card { background: #ffa41b; }
#album-list .row:nth-child(6n+4) .card { background: #e1b712; }
#album-list .row:nth-child(6n+5) .card { background: #fb6b47; }
#album-list .row:nth-child(6n+6) .card { background: #5bc4db; }
/* resource : song */
.resource-list .resource-item:nth-child(6n+1) .card-header { background: #8e67b6; }
.resource-list .resource-item:nth-child(6n+2) .card-header { background: #fb6b47; }
.resource-list .resource-item:nth-child(6n+3) .card-header { background: #ffa41b; }
.resource-list .resource-item:nth-child(6n+4) .card-header { background: #abcd52; }
.resource-list .resource-item:nth-child(6n+5) .card-header { background: #5bc4db; }
.resource-list .resource-item:nth-child(6n+6) .card-header { background: #e1b712; }
/* intranet */
#intranet-index .intranet-group:nth-child(6n+1) .card-header { background: #5bc4db; }
#intranet-index .intranet-group:nth-child(6n+2) .card-header { background: #abcd52; }
#intranet-index .intranet-group:nth-child(6n+3) .card-header { background: #ffa41b; }
#intranet-index .intranet-group:nth-child(6n+4) .card-header { background: #8e67b6; }
#intranet-index .intranet-group:nth-child(6n+5) .card-header { background: #e1b712; }
#intranet-index .intranet-group:nth-child(6n+6) .card-header { background: #fb6b47; }



/**
 *
 *  CHINESE FONT
 *
 **/
/* just-font event */
.jf-loading body { /*載入中不顯示*/
	opacity: 0;
	visibility: hidden;
}
.jf-active body { /*如果處理成功，直接顯示*/
	opacity: 1;
	visibility: visible;
}
.jf-inactive body { /*如果處理失敗，直接顯示*/
	opacity: 1;
	visibility: visible;
}
.jf-active .page-header,
.jf-inactive .page-header { /*處理成功或失敗，都以漸變顯示*/
	-webkit-transition: opacity 1s ease-out; 
	-moz-transition: opacity 1s ease-out; 
	-o-transition: opacity 1s ease-out; 
	transition: opacity 1s ease-out; 
}



/**
 *
 *  RESPONSIVE
 *
 **/
/* lg */
@media screen and (min-width: 1200px) {}
/* md */
@media screen and (max-width: 1199px) {}
/* sm */
@media screen and (max-width: 991px) {
	.tab-layout .tab-nav > .nav > li > a { padding-left: 1rem; }
	.tab-layout .tab-nav > .nav > li > a.active { background-position: 1rem bottom; }
}
/* xs */
@media screen and (max-width: 767px) {
	body {
		background-color: white;
		background-image: url(../img/bg_s.jpg);
		background-size: cover;
		background-position: bottom left;
	}
	/* header */
	#header {
		box-shadow: -2px 2px 2px rgba(0,0,0,.2);
background: white !important;
min-height: 60px;
		position: fixed;
		top: 0;
		width: 100%;
	}
	#header .navbar-brand {
		height: 60px;
		left: 0;
		padding-top: 18px;
		display: inline-block;
transform: none;
		text-align: center;
		top: 0;
		width: 100%;
		float: left;
	}
	#header .navbar-brand .chi-name {
		background-image: url(../img/logo_name_c.png);
		background-size: auto 40px;
		background-position: calc(50% + 10px) center;
		height: 100%;
		width: 100%;
		bottom: 2px;
		left: 0;
	}
	#header .navbar-brand::before,
	#header .navbar-brand .eng-name,
	#header .navbar-brand .chi-name::before { display: none; }
	#header .navbar-brand::after {
		background-color: transparent;
		background-size: cover;
		background-image: url(../img/logo_green.png);
		border-radius: 0;
		height: 45px;
		width: 45px;
		top: 6px;
		left: 10px;
	}
	#header .navbar-toggler {
		background: white;
		border: none;
		font-size: 1rem;
		line-height: 16px;
		margin: 10px;
		padding: 8px 5px;
		z-index: 9;
		position: absolute;
		top: 0;
		right: 0;
	}
	#header .navbar-toggler-icon { border-color: #050 !important; }
	/* nav */
	#nav {
		margin-left: 4px;
		height: calc(100vh - 59px);
		padding: 0;
	}
	#nav.navbar-collapse {
		margin: 0;
		overflow: hidden auto;
		transition: none;
		width: 100%;
	}
	#nav ul.navbar-nav { width: 100% !important; }
	#nav ul.navbar-nav > li { width: 100%; }
	#nav ul.navbar-nav > li > a {
		border-width: 0 0 0 8px !important;
		height: auto !important;
		padding: 15px 0 !important;
	}
	#nav ul.navbar-nav > li.active > a { background-color: #f9f9f9; }
	#nav ul.navbar-nav.right { padding: .75rem; }
	#nav ul.navbar-nav.right > li {
		float: none;
		display: block !important;
		margin: 0 auto .75rem auto !important;
		text-align: center;
		width: calc(100%);
	}
	#nav ul.navbar-nav.right > li > a {
		padding: .75rem 0 !important;
		font-size: 1.2rem;
	}
	/* sidebar */
	.tab-layout.row { flex-direction: column; }
	.tab-layout .tab-nav,
	.tab-layout .tab-content {
		display: block;
		flex: none;
		max-width: none;
		margin-top: 4rem;
	}
	.tab-layout .tab-nav > .nav::before { height: 80px; }
	.tab-layout .tab-nav > .nav { margin: 0 0 0 1rem !important; }
	.tab-layout .tab-nav > .nav > li:first-child { padding-top: .5rem; }
	.tab-layout .tab-nav > .nav > li { text-align: center; }
	.tab-layout .tab-nav > .nav > li > a {
		display: inline-block;
		font-size: 1.5rem;
		padding: 0;
	}
	.tab-layout .tab-nav > .nav > li > a.active { background-position: left 3rem; }
	/* content */
	#content .page-header:first-child {
		margin: 3rem 0 .5rem 0 !important;
		text-align: center;
	}
/*
	#content { min-height: calc(100vh - 226px); }
	#content .tab-content .page-header { display: none; }
*/
	#content .tab-content .page-header { margin-top: 0 !important; }
	/* content : cover */
	#home-cover { height: 40px; }
	/* content : carousel */
	#home-slider {
		height: auto;
		margin-top: 4rem;
	}
	#home-slider img { max-height: 350px; }
	#home-slider .carousel-indicators { display: none !important; }
	/* content : home */
	#home-index,
	#home-album .caption { min-height: auto; }
	#home-album .caption {
		margin: 0;
		padding: 0;
		padding-left: 1.5rem;
	}
	#album-index .album-item { padding: 5px; }
	#schedule-calendar { font-size: .85em; }
	#schedule-list ul { margin-left: -1em; }
	/* album : list */
	#album-list .col-right { padding-right: 15px; }
	/* footer */
	#footer { font-size: 1.2rem; }
	#footer > .container-fluid { text-align: center !important; }
	#footer small.float-left { display: none; }
}