html {
height: 100%;
}
body{
font-family:"Microsoft JhengHei","Microsoft JhengHei","PingFang TC","Heiti TC","Noto Sans TC","Segoe UI",sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
height:100%;
margin:0;
background:#E3E0D9;
-webkit-backface-visibility: hidden;
}
h2 {
display   : block;
font-size : 18px;
font-weight: bold;
margin:12px 0px 4px 14px; /* ¤W ¥k ¤U ¥ª */ 
line-height: 26px;
}
h6 {
display   : block;
font-size : 15px;
margin:10px 0px 0px 14px;
line-height: 24px;
}
a.lk0 {
color: #234B69;
font-size: 14px;
}
a.lk0:hover{
color: #34B6E7;
}

a.decbtn{
text-decoration: none;	
Color:#808080;
font-size:18px;	
padding: 2px 10px 2px 10px;
}
a.incbtn{
text-decoration: none;	
Color:#FF7300;
font-size:18px;	
padding: 0px 8px 0px 8px;	
}
a.incbtn span{
padding:2px;
border-radius:99px;
}

a.lkredbtn,a.lkbluebtn {
text-decoration: none;
background-color:#CC0000;
color: #FFFFFF;
padding: 3px 12px 2px 12px;
border-radius: 12px;
font-size: 14px;
}
a.lkredbtn:hover{
background-color:#FF3549;
}

a.lkbluebtn {
background-color:#0085CC;
}

a.lkbluebtn:hover {
background-color:#15B3FF;
}
.nobnum{
width:50px;
border:0;	
font-size:20px;
text-align:center;
color:#BFBFBF;
font-family:"Microsoft JhengHei", "Arial", sans-serif;
}

#main
{
color:#333333; 	
border-top:5px #968365 solid;
width: 1024px;
height:100%;
margin: 0px auto;
background:white;
-webkit-box-shadow: 0px 0px 60px -15px rgba(112,112,112,1);
-moz-box-shadow: 0px 0px 60px -15px rgba(112,112,112,1);
box-shadow: 0px 0px 60px -15px rgba(112,112,112,1);
}

#dvbody
{
font-family:"Helvetica","LiHei Pro","Heiti TC","Microsoft JhengHei", "Arial", sans-serif;
font-size: 15px;
width:100%;
}
#dvnews
{
width:100%;
height: 460px;
padding: 10px 20px 20px 20px;
background:White; 
background-image:url("https://www.hsuanpo.url.tw/css/images/coffee.gif");
background-repeat:no-repeat;
background-position:top left;
}
#dvnewsbox
{
width:100%;
height:100%;
background-image:url("https://www.hsuanpo.url.tw/css/images/pen.gif");
background-repeat:no-repeat;
background-position: bottom right;
}

#dvbullet{
border: 6px #E6E6E6 dashed;
width:600px;
height:260px;
margin-left:100px;
padding: 20px;
Overflow: auto;
opacity: 0.8;
background:#FBF9F6;
-webkit-box-shadow: 15px 6px 38px -1px rgba(0,0,0,0.07);
-moz-box-shadow: 15px 6px 38px -1px rgba(0,0,0,0.07);
box-shadow: 15px 6px 38px -1px rgba(0,0,0,0.07);
}

#dvclient
{
margin:20px 0 10PX 20px; 
padding: 10px 10px 20px 10px;
background:White; 	
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.22);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.22);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.22);
}
.Nform{padding-top:10px}
.rtriangle {
width:14px;
Height:14px;
display: inline-block;
margin-right: 0.5em;
}
.rtriangle::before {
width:14px;
Height:14px;
position: relative;
content: "";
display: inline-block;
border-right: 0.2em solid #D1BB94;
border-top: 0.2em solid #D1BB94;
transform: rotate(45deg);
}

.dvtitle
{
font-family:inherit;
font-size: 18px;
font-weight:bold;
margin-left:12px;
height:42px;
line-Height:42px;
display:inline-block;
}

.dverror
{
font-family:inherit;
font-size: 14px;
color:#D01717;
}

.dvmemInfo
{
font-family:inherit;
font-size: 14px;
display: block;
width: Auto;
float: right;
text-align:right;
font-size:18px;
height:42px;
padding-right:10px;
line-Height:46px;
color:#808080;
}

.dvWarninInfo{
width :100%;
height:auto;
padding: 10px 10px 10px 40px;
background:#FEF8E9; 
background-image:url("https://www.hsuanpo.url.tw/css/images/evwarn.gif");	
background-repeat:no-repeat;
background-position:10px 10px;
margin-bottom:10px;
}
#ltpts
{
height:30px;
display: inline-block;
}
.ptsvalue
{
white-space: nowrap;
background:#FCD752;
border-radius: 12px;
padding: 3px 10px 3px 10px;
font-size:14px;
color: black;
}
.holder {
width: 0;
height: 0;
position: absolute;
top: 0;
right: 0;
}
.holder::after,
.holder::before {
display: block;
position: absolute;
content: '';
width: 6px;
height: 6px;
right: 20px;
z-index: 10;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.holder::after {
top: 17px;
border-top: 2px solid #62513F;
border-left: 2px solid #62513F;
}
.holder::before {
top: 18px;
}
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cssmenu {
width: 200px;
height: auto;
background-color:#FAEDE1;
font-family:inherit;
color: #ffffff;
float: left;
}
#cssmenu ul ul {
display: none;
}
#cssmenu > ul > li > a {
background: #D1BB94;  
color: #5A4736;
padding: 14px 20px 14px 45px;
cursor: pointer;
opacity: 0.90;
z-index: 2;
font-size: 17px;
font-weight:bold;
text-decoration: none;}
#cssmenu > ul > li > a span {
text-shadow:0px 0px 3px rgba(0,0,0,.25);
}
#cssmenu > ul,
#cssmenu > ul > li.active > a,
#cssmenu > ul > li.active > a:hover,
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.open > a
{
background:#EFD9B2;
}
#cssmenu ul ul {
background:#C2AC85;
}
#cssmenu ul ul li a {
cursor: pointer;
padding: 14px 20px 14px 47px;
z-index: 1;
text-decoration: none;
font-size: 16px;
font-weight:bold;
color: #5A4736;
}
#cssmenu ul ul li a span
{
text-shadow:0px 0px 3px rgba(0,0,0,.25);
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li.open > a,
#cssmenu ul ul li.active > a {
background: #B39D76;
color: #5A4736;
}
#cssmenu ul ul li:first-child > a {
box-shadow: none;
}
#cssmenu ul ul ul li:first-child > a {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
#cssmenu ul ul ul{
background:#A69577;
}
#cssmenu ul ul ul li a {
padding-left:55px;
}
#cssmenu ul ul li.has-sub > a{
background-image:url('/css/images/small_down.gif');
background-repeat: no-repeat;
background-position:right 19px center;
}
#cssmenu .separator {
height: 2px;             
margin: 4px 16px; 
pointer-events: none;
background-color: #948574;  
}
#cssmenu .separator:hover {
 background-color: #948574;
}
.inputstyle,
.Nform input,
.Nform Select {
font-size:16px;
font-family:inherit;	
background-color: #F7F2E8;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
border: 1px solid #968365;
box-shadow: 1px 1px 4px #EBEBEB;
-moz-box-shadow: 1px 1px 4px #EBEBEB;
-webkit-box-shadow: 1px 1px 4px #EBEBEB;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;}

.Nform
{
width:100%;
}

.Nform input,
.Nform Select {
width: 200px;
padding:4px;
height:32px;
}

.seltast{
font-size:16px;	
font-family:inherit;
background-color: white;
border: 0;
padding: 4px;
width:200px;
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
background: url('/css/images/sl_down.gif') no-repeat right 7px center white;
padding-right:26px;
}

.Nform Select {
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
background: url('/css/images/sl_down.gif') no-repeat right 7px center #F2EBE0;
padding-right:26px;
}

.Nform Select,.seltast::-ms-expand {
display: none;
}

.Nform label:not([class="evcheckbox"]):not([class="evradio"]) {
width: 160px;
padding:3px 15px 15px 3px;
text-align:right;
display:inline-block;
font-size:16px;
}
.Info {
font-size:11px;
color: gray;
line-height:30px;
padding-left:10px;
display:inline-block;
}

.dvline {
width:100%;
height:3px;
background:#CDB289;
margin:6px 0 10px 0;
display:block;
}

.dvback,.submitbtn {
margin:0 4px 0 4px;
font-family:inherit;
font-size:16px;
cursor: pointer;
width:100px;
padding: 6px 15px 6px 15px;
color: white;
text-shadow:0px 0px 6px #2D2D2D;
border: 0;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}

.dvback{
width:40px;
background:#896040}
.dvback:hover,.dvback:active,.dvback:focus {background:#DBA054}
.submitbtn {background:#BF2C24;}
.submitbtn:hover,.submitbtn:active,.submitbtn:focus {background:#ED4259;}
.submitbtn[disabled] {
background: #808080;
}
.submitbtn[disabled]:hover {
background: #808080;
}
.col1
{
font-size:16px;
width:136px;
text-align:right;
line-height:28px;
padding-right:15px;
}

.col2
{
font-size:16px;
width:250px;
padding:1px 28px 1px 8px;
line-height:27px;
background:#EFEFEF;
border:1px #DCDCDC solid;
}

.col3
{
font-size:16px;
width:450px;
padding:1px 28px 1px 8px;
line-height:27px;
background:#EFEFEF;
border:1px #DCDCDC solid;
}

.col4
{
padding:1px 28px 1px 36px;
background:#FAFAFA;
font-size:18px;
font-weight:bold;
line-height:30px;
border: 2px #D01717 solid;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}

.hello1
{
background: url("/css/images/woman.gif") no-repeat left center transparent;
color:#B93987;
padding:0px 0px 0px 20px;
}
.hello2
{
background: url("/css/images/man.gif") no-repeat left center transparent;
color:#826440;
padding:0px 0px 0px 20px;
}

.evcheckbox,.evradio {
display : inline-block;
position: relative;
padding-left: 25px;
cursor: pointer;
font-size: 16px;
width: auto;
Height:20px;
Line-Height:20px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.evcheckbox input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.evcheckbox .evbox {
position: absolute;
top:0;
left:0;
height:20px;
width:20px;
background-color: #F3EEDC;
border: 2px #BCB487 solid;
}
.evcheckbox:hover input ~ .evbox {
background-color: #FAF8F3;
}
.evcheckbox input:checked ~ .evbox {
border-color:#91724C;
}
.evcheckbox .evbox:after {
content: "";
position: absolute;
display: none;
}
.evcheckbox input:checked ~ .evbox:after {
display: block;
}
.evcheckbox .evbox:after {
left: 4px;
top: 1px;
width: 7px;
height: 12px;
border: solid #91724C;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.evcheckbox.small {
padding-left: 23px;
margin-right: 4px;
margin-bottom: 10px;
}
.evcheckbox.small .evbox {
width: 15px!important;    
height: 15px!important;
vertical-align: middle;
}
.evcheckbox.small .evbox:after {
left: 3px!important;
top: 0px!important;
width: 5.25px!important;
height: 9px!important;
}
.evradio input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.evcircle {
position: absolute;
top: 0px;
left: 0px;
height:20px;
width:20px;
background-color: #F3F2EB;
border-radius: 50%;
border: 2px #BCB487 solid;
}
.evradio:hover input ~ .evcircle {
background-color: #FAF8F3;
border: 2px #91724C solid;
}
.evradio input:checked ~ .evcircle {
background: #91724C;
box-shadow:inset 0 0 0 3px #F3F2EB;
border: 2px #91724C solid;
}
.evcircle:after {
content: "";
position: absolute;
display: none;
}
.evradio input:checked ~ .evcircle:after {
display: block;
}

#dvcalgrid{
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select:none;
user-select:none;
-o-user-select:none;
}

.tooltext {
  position: relative;
  display: inline-block;
  border-bottom: 1px #815C18 solid;
}

.tooltext .Hint {
  visibility: hidden;
  width: auto;
  background-color: #815C18;
  color: #fff;
  text-align: Left;
  padding: 5px;
  white-space: pre;
  position: absolute;
  z-index: 1;
  Top: 150%;
  left: 50%;
  margin-left: -60px;
}

.tooltext .Hint::after {
  content: "";
  position: absolute;
  Bottom: 100%;
  left: 20%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #A68D5F transparent;
}
.tooltext:hover .Hint {
  visibility: visible;
}
#dvnotenouth
{
float:left;
left:100%;
}
.tnumber
{
font-family: Arial,Verdana, Geneva, Tahoma, sans-serif;	
}
.tinfo
{
font-family:inherit;
line-height: 20px;
font-size:10px;	
}
.uiicon {
display: inline-flex;
width: 24px; 
height: 24px;
margin-right: 6px;
vertical-align: middle;
margin-top: -2px; /* ·L½Õ */
}
.mwarning {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffc107' d='M1 21h22L12 2 1 21z'/%3E%3Crect x='11' y='8' width='2' height='6' fill='%23000'/%3E%3Crect x='11' y='16' width='2' height='2' fill='%23000'/%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
.msuccess {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232faf45' stroke-width='4' stroke-linecap='square' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
.merror {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23f44336'/%3E%3Cline x1='17' y1='7' x2='7' y2='17' stroke='%23fff' stroke-width='2'/%3E%3Cline x1='7' y1='7' x2='17' y2='17' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
.minfo {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23007bff'/%3E%3Cline x1='12' y1='6' x2='12' y2='13' stroke='%23fff' stroke-width='3'/%3E%3Ccircle cx='12' cy='17' r='2' fill='%23fff'/%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}