@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Serif+TC:wght@400;600&display=swap');
/* ======================================
	Category:
	01. 表單元件基本設定
	02. 其他基本設定
	03. 分頁設定
	04. 套用owl.carousel之輪播基本設定
	05. 回頂端按紐

	06. 頁首header設定
	07. 小螢幕時選單設定
	08. 頁尾footer設定
	09. 輪播banner設定
	10. 全頁面共同設定

	11. 左側內容

	12. 首頁
	13. 名家名舍
	14. 鑽石名家(相關連結)
	15. 名鴿欣賞
	16. 入賞鴿
	17. 賽鴿柑仔店
	18. 紀錄鴿交流
	19. 拍賣中心
	20. 地方鴿訊
	21. 常見問題

	----

	其他CSS、JS:
	自訂：customize.js
	輪播用：animate.css  and  owl.carousel.min.css  and  owl.carousel.js
	圖片點按放大功能：jquery.fancybox.min.css  and  jquery.fancybox.min.js
	多層次menu收縮功能：mtree.js
	內容收縮功能：slide_toggle

====================================================================================================================================== */



/* ======================================
	01. 表單元件基本設定
=================================================================================================================== */
input , select , textarea{
    padding: 0 5px;
    font-size: 14px;
    line-height: 1.2;
    color: #333;
    background-color: #fff;
    border: 1px solid #ccc;
	vertical-align:middle;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
input::-webkit-input-placeholder , select::-webkit-input-placeholder , textarea::-webkit-input-placeholder{ color:rgba(51,51,51,1); font-size:1em;}
input::-moz-placeholder , select::-moz-placeholder , textarea::-moz-placeholder { color:rgba(51,51,51,1); font-size:0.95em;}
input::-ms-input-placeholder , select::-ms-input-placeholder , textarea::-ms-input-placeholder { color:rgba(51,51,51,1); font-size:1em;}
input::-moz-placeholder , select::-moz-placeholder , textarea::-moz-placeholder { color:rgba(51,51,51,1); font-size:1em;}
/*select{
	padding-right:25px;
	appearance:none;
    -webkit-appearance: none;
    -moz-appearance: none;
	background-image:url(../images/selt-arrow.png);
	background-repeat: no-repeat;
	background-position: right 10px center;*/
}
select::-ms-expand { display: none; }
input:focus , select:focus{
	border-color: rgba(13,105,231, 0.2);
    box-shadow: 0 1px 1px rgba(13,105,231, 0.075) inset, 0 0 5px rgba(13,105,231, 0.1);
    outline: 0 none;
}
label{ line-height:1; }




/* ======================================
	02. 其他基本設定
=================================================================================================================== */
body, .wrapper{ color:#333; background:#fff; font-family:"微軟正黑體", "新細明體", Arial; font-size:16px; }

/* a鏈結字 */
a { color:#333;}
a:hover, a:focus { color:#F7830F; text-decoration:none; }

/*方形圖設定*/
.item-thumb-frame { position: relative; display: block; width: 100%; overflow: hidden; }
.item-thumb { display: block; max-width: 100%; padding-bottom: 100%; }

.flex-container{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }



/*欄模組-有區間*/
.cols-group{}
.two-cols-list , .three-cols-list ,
.four-cols-list , .five-cols-list , .six-cols-list ,
.seven-cols-list , .eight-cols-list{ display:flex; flex-wrap:wrap; margin:0 -10px; }

.two-cols-list > li , .three-cols-list > li ,
.four-cols-list > li , .five-cols-list > li ,
.six-cols-list > li , .seven-cols-list > li ,
.eight-cols-list > li{ padding-left:10px; padding-right:10px; margin-bottom:30px; }

.two-cols-list > li{ width:calc( 100% / 2 ); }
.three-cols-list > li{ width:calc( 100% / 3 ); }
.four-cols-list > li{ width:calc( 100% / 4 ); }
.five-cols-list > li{ width:calc( 100% / 5 ); }
.six-cols-list > li{ width:calc( 100% / 6 ); }
.seven-cols-list > li{ width:calc( 100% / 7 ); }
.eight-cols-list > li{ width:calc( 100% / 8 ); }






/* ======================================
	03. 分頁設定 page
=================================================================================================================== */
.page{
	margin:60px 0 45px 0;
	font-size:12px;
	text-align:center;
	color:#666;
}
.page a , .page span{
	display:inline-block;
	width:40px;
	height:40px;
	/*border-radius:5px;*/
	border:2px solid #999;
	line-height:36px;
	color:#666;
	font-weight:600;
	background:#fff;
	text-align:center;
}
.page span{ background:#227FB8; color:#fff; border-color:#227FB8; }
.page a:hover{ border-color:#F28F13; color:#F28F13; }





/* ======================================
	04. 套用owl.carousel之輪播基本設定
=================================================================================================================== */
/* 輪播-左右按鈕 */
.owl-nav-style .owl-next , .owl-nav-style .owl-prev{
	position: absolute;
	top:50%;
	width:40px;
	height:60px;
	margin-top:-30px;
	opacity:0;
	background:rgba(255,255,255,0.5);
	transition: all 0.2s ease-in-out;
}
.owl-nav-style .owl-prev { left:0; }
.owl-nav-style .owl-next{ right:0; }
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-prev:after ,
.owl-nav-style .owl-next:before , .owl-nav-style .owl-next:after{
	position:absolute;
	z-index:5;
	left:50%;
	margin-top:-6px;
	width:3px;
	height:20px;
	content:"";
	background:#666;
}
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-next:after{ bottom:50%; margin-bottom:-16px; }
.owl-nav-style .owl-prev:after , .owl-nav-style .owl-next:before{ top:50%; margin-top:-16px; }
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-next:before{
	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
.owl-nav-style .owl-prev:after , .owl-nav-style .owl-next:after{
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
.owl-nav-style:hover .owl-prev , .owl-nav-style:hover .owl-next{ opacity:0.7; }
.owl-nav-style .owl-prev:hover , .owl-nav-style .owl-next:hover{ opacity:1; }



/*輪播-底下圓圈*/
.owl-dots-style .owl-dots{
	position:absolute;
	bottom:-1px;
	left:0;
	width:100%;
	z-index:3;
	/*text-align:right;*/
	padding:5px 20px;
	text-align:center;
	/*display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-end;*/
}
.owl-dots-style .owl-dots .owl-dot { display:inline-block; vertical-align:middle; zoom:1 }
.owl-dots-style .owl-dots .owl-dot span {
	width:25px;
	height:10px;
	margin:0px 7px;
	background:rgba(255,255,255,0.3);
	border:2px solid #2483BC;
	border-radius:5px;
	display:block;
	-webkit-backface-visibility:visible;
	transition:opacity .2s ease , width .2s ease;
}
.owl-dots-style .owl-dots .owl-dot:hover span { background:#fff; border-color:#2483BC; }
.owl-dots-style .owl-dots .owl-dot.active span{ width:40px; background:#2483BC; border-color:#2483BC; }





/* ======================================
	05. 回頂端按紐
=================================================================================================================== */
.scrolltop{
	position: fixed;
	z-index:8;
	z-index:9;
    right: 10px;
    bottom: 70px;
    display: block;
    cursor: pointer;
	background:#25c5cf;

	background:linear-gradient(top,#56A8F0 , #3B86D1 );
	background:-moz-linear-gradient(top,#56A8F0 , #3B86D1 );
	background:-webkit-linear-gradient(top,#56A8F0 , #3B86D1 );
	background:-o-linear-gradient(top,#56A8F0 , #3B86D1 );
	background:linear-gradient(top,#56A8F0 , #3B86D1 );

    border:2px solid rgba(255,255,255,0.8);
    border-radius: 33px;
    padding: 14px 7px;
	opacity:0;
}
.scrolltop img {
    animation: scroll-act1 2.5s infinite;
}
.scrolltop.show{ opacity:1; }

@keyframes scroll-act1{
	0% {
		opacity: 0;
		-webkit-transform: translateY(12px);
		-ms-transform: translateY(12px);
		transform: translateY(12px);
	}
	50% {
		opacity: 1;
		-webkit-transform: translateY(0px) scale(1);
		-ms-transform: translateY(0px) scale(1);
		transform: translateY(0px) scale(1);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(-10px) scale(1);
		-ms-transform: translateY(-10px) scale(1);
		transform: translateY(-10px) scale(1);
	}
}






/* ======================================
	06. 頁首header設定
=================================================================================================================== */
.wrapper-bg{ background:url(../images/main-bg.png) repeat center top; background-size:100% auto; }

.header{
	background:url(../images/top-bg.png) no-repeat center top;
	background-size:100% auto;
}

.mobile-fixed-bar{
	display:none;
	position:fixed;
	z-index:100;
	bottom:0;
	left:0;
	width:100%;
	background:#E2F2FB;
	box-shadow: 0 -2px 5px rgba(0,0,0,0.2);
}
.mobile-fixed-list{ /*position:relative;*/ display:flex; flex-wrap:wrap; align-items:center; }
.mobile-fixed-list > li{ width:calc(100% / 3); }
.mobile-fixed-list > li:nth-child(1){ width:20%;}
.mobile-fixed-list > li:nth-child(2){ width:40%;}
.mobile-fixed-list > li:nth-child(3){ width:40%;}
/*.mobile-fixed-list > li:nth-child(3) , .mobile-fixed-list > li:nth-child(4){ width:30%;}*/
/*.mobile-fixed-list > li:last-child{ border-right-width:0px; }*/

.mobile-fixed-item a{
	position:relative;
	z-index:60;
	display:block;
	line-height:1;
	/*background:#E2F2FB;*/
	padding:20px 5px;
	text-align:center;
	border-right:1px solid #C1D9F4;
	border-top:1px solid #C1D9F4;
}
.mobile-fixed-item .title{
	display:block;
	line-height:1;
	color:#000;
	letter-spacing:0;
	font-weight:600;
	font-size:18px;
}

.mobile-fixed-item.menu_mark a {
    background: #F7830F;
}


.fixed-menu-toggle-wrap{ position:relative; }

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

.fixed-menu-trigger{
	position:relative;
	z-index:60;
	display:block;
	line-height:1;
	padding:13px 5px;
	text-align:center;
	background:#E2F2FB;
	border-right:1px solid #C1D9F4;
	border-top:1px solid #C1D9F4;
}
.fixed-menu-trigger .toggle-trigger-txt{
	display:block;
	line-height:1.8;
	color:#000;
	letter-spacing:0;
	font-weight:600;
	font-size:18px;
}
/*.fixed-menu-trigger .toggle-trigger-icon , .fixed-menu-trigger .toggle-trigger-txt{ display:inline-block; vertical-align:middle; }
.fixed-menu-trigger .toggle-trigger-icon{
	position:relative;
	width:20px;
	height:20px;
	margin-right:-5px;
	margin-bottom:1px;
}
.fixed-menu-trigger .toggle-trigger-txt{ margin-top:1px;}
.fixed-menu-trigger .toggle-trigger-icon:before , .fixed-menu-trigger .toggle-trigger-icon:after{
	position:absolute;
	left:15%;
	width:70%;
	height:2px;
	margin-top:0;
	content:"";
	background:#333;

	transition:transform 0.5s ease;
	-webkit-transition:transform 0.5s ease;
	-moz-transition:transform 0.5s ease;
	-o-transition:transform 0.5s ease;
}
.fixed-menu-trigger .toggle-trigger-icon:before{ top:25%; }
.fixed-menu-trigger .toggle-trigger-icon:after{ top:75%; }

.fixed-menu-trigger .toggle-trigger-icon .iocn-line{
	position:absolute;
	top:10px;
	left:15%;
	width:70%;
	height:2px;
	background:#333;
}
.fixed-menu-trigger.opened{ color:#fff; }
.fixed-menu-trigger.opened .toggle-trigger-icon:before{
	-webkit-transform:translate(0, 5px) rotate(-45deg);
    transform:translate(0, 5px) rotate(-45deg);
}
.fixed-menu-trigger.opened .toggle-trigger-icon:after{
	-webkit-transform:translate(0, -5px) rotate(45deg);
    transform:translate(0, -5px) rotate(45deg);
}
.fixed-menu-trigger.opened .toggle-trigger-icon .iocn-line{ opacity:0; }*/


.fixed-menu-trigger.opened{ background:#F7830F; }
.fixed-menu-trigger.opened .toggle-trigger-txt{ color:#fff; }



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

.fixed-menu-toggle-contnet{
	position: absolute;
	z-index:59;
	bottom:0;
	right:0;
	width:100%;
	min-width:140px;
	background:#E2F2FB;
	padding-bottom:45px;
	box-shadow: -1px -2px 5px rgba(0,0,0,0.2);

	visibility: hidden;
	opacity:0;
}
.fixed-menu-toggle-contnet.opened{
	visibility: visible;
	display: block;
	opacity: 1;
}


.fixed-menu-list{ position:relative; z-index:5; display:flex; flex-wrap:wrap; }
.fixed-menu-list li{ width:100%; }
.fixed-menu-list li a{
	position:relative;
	display:block;
	padding:16px 5px;
	font-size:17px;
	text-align:center;
	color:#000;
	letter-spacing:0;
	line-height:1.5;
	border-bottom:1px solid #C1D9F4;
}
.fixed-menu-list li:last-child a{ border-bottom-width:0px; }
.fixed-menu-list li a .title{ display:block; }

















.header-top-bar{ /*position:relative; z-index:2;*/ padding:30px 0; /*background:#fff;*/ }
.header-top-bar:before{
	position:absolute;
	z-index:-1;
	top:0;
	left:50%;
	width:1920px;
	height:250px;
	margin-left:-960px;
	content:"";
	background:url(../images/top-bg.png) no-repeat center top;
	background-size:100% auto;
}

.header-top-flex{ display:flex; flex-wrap:wrap; align-items:center; margin:5px 0; }
.header-top-flex .flex-col-lang{  width:310px; }
.header-top-flex .flex-col-social{ width:210px; display:none; }
.header-top-flex .flex-col-logo{ width:calc( 100% - 670px ); }
.header-top-flex .flex-col-trigger{ display:none; }
.header-top-flex .flex-col-subnav{  width:360px; }



.logo{ position:relative; z-index:2; display:block; max-width:440px; margin:0 auto; }
.logo a{ display:block; }
.logo img{ display:block; max-width:100%; height:auto; }




.tiny-item{
	border-radius:5px;
	overflow:hidden;
	background:#fff;
	border:1px solid #fff;
	box-shadow:1px 1px 1px rgba(0,0,0,0.1);
	letter-spacing:0;
	text-align:center;

	transition:All 0.15s ease;
}
.tiny-item a{
	display:block;
	width:100%;
	height:100%;
}
.tiny-item .icon , .tiny-item .title{ display:block; line-height:1; }
.tiny-item .icon{ width:30px; }
.tiny-item .icon img{ display:block; max-width:100%; height:auto; }
.tiny-item .title{ font-size:20px; color:#333; }

.tiny-item.item-faq a{ background:#c0c; }
.tiny-item.item-fb a{ background:#385693; }
.tiny-item.item-line a{ background:#2BAC37; }
.tiny-item.item-wechat a{ background:#4FBD33; }
.tiny-item.item-register a{ background:#388CD3; }
.tiny-item.item-login a{ background:#F87C00; }
.tiny-item.item-contact a{ background:#3dce40; }

.tiny-item:hover{
	box-shadow:1px 1px 3px rgba(0,0,0,0.5);
}

.menu-item.item-fb a .icon img{ background:#385693; }
.menu-item.item-line a .icon img{ background:#2BAC37; }
.menu-item.item-wechat a .icon img{ background:#4FBD33; }

.menu-item.item-fb a .icon img, .menu-item.item-line a .icon img, .menu-item.item-wechat a .icon img{ width:20px; padding:3px; border-radius:5px;vertical-align:bottom; }

/*語系*/
.language-list{ display:flex; flex-wrap:wrap; align-items:center; }
.language-list li{ margin:5px 10px 5px 0; }
.language-list .tiny-item{
	width:100px;
	height:43px;
	border:1px solid #ccc;
}
.language-list .tiny-item a{
	padding:0;
	color:#fff;
}
.language-list .tiny-item a .title{ line-height:40px; font-size:20px; color:#fff; }

.language-list li.active a{ background:#F7830F; border-color:#F7830F; }
.language-list li.active .title{ color:#fff; }
.language-list li.active .tiny-item a:hover .title{ color:#fff; }




/*社群*/
.header-social-list{ display:flex; flex-wrap:wrap; align-items:center; }
.header-social-list li{ margin:5px 0 5px 10px; }
.header-social-list .tiny-item{
	width:45px;
	height:45px;
	border:1px solid #ccc;
}
.header-social-list .tiny-item .icon{ width:45px; padding:5px; }
.header-social-list .tiny-item.item-contact a .title{ padding-top:4px; font-size:15px; color:#fff; }

.header-social-list li.mobile-show{ display:none; }
.header-social-list .tiny-item.item-contact a{ background:#3785C4; }





/*會員專區*/
.subnav-list{ display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.subnav-list li{ margin:5px 0 5px 10px; }
.subnav-list .tiny-item a{ padding:6px 8px; }
.subnav-list .tiny-item a .title{ color:#fff; }











.nav-bar{ position:relative; z-index:5; background:#0E6CFF; }


/*選單*/
.menu-list{ display:flex; flex-wrap:wrap; text-align:center; }
.menu-list > li{ position:relative; width:calc( 100% / 8 ); padding:0 2px; }
.menu-list > li:before{
	position:absolute;
	top:50%;
	right:0;
	width:1px;
	height:16px;
	margin-top:-8px;
	content:"";
	background:#fff;
}
.menu-list > li:last-child:before{ display:none; }
.menu-list li a{ display:block; }

.menu-item{
	display:block;
	padding:12px 2px;
	line-height:1;
}

.menu-item .title{
	position:relative;
	display:inline-block;
	color:#fff;
	font-size:22px;
	font-weight:600;
	padding:5px 12px 7px 12px;
	border-radius:20px;
	line-height:1;
}
.menu-item .title:before , .menu-item .title:after{
	position:absolute;
	z-index:1;
	top:50%;
	width:20px;
	height:20px;
	content:"";
	margin-top:-12px;

	opacity:0;
}
.menu-item .title:before{
	left:-16px;
	background:url(../images/web-02.png) no-repeat center left;
	background-size:cover;
}

.menu-item .title:after{
	right:-16px;
	background:url(../images/web-04.png) no-repeat center right;
	background-size:cover;
}

.menu-item a:hover .title:before{
	opacity:1;
}
.menu-item a:hover .title:after{
	opacity:1;
}
.menu-item a:hover .title{ background:#F7830F; color:#fff; }



/*選單-第二、三之後 層*/
.menu-list ul{
	position:absolute;
	z-index:5;
	width:100%;
	background:#0E6CFF;

	box-shadow:0 2px 5px rgba(0,0,0,0.1);

	visibility:hidden;
	opacity:0;
	-webkit-transition: opacity 0.5s ease , transform 0.5s ease;
	transition: opacity 0.5s ease , transform 0.5s ease;

	-moz-transform:translateY(5px);
	-webkit-transform:translateY(5px);
	-o-transform:translateY(5px);
	-ms-transform:translateY(5px);
	transform:translateY(5px);
}
/*選單-第二、三之後 層 - 鼠標滑過 ul顯現*/
.menu-list li:hover > ul{
	visibility:visible;
	opacity:1;

	-moz-transform:translateY(0);
	-webkit-transform:translateY(0);
	-o-transform:translateY(0);
	-ms-transform:translateY(0);
	transform:translateY(0);
}


.menu-list ul > li a{ border-top:1px solid #eee; padding:16px 2px; line-height:1.5; color:#fff; font-size:18px; font-weight:600; }
.menu-list ul > li a:hover{ background:#F7830F; color:#fff; }



/*會員中心選單-第二、三之後 層*/
ul.sub_menu_block ul{
	position:absolute;
	z-index:6;
	width:150px;
	margin-left:-25px;
	background:#388CD3;
	box-shadow:0 2px 5px rgba(0,0,0,0.1);
	visibility:hidden;
	opacity:0;
	-webkit-transition: opacity 0.5s ease , transform 0.5s ease;
	transition: opacity 0.5s ease , transform 0.5s ease;
	-moz-transform:translateY(5px);
	-webkit-transform:translateY(5px);
	-o-transform:translateY(5px);
	-ms-transform:translateY(5px);
	transform:translateY(5px);
}

/*會員中心選單-第二、三之後 層 - 鼠標滑過 ul顯現*/
ul.sub_menu_block li:hover > ul{
	visibility:visible;
	opacity:1;
	z-index:100000000000000000000;
	-moz-transform:translateY(0);
	-webkit-transform:translateY(0);
	-o-transform:translateY(0);
	-ms-transform:translateY(0);
	transform:translateY(0);
}

ul.sub_menu_block ul > li { border-top:1px solid #eee; width:150px; height:50px; line-height:50px; margin:0; text-align:center; }
ul.sub_menu_block ul > li:hover{ background:#F7830F; color:#fff; }
ul.sub_menu_block ul > li a { color:#fff; font-size:20px; font-weight:600; }




/*跑馬燈*/
.marquee-box{ position:relative; background:#fff; padding:8px 10px 2px 50px; margin:15px 0; border:1px solid #ccc; border-radius:5px; height:50px; overflow:hidden; }
.marquee-icon{ position:absolute; top:50%; left:10px; width:30px; height:30px; margin-top:-15px; background:#fff; }
.marquee-icon img{ display:block; max-width:100%; height:auto; }

.marquee{ width:100%; overflow:hidden; line-height:35px; min-height:35px; }

.marquee-message a{ display:inline-block; margin:0 20px; color:red; font-size:22px; font-weight:600; }
.marquee-message a:hover{ color:#F7830F; }




.mobile-quickly-bar{ display:none; background:#e2f2fb; padding:10px 0; }

.quickly-link-list{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; max-width:600px; margin-left:auto; margin-right:auto;  }
.quickly-link-list li{ width:calc( 100% / 3 ); }

.quickly-link-item .icon{}
.quickly-link-item .icon img{ display:block; max-width:100%; height:auto; }






/* ======================================
	07. 小螢幕時選單設定
=================================================================================================================== */
/*小螢幕時選單鈕*/
.menu-trigger{
	display:none;
	width:40px;
	/*height:40px;*/
	margin-left:auto;
}
.menu-trigger-icon , .menu-trigger-txt{}
.menu-trigger-icon{
	position:relative;
	width:40px;
	height:40px;
	margin:0 auto;
	background:#fff;
	border-radius:3px;
	overflow:hidden;
	/*border:2px solid #E3341B;*/
}
/*
.menu-trigger-icon:before , .menu-trigger-icon:after{
	position:absolute;
	left:15%;
	width:70%;
	height:3px;
	margin-top:-2px;
	content:"";
	background:#E3341B;
	border-radius:3px;

	transition:transform 0.5s ease;
	-webkit-transition:transform 0.5s ease;
	-moz-transition:transform 0.5s ease;
	-o-transition:transform 0.5s ease;
}
*/
/*
.menu-trigger-icon:before{ top:25%; }
.menu-trigger-icon:after{ top:75%; }
*/
.menu-trigger-icon .iocn-line{
	position:absolute;
	top:50%;
	left:15%;
	width:70%;
	height:3px;
	margin-top:-2px;
	background:#E3341B;
	border-radius:3px;
}
.menu-trigger.opened .menu-trigger-icon { }
.menu-trigger.opened .menu-trigger-icon:before{
	-webkit-transform: rotate(-45deg) translate(-7px, 7px) ;
    transform: rotate(-45deg) translate(-7px, 7px) ;
}
.menu-trigger.opened .menu-trigger-icon:after{
	-webkit-transform: rotate(45deg) translate(-7px, -7px) ;
    transform: rotate(45deg) translate(-7px, -7px) ;
}
.menu-trigger.opened .menu-trigger-icon .iocn-line{ opacity:0; }
.menu-trigger-txt{ color:#fff; font-weight:bolder; font-size:1.2em; }


.menu-trigger-txt{ font-size:15px; color:#17456E; line-height:1; text-align:center; margin-top:4px; font-weight:100; }



/*小螢幕時選單*/
.menu-toggle-area{
	display:none;
	position:fixed;
	z-index:1000;
	top:0;
	bottom:0;
	right:-280px;
	width: 280px;
	height:100%;
	height:100vh;
	background:#E2F2FB;
	padding:15px;
	/*border-top:10px solid #F7D39A;*/

	overflow-y: auto;
	overflow-x: hidden;

	box-shadow: 0 4px 10px rgba(0,0,0,0.2);

	-webkit-transition:transform 0.5s ease;
	-moz-transition:transform 10.5s ease;
	transition:transform 0.5s ease;
}
.menu-toggle-area.opened{
	-webkit-transform: translateX(-280px);
	-moz-transform: translateX(-280px);
	-ms-transform: translateX(-280px);
	-o-transform: translateX(-280px);
	transform: translateX(-280px);
}

/*mobile選單*/
.menu-mobile-list{ margin-top:20px; margin-bottom:30px; }
.menu-mobile-list li{ position:relative; display:block; }
.menu-mobile-list li a{ position:relative; color:#000; display:block; font-size:18px; padding:10px 20px 10px 10px; border-bottom:1px solid rgba(0,0,0,0.2); }
.menu-mobile-list li a:hover{ color:#2483BC; }


/*第一層*/
.menu-mobile-list > li > a{ font-weight:600; }
.menu-mobile-list > li:first-child a{ border-top:1px solid rgba(0,0,0,0.2); }

/*第二層之後的層級收縮*/
.menu-mobile-list ul{
	display:none;
	position:relative;
	top:0;
	left:0;
	width:100%;
}

/*有下層之提示圖樣*/
.submenu-button{
	position:absolute;
	z-index:3;
	top:20px;
	right:15px;
	width:11px;
	height:10px;
	cursor:pointer;
}
.submenu-button:before{
	position:absolute;
	z-index:4;
	top:0;
	right:0;
	width:6px;
	height:6px;
	border-right:2px solid #2e1011;
	border-bottom:2px solid #2e1011;
	content:"";
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}

/*第二層*/
.menu-mobile-list ul li a{
	padding-left:27px;
	font-size:17px; /*第二層之後的文字字級*/
}

/*第三層*/
.menu-mobile-list ul ul li a{ padding-left:42px; opacity:0.8; }


/*第四層*/
.menu-mobile-list ul ul ul li a{ padding-left:58px; opacity:0.6; }


/*第一層有下層點開之後變化*/
.menu-mobile-list > li.current{ background:rgba(36,131,188, 0.1); }
.menu-mobile-list > li.current > a{ background:#F7830F; color:#fff; }
.menu-mobile-list > li.current a{ border-bottom:1px solid rgba(255,255,255,0.8); }
.menu-mobile-list > li.current > a .submenu-button:before{ border-right-color:#fff; border-bottom-color:#fff;  }

/*第二層之後有下層點開之後變化*/
.menu-mobile-list li li.current > a{ color:#2483BC; }
.menu-mobile-list li li.current > a .submenu-button:before{ border-right-color:#2483BC; border-bottom-color:#2483BC;  }







.mobile-menu-header-area{ position:relative; margin-top:10px; /*min-height:50px;*/ }

/*關閉選單按鈕*/
.menu-close-trigger{ /*position:absolute; top:0; right:0;*/ /*width:30px; margin:0 auto;*/ }
.close-trigger-icon , .close-trigger-txt{
	display:block;
	width:100%;
}
.close-trigger-icon{
	position:relative;
	height:30px;
	margin:0 auto;
}
.close-trigger-icon:before , .close-trigger-icon:after{
	position:absolute;
	left:50%;
	top:0;
	width:3px;
	height:100%;
	margin-left:-1px;
	content:"";
	background:#A40018;
}
.close-trigger-icon:before{
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}
.close-trigger-icon:after{
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	transform:rotate(-45deg);
}

.close-trigger-txt{ text-align:center; line-height:1; color:#A40018; font-size:10px; text-transform:uppercase; letter-spacing:0; }










/* ======================================
	08. 頁尾footer設定
=================================================================================================================== */
.footer{ position:relative; padding:15px 0; /*border-top:1px solid #eee;*/ }

.footer-flex{ display:flex; flex-wrap:wrap; /*border-top:1px solid #ccc;*/ }
.footer-flex-left{ width:60%; }
.footer-flex-right{ width:40%; }

.footer , .footer a{ color:#333; }
.footer a:hover{ color:#246FB7; }

.footer-info-list{ margin-bottom:13px; }
.footer-info-list li{ font-size:16px; /*font-weight:600;*/ }
.footer-info-list li span{ }
.footer-info-item{ display:inline-block; margin-right:20px; }
.footer-info-item .content , .footer-info-item .content a{ color:#246FB7; }
/*.footer a:hover{ color:#246FB7; }*/

.footer-info-list.right-side{ text-align:right; margin-bottom:5px; }
.footer-info-list.right-side  li span{ margin-right:0; margin-left:6px; }

.copyright{ text-align:right; font-size:14px; }
.copyright , .copyright a{ color:#333; }
.copyright a:hover{ color:#246FB7; }

/*.copyright p:nth-child(2){ margin-top: 10px; }*/

.social-list{ display:block; /*margin-top:10px;*/ text-align:right; }
.social-list li{
	display:inline-block;
	width:38px;
	margin:3px 0 3px 10px;
	padding:7px;
	background:#246FB7;
	overflow:hidden;

	border-radius:5px;
	opacity:0.8;

	transition-duration: 0.2s;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    -ms-transition-duration: 0.2s;
}
.social-list li img{ display:block; max-width:100%; height:auto; }
.social-list li:hover{
	background:#F78716;
	opacity:1;
}

.social-list li.social-fb{ background:#385693; }
.social-list li.social-line{ background:#2BAC37; }
.social-list li.social-wechat{ background:#4FBD33; }




/* ======================================
	09. 輪播banner設定
=================================================================================================================== */
.banner-wrap{ margin-bottom:15px; }
.slider-banner{ border-radius:5px; overflow:hidden; box-shadow:2px 2px 5px rgba(0,0,0,0.1); background:#fff; }

.inner-banner img{
	display:block;
	max-width:100%;
	height:auto;
	/*border-radius:0 0 10px 10px;
	overflow:hidden;
	box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	background:#fff;*/
}


.spec-area{
	height:5px;
	background:#fff;
	border-bottom:1px solid #eee;
	/*border-radius:0 0 10px 10px;*/
	/*box-shadow:2px 2px 5px rgba(0,0,0,0.1);*/
	overflow:hidden;
}






/* ======================================
	10. 全頁面共同設定
=================================================================================================================== */

.main-content{ padding:0 0 30px 0; }

.page-flex{ display:flex; flex-wrap:wrap; }
.page-flex-left{ order:2; width:385px; margin-left:15px; }
.page-flex-right{  order:1; width:calc(100% - 400px); }




.sec-box{
	background:#fff;
	border-radius:5px;
	margin-bottom:15px;
	padding:30px 20px;
	/*min-height:250px;*/
	border:1px solid #eee;

	background:#fff;
	/*background:linear-gradient(-45deg,#fff 65% , transparent );
	background:-moz-linear-gradient(-45deg,#fff 65% , transparent );
	background:-webkit-linear-gradient(-45deg,#fff 65% , transparent );
	background:-o-linear-gradient(-45deg,#fff 65% , transparent );
	background:-ms-linear-gradient(-45deg,#fff 65% , transparent );*/

	-webkit-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	-moz-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	-o-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	box-shadow:2px 2px 5px rgba(0,0,0,0.1);
}
/*.sec-box:last-child{ margin-bottom:0; }*/

.sec-box .heading{ position:relative; margin:10px -15px; text-align:center; }
.sec-box .heading:before{
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:4px;
	margin-top:-2px;
	content:"";
	background:#760101;
	border-radius:5px;

	background:linear-gradient(left,transparent , #b8180f 30% , #b8180f 70% , transparent );
	background:-moz-linear-gradient(left,transparent , #b8180f 30% , #b8180f 70% , transparent );
	background:-webkit-linear-gradient(left,transparent , #b8180f 30% , #b8180f 70% , transparent );
	background:-o-linear-gradient(left,transparent , #b8180f 30% , #b8180f 70% , transparent );
	background:-ms-linear-gradient(left,transparent , #b8180f 30% , #b8180f 70% , transparent );
}
/*.sec-box .heading:after{
	position:absolute;
	top:50%;
	left:0;
	width:30px;
	height:30px;
	content:"";
	margin-top:-20px;
	background:url(../images/web-32.png) no-repeat center right;
	background-size:cover;
}*/
.sec-box .heading .title{
	position:relative;
	display:inline-block;
	padding:0 40px;
	line-height:1;
	font-size:26px;
	font-weight:600;
	/*color:#2597A1;*/
	color:#b8180f;
	background:#fff;
}
.sec-box .heading .title:before{
	/*position:absolute;
	top:50%;
	right:0;
	width:8px;
	height:8px;
	border-radius:60%;
	content:"";
	margin-top:-2px;
	background:#5a3a0a;*/
	position:absolute;
	top:50%;
	left:5px;
	width:30px;
	height:30px;
	content:"";
	margin-top:-18px;
	background:url(../images/web-32.png) no-repeat center right;
	background-size:cover;
}
.sec-box .heading .title:after{
	position:absolute;
	top:50%;
	right:5px;
	width:30px;
	height:30px;
	content:"";
	margin-top:-18px;
	background:url(../images/web-33.png) no-repeat center right;
	background-size:cover;
}

.sec-box-content{ /*padding-left:20px;*/ }





/*導覽路徑*/
.breadcrumbs{
	/*position:absolute;
	z-index:1;
	top:20px;
	right:20px;
	width:50%;*/
	/*max-width:300px;*/
	font-size:14px;
	line-height:1.5;
	text-align:right;
	letter-spacing:0;
	margin-bottom:25px;
	margin-top:-15px;
	/*margin-right:-150px;*/
}
.breadcrumbs , .breadcrumbs a{ color:#666; }
.breadcrumbs a:hover{ text-decoration:underline; color:#F28F13; }
.breadcrumbs span{margin-right:3px;}
.breadcrumbs span:after{ content:"/"; margin-left:5px; font-size:10px; }
.breadcrumbs span:last-child:after{display:none;}


/*分類標題*/
.category-heading{ text-align:center; margin:30px 0 45px 0; }
.category-heading .title{ font-size:20px; color:#333; font-weight:600; }



/*編輯器區塊*/
.editor-area{ color:#333; margin:10px 0; }
.editor-area img{ max-width:100%; height:auto; }
.editor-area iframe{ max-width:100%;}



/*詳細頁標題*/
.view-heading{ text-align:center; margin-bottom:45px; }
.view-heading .title{ font-size:20px; color:#246FB7; font-weight:600; }
.view-heading .separate-line{ height: 1px; width:30px; background-color:#246FB7; margin:20px auto 0 auto; }

.news-view-date{ display:block; text-align:center; font-size:12px; color:#333; /*margin-bottom:30px;*/ }






/*詳細頁縮圖*/
.thumbnail-area{ margin:30px 0; }
.thumbnail-list{}
.thumbnail-list li{ max-width:400px; text-align:center; margin-top:15px; margin-bottom:15px; }
.thumbnail-list li a{ display:block; width:100%; }
.thumbnail-list li img{ display:inline-block; max-width:100%; height:auto; }
.thumbnail-list li:hover{ opacity:0.8; }

.thumbnail-list.single li{ margin-left:auto; margin-right:auto; }



/*縮圖區塊*/
.thumbnail-item a{
	background:#fff;
	border:1px solid #ccc;
	border-radius:5px;
	overflow:hidden;
}
/*.thumbnail-item a{ display:block; width:100%; height:100%; }
.thumbnail-item .name{ font-size:14px; text-align:center; margin:5px 0; color:#333; }
.thumbnail-item  a:hover .name{ color:rgba(255,255,255,1); color:#F28F13; }
*/





/*影片*/
.video{ position:relative; text-align:center; margin:30px 0; }
.video iframe{ max-width:100%;}




/*檔案下載*/
.download-line{ text-align:center; margin:30px 0; }
.download-btn{
	position:relative;
	display:inline-block;
	padding:10px 10px 10px 15px;
	margin:10px;
	line-height:1;
	font-size:14px;
	font-weight:600;
	color:#246FB7;
	border:1px solid #246FB7;
	border-radius:20px;
	/*border:1px solid #2C98F0;*/
}
.download-btn .txt{ position:relative; z-index:2; display:block; padding-right:20px; }
.download-btn .txt:before{
	position:absolute;
	z-index:1;
	top:50%;
	right:0;
	width:16px;
	height:16px;
	margin-left:-8px;
	margin-top:-8px;
	content:"";
	background:#246FB7 url(../images/icon-arrow-bottom.png) no-repeat center;
	background-size:70% 70%;
	border-radius:50%;
	opacity:0.5;
}
.download-btn:hover{ color:#F7830F; border-color:#F7830F; }
.download-btn:hover .txt:before{ opacity:1; background-color:#F7830F; }




/*返回按鈕列*/
.pageback-line{margin:60px 0; text-align:center; }
.pageback-btn{ display:inline-block; margin:5px; transition:All 0.2s ease; }
.pageback-btn .icon , .pageback-btn .title{ display:inline-block; vertical-align:middle; line-height:1; margin:0 2px; }
.pageback-btn .icon{ width:20px; height:20px; border-radius:5px; background:#246FB7; border:1px solid #fff; overflow:hidden;  }
.pageback-btn .icon img{
	display:block;
	width:38px;
	height:18px;

	-moz-transform:translateX(-16px);
	-webkit-transform:translateX(-16px);
	-o-transform:translateX(-16px);
	-ms-transform:translateX(-16px);
	transform:translateX(-16px);
}
.pageback-btn .title{
	color:#246FB7;
	font-weight:600;
	font-size:16px;
}

.pageback-btn:hover{
	-moz-transform:translateX(-5px);
	-webkit-transform:translateX(-5px);
	-o-transform:translateX(-5px);
	-ms-transform:translateX(-5px);
	transform:translateX(-5px);
}
.pageback-btn:hover .icon{ background:#F7830F; }
.pageback-btn:hover .title{ color:#F7830F; }




/*分割線*/
.seperate-line{ width:100%; height:1px; background:#ccc; }







/* ======================================
	11. 左側內容
=================================================================================================================== */
.aside-area{ /*display:flex; flex-wrap:wrap;*/ }

.aside-item{
	/*width:100%;*/
	margin-bottom:15px;

	border-radius:5px;
	padding:15px;
	overflow:hidden;

	border:1px solid #eee;

	background:#fff;
	/*background:linear-gradient(-45deg,#fff 65% , transparent );
	background:-moz-linear-gradient(-45deg,#fff 65% , transparent );
	background:-webkit-linear-gradient(-45deg,#fff 65% , transparent );
	background:-o-linear-gradient(-45deg,#fff 65% , transparent );
	background:-ms-linear-gradient(-45deg,#fff 65% , transparent );*/

	-webkit-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	-moz-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	-o-box-shadow:2px 2px 5px rgba(0,0,0,0.1);
	box-shadow:2px 2px 5px rgba(0,0,0,0.1);
}
.aside-item .heading{ position:relative; margin-bottom:15px; text-align:center; }
.aside-item .heading:before{
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:1px;
	content:"";
	background:#999;
}
.aside-item .heading .title{
	position:relative;
	display:inline-block;
	padding:0 5px;
	line-height:1;
	font-size:16px;
	font-weight:600;
	color:#333;
	background:#fff;
}
/*.aside-item .heading .title:before{
	position:absolute;
	top:50%;
	left:0;
	width:6px;
	height:6px;
	border-radius:50%;
	content:"";
	margin-top:-3px;
	background:#333;
}
.aside-item .heading .title:after{
	position:absolute;
	top:50%;
	right:0;
	width:6px;
	height:6px;
	border-radius:50%;
	content:"";
	margin-top:-3px;
	background:#333;
}*/


/*分類的為藍字*/
.aside-item .heading.cate:before{
	background:#246FB7;
}
.aside-item .heading.cate .title{ color:#246FB7; }





.ad-photo-item{ border-radius:10px; overflow:hidden; max-width:300px; margin:10px auto; }
.ad-photo-item a{ display:block; }
.ad-photo-item img{ display:block; max-width:100%; height:auto; }



/*搜尋區塊*/
.search-area{}
.search-box{
	position:relative;
	display:block;
	width:100%;
	background:#fff;
	border:1px solid #246FB7;
	border-radius:5px;
	overflow:hidden;
}
.search-input , .search-btn{
	line-height:1;
	height:35px;
	border:1px solid transparent;
	border-radius:0px;
	background:#fff;
}
.search-input{
	background:transparent;
	width:100%;
	padding:5px 10px;
	font-size:0.9em;
	color:#333;
	padding-right:45px;
}
.search-input:focus{ border-color:transparent; }
/*搜尋按鈕*/
.search-btn{
	position:absolute;
	top:1px;
	right:2px;
	/*background:transparent;*/
	cursor:pointer;
	padding:0 7px;
	border-radius:0 5px 5px 0;
}
.search-btn:hover{ border:1px solid transparent; }


.sec-search{ display:none; padding-bottom:15px; }




/*左側分類*/
.side-nav{ position:relative; margin-top:15px; }
.side-nav li{ position:relative; }
.side-nav li a{ position:relative; font-size:16px; display:block; color:#333; padding:8px 33px 8px 14px; /*border-bottom:1px solid rgba(0,0,0,0.1);*/ line-height:1.4; }
.side-nav li a:hover{ color:#F7830F; }


/*第一層*/
.side-nav > li:before{
	position:absolute;
	top:17px;
	left:0;
	width:6px;
	height:6px;
	content:"";
	background:#ccc;
	border-radius:2px;
}
/*.side-nav > li >　a{ border-bottom-width:0px; }*/
.side-nav > li:hover:before{ background:#F28F13; }

/*第二層*/
.side-nav ul li a{
	padding-left:18px;
	font-size:14px; /*第二層之後的文字字級*/
}

/*第三層*/
.side-nav ul ul li a{ padding-left:31px; opacity:0.7; }



/*有下一層選項的項目設定*/
ul.mtree  li.mtree-node > a:before , ul.mtree  li.mtree-node > a:after{
	position:absolute;
	z-index:4;
	top:50%;
	content:"";
	background:#999;
	transition:transform 0.3s ease , opacity 0.4s ease;
	-webkit-transition:transform 0.3s ease , opacity 0.4s ease;
	-moz-transition:transform 0.3s ease , opacity 0.4s ease;
	-o-transition:transform 0.3s ease , opacity 0.4s ease;
}
ul.mtree  li.mtree-node > a:before{ right:15px; width:2px; height:12px; margin-top:-6px; }
ul.mtree  li.mtree-node > a:after{ right:10px; width:12px; height:2px; margin-top:-1px; }

/*ul.mtree  li.mtree-node > a:hover:before , ul.mtree  li.mtree-node > a:hover:after{ background:#E85356; }*/


.side-nav li.mtree-open > a{ color:#F28F13; }
.side-nav > li.mtree-node.mtree-open{ background:rgba(255,255,255,0.1); }
.side-nav li.mtree-node.mtree-open > a{ color:#F28F13; }
.side-nav li.mtree-node.mtree-open > a:before{
	transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg);
	-o-transform:rotate(-90deg);
	opacity:0;
}
.side-nav li.mtree-node.mtree-open > a:after{ background:#F28F13; }






/*左列-氣象圖*/
.weather-photo{ max-width:300px; margin:0 auto;/* border-radius:5px; overflow:hidden;*/ }
.weather-photo a{ display:block; }
.weather-photo img{ display:block; max-width:100%; height:auto; }

.weather-frame{ max-width:300px; margin:0 auto; }
.weather-frame iframe{ width:100%; height:300px; }




/*左列-相關連結*/
.aside-link-list li{ margin:10px 0; }
.aside-link-item{ max-width:300px; margin:0 auto; border:1px solid #ccc; border-radius:3px; overflow:hidden; }
.aside-link-item .photo{ }
.aside-link-item .photo a{ display:block; /*padding:4px;*/ }
.aside-link-item .photo img{ display:block; max-width:100%; height:auto; }









/* ======================================
	12. 首頁
=================================================================================================================== */

/*首頁-鑽石名家(相關連結)*/

/*首頁-經典名舍*/

/*首頁-入賞鴿*/

/*首頁-展售*/


/*首頁-地方鴿訊*/
.idx-post-item{ position:relative; padding-left:120px; margin:25px 0; }

.idx-post-item .time-box{ position:absolute; top:0; left:0; font-size:14px; }
.idx-post-item .time-box .day{
	display:block;
	background:#246FB7;
	color:#fff;
	width:30px;
	height:30px;
	line-height:30px;
	text-align:center;
	font-weight:600;
	border-radius:50%;
}
.idx-post-item .time-box .year{ display:block; position:absolute; top:2px; left:38px; width:80px; color:#246FB7; font-weight:600; }

.idx-post-item .name{ margin-bottom:10px; }
.idx-post-item .name a{
	display:block;
	color:#333;
	font-size:16px;
	line-height:1.5;
	font-weight:600;

	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;

	/*overflow: visible;
	white-space: normal;*/
}
.idx-post-item .name a:hover{ color:#F7830F; }












/* ======================================
	13. 名家名舍
=================================================================================================================== */
.store-item{ }
.store-item .photo{ border-radius:5px; overflow:hidden; border:1px solid #ccc; margin-bottom:5px; transition:transform 0.3s ease; }
.store-item .photo a{ position:relative; display:block; }
.store-item .photo a:before {
    position: absolute;
	z-index:1;
	left:0;
	right:0;
	width: 100%;
    height: 100%;
    content:"";

	/* border-radius: 50%;*/
    /*box-shadow:inset 0 0 0 12px rgba(255, 255, 255, 0.6), 0 1px 2px rgba(0, 0, 0, 0.3);*/
}

.store-item .name{ margin:10px 0; }
.store-item .name a{ display:block; line-height:1.4; padding:0 5px; /*color:#246FB7;*/ text-align:center; font-size:16px; line-height:1.3; font-weight:600; }
.store-item:hover .name a{ color:#F7830F; }

/*.store-item .photo:hover{
	-moz-transform:rotate(7deg);
	-webkit-transform:rotate(7deg);
	-o-transform:rotate(7deg);
	-ms-transform:rotate(7deg);
	transform:rotate(7deg);
}
*/




/*詳細頁*/
.introduction-flex{ display:flex; flex-wrap:wrap; margin-bottom:30px; }
.introduction-flex .flex-left{ width:30%; margin-right:5%; }
.introduction-flex .flex-right{ width:65%; }

.introduction-photo{ border:1px solid #ccc; overflow:hidden; background:#fff; border-radius:5px; }

.designer-name{ font-size:20px; font-weight:600; color:#246FB7; }



.sec-store-view{ padding:0; }

/*分頁內容 tab*/
#sidebar{ position:relative; z-index:10; }
.tabs-list{ display:flex; flex-wrap:wrap; justify-content:center; border-bottom:1px solid #ccc; background:#fff; }
.tabs-list li{ width:20%; }
.tabs-list li a{
	position:relative;
	display:block;
	padding:8px 20px 8px 5px;
	font-size:16px;
	text-align:center;
}
.tabs-list li a:before{
	position:absolute;
	bottom:-2px;
	right:0;
	width:100%;
	height:4px;
	content:"";
	background:#246FB7;
	opacity:0;
}

.tabs-list li.active a{
	color:#246FB7;
	font-weight:600;
	cursor:default;
}
.tabs-list li.active a:before{ opacity:1; }


.tabs-content{ padding:40px 30px; min-height:500px; }
.tabs-content img{ max-width:100%; height:auto; }



/*.store-choose-list{ max-width:600px; margin:0 auto; }
.store-choose-item{ margin:40px 0; border-radius:50%; width:150px; height:150px; overflow:hidden; box-shadow: 2px 2px 4px rgba(0,0,0,0.1); }
.store-choose-item a{
	display:block;
	padding:10px;
	text-align:center;
	line-height:150px;
}

.store-choose-item .item-name{  }
.store-choose-item .item-name .title{
	display:block;
	width:50px;
	font-size:20px;
	font-weight:600;
	color:#fff;
	margin:0 auto;
	line-height:1.4;
}
*/


.store-choose-list{ margin:30px 0; }
.flip-item{
	position:relative;
	border:1px solid #eee;
	box-shadow:2px 2px 4px rgba(0,0,0,0.1);
	border-radius:10px;
	overflow:hidden;
	background:#fff;
}

.flip-item .item-mask{
	position:absolute;
	z-index:1;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.5);

	transition:opacity 0.9s ease;
}
.flip-item .item-box{
	position:absolute;
	z-index:1;
	top:0;
	left:0;
	width:100%;
	height:100%;
	text-align:center;
	padding:0 20px;

	transition:opacity 1s ease;
}

.flip-item .item-photo{ opacity:0.7; transition:opacity 0.4s ease; }
.flip-item .item-photo .item-thumb-frame .item-thumb{ padding-bottom:60%; }


.flip-item .box-flex{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
}

.flip-item .icon{ display:inline-block; width:60px; margin-bottom:5px; }
.flip-item .icon img{ display:block; max-width:100%; height:auto; }

.flip-item .item-name{ margin-bottom:10px; }
.flip-item .item-name .title{ color:#fff; font-size:26px; font-weight:600; letter-spacing:2px; }

.flip-item .info{ color:#fff; font-size:14px; font-weight:600; }

.flip-item a:hover .item-mask{ opacity:0; }
.flip-item a:hover .item-box{ opacity:0; }

.flip-item a:hover .item-photo{ opacity:1; }



.contact-map{ height:300px; margin-bottom:30px; }

.contact-info-list{ display:flex; flex-wrap:wrap; margin:30px 0 45px 0; }
.contact-info-list li{
	position:relative;
	margin:15px 0;
	line-height:1.3;
	color:#666;
	word-break:break-all;
	padding-left:85px;
	width:50%;
	padding-right:15px;
	padding-left:135px;
}

.contact-info-list li .title{ position:absolute; top:-1px; left:40px; width:85px; font-size:18px; color:#333; letter-spacing:0; }
.contact-info-list li .title:after{ position:absolute; top:0; right:0; content:":";}

.contact-info-list li .icon{
	position:absolute;
	top:-3px;
	left:0;
	width:30px;
	height:30px;
	background:#246FB7;

	border-radius:4px;
}
.contact-info-list li .icon img{ display:block; max-width:100%; height:auto; }

.contact-info-list li , .contact-info-list li a { color:#333; text-decoration:underline; }
.contact-info-list li a:hover { color:#760101; }








/* ======================================
	14. 鑽石名家(相關連結)
=================================================================================================================== */
.link-item a{
	display:block;
}

.link-item .photo{ border:1px solid #ccc; border-radius:5px; overflow:hidden; background:#fff; }
.link-item .name{}

.link-item .name{ color:#333; text-align:center; margin:10px 0 0 0; padding:0 5px; font-weight:600; font-size:16px; line-height:1.3; }
.link-item a:hover .name{ color:#F7830F; }

.link-item .separate-line{ height: 1px; width:40px; background-color:#BE8A39; margin:15px auto 0 auto; }

.link-item a:hover{
	border-color:#F7830F;

	/*-moz-transform:scale(1.1);
	-webkit-transform:scale(1.1);
	-o-transform:scale(1.1);
	-ms-transform:scale(1.1);
	transform:scale(1.1);*/
}





/* ======================================
	15. 名鴿欣賞
=================================================================================================================== */
.albums-item .photo-scale .item-thumb-frame .item-thumb{ /*padding-bottom:85%;*/ }

.albums-item .name{
	font-size:16px;
	font-weight:600;
	margin:5px 0;
	text-align:center;
	padding:8px 8px;
	line-height:1.3;
}

.albums-item:hover .photo{
	-moz-transform:rotate(-3deg) scale(1.2);
	-webkit-transform:rotate(-3deg) scale(1.2);
	-o-transform:rotate(-3deg) scale(1.2);
	-ms-transform:rotate(-3deg) scale(1.2);
	transform:rotate(-3deg) scale(1.2);
}

.albums-item:hover .name{ color:#F7830F; }





/* ======================================
	16. 入賞鴿
=================================================================================================================== */




/* ======================================
	17. 賽鴿柑仔店
=================================================================================================================== */
.product-item{ border-radius:5px; border:1px solid #ccc; border-radius:5px; overflow:hidden; }
.product-item .photo{ border-bottom:1px solid #ccc; margin-bottom:5px; }
.product-item .photo a{ display:block; }

.product-item .name{ margin:15px 0; text-align:center; padding:0 5px; }
.product-item .name a{ display:block; line-height:1.4; min-height:40px; font-size:16px; font-weight:600; }
.product-item .name a:hover{ color:#F7830F; }

.product-item .info-item{ position:relative; font-size:13px; margin:8px 0; padding-left:85px; min-height:30px; }

.product-item .info-item span.title{
	position:absolute;
	top:1px;
	left:5px;
	display:block;
	background:#FAEDA3;
	color:#333;
	border-radius:2px;
	padding:2px 5px;
	line-height:1.4;
	width:70px;
	text-align:center;
}

.product-item .info-item span.content img{ display:inline-block; margin-top:-2px; width:20px; height:20px; }



/*詳細頁*/
.product-item.pro-view{ padding:0; border-width:0px; margin:10px 0 20px 0; }
.product-item.pro-view .info-item{ padding-left:100px; font-size:16px; }
.product-item.pro-view .info-item span.title{ width:85px; }




/* ======================================
	18. 紀錄鴿交流
=================================================================================================================== */
.article-item{ border:1px solid #ccc; border-radius:5px; overflow:hidden; }
.article-item a{ position:relative; display:block; /*padding:15px;*/ }
.article-item a:before{
	position:absolute;
	top:0;
	left:0;
	width:0;
	height:100%;
	content:"";
	background:linear-gradient(left,rgba(36,111,183, 0.1) 40% , transparent );
	background:-moz-linear-gradient(left,rgba(36,111,183, 0.1) 40% , transparent );
	background:-webkit-linear-gradient(left,rgba(36,111,183, 0.1) 40% , transparent );
	background:-o-linear-gradient(left,rgba(36,111,183, 0.1) 40% , transparent );
	background:-ms-linear-gradient(left,rgba(36,111,183, 0.1) 40% , transparent );

	transition:width 0.3s ease;
	-webkit-transition:width 0.3s ease;
	-moz-transition:width 0.3s ease;
	-o-transition:width 0.3s ease;
}
.article-item a:after{
	position:absolute;
	bottom:-1px;
	right:0;
	width:60px;
	height:60px;
	content:"";
	background:url(../images/web-18.png) no-repeat center;
	background-size:cover;
	opacity:0.2;
}

.article-item .photo{ margin:0 auto; border-bottom:1px solid #ccc; }

.article-item .name{ padding:10px 10px; }
.article-item .name .title{ font-size:16px; line-height:1.3; font-weight:600; }
.article-item .date{ color:#999; font-size:12px; }


.article-item a:hover:before{ width:100%; }
.article-item a:hover .name .title{ color:#F7830F;}






/* ======================================
	19. 拍賣中心
=================================================================================================================== */
.auction-photo{ margin-bottom:30px; }
.auction-photo img{ display:block; max-width:100%; height:auto; }
/*.auction-list li{ margin-bottom:45px; }

.auction-item{
	display:block;
	padding:10px;
	border:1px solid #ccc;
	border-radius:5px;
	overflow:hidden;
	background:#fff;
}

.auction-item .numbering{ position:relative; margin:10px 0; text-align:center; }
.auction-item .numbering:before{
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:1px;
	content:"";
	background:#999;
}
.auction-item .numbering .title{
	position:relative;
	display:inline-block;
	padding:0 5px;
	line-height:1;
	font-size:14px;
	color:#246FB7;
	background:#fff;
	font-weight:600;
}

.auction-item .photo{ border-radius:5px; overflow:hidden; margin-bottom:5px; }
.auction-item .photo a{ display:block; }

.auction-item .name{ margin:10px 0; }
.auction-item .name a{ display:block; line-height:1.4; color:#246FB7; min-height:55px; background:#FAEDA3; padding:5px; }
.auction-item .name a:hover{ color:#F7830F; }

.auction-item .info-item{ position:relative; font-size:14px; margin:5px 0; padding-left:68px; min-height:20px; }
.auction-item .info-item span{ display:block; line-height:1.4; font-weight:600; }

.auction-item .info-item span.title{
	position:absolute;
	top:0;
	left:0;
	color:#333;
	border-radius:15px;
	width:64px;
}
.auction-item .info-item span.title:after{ position:absolute; top:0; right:0; content:"："; font-size:14px; }*/







/* ======================================
	20. 地方鴿訊
=================================================================================================================== */
.post-item{ border-radius:5px; overflow:hidden; border:1px solid #ccc; }
.post-item a{ display:block; }

.post-item .photo{ border-bottom:1px solid #ccc; }
.post-item .name{ position:relative; padding:10px; }
.post-item .name .title{ font-size:16px; line-height:1.3; font-weight:600; color:#333; }
.post-item:hover .name .title{ color:#F7830F;}

.post-item .date{ padding:5px 10px; text-align:right; color:#999; font-size:12px; margin-top:5px; }

.post-item .intro{ font-size:14px; height:100px; overflow:hidden; color:#333; }



/*圖片滑過後放大效果*/
.photo-scale-frame{ overflow:hidden; background:#fff; border-radius:5px; border:1px solid #ccc; }
.photo-scale{
	transition:transform 0.5s ease;
	-webkit-transition:transform 0.5s ease;
	-moz-transition:transform 0.5s ease;
	-o-transition:transform 0.5s ease;
}
.photo-scale-frame:hover .photo-scale{
	-moz-transform:scale(1.1);
	-webkit-transform:scale(1.1);
	-o-transform:scale(1.1);
	-ms-transform:scale(1.1);
	transform:scale(1.1);
}








/* ======================================
	21. 常見問題
=================================================================================================================== */
#qaContent { width:100%; }
.accordionPart { margin-bottom:30px; }
#qaContent ul.accordionPart li {
	position:relative;
	width:100%;
	margin-bottom:20px;

	transition:All 0.35s ease;
	-webkit-transition:All 0.5s ease;
	-moz-transition:All 0.5s ease;
	-o-transition:All 0.5s ease;
}

#qaContent ul.accordionPart li .qa_title {
	position:relative;
	color: #333;
	cursor: pointer;
	padding:15px 50px 15px 60px;
	font-size:16px;
	background:rgba(238,238,238, 0.6);
}
#qaContent ul.accordionPart li .qa_title:hover{ background:rgba(36,111,183, 0.2); }
#qaContent ul.accordionPart li .qa_title.is-open{ background:rgba(247,131,15, 1); color:#fff; }

#qaContent ul.accordionPart li .q-icon {
	position:absolute;
	top:12px;
	left:15px;
	display:inline-block;
	background:#246FB7;
	border-radius:50%;
	width:35px;
	height:35px;
	overflow:hidden;
	padding:5px 7px 0 0;
}
#qaContent ul.accordionPart li .q-icon img{ display:block; max-width:100%; height:auto; }
#qaContent ul.accordionPart li .qa_title.is-open .q-icon{
	background:rgba(255,255,255,0.2);
}

.qa-open-icon{ position:absolute; top:0; right:0; width:80px; height:100%; }
.qa-open-icon:before{
	position:absolute;
	top:50%;
	right:15px;
	width:0;
	height:0;
	content:"";
	margin-top:-3px;
	border-top:6px solid #246FB7;
	border-left:6px solid transparent;
	border-right:6px solid transparent;
}
#qaContent ul.accordionPart li .qa_title.is-open .qa-open-icon:before{
	margin-top:-11px;
	border-top:6px solid transparent;
	border-bottom:6px solid #fff;
	opacity:1;
}
#qaContent ul.accordionPart li .qa_content {
	display:none;
	position:relative;
	border-top:1px solid rgba(210,145,188, 1);
	padding:15px 20px;
	color: #333;
	margin-top:5px;
	border: 1px solid #e6e6e6;
}
#qaContent ul.accordionPart li .qa_content img{ max-width:100%; height:auto; }
/* ======================================
	以上為主頁原始內容
=================================================================================================================== */



























/* ======================================
	以下為正式內容
=================================================================================================================== */
html, body { height:100%; }

.header, .footer { letter-spacing:1px; line-height:1.8; }

.wrapper{
	position:relative;
	height:auto;
	width:100%;
	min-height:100%;
	overflow:hidden;
	margin-left:auto;
	margin-right:auto;
}

.container{
	position:relative;
	margin:0 auto;
	max-width:calc(1600px + 1.5rem);
	width:calc(92% + 1.5rem);
}

.section, .sec-box { font-family:'Noto Serif TC', 'Microsoft JhengHei', sans-serif; color:#000; }

.sec-box .heading { margin-left:0px !important; margin-right:0px !important; }

ul, li, ol { margin:0px; padding:0px; list-style:none; }

.gen      { font-size:1.05rem; }
.genmed   { font-size:1.1rem; font-weight:bold; }
.gensmall { font-size:0.95rem; }

.col-p-0 >  [class*=col-], .col-p-0 >  [class*=topic-item-y] { padding:0       !important; }
.col-p-1 >  [class*=col-], .col-p-1 >  [class*=topic-item-y] { padding:0.25rem !important; }
.col-p-2 >  [class*=col-], .col-p-2 >  [class*=topic-item-y] { padding:0.5rem  !important; }
.col-p-3 >  [class*=col-], .col-p-3 >  [class*=topic-item-y] { padding:1rem    !important; }
.col-p-4 >  [class*=col-], .col-p-4 >  [class*=topic-item-y] { padding:1.5rem  !important; }

.col-px-0 > [class*=col-], .col-px-0 > [class*=topic-item-y] { padding-left:0       !important; padding-right:0       !important; }
.col-px-1 > [class*=col-], .col-px-1 > [class*=topic-item-y] { padding-left:0.25rem !important; padding-right:0.25rem !important; }
.col-px-2 > [class*=col-], .col-px-2 > [class*=topic-item-y] { padding-left:0.5rem  !important; padding-right:0.5rem  !important; }
.col-px-3 > [class*=col-], .col-px-3 > [class*=topic-item-y] { padding-left:1rem    !important; padding-right:1rem    !important; }
.col-px-4 > [class*=col-], .col-px-4 > [class*=topic-item-y] { padding-left:1.5rem  !important; padding-right:1.5rem  !important; }

.col-py-0 > [class*=col-], .col-py-0 > [class*=topic-item-y] { padding-top:0       !important; padding-bottom:0       !important; }
.col-py-1 > [class*=col-], .col-py-1 > [class*=topic-item-y] { padding-top:0.25rem !important; padding-bottom:0.25rem !important; }
.col-py-2 > [class*=col-], .col-py-2 > [class*=topic-item-y] { padding-top:0.5rem  !important; padding-bottom:0.5rem  !important; }
.col-py-3 > [class*=col-], .col-py-3 > [class*=topic-item-y] { padding-top:1rem    !important; padding-bottom:1rem    !important; }
.col-py-4 > [class*=col-], .col-py-4 > [class*=topic-item-y] { padding-top:1.5rem  !important; padding-bottom:1.5rem  !important; }

.col-pb-0 > [class*=col-], .col-pb-0 > [class*=topic-item-y] { padding-bottom:0       !important; }
.col-pb-1 > [class*=col-], .col-pb-1 > [class*=topic-item-y] { padding-bottom:0.25rem !important; }
.col-pb-2 > [class*=col-], .col-pb-2 > [class*=topic-item-y] { padding-bottom:0.5rem  !important; }
.col-pb-3 > [class*=col-], .col-pb-3 > [class*=topic-item-y] { padding-bottom:1rem    !important; }
.col-pb-4 > [class*=col-], .col-pb-4 > [class*=topic-item-y] { padding-bottom:1.5rem  !important; }

.col-pt-0 > [class*=col-], .col-pt-0 > [class*=topic-item-y] { padding-top:0       !important; }
.col-pt-1 > [class*=col-], .col-pt-1 > [class*=topic-item-y] { padding-top:0.25rem !important; }
.col-pt-2 > [class*=col-], .col-pt-2 > [class*=topic-item-y] { padding-top:0.5rem  !important; }
.col-pt-3 > [class*=col-], .col-pt-3 > [class*=topic-item-y] { padding-top:1rem    !important; }
.col-pt-4 > [class*=col-], .col-pt-4 > [class*=topic-item-y] { padding-top:1.5rem  !important; }


.col-m-0 >  [class*=col-], .col-m-0 >  [class*=topic-item-y] { margin:0       !important; }
.col-m-1 >  [class*=col-], .col-m-1 >  [class*=topic-item-y] { margin:0.25rem !important; }
.col-m-2 >  [class*=col-], .col-m-2 >  [class*=topic-item-y] { margin:0.5rem  !important; }
.col-m-3 >  [class*=col-], .col-m-3 >  [class*=topic-item-y] { margin:1rem    !important; }
.col-m-4 >  [class*=col-], .col-m-4 >  [class*=topic-item-y] { margin:1.5rem  !important; }

.col-mx-0 > [class*=col-], .col-mx-0 > [class*=topic-item-y] { margin-left:0       !important; margin-right:0       !important; }
.col-mx-1 > [class*=col-], .col-mx-1 > [class*=topic-item-y] { margin-left:0.25rem !important; margin-right:0.25rem !important; }
.col-mx-2 > [class*=col-], .col-mx-2 > [class*=topic-item-y] { margin-left:0.5rem  !important; margin-right:0.5rem  !important; }
.col-mx-3 > [class*=col-], .col-mx-3 > [class*=topic-item-y] { margin-left:1rem    !important; margin-right:1rem    !important; }
.col-mx-4 > [class*=col-], .col-mx-4 > [class*=topic-item-y] { margin-left:1.5rem  !important; margin-right:1.5rem  !important; }

.col-my-0 > [class*=col-], .col-my-0 > [class*=topic-item-y] { margin-top:0       !important; margin-bottom:0       !important; }
.col-my-1 > [class*=col-], .col-my-1 > [class*=topic-item-y] { margin-top:0.25rem !important; margin-bottom:0.25rem !important; }
.col-my-2 > [class*=col-], .col-my-2 > [class*=topic-item-y] { margin-top:0.5rem  !important; margin-bottom:0.5rem  !important; }
.col-my-3 > [class*=col-], .col-my-3 > [class*=topic-item-y] { margin-top:1rem    !important; margin-bottom:1rem    !important; }
.col-my-4 > [class*=col-], .col-my-4 > [class*=topic-item-y] { margin-top:1.5rem  !important; margin-bottom:1.5rem  !important; }

.col-mb-0 > [class*=col-], .col-mb-0 > [class*=topic-item-y] { margin-bottom:0       !important; }
.col-mb-1 > [class*=col-], .col-mb-1 > [class*=topic-item-y] { margin-bottom:0.25rem !important; }
.col-mb-2 > [class*=col-], .col-mb-2 > [class*=topic-item-y] { margin-bottom:0.5rem  !important; }
.col-mb-3 > [class*=col-], .col-mb-3 > [class*=topic-item-y] { margin-bottom:1rem    !important; }
.col-mb-4 > [class*=col-], .col-mb-4 > [class*=topic-item-y] { margin-bottom:1.5rem  !important; }

.col-mt-0 > [class*=col-], .col-mt-0 > [class*=topic-item-y] { margin-top:0       !important; }
.col-mt-1 > [class*=col-], .col-mt-1 > [class*=topic-item-y] { margin-top:0.25rem !important; }
.col-mt-2 > [class*=col-], .col-mt-2 > [class*=topic-item-y] { margin-top:0.5rem  !important; }
.col-mt-3 > [class*=col-], .col-mt-3 > [class*=topic-item-y] { margin-top:1rem    !important; }
.col-mt-4 > [class*=col-], .col-mt-4 > [class*=topic-item-y] { margin-top:1.5rem  !important; }

hr.hr1 { position:relative; margin:20px 0;        border-bottom:1px dashed #cfd2da; }
hr.hr2 { position:relative; margin:17px 0;        border-bottom:1px dashed #cfd2da; }
hr.hr3 { position:relative; margin:25px 0 30px 0; border-bottom:1px dashed #cfd2da; }

[class*=hr1-] { position:relative; border-bottom:1px solid #ccc;  /*opacity:1;*/ }
[class*=hr2-] { position:relative; border-bottom:1px dotted #ccc; /*opacity:1;*/ }
[class*=hr3-] { position:relative; border-bottom:1px dashed #ccc; /*opacity:1;*/ }
hr.hr1-0 { margin:0;         }
hr.hr1-1 { margin:0.25rem 0; }
hr.hr1-2 { margin:0.5rem 0;  }
hr.hr1-3 { margin:0.75rem 0; }
hr.hr1-4 { margin:1rem 0;    }
hr.hr1-5 { margin:1.25rem 0; }
hr.hr1-6 { margin:1.5rem 0;  }

hr.hr2-0 { margin:0;         }
hr.hr2-1 { margin:0.25rem 0; }
hr.hr2-2 { margin:0.5rem 0;  }
hr.hr2-3 { margin:0.75rem 0; }
hr.hr2-4 { margin:1rem 0;    }
hr.hr2-5 { margin:1.25rem 0; }
hr.hr2-6 { margin:1.5rem 0;  }

hr.hr3-0 { margin:0;         }
hr.hr3-1 { margin:0.25rem 0; }
hr.hr3-2 { margin:0.5rem 0;  }
hr.hr3-3 { margin:0.75rem 0; }
hr.hr3-4 { margin:1rem 0;    }
hr.hr3-5 { margin:1.25rem 0; }
hr.hr3-6 { margin:1.5rem 0;  }


.w1p   { width:  1%; }
.w2p   { width:  2%; }
.w3p   { width:  3%; }
.w4p   { width:  4%; }
.w5p   { width:  5%; }
.w6p   { width:  6%; }
.w7p   { width:  7%; }
.w8p   { width:  8%; }
.w9p   { width:  9%; }
.w10p  { width: 10%; }
.w15p  { width: 15%; }
.w20p  { width: 20%; }
.w25p  { width: 25%; }
.w30p  { width: 30%; }
.w35p  { width: 35%; }
.w40p  { width: 40%; }
.w45p  { width: 45%; }
.w50p  { width: 50%; }
.w55p  { width: 55%; }
.w60p  { width: 60%; }
.w65p  { width: 65%; }
.w70p  { width: 70%; }
.w75p  { width: 75%; }
.w80p  { width: 80%; }
.w85p  { width: 85%; }
.w90p  { width: 90%; }
.w95p  { width: 95%; }
.w100p { width:100%; }

.w1em  { width: 1em; }
.w2em  { width: 2em; }
.w3em  { width: 3em; }
.w4em  { width: 4em; }
.w5em  { width: 5em; }
.w6em  { width: 6em; }
.w7em  { width: 7em; }
.w8em  { width: 8em; }
.w9em  { width: 9em; }
.w10em { width:10em; }

.max-w1em  { max-width: 1em; }
.max-w2em  { max-width: 2em; }
.max-w3em  { max-width: 3em; }
.max-w4em  { max-width: 4em; }
.max-w5em  { max-width: 5em; }
.max-w6em  { max-width: 6em; }
.max-w7em  { max-width: 7em; }
.max-w8em  { max-width: 8em; }
.max-w9em  { max-width: 9em; }
.max-w10em { max-width:10em; }
.max-w11em { max-width:11em; }
.max-w12em { max-width:12em; }
.max-w13em { max-width:13em; }
.max-w14em { max-width:14em; }
.max-w15em { max-width:15em; }

.max-w40p  { max-width: 40%; }
.max-w45p  { max-width: 45%; }
.max-w50p  { max-width: 50%; }
.max-w55p  { max-width: 55%; }
.max-w60p  { max-width: 60%; }
.max-w65p  { max-width: 65%; }
.max-w70p  { max-width: 70%; }
.max-w75p  { max-width: 75%; }
.max-w80p  { max-width: 80%; }
.max-w85p  { max-width: 85%; }
.max-w90p  { max-width: 90%; }
.max-w95p  { max-width: 95%; }
.max-w100p { max-width:100%; }

.min-w40p  { min-width: 40%; }
.min-w45p  { min-width: 45%; }
.min-w50p  { min-width: 50%; }
.min-w55p  { min-width: 55%; }
.min-w60p  { min-width: 60%; }
.min-w65p  { min-width: 65%; }
.min-w70p  { min-width: 70%; }
.min-w75p  { min-width: 75%; }
.min-w80p  { min-width: 80%; }
.min-w85p  { min-width: 85%; }
.min-w90p  { min-width: 90%; }
.min-w95p  { min-width: 95%; }
.min-w100p { min-width:100%; }

.max-h40vh  { max-height: 40vh; }
.max-h45vh  { max-height: 45vh; }
.max-h50vh  { max-height: 50vh; }
.max-h55vh  { max-height: 55vh; }
.max-h60vh  { max-height: 60vh; }
.max-h65vh  { max-height: 65vh; }
.max-h70vh  { max-height: 70vh; }
.max-h75vh  { max-height: 75vh; }
.max-h80vh  { max-height: 80vh; }
.max-h85vh  { max-height: 85vh; }
.max-h90vh  { max-height: 90vh; }
.max-h95vh  { max-height: 95vh; }
.max-h100vh { max-height:100vh; }

.min-h40vh  { min-height: 40vh; }
.min-h45vh  { min-height: 45vh; }
.min-h50vh  { min-height: 50vh; }
.min-h55vh  { min-height: 55vh; }
.min-h60vh  { min-height: 60vh; }
.min-h65vh  { min-height: 65vh; }
.min-h70vh  { min-height: 70vh; }
.min-h75vh  { min-height: 75vh; }
.min-h80vh  { min-height: 80vh; }
.min-h85vh  { min-height: 85vh; }
.min-h90vh  { min-height: 90vh; }
.min-h95vh  { min-height: 95vh; }
.min-h100vh { min-height:100vh; }

.d-table {
  border-collapse: collapse;
}

.v-middle {
  vertical-align: middle;
}

.font-size-11 { font-size:1.1rem !important; }
.font-size-12 { font-size:1.2rem !important; }
.font-size-13 { font-size:1.3rem !important; }
.font-size-14 { font-size:1.4rem !important; }
.font-size-15 { font-size:1.5rem !important; }
.font-size-16 { font-size:1.6rem !important; }
.font-size-17 { font-size:1.7rem !important; }
.font-size-18 { font-size:1.8rem !important; }
.font-size-19 { font-size:1.9rem !important; }
.font-size-20 { font-size:2.0rem !important; }
.font-size-21 { font-size:2.1rem !important; }
.font-size-22 { font-size:2.2rem !important; }
.font-size-23 { font-size:2.3rem !important; }
.font-size-24 { font-size:2.4rem !important; }
.font-size-25 { font-size:2.5rem !important; }
.font-size-26 { font-size:2.6rem !important; }
.font-size-27 { font-size:2.7rem !important; }
.font-size-28 { font-size:2.8rem !important; }
.font-size-29 { font-size:2.9rem !important; }
.font-size-30 { font-size:3.0rem !important; }
.font-size-31 { font-size:3.1rem !important; }
.font-size-32 { font-size:3.2rem !important; }
.font-size-33 { font-size:3.3rem !important; }
.font-size-34 { font-size:3.4rem !important; }
.font-size-35 { font-size:3.5rem !important; }
.font-size-36 { font-size:3.6rem !important; }
.font-size-37 { font-size:3.7rem !important; }
.font-size-38 { font-size:3.8rem !important; }
.font-size-39 { font-size:3.9rem !important; }
.font-size-40 { font-size:4.0rem !important; }

.font-red { color:red !important; }

.color-000 { color:#000 !important; }
.color-003 { color:#003 !important; }
.color-006 { color:#006 !important; }
.color-009 { color:#009 !important; }
.color-00c { color:#00c !important; }
.color-00f { color:#00f !important; }
.color-030 { color:#030 !important; }
.color-033 { color:#033 !important; }
.color-036 { color:#036 !important; }
.color-039 { color:#039 !important; }
.color-03c { color:#03c !important; }
.color-03f { color:#03f !important; }
.color-060 { color:#060 !important; }
.color-063 { color:#063 !important; }
.color-066 { color:#066 !important; }
.color-069 { color:#069 !important; }
.color-06c { color:#06c !important; }
.color-06f { color:#06f !important; }
.color-090 { color:#090 !important; }
.color-093 { color:#093 !important; }
.color-096 { color:#096 !important; }
.color-099 { color:#099 !important; }
.color-09c { color:#09c !important; }
.color-09f { color:#09f !important; }
.color-0c0 { color:#0c0 !important; }
.color-0c3 { color:#0c3 !important; }
.color-0c6 { color:#0c6 !important; }
.color-0c9 { color:#0c9 !important; }
.color-0cc { color:#0cc !important; }
.color-0cf { color:#0cf !important; }
.color-0f0 { color:#0f0 !important; }
.color-0f3 { color:#0f3 !important; }
.color-0f6 { color:#0f6 !important; }
.color-0f9 { color:#0f9 !important; }
.color-0fc { color:#0fc !important; }
.color-0ff { color:#0ff !important; }

.color-300 { color:#300 !important; }
.color-303 { color:#303 !important; }
.color-306 { color:#306 !important; }
.color-309 { color:#309 !important; }
.color-30c { color:#30c !important; }
.color-30f { color:#30f !important; }
.color-330 { color:#330 !important; }
.color-333 { color:#333 !important; }
.color-336 { color:#336 !important; }
.color-339 { color:#339 !important; }
.color-33c { color:#33c !important; }
.color-33f { color:#33f !important; }
.color-360 { color:#360 !important; }
.color-363 { color:#363 !important; }
.color-366 { color:#366 !important; }
.color-369 { color:#369 !important; }
.color-36c { color:#36c !important; }
.color-36f { color:#36f !important; }
.color-390 { color:#390 !important; }
.color-393 { color:#393 !important; }
.color-396 { color:#396 !important; }
.color-399 { color:#399 !important; }
.color-39c { color:#39c !important; }
.color-39f { color:#39f !important; }
.color-3c0 { color:#3c0 !important; }
.color-3c3 { color:#3c3 !important; }
.color-3c6 { color:#3c6 !important; }
.color-3c9 { color:#3c9 !important; }
.color-3cc { color:#3cc !important; }
.color-3cf { color:#3cf !important; }
.color-3f0 { color:#3f0 !important; }
.color-3f3 { color:#3f3 !important; }
.color-3f6 { color:#3f6 !important; }
.color-3f9 { color:#3f9 !important; }
.color-3fc { color:#3fc !important; }
.color-3ff { color:#3ff !important; }

.color-600 { color:#600 !important; }
.color-603 { color:#603 !important; }
.color-606 { color:#606 !important; }
.color-609 { color:#609 !important; }
.color-60c { color:#60c !important; }
.color-60f { color:#60f !important; }
.color-630 { color:#630 !important; }
.color-633 { color:#633 !important; }
.color-636 { color:#636 !important; }
.color-639 { color:#639 !important; }
.color-63c { color:#63c !important; }
.color-63f { color:#63f !important; }
.color-660 { color:#660 !important; }
.color-663 { color:#663 !important; }
.color-666 { color:#666 !important; }
.color-669 { color:#669 !important; }
.color-66c { color:#66c !important; }
.color-66f { color:#66f !important; }
.color-690 { color:#690 !important; }
.color-693 { color:#693 !important; }
.color-696 { color:#696 !important; }
.color-699 { color:#699 !important; }
.color-69c { color:#69c !important; }
.color-69f { color:#69f !important; }
.color-6c0 { color:#6c0 !important; }
.color-6c3 { color:#6c3 !important; }
.color-6c6 { color:#6c6 !important; }
.color-6c9 { color:#6c9 !important; }
.color-6cc { color:#6cc !important; }
.color-6cf { color:#6cf !important; }
.color-6f0 { color:#6f0 !important; }
.color-6f3 { color:#6f3 !important; }
.color-6f6 { color:#6f6 !important; }
.color-6f9 { color:#6f9 !important; }
.color-6fc { color:#6fc !important; }
.color-6ff { color:#6ff !important; }

.color-900 { color:#900 !important; }
.color-903 { color:#903 !important; }
.color-906 { color:#906 !important; }
.color-909 { color:#909 !important; }
.color-90c { color:#90c !important; }
.color-90f { color:#90f !important; }
.color-930 { color:#930 !important; }
.color-933 { color:#933 !important; }
.color-936 { color:#936 !important; }
.color-939 { color:#939 !important; }
.color-93c { color:#93c !important; }
.color-93f { color:#93f !important; }
.color-960 { color:#960 !important; }
.color-963 { color:#963 !important; }
.color-966 { color:#966 !important; }
.color-969 { color:#969 !important; }
.color-96c { color:#96c !important; }
.color-96f { color:#96f !important; }
.color-990 { color:#990 !important; }
.color-993 { color:#993 !important; }
.color-996 { color:#996 !important; }
.color-999 { color:#999 !important; }
.color-99c { color:#99c !important; }
.color-99f { color:#99f !important; }
.color-9c0 { color:#9c0 !important; }
.color-9c3 { color:#9c3 !important; }
.color-9c6 { color:#9c6 !important; }
.color-9c9 { color:#9c9 !important; }
.color-9cc { color:#9cc !important; }
.color-9cf { color:#9cf !important; }
.color-9f0 { color:#9f0 !important; }
.color-9f3 { color:#9f3 !important; }
.color-9f6 { color:#9f6 !important; }
.color-9f9 { color:#9f9 !important; }
.color-9fc { color:#9fc !important; }
.color-9ff { color:#9ff !important; }

.color-c00 { color:#c00 !important; }
.color-c03 { color:#c03 !important; }
.color-c06 { color:#c06 !important; }
.color-c09 { color:#c09 !important; }
.color-c0c { color:#c0c !important; }
.color-c0f { color:#c0f !important; }
.color-c30 { color:#c30 !important; }
.color-c33 { color:#c33 !important; }
.color-c36 { color:#c36 !important; }
.color-c39 { color:#c39 !important; }
.color-c3c { color:#c3c !important; }
.color-c3f { color:#c3f !important; }
.color-c60 { color:#c60 !important; }
.color-c63 { color:#c63 !important; }
.color-c66 { color:#c66 !important; }
.color-c69 { color:#c69 !important; }
.color-c6c { color:#c6c !important; }
.color-c6f { color:#c6f !important; }
.color-c90 { color:#c90 !important; }
.color-c93 { color:#c93 !important; }
.color-c96 { color:#c96 !important; }
.color-c99 { color:#c99 !important; }
.color-c9c { color:#c9c !important; }
.color-c9f { color:#c9f !important; }
.color-cc0 { color:#cc0 !important; }
.color-cc3 { color:#cc3 !important; }
.color-cc6 { color:#cc6 !important; }
.color-cc9 { color:#cc9 !important; }
.color-ccc { color:#ccc !important; }
.color-ccf { color:#ccf !important; }
.color-cf0 { color:#cf0 !important; }
.color-cf3 { color:#cf3 !important; }
.color-cf6 { color:#cf6 !important; }
.color-cf9 { color:#cf9 !important; }
.color-cfc { color:#cfc !important; }
.color-cff { color:#cff !important; }

.color-f00 { color:#f00 !important; }
.color-f03 { color:#f03 !important; }
.color-f06 { color:#f06 !important; }
.color-f09 { color:#f09 !important; }
.color-f0c { color:#f0c !important; }
.color-f0f { color:#f0f !important; }
.color-f30 { color:#f30 !important; }
.color-f33 { color:#f33 !important; }
.color-f36 { color:#f36 !important; }
.color-f39 { color:#f39 !important; }
.color-f3c { color:#f3c !important; }
.color-f3f { color:#f3f !important; }
.color-f60 { color:#f60 !important; }
.color-f63 { color:#f63 !important; }
.color-f66 { color:#f66 !important; }
.color-f69 { color:#f69 !important; }
.color-f6c { color:#f6c !important; }
.color-f6f { color:#f6f !important; }
.color-f90 { color:#f90 !important; }
.color-f93 { color:#f93 !important; }
.color-f96 { color:#f96 !important; }
.color-f99 { color:#f99 !important; }
.color-f9c { color:#f9c !important; }
.color-f9f { color:#f9f !important; }
.color-fc0 { color:#fc0 !important; }
.color-fc3 { color:#fc3 !important; }
.color-fc6 { color:#fc6 !important; }
.color-fc9 { color:#fc9 !important; }
.color-fcc { color:#fcc !important; }
.color-fcf { color:#fcf !important; }
.color-ff0 { color:#ff0 !important; }
.color-ff3 { color:#ff3 !important; }
.color-ff6 { color:#ff6 !important; }
.color-ff9 { color:#ff9 !important; }
.color-ffc { color:#ffc !important; }
.color-fff { color:#fff !important; }

.font-number { font-family:'Lato', sans-serif; }

.text-left { text-align:left; }
.text-center { text-align:center; }
.text-right { text-align:right; }
.views { color:#d10; }

hr.hr-dotted, .hr-dotted { border:0; height:0; margin-top:15px; margin-bottom:15px; border-bottom:dotted 1px #eee; }

#navbar ul.drop { background:#4288b3; position:absolute; right:5px; display:none; z-index:9999; }
#navbar ul.drop li { display:block; padding:8px 0; text-align:center; border-top:1px solid #9ac2da; margin:0; }
#navbar ul.drop li a { background:none; box-shadow:none; padding:10px 0; font-weight:bold; font-size:1.7rem; color:#fff; border-bottom:0; white-space:nowrap; letter-spacing:0; }
#navbar ul.drop li:hover { background:#fd6802; }
#navbar ul li:hover > .drop { display:block; width:130px; }
#navbar.in ul.drop li   { padding:5px 0; }
#navbar.in ul.drop li a { font-size:1.45rem; }


a { direction:ltr; unicode-bidi:embed; }
a:link, a:visited, a:active { color:#087aca; text-decoration:none; }
a:hover { color:#3510c9; text-decoration:none; }

img { max-width:100%; vertical-align:middle; border-width:0; }
textarea { resize:none; }
form { margin:0px; display:inline }

input, select, textarea, .input, .select, .textarea {
    padding:3px;
    font-size: 1rem;
    line-height: 1.5;
    color:#333;
    background-color:#fff;
    border:1px solid #ccc;
	border-radius:0.25rem;
	/*vertical-align:middle;*/
    transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

/*表單欄位提示 placeholder */
input::placeholder, select::placeholder, textarea::placeholder { color:#bbb !important; font-size:1em; }

textarea:focus, input:focus, select:focus {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}

textarea.posting-textarea { width:100%; max-width:100%; resize:vertical; }

label { cursor: pointer; }
label:hover { color:#e50; }





/* ===================================================================================================================
	03. 分頁設定 page
=================================================================================================================== */
.page-box { display:inline-flex; align-items:flex-end; }
.page-box .page-btn, .page-box .page-btn:hover {
	display:inline-block;
	padding:4px;
	color:#fff;
	text-align:center;
	overflow:hidden;
	background:#537083;
	border:1px solid #4f5c62;
}

.page-box a, .page-box strong {
	display:inline-block;
	min-width:30px;
	padding:4px;
	margin:0 2px;
	vertical-align:middle;
	text-align:center;
	color:#333;
	border:1px solid #c3c9cd;
	border-radius:3px;
	box-shadow:1px 1px 2px #e0e0e1;
	background:#f6f8f9;
	background:linear-gradient(#f6f8f9, #f1f4f6, #edf1f3);
}

.page-box strong {
	min-width:30px;
	font-weight:bold;
	color:#fff;
	border:1px solid #4f5c62;
	background:#5c7485;
	background:linear-gradient(#5c7485, #4e606c, #4b5a63);
}

.page-box a:hover {
	color:#f60;
	background:#c5e4f1;
	background:linear-gradient(#c5e4f1, #bae0f5, #a2d6f2);
}

.page-box .page-dots { vertical-align:-0.45em; letter-spacing:-2px; }
.page-box .page-sep { display:none; }

.page-box.small a { min-width:25px; padding:2px; }





/************************************************************************************************/

div.br { height:10px;}
.br1 { line-height:5px; }
.forum-br { height:5px; clear:both; background:#f8a052; }

.left { position:relative; float:left; height:0; }
.right { position:relative; float:right; height:0; }
.center { text-align:center; }
.clear { height:0; clear:both }
.clear_right { height:0; clear:right }

/* 合併區塊 開始 */
.TaP { margin:0px; padding:0px; float:left; clear:none; width:100%; }
.TaP ul { margin:0; padding:0; } /*連結點位置*/
.TaPT { position:relative; top:7px; float:left; color:#039; height:24px; line-height:24px; letter-spacing:2px; padding:0 10px; margin:0px 1px 0px 0px; background:#ddd url("../images/title_bg1.gif") repeat; list-style:none; border-radius:5px 5px 0 0; -moz-user-select:none; -khtml-user-select:none; cursor:pointer }  /* 連結點 */
.TaPTS { position:relative; top:1px; height:28px; line-height:28px; background:#fff url("../images/title_bg2.gif") repeat-x; color:#c00; border-bottom:solid 1px #fff; } /* 滑鼠移過的區塊 */
.TaPCG { clear:both; } /* 說明內容框 */
.TaPC { padding:4px; color:#444; font-size:13px} /* 說明內容 */
/* 合併區塊 結束 */

/****************************/

.postbody img { max-width:100%; }

.coco { font-family:'Lato', sans-serif; }

h3.sub_title, p.sub_title, .sub_title { padding-bottom:5px; color:#377a32; font-size:18px; line-height:1.5; }


/***** 按鈕 1 *****/
.btnfile, a.btnfile {
	font-family:'Microsoft JhengHei', sans-serif;
    font-size: 0.85rem;
    cursor: pointer;
    padding: 2px 2px;
}

.btn-light { padding:8px 25px; font-size:20px; font-weight:bold; color:#fff; background:#207bb3; border-radius:10px 0 10px 0; white-space:nowrap; }
.btn-light:hover, .btn-light:focus { color:rgba(255, 255, 255); background:#2767ad; }

.btn-topic a { padding:5px 10px; display:inline-block; white-space:nowrap; font-size:18px; font-weight:bold; color:#fff; background:#207bb3; border-radius:10px 0; }
.btn-topic a:hover, .btn-topic a:focus { color:rgba(255, 255, 255); background:#2767ad; border-radius:0 10px; }

.button-big, a.button-big, .button-big2, a.button-big2, .button-small, a.button-small {
	display:inline-block;
	font-family:'Microsoft JhengHei', sans-serif;
	font-weight:bold;
	color:#fff;
	white-space:nowrap;
	text-shadow:1px 1px 1px #000;
	border:2px solid #fff;
	border-radius:5px;
	box-shadow:0 0 3px #222;
	cursor:pointer;
	position:relative;
	z-index:2;
}

.button-big,   a.button-big   { padding:5px 8px; font-size:1.1rem; }
.button-big2,  a.button-big2  { padding:5px 8px; font-size:1.1rem; }
.button-small, a.button-small { padding:2px 5px; font-size:1.0rem; }

.button-big:hover, .button-big2:hover, .button-small:hover, a.button-big:hover, a.button-big2:hover, a.button-small:hover { color:#ff0; box-shadow:1px 1px 5px #333; }

.post_img, .reply_img, .edit_img { background:#1b659c; }

.delete_img { background:#cd1d1d; }

.submit,
.reset,
.cancel,
.edit,
.del,
.change,
.faq,
.add,
.view,
.updata,
.buy,
.buy_over,
.bid_now,
.qna,
.move,
.manager,
.mark {
	display:inline-block;
	padding:5px 8px;
	margin-top:5px;
	margin-bottom:5px;
	margin-right:10px;
	font-family:'Microsoft JhengHei', sans-serif;
	font-weight:bold;
	font-size:1.1rem;
	color:#fff;
	white-space:nowrap;
	text-shadow:1px 1px 1px #000;
	border:2px solid #fff;
	border-radius:5px;
	box-shadow:0 0 2px #555;
	cursor:pointer;
	position:relative;
	z-index:2;
}

.bid_now { cursor:not-allowed; }

.edit, .del, .move, .manager, .mark {
	padding:2px 5px;
	margin-right:4px;
	font-size:1.05rem;
}

.submit:hover,
.reset:hover,
.cancel:hover,
.edit:hover,
.del:hover,
.change:hover,
.faq:hover,
.add:hover,
.view:hover,
.updata:hover,
.buy:hover,
.buy_over:hover,
.bid_now:hover,
.qna:hover,
.move:hover,
.manager:hover,
.mark:hover { color:#ff0; box-shadow:1px 1px 5px #333; }

a.submit, a.reset, a.cancel, a.edit, a.del, a.change, a.faq, a.add, a.view, a.buy, a.qna, a.move, a.manager, a.mark { color:#fff; }

.submit    { background:#072; }
.reset     { background:#853; }
.cancel    { background:#888; }
.edit      { background:#909; }
.del       { background:#c00; }
.faq       { background:#c0c; }
.add       { background:#00c; }
.move      { background:#080; }
.manager   { background:#059; }
.mark      { background:#853; }
.updata    { background:#e60; }

.qna       { background:#099; padding: 5px  8px; margin:5px; }
.view      { background:#072; padding:10px 15px; margin:5px; }
.buy       { background:#c00; padding:10px 15px; margin:5px; }
.buy_over  { background:#aaa; padding:10px 15px; margin:5px; cursor:not-allowed; }
.bid_now   { background:#888; padding: 8px 15px; margin:5px; }

.bid-poppup .submit, .bid-poppup .add { padding:6px 10px; margin:5px; }

.button-072 { background:#072 !important; }
.button-853 { background:#853 !important; }
.button-888 { background:#888 !important; }
.button-909 { background:#909 !important; }
.button-c00 { background:#c00 !important; }
.button-c0c { background:#c0c !important; }
.button-00c { background:#00c !important; }
.button-080 { background:#080 !important; }
.button-059 { background:#059 !important; }
.button-099 { background:#099 !important; }
.button-f60 { background:#f60 !important; }
/************** 論壇使用 **************/

.error-box { padding:30px; position:relative; color:#c00; background:#f9d7da; border:1px solid #f9d7da; -webkit-border-radius:25px 0px 25px 0px; -moz-border-radius:25px 0px 25px 0px; border-radius:25px 0px 25px 0px; }

.error-box p.lead { font-weight:600; color:#d00; }

.btnbbcode { font:13px "Lucida Grande", Verdana, Helvetica, sans-serif; color:#000; border:1px solid #b6c0ca; background:#e0e0e0; }

blockquote, q{ font:bold 18px/1.5 Consolas,"Courier New","KaiTi","KaiTi_GB2312","FangSong_GB2312",SimHei,arial,Monaco,monospace; color:#000; margin:1em; margin-left:1em; margin-right:1em; padding:20px; quotes:"\201C""\201D""\2018""\2019"; background:#fcfcfc; border:1px solid #eee; border-left:10px solid #ccc; border-radius:15px; }
q:before,blockquote:before,q:after, blockquote:after{ font-size:3em; color:#ccc; line-height:.01em; vertical-align:-1rem; }
q:before,blockquote:before{ content:open-quote; top:0; float:left; position:relative; margin-left:-1rem; }
q:after, blockquote:after{ float:right; position:relative; content:close-quote; bottom:-1.9rem; margin-right:-1rem; }
blockquote div { font-size:0.9em; line-height:1.3; }

.username-coloured { font-weight: bold; }
/************** 總使用 **************/

/*h1, h2, h3, h4, h5, h6 { font-weight:bold; }*/

h1 { font-size:24px }
h2 { font-size:22px }
h3 { font-size:18px }
h4 { font-size:16px }
h5 { font-size:14px }
h6 { font-size:13px }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color:#212121; text-decoration:none!important; opacity:1 }

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { opacity:.8 }

.section {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 15px 0;
}
/************************************************************************************* 首頁使用1 *************************************************************************************/
.block_title { padding:5px 0; }
.more        { text-align:right; }
.more a      { display:inline-block; width:43px; height:20px; margin:5px 0; background:url('../images/more.gif') no-repeat; }

.block_body   { padding-top:5px; margin-left:0 !important; margin-right:0 !important; margin-bottom:15px; word-wrap:break-word; word-break:break-all; }
.block_body p { margin-bottom:5px; }
.block_body img { max-width:100% !important; }
.block_body iframe { width:100% !important; }
.block_body .about-item { margin-bottom:0; }
.ball { clear:both; height:0; margin-top:5px; margin-bottom:5px; border-bottom:dotted 1px #eee; }
/************************************************************************************* 首頁使用0 *************************************************************************************/

/* Code block */
dl.codebox {
	border-color: #77a8ce;
    border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
    background-color: #e6f0f9;
    border: 1px solid #bfd9ef;
    padding: 3px;
    margin-top: 8px;
}

dl.codebox dt {
	padding: 5px 2px 7px;
	border-bottom: 1px solid #bfd9ef;
}
dl.codebox dd {
	padding: 5px;
	background-color: #fff;
	color: #0b5690;
	max-height: 300px;
    overflow: auto;
}

dl.codebox code {
	padding: 0;
	color: #004276;
	background-color: #fff;
}

code { font:15px 'Inconsolata-dz', monospace, sans-serif !important; word-break: break-all; }
.syntaxbg		{ color: #ccc; }
.syntaxcomment	{ color: #090; }
.syntaxdefault	{ color: #00e; }
.syntaxhtml		{ color: #000; }
.syntaxkeyword	{ color: #d00; }
.syntaxstring	{ color: #f0f; }

.profile-icons li { line-height:10px; }
.profile-icons li a { display:inline-block; }


.message-box h4 { text-transform:uppercase; padding:0; margin:0 0 5px; font-weight:600; letter-spacing:0.5px; font-size:15px; color:#999; }

.message-box h2 a.topictitle { text-transform:uppercase; padding:0; margin:0 0 5px; font-weight:600; letter-spacing:0.5px; font-size:21px; }

.message-box h2 { font-size:28px; font-weight:500; padding:0 0 10px; margin:0; line-height:62px; margin-top:0; text-transform:none; }

.message-box p { margin-bottom:10px; font-size:1em; }

.message-box .lead { padding-top:10px; font-size:19px; font-style:italic; color:#999; padding-bottom:0; }

.post-media { position:relative; }

.post-media img { width:100%; }

.playbutton { position:absolute; color:#fff !important; top:40%; font-size:60px; z-index:12; left:0; right:0; text-align:center; margin:-20px auto; }

.hoverbutton { background-color:#fd6802; position:absolute; color:#fff !important; top:48%; font-size:21px; z-index:12; left:0; opacity:0; right:0; width:50px; height:50px; line-height:50px; text-align:center; margin:-20px auto; }

.service-widget:hover .hoverbutton { opacity:1; }

hr.hr1 { position:relative; margin:20px 0; border:1px dashed #f2f3f5; }

hr.hr2 { position:relative; margin:17px 0; border:1px dashed #f2f3f5; }

hr.hr3 { position:relative; margin:25px 0 30px 0; border:1px dashed #f2f3f5; }

hr.pm { width:85%; border:1px dashed #f9d2c4; }

hr {
    height: 0;
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #ccc;
}

.desc { padding:30px; position:relative; background:#c4e6f4; border:1px solid #c4e6f4; -webkit-border-radius:25px 0px 25px 0px; -moz-border-radius:25px 0px 25px 0px; border-radius:25px 0px 25px 0px; }

.contact_form {
    border: 1px solid #ededed;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    background-color: #eef4fb;
    padding: 30px 20px;
}


.btn-light:hover, .btn-light:focus {
    color: rgba(255, 255, 255);
    background: #2767ad;
}

.btn-light {
    padding: 13px 40px;
    font-size: 21px;
	font-weight: bold;
    color: #fff;
    background-color: #207bb3;
}

.nav-pills, .effect-1:after, .nav-pills > li > a, .global-radius, .btn-brd {
    -webkit-border-radius: 15px 0px 15px 0px;
    -moz-border-radius: 15px 0px 15px 0px;
    border-radius: 15px 0px 15px 0px;
}

a, .btn {
    text-decoration: none !important;
    outline: none !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}






/* ===================================================================================================================
	發文、PM、刊登商品之 BBCode按鈕
=================================================================================================================== */
.bbcode-line {
	width:0;
	height:24px;
	margin-right:2px;
	display:inline-block;
	vertical-align:-6px;
	border-left:1px #aaa dotted;
}

.btnbbcode {
	min-width:30px;
	padding:5px;
	margin:0 0 5px -2px;
	color:#333;
	text-align:center;
	box-shadow:0 0 1px #487688;
	background:#fff;
	border:solid 1px #79c2e3;
	white-space:nowrap;
	border-radius:3px;
	cursor:pointer;
	font-family: "FontAwesome";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	display: var(--fa-display, inline-block);
	font-style: normal;
	font-variant: normal;
	line-height: 1;
	text-rendering: auto;
	font-size: 0.875em;
	vertical-align: 0.05357em;
}

.btnbbcode:hover { background:#fffac8; }

.btnbbcode.b-B::before		   { content: "\f032"; }
.btnbbcode.b-I::before		   { content: "\f033"; }
.btnbbcode.b-U::before		   { content: "\f0cd"; }
.btnbbcode.b-Quote::before	   { content: "\f10e"; color:#709; }
.btnbbcode.b-Pre::before	   { content: "\f08d"; color:#d30; }
.btnbbcode.b-Code::before	   { content: "\f121"; color:#08b; }
.btnbbcode.b-List::before	   { content: "\f0ca"; color:#600; }
.btnbbcode.b-List1::before	   { content: "\f0cb"; color:#600; }
.btnbbcode.b-li::before		   { content: "\f069"; color:#600; }
.btnbbcode.b-Img::before	   { content: "\f03e"; color:#090; }
.btnbbcode.b-Url::before	   { content: "\f0c1"; color:#00c; }
.btnbbcode.b-YouTube::before   { content: "\f16a"; color:#c00; }
.btnbbcode.b-fontsize::before  { content: "\f25c"; }
.btnbbcode.b-fontcolor::before { content: "\f576"; color:#c0c; }
.btnbbcode.b-Center::before, .btnbbcode.b-center::before { content: "\f037"; }
.btnbbcode.b-Hr::before,     .btnbbcode.b-hr::before     { content: "\f068"; }
.btnbbcode.b-Right::before,  .btnbbcode.b-right::before  { content: "\f038"; }
.btnbbcode.b-Hidden::before, .btnbbcode.b-hidden::before { content: "\f070"; color:#888; }

.b-fontsize { position:relative; }
.bbcode-fontsize-box { background:#fff; display:none; position:absolute; top:-8px; left:30px; font-size:16px; text-align:left; border:1px solid #ccc; box-shadow:#888 0 0 3px; }
.bbcode-fontsize-box li { padding:3px 5px; display:inline-block; }
.bbcode-fontsize-box li:hover { background:#eee; }

.bbcode-color-box { display:none; }


#helpline { padding:2px; margin:2px 0 5px 0; position:relative; font-weight:bold; font-size:1rem; }

#helpline kbd { display:block; padding:2px; margin:2px 0 5px 0; position:absolute; font-weight:normal; font-size:0.95em; white-space:nowrap; }

#helpline kbd > span      { color:#0ff; }
#helpline kbd > span span { color:#f00; }





/* ===================================================================================================================
	發文、PM、刊登商品之 YouTube 自動縮放
=================================================================================================================== */
.block_body iframe { width:100%; }

.videobox {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
	overflow: hidden;
}

.videobox iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}