*{
    position: relative;
}
body {
    /*font-family: "微軟正黑體";*/
    width: 100%;
    margin: 0;
    position: relative;
}

.pc{
    display: block;
}
.pc-flex{
    display: inline-flex;
}
.mb{
    display: none;
}
.fs0{
    flex-shrink: 0;
}
.d-flex-sb{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.d-flex-sa{
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.fdc{
    flex-direction: column;
}
.fdcr{
    flex-direction: column-reverse;
}
.fdr{
    flex-direction: row;
}
.fdrr{
    flex-direction: row-reverse;
}
.d-flex{
    display: flex;
}
.d-flex-center{
	display: flex;
    justify-content: center;
    align-items: center;
}
.jcfs{
    justify-content: flex-start !important;
}
.jcfe{
    justify-content: flex-end !important;
}
.jcc{
    justify-content: center!important;
}
.jcst{
    justify-content: stretch!important;
}
.aifs{
    align-items: flex-start !important;
}
.aife{
    align-items: flex-end !important;
}
.aic{
    align-items: center !important;
}
.aist{
    align-items: stretch!important;
}
.flex-wrap{
    flex-wrap: wrap!important;
}

button, button:active, button:focus, button:hover{
    outline: none!important;
}
a, a:active, a:focus, a:hover{
    text-decoration:none;
    color: #666;
}
.contain{
    padding: 15px 30px;
}

button{
    background-color: transparent;
    border: 0;
    cursor: pointer;
}
.board{
    background-color: #fff;
    padding: 30px;
    border-radius: 10px;
    margin: 15px 0;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
}

button.baseBtn01{
    background-color: #000;
    border-radius: 5px;
    color: #fff;
    /*width: 100%;*/
    padding: 5px 0;
}

button.baseBtn02{
    background-color: #fff;
    border-radius: 5px;
    color: #666;
    /*width: 100%;*/
    padding: 5px 15px;
    border:  solid #979797 1px;
}
.posa{
    position: absolute;
}

.r0{
    right: 0;
}
.t0{
    top: 0;
}
.b0{
    bottom: 0;
}
.l0{
	left: 0;
}


.mgt0{
    margin-top: 0!important;
}
.mgt5{
    margin-top: 5px!important;
}
.mgt15{
    margin-top: 15px!important;
}
.mgt20{
    margin-top: 20px!important;
}
.mgt30{
    margin-top: 30px!important;
}
.mgt-30{
    margin-top: -30px!important;
}
.mgt50{
    margin-top: 50px!important;
}
.mgt-50{
    margin-top: -50px!important;
}
.mgt60{
    margin-top: 60px!important;
}
.mgt70{
    margin-top: 70px!important;
}
.mgt100{
    margin-top: 100px!important;
}
.mgt150{
    margin-top: 150px!important;
}
.mgt200{
    margin-top: 200px!important;
}
.mgt-100{
    margin-top: -100px!important;
}
.mgb0{
    margin-bottom: 0!important;
}
.mgb5{
    margin-bottom: 5px!important;;
}
.mgb15{
    margin-bottom: 15px!important;;
}
.mgb30{
    margin-bottom: 30px!important;;
}
.mgb50{
    margin-bottom: 50px!important;
}
.mgb-50{
    margin-bottom: -50px!important;
}
.mgb60{
    margin-bottom: 60px!important;
}
.mgb70{
    margin-bottom: 70px!important;
}
.mgb100{
    margin-bottom: 100px!important;
}
.mgb-100{
    margin-bottom: -100px!important;
}
.mgr0{
	margin-right: 0!important;
}
.mgr5{
    margin-right: 5px!important;
}
.mgr10{
	margin-right: 10px!important;
}
.mgr15{
	margin-right: 15px!important;
}
.mgr30{
    margin-right: 30px!important;
}
.mgr-30{
    margin-right: -30px!important;
}
.mgr50{
    margin-right: 50px!important;
}
.mgr-50{
    margin-right: -50px!important;
}
.mgr100{
    margin-right: 100px!important;
}
.mgr-100{
    margin-right: -100px!important;
}
.mgl0{
	margin-left: 0!important;
}
.mgl5{
    margin-left: 5px!important;
}
.mgl10{
    margin-left: 10px!important;
}
.mgl-10{
    margin-left: -10px!important;
}
.mgl15{
	margin-left: 15px!important;
}
.mgl30{
    margin-left: 30px!important;
}
.mgl-30{
    margin-left: -30px!important;
}
.mgl50{
    margin-left: 50px!important;
}
.mgl-50{
    margin-left: -50px!important;
}
.mgl100{
    margin-left: 100px!important;
}
.mgl-100{
    margin-left: -100px!important;
}
.mg0{
    margin: 0!important;
}
.mg0-15{
    margin: 0 15px!important;
}
.mg5{
    margin: 5px!important;
}
.mg15{
	margin: 15px!important;
}
.mg10-5{
    margin: 10px 5px!important;
}
.mg30{
	margin: 30px!important;
}
.mg30-0{
    margin: 30px 0!important;
}
.mg50-0{
    margin: 50px 0!important;
}



.pd0{
    padding: 0px!important;
}
.pd0-30{
    padding: 0px 30px!important;
}
.pd15{
	padding: 15px!important;
}
.pd30{
    padding: 30px!important;
}
.pd50{
    padding: 50px!important;
}
.pd100{
    padding: 100px!important;
}

.pd15-30{
	padding: 15px 30px!important;
}
.pd15-0{
	padding: 15px 0px!important;
}
.pd30-0{
    padding: 30px 0px!important;
}
.pd50-0{
    padding: 50px 0px!important;
}
.pd100-0{
    padding: 100px 0px!important;
}

.pdt0{
    padding-top: 0!important;
}
.pdt5{
    padding-top: 5px!important;
}
.pdt15{
    padding-top: 15px!important;
}
.pdt20{
    padding-top: 20px!important;
}
.pdt30{
    padding-top: 30px!important;
}
.pdt50{
    padding-top: 50px!important;
}
.pdt60{
    padding-top: 60px!important;
}
.pdt70{
    padding-top: 70px!important;
}
.pdt100{
    padding-top: 100px!important;
}
.pdt120{
    padding-top: 120px!important;   
}
.pdt150{
    padding-top: 150px!important;   
}
.pdt180{
    padding-top: 180px!important;   
}
.pdb0{
    padding-bottom: 0!important;
}
.pdb5{
    padding-bottom: 5px!important;;
}
.pdb15{
    padding-bottom: 15px!important;;
}
.pdb30{
    padding-bottom: 30px!important;;
}
.pdr0{
	padding-right: 0!important;
}
.pdr10{
	padding-right: 10px!important;
}
.pdr15{
	padding-right: 15px!important;
}
.pdr30{
    padding-right: 30px!important;
}
.pdr50{
    padding-right: 50px!important;
}
.pdl0{
	padding-left: 0!important;
}
.pdl10{
	padding-left: 10px!important;
}
.pdl15{
	padding-left: 15px!important;
}
.pdl30{
    padding-left: 30px!important;
}
.pdl50{
    padding-left: 50px!important;
}
.pdl100{
    padding-left: 100px!important;
}
.w30{
    width: 30%!important;
}
.w40{
    width: 40%!important;
}
.w45{
	width: 45%!important;
}
.w50{
	width: 50%!important;
}
.w55{
	width: 55%!important;
}
.w60{
	width: 60%!important;
}
.w75{
	width: 75%!important;
}
.w85{
	width: 85%!important;
}
.w100{
	width: 100%!important;
}
.w60px{
	width: 60px!important;
}
.w75px{
	width: 75px!important;
}
.w90px{
	width: 90px!important;
}
.w100px{
	width: 100px!important;
}
.w120px{
	width: 120px!important;
}
.w150px{
    width: 150px!important;
}
.w200px{
    width: 200px!important;
}
.w220px{
    width: 220px!important;
}

.w100-3{
    width: calc(100% / 3)!important;
}
.w100-3-10px{
    width: calc(100% / 3 - 10px)!important;
}
.w100-4{
    width: calc(100% / 4)!important;
}
.w100-4-10px{
    width: calc(100% / 4 - 10px)!important;
}
.w100-5{
    width: calc(100% / 5)!important;
}
.w100-5-10px{
    width: calc(100% / 5 - 10px)!important;
}
.w100-6{
    width: calc(100% / 6)!important;
}
.w100-6-10px{
    width: calc(100% / 6 - 10px)!important;
}
.w100-9{
    width: calc(100% / 9)!important;
}
.w100-9-10px{
    width: calc(100% / 9 - 10px)!important;
}
.h100{
    height: 100%!important;
}
.h100vh{
    height: 100vh!important;
}
.lh1em{
    line-height: 1em;
}
.borderRight{
    border-right: solid 1px #666;
}
.borderLeft{
    border-left: solid 1px #666;
}


.f14{
	font-size: 14px!important;
}
.f16{
	font-size: 16px!important;
}
.f18{
	font-size: 18px!important;
}
.f20{
	font-size: 20px!important;
}
.f22{
	font-size: 22px!important;
}
.f24{
    font-size: 24px!important;
}
.f28{
    font-size: 28px!important;
}
.f32{
    font-size: 32px!important;
}.f36{
    font-size: 36px!important;
}
.nowrap{
    white-space: nowrap;
}
.black{
	color: #000!important;
}
.white{
	color: #fff!important;
}
.grey{
	color: #666!important;
}
.bgBlack{
	background-color: #000!important;
}
.bgWhite{
	background-color: #fff!important;
}
.bgGrey{
	background-color: #666!important;
}
.overflow-hidden{
    overflow: hidden!important;
}
.overflow-scroll{
    overflow: scroll!important;
}
.overflow-initial{
    overflow: initial!important;
}
.fdcmb{
    flex-direction: row;
}
.csp{
    cursor: pointer;
}
ul.listStyleNone{
    list-style: none;
    padding-left:  0;
    margin-bottom: 0;
}
ul.listStyleDisc{
    list-style-type: disc;
}

.tac{
    text-align: center;
}
.tal{
    text-align: left!important;
}
.taj{
    text-align: justify;
}
input{
    outline: 0;
}
.z-5{
    z-index: 5;
}
.ls3{
    letter-spacing: 3px;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
.h50px{
    height: 50px;
}
@media (max-width: 1200px){
    .pc, .pc-flex{
        display: none;
    }

    .mb{
        display: block;
    }
    .m-fdc{
        flex-direction: column;
    }
    .m-aifs{
        align-items: flex-start!important;
    }
    .m-mg0{
        margin: 0!important;
    }
    .m-w100{
        width: 100%!important;
    }
    .m-fdcr{
        flex-direction: column-reverse!important;
    }
    .m-mgt0{
        margin-top: 0px!important;
    }
    .m-mgt15{
        margin-top: 15px!important;
    }
    .m-f14{
        font-size: 14px!important;
    }
    .m-f16{
        font-size: 16px!important;
    }
    .m-f20{
        font-size: 20px!important;
    }
    .m-f22{
        font-size: 22px!important;
    }
    .m-jcc{
        justify-content: center!important;
    }
    .m-aic{
        align-items: center!important;
    }
    .m-pd15{
        padding: 15px!important;
    }
    .m-pd30{
        padding: 30px!important;
    }
    .m-mgb0{
        margin-bottom: 0px!important;
    }
}
