@charset "UTF-8";

.direct_menu {overflow: hidden;}
.direct_menu li {width: 50%;margin-top: 0 !important;float: left;}
.direct_menu li a {width: 100%;padding: 20px 20px 20px 85px;font-family: 'noto-medium';text-align: left;position: relative;display: table;}
.direct_menu li a .pic {width: 50px;height: 50px;margin-top: -25px;background-color: #fff;border-radius: 50%;overflow: hidden;position: absolute;top:50%;left:20px;}
.direct_menu li a .pic img {width: 100%;}
.direct_menu li a .txt {height: 50px;display: table-cell;vertical-align: middle;font-size:16px;color: #fff;line-height: 20px;}
.direct_menu li:nth-child(1), .direct_menu li:nth-child(4), .direct_menu li:nth-child(5) {background-color: #4c5c67;}
.direct_menu li:nth-child(2), .direct_menu li:nth-child(3), .direct_menu li:nth-child(6) {background-color: #61707c;}

/* Tablet */
@media screen and (max-width: 1200px) {
    .direct_menu li {width: 16%;margin-left: 0.8%;text-align: center;}
    .direct_menu li:first-child {margin-left: 0;}
    .direct_menu li a {padding: 85px 15px 25px 15px;text-align: center;display: block;}
    .direct_menu li a .pic {margin-top: 0;margin-left: -25px;top:25px;left:50%;}
    .direct_menu li a .txt {height: auto;display: block;font-size:16px;font-size:14px;line-height: 18px;}
    .direct_menu li:nth-child(1), .direct_menu li:nth-child(4), .direct_menu li:nth-child(5) {background-color: #a9a9b9;}
    .direct_menu li:nth-child(2), .direct_menu li:nth-child(3), .direct_menu li:nth-child(6) {background-color: #2c4861;}
}

/* Mobile */
@media screen and (max-width: 768px) {
    .direct_menu li {width: 32%;margin-left: 2%;}
    .direct_menu li:nth-child(3n+1) {margin-left: 0;}
    .direct_menu li:nth-child(n+4) {margin-top: 2% !important;}
    .direct_menu li a {padding: 70px 15px 15px;}
    .direct_menu li a .pic {width: 48px;height: 48px;margin-left: -24px;top:15px;}
    .direct_menu li a .txt {font-size:13px;line-height: 16px;}
}
