@import url("layout.css");

.in_nav {
    display: none;
}
.in_side {
    padding: 0;
	width: calc(100% - 10vw);
}

div.PageInfo{
	clear:both;
	padding-top:15px;
}

div.PageInfo h3{
	border: 0;
	color: #368939;
	font-size: 40px;
	font-family: 'Microsoft JhengHei', 微軟正黑體, Tahoma, Verdana, Geneva, sans-serif;
	font-weight: 600;
	line-height: 48px;
	margin: 0px;
    padding: 10px 0;
    text-align: left;
}

.office { 
	border: 2px solid #000;
    border-width: 2px 0;
    margin: 30px 0 50px;
    padding: 15px 0
}
.office ul { display: grid;
    grid-template-columns: 150px 1fr;
    padding: 15px 0;}
.office ul:after { content:""; display:block; clear:both}
.office li { }
.office h4 {
    color: #000;
    font-size: 21px;
    text-align: left
}
.office ul em {
    color: #0068ad;
    line-height: 36px;
    width: 36px
}
.office ul em span {
    display: none;
}
.office .B p {
    border-bottom: 1px solid #ddd;
}
.office .B p:last-child {
	border-bottom: none
}
.office .fb {
    background: #735f53;
    color: #fff;
    text-decoration: none;
    display: block;
    float: none;
    margin: 30px auto 0;
	padding: 7px 10px;
    text-align: center;
    width: 180px;
}
.office .fb:hover { background: #eb5b3e;}
.office ul .fb em {
    background: none;
    height: auto;
    line-height: initial;
    margin: 0 10px 0 0;
    width: auto;
}
.office .B p {
    padding: 0 0 0 20px;
    text-align: left;
}
form#form_qs {
    padding: 0 0 20px
}
   


div.PageInfo table.special2 tr td{
	font-size: 12px;
	line-height: 21px;
	padding-bottom: 5px;
	padding-top: 5px;
}

div.PageInfo table.special2 td.leftTd {
	/*background-color: #eeeeee;*/
	padding-left: 10px;
	width: 184px;
	color: #000;
	border-bottom:1px dashed #FEC1AA;
}

div.PageInfo table.special2 td.rightTd {
	padding-left: 10px;
}

div.PageInfo table.special2 tr td input{
	border:1px solid #d1d1d1;
	padding:3px;
}

div.PageInfo table.special2 tr td input.textfield{
	width:310px;
}

div.PageInfo table.special2 tr td input.textfield2{
	margin-top:10px;
	width:105px;
}

div.line {
	margin-top: 20px;
	margin-bottom: 25px
}

div.PageInfo table.special2 tr td textarea.textarea{
	width:495px;
	height:110px;
	border:1px solid #d1d1d1;
}


input.checkBtn:hover{
	background-position:left bottom;
}

div.PageInfo input,div.PageInfo textarea{
	border:1px solid #d1d1d1;
	padding: 15px 15px;
    width: calc(100% - 32px);
	margin:0 0 10px; font-size:15px
}
div.PageInfo input:focus,div.PageInfo textarea:focus{ outline:0; border:1px solid #ECCD77;} 
.leftTd{ display:inline-block; width:60%}
.rightTd{ display:inline-block; width:39%; vertical-align:top; text-align:center}

div.PageInfo input.checkBtn{
	width:136px;
	display:block;
	margin:0 auto;
	background:#0068ad;
	border:0; color:#fff;
	font-size:17px;
}

div.PageInfo input.checkBtn:hover{ background: #eb5b3e;}
img#authpic_img {
    width: initial;
}


@media screen and (max-width: 768px) {
	.in_side {
		width: 98%;
	}
	.office ul {
    	grid-template-columns: 1fr
	}
	.office h4 {
		margin: 0 0 15px 10px
	}
	.office .B p {
		padding: 0 0 0 5px   
	}
	.office ul em {
    	padding: 0 10px 0 0;
		width:auto
	} 
}
@media screen and (max-width: 480px) {
	div.PageInfo input,div.PageInfo textarea{ padding:3%; width:93%}
	
	.office li { width: 100%;}
	.office h4 {
		margin: 0 0 30px 0;
	}
	.newsPage, .newsPage p, .newsPage p span {
		font-size: 15px;
		font-weight: 600;
	}
	
}
@media screen and (max-width: 479px) {
	.leftTd{ width:100%}
}