@charset "utf-8";

.tel-code[data-v-2b6a07cc] { display: flex; width: 100%; -webkit-box-align: center; align-items: center; position: relative; }

.tel-code.tel-code-cn .code[data-v-2b6a07cc] { min-width: auto; -webkit-box-flex: 0; flex: 0 0 50px; padding: 0px 4px; text-align: center; }

.tel-code.tel-code-cn .code .code-label[data-v-2b6a07cc] { margin-right: 0px; }

.tel-code.active .code .iconfont[data-v-2b6a07cc] { color: rgb(25, 25, 26); transform: rotateX(180deg); }

.tel-code .code[data-v-2b6a07cc] { display: flex; -webkit-box-align: center; align-items: center; background: rgb(247, 247, 247); border-width: 1px 0px 1px 1px; border-top-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(229, 229, 229); border-bottom-color: rgb(229, 229, 229); border-left-color: rgb(229, 229, 229); border-image: initial; border-radius: 4px 0px 0px 4px; border-right-style: initial; border-right-color: initial; cursor: pointer; height: 42px; padding: 0px 16px; flex-shrink: 0; }

.tel-code .code .code-label[data-v-2b6a07cc] { color: rgb(25, 25, 26); font-size: 13px; line-height: 20px; -webkit-box-flex: 1; flex: 1 1 0%; margin-right: 8px; }

.tel-code .code.is_new[data-v-2b6a07cc] { background: rgb(246, 246, 248); border: 1px solid transparent !important; }

.tel-code .code .iconfont[data-v-2b6a07cc] { color: rgb(112, 112, 112); font-size: 16px; line-height: 24px; transition: 0.3s; }

.tel-code .code_error[data-v-2b6a07cc] { border-right: none; }

.tel-code .tel[data-v-2b6a07cc] { -webkit-box-flex: 1; border-radius: 0px 3px 3px 0px; flex: 1 1 auto; user-select: text; }

.tel-code .content_div[data-v-2b6a07cc] { background-color: rgb(255, 255, 255); border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 8px 0px; left: 0px; position: absolute; right: 0px; top: 50px; transition: 0.2s ease-out; z-index: 10; }

.tel-code .content_div.top-position[data-v-2b6a07cc] { bottom: 50px; position: absolute; top: inherit; transform-origin: center bottom; z-index: 999; }

.tel-code .menu[data-v-2b6a07cc] { max-height: 290px; overflow-y: auto; }

.tel-code .menu[data-v-2b6a07cc]::-webkit-scrollbar { background: linear-gradient(rgba(252, 252, 252, 0), rgb(247, 247, 247) 10%); border-image: linear-gradient(rgba(247, 247, 247, 0), rgb(239, 239, 239) 10%) 1 / 1 / 0 stretch; border-left: 1px solid; box-sizing: border-box; width: 10px; }

.tel-code .menu[data-v-2b6a07cc]::-webkit-scrollbar-thumb { background: content-box rgb(222, 224, 227); border: 2px solid transparent; border-radius: 4px; width: 6px; }

.tel-code .menu .search-input[data-v-2b6a07cc] { padding: 12px 12px 0px; position: relative; }

.tel-code .menu .search-input .clear[data-v-2b6a07cc], .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc] { color: rgb(112, 112, 112); cursor: pointer; display: flex; height: 28px; position: absolute; right: 19px; top: calc(50% + 6px); transform: translateY(-50%); width: 28px; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; font-size: 16px; }

.tel-code .menu .search-input .clear[data-v-2b6a07cc]:hover, .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc]:hover { background: rgba(25, 25, 26, 0.04); border-radius: 3px; color: rgb(25, 25, 26); }

@media (max-width: 768px) {
  .tel-code .menu .search-input .clear[data-v-2b6a07cc], .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc] { height: 40px; padding: 13px 12px; right: 13px; width: 40px; }
  .tel-code .menu .search-input .clear[data-v-2b6a07cc]:hover, .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc]:hover { background: none; border-radius: 0px; }
}

@media (min-width: 1025px) {
  .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc] { display: none; }
}

@media (max-width: 1024px) {
  .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc] { color: rgb(112, 112, 112); font-size: 16px; }
  .tel-code .menu .search-input .searchIcon[data-v-2b6a07cc]:hover { color: rgb(25, 25, 26); }
}

.tel-code .menu .search-input .clear[data-v-2b6a07cc] { font-size: 14px; }

.tel-code .menu .search-input .clear[data-v-2b6a07cc]:hover { color: rgb(25, 25, 26); }

.tel-code .menu .menu-list[data-v-2b6a07cc] { margin: 8px 0px; overflow-y: auto; }

.tel-code .menu .menu-list li[data-v-2b6a07cc] { color: rgb(25, 25, 26); cursor: pointer; display: flex; font-size: 13px; line-height: 20px; padding: 8px 12px; transition: 0.3s; }

.tel-code .menu .menu-list li[data-v-2b6a07cc]:hover { background-color: rgb(246, 246, 248); }

.tel-code .menu .menu-list li[data-v-2b6a07cc] a:focus-visible { border-radius: 3px; outline: rgb(0, 128, 255) solid 2px; outline-offset: -2px; }