/**
  @file       genform.ottocity.css
  @date       2020-04-21: Chiuhua + 191001009, Create, Cory from genform.app.css
	@date       2020-07-09: Chiuhua + 200500938, 新增 .form1_row 樣式 (從 .form1 繼承加套)
	@date       2020-09-09: Chiuhua + 200500938, form1 欄位 focus 樣式 (舊版 SF 不支援), JLR 預約網頁需求
	@date       2020-09-15: Chiuhua + 200500938, 新增 dd3col 分 3 欄, JLR 預約網頁需求
	@date       2020-09-18: Chiuhua + 200500938, 新增 .form1_readonly, JLR 預約網頁需求
	@date       2021-01-27: Chiuhua # 200500938, 修正 .form1_readonly 在 GC 瀏覽器縮小至 90% 樣式跑版 (IE 與 FF 無此問題), JLR 預約網頁需求
	@date       2021-06-09: Chiuhua + 210600615, 新增 form1 與 itemlist2_wrapper 組合套用樣式, Ford 線上購車 需求
	@date       2022-06-28: Chiuhua # 調整 form 裡面的 lbcbx_wrapper 行高不受欄位 rwd 高度規則限制, 以優化可點擊度
	@date       2022-09-20: Chiuhua + 220901528, form1 下拉欄位加隱藏 input, 歐吉線上訂單需求 (相關 # Ys)
	@date       2022-09-22: Chiuhua + 220901528, 新增 form1 dd 性別欄位, 歐吉線上訂單需求
	@date       2022-09-28: Chiuhua + 220901528, 新增 form1 欄位加高樣式 .minh_row1higher 以修正 dd 空資料跑版問題, 歐吉線上訂單需求
	@date       2022-10-14: Chiuhua # 221001525, 調整 form1 及 form1_row 樣式, 因 B2C 必填統一在標題加星號表達 (by Ho)
	@date       2022-11-17: Chiuhua # H221000167, 調整 form 欄位要可放進 lbrdo_wrapper, HONDA HCUC 需求
	@date       2023-01-07: Chiuhua # 230100301, form1 性別欄位自主改良, 去除 gap 及接縫餘線 (改良 form1 有線條時樣式太複雜)
	@date       2023-01-09: Chiuhua + 230100301, 新增 .form1_psi_wrapper 個人資料區塊樣式差異
	@date       2023-05-16: Chiuhua + 230302504, 新增 form1 欄位檢查特殊樣式, FORD 線上訂單 需求
	@date       2023-06-05: Chiuhua + 230302504, 新增 form1 ddbgnone, FORD 線上訂單 需求
	@date       2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存
	@date       2025-01-13: Chiuhua + 250107166, 新增 .form1_row_groupwrapper 及 .dl2col_wrapper 樣式, 相關需求: STLA 旗下品牌 聯絡我們網頁, FORD 線上新車訂單
	@date       2025-01-15: Chiuhua + 250107762, 新增 textarea 欄位檢查特殊樣式
	@date       2025-03-28: Chiuhua + 250400376, 新增 .form1_readonly_par 父層樣式 (STLA onlineservice 確認頁 加線條需求)
	@date       2025-05-13: Chiuhua + 250505190, 新增 form1_readonly span.joinitem 樣式 (邏輯與 form1 相同)
	@date       2025-05-13: Chiuhua + 250505190, 新增 form1_readonly .rwd_auto2row 手機 RWD 樣式，讓手機 dt dd 自適應成 row 排列
	@date       2025-05-15: Chiuhua # 250505490, 調整 form1_row dt btn
	@date       2025-07-28: Chiuhua + 250702700, 新增 .form1.rwd_row 樣式 (APP Order+ 手機版 RWD 延伸)
	@date       2025-07-28: Chiuhua + 250702700, .form1_row 與 .form1.rwd_row 一併定義
	@date       2025-08-08: Chiuhua # 250702972, 調整 form1_readonly dt, dd overflow 預設 hidden
	@date       2025-08-11: Chiuhua + 250702972, 新增 .form1_readonly_row 樣式 (APP Order+ 手機版 需求, oTToCity 同步新增)
	@date       2025-08-11: Chiuhua + 250702972, 新增 .form1_readonly.rwd_row 樣式 (APP Order+ 手機版 需求, oTToCity 同步新增)
	@date       2025-08-12: Chiuhua - 250702972, 移除 手機自適應樣式 rwd_auto2row, 因樣式已整合為 .form1_readonly.rwd_row
	@date       2025-09-11: Chiuhua # 250900886, oTToCity form1 改良
	@date       2025-09-19: Chiuhua # 250900888, oTToCity 各品牌 表格樣式盤整
*/
/*=== form1, form1_row 共用 Start ===*/
/* 必填 - 從 genlib.ottocity.css 移至 genform.ottocity.css 統一處理, 因 B2C 必填統一在標題加星號表達 (by Ho) */
/* 2022-10-14: Chiuhua # 221001525, 調整 form1 樣式, 因 B2C 必填統一在標題加星號表達 (by Ho) */
/* 星號預設置前, 置後差異化用 direction:rtl; 但需注意 key 入數字開頭且有空格的文字會有問題, 例如 "2 行" */
/* 2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存 */
dt lang.requiredtag, dt label.requiredtag {}
dt lang.requiredtag:before, dt label.requiredtag:before {content:'';position:relative;top:-0.55rem;right:0.05rem;width:0.5rem;height:0.5rem;display:inline-block;background:url(../image/mark_star.svg) no-repeat;background-size:cover;}
/* 2023-06-05: Chiuhua + 230302504, 新增 form1 ddbgnone, FORD 線上訂單 需求 */
dl[class*="form1"] .ddbgnone {border-radius:unset;}
dl[class*="form1"] .ddbgnone > * {background-color:transparent !important;box-shadow:none;padding:0px !important;}
dl[class*="form1"] .ddbgnone > * > label:before {margin-left:0px;}
/*=== form1, form1_row 共用 End ===*/

/*=== form1 Start ===*/
/* form 欄位高度 RWD, 手機=26px, 平板及桌機=28px */
/* dt 預設 5rem, 不預設 form1 外邊界, 不同 ui 需求依 共用 -> 樣版 -> 商店 -> 單頁 順序做繼承差異化處理 */
/* 2021-06-09: Chiuhua + 210600615, 新增 form1 與 itemlist2_wrapper 組合套用樣式, Ford 線上購車 需求 */
/* 2022-06-28: Chiuhua # 調整 form 裡面的 lbcbx_wrapper 行高不受欄位 rwd 高度規則限制, 以優化可點擊度 */
/* 2022-11-17: Chiuhua # H221000167, 調整 form 欄位要可放進 lbrdo_wrapper, HONDA HCUC 需求 */
/* 2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存 */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 {display:table;width:100%;table-layout:fixed;}
.form1 *:not(button):not(button *):not(.lbcbx_wrapper):not(.lbcbx_wrapper *):not(.lbrdo_wrapper):not(.lbrdo_wrapper *):not([class*="itemlist"] *) {/* line-height:26px; */line-height:2rem;}
.form1 dt, .form1 dd {/* height:26px;min-height:26px;margin:2px 0px; */height:2rem;min-height:2rem;margin:0.15rem 0px;float:left;}
.form1 dt {width:5rem;text-align:right;/* padding-right:5px; */padding-right:0.35rem;white-space:nowrap;overflow:hidden;}
.form1 dt lang, .form1 dt label {width:auto;max-width:100%;font-size:inherit;line-height:inherit !important;font-weight:inherit;display:inline-block;vertical-align:top;overflow:visible;}
.form1 dd {width:calc(100% - 5rem);overflow:hidden;border-radius:0.35rem;}
.form1 dd > *:not(button) {width:100%;height:inherit;vertical-align:top;overflow:hidden;border-radius:inherit !important;}
.form1 dd > * > * {height:inherit;vertical-align:middle;}
.form1 dd input:not([type="checkbox"]):not([type="radio"]), .form1 dd select {/* padding:0px 5px; */padding:0px 0.35rem;}
.form1 dd input:not([type="checkbox"]):not([type="radio"]), .form1 dd select,
.form1 dd > * > input:not([type="checkbox"]):not([type="radio"]) ~ *,
.form1 dd textarea, .form1 dd textarea ~ *,
.form1 dd p[contenteditable], .form1 dd p, .form1 dd p ~ *,
.form1 dd *.lbcbx_wrapper, .form1 dd *.lbrdo_wrapper, .form1 dd *.itemlist2_wrapper,
.form1 dd span.joinitem, .form1 dd.ddtel > i {background-color:#FFF;}/* 加白底修正 ios retina 1px 數值誤差產生的漏白 */
.form1 dd textarea, .form1 dd p[contenteditable], .form1 dd p, .form1 dd *.lbcbx_wrapper, .form1 dd *.lbrdo_wrapper {line-height:1.3em !important;/* min-height:26px;padding:3px 5px 4px; *//* min-height:2rem; */padding:0.35rem;vertical-align:top;white-space:normal !important;word-break:break-word;}
.form1 dd textarea *, .form1 dd p * {line-height:inherit !important;}
.form1 dd textarea {white-space:pre-wrap !important;/* ←fixed iOS 手動換行 */min-height:inherit !important;resize:none;}
.form1 dd button {/* height:22px;line-height:22px; */height:calc(2rem - 4px);line-height:calc(2rem - 4px);margin-top:0px;margin-bottom:0px;vertical-align:baseline;}
.form1 dd *.itemlist2_wrapper {}
.form1 dd *.itemlist2_wrapper > * {width:auto !important;/* margin:5px; */margin:0.35rem;}
.form1 dd *.itemlist2_wrapper .itemlist2 > li:not(.item_y) {border:1px dashed hsla(0,0%,0%,0.5);}

/* form1 欄位 focus 樣式 (舊版 SF 不支援), ※不使用 border 的做法, 因為 requiredtag 及 joinitem 會有問題 */
/* 2020-09-09: Chiuhua + 200500938, JLR 預約網頁需求 */
/* 2025-11-03: Chiuhua # 251100134, 改良 form1 欄位 focus 樣式 (root 與 modern 及 onlineservice 樣版及所有集團/品牌) */
.form1 dd input:not([type="checkbox"]):not([type="radio"]):focus, .form1 dd select:focus, .form1 dd textarea:focus {/* box-shadow:0px 0px 0px 1px hsl(0,80%,70%) inset !important; */box-shadow:0px 0px 0px 1px hsl(220,70%,40%) inset !important;color:inherit;}

/* form1 欄位檢查特殊樣式 */
/* 2023-05-16: Chiuhua + 230501310, 新增 form1 欄位檢查特殊樣式, FORD 線上訂單 需求 */
/* 2025-01-15: Chiuhua + 250107762, 新增 textarea 欄位檢查特殊樣式 */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 .ddhint, .form1 .dderr {height:auto;line-height:1.5em !important;}
.form1 .ddhint small, .form1 .dderr small {display:block;background-color:transparent;border:none !important;box-shadow:none;font-size:0.875rem;line-height:1.5em !important;margin:0.15em 0px;padding-left:0.15em;}
.form1 .ddhint small *, .form1 .dderr small * {font-size:inherit;line-height:inherit !important;}
.form1 .dderr {position:relative;}
.form1 .dderr > input, .form1 .dderr > select, .form1 .dderr > textarea {box-shadow:0px 0px 0px 1px hsl(0,100%,45%) inset;/* color:hsl(0,100%,30%); */}
.form1 .dderr .ferr {color:hsl(0,100%,45%);}
.form1 .dderr .i_close {position:absolute;top:0px;right:0px;width:2em;/* height:26px; */height:2rem;background-color:transparent;border:none !important;box-shadow:none;cursor:pointer;}
.form1 .dderr .i_close:before {content:'';position:absolute;left:0px;right:0px;top:0px;bottom:0px;margin:auto;width:1rem;height:1rem;border-radius:50%;background:url(../image/delete_w_L.png) no-repeat center / 45% auto;background-color:hsl(0,100%,30%);}
.form1 .dderr .lbcbx_wrapper label:before, .form1 .dderr label.lbcbx:before,
.form1 .dderr .lbrdo_wrapper label:before, .form1 .dderr label.lbrdo:before {border-color:hsl(0,100%,45%);}

/* 欄位高度 RWD, 平板=28px */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 - 改用 rem, 已不需另寫 media rwd
@media all and (min-width:600px) {
.form1 *:not(button):not(button *):not(.lbcbx_wrapper):not(.lbcbx_wrapper *):not(.lbrdo_wrapper):not(.lbrdo_wrapper *):not([class*="itemlist"] *) {line-height:28px;}
.form1 dt, .form1 dd {height:28px;min-height:28px;}
.form1 dd textarea, .form1 dd p[contenteditable], .form1 dd p {min-height:28px;}
.form1 dd button {height:24px;line-height:24px;}
.form1 .dderr .i_close {height:28px;}
}
*/

/* form1 - dd 最小高度, 內容超過自動長高 */
.form1 dd.minh_row2 {min-height:calc(1.3em * 2 + 10px);}
.form1 dd.minh_row2 > *, .form1 dd.minh_row2 > textarea, .form1 dd.minh_row2 > p {min-height:inherit !important;}
.form1 dd.minh_row3 {min-height:calc(1.3em * 3 + 10px);}
.form1 dd.minh_row3 > *, .form1 dd.minh_row3 > textarea, .form1 dd.minh_row3 > p {min-height:inherit !important;}
.form1 dd.minh_row5 {min-height:calc(1.3em * 5 + 10px);}
.form1 dd.minh_row5 > *, .form1 dd.minh_row5 > textarea, .form1 dd.minh_row5 > p {min-height:inherit !important;}
/* 2025-01-15: Chiuhua + 250107762, 新增 textarea 欄位檢查特殊樣式 */
.form1 dd[class*="minh_row"].ddhint > small, .form1 dd[class*="minh_row"].dderr > small {min-height:unset !important;}

/* form1 - dt, dd 單行高一點 minh_row1higher */
/* 2022-09-28: Chiuhua + 220901528, 新增 form1 欄位加高樣式 .minh_row1higher 以修正 dd 空資料跑版問題, 歐吉線上訂單需求 */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 dt.minh_row1higher, .form1 dd.minh_row1higher {/* min-height:40px; */min-height:2.5rem;}
.form1 dt.minh_row1higher > *, .form1 dd.minh_row1higher > * {min-height:inherit;}
.form1 dt.minh_row1higher {/* line-height:38px !important; */line-height:2.5rem !important;}

/* form1 - dt, dd 分 2 欄 */
.form1 dt[class*="dt2col_"], .form1 dd[class*="dd2col_"] {}
.form1 dt[class*="dt2col_"] > * {display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;}
.form1 dt[class*="dt2col_"] > * * {overflow:inherit;text-overflow:inherit;}
.form1 .dt2col_37 > *:nth-child(1), .form1 .dd2col_37 > *:nth-child(1) {width:30%;}
.form1 .dt2col_37 > *:nth-last-child(1), .form1 .dd2col_37 > *:nth-last-child(1) {width:calc(70% - 4px);float:right;}
.form1 .dt2col_46 > *:nth-child(1), .form1 .dd2col_46 > *:nth-child(1) {width:40%;}
.form1 .dt2col_46 > *:nth-last-child(1), .form1 .dd2col_46 > *:nth-last-child(1) {width:calc(60% - 4px);float:right;}
.form1 .dt2col_55 > *:nth-child(1), .form1 .dt2col_55 > *:nth-last-child(1),
.form1 .dd2col_55 > *:nth-child(1), .form1 .dd2col_55 > *:nth-last-child(1) {width:calc(50% - 2px);}
.form1 .dt2col_55 > *:nth-last-child(1), .form1 .dd2col_55 > *:nth-last-child(1) {float:right;}
.form1 .dt2col_64 > *:nth-child(1), .form1 .dd2col_64 > *:nth-child(1) {width:60%;}
.form1 .dt2col_64 > *:nth-last-child(1), .form1 .dd2col_64 > *:nth-last-child(1) {width:calc(40% - 4px);float:right;}
.form1 .dt2col_73 > *:nth-child(1), .form1 .dd2col_73 > *:nth-child(1) {width:70%;}
.form1 .dt2col_73 > *:nth-last-child(1), .form1 .dd2col_73 > *:nth-last-child(1) {width:calc(30% - 4px);float:right;}
.form1 .dt2col_82 > *:nth-child(1), .form1 .dd2col_82 > *:nth-child(1) {width:80%;}
.form1 .dt2col_82 > *:nth-last-child(1), .form1 .dd2col_82 > *:nth-last-child(1) {width:calc(20% - 4px);float:right;}

/* form1 - dt, dd 分 2 欄 - 手機垂直 gap 縮小 1px (2017 APP 規格, by Ho) */
@media all and (max-width:599px) {
.form1 .dt2col_37 > *:nth-last-child(1), .form1 .dd2col_37 > *:nth-last-child(1) {width:calc(70% - 3px);}
.form1 .dt2col_46 > *:nth-last-child(1), .form1 .dd2col_46 > *:nth-last-child(1) {width:calc(60% - 3px);}
.form1 .dt2col_55 > *:nth-child(1), .form1 .dd2col_55 > *:nth-child(1) {width:calc(50% - 1px);}
.form1 .dt2col_55 > *:nth-last-child(1), .form1 .dd2col_55 > *:nth-last-child(1) {width:calc(50% - 2px);}
.form1 .dt2col_64 > *:nth-last-child(1), .form1 .dd2col_64 > *:nth-last-child(1) {width:calc(40% - 3px);}
.form1 .dt2col_73 > *:nth-last-child(1), .form1 .dd2col_73 > *:nth-last-child(1) {width:calc(30% - 3px);}
.form1 .dt2col_82 > *:nth-last-child(1), .form1 .dd2col_82 > *:nth-last-child(1) {width:calc(20% - 3px);}
.form1 .dd2col_gender > *:nth-child(1) {width:calc(100% - 7.5rem - 3px);}
}

/* dd3col 分 3 欄, 2020-09-15: Chiuhua + 200500938, JLR 預約網頁需求 */
.form1 .dd3col_333 {font-size:0px;}
.form1 .dd3col_333 > *:not(ins) {width:calc((100% - 8px) / 3) !important;width:calc((99.9% - 8px) / 3)\0 !important;margin-left:4px;}
.form1 .dd3col_333 > *:nth-child(1) {margin-left:0px;}
.form1 dd[class*="dd3col_333 ddins_"] > *:not(ins) {width:calc((100% - 1.2rem * 2) / 3) !important;width:calc((99.9% - 1.2rem * 2) / 3)\0 !important;}
/* form1 - dd 分 3 欄 - 手機垂直 gap 縮小 1px (follow 2017 APP 規格, by Ho) */
@media all and (max-width:599px) {
.form1 .dd3col_333 > *:not(ins) {width:calc((100% - 6px) / 3) !important;width:calc((99.9% - 6px) / 3)\0 !important;margin-left:3px;}
}

/* form1 - dt, dd 加分隔號, 分隔字 */
dt[class*="dtins_"], dd[class*="ddins_"] {font-size:0px;}
dt[class*="dtins_"] > *, dd[class*="ddins_"] > * {margin:0px !important;}
dt[class*="dtins_"] > ins, dd[class*="ddins_"] > ins {display:inline-block;text-align:center;border:none !important;box-shadow:none;}
dt[class*="dtins_word"] > ins, dd[class*="ddins_word"] > ins {font-size:0.875rem;}

/* 加分隔號, 加分隔字 - 1 字 */
.dtins_symbol > ins, .dtins_word_1 > ins, .ddins_symbol > ins, .ddins_word_1 > ins {width:1.2rem !important;}
.dtins_symbol > ins, .ddins_symbol > ins {font-weight:bold;}
.dtins_symbol.dt2col_37 > *:nth-child(1), .dtins_word_1.dt2col_37 > *:nth-child(1),
.ddins_symbol.dd2col_37 > *:nth-child(1), .ddins_word_1.dd2col_37 > *:nth-child(1) {width:calc(30% - 0.6rem);}
.dtins_symbol.dt2col_37 > *:nth-last-child(1), .dtins_word_1.dt2col_37 > *:nth-last-child(1),
.ddins_symbol.dd2col_37 > *:nth-last-child(1), .ddins_word_1.dd2col_37 > *:nth-last-child(1) {width:calc(70% - 0.6rem);}
.dtins_symbol.dt2col_46 > *:nth-child(1), .dtins_word_1.dt2col_46 > *:nth-child(1),
.ddins_symbol.dd2col_46 > *:nth-child(1), .ddins_word_1.dd2col_46 > *:nth-child(1) {width:calc(40% - 0.6rem);}
.dtins_symbol.dt2col_46 > *:nth-last-child(1), .dtins_word_1.dt2col_46 > *:nth-last-child(1),
.ddins_symbol.dd2col_46 > *:nth-last-child(1), .ddins_word_1.dd2col_46 > *:nth-last-child(1) {width:calc(60% - 0.6rem);}
.dtins_symbol.dt2col_55 > *:nth-child(1), .dtins_word_1.dt2col_55 > *:nth-child(1),
.dtins_symbol.dt2col_55 > *:nth-last-child(1), .dtins_word_1.dt2col_55 > *:nth-last-child(1),
.ddins_symbol.dd2col_55 > *:nth-child(1), .ddins_word_1.dd2col_55 > *:nth-child(1),
.ddins_symbol.dd2col_55 > *:nth-last-child(1), .ddins_word_1.dd2col_55 > *:nth-last-child(1) {width:calc(50% - 0.6rem);}
.dtins_symbol.dt2col_64 > *:nth-child(1), .dtins_word_1.dt2col_64 > *:nth-child(1),
.ddins_symbol.dd2col_64 > *:nth-child(1), .ddins_word_1.dd2col_64 > *:nth-child(1) {width:calc(60% - 0.6rem);}
.dtins_symbol.dt2col_64 > *:nth-last-child(1), .dtins_word_1.dt2col_64 > *:nth-last-child(1),
.ddins_symbol.dd2col_64 > *:nth-last-child(1), .ddins_word_1.dd2col_64 > *:nth-last-child(1) {width:calc(40% - 0.6rem);}
.dtins_symbol.dt2col_73 > *:nth-child(1), .dtins_word_1.dt2col_73 > *:nth-child(1),
.ddins_symbol.dd2col_73 > *:nth-child(1), .ddins_word_1.dd2col_73 > *:nth-child(1) {width:calc(70% - 0.6rem);}
.dtins_symbol.dt2col_73 > *:nth-last-child(1), .dtins_word_1.dt2col_73 > *:nth-last-child(1),
.ddins_symbol.dd2col_73 > *:nth-last-child(1), .ddins_word_1.dd2col_73 > *:nth-last-child(1) {width:calc(30% - 0.6rem);}
.dtins_symbol.dt2col_82 > *:nth-child(1), .dtins_word_1.dt2col_82 > *:nth-child(1),
.ddins_symbol.dd2col_82 > *:nth-child(1), .ddins_word_1.dd2col_82 > *:nth-child(1) {width:calc(80% - 0.6rem);}
.dtins_symbol.dt2col_82 > *:nth-last-child(1), .dtins_word_1.dt2col_82 > *:nth-last-child(1),
.ddins_symbol.dd2col_82 > *:nth-last-child(1), .ddins_word_1.dd2col_82 > *:nth-last-child(1) {width:calc(20% - 0.6rem);}

/* 加分隔字 - 2 字 */
.dtins_word_2 > ins, .ddins_word_2 > ins {width:2.2rem !important;}
.dtins_word_2.dt2col_37 > *:nth-child(1), .ddins_word_2.dd2col_37 > *:nth-child(1) {width:calc(30% - 1.1rem);}
.dtins_word_2.dt2col_37 > *:nth-last-child(1), .ddins_word_2.dd2col_37 > *:nth-last-child(1) {width:calc(70% - 1.1rem);}
.dtins_word_2.dt2col_46 > *:nth-child(1), .ddins_word_2.dd2col_46 > *:nth-child(1) {width:calc(40% - 1.1rem);}
.dtins_word_2.dt2col_46 > *:nth-last-child(1), .ddins_word_2.dd2col_46 > *:nth-last-child(1) {width:calc(60% - 1.1rem);}
.dtins_word_2.dt2col_55 > *:nth-child(1), .dtins_word_2.dt2col_55 > *:nth-last-child(1),
.ddins_word_2.dd2col_55 > *:nth-child(1), .ddins_word_2.dd2col_55 > *:nth-last-child(1) {width:calc(50% - 1.1rem);}
.dtins_word_2.dt2col_64 > *:nth-child(1), .ddins_word_2.dd2col_64 > *:nth-child(1) {width:calc(60% - 1.1rem);}
.dtins_word_2.dt2col_64 > *:nth-last-child(1) , .ddins_word_2.dd2col_64 > *:nth-last-child(1) {width:calc(40% - 1.1rem);}
.dtins_word_2.dt2col_73 > *:nth-child(1), .ddins_word_2.dd2col_73 > *:nth-child(1) {width:calc(70% - 1.1rem);}
.dtins_word_2.dt2col_73 > *:nth-last-child(1), .ddins_word_2.dd2col_73 > *:nth-last-child(1) {width:calc(30% - 1.1rem);}
.dtins_word_2.dt2col_82 > *:nth-child(1), .ddins_word_2.dd2col_82 > *:nth-child(1) {width:calc(80% - 1.1rem);}
.dtins_word_2.dt2col_82 > *:nth-last-child(1), .ddins_word_2.dd2col_82 > *:nth-last-child(1) {width:calc(20% - 1.1rem);}

/* 加分隔字 - 3 字 */
.dtins_word_3 > ins, .ddins_word_3 > ins {width:3.2rem !important;}
.dtins_word_3.dt2col_37 > *:nth-child(1), .ddins_word_3.dd2col_37 > *:nth-child(1) {width:calc(30% - 1.6rem);}
.dtins_word_3.dt2col_37 > *:nth-last-child(1), .ddins_word_3.dd2col_37 > *:nth-last-child(1) {width:calc(70% - 1.6rem);}
.dtins_word_3.dt2col_46 > *:nth-child(1), .ddins_word_3.dd2col_46 > *:nth-child(1) {width:calc(40% - 1.6rem);}
.dtins_word_3.dt2col_46 > *:nth-last-child(1), .ddins_word_3.dd2col_46 > *:nth-last-child(1) {width:calc(60% - 1.6rem);}
.dtins_word_3.dt2col_55 > *:nth-child(1), .dtins_word_3.dt2col_55 > *:nth-last-child(1),
.ddins_word_3.dd2col_55 > *:nth-child(1), .ddins_word_3.dd2col_55 > *:nth-last-child(1) {width:calc(50% - 1.6rem);}
.dtins_word_3.dt2col_64 > *:nth-child(1), .ddins_word_3.dd2col_64 > *:nth-child(1) {width:calc(60% - 1.6rem);}
.dtins_word_3.dt2col_64 > *:nth-last-child(1), .ddins_word_3.dd2col_64 > *:nth-last-child(1) {width:calc(40% - 1.6rem);}
.dtins_word_3.dt2col_73 > *:nth-child(1), .ddins_word_3.dd2col_73 > *:nth-child(1) {width:calc(70% - 1.6rem);}
.dtins_word_3.dt2col_73 > *:nth-last-child(1), .ddins_word_3.dd2col_73 > *:nth-last-child(1) {width:calc(30% - 1.6rem);}
.dtins_word_3.dt2col_82 > *:nth-child(1), .ddins_word_3.dd2col_82 > *:nth-child(1) {width:calc(80% - 1.6rem);}
.dtins_word_3.dt2col_82 > *:nth-last-child(1), .ddins_word_3.dd2col_82 > *:nth-last-child(1) {width:calc(20% - 1.6rem);}

/* 切換 form1_row 不好處理, 先不開放
.form1 .dd2col_withdt {width:calc(50% - 5rem);} */

/* form1 - 電話,地址樣式 */
.form1 dd.ddtel > *:not(button), .form1 .ddaddr > *:not(button) {float:left;}
/* 電話 */
.form1 dd.ddtel {}
.form1 dd.ddtel > *:not(:nth-child(1)) {border-top-left-radius:0px !important;}
.form1 dd.ddtel > *:not(:nth-child(1)) {border-bottom-left-radius:0px !important;}
.form1 dd.ddtel > *:not(:nth-last-child(1)) {border-top-right-radius:0px !important;}
.form1 dd.ddtel > *:not(:nth-last-child(1)) {border-bottom-right-radius:0px !important;}
.form1 dd.ddtel > input:not(:nth-of-type(1)) {margin-left:2px;}
.form1 dd.ddtel > input:nth-of-type(1) {width:2.4em;}
.form1 dd.ddtel > input:nth-of-type(2) {width:calc(100% - 2.4em - 3em - 2.2em - 2px * 2);}
.form1 dd.ddtel > input:nth-of-type(3) {width:3em;text-align:center;padding:0px !important;}
.form1 dd.ddtel > i {width:2.2em;position:relative;cursor:pointer;opacity:1;}
/* .ddtel_iconone, 電話欄位不需 icon 時的加套樣式 */
.form1 dd.ddtel.ddtel_iconone > input:nth-of-type(2) {width:calc(100% - 2.4em - 3em - 2px * 2);}
/* 地址 */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 .ddaddr {height:auto;/* min-height:56px;/* 26px x 2行 + 4px gap */min-height:calc(2rem * 2 + 4px);}
.form1 .ddaddr > *:not(:nth-child(1)) {border-top-left-radius:0px !important;}
.form1 .ddaddr > *:not(:nth-child(2)) {border-top-right-radius:0px !important;}
.form1 .ddaddr > *:not(:nth-child(3)) {border-bottom-left-radius:0px !important;border-bottom-right-radius:0px !important;}
.form1 .ddaddr > *:nth-child(1), .form1 .ddaddr > *:nth-child(2) {/* min-height:27px;/* 26px + 1px */min-height:calc(2rem + 1px);margin-bottom:2px;}
.form1 .ddaddr > *:nth-child(1) {width:3.3em;}
.form1 .ddaddr > *:nth-child(2) {width:calc(100% - 2px - 3.3em);margin-left:2px;}
.form1 .ddaddr > textarea {/* min-height:27px !important;/* 26px + 1px */min-height:calc(2rem + 1px) !important;}
/*
@media all and (min-width:600px) {
.form1 .ddaddr {height:auto;min-height:60px;/* 28px x 2行 + 4px gap }
.form1 .ddaddr > input:nth-child(1), .form1 .ddaddr > input:nth-child(2) {min-height:29px;/* 28px + 1px}
.form1 .ddaddr > textarea {min-height:29px !important;/* 28px + 1px}
}
*/

/* form1 - dd 性別欄位 */
/* 2022-09-22: Chiuhua + 220901528, 新增 form1 性別欄位, 歐吉線上訂單需求 */
/* 2023-01-07: Chiuhua # 230100301, form1 性別欄位自主改良, 去除 gap 及接縫餘線 (改良 form1 有線條時樣式太複雜) */
.form1 .dd2col_gender > *:nth-child(1) {width:calc(100% - 7.5rem - 2px);border-top-right-radius:0px !important;border-bottom-right-radius:0px !important;}
.form1 .dd2col_gender > *:nth-last-child(1) {width:7.5rem;float:right;white-space:nowrap !important;border-top-left-radius:0px !important;border-bottom-left-radius:0px !important;}

/* form1_psi_wrapper 個人資料區塊 (psi = personal info) */
/* 2023-01-09: Chiuhua + 230100301, 新增 .form1_psi_wrapper 個人資料區塊樣式差異 */
.form1_psi_wrapper {display:inline-block;vertical-align:top;}
.form1_psi_wrapper > .form1 dt {width:7.5rem;}
.form1_psi_wrapper > .form1 dd {width:calc(100% - 7.5rem);}
.form1_psi_wrapper .form1 .dd2col_gender > *:nth-child(1), .form1_psi_wrapper .form1 dd.ddtel > input:nth-of-type(1) {width:4rem;}
.form1_psi_wrapper .form1 .dd2col_gender > *:nth-last-child(1), .form1_psi_wrapper .form1 dd.ddtel > input:nth-of-type(2) {width:calc(100% - 4rem - 2px);}
.form1_psi_wrapper dd *.lbcbx_row1, .form1_psi_wrapper dd *.lbrdo_row1 {white-space:nowrap !important;}
@media all and (min-width:768px) {
.form1_psi_wrapper .rwd_dl2col {width:50%;float:left;}
}
@media all and (min-width:768px) and (max-width:800px) {
.form1_psi_wrapper .rwd_dl2col .lbrdo_wrapper label:not(:nth-last-child(1)),
.form1_psi_wrapper .rwd_dl2col .lbcbx_wrapper label:not(:nth-last-child(1)) {padding-right:0.75em;}
}

/* form1 - span.joinitem */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 span.joinitem {display:table;width:100%;/* min-height:26px; */}
.form1 span.joinitem > * {display:table-cell;height:100%;white-space:nowrap;/* padding-right:5px; */padding-right:0.35rem;background-color:transparent !important;}
.form1 span.joinitem > *:nth-child(1) {border-top-left-radius:inherit;border-bottom-left-radius:inherit;}
.form1 span.joinitem > *:nth-last-child(1) {border-top-right-radius:inherit;border-bottom-right-radius:inherit;}
.form1 span.joinitem > *:not(:nth-child(1)) {text-align:right;}
.form1 span.joinitem > *:not(:nth-last-child(1)) {padding-right:0px;}
.form1 span.joinitem > input:not([type="checkbox"]):not([type="radio"]) {vertical-align:bottom;}
.form1 span.joinitem > i {width:2.2em;position:relative;cursor:pointer;}
.form1 i img {height:1.3em;position:absolute;left:0px;right:0px;top:0px;bottom:0px;margin:auto;opacity:0.5;}
.form1 dd textarea ~ i img, .form1 dd p ~ i img {top:3px;bottom:auto;}
.form1 i img[src*="mail_"], .form1 i img[src*="msg2_"] {width:1.4em;height:auto;}
.form1 i img[src*="percent_"] {height:1.1em;}
.form1 i img[src*="number_"] {height:1em;}
/*
@media all and (min-width:600px) {
.form1 span.joinitem {min-height:28px;}
}
*/

/* 2022-09-20: Chiuhua + 220901528, form1 下拉欄位加隱藏 input, 歐吉線上訂單需求 (相關 # Ys) */
.form1 span.joinitem > input[type="hidden"] {position:absolute;width:0px;height:0px;line-height:0px;padding:0px;}
.form1 span.joinitem > input[type="hidden"] + * {text-align:left;}

/* form1 特殊欄位樣式統一定義 */
.form1 dd.ddtel > input, .form1 .ddaddr > *:nth-child(1), .form1 .dd2col_gender > *:nth-child(1) {padding-right:2px !important;}

/*=== form1 End ===*/

/*=== form1 dtrow, form1_row, rwd_row 一併定義 Start ===*/
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
/* 2025-09-19: Chiuhua # 250900888, oTToCity 各品牌 表格樣式盤整 */
.form1 .dtrow, .form1.form1_row dt {height:1.6rem;min-height:1.6rem;line-height:1.6rem !important;text-align:left;margin-bottom:0px;padding-right:0px;}
.form1 .dtrow *, .form1.form1_row dt *, .form1.rwd_row dt * {line-height:inherit !important;}
@media all and (max-width:599px) {
.form1 .rwd_dtrow, .form1.rwd_row dt {height:1.6rem;min-height:1.6rem;line-height:1.6rem !important;text-align:left;margin-bottom:0px;padding-right:0px;}
}
/*=== form1 dtrow, form1_row, rwd_row 一併定義 End ===*/

/* form1 - dt, dd 單行 */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1 .dtrow, .form1 .ddrow {width:100% !important;}
@media all and (max-width:599px) {
.form1 .rwd_dtrow, .form1 .rwd_ddrow {width:100% !important;}
}

/*=== form1_row Start ===*/
/* 2020-07-09: Chiuhua + 200500938, 新增 .form1_row 樣式 (從 .form1 繼承加套), JLR 預約網頁需求 */
/* 2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存 */
/* 2025-05-15: Chiuhua # 250505490, 調整 form1_row dt btn */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1.form1_row dt, .form1.form1_row dd {width:100%;}
.form1.form1_row dt {/* height:24px;min-height:24px;text-align:left;padding-right:0px; */}
.form1.form1_row dt:not(:nth-of-type(1)) {margin-top:10px;}
.form1.form1_row dt * {/* line-height:24px !important; */}
.form1.form1_row dt button {/* height:21px;line-height:21px; */height:calc(100% - 2px) !important;}
.form1.form1_row dt button > i {/* height:13px;line-height:13px; */height:60%;background-size:auto 100%;}
.form1.form1_row dt button > *:not(i) {height:1.2em;line-height:1.2em !important;top:unset;}
/* form1 form1_row - span.joinitem - for dt */
.form1.form1_row dt > span.joinitem {height:inherit;position:relative;}
.form1.form1_row dt > span.joinitem > * {position:absolute;}
.form1.form1_row dt > span.joinitem > *:nth-child(1) {max-width:calc(100% - 4rem);overflow:hidden;text-overflow:ellipsis;}
.form1.form1_row dt > span.joinitem > *:nth-last-child(1) {top:0px;right:0px;padding-right:0px;background-color:transparent;margin:0px;}
.form1.form1_row dt > span.joinitem > .btn_rect_wrap1 {width:auto;}
.form1.form1_row dt > span.joinitem > .btn_rect_wrap1 button {display:inline-flex;align-items:center;min-width:auto;margin:0px;margin-left:10px;vertical-align:top;}
.form1.form1_row dt > span.joinitem > .btn_rect_wrap1 button > i {margin-top:unset;}
/*
@media all and (min-width:600px) {
.form1.form1_row dt {height:26px;min-height:26px;}
.form1.form1_row dt * {line-height:26px !important;}
.form1.form1_row dt button {height:23px;line-height:23px;}
.form1.form1_row dt button > i {height:15px;line-height:15px;}
}
*/

/* form1_row_groupwrapper, dl2col_wrapper */
/* 2025-01-13: Chiuhua + 250107166, 新增 .form1_row_groupwrapper 及 .dl2col_wrapper 樣式, 相關需求: STLA 旗下品牌 聯絡我們網頁, FORD 線上新車訂單 */
.form1_row_groupwrapper {display:flex;flex-direction:column;gap:1rem;}
.form1_row_groupwrapper .dl2col_wrapper {display:flex;gap:0.5rem;}
@media all and (max-width:599px) {
.form1_row_groupwrapper .dl2col_wrapper {flex-direction:column;gap:inherit;}
}
/*=== form1_row End ===*/

/*=== form1 rwd_row Start ===*/
/* 2025-07-28: Chiuhua + 250702700, 新增 .form1.rwd_row 樣式 (APP Order+ 手機版 RWD 延伸) */
/* 2025-09-19: Chiuhua # 250900888, oTToCity 各品牌 表格樣式盤整 */
@media all and (max-width:599px) {
.form1.rwd_row dt, .form1.rwd_row dd {width:100%;}
.form1.rwd_row dt:not(:nth-of-type(1)) {margin-top:10px;}
}
/*=== form1 rwd_row End ===*/


/*=== form1_readonly Start ===*/
/* 2020-09-18: Chiuhua + 200500938, 新增 .form1_readonly 樣式 (從 .form1 繼承加套), JLR 預約網頁需求 */
/* 2021-01-27: Chiuhua # 200500938, 修正 .form1_readonly 在 GC 瀏覽器縮小至 90% 樣式跑版 (IE 與 FF 無此問題), JLR 預約網頁需求 */
/* 2025-08-08: Chiuhua # 250702972, 調整 form1_readonly dt, dd overflow 預設 hidden */
/* 2025-09-11: Chiuhua # 250900886, oTToCity form1 改良 */
.form1_readonly {display:table;width:100%;}
.form1_readonly dt, .form1_readonly dd {display:table-cell;/* min-height:20px; */min-height:1.25rem;line-height:1.25rem;overflow:hidden;/* margin:2px 0px; */margin:0.15rem 0px;float:left;}
.form1_readonly dt *, .form1_readonly dd * {font-weight:inherit;line-height:inherit;}
.form1_readonly dt {width:5rem;font-size:0.875rem;text-align:right;padding-right:5px;white-space:nowrap;overflow:hidden;}
.form1_readonly dt * {font-size:inherit;}
.form1_readonly dd {width:calc(100% - 5rem);word-break:break-word;color:hsl(220,100%,38%);}
/* ※ 2021-01-17: Chiuhua # 200500938, 取消使用以下 2 行 copy 自 app 的樣式, 因為在 GC 瀏覽器縮小至 90% 樣式會跑版, 若要在 dd 內加其它 tag, 需另設計做法
.form1_readonly dd > * {display:table-cell;vertical-align:top;word-break:break-word;padding-right:5px;}
.form1_readonly dd > *:nth-last-child(1) {padding-right:0px;} */
.form1_readonly dt.dtrow, .form1_readonly dd.ddrow {width:100% !important;}
.form1_readonly dt.dtrow {text-align:left;padding-right:unset;}

/* dt 加寬 */
/* dt7word, 標題 7 個中文字, 繼承加套 */
.form1_readonly.form1_readonly_dt7w dt {width:7rem;}
.form1_readonly.form1_readonly_dt7w dd {width:calc(100% - 7rem);}
/* dt9word, 標題 9 個中文字, 繼承加套 */
.form1_readonly.form1_readonly_dt9w dt {width:9rem;}
.form1_readonly.form1_readonly_dt9w dd {width:calc(100% - 9rem);}

/* span.joinitem */
/* 2025-05-13: Chiuhua + 250505190, 新增 form1_readonly span.joinitem 樣式 (邏輯與 form1 相同) */
.form1_readonly span.joinitem {display:flex;justify-content:space-between;gap:0.5em;}
.form1_readonly span.joinitem > *:nth-last-child(1) {text-align:right;}

/* rwd_auto2row 手機自適應樣式 */
/* 2025-05-13: Chiuhua + 250505190, 新增 form1_readonly .rwd_auto2row 手機 RWD 樣式，讓手機 dt dd 自適應成 row 排列 */
/* 2025-08-12: Chiuhua - 250702972, 移除 手機自適應樣式 rwd_auto2row, 因樣式已整合為 .form1_readonly.rwd_row */

/* 父層 form1_readonly_par */
/* 2025-03-28: Chiuhua + 250400376, 新增 .form1_readonly_par 父層樣式 (STLA onlineservice 確認頁 加線條需求) */
.form1_readonly_par {border:1px solid hsla(0,0%,0%,0.5);padding:0.5rem;}

/*=== form1_readonly_row Start ===*/
/* 2025-08-11: Chiuhua + 250702972, 新增 .form1_readonly_row 樣式 (APP Order+ 手機版 需求, oTToCity 同步新增) */
.form1_readonly.form1_readonly_row dt, .form1_readonly.form1_readonly_row dd {width:100%;}
.form1_readonly.form1_readonly_row dt {text-align:left;margin-bottom:0px;}
.form1_readonly.form1_readonly_row dd {margin-top:0px;}
/*=== form1_readonly_row End ===*/

/*=== form1_readonly rwd_row Start ===*/
/* 2025-08-11: Chiuhua + 250702972, 新增 .form1_readonly.rwd_row 樣式 (APP Order+ 手機版 需求, oTToCity 同步新增) */
@media all and (max-width:599px) {
.form1_readonly.rwd_row dt, .form1_readonly.rwd_row dd {width:100% !important;}
.form1_readonly.rwd_row dt {text-align:left;margin-bottom:0px;}
.form1_readonly.rwd_row dd {margin-top:0px;}
}
/*=== form1_readonly rwd_row End ===*/
