:root {
  --color-main: #3c8dbc;

  --color-btn01 : #3c8dbc;
  --color-btn01--active : #2B6587;
  --color-btn01--active2 : #224358;
  --color-btn02 : #3BAFBA;
  --color-btn02--active : #2A7D84;
  --color-btn03 : #41BA3B;
  --color-btn03--active : #369931;
  --color-btn04 : #bcc0c4;
  --color-btn04--active : #a5a8ab;
  --color-btn05 : #f39c12;
  --color-btn06 : #eafb02;
  --color-btn06--active : #e3f307;
  --color-btn07 : #DD4B39;
  --color-btn07--active : #E74E33;
}

@media (min-width: 992px) {
  .spview {
    display: none!important;
  }
}
@media (max-width: 991px) {
  .pcview {
    display: none!important;
  }
}

.mt4   { margin-top: 4px; }
.mt8   { margin-top: 8px; }
.mt16  { margin-top: 16px; }
.mt24  { margin-top: 24px; }
.mt32  { margin-top: 32px; }
.mt40  { margin-top: 40px; }
.mt48  { margin-top: 48px; }
.mt80  { margin-top: 80px; }
.mt100 { margin-top: 100px; }
.mt120 { margin-top: 120px; }

.mb0 { margin-bottom: 0!important; }



/***********************************
header.blade.php
***********************************/
.adminDesign .main-header .navbar {
  background-color: var(--color-main)!important;
}


.main-header>.navbar {
  height: 50px;
}
.navbar-custom-menu>.navbar-nav>li {
  border-right: 1px solid #ffffff;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.navbar-custom-menu>.navbar-nav>li:last-of-type {
  border: none;
  background: #222d32;
}
.navbar-custom-menu>.navbar-nav>li:last-of-type a:hover {
  background: #222d32!important;
  opacity: 0.8;
}
.navbar-nav>li>a {
  padding: 0 20px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
}
.navbar-custom-menu>.navbar-nav>li:last-of-type a {
  color: #fff!important;
}
.navbar-nav li a i + span {
  margin-left: 3px;
}
.navbar-nav__logo {
  margin-right: 20px;
  font-size: 16px;
  font-weight: 600;
}
.adminDesign .navbar-nav__logo {
  color: #fff;
}
.navbar-nav__tag {
  margin-right: 10px;
  padding: 2px 8px;
  background: #fff;
  color: var(--color-main);
  border-radius: 5px;
  width: fit-content;
  font-weight: 600;
}
@media (max-width: 991px) {
  .navbar-nav__logo-sp {
    margin-left: 5px;
    font-size: 16px;
    font-weight: 600;
  }
}


/***********************************
sidever.blade.php
***********************************/
.sidebar-menu .treeview .fa-angle-left {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  cursor: pointer;
}
.sidebar-menu .treeview.active .fa-angle-left {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.sidebar-menu .treeview-menu>li>a {
  padding: 10px 10px 10px 20px;
}

.skin-blue .sidebar-menu>li>a,
.skin-blue .sidebar-menu>li>a span,
.sidebar-menu .treeview-menu>li>a,
.sidebar-menu .treeview-menu>li>a span {
  cursor: pointer!important;
}


/***********************************
共通
***********************************/
.box, .panel {
  border: 0!important;
  box-shadow: 0 2px 2px rgba(0,0,0,0.1)!important;
  border-radius: 0.7rem!important;
}
.box-header.with-border {
  border-bottom: 2px solid var(--color-main)!important;
}
.box-footer {
  padding-top: 24px;
}

.panel__title {
  margin: 0;
  font-size: 16px;
  color: var(--color-main);
  border-bottom: 2px solid var(--color-main);
  font-weight: 600;
  padding: 15px;
}

.box__title {
  margin: 0 0 16px -10px;
  padding-bottom: 4px;
  padding-left: 16px;
  font-size: 16px;
  color: var(--color-main);
  border-bottom: 2px solid var(--color-main);
  width: calc(100% + 20px);
  font-weight: 600;
  margin-bottom: 16px;
}
.box .box-title {
  padding-top: 4px;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-main);
}
.box-subtitle {
  margin-bottom: 8px;
  padding: 4px 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-main);
}

.panel__subtext {
  margin-top: 8px;
  color: #777777;
  font-size: 12px;
}
.panel__subtext span {
  color: var(--color-main);
}

.table .label, .order__label, .shop__label {
  font-size: 12px;
  padding: 3px 10px;
  font-weight: 600;
}
.order__label {
  margin: 0 4px;
}
.table .label-info, .order__label.label-default {
  background-color: var(--color-btn04)!important;
}
.table .label-success, .shop__label-success {
  background-color: var(--color-btn03)!important;
}
.order__label.label-primary {
  background-color: var(--color-btn01)!important;
}
.table .label-check, .order__label.label-warning {
  background-color: var(--color-btn05)!important;
}

/* -- btn -- */
.btn {
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}
.btn:hover {
  color: #fff!important;
}
.btn i {
  margin-right: 3px;
}

.btn01, .btn-dropbox, .submit, .btn-default {
  background-color: var(--color-btn01);
  border-color: var(--color-btn01);
}
.btn01:hover, .btn01:focus,
.btn-dropbox:hover, .btn-dropbox:focus,
.submit:hover, .submit:focus {
  background-color: var(--color-btn01--active);
}
.btn-dropbox:active, .btn-dropbox.active, .open>.dropdown-toggle.btn-dropbox {
  background-color: var(--color-btn01--active2);
  border-color: var(--color-btn01--active2);
}

.btn02 {
  background-color: var(--color-btn02);
  border-color: var(--color-btn02);
}
.btn02:hover {
  background-color: var(--color-btn02--active);
  border-color: var(--color-btn02--active);
}

.btn03, .btn-success {
  background-color: var(--color-btn03);
  border-color: var(--color-btn03);
}
.btn03:hover, .btn-success:hover {
  background-color: var(--color-btn03--active);
  border-color: var(--color-btn03--active);
}

.btn04, .btn-warning {
  background-color: var(--color-btn04);
  border-color: var(--color-btn04);
}
.btn04:hover, .btn-warning:hover {
  background-color: var(--color-btn04--active);
  border-color: var(--color-btn04--active);
}

.btn06 {
  color: #222d32;
  background-color: var(--color-btn06);
  border-color: var(--color-btn06);
}
.btn06:hover {
  color: #222d32 !important;
  background-color: var(--color-btn06--active);
  border-color: var(--color-btn06--active);
}
.btn07 {
  color: #fff;
  background-color: var(--color-btn07);
  border-color: var(--color-btn07);
}
.btn07:hover {
  color: #fff !important;
  background-color: var(--color-btn07--active);
  border-color: var(--color-btn07--active);
}
/* filter-panel */
.filter-panel {
  padding: 10px;
}
.filter-panel a {
  font-weight: 600;
  color: var(--color-main);
}

.table-responsive {
  padding: 6px 0;
}

/* pagination */
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
  background-color: var(--color-main);
  border-color: var(--color-main);
}

/* 絞り込み検索 */
.box-footer .col-md-8, .btn-flex {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 16px;
}
.box-footer .btn, .submitBtn {
  padding: 5px 20px;
  min-width: 80px;
}

/**/
.form-horizontal .form-group.form-group-m0 {
  margin: 0;
}
.form-group_subtext {
  color: #777777;
  font-size: 12px;
  margin-top: -10px;
}
.form_subtext {
  color: #777777;
  font-size: 12px;
}

.form__attentionBox {
  padding: 8px;
  background: #eee;
}
.form__attentionBox p {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
}
.form__radio {
  padding-top: 7px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.form__radio input, input[type="checkbox"] {
  margin-right: 4px!important;
  display: inline-block;
  cursor: pointer;
}
.form-horizontal.form-horizontal--show .control-label {
  padding-top: 0;
}

.form__datetimepicker {
  background: #fff!important;
}


/* エラー */
.has-error {
  color: #ff4040;
}

/* 表示件数指定 / 検索ボックス */
.dataTables_length, .dataTables_filter {
  margin-top: 8px;
}
.dataTables_length, .dataTables_info {
  padding-left: 10px;
}
.dataTables_filter, .dataTables_paginate {
  padding-right: 10px;
}
.dataTables_length label, .dataTables_filter label {
  margin-bottom: 8px;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: fit-content;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .dataTables_length, .dataTables_filter {
    text-align: right!important;
  }
}

/* table */
.nav-tabs {
  padding: 0 10px;
}
.dataTable {
  border-bottom: 1px solid #f4f4f4;
}

/***********************************
ログイン
***********************************/
.login__shopname {
  margin-bottom: 24px;
  font-size: 24px;
  text-align: center;
  font-weight: 600;
}
.login-box-msg {
  font-size: 18px;
  font-weight: 600;
}

/* パスワードを忘れた場合はこちら */
.modal-header__changePw {
  border-bottom: 2px solid var(--color-main)!important;
  color: var(--color-main);
  font-weight: 600;
}
/***********************************
商品リスト
/product/list.blade.php
***********************************/
div.table-responsive div.dataTables_wrapper>div.row>div[class^="col-"]:last-child {
  padding-right: 0;
}
div.table-responsive div.dataTables_wrapper>div.row>div[class^="col-"]:first-child {
  padding-left: 0;
}
.productList td p {
  margin-bottom: 0;
}

.productList .table tbody tr td:nth-child(2) {
  max-width: 500px;
}

/***********************************
注文詳細
/order/detail.blade.php
***********************************/
.table__order--payment thead th {
  border-bottom: 2px solid #f4f4f4;
  font-weight: 700;
}
.table__order--payment td a:not(.btn) {
  color: var(--color-main);
  font-weight: 700;
}
.cancel-order-title {
  color: white;
}
.close-cancel {
  font-size: 40px !important;
  color: red !important;
  opacity: .7 !important;
}
.cancel-refund {
  background-color: #E3E3E3;
  padding: 20px;
  border-radius: 8px;
}
.lb-refund {
  display: inline-table !important;
  font-weight: 100 !important;
  margin-bottom: 0 !important;
}
.btn-cancel {
  color: #222d32 !important;
}
.btn-cancel:hover {
  color: #222d32 !important;
}

/***********************************
新規店舗登録
/cadmin/aignup.blade.php
***********************************/
.shopregister {
    width: 100%;
    max-width: 500px;
}
@media (max-width: 768px) {
    .shopregister {
        width: 90%;
    }
}
.h-adr .required {
    color: #E00;
}
.h-adr .required:after {
    content: " *";
}

.h-adr h4 {
    border-left:5px solid #3c8dbc;
    font-weight: bold;
    padding:2px 6px;
}
.h-adr h4:nth-of-type(n+2) {
    margin-top: 40px;
}
.h-adr h5 {
    margin-top: 28px;
    font-weight: bold;
    margin-bottom: 4px;
    font-size: 16px;
}

.h-adr .has-feedback + .p-small {
    margin-top: -8px;
}


.h-adr .about-text {
    margin-bottom: 16px;
    padding: 12px;
    background-color: #eee;
    font-size: 13px;
}
.h-adr .about-text > p {
    margin-bottom: 0;
}

.h-adr .inner-text-word {
    color: #E00;
}

.h-adr .p-small {
    font-size: 11px;
}

.h-adr .password-form {
    width: 70%;
}

.h-adr--radio {
    display: flex;
    flex-direction: row;
    gap: 12px;
}
.h-adr--radio > label {
    display: flex;
    align-items: center;
    gap: 4px;
}
.h-adr--radio > label input {
    margin-top: 0;
    cursor: pointer;
}

.h-adr .checkbox {
    margin-right: 4px;
    cursor: pointer;
}

.h-adr--last {
    border-top: 1px solid #3c8dbc;
    margin-top: 24px;
    padding-top: 24px;
    font-size: 14px;
}
.h-adr#sub-content {
    margin-top: 16px;
}

.order_status_cancel td{
  text-decoration:line-through;
}

.order_status_close{
  background-color:#ccc;
}

.sign_up_regist_loading{
  text-align:center;
  display:none;
}

.product_regist_loading{
  text-align:center;
  display:none;
}

#add_option_btn {
  background-color: #3C8DBC !important;
}

.add_tag_area{
  display: flex;
  margin-top:10px
}

.print_disabled {
  background-color: #838b83;
  border-color: #838b83;
  pointer-events: none;
}

.dropdown-product {
  pointer-events: none;
}

.dropdown-prod-link {
  color: #004299 !important;
}

[aria-current="product"] {
  cursor: default;
  text-decoration: none;
  color:#333;
}

.disabled-dropdown {
  pointer-events: none;
  opacity: 0;
}

#product_media_list th {
  text-align:center;
}
#product_media_list td:nth-child(1) {
  width:3%;
  text-align:center;
}
#product_media_list td:nth-child(2) {
  width:10%;
}
#product_media_list td:nth-child(3) {
  width:32%;
}
#product_media_list td:nth-child(4) {
  width:15%;
}
#product_media_list td:nth-child(5) {
  width:15%;
}
#product_media_list td:nth-child(6) {
  width:15%;
}
#product_media_list td:nth-child(7) {
  width:10%;
}

#productListDatatable th {
  text-align:center;
}
#productListDatatable td:nth-child(1) {
  width:3%;
  text-align:center;
}
#productListDatatable td:nth-child(2) {
  width:10%;
}
#productListDatatable td:nth-child(3) {
  width:35%;
}
#productListDatatable td:nth-child(4) {
  width:8%;
}
#productListDatatable td:nth-child(5) {
  width:8%;
}
#productListDatatable td:nth-child(6) {
  width:15%;
}
#productListDatatable td:nth-child(7) {
  width:15%;
}
#productListDatatable td:nth-child(8) {
  width:6%;
}

#table-order .dataTable th{
  text-align:center;
}
#table-order .dataTable td:nth-child(1) {
  width:3%;
  text-align:center;
}
#table-order .dataTable td:nth-child(2) {
  width:7%;
}
#table-order .dataTable td:nth-child(3) {
  width:10%;
}
#table-order .dataTable td:nth-child(4) {
  width:14%;
}
#table-order .dataTable td:nth-child(5) {
  width:14%;
}
#table-order .dataTable td:nth-child(6) {
  width:14%;
}
#table-order .dataTable td:nth-child(7) {
  width:14%;
}
#table-order .dataTable td:nth-child(8) {
  width:14%;
}
#table-order .dataTable td:nth-child(9) {
  width:10%;
}

iframe {
  border: 1px solid #ccc;
  width: 100%;
  min-height: 300px;
  resize: vertical;
  overflow: auto;
  box-sizing: border-box;
}