* {
	/*unicode 編碼 \5FAE\8EDF\6B63\9ED1\9AD4 將它先取代原本的「微軟正黑體」*/
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4, "微軟正黑體", "Microsoft JhengHei", MingLiU, sans-serif;
}


/* Web */

@media screen and (min-width: 768px) {
	.web-10p {
		width: 10%;
	}
	.web-20p {
		width: 20%;
	}
	.web-30p {
		width: 30%;
	}
	.web-33p {
		width: 33%;
	}
	.web-40p {
		width: 40%;
	}
	.web-49p {
		width: 49%;
	}
	.web-50p {
		width: 50%;
	}
	.web-60p {
		width: 60%;
	}
	.web-70p {
		width: 70%;
	}
	.web-80p {
		width: 80%;
	}
	.web-90p {
		width: 90%;
	}
	.web-99p {
		width: 99%;
	}
	.web-100p {
		width: 100%;
	}
	.web-text-left {
		text-align: left;
	}
	.web-text-center {
		text-align: center;
	}
	.web-text-right {
		text-align: right;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.mobile-10p {
		width: 10%;
	}
	.mobile-20p {
		width: 20%;
	}
	.mobile-30p {
		width: 30%;
	}
	.mobile-40p {
		width: 40%;
	}
	.mobile-49p {
		width: 49%;
	}
	.mobile-50p {
		width: 50%;
	}
	.mobile-60p {
		width: 60%;
	}
	.mobile-70p {
		width: 70%;
	}
	.mobile-80p {
		width: 80%;
	}
	.mobile-90p {
		width: 90%;
	}
	.mobile-99p {
		width: 99%;
	}
	.mobile-100p {
		width: 100%;
	}
	.mobile-text-left {
		text-align: left;
	}
	.mobile-text-center {
		text-align: center;
	}
	.mobile-text-right {
		text-align: right;
	}
	.col-sm-12-delete {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
	.col-sm-8-delete{
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
	.div_to_inline{
		display: inline;
	}
}

.certificate{
	border: 5px solid #ffffff;
	margin-bottom: 3px;
}
.certificate_describe{
	border: 1px solid #c7a24f;
	color: #c7a24f;
	display: inline-block;
	font-weight: bolder;
}
.height-auto {
	height: auto;
}

.padding-0 {
	padding: 0;
}

.padding-1p {
	padding: 1%;
}

.padding-2p {
	padding: 2%;
}

.padding-3p {
	padding: 3%;
}

.padding-4p {
	padding: 4%;
}

.padding-5p {
	padding: 5%;
}

.padding-top-1p {
	padding-top: 1%;
}

.padding-left-1p {
	padding-left: 1%;
}

.padding-right-1p {
	padding-right: 1%;
}

.padding-bottom-1p {
	padding-bottom: 1%;
}

.padding-top-2p {
	padding-top: 2%;
}

.padding-left-2p {
	padding-left: 2%;
}

.padding-right-2p {
	padding-right: 2%;
}

.padding-bottom-2p {
	padding-bottom: 2%;
}

.padding-top-3p {
	padding-top: 3%;
}

.padding-left-3p {
	padding-left: 3%;
}

.padding-right-3p {
	padding-right: 3%;
}

.padding-bottom-3p {
	padding-bottom: 3%;
}

.padding-top-4p {
	padding-top: 4%;
}

.padding-left-4p {
	padding-left: 4%;
}

.padding-right-4p {
	padding-right: 4%;
}

.padding-bottom-4p {
	padding-bottom: 4%;
}

.padding-top-5p {
	padding-top: 5%;
}

.padding-left-5p {
	padding-left: 5%;
}

.padding-right-5p {
	padding-right: 5%;
}

.padding-bottom-5p {
	padding-bottom: 5%;
}

.padding-top-6p {
	padding-top: 6%;
}

.padding-left-6p {
	padding-left: 6%;
}

.padding-right-6p {
	padding-right: 6%;
}

.padding-bottom-6p {
	padding-bottom: 6%;
}

.padding-top-7p {
	padding-top: 7%;
}

.padding-left-7p {
	padding-left: 7%;
}

.padding-right-7p {
	padding-right: 7%;
}

.padding-bottom-7p {
	padding-bottom: 7%;
}

.padding-top-8p {
	padding-top: 8%;
}

.padding-left-8p {
	padding-left: 8%;
}

.padding-right-8p {
	padding-right: 8%;
}

.padding-bottom-8p {
	padding-bottom: 8%;
}

.padding-top-9p {
	padding-top: 9%;
}

.padding-left-9p {
	padding-left: 9%;
}

.padding-right-9p {
	padding-right: 9%;
}

.padding-bottom-9p {
	padding-bottom: 9%;
}

.padding-top-10p {
	padding-top: 10%;
}

.padding-left-10p {
	padding-left: 10%;
}

.padding-right-10p {
	padding-right: 10%;
}

.padding-bottom-10p {
	padding-bottom: 10%;
}

.d-inline-block {
	display: inline-block;
}

.font-sm {
	font-size: small;
}

.font-md {
	font-size: medium;
}

.font-lg {
	font-size: large;
}

.font-xlg {
	font-size: x-large;
}

.font-xxlg {
	font-size: xx-large;
}

.font-bold {
	font-weight: bold;
}

.text-indent-2 {
	text-indent: 2em;
}

.list-style-none {
	list-style: none;
}

.vertical-align-top {
	vertical-align: top;
}
.vertical-align-sub {
	vertical-align: sub;
}


/*-- 共用架構 --*/

.wrapper {
	width: 100%;
}

.top {
	position: fixed;
	right: 0;
	bottom: 70px;
	width: 60px;
	min-height: 60px;
	font-size: 0;
	cursor: pointer;
	z-index: 999;
}

.content {
	width: 100%;
}

.btn-play {
	padding-right: 36px;
	border: 0;
	transition: background-color .5s ease;
}

.btn-play.btn-play-blue {
	color: snow;
	box-shadow: 0px 0px 1px 1px rgb(42, 87, 122), inset 1px 1px 0px 0px #c2cfd8;
	background: rgb(40, 85, 120);
	background: linear-gradient(to bottom, rgb(80, 125, 160) 0%, rgb(40, 85, 120) 100%);
}

.btn-play.btn-play-origin {
	color: snow;
	box-shadow: 0px 0px 1px 1px rgb(189, 102, 16), inset 1px 1px 0px 0px #c2cfd8;
	background: rgb(40, 85, 120);
	background: linear-gradient(to bottom, rgb(241, 146, 64) 0%, rgb(204, 73, 0) 100%);
}

.btn-play:focus,
.btn-play:hover {
	transition: background-color .5s ease;
}

.btn-play:focus.btn-play-blue,
.btn-play:hover.btn-play-blue {
	background: rgb(27, 67, 99);
	background: linear-gradient(to bottom, rgb(67, 116, 154) 0%, rgb(27, 67, 99) 100%);
}

.btn-play:focus.btn-play-origin,
.btn-play:hover.btn-play-origin {
	background: rgb(27, 67, 99);
	background: linear-gradient(to bottom, rgb(241, 146, 64) 0%, rgb(167, 0, 0) 100%);
}

.btn-play .fa-play {
	position: relative;
	width: 25px;
	height: 25px;
	text-align: center;
	vertical-align: bottom;
	border-radius: 100%;
	font-size: 12px;
	transition: background-color .5s ease;
}

.btn-play.btn-play-blue .fa-play {
	color: snow;
	border: 1px solid #567084;
	background: rgb(33, 83, 121);
}

.btn-play.btn-play-origin .fa-play {
	color: snow;
	border: 1px solid #a54010;
	background: rgb(171, 81, 18);
	transform: rotateZ(-90deg);
}

.btn-play:hover .fa-play {
	color: snow;
	transition: background-color .5s ease;
}

.btn-play:hover.btn-play-blue .fa-play {
	background: rgb(14, 49, 76);
}

.btn-play:hover.btn-play-origin .fa-play {
	background: rgb(167, 57, 4);
}

.btn-play .fa-play:before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 12px;
	height: 12px;
	transition: background-color .5s ease;
}

.btn-play .text {
	display: inline-block;
	width: auto;
	height: 25px;
	padding-left: 5px;
	line-height: 25px;
}

.banner {
	position: relative;
	margin: auto;
	width: 100%;
	max-width: 960px;
	border-bottom: 5px solid #02557e;
	z-index: 1;
}

.main {
	margin: auto;
	width: 100%;
	max-width: 960px;
}

.layout_M {
	border-radius: 0 0 15px 15px;
	box-shadow: 0 0 10px 1px #3e3e3e;
}

.footer {
	border-top: 1px solid #808080;/*1071002 footer的邊，TOP加灰色的線*/
}

.footer .copyright {
	width: 100%;
	max-width: 960px;
	padding: 1%;
	margin: auto;
	font-size: small;
}


/* Page header.php */


/* Web */

@media screen and (min-width: 992px) {
	.header {
		position: relative;
		width: 100%;
		height: 110px;
		background: url(../images/menu/bg.jpg) repeat-x;
		border-bottom: 5px solid #bad1d8;
		z-index: 99;
	}
	.header .web {
		/*width: 1000px;*/
		max-width: 1000px;
		width: 100%;
		height: 110px;
		margin: 0 auto;
	}
	.header .web .logo {
		float: left;
		width: 180px;
		height: 105px;
		padding-left: 50px;
		margin: 0;
	}
	.header .web .logo a {
		display: block;
	}
	.header .menu {
		float: left;
		width: 720px;
		height: 105px;
		margin: 0 0px 0 50px;
	}
	.header .menu ul {
		margin: 0;
		padding: 0;
	}
	.header .menu li {
		position: relative;
		display: inline-block;
		padding: 0 0 10px 5px;
		list-style: none;
		line-height: 35px;
		color: #074F67;
		box-sizing: border-box;
		z-index: 49;
	}
	.header .menu li a {
		display: block;
		text-decoration: none;
	}
	.header .menu li ul {
		display: none;
		position: absolute;
		top: 110px;
		background: #F8F7F3;
		border: 1px solid #bad1d8;
		border-radius: 0 0 15px 15px;
		text-align: center;
		z-index: 1000;
	}
	.header .menu li:hover ul {
		display: block;
		left: 0;
		right: 0;
		padding-top: 1em;
	}
	.header .menu li:hover ul li {
		left: 0;
		right: 0;
		width: 100%;
	}
	.header .menu li:hover ul li a {
		display: block;
		margin: auto;
		padding: 5px 10px;
		width: 130px;
		height: 35px;
		font-size: 16px;
		line-height: 25px;
		color: #074F67;
		text-decoration: none;
		box-sizing: border-box;
	}
	.header .menu li:hover ul li a:hover {
		color: #FFF;
		background-color: #006D84;
		text-decoration: none;
		border-radius: 15px;
		transition: 0.5s;
	}
	.header .mobile {
		display: none;
	}
}


/* Mobile */

@media screen and (max-width: 991px) {
	.header .web {
		display: none;
	}
}


/* Page about_01.html */

.movie_area {
	position: absolute;
	top: 130px;
	right: 158px;
	margin: auto;
	display: none;
	width: 450px;
	height: 310px;
	text-align: center;
	background-color: black;
	z-index: 2;
}

.close {
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
	z-index: 4;
	opacity: 1;
}


/* Web */

@media screen and (min-width: 768px) {
	.about_01 {
		background: url(../images/bg02.jpg);
		background-size: cover;
	}
	.about_01 .layout_M {
		background-color: #c2cfd8;
	}
	.about_01 .banner {
		margin-top: -15px;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.about_01 .layout_M {
		box-shadow: none;
	}
}


/* Page gm.html */


/* Web */

@media screen and (min-width: 768px) {
	.gm {
		background: url(../images/bg01.jpg);
		background-size: cover;
	}
	.gm .banner {
		margin-top: -15px;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.gm .layout_M {
		box-shadow: none;
	}
}


/* Page about_02.html */

.about_02 .border-blue {
	border: 1px solid #024c71;
	color: #024c71;
}

.about_02 .shengEn-group {
	display: inline-flex;
	flex-direction: row;
	justify-content: flex-start;
}


/* Web */

@media screen and (min-width: 768px) {
	.about_02 {
		background: url(../images/bg01.jpg);
		background-size: cover;
	}
	.about_02 .layout_M {
		background-color: #efefef;
	}
	.about_02 .banner {
		margin-top: -15px;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.about_02 .layout_M {
		box-shadow: none;
	}
}


/* Page about_03.html */

.about_03 .borderBlue {
	border: 1px solid #024c71;
	color: #424b52;
}
.mobile_line_break{
	padding-left: 20px;
}

/* Web */

@media screen and (min-width: 768px) {
	.about_03 {
		background: url(../images/bg01.jpg);
		background-size: cover;
	}
	.about_03 .layout_M {
		background-color: #efefef;
	}
	.about_03 .title-h1 {
		font-size: 50px;
		line-height: 55px;
	}
	.about_03 .title-h2 {
		font-size: 40px;
		line-height: 50px;
	}
	.about_03 .title-h3 {
		font-size: 35px;
		line-height: 45px;
	}
	.about_03 .title-h4 {
		font-size: 30px;
		line-height: 40px;
	}
	.about_03 .last-right-h3 {
		text-align: right;
		padding-right: 5%;
	}
	.about_03 .last-right-h4 {
		text-align: right;
		padding-right: 5%;
		color: darkgoldenrod;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.about_03 .layout_M {
		box-shadow: none;
	}
	.about_03 .title-h1 {
		font-size: xx-large;
	}
	.about_03 .title-h2 {
		font-size: x-large;
	}
	.about_03 .title-h3 {
		font-size: x-large;
	}
	.about_03 .title-h4 {
		font-size: x-large;
	}
	.about_03 .last-right-h3 {
		text-align: center;
	}
	.about_03 .last-right-h4 {
		text-align: center;
		color: darkgoldenrod;
	}
}

@media screen and (max-width: 560px) {
	.mobile_line_break{
		display: block;
		padding-left: 0px;
	}
}


/* Page pass.html */

.pass .banner {
	border-color: #0b7bad;
}

.pass .dark-blue {
	color: #28577b;
}

.pass .light-blue {
	color: #49bce0;
}


/* Web */

@media screen and (min-width: 768px) {
	.pass {
		background: #a5bac3;
	}
	.pass .layout_M {
		background-color: #efefef;
	}
	.pass .borderBlue {
		margin-left: -30px;
		padding: 14px;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.pass .layout_M {
		box-shadow: none;
	}
}


/* Page contractual.html */

.contractual .banner {
	border: 0;
}

.contractual .dark-blue {
	color: #28577b;
}

.contractual .light-blue {
	color: #01b0e6;
}

.contractual .dark-gold {
	color: darkgoldenrod;
}

.contractual .bg-lightBlue {
	background: #bdddea;
}

.contractual .border-bottom-dashed {
	border-bottom: 1px dashed rgb(0, 90, 109);
}


/* Web */

@media screen and (min-width: 768px) {
	.contractual {
		background: url(../images/bg03.jpg);
		background-size: cover;
	}
	.contractual .layout_M {
		background-color: #fffce9;
	}
	.contractual .banner .menu {
		position: absolute;
		bottom: 0;
		width: 100%;
		border-bottom: 4px solid #c7a24f;
	}
	.contractual .banner .menu ul {
		display: none;
		margin-bottom: 0;
	}
	.contractual .banner .menu ul li {
		padding-right: 2%;
	}
	.contractual .banner .menu ul li button {
		background-color: #c7a24f;
		color: white;
		border: 0;
		font-size: x-large;
		padding: 3px 40px;
		border-radius: 10px 10px 0 0;
	}
	.contractual .title {
		margin-left: -20px;
	}
	.contractual .border-darkBlue {
		border: 2px solid rgb(0, 90, 109);
	}
	.contractual .title-left {
		margin-left: -40px;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.contractual .layout_M {
		box-shadow: none;
	}
	.contractual .banner .menu {
		border-bottom: 4px solid #c7a24f;
	}
	.contractual .banner .menu ul {
		display: none;
	}
	.contractual .title {
		margin: auto;
	}
	.contractual .border-darkBlue.bed {
		border: 2px solid rgb(0, 90, 109);
	}
	.contractual .border-darkBlue.title-right {
		margin: auto;
	}
	.contractual .border-darkBlue.title-center {
		margin: auto;
	}
}


/* Page preplan.html */

.preplan .banner {
	border: 0;
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 START*/
.preplan_img{
	width: 100%;
}
.preplan_title{
	font-size: 42px;
   	font-weight: bolder;
   	text-align: center;
   	color: #024c71;
   	border-bottom: 2px solid #024c71;
   	width: 88%;
   	margin: 0 auto;
   	padding-bottom: 5px;
}
.preplan_title_1{
	font-size: 28px;
   	font-weight: bolder;
   	text-align: center;
   	color: #024c71;
   	border-top: 1px solid #024c71;
   	width: 88%;
   	margin: 2px auto 0px;
   	padding-top: 10px;

}
.preplan_title_2{
	position: relative;
	font-size: 30px;
	font-weight: bolder;
	background-color: #024c71;
	color: #ffffff;
	max-width: 420px;
	height: 75px;
	text-align: center;
	margin-top: 8%;
}
.preplan_content{
	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*/
}
.in_middle{
	position: relative;
  	top: 50%;
	transform: translateY(-50%);
}
.service_branch_area{
	padding-left: 0%;
	padding-right: 0%;
	max-width: 900px;
	margin: auto;
}
.service_branch{
	display: inline-block;
   	padding-left: 0%;
   	padding-right: 0%;
   	margin: 0 65px 0 65px;
}
.preplan_point{
	padding-left: 0%;
   	padding-right: 0%;
   	margin-bottom: 22px;
}
.preplan_branch{
	color: #30D5C8;
}
.border_top_right_left{
	border-top: 2px solid #024c71;
	border-right: 2px solid #024c71;
	border-left: 2px solid #024c71;
}
.horizontal_center{
	max-width: 860px;
	margin: 0 auto 5% auto;
}
.horizontal_center_2{
	max-width: 860px;
	margin: 0 auto 2% auto;
}
.preplan_content_link_area{
	text-align: center;
}
.preplan_content_link_block{
	display: inline-block;
	width: 45%;
}
.preplan_content_link{
    display: block;
	font-size: 18px;
    border: 1px solid #3DB7B3;
    padding-top: 8px;
    padding-right: 15px;
    padding-bottom: 8px;
    padding-left: 15px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    width: 200px;
    margin: 0 auto;
}
.preplan_content_link:link{
    text-decoration: none;
    color: #000000;
}
.preplan_content_link:visited{
    text-decoration: none;
    color: #000000;
}
.preplan_content_link:hover{
    text-decoration: none;
    color: #ef9c00;
}
.preplan_content_link img{
	vertical-align: top;
}
/*.preplan_content_link:hover img{
    margin-left: 10px;
}*/
.event_time_info_area{
	position: relative;
	margin: 0 auto;
}
.event_time_info_area img{
	width: 100%;
}
.event_time_info{
	text-align: center;
	width: 50%;
	position: absolute;
    top: 50%;
    left: 5%;
    transform: translate(-0%, -60%);
}
.event_time_info_link{
	color: snow;
    box-shadow: 0px 0px 1px 1px rgb(189, 102, 16), inset 1px 1px 0px 0px #c2cfd8;
    background: linear-gradient(to bottom, rgb(241, 146, 64) 0%, rgb(204, 73, 0) 100%);
    display: inline-block;
    padding: 6px 12px;
    font-size: large;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    border-radius: 4px;
    border: 0;
}
.event_time_info_link:link{
    text-decoration: none;
    color: #ffffff;
}
.event_time_info_link:visited{
    text-decoration: none;
    color: #ffffff;
}
.event_time_info_link:hover{
    text-decoration: none;
    color: #ffffff;
}
.event_time_info_link .fa-play {
    color: snow;
    border: 1px solid #a54010;
    background: rgb(171, 81, 18);
    transform: rotateZ(-90deg);
    position: relative;
    width: 25px;
    height: 25px;
    text-align: center;
    vertical-align: bottom;
    border-radius: 100%;
    font-size: 12px;
}
.event_time_info_link .fa-play:before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    width: 12px;
    height: 12px;
    transition: background-color .5s ease;
}
.goods_title{
	font-size: 32px;
   	font-weight: bolder;
   	/*text-align: center;*/
   	color: #024c71;
   	border-bottom: 2px solid #024c71;
   	width: 95%;
   	margin: 0 auto;
   	/*padding-bottom: 5px;*/
}
.goods_title_1{
	font-size: 24px;
   	/*font-weight: bolder;
   	text-align: center;*/
   	color: #024c71;
   	/*border-top: 1px solid #024c71;*/
   	width: 95%;
   	margin: 2px auto 0px;
   	padding-top: 10px;
}
.goods_box{
	display: flex;
   	align-items: center;
}
.goods_content{
	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*/
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 END*/
/* Web */

@media screen and (min-width: 768px) {
	.preplan {
		/*background: url(../images/bg03.jpg);*/
		background-color: #a5bac3;/*1070927 官網首頁'生活護照'的'禮儀服務'改版，背景而改了顏色*/
		background-size: cover;
	}
	.preplan .banner .menu {
		position: absolute;
		bottom: 0;
		width: 100%;
		border-bottom: 4px solid #c7a24f;
	}
	.preplan .layout_M {
		/*background-color: #f2e6d1;*/
		background-color: #ffffff;/*1070927 官網首頁'生活護照'的'禮儀服務'改版，背景而改了白色*/
	}
	.preplan .title-h2 {
		border: dashed 2px #9E9E9E;
		border-right: 0;
		border-left: 0;
		color: #be932c;
	}
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 START*/
@media (max-width: 890px){
	.service_branch_area{
		max-width: 760px;
	}
	.service_branch{
   		margin: 0 30px 0 30px;
	}
}
@media (max-width: 768px){
	.goods_box{
		/*display: block;*/
	}
	.event_time_info_link_title{
		font-size: 20px;
	}
}
@media (max-width: 750px){
	.service_branch_area{
		max-width: 320px;
	}
	.service_branch{
   		margin: 0 ;
	}
}
@media (max-width: 590px){
	.event_time_info_link_title{
		font-size: 17px;
	}
	.preplan_content_link {
	    font-size: 16px;
	    padding-top: 3px;
	    padding-right: 0px;
	    padding-bottom: 3px;
	    padding-left: 0px;
	    width: 175px;
	}
	.preplan_content_link img {
	    vertical-align: bottom;
	}
}
@media (max-width: 470px){
	.event_time_info_link_title{
		font-size: 15px;
	}
	.event_time_info_link{
		font-size: 12px;
	    width: 125px;
	    padding: 3px 6px;
	}
	.event_time_info_link .fa-play {
	    width: 16px;
	    height: 16px;
	}
}
@media (max-width: 420px){
	.preplan_content_link {
	    font-size: 12px;
	    width: 125px;
	}
	.event_time_info_link_title{
		display: block;
    	height: 12px;
    	font-size: 12px;
	}
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 END*/

/* Mobile */

@media screen and (max-width: 767px) {
	.preplan .layout_M {
		box-shadow: none;
	}
	.preplan .banner .menu {
		border-bottom: 4px solid #c7a24f;
	}
	.preplan .title-h2 {
		border: dashed 1px #9E9E9E;
		border-right: 0;
		border-left: 0;
		color: #be932c;
	}
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 START*/
@media (max-width: 420px){
	.horizontal_center {
	    max-width: 380px;
	}
	.horizontal_center_2 {
	    max-width: 380px;
	}
	.preplan_title{
		font-size: 28px;
	}
	.preplan_title_1{
		font-size: 20px;
	}
	.preplan_title_2{
		max-width: 260px;
		height: 35px;
		font-size: 20px;
	}
	.preplan_content_title{
		font-size: 17.5px;
	}
	.preplan_content{
		font-size: 17px;
		font-weight: normal;
	}
	.link_title{
		font-size: 17px;
	}
	.goods_title{
		font-size: 20px;
	}
	.goods_title_1{
		font-size: 17px;
	}
	.goods_box{
		padding-bottom: 6%;
	}

}
@media (max-width: 380px){
	.horizontal_center {
	    max-width: 330px;
	}
	.horizontal_center_2 {
	    max-width: 330px;
	}
	.preplan_title {
	    font-size: 25px;
	}
}
@media (max-width: 330px){
	.horizontal_center {
	    max-width: 280px;
	}
	.horizontal_center_2 {
	    max-width: 280px;
	}
	.preplan_title {
	    font-size: 22px;
	}
	.preplan_title_1{
		font-size: 17.5px;
	}
	.preplan_title_2{
		font-size: 18.5px;
	}
	.service_branch_area {
	    max-width: 280px;
	}
	.preplan_branch{
		font-size: 16px;
	}
	.preplan_phone,
	.preplan_address{
		font-size: 14px;
	}
}
/*1071001 官網首頁'生活護照'的'禮儀服務'改版 END*/

/* Page live.html */

.live .banner {
	border: 0;
}


/* Web */

@media screen and (min-width: 768px) {
	.live {
		background: url(../images/bg01.jpg);
		background-size: cover;
	}
	.live .banner .menu {
		position: absolute;
		bottom: 0;
		width: 100%;
		border-bottom: 4px solid #99abb5;
	}
	.live .banner .menu ul {
		margin-bottom: 0;
	}
	.live .banner .menu ul li {
		padding-right: 2%;
	}
	.live .banner .menu ul li button {
		background-color: #99abb5;
		color: white;
		border: 0;
		font-size: x-large;
		padding: 3px 40px;
		border-radius: 10px 10px 0 0;
		cursor: auto;
	}
	.live .layout_M {
		background-color: snow;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.live .layout_M {
		box-shadow: none;
	}
	.live .banner .menu {
		display: none;
	}
}


/* Page welfare2.html */

.welfare2 .banner {
	border: 0;
}

.welfare2 .title-left {
	margin-left: -1em;
}

.welfare2 .color-white {
	color: white;
}

.welfare2 .dark-blue {
	color: #28577b;
}

.welfare2 .light-blue {
	color: #01b0e6
}

.welfare2 .bg-darkBlue {
	background: #086a98;
}

.welfare2 .address {
	border-radius: 5px;
}

.welfare2 hr {
	border-top: 1px solid #086a98;
}


/* Web */

@media screen and (min-width: 768px) {
	.welfare2 {
		background: url(../images/bg01.jpg);
		background-size: cover;
	}
	.welfare2 .banner .menu {
		position: absolute;
		bottom: 0;
		width: 100%;
		border-bottom: 4px solid #99abb5;
	}
	.welfare2 .banner .menu ul {
		margin-bottom: 0;
	}
	.welfare2 .banner .menu ul li {
		padding-right: 2%;
	}
	.welfare2 .banner .menu ul li button {
		background-color: #99abb5;
		color: white;
		border: 0;
		font-size: x-large;
		padding: 3px 40px;
		border-radius: 10px 10px 0 0;
		cursor: auto;
	}
	.welfare2 .layout_M {
		background-color: snow;
	}
}


/* Mobile */

@media screen and (max-width: 767px) {
	.welfare2 .layout_M {
		box-shadow: none;
	}
	.welfare2 .banner .menu {
		border-bottom: 4px solid #99abb5;
	}
}


/* Mobile Android & iOS WebView */


/* Page sn_mobile/comp/comp_content/index.html */

.mobile .fixTop-goBack-title {
	/*position: fixed;
	top: 0;
	left: 0;
	right: 0;*/
	width: 100%;
	background-color: white;
	border-top: solid 1px white;
	border-bottom: solid 3px #497699;
	color: #2f4f4f;
	font-weight: bold;
	text-align: center;
	z-index: 3;
}

.mobile .fixTop-goBack-title a {
	color: #2f4f4f;
	text-decoration: none;
}

.mobile .fixTop-goBack-title span {
	border-bottom: 2px solid #497699;
}

.mobile .btn_go_back {
	position: fixed;
	right: 1%;
	bottom: 5%;
	width: 70px;
	min-height: 70px;
	color: snow;
	background-color: #1d639c;
	opacity: 0.8;
	z-index: 999;
}

.mobile .loading-mask {
	display: none;
	position: fixed;
	width: 100vw;
	height: 100vh;
	background: rgba(0,0,0,.5);
	z-index: 2;
}

.mobile .loading-mask .loader-gif {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 128px;
    height: 128px;
}

#template_movie{
	display:none;
	position:fixed;
	top:50%;
	left:50%;
	width:800px;
	height:500px;
	z-index:3;}

 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
  #template_movie .close {
		right: -20px;  
	}
}

/*1130222 集團介紹_榮耀分享開相簿和下載的需求 START*/
.imgs_container {
    padding: 0 20px 45px 20px;
}
.img_div{
	width: 24%;
	height:150px;
	float: left;
	padding: 10px;
	position: relative;
}
.img_div .original_img_btn{
	max-width: 100%;
	max-height:90%;
	display: block;
	margin: 0 auto;
}
/*.img_div .original_img_zoom_in{
	position: absolute;
	top:10px;
	right: 10px;
	display: block;
	width: 10%;
}*/
.img_div .original_img_zoom_in{
	position: absolute;
	max-width: 100%;
    max-height: 100%;
    top: -20px;
  	right: 0;
  	bottom: 0;
  	left: 0;
  	margin: auto;
}
.img_serial_number{
	text-align: center;
	font-weight: bolder;
}
.imgs_more_area{
	text-align: right;
	padding: 5px;
}
.imgs_more{
	text-decoration:underline;
	color:#000000;
	font-weight: bolder;
	cursor: pointer;
}
@media only screen and (max-width: 768px) {
	.img_div{
    	width: 33%;
	}
}
@media only screen and (max-width: 576px) {
	.img_div{
    	width: 49%;
    	padding: 5px;
    	height:130px;
	}
	.img_div .original_img_zoom_in{
		top:5px;
		right: 5px;
	}
}
.img_mask {
	position: fixed;
	background-color: #000;
	z-index: 1032;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.8;
	display: none;
}
.original_img_div{
	max-height: 100vh;
	max-width: 100vw;
  	background: #ccc;
  	position: fixed;
  	top:50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	z-index: 1033;
  	display: none;
}
.original_img{
	max-height: 85vh;
	max-width: 85vw;
  	background: #ccc;
  	bottom: 0;
}
.img_transparent_mask{
	position: fixed;
	background-color: #000;
	z-index: 1034;
	top:50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	opacity: 0;
	display: none;
}
/*.img_download_btn{
	z-index: 1035;
	position: absolute;
	top: -30px;
    left: 0px;
	color: #000000;
	font-size: 16px;
	display: none;
	background-color: #ffffff;
	border: 1px solid #000;
}*/
/*.img_download_btn{
	z-index: 1035;
	position: absolute;
	bottom: -30px;
    right:  0px;
	color: #000000;
	font-size: 16px;
	display: none;
	background-color: #ffffff;
	border: 1px solid #000;
}*/
.img_download_btn_a:link{
	text-decoration:none;
}
.img_download_btn{
	background-color: #ffffff;
	color: #000000;
	font-size: 22px;
	display: none;
	text-align: center;
}
/*.img_download_btn a{
	color: #000000;
	text-decoration:none;
}*/
.img_download_close_btn{
	z-index: 1035;
	position: absolute;
	top: -36px;
    right: 0px;
	color: #000000;
	font-size: 16px;
	display: none;
	background-color: #ffffff;
	border: 1px solid #000;
	padding: 3px;
}
.img_download_Press{
    background-color: #ffffff;
	color: #000000;
	font-size: 22px;
	display: none;
	text-align: center;
}
/*1130222 集團介紹_榮耀分享開相簿和下載的需求 END*/

.layout_M hr{
	background-color: #eee!important;
	opacity: 1!important;
	margin: 1.25rem auto!important;
}

h2{
	font-size: 30px!important;
	margin-top: 20px!important;
    margin-bottom: 10px!important;
}

h3{
	font-size: 24px;
	margin-top: 20px!important;
    margin-bottom: 10px!important;
}

h4{
	font-size: 18px;
	margin-top: 10px!important;
    margin-bottom: 10px!important;
}

h5 {
    font-size: 14px!important;
    margin-top: 10px!important;
    margin-bottom: 10px!important;
}

.btn{
	font-size: 14px!important;
}

p{
	margin-bottom: 10px!important;
}

a{
	text-decoration: none!important;
}

.bi{
	display: inline-block!important;
	line-height: 0!important;
	vertical-align: text-bottom!important;
	font-size: 24px!important;
}

body{
	font-size: 14px!important;
}

.dropdown-menu>li>a{
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
.dropdown-menu{
	background-color: transparent;
	border: 0;
	font-size: 14px;
}

/*1070914 取消'捲軸移動至相對分頁頂部位置，更換導覽列'，新增樣式 START*/
.sn_consumer_and_shop_hotline{
	/*position: fixed;
	bottom: 0;*/
	width: 100%;
	max-height: 45px;
	min-height: 25px;
	color: #0d4a7d;
	background-color: #d5b45c;
	opacity: 0.8;
	z-index: 999;
	text-align: center;
	font-weight: bolder;
	font-size: 20px;
}
.sn_consumer_and_shop_hotline span{
	display: inline-block;
	margin: 0 5px 0 5px;
}
/*#intro2{
	padding-top: 75px;
	padding-bottom: 130px; 
}*/
@media screen and (max-width: 420px){
	.sn_consumer_and_shop_hotline{
		font-size: 13px;
	}
	.sn_consumer_and_shop_hotline span{
		margin: 2px 5px 2px 5px;
	}
}
@media screen and (max-width: 370px){
	.sn_consumer_and_shop_hotline{
		line-height: 13px;
		min-height: 26px;
	}
	/*.mobile .btn_go_back{
		bottom: 9%;
	}*/
	.sn_consumer_and_shop_hotline span:nth-child(1){
		margin: 3px 5px 0px 5px;
	}
	.sn_consumer_and_shop_hotline span:nth-child(2){
		margin: 2px 5px 25px 5px;
	}
}
@media screen and (max-width: 320px){
	.sn_consumer_and_shop_hotline{
		line-height: 12px;
		min-height: 24px;
	}
	/*.mobile .btn_go_back{
		bottom: 10%;
	}*/
	.sn_consumer_and_shop_hotline span:nth-child(1){
		margin: 5px 5px 2px 5px;
	}
	.sn_consumer_and_shop_hotline span:nth-child(2){
		margin: 2px 5px 20px 5px;
	}
}
/*1070914 取消'捲軸移動至相對分頁頂部位置，更換導覽列'，新增樣式 END*/