/**
  @file       genwrapper.ottocity.css
  @date       2020-09-07: Chiuhua + 200500938, Create
  @date       2022-06-22: Chiuhua + 220300968, 新增 櫥窗樣式 (pdsc = product showcase)
  @date       2022-09-26: Chiuhua - 220800337, step_wrapper 手機 RWD 從樣版移至 JLR 商店差異
  @date       2022-11-28: Chiuhua # 220802029, 調整 .form_wrapper 移至 genwrapper.ottocity.css 統一定義
  @date       2022-11-28: Chiuhua # 221112094, 圖形驗證碼樣式整合至 genfwrapper.ottocity.css 共用, .passcode_wrap 更名為 .form_passcode 並加父層 wrapper 以做版面 RWD
  @date       2023-05-19: Chiuhua + 230302504, 新增 .form1.form1_row.form_passcode 組合樣式, FORD 線上訂單 需求
  @date       2023-05-30: Chiuhua # 230501310, form_passcode img 樣式改良, 預設不變形, 特殊情況再加高, oTToCity 線上服務延伸調整
  @date       2023-06-05: Chiuhua + 230302504, 新增 圖形驗證碼 加 dderr 組合樣式, FORD 線上訂單 需求
  @date       2023-08-15: Chiuhua + 230601756, 新增 .pdsc_category_wrapper 商品櫥窗的 :hover 互動樣式 (套用櫥窗的品牌一併優化)
  @date       2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存
  @date       2025-01-16: Chiuhua + 250107863, 漢堡下拉選單樣式模組從 modern 整理至共用 wrapper 並做樣版及品牌差異 (STLA onlineservice 延伸改良)
  @date       2025-09-15: Chiuhua # 250900886, oTToCity form1 改良, 時間提示訊息樣式從 onlineservice2.ottocity.css 移至 genwrapper.ottocity.css 共用
  @date       2025-11-05: Chiuhua # 251100266, 改良 圖形驗證碼 Wrapper button 滑鼠互動樣式
  @date       2025-11-28: Chiuhua + 251102520, 新增 .gdsc_modular_wrapper 共用櫥窗模組 樣式, Portal2 車商新功能 需求
  @date       2025-12-08: Chiuhua # 251200806, 改良 共用與 shop 櫥窗
  @date       2025-12-30: Chiuhua # 260101094, 強化 shop 櫥窗樣式 - 文字過長情境 (最多2行, 超過省略...)
  @date       2026-01-14: Chiuhua # 260101093, 漢堡下拉新增 :active 微互動樣式
  @date       2026-01-23: Chiuhua + 260140903, 新增 .gdsc_ucar_byowner [車主自售] 櫥窗樣式
  @date       2026-03-09: Chiuhua + 260300910, 新增 .gdsc_ucar [二手車] 櫥窗樣式
  @date       2026-03-11: Chiuhua # 260301194, 強化 共用櫥窗模組與繼承樣式
  @date       2026-03-17: Katie   # 251102028, 優質車商 地圖按鈕，改至地址後面(非裝置版的時候)(by Ho)
	@date       2026-03-26: Chiuhua # 251102028, 整理 shop 櫥窗特殊處理語法 (將 Katie 原本穿插在上方標準樣式內的差異語法抽離歸類), 並改良此樣式地址文字與按鈕 gap 太貼近的問題
*/

/*=== 漢堡下拉選單樣式模組 Start ===*/
/* 2021-06-04: Chiuhua + 210501509, hamb_icon 樣式從 fordassured 移至 modern */
/* 2021-06-04: Chiuhua # 191001009, 漢堡下拉選單樣式原作者為 Ys 與 Ellen */
/* 2021-06-04: Chiuhua + 210501509, 漢堡下拉選單樣式 從 fordassured.ottocity.css 移至此樣版檔, 商店內僅留差異樣式 */
/* 2021-06-04: Chiuhua # 210501509, 修正 drop_wrapper 未與 hamb icon 一起做 RWD 穩藏的 bug */
/* 2021-10-04: Ellen   # 210600294, 漢堡下拉選單 增加淡出動畫樣式, 修正 漢堡選單 scroll 異常 (在 .pg_wrapper 子層加 .otto_main 切版) */
/* 2022-01-06: Chiuhua # 210501509, 調整 漢堡下拉顏色語法 */
/* 2022-06-09: Chiuhua # 220300968, 調整 下拉選單文字色語法, MAZDA CPO 需求 */
/* 2022-09-05: Chiuhua # 220802029, 調整 漢堡下拉選單相關樣式 */
/* 2025-01-16: Chiuhua + 250107863, 漢堡下拉選單樣式模組從 modern 整理至共用 wrapper 並做樣版及品牌差異 (STLA onlineservice 延伸改良) */
/* 2026-01-14: Chiuhua # 260101093, 漢堡下拉新增 :active 微互動樣式 */
.hamb_icon {}
.hamb_icon > i {width:60px;height:100%;min-height:1.5em;cursor:pointer;}
.drop_wrapper {position:fixed;top:60px;left:0px;height:calc(100% - 60px);background:hsla(0,0%,0%,0.4) !important;padding:0px !important;z-index:99;}
.drop_list_main {overflow-y:auto;height:100%;transition:width 0.5s, min-width 0.5s, opacity 0.5s;}
.drop_list {width:100%;background-color:#FFF;color:inherit;box-shadow:0px 3px 10px hsla(0,0%,0%,0.5);border:solid #FFF;border-width:0px;overflow:hidden;}
.drop_list * {color:inherit;}
.drop_list > li {height:3.5rem;line-height:3.5rem;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;position:relative;}
.drop_list > li:hover, .drop_list > li:active {font-weight:bold;transition:background-color 0.5s;}
.drop_list > li a {text-decoration:none;}
.drop_list > li > * {display:inline-block;vertical-align:middle;text-align:left;overflow:inherit;text-overflow:inherit;font-weight:inherit;}
.drop_list > li > *:not(i) {max-width:80%;}
.drop_list > li > *:not(i):after {content:'';position:absolute;right:20px;top:0px;bottom:0px;margin:auto;width:1em;height:1em;background:url(../image/caret_r_w_L.png) no-repeat center right / contain;opacity:0.5;}
.drop_list > li > i {text-align:center;margin-right:1em;}
.drop_list > li > i + span {width:auto;min-width:4.5em;max-width:65%;}
@media all and (min-width:1024px) {
.hamb_icon {display:none !important;}
.drop_wrapper {display:none;}
}
@media all and (min-width:600px) {
.drop_list {border-bottom-right-radius:0.35em;border-width:2px;border-top-width:0px;border-left-width:0px;}
.drop_list_main {width:0px;}
.drop_list_show > .drop_list_main {width:20em;max-width:unset;}
}
@media all and (max-width:599px) {
.drop_list {border-bottom-width:2px;}
.drop_list_main {width:0px;}
.drop_list_show > .drop_list_main {width:100%;}
}
/*=== 漢堡下拉選單樣式模組 End ===*/

/*=== form_wrapper Start ===*/
/* form_wrapper */
/* 2022-11-28: Chiuhua # 220802029, 調整 .form_wrapper 移至 genwrapper.ottocity.css 統一定義 */
.form_wrapper {padding:10px 0px 25px;}
.form_wrapper .btn_rect_wrap1 {margin-top:25px;}
/*=== form_wrapper End ===*/

/*=== step_wrapper Start ===*/
/* step_wrapper, 2020-09-07: Chiuhua + 200500938, JLR 預約網頁 需求 */
ul.step_wrapper {}
.step_wrapper li .title_step .mark_tri_r:before {border-left-color:#FFF;}
.step_wrapper li .form_wrapper {padding-left:45px;}

/* step_wrapper - step 狀態樣式 */
.step_wrapper li .title_step {cursor:pointer;}
.step_wrapper li.step_die, .step_wrapper li.step_die > * {cursor:not-allowed !important;}
.step_wrapper li.step_die .title_step > * {opacity:0.5 !important;}
.step_wrapper li.step_die .title_step i[class*="i_caret"] {display:none !important;}

/* step_wrapper - RWD - 手機 */
/* 2022-09-26: Chiuhua - 220800337, step_wrapper 手機 RWD 從樣版移至 JLR 商店差異 */
/*=== step_wrapper Start ===*/

/*=== 圖形驗證碼 Start ===*/
/* 2022-11-28: Chiuhua # 221112094, 圖形驗證碼樣式整合至 genfwrapper.ottocity.css 共用, .passcode_wrap 更名為 .form_passcode 並加父層 wrapper 以做版面 RWD */
/* 2025-11-05: Chiuhua # 251100266, 改良 圖形驗證碼 Wrapper button 滑鼠互動樣式 (btn_passcode 樣式從 genwrapper 移至 genlib css 檔定義) */
.passcode_wrapper {display:flex;flex-direction:column;align-items:center;}
/*
.passcode_wrapper .btn_passcode {font-size:0.8125em;background-color:#FFF !important;color:inherit !important;box-shadow:none !important;padding:0px 0.5em;}
.passcode_wrapper .btn_passcode > * {top:unset;margin-top:unset;}
.passcode_wrapper .btn_passcode > i {opacity:0.8 !important;}
*/

/* form_passcode 與 form_row_passcode 共用 */
/* 2023-05-30: Chiuhua # 230501310, form_passcode img 樣式改良, 預設不變形, 特殊情況再加高, oTToCity 線上服務延伸調整 */
.passcode_wrapper .form1.form_passcode > dd > span > img, .passcode_wrapper .form1.form_row_passcode > dd > span > img {width:100%;height:100%;vertical-align:top;}

/* form_passcode */
/* 2025-11-05: Chiuhua # 251100266, 改良 圖形驗證碼 Wrapper button 滑鼠互動樣式 */
.passcode_wrapper .form1.form_passcode > dd, .passcode_wrapper .form1.form_row_passcode > dt {overflow:visible;}
/* form1 form_passcode */
.passcode_wrapper > *:not([class*="form1_row"]) {display:inline-flex;width:auto;white-space:nowrap;}
.passcode_wrapper .form1.form_passcode {margin-top:0.625rem !important;margin-bottom:0.625rem !important;}
.passcode_wrapper .form1.form_passcode > * {width:auto;}
.passcode_wrapper .form1.form_passcode > dd {display:inline-flex;}
.passcode_wrapper .form1.form_passcode > dd > * {width:auto;height:100%;}
.passcode_wrapper .form1.form_passcode > dd > *:not(button) {width:5em;}
.passcode_wrapper .form1.form_passcode > dd > *:not(:nth-child(1)) {margin:0px;margin-left:0.5em;}
.passcode_wrapper .form1.form_passcode > dd .btn_passcode {border-radius:inherit;}
.passcode_wrapper .form1.form_passcode > dd .btn_passcode > i {margin-left:0px;margin-right:0px;}
/* form_row_passcode */
.passcode_wrapper .form1.form_row_passcode {margin-bottom:0.625rem !important;}

/* .form1.form1_row.form_passcode 組合樣式 */
/* 2023-05-19: Chiuhua + 230302504, 新增 .form1.form1_row.form_passcode 組合樣式, FORD 線上訂單 需求 */
/* 2023-06-05: Chiuhua + 230302504, 新增 圖形驗證碼 加 dderr 組合樣式, FORD 線上訂單 需求 */
/* 2024-07-04: Chiuhua # 240602259, 調整 tag, 因新的 Angular 不支援自定義的 lang tag, 系統部先不需調整 html tag，所以過渡期 css 語法 lang 與 label 並存 */
.passcode_wrapper .form1.form1_row.form_passcode > dt, .passcode_wrapper .form1.form1_row.form_passcode > dd {width:100%;}
.passcode_wrapper .form1.form1_row.form_passcode > dd > input {width:auto;max-width:30%;}
.passcode_wrapper .form1.form1_row.form_passcode .dderr {flex-wrap:wrap;}
.passcode_wrapper .form1.form1_row.form_passcode .dderr > *:not(small) {height:26px;}
.passcode_wrapper .form1.form1_row.form_passcode .dderr > small {width:100%;box-shadow:none !important;margin:0.5em 0px;}

/* msg_deadline */
/* 2025-09-15: Chiuhua # 250900886, oTToCity form1 改良, 時間提示訊息樣式從 onlineservice2.ottocity.css 移至 genwrapper.ottocity.css 共用 */
.msg_deadline {width:100%;text-align:center;font-weight:bold;}
.msg_deadline * {font-weight:inherit;}
.msg_deadline time {font-size:1.3em;padding:0px 0.25em;}

@media all and (min-width:600px) {
.passcode_wrapper .btn_rect_wrap1 button {min-width:13rem;}
.passcode_wrapper .btn_rect_wrap1 button:only-child {min-width:15rem;}
.passcode_wrapper .form1.form1_row.form_passcode .dderr > *:not(small) {height:28px;}
}
@media all and (max-width:599px) {
.passcode_wrapper .btn_rect_wrap1 button {min-width:9rem;}
.passcode_wrapper .form1.form_passcode > dd .btn_passcode > lang, .passcode_wrapper .form1.form_passcode > dd .btn_passcode > label {display:none;}
}

/*=== 圖形驗證碼 End ===*/

/*=== 櫥窗 Start ===*/
/* 櫥窗 - 商品分類 */
/* 2022-06-22: Chiuhua + 220300968, 新增 櫥窗樣式 (pdsc = product showcase) */
/* 2023-08-15: Chiuhua + 230601756, 新增 .pdsc_category_wrapper 商品櫥窗的 :hover 互動樣式 (套用櫥窗的品牌一併優化) */
.pdsc_category_wrapper {display:flex;flex-wrap:wrap;}
.pdsc_category_wrapper > li {display:inline-flex;flex-direction:column;width:auto;min-width:13rem;min-height:8.2rem;margin:5px;background-color:#FFF;border:1px solid hsl(0,0%,65%);border-radius:0.35em;overflow:hidden;cursor:default;position:relative;}
.pdsc_category_wrapper > li:not(.liDie):hover {box-shadow:0px 0px 10px 1px hsla(0,0%,0%,0.35);transition:box-shadow 0.2s;}
.pdsc_category_wrapper > li > * {position:absolute;width:100%;}
.pdsc_category_wrapper > li > label {height:100%;z-index:2;}
.pdsc_category_wrapper > li > label > h3 {line-height:1.2em;margin-top:-1.85rem;padding:0.45em 0.35em 0.25em 2em;}
.pdsc_category_wrapper > li > label > h3 * {line-height:inherit;font-weight:inherit;font-style:inherit;}
.pdsc_category_wrapper > li > label > h3 > *:not(:nth-child(1)) {margin-left:0.35em;}
.pdsc_category_wrapper > li > label.lbcbx {}
.pdsc_category_wrapper > li > label.lbcbx:before {top:auto;left:0.2em;}
.pdsc_category_wrapper > li > figure {bottom:0px;height:calc(100% - 2.2rem);}
.pdsc_category_wrapper > li > figure > img {position:absolute;left:0px;right:0px;top:51%;bottom:49%;margin:auto;max-width:90%;max-height:90%;}
.pdsc_category_wrapper > li.liOn {border-color:#000;}
.pdsc_category_wrapper > li.liDie {opacity:0.35;cursor:not-allowed;}
.pdsc_category_wrapper > li.liDie > * {cursor:inherit;}
@media all and (max-width:599px) {
.pdsc_category_wrapper > li {min-width:calc(50% - 10px);}
}

/* 共用櫥窗模組 Modular grids
   樣式名簡化 gdsc = grid showcase */
/* 2025-11-28: Chiuhua + 251102520, 新增 .gdsc_modular_wrapper 共用櫥窗模組 樣式, Portal2 車商新功能 需求 */
/* 2025-12-08: Chiuhua # 251200806, 改良 共用與 shop 櫥窗 */
/* 2026-03-11: Chiuhua # 260301194, 強化 共用櫥窗模組與繼承樣式 */
.gdsc_modular_wrapper {display:flex;flex-wrap:wrap;margin:1.5rem;gap:1.5rem;}
.gdsc_modular_wrapper * {line-height:1.2em;}
.gdsc_modular_wrapper > li {display:inline-flex;width:100%;min-height:7.5rem;gap:0.5rem;padding:1rem;background-color:#FFF;box-shadow:0px 0px 20px 2px hsla(0,0%,0%,0.15);transition:box-shadow 0.5s;border-radius:0.75rem;overflow:hidden;}
.gdsc_modular_wrapper > li:hover {box-shadow:0px 0px 30px hsla(0,0%,0%,0.5);}
.gdsc_modular_wrapper > li > * {}
.gdsc_modular_wrapper > li > .photo_single > figure {border:0px;}
.gdsc_modular_wrapper > li > .sub_wrapper {display:inline-flex;justify-content:space-between;gap:0.5em;}
.gdsc_modular_wrapper > li > .sub_wrapper > * {display:inline-flex;flex-direction:column;gap:0.3em;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > * {word-break:break-word;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dt {font-size:1.15em;font-weight:bold;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dt * {font-size:inherit;font-weight:inherit;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dt > *:not(:nth-last-child(1)) {margin-right:0.25em;}
/* .gdsc_modular_wrapper > li > .sub_wrapper > dl > dt > *:after {content:'\00A0';} 2026-03-09:Chiuhua # test */
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dd {display:inline-flex;gap:0.35em;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dd:not([class*="btn_"]) * {font-size:inherit;font-weight:inherit;line-height:inherit;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dd[class*="btn_rect"] {gap:0.5em;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dd[class*="btn_rnd"] {gap:1em;}
.gdsc_modular_wrapper > li > .sub_wrapper > dl > dd[class*="btn_"] > button {margin:0px;}
/* RWD */
@media all and (min-width:1280px) {
.gdsc_modular_wrapper > li {width:calc(100% / 3 - 1rem);}
}
@media all and (min-width:1024px) and (max-width:1280px) {
.gdsc_modular_wrapper > li {width:calc(100% / 2 - 1rem);}
}
@media all and (min-width:600px) {
.gdsc_modular_wrapper > li > .photo_single {flex:none;}
.gdsc_modular_wrapper:not([class*="_shop"]) > li > .sub_wrapper {flex:auto;}
}
@media all and (max-width:599px) {
.gdsc_modular_wrapper {margin:1rem;gap:1rem;}
.gdsc_modular_wrapper:not([class*="_shop"]) > li > .sub_wrapper {flex-direction:column;}
}

/* 櫥窗差異 - shop */
/* 2025-12-08: Chiuhua # 251200806, 改良 共用與 shop 櫥窗 */
/* 2025-12-30: Chiuhua # 260101094, 強化 shop 櫥窗樣式 - 文字過長情境 (最多2行, 超過省略...) */
/* 2026-03-11: Chiuhua # 260301194, 強化 共用櫥窗模組與繼承樣式 */
.gdsc_modular_wrapper.gdsc_shop {}
.gdsc_modular_wrapper.gdsc_shop > li {flex-direction:column;}
.gdsc_modular_wrapper.gdsc_shop > li > .photo_single {width:100%;height:auto;min-height:6rem;}
.gdsc_modular_wrapper.gdsc_shop > li > .photo_single > figure {background-size:auto 4rem;}
.gdsc_modular_wrapper.gdsc_shop > li > .photo_single > figure > img {position:unset;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl > dt {word-break:keep-all;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl > dd {line-height:1.1em;padding:0.07em 0px;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:nth-of-type(1) {gap:0.2em;padding-bottom:2.5rem;position:relative;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:nth-of-type(1) > dd.btn_rnd_wrap1 {position:absolute;bottom:0px;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:nth-last-of-type(1) {align-items:flex-end;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:not(.pd_count) > *:not(.btn_rnd_wrap1) {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}

/* shop 櫥窗 - 桌機版特殊處理 */
/* 2026-03-17: Katie   # 251102028, 地圖按鈕，改至地址後面(非裝置版的時候)(by Ho) */
/* 2026-03-17: Katie   # 251102028, 按鈕移至地址後面，拿掉下方按鈕區塊的高度 */
/* 2026-03-26: Chiuhua # 251102028, 整理 shop 櫥窗特殊處理語法 (將 Katie 原本穿插在上方標準樣式內的差異語法抽離歸類), 並改良此樣式地址文字與按鈕 gap 太貼近的問題 */
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper.with_nofooterbtn > dl {padding:0px;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl > dd > .address {display:flex;flex-wrap:nowrap;align-items:center;gap:0.35em;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl > dd > .address > .btn_rnd {flex:0 0 1.875rem;}

/* gdsc_shop pd_count 車輛數 */
.gdsc_modular_wrapper.gdsc_shop .pd_count {gap:1rem;}
.gdsc_modular_wrapper.gdsc_shop .pd_count .pennant {cursor:pointer;}
.gdsc_modular_wrapper.gdsc_shop .pd_count .pennant > * {min-width:4em;}
/* RWD */
/* 2026-01-05: Chiuhua # 暫時隱藏大尺寸裝置 4格 RWD 樣式, 因 67/dev 是 div 切版, Art 為模擬 main left nav 是用 iframe, 2者狀況不一樣
@media all and (min-width:1920px) {
.gdsc_modular_wrapper.gdsc_shop > li {width:calc(100% / 4 - 1rem - 2px);}
}
@media all and (min-width:1024px) and (max-width:1920px) {
.gdsc_modular_wrapper.gdsc_shop > li {width:calc(100% / 3 - 1rem);}
} */
@media all and (min-width:1024px) {
.gdsc_modular_wrapper.gdsc_shop > li {width:calc(100% / 3 - 1rem);}
}
@media all and (min-width:600px) and (max-width:1024px) {
.gdsc_modular_wrapper.gdsc_shop > li {width:calc(100% / 2 - 1rem);}
}
@media all and (min-width:600px) {
.gdsc_modular_wrapper.gdsc_shop > li > .photo_single {flex:auto;display:inline-flex;height:calc(100% / 4 * 3);}
.gdsc_modular_wrapper.gdsc_shop > li > .photo_single > figure {display:inherit;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper {min-height:9.3rem;}/* 2025-12-10: Chiuhua # 251200806, 加設 min-height 是為了讓資料少的車商照片區塊高度與同一行的等高 */
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper.with_nofooterbtn {min-height:8.3rem;}
/* 2025-12-31: Chiuhua # 260101094, 文字過長情境開發 test, 後來調整上一行的 min-height 即可
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:not(.pd_count) {gap:unset;}
.gdsc_modular_wrapper.gdsc_shop > li > .sub_wrapper > dl:not(.pd_count) > *:not(.btn_rnd_wrap1) {padding-bottom:0.6em;} */
}
@media all and (max-width:599px) {
}

/* 櫥窗差異 - ucar */
/* 2026-03-09: Chiuhua + 260300910, 新增 .gdsc_ucar [二手車] 櫥窗樣式 */
.gdsc_modular_wrapper.gdsc_ucar {}
.gdsc_modular_wrapper.gdsc_ucar > li {flex-direction:column;}
.gdsc_modular_wrapper.gdsc_ucar > li > * {display:flex;}
@media all and (min-width:1024px) {
.gdsc_modular_wrapper.gdsc_ucar > li {width:calc(100% / 4 - 1rem - 2px);}
}
@media all and (min-width:768px) and (max-width:1024px) {
.gdsc_modular_wrapper.gdsc_ucar > li {width:calc(100% / 2 - 1rem);}
}

/* 櫥窗差異 - ownersells 車主自售 */
/* 2026-01-23: Chiuhua + 260140903, 新增 .gdsc_ucar_byowner [車主自售] 櫥窗樣式 */
.gdsc_modular_wrapper.gdsc_ucar_byowner {}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li {position:relative;overflow:visible;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > i.ribbon {position:absolute;left:-0.15rem;top:-0.15rem;transform:scale(1.35);z-index:2;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single {}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper {}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper > dl {width:100%;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper > dl > dt {font-size:1.3em;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper > dl > *:nth-last-child(1) {}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single + .sub_wrapper {min-width:35%;max-width:calc(100% - 22.5em);}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single + .sub_wrapper > dl > *:nth-last-child(1) {margin-top:auto;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper {position:absolute;right:1rem;height:calc(100% - 2rem);}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > * {justify-content:right;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dt {display:inline-flex;font-size:1.56em;white-space:nowrap;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dt > strong > ins {font-size:1rem;padding-left:0.25em;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dt > i[class*="i_favorites"] {position:relative;top:-0.2em;margin-left:5%;cursor:pointer;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > *:nth-last-child(2) {margin-top:auto;padding-right:0.5em;font-size:0.8125em;opacity:0.75;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dd[class*="btn_"] > button {min-width:8em;}
@media all and (min-width:1024px) and (max-width:1280px) {
.gdsc_modular_wrapper.gdsc_ucar_byowner > li {flex-wrap:wrap;row-gap:0.75rem;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single + .sub_wrapper {flex:1;max-width:unset;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper {position:unset;width:100%;height:auto;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > *:nth-last-child(2) {width:50%;margin-top:-1.3rem;margin-left:50%;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dt {justify-content:space-between;padding-right:calc(100% - 13rem);}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dd[class*="btn_"] {justify-content:space-between;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dd[class*="btn_"] > button {flex:1;}
}
@media all and (min-width:1024px) {
.gdsc_modular_wrapper.gdsc_ucar_byowner > li {width:calc(100% / 2 - 1rem);}
}
@media all and (max-width:1023px) {
.gdsc_modular_wrapper.gdsc_ucar_byowner > li {width:100%;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > i.ribbon {transform:scale(1.2);}
}
@media all and (min-width:600px) {
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single {width:12.5rem;height:9.375rem;}
}
@media all and (max-width:599px) {
.gdsc_modular_wrapper.gdsc_ucar_byowner > li {flex-wrap:wrap;row-gap:0.75rem;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .photo_single + .sub_wrapper {flex:1;max-width:unset;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper {position:unset;width:100%;height:auto;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > *:nth-last-child(2) {width:50%;margin-top:-1.3rem;margin-left:50%;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dt {justify-content:space-between;padding-right:calc(100% - 10.5rem);}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dd[class*="btn_"] {justify-content:space-between;}
.gdsc_modular_wrapper.gdsc_ucar_byowner > li > .sub_wrapper + .sub_wrapper > dl > dd[class*="btn_"] > button {flex:1;}
}


/* 櫥窗差異 - parts - todo
.gdsc_modular_wrapper.gdsc_parts {} */

/*=== 櫥窗 End ===*/
