﻿/*表單寬度*/
.table-fixed { table-layout: fixed; }/*限定表格長寬設定*/
.more { white-space: nowrap; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }/*單行不換行，超出行寬以...顯示*/
.break { -ms-word-break: break-all; word-break: break-all; }/*文字自動換行*/

.tbox, .tbox10, .tbox12, .tbox15, .tbox20, .tbox25, .tbox30, .tbox40, .tbox50, .tbox60{
    width:100%;
    margin:1em 0;
}
.tbox10 {
    max-width: 100px;
}
.tbox12 {
    max-width: 120px;
}
.tbox15 {
    max-width: 150px;
}
.tbox20 {
    max-width: 200px;
}
.tbox25 {
    max-width: 250px;
}
.tbox30 {
    max-width: 300px;
}
.tbox40 {
    max-width: 400px;
}
.tbox50 {
    max-width: 500px;
}
.tbox60 {
    max-width: 600px;
}


/*Shorten Usages-------------------------------------*/
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}

.hidden{
    display:none;
}

.float-left {
    float: left;
    display:block;
}

.float-center{
    margin:0 auto;
}

.float-right {
    float: right;
    display:block;
}

.inline-block{
    display:inline-block;
    margin:5px 0;
}

.no-padding{
    margin:0 -15px;
}

.display-table{
    display:table;
    border:none;
}

.cell-top{
    display:table-cell;
    vertical-align:top;
}
.cell-middle{
    display:table-cell;
    vertical-align:middle;
}
.cell-bottom{
    display:table-cell;
    vertical-align:bottom;
}


.listitem-inline-none ul, .listitem-inline-none ol{
    list-style-type:none;
    padding-left:0;
}

.listitem-inline-none ul li, .listitem-inline-none ol li{
    display:inline-block;
}

div.editable	{
	border: solid 2px transparent;
	padding-left: 15px;
	padding-right: 15px;
}

div.editable:hover	{
	border-color: black;
}



.error {
    padding:0 5px;
    color: #e80c4d;
    display:inline-block;
}


.b16, .b20, .b25, .b30, .b36, .b42{
    font-weight:800;
    padding:1em 0;
}
.b42{
    font-size:4.2rem;
}
.b36{
    font-size:3.6rem;
}
.b30{
    font-size:3rem;
}
.b25{
    font-size:2.5rem;
}
.b20{
    font-size:2rem;
}
.b16{
    font-size:1.6rem;
}

.row-even, .row-odd, .row-item, .row-head
, .row-even-grey, .row-odd-grey{
    padding:0.5rem;
}
.row-head{
    font-size:larger;
    font-weight:800;
    background-color:rgba(247,166,99,0.9);
}
.row-even:hover, .row-odd:hover{
    background-color:#eee;
}
.row-even{
    background-color:rgba(231, 231,255,1);
}
.row-odd{
    background-color:rgb(250, 250, 225);
}
.row-even-grey:hover, .row-odd-grey:hover{
    background-color:#eff;
}
.row-even-grey{
    background-color:rgb(250, 238,250);
}
.row-odd-grey{
    background-color:rgb(255, 255, 255);
}


.tab-head{
    font-weight:700;
    background-color:rgb(192, 192, 192);
}

/*Shape defined*/
.shape-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.shape-rounded-5 {
    -webkit-border-radius: 5%;
    -moz-border-radius: 5%;
    border-radius: 5%;
}
.shape-rounded-8 {
    -webkit-border-radius: 8%;
    -moz-border-radius: 8%;
    border-radius: 8%;
}
.shape-rounded-10 {
    -webkit-border-radius: 10%;
    -moz-border-radius: 10%;
    border-radius: 10%;
}
.shape-rounded-12 {
    -webkit-border-radius: 12%;
    -moz-border-radius: 12%;
    border-radius: 12%;
}
.shape-rounded-15 {
    -webkit-border-radius: 15%;
    -moz-border-radius: 15%;
    border-radius: 15%;
}
.shape-rounded-18 {
    -webkit-border-radius: 18%;
    -moz-border-radius: 18%;
    border-radius: 18%;
}
.shape-rounded-20 {
    -webkit-border-radius: 20%;
    -moz-border-radius: 20%;
    border-radius: 20%;
}
.shape-rounded-3p {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.shape-rounded-6p {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
.shape-rounded-8p {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
.shape-rounded-10p {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}


/*Border*/
.border-a{
    border: rgb(128, 128, 128) solid 1px 1px;
}
.border-bt{
    border:rgb(128, 128, 128) solid 1px 0;
}
.border-lr{
    border:rgb(128, 128, 128) solid 0 1px;
}
.border-l{
    border:rgb(128, 128, 128) solid 0 0 0 1px;
}
.border-r{
    border:rgb(128, 128, 128) solid 0 1px 0 0;
}
.border-t{
    border:rgb(128, 128, 128) solid 1px 0 0 0;
}
.border-b{
    border:rgb(128, 128, 128) solid 0 0 1px 0;
}
/*Border End*/


/*Pagging Button*/
.paggingBtn, .paggingBtn-left, .paggingBtn-right {
padding: 2px 5px;
width:auto;
cursor:pointer;
}
.paggingBtn {
margin:5px 0 6px 0;
}
.paggingBtn-left {
margin:5px 20px 6px 0;
}
.paggingBtn-right {
margin:5px 0 6px 20px;
}



.fb-comments, .fb-comments iframe[style], .fb-comments span, .fb-comments span iframe[style] {
    width: 100% !important;
}

/*FB and Line Icon*/
.fbicon, .lineicon, .iconLink {
    width: 40px;
    height: 40px;
    display: block;
    float:left;
    margin-right:10px;
}

.fbicon {
    background-image: url(../../Images/FB-40C.png);
}

    .fbicon:hover {
        background-image: url(../../Images/FB-40B.png);
    }

.lineicon {
    background-image: url(../../Images/linebutton_40x40_en.png);
}

.lineicon:hover {
        background-image: url(../../Images/linebutton_40x40_enB.png);
    }

.iconLink:hover {
    background: none;
}




@media (max-width: 767px) {/*750px*/
    body {
        font-size: smaller;
    }
}

@media (min-width: 768px) and (max-width: 991px) {/*970px*/
}

@media (min-width: 992px) and (max-width: 1199px) {/*1170px*/
}

@media (min-width: 1200px) {
}

/*@media (min-width: 1200px) {
}

@media (min-width: 992px) {
}

@media (min-width: 768px) {
}*/
