@charset "utf-8";
/*
Template Name: Jeren
Author: <a href="https://www.os-templates.com/">OS Templates</a>
Author URI: https://www.os-templates.com/
Licence: Free to use under our free template licence terms
Licence URI: https://www.os-templates.com/template-terms
File: Layout CSS
*/

@import url("font-awesome.min.css");
@import url("custom.flexslider.css");
@import url("framework.css");




/*--------------------------------------------------------------*/

/* Rows
--------------------------------------------------------------------------------------------------------------- */
.row0, .row0 a{}
.row1{border-bottom:1px solid;}
.row2{border-bottom:1px solid;}
.row3, .row3 a{}
.row4, .row4 a{}
.row5{border-top:1px solid;}


/* Top Bar
--------------------------------------------------------------------------------------------------------------- */
#topbar{padding:15px 0; font-size:.8rem; text-transform:uppercase;}

#topbar *{margin:0;}
#topbar ul li{display:inline-block; margin-right:10px; padding-right:15px; border-right:1px solid;}
#topbar ul li:last-child{margin-right:0; padding-right:0; border-right:none;}
#topbar i{margin:0 5px 0 0; line-height:normal;}


/* Header
--------------------------------------------------------------------------------------------------------------- */
#header{}

#header #logo{margin:30px 0 0 0;}
#header #logo h1{margin:0; padding:0; font-size:22px; text-transform:uppercase;}


/* Page Intro
--------------------------------------------------------------------------------------------------------------- */
#pageintro{padding:150px 0;}

#pageintro li article{display:block; max-width:75%; margin:0 auto; text-align:center;}
#pageintro li article *{margin:0;}
#pageintro li p:first-of-type{margin-bottom:10px; font-style:italic;}
#pageintro li .heading{margin-bottom:30px; font-size:3rem; word-wrap:break-word;}
#pageintro li p:nth-of-type(2){line-height:1.5rem;}
#pageintro li footer{margin-top:40px;}


/* Content Area
--------------------------------------------------------------------------------------------------------------- */
.container{padding:80px 0;}

/* Content */
.container .content{}

.sectiontitle{display:block; max-width:65%; margin:0 auto 60px; text-align:center;}
.sectiontitle *{margin:0;}
.sectiontitle h1{font-size:2.0em;font-weight:bold;}
.hr-img{width:70%;margin:10px 5px;}
@media screen and (max-width:750px){.hr-img{display:none;}}

.sectiontitle .breadcurmb{display:none;}
@media screen and (max-width:750px){
	.sectiontitle .breadcurmb {display:block; text-align:right;}
	}

.services li:nth-child(-n+3){margin-bottom:50px;}/* Adds bottom margin to the first three elements only */
.services > li:last-child{margin-bottom:0;}/* Used when elements stack in small viewports */
.services article{display:block; text-align:center;}
.services article *{margin:0 0 15px 0;}
.services article > :last-child{margin-bottom:0;}
.services article .heading{font-size:1.2rem;}

.logos li:last-child{margin-bottom:0;}/* Used when elements stack in small viewports */
.logos li a{display:inline-block; max-width:100%;}

.excerpt{display:inline-block; width:100%; max-width:320px; padding-bottom:20px;}
.excerpt img{}
.excerpt .excerpttxt{display:block; position:relative; max-width:84%; margin:-40px auto; padding:20px; text-align:center;}
.excerpt .excerpttxt > ul{margin:0 0 15px 0; padding:0; font-size:.8rem;}
.excerpt .excerpttxt > ul li{display:inline-block; margin-right:8px;}
.excerpt .excerpttxt > ul li:first-child::after{margin-left:10px; /*content:"|"*/;}
.excerpt .excerpttxt > ul li:last-child{margin-right:0;}
.excerpt .heading{margin:0 0 30px 0;}
.excerpt p:last-of-type{margin:0; padding:0;}

/* Comments */
#comments ul{margin:0 0 40px 0; padding:0; list-style:none;}
#comments li{margin:0 0 10px 0; padding:15px;}
#comments .avatar{float:right; margin:0 0 10px 10px; padding:3px; border:1px solid;}
#comments address{font-weight:bold;}
#comments time{font-size:smaller;}
#comments .comcont{display:block; margin:0; padding:0;}
#comments .comcont p{margin:10px 5px 10px 0; padding:0;}

#comments form{display:block; width:100%;}
#comments input, #comments textarea{width:100%; padding:10px; border:1px solid;}
#comments textarea{overflow:auto;}
#comments div{margin-bottom:15px;}
#comments input[type="submit"], #comments input[type="reset"]{display:inline-block; width:auto; min-width:150px; margin:0; padding:8px 5px; cursor:pointer;}

/* Sidebar */
.container .sidebar{}

.sidebar .sdb_holder{margin-bottom:50px;}
.sidebar .sdb_holder:last-child{margin-bottom:0;}


/* Footer
--------------------------------------------------------------------------------------------------------------- */
#footer{padding:80px 0;}

#footer .heading{margin-bottom:50px; font-size:1.2rem;}

#footer .linklist li{display:block; margin-bottom:15px; padding:0 0 15px 0; border-bottom:1px solid;}
#footer .linklist li:last-child{margin:0; padding:0; border:none;}
#footer .linklist li::before, #footer .linklist li::after{display:table; content:"";}
#footer .linklist li, #footer .linklist li::after{clear:both;}

#footer .contact{}
#footer .contact.linklist li, #footer .contact.linklist li:last-child{position:relative; padding-left:40px;}
#footer .contact li *{margin:0; padding:0; line-height:1.6;}
#footer .contact li i{display:block; position:absolute; top:0; left:0; width:30px; font-size:16px; text-align:center;}

#footer input, #footer button{border:1px solid;}
#footer input{display:block; width:100%; padding:8px;}
#footer button{padding:8px 18px 10px; text-transform:uppercase; font-weight:700; cursor:pointer;}


/* Copyright
--------------------------------------------------------------------------------------------------------------- */
#copyright{padding:20px 0;}
#copyright *{margin:0; padding:0;}


/* Transition Fade
This gives a smooth transition to "ALL" elements used in the layout - other than the navigation form used in mobile devices
If you don't want it to fade all elements, you have to list the ones you want to be faded individually
Delete it completely to stop fading
--------------------------------------------------------------------------------------------------------------- */
*, *::before, *::after{transition:all .28s ease-in-out;}
#mainav form *{transition:none !important;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Navigation
--------------------------------------------------------------------------------------------------------------- */
nav ul, nav ol{margin:0; padding:0; list-style:none;}

#mainav, #breadcrumb, .sidebar nav{line-height:normal;}
#mainav .drop::after, #mainav li li .drop::after, #breadcrumb li a::after, .sidebar nav a::after{position:absolute; font-family:"FontAwesome"; font-size:10px; line-height:10px;}

/* Top Navigation */
#mainav{}
#mainav ul{text-transform:uppercase;}
#mainav ul ul{z-index:9999; position:absolute; width:180px; text-transform:none;}
#mainav ul ul ul{left:180px; top:0;}
#mainav li{display:inline-block; position:relative; margin:0 15px 0 0; padding:0;}
#mainav li:last-child{margin-right:0;}
#mainav li li{width:100%; margin:0;}
#mainav li a{display:block; padding:30px 0;}
#mainav li li a{border:solid; border-width:0 0 1px 0;}
#mainav .drop{padding-left:15px;}
#mainav li li a, #mainav li li .drop{display:block; margin:0; padding:10px 15px;}
#mainav .drop::after, #mainav li li .drop::after{content:"\f0d7";}
#mainav .drop::after{top:35px; left:5px;}
#mainav li li .drop::after{top:15px; left:5px;}
#mainav ul ul{visibility:hidden; opacity:0;}
#mainav ul li:hover > ul{visibility:visible; opacity:1;}

#mainav form{display:none; margin:0; padding:0;}
#mainav form select, #mainav form select option{display:block; cursor:pointer; outline:none;}
#mainav form select{width:100%; padding:5px; border:none;}
#mainav form select option{margin:5px; padding:0; border:none;}

/* Breadcrumb */
#breadcrumb{padding:120px 0 15px;}
#breadcrumb ul{margin:0; padding:0; list-style:none; text-transform:uppercase;}
#breadcrumb li{display:inline-block; margin:0 6px 0 0; padding:0;}
#breadcrumb li a{display:block; position:relative; margin:0; padding:0 12px 0 0; font-size:12px;}
#breadcrumb li a::after{top:3px; right:0; content:"\f101";}
#breadcrumb li:last-child a{margin:0; padding:0;}
#breadcrumb li:last-child a::after{display:none;}

/* Sidebar Navigation */
.sidebar nav{display:block; width:100%;}
.sidebar nav li{margin:0 0 3px 0; padding:0;}
.sidebar nav a{display:block; position:relative; margin:0; padding:5px 10px 5px 15px; text-decoration:none; border:solid; border-width:0 0 1px 0;}
.sidebar nav a::after{top:9px; left:5px; content:"\f101";}
.sidebar nav ul ul a{padding-left:35px;}
.sidebar nav ul ul a::after{left:25px;}
.sidebar nav ul ul ul a{padding-left:55px;}
.sidebar nav ul ul ul a::after{left:45px;}

/* Pagination */
.pagination{display:block; width:100%; text-align:center; clear:both;}
.pagination li{display:inline-block; margin:0 2px 0 0;}
.pagination li:last-child{margin-right:0;}
.pagination a, .pagination strong{display:block; padding:8px 11px; border:1px solid; background-clip:padding-box; font-weight:normal;}

/* Back to Top */
#backtotop{z-index:999; display:inline-block; position:fixed; visibility:hidden; bottom:20px; right:20px; width:36px; height:36px; line-height:36px; font-size:16px; text-align:center; opacity:.2;}
#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}
#backtotop.visible{visibility:visible; opacity:.5;}
#backtotop:hover{opacity:1;}


/* Tables
--------------------------------------------------------------------------------------------------------------- */
table, th, td{border:1px solid; border-collapse:collapse; vertical-align:top;}
table, th{table-layout:auto;}
table{width:100%; margin-bottom:15px;}
th, td{padding:5px 8px;}
td{border-width:0 1px;}


/* Gallery
--------------------------------------------------------------------------------------------------------------- */
#gallery{display:block; width:100%; margin-bottom:50px;}
#gallery figure figcaption{display:block; width:100%; clear:both;}
#gallery li{margin-bottom:30px;}


/* Font Awesome Social Icons
--------------------------------------------------------------------------------------------------------------- */
.faico{margin:0; padding:0; list-style:none;}
.faico li{display:inline-block; margin:8px 5px 0 0; padding:0; line-height:normal;}
.faico li:last-child{margin-right:0;}
.faico a{display:inline-block; width:36px; height:36px; line-height:36px; font-size:18px; text-align:center;}

.faico a{color:#inherit; background-color:#353535;}
.faico a:hover{color:#FFFFFF;}

.faicon-dribble:hover{background-color:#EA4C89;}
.faicon-facebook:hover{background-color:#3B5998;}
.faicon-google-plus:hover{background-color:#DB4A39;}
.faicon-linkedin:hover{background-color:#0E76A8;}
.faicon-twitter:hover{background-color:#00ACEE;}
.faicon-vk:hover{background-color:#4E658E;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Colours
--------------------------------------------------------------------------------------------------------------- */
body{color:#CBCBCB; background-color:#222222;}
a{color:#750000;}
a:active, a:focus{background:transparent;}/* IE10 + 11 Bugfix - prevents grey background */
hr, .borderedbox{border-color:#D7D7D7;}
label span{color:#FF0000; background-color:inherit;}
input:focus, textarea:focus, *:required:focus{border-color:#750000;}

.overlay{color:#FFFFFF; background-color:inherit;}
.overlay::after{color:inherit; background-color:rgba(0,0,0,.55);}
.overlay.light{color:#474747;}
.overlay.light_2{color:rgb(71, 71, 71,0.5)}
.overlay.light::after{background-color:rgba(255,255,255,.9);}

.btn, .btn.inverse:hover{color:#FFFFFF; background-color:#750000; border-color:#750000;cursor:pointer}
.btn:hover, .btn.inverse{color:inherit; background-color:transparent; border-color:inherit;cursor:pointer}

blockquote::before{color:rgba(255,255,255,.2);}

.icon{color:#750000; border-color:#D7D7D7;}
a > .icon:hover, .services article:hover .icon{color:#FFFFFF; background-color:#750000; border-color:#750000;}


/* Rows */
.row0, .row0 a{color:#474747; background-color:#EFEFEF;}
.row1{color:#474747; background-color:#FFFFFF;}
.row2{color:#474747; background-color:#EFEFEF; border-color:#D7D7D7;}
.row3{color:#474747; background-color:#FFFFFF;}
.row4{
	color: #CBCBCB;
}
.row5, .row5 a{color:#CBCBCB; background-color:#222222;}
.row5{border-color:rgba(255,255,255,.1);}


/* Top Bar */
#topbar ul li{border-color:rgba(0,0,0,.1);}
#topbar > div:last-of-type li:first-child a{color:#750000;}


/* Header */
#header #logo a{color:inherit;}


/* Content Area */
.excerpt .excerpttxt{color:inherit; background-color:#FFFFFF;}


/* Footer */
#footer .heading{color:#FFFFFF;}
#footer hr, #footer .borderedbox, #footer .linklist li{border-color:rgba(255,255,255,.1);}

#footer input, #footer button{border-color:transparent;}
#footer input{color:#FFFFFF; background-color:#353535;}
#footer input:focus{border-color:#750000;}
#footer button{color:#FFFFFF; background-color:#750000;}


/* Navigation */
#mainav li a{color:inherit;}
#mainav .active a, #mainav a:hover, #mainav li:hover > a{color:#750000; background-color:inherit;}
#mainav li li a, #mainav .active li a{color:#FFFFFF; background-color:rgba(0,0,0,.6); border-color:rgba(0,0,0,.6);}
#mainav li li:hover > a, #mainav .active .active > a{color:#FFFFFF; background-color:#750000;}
#mainav form select{color:#FFFFFF; background-color:#000000;}

#breadcrumb a{color:inherit; background-color:inherit;}
#breadcrumb li:last-child a{color:#750000;}

.container .sidebar nav a{color:inherit; border-color:#D7D7D7;}
.container .sidebar nav a:hover{color:#750000;}

.pagination a, .pagination strong{border-color:#D7D7D7;}
.pagination .current *{color:#FFFFFF; background-color:#750000;}

#backtotop{color:#FFFFFF; background-color:#750000;}


/* Tables + Comments */
table, th, td, #comments .avatar, #comments input, #comments textarea{border-color:#D7D7D7;}
#comments input:focus, #comments textarea:focus, #comments *:required:focus{border-color:#750000;}
th{color:#FFFFFF; background-color:#373737;}
tr, #comments li, #comments input[type="submit"], #comments input[type="reset"]{color:inherit; background-color:#FBFBFB;}
tr:nth-child(even), #comments li:nth-child(even){color:inherit; background-color:#F7F7F7;}
table a, #comments a{background-color:inherit;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport{width:device-width;}


/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:978px){
	.hoc{max-width:978px;}
}


/* Mobile Devices
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:900px){
	.hoc{max-width:90%;}

	#topbar{}

	#header{padding:30px 0 15px;}
	#header #logo{margin:0;}

	#mainav{}
	#mainav ul{display:none;}
	#mainav form{display:block;}

	#breadcrumb{}

	.container{}
	#comments input[type="reset"]{margin-top:10px;}
	.pagination li{display:inline-block; margin:0 5px 5px 0;}

	#footer{}

	#copyright{}
	#copyright p:first-of-type{margin-bottom:10px;}
}


@media screen and (max-width:750px){
	.imgl, .imgr{display:inline-block; float:none; margin:0 0 10px 0;}
	.fl_left, .fl_right{display:block; float:none;}
	@media screen and (max-width:750px){.fl_right{text-align:right;}}
	.group .group > *:last-child, .clear .clear > *:last-child, .clear .group > *:last-child, .group .clear > *:last-child{margin-bottom:0;}/* Experimental - Needs more testing in different situations, stops double margin when stacking */
	.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 50px 0; padding:0;}

	#topbar{padding-top:15px; text-align:center;}
	#topbar ul{margin:0 0 15px 0; line-height:normal;}

	#header{text-align:center;}
	#header #logo{margin-bottom:15px;}

	.sectiontitle{max-width:none; text-align:left;}
}


@media screen and (max-width:450px){
	#topbar ul li{margin-bottom:2px; padding-right:0; border-right:none;}
}


/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:650px){
	.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
	.scrollable table{margin:0; padding:0; white-space:nowrap;}

	.inline li{display:block; margin-bottom:10px;}
	.pushright li{margin-right:0;}

	.font-x2{font-size:1.4rem;}
	.font-x3{font-size:1.6rem;}

	#pageintro li article{max-width:none; width:100%;}
	#pageintro li .heading{font-size:1.6rem;}
}

/*==============================================*/
/*hr style*/
.hr-edge-weak {/*渲染hr*/
    border: 0;
    padding-top: 1px;
    background: linear-gradient(to right, transparent, #d0d0d5, transparent);
}

.hr-space-square {
    border: 0;
    color: #d0d0d5;
    background: linear-gradient(currentColor, currentColor) no-repeat center;
    background-size: calc(100% - 1.5em - 6px) 1px;
    display: flex;
    justify-content: space-between;
}
.hr-space-square::before,
.hr-space-square::after {
    content: '';
    display: block;
    width: .75em; height: .75em;
    transform: rotate(45deg);
    box-sizing: border-box;
    border: 1px solid;
    margin: 3px;
}

/*===========================================================================*/
/*shenminImg*/
.shenmin{display:inline-block;float:left;margin:10px 25px;}
.shenmin .shenminImg{width:180px;height:250px;max-width:100%;}
.shenmin .shenmin-title{margin:15px 0;}

/*=====================================================================*/
/*超過行數加上省略號====================================================*/
.omit_2{ display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2;/*超過兩行加上省略號*/ -webkit-box-orient: vertical; }

/*a style*/
a.fooer_w{color:#ffffff;}
a.fooer_w:hover{color:#750000;}

/*=========================================================================*/
.breambcrum{font-size:0.8em;}
.breambcrum span{font-size:0.8em;}

/*==========================================================================*/
/*css 超過多行進行截斷補上...*/
.omit_2{ display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2;/*超過兩行加上省略號*/ -webkit-box-orient: vertical; }
.omit_3{ display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3;/*超過三行加上省略號*/ -webkit-box-orient: vertical; }
.omit_4{ display: -webkit-box; overflow: hidden; -webkit-line-clamp: 4;/*超過四行加上省略號*/ -webkit-box-orient: vertical; }

span .more{font-size:0.8em;}

/*====================================================================*/
/*內文文字樣式*/
.main-editor{text-align:left;margin:20px 0;line-height:25px;}

/*==========================================================*/
.social-breamdcurm{ width:80%; margin:0 auto;padding:15px 0;}
.breamdcurm{text-align:right;display:block;width:48%;float:left;padding:5px 10px;}
.social{text-align:left;display:block;width:48%;float:left;padding:5px 10px;}
@media screen and (max-width:750px){.breamdcurm,.social{width:100%;float:none;text-align:left;margin:5px 0;}}
.social img:hover{transform:scale(1.2,1.2);}/*css 滑鼠移入放大*/
/*=============================================================*/

/*hr css style====================================================*/
.hr-double {
    border: 0;
    border-top: 3px double #d0d0d5;
	margin:5px 0;
}

/*gallery button===================================================*/
.img:hover{transform:scale(1.2,1.2);}/*css 滑鼠移入放大*/

.photo{width:100%;margin:0 auto; text-align:center;}
.photoImg{width:280px;height:200px;max-width:100%;float:left;margin:10px 20px;border-radius:5px 5px;}
.photoImg:hover{transform:scale(1.1,1.1);cursor: pointer;}
.button {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  margin:0;
  transition-duration: 0.4s;
  cursor: pointer;
}
.button-g {  background-color:#00BB00;  color: #ffffff;   
}

.button-g:hover {  background-color:#00DB00;  color: white;}

.button1 {  background-color: #750000; /* Green */  color: #ffffff; }

.button1:hover { background-color:	#AE0000; color: white;}

.button0{  background-color:transparent;  color: #750000;; }

.button0:hover {  background-color:	#AE0000;  color: white;}

@media screen and (max-width:680px){
	.hbtn{display:none;}
	}

/*news main=================================================================================*/
.news_wrap{margin:0 auto;width:80%;}
.news-main{text-align:center; margin:0 10px;overflow:hidden}
@media screen and (max-width:680px){.news_wrap{margin:0 auto;width:100%;}}
@media screen and (min-width: 681px) and (max-width:980px) {.news_wrap{margin:0 auto;width:90%;}}
*{box-sizing: border-box;}
.gallery{width:380px;height:253px;max-width:100%;max-height:100%;display:inline-block;float:left;border:#ccc solid 1px;margin:5px 5px;overflow:hidden}
.gallery img{width:380px;height:253px;max-width:100%;max-height:100%;}
.dsec{padding: 15px;text-align: center;}
.dec-newstime{display:inline-block;float:left;text-align:left;}
.gallery:hover{border:#999 solid 1px;}
.dec-more{display:inline-block;float:right;text-align:right;}

.date-left{width:50%;float:left;text-align:left;}
.d-right{width:50%;float:right;text-align:right;}
@media screen and (max-width:680px){
	.date-left,.d-right{width:100%;float:none;display:block;}
	}
.newscon{margin:2em 0;}
.newscon .newscon-ed{margin:5px 0;}


/*空格間距============================================*/
.space{margin:10px 0;}



/*Button 動畫 arrow right ======================================*/
/*css button arrow right animate go==============*/
.button-arrow-right {  border-radius: 4px;  background-color: #f4511e;  border: none;  color: #FFFFFF;  text-align: center;  font-size: 28px;  padding: 20px;  width: 200px;  max-width:100%;  transition: all 0.5s;  cursor: pointer;  margin: 5px;}

.button-arrow-right span {  cursor: pointer;  display: inline-block;  position: relative;  transition: 0.5s;}

.button-arrow-right span:after {  content: '\00bb';  position: absolute;  opacity: 0;  top: 0;  right: -20px;  transition: 0.5s;}

.button-arrow-right:hover span {  padding-right: 25px;}

.button-arrow-right:hover span:after {  opacity: 1;  right: 0;}
/*css button arrow right animate end==============*/
/*Button 動畫 arrow right end ======================================*/

/*立即點燈樣式 js顯示隱藏div*/
#div1{
background-color:#fcfcfc;
height:auto;
width:100%;
max-width:100%;
display:none;
color:#000;
}
@media screen and (max-width:680px){
#div1{
background-color:#fcfcfc;
width:100%;
margin:0 auto;
display:none;
margin-top:10px;
}}

.closediv{padding:0 5px;text-align:right;}
.closebtn{cursor: pointer;}

/*點燈form表單樣式*/

input[type=text].form1, select.form1, textarea.form1 {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
  box-sizing: border-box;
}

label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}

input.form1[type=submit] {
  background-color: #04AA6D;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}

input.form1[type=submit]:hover {
  background-color: #45a049;
}

.form-container{
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

.col-25-form {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.col-75-form {
  float: left;
  width: 75%;
  margin-top: 6px;
}

.col-50-form {
  float: left;
  width: 50%;
  margin-top: 6px;
}



/* Clear floats after the columns */
.row-form:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 680px) {
  .col-50-form,.col-25-form, .col-75-form, input.form1[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}
/*點燈form表單樣式 end*/

/*光明燈名單樣式*/
/*光明燈樣式=======================================================*/
.light{display:inline-block;float:left;width:200px;height:230px;max-width:100%;box-sizing: border-box;margin:5px 5px;}
.light.responsive{max-width:200px;width:100%; }
.light.gallery {  margin: 5px;  border: 1px solid #ccc;background-color:#750000;color:#fff;}
.light.gallery:hover {  border: 1px solid #777;}
.light.gallery img {  width: 100%;  height: auto;}
.light.desc {  padding: 15px;  text-align: center;}
/*光明燈樣式 end=======================================================*/


/*新聞資訊樣式*/
.Block-report{margin:10px 0;}
a.Block_shadow{text-decoration:none;}
.Block_shadow_1 {
        box-shadow: 0 0 1px #3C3C3C;
        /*background-color:#FFFFBB;*/
        padding: 10px 16px;
}
.Block_shadow_1:hover {
       /* 加粗的陰影外框 */
        -moz-box-shadow: 0 0 1px 1px #9D9D9D;
        -webkit-box-shadow: 0 0 1px 1px #9D9D9D;
        box-shadow: 0 0 1px 1px #9D9D9D;
        background-color:#750000;
        color:#ffffff;
}
span.lf{float:left;}
span.rg{float:right;}
.rp-con{margin:10px 0;}

/*神明介紹樣式=====================================*/
.shenmin_g.center{padding:2px 2px;}
.shenmin_g{ margin: 0 auto; border: 1px solid #ccc;  float: left;  max-width:100%;  border-radius:5px 5px;}

@media screen and (max-width:480px){.shenmin_g {  /*margin: 5px;*/  margin: 0 auto;  width:100%;  max-width:100%;  }}

.shenmin_gImg{width:180px;height:auto;max-width:100%;max-height:auto;margin:0 auto;}
@media screen and (max-width:480px){.shenmin_gImg{  /*margin: 5px;*/  margin: 0 auto;  width:100%;  max-width:100%;  }}
.shenmin_g:hover {  border: 1px solid #777;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}

.shenmin_g img {  width: 180px;  height: 230px;max-width:100%;max-height:100%;}
.shenmin_g-desc {  padding: 5px 0 0 0;  text-align: center;}
.shenmin_g-desc {  padding: 5px 0 0 0;  text-align: center;}

.mg5{margin:5px;}
.centerMg{width:80%;margin:0 auto;}

div.gallery-pic {
  margin: 5px 18px;
  border: 1px solid #ccc;
  float: left;
  width: 200px;
  height:280px;/*300px*/
}

div.gallery-pic:hover {
  border: 1px solid #777;
}

div.gallery-pic img {
  width: 200px;
  height:200px;/*230px*/
  max-width:100%;
}

div.picdesc {
  padding: 15px;
  text-align: center;
}
.wrap-pic{width:200px;height:230px; float:left;margin:0 auto;}

/*神明介紹內頁樣式*/
h3 .drivler{background-color:lightblue;height:20px; width:8px;display:inline-block;float:left;margin:5px 8px;}

/*線上雜誌樣式*/
.magarine-wrap{max-width:100%;}
.magarine{padding:20px 15px;}
.magarine:hover{text-decoration:none;background-color:#BB3D00;color:#ffffff;}
a.mg-Link{text-decoration:none;color:#3c3c3c;}
.magarine span.more{float:right;}

/*開始求籤button*/
.button_start{ 
background-color: #f44336; 
  color: black; 
  border: 2px solid  #f44336;}
  
  .button_start:hover{
	  background-color: #f44336;
  color: white;
  }
  
  
  /*代燒金紙樣式*/
  
 .joss-img{width:100%;max-width:100%;max-height:auto;}