*{padding:0; list-style:none; margin:0; text-decoration:none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
body{background:#EAF2FB}

.headtitle{width:100%; display:flex}
.headtitle div{flex:1; line-height:1}
.headtitle .img01{float:left; margin:0 5px 10px 0}
.headtitle p{font-size:12px}

#navhead{text-align:right; background:#3796D2}
#navhead a{color:#fff; letter-spacing:1px; padding:8px; display:inline-block; font-size:15px}
#navhead a.askbg{background:#f00}
.askmain{margin:15px auto; max-width:1000px; width:100%; background:#f1f1f1; border:1px solid #525252; box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 70%); position:relative}
.askopenh2{padding:10px; letter-spacing:1px; font-size:16px; font-weight:700;margin:20px 0 8px 0; color:#C50003}
.askopen{width:100%; border:1px solid #f6f6f6; color:#000; margin:10px 0}

.askopen dt{padding:5px 0; font-size:14px; letter-spacing:1px; font-weight:700;margin:0 0 5px 0; color:#C50003; position:relative}
.askopen dt span{background:#f1f1f1; padding:0 5px; position:relative; z-index:1}
.askopen dt::before{content:''; position:absolute; width:97%; left:5px; top:15px; border-bottom:1px solid #bbb4b4}
.askopen dd{width:100%; letter-spacing:1px; line-height:1.6; font-size:15px; padding:8px 10px; align-items:center}
.askopen .askName{ font-size:13px; color:#000; display:block}
.askopen .psaskName::before{content:'*'; color:#f00;}
askopen dd:nth-of-type(odd){background:rgba(0,0,0,.05)}
.askopen .asktext{}
#askopenover .asktext{}
#askopenover a{color:#444; display:inline-block; word-break:break-all}

#askhead{width:100%; max-width:1000px; margin:0 auto; border-bottom:#3796D2 3px solid; padding:10px 0 0 0}

.toaititle{font-size:13px; color:#444; padding:20px 0 0 10px}
.toaititle s{color:#D10205}
#toai{text-align:center; padding:0 10px; letter-spacing:1px; background:#f1f1f1; align-items:center; display:flex; margin-bottom:20px; justify-content:space-between}
#toai span{border-radius:4px; cursor:pointer;border:1px solid #ddd; background:#fdfdfd; color:#000;  padding:5px 5px 5px 30px; font-size:15px; flex:0 0 46% ;text-align: left; min-height:55px; position:relative}
#toai span.askin{text-align:center; min-height:55px; display:flex; align-items:center; justify-content:center; margin-left:8%}
#toai span.askYes{background:#FBCFC0;}
#toai span.askYes::before{content:'\2714'; position:absolute; border-radius:0 0 100% 0; color:#fff; font-size:12px; top:0; left:0; padding:3px; background:#f40;}
#toai span s{font-size:12px; display:block}
#toai span:hover{background:#FBCFC0}
.aioff{display:none}
.freemember{display:block; margin:10px auto; box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 50%); cursor:pointer}
.freemember:hover{ opacity:.7}
img{max-width:100%; height:auto}
#askh1{padding:10px; font-size:21px; letter-spacing:2px}
#askh1ok{padding:10px; font-size:30px; letter-spacing:1px; text-align:center; color:#f00;}
.textps{font-size:16px; letter-spacing:1px; line-height:1.8; text-align:center; padding:10px}
#askh1::after{content:"\270E"}
.askimg{background:#f5f5f5; width:100%; padding:10px; display:flex; justify-content:center}
.askimg .img03{max-width:100%; display:block; vertical-align:bottom}
.askimg div{padding:0 10px}
.askimg strong{display:block; color:#f00; font-size:24px}
.askimg span{font-size:16px}
.askopen .int01{padding:5px 3px; border:1px solid #BBBBBB; width:100%}
.askopen .int02{padding:3px; border:1px solid #BBBBBB; width:50%; margin:0 5px 0 0}
.askopen .tex1{padding:3px; border:1px solid #BBBBBB; width:100%; height:120px}
.askopen .int03{padding:3px; border:1px solid #BBBBBB; width:60px}
.askopen .int04{padding:3px; border:1px solid #BBBBBB; margin:0 5px 3px 0; background:#fff;}
.askopen .int05{padding:3px; border:1px solid #BBBBBB; margin:0 5px 0 0; background:#fff; width:180px}
.askopen input[type=checkbox]{border:1px solid #BBBBBB; width:15px; height:15px; vertical-align:middle; margin:0 3px}
.askopen .intk{padding:3px; border:1px solid #BBBBBB; width:100px; margin:2px 5px 2px 0}
.askopen .asktext s{color:#910036; font-size:12px; display:inline-block}
#Baera{display:flex; width:100%; flex-wrap:wrap}
.askopen #Baera span{padding:3px 5px}
.askopen p{color:#888; font-size:12px}
.askopen .noaskName{line-height:1.2}
#onbutton{font-size:14px; padding:2px 5px; background:#EB3235; color:#fff; border-radius:3px; cursor:pointer}
#onbutton:hover{opacity:.7}
.askopen img{width:20px; margin:0 0 0 3px; vertical-align:middle}
.sendOK{padding:10px; font-size:14px; text-align:center; color:#D00306; font-weight:700}
.sendOK input,.sendOK button{padding:5px 20px; font-size:16px; color:#fff; letter-spacing:2px; margin:5px auto; background:#00339b; border:1px solid #022772; border-radius:5px; cursor:pointer;box-shadow:0 0.2rem 0.4rem rgb(0 0 0 / 50%); position:relative}
.sendOK input:hover{opacity:.7}
div.ddps{font-size:14px; padding:15px 10px 0 0 !important; color:#000}

#ask_kword div{display:inline-block}
#ask_kword span,#ask_cly span{margin-right:10px;}
#ask_kword span input{padding:3px; width:85px; border:1px solid #C4C4C4}
#ask_kword span s,#ask_cly s{display:inline-block; width:20px; height:20px; line-height:20px; text-align:center; cursor:pointer; background:#e7e7e7; color:#333; margin-left:3px; font-size:12px; border-radius:2px}
#ask_kword i,#ask_cly i{display:inline-block; width:20px; height:20px; line-height:20px; text-align:center; cursor:pointer; background:#ec407a; color:#fff; font-style:inherit; font-size:12px; border-radius:2px}
#cly_add{display: inline-block;background:#ec407a; color:#fff; font-style:inherit; font-size:12px; width:20px; height:20px; line-height:20px; text-align:center; cursor:pointer; border-radius:4px}

#Askpsbtn{padding:2px 15px; font-size:16px; color:#000; letter-spacing:2px; margin:5px auto; background:#A0A0A0; border:1px solid #848484; border-radius:5px; cursor:pointer;box-shadow:0 0.2rem 0.4rem rgb(0 0 0 / 10%)}
#Askpsbtn:hover{opacity:.7}
#Askpsbtn.Askpsbtnover{ background:#CF0003; border:1px solid #D33235; font-weight:700}
#Askpsbtn::before{content:'\2610'}
#Askpsbtn.Askpsbtnover::before{content:'\2714'}
#Askpsbtn input[type=checkbox]{border:1px solid #BBBBBB; width:20px; height:20px; position:relative; top:2px}
#openAskps{padding:20px}
#openAskps li{position:relative; padding:3px 0 3px 15px; font-size:14px; letter-spacing:1;}
#openAskps li::before{content:attr(art); position:absolute; top:3px; left:3px}
#ask_kword span s:hover,#ask_kword i:hover,#ask_cly s:hover,#ask_cly i:hovrer{opacity:0.7}

.about_ps{margin:20px auto; width:100%; max-width:1000px}
.about_ps_1{font-size:16px; font-weight:700; letter-spacing:2px; line-height:1.6; color:#A00000; padding:15px 0}
.about_ps_div{padding:20px 10px; border-top:2px solid #2B2B2B}
.about_ps_ul{display:flex; width:100%}
.about_ps_2{font-weight:700; padding:0 15px}
.about_ps_3{ font-size:17px; padding:8px 15px; color:#A00000; pause-before:700}
.about_ps_ul li{flex:1; padding:0 10px; text-align:center; font-weight:700; letter-spacing:1px; font-size:21px;}
.about_ps_ul li span{display:block; color:#fff; background:#B0B0B0; padding:15px; border-radius:10px; border:4px double #fff; cursor:pointer;}
.about_ps_ul li span.Noask{background:#CD3F00; box-shadow:0 0.2rem 0.4rem rgb(0 0 0 / 20%)}
.Noask::before{content:'V';margin:0 5px 0 0}
.aboutbtn{display:table; margin:35px auto 0 auto;border-radius:10px; border:4px double #fff; cursor:pointer; padding:20px 30px; font-size:16px; line-height:5px; color:#fff; background:#EF7A21}
.aboutbtn:hover,.about_ps_ul li span:hover{opacity:.7}

.pageurl{font-size:12px; margin:0 0 15px 0; color:#888;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.pageurl a{color:#888; display:inline-block; padding:2px 3px}
.abinfo{background:#fff; padding:5px; border-radius:8px; border:#A4A4A4 1px solid; margin:10px}
.abinfo h2{font-size:18px; padding:8px}
.abinfo li a{font-size:15px; display:block; padding:5px 8px; border-bottom:1px dotted #979797; color:#222}
.abinfo li a:hover{background:#F3F3F3;}

.toask_btn{padding:5px 15px;background:#ff4e00; color:#000 !important; letter-spacing:3px; font-weight:900; border-radius:5px; cursor:pointer;font-size:16px;box-shadow:0 0.2rem 0.4rem rgb(0 0 0 / 60%); text-decoration:none !important;border:4px double #fff}
.toask_btn:hover{opacity:.7;box-shadow:0 0.2rem 0.4rem #ff4e00;}


.footword_over{text-align:center; letter-spacing:1px; margin:25px 0}
.footword_over p{color:#f00; font-size:16px; font-weight:700}
.footword_over a{display:inline-block;padding:5px 20px; font-size:16px; color:#fff; letter-spacing:2px; margin:15px auto; background:#DD5254; border:1px solid #B30002; border-radius:5px; cursor:pointer;box-shadow:0 0.2rem 0.4rem rgb(0 0 0 / 50%)}
.footword_over a:hover{opacity:.7}
#askfoot{padding:20px; font-size:13px; color:#fff; background:#848484; text-align:center}
#askfoot a{color:#fff}

#spinner{font-weight:700; font-size:1.5rem; color:#F3070B; width: 160px; height: 160px;text-align:center;position: absolute;top: 35%;left: 35%; display:none }
#spinner::before{content:'請稍後...'; position:relative; z-index:2; display:block; height:0; top:55px}
.spinner {  border: 16px solid #fdd6d6; border-top: 16px solid #3498db; border-radius: 50%; animation: spin 2s linear infinite;position: relative; transform: translate(-50%, -50%); width: 160px; background:#fff;height: 160px; z-index:1; display:block}

.AiYes::before{content:'AI'; font-size:12px; letter-spacing:0; position:absolute; z-index:2; top:13px; left:66px}
.goto{border:2px solid #DB0058;border-right: 2px solid #fff;border-bottom: 2px solid #fff; margin:0 5px; z-index:1;height: 22px; position: relative; display:inline-block ;width: 22px; top:4px;border-radius: 50%; animation: goto 2s infinite linear}
.AiYes:hover .goto{background:#000}
.AiYes:hover{ background:#f00; border:1px solid #fff} 
.AiYes:hover::before{content:'go'}
@keyframes goto {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}	}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@media (max-width: 760px){
	.askimg{flex-wrap:wrap}
	#navhead{text-align:center}
	.headtitle{display:table}
	.headtitle div{ width:280px; display:table; margin:0 auto}
	.askimg div{padding:10px 0 0 0}
	.askopen .int02{width:100%}
	
}