a          { text-decoration: none;}
a:link     { text-decoration: none; color: #575757;}
a:visited  { text-decoration: none; color: #575757; outline:none;}
a:active   { text-decoration: none; color: #575757;}
a:hover    { text-decoration: none; color: #084F58;}


a.fff:link      {color: #fff; text-decoration: none;}
a.fff:visited   {color: #fff; text-decoration: none; outline:none;/* ● 去除Firefox會在鏈接周圍產生一個虛線外框 */}
a.fff:active    {color: #fff; text-decoration: none;}
a.fff:hover     {color: #331078; text-decoration: none;}



/*========================================================
          固定會用到的，ex 字體大小、顏色、按鈕、各間距
=========================================================*/
.cur_daf { cursor: default;}
.Cur_p { cursor: pointer;}



.txt16_a { font-size: 16px !important;}
.txt18_a { font-size: 18px !important;}
.txt19_a { font-size: 19px !important;}
.txt20_a { font-size: 20px !important;}
.txt22_a { font-size: 22px !important;}
.txt24_a { font-size: 24px !important;}
.txt26_a { font-size: 26px !important;}



.textC_55_a { color: #555555;}
.textC_C3_a { color: #2F5597;}


.lineH140p_a { line-height: 140%;}
.lineH160p_a { line-height: 160%;}


/*手機*/
@media (max-width: 767px) {
	.mab5_M { margin-bottom: 5px;}
}



.h-66px_a { height: 66px !important;}
.h-150px_a { height: 150px !important;}
.redA_a { color: #e00045;;}

.w22p_a { width: 22%;}
.w33p_a { width: 33%;}
.w100p_a { width: 100%;}

/*桌機*/
@media (min-width: 768px) {
    .w50p_D { width: 50% !important;}
}


/*========================================================
             padding  margin  width
=========================================================*/
/*桌機*/
@media (min-width: 768px) {
    .w44p_d { width: 44%;}
    .w20p_d { width: 20%;}
    .w21p_d { width: 21%;}

    /*reg_03_list*/
    .w10p_D { width: 10%;}
    .w12p_D { width: 12%;}
    .w15p_D { width: 15%;}
    .w24p_D { width: 24%;}
    .w27p_D { width: 27%;}
}

/*桌機992*/
@media (min-width: 992px) {
    .w85p_lg { width: 85%;}
    .w75p_lg { width: 75%;}
    .w15p_lg { width: 15%;}
    .w10p_lg { width: 10%;}
}







/*========================================================
                       Hr  border
=========================================================*/
hr.style01 {
	height: 6px;
	background: url(../images/hr_01.png) repeat-x 0 0;
    border: 0;
}

hr.style02 { 
	border: 0; 
	height: 1px; 
	background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}

hr.style03 {
    height: 3px;
    border: none;
    border-top: 3px double #789B9A;
    margin-bottom: 50px;
}

.border-top_2_dark_a { border-top: 2px solid #0C5E6A!important;}







/*========================================================
                         btn
=========================================================*/
.btnA {
    text-decoration: none;
    color: #fff;
    padding: 3px 30px 0px 30px;
    display: inline-block;
    position: relative;
    border: 1px solid rgba(0,0,0,0.21);
    border-bottom: 4px solid rgba(0,0,0,0.21);
    border-radius: 4px;
    text-shadow: 0 1px 0 rgb(0 0 0 / 15%);
}



/* Gradient - ugly css is ugly */
.btnA.cyan {
	background: rgba(27,188,194,1);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(27,188,194,1)), to(rgba(24,163,168,1)));
	background: -webkit-linear-gradient(rgba(27,188,194,1) 0%, rgba(24,163,168,1) 100%);
	background: -moz-linear-gradient(rgba(27,188,194,1) 0%, rgba(24,163,168,1) 100%);
	background: -o-linear-gradient(rgba(27,188,194,1) 0%, rgba(24,163,168,1) 100%);
	background: linear-gradient(rgba(27,188,194,1) 0%, rgba(24,163,168,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1bbcc2', endColorstr='#18a3a8', GradientType=0);
}

.btnA.red{ 
	background: rgba(250,90,90,1);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(250,90,90,1)), to(rgba(232,81,81,1)));
	background: -webkit-linear-gradient(rgba(250,90,90,1) 0%, rgba(232,81,81,1) 100%);
	background: -moz-linear-gradient(rgba(250,90,90,1) 0%, rgba(232,81,81,1) 100%);
	background: -o-linear-gradient(rgba(250,90,90,1) 0%, rgba(232,81,81,1) 100%);
	background: linear-gradient(rgba(250,90,90,1) 0%, rgba(232,81,81,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa5a5a', endColorstr='#e85151', GradientType=0 );
}
.btnA.orange {
	background: rgba(255,105,30,1);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255,105,30,1)), to(rgba(230,95,28,1)));
	background: -webkit-linear-gradient(rgba(255,105,30,1) 0%, rgba(230,95,28,1) 100%);
	background: -moz-linear-gradient(rgba(255,105,30,1) 0%, rgba(230,95,28,1) 100%);
	background: -o-linear-gradient(rgba(255,105,30,1) 0%, rgba(230,95,28,1) 100%);
	background: linear-gradient(rgba(255,105,30,1) 0%, rgba(230,95,28,1) 100%);
}
.btnA.blue {
	background: rgba(102,152,203,1);
	background: -moz-linear-gradient(top, rgba(102,152,203,1) 0%, rgba(92,138,184,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(102,152,203,1)), color-stop(100%, rgba(92,138,184,1)));
	background: -webkit-linear-gradient(top, rgba(102,152,203,1) 0%, rgba(92,138,184,1) 100%);
	background: -o-linear-gradient(top, rgba(102,152,203,1) 0%, rgba(92,138,184,1) 100%);
	background: -ms-linear-gradient(top, rgba(102,152,203,1) 0%, rgba(92,138,184,1) 100%);
	background: linear-gradient(to bottom, rgba(102,152,203,1) 0%, rgba(92,138,184,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6698cb', endColorstr='#5c8ab8', GradientType=0 );
}
.btnA.purple { 
	background: rgba(203,153,197,1);
	background: -moz-linear-gradient(top, rgba(203,153,197,1) 0%, rgba(181,134,176,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(203,153,197,1)), color-stop(100%, rgba(181,134,176,1)));
	background: -webkit-linear-gradient(top, rgba(203,153,197,1) 0%, rgba(181,134,176,1) 100%);
	background: -o-linear-gradient(top, rgba(203,153,197,1) 0%, rgba(181,134,176,1) 100%);
	background: -ms-linear-gradient(top, rgba(203,153,197,1) 0%, rgba(181,134,176,1) 100%);
	background: linear-gradient(to bottom, rgba(203,153,197,1) 0%, rgba(181,134,176,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb99c5', endColorstr='#b586b0', GradientType=0 );
}
.btnA.yellow {
	background: rgba(240,210,100,1);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(240,210,100,1)), to(rgba(229,201,96,1)));
	background: -webkit-linear-gradient(rgba(240,210,100,1) 0%, rgba(229,201,96,1) 100%);
	background: -moz-linear-gradient(rgba(240,210,100,1) 0%, rgba(229,201,96,1) 100%);
	background: -o-linear-gradient(rgba(240,210,100,1) 0%, rgba(229,201,96,1) 100%);
	background: linear-gradient(rgba(240,210,100,1) 0%, rgba(229,201,96,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0d264', endColorstr='#e5c960', GradientType=0 );
}
.btnA.green {
	background: rgba(130,200,160,1);
	background: -moz-linear-gradient(top, rgba(130,200,160,1) 0%, rgba(130,199,158,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(130,200,160,1)), color-stop(100%, rgba(130,199,158,1)));
	background: -webkit-linear-gradient(top, rgba(130,200,160,1) 0%, rgba(130,199,158,1) 100%);
	background: -o-linear-gradient(top, rgba(130,200,160,1) 0%, rgba(130,199,158,1) 100%);
	background: -ms-linear-gradient(top, rgba(130,200,160,1) 0%, rgba(130,199,158,1) 100%);
	background: linear-gradient(to bottom, rgba(130,200,160,1) 0%, rgba(124, 185, 149, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82c8a0', endColorstr='#82c79e', GradientType=0 );
}

.btnA.gray{ 
	background: rgba(168,168,168,1);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(168,168,168,1)), to(rgba(157,157,157,1)));
	background: -webkit-linear-gradient(rgba(168,168,168,1) 0%, rgba(157,157,157,1) 100%);
	background: -moz-linear-gradient(rgba(168,168,168,1) 0%, rgba(157,157,157,1) 100%);
	background: -o-linear-gradient(rgba(168,168,168,1) 0%, rgba(157,157,157,1) 100%);
	background: linear-gradient(rgba(168,168,168,1) 0%, rgba(157,157,157,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8a8a8', endColorstr='#9d9d9d', GradientType=0 );
}

.btnA.red:active    { background: #E35252;}
.btnA.orange:active { background: #E8601B;}
.btnA.cyan:active 	{ background: #169499;}
.btnA.blue:active 	{ background: #608FBF;}
.btnA.purple:active { background: #BD8EB7;}
.btnA.yellow:active { background: #DBC05B;}
.btnA.green:active  { background: #72B08E;}
.btnA.gray:active  { background: #a8a8a8;}











.btn_Out {
	text-align: center;
	border-radius: 6px;
	display: inline-block;
	cursor: pointer;
	font-weight: bold;
	text-decoration: none;
	padding: 5px;
}
.btn_Out:hover {
	color: #ffffff;
}
.btn_Out:active {
	position: relative;
	top: 1px;
}


.btn_Out_R {
	box-shadow: inset 0px 1px 0px 0px #fbafe3;
	background: linear-gradient(to bottom, #e076ac 5%, #c52f7d 100%);
	background-color: #c52f7d;
	color: #ffffff;
	text-shadow: 0px 1px 0px #c52f7d;
	border: 1px solid #c52f7d;
}
.btn_Out_R:hover {
	background: linear-gradient(to bottom, #c52f7d 5%, #e076ac 100%);
	background-color: #e076ac;
}
.btn_Out_R:active { color: #fff;}


.btn_Out_Y {
	box-shadow: inset 0px 1px 0px 0px #fbd757;
	background: linear-gradient(to bottom, #dfc074 5%, #c59731 100%);
	background-color: #c59731;
	color: #ffffff;
	text-shadow: 0px 1px 0px #c59731;
	border: 1px solid #c59731;
}
.btn_Out_Y:hover {
	background: linear-gradient(to bottom, #c59731 5%, #dfc074 100%);
	background-color: #dfc074;
}
.btn_Out_Y:active { color: #fff;}
.btn_Out_Y:focus { color: #fff;}


.btn_Out_Ya {
	box-shadow: inset 0px 1px 0px 0px #ffb478;
	background: linear-gradient(to bottom, #ef9661 5%, #de621d 100%);
	background-color: #de621d;
	color: #ffffff;
	text-shadow: 0px 1px 0px #de621d;
	border: 1px solid #de621d;
}
.btn_Out_Ya:hover {
	background: linear-gradient(to bottom, #de621d 5%, #ef9661 100%);
	background-color: #ef9661;
}
.btn_Out_Ya:active { color: #fff;}
.btn_Out_Ya:focus { color: #fff;}


.btn_Out_Yb {
	box-shadow: inset 0px 1px 0px 0px #79d8fe;
	background: linear-gradient(to bottom, #74c8df 5%, #31a8c5 100%);
	background-color: #62c0d8;
	color: #ffffff;
	text-shadow: 0px 1px 0px #31a8c5;
	border: 1px solid #31a8c5;
}
.btn_Out_Yb:hover {
	background: linear-gradient(to bottom, #31a8c5 5%, #74c8df 100%);
	background-color: #62c0d8;
}
.btn_Out_Yb:active { color: #fff;}
.btn_Out_Yb:focus { color: #fff;}







.bbtn {
	text-align: center;
	text-decoration: none;
	display: inline-block;
	border-radius: 0.7em;
    transition: all 0.2s ease-in-out;
	position: relative;
	overflow: hidden;
}
.bbtn:before {
	width: 3em;
	content: "";
	background-color: rgba(255, 255, 255, 0.5);
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	transform: skewX(-45deg) translateX(0);
	transition: none;
	left: -1.5em;
}
.bbtn:hover:before {
	transition: all 0.5s ease-in-out;
}
@media (min-width: 768px) {
    .bbtn { font-size: 20px; padding: 4px 1em;}
}
@media (max-width: 767px) {
    .bbtn { font-size: 16px; padding: 4px 0.5em;}
}


.btn-login {
	padding: 4px 2em;
    color: #fff;
    border: 1px solid #2194e0;
    background-color: #2194e0;
    font-size: 20px;
}
.btn-login:hover {
    background-color: #2194e0;
    color: #fff;
    border-bottom: 4px solid #1977b5;
}
.btn-login:hover:before {
    transform: skewX(-45deg) translateX(13.5em);
}
.btn-login:before {
	left: -1.5em;
}


.btn-acc {
	padding: 4px 2em;
    color: #fff;
    border: 1px solid #2194e0;
    background-color: #2194e0;
    font-size: 20px;
}
.btn-acc:hover {
    background-color: #2194e0;
    color: #fff;
    border-bottom: 4px solid #1977b5;
}
.btn-acc:hover:before {
    transform: skewX(-45deg) translateX(20.5em);
}
.btn-acc:before {
	left: -3.5em;
}







.btn-save {
    background: rgb(244,88,88); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(244,88,88,1) 0%, rgba(191,26,26,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(244,88,88,1) 0%,rgba(191,26,26,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(244,88,88,1) 0%,rgba(191,26,26,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f45858', endColorstr='#bf1a1a',GradientType=0 ); /* IE6-9 */
}
.btn-save:hover {
    background: rgb(191,26,26); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(191,26,26,1) 0%, rgba(244,88,88,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(191,26,26,1) 0%,rgba(244,88,88,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(191,26,26,1) 0%,rgba(244,88,88,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf1a1a', endColorstr='#f45858',GradientType=0 ); /* IE6-9 */
}


.btn-submit {
    background: rgb(80,224,162); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(80,224,162,1) 0%, rgba(23,170,97,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(80,224,162,1) 0%,rgba(23,170,97,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(80,224,162,1) 0%,rgba(23,170,97,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50e0a2', endColorstr='#17aa61',GradientType=0 ); /* IE6-9 */
}
.btn-submit:hover {
    background: rgb(23,170,97); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(23,170,97,1) 0%, rgba(80,224,162,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(23,170,97,1) 0%,rgba(80,224,162,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(23,170,97,1) 0%,rgba(80,224,162,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17aa61', endColorstr='#50e0a2',GradientType=0 ); /* IE6-9 */
}


.btn-next {
    background: rgb(84,163,238); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(84,163,238,1) 0%, rgba(30,105,222,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(84,163,238,1) 0%,rgba(30,105,222,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(84,163,238,1) 0%,rgba(30,105,222,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#54a3ee', endColorstr='#1e69de',GradientType=0 ); /* IE6-9 */
}
.btn-next:hover {
    background: rgb(30,105,222); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(30,105,222,1) 0%, rgba(84,163,238,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(30,105,222,1) 0%,rgba(84,163,238,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(30,105,222,1) 0%,rgba(84,163,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e69de', endColorstr='#54a3ee',GradientType=0 ); /* IE6-9 */
}


.btn-back {
    background: rgb(229,186,84); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(229,186,84,1) 0%, rgba(229,186,84,1) 0%, rgba(226,116,31,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(229,186,84,1) 0%,rgba(229,186,84,1) 0%,rgba(226,116,31,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(229,186,84,1) 0%,rgba(229,186,84,1) 0%,rgba(226,116,31,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5ba54', endColorstr='#e2741f',GradientType=0 ); /* IE6-9 */
}
.btn-back:hover {
    background: rgb(226,116,31); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(226,116,31,1) 0%, rgba(229,186,84,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(226,116,31,1) 0%,rgba(229,186,84,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(226,116,31,1) 0%,rgba(229,186,84,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2741f', endColorstr='#e5ba54',GradientType=0 ); /* IE6-9 */
}


.btn-rev {
    background: rgb(206,220,231); /* Old browsers */
    background: -moz-linear-gradient(top,  rgb(206,220,231) 0%, rgb(89,106,114) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgb(206,220,231) 0%,rgb(89,106,114) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgb(206,220,231) 0%,rgb(89,106,114) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cedce7', endColorstr='#596a72',GradientType=0 ); /* IE6-9 */
}
.btn-rev:hover {
    background: rgb(89,106,114); /* Old browsers */
    background: -moz-linear-gradient(top,  rgb(89,106,114) 0%, rgb(206,220,231) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgb(89,106,114) 0%,rgb(206,220,231) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgb(89,106,114) 0%,rgb(206,220,231) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cedce7', endColorstr='#596a72',GradientType=0 ); /* IE6-9 */
}


.btn-ye {
background: rgb(247,229,178); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(247,229,178) 0%, rgb(199,152,16) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgb(247,229,178) 0%,rgb(199,152,16) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgb(247,229,178) 0%,rgb(199,152,16) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F7E5B2', endColorstr='#c79810',GradientType=0 ); /* IE6-9 */
}
.btn-ye:hover {
background: rgb(199,152,16); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(199,152,16) 0%, rgb(247,229,178) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgb(199,152,16) 0%,rgb(247,229,178) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgb(199,152,16) 0%,rgb(247,229,178) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c79810', endColorstr='#F7E5B2',GradientType=0 ); /* IE6-9 */
}










.btn-reg {
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 0.7em;
    transition: all 0.2s ease-in-out;
    position: relative;
    overflow: hidden;
    margin-bottom: 10px;
}
.btn-reg:before {
  content: "";
  background-color: rgba(255, 255, 255, 0.5);
  height: 100%;
  width: 3em;
  display: block;
  position: absolute;
  top: 0;
  left: -4.5em;
  transform: skewX(-45deg) translateX(0);
  transition: none;
}
.btn-reg:hover:before {
  transform: skewX(-45deg) translateX(30em);/*13.5*/
  transition: all 0.5s ease-in-out;
}
@media (min-width: 768px) {
    .btn-reg { font-size: 17px; padding: 4px 0.6em;}
}
@media (max-width: 767px) {
    .btn-reg { font-size: 16px; padding: 4px 0.5em;}
}


.btn-reg-A {
    color: #fff;
    border: 1px solid #e35283;
    background-color: #e35283;
}
.btn-reg-A:hover {
  color: #fff;
  border-bottom: 4px solid #d34072;
}

.btn-reg-B {
    color: #fff;
    border: 1px solid #5272e3;
    background-color: #5272e3;
}
.btn-reg-B:hover {
  color: #fff;
  border-bottom: 4px solid #4061d3;
}

.btn-reg-C {
    color: #fff;
    border: 1px solid #5dd7a3;
    background-color: #5dd7a3;
}
.btn-reg-C:hover {
  color: #fff;
  border-bottom: 4px solid #3eb582;
}

.btn-reg-D {
    color: #fff;
    border: 1px solid #dfcb55;
    background-color: #dfcb55;
}
.btn-reg-D:hover {
  color: #fff;
  border-bottom: 4px solid #b9a634;
}

.btn-reg-E {
    color: #fff;
    border: 1px solid #f9a663;
    background-color: #f9a663;
}
.btn-reg-E:hover {
  color: #fff;
  border-bottom: 4px solid #e48a3f;
}

.btn-reg-F {
    color: #fff;
    border: 1px solid #ed8382;
    background-color: #ed8382;
}
.btn-reg-F:hover {
  color: #fff;
  border-bottom: 4px solid #d75f5e;
}

.btn-reg-G {
    color: #fff;
    border: 1px solid #47badb;
    background-color: #47badb;
}
.btn-reg-G:hover {
  color: #fff;
  border-bottom: 4px solid #269ec0;
}

.btn-reg-H {
    color: #fff;
    border: 1px solid #e352bc;
    background-color: #e352bc;
}
.btn-reg-H:hover {
  color: #fff;
  border-bottom: 4px solid #c4299a;
}











/*========================================================
                     notice
=========================================================*/
.notice {
    padding: 10px;
    background-color: #fafafa;
    border-left: 6px solid #7f7f84;
    margin-bottom: 10px;
    -webkit-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
       -moz-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
            box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
}
.notice-sm {
    padding: 10px;
    font-size: 80%;
}
.notice-lg {
    padding: 35px;
    font-size: large;
}
.notice-success {
    border-color: #80D651;
}
.notice-success>strong {
    color: #80D651;
}
.notice-info {
    border-color: #45ABCD;
}
.notice-info>strong {
    color: #45ABCD;
}
.notice-warning {
    border-color: #FEAF20;
}
.notice-warning>strong {
    color: #FEAF20;
}
.notice-danger {
    border-color: #d73814;
}
.notice-danger>strong {
    color: #d73814;
}








.message {
	background-color: #FAFAFA;
	width: calc(100% - 3em);
	padding: 12px 10px 5px 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-right-width: 6px;
	border-right-style: solid;
	border-radius: 3px;
	position: relative;
	width: 100%;
    text-align: center;
	box-shadow: 0 5px 8px -6px rgba(0,0,0,.7);
}
.message:before {
	color: white;
	width: 1.5em;
	height: 1.5em;
	position: absolute;
	top: 0.7em;
	left: -3px;
	border-radius: 50%;
	-webkit-transform: translateX(-50%);
	        transform: translateX(-50%);
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
}

.message_RA {
	border-left-color: firebrick;
	border-right-color: firebrick;
	color: #B22222;
}
.message_RA:before {
	background-color: firebrick;
}

.message_R {
	border-left-color: firebrick;
	border-right-color: firebrick;
	color: #B22222;
}
.message_R:before {
	background-color: firebrick;
/*	content: "‼";*/
}

.message_B {
	border-left-color: #156082;
	border-right-color: #156082;
	color: #156082;
}
.message_B:before {
	background-color: #156082;
/*	content: "‼";*/
}

.message_rB {
    background: #156082;
	border-left-color: #FFC107;
	border-right-color: #FFC107;
	color: #fff;
}
.message_rB:before {
	background-color: #FFC107;
/*	content: "‼";*/
	color: #fff;
}
.message_rG {
    background: #13501B;
	border-left-color: #FFC107;
	border-right-color: #FFC107;
	color: #fff;
}
.message_rG:before {
	background-color: #FFC107;
/*	content: "‼";*/
	color: #fff;
}
.message_rR {
    background: #C04F15;
	border-left-color: #FFC107;
	border-right-color: #FFC107;
	color: #fff;
}
.message_rR:before {
	background-color: #FFC107;
/*	content: "‼";*/
	color: #fff;
}





/*========================================================
                CSS scott style pagination
=========================================================*/
div.scott {
	padding: 3px; margin: 10px 0 0 0; text-align: center; width: 100%;
}
div.scott a {
    border: #ddd 1px solid; padding: 2px 8px; text-decoration: none; margin-bottom: 5px; display: inline-block; color: #515151;
}
div.scott a:hover {
	border: #909090 1px solid; color: #638425; background: #ECECEC;
}
div.scott a:active {
	border: #909090 1px solid; color: #638425; background: #ECECEC;
}
div.scott span.current {
	border: #9E9E9E 1px solid; padding: 2px 8px; font-weight: bold; color: #fff; margin-right: 2px; background: #9E9E9E; display: inline-block;
}
div.scott span.disabled {
	border: #f3f3f3 1px solid; padding: 2px 8px; color: #ccc; margin-right: 2px; display: inline-block;
}






/*========================================================
                新型新增頁add-表格 table-row
=========================================================*/
div.table-row.TD2 .th { background: #F2F2F2; border-bottom: 1px #D2D2D2 solid; padding: 8px; font-weight: bold;}
div.table-row.TD2 .td { background: #FCFCFC; border-bottom: 1px #D2D2D2 solid; padding: 8px;}
div.table-row.TD4 .th { background: #F2F2F2; border-bottom: 1px #D2D2D2 solid; padding: 8px; font-weight: bold;}
div.table-row.TD4 .td { background: #FCFCFC; border-bottom: 1px #D2D2D2 solid; padding: 8px;}

@media (min-width: 576px) {
	div.table-row .th {
		display: flex;
		justify-content: right;
		align-items: center;
        text-align: right;
	}
	div.table-row .td {
        display: grid;
        align-items: center; 
	}
}
@media (min-width: 992px) {
	div.table-row {
		display: flex;
		justify-content: center;
		align-items: stretch;
	}
	div.table-row.TD2 .th { width: 25%;}
	div.table-row.TD2 .td { width: 75%;}
	div.table-row.TD4 .th { width: 25%;}
	div.table-row.TD4 .td { width: 25%;}
}
@media only screen and (min-width: 576px) and (max-width: 991px) {
	div.table-row {
		display: flex;
		flex-wrap: wrap;
	}
	div.table-row.TD2 .th { width: 30%; text-align: center;}
	div.table-row.TD2 .td { width: 70%;}
	div.table-row.TD4 .th { width: 30%; text-align: center;}
	div.table-row.TD4 .td { width: 70%;}
}
@media (max-width: 575px) {
	div.table-row.TD2 .th, div.table-row.TD4 .th { text-align: center;}
}


@media (min-width: 576px) {
    div.table-row .th div {
        width: 100%;
    }
}








/*========================================================
                        blink
=========================================================*/
.index_blink {
    animation-name: blink;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}
@keyframes blink {
    0% {
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    81% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
.index_blinkA { animation-duration: 0.4s;}
.index_blinkB { animation-duration: 0.5s;}
.index_blinkC { animation-duration: 0.6s;}















/*========================================================
                  background
=========================================================*/
.bgCED_a { background: #EDEDED;}









/*========================================================
                     img
=========================================================*/
.img_box {
  display: block;
  margin: 0;
  padding: 5%;
  background: white;
  border-radius: 3px;
  border:1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.05);
  transition: all 100;
  position: relative;
}
.img_box:hover{ transform: scale(1.03);}



img.zoom {
/*
    width: 250px;
    height: 200px;
*/
    
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
}
.transition {
    -webkit-transform: scale(1.05); 
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}
.modal-header {
/*	border-bottom: none;*/
}
.modal-title {
	color: #000;
}
.modal-footer{
	display: none;  
}




.thumbnail a>img, .thumbnail>img {
    display: block;
    max-width: 100%;
    height: auto;
}