editable_page.css 80 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233
  1. .no_results{font-size:15px;color:#aaa;padding:200px 0;text-align:center;}
  2. .no_results:before{font:20px/1px iconfont;content: "\e719";color:#ff4040;padding-right:5px;}
  3. .dssc-default-table{width:100%}
  4. .w90{width:90px}
  5. .ui-state-highlight{background: #8eccf4;border:1px dashed #0579C6;height: 100px;line-height: 100px;width: 1200px;margin:0 auto;text-align: center}
  6. .ui-state-highlight::after{content: '放到这里';color:#0579C6}
  7. .editable-page-model select{color:#777;background-color:#FFF;height:30px;vertical-align:middle;*display:inline;padding:4px;border:solid 1px #CCC;*zoom:1;margin-right:5px;}
  8. .editable-page-model select option{line-height:20px;display:block;height:20px;padding:4px;}
  9. .editable-page-model input[type="file"]{line-height:20px;background-color:#FBFBFB;height:20px;border:solid 1px #D8D8D8;cursor:default;}
  10. .editable-page-model input[type="text"], .editable-page-model input[type="password"], .editable-page-model input.text, .editable-page-model input.password{font:12px/20px Arial;color:#777;background-color:#FFF;vertical-align:top;display:inline-block;height:20px;padding:4px;border:solid 1px #CCC;outline:0 none;}
  11. .editable-page-model .dssc-form-goods-pic{min-height:480px;overflow:hidden;}
  12. .editable-page-model .dssc-form-goods-pic .container{width:708px;float:left;}
  13. .editable-page-model .dssc-form-goods-pic .sidebar{width:228px;float:right;}
  14. .editable-page-model .dssc-form-goods-pic .dssc-goodspic-list{margin-bottom:20px;border:solid 1px #E6E6E6;overflow:hidden;}
  15. .editable-page-model .dssc-goodspic-upload .show-sort{line-height:20px;color:#999;width:55px;height:20px;padding:4px 0 4px 4px;border-style:solid;border-color:#E6E6E6;border-width:1px 0 1px 1px;position:absolute;z-index:2;left:10px;top:140px;}
  16. .editable-page-model .dssc-goodspic-upload .show-sort .text{font-size:12px;font-weight:bold;line-height:20px;vertical-align:middle;width:10px;height:20px;padding:0;border:none 0;}
  17. .editable-page-model .dssc-goodspic-upload .show-sort .text:focus{color:#28B779;text-decoration:underline;box-shadow:none;}
  18. .editable-page-model .dssc-goodspic-upload .dssc-upload-btn{width:60px;height:30px;margin:0;position:absolute;z-index:1;left:70px;top:140px;}
  19. .editable-page-model .dssc-goodspic-upload .dssc-upload-btn span{width:60px;height:30px;position:absolute;left:0;top:0;z-index:2;cursor:pointer;}
  20. .editable-page-model .dssc-goodspic-upload .dssc-upload-btn .input-file{width:60px;height:30px;}
  21. .editable-page-model .dssc-goodspic-upload .dssc-upload-btn p{width:58px;height:20px;}
  22. .editable-page-model .dssc-upload-btn p{font-size:12px;line-height:20px;background-color:#F5F5F5;color:#999;text-align:center;color:#666;width:78px;height:20px;padding:4px 0;border:solid 1px;border-color:#DCDCDC #DCDCDC #B3B3B3 #DCDCDC;position:absolute;left:0;top:0;z-index:1;}
  23. .editable-page-model .dssc-upload-btn p i{vertical-align:middle;margin-right:4px;display: inline-block}
  24. .editable-page-model .dssc-upload-btn .input-file{width:80px;height:30px;padding:0;margin:0;border:none 0;opacity:0;filter:alpha(opacity=0);cursor:pointer;}
  25. .editable-page-model .dssc-goodspic-list>ul{font-size:0;*word-spacing:-1px/*IE6、7*/;margin-left:-1px;}
  26. .editable-page-model .dssc-goodspic-list>ul li{font-size:12px;vertical-align:top;letter-spacing:normal;word-spacing:normal;display:inline-block;*display:inline/*IE6,7*/;width:140px;height:180px;border-left:solid 1px #E6E6E6;position:relative;z-index:1;zoom:1;}
  27. .editable-page-model .dssc-goodspic-list>ul li .upload-thumb{line-height:120px;font-size:0;background-color:#FFF;text-align:center;vertical-align:middle;display:table-cell;*display:block;width:120px;height:120px;border:solid 1px #F5F5F5;position:absolute;z-index:1;top:10px;left:10px;overflow:hidden;}
  28. .editable-page-model .dssc-goodspic-list>ul li .upload-thumb img{max-width:120px;max-height:120px;margin-top:expression(120-this.height/2);*margin-top:expression(60-this.height/2)/*IE6,7*/;}
  29. .editable-page-model .dssc-goodspic-upload .image-btn-list{position: absolute;top:15px;right:15px;z-index: 2}
  30. .editable-page-model .dssc-goodspic-upload .image-btn-list .image-btn{margin-left: 10px;font-size: 20px;}
  31. .editable-page-model .dssc-upload-btn{vertical-align:top;display:inline-block;*display:inline/*IE7*/;width:80px;height:30px;*zoom:1;}
  32. .editable-page-model .dssc-upload-btn a{display:block;position:relative;z-index:1;}
  33. .editable-page-model .dssc-upload-btn span{width:80px;height:30px;position:absolute;left:0;top:0;z-index:2;cursor:pointer;}
  34. .editable-page-model .dssc-upload-btn .input-file{width:80px;height:30px;padding:0;margin:0;border:none 0;opacity:0;filter:alpha(opacity=0);cursor:pointer;}
  35. .editable-page-model .dssc-upload-btn p{font-size:12px;line-height:20px;background-color:#F5F5F5;color:#999;text-align:center;color:#666;width:78px;height:20px;padding:4px 0;border:solid 1px;border-color:#DCDCDC #DCDCDC #B3B3B3 #DCDCDC;position:absolute;left:0;top:0;z-index:1;}
  36. .editable-page-model .dssc-upload-btn p i{vertical-align:middle;margin-right:4px;display: inline-block}
  37. .editable-page-model .dssc-btn-mini{font:normal 12px/20px arial;color:#fff;background-color:#3480c1;text-align:center;vertical-align:middle;display:inline-block;height:20px;padding:0 10px;margin-right:2px;border-style:solid;border-width:1px;border-color:#3480c1;cursor:pointer;border-radius:2px; }
  38. .editable-page-model .dssc-btn-mini:hover{text-decoration:none;color:#fff;background-color:#1e629c;border-color:#1e629c;}
  39. .editable-page-model .dssc-btn{font:normal 12px/20px "microsoft yahei";text-decoration:none;color:#fff !important;background-color:#3480c1;text-align:center;vertical-align:middle;display:inline-block;height:20px;padding:4px 10px;border:solid 1px;border-color:#3480c1;cursor:pointer;border-radius:2px;}
  40. .editable-page-model .dssc-btn:hover{text-decoration:none;color:#fff;background-color:#1e629c;border-color:#1e629c;}
  41. .editable-page-model .dssc-btn-mini i, .editable-page-model .dssc-btn i{font-size:14px;vertical-align:middle;margin-right:4px;}
  42. .editable-page-model .dssc-btn-blue, .editable-page-model .dssc-btn-acidblue, .editable-page-model .dssc-btn-green, .editable-page-model .dssc-btn-orange, .editable-page-model .dssc-btn-red, .editable-page-model .dssc-btn-black,
  43. .editable-page-model .dssc-btn-blue:hover, .editable-page-model .dssc-btn-acidblue:hover, .editable-page-model .dssc-btn-green:hover, .editable-page-model .dssc-btn-orange:hover, .editable-page-model .dssc-btn-red:hover, .editable-page-model .dssc-btn-black:hover, .editable-page-model .dscs-table-handle .btn-orange-current{color:#FFF;}
  44. .editable-page-model .dssc-btn-blue,
  45. .editable-page-model .dscs-table-handle .btn-blue:hover {background-color:#006DCC;border-color:#006DCC;}
  46. .editable-page-model .dssc-btn-acidblue,
  47. .editable-page-model .dscs-table-handle .btn-acidblue:hover{background-color:#49AFCD;border-color:#49AFCD;}
  48. .editable-page-model .dssc-btn-green,
  49. .editable-page-model .dscs-table-handle .btn-green:hover{background-color:#0ecc6a;border-color:#0ecc6a;}
  50. .editable-page-model .dssc-btn-orange,
  51. .editable-page-model .dscs-table-handle .btn-orange:hover,
  52. .editable-page-model .dscs-table-handle .btn-orange-current{background-color:#FAA732;margin:0;border-style:solid;border-width:1px;border-color:#FAA732 !important;}
  53. .editable-page-model .dssc-btn-red,
  54. .editable-page-model .dscs-table-handle .btn-red:hover{background-color:#DA4F49;border-color:#DA4F49;}
  55. .editable-page-model .dssc-btn-black,
  56. .editable-page-model .dscs-table-handle .btn-black:hover{background-color:#363636;border-color:#363636;}
  57. .editable-page-model .dssc-btn-blue:hover{background-color:#0044CC;border-color:#0044CC;}
  58. .editable-page-model .dssc-btn-acidblue:hover{background-color:#2F96B4;border-color:#2F96B4;}
  59. .editable-page-model .dssc-btn-green:hover{background-color:#19ba62;border-color:#19ba62;}
  60. .editable-page-model .dssc-btn-orange:hover{background-color:#F89406;border-color:#F89406;}
  61. .editable-page-model .dssc-btn-red:hover{background-color:#BD362F;border-color:#BD362F;}
  62. .editable-page-model .dssc-btn-black:hover{background-color:#222222;border-color:#222222;}
  63. .editable-page-model .dssc-form-default{}
  64. .editable-page-model .dssc-form-default h3{font-size:12px;font-weight:600;line-height:22px;color:#555;clear:both;background-color:#F5F5F5;padding:5px 0 5px 12px;border-bottom:solid 1px #E7E7E7;}
  65. .editable-page-model .dssc-form-default dl{font-size:0;*word-spacing:-1px/*IE6、7*/;line-height:20px;clear:both;padding:0;margin:0;border-bottom:dotted 1px #E6E6E6;overflow:hidden;}
  66. .editable-page-model .dssc-form-default dl:hover{background-color:#FCFCFC;}
  67. .editable-page-model .dssc-form-default dl:hover .hint{color:#666;}
  68. .editable-page-model .dssc-form-default dl.bottom{border-bottom-width:0px;}
  69. .editable-page-model .dssc-form-default dl dt{font-size:13px;line-height:32px;vertical-align:top;letter-spacing:normal;word-spacing:normal;text-align:right;display:inline-block;width:19%;padding:10px 1% 10px 0;margin:0;}
  70. .editable-page-model .dssc-form-default dl dt{*display:inline/*IE6,7*/;}
  71. .editable-page-model .dssc-form-default dl dt i.required{font:12px/16px Tahoma;color:#F30;vertical-align:middle;margin-right:4px;}
  72. .editable-page-model .dssc-form-default dl dd{font-size:12px;vertical-align:top;letter-spacing:normal;word-spacing:normal;display:inline-block;width:79%;padding:16px 0 10px 0;}
  73. .editable-page-model .dssc-form-default dl dd{*display:inline/*IE6,7*/;zoom:1;}
  74. .editable-page-model .dssc-form-default dl dd span{*line-height:20px;*display:inline;*height:20px;*margin-top:6px;*zoom:1;}
  75. .editable-page-model .dssc-form-default dl dd p{clear:both;}
  76. .editable-page-model .dssc-form-goods-pic{min-height: auto !important}
  77. .editable-page-model .dssc-goodspic-list, .editable-page-model .dssc-goodspic-list>ul li{border: 0 !important}
  78. .editable-page-model .model-item-wrapper{float: left}
  79. .model-btn{border:1px solid #e1e1e1;border-top: 0}
  80. .model-btn{text-align: center;font-size:14px;padding-bottom: 10px;padding-top:10px;}
  81. .model-btn a{font-size: 20px;margin:0 10px;color:#0D93BF}
  82. .model-btn a.disable{color:#999}
  83. .model-title{border:1px solid #e1e1e1;border-bottom: 0;padding-bottom: 10px;padding-top:10px;padding-left: 10px}
  84. .model-title .title{font-size:15px;padding-right: 5px;font-weight: bold}
  85. .model-title .desc{font-size: 12px;color:#999}
  86. .model-list{width:210px;border:1px solid #e1e1e1;height: 690px}
  87. .model-list{padding-left: 15px;position: relative;overflow: hidden;overflow-y: scroll;}
  88. #model_list{padding-top:20px;padding-bottom:20px;}
  89. .editable-page-model .model-item{text-align: center;border: 1px solid #d2d2d2;margin: 5px;}
  90. .editable-page-model .model-item-wrapper input[type=radio]{opacity: 0;position: absolute}
  91. .editable-page-model .model-item .model-image{line-height: 120px;width:180px;font-size: 0}
  92. .editable-page-model .model-item img{max-width:180px;max-height: 120px;vertical-align: middle}
  93. .editable-page-model .model-item .model-name{height: 30px;line-height: 30px;background: #f3f3f3;font-size: 14px;}
  94. .editable-page-model .model-item-wrapper input[type=radio]:checked +.model-item{border-color:#3480c1}
  95. #editable_model_form{max-height: 600px;overflow: hidden;overflow-y: auto}
  96. .editable-page-handle,.editable_model_handle_list{position:absolute;top:0;bottom:0;left:0;right:0;}
  97. .editable_model_handle_list{z-index: 2}
  98. .editable-page-handle{z-index: 3;min-height: 30px;text-align: left}
  99. .editable-page-handle > div{text-align: center;display:none;margin-left:5px;margin-top:5px;width:60px;height:30px;line-height:30px;color:#fff;font-size:12px;cursor: pointer}
  100. .editable-page-handle > div:before{padding-right: 4px;font-family: 'iconfont'}
  101. .editable-page-handle .handel-brand{background:#50b1ff}
  102. .editable-page-handle .handel-brand:before{content:"\e624"}
  103. .editable-page-handle .handel-cate{background:#50b1ff}
  104. .editable-page-handle .handel-cate:before{content:"\e623"}
  105. .editable-page-handle .handel-voucher{background:#50b1ff}
  106. .editable-page-handle .handel-voucher:before{content:"\e727"}
  107. .editable-page-handle .handel-text{background:#50b1ff}
  108. .editable-page-handle .handel-text:before{content:"\e8ed"}
  109. .editable-page-handle .handel-link{background:#50b1ff}
  110. .editable-page-handle .handel-link:before{content:"\e67d"}
  111. .editable-page-handle .handel-goods{background:#50b1ff}
  112. .editable-page-handle .handel-goods:before{content:"\e732"}
  113. .editable-page-handle .handel-store{background:#50b1ff}
  114. .editable-page-handle .handel-store:before{content:"\e663"}
  115. .editable-page-handle .handel-editor{background:#50b1ff}
  116. .editable-page-handle .handel-editor:before{content:"\e672"}
  117. .editable-page-handle .handel-image{background:#50b1ff}
  118. .editable-page-handle .handel-image:before{content:"\e72a"}
  119. .editable-page-handle:hover{border:1px dashed #0579C6;background:none}
  120. .editable-page-handle:hover > div{display:inline-block;}
  121. .editable-page-model *[data-type]{position: relative}
  122. .editable-page-model:hover .editable_model_handle_list{border:1px dashed #0579C6;background:none}
  123. .editable-page-model:hover .editable_model_handle_list > a{display:inline-block}
  124. .editable_model_handle_list > a{display:none;text-align:center;margin-left:5px;position:relative;top:-30px;width:50px;height:30px;line-height:30px;color:#fff;}
  125. .editable_model_handle_list .handle_add{background:#7559ca;}
  126. .editable_model_handle_list .handle_edit{background:#288ee4;}
  127. .editable_model_handle_list .handle_move_up{background:#00af26;}
  128. .editable_model_handle_list .handle_move_down{background:#ffb64a;}
  129. .editable_model_handle_list .handle_drop{background:#ea6060;}
  130. .edit-mode{position:relative;z-index:100}
  131. .edit-mode .editable-page-model-3{min-height: 300px;}
  132. .dialog_wrapper{z-index: 1000 !important;}
  133. .editable-page-model{position:relative;z-index: 2}
  134. .editable-page-model .editable-page-content{margin:0 auto;position:relative}
  135. .editable-page-model:first-child .editable_model_handle_list .handle_move_up{display:none}
  136. .editable-page-model:last-child .editable_model_handle_list .handle_move_down{display:none}
  137. .editable-page-model-1{width:100%;height:100%;}
  138. .editable-page-model-1 .content-wrapper,.editable-page-model-1 .content-wrapper .bd,.editable-page-model-1 .content-wrapper .bd ul,.editable-page-model-1 .content-wrapper .bd ul li{position: relative;width:100%;height:100%;}
  139. .editable-page-model-1 .content-wrapper .bd ul li{background-size:cover;background-position:center;background-repeat:no-repeat}
  140. .editable-page-model-1 .content-wrapper .bd ul li a{display: block;width: 100%;height: 100%}
  141. .editable-page-model-1 .ctrl {position: absolute;top: 50%;display: inline-block;vertical-align: middle;width: 41px;height: 54px;margin: -27px 0 0;background: #333;font-size: 24px;text-align: center;line-height: 54px;color: #fff;cursor: pointer;opacity: .75;filter: alpha(opacity=75);}
  142. .editable-page-model-1 .ctrl.prev{left:20px}
  143. .editable-page-model-1 .ctrl.next{right:20px}
  144. .editable-page-model-1 .content-wrapper .hd {position: absolute;width: 100%;bottom: 18px;text-align: center;}
  145. .editable-page-model-1 .content-wrapper .hd li {display: inline-block;width: 10px;height: 10px;margin: 0 8px;cursor: pointer;background: 0 0;border: 2px solid #fff;border-radius: 50%;}
  146. .editable-page-model-1 .content-wrapper .hd li.on {background: #fff;box-shadow: 0 0 0 4px rgba(255, 255, 255, .5);}
  147. .editable-page-model-2 .content-wrapper{position: relative;width:100%;height: 100%;}
  148. .editable-page-model-3 .editable-page-content{width:1200px;}
  149. .editable-page-model-3 .goods-list{overflow: hidden}
  150. .editable-page-model-3 .goods-item{float: left;margin-left: 20px;margin-bottom: 20px;border-radius: 10px;overflow: hidden;width:386.66px;}
  151. .editable-page-model-3 .goods-item:nth-child(3n+1){margin-left: 0}
  152. .editable-page-model-3 .goods-item:nth-last-child(1),.editable-page-model-3 .goods-item:nth-last-child(2),.editable-page-model-3 .goods-item:nth-last-child(3){margin-bottom: 0}
  153. .editable-page-model-3 .goods-item .goods-image{width:100%;height: 320px;background-size: 80%;background-repeat: no-repeat;background-position: center;background-color: #fff}
  154. .editable-page-model-3 .goods-item .goods-info{background: #fff;padding:30px;background: #fff;overflow: hidden;}
  155. .editable-page-model-3 .goods-item .goods-price{color:#333;margin-top: 10px;float: left;}
  156. .editable-page-model-3 .goods-item .goods-price .strong{font-size: 24px;}
  157. .editable-page-model-3 .goods-item .red-btn{float: right}
  158. .editable-page-model .red-btn{background:#C73132;color: #fff;text-align: center;font-size: 15px;line-height: 40px;border-radius: 40px;width:120px;margin:0 auto;}
  159. .editable-page-model-3 .goods-item .goods-name{color:#7A7A7A;font-size: 18px;background: #fff;padding:10px;width: 100%;box-sizing: border-box;height: 93px;}
  160. .editable-page-model-3 .goods-item .goods-name .p{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width:100%;line-height: 1.5}
  161. .editable-page-model-3 .goods-item .goods-name .strong{font-size: 24px;color:#333;margin-bottom: 10px;}
  162. .editable-page-model-4 .editable-page-content{width:1200px;}
  163. .editable-page-model-4 .content-wrapper{border-radius: 10px;overflow: hidden;}
  164. .editable-page-model-4 .image{height: 450px;width:100%;background-size: cover;background-position: center;position: relative}
  165. .editable-page-model-4 .goods-item{position: relative}
  166. .editable-page-model-4 .goods-wrapper{position: relative;width:100%;height: 195px;background: #fff;display: block}
  167. .editable-page-model-4 .goods-wrapper .goods-image{width:185px;height: 185px;background-size:100%;background-position: center;background-repeat: no-repeat;position: absolute;top:-30px;left:40px;}
  168. .editable-page-model-4 .goods-wrapper .goods-name{position: absolute;left:255px;top:45px;color:#7A7A7A;font-size: 18px;width: 720px;}
  169. .editable-page-model-4 .goods-wrapper .goods-name .p{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width:100%;line-height: 1.5}
  170. .editable-page-model-4 .goods-wrapper .goods-name .strong{font-size: 24px;color:#333;margin-bottom: 10px;}
  171. .editable-page-model-4 .goods-wrapper .goods-info{position: absolute;right:60px;bottom:40px;}
  172. .editable-page-model-4 .goods-wrapper .goods-price{text-align: center;color:#333;margin-bottom: 15px;}
  173. .editable-page-model-4 .goods-wrapper .goods-price .strong{font-size: 24px;}
  174. .editable-page-model-7 .editable-page-content{width:1200px;}
  175. .editable-page-model-7 .content-wrapper{border-radius: 10px;overflow: hidden;}
  176. .editable-page-model-7 .image{height: 450px;width:100%;background-size: cover;background-position: center;position: relative}
  177. .editable-page-model-7 .goods-item{position: relative}
  178. .editable-page-model-7 .goods-wrapper{position: relative;width:100%;height: 428px;background: #fff;display: block}
  179. .editable-page-model-7 .goods-wrapper .goods-image{width:428px;height: 100%;background-size:100%;background-position: center;background-repeat: no-repeat;position: absolute;top:0;left:0;}
  180. .editable-page-model-7 .goods-wrapper .goods-name{color:#7A7A7A;font-size: 18px;margin-top:120px;height: 73px;margin-bottom: 85px}
  181. .editable-page-model-7 .goods-wrapper .goods-name .p{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width:100%;line-height: 1.5}
  182. .editable-page-model-7 .goods-wrapper .goods-name .strong{font-size: 24px;color:#333;margin-bottom: 10px;}
  183. .editable-page-model-7 .goods-wrapper .goods-info{}
  184. .editable-page-model-7 .goods-wrapper .goods-price{text-align: center;color:#333;margin-bottom: 15px;}
  185. .editable-page-model-7 .goods-wrapper .goods-price .strong{font-size: 24px;}
  186. .editable-page-model-7 .goods-wrapper .goods-content{width:740px;height:100%;text-align: center;position: absolute;left:450px;top:0;}
  187. .editable-page-model-5 .editable-page-content{width:1200px;}
  188. .editable-page-model-5 .goods-list{overflow: hidden}
  189. .editable-page-model-5 .goods-item{float: left;margin-left: 20px;margin-bottom: 20px;border-radius: 10px;overflow: hidden}
  190. .editable-page-model-5 .goods-item:nth-child(2n+1){margin-left: 0}
  191. .editable-page-model-5 .goods-item:nth-last-child(1),.editable-page-model-5 .goods-item:nth-last-child(2){margin-bottom: 0}
  192. .editable-page-model-5 .goods-image{width:590px;height: 370px;background-size:65%;background-position: center;background-repeat: no-repeat;background-color:#fff }
  193. .editable-page-model-5 .goods-wrapper{position: relative;width:100%;height: 160px;background: #fff;display: block}
  194. .editable-page-model-5 .goods-wrapper .goods-name{position: absolute;left:40px;top:30px;color:#7A7A7A;font-size: 18px;width: 350px;}
  195. .editable-page-model-5 .goods-wrapper .goods-name .p{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width:100%;line-height: 1.5}
  196. .editable-page-model-5 .goods-wrapper .goods-name .strong{font-size: 24px;color:#333;margin-bottom: 10px;}
  197. .editable-page-model-5 .goods-wrapper .goods-info{position: absolute;right:40px;bottom:40px;}
  198. .editable-page-model-5 .goods-wrapper .goods-price{text-align: center;color:#333;margin-bottom: 15px;}
  199. .editable-page-model-5 .goods-wrapper .goods-price .strong{font-size: 24px;}
  200. .editable-page-model-8 .editable-page-content{width:1200px;}
  201. .editable-page-model-8 .editable-page-content .content-wrapper{height: 400px;width: 100%;position: relative}
  202. .editable-page-model-8 .editable-page-content .content-wrapper .fresh_fs_shadow {position: absolute;left: 0;bottom: -22px;width: 1200px;height: 24px;background: url(../images/fresh_fs_shadow.png) 0 0 no-repeat;}
  203. .editable-page-model-8 .category-list{width:212px;height: 400px;background: #fff;position: relative;z-index: 4;float: left;background: hsla(0,0%,100%,.95);-moz-box-shadow: 0 1px 10px rgba(0,0,0,.14);box-shadow: 0 1px 10px rgba(0,0,0,.14);}
  204. .editable-page-model-8 .category-list .tab_head_item {position: relative;height: 80px;border-left: 1px solid transparent;}
  205. .editable-page-model-8 .category-list .tab_head_item_inner {position: relative;margin: 0 10px;padding: 18px 0 0 40px;width: 150px;height: 61px;border-top: 1px dotted #ddd;}
  206. .editable-page-model-8 .category-list .category-item:first-child .tab_head_item .tab_head_item_inner{border-top-color:transparent}
  207. .editable-page-model-8 .category-list .tab_head_item .item_icon {position: absolute;left: 0;top: 20px;width: 26px;height: 26px;}
  208. .editable-page-model-8 .category-list .tab_head_item .item1 .item_icon {background-position: 0 0;background-repeat: no-repeat;width: 26px;height: 26px;}
  209. .editable-page-model-8 .category-list .tab_head_item .item_title {display: block;position: relative;margin-bottom: 7px;height: 19px;font-size: 14px;color: #222;font-weight: 700;}
  210. .editable-page-model-8 .category-list .tab_head_item .item_title:after {content: ">";position: absolute;right: 0;top: 0;height: 19px;line-height: 19px;font-family: simsun;}
  211. .editable-page-model-8 .category-list .tab_head_item .item_children, .editable-page-model-8 .category-list .tab_head_item .item_title {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
  212. .editable-page-model-8 .category-list .tab_head_item .item_children_item {display: inline-block;padding: 0 5px;color: #909090;border-left: 1px solid #909090;line-height: 1;}
  213. .editable-page-model-8 .category-list .tab_head_item .item_children_item:first-child {border-left: none;padding-left: 0;}
  214. .editable-page-model-8 .category-list .category-item:hover .tab_head_item {background: #fff;border-left-color: #ddd;}
  215. .editable-page-model-8 .category-list .category-item:hover .tab_head_item:after{content: ''}
  216. .editable-page-model-8 .tab_head_item:after {content: none;position: absolute;z-index: 3;right: -1px;top: 0;width: 1px;height: 79px;background: #fff;}
  217. .editable-page-model-8 .tab_head_item_inner:after, .editable-page-model-8 .tab_head_item_inner:before {content: none;position: absolute;left: -10px;width: 212px;height: 1px;background: #ddd;}
  218. .editable-page-model-8 .tab_head_item_inner:before {top: -1px;}
  219. .editable-page-model-8 .tab_head_item_inner:after {bottom: -1px;}
  220. .editable-page-model-8 .category-list .category-item:hover .tab_head_item_inner:after, .editable-page-model-8 .category-list .category-item:hover .tab_head_item_inner:before{content: ''}
  221. .editable-page-model-8 .category-list .category-item .tab_body_item{display: none;width:800px;height: 400px;background: #fff;position: absolute;left: 212px;top:0;box-sizing: border-box}
  222. .editable-page-model-8 .category-list .category-item:hover .tab_body_item{display: block}
  223. .editable-page-model-8 .tab_body_item {padding: 10px 20px;width: 760px;min-height: 378px;background: #fff;overflow: hidden;border: 1px solid #ddd;}
  224. .editable-page-model-8 .category-list .category-item:hover .tab_head_item .tab_head_item_inner {border-top-color: transparent;}
  225. .editable-page-model-8 .fresh_fs_nav_cate .cate_item {position: relative;padding-left: 80px;}
  226. .editable-page-model-8 .fresh_fs_nav_cate .cate_tit {overflow: hidden;position: absolute;left: 0;top: 9px;width: 70px;text-align: right;font-weight: 700;white-space: nowrap;text-overflow: ellipsis;}
  227. .editable-page-model-8 .fresh_fs_nav_cate .cate_tit_lk {color: #666;}
  228. .editable-page-model-8 .fresh_fs_nav_cate .cate_tit_arrow {font-family: simsun;margin-left: 5px;}
  229. .editable-page-model-8 .fresh_fs_nav_cate .cate_con {overflow: hidden;padding: 6px 0;border-top: 1px solid #eee;}
  230. .editable-page-model-8 .fresh_fs_nav_cate .cate_item:first-child .cate_con {border-top: none;}
  231. .editable-page-model-8 .fresh_fs_nav_cate .cate_con_lk {float: left;margin: 4px 0;padding: 0 10px;height: 16px;border-left: 1px solid #e0e0e0;line-height: 16px;white-space: nowrap;color: #666;}
  232. .editable-page-model-8 .slide-wrapper{position: absolute;left: 212px;top:0;width:800px;height: 400px}
  233. .editable-page-model-8 .slide-wrapper .bd,.editable-page-model-8 .slide-wrapper .bd ul,.editable-page-model-8 .slide-wrapper .bd ul li{position: relative;width:800px;height: 400px}
  234. .editable-page-model-8 .slide-wrapper .bd ul li{background-size:cover;background-position:center;background-repeat:no-repeat}
  235. .editable-page-model-8 .ctrl {position: absolute;z-index: 3;top: 50%;line-height: 60px;text-align: center;font-family: simsun;font-size: 20px;background: #ccc;color: #fff;display: none;margin-top: -30px;width: 30px;height: 60px;background-color: #333;background-color: rgba(0,0,0,.1);}
  236. .editable-page-model-8:hover .ctrl{display: block}
  237. .editable-page-model-8 .ctrl.prev{left:0}
  238. .editable-page-model-8 .ctrl.next{right:0}
  239. .editable-page-model-8 .slide-wrapper .hd {position: absolute;width: 100%;bottom: 18px;text-align: center;}
  240. .editable-page-model-8 .slide-wrapper .hd ul{font-size: 0}
  241. .editable-page-model-8 .slide-wrapper .hd li {margin: 0 5px;display: inline-block;width: 6px;height: 6px;background: #919596;border: 1px solid #fff;-moz-border-radius: 8px;border-radius: 8px;background: hsla(0,0%,100%,.5);}
  242. .editable-page-model-8 .slide-wrapper .hd li.on {border-color: #fff;width:24px;background: #fff;opacity: .8;}
  243. .editable-page-model-8 .fresh_fs_side {position: relative;z-index: 2;float: right;width: 188px;height: 400px;}
  244. .editable-page-model-8 .fresh_fs_act {position: relative;display: block;width: 100%;height: 245px;}
  245. .editable-page-model-8 .fresh_fs_toutiao {height: 151px;border-top: 4px solid #00c65d;background: #fff;}
  246. .editable-page-model-8 .fresh_fs_toutiao_title {position: relative;height: 24px;padding: 16px 0;font-size: 16px;color: #222;text-align: center;}
  247. .editable-page-model-8 .fresh_fs_toutiao_title_l, .editable-page-model-8 .fresh_fs_toutiao_title_r {display: block;position: absolute;top: 50%;width: 50px;height: 1px;background: #f0f0f8;}
  248. .editable-page-model-8 .fresh_fs_toutiao_title_l {left: 10px;}
  249. .editable-page-model-8 .fresh_fs_toutiao_title_l:after, .editable-page-model-8 .fresh_fs_toutiao_title_r:after {content: "";position: absolute;display: block;width: 15px;height: 2px;background: #222;bottom: 0;}
  250. .editable-page-model-8 .fresh_fs_toutiao_title_l:after {right: 0;}
  251. .editable-page-model-8 .fresh_fs_toutiao_title_text {display: inline-block;width: 75px;height: 24px;}
  252. .editable-page-model-8 .fresh_fs_toutiao_title em {color: #00c65d;}
  253. .editable-page-model-8 .fresh_fs_toutiao_title_r {right: 10px;}
  254. .editable-page-model-8 .fresh_fs_toutiao_title_r:after {left: 0;}
  255. .editable-page-model-8 .fresh_fs_toutiao_item {position: relative;display: block;margin: 0 16px 6px 0;padding-left: 18px;color: #222;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;-webkit-transition: color .25s ease;-moz-transition: color .25s ease;transition: color .25s ease;}
  256. .editable-page-model-8 .fresh_fs_toutiao_item:before {content: "";position: absolute;left: 10px;top: 50%;margin-top: -2px;width: 3px;height: 3px;background: #6f6f6f;-webkit-transition: all .25s ease;-moz-transition: all .25s ease;transition: all .25s ease;}
  257. .editable-page-model-8 .fresh_fs_toutiao_item:hover {color: #00c65d;}
  258. .editable-page-model-8 .fresh_fs_toutiao_item:hover:before {top: 0;margin-top: 0;height: 100%;background: #00c65d;}
  259. .editable-page-model-9 .editable-page-content{width:1200px;}
  260. .editable-page-model-9 .fresh_category_body {position: relative;background: #fff;}
  261. .editable-page-model-9 .fresh_category_acts {height: 300px;}
  262. .editable-page-model-9 .fresh_category_act1 {float: left;padding: 0 20px;width: 160px;height: 300px;}
  263. .editable-page-model-9 .fresh_category_title {margin-bottom: 5px;padding-top: 22px;height: 39px;font-size: 26px;color: #fff;overflow: hidden;}
  264. .editable-page-model-9 .fresh_category_subtitle {position: relative;margin-bottom: 20px;padding-bottom: 10px;height: 24px;font-size: 16px;color: #fff;white-space: nowrap;overflow: hidden;}
  265. .editable-page-model-9 .fresh_category_subtitle:after {content: "";position: absolute;left: 0;bottom: 0;width: 59px;height: 4px;background: #fff;}
  266. .editable-page-model-9 .fresh_category_keys {margin-bottom: 2px;height: 117px;overflow: hidden;}
  267. .editable-page-model-9 .fresh_category_keys_item {float: left;margin: 0 9px 9px 0;padding: 0 13px;max-width: 132px;height: 28px;line-height: 28px;text-align: center;font-size: 14px;color: #fff;border: 1px solid #ddd;background: none;background: rgba(247,247,251,.2);-moz-border-radius: 15px;border-radius: 15px;overflow: hidden;}
  268. .editable-page-model-9 .fresh_category_keys_item:hover {color: #fff;background: rgba(247,247,251,.4);}
  269. .editable-page-model-9 .fresh_category_act2 {float: left;width: 600px;height: 300px;position: relative;}
  270. .editable-page-model-9 .fresh_category_act3 {float: left;width: 400px;height: 300px;}
  271. .editable-page-model-9 .fresh_category_goods {height: 280px;overflow: hidden;}
  272. .editable-page-model-9 .fresh_category_goods .goods_item {float: left;padding: 30px 20px 0;width: 160px;height: 250px;}
  273. .editable-page-model-9 .fresh_category_goods .goods_item_link {display: block;text-align: center;}
  274. .editable-page-model-9 .fresh_category_goods .goods_item_link:hover .goods_item_img {-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}
  275. .editable-page-model-9 .fresh_category_goods .goods_item_img {margin-bottom: 18px;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;transition: all .25s ease-in-out;width: 150px;height: 150px;}
  276. .editable-page-model-9 .fresh_category_goods .goods_item_name {margin-bottom: 4px;height: 42px;font-size: 14px;color: #222;text-align: left;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;font-weight: lighter;-webkit-transition: color .25s ease-in-out;-moz-transition: color .25s ease-in-out;transition: color .25s ease-in-out;}
  277. .editable-page-model-9 .fresh_category_goods .goods_item_price {font-size: 18px;color: #ff541f;}
  278. .editable-page-model-9 .fresh_category_brands{overflow: hidden;height:82px;}
  279. .editable-page-model-9 .fresh_category_brands .brands_item {float: left;width: 119px;height: 80px;line-height: 80px;text-align: center;overflow: hidden;border: 1px solid #f0f0f8;border-left: 0;}
  280. .editable-page-model-9 .fresh_category_brands .brands_item_img {max-width: 100%;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;transition: all .25s ease-in-out;}
  281. .editable-page-model-9 .fresh_category_brands .brands_item:hover .brands_item_img {-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}
  282. .editable-page-model-9 .fresh_category_brands .brands_item:first-child {width: 118px;border-left: 1px solid #f0f0f8;}
  283. .editable-page-model-10 {}
  284. .editable-page-model-10 .editable-page-content{width:1200px;}
  285. .editable-page-model-10 .fresh_categorys_col {position: relative;float: left;width: 595px;margin-right: 10px;background: #fff;}
  286. .editable-page-model-10 .fresh_categorys_col.two {margin-right: 0;}
  287. .editable-page-model-10 .fresh_category_act1 {float: left;padding: 0 20px;width: 160px;height: 300px;}
  288. .editable-page-model-10 .fresh_category_title {margin-bottom: 5px;padding-top: 22px;height: 39px;font-size: 26px;color: #fff;overflow: hidden;}
  289. .editable-page-model-10 .fresh_category_subtitle {position: relative;margin-bottom: 20px;padding-bottom: 10px;height: 24px;font-size: 16px;color: #fff;white-space: nowrap;overflow: hidden;}
  290. .editable-page-model-10 .fresh_category_subtitle:after {content: "";position: absolute;left: 0;bottom: 0;width: 59px;height: 4px;background: #fff;}
  291. .editable-page-model-10 .fresh_category_keys {margin-bottom: 2px;height: 117px;overflow: hidden;}
  292. .editable-page-model-10 .fresh_category_keys_item {float: left;margin: 0 9px 9px 0;padding: 0 13px;max-width: 132px;height: 28px;line-height: 28px;text-align: center;font-size: 14px;color: #fff;border: 1px solid #ddd;background: none;background: rgba(247,247,251,.2);-moz-border-radius: 15px;border-radius: 15px;overflow: hidden;}
  293. .editable-page-model-10 .fresh_category_keys_item:hover {color: #fff;background: rgba(247,247,251,.4);}
  294. .editable-page-model-10 .fresh_category_act3 {float: left;width: 395px;height: 300px;}
  295. .editable-page-model-10 .fresh_category_goods {height: 280px;overflow: hidden;}
  296. .editable-page-model-10 .fresh_category_goods .goods_item {float: left;padding: 30px 19px 0;width: 160px;height: 250px;}
  297. .editable-page-model-10 .fresh_category_goods .goods_item_link {display: block;text-align: center;}
  298. .editable-page-model-10 .fresh_category_goods .goods_item_link:hover .goods_item_img {-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}
  299. .editable-page-model-10 .fresh_category_goods .goods_item_img {margin-bottom: 18px;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;transition: all .25s ease-in-out;width: 150px;height: 150px;}
  300. .editable-page-model-10 .fresh_category_goods .goods_item_name {margin-bottom: 4px;height: 42px;font-size: 14px;color: #222;text-align: left;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;font-weight: lighter;-webkit-transition: color .25s ease-in-out;-moz-transition: color .25s ease-in-out;transition: color .25s ease-in-out;}
  301. .editable-page-model-10 .fresh_category_goods .goods_item_price {font-size: 18px;color: #ff541f;}
  302. .editable-page-model-10 .fresh_category_brands{overflow: hidden;height:82px;}
  303. .editable-page-model-10 .fresh_category_brands .brands_item {float: left;width: 118px;height: 80px;line-height: 80px;text-align: center;overflow: hidden;border: 1px solid #f0f0f8;border-left: 0;background-size:90%;background-repeat:no-repeat;background-position:center;}
  304. .editable-page-model-10 .fresh_category_brands .brands_item_img {max-width: 100%;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;transition: all .25s ease-in-out;}
  305. .editable-page-model-10 .fresh_category_brands .brands_item:hover .brands_item_img {-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}
  306. .editable-page-model-10 .fresh_category_brands .brands_item:first-child {width: 117px;border-left: 1px solid #f0f0f8;}
  307. .editable-page-model-11 .editable-page-content{width:1200px;}
  308. .editable-page-model-11 .tab_head {text-align: center;height:69px}
  309. .editable-page-model-11 .tab_head_item {height:45px;position: relative;display: inline-block;vertical-align: middle;margin: 0 50px;width: 40px;padding: 10px 0 10px 50px;font-size: 16px;color: #909090;border-bottom: 4px solid transparent;cursor: pointer;}
  310. .editable-page-model-11 .tab_head_item .mod_iconfont {font-style: normal;position: absolute;left: 0;top: 10px;height:45px;width:90px;background-position:center 0 ;background-repeat: no-repeat;}
  311. .editable-page-model-11 .mod_ver {display: inline-block;width: 0;height: 100%;vertical-align: middle;font-size: 0;}
  312. .editable-page-model-11 .tab_head_item.on{border-bottom-color:#b49966}
  313. .editable-page-model-11 .tab_body {position:relative;width: 1200px;background: #fff;-webkit-box-shadow: 0 1px 8px rgba(0,0,0,.05);-moz-box-shadow: 0 1px 8px rgba(0,0,0,.05);box-shadow: 0 1px 8px rgba(0,0,0,.05);border-top: 1px solid #f2f2f2;}
  314. .edit-mode .editable-page-model-11 .tab_body .handle-holder{position:absolute;width:100%;height:100%;}
  315. .editable-page-model-11 .tab_body_item {padding: 30px 0 0 4px;overflow: hidden;}
  316. .editable-page-model-11 .goods_item {float: left;margin: 0 9px 30px;padding: 30px 20px 0;width: 180px;height: 320px;font-size: 14px;-webkit-transition: all .25s ease-in-out;-o-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;transition: all .25s ease-in-out;}
  317. .editable-page-model-11 .goods_item:hover {-webkit-transform: translateY(-10px);-moz-transform: translateY(-10px);-ms-transform: translateY(-10px);transform: translateY(-10px);}
  318. .editable-page-model-11 .goods_item_img {margin: 0 auto 20px;width: 180px;height: 180px;}
  319. .editable-page-model-11 .goods_item_tag {margin-bottom: 3px;color: #b49966;white-space: nowrap;height:20px}
  320. .editable-page-model-11 .goods_item_name, .goods_item_tag {overflow: hidden;-o-text-overflow: ellipsis;text-overflow: ellipsis;}
  321. .editable-page-model-11 .goods_item_name {margin-bottom: 16px;height: 42px;color: #222;display: -webkit-box;-webkit-line-clamp: 2;}
  322. .editable-page-model-11 .goods_item_priceg {position: relative;height: 20px;font-size: 0;}
  323. .editable-page-model-11 .goods_item_price {display: inline-block;margin-right: 3px;font-size: 20px;line-height: 1;color: #ff541f;}
  324. .editable-page-model-11 .goods_item_g {display: inline-block;font-size: 14px;line-height: 1;color: #909090;text-decoration: line-through;}
  325. .editable-page-model-11 .tab_head_item.on .mod_iconfont{background-position:center -45px}
  326. /*手机端样式*/
  327. *[data-type="html"].active{border:1px dashed #FF6A00;position:relative;}
  328. *[data-type="html"].active .model-del{display:block}
  329. *[data-type="html"] .model-del{
  330. display: none;
  331. background: #999;
  332. color: #FFFFFF;
  333. position: absolute;
  334. border-radius: 50%;
  335. width: 20px;
  336. height: 20px;
  337. font-size: 12px;
  338. font-style: normal;
  339. line-height: 18px;
  340. text-align: center;
  341. right: -10px;
  342. top: -10px;
  343. cursor: pointer;
  344. z-index: 1;
  345. }
  346. /*组件列表*/
  347. .page-wrapper .component-list {
  348. width: 270px;
  349. /*190px;
  350. */
  351. padding: 0 10px;
  352. background: #ffffff;
  353. overflow: hidden;
  354. user-select: none;
  355. border-top: 1px solid #f7f8fa;
  356. }
  357. .page-wrapper .component-list nav {
  358. height: 100%;
  359. overflow-y: auto;
  360. width: 297px;
  361. /*217px;
  362. */
  363. }
  364. .page-wrapper .component-list h3 {
  365. font-weight: normal;
  366. font-size: 14px;
  367. margin: 10px 0 0;
  368. cursor: pointer;
  369. line-height: 40px;
  370. color:#333;
  371. padding-left:20px;
  372. }
  373. .page-wrapper .component-list h3 img {
  374. width: 16px;
  375. margin-right: 5px;
  376. }
  377. .page-wrapper .component-list ul {
  378. overflow: hidden;
  379. margin: 0;
  380. padding: 0;
  381. transition: all .3s;
  382. opacity: 1;
  383. }
  384. .page-wrapper .component-list ul li {
  385. float: left;
  386. color: #303133;
  387. /* padding: 10px 0;
  388. */
  389. font-size: 12px;
  390. width: 90px;
  391. height: 72px;
  392. /*line-height: 40px;
  393. */
  394. text-align: center;
  395. cursor: pointer;
  396. position: relative;
  397. text-overflow: ellipsis;
  398. white-space: nowrap;
  399. overflow: hidden;
  400. /*border: 1px solid #EEEEEE;
  401. */
  402. border-right: 1px solid transparent;
  403. border-top: 1px solid transparent;
  404. }
  405. .page-wrapper .component-list ul li:not(.disabled):hover {
  406. background: #dae6fd;
  407. color: #4385ff;
  408. /*border: 1px solid #ff8143;
  409. */
  410. }
  411. .page-wrapper .component-list ul li img {
  412. width: 42px;
  413. margin-top: 11px;
  414. }
  415. .page-wrapper .component-list ul li span:nth-of-type(1) {
  416. display: block;
  417. margin-bottom: 5px;
  418. }
  419. .page-wrapper .component-list ul li span {
  420. font-size: 12px;
  421. color: #909399;
  422. }
  423. .page-wrapper .component-list ul li:not(.disabled):hover span {
  424. font-size: 12px;
  425. color: #4385ff;
  426. }
  427. .page-wrapper .preview-wrap {
  428. overflow: hidden;
  429. margin-left: 20px;
  430. margin-right: 20px;
  431. height: 100%;
  432. }
  433. .page-wrapper .preview-wrap .preview-restore-wrap{
  434. height: 100%;
  435. }
  436. .page-wrapper .preview-wrap .preview-restore-wrap .dv-wrap {
  437. height: 100%;
  438. }
  439. /*auto*/
  440. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap {
  441. width: 375px;
  442. height: 100%;
  443. /* height: 667px;
  444. */
  445. background-repeat: no-repeat;
  446. background-position-y: 64px;
  447. background-size: 100%;
  448. /* border:1px solid #ddd;
  449. */
  450. background-color: #fff;
  451. box-sizing: border-box;
  452. position: relative;
  453. /* top:50%;
  454. */
  455. /* margin-top:-333.5px;
  456. */
  457. }
  458. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-foot-wrapper{
  459. height: 60px;
  460. }
  461. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-foot{
  462. display: flex;
  463. position: absolute;
  464. bottom:0;
  465. left:0;
  466. right:0;
  467. text-align: center;
  468. background-color: #fff;
  469. padding:10px 0;
  470. }
  471. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-foot .preview-foot-item{
  472. flex:1;
  473. }
  474. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-foot .preview-foot-item img{
  475. width:20px;
  476. height: 20px;
  477. }
  478. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-content::-webkit-scrollbar {
  479. display: none;
  480. /* Chrome Safari */
  481. }
  482. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-content{
  483. scrollbar-width: none;
  484. /* firefox */
  485. -ms-overflow-style: none;
  486. /* IE 10+ */
  487. }
  488. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-content {
  489. position: absolute;
  490. width:100%;
  491. overflow: hidden;
  492. overflow-y: auto;
  493. top:64px;
  494. bottom: 0;
  495. box-sizing: border-box;
  496. background-color: #f5f5f5;
  497. background-repeat: no-repeat;
  498. background-size: 100%;
  499. }
  500. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .jump-adv-wrapper{
  501. position:absolute;
  502. top:0;
  503. bottom:0;
  504. left:0;
  505. right:0;
  506. background-color: rgba(0,0,0,.5);
  507. z-index: 2;
  508. display: flex;
  509. align-items: center;
  510. justify-content: center;
  511. }
  512. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .jump-adv{
  513. position: relative;
  514. }
  515. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .jump-adv-image{
  516. max-width: 100%;
  517. }
  518. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .jump-adv-button{
  519. position:absolute;
  520. top:0;
  521. right:0;
  522. width:20px;
  523. height: 20px;
  524. line-height: 20px;
  525. border-radius: 20px;
  526. text-align: center;
  527. background-color: rgba(255,255,255,.5);
  528. cursor: pointer;
  529. }
  530. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .float-button{
  531. position:absolute;
  532. z-index: 2;
  533. }
  534. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .float-button img{
  535. width: 40px;
  536. height: 40px;
  537. }
  538. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-head {
  539. height: 64px;
  540. width: 375px;
  541. position:absolute;
  542. top:0;
  543. /*box-shadow: 0 0 14px 0 rgba(0, 0, 0, .1);
  544. */
  545. }
  546. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .middle {
  547. padding: 10px 20px;
  548. }
  549. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-block {
  550. min-height: 400px;
  551. /*box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1);
  552. */
  553. }
  554. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-head > .preview-head_div {
  555. background: url(../images/editable_page/preview_head.png) no-repeat 50%/cover;
  556. font-size: 14px;
  557. display: block;
  558. height: 64px;
  559. line-height: 82px;
  560. text-overflow: ellipsis;
  561. white-space: nowrap;
  562. overflow: hidden;
  563. cursor: pointer;
  564. margin: 0 auto;
  565. }
  566. .page-wrapper .preview-wrap .preview-restore-wrap .diy-view-wrap .preview-head > .preview-head_div > span {
  567. display: block;
  568. padding: 0 15px;
  569. height: 100%;
  570. line-height: 87px;
  571. text-align: center;
  572. }
  573. .page-wrapper .edit-attribute {
  574. flex:1;
  575. background: #ffffff;
  576. border-top: 1px solid #f7f8fa;
  577. /*border: 1px solid #e5e5e5;
  578. margin-left: 20px;
  579. */
  580. /* min-width: 350px;
  581. */
  582. padding: 10px;
  583. /*margin-bottom: 80px;
  584. */
  585. /*height: 620px;
  586. */
  587. overflow: hidden;
  588. overflow-y: auto;
  589. }
  590. .page-wrapper .edit-attribute .attr-wrap .restore-wrap .layui-form-label {
  591. color: #909399 !important;
  592. }
  593. .page-wrapper .edit-attribute .attr-wrap .restore-wrap .attr-title {
  594. padding: 20px 12px;
  595. border-bottom: 1px solid #f2f4f6;
  596. margin-bottom: 10px;
  597. font-weight: bold;
  598. font-size: 20px;
  599. color: #303133;
  600. }
  601. .page-wrapper{
  602. position:absolute;
  603. top:0;
  604. left:0;
  605. right:0;
  606. bottom:0;
  607. display: flex;
  608. padding-bottom: 79px;
  609. }
  610. .page-wrapper .layui-form-item {
  611. margin-bottom: 10px;
  612. display: flex;
  613. }
  614. .page-wrapper .layui-form-label {
  615. width: 80px;
  616. height: 34px;
  617. line-height: 34px;
  618. padding: 0 10px 0 0;
  619. box-sizing: border-box;
  620. font-size:14px;
  621. text-align: right;
  622. }
  623. .page-wrapper .layui-input-block {
  624. line-height: 34px;
  625. min-height: 34px;
  626. flex:1;
  627. }
  628. .page-wrapper .layui-input-block input[type=text]{
  629. width:100%;
  630. font-size:14px;
  631. box-sizing: border-box;
  632. line-height: 34px;
  633. height: 34px;
  634. }
  635. .page-wrapper .color-wrapper{
  636. position:relative;
  637. width:100%
  638. }
  639. .page-wrapper .color-wrapper .evo-pointer{
  640. position:absolute;
  641. right:6px;
  642. top:6px
  643. }
  644. .page-wrapper .color-wrapper >div{
  645. width:auto !important
  646. }
  647. .page-wrapper .layui-input-block .onoff{
  648. margin-top: 5px;
  649. }
  650. .page-wrapper .uploader-wrapper{
  651. border:1px solid #e1e1e1;
  652. border-radius:5px;
  653. text-align: center;
  654. width: 150px;
  655. height: 150px;
  656. cursor: pointer;
  657. position:relative;
  658. }
  659. .page-wrapper .uploader-wrapper .uploader-icon{
  660. font-size:50px;
  661. padding-top:50px;
  662. }
  663. .page-wrapper .uploader-wrapper .uploader-text{
  664. font-size:16px;
  665. font-weight: bold;
  666. }
  667. .page-wrapper .uploader-file{
  668. opacity: 0;
  669. position:absolute;
  670. top:0;
  671. bottom:0;
  672. left:0;
  673. right:0;
  674. height: inherit;
  675. }
  676. .page-wrapper .uploader-image{
  677. object-fit: cover;
  678. width: 150px;
  679. height: 150px;
  680. cursor: pointer;
  681. }
  682. .page-wrapper .uploader-image-btn{
  683. position:absolute;
  684. top:0;
  685. right:0;
  686. line-height: 1;
  687. padding:5px;
  688. cursor: pointer;
  689. }
  690. .page-wrapper .uploader-notice{
  691. font-size:12px;
  692. color:#999;
  693. line-height: 1;
  694. }
  695. .page-wrapper .range-wrapper{
  696. display: flex;
  697. align-items: center;
  698. }
  699. .page-wrapper .ds-icon-radio .ds-icon li {
  700. display: inline-block;
  701. width: 50px;
  702. height: 50px;
  703. line-height: 1;
  704. text-align: center;
  705. border: 1px solid #EEEEEE;
  706. border-right: 1px solid transparent;
  707. cursor: pointer;
  708. float: left;
  709. box-sizing: border-box;
  710. }
  711. .page-wrapper .ds-icon-radio .ds-icon li img{
  712. padding-top:8px;
  713. padding-bottom:5px
  714. }
  715. .page-wrapper .ds-icon-radio .ds-icon li:last-child {
  716. border-right: 1px solid #EEEEEE;
  717. }
  718. .page-wrapper .ds-icon-radio .ds-icon .ds-icon-active{
  719. background: #dae6fd;
  720. color: #4385ff;
  721. }
  722. .page-wrapper .model-item{
  723. border:1px dashed #e1e1e1;
  724. padding:20px 10px 10px 10px;
  725. margin-bottom:10px;
  726. position:relative;
  727. }
  728. .page-wrapper .model-del{
  729. position: absolute;
  730. height: 20px;
  731. width:20px;
  732. line-height: 20px;
  733. text-align: center;
  734. cursor: pointer;
  735. top:0;
  736. right:0
  737. }
  738. .page-wrapper .model-btn{
  739. border:1px dashed #4385ff;
  740. padding:15px 20px;
  741. text-align: center;
  742. color:#4385ff;
  743. margin-top:10px;
  744. font-size: 14px;
  745. }
  746. .page-wrapper .footer-btn{
  747. text-align: center;
  748. padding: 20px;
  749. position:absolute;
  750. bottom:0;
  751. left:0;
  752. right:0;
  753. background-color: #fff;
  754. border-top: 1px solid #eee;
  755. }
  756. .page-wrapper .select-wrapper{
  757. cursor:pointer
  758. }
  759. .page-wrapper .select-wrapper .text{
  760. color: #4385ff;
  761. font-size:14px
  762. }
  763. .model-1 .adv-wrapper{
  764. overflow: hidden;
  765. position:relative;
  766. font-size: 0;
  767. border-radius: 5px;
  768. }
  769. .model-1 .adv-wrapper .hd {
  770. position:absolute;
  771. bottom:10px;
  772. text-align: center;
  773. width: 100%;
  774. }
  775. .model-1 .adv-wrapper .hd li{
  776. display: inline-block;
  777. width:10px;
  778. height: 10px;
  779. border-radius:10px;
  780. background-color: rgba(0,0,0,.5);
  781. margin:0 5px;
  782. }
  783. .model-1 .adv-wrapper .hd li.on{
  784. background-color: rgba(255,255,255,.5);
  785. }
  786. .model-2 .editor-wrapper{
  787. border-radius: 5px;
  788. }
  789. .model-2 .editor-wrapper .html *{
  790. max-width: 100%;
  791. }
  792. .model-6 .goods-list{
  793. border-radius:5px;
  794. }
  795. .model-6 .goods-list.single-column .goods-item {
  796. padding:13px;
  797. background:#fff;
  798. margin:5px 0;
  799. border-radius:5px;
  800. display:flex;
  801. position:relative;
  802. }
  803. .model-6 .goods-list.single-column .goods-item:first-child{
  804. margin-top: 0;
  805. }
  806. .model-6 .goods-list.single-column .goods-item:last-child{
  807. margin-bottom: 0;
  808. }
  809. .model-6 .goods-list.single-column .goods-item .goods-img {
  810. width:90px;
  811. height:90px;
  812. overflow:hidden;
  813. border-radius:5px;
  814. margin-right:10px;
  815. background:#e5e5e5;
  816. display:flex;
  817. justify-content:center;
  818. align-items:center;
  819. }
  820. .model-6 .goods-list.single-column .goods-item .goods-img img {
  821. width: 100%;
  822. height: 100%;
  823. }
  824. .model-6 .goods-list.single-column .goods-item .goods-tag {
  825. color:#fff;
  826. line-height:1;
  827. padding:4px 6px;
  828. position:absolute;
  829. border-top-left-radius:5px;
  830. border-bottom-right-radius:5px;
  831. top:13px;
  832. left:13px;
  833. font-size:12px;
  834. background: #FF4544
  835. }
  836. .model-6 .goods-list.single-column .goods-item .goods-tag-img {
  837. position: absolute;
  838. border-top-left-radius: 5px;
  839. width: 40px;
  840. height: 40px;
  841. top: 13px;
  842. left: 13px;
  843. z-index: 5;
  844. overflow: hidden;
  845. margin: 0;
  846. }
  847. .model-6 .goods-list.single-column .goods-item .goods-tag-img .tag-wrap{
  848. background: #eee;
  849. font-size: 12px;
  850. padding: 5px;
  851. text-align: center;
  852. color: #999;
  853. }
  854. .model-6 .goods-list.single-column .goods-item .goods-tag-img img {
  855. width: 100%;
  856. height: 100%;
  857. }
  858. .model-6 .goods-list.single-column .goods-item .info-wrap {
  859. flex:1;
  860. display:flex;
  861. flex-direction:column;
  862. }
  863. .model-6 .goods-list.single-column .goods-item .name-wrap {
  864. flex:1;
  865. }
  866. .model-6 .goods-list.single-column .goods-item .goods-name {
  867. font-size:14px;
  868. line-height:1.3;
  869. overflow:hidden;
  870. text-overflow:ellipsis;
  871. display:-webkit-box;
  872. -webkit-line-clamp:2;
  873. -webkit-box-orient:vertical;
  874. }
  875. .model-6 .goods-list.single-column .goods-item .discount-price {
  876. display:inline-block;
  877. font-weight:bold;
  878. line-height:1;
  879. margin-top:8px;
  880. color:#f44;
  881. }
  882. .model-6 .goods-list.single-column .goods-item .discount-price .unit {
  883. font-size:12px;
  884. }
  885. .model-6 .goods-list.single-column .goods-item .pro-info {
  886. display:flex;
  887. margin-top:8px;
  888. }
  889. .model-6 .goods-list.single-column .goods-item .pro-info .delete-price {
  890. text-decoration:line-through;
  891. flex:1;
  892. font-size:12px;
  893. line-height:1;
  894. color:#999;
  895. }
  896. .model-6 .goods-list.single-column .goods-item .pro-info .sale {
  897. font-size:12px;
  898. line-height:1;
  899. color:#999;
  900. }
  901. .model-6 .goods-list.single-column .goods-item .pro-info .sale {
  902. font-size:12px;
  903. }
  904. .model-6 .goods-list.single-column .goods-item .pro-info > view {
  905. line-height:1;
  906. }
  907. .model-6 .goods-list.single-column .goods-item .pro-info > view:nth-child(2) {
  908. text-align:right;
  909. }
  910. .model-6 .goods-list.single-column .goods-item .member-price-tag {
  911. display:inline-block;
  912. width:30px;
  913. line-height:1;
  914. margin-left:3px;
  915. }
  916. .model-6 .goods-list.single-column .goods-item .member-price-tag image {
  917. width:100%;
  918. }
  919. .model-6 .goods-list.double-column {
  920. display:flex;
  921. flex-wrap:wrap;
  922. margin: 0;
  923. padding: 0;
  924. }
  925. .model-6 .goods-list.double-column .goods-item {
  926. flex:1;
  927. position:relative;
  928. background:#fff;
  929. flex-basis:48%;
  930. max-width:calc((100% - 15px) / 2);
  931. margin-right:15px;
  932. margin-bottom:10px;
  933. border-radius:5px;
  934. }
  935. .model-6 .goods-list.double-column .goods-item:nth-child(2n) {
  936. margin-right:0;
  937. }
  938. .model-6 .goods-list.double-column .goods-item .goods-img {
  939. position:relative;
  940. height:0;
  941. overflow:hidden;
  942. padding-top:100%;
  943. border-top-left-radius:5px;
  944. border-top-right-radius:5px;
  945. background-color:#E8E8E8;
  946. }
  947. .model-6 .goods-list.double-column .goods-item .goods-img img {
  948. position:absolute;
  949. top:50%;
  950. left:50%;
  951. transform:translate(-50%,-50%);
  952. width: 100%;
  953. height: 100%;
  954. }
  955. .model-6 .goods-list.double-column .goods-item .goods-tag {
  956. color:#fff;
  957. line-height:1;
  958. padding:4px 8px;
  959. position:absolute;
  960. border-bottom-right-radius:5px;
  961. top:0;
  962. left:0;
  963. font-size:12px;
  964. background: #FF4544;
  965. }
  966. .model-6 .goods-list.double-column .goods-item .goods-tag-img {
  967. position: absolute;
  968. border-top-left-radius: 5px;
  969. width: 40px;
  970. height: 40px;
  971. top: 0;
  972. left: 0;
  973. z-index: 5;
  974. overflow: hidden;
  975. margin: 0;
  976. }
  977. .model-6 .goods-list.double-column .goods-item .goods-tag-img .tag-wrap{
  978. background: #eee;
  979. font-size: 12px;
  980. padding: 5px;
  981. text-align: center;
  982. color: #999;
  983. }
  984. .model-6 .goods-list.double-column .goods-item .goods-tag-img .tag-wrap{
  985. background: #eee;
  986. font-size: 12px;
  987. }
  988. .model-6 .goods-list.double-column .goods-item .goods-tag-img img {
  989. width: 100%;
  990. height: 100%;
  991. }
  992. .model-6 .goods-list.double-column .goods-item .info-wrap {
  993. padding:0 13px 13px 13px;
  994. }
  995. .model-6 .goods-list.double-column .goods-item .goods-name {
  996. font-size:14px;
  997. line-height:1.3;
  998. overflow:hidden;
  999. text-overflow:ellipsis;
  1000. display:-webkit-box;
  1001. -webkit-line-clamp:2;
  1002. -webkit-box-orient:vertical;
  1003. margin-top:10px;
  1004. }
  1005. .model-6 .goods-list.double-column .goods-item .discount-price {
  1006. display:inline-block;
  1007. font-weight:bold;
  1008. line-height:1;
  1009. margin-top:8px;
  1010. color:#f44;
  1011. font-size: 14px;
  1012. }
  1013. .model-6 .goods-list.double-column .goods-item .pro-info {
  1014. display:flex;
  1015. margin-top:8px;
  1016. }
  1017. .model-6 .goods-list.double-column .goods-item .pro-info .delete-price {
  1018. text-decoration:line-through;
  1019. flex:1;
  1020. font-size:12px;
  1021. line-height:1;
  1022. color:#999;
  1023. }
  1024. .model-6 .goods-list.double-column .goods-item .pro-info .sale {
  1025. font-size:12px;
  1026. line-height:1;
  1027. color:#999;
  1028. }
  1029. .model-6 .goods-list.double-column .goods-item .pro-info .delete-price .unit {
  1030. margin-right:3px;
  1031. }
  1032. .model-6 .goods-list.double-column .goods-item .pro-info > view {
  1033. line-height:1;
  1034. }
  1035. .model-6 .goods-list.double-column .goods-item .pro-info > view:nth-child(2) {
  1036. text-align:right;
  1037. }
  1038. .model-6 .goods-list.double-column .goods-item .member-price-tag {
  1039. display:inline-block;
  1040. width:30px;
  1041. line-height:1;
  1042. margin-left:3px;
  1043. }
  1044. .model-6 .goods-list.double-column .goods-item .member-price-tag image {
  1045. width:100%;
  1046. }
  1047. .model-6 .goods-list.double-column {
  1048. display:flex;
  1049. flex-wrap:wrap;
  1050. margin: 0;
  1051. padding: 0;
  1052. }
  1053. .model-6 .goods-list.double-column .goods-item {
  1054. flex:1;
  1055. position:relative;
  1056. background:#fff;
  1057. flex-basis:48%;
  1058. max-width:calc((100% - 15px) / 2);
  1059. margin-right:15px;
  1060. margin-bottom:10px;
  1061. border-radius:5px;
  1062. }
  1063. .model-6 .goods-list.double-column .goods-item:nth-child(2n) {
  1064. margin-right:0;
  1065. }
  1066. .model-6 .goods-list.double-column .goods-item .goods-img {
  1067. position:relative;
  1068. height:0;
  1069. overflow:hidden;
  1070. padding-top:100%;
  1071. border-top-left-radius:5px;
  1072. border-top-right-radius:5px;
  1073. background-color:#E8E8E8;
  1074. }
  1075. .model-6 .goods-list.double-column .goods-item .goods-img img {
  1076. position:absolute;
  1077. top:50%;
  1078. left:50%;
  1079. transform:translate(-50%,-50%);
  1080. width: 100%;
  1081. height: 100%;
  1082. }
  1083. .model-6 .goods-list.double-column .goods-item .goods-tag {
  1084. color:#fff;
  1085. line-height:1;
  1086. padding:4px 8px;
  1087. position:absolute;
  1088. border-bottom-right-radius:5px;
  1089. top:0;
  1090. left:0;
  1091. font-size:12px;
  1092. background: #FF4544;
  1093. }
  1094. .model-6 .goods-list.double-column .goods-item .goods-tag-img {
  1095. position: absolute;
  1096. border-top-left-radius: 5px;
  1097. width: 40px;
  1098. height: 40px;
  1099. top: 0;
  1100. left: 0;
  1101. z-index: 5;
  1102. overflow: hidden;
  1103. margin: 0;
  1104. }
  1105. .model-6 .goods-list.double-column .goods-item .goods-tag-img .tag-wrap{
  1106. background: #eee;
  1107. font-size: 12px;
  1108. padding: 5px;
  1109. text-align: center;
  1110. color: #999;
  1111. }
  1112. .model-6 .goods-list.double-column .goods-item .goods-tag-img .tag-wrap{
  1113. background: #eee;
  1114. font-size: 12px;
  1115. }
  1116. .model-6 .goods-list.double-column .goods-item .goods-tag-img img {
  1117. width: 100%;
  1118. height: 100%;
  1119. }
  1120. .model-6 .goods-list.double-column .goods-item .info-wrap {
  1121. padding:0 13px 13px 13px;
  1122. }
  1123. .model-6 .goods-list.double-column .goods-item .goods-name {
  1124. font-size:14px;
  1125. line-height:1.3;
  1126. overflow:hidden;
  1127. text-overflow:ellipsis;
  1128. display:-webkit-box;
  1129. -webkit-line-clamp:2;
  1130. -webkit-box-orient:vertical;
  1131. margin-top:10px;
  1132. }
  1133. .model-6 .goods-list.double-column .goods-item .discount-price {
  1134. display:inline-block;
  1135. font-weight:bold;
  1136. line-height:1;
  1137. margin-top:8px;
  1138. color:#f44;
  1139. }
  1140. .model-6 .goods-list.double-column .goods-item .pro-info {
  1141. display:flex;
  1142. margin-top:8px;
  1143. }
  1144. .model-6 .goods-list.double-column .goods-item .pro-info .delete-price {
  1145. text-decoration:line-through;
  1146. flex:1;
  1147. font-size:12px;
  1148. line-height:1;
  1149. color:#999;
  1150. }
  1151. .model-6 .goods-list.double-column .goods-item .pro-info .sale {
  1152. font-size:12px;
  1153. line-height:1;
  1154. color:#999;
  1155. }
  1156. .model-6 .goods-list.double-column .goods-item .pro-info .delete-price .unit {
  1157. margin-right:3px;
  1158. }
  1159. .model-6 .goods-list.double-column .goods-item .pro-info > view {
  1160. line-height:1;
  1161. }
  1162. .model-6 .goods-list.double-column .goods-item .pro-info > view:nth-child(2) {
  1163. text-align:right;
  1164. }
  1165. .model-6 .goods-list.double-column .goods-item .member-price-tag {
  1166. display:inline-block;
  1167. width:30px;
  1168. line-height:1;
  1169. margin-left:3px;
  1170. }
  1171. .model-6 .goods-list.double-column .goods-item .member-price-tag image {
  1172. width:100%;
  1173. }
  1174. .model-12 .graphic-nav{
  1175. border-radius: 5px;
  1176. }
  1177. .model-12 .graphic-nav>.wrap {
  1178. /* overflow-x: hidden;
  1179. white-space: nowrap;
  1180. background: #ffffff;
  1181. */
  1182. display: flex;
  1183. /* justify-content: space-around;
  1184. */
  1185. flex-wrap: wrap;
  1186. padding: 0 5px;
  1187. }
  1188. .model-12 .graphic-nav .item {
  1189. text-align: center;
  1190. float: none;
  1191. display: inline-block;
  1192. box-sizing: border-box;
  1193. padding: 8px 5px;
  1194. }
  1195. .model-12 .graphic-nav .item img {
  1196. width: 45px;
  1197. height: 45px;
  1198. }
  1199. .model-12 .graphic-nav .item span {
  1200. white-space: nowrap;
  1201. text-overflow: ellipsis;
  1202. overflow: hidden;
  1203. display: block;
  1204. font-size: 13px;
  1205. }
  1206. .model-13 .notice-box-1 {
  1207. padding: 10px;
  1208. border-radius:5px;
  1209. }
  1210. .model-13 .notice-box-1 .notice-con {
  1211. display: flex;
  1212. align-items: center;
  1213. }
  1214. .model-13 .notice-box-1 .notice-con-icon {
  1215. flex-shrink: 0;
  1216. height: 12px;
  1217. text-align: center;
  1218. line-height: 18px;
  1219. }
  1220. .model-13 .notice-box-1 .notice-con-icon img {
  1221. max-width: 100%;
  1222. max-height: 100%;
  1223. vertical-align: top;
  1224. }
  1225. .model-13 .notice-box-1 .notice-con-split {
  1226. width: 1px;
  1227. height: 13px;
  1228. background-color: #E4E4E4;
  1229. margin: 0 11px;
  1230. }
  1231. .model-13 .notice-box-1 .notice-con-font {
  1232. font-size: 14px;
  1233. color: #333;
  1234. flex: 1;
  1235. overflow: hidden;
  1236. white-space: nowrap;
  1237. text-overflow: ellipsis;
  1238. }
  1239. .model-14 .top-search-form{
  1240. display: flex;
  1241. align-items: center;
  1242. height: 38px;
  1243. padding: 10px 5px;
  1244. border-radius: 5px;
  1245. }
  1246. .model-14 .top-search-form .logo{
  1247. margin-top:-3px;
  1248. width: 71px;
  1249. height:38px;
  1250. background-size: contain;
  1251. background-repeat: no-repeat;
  1252. background-position: center;
  1253. margin-right: 10px;
  1254. }
  1255. .model-14 .top-search-form .more{
  1256. margin-left:10px;
  1257. margin-right:5px;
  1258. font-size: 20px;
  1259. }
  1260. .model-14 .top-search-form .top-search-box{
  1261. flex:1;
  1262. border-radius:3px;
  1263. position:relative;
  1264. height:38px;
  1265. line-height:38px;
  1266. overflow:hidden;
  1267. margin-top: -3px;
  1268. padding-left: 15px;
  1269. }
  1270. .model-14 .top-search-form .top-search-box .top-search-intro{
  1271. line-height: 38px;
  1272. }
  1273. .model-14 .top-search-form .top-search-box .top-search-icon{
  1274. display:block;
  1275. position:absolute;
  1276. width:30px;
  1277. height:30px;
  1278. right:6px;
  1279. top:50%;
  1280. margin-top:-15px;
  1281. text-align: center;
  1282. line-height: 30px;
  1283. }
  1284. .model-14 .top-search-form .top-search-box .top-search-icon i{
  1285. font-size: 18px;
  1286. }
  1287. .model-14 .top-search-form .top-search-box input{
  1288. border:0;
  1289. outline:0;
  1290. width:100%;
  1291. padding: 0 15px;
  1292. display:block;
  1293. height:30px;
  1294. }
  1295. .model-17 .video{
  1296. border-radius: 5px;
  1297. }
  1298. .model-16 .blank{
  1299. border-radius: 5px;
  1300. }
  1301. .model-15 .cube-wrapper{
  1302. display: flex;
  1303. font-size: 0;
  1304. border-radius: 5px;
  1305. overflow: hidden;
  1306. }
  1307. .model-15 .cube-wrapper .item{
  1308. flex:1;
  1309. }
  1310. .model-15 .cube-wrapper .item img{
  1311. width:100%
  1312. }
  1313. .model-15 .cube-wrapper .line{
  1314. flex:1;
  1315. display: flex;
  1316. }
  1317. .model-15 .cube-wrapper.style-2 .line{
  1318. flex-direction: column;
  1319. }
  1320. .model-15 .cube-wrapper.style-3{
  1321. flex-direction: column;
  1322. }
  1323. .model-17 video{
  1324. width: 100%;
  1325. }
  1326. .model-18 .list-wrap {
  1327. display: flex;
  1328. justify-content: space-between;
  1329. margin-top: 15px;
  1330. }
  1331. .model-18 .list-wrap .item {
  1332. display: inline-block;
  1333. width: 100px;
  1334. }
  1335. .model-18 .list-wrap .item .img-wrap{
  1336. width: 100px;
  1337. height: 100px;
  1338. border-radius: 5px;
  1339. overflow: hidden;
  1340. }
  1341. .model-18 .list-wrap .item .img-wrap img{
  1342. max-width: 100%;
  1343. max-height: 100%;
  1344. }
  1345. .model-18 .list-wrap .item .content{
  1346. width: 100%;
  1347. }
  1348. .model-18 .list-wrap .item .content .content-desc {
  1349. width: 100%;
  1350. font-size: 14px;
  1351. line-height: 14px;
  1352. margin-top: 10px;
  1353. white-space: nowrap;
  1354. text-overflow: ellipsis;
  1355. overflow: hidden;
  1356. }
  1357. .model-18 .list-wrap .item .content .content-price {
  1358. font-size: 12px;
  1359. color: #FF4544;
  1360. margin-top: 10px;
  1361. height: 16px;
  1362. font-weight: 600;
  1363. }
  1364. .model-18 .list-wrap .item .content .content-price span {
  1365. font-size: 16px;
  1366. line-height: 16px;
  1367. }
  1368. .model-18 .list-wrap .item .content .content-num {
  1369. font-size: 12px;
  1370. line-height: 12px;
  1371. margin-top: 10px;
  1372. color: #909399;
  1373. }
  1374. .model-18 .marketing-wrap-two {
  1375. padding: 20px 15px;
  1376. box-sizing: border-box;
  1377. background-color: #FFFFFF;
  1378. border-radius: 5px;
  1379. position: relative;
  1380. /* height: 255px;
  1381. */
  1382. }
  1383. .model-18 .marketing-wrap-two .marketing-box {
  1384. position: unset;
  1385. padding: 0;
  1386. }
  1387. .model-18 .marketing-wrap-two .marketing-box .title {
  1388. display: flex;
  1389. justify-content: space-between;
  1390. align-items: center;
  1391. padding-bottom: 5px;
  1392. }
  1393. .model-18 .marketing-wrap-two .marketing-box .title .title-left {
  1394. width: 109px;
  1395. height: 37px;
  1396. line-height: 37px;
  1397. }
  1398. .model-18 .marketing-wrap-two .marketing-box .title .title-left img {
  1399. /* width: auto;
  1400. max-width: 100%;
  1401. max-height: 100%;
  1402. */
  1403. width: 100%;
  1404. height: 100%;
  1405. }
  1406. .model-18 .marketing-wrap-two .marketing-box .title-3 {
  1407. justify-content: center;
  1408. }
  1409. .model-18 .marketing-wrap-two .marketing-box .title-3 .title-left {
  1410. width: 174px;
  1411. height: 37px;
  1412. text-align: center;
  1413. }
  1414. .model-18 .marketing-wrap-two .marketing-box .title .title-right {
  1415. font-size: 12px;
  1416. color: #909399;
  1417. }
  1418. .model-18 .marketing-wrap-two .marketing-box .title .title-right i {
  1419. font-size: 12px;
  1420. }
  1421. .model-18 .marketing-wrap-two .list-wrap .item {
  1422. width: 95px;
  1423. }
  1424. .model-18 .marketing-wrap-two .list-wrap .item .content {
  1425. position: relative;
  1426. }
  1427. .model-18 .marketing-wrap-two .list-wrap .item .img-wrap {
  1428. width: 95px;
  1429. height: 95px;
  1430. border-radius: 5px;
  1431. overflow: hidden;
  1432. position: relative;
  1433. }
  1434. .model-18 .marketing-wrap-two .list-wrap .item .img-wrap .bg {
  1435. position: absolute;
  1436. width: 95px;
  1437. height: 30px;
  1438. bottom: 0;
  1439. }
  1440. .model-18 .marketing-wrap-two .list-wrap .item .img-wrap .bg img {
  1441. width: 100%;
  1442. }
  1443. .model-18 .marketing-wrap-two .list-wrap .item .img-wrap .num {
  1444. width: 95px;
  1445. position: absolute;
  1446. bottom: 5px;
  1447. padding-left: 10px;
  1448. font-size: 12px;
  1449. line-height: 1;
  1450. color: #FFFFFF;
  1451. }
  1452. .model-18 .marketing-wrap-two .list-wrap .item .original-price {
  1453. font-size: 12px;
  1454. color: #909399;
  1455. line-height: 1;
  1456. margin-top: 10px;
  1457. text-decoration: line-through;
  1458. }
  1459. .model-18 .marketing-wrap-two .list-wrap .item .content-btn {
  1460. position: absolute;
  1461. right: 0;
  1462. bottom: 0;
  1463. display: inline-block;
  1464. width: 22px;
  1465. height: 22px;
  1466. line-height: 22px;
  1467. text-align: center;
  1468. border-radius: 50%;
  1469. background-color: #FF4544;
  1470. }
  1471. .model-18 .marketing-wrap-two .list-wrap .item .content-btn i {
  1472. color: #FFFFFF;
  1473. font-size: 13px;
  1474. }
  1475. .model-19 .list-wrap {
  1476. display: flex;
  1477. justify-content: space-between;
  1478. margin-top: 15px;
  1479. }
  1480. .model-19 .list-wrap .item {
  1481. display: inline-block;
  1482. width: 100px;
  1483. }
  1484. .model-19 .list-wrap .item .img-wrap{
  1485. width: 100px;
  1486. height: 100px;
  1487. border-radius: 5px;
  1488. overflow: hidden;
  1489. }
  1490. .model-19 .list-wrap .item .img-wrap img{
  1491. max-width: 100%;
  1492. max-height: 100%;
  1493. }
  1494. .model-19 .list-wrap .item .content{
  1495. width: 100%;
  1496. }
  1497. .model-19 .list-wrap .item .content .content-desc {
  1498. width: 100%;
  1499. font-size: 14px;
  1500. line-height: 14px;
  1501. margin-top: 10px;
  1502. white-space: nowrap;
  1503. text-overflow: ellipsis;
  1504. overflow: hidden;
  1505. }
  1506. .model-19 .list-wrap .item .content .content-price {
  1507. font-size: 12px;
  1508. color: #FF4544;
  1509. margin-top: 10px;
  1510. height: 16px;
  1511. font-weight: 600;
  1512. }
  1513. .model-19 .list-wrap .item .content .content-price span {
  1514. font-size: 16px;
  1515. line-height: 16px;
  1516. }
  1517. .model-19 .list-wrap .item .content .content-num {
  1518. font-size: 12px;
  1519. line-height: 12px;
  1520. margin-top: 10px;
  1521. color: #909399;
  1522. text-decoration: line-through;
  1523. }
  1524. .model-19 .marketing-wrap-two {
  1525. padding: 20px 15px;
  1526. box-sizing: border-box;
  1527. background-color: #FFFFFF;
  1528. border-radius: 5px;
  1529. position: relative;
  1530. /* height: 255px;
  1531. */
  1532. }
  1533. .model-19 .marketing-wrap-two .marketing-box {
  1534. position: unset;
  1535. padding: 0;
  1536. }
  1537. .model-19 .marketing-wrap-two .marketing-box .title {
  1538. display: flex;
  1539. justify-content: space-between;
  1540. align-items: center;
  1541. padding-bottom: 5px;
  1542. }
  1543. .model-19 .marketing-wrap-two .marketing-box .title .title-left {
  1544. width: 131px;
  1545. height: 37px;
  1546. line-height: 37px;
  1547. }
  1548. .model-19 .marketing-wrap-two .marketing-box .title .title-left img {
  1549. /* width: auto;
  1550. max-width: 100%;
  1551. max-height: 100%;
  1552. */
  1553. width: 100%;
  1554. height: 100%;
  1555. }
  1556. .model-19 .marketing-wrap-two .marketing-box .title-3 {
  1557. justify-content: center;
  1558. }
  1559. .model-19 .marketing-wrap-two .marketing-box .title-3 .title-left {
  1560. width: 174px;
  1561. height: 37px;
  1562. text-align: center;
  1563. }
  1564. .model-19 .marketing-wrap-two .marketing-box .title .title-right {
  1565. font-size: 12px;
  1566. color: #909399;
  1567. }
  1568. .model-19 .marketing-wrap-two .marketing-box .title .title-right i {
  1569. font-size: 12px;
  1570. }
  1571. .model-19 .marketing-wrap-two .list-wrap .item {
  1572. width: 95px;
  1573. }
  1574. .model-19 .marketing-wrap-two .list-wrap .item .content {
  1575. position: relative;
  1576. }
  1577. .model-19 .marketing-wrap-two .list-wrap .item .img-wrap {
  1578. width: 95px;
  1579. height: 95px;
  1580. border-radius: 5px;
  1581. overflow: hidden;
  1582. position: relative;
  1583. }
  1584. .model-19 .marketing-wrap-two .list-wrap .item .img-wrap .bg {
  1585. position: absolute;
  1586. width: 95px;
  1587. height: 30px;
  1588. bottom: 0;
  1589. }
  1590. .model-19 .marketing-wrap-two .list-wrap .item .img-wrap .bg img {
  1591. width: 100%;
  1592. }
  1593. .model-19 .marketing-wrap-two .list-wrap .item .img-wrap .num {
  1594. width: 95px;
  1595. position: absolute;
  1596. bottom: 5px;
  1597. padding-left: 10px;
  1598. font-size: 12px;
  1599. line-height: 1;
  1600. color: #FFFFFF;
  1601. }
  1602. .model-19 .marketing-wrap-two .list-wrap .item .original-price {
  1603. font-size: 12px;
  1604. color: #909399;
  1605. line-height: 1;
  1606. margin-top: 10px;
  1607. text-decoration: line-through;
  1608. }
  1609. .model-19 .marketing-wrap-two .list-wrap .item .content-btn {
  1610. position: absolute;
  1611. right: 0;
  1612. bottom: 0;
  1613. display: inline-block;
  1614. width: 22px;
  1615. height: 22px;
  1616. line-height: 22px;
  1617. text-align: center;
  1618. border-radius: 50%;
  1619. background-color: #FF4544;
  1620. }
  1621. .model-19 .marketing-wrap-two .list-wrap .item .content-btn i {
  1622. color: #FFFFFF;
  1623. font-size: 13px;
  1624. }
  1625. .model-20 .marketing-box-two {
  1626. padding: 20px 15px 5px;
  1627. background-color: rgb(255, 255, 255);
  1628. border-radius: 5px;
  1629. }
  1630. .model-20 .marketing-box-two .title-wrap {
  1631. padding-bottom: 5px;
  1632. display: flex;
  1633. align-items: center;
  1634. }
  1635. .model-20 .marketing-box-two .title-wrap-2 {
  1636. justify-content: space-between;
  1637. }
  1638. .model-20 .marketing-box-two .title-wrap-2 .title-left {
  1639. width: 120px;
  1640. height: 35px;
  1641. line-height: 35px;
  1642. }
  1643. .model-20 .marketing-box-two .title-wrap .title-left img {
  1644. width: 100%;
  1645. height: 100%;
  1646. }
  1647. .model-20 .marketing-box-two .title-wrap .title-right {
  1648. font-size: 12px;
  1649. color: rgb(144, 147, 153);
  1650. }
  1651. .model-20 .marketing-box-two .title-wrap .title-right i {
  1652. font-size: 12px;
  1653. }
  1654. .model-20 .marketing-box-two .list-wrap {
  1655. flex-wrap: wrap;
  1656. margin-top: 0px;
  1657. }
  1658. .model-20 .marketing-box-two .list-wrap .item {
  1659. width: 100%;
  1660. display: flex;
  1661. height: 125px;
  1662. box-sizing: border-box;
  1663. }
  1664. .model-20 .marketing-box-two .list-wrap .img-wrap {
  1665. width: 95px;
  1666. height: 95px;
  1667. border-radius: 5px;
  1668. overflow: hidden;
  1669. flex-shrink: 0;
  1670. margin-right: 9px;
  1671. margin-top: 15px;
  1672. position: relative;
  1673. }
  1674. .model-20 .marketing-box-two .list-wrap .img-wrap > img {
  1675. width: 100%;
  1676. height: 100%;
  1677. }
  1678. .model-20 .marketing-box-two .list-wrap .img-wrap .hot {
  1679. position: absolute;
  1680. top: 3px;
  1681. left: 3px;
  1682. width: 30px;
  1683. height: 30px;
  1684. }
  1685. .model-20 .marketing-box-two .list-wrap .img-wrap .hot div {
  1686. width: 100%;
  1687. height: 100%;
  1688. position: relative;
  1689. }
  1690. .model-20 .marketing-box-two .list-wrap .img-wrap .hot div img {
  1691. width: 100%;
  1692. height: 100%;
  1693. }
  1694. .model-20 .marketing-box-two .list-wrap .img-wrap .hot div span {
  1695. display: inline-block;
  1696. width: 30px;
  1697. height: 30px;
  1698. line-height: 30px;
  1699. text-align: center;
  1700. font-size: 12px;
  1701. color: rgb(255, 255, 255);
  1702. position: absolute;
  1703. top: 0px;
  1704. left: 0px;
  1705. }
  1706. .model-20 .marketing-box-two .list-wrap .item .content {
  1707. flex:1;
  1708. padding: 15px 0px;
  1709. border-bottom: 1px solid rgb(238, 238, 238);
  1710. display: flex;
  1711. justify-content: space-between;
  1712. flex-direction: column;
  1713. }
  1714. .model-20 .marketing-box-two .list-wrap .item:last-child .content {
  1715. border-bottom: 0px;
  1716. }
  1717. .model-20 .marketing-box-two .list-wrap .item .content .content-desc {
  1718. height: 32px;
  1719. margin-top: 0px;
  1720. font-size: 14px;
  1721. line-height: 14px;
  1722. text-overflow: -o-ellipsis-lastline;
  1723. overflow: hidden;
  1724. text-overflow: ellipsis;
  1725. display: -webkit-box;
  1726. -webkit-line-clamp: 2;
  1727. line-clamp: 2;
  1728. -webkit-box-orient: vertical;
  1729. }
  1730. .model-20 .marketing-box-two .list-wrap .label {
  1731. display: flex;
  1732. align-items: center;
  1733. }
  1734. .model-20 .marketing-box-two .list-wrap .label div {
  1735. height: 15px;
  1736. line-height: 15px;
  1737. border: 1px solid rgb(255, 69, 68);
  1738. border-radius: 2px;
  1739. margin-right: 5px;
  1740. }
  1741. .model-20 .marketing-box-two .list-wrap .label .label-person i {
  1742. display: inline-block;
  1743. width: 15px;
  1744. height: 15px;
  1745. background-color: rgb(255, 69, 68);
  1746. font-size: 9px;
  1747. color: rgb(255, 255, 255);
  1748. text-align: center;
  1749. }
  1750. .model-20 .marketing-box-two .list-wrap .label div span {
  1751. font-size: 10px;
  1752. padding: 0px 5px;
  1753. color: rgb(255, 69, 68);
  1754. }
  1755. .model-20 .marketing-box-two .list-wrap .progress .img .img-con {
  1756. width: 77px;
  1757. height: 10px;
  1758. border-radius: 10px;
  1759. background-color: rgb(253, 190, 108);
  1760. }
  1761. .model-20 .marketing-box-two .list-wrap .progress .num {
  1762. font-size: 12px;
  1763. color: rgb(144, 147, 153);
  1764. margin-top: 9px;
  1765. }
  1766. .model-20 .marketing-box-two .list-wrap .bot {
  1767. display: flex;
  1768. justify-content: space-between;
  1769. align-items: flex-end;
  1770. }
  1771. .model-20 .marketing-box-two .list-wrap .bot .content-price {
  1772. display: flex;
  1773. align-items: flex-end;
  1774. font-size: 12px;
  1775. color: #FF4544;
  1776. font-weight: 600;
  1777. }
  1778. .model-20 .marketing-box-two .list-wrap .bot .content-price span {
  1779. font-size: 16px;
  1780. margin-right: 5px;
  1781. }
  1782. .model-20 .marketing-box-two .list-wrap .bot .content-price .content-num {
  1783. font-weight: 500;
  1784. margin-top: 0px;
  1785. font-size: 12px;
  1786. line-height: 12px;
  1787. color: rgb(144, 147, 153);
  1788. text-decoration: line-through;
  1789. }
  1790. .model-20 .marketing-box-two .list-wrap .bot .layui-btn {
  1791. background-color: rgb(255, 69, 68);
  1792. color:#fff;
  1793. font-size: 14px;
  1794. width: 80px;
  1795. height: 25px;
  1796. line-height: 25px;
  1797. text-align: center;
  1798. border-radius: 25px;
  1799. }
  1800. .model-20 .marketing-box-3 {
  1801. padding-bottom: 0px;
  1802. }
  1803. .model-20 .marketing-box-two .title-wrap-3 {
  1804. justify-content: center;
  1805. }
  1806. .model-20 .marketing-box-two .title-wrap-3 .title-left {
  1807. width: 174px;
  1808. height: 37px;
  1809. text-align: center;
  1810. line-height: 37px;
  1811. }
  1812. .model-20 .marketing-box-two .more {
  1813. text-align: center;
  1814. height: 50px;
  1815. line-height: 50px;
  1816. border-top: 1px solid rgb(238, 238, 238);
  1817. }
  1818. .model-20 .marketing-box-two .more span, .marketing-box-two .more i {
  1819. font-size: 12px;
  1820. color: rgb(144, 147, 153);
  1821. }
  1822. .model-21 .list-wrap {
  1823. display: flex;
  1824. justify-content: space-between;
  1825. margin-top: 15px;
  1826. }
  1827. .model-21 .list-wrap .item {
  1828. display: inline-block;
  1829. width: 100px;
  1830. }
  1831. .model-21 .list-wrap .item .img-wrap{
  1832. width: 100px;
  1833. height: 100px;
  1834. border-radius: 5px;
  1835. overflow: hidden;
  1836. }
  1837. .model-21 .list-wrap .item .img-wrap img{
  1838. max-width: 100%;
  1839. max-height: 100%;
  1840. }
  1841. .model-21 .list-wrap .item .content{
  1842. width: 100%;
  1843. }
  1844. .model-21 .list-wrap .item .content .content-desc {
  1845. width: 100%;
  1846. font-size: 14px;
  1847. line-height: 14px;
  1848. margin-top: 10px;
  1849. white-space: nowrap;
  1850. text-overflow: ellipsis;
  1851. overflow: hidden;
  1852. }
  1853. .model-21 .list-wrap .item .content .content-price {
  1854. font-size: 12px;
  1855. color: #FF4544;
  1856. margin-top: 10px;
  1857. height: 16px;
  1858. font-weight: 600;
  1859. }
  1860. .model-21 .list-wrap .item .content .content-price span {
  1861. font-size: 16px;
  1862. line-height: 16px;
  1863. }
  1864. .model-21 .list-wrap .item .content .content-num {
  1865. font-size: 12px;
  1866. line-height: 12px;
  1867. margin-top: 10px;
  1868. color: #909399;
  1869. }
  1870. .model-21 .marketing-wrap-two {
  1871. padding: 20px 15px;
  1872. box-sizing: border-box;
  1873. background-color: #FFFFFF;
  1874. border-radius: 5px;
  1875. position: relative;
  1876. /* height: 255px;
  1877. */
  1878. }
  1879. .model-21 .marketing-wrap-two .marketing-box {
  1880. position: unset;
  1881. padding: 0;
  1882. }
  1883. .model-21 .marketing-wrap-two .marketing-box .title {
  1884. display: flex;
  1885. justify-content: space-between;
  1886. align-items: center;
  1887. padding-bottom: 5px;
  1888. }
  1889. .model-21 .marketing-wrap-two .marketing-box .title .title-left {
  1890. width: 109px;
  1891. height: 37px;
  1892. line-height: 37px;
  1893. }
  1894. .model-21 .marketing-wrap-two .marketing-box .title .title-left img {
  1895. /* width: auto;
  1896. max-width: 100%;
  1897. max-height: 100%;
  1898. */
  1899. width: 100%;
  1900. height: 100%;
  1901. }
  1902. .model-21 .marketing-wrap-two .marketing-box .title-3 {
  1903. justify-content: center;
  1904. }
  1905. .model-21 .marketing-wrap-two .marketing-box .title-3 .title-left {
  1906. width: 174px;
  1907. height: 37px;
  1908. text-align: center;
  1909. }
  1910. .model-21 .marketing-wrap-two .marketing-box .title .title-right {
  1911. font-size: 12px;
  1912. color: #909399;
  1913. }
  1914. .model-21 .marketing-wrap-two .marketing-box .title .title-right i {
  1915. font-size: 12px;
  1916. }
  1917. .model-21 .marketing-wrap-two .list-wrap .item {
  1918. width: 95px;
  1919. }
  1920. .model-21 .marketing-wrap-two .list-wrap .item .content {
  1921. position: relative;
  1922. }
  1923. .model-21 .marketing-wrap-two .list-wrap .item .img-wrap {
  1924. width: 95px;
  1925. height: 95px;
  1926. border-radius: 5px;
  1927. overflow: hidden;
  1928. position: relative;
  1929. }
  1930. .model-21 .marketing-wrap-two .list-wrap .item .img-wrap .bg {
  1931. position: absolute;
  1932. width: 95px;
  1933. height: 30px;
  1934. bottom: 0;
  1935. }
  1936. .model-21 .marketing-wrap-two .list-wrap .item .img-wrap .bg img {
  1937. width: 100%;
  1938. }
  1939. .model-21 .marketing-wrap-two .list-wrap .item .img-wrap .num {
  1940. width: 95px;
  1941. position: absolute;
  1942. bottom: 5px;
  1943. padding-left: 10px;
  1944. font-size: 12px;
  1945. line-height: 1;
  1946. color: #FFFFFF;
  1947. }
  1948. .model-21 .marketing-wrap-two .list-wrap .item .original-price {
  1949. font-size: 12px;
  1950. color: #909399;
  1951. line-height: 1;
  1952. margin-top: 10px;
  1953. text-decoration: line-through;
  1954. }
  1955. .model-21 .marketing-wrap-two .list-wrap .item .content-btn {
  1956. position: absolute;
  1957. right: 0;
  1958. bottom: 0;
  1959. display: inline-block;
  1960. width: 22px;
  1961. height: 22px;
  1962. line-height: 22px;
  1963. text-align: center;
  1964. border-radius: 50%;
  1965. background-color: #FF4544;
  1966. }
  1967. .model-21 .marketing-wrap-two .list-wrap .item .content-btn i {
  1968. color: #FFFFFF;
  1969. font-size: 13px;
  1970. }
  1971. .model-22 .marketing-box-two {
  1972. padding: 20px 15px 5px;
  1973. background-color: #FFFFFF;
  1974. border-radius: 5px;
  1975. }
  1976. .model-22 .marketing-box-two .title-wrap {
  1977. padding-bottom: 5px;
  1978. display: flex;
  1979. align-items: center;
  1980. }
  1981. .model-22 .marketing-box-two .title-wrap-2 {
  1982. justify-content: space-between;
  1983. }
  1984. /* .marketing-box-two .title-wrap-2 .title-left .img {
  1985. display: inline-block;
  1986. width: 103px;
  1987. height: 16px;
  1988. line-height: 16px;
  1989. }
  1990. */
  1991. .model-22 .marketing-box-two .title-wrap .title-left img {
  1992. width: 103px;
  1993. height: 16px;
  1994. }
  1995. .model-22 .marketing-box-two .title-wrap .title-left .time {
  1996. height: 16px;
  1997. line-height: 16px;
  1998. margin-top: 10px;
  1999. font-size: 12px;
  2000. }
  2001. .model-22 .marketing-box-two .title-wrap .title-left .time {
  2002. color: rgba(255, 69, 68, .5);
  2003. }
  2004. .model-22 .marketing-box-two .title-wrap .title-left .time .font {
  2005. margin-right: 6px;
  2006. }
  2007. .model-22 .marketing-box-two .title-wrap .title-left .time span {
  2008. display: inline-block;
  2009. width: 16px;
  2010. height: 16px;
  2011. border-radius: 2px;
  2012. background-color: #303133;
  2013. color: #FFFFFF;
  2014. text-align: center;
  2015. margin: 0 3px;
  2016. }
  2017. .model-22 .marketing-box-two .title-wrap .title-right {
  2018. font-size: 12px;
  2019. color: #909399;
  2020. }
  2021. .model-22 .marketing-box-two .title-wrap .title-right i {
  2022. font-size: 12px;
  2023. }
  2024. .model-22 .marketing-box-two .list-wrap {
  2025. flex-wrap: wrap;
  2026. }
  2027. .model-22 .marketing-box-two .list-wrap .item {
  2028. width: 100%;
  2029. display: flex;
  2030. height: 125px;
  2031. box-sizing: border-box;
  2032. }
  2033. .model-22 .marketing-box-two .list-wrap .img-wrap {
  2034. width: 95px;
  2035. height: 95px;
  2036. border-radius: 5px;
  2037. overflow: hidden;
  2038. flex-shrink: 0;
  2039. margin-right: 9px;
  2040. margin-top: 15px;
  2041. position: relative;
  2042. }
  2043. .model-22 .marketing-box-two .list-wrap .img-wrap>img {
  2044. width: 100%;
  2045. height: 100%;
  2046. }
  2047. .model-22 .marketing-box-two .list-wrap .img-wrap .hot {
  2048. position: absolute;
  2049. top: 3px;
  2050. left: 3px;
  2051. width: 30px;
  2052. height: 30px;
  2053. }
  2054. .model-22 .marketing-box-two .list-wrap .img-wrap .hot div {
  2055. width: 100%;
  2056. height: 100%;
  2057. position: relative;
  2058. }
  2059. .model-22 .marketing-box-two .list-wrap .img-wrap .hot div img {
  2060. width: 100%;
  2061. height: 100%;
  2062. }
  2063. .model-22 .marketing-box-two .list-wrap .img-wrap .hot div span {
  2064. display: inline-block;
  2065. width: 30px;
  2066. height: 30px;
  2067. line-height: 30px;
  2068. text-align: center;
  2069. font-size: 12px;
  2070. color: #FFFFFF;
  2071. position: absolute;
  2072. top: 0;
  2073. left: 0;
  2074. }
  2075. .model-22 .marketing-box-two .list-wrap .item .content {
  2076. padding: 15px 0;
  2077. border-bottom: 1px solid #EEEEEE;
  2078. display: flex;
  2079. justify-content: space-between;
  2080. flex-direction: column;
  2081. flex:1;
  2082. }
  2083. .model-22 .marketing-box-two .list-wrap .item:last-child .content {
  2084. border-bottom: 0px;
  2085. }
  2086. .model-22 .marketing-box-two .list-wrap .item .content .content-desc {
  2087. height: 32px;
  2088. margin-top: 0;
  2089. font-size: 14px;
  2090. line-height: 14px;
  2091. text-overflow: -o-ellipsis-lastline;
  2092. overflow: hidden;
  2093. text-overflow: ellipsis;
  2094. display: -webkit-box;
  2095. -webkit-line-clamp: 2;
  2096. line-clamp: 2;
  2097. -webkit-box-orient: vertical;
  2098. }
  2099. .model-22 .marketing-box-two .list-wrap .mprogress {
  2100. display: flex;
  2101. align-items: center;
  2102. }
  2103. .model-22 .marketing-box-two .list-wrap .mprogress .img {
  2104. width: 120px;
  2105. height: 10px;
  2106. border-radius: 10px;
  2107. background-color: #FCECD7;
  2108. margin-right: 10px;
  2109. }
  2110. .model-22 .marketing-box-two .list-wrap .mprogress .img .img-con {
  2111. width: 77px;
  2112. height: 10px;
  2113. border-radius: 10px;
  2114. background-color: #FDBE6C;
  2115. }
  2116. .model-22 .marketing-box-two .list-wrap .mprogress .num {
  2117. font-size: 12px;
  2118. color: #909399;
  2119. }
  2120. .model-22 .marketing-box-two .list-wrap .bot {
  2121. display: flex;
  2122. justify-content: space-between;
  2123. align-items: flex-end;
  2124. }
  2125. .model-22 .marketing-box-two .list-wrap .bot .content-price {
  2126. font-size: 12px;
  2127. color: #FF4544;
  2128. margin-top: 10px;
  2129. height: 16px;
  2130. font-weight: 600;
  2131. display: flex;
  2132. align-items: flex-end;
  2133. }
  2134. .model-22 .marketing-box-two .list-wrap .bot .content-price span {
  2135. font-size: 16px;
  2136. margin-right: 5px;
  2137. }
  2138. .model-22 .marketing-box-two .list-wrap .bot .content-price .content-num {
  2139. font-weight: 500;
  2140. margin-top: 0;
  2141. font-size: 12px;
  2142. line-height: 12px;
  2143. color: #909399;
  2144. text-decoration: line-through;
  2145. }
  2146. .model-22 .marketing-box-two .list-wrap .bot .layui-btn {
  2147. background-color: rgb(255, 69, 68);
  2148. color:#fff;
  2149. font-size: 14px;
  2150. width: 80px;
  2151. height: 25px;
  2152. line-height: 25px;
  2153. text-align: center;
  2154. border-radius: 25px;
  2155. }
  2156. .model-22 .marketing-box-3 {
  2157. padding-bottom: 0;
  2158. }
  2159. .model-22 .marketing-box-two .title-wrap-3 {
  2160. justify-content: center;
  2161. }
  2162. .model-22 .marketing-box-two .title-wrap-3 .title-left .img img {
  2163. width: 174px;
  2164. height: 17px;
  2165. }
  2166. .model-22 .marketing-box-two .title-wrap-3 .title-left .time {
  2167. text-align: center;
  2168. }
  2169. .model-22 .marketing-box-two .more {
  2170. text-align: center;
  2171. height: 50px;
  2172. line-height: 50px;
  2173. border-top: 1px solid #EEEEEE;
  2174. }
  2175. .model-22 .marketing-box-two .more span, .marketing-box-two .more i {
  2176. font-size: 12px;
  2177. color: #909399;
  2178. }