.new_form {
	line-height: 1.4;
	text-align: left;
	font-size: 1.1rem;
}

.new_form > ul,
.new_form fieldset > ul {
	padding: 0;
	margin: 0;
	list-style: none;
	border-style: solid;
	border-width: 1px;
	border-color: rgba(127,127,127,.3);	/* color #1 */
}

.new_form label {
	font-weight: normal;
	margin: 0;
	padding: 0;
}

/* 每一個輸入列 */
.new_form > ul > li,
.new_form fieldset > ul > li {
	display: flex;
	justify-content:flex-start;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	border-style: solid;
	border-width: 0 0 1px 0;
	border-color: rgba(127,127,127,.3);	/* color #1 */
}

/* label 欄 */
.new_form > ul > li > .label_box,
.new_form fieldset > ul > li > .label_box {
	flex: 0 0 20%;
	padding: 0 .5em;
	text-align: right;
	color: #006100;
}

/* input 欄 */
.new_form > ul > li > .input_box,
.new_form fieldset > ul > li > .input_box {
	flex: 0 0 80%;
	padding: .5em;
	border-style: solid;
	border-width: 0 0 0 1px;
	border-color: rgba(127,127,127,.3);	/* color #1 */
}

@media only screen and (max-width: 599px ) {
	/* 每一個輸入列 */
	.new_form > ul > li,
	.new_form fieldset > ul > li {
		display: block;
		width: 100%;
		text-align: left;
		padding: .5em; 
	}

	/* label、input 欄 */
	.new_form > ul > li > .label_box,
	.new_form fieldset > ul > li > .label_box,
	.new_form > ul > li > .input_box,
	.new_form fieldset > ul > li > .input_box {
		display: block;
		text-align: left;
		width: 100%;
		padding: 0;
		border: none;
	}
}

/**********************
 文字欄位
**********************/
.new_form input[type=text],
.new_form input[type=email],
.new_form input[type=password],
.new_form input[type=url],
.new_form textarea {
 	width: auto; 
	padding: .2em .5em;
	color: #555;
	border: 1px solid #CACACA;
	border-radius: 3px;
}

/**********************
 文字區域欄位
**********************/
.new_form textarea {
	min-width: 90%;
}

/*****************************************
 checkbox & radio box
 格式：
	<input type="radio"... />
    <label for="method_1">會員結帳</label>
*****************************************/
/* Hide the default button */
.new_form input[type="radio"],
.new_form input[type="checkbox"] {
	position: absolute;
	clip: rect(0 0 0 0);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
}

/* hover */
.new_form input[type="radio"] + label:hover,
.new_form input[type="checkbox"] + label:hover {
	cursor: pointer;
}

/* focus */
.new_form input[type="radio"]:focus + label::before,
.new_form input[type="checkbox"]:focus + label::before {
	/* Focus style */
    outline: 4px solid #FF9933;
    outline-offset: 0;
}

/* 未選取 */
.new_form input[type="radio"] + label::before,
.new_form input[type="checkbox"] + label::before {
	font-family: "Font Awesome 6 Free";
	padding: 0;
	margin: 0 .4em 0 0;	/* Adjust spacing as needed */
	color: #ccc;		/* 未選取時的顏色 */
}

/* 已選取 */
.new_form input[type="radio"]:checked + label::before,
.new_form input[type="checkbox"]:checked + label::before {
	color: #007bff; 	/* 已選取時的顏色 */
	cursor: pointer;
}

/* radio 未選取時的 icon font */
.new_form input[type="radio"] + label::before {
	font-weight: 400;	/* For solid icons, use 900 */
	content: "\f111";	/* <i class="fa-regular fa-circle"></i> */
}

/* radio 選取時的 icon font */
.new_form input[type="radio"]:checked + label::before {
	font-weight: 400;	/* For solid icons, use 900 */
	content: "\f192";	/* <i class="fa-regular fa-circle-dot"></i> */
}

/* checkbox 未選取時的 icon font */
.new_form input[type="checkbox"] + label::before {
	font-weight: 400;	/* For solid icons, use 900; */
	content: "\f0c8";	/* <i class="fa-regular fa-square"></i> */
}

/* checkbox 已選取時的 icon font */
.new_form input[type="checkbox"]:checked + label::before {
	font-weight: 400;	/* For solid icons, use 900 */
	content: "\f14a";	/* <i class="fa-regular fa-square-check"></i> */
}

.check_box_list.inline li {
	display: inline-block;
	margin-right: .7em;
}

/**************************
 fieldset & legend
**************************/
.new_form fieldset {
	border: 1px solid rgba(127,127,127,.3);
	padding: 10px 2%;
	border-radius: 5px;
}

.new_form legend {
	border: none;
	margin: 0;
	padding: 0 .5em;
	display: inline-block;
	width: inherit;
	color: #AC1616;
	font-weight: 500;
}

/*** 必填欄位 ***/
.new_form .label_box em,
.action_box .quiz_box em {
	color: #AC1616; 
	font-weight: 600;
	opacity: 1;
	font-size: 70%;
}

/*************************
 表單動作列
*************************/
.new_form .action_box {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	margin-top: .5em;
}

/*** 表單驗證區 ***/
.new_form .action_box .quiz_box {
	display: flex;
}

/*** 表單驗證前置 label ***/
.new_form .action_box .quiz_box label {
	color: #006100;
}

/*** 表單驗證問題區 ***/
.new_form .action_box .quiz_box .qa {
	padding: 0 .5em;
	color: #F00;
	font-weight: bold;
}

/* 表單驗證答案區 */
.new_form .action_box .quiz_box input {
	display: inline-block;
	margin-left: .5em;
	width: 4em;
	text-align: center;
	border: 1px solid red;
}

/**** 錯誤訊息 ***/
/* jQuery form validate 的錯誤訊息 */
.new_form p.error,
.new_form div.error {
	margin-top: .1em;
	font-size: 85%;
	color: #d70000;
	font-weight: 500;
}

/* 表單送出後的訊息 */
.alert-success {
	margin: .5em 0 0 0;
	display: none;
}

.alert-success p {
	padding: .3em .5em;
}

.alert-success p.msg_error {
	color: #AC1616;
}

/*********************
 聯絡我們表單側邊欄
 -page-contact.php
**********************/
.sidebar_contact {
    color: #175B96;
	font-size: 1.05rem;
	line-height: 1.5;
	border-radius: 4px;
	margin-top: 2.5em;
}

/*** 第一列 ***/
.sidebar_contact p.first {
	margin-bottom: 1em;
}

.sidebar_contact > ul {
	list-style: none;
	padding: 5px;
}

.sidebar_contact > ul li {
	word-break: break-all;
}

/*** 電腦版聯絡電話 ***/
.sidebar_contact ul.web_call {
	padding: 1em 0;
}

.contact .sidebar_contact ul.web_call li {
	margin-bottom: .5em;
}

.sidebar_contact ul.web_call .web_label {
	display: inline-block;
	font-weight: 600;
	color: #333;
}

.sidebar_contact ul.web_call .web_phone {
	display: inline-block;
	color: #AC1616;
	font-weight: 600;
}

/*** QR Code ***/
.sidebar_contact .qr_code {
	text-align: center;
}

.sidebar_contact .qr_code img {
	display: inline-block;
	margin: 0;
	padding: 0;
	max-width: 100%;
	height: auto;
	width: auto;
}

@media only screen and (max-width:767px) {
    /*** 第一列 ***/
    .sidebar_contact p.first {
        margin-top: 0;
    }
	ul.mobile_call {
		display: table;
	}	
}

.side-box.inquire .site-content {
	display: block !important;
	width: 100% !important;
}

/**************************
 二欄式表單 (線上詢價)
**************************/
.new_form .form_wrap {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}

.new_form .form_wrap .form_box {
	flex: 0 0 49.5%;
}

/* label 欄 */
.new_form .form_box > ul > li > .label_box,
.new_form .form_box fieldset > ul > li > .label_box {
	flex: 0 0 28%;
}

/* input 欄 */
.new_form .form_box > ul > li > .input_box,
.new_form .form_box fieldset > ul > li > .input_box {
	flex: 0 0 70%;
}

@media only screen and ( max-width:991px) {
	.new_form .form_wrap .form_box {
		flex: 0 0 100%;
		display: block;
		width: 100%;
		margin-bottom: 1.5em;
	}

	.new_form .form_wrap .form_box:last-child {
		margin-bottom: 0;
	}

}