/*today_gold*/

.main_banner {
    width: 100%;
    height: 100vh;
    background: url(../image/main_banner_20230825.jpg)no-repeat center center / cover;
    /* background: url(../image/main_banner_20230818.jpg)no-repeat center center / cover; */
    /* background: url(../image/main_banner.png)no-repeat center center / cover; */
    position: relative;
    top: 0;
}
.main_banner .quick_bt {
    position: absolute;
    bottom: 35%;
    left: 70%;
    border: 1px solid #C07F00;
    color: #C07F00;
    padding: 20px 25px;
    font-size: 20px;
    letter-spacing: 0.2em;
    display: block;
    border-radius: 3px;
    z-index: 10;
}
.main_banner .quick_bt:hover {
    box-shadow: 3px 3px 3px rgba(139, 109, 63, 0.1);
}
.main_banner .quick_bt span {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(../image/down_brown.svg)no-repeat 0 0 /contain;
    position: relative;
    top: 2px;
    margin-left: 10px;
}

.today_gold {
    display: flex;
    align-items: center;
    height: 80vh;
    position: absolute;
    width: 1300px;
    max-width: 1300px;
    height: 100%;
    top: 0;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
}
.today_gold .bg {
    width: 100%;
    display: flex;
    position: absolute;
    top: 0;
    z-index: -1;
}
.today_gold .bg div{
    width: 40%;
}

.today_gold .bg .img {
    width: 60%;
    background: url(../image/main.png)no-repeat 0px 0px /cover;
}
.gold_wrap {
    width: 45%;
    height: 100%;
    padding: 40px;
    background: rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.gold_wrap ul.chart {
    width: 100%;
}
.gold_wrap ul.chart li:nth-child(odd)>.bar {
    display: inline-block;
    width: 1px;
    height: 30px;
    background: #d1d1d1;
}
.gold_wrap ul.chart li:nth-child(even)>.bar {
    display: inline-block;
    width: 1px;
    height: 30px;
    background: #fff;
}
.gold_wrap h3 {
    border-radius: 100px;
    background: var(--white-color);
    border: 1px solid var(--line-color);
    width: 20%;
    min-width: 120px;
    text-align: center;
    padding: 8px 20px;
    font-size: 20px;
    margin-bottom: 20px;
}
.gold_wrap ul.chart li {
    display: flex;
    width: 100%;
    justify-content: space-around;
    margin: 1vw 0;
    min-height: 90px;
    align-items: center;
    background: var(--white-color);
    border-radius: 14px;
    border:1px solid var(--line-color);
    padding: 0.5vh;
    color: #666;
}

.gold_wrap ul.chart li div {
    width: 33.3333%;
    text-align: center;
    font-weight: 500;
}

.gold_wrap ul.chart li:nth-child(1) div {
    font-weight: bold;
}
.gold_wrap ul.chart li .today {
    display: flex;
    flex-direction: column;
}
.gold_wrap .today .up::before {
    content: "";
    display: inline-block;
    background: url(../image/up.svg)no-repeat 0 0/contain;
    width: 10px;
    height: 10px;
    margin-right: 5px;
}
.gold_wrap .today .down::before {
    content: "";
    display: inline-block;
    background: url(../image/down.svg)no-repeat 0 0 /contain;
    width: 10px;
    height: 10px;
    margin-right: 5px;
}
.gold_wrap ul.chart .pay {
    background: none;
    border: none;
    color: var(--white-color);
    min-height: 30px;
}
.gold_wrap ul.chart li:nth-child(even) {
    background: #e7e7e7;
}
/*main*/
.quick_menu {
    margin-top: 100px;
    display: flex;
    gap: 5%;
    width: 100%;
    justify-content: center;
}
.quick_menu .inner {
    display: flex;
    padding: 4% 2%;
    border-radius: 14px;
    width: 40%;
    justify-content: center;
    align-items: center;
    background: #ffd470;
}
.quick_menu .inner:hover {
    box-shadow:5px 5px 5px rgba(0,0,0,0.1);
    transition: 0.5s;
}
.quick_menu .inner ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}
.quick_menu .inner img {display: block; width: 60%;}
.quick_menu .inner ul li:nth-child(1) {border-radius: 300px;  width: 150px; height: 120px; display: flex; align-items:end;justify-content: center;}
.quick_menu .inner ul li:nth-child(2) {font-size: 24px; font-weight: 700;color: var(--brown-color);}
.quick_menu .inner ul .go {background: url(../image/go.svg)no-repeat 0 0 /contain;width: 50px; height: 50px;}

