.footer2_box_pc { width: 100%; background: #1D1C1C; position: relative; } .footer2_box_pc .top_box { padding: 1.025rem 3.25rem 1.075rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); position: relative; } .footer2_box_pc .top_box .tel_box { margin-right: 1.4rem; } .footer2_box_pc .top_box .tel_box .name_company { /* font-size: 0.225rem; */ line-height: 1; margin-bottom: 0.525rem; } .footer2_box_pc .top_box .tel_box .tel { /* font-size: 0.3rem; */ line-height: 1; margin-bottom: 0.175rem; } .footer2_box_pc .top_box .tel_box .adress { /* font-size: 0.175rem; */ line-height: 1; } .footer2_box_pc .top_box .logo_box { width: 2.0625rem; height: 0.625rem; margin-bottom: 0.6125rem; } .footer2_box_pc .top_box .logo_box img { width: 100%; height: 100%; } .footer2_box_pc .top_box .foot_nav .footNav_div { margin-right: 1.125rem; } .footer2_box_pc .top_box .foot_nav .footNav_div:last-child { margin-right: 0; } .footer2_box_pc .top_box .foot_nav .footNav_div .footNav_item { display: block; /* font-size: 0.225rem; */ line-height: 1; color: #fff; cursor: pointer; flex-direction: column; } .footer2_box_pc .top_box .foot_nav .footNav_div .item_box { margin-top: 0.2rem; } .footer2_box_pc .top_box .foot_nav .footNav_div .item_box li { margin-top: 0.3rem; line-height: 1; } .footer2_box_pc .top_box .foot_nav .footNav_div .item_box li a { color: rgba(255, 255, 255, 0.4); /* font-size: 0.175rem; */ font-size: 14px; } .footer2_box_pc .top_box .share_box { margin-top: 0.95rem; height: 0.475rem; } .footer2_box_pc .top_box .share_box .share_tit { color: rgba(255, 255, 255, 0.5); /* font-size: 0.175rem; */ line-height: 1; } .footer2_box_pc .top_box .share_box .share_item { width: 0.475rem; height: 0.475rem; border-radius: 50%; margin-right: 0.1875rem; position: relative; cursor: pointer; border: 1px solid rgba(0, 0, 0, 0.1); transition: all 0.5s; margin-top: 0.275rem; background-color: #3E3E3E; } .footer2_box_pc .top_box .share_box .share_item:last-child { margin-right: 0; } .footer2_box_pc .top_box .share_box .share_item .share_icon { display: block; width: 0.2125rem; height: 0.2125rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .footer2_box_pc .top_box .share_box .share_item .wx { background: url('../../../img/222.png') center center no-repeat; background-size: 100% 100%; } .footer2_box_pc .top_box .share_box .share_item:hover { background-color: #008E3F; border-color: #008E3F; } .footer2_box_pc .top_box .share_box .share_item:hover .wx { background: url('../../../img/222.png') center center no-repeat; background-size: 100% 100%; } .footer2_box_pc .bot_box { height: 1.5375rem; padding: 0.6rem 3.25rem 0; } .footer2_box_pc .bot_box p { /* font-size: 0.2rem; */ color: rgba(255, 255, 255, 0.3); } .footer2_box_pc .bot_box p:last-child { /* font-size: 0.175rem; */ } .footer2_box_pc .back_top_box { width: 0.575rem; height: 0.575rem; background: #008E3F; border-radius: 50%; position: absolute; bottom: 4.525rem; right: 1.2125rem; z-index: 1000; cursor: pointer; } .footer2_box_pc .back_top_box:after { display: block; content: ''; width: 0.225rem; height: 0.225rem; background: url('../../../img/fhdb.png') center center no-repeat; background-size: 100% 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .footer2_box_h5 { display: none; } @media (max-width: 1150px) { .footer2_box_pc .top_box .tel_box { margin-right: 0; } .footer2_box_pc .top_box .foot_nav .footNav_div { margin-right: 0.9375rem; } } @media (max-width: 1024px) { .footer2_box_pc .top_box { padding: 1rem 5%; } .footer2_box_pc .back_top_box { bottom: 3.5rem; } .footer2_box_pc .bot_box { padding: .5rem 5% 0; } } @media (max-width: 850px) { .footer2_box_pc .top_box .tel_box { margin-right: 0; } .footer2_box_pc .top_box .foot_nav .footNav_div { margin-right: 0.4375rem; } } @media (max-width: 997px) { .footer2_box_pc { display: none; } .footer2_box_h5 { display: block; height: auto; background: #E8E8E8; position: relative; } .footer2_box_h5 .top_box { width: 100%; height: auto; padding: 0.775rem 5% 0.425rem; margin: 0 auto; border-bottom: 1px solid #D2CFD2; } .footer2_box_h5 .top_box .logo_box { width: 2.35rem; height: 0.7125rem; margin: 0 auto 0.7rem; } .footer2_box_h5 .top_box .logo_box img { width: 100%; height: 100%; } .footer2_box_h5 .top_box .foot_nav { display: none; } .footer2_box_h5 .top_box .tel_box { position: unset; width: 100%; } .footer2_box_h5 .top_box .tel_box .name_company { font-size: 0.3rem; margin-bottom: 0.4rem; } .footer2_box_h5 .top_box .tel_box .tel { font-size: 0.45rem; margin-bottom: 0.2375rem; } .footer2_box_h5 .top_box .tel_box .adress { font-size: 0.3rem; color: rgba(51, 51, 51, 0.5); } .footer2_box_h5 .top_box .share_box { margin-top: 0.4625rem; height: 0.475rem; } .footer2_box_h5 .top_box .share_box .share_item { width: 0.8rem; height: 0.8rem; border-radius: 50%; margin-right: 0.1875rem; position: relative; cursor: pointer; border: 1px solid rgba(0, 0, 0, 0.1); transition: all 0.5s; } .footer2_box_h5 .top_box .share_box .share_item:last-child { margin-right: 0; } .footer2_box_h5 .top_box .share_box .share_item .share_icon { display: block; width: 0.5rem; height: 0.5rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .footer2_box_h5 .top_box .share_box .share_item .wx { background: url('../../../img/222.png') center center no-repeat; background-size: 100% 100%; } .footer2_box_h5 .top_box .share_box .share_item:hover { background-color: #fff; border-color: #fff; } .footer2_box_h5 .top_box .share_box .share_item:hover .wx { background: url('../../../img/222.png') center center no-repeat; background-size: 100% 100%; } .footer2_box_h5 .bot_box { padding: 0.425rem 5% 0.75rem; height: auto; flex-flow: column; justify-content: center; } .footer2_box_h5 .bot_box .mb15 { margin-bottom: 0.1875rem; } .footer2_box_h5 .back_top_box { top: 0.9125rem; right: 0.7rem; } } .hov-pic { position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); width: 1.5rem; opacity: 0; visibility: hidden; transition: all .3s; } .hov-pic img { width: 100%; } .footer_box_pc .top_box .share_box .share_item:hover .hov-pic { visibility: visible; opacity: 1; top: calc(100% + 5px); }