/*******************************************************************************************************************
    Base CSS Setting    http://www.asiahua.com
    @version            nBIMS 1.0v
    @copyright          Copyright (C) 2020
    @license            Eric Wang (TW) 王聖華 (AHCS) Asia-Hua Clouds Studio, [EMail] myeraic@gmail.com, [LINE.ID] myeraic
********************************************************************************************************************/
/*****[ font size 字體大小 ]*****/
.small{ font-size: small; }
.midium{ font-size: medium; }
.large{ font-size: large; }
.huge{ font-size: 1.4em; }
.cbtxt{ font-size: 90%; }

/*****[ font color 字體顏色 ]*****/
.cwhite{ color: white; }
.cblack{ color: black; }
.cred{ color: red; }
.corange{ color: orange; }
.cyellow{ color: yellow; }
.cgreen{ color: green; }
.cblue{ color: blue; }
.cpurple{ color: purple; }
.cbrown { color: brown; }
.cgray{ color: gray; }
.cgold{ color: gold; }
.csilver{ color: silver; }
.clime{ color: lime; }          /* 亮綠 */
.cmegenta{ color: megenta; }    /* 亮粉 */
.ccyan{ color: cyan; }          /* 淺青 */
.cmaroon{ color: maroon; }      /* 暗紅 */
.cnavy{ color: navy; }          /* 深藍 */
.colive{ color: olive; }        /* 土黃 */
.cteal{ color: teal; }          /* 深青 */
.cindigo{ color: indigo; }      /* 深紫 */

.cerror{ color: red; }          /* 錯誤 */
.cwarring{ color: #f0ad4e; }    /* 警告-澄 */
.cnote{ color: dimgray; }       /* 備註 */
.csign{ color: limegreen; }     /* 標記 */
.cdanger{ color: #d9534f; }     /* 危險-紅 */
.cinfo{ color: #5bc0de; }       /* 資訊-藍 */
.csucess{ color: #5cb85c; }     /* 成功-綠 */

/*****[ background color 背景顏色 ]*****/
.bwhite{ background-color: white; }
.bblack{ background-color: black; }
.bred{ background-color: red; }
.borange{ background-color: orange; }
.byellow{ background-color: yellow; }
.bgreen{ background-color: green; }
.bblue{ background-color: blue; }
.bpurple{ background-color: purple; }
.bbrown { background-color: brown; }
.bgray{ background-color: gray; }
.bgold{ background-color: gold; }
.bsilver{ background-color: silver; }
.blime{ background-color: lime; }           /* 亮綠 */
.bmegenta{ background-color: megenta; }     /* 亮粉 */
.bcyan{ background-color: cyan; }           /* 淺青 */
.bmaroon{ background-color: maroon; }       /* 暗紅 */
.bnavy{ background-color: navy; }           /* 深藍 */
.bolive{ background-color: olive; }         /* 土黃 */
.bteal{ background-color: teal; }           /* 深青 */
.bindigo{ background-color: indigo; }       /* 深紫 */
.bbase{ background-color: #438eb9; }        /* Home標準底色 */
.berror{ background-color: red; }           /* 錯誤 */
.bwarring{ background-color: #f0ad4e; }     /* 警告-澄 */
.bnote{ background-color: dimgray; }        /* 備註 */
.bsign{ background-color: limegreen; }      /* 標記 */
.bdanger{ background-color: #d9534f; }      /* 危險-紅 */
.binfo{ background-color: #5bc0de; }        /* 資訊-藍 */
.bsucess{ background-color: #5cb85c; }      /* 成功-綠 */

/*****[ CSS Width 寬度 ]*****/
.full { width: 100%; }
.half { width: 50%; }
.col3 { width: 33%; }
.col4 { width: 25%; }

/*****[ CSS Float 浮動 ]*****/
.floatleft { float: left; }
.floatright { float: right; }
.floatclear { 
    display: table;
    content: " ";
    float: none;
    clear: both;
}

/*****[ CSS Text align 文字對齊方式 ]*****/
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }

/*****[ CSS Style 文字樣式 ]*****/
.i { font-style: italic; }
.b { font-weight: bold; }
.u { text-decoration: underline; }
.d { text-decoration: line-through; }

/*****[ CSS Other 其他配置 ]*****/
.cb-cursor { cursor:pointer; }          /* 鼠標樣式 */
.cb-loc  { position: relative; }        /* 相對定位 */
.cb-fix  { position: fixed; }
.cb-close{ display : none; }
.cb-open { display : block; }
.cb-pc   { display : block; }           /* PC顯示 */
.cb-phone{ display : none; }            /* 手機顯示 */
.cb-inside {                            /* 內框長寬設置 */
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.cb-over {                              /* 內容溢出截斷顯示省略符 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cb-border {                            /* 外框 */
    border: 1px solid;
    border-color: #e0e0e0;
    -webkit-box-shadow: border-box;             /* Safari and Chrome */
       -moz-box-shadow: border-box;             /* Firefox */
            box-shadow: border-box;             /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
}
.cb-shadow {                            /* 陰影 */
    border: solid 1px #ccc;
    -webkit-box-shadow: 2px 2px 5px;            /* Safari and Chrome */
       -moz-box-shadow: 2px 2px 5px;            /* Firefox */
            box-shadow: 2px 2px 5px rgba(0,0,0,.5);/* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
}
.cb-shadow-text { text-shadow: 3px 3px 3px #ccc; }  /* 文字陰影 */
.cb-radius{                             /* 圓角 */
    -webkit-border-radius: 10px;                /* Safari and Chrome */
       -moz-border-radius: 10px;                /* Firefox */
            border-radius: 10px;                /* Opera 10.5+, future browsers and I */
}
.cb-box{                                /* 盒模型.內縮border.padding */
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.cb-trun{
    border: 2px solid #bbb;
    background-color: #3BA7FF;
    color: white;
    -webkit-border-radius: 99em;                /* Safari and Chrome */
       -moz-border-radius: 99em;                /* Firefox */
            border-radius: 99em;                /* Opera 10.5+, future browsers and I */
}
.cb-rotate{
    -webkit-transform: rotate(90deg);
       -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
         -o-transform: rotate(90deg);
            transform: rotate(90deg);
}
.cb-select{}
.cb-product{
    width: 300px;
    padding: 5px;
    margin : 0 0 10px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cb-pnote{ height:100px; }

/*******************************************************************************************************************/
/*****[ Desktops/Laptops/IPad 桌上型電腦/筆記型電腦/平板 768-1280 ]*****/
@media screen and (min-width: 768px) {
}

/*****[ Low Resolution Tablets / Mobiles 低分辨率平板與手機  481-767 ]*****/
@media screen and (min-width: 481px) and (max-width: 767px) {
    .half { width: 100%; }
    .col3 { width: 100%; }
    .col4 { width: 50%; }
    .cbtxt{ font-size: 95%; }
}

/*****[ Mobiles 手機 320-480 ]*****/
@media screen and (max-width: 480px) {
    .half { width: 100%; }
    .col3 { width: 100%; }
    .col4 { width: 100%; }
    .cbtxt{ font-size: 100%; }
    .cb-pc{ display : none; }
    .cb-phone{ display : block; }
    .cb-select{}
    .cb-product{
        width: 100%;
        white-space: pre-line;
    }
    .cb-pnote{ height:auto; }
}

/*****[ Print 列表機 ]*****/
@media only print {
}