@media print 
{
  :root 
  {
    font-size : 16px !important ; 
    zoom : 100% !important ; 
    line-height : 1 !important ; 
  }
  .main 
  {
    margin-top : 0 ; 
    margin-left : 3.5rem ; 
  }
}


html 
{
  font-size : 14px ; 
  position : relative ; 
  min-height : 100% ; 
  font-family : "Noto Sans" , "Sonti TC" , "Noto Serif TC" , "Noto Serif JP" , "Noto Serif SC" , sans-serif ; 
  word-break : break-all ; 
  line-height : 1.3 !important ; 
}
@media ( min-width : 768px ) 
{
  html 
  {
    font-size : 16px ; 
  }
}
::selection 
{
  color : var( --selection-color ) ; 
  background : var( --selection-bg ) ; 
}
select 
{
  font-family : "Noto Sans" , "Noto Sans TC" , "Noto Sans JP" , "Noto Sans SC" , sans-serif ; 
}
::placeholder 
{
  font-family : "Noto Sans" , "Noto Sans TC" , "Noto Sans JP" , "Noto Sans SC" , sans-serif ; 
}
* 
{
  margin : 0 ; 
  padding : 0 ; 
  box-sizing : border-box ; 
}
ul , ol 
{
  list-style-type : none ; 
}
a , a:visited 
{
  cursor: pointer;
  color : #057b7b ; 
  text-decoration : none ; 
}
a:hover , a:focus 
{
  cursor: pointer;
  color : #c03 ; 
  text-decoration : underline ; 
}
a:focus 
{
  outline : solid #fa8484 ; 
}
.Y 
{
  background-color : #fc0 !important; 
}
/* header */
header 
{
  background : var(--header-bg) ; 
  font-family : "Noto Serif" , "Songti TC" , "Noto Serif TC" , "Noto Serif JP" , "Noto Serif SC" , sans-serif ; 
}
header ::selection 
{
  color : #7fffd4 ; 
  background : #000 ; 
}
header .top-guide 
{
  background : var(--header-top-bg) ; 
  color : #fff ; 
}
header .top-guide ul 
{
  display : flex ; 
  justify-content : flex-end ; 
  align-items : center ; 
  margin : 0 1rem ; 
}
header .top-guide ul li:nth-child( 2 ) 
{
  box-sizing : content-box ; 
  width : 5em ; 
  display : flex ; 
  justify-content : space-evenly ; 
  align-items : center ; 
}
header .top-guide ul li span , header .top-guide ul li span:hover , header .top-guide ul li span:focus 
{
  text-align : center ; 
  line-height : 1.35rem ; 
  width : 1.35rem ; 
  height : 1.35rem ; 
  background : #fff ; 
  color : #000 ; 
  cursor : pointer ; 
  -webkit-user-select : none ; 
  -ms-user-select : none ; 
  user-select : none; 
}
header .top-guide ul li:not( header .top-guide ul li:has( .toggleD ) ) 
{
  padding : .15rem 1rem ; 
}
header .top-guide ul li:not( :last-child ) 
{
  border-right : 1px solid #fff ; 
}
header .top-guide ul li .toggleD 
{
  width : 4rem ; 
}
header .top-guide ul li .toggleD svg 
{
  width : calc(2rem - 2px) ; 
}
header .top 
{
  margin : .5rem 1rem ; 
  display : flex ; 
  align-items : center ; 
  justify-content : space-evenly ; 
}
header .top a img 
{
  height : 3rem ; 
  -webkit-user-select : none ; 
  -ms-user-select : none ; 
  user-select : none; 
}
header .top form 
{
  width : 60% ; 
  height : 2rem ; 
  display : flex ; 
  justify-content : center ; 
  align-items : center ; 
}
header .top form select 
{
  width : 5em ; 
  font-size : 10pt ; 
  flex-shrink : 0 ; 
}
header .top form select:focus 
{
  outline : #fc0 solid 1px ; 
}
header .top form p 
{
  width : 100% ; 
}
header .top form input:first-child 
{
  width : 70% ; 
  height : 2rem ; 
  border-radius : 1rem ; 
  border : 0 ; 
  outline : 0 ; 
}
header .top form input:first-child::placeholder 
{
  font-family : "Noto Sans TC" ; 
  font-weight : 500 ; 
  opacity : .65 ; 
  text-indent : .5rem ; 
}
header .top > :last-child 
{
  cursor : pointer ; 
  border-radius : 50% ; 
  display : block ; 
  width : 3rem ; 
  height : 3rem ; 
  position : relative ; 
  background : transparent ; 
  color : #fff ; 
}
header .top > :last-child:hover 
{
  color : #000 ; 
}
header .top > :last-child:focus 
{
  color : #fc0 ; 
}
header .top > :last-child svg 
{
  width : calc(3rem * .8) ; 
  height : calc(3rem * .8) ; 
  position : absolute ; 
  top : .3rem ; 
  left : .3rem ; 
}
.collapse 
{
  display : none ; 
}
@media ( min-width : 768px ) 
{
  header .top > :last-child 
  {
    display : none ; 
  }
  .collapse 
  {
    display : block ; 
  }
}
header nav 
{
  margin : .5rem 1rem ; 
}
header nav ul 
{
  display : flex ; 
  justify-content : space-evenly ; 
  align-items : flex-start ; 
  flex-direction : column ; 
}
header nav ul li 
{
  font-size : 16px ; 
  width : 100% ; 
  border-top : #fffe 1px solid ; 
  padding : .5rem 1rem ; 
  text-align : center ; 
  letter-spacing : 1em ; 
}
@media ( min-width : 768px ) 
{
  header nav 
  {
    padding : .5rem 0 ; 
    margin : 0 1rem ; 
    border-top : 1px var(--header-hr) solid ; 
  }
  header nav ul 
  {
    justify-content : space-evenly ; 
    align-items : center ; 
    flex-direction : row ; 
  }
  header nav ul li , li:not( div[ahhhhaaaahaha] li ):not( .footer-bottom li ):not( .bread li ) 
  {
    margin : 0 1rem ; 
  }
  header nav ul li 
  {
    font-size : 16px ; 
    width : 100% ; 
    border-top : 0 ; 
    padding : 0 ; 
    text-align : center ; 
    letter-spacing : 0 ; 
  }
}
header a , header a:visited 
{
  color : var(--header-a) ; 
}
header a:hover 
{
  color : var(--header-a-hover) ; 
  text-decoration : none ; 
}
header a:focus 
{
  color : var(--header-a-focus) ; 
  text-decoration : none ; 
}



/* mian */
.main 
{
  margin : 1rem 3rem ; 
}
@media ( min-width : 768px ) 
{
  .lawresult 
  {
    width : calc(21cm - .8in) ; 
    margin : 0 auto ; 
  }
}
.lawresult > div:not( .preview ) 
{
  color : #000 ; 
  background : #0002 ; 
  border-top-right-radius : .5rem ; 
  border-top-left-radius : .5rem ; 
  padding-left : .25rem ; 
  font-weight : 600 ; 
  font-size : 1.15rem ; 
}
.preview 
{
  font-family : "Noto Sans" , "Noto Sans TC" , "Noto Sans JP" , "Noto Sans SC" , sans-serif ; 
  font-size : .8rem ; 
  background : #0001 ; 
  color : #333a ; 
  text-decoration : none ; 
  border-bottom-right-radius : .5rem ; 
  border-bottom-left-radius : .5rem ; 
  margin-bottom : .5rem ; 
  padding : .5rem .8rem ; 
}
.lawresult:hover > div 
{
  color : #c03 ; 
}
#lawnoresult 
{
  color : #f00 ; 
  text-align : center ; 
  font-weight : 700 ; 
  font-size : 5rem ; 
}
.lq 
{
  height : fit-content ; 
  width : fit-content ; 
}
.lq , .lq + select 
{
  display : block ; 
  margin : 1rem auto ; 
}
.lq + select 
{
  border : 1px solid #000 ; 
  border-radius : 1em ; 
  color : #cdffd0 ; 
  background : linear-gradient(10deg,#b70000,#276ec4) ; 
}
.matched 
{
  color : #fc0 ; 
  background : #0009 ; 
}
.matched::selection 
{
  background : #f00 ; 
}

/* toTop */
.toTop 
{
  border-radius : 50% ; 
  font-size : 1.15rem ; 
  width : 2.85em ; 
  height : 2.85em ; 
  display : flex ; 
  flex-direction : column ; 
  justify-content : center ; 
  align-content : center ; 
  justify-content : center ; 
  align-items : center ; 
  background : #0005 ; 
  color : #fff ; 
  position : fixed ; 
  bottom : 20px ; 
  right : 10px ; 
  cursor : pointer ; 
  user-select : none ; 
}
.toTop:hover  
{
  background : #0007 ; 
  zoom : 102.5% ; 
}
.toTop:focus 
{
  outline : 1px solid #fc0 ; 
  zoom : 105% ; 
  background : #0009 ; 
}
@media print 
{
  .toTop , #top 
  {
    display : none ; 
  }
}


/* footer */
footer 
{
  margin : 1rem ; 
  margin-bottom : 0 ; 
  font-family : "Noto Serif" , "Songti TC" , "Noto Serif TC" , "Noto Serif JP" , "Noto Serif SC" , sans-serif ; 
}
footer ::selection 
{
  color : #fc0 ; 
  background : #000 ; 
}
.footer-upper 
{
  padding : .5rem 0 ; 
  margin : 0 1rem ; 
  margin-bottom : 1rem ; 
  border-bottom : 1px solid #000 ; 
}
.footer-upper ul 
{
  display : flex ; 
  justify-content : flex-start ; 
  align-items : center ; 
  flex-wrap : wrap ; 
}
@media ( min-width : 768px ) 
{
  .footer-upper ul 
  {
    justify-content : space-around ; 
  }
}
.footer-upper ul li 
{
  margin : .5em 1em ; 
}
.footer-note a , .footer-note a:visited 
{
  color : #000 ; 
  text-decoration : underline ; 
}
footer > .footer-note 
{
  margin-left : 1rem ; 
  color : #084141 ; 
}
footer > .footer-note ul li 
{
  list-style-type : disc ; 
}
.footer-bottom 
{
  background : #f2f2f2 ; 
  margin : 0 -1rem ; 
  line-height : 1.5 ; 
}
.footer-bottom > span , .footer-bottom > ul , .footer-bottom > span > ul > li 
{
  margin : 1rem ; 
  margin-bottom : 0 ; 
}
.footer-bottom > span > ul > li::before 
{
  content : '>' ; 
} 
.footer-bottom a , .footer-bottom a:visited , .footer-upper a , .footer-upper a:visited 
{
  color : #000 ; 
}
.footer-bottom a:hover , .footer-bottom a:focus , .footer-upper a:hover , .footer-upper a:focus 
{
  color : #c03 ; 
  text-decoration : underline ; 
}
.footer-bottom > ul 
{
  display : flex ; 
  align-items : center ; 
  border-left : solid 1px #000 ; 
}
.footer-bottom > ul li 
{
  border-right : solid 1px #000 ; 
  padding : 0 1rem ; 
}