@charset "utf-8";
/* CSS Document */
@charset "utf-8";
.margin_bottom{
	margin-bottom:4px;
}
/*List樣式*/
.table_list{
	width: 100%;
	border: 0px solid #ddd;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
}
.table_list .left{
	text-align: left;
}
.table_list .right{
	text-align: right;
}
.table_list .center{
	text-align: center;
}
.table_list .title_table{
	color: #8a8a8a;
	background-color: #d7d7d7;
	padding-top: 10px;
	padding-right: 8px;
	padding-bottom: 10px;
	padding-left: 8px;
	font-weight: 600;
}
.table_list .title_tableBlue{
	color: #00478d;
	background-color: #62aeff;
	padding-top: 10px;
	padding-right: 8px;
	padding-bottom: 10px;
	padding-left: 8px;
	font-weight: 600;
}
.table_list .title_tableBlueLight{
	background-color: #bbdcff;
	padding-top: 10px;
	padding-right: 8px;
	padding-bottom: 10px;
	padding-left: 8px;
	border: 1px solid #FFF;
}
.table_list th {
	font-family: "微軟正黑體";
	font-size: 1.1rem;
	font-weight: 600;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: normal;
	background-color: #d6d6d6;
	border-bottom: 1px solid #FFF;
	border-right: 1px solid #FFF;
	padding-right: 8px;
	padding-left: 8px;
}
.table_list th:last-child{border-bottom: 0px solid #FFF;}
.table_list td{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-right: 8px;
	padding-left: 8px;
	background-color: transparent;
	border-bottom: 1px solid #ddd;
}
.table_list td a{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #004eff;
	text-align: left;
	text-decoration: none;
	margin-right: 5px;
	margin-left: 5px;
}
.table_list tr:hover{
	background-color: #ffeccb;
}
.table_list tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.05);
}
.table_list_border{
	width: 100%;
	border: 1px solid #ddd;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
}
.table_list_border th {
	border: 1px solid #ddd;
	background-color: #81beff;
	border-bottom: 3px solid #4ba2ff;
}
.table_list_border td{
	border: 1px solid #ddd;
}
.table_list_border tr:hover{
	background-color: transparent;
}
.table_list_border .active{background-color: #bdebe7;}

.table-container {
	overflow: scroll;
}
.fixed-first-column{width: 100%;}
.fixed-first-column th,
.fixed-first-column td {
  	white-space: nowrap;
  	padding: 10px 20px;
  	font-family: Arial;
	border: 1px solid #d6d6d6;
}

/*fixed column*/
.fixed-first-column tr th:first-child,
.fixed-first-column td:first-child {
  	position: sticky;
  	width: 100px;
  	left: 0;
  	z-index: 10;
  	background: #f2f2f2;
}

/*fixed row*/
.fixed-first-column tr th:first-child {
  	z-index: 11;
}

.fixed-first-column tr th {
  	position: sticky;
  	top: 0;
  	z-index: 9;
  	background: #d6d6d6;
}


/*List樣式結尾*/

/*Form樣式*/
.table_form{
	width: 100%;
	border: 1px solid #f2f0e9;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
.table_form .left{
	text-align: left;
}
.table_form .right{
	text-align: right;
}
.table_form .center{
	text-align: center;
}
.table_form th{
	background-color: #f2f0e9;
	border-right-width: 4px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #eeeaba;
	border-bottom-color: #fff;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: right;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
}
.table_form .title_table{
	color: #000;
	background-color: #d1c9ae;
	padding-top: 10px;
	padding-right: 8px;
	padding-bottom: 10px;
	padding-left: 8px;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	font-size: 1.2rem;
	font-weight: 600;
	border-right-width: 0px;
	text-align: center;
}
.table_form td{
	background-color: #FFFFFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #f2f0e9;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
}
.table_form td > dd{float:left;}
.table_form tr:last-child > td{border-bottom-width: 0px;}
.table_form td a{
	text-decoration: none;
	/*color: #355cb5;*/
}
.table_form .even {
	background-color: #d9edf7;
	font-size: 1rem;
	color: #FFF;
	font-weight: bold;
	text-align: left;
}
.table_form td > dl{display: inline-block; margin: 2px 6px 2px 0;}
.table_form td > dl >dd{display: inline-block; margin: 2px 6px 2px 0;}

.table_formQuery{
	width: 100%;
	border: 1px solid #ddd;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
.table_formQuery .left{
	text-align: left;
}
.table_formQuery .right{
	text-align: right;
}
.table_formQuery th{
	background-color: #f5f5f5;
	border-right-width: 4px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #ddd;
	border-bottom-color: #ddd;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 30px;
	background-image: url(../images/icon_arr.png);
	background-repeat: no-repeat;
	background-position: 10px center;
}
.table_formQuery td{
	background-color: #FFFFFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ddd;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
}
.table_formBlue{
	width: 100%;
	border: 1px solid #ddd;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
.table_formBlue th{
	background-color: #b1d7ff;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-right-color: #ddd;
	border-bottom-color: #FFF;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #FFF;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
	border-right: 1px solid #fff;
}
.table_formBlue .title_table{
	color: #FFF;
	background-color: #81beff;
	padding-top: 10px;
	padding-right: 8px;
	padding-bottom: 10px;
	padding-left: 8px;
	font-size: 1rem;
	font-weight: 600;
	border-bottom: 2px solid #54a7ff;
	border-right: 1px solid #fff;
	-webkit-border-top-left-radius: 0px;
	-webkit-border-top-right-radius: 0px;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-topright: 0px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}
.table_formBlue td{
	background-color: #FFFFFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ddd;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
}
.table_formBlue tr:last-child > td{border-bottom-width: 0px;}
.table_formBlue td a{
	text-decoration: none;
	/*color: #355cb5;*/
}
/*Form樣式結尾*/

/*表單裡的表格*/
.table_list_s{
	width: 100%;
	border: 0px solid #ddd;
	margin-right: auto;
	margin-left: auto;
	table-layout: fixed;
}
.table_list_s th{
	color: #000;
	text-align: center;
	padding: 0 8px;
	font-weight: normal;
	background-color: #f5f5f5;
	border-right: 1px solid #FFF;
}
.table_list_s td{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #606060;
	text-align: center;
	padding: 8px;
	background-color: transparent;
	border: 0px solid #ddd;
	border-bottom: 1px solid #f5f5f5;
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    /*height: 30px;*/
}
.table_list_s td >p{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	font-weight: 600;
	margin-bottom: 4px;
}
.table_list_s td a{
	text-decoration: none;
	color: #355cb5;
}
.table_list_s td img{
	height: auto;
	width: 100%;
}
.table_list_s td > dd{float:left;}
.table_list_s .left{
	text-align: left;
}
@media (max-width: 980px) {
	.table_list_s td img{
		height: auto;
		width: 300px;
}
}
.table_list_border_s{
	width: 100%;
	border: 1px solid #ddd;
	margin: 10px auto;
}
.table_list_border_s th{
	color: #000;
	text-align: left;
	padding: 0 8px;
	font-weight: normal;
	background-color: #f5f5f5;
	border-right: 1px solid #ddd;
	border-bottom: 3px solid #ddd;
}
.table_list_border_s td{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #606060;
	text-align: left;
	padding: 8px;
	background-color: transparent;
	border: 1px solid #ddd;
}
.table_list_border_s td a{
	text-decoration: none;
	color: #355cb5;
}
.table_list_border_s td img{
	height: auto;
	width: 100%;
}
.table_form_s{
	font-family: "微軟正黑體";
	font-size: 0.75rem;
	line-height: 27px;
	border: 1px solid #ddd;
	margin: 5px;
}
.table_form_s th{
	color: #000;
	text-align: right;
	padding: 10px 8px;
	font-weight: normal;
	background-color: #f5f5f5;
	padding-right: 8px;
	padding-left: 8px;
	border-right-width: 3px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #ddd;
	border-bottom-color: #ddd;
}
.table_form_s td{
	background-color: #FFF;
	border: 1px solid #ddd;
	color: #000;
	text-align: left;
	padding: 10px 8px;
}
.table_form_s td img{
	height: auto;
	width: 120px;
}
.table_form_s td > dl{}
.table_form_s td > dl > dt{}
.table_form_s td > dl > dd{display: inline-block;}

.table_list_s-ReportFishing{
	width: 100%;
	border: 0px solid #ddd;
	margin-right: auto;
	margin-left: auto;
	table-layout: fixed;
	height: 100%;
}
.table_list_s-ReportFishing th{
	color: #000;
	text-align: center;
	padding: 0 8px;
	font-weight: normal;
	background-color: #f5f5f5;
	border-right: 1px solid #FFF;
}
.table_list_s-ReportFishing td{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #606060;
	text-align: center;
	padding: 8px;
	background-color: transparent;
	border: 0px solid #ddd;
	border-bottom: 1px solid #f5f5f5;
    overflow: hidden;
    /*height: 30px;*/
}
.table_list_s-ReportFishing tr:first-child > td{height: 30px;}
.table_list_s-ReportFishing tr:last-child > td{border-bottom: 0px solid #f5f5f5;height: 60px;}
.table_list_s-ReportFishing tr:last-child > td >input{
	width: 100px;
}
.table_list_s-ReportFishing td >p{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	font-weight: 600;
	margin-bottom: 4px;
}
.table_list_s-ReportFishing td a{
	text-decoration: none;
	color: #355cb5;
}
.table_list_s-ReportFishing td img{
	width: 100%;
	height: auto;
}
.table_list_s-ReportFishing td > dd{float:left;}
.table_list_s-ReportFishing .left{
	text-align: left;
}
@media (max-width: 980px) {
	.table_list_s-ReportFishing td img{
		width: 100%;
	height: auto;
	}
}
/*表單裡的表格結尾*/

/*表單裡的div*/
.file_name_box{
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: 4px;
	border: 1px solid #aeaeae;
	background: #fff;
	display: inline-block;
	margin-top: 4px;
	margin-right: 4px;
	margin-bottom: 4px;
	font-family: "微軟正黑體";
	font-size: 0.9rem;
	color: #999;
}
/*表單裡的div結尾*/

/*表單裡的照片上傳區塊*/
.list-box-item-box-uploaphoto{
	width: 100%;
	column-count: 4;
    column-width: 200px;
    column-gap: 10px;
	margin-top: 10px;
}
@media (max-width: 1280px) {
	.list-box-item-box-uploaphoto{
		column-count: 2;
	}
}
.list-box-item-box > .item{
	margin-bottom: 10px;
    break-inside: avoid;
    background: #fff;
    border: 1px solid #ddd;
	padding: 10px;
}
.list-box-item-box > .item a > p{
	color: #64b5f6;
	font-family: "微軟正黑體";
	font-size: 18px;
	line-height: 30px;
	font-weight: 600;
}
.list-box-item-box > .item a > span{
	color: #6d6d6d;
	font-family: "微軟正黑體";
	font-size: 16px;
	line-height: 25px;
}
.list-box-item-box > .item a:hover{text-decoration: none;}
.list-box-item-box > .item:hover{
	background-color: #eee;
	cursor: pointer;
}
.list-box-item-box > .item a > dl{display: block;overflow: hidden;}
.list-box-item-box > .item a > dl > dt{
	float: left;
	color: #000;
	font-family: "微軟正黑體";
	font-size: 16px;
	line-height: 25px;
}
.list-box-item-box > .item a > dl > dd{
	float: left;
	color: #6d6d6d;
	font-family: "微軟正黑體";
	font-size: 16px;
	line-height: 25px;
}
.list-box-item-box-ReportFishing{
	display: flex;
	flex-wrap: wrap;
	align-content: stretch;
}
.list-box-item-box-ReportFishing >.item{
 	width: calc(25% - 10px);
	margin: 10px 5px;
}
@media (max-width: 980px) {
	.list-box-item-box-ReportFishing >.item{
		float: left;
		width: calc(100% - 10px);
		margin: 10px 5px;
	}
}
/*表單裡的照片上傳區塊結尾*/
.leaflet-popup-content {
    margin: 13px 0px 13px 0px!important;
}
.table_layer{}
.leaflet-popup .table_layer tr {
    border-bottom: 1px dashed #a9d4ef;
	display: flex;
	flex-direction: column;
}
.leaflet-popup .table_layer th, .leaflet-popup .table_layer td {
    padding: 0.25rem 2px;
    width: 100%;
	font-size: 0.9rem;
}
/*註冊*/
.table_form_Rig{
	width: 100%;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
.table_form_Rig th{
	background-color: #e6e6e6;
	border-right-width: 4px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #29a79a;
	border-bottom-color: #FFFFFF;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: right;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #FFF;
	border-left-color: #FFF;
}
.table_form_Rig td{
	background-color: #f4f4f4;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 10px;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
	border: 1px solid #FFF;
}
.table_form_Rig td a{
	text-decoration: none;
	color: #355cb5;
	margin-right: 4px;
	margin-left: 4px;
}
/*註冊結尾*/

.selected td{
	background-color: #9db4ef;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	text-align: left;
	padding-top: 8px;
	padding-right: 3px;
	padding-bottom: 8px;
	padding-left: 3px;
}

/*文字顏色*/
.txt{
	font-family: "微軟正黑體";
	font-size: 0.9rem;
	color: #000;
	line-height: 1rem;
}
.txtM{
	font-family: "微軟正黑體";
	font-size: 1rem;
	color: #000;
	line-height: 1.2rem;
}
.txtMM{
	font-family: "微軟正黑體";
	font-size: 1.2rem;
	color: #000;
	line-height: 1.2rem;
}
.txtL{
	font-family: "微軟正黑體";
	font-size: 2rem;
	line-height: 2;
}
.txt_marginLR{
	margin:0 4px;
}
.txt_marginTB{
	margin:6px 0;
}
.txt_bold{font-weight:600;}
.txt_Black{
	color: #000;
}
.txt_Blue{
	color: #64b5f6;
}
.txt_Green{
	color: #75bf14;
}
.txt_GreenDark{
	color: #328968;
}
.txt_Yellow{
	color: #FFBC42;
}
.txt_Coral{
	color: #F16B6F;
}
.txt_Gray{
	color: #c3c3c3;
}
.txt_GreenLake{
	color: #29b3a6;
}
.txt_Brown{
	color: #6b5046;
}
.txt_purple{
	color: #7389db;
}
.txt_Bluedark{
	color: #053c75;
}

.bg-coral      {background-color: #f68088 !important;}
.bg-blue       {background-color: #80baf6 !important;}
.bg-green      {background-color: #4ec19f !important;}
.bg-orange     {background-color: #ff8150 !important;}
.bg-purple     {background-color: #7389db !important;}
.bg-brownlight {background-color: #dbb073 !important;}
.bg-yellow 	   {background-color: #FFBC42 !important;}
.bg-bluedark   {background-color: #053c75 !important;}

.table_list td > .badge{border-radius: 999em;}
.table_list td > .badge > a{color: #FFF;}
@media (max-width: 980px) {
	.table_list .center{
		text-align: left;
	}
	.table_list .right{
		text-align: left;
	}
	.table_list_border_s .center{
		text-align: left;
	}
	.table_list_border_s .right{
		text-align: left;
	}
	
	.table_list td { border:0px;}
	.table_form td > dl {display: block;}
	.table_form .right{
		text-align: left;
	}
	.table_form .center{
		text-align: left;
	}
	
 	.table-rwd{min-width: 100%;}
  	/*針對tr去做隱藏*/
  	tr.tr-only-hide {display: none !important;}
  	/*讓tr變成區塊主要讓他有個區塊*/
 	 .table-rwd tr{
    	display: block;
    	border: 1px solid #f4f4f4;
   		margin: 5px;
  	}
	.table-rwd tr:first-child{border: 0px;}
  	.table-rwd th{display:none;}
  	.table-rwd td {
    	text-align: left;
    	font-size: 1em;
		line-height:1.3em;
    	overflow: hidden;
    	width: 100%;
    	display: block;
		border-bottom-width: 0;
    	border-top-width: 0;
		}
		.table-rwd td img{ vertical-align:middle;}
		.table-rwd td:before {
		/*最重要的就是這串*/
		content: attr(data-th) "  :";
		/*最重要的就是這串*/
		display: inline-block;
		text-transform: uppercase;
		font-weight: 800;
		/*color: #000;*/
		margin-right: 4px;
  		}

  	/*當RWD縮小的時候.table-bordered 會有兩條線，所以針對.table-bordered去做修正*/
  	.table-rwd.table-bordered td,.table-rwd.table-bordered th,.table-rwd.table-bordered{border:0;}
}