.b-btn {
    display: inline-flex;
    align-items:center;
    justify-content:center;
    flex-direction: row;
    padding: 0 20px;
    margin: 0;
    height: 40px;
    line-height: 38px;
    font-size: 16px;
    text-align: center;
    background-color: transparent;
    border-color:var(--border-light-color);
    border-width: 1px;
    border-style: solid;
    color: var(--text-sub-color);
    border-radius: 5px !important;
    vertical-align: middle;
}
.b-btn.icon {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    padding:0;   
    border:0;
    width:20px;
    height:20px;
}
.b-btn.icon .svg-icon {
    width:100%;
    height:100%;
    margin:0;
}
.b-btn.icon.right {right:10px; }
.b-btn.text {
    display:inline-block;
    border:0;
    padding:0;
    line-height:1.5;
    height:auto;
}
.b-btn.text.small {font-size:14px;}
.b-btn.link {
    display:inline-block;
    border:0;
    padding:0;
    line-height:1.5;
    height:auto;
}
.b-btn.link .svg-icon {
    display:inline-block;
    vertical-align:middle;
}
.b-btn .svg-icon {
    width:20px;
    height:20px;
}
.b-btn.small {
    height:35px;
    line-height:35px;
    font-size:14px;
    padding:0 10px;
}
.b-btn.xs-small {
    height:25px;
    line-height:25px;
    font-size:12px;
    padding:0 10px;
}
.b-btn.xs-small .svg-icon {
    width:14px;
    height:14px;
}
.b-btn.small .svg-icon {
    width:16px;
    height:16px;
}
.b-btn.xs {
    height: 30px;
    line-height: 30px;
}
.b-btn.pd1 {
    padding: 0 10px;
}
.b-btn.round {
    border-radius: 50px !important;
}

.b-btn.light2 {
    background-color: transparent;
    border-color: #4d4d4d;
    color: #fff;
}
.b-btn.cy {
    background-color: #02a8c6;
    border-color: #02a8c6;
    color: #fff;
}
.b-btn.primary {
    background-color: var(--primary-btn-color);
    border-color: var(--primary-btn-color);
    color: #fff;
}
.b-btn .svg-icon {margin:0 3px;}
.b-btn.primary .svg-icon {background-color:#fff;}
.b-btn.tertiary {
    background-color:transparent;
    border-color: var(--tertiary-border-color);
    color:var(--tertiary-text-color);
}
.b-btn.secondary {
    background-color:var(--secondary-background-color);
    border-color: var(--secondary-border-color);
    color: var(--text-basic-color);
}
.b-btn.danger-light {
    background-color:transparent;
    border-color: var(--color-2-border-danger);
    color:var(--color-2-border-danger);
}
.b-btn.danger-border {
    background-color:var(--color--textbox);
    border-color: var(--color-2-border-danger);
    color:var(--color-2-border-danger);
}
.b-btn.danger {
    background-color:var(--color-2-border-danger);
    border-color: var(--color-2-border-danger);
    color:#fff;
}

.b-btn.danger-light .svg-icon {
    background-color:var(--color-2-border-danger)
}

.b-btn.warning-light {
    background-color:transparent;
    border-color: var(--color-2-border-warning);
    color:var(--color-2-border-warning);
}


.b-btn.warning-light .svg-icon {
    background-color:var(--color-2-border-warning)
}
.b-btn i[class^="fa"] {
    margin-right:3px;
    margin-left:3px;
}
.b-btn.no-good.active i {
    color: var(--color-2-border-danger);
}

.b-btn.good.active i {
    color: var(--color-2-border-danger);
}
.bo_btns {
    display:flex;
    align-items:flex-start;
}
.bo_btns .b-btn + .b-btn {
    margin-left:5px;
}


.b-top-btn-box {
  margin-bottom: 20px;
  text-align: right;
}

.b-btn-box {
  position: relative;
  width: 100%;
  margin-top: 30px;
  text-align: center;
}

.b-btn-box.align--right {
  text-align: right;
}

.b-btn-box-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-end;
}

.b-btn-box-list li {
  padding: 5px;
}

.b-btn-box-list li:last-child {
  padding-right: 0;
}

.b-btn-box-list .b-btn {
  padding: 0 16px;
}

.b-btn.b-btn-tel {
  margin-left: 10px;
}

.btn-heart:hover,
.btn-heart.active {
  color: #f2391f;
}

.btn-group, .btn-group-vertical {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
}

.btn-group.grid-2 {
    width:100%;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:5px;
}
.btn-group.absolute-right {
    position:absolute;
    top:50%;
    right:10px;
    transform:translateY(-50%);
    display:flex;
    gap:5px;
}
.input-with-btn {
    position:relative;
}