.container { padding:30px 0; position: relative; overflow: auto; }
.rem_box { background-image: url("../img/svg/icon_search.svg"); background-repeat: no-repeat; background-position: 98%, center;  }
.tree1 ul { padding-top: 20px;  position: relative; display: flex; }
.tree1 li { text-align: center; position: relative; padding: 20px 5px 0 5px; }
.tree_wrap { width:100%;  max-width:768px;  margin:0 auto;  padding:0 10px;  overflow:auto; }
.user_infom { word-break: break-all; border: 2px solid #c3c3c3; display: inline-block; width: 190px;  border-radius: 6px; background: #fff; }
.tree_idbox { display:flex; align-items: center; justify-content: center; padding:10px; border-radius: 4px 4px 0 0; color:#fff; background-color:#c3c3c3; height:40px; font-weight:600; height:auto; font-size:12px;}
.set1 {width:100%; height:1px; margin:0 auto;}
.tree_imgbox img { width:30px;}
.tree_imgbox, .tree_datebox { padding:8px 0; font-size:12px; font-weight:400; color:#000;}
.tree_namebox {font-size:12px; font-weight:600; color:#000;}
.tree_search{padding:0 20px;}

.container {-ms-overflow-style: none; scrollbar-width: none; max-width:unset;}
.container::-webkit-scrollbar { display:none; }

.tree1 li:only-child{ padding-top: 0; margin: auto; }

.tree1 li::before, .tree1 li::after{ content: ''; position: absolute; top: 0; right: 50%; border-top: 2px solid #c3c3c3; width: 50%; height: 18px; }
.tree1 li::after{ right: auto; left: 50%; border-left: 2px solid #c3c3c3; }
.tree1 li:only-child::after, .tree1 li:only-child::before { display: none; }
.tree1 li:first-child::before, .tree1 li:last-child::after{border:none; }
.tree1 li:last-child::before{ border-right: 2px solid #c3c3c3; border-radius: 0 5px 0 0; -webkit-border-radius: 0 5px 0 0; -moz-border-radius: 0 5px 0 0;  }
.tree1 li:first-child::after{ border-radius: 5px 0 0 0; -webkit-border-radius: 5px 0 0 0; -moz-border-radius: 5px 0 0 0;  }
.tree1 ul ul::before{ content: ''; position: absolute; top: 0; left: 50%; border-left: 2px solid #c3c3c3; width: 0; height: 20px; }

.tree1 li a:hover+ul li::after, .tree1 li a:hover+ul li::before, .tree1 li a:hover+ul::before, .tree1 li a:hover+ul ul::before{ border-color: var(--main); }
.tree1 li a div:hover, .tree1 li a:hover+ul li a div { border: 2px solid var(--main); cursor:pointer; }
.tree1 li a div:hover > p:nth-child(1) { background:var(--main); }
.tree1 li a:hover+ul li a div p:nth-child(1) {  background:var(--main); }
.tree1 li a div:hover, .tree1 li a:hover+ul li a div { border: 2px solid var(--main); }