@charset "big5";
body { color: #000; font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Jhenghei", sans-serif; color:#000000; font-size: 17px;  line-height: 22px; word-wrap: break-word; word-break: break-all;}
a { color:#000;}
:focus { outline: none; }
i { font-style: normal; }
.float-left{ float: left;}
.header { margin: auto; width: 100%;}
.footer { margin: auto; width: 100%;}
.hd_pc { width: 100%; display: block;}
.hd_m { display: none;}
.pez_ft { height: 228px;}

.main{ width:920px; margin:0 auto; padding-bottom: 10px;}
h2 {  padding: 5px 0px 5px 10px;  color: #ffffff;  font-size: 16pt;  margin: 5px 0;  background: #7BBC2A; line-height: 30px; text-align: center;  font-weight: bold;}
h3 { color: #0079e0; font-size: 24px; font-weight: bold; padding: 10px 0; line-height: 26px; }
h3>.eng { padding-left: 30px;}
ol li{ margin:0 10px 7px 40px; list-style-type:decimal; word-break: break-word;}
center { padding-bottom: 5px;}
.hr{ border-bottom: 1px #8F8F8F dashed;  margin: 15px 0  5px 0; overflow:hidden;}
.ap{ padding: 0 10px 5px 20px;}
.red { color: #c00;}

.box01 {width: 96%;  margin: 0 auto;}
.box01 tr td{ padding: 8px; border: 1px solid #777; }
span.box_text {  padding-left: 50px; display: block; }
a.phone{ text-decoration: none; color: #000000;}

.float_wrapper { position: fixed; bottom: 20px; right: 20px;  z-index: 250;  display: none; width: 50px;  background: #969696; border-radius: 50px;  height: 36px; padding-top: 14px;text-align: center;}
a.go_top {  display: block; color: #fff;  font-weight: bold; font-size: 16px; line-height: 15px;}
.float_wrapper:hover{ background: #ff954b;}
.M_menu_wrap{ display: none;}

ul li { counter-increment: my-counter; list-style-type: none; text-indent: -23px; margin-left: 23px;}
ul li::before { content: "("counter(my-counter) ")";  padding-right: 3px;}

.customer_main {border: 1px solid #ccc; text-align: center;}
.customer {text-align: center; line-height: 60px; font-size: 18px; font-weight: bold; display: block;}
.customer a {color: #da5523;}

.ask {padding-bottom: 15px;}

 @media screen and (max-width: 768px) {
body { font-size: 14px;}
.header, .footer{ width: 100vw;}
.hd_m { display: block; }
.hd_pc { display: none;}
.pez_ft { height: 310px;}

.main{ width:100vw;}
.main img { width: 100%;}
h2 {  font-size: 16pt;  margin: 5px 0;   line-height: 24px; }
h3 { font-size: 20px; padding: 7px 10px 5px 10px;   line-height: 22px;}
h3 span{ display: block;  margin-left: 25px; font-size: 18px;}
h3>.eng { padding-left: 25px;}
ol li { margin: 0 10px 5px 30px;}
center img { width: 96%;}
.hr{ margin: 10px 0; }
.ap { padding: 0 10px 5px 10px;}
	 
.box01 { width: 96%;  margin: 2% 2%;}
.box01 tr td { padding: 2px;}
span.box_text { padding-left: 15px;}
span.phone {  display: block; }
	 
a.phone { text-decoration: underline;}

.M_menu_wrap { position: fixed; bottom: 0; z-index: 200; display: block; }
.M_menu_block { width: 100vw; height: 55px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #111));}
.M_menu_block ul { list-style: none; overflow: hidden; }
.M_menu_block li { float: left; width: 24.3vw;  border-top: 1px solid #ccc; border-left: 1px solid #666; border-right: 1px solid #222;  padding-top: 0; text-align: center; padding: 8px 0 20px;}
.M_menu_block li a { color: #fff; text-decoration: none; font-size: 15px; line-height: 18px;  display: block;}
.bk_mask { display: none; position: fixed; width: 100vw; height: 100vh; background: rgba(0,0,0,.8); top: 0; z-index: 100; }
li.down { padding-top: 16px;}
	 
.customer {line-height: 17px; font-size: 13px; padding: 2vw 5vw;}
	
.ask {padding-bottom: 0px;} 

}

 @media screen and (max-width: 330px) {
h3 { font-size: 17px; padding: 5px;  line-height: 20px;}
h3 span{ margin-left: 20px; font-size: 15px;}
h3>.eng { padding-left: 20px;} 
}