@charset "UTF-8";
/*
 * @Author: wuhaijing 
 * @Date: 2019-09-05 15:42:28 
 * @Last Modified by: whj
 * @Last Modified time: 2021-11-17 15:32:55
 */
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box; }

img {
  border: 0;
  vertical-align: top; }

a,
button {
  outline: none;
  -webkit-tap-highlight-color: transparent; }

button {
  background-color: transparent;
  border: 0;
  text-indent: -99999px;
  cursor: pointer; }

a {
  text-decoration: none;
  transition: filter .3s ease-in-out; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

button,
input,
select,
textarea {
  font-size: 100%;
  outline: none; }

ul,
li {
  list-style: none; }

body {
  background: url("https://web-resource.17m3.com/m3guo/202111/diamond-1fkmcnluo/body_bg.jpg") no-repeat center 42px;
  color: #f1eedc;
  min-width: 1200px;
  font: 14px/1.5 "微软雅黑"; }

#container {
  position: relative;
  margin: 0 auto;
  width: 1080px;
  height: 1080px;
  background: url("https://web-resource.17m3.com/m3guo/202111/diamond-1fkmcnluo/warp_bg.jpg") no-repeat 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 300px; }

#logo {
  position: absolute;
  left: 40px;
  top: 45px;
  width: 200px;
  height: 150px;
  text-indent: -9999px;
  background: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/logo.png") no-repeat center center; }

#main {
  width: 1000px;
  margin-top: 20px;
  display: flex;
  justify-content: space-between; }

.menu {
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  .menu-item {
    text-indent: -9999px;
    width: 220px;
    height: 77px;
    background: no-repeat 0 0; }
    .menu-item.is-crt {
      animation: flipInX 1s linear; }

.menu-item[data-num="a"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_a.png"); }
  .menu-item[data-num="a"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_a_crt.png"); }

.menu-item[data-num="b"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_b.png"); }
  .menu-item[data-num="b"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_b_crt.png"); }

.menu-item[data-num="c"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_c.png"); }
  .menu-item[data-num="c"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_c_crt.png"); }

.menu-item[data-num="d"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_d.png"); }
  .menu-item[data-num="d"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_d_crt.png"); }

.menu-item[data-num="e"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_e.png"); }
  .menu-item[data-num="e"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_e_crt.png"); }

.menu-item[data-num="f"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_f.png"); }
  .menu-item[data-num="f"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_f_crt.png"); }

.menu-item[data-num="g"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_g.png"); }
  .menu-item[data-num="g"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_g_crt.png"); }

.menu-item[data-num="h"] {
  background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_h.png"); }
  .menu-item[data-num="h"].is-crt {
    background-image: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/menu_h_crt.png"); }

#box {
  margin: 0 10px;
  position: relative; }

#box,
.part {
  width: 540px;
  height: 320px; }

.part {
  padding: 40px 66px 0;
  background: url("https://web-resource.17m3.com/m3guo/202108/diamond-new/box_bg.png") no-repeat 0 0;
  display: none; }
  .part.is-crt {
    display: block; }
  .part-h2 {
    font-size: 24px;
    font-weight: bold;
    color: #fea031;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px; }
  .part-price {
    font-size: 32px;
    color: #fe5c31;
    margin: 0 5px; }
  .part-date {
    position: absolute;
    left: 0;
    top: 96px;
    width: 100%;
    text-align: center;
    margin-bottom: 10px; }
  .part-list {
    display: flex;
    justify-content: center;
    margin-bottom: 15px; }
  .part-item {
    background-color: #004e8a;
    border: 1px solid #032b49;
    padding: 1px;
    margin: 0 5px; }
  .part-pic {
    border: 11px solid #023c69; }
  .part-ft {
    padding-left: 18px;
    border-bottom: 1px dashed #012744;
    display: flex;
    color: #83d8ff;
    padding-bottom: 3px;
    margin-bottom: 5px; }
    .part-ft__label {
      width: 17px;
      height: 17px;
      border-radius: 3px;
      background-color: #018fbe;
      text-align: center;
      line-height: 17px;
      color: #022a49;
      margin-right: 15px; }

.fc-mark {
  color: #fee331; }

.hid {
  text-indent: -999em;
  font-size: 0;
  overflow: hidden;
  width: 0;
  height: 0;
  display: block; }

#fn-tips {
  position: fixed;
  z-index: 101;
  left: 0;
  top: 0;
  display: none;
  border: 1px solid #76582a;
  box-shadow: 0 0 1px #3d301c inset; }
  #fn-tips.fn-show {
    display: block; }
  #fn-tips__desc {
    padding: 10px;
    background-color: rgba(27, 26, 24, 0.95);
    font-size: 12px;
    line-height: 1.5;
    color: #fff;
    max-width: 320px;
    min-width: 200px; }

@keyframes flipInX {
  0% {
    transform: perspective(400px) rotateX(90deg); }
  40% {
    transform: perspective(400px) rotateX(-10deg); }
  100% {
    transform: perspective(400px) rotateX(0deg); } }
