@font-face {
  font-family:'webfont';font-display:swap;src:url('//at.alicdn.com/t/webfont_i85w5kbfwn8.eot');/* IE9*/
  src:url('//at.alicdn.com/t/webfont_i85w5kbfwn8.eot?#iefix') format('embedded-opentype'),/* IE6-IE8 */
  url('//at.alicdn.com/t/webfont_i85w5kbfwn8.woff2') format('woff2'),url('//at.alicdn.com/t/webfont_i85w5kbfwn8.woff') format('woff'),/* chrome、firefox */
  url('//at.alicdn.com/t/webfont_i85w5kbfwn8.ttf') format('truetype'),/* chrome、firefox、opera、Safari,Android,iOS 4.2+*/
  url('//at.alicdn.com/t/webfont_i85w5kbfwn8.svg#Alibaba-PuHuiTi-Regular') format('svg');/* iOS 4.1- */
  
}
.web-font { font-family:"webfont" !important; font-size:16px; font-style:normal; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
* { --color-purple:#9d3172; --color-white:#ffffff; --color-bg1:#fff5fb; }
/*头部*/
#cuisine { width:80%; background-color:var(--color-white); padding-left:10%; padding-right:10%; padding-bottom:50px; display:flex; padding-top:37px; flex-direction:column; }
#cuisine .top { width:100%; display:flex; margin:0 1%; margin-top:40px; margin-bottom:30px; }
#cuisine .top > div:nth-child(1) { width:calc(50% - 40px); height:400px; position:relative; }
#cuisine .top > div:nth-child(1) > img { width:100%; height:100%; object-fit:cover; }
#cuisine .top > div:nth-child(1) > span { letter-spacing:2px; background-color:rgba(0,0,0,0.6); width:100%; color:var(--color-white); font-size:1.3rem; font-weight:"webfont"; position:absolute; bottom:0; left:0; right:0; text-align:center; padding:17px 0; }
#cuisine .top > div:nth-child(2) { width:50%; margin-left:40px; display:flex; flex-direction:column; justify-content:center; }
#cuisine .top > div:nth-child(2) > span:nth-child(1) { padding-right:70px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#171717; font-weight:bold; font-size:1.75rem; font-family:"webfont"; }
#cuisine .top > div:nth-child(2) > span:nth-child(2) { padding-right:70px; color:#434343; margin-top:20px; font-size:1.3rem; }
/*内容*/
#cuisine .content { width:100%; display:flex; flex-wrap:wrap; }
#cuisine .content > .item { width:23%; margin:0 1%; position:relative; margin-bottom:30px; }
#cuisine .content > .item:hover > span { -webkit-clip-path:polygon(0 100%,100% 100%,100% 0,0 0); clip-path:polygon(0 100%,100% 100%,100% 0,0 0); }
#cuisine .content > .item > img { width:100%; height:186px; object-fit:cover; }
#cuisine .content > .item > span { letter-spacing:2px; background-color:rgba(0,0,0,0.6); width:100%; color:var(--color-white); font-size:1.3rem; font-weight:"webfont"; position:absolute; bottom:0; left:0; right:0; text-align:center; padding:17px 0; transition:all 0.3s ease-out; -webkit-clip-path:polygon(0 100%,100% 100%,100% 100%,0% 100%); clip-path:polygon(0 100%,100% 100%,100% 100%,0% 100%); }
/*搜索*/
#cuisine >div:nth-child(1) { display:flex; margin:0 1%; margin-top:3px; }
#cuisine .search { display:flex; justify-content:center; align-items:center; width:80px; height:80px; background-color:#eeeeee; }
#cuisine .search { display:flex; justify-content:center; align-items:center; width:80px; height:80px; background-color:#eeeeee; }
#cuisine .search_input { width:0px; height:80px; background-color:#eeeeee; font-size:1.3rem; padding:0; transition:all .3s linear; }
#cuisine .search_input-aciton { width:calc(50% - 130px); padding:0 15px; }
