/*!
 * Start Bootstrap - Creative Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

html,
body {
    width: 100%;
    height: 100%;
}

body {
    font-family: 'Helvetica Neue',Arial,'微軟正黑',Microsoft JhengHei
}

hr {
    
}

hr.light {
   
}

a {
    color:#1AB0E5;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

a:hover,
a:focus {
    color:#F2DF28;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family:'Helvetica Neue',Arial,Microsoft JhengHei;
}

p {
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.5em;
}

.bg-primary {
    background-color: #FFF;
	padding:30px 0 60px 0;
}

.bg-dark {
    color: #fff;
    background-color: #222;
}

.text-faded {
    color: rgba(0,0,0,.7);
}

section {
    padding: 100px 0;
}

aside {
    padding: 50px 0;
}

.no-padding {
    padding: 0;
}

.navbar-default {
    border-color: rgba(34,34,34,.05);
    font-family: '微軟正黑','Helvetica Neue',Arial,Microsoft JhengHei;
    background-color: #fff;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.navbar-default .navbar-header .navbar-brand {
    text-transform: uppercase;
    font-family: '微軟正黑','Helvetica Neue',Arial,Microsoft JhengHei;
    font-weight: 700;
    color: #f05f40;
}

.navbar-default .navbar-header .navbar-brand:hover,
.navbar-default .navbar-header .navbar-brand:focus {
    color: #346094;
}

.navbar-default .nav > li>a,
.navbar-default .nav>li>a:focus {
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    color: #222;
}

.navbar-default .nav > li>a:hover,
.navbar-default .nav>li>a:focus:hover {
    color: #000;
}

.navbar-default .nav > li.active>a,
.navbar-default .nav>li.active>a:focus {
    color: #FFF!important;
    background-color: #7e9bc0;
}

.navbar-default .nav > li.active>a:hover,
.navbar-default .nav>li.active>a:focus:hover {
    background-color: transparent;
}

@media(min-width:768px) {
    .navbar-default {
        border-color: rgba(255,255,255,.3);
        background-color: #000;
    }

    .navbar-default .navbar-header .navbar-brand {
        color: rgba(255,255,255,.7);
    }

    .navbar-default .navbar-header .navbar-brand:hover,
    .navbar-default .navbar-header .navbar-brand:focus {
        color: #fff;
    }

    .navbar-default .nav > li>a,
    .navbar-default .nav>li>a:focus {
        color: rgba(255,255,255,.7);
    }

    .navbar-default .nav > li>a:hover,
    .navbar-default .nav>li>a:focus:hover {
        color: #fff;
    }

    .navbar-default.affix {
        border-color: rgba(34,34,34,.05);
        background-color: #fff;
    }

    .navbar-default.affix .navbar-header .navbar-brand {
        font-size: 14px;
        color: #f05f40;
    }

    .navbar-default.affix .navbar-header .navbar-brand:hover,
    .navbar-default.affix .navbar-header .navbar-brand:focus {
        color: #eb3812;
    }

    .navbar-default.affix .nav > li>a,
    .navbar-default.affix .nav>li>a:focus {
        color: #222;
    }

    .navbar-default.affix .nav > li>a:hover,
    .navbar-default.affix .nav>li>a:focus:hover {
        color: #f05f40;
    }
}

header {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    background-position:center center;
	background-repeat:no-repeat;
    -webkit-background-size:cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

header .header-content {
    position: relative;
    width: 100%;
	height:75%;
    text-align: center;
}

header .header-content .header-content-inner h1 {
    font-weight: 700;
}

header .header-content .header-content-inner hr {
    margin: 30px auto;
}

header .header-content .header-content-inner p {
    margin-bottom: 50px;
    font-size: 16px;
    font-weight: 300;
}

header .header-content .header-content-inner img{position:absolute; bottom:50px; width:100%;}

@media(min-width:768px) {
    header {
        height: 120%;
		min-height: 100%;
		background-position: center center;
	background-repeat:no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    }

    header .header-content {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    header .header-content .header-content-inner {
		margin-left:auto;
		margin-right:auto;
    }
	
	header .header-content .header-content-inner img{position:absolute; bottom:0; width:100%;}

    header .header-content .header-content-inner p {
        margin-right: auto;
        margin-left: auto;
        max-width: 80%;
        font-size: 18px;
    }
}

.section-heading {
    margin-top: 0;
	color:#211C1C;
}

.service-box {
    margin: 50px auto 0;
    max-width: 400px;
}

@media(min-width:992px) {
    .service-box {
        margin: 20px auto 0;
    }
}

.service-box p {
    margin-bottom: 0;
}

.portfolio-box {
    display: block;
    position: relative;
    margin: 0 auto;
	text-align:center;
}

.portfolio-box .portfolio-box-caption {
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    opacity: 0;
    background: rgba(240,95,64,.9);
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    transform: translateY(-50%);
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    padding: 0 15px;
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    font-size: 18px;
}

.portfolio-box:hover .portfolio-box-caption {
    opacity: 1;
}

@media(min-width:768px) {
    .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
        font-size: 16px;
    }

    .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
        font-size: 22px;
    }
}

.call-to-action h2 {
    margin: 0 auto 20px;
}

.text-primary {
    color: #f05f40;
}

.no-gutter > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}

.btn-default {
    border-color: #fff;
    color: #222;
    background-color: #fff;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    border-color: #ededed;
    color: #222;
    background-color: #f2f2f2;
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    background-image: none;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    border-color: #fff;
    background-color: #fff;
}

.btn-default .badge {
    color: #fff;
    background-color: #222;
}

.btn-primary {
    border-color: #f05f40;
    color: #fff;
    background-color: #f05f40;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
	position:absolute;
	bottom:10px;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    border-color: #ed431f;
    color: #fff;
    background-color: #ee4b28;
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    background-image: none;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    border-color: #f05f40;
    background-color: #f05f40;
}

.btn-primary .badge {
    color: #f05f40;
    background-color: #fff;
}

.btn {
    border: 0;
    border-radius: 300px;
    text-transform: uppercase;
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
    font-weight: 700;
}

.btn-xl {
    padding: 15px 30px;
}

::-moz-selection {
    text-shadow: none;
    color: #fff;
    background: #222;
}

::selection {
    text-shadow: none;
    color: #fff;
    background: #222;
}

img::selection {
    color: #fff;
    background: 0 0;
}

img::-moz-selection {
    color: #fff;
    background: 0 0;
}

body {
    webkit-tap-highlight-color: #222;
}

/* howard */
body{overflow:auto; overflow-x:hidden;}
header{background-color:#A40000; background-image:url(../img/tree.png); background-position:left top; background-repeat:no-repeat; background-size:contain; margin-top:-10px;}
header h2, header h3{color:#F49C00; text-align:right; text-shadow:#330506 2px 2px 8px;}
header h3._logo{background:url(../img/logo.png) no-repeat right center; margin-right:10px; margin-top:10px; padding:10px 10px 0 0; text-indent:-3000px;}
header h3._logo span{opacity:0;}
.header-content{background:url(../img/monkey.png) center center no-repeat none; background-size:contain;}
p{text-align:left;}


.header-content-inner{position:absolute; left:0; right:0; top:0; bottom:0;}

@media(min-width:992px) {
.header-content-inner ._title h2 a._FB{background:url(../img/FB.png) center center; display:block; width:30px; height:30px; margin-left:160px; position:absolute;}
.header-content-inner ._title{position:absolute; right:2em; bottom:12em;}
.header-content-inner ._title h2._box{color:#fff; font-size:80px; font-weight:800;}
.header-content-inner ._menu{text-align:center; position:absolute; right:1em; bottom:6em;}
a._b01, a._b02, a._b03, a._b04{font-size:1.8em; color:#FFF; text-shadow:#000 1px 1px 5px; width:200px; margin:.5em; padding:1em 1.5em;; border-radius:2em;}
a._b01:hover, a._b02:hover, a._b03:hover, a._b04:hover{box-shadow:#000 2px 2px 10px; opacity:1;}
a span{font-size:.6em; display:block;}
}
@media(min-width:770px) and (max-width:992px) {
.header-content-inner ._title h2 a._FB{background:url(../img/FB.png) center center; display:block; width:30px; height:30px; margin-left:160px; position:absolute;}
.header-content-inner ._title{position:absolute; right:2em; bottom:6em;}
.header-content-inner ._title h2._box{color:#fff; font-size:80px; font-weight:800;}
.header-content-inner ._menu{text-align:center; position:absolute; right:1em; bottom:3em;}
a._b01, a._b02, a._b03, a._b04{font-size:1.8em; color:#FFF; text-shadow:#000 1px 1px 5px; margin:.5em; padding:.5em 1em;; border-radius:2em;}
a._b01:hover, a._b02:hover, a._b03:hover, a._b04:hover{box-shadow:#000 2px 2px 10px; opacity:1;}
a span{font-size:.6em; display:block;}
}
@media(min-width:482px) and (max-width:770px) {
.header-content-inner ._title h2 a._FB{background:url(../img/FB.png) center center; display:block; width:30px; height:30px; margin-left:30px; position:absolute;}
.header-content-inner ._title{position:absolute; right:2em; bottom:6em;}
.header-content-inner ._title h2._box{color:#fff; font-size:60px; font-weight:800;}
.header-content-inner ._menu{text-align:center; position:absolute; right:1em; bottom:1em;}
a._b01, a._b02, a._b03, a._b04{font-size:1.25em; color:#FFF; text-shadow:#000 1px 1px 5px; margin:.1em; padding:.5em 1em;; border-radius:2em;}
a._b01:hover, a._b02:hover, a._b03:hover, a._b04:hover{box-shadow:#000 2px 2px 10px; opacity:1;}
a span{font-size:.6em; display:block;}
}
@media(max-width:482px) {
.header-content-inner{padding-bottom:5em; margin-bottom:-3em;}
.header-content-inner ._title h2{font-size:18px;}
.header-content-inner ._title h2 a._FB{background:url(../img/FB.png) center center; background-size:contain; display:block; width:20px; height:20px; margin-left:40px; position:absolute;}
.header-content-inner ._title{position:absolute; right:1em; bottom:16em;}
.header-content-inner ._title h2._box{color:#fff; font-size:40px; font-weight:800;}
.header-content-inner ._menu{position:absolute; left:1em; right:1em; bottom:0; text-align:center;}
a._b01, a._b02, a._b03, a._b04{font-size:1.3em; color:#FFF; text-shadow:#000 1px 1px 5px; margin:.5em; padding:.3em; border-radius:2em; display:block; text-align:center;}
a._b01:hover, a._b02:hover, a._b03:hover, a._b04:hover{box-shadow:#000 2px 2px 10px; opacity:1;}
a span{font-size:.6em; display:block;}
}

a._b01, a._b02, a._b03{background:#F49C00;}


#section_01{background:#F49C00; color:#A40000; background-image:url(../img/ribon.png); background-position:left top; background-repeat:no-repeat;}
#section_01 ._text{background:#F2BD52; border-radius:20px; margin-bottom:1em; padding:.1em 2em; opacity:.7;}
#section_01 ._text h3{color:#53080A; border-bottom:#A28C65 1px dotted; padding-bottom:.3em;}

#section_02{background:#A40000; color:#F49C00;}
#section_02 h2{color:#F49C00;}
#section_02 p{text-align:center;}
#section_02 hr{border-bottom:#F49C00 1px dotted; border-left:none; border-right:none; border-top:none; background:none;}
#section_02 div._gift:hover{cursor:pointer;}
#section_02 div.modal{padding:2em;}
.modal-header{border:none;}
.modal-content{padding:0 1.5em 1.5em 1.5em;}
#section_02 div.modal-dialog p{color:#897D6C; text-align:left;}

#section_03{background:#F49C00; color:#A40000;}
#section_03 h2{color:#A40000;}
#section_03 hr{border-bottom:#F49C00 1px dotted; border-left:none; border-right:none; border-top:none; background:none;}

#section_04, body{background:#A40000; color:#F49c00;}
#section_04 h2{color:#F49c00;}
#section_04 hr{border-bottom:#F49C00 1px dotted; border-left:none; border-right:none; border-top:none; background:none;}

#section_01 p, #section_02 p, #section_03 p, #section_04 p, #section_01 li, #section_02 li, #section_03 li, #section_04 li{font-size:16px; line-height:1.8em;}

a._top{background:#346094; color:#FFF; position:absolute; right:0; bottom:-60px; padding:15px 20px; border-radius:4px;}
a._top:hover{background:#7e9bc0; color:#002856;}
.text-faded{text-align:left; text-align: justify;
　text-justify: inter-ideograph;
　-ms-text-justify: inter-ideograph; /*IE9*/
　-moz-text-align-last:justify; /*Firefox*/
　-webkit-text-align-last:justify; /*Chrome*/}
hr.light{border-bottom:#B6CFD2 1px solid; width:100%;}

table{table-layout:fixed; width:100%;}
table th,table td{padding:10px;}
table th{text-align:center; background:#346094; color:#FFF;}
table td{text-align:left; border-top:#346094 1px solid;}
table th._time{width:30%;}
table th._topic{width:40%;}
table th._speaker{width:30%;}
table tr._break{background:#7e9bc0;}
ul li, ol li{text-align:left;}

.media-body{text-align:left;}

.bg-white{background:#FFF; color:#000;}
.bg-grey{background:#DDD; color:#000;}
.bg-white h2{color:#000; font-size:32px; font-weight:bold;}
.bg-grey h2{color:#000; font-size:32px; font-weight:bold;}
.bg-dark h2{color:#fff; font-size:32px; font-weight:bold;}

#section_05 p{word-break:hyphenate;}

a._more{background:#000; color:#FFF; display:block; width:100px; padding:12px; margin:0 auto; position:absolute; bottom:50px; left:48%; border-radius:24px;}
a._more:hover{}

.bg-white div._intro{padding:3em 3em 1.5em 3em; margin-bottom:2em; height:100%; background:#CFCFCF; color:#313131; border-radius:30px; text-shadow:#000 1px 1px 2px;}
.bg-grey div._intro{padding:3em 3em 1.5em 3em; margin-bottom:2em; height:100%; background:#AAAAAA; color:#313131; border-radius:30px; text-shadow:#000 1px 1px 2px;}
div._intro{padding:3em 3em 1.5em 3em; margin-bottom:2em; height:100%; background:#3D3D3D; color:#F0F0F0; border-radius:30px; text-shadow:#000 1px 1px 2px;}
div._intro p{text-align:left; background-color:transparent; color:#CACACA;}

.media-body{padding:2em 0 0 2em; line-height:1.8em; table-layout: fixed; width:320px;
/* 防止撐開 FX*/
overflow: auto; 
/* 英文單字自動換行 IE ONLY*/
word-wrap: break-word; 
/* 正常避頭尾 */
word-break: normal; 
/* 文字左右對齊 */
text-align:justify; 
text-justify:inter-ideograph;}

/*Main stylesheet for Backtop jQuery Plugin */
#backTop{
    width:30px;
    height:30px;
    padding:10px;
    border-radius:4px;
    text-indent:-9999px;
    cursor:pointer;
    z-index:999999999;
	display:none;
	box-sizing:content-box;
	-webkit-box-sizing:content-box;
}

#backTop.white{
     background:url(../img/uparr-48-b.png) no-repeat center center rgba(255,255,255,0.8);
    border:1px solid #ccc;
}
#backTop.black{
     background:url(../img/uparr-48-w.png) no-repeat center center rgba(0,0,0,0.8); 
    border:1px solid #ccc;
}
#backTop.red{
     background:url(../img/uparr-48-w.png) no-repeat center center rgba(217,97,81,0.9); 
    border:1px solid #fff;
}
#backTop.green{
     background:url(../img/uparr-48-b.png) no-repeat center center rgba(81,217,187,0.9); 
    border:1px solid #fff;
}

/* grid */
/* Portfolio grid */

.grid{
  margin-top:70px;
  width:100%;
  position:relative;
  margin-bottom:70px;
  overflow:hidden;
}

.grid li{
  width:285px;
  margin:0 15px 15px 0;
  float: left;
  position: relative;
  overflow: hidden;
}

.grid img{
  width:285px;
  float: left;
  position: relative;
}

.grid .text {
  position: absolute;
  width: 285px;
  height:100%;
  background: rgba(173,160,116,1);
  z-index: 2;
  opacity:0;
    -webkit-transition: all 0.6s ease-in;
	-moz-transition: all 0.6s ease-in;
	-ms-transition: all 0.6s ease-in;
	-o-transition: all 0.6s ease-in;
	transition: all 0.6s ease-in;
}

.grid .text:hover {
  opacity:1;
}

.grid .no-text {
  position: absolute;
  width: 285px;
  height:100%;
  background: rgba(173,160,116,0.5);
  z-index: 2;
  opacity:0;
  -webkit-transition: all 0.6s ease-in;
	-moz-transition: all 0.6s ease-in;
	-ms-transition: all 0.6s ease-in;
	-o-transition: all 0.6s ease-in;
	transition: all 0.6s ease-in;
}

.grid .no-text:hover {
  opacity:1;
}

.grid p {
  font-size: 18px;
  text-align:center;
  line-height:26px;
  margin-top:40px;
  font-weight: bold;
  letter-spacing:1px;
  color: #FFF;
}

.grid p.description {
  font-size: 12px;
  width:300px;
  margin-top:20px;
  text-align:center;
  line-height:20px;
  font-weight: 400;
  color: #FFF;
  position:relative;
}

.clear { 
    clear:both; 
}